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

package/dist/src/app-opentui/render/image-visual-layer.js

@@ -2,7 +2,113 @@
 // packages/cli/src/app-opentui/render/image-visual-layer.ts
 import { Worker } from "worker_threads";
 import { deflateSync } from "zlib";
-import { allocateImageId, deleteKittyImage, getCapabilities } from "@earendil-works/pi-tui";
+import { allocateImageId, deleteKittyImage } from "@earendil-works/pi-tui";
+
+// packages/cli/src/app-opentui/terminal-capabilities.ts
+import { getCapabilities } from "@earendil-works/pi-tui";
+function getRigTerminalCapabilities() {
+  const imageProtocol = getCapabilities().images;
+  const supportsKittyImages = imageProtocol === "kitty";
+  return {
+    imageProtocol,
+    supportsKittyImages,
+    visualMode: supportsKittyImages ? "kitty-images" : "framebuffer-fallback"
+  };
+}
+
+// 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 t = animate ? tick : 0;
+  const blade = ROTORS[Math.floor(t / 4) % ROTORS.length];
+  const pulse = Math.sin(t * 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(t * drone.speed + drone.phase));
+    const xOffset = drone.x + Math.round(drone.dx * Math.sin(t * 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/render/panel-layout.ts
+function panelPixelPlacement(layout, panel, size, minPixels = 8) {
+  const cellW = size.width / layout.width;
+  const cellH = size.height / layout.height;
+  const leftCells = layout.centerLeft + (panel.left ?? 0);
+  const topCells = layout.centerTop + panel.top;
+  const widthCells = panel.width ?? layout.centerWidth;
+  const heightCells = panel.height;
+  const left = Math.round(leftCells * cellW);
+  const top = Math.round(topCells * cellH);
+  const width = Math.round(widthCells * cellW);
+  const height = Math.round(heightCells * cellH);
+  return width > minPixels && height > minPixels ? { left, top, width, height, leftCells, topCells, widthCells, heightCells } : null;
+}
+
+// packages/cli/src/app-opentui/render/image-visual-layer.ts
 var BG = [7, 8, 9, 255];
 var PANEL = [16, 17, 21, 184];
 var PANEL_HEADER = [16, 17, 21, 190];
@@ -16,12 +122,10 @@ var PNG_SIGNATURE = new Uint8Array([137, 80, 78, 71, 13, 10, 26, 10]);
 var CRC_TABLE = makeCrcTable();
 var MAX_IMAGE_BYTES = 48 * 1024 * 1024;
 var KITTY_CHUNK_SIZE = 4096;
-var PANEL_BLUR_SCALE = 5;
+var PANEL_BLUR_SCALE = 1;
 var PANEL_MASK_CACHE_LIMIT = 16;
 var ZLIB_LEVEL = 1;
 var DEFAULT_IMAGE_RESOLUTION_SCALE = 1;
-var DEFAULT_DRONE_LAYER_SCALE = 0.18;
-var DEFAULT_IMAGE_FPS = 24;
 var panelMaskCache = new Map;
 var BG_WORD = rgbaWord(BG);
 function imageTransport() {
@@ -36,24 +140,6 @@ function imageResolutionScale() {
     return Math.max(0.25, Math.min(1, raw));
   return DEFAULT_IMAGE_RESOLUTION_SCALE;
 }
-function droneLayerScale() {
-  const raw = Number.parseFloat(process.env.RIG_OPENTUI_DRONE_SCALE ?? "");
-  if (Number.isFinite(raw) && raw > 0)
-    return Math.max(0.15, Math.min(1, raw));
-  return DEFAULT_DRONE_LAYER_SCALE;
-}
-function scaledPixelSize(size, scale, layout) {
-  return {
-    width: Math.max(layout.width, Math.floor(size.width * scale)),
-    height: Math.max(layout.height, Math.floor(size.height * scale))
-  };
-}
-function imageFps() {
-  const raw = Number.parseFloat(process.env.RIG_OPENTUI_IMAGE_FPS ?? "");
-  if (Number.isFinite(raw) && raw > 0)
-    return Math.max(10, Math.min(60, raw));
-  return DEFAULT_IMAGE_FPS;
-}
 function rgbaWord(color) {
   return (color[3] << 24 | color[2] << 16 | color[1] << 8 | color[0]) >>> 0;
 }
@@ -69,6 +155,109 @@ function fillRgba(data, color, word = rgbaWord(color)) {
     data[i + 3] = color[3];
   }
 }
+var ASCII_GLYPHS = {
+  ".": ["00000", "00000", "00000", "00000", "00000", "00100", "00100"],
+  "'": ["00100", "00100", "00000", "00000", "00000", "00000", "00000"],
+  "-": ["00000", "00000", "00000", "11111", "00000", "00000", "00000"],
+  _: ["00000", "00000", "00000", "00000", "00000", "00000", "11111"],
+  "=": ["00000", "11111", "00000", "00000", "11111", "00000", "00000"],
+  "|": ["00100", "00100", "00100", "00100", "00100", "00100", "00100"],
+  "/": ["00001", "00010", "00010", "00100", "01000", "01000", "10000"],
+  "\\": ["10000", "01000", "01000", "00100", "00010", "00010", "00001"],
+  "(": ["00010", "00100", "01000", "01000", "01000", "00100", "00010"],
+  ")": ["01000", "00100", "00010", "00010", "00010", "00100", "01000"],
+  "!": ["00100", "00100", "00100", "00100", "00100", "00000", "00100"],
+  "%": ["11001", "11010", "00100", "01000", "10110", "00110", "00000"],
+  $: ["00100", "11110", "10100", "11110", "00101", "11110", "00100"],
+  "@": ["01110", "10001", "10111", "10101", "10111", "10000", "01111"],
+  o: ["00000", "01110", "10001", "10001", "10001", "01110", "00000"],
+  "*": ["00100", "10101", "01110", "11111", "01110", "10101", "00100"]
+};
+function sceneStaticTick(scene) {
+  let hash = 0;
+  for (let index = 0;index < scene.length; index += 1)
+    hash = hash * 33 + scene.charCodeAt(index) >>> 0;
+  return 11 + hash % 97;
+}
+function charColor(char, row, totalRows) {
+  if (char === "@" || char === "$" || char === "o")
+    return LIME;
+  if (char === "%" || char === "!" || char === "/" || char === "\\" || char === "|")
+    return CYAN;
+  if (char === "." || char === "'" || char === "_" || row < 3 || row > totalRows - 4)
+    return INK_DIM;
+  if (char === "-" || char === "=" || char === "(" || char === ")")
+    return LIME_DIM;
+  return MAGENTA;
+}
+function fillRectAlpha(data, width, height, left, top, rectWidth, rectHeight, color, alpha) {
+  const x0 = Math.max(0, Math.floor(left));
+  const y0 = Math.max(0, Math.floor(top));
+  const x1 = Math.min(width, Math.ceil(left + rectWidth));
+  const y1 = Math.min(height, Math.ceil(top + rectHeight));
+  for (let y = y0;y < y1; y += 1) {
+    for (let x = x0;x < x1; x += 1)
+      blendOver(data, (y * width + x) * 4, color, alpha);
+  }
+}
+function drawAsciiGlyph(data, width, height, x, y, cellWidth, cellHeight, char, color, alpha) {
+  const pattern = ASCII_GLYPHS[char] ?? ASCII_GLYPHS["*"];
+  const glyphWidth = Math.max(1, cellWidth * 0.56);
+  const glyphHeight = Math.max(1, cellHeight * 0.7);
+  const originX = x + (cellWidth - glyphWidth) * 0.5;
+  const originY = y + (cellHeight - glyphHeight) * 0.5;
+  const pixelWidth = Math.max(1, glyphWidth / pattern[0].length);
+  const pixelHeight = Math.max(1, glyphHeight / pattern.length);
+  for (let row = 0;row < pattern.length; row += 1) {
+    const bits = pattern[row];
+    for (let col = 0;col < bits.length; col += 1) {
+      if (bits[col] !== "1")
+        continue;
+      fillRectAlpha(data, width, height, originX + col * pixelWidth, originY + row * pixelHeight, pixelWidth * 0.72, pixelHeight * 0.72, color, alpha);
+    }
+  }
+}
+function drawStaticAsciiFleetBackground(data, width, height, scene, layout) {
+  const rows = fleetRows(sceneStaticTick(scene), { animate: true });
+  const cellWidth = width / Math.max(1, layout.width);
+  const cellHeight = height / Math.max(1, layout.height);
+  const leftCells = Math.floor((layout.width - FLEET_GRID_WIDTH) / 2);
+  const topCells = Math.floor((layout.height - FLEET_GRID_HEIGHT) / 2);
+  const fleetLeft = leftCells * cellWidth;
+  const fleetTop = topCells * cellHeight;
+  drawGlow(data, width, height, width * 0.5, height * 0.5, Math.min(width, height) * 0.4, LIME, 0.03);
+  drawGlow(data, width, height, width * 0.18, height * 0.22, Math.min(width, height) * 0.28, CYAN, 0.022);
+  drawGlow(data, width, height, width * 0.82, height * 0.78, Math.min(width, height) * 0.22, MAGENTA, 0.014);
+  for (let row = 0;row < rows.length; row += 1) {
+    const line = rows[row];
+    for (let col = 0;col < line.length; col += 1) {
+      const char = line[col];
+      if (char === " ")
+        continue;
+      const x = fleetLeft + col * cellWidth;
+      const y = fleetTop + row * cellHeight;
+      const color = charColor(char, row, rows.length);
+      drawAsciiGlyph(data, width, height, x + cellWidth * 0.07, y + cellHeight * 0.05, cellWidth, cellHeight, char, color, 0.52);
+      if (char === "@" || char === "$" || char === "%") {
+        drawGlow(data, width, height, x + cellWidth * 0.5, y + cellHeight * 0.5, Math.max(cellWidth, cellHeight) * 0.95, color, 0.02);
+      }
+    }
+  }
+}
+function applyStaticAtmosphere(data, width, height) {
+  const cx = width * 0.5;
+  const cy = height * 0.42;
+  const radius = Math.max(width, height) * 0.78;
+  for (let y = 0;y < height; y += 1) {
+    for (let x = 0;x < width; x += 1) {
+      const distance = Math.hypot(x - cx, y - cy) / radius;
+      const alpha = Math.max(0.1, Math.min(0.82, 0.12 + Math.pow(distance, 1.65) * 0.62));
+      blendOver(data, (y * width + x) * 4, BG, alpha);
+    }
+  }
+  drawGlow(data, width, height, width * 0.82, height * 0.04, Math.min(width, height) * 0.2, LIME, 0.03);
+  drawGlow(data, width, height, width * 0.12, height * 0.18, Math.min(width, height) * 0.16, CYAN, 0.022);
+}
 function makeCrcTable() {
   const table = new Uint32Array(256);
   for (let n = 0;n < 256; n += 1) {
@@ -139,9 +328,6 @@ function kittyImageSequence(base64, options) {
   }
   return chunks.join("");
 }
-function isModernImageTerminal(protocol) {
-  return protocol === "kitty";
-}
 function clampByte(value) {
   return Math.max(0, Math.min(255, Math.round(value)));
 }
@@ -153,23 +339,6 @@ function blendOver(data, index, color, alphaScale = 1) {
   data[index + 2] = clampByte(color[2] * alpha + data[index + 2] * inv);
   data[index + 3] = 255;
 }
-function drawDisc(data, width, height, cx, cy, radius, color, alpha = 1) {
-  const minX = Math.max(0, Math.floor(cx - radius));
-  const maxX = Math.min(width - 1, Math.ceil(cx + radius));
-  const minY = Math.max(0, Math.floor(cy - radius));
-  const maxY = Math.min(height - 1, Math.ceil(cy + radius));
-  for (let y = minY;y <= maxY; y += 1) {
-    for (let x = minX;x <= maxX; x += 1) {
-      const dx = x + 0.5 - cx;
-      const dy = y + 0.5 - cy;
-      const d = Math.sqrt(dx * dx + dy * dy);
-      if (d > radius)
-        continue;
-      const edge = Math.max(0, Math.min(1, radius - d));
-      blendOver(data, (y * width + x) * 4, color, alpha * Math.min(1, 0.35 + edge));
-    }
-  }
-}
 function drawGlow(data, width, height, cx, cy, radius, color, alpha = 0.18) {
   const minX = Math.max(0, Math.floor(cx - radius));
   const maxX = Math.min(width - 1, Math.ceil(cx + radius));
@@ -187,30 +356,6 @@ function drawGlow(data, width, height, cx, cy, radius, color, alpha = 0.18) {
     }
   }
 }
-function drawLine(data, width, height, x0, y0, x1, y1, color, alpha = 0.5, thickness = 1.4) {
-  const dx = x1 - x0;
-  const dy = y1 - y0;
-  const steps = Math.max(1, Math.ceil(Math.hypot(dx, dy) * 1.2));
-  for (let i = 0;i <= steps; i += 1) {
-    const t = i / steps;
-    drawDisc(data, width, height, x0 + dx * t, y0 + dy * t, thickness, color, alpha);
-  }
-}
-function drawDrone(data, width, height, x, y, scale, tick, color) {
-  const wobble = Math.sin(tick * 0.055) * scale * 0.35;
-  const cy = y + wobble;
-  drawGlow(data, width, height, x, cy, scale * 7, color, 0.18);
-  drawDisc(data, width, height, x, cy, scale * 1.45, color, 0.92);
-  drawDisc(data, width, height, x, cy, scale * 0.55, [235, 255, 176, 255], 0.85);
-  const arm = scale * 4.1;
-  const rotor = scale * 1.6;
-  const arms = [[-arm, -arm * 0.72], [arm, -arm * 0.72], [-arm, arm * 0.72], [arm, arm * 0.72]];
-  for (const [dx, dy] of arms) {
-    drawLine(data, width, height, x, cy, x + dx, cy + dy, color, 0.42, Math.max(1, scale * 0.22));
-    drawGlow(data, width, height, x + dx, cy + dy, rotor * 2.6, color, 0.1);
-    drawDisc(data, width, height, x + dx, cy + dy, rotor, color, 0.34 + 0.12 * Math.sin(tick * 0.15));
-  }
-}
 function roundRectAlpha(px, py, x, y, w, h, r) {
   const rx = Math.max(x + r, Math.min(px, x + w - r));
   const ry = Math.max(y + r, Math.min(py, y + h - r));
@@ -220,17 +365,7 @@ function roundRectAlpha(px, py, x, y, w, h, r) {
   return Math.max(0, Math.min(1, r + 0.75 - dist));
 }
 function panelRect(layout, panel, size) {
-  const cellW = size.width / layout.width;
-  const cellH = size.height / layout.height;
-  const leftCells = layout.centerLeft + (panel.left ?? 0);
-  const topCells = layout.centerTop + panel.top;
-  const widthCells = panel.width ?? layout.centerWidth;
-  const heightCells = panel.height;
-  const left = Math.round(leftCells * cellW);
-  const top = Math.round(topCells * cellH);
-  const width = Math.round(widthCells * cellW);
-  const height = Math.round(heightCells * cellH);
-  return width > 8 && height > 8 ? { left, top, width, height } : null;
+  return panelPixelPlacement(layout, panel, size);
 }
 function downsampleRegion(data, canvasW, canvasH, rect, scale) {
   const w = Math.max(1, Math.ceil(rect.width / scale));
@@ -379,7 +514,8 @@ function getPanelMask(width, height, rect, headerPx, blurScale) {
 function compositePanel(data, width, height, rect, headerPx) {
   const blurScale = PANEL_BLUR_SCALE;
   const sampled = downsampleRegion(data, width, height, rect, blurScale);
-  const blurred = blurRgb(sampled.pixels, sampled.width, sampled.height, 4);
+  const blurRadius = Math.max(8, Math.min(28, Math.round(Math.min(rect.width, rect.height) * 0.018)));
+  const blurred = blurRgb(sampled.pixels, sampled.width, sampled.height, blurRadius);
   const mask = getPanelMask(width, height, rect, headerPx, blurScale);
   for (let i = 0;i < mask.indices.length; i += 1) {
     const idx = mask.indices[i];
@@ -397,161 +533,10 @@ function compositePanel(data, width, height, rect, headerPx) {
     blendOver(data, mask.dividerIndices[i], PANEL_LINE, 0.28);
   }
 }
-function visualSceneKind(scene) {
-  if (scene === "tasks")
-    return "loop";
-  if (scene === "help")
-    return "carrier";
-  return "dispatch";
-}
-function seededUnit(seed) {
-  let value = seed >>> 0;
-  value = value * 1664525 + 1013904223 >>> 0;
-  return value / 4294967295;
-}
-function sceneCore(width, height, kind) {
-  if (kind === "dispatch")
-    return { x: width * 0.3, y: height * 0.45 };
-  if (kind === "carrier")
-    return { x: width * 0.5, y: height * 0.54 };
-  return { x: width * 0.09, y: height * 0.56 };
-}
-function dispatchLane(width, index, count) {
-  const a = seededUnit(28672 + index * 101);
-  const b = seededUnit(36864 + index * 131);
-  const c = seededUnit(45056 + index * 151);
-  const ang = (-0.9 + 1.8 * (index / Math.max(1, count - 1))) * (Math.PI * 0.5);
-  return { ang, len: width * (0.32 + a * 0.42), curve: (b - 0.5) * 0.7, phase: c * Math.PI * 2 };
-}
-function lanePoint(width, height, lane, p, kind = "dispatch") {
-  const core = sceneCore(width, height, kind);
-  const dist = lane.len * p;
-  const bend = Math.sin(p * Math.PI) * lane.curve * Math.min(width, height) * 0.035;
-  const ux = Math.cos(lane.ang);
-  const uy = Math.sin(lane.ang);
-  return { x: core.x + ux * dist + -uy * bend, y: core.y + uy * dist + ux * bend };
-}
-function drawMarketingRails(data, width, height, kind, tick) {
-  const ys = kind === "loop" ? [0.18, 0.5, 0.82] : kind === "carrier" ? [0.24, 0.54, 0.82] : [0.18, 0.58, 0.82];
-  ys.forEach((ratio, index) => {
-    const y = height * ratio + Math.sin(tick * 0.018 + index) * Math.max(2, height * 0.0025);
-    const color = index === 2 ? CYAN : index === 1 ? LIME : LIME_DIM;
-    drawLine(data, width, height, width * 0.06, y, width * 0.94, y + Math.sin(index) * height * 0.002, color, index === 1 ? 0.11 : 0.07, Math.max(0.8, height * 0.0012));
-    for (let p = (tick * 0.004 + index * 0.21) % 1;p < 1; p += 0.18 + index * 0.02) {
-      const x = width * (0.06 + 0.88 * p);
-      drawDisc(data, width, height, x, y, Math.max(1.2, height * (0.0017 + index * 0.0004)), color, 0.24);
-      drawGlow(data, width, height, x, y, Math.max(5, height * 0.006), color, 0.035);
-    }
-  });
-}
-function drawDispatchScene(data, width, height, tick) {
-  const core = sceneCore(width, height, "dispatch");
-  const min = Math.min(width, height);
-  drawGlow(data, width, height, core.x, core.y, min * 0.085, LIME, 0.12);
-  drawDisc(data, width, height, core.x, core.y, min * 0.0065, LIME, 0.85);
-  const laneCount = width < 1000 ? 7 : 12;
-  const lanes = Array.from({ length: laneCount }, (_, index) => dispatchLane(width, index, laneCount));
-  lanes.forEach((lane) => {
-    let prev = lanePoint(width, height, lane, 0);
-    for (let step = 1;step <= 32; step += 1) {
-      const next = lanePoint(width, height, lane, step / 32);
-      drawLine(data, width, height, prev.x, prev.y, next.x, next.y, lane.phase > Math.PI ? CYAN : LIME_DIM, 0.045, Math.max(0.7, min * 0.0009));
-      prev = next;
-    }
-  });
-  const packets = width < 1000 ? 70 : 150;
-  for (let i = 0;i < packets; i += 1) {
-    const lane = lanes[i % lanes.length];
-    const speed = 0.003 + seededUnit(12288 + i * 17) * 0.009;
-    const p = (seededUnit(16384 + i * 19) + tick * speed) % 1;
-    const pt = lanePoint(width, height, lane, p);
-    const wobble = (seededUnit(20480 + i * 23) - 0.5) * min * 0.012;
-    const fade = p < 0.1 ? p / 0.1 : p > 0.88 ? (1 - p) / 0.12 : 1;
-    const color = seededUnit(24576 + i * 29) < 0.22 ? CYAN : LIME_DIM;
-    const y = pt.y + wobble * Math.sin(p * Math.PI * 2);
-    drawLine(data, width, height, pt.x - min * 0.012, y - min * 0.002, pt.x, y, color, 0.08 * fade, Math.max(0.7, min * 0.0008));
-    drawDisc(data, width, height, pt.x, y, Math.max(1.3, min * 0.0022), color, 0.5 * fade);
-    drawGlow(data, width, height, pt.x, y, Math.max(4, min * 0.008), color, 0.045 * fade);
-  }
-  for (let i = 0;i < (width < 1000 ? 4 : 8); i += 1) {
-    const lane = lanes[i % lanes.length];
-    const p = (tick * 0.002 + i * 0.13) % 1;
-    const pt = lanePoint(width, height, lane, p);
-    drawDrone(data, width, height, pt.x, pt.y + Math.sin(tick * 0.04 + i) * min * 0.004, min * (0.006 + i % 2 * 0.0015), tick + i * 11, i % 3 === 0 ? CYAN : LIME_DIM);
-  }
-}
-function drawLoopScene(data, width, height, tick) {
-  const min = Math.min(width, height);
-  const y = height * 0.56;
-  const x0 = width * 0.09;
-  const x1 = width * 0.91;
-  drawLine(data, width, height, x0, y, x1, y, LIME_DIM, 0.12, Math.max(0.8, min * 0.001));
-  const gates = width < 1000 ? 4 : 5;
-  const active = Math.floor(tick / 16) % gates;
-  for (let i = 0;i < gates; i += 1) {
-    const x = x0 + (x1 - x0) * (i / Math.max(1, gates - 1));
-    const color = i === active ? LIME : i <= active ? LIME_DIM : INK_DIM;
-    drawLine(data, width, height, x, y - min * 0.05, x, y + min * 0.05, color, i === active ? 0.25 : 0.08, Math.max(0.8, min * 0.001));
-    drawDisc(data, width, height, x, y, i === active ? min * 0.006 : min * 0.0035, color, i === active ? 0.72 : 0.25);
-    drawGlow(data, width, height, x, y, i === active ? min * 0.018 : min * 0.01, color, i === active ? 0.1 : 0.035);
-  }
-  const packets = width < 1000 ? 36 : 84;
-  for (let i = 0;i < packets; i += 1) {
-    const p = (seededUnit(33024 + i * 13) + tick * (0.0022 + seededUnit(33280 + i * 17) * 0.004)) % 1;
-    const x = x0 + (x1 - x0) * p;
-    const segment = Math.min(gates - 1, Math.floor(p * gates));
-    const color = segment < active ? LIME_DIM : segment === active ? CYAN : INK_DIM;
-    const py = y + (seededUnit(33536 + i * 19) - 0.5) * min * 0.018 * Math.sin(p * Math.PI * 2);
-    drawLine(data, width, height, x - min * 0.014, py, x, py, color, 0.1, Math.max(0.7, min * 0.0008));
-    drawDisc(data, width, height, x, py, Math.max(1.2, min * 0.002), color, color === INK_DIM ? 0.22 : 0.58);
-  }
-  drawDrone(data, width, height, x0 + (x1 - x0) * (tick * 0.003 % 1), y - min * 0.04, min * 0.0065, tick, LIME_DIM);
-  drawDrone(data, width, height, x0 + (x1 - x0) * ((tick * 0.002 + 0.5) % 1), y + min * 0.036, min * 0.0055, tick + 40, MAGENTA);
-}
-function drawCarrierScene(data, width, height, tick) {
-  const min = Math.min(width, height);
-  const core = sceneCore(width, height, "carrier");
-  drawGlow(data, width, height, core.x, core.y, min * 0.075, LIME, 0.12);
-  drawDisc(data, width, height, core.x, core.y, min * 0.0065, LIME, 0.92);
-  const nodes = width < 1000 ? 5 : 7;
-  const rx = width * 0.36;
-  const ry = height * 0.22;
-  for (let i = 0;i < nodes; i += 1) {
-    const a = i / nodes * Math.PI * 2 - Math.PI / 2 + tick * 0.006;
-    const x = core.x + Math.cos(a) * rx;
-    const y = core.y + Math.sin(a) * ry;
-    const color = i % 2 ? CYAN : LIME_DIM;
-    drawLine(data, width, height, core.x, core.y, x, y, color, 0.055, Math.max(0.7, min * 0.0008));
-    drawGlow(data, width, height, x, y, min * 0.018, color, 0.055);
-    drawDisc(data, width, height, x, y, min * 0.0048, color, 0.62);
-    drawDrone(data, width, height, x, y - min * 0.018, min * 0.005, tick + i * 9, color);
-  }
-  const packets = width < 1000 ? 30 : 72;
-  for (let i = 0;i < packets; i += 1) {
-    const lane = i % nodes;
-    const a = lane / nodes * Math.PI * 2 - Math.PI / 2 + tick * 0.006;
-    const nx = core.x + Math.cos(a) * rx;
-    const ny = core.y + Math.sin(a) * ry;
-    const p = (seededUnit(37120 + i * 37) + tick * (0.003 + seededUnit(37376 + i * 43) * 0.009)) % 1;
-    const x = core.x + (nx - core.x) * p;
-    const y = core.y + (ny - core.y) * p;
-    const color = seededUnit(37632 + i * 47) < 0.35 ? CYAN : LIME_DIM;
-    drawDisc(data, width, height, x, y, Math.max(1.2, min * 0.002), color, 0.48);
-    drawGlow(data, width, height, x, y, min * 0.008, color, 0.035);
-  }
-}
-function drawBackground(data, width, height, tick, scene) {
+function drawBackground(data, width, height, _tick, scene, layout) {
   fillRgba(data, BG, BG_WORD);
-  const kind = visualSceneKind(scene);
-  drawGlow(data, width, height, width * 0.82, height * 0.04, Math.min(width, height) * 0.22, LIME, 0.035);
-  drawGlow(data, width, height, width * 0.12, height * 0.18, Math.min(width, height) * 0.17, CYAN, 0.025);
-  drawMarketingRails(data, width, height, kind, tick);
-  if (kind === "loop")
-    drawLoopScene(data, width, height, tick);
-  else if (kind === "carrier")
-    drawCarrierScene(data, width, height, tick);
-  else
-    drawDispatchScene(data, width, height, tick);
+  drawStaticAsciiFleetBackground(data, width, height, scene, layout);
+  applyStaticAtmosphere(data, width, height);
 }
 function imageVisualFrameKey(input) {
   const width = Math.max(1, Math.floor(input.pixelSize.width));
@@ -576,14 +561,76 @@ function encodeKittyFrame(width, height, data, input) {
     compressed: true
   });
 }
+function cropRgba(data, sourceWidth, rect) {
+  const out = new Uint8ClampedArray(rect.width * rect.height * 4);
+  for (let y = 0;y < rect.height; y += 1) {
+    const sourceStart = ((rect.top + y) * sourceWidth + rect.left) * 4;
+    out.set(data.subarray(sourceStart, sourceStart + rect.width * 4), y * rect.width * 4);
+  }
+  return out;
+}
+function encodePanelPatch(data, sourceWidth, placement, imageId, zIndex) {
+  const patch = cropRgba(data, sourceWidth, placement);
+  const png = encodePng(placement.width, placement.height, patch);
+  const sequence = kittyImageSequence(png.toString("base64"), {
+    columns: Math.max(1, Math.round(placement.widthCells)),
+    rows: Math.max(1, Math.round(placement.heightCells)),
+    imageId,
+    zIndex,
+    format: 100
+  });
+  return `\x1B[${Math.max(1, Math.round(placement.topCells) + 1)};${Math.max(1, Math.round(placement.leftCells) + 1)}H${sequence}`;
+}
 function renderImageVisualFrame(input) {
   const width = Math.max(1, Math.floor(input.pixelSize.width));
   const height = Math.max(1, Math.floor(input.pixelSize.height));
   const byteCount = width * height * 4;
   if (byteCount > MAX_IMAGE_BYTES)
     return null;
+  const layer = input.layer ?? "full";
   const data = new Uint8ClampedArray(byteCount);
-  drawBackground(data, width, height, input.tick, input.scene);
+  drawBackground(data, width, height, 0, input.scene, input.layout);
+  if (layer === "split") {
+    const sequences = [encodeKittyFrame(width, height, data, input)];
+    let panelIndex = 0;
+    for (const panel of input.panels) {
+      if (panel.chrome !== "ad-terminal")
+        continue;
+      const placement = panelPixelPlacement(input.layout, panel, { width, height });
+      if (!placement)
+        continue;
+      const cellH = height / input.layout.height;
+      const headerPx = Math.max(cellH * 3, (panel.headerHeight ?? 3) * cellH);
+      compositePanel(data, width, height, placement, headerPx);
+      const imageId = input.imageIds?.[panelIndex] ?? (input.imageId + 1000 + panelIndex >>> 0 || panelIndex + 1);
+      sequences.push(encodePanelPatch(data, width, placement, imageId, -12));
+      panelIndex += 1;
+    }
+    return { key: imageVisualFrameKey(input), sequence: sequences.join("") };
+  }
+  if (layer === "panel-chrome")
+    return { key: imageVisualFrameKey(input), sequence: "" };
+  if (layer === "background") {
+    return { key: imageVisualFrameKey(input), sequence: encodeKittyFrame(width, height, data, input) };
+  }
+  if (layer === "panel-patches") {
+    const sequences = [];
+    let panelIndex = 0;
+    for (const panel of input.panels) {
+      if (panel.chrome !== "ad-terminal")
+        continue;
+      const placement = panelPixelPlacement(input.layout, panel, { width, height });
+      if (!placement)
+        continue;
+      const cellH = height / input.layout.height;
+      const headerPx = Math.max(cellH * 3, (panel.headerHeight ?? 3) * cellH);
+      compositePanel(data, width, height, placement, headerPx);
+      const imageId = input.imageIds?.[panelIndex] ?? (input.imageId + 1000 + panelIndex >>> 0 || panelIndex + 1);
+      sequences.push(encodePanelPatch(data, width, placement, imageId, input.zIndex));
+      panelIndex += 1;
+    }
+    return { key: imageVisualFrameKey(input), sequence: sequences.join("") };
+  }
   for (const panel of input.panels) {
     if (panel.chrome !== "ad-terminal")
       continue;
@@ -596,8 +643,11 @@ function renderImageVisualFrame(input) {
   }
   return { key: imageVisualFrameKey(input), sequence: encodeKittyFrame(width, height, data, input) };
 }
+function shouldRenderImagesInline() {
+  return process.env.RIG_OPENTUI_IMAGE_WORKER === "0" || import.meta.url.includes("$bunfs");
+}
 function createImageWorker() {
-  if (process.env.RIG_OPENTUI_IMAGE_WORKER === "0")
+  if (shouldRenderImagesInline())
     return null;
   const isTypeScriptRuntime = import.meta.url.endsWith(".ts");
   const workerUrl = new URL(isTypeScriptRuntime ? "./image-visual-layer-worker.ts" : "./image-visual-layer-worker.js", import.meta.url);
@@ -613,24 +663,8 @@ function createImageWorker() {
   }
 }
 var RECENT_WRITTEN_LIMIT = 24;
-var DEFAULT_PANEL_FPS = 24;
-var DEFAULT_PANEL_LAYER_SCALE = 0.22;
 var DEFAULT_IMAGE_OUTPUT_BACKLOG_BYTES = 256 * 1024;
 var DEFAULT_IMAGE_OUTPUT_BYTES_PER_SECOND = 850 * 1024;
-var MIN_BACKGROUND_BUDGET_BYTES = 24 * 1024;
-var MIN_PANEL_BUDGET_BYTES = 56 * 1024;
-function panelFps() {
-  const raw = Number.parseFloat(process.env.RIG_OPENTUI_PANEL_FPS ?? "");
-  if (Number.isFinite(raw) && raw > 0)
-    return Math.max(4, Math.min(60, raw));
-  return DEFAULT_PANEL_FPS;
-}
-function panelLayerScale() {
-  const raw = Number.parseFloat(process.env.RIG_OPENTUI_PANEL_SCALE ?? "");
-  if (Number.isFinite(raw) && raw > 0)
-    return Math.max(0.18, Math.min(1, raw));
-  return DEFAULT_PANEL_LAYER_SCALE;
-}
 function imageOutputBacklogBytes() {
   const raw = Number.parseInt(process.env.RIG_OPENTUI_IMAGE_BACKLOG_BYTES ?? "", 10);
   if (Number.isFinite(raw) && raw > 0)
@@ -652,36 +686,30 @@ class ImageVisualLayer {
   panelImageIds = Array.from({ length: 8 }, () => allocateImageId());
   panelChromeImageIds = Array.from({ length: 8 }, () => allocateImageId());
   stdout;
+  onFrameReady;
   protocol;
   transport = imageTransport();
-  frameIntervalMs = 1000 / imageFps();
-  panelIntervalMs = 1000 / panelFps();
   maxOutputBacklogBytes = imageOutputBacklogBytes();
   outputBytesPerSecond = imageOutputBytesPerSecond();
   outputBudgetBytes = imageOutputBytesPerSecond();
   lastBudgetAtMs = Date.now();
   motionSlot = this.createSlot();
-  panelSlot = this.createSlot();
-  chromeSlot = this.createSlot();
+  workersStarted = false;
   pendingFrames = new Map;
   recentWrittenKeys = [];
   imagesVisible = false;
+  flushPaused = false;
   requestId = 0;
-  lastMotionFrameIndex = -1;
-  lastPanelFrameIndex = -1;
-  lastChromeKey = "";
+  lastBackgroundKey = "";
+  fatalWorkerError = null;
   destroyed = false;
-  constructor(stdout = process.stdout) {
+  constructor(stdout = process.stdout, onFrameReady) {
     this.stdout = stdout;
-    this.protocol = getCapabilities().images;
-    if (this.enabled) {
-      this.startWorker(this.motionSlot);
-      this.startWorker(this.panelSlot);
-      this.startWorker(this.chromeSlot);
-    }
+    this.onFrameReady = onFrameReady;
+    this.protocol = getRigTerminalCapabilities().imageProtocol;
   }
   get enabled() {
-    return isModernImageTerminal(this.protocol);
+    return this.protocol === "kitty";
   }
   clear() {
     if (this.enabled) {
@@ -691,16 +719,10 @@ class ImageVisualLayer {
       this.pendingFrames.clear();
       this.recentWrittenKeys.length = 0;
       this.resetSlot(this.motionSlot);
-      this.resetSlot(this.panelSlot);
-      this.resetSlot(this.chromeSlot);
-      this.lastMotionFrameIndex = -1;
-      this.lastPanelFrameIndex = -1;
-      this.lastChromeKey = "";
+      this.lastBackgroundKey = "";
       this.outputBudgetBytes = this.outputBytesPerSecond;
       this.lastBudgetAtMs = Date.now();
       this.motionSlot.clearedThroughRequestId = this.requestId;
-      this.panelSlot.clearedThroughRequestId = this.requestId;
-      this.chromeSlot.clearedThroughRequestId = this.requestId;
     }
   }
   destroy() {
@@ -708,19 +730,31 @@ class ImageVisualLayer {
       return;
     this.clear();
     this.destroyed = true;
-    const workers = [this.motionSlot.worker, this.panelSlot.worker, this.chromeSlot.worker];
+    const workers = [this.motionSlot.worker];
     this.motionSlot.worker = null;
-    this.panelSlot.worker = null;
-    this.chromeSlot.worker = null;
     for (const worker of workers)
       if (worker)
         worker.terminate().catch(() => {
           return;
         });
   }
+  setFlushPaused(paused) {
+    this.flushPaused = paused;
+  }
+  isReady(input) {
+    if (!this.enabled || this.destroyed)
+      return true;
+    this.throwIfFatal();
+    const splitKey = imageVisualFrameKey({ ...input, tick: 0, layer: "split" });
+    return this.recentWrittenKeys.includes(splitKey) || Array.from(this.pendingFrames.values()).some((frame) => frame.key === splitKey);
+  }
   render(input) {
     if (!this.enabled || this.destroyed)
       return;
+    this.throwIfFatal();
+    if (this.transport !== "png")
+      this.failWorker("renderer", new Error("OpenTUI image visuals require PNG transport for static-background rendering."));
+    this.ensureWorkersStarted();
     const width = Math.max(1, Math.floor(input.pixelSize.width));
     const height = Math.max(1, Math.floor(input.pixelSize.height));
     if (width * height * 4 > MAX_IMAGE_BYTES)
@@ -728,54 +762,32 @@ class ImageVisualLayer {
     if (this.isOutputBackedUp())
       return;
     this.refillOutputBudget();
-    const now = Date.now();
-    const visualTick = Math.floor(now / (1000 / 60));
-    const useDynamicSplit = Boolean(this.motionSlot.worker && this.panelSlot.worker && this.chromeSlot.worker && this.transport === "png" && process.env.RIG_OPENTUI_DYNAMIC_SPLIT !== "0");
-    if (!useDynamicSplit) {
-      const frameIndex = Math.floor(now / this.frameIntervalMs);
-      if (!input.force && frameIndex === this.lastMotionFrameIndex)
-        return;
-      this.scheduleRender(this.motionSlot, { ...input, tick: visualTick, layer: "full" }, this.imageId, -10, input.force);
-      this.lastMotionFrameIndex = frameIndex;
-      return;
-    }
-    const motionFrameIndex = Math.floor(now / this.frameIntervalMs);
-    if ((input.force || motionFrameIndex !== this.lastMotionFrameIndex) && this.outputBudgetBytes >= MIN_BACKGROUND_BUDGET_BYTES) {
-      this.scheduleRender(this.motionSlot, { ...input, pixelSize: scaledPixelSize(input.pixelSize, droneLayerScale(), input.layout), panels: [], tick: visualTick, layer: "background" }, this.imageId, -30, input.force);
-      this.lastMotionFrameIndex = motionFrameIndex;
-    }
-    const panelFrameIndex = Math.floor(now / this.panelIntervalMs);
-    if ((input.force || panelFrameIndex !== this.lastPanelFrameIndex) && this.outputBudgetBytes >= MIN_PANEL_BUDGET_BYTES) {
-      this.scheduleRender(this.panelSlot, { ...input, pixelSize: scaledPixelSize(input.pixelSize, panelLayerScale(), input.layout), tick: visualTick, layer: "panel-patches" }, this.imageId, -12, input.force, this.panelImageIds);
-      this.lastPanelFrameIndex = panelFrameIndex;
-    }
-    const chromeInput = { ...input, tick: 0, layer: "panel-chrome" };
-    const chromeKey = imageVisualFrameKey(chromeInput);
-    if (input.force || chromeKey !== this.lastChromeKey) {
-      this.scheduleRender(this.chromeSlot, chromeInput, this.imageId, -8, input.force, this.panelChromeImageIds);
-      this.lastChromeKey = chromeKey;
+    const splitInput = { ...input, tick: 0, layer: "split" };
+    const splitKey = imageVisualFrameKey(splitInput);
+    if (input.force || splitKey !== this.lastBackgroundKey) {
+      this.scheduleRender(this.motionSlot, splitInput, this.imageId, -30, input.force, this.panelImageIds);
+      this.lastBackgroundKey = splitKey;
     }
   }
   flush() {
+    this.throwIfFatal();
+    if (this.flushPaused)
+      return false;
     if (this.pendingFrames.size === 0)
       return false;
     this.refillOutputBudget();
     if (this.isOutputBackedUp()) {
-      const chrome = this.pendingFrames.get("panel-chrome");
+      const retainedSplit = this.pendingFrames.get("split");
       this.pendingFrames.clear();
-      if (chrome)
-        this.pendingFrames.set("panel-chrome", chrome);
+      if (retainedSplit)
+        this.pendingFrames.set("split", retainedSplit);
       return false;
     }
     const framePriority = (frame) => {
       const layer = pendingLayerKey(frame.key);
-      if (layer === "panel-chrome")
-        return 0;
-      if (layer === "background")
+      if (layer === "split")
         return 1;
-      if (layer === "panel-patches")
-        return 2;
-      return 2;
+      return 4;
     };
     const frames = Array.from(this.pendingFrames.values()).sort((a, b) => framePriority(a) - framePriority(b));
     const prefix = "\x1B[?25l\x1B7\x1B[s\x1B[H";
@@ -787,12 +799,14 @@ class ImageVisualLayer {
     for (const frame of frames) {
       const candidate = sequence + frame.sequence;
       const candidateBytes = Buffer.byteLength(prefix + candidate + suffix);
-      if (candidateBytes <= this.outputBudgetBytes) {
+      const layer = pendingLayerKey(frame.key);
+      const allowOneStaticFrame = selected.length === 0 && layer === "split";
+      if (candidateBytes <= this.outputBudgetBytes || allowOneStaticFrame) {
         selected.push(frame);
         sequence = candidate;
         byteLength = candidateBytes;
-      } else if (pendingLayerKey(frame.key) === "panel-chrome") {
-        retained.set(pendingLayerKey(frame.key), frame);
+      } else if (layer === "split") {
+        retained.set(layer, frame);
       }
     }
     this.pendingFrames.clear();
@@ -811,7 +825,7 @@ class ImageVisualLayer {
     return accepted;
   }
   createSlot() {
-    return { worker: null, busy: false, queuedRequest: null, inFlightKey: "", queuedKey: "", clearedThroughRequestId: 0 };
+    return { worker: null, busy: false, queuedRequest: null, inFlightKey: "", queuedKey: "", clearedThroughRequestId: 0, latestRequestId: 0 };
   }
   resetSlot(slot) {
     slot.busy = false;
@@ -839,7 +853,23 @@ class ImageVisualLayer {
   isKnownKey(slot, key) {
     return this.recentWrittenKeys.includes(key) || Array.from(this.pendingFrames.values()).some((frame) => frame.key === key) || key === slot.inFlightKey || key === slot.queuedKey;
   }
+  ensureWorkersStarted() {
+    if (this.workersStarted)
+      return;
+    this.workersStarted = true;
+    this.startWorker(this.motionSlot, "static-visuals");
+  }
+  failWorker(name, error) {
+    const detail = error instanceof Error ? error.message : String(error);
+    this.fatalWorkerError ??= new Error(`OpenTUI image worker ${name} failed: ${detail}`);
+    throw this.fatalWorkerError;
+  }
+  throwIfFatal() {
+    if (this.fatalWorkerError)
+      throw this.fatalWorkerError;
+  }
   scheduleRender(slot, input, imageId, zIndex, force, imageIds) {
+    this.throwIfFatal();
     const key = imageVisualFrameKey(input);
     if (!force && this.isKnownKey(slot, key))
       return;
@@ -852,38 +882,41 @@ class ImageVisualLayer {
       requestId: ++this.requestId,
       key
     };
-    if (slot.worker) {
-      this.enqueueWorkerRender(slot, request);
+    slot.latestRequestId = request.requestId;
+    if (!slot.worker) {
+      this.renderInline(slot, request);
       return;
     }
-    this.renderSync(slot, request);
+    this.enqueueWorkerRender(slot, request);
   }
-  startWorker(slot) {
+  startWorker(slot, name) {
     const worker = createImageWorker();
     if (!worker)
       return;
     slot.worker = worker;
     worker.on("message", (message) => this.handleWorkerMessage(slot, message));
-    worker.once("error", () => this.disableWorker(slot));
-    worker.once("exit", () => this.disableWorker(slot));
-  }
-  disableWorker(slot) {
-    if (this.destroyed)
-      return;
-    slot.worker = null;
-    slot.busy = false;
-    slot.inFlightKey = "";
-    const queued = slot.queuedRequest;
-    slot.queuedRequest = null;
-    slot.queuedKey = "";
-    if (queued?.layer === "full")
-      this.renderSync(slot, queued);
+    worker.once("error", (error) => {
+      if (!this.destroyed)
+        this.fatalWorkerError ??= new Error(`OpenTUI image worker ${name} failed: ${error instanceof Error ? error.message : String(error)}`);
+    });
+    worker.once("exit", (code) => {
+      if (!this.destroyed)
+        this.fatalWorkerError ??= new Error(`OpenTUI image worker ${name} exited unexpectedly with code ${code}.`);
+    });
+  }
+  renderInline(slot, request) {
+    try {
+      const result = renderImageVisualFrame(request);
+      if (result?.sequence && !this.isKnownKey(slot, result.key) && (!this.isOutputBackedUp() || pendingLayerKey(result.key) === "split")) {
+        this.stageFrame({ key: result.key, sequence: result.sequence });
+        this.onFrameReady?.();
+      }
+    } catch (error) {
+      this.failWorker(String(request.layer ?? "visual"), error);
+    }
   }
   enqueueWorkerRender(slot, request) {
-    if (!slot.worker) {
-      this.renderSync(slot, request);
-      return;
-    }
+    this.throwIfFatal();
     if (slot.busy) {
       slot.queuedRequest = request;
       slot.queuedKey = request.key;
@@ -892,13 +925,16 @@ class ImageVisualLayer {
     this.dispatchWorkerRender(slot, request);
   }
   dispatchWorkerRender(slot, request) {
-    if (!slot.worker) {
-      this.renderSync(slot, request);
-      return;
-    }
+    this.throwIfFatal();
+    if (!slot.worker)
+      this.failWorker(String(request.layer ?? "visual"), new Error("worker is unavailable"));
     slot.busy = true;
     slot.inFlightKey = request.key;
-    slot.worker.postMessage(request);
+    try {
+      slot.worker.postMessage(request);
+    } catch (error) {
+      this.failWorker(String(request.layer ?? "visual"), error);
+    }
   }
   handleWorkerMessage(slot, message) {
     if (this.destroyed || !message || typeof message !== "object")
@@ -906,14 +942,14 @@ class ImageVisualLayer {
     const response = message;
     slot.busy = false;
     slot.inFlightKey = "";
-    if (response.requestId <= slot.clearedThroughRequestId)
-      return;
-    if (response.error) {
-      this.disableWorker(slot);
-      return;
-    }
-    if (response.sequence && !this.isKnownKey(slot, response.key) && (!this.isOutputBackedUp() || pendingLayerKey(response.key) === "panel-chrome")) {
-      this.stageFrame({ key: response.key, sequence: response.sequence });
+    const isStale = response.requestId <= slot.clearedThroughRequestId || response.requestId < slot.latestRequestId;
+    if (!isStale) {
+      if (response.error)
+        this.failWorker(pendingLayerKey(response.key), new Error(response.error));
+      if (response.sequence && !this.isKnownKey(slot, response.key) && (!this.isOutputBackedUp() || pendingLayerKey(response.key) === "split")) {
+        this.stageFrame({ key: response.key, sequence: response.sequence });
+        this.onFrameReady?.();
+      }
     }
     const next = slot.queuedRequest;
     slot.queuedRequest = null;
@@ -921,12 +957,6 @@ class ImageVisualLayer {
     if (next && !this.isKnownKey(slot, next.key))
       this.dispatchWorkerRender(slot, next);
   }
-  renderSync(slot, request) {
-    const result = renderImageVisualFrame(request);
-    if (!result || this.isKnownKey(slot, result.key) || this.isOutputBackedUp())
-      return;
-    this.stageFrame(result);
-  }
 }
 function pixelSizeForRenderer(renderer) {
   const resolution = renderer.resolution;
@@ -938,7 +968,7 @@ function pixelSizeForRenderer(renderer) {
   };
 }
 function forceModernImageVisuals() {
-  return isModernImageTerminal(getCapabilities().images);
+  return getRigTerminalCapabilities().supportsKittyImages;
 }
 export {
   renderImageVisualFrame,