@h-rig/cli 0.0.6-alpha.82 → 0.0.6-alpha.83

package/dist/src/app-opentui/scenes/command.d.ts

@@ -0,0 +1,3 @@
+import type { AppSceneFrame, AppState } from "../types";
+import type { StageLayout } from "../layout";
+export declare function renderCommandScene(state: AppState, layout?: StageLayout): AppSceneFrame;

package/dist/src/app-opentui/scenes/command.js

@@ -0,0 +1,103 @@
+// @bun
+// packages/cli/src/app-opentui/theme.ts
+import {
+  bold as otuiBold,
+  dim as otuiDim,
+  fg as otuiFg,
+  t,
+  TextAttributes
+} from "@opentui/core";
+var RIG_UI = {
+  bg: "#070809",
+  bg2: "#0b0c0e",
+  panel: "#101115",
+  panel2: "#101115",
+  glass: "#14161b",
+  ink: "#f2f3f6",
+  ink2: "#aeb0ba",
+  ink3: "#6c6e79",
+  ink4: "#44464f",
+  lime: "#ccff4d",
+  limeDim: "#a9d63f",
+  cyan: "#56d8ff",
+  red: "#ff5d5d",
+  yellow: "#ffd24d",
+  magenta: "#ff79b0"
+};
+var styles = {
+  ink: otuiFg(RIG_UI.ink),
+  ink2: otuiFg(RIG_UI.ink2),
+  ink3: otuiFg(RIG_UI.ink3),
+  ink4: otuiFg(RIG_UI.ink4),
+  lime: otuiFg(RIG_UI.lime),
+  limeDim: otuiFg(RIG_UI.limeDim),
+  cyan: otuiFg(RIG_UI.cyan),
+  red: otuiFg(RIG_UI.red),
+  yellow: otuiFg(RIG_UI.yellow),
+  magenta: otuiFg(RIG_UI.magenta)
+};
+
+// packages/cli/src/app-opentui/render/scene.ts
+function line(text, options = {}) {
+  return { text, ...options };
+}
+function makeSceneFrame(input) {
+  return input;
+}
+
+// packages/cli/src/app-opentui/scenes/command.ts
+function terminalState(state) {
+  const value = state.data.commandTerminal;
+  return value && typeof value === "object" && !Array.isArray(value) ? value : null;
+}
+function panelWidth(layout) {
+  return layout?.centerWidth ?? 118;
+}
+function panelHeight(layout, top = 0) {
+  return Math.max(14, (layout?.centerHeight ?? 36) - top);
+}
+function header(snapshot, state) {
+  const label = snapshot?.label ?? (state.argv.length > 0 ? `rig ${state.argv.join(" ")}` : "rig");
+  const suffix = snapshot?.message ? ` \xB7 ${snapshot.message}` : "";
+  return `${label}${suffix}`;
+}
+function commandLines(snapshot) {
+  if (!snapshot) {
+    return [line("starting command\u2026", { fg: RIG_UI.ink3 })];
+  }
+  const rows = snapshot.lines.length > 0 ? snapshot.lines : ["starting command\u2026"];
+  return rows.map((text) => line(text, { fg: text.trim() ? RIG_UI.ink2 : RIG_UI.ink4 }));
+}
+function renderCommandScene(state, layout) {
+  const terminal = terminalState(state);
+  const width = panelWidth(layout);
+  const panelTop = 0;
+  return makeSceneFrame({
+    scene: "command",
+    title: "Command",
+    lines: [],
+    panels: [{
+      id: "command-terminal",
+      top: panelTop,
+      width,
+      height: panelHeight(layout, panelTop),
+      lines: commandLines(terminal),
+      backgroundColor: RIG_UI.panel,
+      backgroundAlpha: 184,
+      opacity: 0.98,
+      border: false,
+      chrome: "ad-terminal",
+      headerText: header(terminal, state),
+      stickyScroll: true,
+      stickyStart: "bottom",
+      paddingX: 5,
+      paddingY: 2
+    }],
+    footer: { message: terminal?.message ?? "command" },
+    live: terminal?.status === "starting" || terminal?.status === "running" || state.status === "action",
+    hideTypeBar: true
+  });
+}
+export {
+  renderCommandScene
+};

package/dist/src/app-opentui/scenes/doctor.d.ts

@@ -1,2 +1,3 @@
+import type { StageLayout } from "../layout";
 import type { AppSceneFrame, AppState } from "../types";
-export declare function renderDoctorScene(state: AppState): AppSceneFrame;
+export declare function renderDoctorScene(state: AppState, layout?: StageLayout): AppSceneFrame;

package/dist/src/app-opentui/scenes/doctor.js

@@ -41,11 +41,15 @@ var styles = {
 function line(text, options = {}) {
   return { text, ...options };
 }
-function blank() {
-  return { text: "" };
-}
-function center(text, fg = RIG_UI.ink2, bold = false) {
-  return { text, fg, bold, align: "center" };
+function deckRow(input) {
+  const prefix = input.active ? "\u25B8" : " ";
+  const label = input.label.toUpperCase().padEnd(10);
+  return line(`${prefix} ${label} ${input.detail}`, {
+    fg: input.active ? RIG_UI.lime : RIG_UI.ink2,
+    bold: input.active,
+    selectableIndex: input.index,
+    activateOnClick: input.activateOnClick
+  });
 }
 function makeSceneFrame(input) {
   return input;
@@ -65,24 +69,59 @@ function glyph(status) {
 function doctorColor(status) {
   return status === "pass" ? RIG_UI.limeDim : status === "warn" ? RIG_UI.yellow : RIG_UI.red;
 }
-function renderDoctorScene(state) {
+function panelWidth(layout) {
+  return layout?.centerWidth ?? 100;
+}
+function panelHeight(layout) {
+  return Math.max(10, (layout?.centerHeight ?? 24) - 1);
+}
+function actionRows(selected) {
+  return [
+    line("ACTIONS", { fg: RIG_UI.ink3, bold: true }),
+    deckRow({ label: "run", detail: "run diagnostics now", index: 0, active: selected === 0, activateOnClick: true }),
+    deckRow({ label: "server", detail: "open server controls", index: 1, active: selected === 1, activateOnClick: true }),
+    deckRow({ label: "repair", detail: "repair project/server/auth link", index: 2, active: selected === 2, activateOnClick: true }),
+    deckRow({ label: "tasks", detail: "open tasks", index: 3, active: selected === 3, activateOnClick: true })
+  ];
+}
+function renderDoctorScene(state, layout) {
   const records = checks(state);
+  const selected = Math.max(0, Math.min(3, state.selection.index));
   const failures = records.filter((check) => check.status === "fail").length;
   const warnings = records.filter((check) => check.status === "warn").length;
   const firstRemediation = records.find((check) => check.status !== "pass" && check.remediation)?.remediation;
+  const checkLines = records.length > 0 ? records.slice(0, 12).map((check) => line(`${glyph(check.status)} ${check.label}${check.detail ? ` \u2014 ${check.detail}` : ""}`, { fg: doctorColor(check.status) })) : [line("Diagnostics have not run in this session.", { fg: RIG_UI.ink3 })];
   return makeSceneFrame({
     scene: "doctor",
     title: "Doctor",
     lines: [
-      center("doctor", RIG_UI.ink, true),
-      center(records.length > 0 ? `${failures} fail \xB7 ${warnings} warn` : "diagnostics ready", RIG_UI.ink3),
-      blank(),
-      ...records.length > 0 ? records.slice(0, 14).map((check) => line(`${glyph(check.status)} ${check.label}${check.detail ? ` \u2014 ${check.detail}` : ""}`, { fg: doctorColor(check.status), align: "center" })) : [line("type doctor to run checks", { fg: RIG_UI.ink3, align: "center" })],
-      blank(),
-      line(firstRemediation ? `next: ${firstRemediation}` : records.length > 0 ? "ready" : "idle", { fg: firstRemediation ? RIG_UI.yellow : RIG_UI.ink4, align: "center" })
+      line("", { fg: RIG_UI.ink4 }),
+      line(`   doctor \xB7 ${records.length > 0 ? `${failures} fail \xB7 ${warnings} warn` : "ready"}`, { fg: RIG_UI.ink3 })
     ],
-    footer: { message: records.length > 0 ? `${records.length} checks` : "doctor idle" },
-    typeBarPlaceholder: "doctor \xB7 server \xB7 tasks \xB7 init",
+    panels: [{
+      id: "doctor-actions",
+      top: 0,
+      width: panelWidth(layout),
+      height: panelHeight(layout),
+      lines: [
+        ...actionRows(selected),
+        line("", { fg: RIG_UI.ink3 }),
+        line("CHECKS", { fg: RIG_UI.ink3, bold: true }),
+        ...checkLines,
+        ...firstRemediation ? [line("", { fg: RIG_UI.ink3 }), line(`next: ${firstRemediation}`, { fg: RIG_UI.yellow })] : []
+      ],
+      backgroundColor: RIG_UI.panel,
+      backgroundAlpha: 184,
+      opacity: 1,
+      border: false,
+      chrome: "ad-terminal",
+      headerText: `doctor \xB7 ${records.length} checks`,
+      headerHeight: 3,
+      paddingX: layout?.compact ? 2 : 3,
+      paddingY: 1
+    }],
+    footer: { message: records.length > 0 ? `${records.length} checks` : "enter/click run to diagnose" },
+    hideTypeBar: true,
     live: state.status === "action" || records.length === 0
   });
 }

package/dist/src/app-opentui/scenes/error.js

@@ -156,11 +156,18 @@ function errorDrone(tick) {
 }
 
 // packages/cli/src/app-opentui/render/scene.ts
-function blank() {
-  return { text: "" };
+function line(text, options = {}) {
+  return { text, ...options };
 }
-function center(text, fg = RIG_UI.ink2, bold = false) {
-  return { text, fg, bold, align: "center" };
+function deckRow(input) {
+  const prefix = input.active ? "\u25B8" : " ";
+  const label = input.label.toUpperCase().padEnd(10);
+  return line(`${prefix} ${label} ${input.detail}`, {
+    fg: input.active ? RIG_UI.lime : RIG_UI.ink2,
+    bold: input.active,
+    selectableIndex: input.index,
+    activateOnClick: input.activateOnClick
+  });
 }
 function makeSceneFrame(input) {
   return input;
@@ -168,20 +175,43 @@ function makeSceneFrame(input) {
 
 // packages/cli/src/app-opentui/scenes/error.ts
 function renderErrorScene(state) {
-  const message = state.error?.message ?? "Unknown Rig app error";
-  const hint = state.error?.hint ?? "type main, help, or retry after fixing the issue";
+  const message = state.error?.message ?? "Unknown app error";
+  const hint = state.error?.hint ?? "Use the actions below to recover.";
+  const selected = Math.max(0, Math.min(3, state.selection.index));
   return makeSceneFrame({
     scene: "error",
-    title: "Rig error",
+    title: "Error",
     lines: [
-      ...errorDrone(state.tick).slice(2, 16),
-      blank(),
-      center("DRONE SIGNAL DEGRADED", RIG_UI.red, true),
-      center(message, RIG_UI.ink2),
-      blank(),
-      center(hint, RIG_UI.limeDim)
+      ...errorDrone(state.tick).slice(2, 10)
     ],
-    typeBarPlaceholder: hint,
+    panels: [{
+      id: "error-recovery",
+      top: 2,
+      width: 96,
+      height: 18,
+      lines: [
+        line("DRONE SIGNAL DEGRADED", { fg: RIG_UI.red, bold: true }),
+        line(message, { fg: RIG_UI.ink2 }),
+        ...hint ? [line(hint, { fg: RIG_UI.yellow })] : [],
+        line("", { fg: RIG_UI.ink3 }),
+        line("ACTIONS", { fg: RIG_UI.ink3, bold: true }),
+        deckRow({ label: "main", detail: "return to dashboard", index: 0, active: selected === 0, activateOnClick: true }),
+        deckRow({ label: "doctor", detail: "run diagnostics", index: 1, active: selected === 1, activateOnClick: true }),
+        deckRow({ label: "server", detail: "open server controls", index: 2, active: selected === 2, activateOnClick: true }),
+        deckRow({ label: "repair", detail: "repair project/server/auth link", index: 3, active: selected === 3, activateOnClick: true })
+      ],
+      backgroundColor: RIG_UI.panel,
+      backgroundAlpha: 184,
+      opacity: 1,
+      border: false,
+      chrome: "ad-terminal",
+      headerText: "recovery",
+      headerHeight: 3,
+      paddingX: 3,
+      paddingY: 1
+    }],
+    footer: { message: "enter/click a recovery action" },
+    hideTypeBar: true,
     live: true
   });
 }

package/dist/src/app-opentui/scenes/fleet.js

@@ -67,6 +67,16 @@ function statusColor(status) {
 function line(text, options = {}) {
   return { text, ...options };
 }
+function deckRow(input) {
+  const prefix = input.active ? "\u25B8" : " ";
+  const label = input.label.toUpperCase().padEnd(10);
+  return line(`${prefix} ${label} ${input.detail}`, {
+    fg: input.active ? RIG_UI.lime : RIG_UI.ink2,
+    bold: input.active,
+    selectableIndex: input.index,
+    activateOnClick: input.activateOnClick
+  });
+}
 function makeSceneFrame(input) {
   return input;
 }
@@ -132,31 +142,34 @@ function runRow(width, run, index, active) {
   return line(`${prefix}${clip(run.title, titleWidth)}`, {
     fg: active ? RIG_UI.ink : statusColor(run.status),
     bold: active,
-    selectableIndex: index
+    selectableIndex: index,
+    activateOnClick: true
   });
 }
-function emptyRows(query, total) {
+function recoveryRows(selected, reason) {
+  return [
+    ...reason ? [line(reason, { fg: RIG_UI.yellow }), line("", { fg: RIG_UI.ink3 })] : [],
+    line("ACTIONS", { fg: RIG_UI.ink3, bold: true }),
+    deckRow({ label: "tasks", detail: "open tasks and dispatch work", index: 0, active: selected === 0, activateOnClick: true }),
+    deckRow({ label: "repair", detail: "repair project/server/auth link", index: 1, active: selected === 1, activateOnClick: true }),
+    deckRow({ label: "server", detail: "open server controls", index: 2, active: selected === 2, activateOnClick: true }),
+    deckRow({ label: "doctor", detail: "diagnose project", index: 3, active: selected === 3, activateOnClick: true })
+  ];
+}
+function emptyRows(query, total, selected) {
+  if (!query.trim() && total === 0)
+    return recoveryRows(selected, "No runs yet.");
   if (query.trim() && total > 0) {
     return [
-      line("No matching runs.", { fg: RIG_UI.ink2, bold: true }),
-      line(`search ${JSON.stringify(query)} returned 0/${total}`, { fg: RIG_UI.ink3 }),
-      line("escape clears search", { fg: RIG_UI.ink4 })
+      ...recoveryRows(selected, `No matching runs for ${JSON.stringify(query)} (${total} total).`)
     ];
   }
-  return [
-    line("No runs yet.", { fg: RIG_UI.ink2, bold: true }),
-    line("Open Tasks and dispatch work; live and completed runs appear here.", { fg: RIG_UI.ink3 }),
-    line("tab switches screens", { fg: RIG_UI.ink4 })
-  ];
+  return recoveryRows(selected, "No runs are visible with this filter.");
 }
-function degradedRows(state) {
+function degradedRows(state, selected) {
   if (!state.error)
     return [];
-  return [
-    line(`status: ${state.error.message}`, { fg: RIG_UI.red, bold: true }),
-    ...state.error.hint ? [line(state.error.hint, { fg: RIG_UI.yellow })] : [],
-    line("", { fg: RIG_UI.ink3 })
-  ];
+  return recoveryRows(selected, state.error.message);
 }
 function renderFleetScene(state, layout) {
   const width = panelWidth(layout);
@@ -165,21 +178,27 @@ function renderFleetScene(state, layout) {
   const runs = filterRunsForSearch(allRuns, query);
   const selectedRun = typeof state.data.selectedRunId === "string" && runs.some((run) => run.runId === state.data.selectedRunId) ? state.data.selectedRunId : runs[0]?.runId;
   const selectedIndex = Math.max(0, runs.findIndex((run) => run.runId === selectedRun));
+  const recoveryIndex = Math.max(0, Math.min(3, state.selection.index));
   const panelTop = 0;
   const contentWidth = Math.max(12, width - (layout?.compact ? 8 : 10));
   const panelLines = [
     line(`RUN       STATUS         TITLE`, { fg: RIG_UI.ink3, bold: true }),
     line("", { fg: RIG_UI.ink3 }),
-    ...degradedRows(state),
-    ...query.trim() ? [line(searchSummary("runs", query, runs.length, allRuns.length), { fg: RIG_UI.ink4 }), line("", { fg: RIG_UI.ink3 })] : [],
-    ...runs.length > 0 ? runs.map((run, index) => runRow(contentWidth, run, index, index === selectedIndex)) : emptyRows(query, allRuns.length)
+    ...runs.length > 0 ? [
+      ...degradedRows(state, recoveryIndex),
+      ...query.trim() ? [line(searchSummary("runs", query, runs.length, allRuns.length), { fg: RIG_UI.ink4 }), line("", { fg: RIG_UI.ink3 })] : [],
+      ...runs.map((run, index) => runRow(contentWidth, run, index, index === selectedIndex))
+    ] : state.error ? degradedRows(state, recoveryIndex) : [
+      ...query.trim() ? [line(searchSummary("runs", query, runs.length, allRuns.length), { fg: RIG_UI.ink4 }), line("", { fg: RIG_UI.ink3 })] : [],
+      ...emptyRows(query, allRuns.length, recoveryIndex)
+    ]
   ];
   return makeSceneFrame({
     scene: "fleet",
     title: "Runs",
     lines: [
       line("", { fg: RIG_UI.ink4 }),
-      line(query.trim() ? `   rig runs --search ${JSON.stringify(query)}` : "   rig runs", { fg: RIG_UI.ink3 })
+      line(query.trim() ? `   runs --search ${JSON.stringify(query)}` : "   runs", { fg: RIG_UI.ink3 })
     ],
     panels: [{
       id: "runs-list",
@@ -192,7 +211,7 @@ function renderFleetScene(state, layout) {
       opacity: 1,
       border: false,
       chrome: "ad-terminal",
-      headerText: query.trim() ? `rig runs --search ${JSON.stringify(query)}` : "rig runs",
+      headerText: query.trim() ? `runs --search ${JSON.stringify(query)}` : "runs",
       headerHeight: 3,
       paddingX: layout?.compact ? 2 : 3,
       paddingY: 1

package/dist/src/app-opentui/scenes/handoff.js

@@ -41,12 +41,6 @@ var styles = {
 function line(text, options = {}) {
   return { text, ...options };
 }
-function blank() {
-  return { text: "" };
-}
-function center(text, fg = RIG_UI.ink2, bold = false) {
-  return { text, fg, bold, align: "center" };
-}
 function deckRow(input) {
   const prefix = input.active ? "\u25B8" : " ";
   const label = input.label.toUpperCase().padEnd(10);
@@ -61,6 +55,83 @@ function makeSceneFrame(input) {
   return input;
 }
 
+// packages/cli/src/app-opentui/render/ascii-fleet.ts
+var LEAD_DRONE = [
+  "  .-=-.                   .-=-.   ",
+  " ( !!! )                 ( !!! )  ",
+  "  '-=-'._               _.'-=-'   ",
+  "        '._           _.'         ",
+  "           '=$$$$$$$=.'           ",
+  "          =$$$$$$$$$$$=           ",
+  "         $$$@@@@@@@@@@$$$         ",
+  "        $$$@@        @@$$$        ",
+  "        $$@    ?     @$$$         ",
+  "        $$$@   '-'   @$$$         ",
+  "        $$$@@        @@$$$        ",
+  "         $$$@@@@@@@@@@$$$         ",
+  "          =$$$$$$$$$$$=           ",
+  "           '=$$$$$$$=.'           ",
+  "        _.'           '._         ",
+  "  .-=-.'                 '.-=-.   ",
+  " ( !!! )                 ( !!! )  ",
+  "  '-=-'                   '-=-'   "
+];
+var MINI_DRONE = [
+  "(!!!)   (!!!)",
+  "  \\%==%/  ",
+  "   %%?%%   ",
+  "  /%==%\\  ",
+  "(!!!)   (!!!)"
+];
+var ROTORS = ["---", "\\\\\\", "|||", "///"];
+var FLEET_GRID_WIDTH = 52;
+var FLEET_GRID_HEIGHT = 27;
+var FLEET = [
+  { art: MINI_DRONE, x: 0, y: 2, amp: 1, speed: 0.05, phase: 0, dx: 1, driftSpeed: 0.02 },
+  { art: MINI_DRONE, x: 39, y: 2, amp: 1, speed: 0.044, phase: 2.1, dx: 1, driftSpeed: 0.017 },
+  { art: MINI_DRONE, x: 1, y: 20, amp: 1, speed: 0.048, phase: 4.2, dx: 1, driftSpeed: 0.023 },
+  { art: MINI_DRONE, x: 38, y: 20, amp: 1, speed: 0.041, phase: 1.3, dx: 1, driftSpeed: 0.015 },
+  { art: LEAD_DRONE, x: 10, y: 5, amp: 2, speed: 0.04, phase: 0, dx: 0, driftSpeed: 0.011 }
+];
+function fleetRows(tick, options = {}) {
+  const animate = options.animate ?? true;
+  const t2 = animate ? tick : 0;
+  const blade = ROTORS[Math.floor(t2 / 4) % ROTORS.length];
+  const pulse = Math.sin(t2 * 0.07);
+  const eye = pulse > 0.45 ? "@" : pulse > -0.1 ? "o" : ".";
+  const grid = Array.from({ length: FLEET_GRID_HEIGHT }, () => Array.from({ length: FLEET_GRID_WIDTH }, () => " "));
+  for (const drone of FLEET) {
+    const yOffset = drone.y + Math.round(drone.amp * Math.sin(t2 * drone.speed + drone.phase));
+    const xOffset = drone.x + Math.round(drone.dx * Math.sin(t2 * drone.driftSpeed + drone.phase));
+    for (let row = 0;row < drone.art.length; row += 1) {
+      const source = drone.art[row];
+      const targetY = yOffset + row;
+      if (targetY < 0 || targetY >= FLEET_GRID_HEIGHT)
+        continue;
+      for (let col = 0;col < source.length; col += 1) {
+        let char = source[col];
+        if (char === " ")
+          continue;
+        const targetX = xOffset + col;
+        if (targetX < 0 || targetX >= FLEET_GRID_WIDTH)
+          continue;
+        if (source.slice(col, col + 3) === "!!!") {
+          for (let rotorIndex = 0;rotorIndex < 3; rotorIndex += 1) {
+            if (targetX + rotorIndex < FLEET_GRID_WIDTH)
+              grid[targetY][targetX + rotorIndex] = blade[rotorIndex];
+          }
+          col += 2;
+          continue;
+        }
+        if (char === "?")
+          char = eye;
+        grid[targetY][targetX] = char;
+      }
+    }
+  }
+  return grid.map((row) => row.join("").replace(/\s+$/, ""));
+}
+
 // packages/cli/src/app-opentui/scenes/handoff.ts
 function handoffState(state) {
   const value = state.data.piAttach ?? state.data.handoff;
@@ -79,9 +150,32 @@ function terminalRail(snapshot) {
   const text = ` run ${snapshot.runId.slice(0, 8)} \xB7 bundled Pi \xB7 mouse wheel scroll \xB7 ctrl-] detach \xB7 ${snapshot.message ?? snapshot.status}`;
   return line(clip(text, snapshot.cols), { fg: RIG_UI.limeDim });
 }
-function terminalLines(snapshot) {
+function shouldShowTerminalPreloader(snapshot) {
+  if (snapshot.status !== "starting" && snapshot.status !== "running")
+    return false;
+  const nonEmptyLines = snapshot.lines.filter((entry) => entry.trim().length > 0).length;
+  return nonEmptyLines <= 4;
+}
+function terminalPreloaderLines(snapshot, tick) {
+  const bodyRows = Math.max(1, snapshot.rows - 1);
+  const existing = snapshot.lines.slice(0, bodyRows).map((text, index) => line(text, { fg: RIG_UI.ink, styledText: snapshot.styledLines?.[index] }));
+  const sprite = fleetRows(tick);
+  const top = Math.max(0, Math.floor((bodyRows - sprite.length) / 2));
+  const left = Math.max(0, Math.floor((snapshot.cols - FLEET_GRID_WIDTH) / 2));
+  for (let index = 0;index < sprite.length && top + index < existing.length; index += 1) {
+    const targetIndex = top + index;
+    const current = snapshot.lines[targetIndex] ?? "";
+    if (current.trim())
+      continue;
+    existing[targetIndex] = line(`${" ".repeat(left)}${sprite[index] ?? ""}`, {
+      fg: index >= 7 && index <= 18 ? RIG_UI.lime : RIG_UI.limeDim
+    });
+  }
+  return existing;
+}
+function terminalLines(snapshot, tick) {
   const hasVisibleOutput = snapshot.lines.some((entry) => entry.trim().length > 0);
-  const body = !hasVisibleOutput && snapshot.status === "running" ? [line(`starting bundled Pi for ${snapshot.runId.slice(0, 8)}\u2026`, { fg: RIG_UI.ink3 })] : snapshot.lines.map((text, index) => line(text, { fg: RIG_UI.ink, styledText: snapshot.styledLines?.[index] }));
+  const body = shouldShowTerminalPreloader(snapshot) ? terminalPreloaderLines(snapshot, tick) : !hasVisibleOutput && snapshot.status === "running" ? [line(`starting bundled Pi for ${snapshot.runId.slice(0, 8)}\u2026`, { fg: RIG_UI.ink3 })] : snapshot.lines.map((text, index) => line(text, { fg: RIG_UI.ink, styledText: snapshot.styledLines?.[index] }));
   return [...body, terminalRail(snapshot)];
 }
 function renderHandoffScene(state) {
@@ -97,7 +191,7 @@ function renderHandoffScene(state) {
         left: 0,
         width: terminal.cols,
         height: terminal.rows,
-        lines: terminalLines(terminal),
+        lines: terminalLines(terminal, state.tick),
         backgroundColor: "#050607",
         backgroundAlpha: 128,
         opacity: 1,
@@ -115,30 +209,51 @@ function renderHandoffScene(state) {
   const handoff = handoffState(state);
   const runId = handoff?.runId ?? terminal?.runId ?? (typeof state.data.selectedRunId === "string" ? state.data.selectedRunId : undefined);
   const status = handoff?.status ?? (runId ? "preparing" : "select-run");
-  const message = handoff?.message ?? (runId ? "ready to start bundled Pi inside Rig" : "choose a run before entering Pi");
+  const message = handoff?.message ?? (runId ? "ready to start bundled Pi inside this app" : "choose a run before entering Pi");
   const hasRun = Boolean(runId);
+  const selected = Math.max(0, Math.min(1, state.selection.index));
   return makeSceneFrame({
     scene: "handoff",
     title: "Pi handoff",
     lines: [
-      center(hasRun ? "PI" : "ATTACH", RIG_UI.ink, true),
-      center("Bundled Pi runs in this terminal. Rig only hosts the PTY.", RIG_UI.ink3),
-      blank(),
-      ...hasRun ? [
-        line(`  run       ${runId}`, { fg: RIG_UI.limeDim }),
-        line(`  status    ${status}`, { fg: status === "failed" ? RIG_UI.red : RIG_UI.cyan }),
-        line(`  message   ${message}`, { fg: RIG_UI.ink2 }),
-        blank(),
-        deckRow({ label: "attach", detail: "open bundled Pi", index: 0, active: true })
-      ] : [
-        line("  run       none selected", { fg: RIG_UI.yellow }),
-        line(`  message   ${message}`, { fg: RIG_UI.ink2 }),
-        blank(),
-        deckRow({ label: "runs", detail: "select a run first", index: 0, active: true })
-      ]
+      line("", { fg: RIG_UI.ink4 }),
+      line(`   ${hasRun ? "pi" : "attach"} \xB7 ${status}`, { fg: RIG_UI.ink3 })
     ],
-    footer: { run: runId ? `${runId.slice(0, 8)} handoff` : "select run", message: "real Pi only" },
-    typeBarPlaceholder: runId ? `attach ${runId.slice(0, 8)} \xB7 runs` : "runs \xB7 attach <run>",
+    panels: [{
+      id: "pi-handoff",
+      top: 0,
+      width: 96,
+      height: 16,
+      lines: [
+        line(hasRun ? "Bundled Pi handoff" : "Select a run before entering Pi", { fg: RIG_UI.ink, bold: true }),
+        ...hasRun ? [
+          line(`run     ${runId}`, { fg: RIG_UI.limeDim }),
+          line(`status  ${status}`, { fg: status === "failed" ? RIG_UI.red : RIG_UI.cyan }),
+          line(`message ${message}`, { fg: RIG_UI.ink2 }),
+          line("", { fg: RIG_UI.ink3 }),
+          line("ACTIONS", { fg: RIG_UI.ink3, bold: true }),
+          deckRow({ label: "attach", detail: "open bundled Pi", index: 0, active: selected === 0, activateOnClick: true }),
+          deckRow({ label: "runs", detail: "return to fleet", index: 1, active: selected === 1, activateOnClick: true })
+        ] : [
+          line(`message ${message}`, { fg: RIG_UI.ink2 }),
+          line("", { fg: RIG_UI.ink3 }),
+          line("ACTIONS", { fg: RIG_UI.ink3, bold: true }),
+          deckRow({ label: "runs", detail: "select a run first", index: 0, active: selected === 0, activateOnClick: true }),
+          deckRow({ label: "tasks", detail: "open tasks to dispatch work", index: 1, active: selected === 1, activateOnClick: true })
+        ]
+      ],
+      backgroundColor: RIG_UI.panel,
+      backgroundAlpha: 184,
+      opacity: 1,
+      border: false,
+      chrome: "ad-terminal",
+      headerText: hasRun ? "pi handoff" : "attach",
+      headerHeight: 3,
+      paddingX: 3,
+      paddingY: 1
+    }],
+    footer: { run: runId ? `${runId.slice(0, 8)} handoff` : "select run", message: "enter/click action" },
+    hideTypeBar: true,
     live: true
   });
 }