@openrig/cli 0.5.7 → 0.5.9

package/tui/dist/render.js

@@ -7,6 +7,7 @@
 import { computeExplorerRows, findAgent, findSpec, findAgentBySession, agentsRunningSpec, agentsRunningSpecTargets, specDetailArrowsScroll } from "./state.js";
 import { filterPalette } from "./commands/palette.js";
 import { scopesContentLines } from "./scopes/scopes-model.js";
+import { executionContentLines, executionSliceStripLines } from "./execution/execution-model.js";
 import { COMMAND_REGISTRY } from "./commands/registry.js";
 import { navigatorDisplay } from "./navigator.js";
 import { renderGraphStyle } from "./topology/render-graph.js";
@@ -16,8 +17,8 @@ import { renderCrashCartView, renderUnverifiedView, renderRestoreLifecycleView,
 import { buildLedgerExplorer } from "./crash-cart/ledger-explorer.js";
 import { runtimeMarkSegs } from "./topology/runtime-marks.js";
 import { barCells, flashActive, reducedMotion, spinnerFrame } from "./motion.js";
+import { explorerWidth, MOTION_FRAME_MS } from "./visual-layout.js";
 import { detailPage, fieldLine, sectionRule, listItem, alignedRow, LABEL_W } from "./detail.js";
-const EXPL_W = 30;
 function pad(text, width) {
     const t = String(text ?? "");
     if (t.length <= width)
@@ -31,43 +32,285 @@ function padLeft(text, width) {
         return " ".repeat(width - t.length) + t;
     return t.slice(0, Math.max(width - 1, 0)) + "…";
 }
-const FULL_AGENT_COLS = [
-    ["rig", "RIG", 18, "left"],
-    ["pod", "POD", 8, "left"],
-    ["agent", "AGENT", 16, "left"],
-    ["runtime", "RUNTIME", 13, "left"],
-    ["context", "CTX%", 4, "right"],
-    ["tokens", "TOKENS", 7, "right"],
-    ["status", "STATUS", 17, "left"],
-    ["actions", "ACTIONS", 14, "left"],
-];
 function columnsWidth(columns) {
     return columns.reduce((total, [, , width]) => total + width + 1, -1);
 }
 function agentColumns(contentWidth) {
-    if (columnsWidth(FULL_AGENT_COLS) <= contentWidth)
-        return FULL_AGENT_COLS;
-    // At the 120-column fallback the content pane is 88 cells. Preserve the
-    // operable identity/status/action path; telemetry cells yield first.
-    const compactRest = [
-        ["pod", "POD", 8, "left"],
-        ["agent", "AGENT", 16, "left"],
-        ["runtime", "RUNTIME", 13, "left"],
-        ["status", "STATUS", 17, "left"],
-        ["actions", "ACTIONS", 14, "left"],
+    if (contentWidth >= 110)
+        return [
+            ["pod", "POD", 8, "left"], ["seat", "SEAT", 15, "left"], ["runtime", "RT", 4, "left"],
+            ["model", "MODEL", 12, "left"], ["context", "CTX", 8, "right"], ["status", "STATE", 11, "left"],
+            ["queue", "Q", 3, "right"], ["work", "WORK", 15, "left"], ["now", "NOW", 27, "left"],
+            ["actions", "ACTIONS", 14, "left"],
+        ];
+    if (contentWidth >= 88)
+        return [
+            ["pod", "POD", 6, "left"], ["seat", "SEAT", 12, "left"], ["runtime", "RT", 3, "left"],
+            ["model", "MODEL", 8, "left"], ["context", "CTX", 6, "right"], ["status", "STATE", 9, "left"],
+            ["queue", "Q", 2, "right"], ["work", "WORK", 8, "left"], ["now", "NOW", 11, "left"],
+            ["actions", "ACTIONS", 14, "left"],
+        ];
+    // At 84x28 the L2 content pane is 58 cells. The three explicitly deferred
+    // columns (MODEL/NOW/ACTIONS) move to drill; identity, state and work remain.
+    const fixed = 6 + 12 + 3 + 5 + 9 + 2 + 6; // widths + separators, excluding WORK
+    return [
+        ["pod", "POD", 6, "left"], ["seat", "SEAT", 12, "left"], ["runtime", "RT", 3, "left"],
+        ["context", "CTX", 5, "right"], ["status", "STATE", 9, "left"], ["queue", "Q", 2, "right"],
+        ["work", "WORK", Math.max(4, contentWidth - fixed), "left"],
+    ];
+}
+function instanceAgentColumns(contentWidth) {
+    if (contentWidth >= 110)
+        return [
+            ["rig", "RIG", 13, "left"], ["pod", "POD", 8, "left"], ["seat", "SEAT", 14, "left"],
+            ["runtime", "RT", 3, "left"], ["context", "CTX", 7, "right"], ["status", "STATE", 10, "left"],
+            ["queue", "Q", 2, "right"], ["work", "WORK", 12, "left"], ["now", "NOW", Math.max(18, contentWidth - 78), "left"],
+        ];
+    if (contentWidth >= 78)
+        return [
+            ["rig", "RIG", 10, "left"], ["pod", "POD", 6, "left"], ["seat", "SEAT", 12, "left"],
+            ["runtime", "RT", 3, "left"], ["context", "CTX", 5, "right"], ["status", "STATE", 9, "left"],
+            ["queue", "Q", 2, "right"], ["work", "WORK", Math.max(8, contentWidth - 54), "left"],
+        ];
+    const fixed = 8 + 5 + 11 + 2 + 5 + 8 + 2 + 7;
+    return [
+        ["rig", "RIG", 8, "left"], ["pod", "POD", 5, "left"], ["seat", "SEAT", 11, "left"],
+        ["runtime", "RT", 2, "left"], ["context", "CTX", 5, "right"], ["status", "STATE", 8, "left"],
+        ["queue", "Q", 2, "right"], ["work", "WORK", Math.max(4, contentWidth - fixed), "left"],
     ];
-    const rigWidth = Math.max(6, Math.min(18, contentWidth - columnsWidth(compactRest) - 1));
-    return [["rig", "RIG", rigWidth, "left"], ...compactRest];
 }
 function tableRow(columns, cells) {
     return columns.map(([key, , width, align]) => align === "right" ? padLeft(cells[key], width) : pad(cells[key], width)).join(" ");
 }
+function runtimeShort(runtime) {
+    if (/claude/i.test(runtime))
+        return "cl";
+    if (/codex/i.test(runtime))
+        return "cx";
+    if (/terminal/i.test(runtime))
+        return ">_";
+    if (/human/i.test(runtime))
+        return "hu";
+    return runtime.slice(0, 2) || "—";
+}
+/** Tables optimize for glance width; details retain the canonical model id. */
+function tableModel(model) {
+    return model?.replace(/^claude-/i, "") || "—";
+}
+function contextCompact(value, narrow) {
+    if (value == null)
+        return "—";
+    if (narrow)
+        return `${value}%`;
+    const filled = Math.max(0, Math.min(3, Math.round(value / 33.4)));
+    return `${value}%${"▪".repeat(filled)}${"▫".repeat(3 - filled)}`;
+}
+function seatName(pod, name) {
+    for (const prefix of [`${pod}.`, `${pod}-`])
+        if (name.startsWith(prefix))
+            return name.slice(prefix.length);
+    return name;
+}
+function operationalState(status, motion) {
+    const key = status.toLowerCase().replaceAll("_", "-");
+    if (key === "active" || key === "working" || key === "running") {
+        if (!motion.reduced)
+            motion.used = true;
+        return { mark: motion.reduced ? "●" : motion.frame, word: "working" };
+    }
+    if (key === "attention-required" || key === "needs-attention" || key === "needs-input")
+        return { mark: "◐", word: "needs you" };
+    if (key === "blocked")
+        return { mark: "⚑", word: "blocked" };
+    if (key === "failed" || key === "down")
+        return { mark: "✕", word: "failed" };
+    if (key === "idle")
+        return { mark: "·", word: "idle" };
+    if (key === "detached" || key === "stopped")
+        return { mark: "○", word: "detached" };
+    return { mark: "?", word: "unknown" };
+}
+function queueFacts(snap, session) {
+    if (!session)
+        return { count: 0, work: "—", now: "—" };
+    const sources = [
+        ["needs you", snap.attention], ["blocked", snap.blocked], ["working", snap.inProgress], ["queued", snap.pending],
+    ];
+    const rows = [];
+    const seen = new Set();
+    for (const [role, items] of sources)
+        for (const row of items) {
+            if (row.destinationSession !== session || seen.has(row.qitemId))
+                continue;
+            seen.add(row.qitemId);
+            rows.push({ role, row });
+        }
+    const primary = rows[0];
+    if (!primary)
+        return { count: 0, work: "—", now: "—" };
+    const slice = primary.row.tags?.find((tag) => tag.startsWith("slice:"))?.slice("slice:".length);
+    const work = slice?.match(/^OPR(?:\.\d+){3}\.(\d+)$/)?.[1]
+        ? `S${slice.slice(slice.lastIndexOf(".") + 1)}`
+        : slice ?? "—";
+    const summary = primary.row.summary?.trim() || primary.row.body.split("\n").find((line) => line.trim())?.trim() || primary.row.qitemId;
+    const now = primary.role === "working" ? summary : `${primary.role} · ${summary}`;
+    return { count: rows.length, work, now };
+}
+function number(value) {
+    return value == null ? "—" : value.toLocaleString("en-US");
+}
+function wrapDetailValue(label, value, width) {
+    const prefix = `  ${`${label}:`.padEnd(LABEL_W)} `;
+    const continuation = " ".repeat(prefix.length);
+    const room = Math.max(8, width - prefix.length);
+    const words = value.trim().split(/\s+/).filter(Boolean);
+    const chunks = [];
+    let line = "";
+    for (const raw of words) {
+        let word = raw;
+        while (word.length > room) {
+            if (line) {
+                chunks.push(line);
+                line = "";
+            }
+            chunks.push(word.slice(0, room));
+            word = word.slice(room);
+        }
+        if (!word)
+            continue;
+        if (!line)
+            line = word;
+        else if (line.length + word.length + 1 <= room)
+            line += ` ${word}`;
+        else {
+            chunks.push(line);
+            line = word;
+        }
+    }
+    if (line)
+        chunks.push(line);
+    return (chunks.length ? chunks : [""]).map((chunk, index) => ({ text: `${index === 0 ? prefix : continuation}${chunk}` }));
+}
+function rowsForAgent(snap, session, sources) {
+    const rows = [];
+    const seen = new Set();
+    for (const source of sources)
+        for (const row of source) {
+            if (row.destinationSession !== session || seen.has(row.qitemId))
+                continue;
+            seen.add(row.qitemId);
+            rows.push(row);
+        }
+    return rows;
+}
+function workRows(rows, width) {
+    if (rows.length === 0)
+        return [fieldLine({ label: "rows", value: "none in the served bounded lists" })];
+    return rows.flatMap((row) => {
+        const summary = row.summary?.trim() || row.body.split("\n").find((line) => line.trim())?.trim() || "no summary served";
+        return [
+            ...wrapDetailValue("qitem", `${row.qitemId} · ${row.state}`, width),
+            ...wrapDetailValue("work", summary, width),
+            ...(row.blockedOn ? wrapDetailValue("blocker", `blocked on ${row.blockedOn}`, width) : []),
+        ];
+    });
+}
+function agentDetailLines(snap, found, contentWidth) {
+    const { agent, rig, pod } = found;
+    const session = agent.session;
+    const specInLibrary = !!agent.spec && !!findSpec(snap, agent.spec);
+    const currentRows = session ? rowsForAgent(snap, session, [snap.attention, snap.blocked, snap.inProgress]) : [];
+    const pendingRows = session ? rowsForAgent(snap, session, [snap.pending]) : [];
+    const recentRows = session ? rowsForAgent(snap, session, [snap.recentlyFinished]) : [];
+    const needs = session ? snap.needs.filter((item) => item.target === session) : [];
+    const visibleAssigned = currentRows.length + pendingRows.length;
+    const assigned = agent.assignedWorkCount ?? visibleAssigned;
+    const pending = agent.pendingWorkCount ?? pendingRows.length;
+    const inProgress = agent.inProgressWorkCount ?? currentRows.filter((row) => row.state === "in-progress").length;
+    const blocked = agent.blockedWorkCount ?? currentRows.filter((row) => row.state === "blocked").length;
+    const context = agent.context;
+    const meterWidth = Math.max(10, Math.min(36, contentWidth - 24));
+    const rtName = agent.runtime ?? "unknown";
+    const rtSegs = [
+        { text: "  " },
+        { text: "runtime:", token: "dim" },
+        { text: " ".repeat(LABEL_W - "runtime:".length + 1) },
+        { text: rtName },
+        { text: "  " },
+        ...runtimeMarkSegs(agent.runtime),
+    ];
+    const runtimeLine = { text: rtSegs.map((segment) => segment.text).join(""), segs: rtSegs };
+    const activityReason = agent.activity?.needsInput?.reason ?? agent.activity?.signalReason ?? null;
+    const needsRows = needs.length > 0
+        ? needs.flatMap((item) => [
+            ...wrapDetailValue("qitem", item.qitemId ?? "no actionable qitem id served", contentWidth),
+            ...wrapDetailValue("reason", item.detail, contentWidth),
+            ...(item.unblocks ? wrapDetailValue("action", `unblocks ${item.unblocks}`, contentWidth) : []),
+            ...(item.evidenceRef ? wrapDetailValue("evidence", item.evidenceRef, contentWidth) : []),
+        ])
+        : agent.activity?.needsInput && agent.activity.needsInput.count > 0
+            ? wrapDetailValue("reason", agent.activity.needsInput.reason ?? "input required; no reason served", contentWidth)
+            : [fieldLine({ label: "state", value: "none on the served projections" })];
+    return [
+        ...detailPage({ text: `agent ${agent.name} · ${agent.status}` }, [
+            {
+                title: `CONTEXT · ${context == null ? "unknown" : `${context}%`}`,
+                lines: [
+                    fieldLine({ label: "meter", value: context == null ? "— (not yet known)" : `${context}% used  ${barCells(context / 100, meterWidth)}` }),
+                    fieldLine({ label: "tokens", value: `${number(agent.totalInputTokens)} input · ${number(agent.totalOutputTokens)} output · ${number(agent.contextWindowSize)} window` }),
+                    runtimeLine,
+                    ...(agent.attach ? [fieldLine({ label: "attach", value: agent.attach })] : []),
+                    fieldLine({ label: "terminal", value: `term ▸ pod ${pod.name}`, link: { type: "act", act: "open-terminal", view: `pod:${rig.name}/${pod.name}` } }),
+                ],
+            },
+            {
+                title: "CURRENT ACTIVITY",
+                fields: [
+                    { label: "activity", value: agent.activity?.activity ?? agent.status },
+                    ...(activityReason ? [{ label: "reason", value: activityReason }] : []),
+                    ...(agent.activity?.decidedBy ? [{ label: "decided by", value: agent.activity.decidedBy }] : []),
+                    ...(agent.activity?.signalSource || agent.activity?.signalReason ? [{ label: "signal", value: `${agent.activity.signalSource ?? "unknown"} · ${agent.activity.signalReason ?? "no reason"}` }] : []),
+                    ...(agent.activity?.eventAt ? [{ label: "changed", value: agent.activity.eventAt }] : []),
+                ],
+            },
+            { title: `CURRENT WORK · ${currentRows.length}`, lines: workRows(currentRows, contentWidth) },
+            {
+                title: "QUEUE",
+                lines: [
+                    ...wrapDetailValue("depth", `${assigned} assigned · ${pending} pending · ${inProgress} in progress · ${blocked} blocked`, contentWidth),
+                    ...(agent.assignedWorkCount == null ? wrapDetailValue("basis", `${visibleAssigned} rows visible in bounded list reads; complete count not served`, contentWidth) : []),
+                ],
+            },
+            { title: `UP NEXT · ${pending}`, lines: workRows(pendingRows, contentWidth) },
+            { title: `NEEDS YOU · ${needs.length || agent.activity?.needsInput?.count || 0}`, lines: needsRows },
+            ...(recentRows.length ? [{ title: "RECENTLY FINISHED · bounded window", lines: workRows(recentRows, contentWidth) }] : []),
+            {
+                title: "SEAT",
+                fields: [
+                    { label: "host", value: found.host.name },
+                    { label: "rig", value: rig.name },
+                    { label: "pod", value: pod.name },
+                ],
+                lines: [
+                    fieldLine({ label: "cwd", value: agent.cwd ?? "— (not served)" }),
+                ],
+            },
+            {
+                title: "SPEC",
+                fields: [specInLibrary
+                        ? { label: "spec", value: agent.spec, link: { type: "cross", kind: "spec-of", name: agent.name, target: { host: found.host.name, rig: rig.name, pod: pod.name } } }
+                        : { label: "spec", value: agent.spec ? `${agent.spec}  (not in library)` : "—" }],
+            },
+        ]),
+    ];
+}
 function tabsLine(state, suffix) {
-    // slice-17: three tabs, each its own click zone (the first zone starts at
+    // S12: four tabs, each its own click zone (the first zone starts at
     // content col 0, preserving the focus-marker floor); `tab graph` = the
     // topology graph view (frame-01 hatchet mainline)
     const labels = [
         ["table", state.viewTab === "table" ? "[ TABLE ]" : "  TABLE  "],
+        ["recent", state.viewTab === "recent" ? "[ RECENT ]" : "  RECENT  "],
         ["overview", state.viewTab === "overview" ? "[ OVERVIEW ]" : "  OVERVIEW  "],
         ["graph", state.viewTab === "graph" ? "[ GRAPH ]" : "  GRAPH  "],
     ];
@@ -80,6 +323,100 @@ function tabsLine(state, suffix) {
     }
     return [{ text, zones }];
 }
+function localClock(iso) {
+    const date = new Date(iso);
+    if (Number.isNaN(date.getTime()))
+        return "??:??";
+    return `${String(date.getHours()).padStart(2, "0")}:${String(date.getMinutes()).padStart(2, "0")}`;
+}
+function queueRows(snap) {
+    return [...snap.attention, ...snap.blocked, ...snap.inProgress, ...snap.pending, ...snap.recentlyFinished];
+}
+function recentWorkText(snap, row) {
+    const qitem = queueRows(snap).find((candidate) => candidate.qitemId === row.qitemId);
+    const work = qitem?.summary?.trim() || qitem?.body.split("\n").find((line) => line.trim())?.trim();
+    return row.summary?.trim() || work || "no work served";
+}
+function agentDrillForSession(snap, session) {
+    const found = findAgentBySession(snap, session);
+    return found
+        ? { type: "drill", resource: "agent", name: found.agent.name, target: { host: found.host.name, rig: found.rig.name, pod: found.pod.name } }
+        : undefined;
+}
+function recentTargetAction(snap, row) {
+    if (row.targetKind === "mission") {
+        if (snap.scopes?.some((mission) => mission.mission === row.target))
+            return { type: "scopes-mission-open", mission: row.target };
+    }
+    if (row.targetKind === "slice") {
+        for (const mission of snap.scopes ?? []) {
+            const slice = mission.slices.find((candidate) => candidate.id === row.target || candidate.dirName === row.target);
+            if (slice)
+                return { type: "scopes-open", mission: mission.mission, slice: slice.dirName };
+        }
+    }
+    const qitem = queueRows(snap).find((candidate) => candidate.qitemId === row.qitemId || candidate.qitemId === row.target);
+    return (qitem ? agentDrillForSession(snap, qitem.destinationSession) : undefined)
+        ?? agentDrillForSession(snap, row.actorSession)
+        ?? (row.rig && snap.hosts.some((host) => host.rigs.some((rig) => rig.name === row.rig))
+            ? { type: "drill", resource: "rig", name: row.rig }
+            : undefined);
+}
+function recentScopeMatches(snap, scope) {
+    const served = snap.recentTransitionsScope
+        ?? (snap.recentTransitionsRig ? { kind: "rig", rig: snap.recentTransitionsRig } : null);
+    if (!served || served.kind !== scope.kind)
+        return false;
+    return scope.kind === "instance" || (served.kind === "rig" && served.rig === scope.rig);
+}
+function recentLines(snap, scope, width, expanded) {
+    if (!recentScopeMatches(snap, scope) || snap.recentTransitions == null)
+        return [];
+    const timeW = 5;
+    const rows = expanded ? snap.recentTransitions : snap.recentTransitions.slice(-5);
+    const lines = [
+        ...(expanded ? [] : [{ text: "" }]),
+        sectionRule(`RECENT · ${scope.kind === "instance" ? "instance" : `rig ${scope.rig}`} · material queue transitions · newest last`, width),
+    ];
+    if (rows.length === 0)
+        return [...lines, { text: "  No recorded transitions in the current window." }];
+    if (width < 78) {
+        const rigW = scope.kind === "instance" ? 9 : 0;
+        const changeW = Math.max(16, width - timeW - rigW - 2);
+        lines.push({ text: alignedRow([["TIME", timeW], ...(rigW ? [["RIG", rigW]] : []), ["CHANGE", changeW]]) });
+        for (const row of rows) {
+            const action = recentTargetAction(snap, row);
+            lines.push({
+                text: alignedRow([[localClock(row.ts), timeW], ...(rigW ? [[pad(row.rig ?? "?", rigW), rigW]] : []), [pad(row.change, changeW), changeW]]).slice(0, width),
+                ...(action ? { action } : {}),
+            });
+            lines.push({ text: `      ${pad(row.actorSession, Math.max(8, width - 8))}`.slice(0, width), ...(action ? { action } : {}) });
+            lines.push({ text: `      → ${row.target}`.slice(0, width), ...(action ? { action } : {}) });
+            lines.push(...wrapDetailValue("work", recentWorkText(snap, row), width)
+                .map((line) => ({ ...line, ...(action ? { action } : {}) })));
+        }
+        return lines;
+    }
+    const rigW = scope.kind === "instance" ? Math.min(16, Math.max(9, Math.floor(width * 0.13))) : 0;
+    const actorW = Math.min(26, Math.max(16, Math.floor(width * 0.21)));
+    const changeW = Math.min(36, Math.max(20, Math.floor(width * 0.28)));
+    const targetW = Math.max(10, width - timeW - rigW - actorW - changeW - (scope.kind === "instance" ? 4 : 3));
+    lines.push({ text: alignedRow([["TIME", timeW], ...(scope.kind === "instance" ? [["RIG", rigW]] : []), ["ACTOR", actorW], ["CHANGE", changeW], ["TARGET", targetW]]) });
+    for (const row of rows) {
+        const action = recentTargetAction(snap, row);
+        const text = alignedRow([
+            [localClock(row.ts), timeW],
+            ...(scope.kind === "instance" ? [[pad(row.rig ?? "?", rigW), rigW]] : []),
+            [pad(row.actorSession, actorW), actorW],
+            [pad(row.change, changeW), changeW],
+            [pad(row.target, targetW), targetW],
+        ]).slice(0, width);
+        lines.push({ text, ...(action ? { action } : {}) });
+        lines.push(...wrapDetailValue("work", recentWorkText(snap, row), width)
+            .map((line) => ({ ...line, ...(action ? { action } : {}) })));
+    }
+    return lines;
+}
 function specTabsLine(state, name) {
     const active = state.viewTab === "topology" || state.viewTab === "yaml" ? state.viewTab : "configuration";
     const labels = ["topology", "configuration", "yaml"];
@@ -156,6 +493,124 @@ function fieldWrapped(label, values) {
     const first = wrapped[0].text.slice(valueCol);
     return [fieldLine({ label, value: first }), ...wrapped.slice(1)];
 }
+function instanceContentLines(state, snap, host, contentWidth, motion) {
+    const lines = tabsLine(state, `instance ${host.name}`);
+    const scope = { kind: "instance" };
+    if (state.viewTab === "recent") {
+        const recent = recentLines(snap, scope, contentWidth, true);
+        return recent.length > 0
+            ? [...lines, ...recent]
+            : [...lines, { text: "" }, { text: motion.loading ? `${motion.frame} instance RECENT read pending` : "(instance RECENT window not served)" }];
+    }
+    if (state.viewTab === "overview") {
+        return [
+            ...lines,
+            ...detailPage({ text: `instance ${host.name}` }, [
+                {
+                    title: "instance",
+                    fields: [
+                        { label: "identity", value: host.name },
+                        { label: "transport", value: host.id ?? "local" },
+                        { label: "shape", value: `${host.rigs.length} rigs · ${host.rigs.reduce((n, rig) => n + rig.pods.reduce((m, pod) => m + pod.agents.length, 0), 0)} seats` },
+                    ],
+                },
+                {
+                    title: "rigs",
+                    lines: host.rigs.length > 0
+                        ? host.rigs.map((rig) => listItem(alignedRow([[rig.name, 20], [rig.lifecycleState ?? "unknown", 20], [`${rig.pods.length} pods · ${rig.pods.reduce((n, pod) => n + pod.agents.length, 0)} seats`, 24]]), { type: "drill", resource: "rig", name: rig.name, target: { host: host.name } }))
+                        : [{ text: "  (no local rigs served — proven empty)" }],
+                },
+            ]),
+        ];
+    }
+    if (state.viewTab === "graph") {
+        for (const rig of host.rigs) {
+            lines.push({ text: "" }, sectionRule(`rig ${rig.name} · ${rig.lifecycleState ?? "unknown"}`, contentWidth));
+            if (!rig.graph) {
+                if (motion.loading) {
+                    if (!motion.reduced)
+                        motion.used = true;
+                    lines.push({ text: `  ${motion.frame} topology graph read pending` });
+                }
+                else if (snap.readErrors.some((error) => error.startsWith(`graph(${rig.name})`))) {
+                    lines.push({ text: "  ✕ topology graph read failed — named in the status line" });
+                }
+                else {
+                    lines.push({ text: "  (no topology graph served)" });
+                }
+                continue;
+            }
+            const canvas = renderGraphStyle(state.graphStyle, rig.graph, { host: host.name, rig: rig.name, selected: null }, contentWidth);
+            const plain = canvas.plainLines();
+            const segs = canvas.segLines();
+            for (let row = 0; row < plain.length; row++)
+                lines.push({
+                    text: plain[row],
+                    segs: segs[row],
+                    zones: canvas.zones.filter((zone) => zone.y === row).map((zone) => ({ start: zone.start, end: zone.end, action: zone.action })),
+                });
+        }
+        if (host.rigs.length === 0)
+            lines.push({ text: "" }, { text: "  (no local rigs served — proven empty)" });
+        lines.push({ text: "" }, { text: `  style: ${state.graphStyle} · style hatchet|braille|braille-fallback rides the command bar` });
+        return lines;
+    }
+    lines.push({ text: state.filter ? `/ filter instance rows: ${state.filter} · / replace · esc clear` : "/ filter instance rows…" });
+    const columns = instanceAgentColumns(contentWidth);
+    lines.push({ text: tableRow(columns, { rig: "RIG", pod: "POD", seat: "SEAT", runtime: "RT", context: "CTX", status: "STATE", queue: "Q", work: "WORK", now: "NOW" }) });
+    lines.push({ text: "━".repeat(columnsWidth(columns)) });
+    let seatCount = 0;
+    let workingCount = 0;
+    let attentionCount = 0;
+    let openCount = 0;
+    for (const rig of host.rigs) {
+        const agents = rig.pods.flatMap((pod) => pod.agents.map((agent) => ({ pod: pod.name, agent })))
+            .filter(({ pod, agent }) => !state.filter || rig.name.includes(state.filter) || pod.includes(state.filter) || agent.name.includes(state.filter));
+        if (state.filter && agents.length === 0 && !rig.name.includes(state.filter))
+            continue;
+        const rigAction = { type: "drill", resource: "rig", name: rig.name, target: { host: host.name } };
+        if (agents.length === 0) {
+            lines.push({
+                text: tableRow(columns, { rig: rig.name, pod: "—", seat: "(no seats)", status: rig.lifecycleState ?? "unknown" }),
+                action: rigAction,
+            });
+            continue;
+        }
+        let previousPod = null;
+        for (const { pod, agent } of agents) {
+            const firstInPod = pod !== previousPod;
+            if (firstInPod && previousPod != null)
+                lines.push({ text: "┈".repeat(columnsWidth(columns)) });
+            previousPod = pod;
+            const stateCell = operationalState(agent.status, motion);
+            const queue = queueFacts(snap, agent.session);
+            seatCount += 1;
+            if (["active", "working", "running"].includes(agent.status))
+                workingCount += 1;
+            if (/attention|needs|blocked|unknown|failed/.test(agent.status))
+                attentionCount += 1;
+            openCount += queue.count;
+            lines.push({
+                text: tableRow(columns, {
+                    rig: rig.name,
+                    pod: firstInPod ? pod : "",
+                    seat: `${stateCell.mark} ${seatName(pod, agent.name)}`,
+                    runtime: runtimeShort(agent.runtime),
+                    context: contextCompact(agent.context, contentWidth < 110),
+                    status: stateCell.word,
+                    queue: queue.count || "·",
+                    work: queue.work,
+                    now: queue.now,
+                }),
+                action: { type: "drill", resource: "agent", name: agent.name, target: { host: host.name, rig: rig.name, pod } },
+                zones: [{ start: 0, end: columns[0][2], action: rigAction }],
+            });
+        }
+    }
+    lines.push({ text: "" }, { text: `${host.rigs.length} rigs · ${seatCount} seats · ${workingCount} working · ${attentionCount} need attention · ${openCount} open rows` });
+    lines.push(...recentLines(snap, scope, contentWidth, false));
+    return lines;
+}
 function contentLines(state, snap, contentWidth, motion) {
     const contentWidthForGraph = contentWidth;
     void contentWidthForGraph;
@@ -186,80 +641,13 @@ function contentLines(state, snap, contentWidth, motion) {
             const found = hostName ? findAgent(snap, leaf.name, { host: hostName, rig: rigName, pod: podName }) : findAgent(snap, leaf.name);
             if (!found)
                 return [{ text: `agent "${leaf.name}" not in the current snapshot` }];
-            const { agent, rig, pod } = found;
-            const specInLibrary = !!agent.spec && !!findSpec(snap, agent.spec);
-            // a4c9548a — S19 FOLLOW-ON FOUNDER RULING (binding, bounds the S19 marks
-            // ruling): where there is ROOM, WRITE THE NAME — an icon NEVER replaces text
-            // as the value. The detail page has room, so the runtime NAME is the VALUE
-            // (honest placeholder when unserved); the mark's OWN token segments still ride
-            // the seg channel (ROUND-4: colors/background survive stylization) but only
-            // ACCOMPANY the name decoratively, never substitute. Topology cards remain
-            // mark-only by space (layout.ts/hatchet.ts) — the ruling is bounded, not reversed.
-            // LEG-7 LOW 2 (dead-arm cleanup, wave qitem 79159e6f): the daemon coerces a null runtime to the
-            // string "unknown" BEFORE the wire (the icon-fix QA at 5a70e200 proved the old "— (not served)"
-            // arm unreachable), so the defensive fallback matches that coercion — honest, never a misleading
-            // placeholder. (The cwd field below keeps its own "— (not served)" — a legitimately-servable value.)
-            const rtName = agent.runtime ?? "unknown";
-            const rtSegs = [
-                { text: "  " },
-                { text: "runtime:", token: "dim" },
-                { text: " ".repeat(LABEL_W - "runtime:".length + 1) },
-                { text: rtName },
-                { text: "  " },
-                ...runtimeMarkSegs(agent.runtime),
-            ];
-            const runtimeLine = { text: rtSegs.map((g) => g.text).join(""), segs: rtSegs };
-            return detailPage({ text: `agent ${agent.name}` }, [
-                {
-                    title: "seat",
-                    fields: [
-                        { label: "state", value: agent.status },
-                        { label: "host", value: found.host.name },
-                        { label: "rig", value: rig.name },
-                        { label: "pod", value: pod.name },
-                    ],
-                    lines: [
-                        runtimeLine,
-                        fieldLine({
-                            label: "context",
-                            // ROUND-3 mr7: a quiet determinate bar rides REAL fractions only
-                            value: agent.context == null
-                                ? "— (not yet known)"
-                                : `${agent.context}% used · ${agent.tokens ?? "—"} tokens  ${barCells(agent.context / 100, 10)}`,
-                        }),
-                        // S19 MR4 (§D9, founder: "very important"): the FULL absolute
-                        // working directory, verbatim; honest — when not served
-                        fieldLine({ label: "cwd", value: agent.cwd ?? "— (not served)" }),
-                    ],
-                },
-                {
-                    title: "spec",
-                    fields: [
-                        specInLibrary
-                            ? {
-                                label: "spec",
-                                value: agent.spec,
-                                link: { type: "cross", kind: "spec-of", name: agent.name, target: { host: found.host.name, rig: rig.name, pod: pod.name } },
-                            }
-                            : { label: "spec", value: agent.spec ? `${agent.spec}  (not in library)` : "—" },
-                    ],
-                },
-                {
-                    title: "actions",
-                    fields: [
-                        ...(agent.attach ? [{ label: "attach", value: agent.attach }] : []),
-                        {
-                            label: "terminal",
-                            value: `term ▸ pod ${pod.name}`,
-                            link: { type: "act", act: "open-terminal", view: `pod:${rig.name}/${pod.name}` },
-                        },
-                    ],
-                },
-            ]);
+            return agentDetailLines(snap, found, contentWidth);
         }
-        const rigName = state.drill.find((d) => d.kind === "rig")?.name ?? snap.hosts[0]?.rigs[0]?.name;
         const hostName = state.drill.find((d) => d.kind === "host")?.name;
         const host = (hostName ? snap.hosts.find((candidate) => candidate.name === hostName) : snap.hosts[0]);
+        if (leaf?.kind === "host" && host)
+            return instanceContentLines(state, snap, host, contentWidth, motion);
+        const rigName = state.drill.find((d) => d.kind === "rig")?.name ?? snap.hosts[0]?.rigs[0]?.name;
         const rig = host?.rigs.find((candidate) => candidate.name === rigName);
         if (!rig || !host) {
             // round-6 (guard): the ROOT topology branch consumes the OWNER's load
@@ -283,6 +671,12 @@ function contentLines(state, snap, contentWidth, motion) {
             .filter((a) => !state.filter || a.name.includes(state.filter) || a.pod.includes(state.filter));
         const suffix = `rig ${rig.name}${podFilter ? ` · pod ${podFilter}` : ""}${state.filter ? ` · filter "${state.filter}"` : ""}`;
         lines.push(...tabsLine(state, suffix));
+        if (state.viewTab === "recent") {
+            const recent = recentLines(snap, { kind: "rig", rig: rig.name }, contentWidth, true);
+            return recent.length > 0
+                ? [...lines, ...recent]
+                : [...lines, { text: "" }, { text: motion.loading ? `${motion.frame} rig RECENT read pending` : "(rig RECENT window not served)" }];
+        }
         if (state.viewTab === "graph") {
             // slice-17 topology view (frame-01): the rig's SERVED /graph projection
             // rendered by the style registry; honest-empty until the read answers.
@@ -331,7 +725,7 @@ function contentLines(state, snap, contentWidth, motion) {
             lines.push({ text: `  style: ${state.graphStyle} · style hatchet|braille|braille-fallback rides the command bar` });
             return lines;
         }
-        lines.push({ text: state.filter ? `/ filter agents: ${state.filter}` : "/ filter agents…" });
+        lines.push({ text: state.filter ? `/ filter agents: ${state.filter} · / replace · esc clear` : "/ filter agents…" });
         if (state.viewTab === "overview") {
             lines.push(...detailPage({ text: `rig ${rig.name}` }, [
                 {
@@ -350,16 +744,24 @@ function contentLines(state, snap, contentWidth, motion) {
             return lines;
         }
         const agentCols = agentColumns(contentWidth);
+        const narrowFactory = !agentCols.some(([key]) => key === "model");
+        if (narrowFactory)
+            lines.push({ text: "MODEL/NOW/ACTIONS on drill (enter)" });
         lines.push({
             text: tableRow(agentCols, {
-                rig: "RIG", pod: "POD", agent: "AGENT", runtime: "RUNTIME",
-                context: "CTX%", tokens: "TOKENS", status: "STATUS", actions: "ACTIONS",
+                pod: "POD", seat: "SEAT", runtime: "RT", model: "MODEL", context: "CTX",
+                status: "STATE", queue: "Q", work: "WORK", now: "NOW", actions: "ACTIONS",
             }),
         });
-        lines.push({ text: "─".repeat(columnsWidth(agentCols)) });
+        lines.push({ text: "━".repeat(columnsWidth(agentCols)) });
         const actionsIndex = agentCols.findIndex(([key]) => key === "actions");
-        const actionsColStart = agentCols.slice(0, actionsIndex).reduce((n, [, , width]) => n + width + 1, 0);
+        const actionsColStart = actionsIndex < 0 ? -1 : agentCols.slice(0, actionsIndex).reduce((n, [, , width]) => n + width + 1, 0);
+        let previousPod = null;
         for (const a of rows) {
+            const firstInPod = a.pod !== previousPod;
+            if (firstInPod && previousPod != null && !narrowFactory)
+                lines.push({ text: "┈".repeat(columnsWidth(agentCols)) });
+            previousPod = a.pod;
             // ACTIONS = drive-structure ONLY (BR-9), each mapped to an EXISTING
             // write contract: `run ▸` = the rig-restore write (rendered only where
             // it applies — the seat is not running); `term ▸` = the terminal-open
@@ -367,25 +769,31 @@ function contentLines(state, snap, contentWidth, motion) {
             const canRun = a.canRun ?? !a.live;
             const actionsCell = canRun ? "run ▸ · term ▸" : "term ▸";
             const zones = [];
-            const termOffset = actionsColStart + actionsCell.indexOf("term ▸");
-            zones.push({ start: termOffset, end: termOffset + "term ▸".length, action: { type: "act", act: "open-terminal", view: `pod:${rig.name}/${a.pod}` } });
-            if (canRun)
+            if (actionsColStart >= 0) {
+                const termOffset = actionsColStart + actionsCell.indexOf("term ▸");
+                zones.push({ start: termOffset, end: termOffset + "term ▸".length, action: { type: "act", act: "open-terminal", view: `pod:${rig.name}/${a.pod}` } });
+            }
+            if (canRun && actionsColStart >= 0)
                 zones.push({
                     start: actionsColStart,
                     end: actionsColStart + "run ▸".length,
                     action: { type: "act", act: "run", rigId: rig.id ?? rig.name, agent: a.name },
                 });
+            const stateCell = operationalState(a.status, motion);
+            const queue = queueFacts(snap, a.session);
             lines.push({
                 // the WHOLE row is the hit surface (not a testid'd control): clicking
                 // any visible cell opens the agent; the ACTIONS zones override.
                 text: tableRow(agentCols, {
-                    rig: rig.name,
-                    pod: a.pod,
-                    agent: a.name,
-                    runtime: a.runtime,
-                    context: a.context == null ? "—" : `${a.context}%`,
-                    tokens: a.tokens ?? "—",
-                    status: a.status,
+                    pod: firstInPod ? a.pod : "",
+                    seat: `${stateCell.mark} ${seatName(a.pod, a.name)}`,
+                    runtime: runtimeShort(a.runtime),
+                    model: tableModel(a.model),
+                    context: contextCompact(a.context, narrowFactory),
+                    status: stateCell.word,
+                    queue: queue.count || "·",
+                    work: queue.work,
+                    now: queue.now,
                     actions: actionsCell,
                 }),
                 action: { type: "drill", resource: "agent", name: a.name, target: { host: host.name, rig: rig.name, pod: a.pod } },
@@ -393,7 +801,11 @@ function contentLines(state, snap, contentWidth, motion) {
             });
         }
         lines.push({ text: "" });
-        lines.push({ text: `${rows.length} of ${all.length} / ${rows.filter((agent) => agent.status === "idle").length} idle` });
+        const working = rows.filter((agent) => ["active", "working", "running"].includes(agent.status)).length;
+        const attention = rows.filter((agent) => /attention|needs|blocked|unknown|failed/.test(agent.status)).length;
+        lines.push({ text: `${rows.length} seats · ${working} working · ${attention} need attention · ${rows.reduce((n, agent) => n + queueFacts(snap, agent.session).count, 0)} open rows` });
+        if (!podFilter)
+            lines.push(...recentLines(snap, { kind: "rig", rig: rig.name }, contentWidth, false));
         return lines;
     }
     if (state.section === "specs") {
@@ -528,7 +940,7 @@ function contentLines(state, snap, contentWidth, motion) {
             return lines;
         }
         lines.push({ text: "SPEC LIBRARY" });
-        lines.push({ text: state.filter ? `/ filter specs: ${state.filter}` : "/ filter specs…" });
+        lines.push({ text: state.filter ? `/ filter specs: ${state.filter} · / replace · esc clear` : "/ filter specs…" });
         // mirrors the explorer exactly (same grouping, same expansion state, same
         // filter-overrides-collapse rule) — glance consistency across panes
         const expandedSet = new Set(state.expanded);
@@ -622,16 +1034,36 @@ function contentLines(state, snap, contentWidth, motion) {
         return lines;
     }
     if (state.section === "scopes") {
-        // SCOPES (d64d2f5c): the opened slice rides scopesSelected; store-direct detail.
+        // SCOPES owns both levels. Both mission-graph and Explorer slice routes land
+        // on the same execution-backed canonical detail; store-direct content is
+        // composed into that page instead of surviving as a competing destination.
         const sel = state.scopesSelected;
-        const missionName = sel?.mission ?? null;
+        const missionName = state.scopesMission;
+        const execution = snap.execution?.mission === missionName ? snap.execution : null;
         const detail = sel
             ? (snap.scopes ?? []).find((m) => m.mission === sel.mission)?.slices.find((sl) => sl.dirName === sel.slice) ?? null
             : null;
+        if (state.executionOpen && execution) {
+            return executionContentLines(execution, snap.scopes, snap.readErrors, state.executionOpen, contentWidth, false, snap.sliceDetail, {
+                collapseReqs: state.scopesCollapseReqs,
+                narrative: state.scopesNarrative,
+            });
+        }
+        if (detail && execution) {
+            return executionContentLines(execution, snap.scopes, snap.readErrors, `slice:${detail.id ?? detail.dirName}`, contentWidth, false, snap.sliceDetail, {
+                collapseReqs: state.scopesCollapseReqs,
+                narrative: state.scopesNarrative,
+            });
+        }
+        if (!detail && missionName) {
+            const lines = executionContentLines(execution, snap.scopes, snap.readErrors, state.executionOpen, contentWidth, !snap.hydratedAt || snap.executionMission !== missionName);
+            return execution ? lines : [{ text: `  ${missionName} EXECUTION` }, ...lines];
+        }
         return scopesContentLines(detail, missionName, {
             collapseReqs: state.scopesCollapseReqs,
             narrative: state.scopesNarrative,
             width: contentWidth,
+            executionStrip: detail ? executionSliceStripLines(null, detail.id ?? detail.dirName, detail.dirName, contentWidth, detail.status) : undefined,
         });
     }
     return [{ text: `(${state.section})` }];
@@ -659,14 +1091,17 @@ function spliceMarkerIntoSegs(segs, pos) {
     }
     return out;
 }
-function paneRule(cols, joint, leftTitle, rightTitle) {
-    const left = leftTitle ? `─ ${leftTitle} ` : "";
-    const right = rightTitle ? `─ ${rightTitle} ` : "";
-    const leftPart = (left + "─".repeat(EXPL_W)).slice(0, EXPL_W);
-    const rightPart = (right + "─".repeat(cols)).slice(0, Math.max(cols - EXPL_W - 1, 0));
-    return `${leftPart}${joint}${rightPart}`;
+function paneRule(cols, explW, joint, leftTitle, rightTitle) {
+    void joint;
+    const left = leftTitle ? `━ ${leftTitle} ` : "";
+    const right = rightTitle ? `━ ${rightTitle} ` : "";
+    const leftPart = (left + "━".repeat(explW)).slice(0, explW);
+    const rightPart = (right + "━".repeat(cols)).slice(0, Math.max(cols - explW - 1, 0));
+    return `${leftPart}╋${rightPart}`;
 }
 function keybindHints(state) {
+    if (state.copyMode)
+        return "drag to select/copy · v resume mouse · q quit";
     // Affordance surfaces on REAL scrollability (contentMaxOffset), never gated
     // behind already-being-content-focused — that gate was the catch-22 (the
     // hint hid exactly where it was needed). When ↑↓ themselves scroll (a
@@ -675,7 +1110,8 @@ function keybindHints(state) {
     const arrowsScroll = specDetailArrowsScroll(state);
     const nav = arrowsScroll ? "↑↓ scroll" : "↑↓ move";
     const pageScroll = state.contentMaxOffset > 0 && !arrowsScroll ? "⇞⇟ scroll · " : "";
-    return `${nav} · ←→ pane · ⏎ open · ${pageScroll}: command · / filter · f footer · q quit`;
+    const filter = state.filter ? "/ replace · esc clear" : "/ filter";
+    return `${nav} · ←→ pane · ⏎ open · ${pageScroll}: command · ${filter} · v select/copy · f footer · q quit`;
 }
 /** The PULSE view renders FULL-WIDTH with NO explorer sidebar (increment 2). A
  * minimal self-contained screen: cmd bar + a full-width titled rule + the pulse
@@ -701,8 +1137,19 @@ function truncateSegs(segs, width) {
     }
     return out;
 }
+/** The disclosure cell is a distinct control from the row body. Hit lookup is
+ * first-match, so register this one-cell target before the row-wide target. */
+function pushExplorerTargets(hitMap, row, display, y, explorerWidth) {
+    if (row.disclosureAction) {
+        const at = display.search(/[⌄›]/);
+        if (at >= 0)
+            hitMap.push({ y, x1: at + 2, x2: at + 2, action: row.disclosureAction });
+    }
+    hitMap.push({ y, x1: 1, x2: explorerWidth, action: row.action });
+}
 function renderPulseScreen(state, snap, options, inputLine) {
     const { cols = 120, rows = 32, nowMs = 0 } = options;
+    const explW = explorerWidth(cols);
     // FOUNDER OPTION-B (supersedes the earlier full-width ruling): PULSE renders as
     // a content-pane view INSIDE the normal chrome — the EXPLORER sidebar STAYS (it
     // is the founder's action path: from a needs-you row, mouse to the sidebar and
@@ -722,7 +1169,7 @@ function renderPulseScreen(state, snap, options, inputLine) {
     const reduced = reducedMotion();
     const load = options.load ?? { inFlight: false, settled: true };
     const loading = load.inFlight || !load.settled;
-    const frame = spinnerFrame(Math.floor(nowMs / 120), options.colorMode ?? "truecolor", reduced);
+    const frame = spinnerFrame(Math.floor(nowMs / MOTION_FRAME_MS), options.colorMode ?? "truecolor", reduced);
     const liveFlashes = (options.rowFlashes ?? []).filter((f) => flashActive(f.at, nowMs, 600, reduced));
     const ackFlashes = (options.rowFlashes ?? []).filter((f) => flashActive(f.at, nowMs, 600, false));
     const lines = [];
@@ -749,10 +1196,10 @@ function renderPulseScreen(state, snap, options, inputLine) {
             lines.push(pad(`${mark} ${label}${alias}  ${tail}`, cols));
         }
     }
-    const explorerTitle = state.focusedPane === "explorer" ? "[ EXPLORER ]" : "EXPLORER";
-    const contentTitle = state.focusedPane === "content" ? "[ PULSE ]" : "PULSE";
-    lines.push(paneRule(cols, "┬", explorerTitle, contentTitle));
-    const contentWidth = Math.max(cols - EXPL_W - 2, 0);
+    const explorerTitle = state.focusedPane === "explorer" ? "{ EXPLORER }" : "EXPLORER";
+    const contentTitle = state.focusedPane === "content" ? "{ PULSE }" : "PULSE";
+    lines.push(paneRule(cols, explW, "top", explorerTitle, contentTitle));
+    const contentWidth = Math.max(cols - explW - 2, 0);
     const model = buildPulseModel(snap, nowMs);
     const chromeRows = 3; // bottom rule + hint bar + status line
     const bodyRows = Math.max(rows - 2 - chromeRows, 1);
@@ -791,7 +1238,7 @@ function renderPulseScreen(state, snap, options, inputLine) {
     const visiblePulse = pulseLines.slice(contentStart, contentStart + bodyRows);
     // EXPLORER sidebar = the normal navigator (same helpers as every other view).
     const explorer = computeExplorerRows(state, snap);
-    const { labels: explorerDisplay, metas: explorerMetas } = navigatorDisplay(explorer, snap, EXPL_W - 1);
+    const { labels: explorerDisplay, metas: explorerMetas } = navigatorDisplay(explorer, snap, explW - 1);
     const explorerStart = Math.min(Math.max(state.selection - bodyRows + 1, 0), Math.max(explorer.length - bodyRows, 0));
     for (let i = 0; i < bodyRows; i++) {
         const y = lines.length + 1;
@@ -801,16 +1248,16 @@ function renderPulseScreen(state, snap, options, inputLine) {
         const flashed = row?.key != null && ackFlashes.some((f) => f.key === row.key);
         if (flashed)
             flashAck = true;
-        const marker = explorerIndex === state.selection && row ? (flashed ? "»" : "›") : flashed ? "≈" : " ";
-        const left = pad(row ? `${marker}${explorerDisplay[explorerIndex] ?? row.label}` : "", EXPL_W);
+        const marker = explorerIndex === state.selection && row ? (flashed ? "◆" : "▶") : flashed ? "≈" : " ";
+        const left = pad(row ? `${marker}${explorerDisplay[explorerIndex] ?? row.label}` : "", explW);
         // CONTENT half = the pulse view, truncated to the content width. Selection is
         // the per-cell bg on the segs (mock affordance), so the content marker slot
         // stays blank — no "›" chevron (the native affordance the mock overrides).
         const citem = visiblePulse[i];
         const contentText = (citem?.text ?? "").slice(0, contentWidth);
-        lines.push(pad(`${left}│ ${contentText}`, cols));
+        lines.push(pad(`${left}┃ ${contentText}`, cols));
         if (row) {
-            hitMap.push({ y, x1: 1, x2: EXPL_W, action: row.action });
+            pushExplorerTargets(hitMap, row, explorerDisplay[explorerIndex] ?? row.label, y, explW);
             explorerRows.push({ ...row, y });
             const em = explorerMetas[explorerIndex];
             if (em && em.length)
@@ -822,16 +1269,16 @@ function renderPulseScreen(state, snap, options, inputLine) {
             segRows[y] = truncateSegs(citem.segs, contentWidth);
     }
     // Lane cells → content targets, x mapped into the content column (origin =
-    // EXPL_W + 3, matching the normal content zone geometry), clamped to `cols`.
+    // explorer boundary + 3, matching normal content geometry), clamped to `cols`.
     for (const t of visibleTargets) {
-        const x1 = EXPL_W + 2 + t.x1;
+        const x1 = explW + 2 + t.x1;
         if (x1 > cols)
             continue;
-        const target = { y: t.lineIndex - contentStart + 3, x1, x2: Math.min(EXPL_W + 2 + t.x2, cols), action: t.action };
+        const target = { y: t.lineIndex - contentStart + 3, x1, x2: Math.min(explW + 2 + t.x2, cols), action: t.action };
         contentTargets.push(target);
         hitMap.push(target);
     }
-    lines.push(paneRule(cols, "┴"));
+    lines.push(paneRule(cols, explW, "bottom"));
     lines.push(pad(keybindHints(state), cols));
     const drillPath = state.drill.map((d) => d.name).join(" → ");
     const readWarn = snap.readErrors.length > 0 ? `  ⚠ ${snap.readErrors.length} read(s) failed: ${snap.readErrors[0]}` : "";
@@ -847,6 +1294,7 @@ function renderPulseScreen(state, snap, options, inputLine) {
     const anyFlash = model.lanes.some((l) => l.rows.some((r) => r.flashed));
     return {
         lines: lines.slice(0, rows),
+        explorerWidth: explW,
         hitMap,
         contentTargets,
         contentMaxOffset: maxContentOffset,
@@ -894,13 +1342,14 @@ function wrapContentLines(content, width) {
     return out;
 }
 function crashCartShell(content, led, contentTitle, cols, rows, inputLine, opts) {
+    const explW = explorerWidth(cols);
     const lines = [];
     const segRows = {};
     lines.push(pad(`cmd ▸ ${inputLine}▊`, cols));
-    lines.push(paneRule(cols, "┬", "EXPLORER", contentTitle));
+    lines.push(paneRule(cols, explW, "top", "{ EXPLORER }", contentTitle));
     // The ledger-fed explorer column: the honest marker, then one row per rig (name + seat count).
     const leftRows = [led.note, "", ...led.rows.map((r) => `${r.label} (${r.seatCount})`)];
-    const contentWidth = Math.max(cols - EXPL_W - 2, 0);
+    const contentWidth = Math.max(cols - explW - 2, 0);
     if (opts?.wrap)
         content = wrapContentLines(content, contentWidth);
     const bodyRows = Math.max(rows - 2 - 3, 1); // minus cmd bar + top rule + (bottom rule, hints, status)
@@ -911,14 +1360,14 @@ function crashCartShell(content, led, contentTitle, cols, rows, inputLine, opts)
     const scroll = Math.max(0, Math.min(contentMaxOffset, opts?.scroll ?? 0));
     for (let i = 0; i < bodyRows; i++) {
         const y = lines.length + 1;
-        const left = pad(leftRows[i] ?? "", EXPL_W);
+        const left = pad(leftRows[i] ?? "", explW);
         const citem = content[scroll + i];
         const contentText = (citem?.text ?? "").slice(0, contentWidth);
-        lines.push(pad(`${left}│ ${contentText}`, cols));
+        lines.push(pad(`${left}┃ ${contentText}`, cols));
         if (citem?.segs)
             segRows[y] = truncateSegs(citem.segs, contentWidth);
     }
-    lines.push(paneRule(cols, "┴"));
+    lines.push(paneRule(cols, explW, "bottom"));
     lines.push(pad("", cols));
     const scrollHint = contentMaxOffset > 0 ? ` · ↑↓ scroll (${scroll}/${contentMaxOffset})` : "";
     lines.push(pad(`[crash-cart] daemon down · explorer ${led.note}${scrollHint}`, cols));
@@ -926,6 +1375,7 @@ function crashCartShell(content, led, contentTitle, cols, rows, inputLine, opts)
         lines.push("");
     return {
         lines: lines.slice(0, rows),
+        explorerWidth: explW,
         hitMap: [],
         contentTargets: [],
         contentMaxOffset,
@@ -935,6 +1385,7 @@ function crashCartShell(content, led, contentTitle, cols, rows, inputLine, opts)
 }
 export function renderScreen(state, snap, options = {}, inputLine = "") {
     const { cols = 120, rows = 32, nowMs = 0 } = options;
+    const explW = explorerWidth(cols);
     // 5.2 crash-cart (shell-placement rework, ruling 3c6c2be0): daemon-DOWN renders as a CONTENT-PANE
     // view inside the standard shell — the explorer sidebar is ALWAYS present, ledger-fed + honestly
     // marked (from the SAME one-JSON discovery, never a second read). Content moves into the right pane
@@ -975,7 +1426,7 @@ export function renderScreen(state, snap, options = {}, inputLine = "") {
     const reduced = reducedMotion();
     const load = options.load ?? { inFlight: false, settled: true };
     const motion = {
-        frame: spinnerFrame(Math.floor(nowMs / 120), options.colorMode ?? "truecolor", reduced),
+        frame: spinnerFrame(Math.floor(nowMs / MOTION_FRAME_MS), options.colorMode ?? "truecolor", reduced),
         reduced,
         used: false,
         loading: load.inFlight || !load.settled,
@@ -1005,14 +1456,14 @@ export function renderScreen(state, snap, options = {}, inputLine = "") {
     }
     const sectionTitle = { topology: "TOPOLOGY", specs: "SPECS", needs: "NEEDS-YOU" }[state.section] ?? state.section.toUpperCase();
     // active-pane emphasis (k9s-class chrome): the focused pane's title is bracketed
-    const explorerTitle = state.focusedPane === "explorer" ? "[ EXPLORER ]" : "EXPLORER";
-    const contentTitle = state.focusedPane === "content" ? `[ ${sectionTitle} ]` : sectionTitle;
-    lines.push(paneRule(cols, "┬", explorerTitle, contentTitle));
+    const explorerTitle = state.focusedPane === "explorer" ? "{ EXPLORER }" : "EXPLORER";
+    const contentTitle = state.focusedPane === "content" ? `{ ${sectionTitle} }` : sectionTitle;
+    lines.push(paneRule(cols, explW, "top", explorerTitle, contentTitle));
     const explorer = computeExplorerRows(state, snap);
     // Slice-17: the file-tree re-skin is a DISPLAY transform only — rows, keys,
     // actions, and the hit-map all keep resolving against the row model above.
-    const { labels: explorerDisplay, metas: explorerMetas } = navigatorDisplay(explorer, snap, EXPL_W - 1);
-    const content = contentLines(state, snap, Math.max(cols - EXPL_W - 2, 0), motion);
+    const { labels: explorerDisplay, metas: explorerMetas } = navigatorDisplay(explorer, snap, explW - 1);
+    const content = contentLines(state, snap, Math.max(cols - explW - 2, 0), motion);
     const footer = state.footerOn ? snap.stream.at(-1) : undefined;
     // round-5 (guard): the tmux-style ONE-SHOT activity flash targets the
     // flashed agent's EXPLORER row — per-seat pane-output events from the
@@ -1062,8 +1513,8 @@ export function renderScreen(state, snap, options = {}, inputLine = "") {
         const flashed = row?.key != null && ackFlashes.some((f) => f.key === row.key);
         if (flashed)
             flashAck = true;
-        const marker = explorerIndex === state.selection && row ? (flashed ? "»" : "›") : flashed ? "≈" : " ";
-        const left = pad(row ? `${marker}${explorerDisplay[explorerIndex] ?? row.label}` : "", EXPL_W);
+        const marker = explorerIndex === state.selection && row ? (flashed ? "◆" : "▶") : flashed ? "≈" : " ";
+        const left = pad(row ? `${marker}${explorerDisplay[explorerIndex] ?? row.label}` : "", explW);
         const item = visibleContent[i];
         const targetIndex = contentTargets.length;
         const zones = item?.zones ?? [];
@@ -1084,9 +1535,9 @@ export function renderScreen(state, snap, options = {}, inputLine = "") {
             else
                 contentMarker = "›";
         }
-        lines.push(pad(`${left}│${contentMarker}${contentText}`, cols));
+        lines.push(pad(`${left}┃${contentMarker}${contentText}`, cols));
         if (row) {
-            hitMap.push({ y, x1: 1, x2: EXPL_W, action: row.action });
+            pushExplorerTargets(hitMap, row, explorerDisplay[explorerIndex] ?? row.label, y, explW);
             explorerRows.push({ ...row, y });
             const em = explorerMetas[explorerIndex];
             if (em && em.length)
@@ -1096,12 +1547,12 @@ export function renderScreen(state, snap, options = {}, inputLine = "") {
         }
         // zones first: hit lookup takes the first match, so a zone wins over the row-wide action
         for (const z of zones) {
-            const target = { y, x1: EXPL_W + 3 + z.start, x2: EXPL_W + 2 + z.end, action: z.action };
+            const target = { y, x1: explW + 3 + z.start, x2: explW + 2 + z.end, action: z.action };
             hitMap.push(target);
             contentTargets.push(target);
         }
         if (item?.action) {
-            const target = { y, x1: EXPL_W + 3, x2: cols, action: item.action };
+            const target = { y, x1: explW + 3, x2: cols, action: item.action };
             hitMap.push(target);
             contentTargets.push(target);
         }
@@ -1112,13 +1563,14 @@ export function renderScreen(state, snap, options = {}, inputLine = "") {
         lines.push(pad(`≋ ${footer.tsEmitted.slice(11, 16)} ${footer.sourceSession}: ${footer.body}`, cols));
     const drillPath = state.drill.map((d) => d.name).join(" → ");
     const readWarn = snap.readErrors.length > 0 ? `  ⚠ ${snap.readErrors.length} read(s) failed: ${snap.readErrors[0]}` : "";
-    lines.push(paneRule(cols, "┴"));
+    lines.push(paneRule(cols, explW, "bottom"));
     lines.push(pad(keybindHints(state), cols));
     lines.push(pad(`[${state.instanceId}] ${state.section}${drillPath ? " · " + drillPath : ""}${state.lastError ? "  ✗ " + state.lastError : ""}${state.notice ? "  ▸ " + state.notice : ""}${readWarn}`, cols));
     while (lines.length < rows)
         lines.push("");
     return {
         lines: lines.slice(0, rows),
+        explorerWidth: explW,
         hitMap,
         contentTargets,
         contentMaxOffset: maxContentOffset,