ai-or-die 0.1.74 → 0.1.76

package/bin/ai-or-die.js

@@ -43,7 +43,9 @@ program
   .option('--no-sticky-notes', 'disable per-tab AI session summaries + auto tab titles (on by default)')
   .option('--sticky-notes-model-dir <path>', 'custom directory for the sticky-note model file')
   .option('--sticky-notes-model <url>', 'override the sticky-note model GGUF download URL')
-  .option('--sticky-notes-threads <number>', 'CPU threads for sticky-note inference (default: auto, max 4)');
+  .option('--sticky-notes-threads <number>', 'CPU threads for sticky-note inference (default: auto, max 4)')
+  .option('--no-keepalive', 'disable keeping the machine awake while the server runs (Windows only; on by default)')
+  .option('--keepalive-display', 'also keep the display on (default keeps the system awake but lets the monitor sleep)');
 
 // Auto-open is OFF by default and opt-in via --open. Legacy callers may still pass
 // --no-open (the old opt-out flag); filter it out so it parses harmlessly as a no-op.
@@ -123,6 +125,12 @@ async function main() {
       stickyNotesModelDir: options.stickyNotesModelDir || process.env.STICKY_NOTES_MODEL_DIR,
       stickyNotesModel: options.stickyNotesModel || process.env.STICKY_NOTES_MODEL,
       stickyNotesThreads: options.stickyNotesThreads || process.env.STICKY_NOTES_THREADS,
+      // Keep the host awake while the server runs (Windows only; on by default;
+      // --no-keepalive / AIORDIE_DISABLE_KEEPALIVE=1 disables). System-awake by
+      // default; --keepalive-display / AIORDIE_KEEPALIVE_DISPLAY=1 also holds
+      // the display on.
+      keepalive: options.keepalive !== false && process.env.AIORDIE_DISABLE_KEEPALIVE !== '1',
+      keepaliveDisplay: options.keepaliveDisplay === true || process.env.AIORDIE_KEEPALIVE_DISPLAY === '1',
     };
 
     console.log('Starting ai-or-die...');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ai-or-die",
-  "version": "0.1.74",
+  "version": "0.1.76",
   "description": "Universal AI coding terminal — Claude, Copilot, Gemini & more in your browser",
   "main": "src/server.js",
   "bin": {

package/src/keepalive-manager.js

@@ -0,0 +1,251 @@
+'use strict';
+
+const childProcess = require('child_process');
+const path = require('path');
+
+// Keep the host machine awake while the ai-or-die server runs (Windows 11).
+//
+// Mechanism: spawn ONE long-lived Windows PowerShell (5.1, in-box) helper that
+// P/Invokes SetThreadExecutionState from kernel32.dll to hold a power
+// assertion, then blocks on stdin. When the parent closes stdin (graceful
+// release) OR dies (the OS tears down the pipe -> ReadLine() returns null), the
+// helper clears the assertion and exits. Windows also drops a thread's
+// execution-state flags when the holding process dies, so even taskkill /F
+// cannot leak the assertion past reboot. No native deps, no powercfg.
+//
+// Windows-only by design; an instant no-op on macOS/Linux. See
+// docs/specs/keepalive.md and docs/adrs/0028-windows-keepalive.md.
+
+// SetThreadExecutionState flags as DECIMAL uint32 literals. PowerShell 5.1
+// parses 0x80000001 as a negative Int32 and the [uint32] cast then throws, so
+// the decimal forms are load-bearing (verified on a real Windows host):
+//   ES_CONTINUOUS       0x80000000 = 2147483648  (clear value, continuous alone)
+//   ES_SYSTEM_REQUIRED  0x00000001 -> system     = 2147483649
+//   ES_DISPLAY_REQUIRED 0x00000002 -> +display   = 2147483651
+const ES_CONTINUOUS = 2147483648;
+const ES_SYSTEM = 2147483649;
+const ES_SYSTEM_DISPLAY = 2147483651;
+
+const READY_TIMEOUT_MS = 5000;
+
+class KeepaliveManager {
+  constructor(options = {}) {
+    this._enabled = !!options.enabled;
+    this._keepDisplayOn = !!options.keepDisplayOn;
+    this._platform = options.platform || process.platform;
+    this._spawn = options.spawn || childProcess.spawn;
+    this._logger = options.logger || console;
+    this._readyTimeoutMs = options.readyTimeoutMs || READY_TIMEOUT_MS;
+
+    this._started = false;
+    this._child = null;
+    this._readyTimer = null;
+    // Stable reference so we can both add and remove the process 'exit' hook
+    // (a fresh closure each time would leak listeners across start/release).
+    this._exitHandler = null;
+    // Resolves true once the assertion is confirmed held, false on any failure
+    // (spawn error, early exit, or readiness timeout). Used only for a status
+    // log line; the lifecycle never awaits it.
+    this.ready = Promise.resolve(false);
+  }
+
+  // ---- pure builders (static so tests assert them without spawning) ----
+
+  static buildScript(displayRequired, ppid = process.pid) {
+    const assert = displayRequired ? ES_SYSTEM_DISPLAY : ES_SYSTEM;
+    return [
+      // 'Stop' is load-bearing: under Constrained Language Mode / WDAC /
+      // AppLocker / EDR, Add-Type (which writes a .cs to %TEMP% and shells to
+      // csc.exe) is blocked. With the default 'Continue', a blocked Add-Type
+      // would NOT exit -- PowerShell would fall into the infinite stdin loop
+      // and leak an immortal ~30-50MB process on every restart. 'Stop' makes
+      // the child die immediately so our handler fires and ready -> false.
+      `$ErrorActionPreference = 'Stop'`,
+      // Tag the command line with the parent PID (a trusted integer, never user
+      // input) so a stale/orphaned helper is identifiable for triage:
+      //   Get-CimInstance Win32_Process -Filter "Name='powershell.exe'"
+      `# aod-keepalive ppid=${ppid}`,
+      `Add-Type -Name P -Namespace W -MemberDefinition '[System.Runtime.InteropServices.DllImport("kernel32.dll")] public static extern uint SetThreadExecutionState(uint e);'`,
+      // exit 1 when the assertion is refused so the helper never blocks on
+      // stdin WITHOUT actually holding the assertion (which would otherwise
+      // latch us "started" while the machine can still sleep).
+      `if ([W.P]::SetThreadExecutionState([uint32]${assert}) -ne 0) { [Console]::Out.WriteLine('OK'); [Console]::Out.Flush() } else { [Console]::Error.WriteLine('SetThreadExecutionState returned 0'); exit 1 }`,
+      `while ($null -ne [Console]::In.ReadLine()) {}`,
+      `[void][W.P]::SetThreadExecutionState([uint32]${ES_CONTINUOUS})`,
+    ].join('\n');
+  }
+
+  static buildArgs(displayRequired, ppid = process.pid) {
+    return [
+      '-NoProfile',
+      '-NonInteractive',
+      // GPO machine-wide execution policy can otherwise block inline code /
+      // the Add-Type compilation step.
+      '-ExecutionPolicy', 'Bypass',
+      '-Command', KeepaliveManager.buildScript(displayRequired, ppid),
+    ];
+  }
+
+  // Absolute path to in-box Windows PowerShell 5.1 (PATH-hijack hardening --
+  // never resolve a bare "powershell.exe" off PATH).
+  static powershellPath() {
+    const root = process.env.SystemRoot || process.env.windir || 'C:\\Windows';
+    return path.join(root, 'System32', 'WindowsPowerShell', 'v1.0', 'powershell.exe');
+  }
+
+  // Acquire the wake assertion. No-op unless enabled on win32. Idempotent.
+  // Never throws -- keepalive must never break server startup.
+  start() {
+    if (this._started) return;
+    if (!this._enabled || this._platform !== 'win32') return;
+    this._started = true;
+
+    try {
+      const ps = KeepaliveManager.powershellPath();
+      const args = KeepaliveManager.buildArgs(this._keepDisplayOn);
+      const child = this._spawn(ps, args, {
+        stdio: ['pipe', 'pipe', 'pipe'],
+        windowsHide: true,
+        shell: false,
+      });
+      this._child = child;
+
+      // Never let the helper independently keep the parent's event loop alive
+      // (or revive the exit-134 native-teardown abort this repo has fought).
+      // unref() does NOT affect writability, so stdin stays usable by release()
+      // while unreferenced.
+      this._safe(() => child.unref());
+      this._safe(() => child.stdout && child.stdout.unref && child.stdout.unref());
+      this._safe(() => child.stderr && child.stderr.unref && child.stderr.unref());
+      this._safe(() => child.stdin && child.stdin.unref && child.stdin.unref());
+
+      // Capture the first stderr line so the failure warning can distinguish
+      // Constrained Language Mode (a PowerShell error) from an AV/EDR kill.
+      let firstErr = '';
+      if (child.stderr) {
+        this._safe(() => child.stderr.setEncoding && child.stderr.setEncoding('utf8'));
+        child.stderr.on('data', (d) => { if (!firstErr) firstErr = String(d).split('\n')[0].trim(); });
+        child.stderr.on('error', () => {});
+      }
+
+      // Per-start state, captured by the closures below so a stale child's
+      // late events can never mutate a newer run's state.
+      let settled = false;
+      let acquired = false;
+      let resolveReady;
+      this.ready = new Promise((res) => { resolveReady = res; });
+
+      // Declared with `let` so finishReady (defined next) can reference it and
+      // clear it; the timer is created after finishReady to keep ordering clear.
+      let timer = null;
+
+      const finishReady = (ok) => {
+        if (settled) return;
+        settled = true;
+        if (ok) acquired = true;
+        this._safe(() => clearTimeout(timer));
+        if (this._readyTimer === timer) this._readyTimer = null;
+        resolveReady(ok);
+      };
+
+      timer = setTimeout(() => finishReady(false), this._readyTimeoutMs);
+      if (timer.unref) timer.unref();
+      this._readyTimer = timer;
+
+      if (child.stdout) {
+        this._safe(() => child.stdout.setEncoding && child.stdout.setEncoding('utf8'));
+        let buf = '';
+        child.stdout.on('data', (d) => {
+          if (settled) return; // stop buffering once readiness is decided
+          buf += String(d);
+          if (/(^|\n)OK(\r?\n|$)/.test(buf)) finishReady(true);
+        });
+        child.stdout.on('error', () => {});
+      }
+
+      // Settle on 'close' (after all stdio has flushed) rather than 'exit' so
+      // firstErr is populated before the failure warning reads it. 'error'
+      // covers a spawn that never produced a process. The this._child === child
+      // guard makes a superseded/released child's late events a no-op.
+      const onGone = () => {
+        if (this._child !== child) return;
+        this._child = null;
+        this._started = false;
+        this._safe(() => clearTimeout(timer));
+        if (this._readyTimer === timer) this._readyTimer = null;
+        if (!settled) {
+          finishReady(false);
+        } else if (acquired) {
+          // Died AFTER holding the assertion (e.g. an AV/EDR kill hours in) and
+          // we did not initiate the release -> the machine can now sleep.
+          this._safe(() => this._logger.warn && this._logger.warn(
+            '⚠  keepalive: wake assertion lost — the helper exited; the machine may sleep. Restart ai-or-die or pass --no-keepalive.'));
+        }
+      };
+      child.on('error', onGone);
+      child.on('close', onGone);
+
+      // Guarantee release on EVERY exit path, including the ones that bypass
+      // close()/release(): uncaughtException and the bin outer-catch both call
+      // process.exit(1) without close(). A synchronous 'exit' hook, NOT a
+      // SIGINT/SIGTERM handler, so it cannot race the server's single
+      // handleShutdown owner -- it only closes a pipe. Re-registered idempotently
+      // (removeListener first) and removed in releaseSync to avoid leaking
+      // listeners across start/release cycles.
+      if (!this._exitHandler) {
+        this._exitHandler = () => { this._safe(() => this.releaseSync()); };
+      }
+      this._safe(() => process.removeListener('exit', this._exitHandler));
+      this._safe(() => process.once('exit', this._exitHandler));
+
+      this.ready.then((ok) => {
+        if (ok) {
+          this._safe(() => this._logger.log && this._logger.log(
+            'keepalive: holding wake assertion (system sleep prevented)'));
+        } else {
+          const hint = firstErr || 'powershell.exe unavailable or blocked (Constrained Language Mode / WDAC / AV)';
+          this._safe(() => this._logger.warn && this._logger.warn(
+            `⚠  keepalive: could not hold the wake assertion; the machine may sleep (${hint}). Disable with --no-keepalive.`));
+          // Reap a helper that timed out without exiting (e.g. SetThreadExecutionState
+          // returned 0 and it is blocked on stdin) so it cannot leak.
+          if (this._child === child) this._safe(() => this.releaseSync());
+        }
+      }).catch(() => {});
+    } catch (err) {
+      this._started = false;
+      this._child = null;
+      this._safe(() => this._logger.debug && this._logger.debug(
+        'keepalive: failed to start (continuing):', err && err.message));
+    }
+  }
+
+  // Async convenience wrapper; the real work is synchronous (just close a pipe).
+  release() {
+    this.releaseSync();
+    return Promise.resolve();
+  }
+
+  // Drop the assertion: closing stdin makes the helper hit EOF on ReadLine(),
+  // run its explicit clear, and exit; kill() is belt-and-suspenders. Idempotent
+  // and safe to call when never started or when the child is already dead (its
+  // body is fully guarded so it can never interrupt close()).
+  releaseSync() {
+    const child = this._child;
+    this._child = null;
+    this._started = false;
+    if (this._readyTimer) { this._safe(() => clearTimeout(this._readyTimer)); this._readyTimer = null; }
+    if (this._exitHandler) this._safe(() => process.removeListener('exit', this._exitHandler));
+    if (!child) return;
+    // end() sends a graceful EOF so the helper's ReadLine() returns null and the
+    // script runs its explicit ES_CONTINUOUS clear. Do NOT destroy() right after
+    // -- that would abort the pipe before the EOF flushes. kill() is the backstop.
+    this._safe(() => { if (child.stdin && !child.stdin.destroyed) child.stdin.end(); });
+    this._safe(() => child.kill());
+  }
+
+  _safe(fn) {
+    try { return fn(); } catch (_) { /* keepalive must never throw into the caller */ }
+  }
+}
+
+module.exports = KeepaliveManager;

package/src/public/app.js

@@ -191,6 +191,18 @@ class ClaudeCodeWebInterface {
         }
         
         await this.loadConfig();
+        // Apply per-machine identity (`[HOST] ai-or-die`) to the tab/window
+        // title, mobile menu header, aria-label, and PWA meta tags now that
+        // this.hostname is populated. Must run before the first notification
+        // flash, which saves/restores the then-current document.title.
+        if (window.AppIdentity) {
+            const identity = window.AppIdentity.formatAppIdentity({ hostname: this.hostname });
+            window.AppIdentity.applyAppIdentity(identity);
+            // Surface the machine identity on the start screen too.
+            const spIdText = document.getElementById('startPromptIdentityText');
+            const spId = document.getElementById('startPromptIdentity');
+            if (spIdText && spId) { spIdText.textContent = identity; spId.hidden = false; }
+        }
         this.setupTerminal();
         this._setupExtraKeys();
         this._setupOrientationHandler();
@@ -1929,19 +1941,34 @@ class ClaudeCodeWebInterface {
             });
         }
 
-        // Section collapse/expand (keyboard accessible)
-        modal.querySelectorAll('.setting-section-header').forEach((header) => {
-            const toggle = () => {
-                const section = header.parentElement;
-                const isCollapsed = section.classList.toggle('collapsed');
-                header.setAttribute('aria-expanded', String(!isCollapsed));
-            };
-            header.addEventListener('click', toggle);
-            header.addEventListener('keydown', (e) => {
-                if (e.key === 'Enter' || e.key === ' ') {
-                    e.preventDefault();
-                    toggle();
-                }
+        // Two-pane settings nav (ARIA tablist): switch panes, roving tabindex,
+        // arrow/Home/End keyboard support. Replaces the old collapsible sections.
+        const settingsTabs = Array.from(modal.querySelectorAll('.settings-tab'));
+        const selectSettingsTab = (tab, focus = true) => {
+            settingsTabs.forEach((t) => {
+                const selected = t === tab;
+                t.setAttribute('aria-selected', String(selected));
+                t.tabIndex = selected ? 0 : -1;
+                const pane = document.getElementById(t.getAttribute('aria-controls'));
+                if (pane) pane.hidden = !selected;
+            });
+            if (focus && tab) tab.focus();
+        };
+        settingsTabs.forEach((tab) => {
+            tab.addEventListener('click', () => selectSettingsTab(tab, false));
+            tab.addEventListener('keydown', (e) => {
+                // Navigate among VISIBLE tabs only (the Install tab is hidden
+                // when running as an installed PWA) so focus never lands on an
+                // invisible element and escapes the modal focus trap.
+                const visible = settingsTabs.filter((t) => t.style.display !== 'none' && !t.hidden);
+                const idx = visible.indexOf(tab);
+                if (idx === -1) return;
+                let next = null;
+                if (e.key === 'ArrowDown' || e.key === 'ArrowRight') next = visible[(idx + 1) % visible.length];
+                else if (e.key === 'ArrowUp' || e.key === 'ArrowLeft') next = visible[(idx - 1 + visible.length) % visible.length];
+                else if (e.key === 'Home') next = visible[0];
+                else if (e.key === 'End') next = visible[visible.length - 1];
+                if (next) { e.preventDefault(); selectSettingsTab(next); }
             });
         });
 
@@ -3917,11 +3944,15 @@ class ClaudeCodeWebInterface {
                 content.classList.remove('closing');
                 overlay.classList.remove('closing');
                 overlay.classList.remove('active');
-                overlay.style.display = 'none';
+                // Clear (don't set) the inline display so the modal hides via its
+                // base CSS rule (.<modal> { display: none }). Setting an inline
+                // display:none would win over `.active { display: flex }` and
+                // permanently block reopening the modal.
+                overlay.style.removeProperty('display');
             }, 150);
         } else {
             overlay.classList.remove('active');
-            overlay.style.display = 'none';
+            overlay.style.removeProperty('display');
         }
     }
 
@@ -4196,10 +4227,17 @@ class ClaudeCodeWebInterface {
         if (installBtn) installBtn.style.display = 'none';
         if (iosInstructions) iosInstructions.style.display = 'none';
 
-        // If running inside installed PWA, hide the entire section
-        const section = document.querySelector('[data-section="install"]');
-        if (section) {
-            section.style.display = this._isInstalled ? 'none' : '';
+        // If running inside an installed PWA, hide the Install tab + pane.
+        const installTab = document.getElementById('settingsTab-install');
+        const installPane = document.getElementById('settingsPane-install');
+        if (installTab) installTab.style.display = this._isInstalled ? 'none' : '';
+        if (installPane && this._isInstalled) installPane.hidden = true;
+        // If the Install tab was the active one and is now hidden, fall back to
+        // the first visible tab so the pane area is never left blank/unreachable.
+        if (this._isInstalled && installTab && installTab.getAttribute('aria-selected') === 'true') {
+            const firstVisible = Array.from(document.querySelectorAll('.settings-tab'))
+                .find((t) => t.style.display !== 'none');
+            if (firstVisible) firstVisible.click();
         }
 
         switch (this._installState) {

package/src/public/auth.js

@@ -133,7 +133,7 @@ class AuthManager {
             left: 0;
             right: 0;
             bottom: 0;
-            background: rgba(0, 0, 0, 0.95);
+            background: var(--overlay-backdrop-strong, rgba(0, 0, 0, 0.95));
             display: flex;
             align-items: center;
             justify-content: center;
@@ -143,12 +143,12 @@ class AuthManager {
         const loginForm = document.createElement('div');
         loginForm.style.cssText = `
             background: var(--bg-secondary, #1c2128);
-            border: 1px solid var(--border-color, #30363d);
+            border: 1px solid var(--border-default, #30363d);
             border-radius: 12px;
             padding: 32px;
             max-width: 400px;
             width: 90%;
-            box-shadow: 0 10px 50px rgba(0, 0, 0, 0.5);
+            box-shadow: var(--shadow-xl);
         `;
 
         loginForm.innerHTML = `
@@ -157,7 +157,7 @@ class AuthManager {
                 Authentication Required
             </h2>
             <p style="color: var(--text-secondary, #8b949e); margin: 0 0 24px 0; font-size: 14px;">
-                This ai-or-die instance requires authentication.
+                This instance requires authentication.
             </p>
             <form id="auth-form">
                 <div style="margin-bottom: 16px;">
@@ -172,7 +172,7 @@ class AuthManager {
                             width: 100%;
                             padding: 10px 12px;
                             background: var(--bg-primary, #0d1117);
-                            border: 1px solid var(--border-color, #30363d);
+                            border: 1px solid var(--border-default, #30363d);
                             border-radius: 6px;
                             color: var(--text-primary, #f0f6fc);
                             font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, 'JetBrains Mono', monospace;
@@ -183,7 +183,7 @@ class AuthManager {
                         required
                     />
                 </div>
-                <div id="auth-error" style="color: #f85149; margin-bottom: 16px; font-size: 14px; display: none;"></div>
+                <div id="auth-error" style="color: var(--status-error, #f85149); margin-bottom: 16px; font-size: 14px; display: none;"></div>
                 <button 
                     type="submit"
                     style="

package/src/public/components/buttons.css

@@ -163,7 +163,7 @@
     border: 2px solid var(--border);
     border-radius: 50%;
     cursor: pointer;
-    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
+    box-shadow: var(--shadow-md);
     transition: all var(--duration-slow, 300ms) var(--ease-default, cubic-bezier(0.4, 0, 0.2, 1));
     width: 56px;
     height: 56px;
@@ -173,7 +173,7 @@
     background-color: var(--bg-tertiary);
     border-color: var(--accent);
     transform: translateY(-2px);
-    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
+    box-shadow: var(--shadow-lg);
 }
 
 .mode-switcher-btn:active {
@@ -212,7 +212,7 @@
     border: 2px solid var(--error);
     border-radius: 50%;
     cursor: pointer;
-    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
+    box-shadow: var(--shadow-md);
     transition: all var(--duration-slow, 300ms) var(--ease-default, cubic-bezier(0.4, 0, 0.2, 1));
     width: 56px;
     height: 56px;
@@ -222,6 +222,7 @@
     background-color: var(--bg-tertiary);
     border-color: var(--color-red-400);
     transform: translateY(-2px);
+    /* Intentional red destructive-escape glow (not a neutral elevation shadow). */
     box-shadow: 0 6px 16px rgba(248, 113, 113, 0.2);
 }
 

package/src/public/components/cards.css

@@ -58,26 +58,26 @@
   transform: translateY(-1px);
 }
 
-/* Per-tool brand color hover tints */
+/* Per-tool brand color hover tints (tokens shared with the tab badges) */
 .tool-card[data-tool="terminal"]:hover:not(.disabled) {
-  border-color: rgba(113, 113, 122, 0.5);
-  background: rgba(113, 113, 122, 0.08);
+  border-color: rgba(var(--tool-terminal-rgb), 0.5);
+  background: rgba(var(--tool-terminal-rgb), 0.08);
 }
 .tool-card[data-tool="claude"]:hover:not(.disabled) {
-  border-color: rgba(217, 119, 6, 0.5);
-  background: rgba(217, 119, 6, 0.08);
+  border-color: rgba(var(--tool-claude-rgb), 0.5);
+  background: rgba(var(--tool-claude-rgb), 0.08);
 }
 .tool-card[data-tool="codex"]:hover:not(.disabled) {
-  border-color: rgba(5, 150, 105, 0.5);
-  background: rgba(5, 150, 105, 0.08);
+  border-color: rgba(var(--tool-codex-rgb), 0.5);
+  background: rgba(var(--tool-codex-rgb), 0.08);
 }
 .tool-card[data-tool="copilot"]:hover:not(.disabled) {
-  border-color: rgba(99, 102, 241, 0.5);
-  background: rgba(99, 102, 241, 0.08);
+  border-color: rgba(var(--tool-copilot-rgb), 0.5);
+  background: rgba(var(--tool-copilot-rgb), 0.08);
 }
 .tool-card[data-tool="gemini"]:hover:not(.disabled) {
-  border-color: rgba(37, 99, 235, 0.5);
-  background: rgba(37, 99, 235, 0.08);
+  border-color: rgba(var(--tool-gemini-rgb), 0.5);
+  background: rgba(var(--tool-gemini-rgb), 0.08);
 }
 
 /* Focus visible for keyboard navigation */
@@ -112,20 +112,20 @@
 
 /* Per-tool brand color hover for installable cards (softer than available) */
 .tool-card.installable[data-tool="claude"]:hover {
-  border-color: rgba(217, 119, 6, 0.3);
-  background: rgba(217, 119, 6, 0.04);
+  border-color: rgba(var(--tool-claude-rgb), 0.3);
+  background: rgba(var(--tool-claude-rgb), 0.04);
 }
 .tool-card.installable[data-tool="codex"]:hover {
-  border-color: rgba(5, 150, 105, 0.3);
-  background: rgba(5, 150, 105, 0.04);
+  border-color: rgba(var(--tool-codex-rgb), 0.3);
+  background: rgba(var(--tool-codex-rgb), 0.04);
 }
 .tool-card.installable[data-tool="copilot"]:hover {
-  border-color: rgba(99, 102, 241, 0.3);
-  background: rgba(99, 102, 241, 0.04);
+  border-color: rgba(var(--tool-copilot-rgb), 0.3);
+  background: rgba(var(--tool-copilot-rgb), 0.04);
 }
 .tool-card.installable[data-tool="gemini"]:hover {
-  border-color: rgba(37, 99, 235, 0.3);
-  background: rgba(37, 99, 235, 0.04);
+  border-color: rgba(var(--tool-gemini-rgb), 0.3);
+  background: rgba(var(--tool-gemini-rgb), 0.04);
 }
 
 /* Expanded state */
@@ -474,6 +474,30 @@
   margin-bottom: var(--space-2);
 }
 
+/* Machine-identity chip — reads like a live terminal status badge */
+.start-prompt-identity {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-2);
+  margin-bottom: var(--space-3);
+  padding: var(--space-1) var(--space-3);
+  border: 1px solid var(--border-subtle);
+  border-radius: var(--radius-full);
+  background: var(--surface-secondary);
+  color: var(--text-secondary);
+  font-family: var(--font-mono);
+  font-size: var(--text-sm);
+  font-weight: var(--weight-medium);
+}
+.start-prompt-identity[hidden] { display: none; }
+.start-prompt-identity-dot {
+  width: 7px;
+  height: 7px;
+  border-radius: 50%;
+  background: var(--status-success);
+  flex: 0 0 auto;
+}
+
 /* Start prompt subtitle */
 .start-prompt-subtitle {
   color: var(--text-muted);