claude-rpc 0.20.3 → 0.21.0

package/SECURITY.md

@@ -16,7 +16,7 @@ fetch-and-execute anywhere in `src/`.
 
 | Behavior | Where | Scope | Reversible? |
 | --- | --- | --- | --- |
-| Startup persistence | `src/install.js` → `addStartupEntry` (Windows Run key); `src/hook.js` → `ensureDaemonRunning` (SessionStart self-heal, all platforms) | `HKCU` Run key (no admin) + a detached daemon (re)launched when you start a Claude Code session | Yes — `claude-rpc uninstall` / `removeStartupEntry`; disable self-heal with `autostart:false` |
+| Startup persistence | `src/install.js` → `addStartupEntry` (Windows Run key, macOS LaunchAgent, Linux `systemd --user`) + `selfHealOnUpdate` (installs it on update); `src/hook.js` → `ensureDaemonRunning` (SessionStart self-heal) | Per-user login autostart (no admin/root/system service) + a detached daemon (re)launched when you start a Claude Code session | Yes — `claude-rpc uninstall` / `removeStartupEntry`; disable every auto-start path with `autostart:false` |
 | Hook injection | `src/install.js` → `installHooks` | Only into Claude Code's own `settings.json`, only our own commands | Yes — `uninstallHooks` removes exactly what it added |
 | Outbound network | `src/community.js`, `src/gist.js`, `src/usage.js`, `src/notify.js`, `default-config.js` | Anonymous counters + (opt-in) profile/gist/webhook + own read-only OAuth-usage poll + GIF assets | Telemetry: `community off`. Profile: `profile off`. Gist/webhook: opt-in only. Usage: `usage.enabled:false`. |
 | Local subprocess | `reg.exe`, `wscript`, the daemon itself (`node`/packaged exe — via the Run key and the SessionStart self-heal), `git`, `gh`, `npm`, `claude`, `security`, notifiers | Static or escaped args, no shell interpolation of untrusted input | n/a |
@@ -25,9 +25,10 @@ No credential access beyond the read-only Claude Code OAuth-token read for usage
 polling (§3d), no filesystem scanning outside `~/.claude-rpc` and Claude Code
 transcripts, no keylogging, no clipboard access, no AV/EDR evasion.
 
-## 1. Startup persistence (Windows Run key)
+## 1. Startup persistence (login autostart, all platforms)
 
-**Source:** `src/install.js`, `addStartupEntry` / `removeStartupEntry`.
+**Source:** `src/install.js`, `addStartupEntry` / `removeStartupEntry`; the
+on-update install path lives in `selfHealOnUpdate`.
 
 On Windows, `setup` writes one value:
 
@@ -47,16 +48,38 @@ HKCU\Software\Microsoft\Windows\CurrentVersion\Run
   not at wherever you happened to run the installer from — see
   `ensureCanonicalExe`.
 
-Non-Windows platforms get **no** Run-key/login registration (`install()` warns
-and skips it). Instead — on every platform, Windows included — the
-`SessionStart` hook **self-heals** the daemon: if none is running when you start
-a Claude Code session, the hook spawns one (detached, windowless), so presence
-is restored after a reboot, crash, or OS sleep exactly when you next use Claude.
-It is the same long-lived daemon launched the same way (`src/ensure-daemon.js` →
+**macOS and Linux** now get login autostart too, at per-user parity with Windows:
+
+```
+macOS  ~/Library/LaunchAgents/com.claude-rpc.daemon.plist   (launchctl, RunAtLoad)
+Linux  ~/.config/systemd/user/claude-rpc.service            (systemctl --user enable)
+```
+
+- **Scope:** per-user only — a user LaunchAgent / `systemctl --user` unit, never
+  a root/system daemon, LaunchDaemon, or system-wide service. No admin, no `sudo`.
+- **Reverse it:** `claude-rpc uninstall` removes the plist/unit and unloads it
+  (`removeStartupEntry`); or delete the file and `launchctl unload` /
+  `systemctl --user disable` by hand.
+
+**A login-autostart entry can appear on UPDATE, not only at `setup`.** Because
+npm runs no install script (see intro), an `npm update` reaches you through the
+daemon: the first time it starts after an update, `selfHealOnUpdate` re-wires
+hooks, migrates config, **and installs the login-autostart entry above** so the
+daemon comes up at login on the new version. This is the one place a
+background-start entry is created without an explicit `setup`. It is gated by
+`autostart` (default on) — set `autostart:false` to opt out of every auto-start
+path — and is best-effort: if `launchctl`/`systemctl`/`reg` fails, nothing
+breaks (the session self-heal below still covers startup).
+
+Underneath all of this, on every platform, the `SessionStart` hook also
+**self-heals** the daemon: if none is running when you start a Claude Code
+session, the hook spawns one (detached, windowless), so presence is restored
+after a reboot, crash, or OS sleep exactly when you next use Claude. It is the
+same long-lived daemon launched the same way (`src/ensure-daemon.js` →
 `spawnDaemonDetached`), a no-op when a daemon is already running, and
 cooldown-guarded against spawn storms; the daemon's atomic single-instance claim
-reaps any duplicate. Disable it with `autostart:false` in config (then manage
-the daemon yourself via `claude-rpc start` / `stop`).
+reaps any duplicate. Disable everything with `autostart:false` in config (then
+manage the daemon yourself via `claude-rpc start` / `stop`).
 
 ## 2. Hook injection into Claude Code
 
@@ -256,6 +279,10 @@ untrusted or remote input into a shell:
 
 - `reg.exe add/delete` — the Windows Run key (`src/install.js`).
 - `wscript.exe` — runs the generated windowless startup shim (`src/install.js`).
+- `launchctl load/unload` — the macOS LaunchAgent (`src/install.js`); args are
+  the fixed plist path.
+- `systemctl --user enable/disable/daemon-reload` — the Linux user service
+  (`src/install.js`); args are the fixed unit name.
 - `chcp.com 65001` — set the console to UTF-8 on Windows TTYs (`src/cli.js`).
 - `git` — read last commit subject / branch for the "just shipped" card
   (`src/git.js`).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-rpc",
-  "version": "0.20.3",
+  "version": "0.21.0",
   "description": "Discord Rich Presence for Claude Code — live model, project, tokens, and lifetime stats driven by Claude Code's hook system.",
   "type": "module",
   "license": "MIT",

package/src/daemon.js

@@ -10,7 +10,8 @@ import { detectGithubUrl } from './git.js';
 import { applyPrivacy } from './privacy.js';
 import { pauseUntil } from './pause.js';
 import { loadConfig } from './config.js';
-import { migrateConfig } from './install.js';
+import { selfHealOnUpdate } from './install.js';
+import { VERSION } from './version.js';
 import { desktopNotify, postWebhook, shouldWebhook, shouldNotify, sanitizeLabel } from './notify.js';
 import { humanProject } from './format.js';
 import { CONFIG_PATH, STATE_PATH, PID_PATH, LOG_PATH, STATE_DIR, AGGREGATE_PATH, PAUSE_PATH } from './paths.js';
@@ -79,12 +80,20 @@ function loadConfigWithLog() {
 // move. Idempotent: only writes when something actually changes, so steady-state
 // restarts are a no-op and can't loop the config watcher. Best-effort — a
 // migration failure must never stop the daemon from starting.
+// Self-heal on update — when this daemon is a newer version than the last one
+// that ran, re-wire hooks (their command/path drifts across versions) and
+// migrate config to the current shape, then stamp the version. This is how an
+// `npm update` reaches users who never re-run setup: there is no install script
+// (by design), so the daemon — itself brought up by the SessionStart self-heal —
+// carries the update forward. A since-0.1.0 install converges to the current
+// hooks + config the first time it's used after updating.
 try {
-  if (migrateConfig({ silent: true })) {
-    log('config.json migrated to current defaults on startup');
+  const healed = selfHealOnUpdate({ silent: true });
+  if (healed.changed) {
+    log(`self-heal on update: ${healed.from || 'fresh'} → ${VERSION} (hooks ${healed.rewired ? 're-wired' : 'already current'}, config migrated${healed.autostart ? ', login autostart ensured' : ''})`);
   }
 } catch (e) {
-  log('startup config migration failed (continuing):', e?.message || String(e));
+  log('startup self-heal failed (continuing):', e?.message || String(e));
 }
 
 let config = loadConfigWithLog();

package/src/install.js

@@ -8,12 +8,14 @@ import {
   readdirSync, unlinkSync,
 } from 'node:fs';
 import { dirname, join, resolve } from 'node:path';
+import { homedir } from 'node:os';
 import { spawn, spawnSync } from 'node:child_process';
 import { randomUUID } from 'node:crypto';
 import {
   CLAUDE_SETTINGS, CONFIG_PATH, USER_CONFIG_DIR, ROOT,
   HOOK_SCRIPT, IS_PACKAGED, IS_NPM_INSTALL, IS_NPX,
-  CANONICAL_EXE, CANONICAL_INSTALL_DIR, CANONICAL_EXE_NAME,
+  CANONICAL_EXE, CANONICAL_INSTALL_DIR, CANONICAL_EXE_NAME, VERSION_STAMP,
+  DAEMON_SCRIPT,
 } from './paths.js';
 import { DEFAULT_CONFIG } from './default-config.js';
 import { VERSION } from './version.js';
@@ -83,7 +85,7 @@ export function isOurHook(h) {
   return !!h && (h._claudeRpc === true || isOurHookCommand(h.command));
 }
 
-export function installHooks(exePath) {
+export function installHooks(exePath, { silent = false } = {}) {
   const settings = readJson(CLAUDE_SETTINGS, {});
   const before = JSON.stringify(settings.hooks || {});
   settings.hooks = settings.hooks || {};
@@ -118,11 +120,11 @@ export function installHooks(exePath) {
     }
   }
   if (JSON.stringify(settings.hooks) === before) {
-    noop(`hooks wired (${EVENTS.length} events)`);
+    if (!silent) noop(`hooks wired (${EVENTS.length} events)`);
     return false;
   }
   writeJson(CLAUDE_SETTINGS, settings);
-  dirtyStep(SYM_OK, 'hooks wired', `${EVENTS.length} events → ${CLAUDE_SETTINGS}`);
+  if (!silent) dirtyStep(SYM_OK, 'hooks wired', `${EVENTS.length} events → ${CLAUDE_SETTINGS}`);
   return true;
 }
 
@@ -153,7 +155,129 @@ function regCommand(args) {
 
 const STARTUP_VBS = join(CANONICAL_INSTALL_DIR, 'claude-rpc-daemon.vbs');
 
+// macOS LaunchAgent + Linux systemd --user paths/labels.
+const LAUNCHD_LABEL = 'com.claude-rpc.daemon';
+const LAUNCHD_PLIST = join(homedir(), 'Library', 'LaunchAgents', `${LAUNCHD_LABEL}.plist`);
+const SYSTEMD_UNIT_NAME = 'claude-rpc.service';
+const SYSTEMD_UNIT = join(homedir(), '.config', 'systemd', 'user', SYSTEMD_UNIT_NAME);
+
+// The daemon launch command, shared by every autostart mechanism so login/boot
+// starts the daemon exactly like `start` and the hook do:
+//   packaged → "<exe>" daemon ;  npm/dev → "<abs node>" "<abs daemon.js>"
+// (absolute node, like the hooks — login shells under nvm have no node on PATH).
+function daemonLaunch(exePath) {
+  if (IS_PACKAGED) return { exe: exePath, args: ['daemon'] };
+  return { exe: process.execPath, args: [DAEMON_SCRIPT] };
+}
+
+function xmlEscape(s) { return String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;'); }
+function systemctlUser(args) {
+  try { return spawnSync('systemctl', ['--user', ...args], { stdio: 'ignore' }); }
+  catch { return { status: 1 }; }
+}
+
+// Pure file-content builders — exported so the generated plist/unit are
+// unit-testable without touching launchctl/systemctl or the real filesystem.
+export function launchdPlist({ exe, args }) {
+  const progArgs = [exe, ...args].map((a) => `    <string>${xmlEscape(a)}</string>`).join('\n');
+  return [
+    '<?xml version="1.0" encoding="UTF-8"?>',
+    '<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">',
+    '<plist version="1.0">',
+    '<dict>',
+    `  <key>Label</key><string>${LAUNCHD_LABEL}</string>`,
+    '  <key>ProgramArguments</key>',
+    '  <array>',
+    progArgs,
+    '  </array>',
+    '  <key>RunAtLoad</key><true/>',
+    // KeepAlive false: start at login, but don't fight a manual `claude-rpc stop`.
+    '  <key>KeepAlive</key><false/>',
+    '  <key>ProcessType</key><string>Background</string>',
+    '</dict>',
+    '</plist>',
+    '',
+  ].join('\n');
+}
+
+export function systemdUnit({ exe, args }) {
+  const execStart = [exe, ...args].map((a) => `"${a}"`).join(' '); // quote each token (paths with spaces)
+  return [
+    '[Unit]',
+    'Description=claude-rpc — Discord Rich Presence for Claude Code',
+    'After=default.target',
+    '',
+    '[Service]',
+    'Type=simple',
+    `ExecStart=${execStart}`,
+    // on-failure (not always): a clean exit when another daemon already owns the
+    // instance must NOT be restarted, and neither should a `claude-rpc stop`.
+    'Restart=on-failure',
+    'RestartSec=5',
+    '',
+    '[Install]',
+    'WantedBy=default.target',
+    '',
+  ].join('\n');
+}
+
+// ── macOS: launchd LaunchAgent (per-user, starts at login) ────────────────────
+function addStartupEntryMac(exePath) {
+  const plist = launchdPlist(daemonLaunch(exePath));
+  try {
+    mkdirSync(dirname(LAUNCHD_PLIST), { recursive: true });
+    writeFileSync(LAUNCHD_PLIST, plist);
+  } catch (e) {
+    step(SYM_WARN, 'startup entry', `couldn't write LaunchAgent (${e.message}) — the session self-heal still starts the daemon`, console.warn);
+    return;
+  }
+  // Load so it's active now and at every login. `load -w` is deprecated but
+  // portable across the macOS versions we target; a failure is non-fatal — the
+  // plist alone starts it next login, and SessionStart self-heal covers the gap.
+  try { spawnSync('launchctl', ['unload', LAUNCHD_PLIST], { stdio: 'ignore' }); } catch { /* not loaded yet */ }
+  try { spawnSync('launchctl', ['load', '-w', LAUNCHD_PLIST], { stdio: 'ignore' }); } catch { /* deferred to next login */ }
+  dirtyStep(SYM_OK, 'startup entry', `LaunchAgent ${LAUNCHD_LABEL} — daemon starts at login`);
+}
+
+function removeStartupEntryMac() {
+  try { spawnSync('launchctl', ['unload', '-w', LAUNCHD_PLIST], { stdio: 'ignore' }); } catch { /* not loaded */ }
+  try { if (existsSync(LAUNCHD_PLIST)) { unlinkSync(LAUNCHD_PLIST); step(SYM_OK, 'startup entry', 'removed (LaunchAgent)'); } }
+  catch { /* already gone */ }
+}
+
+// ── Linux: systemd --user service (starts at login) ───────────────────────────
+function addStartupEntryLinux(exePath) {
+  const unit = systemdUnit(daemonLaunch(exePath));
+  try {
+    mkdirSync(dirname(SYSTEMD_UNIT), { recursive: true });
+    writeFileSync(SYSTEMD_UNIT, unit);
+  } catch (e) {
+    step(SYM_WARN, 'startup entry', `couldn't write systemd unit (${e.message}) — the session self-heal still starts the daemon`, console.warn);
+    return;
+  }
+  // Enable + start now. Non-fatal if there's no systemd --user session (some
+  // containers / minimal WSL): the SessionStart self-heal still brings it up.
+  systemctlUser(['daemon-reload']);
+  const r = systemctlUser(['enable', '--now', SYSTEMD_UNIT_NAME]);
+  if (r && r.status === 0) dirtyStep(SYM_OK, 'startup entry', `systemd --user ${SYSTEMD_UNIT_NAME} — daemon starts at login`);
+  else dirtyStep(SYM_INFO, 'startup entry', `systemd unit written — enable with: systemctl --user enable --now ${SYSTEMD_UNIT_NAME}`);
+}
+
+function removeStartupEntryLinux() {
+  systemctlUser(['disable', '--now', SYSTEMD_UNIT_NAME]);
+  try { if (existsSync(SYSTEMD_UNIT)) { unlinkSync(SYSTEMD_UNIT); step(SYM_OK, 'startup entry', 'removed (systemd unit)'); } }
+  catch { /* already gone */ }
+  systemctlUser(['daemon-reload']);
+}
+
 export async function addStartupEntry(exePath) {
+  if (process.platform === 'darwin') return addStartupEntryMac(exePath);
+  if (process.platform === 'linux') return addStartupEntryLinux(exePath);
+  if (process.platform !== 'win32') {
+    if (runDirty) step(SYM_INFO, 'startup entry', `skipped — no login-autostart for ${process.platform}`);
+    return;
+  }
+  // ── Windows: HKCU Run-key + windowless .vbs shim ──
   // The packaged exe is a console-subsystem node.exe, so a bare Run-key entry
   // (`"<exe>" daemon`) makes Explorer pop a console window at every login that
   // persists for the daemon's whole (weeks-long) life — closing it kills the
@@ -178,6 +302,9 @@ export async function addStartupEntry(exePath) {
 }
 
 export async function removeStartupEntry() {
+  if (process.platform === 'darwin') return removeStartupEntryMac();
+  if (process.platform === 'linux') return removeStartupEntryLinux();
+  if (process.platform !== 'win32') return;
   try {
     await regCommand(['delete', STARTUP_KEY, '/v', STARTUP_VALUE, '/f']);
     step(SYM_OK, 'startup entry', 'removed');
@@ -557,6 +684,43 @@ function warnIfStale() {
   } catch { /* offline or npm missing — a version check must never block setup */ }
 }
 
+// Self-heal an install across an update. There is NO npm install script (by
+// design — `npm install` must run nothing), so an `npm update` swaps the files
+// but re-wires nothing: a long-lived user keeps stale hook commands and old
+// config and never gets the new behaviour. The daemon — itself brought up by the
+// SessionStart self-heal — calls this on startup: when the stamped version
+// differs from the running one, re-wire the hooks (their command/path drifts
+// across versions) and migrate config to the current shape, then stamp the
+// version. Best-effort and quiet by default; never throws into the caller.
+// Returns { changed, from, rewired }.
+export function selfHealOnUpdate({ exePath = null, silent = true } = {}) {
+  let from = null;
+  try { from = (readFileSync(VERSION_STAMP, 'utf8') || '').trim() || null; } catch { /* first run / unreadable — treat as needing a heal */ }
+  if (from === VERSION) return { changed: false, from, rewired: false };
+  const exe = exePath || ((IS_PACKAGED && existsSync(CANONICAL_EXE)) ? CANONICAL_EXE : process.execPath);
+  let rewired = false;
+  try { rewired = installHooks(exe, { silent }); } catch { /* best-effort — a hook re-wire must never block daemon startup */ }
+  try { migrateConfig({ silent }); } catch { /* best-effort */ }
+  // Carry the login autostart forward too — an update should leave the daemon
+  // coming up at login, not only on the next Claude Code session — unless the
+  // user opted out with autostart:false. Best-effort + fire-and-forget; a
+  // failure just falls back to the SessionStart self-heal. In the detached
+  // daemon, addStartupEntry's console output lands in ignored stdio. This is
+  // disclosed in SECURITY.md (a login-autostart service can appear on update).
+  let autostart = false;
+  try {
+    if (readJson(CONFIG_PATH, {}).autostart !== false) {
+      autostart = true;
+      Promise.resolve(addStartupEntry(exe)).catch(() => {});
+    }
+  } catch { /* best-effort */ }
+  try {
+    mkdirSync(dirname(VERSION_STAMP), { recursive: true });
+    writeFileSync(VERSION_STAMP, VERSION + '\n');
+  } catch { /* unwritable — we'll just self-heal again next start, which is harmless (idempotent) */ }
+  return { changed: true, from, rewired, autostart };
+}
+
 export async function install({ exePath, withStartup = true } = {}) {
   resetRun();
   console.log('');
@@ -604,12 +768,11 @@ export async function install({ exePath, withStartup = true } = {}) {
   // row lands under this heading; setupOutro() then closes the screen.
   phase('daemon');
   if (withStartup) {
-    if (process.platform === 'win32') {
-      try { await addStartupEntry(target); }
-      catch (e) { step(SYM_WARN, 'startup entry', `failed: ${e.message}`, console.warn); }
-    } else if (runDirty) {
-      step(SYM_INFO, 'startup entry', 'skipped — login autostart is Windows-only');
-    }
+    // Cross-platform login autostart: Windows Run-key, macOS LaunchAgent, Linux
+    // systemd --user. Best-effort — a failure leaves the SessionStart self-heal
+    // as the (already reliable) fallback, so setup never fails on this.
+    try { await addStartupEntry(target); }
+    catch (e) { step(SYM_WARN, 'startup entry', `failed: ${e.message} — session self-heal still covers it`, console.warn); }
   }
   // Nothing changed: the checklist above stayed silent, so say so in one line.
   if (!runDirty && probe.ok) {
@@ -640,7 +803,7 @@ export async function uninstall() {
   console.log(`  ${c.bold}${c.magenta}◆ claude-rpc uninstall${c.reset}`);
   console.log('');
   uninstallHooks();
-  if (process.platform === 'win32') await removeStartupEntry();
+  await removeStartupEntry();
   console.log('');
   console.log(`  ${SYM_OK}  ${c.bold}uninstalled${c.reset} — config at ${c.cyan}${USER_CONFIG_DIR}${c.reset} ${c.dim}left intact; delete it manually if you want.${c.reset}`);
   console.log('');

package/src/paths.js

@@ -91,6 +91,10 @@ export const DATA_DIR = join(homedir(), '.claude-rpc');
 export const AGGREGATE_PATH = join(DATA_DIR, 'aggregate.json');
 export const SCAN_CACHE_PATH = join(DATA_DIR, 'scan-cache.json');
 export const EVENTS_LOG_PATH = join(DATA_DIR, 'events.jsonl');
+// Last claude-rpc version that ran the on-update self-heal (hook re-wire + config
+// migrate). Persistent (under ~/.claude-rpc) so an update is detected across
+// reboots — see install.selfHealOnUpdate.
+export const VERSION_STAMP = join(DATA_DIR, 'version');
 export const CLAUDE_HOME = join(homedir(), '.claude');
 export const CLAUDE_PROJECTS = join(CLAUDE_HOME, 'projects');
 export const CLAUDE_SETTINGS = join(CLAUDE_HOME, 'settings.json');

package/src/tui.js

@@ -1,15 +1,16 @@
-// Interactive terminal dashboard. Keyboard-navigable tabs, live refresh.
-// Designed to render correctly on Windows 10 cmd.exe, PowerShell 5.1, and
-// Windows Terminal: no full outer box, no alternative screen buffer (some
-// older terminals don't honor it), only ANSI color + horizontal separator
-// lines for structure.
+// Interactive terminal dashboard — full-screen framed panels, keyboard tabs,
+// live refresh. Uses the alternate screen buffer (restored on quit) and box
+// drawing, so it targets modern terminals (Windows Terminal, iTerm, kitty,
+// etc.). NO_COLOR is honored: color drops out, the box structure stays.
+//
+// renderFrame() is pure (data in → string out) so the layout is testable and
+// previewable without a live TTY; startTui() owns the IO/loop.
 
 import process from 'node:process';
 import { readFileSync, existsSync } from 'node:fs';
 import { readActiveState } from './state.js';
-import { readAggregate, findLiveSessions, weekKey } from './scanner.js';
-import { weekGrid } from './week.js';
-import { buildVars, applyIdle, humanProject } from './format.js';
+import { readAggregate, findLiveSessions, dayKey } from './scanner.js';
+import { buildVars, applyIdle, humanProject, fmtNum } from './format.js';
 import { loadConfig } from './config.js';
 import { PID_PATH } from './paths.js';
 import { fmtCost } from './pricing.js';
@@ -17,25 +18,32 @@ import { heat } from './ui.js';
 
 // ── ANSI ────────────────────────────────────────────────────────────────────
 const ESC = '\x1b[';
-const RESET = ESC + '0m';
 const CLEAR = ESC + '2J' + ESC + 'H';
 const HIDE_CURSOR = ESC + '?25l';
 const SHOW_CURSOR = ESC + '?25h';
+const ALT_ON = ESC + '?1049h';   // alternate screen buffer — restored on quit
+const ALT_OFF = ESC + '?1049l';
 
+// Color drops out entirely under NO_COLOR; box-drawing (not color) stays.
+const COLOR = !process.env.NO_COLOR;
+const sgr = (code) => (COLOR ? ESC + code : '');
 const C = {
-  reset:   RESET,
-  dim:     ESC + '2m',
-  bold:    ESC + '1m',
-  red:     ESC + '31m',
-  green:   ESC + '32m',
-  yellow:  ESC + '33m',
-  magenta: ESC + '35m',
-  cyan:    ESC + '36m',
-  gray:    ESC + '90m',
+  reset:   sgr('0m'),
+  dim:     sgr('2m'),
+  bold:    sgr('1m'),
+  red:     sgr('31m'),
+  green:   sgr('32m'),
+  yellow:  sgr('33m'),
+  magenta: sgr('35m'),
+  cyan:    sgr('36m'),
+  gray:    sgr('90m'),
 };
 const ansiRe = /\x1b\[[0-9;]*m/g;
 const visLen = (s) => String(s).replace(ansiRe, '').length;
 
+// Box-drawing — rounded corners for the "serious" look.
+const BX = { tl: '╭', tr: '╮', bl: '╰', br: '╯', h: '─', v: '│', sl: '├', sr: '┤' };
+
 // ── Tabs ────────────────────────────────────────────────────────────────────
 const TABS = [
   { key: 'now',      label: 'Now' },
@@ -50,15 +58,124 @@ let currentTab = 0;
 let refreshTimer = null;
 let exiting = false;
 
-// ── Data ────────────────────────────────────────────────────────────────────
-function loadSnapshot() {
+// ── Width-aware string helpers ────────────────────────────────────────────────
+// Truncate/pad a (possibly ANSI-coloured) string to exactly `w` visible columns.
+// Padding resets colour first so trailing spaces never inherit a fill; truncation
+// appends an ellipsis and a reset so colour can't bleed past the cut.
+function fit(s, w) {
+  s = String(s);
+  const len = visLen(s);
+  if (len === w) return s;
+  if (len < w) return s + C.reset + ' '.repeat(w - len);
+  let out = '', vis = 0, i = 0;
+  while (i < s.length && vis < w - 1) {
+    if (s[i] === '\x1b') {
+      const m = s.indexOf('m', i);
+      if (m !== -1) { out += s.slice(i, m + 1); i = m + 1; continue; }
+    }
+    out += s[i]; vis++; i++;
+  }
+  return out + '…' + C.reset;
+}
+
+// Heat-graded fill bar. `ratio` in 0..1 (or value/max). NO_COLOR-safe via heat().
+function bar(ratio, w) {
+  const r = Math.max(0, Math.min(1, ratio || 0));
+  const filled = Math.max(0, Math.min(w, Math.round(r * w)));
+  return `${heat(r)}${'█'.repeat(filled)}${C.reset}${' '.repeat(w - filled)}`;
+}
+
+// Centre a (possibly ANSI) string within width `w` (left pad only; row() right-pads).
+function center(s, w) {
+  const len = visLen(s);
+  if (len >= w) return s;
+  return ' '.repeat(Math.floor((w - len) / 2)) + s;
+}
+
+// ── Panels & columns ──────────────────────────────────────────────────────────
+// A bordered panel of exact total width `w`, title embedded in the top border.
+// Returns an array of lines (height = body.length + 2).
+function panel(title, body, w) {
+  const out = [];
+  if (title) {
+    const fill = Math.max(0, w - 5 - visLen(title));
+    out.push(`${C.gray}${BX.tl}${BX.h} ${C.bold}${title}${C.reset}${C.gray} ${BX.h.repeat(fill)}${BX.tr}${C.reset}`);
+  } else {
+    out.push(`${C.gray}${BX.tl}${BX.h.repeat(w - 2)}${BX.tr}${C.reset}`);
+  }
+  for (const line of body) {
+    out.push(`${C.gray}${BX.v}${C.reset} ${fit(line, w - 4)} ${C.gray}${BX.v}${C.reset}`);
+  }
+  out.push(`${C.gray}${BX.bl}${BX.h.repeat(w - 2)}${BX.br}${C.reset}`);
+  return out;
+}
+
+// Lay panel arrays side by side, padding shorter ones with blanks of their width.
+function columns(panels, gap = 3) {
+  const hgt = Math.max(...panels.map((p) => p.length));
+  const ws = panels.map((p) => visLen(p[0] || ''));
+  const spacer = ' '.repeat(gap);
+  const out = [];
+  for (let i = 0; i < hgt; i++) {
+    out.push(panels.map((p, j) => (p[i] !== undefined ? p[i] : ' '.repeat(ws[j]))).join(spacer));
+  }
+  return out;
+}
+
+// Split a content width into two column widths (with a gap between).
+function split2(cw, gap = 3) {
+  const tot = cw - gap;
+  const l = Math.floor(tot / 2);
+  return [l, tot - l];
+}
+
+// "label ............ value" justified to width `w` (panel content width).
+function statRows(pairs, w) {
+  return pairs.map(([label, val]) => {
+    const pad = Math.max(1, w - visLen(label) - visLen(val));
+    return `${C.dim}${label}${C.reset}${' '.repeat(pad)}${val}`;
+  });
+}
+
+// "name  ████████  value" justified to width `w` (panel content width).
+function barRow(label, valStr, ratio, w) {
+  const labelW = Math.max(8, Math.min(16, Math.floor(w * 0.42)));
+  const valW = Math.max(5, Math.min(11, visLen(valStr)));
+  const barW = Math.max(3, w - labelW - valW - 2);
+  const name = String(label).length > labelW ? String(label).slice(0, labelW - 1) + '…' : String(label).padEnd(labelW);
+  return `${C.dim}${name}${C.reset} ${bar(ratio, barW)} ${C.cyan}${valStr.padStart(valW)}${C.reset}`;
+}
+
+function hms(ms) {
+  const h = (ms || 0) / 3_600_000;
+  if (h < 1) return `${Math.round(h * 60)}m`;
+  return h < 10 ? `${h.toFixed(1)}h` : `${Math.round(h)}h`;
+}
+
+function statusColor(s) {
+  return s === 'working' ? C.green
+    : s === 'thinking' ? C.yellow
+    : s === 'notification' ? C.magenta
+    : s === 'shipped' ? C.green
+    : s === 'stale' ? C.dim
+    : C.cyan;
+}
+
+function headline(title, value, sub) {
+  const v = value ? `   ${C.bold}${C.cyan}${value}${C.reset}` : '';
+  const s = sub ? `   ${C.dim}${sub}${C.reset}` : '';
+  return [`${C.bold}${title.toUpperCase()}${C.reset}${v}${s}`, ''];
+}
+
+// ── Data ──────────────────────────────────────────────────────────────────────
+export function loadSnapshot() {
   let state = readActiveState();
   state.liveSessions = findLiveSessions({ thresholdMs: 90_000 });
   const config = loadConfig();
   state = applyIdle(state, config);
   const aggregate = readAggregate() || {};
   const vars = buildVars(state, config, aggregate);
-  return { state, config, aggregate, vars };
+  return { state, config, aggregate, vars, pid: daemonPid() };
 }
 
 function daemonPid() {
@@ -70,293 +187,298 @@ function daemonPid() {
   } catch { return null; }
 }
 
-// ── Layout helpers ──────────────────────────────────────────────────────────
-function width()  { return Math.max(50, Math.min(120, process.stdout.columns || 80)); }
-function height() { return Math.max(20, process.stdout.rows || 24); }
-
-function rule(w) { return C.gray + '─'.repeat(w - 4) + C.reset; }
-// Heat-graded fill (same ramp as the CLI views) — intensity reads at a glance.
-function bar(value, max, w = 16) {
-  if (!max || max <= 0) return ''.padEnd(w);
-  const filled = Math.max(0, Math.min(w, Math.round((value / max) * w)));
-  // heat() is NO_COLOR-aware (returns '' when color is off); the old
-  // `|| C.magenta` fallback wasn't, so it injected a raw escape under NO_COLOR.
-  return `${heat(value / max)}${'█'.repeat(filled)}${C.reset}` + ' '.repeat(w - filled);
-}
-
-// Wrap each content line with a 2-space left margin.
-function indent(rows) { return rows.map((r) => '  ' + r); }
-
-// ── Header / footer ─────────────────────────────────────────────────────────
-function drawHeader(w) {
-  const pid = daemonPid();
-  const status = pid
-    ? `${C.green}● running${C.reset} ${C.dim}pid ${pid}${C.reset}`
-    : `${C.red}○ not running${C.reset}`;
-
-  const title = `${C.bold}Claude RPC${C.reset}`;
-  // First line: title left, status right
-  const left = title;
-  const right = status;
-  const innerWidth = w - 4;
-  const padCount = Math.max(1, innerWidth - visLen(left) - visLen(right));
-  const line1 = '  ' + left + ' '.repeat(padCount) + right;
-
-  // Tabs line
-  const tabBits = TABS.map((t, i) => {
-    if (i === currentTab) return `${C.bold}${C.cyan}${t.label}${C.reset}`;
-    return `${C.dim}${t.label}${C.reset}`;
-  });
-  const tabs = tabBits.join(`  ${C.gray}·${C.reset}  `);
-  const line2 = '  ' + tabs;
-
-  return [line1, line2, '  ' + rule(w)];
-}
-
-function drawFooter(w) {
-  const keys = `${C.dim}1-7 jump${C.reset}  ${C.gray}·${C.reset}  ${C.dim}←→ h l${C.reset}  ${C.gray}·${C.reset}  ${C.dim}r refresh${C.reset}  ${C.gray}·${C.reset}  ${C.dim}q quit${C.reset}`;
-  return ['  ' + rule(w), '  ' + keys];
+const WD = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
+
+// Rolling last-7-days window (today + the 6 prior days), summed from byDay.
+// Anchored at local noon so a day subtraction can't slip across a DST boundary.
+function last7Days(byDay = {}) {
+  const days = [];
+  let totMs = 0, prompts = 0, tools = 0, sessions = 0, tokens = 0, cost = 0;
+  for (let i = 6; i >= 0; i--) {
+    const d = new Date(); d.setHours(12, 0, 0, 0); d.setDate(d.getDate() - i);
+    const key = dayKey(d.getTime());
+    const e = byDay[key] || {};
+    const ms = e.activeMs || 0;
+    days.push({ label: `${WD[d.getDay()]} ${key.slice(5)}`, ms, isToday: i === 0 });
+    totMs += ms; prompts += e.userMessages || 0; tools += e.toolCalls || 0; sessions += e.sessions || 0;
+    tokens += (e.inputTokens || 0) + (e.outputTokens || 0) + (e.cacheReadTokens || 0) + (e.cacheWriteTokens || 0);
+    cost += e.cost || 0;
+  }
+  return { days, maxMs: Math.max(0, ...days.map((d) => d.ms)), totMs, prompts, tools, sessions, tokens, cost };
 }
 
-// ── Tab renderers ───────────────────────────────────────────────────────────
-function tabNow(_, data) {
+// ── Tab renderers — each returns content lines (row() fits them to width) ──────
+function tabNow(data, cw) {
   const v = data.vars;
-  const out = [];
-  out.push('');
-  out.push(`${C.bold}${v.statusVerbose}${C.reset} ${C.dim}in${C.reset} ${C.bold}${v.project}${C.reset}`);
-  out.push(`${C.dim}${v.modelPretty}${C.reset}    ${C.cyan}${v.duration}${C.reset} ${C.dim}elapsed${C.reset}`);
-  out.push('');
-  out.push(`${C.dim}prompts${C.reset}     ${C.yellow}${String(v.messages).padStart(8)}${C.reset}`);
-  out.push(`${C.dim}tool calls${C.reset}  ${C.yellow}${String(v.tools).padStart(8)}${C.reset}`);
-  out.push(`${C.dim}files${C.reset}       ${C.cyan}${String(v.filesOpened).padStart(8)}${C.reset} ${C.dim}opened · ${v.filesEdited} edited · ${v.filesRead} read${C.reset}`);
-  out.push(`${C.dim}tokens${C.reset}      ${C.bold}${v.tokensFmt.padStart(8)}${C.reset} ${C.dim}(${v.inputTokens} in · ${v.outputTokens} out · ${v.cacheTokens} cache)${C.reset}`);
-  if (v.currentTool) {
-    out.push('');
-    out.push(`${C.dim}current${C.reset}     ${C.bold}${v.currentToolPretty}${C.reset} ${C.cyan}${v.currentFilePretty}${C.reset}`);
-  }
-  if (v.concurrent > 1) {
-    out.push('');
-    out.push(`${C.magenta}${v.concurrentLabel}${C.reset} ${C.dim}— ${v.concurrentListPretty}${C.reset}`);
+  const sc = statusColor(v.status);
+  const head = [
+    `${C.bold}${sc}${String(v.statusVerbose).toUpperCase()}${C.reset}  ${C.dim}in${C.reset}  ${C.bold}${v.project}${C.reset}`,
+    `${C.dim}${v.modelPretty} · ${v.duration} elapsed${C.reset}`,
+    '',
+  ];
+  const [lw, rw] = split2(cw);
+  const session = panel('session', statRows([
+    ['prompts', `${C.yellow}${v.messages}${C.reset}`],
+    ['tool calls', `${C.yellow}${v.tools}${C.reset}`],
+    ['files', `${C.cyan}${v.filesOpened}${C.reset} ${C.dim}open · ${v.filesEdited} edit · ${v.filesRead} read${C.reset}`],
+    ['tokens', `${C.bold}${v.tokensFmt}${C.reset}`],
+    ['', `${C.dim}${v.inputTokens} in · ${v.outputTokens} out · ${v.cacheTokens} cache${C.reset}`],
+  ], lw - 4), lw);
+  const liveBody = [];
+  if (v.currentTool) liveBody.push(...statRows([['doing', `${C.bold}${v.currentToolPretty}${C.reset}`]], rw - 4));
+  if (v.currentFilePretty) liveBody.push(`${C.dim}file${C.reset}  ${C.cyan}${v.currentFilePretty}${C.reset}`);
+  liveBody.push(...statRows([['model', `${C.bold}${v.modelPretty}${C.reset}`]], rw - 4));
+  if (Number(v.concurrent) > 1) {
+    liveBody.push('');
+    liveBody.push(`${C.magenta}${v.concurrentLabel}${C.reset}`);
+    liveBody.push(`${C.dim}${v.concurrentListPretty}${C.reset}`);
+  } else {
+    liveBody.push(`${C.dim}single session${C.reset}`);
   }
-  return out;
+  return [...head, ...columns([session, panel('live', liveBody, rw)])];
 }
 
-function tabToday(_, data) {
+function tabToday(data, cw) {
   const v = data.vars;
   const agg = data.aggregate;
-  const out = [];
-  out.push('');
-  out.push(`${C.bold}Today${C.reset}    ${C.green}${v.todayHours}${C.reset} ${C.dim}active${C.reset}`);
-  out.push('');
-  out.push(`${C.dim}prompts${C.reset}     ${C.yellow}${String(v.todayPrompts).padStart(8)}${C.reset}`);
-  out.push(`${C.dim}tool calls${C.reset}  ${C.yellow}${v.todayToolsFmt.padStart(8)}${C.reset}`);
-  out.push(`${C.dim}sessions${C.reset}    ${C.cyan}${String(v.todaySessions).padStart(8)}${C.reset}`);
-  out.push(`${C.dim}tokens${C.reset}      ${C.bold}${v.todayTokensFmt.padStart(8)}${C.reset} ${C.dim}grand total${C.reset}`);
-  if (agg.byHour && Object.keys(agg.byHour).length) {
-    out.push('');
-    out.push(`${C.dim}when you code · hour of day${C.reset}`);
-    const heightChars = ' ▁▂▃▄▅▆▇█';
-    let max = 0;
-    for (let h = 0; h < 24; h++) max = Math.max(max, agg.byHour?.[h]?.activeMs || 0);
-    if (max > 0) {
-      const bars = [];
-      for (let h = 0; h < 24; h++) {
-        const ms = agg.byHour?.[h]?.activeMs || 0;
-        const idx = ms > 0 ? Math.max(1, Math.min(8, Math.round((ms / max) * 8))) : 0;
-        const ch = heightChars[idx];
-        bars.push(h === v.peakHourNum ? `${C.bold}${heat(1)}${ch}${C.reset}` : `${heat(ms / max)}${ch}${C.reset}`);
-      }
-      out.push(bars.join(''));
-      out.push(`${C.dim}00  03  06  09  12  15  18  21${C.reset}`);
+  const head = headline('today', v.todayHours, 'active');
+  const [lw, rw] = split2(cw);
+  const stats = panel('today', statRows([
+    ['prompts', `${C.yellow}${v.todayPrompts}${C.reset}`],
+    ['tool calls', `${C.yellow}${v.todayToolsFmt}${C.reset}`],
+    ['sessions', `${C.cyan}${v.todaySessions}${C.reset}`],
+    ['spend', `${C.green}${v.todayCostFmt}${C.reset}`],
+  ], lw - 4), lw);
+  const toks = panel('tokens', statRows([
+    ['total', `${C.bold}${v.todayTokensFmt}${C.reset}`],
+    ['fresh', `${C.cyan}${v.todayTokensRealFmt}${C.reset}`],
+    ['cache', `${C.dim}${v.todayCacheTokensFmt}${C.reset}`],
+    ['lines', `${C.green}+${v.todayLinesAddedFmt}${C.reset} ${C.dim}(${v.todayLinesNetFmt} net)${C.reset}`],
+  ], rw - 4), rw);
+  const out = [...head, ...columns([stats, toks])];
+
+  // Full-width hour-of-day histogram.
+  const heightChars = ' ▁▂▃▄▅▆▇█';
+  let max = 0;
+  for (let h = 0; h < 24; h++) max = Math.max(max, agg.byHour?.[h]?.activeMs || 0);
+  if (max > 0) {
+    const bars = [];
+    for (let h = 0; h < 24; h++) {
+      const ms = agg.byHour?.[h]?.activeMs || 0;
+      const idx = ms > 0 ? Math.max(1, Math.min(8, Math.round((ms / max) * 8))) : 0;
+      const ch = heightChars[idx];
+      bars.push(h === v.peakHourNum ? `${C.bold}${heat(1)}${ch}${C.reset}` : `${heat(ms / max)}${ch}${C.reset}`);
     }
+    // Two cells per hour so the 24h strip reads wide.
+    out.push('');
+    out.push(...panel('when you code · hour of day', [
+      bars.map((b) => b + b).join(''),
+      `${C.dim}00    03    06    09    12    15    18    21${C.reset}`,
+    ], cw));
   }
   return out;
 }
 
-function tabWeek(_, data) {
-  const v = data.vars;
+function tabWeek(data, cw) {
   const agg = data.aggregate;
-  const out = [];
-  out.push('');
-  out.push(`${C.bold}This week${C.reset} ${C.dim}${weekKey(Date.now())}${C.reset}    ${C.green}${v.weekHours}${C.reset} ${C.dim}active${C.reset}`);
-  out.push('');
-  out.push(`${C.dim}prompts${C.reset}     ${C.yellow}${String(v.weekPrompts).padStart(8)}${C.reset}`);
-  out.push(`${C.dim}tool calls${C.reset}  ${C.yellow}${v.weekToolsFmt.padStart(8)}${C.reset}`);
-  out.push(`${C.dim}sessions${C.reset}    ${C.cyan}${String(v.weekSessions).padStart(8)}${C.reset}`);
-  out.push(`${C.dim}tokens${C.reset}      ${C.bold}${v.weekTokensFmt.padStart(8)}${C.reset}`);
-  if (agg.byDay) {
-    out.push('');
-    out.push(`${C.dim}daily breakdown${C.reset}`);
-    const { days, maxMs } = weekGrid(agg.byDay);
-    for (const { label, ms, isFuture, isToday } of days) {
-      if (isFuture) {
-        out.push(`${C.dim}${label.padEnd(11)}${' '.repeat(18)}     —${C.reset}`);
-      } else {
-        const h = ms / 3_600_000;
-        const hStr = h < 1 ? `${Math.round(h * 60)}m` : (h < 10 ? `${h.toFixed(1)}h` : `${Math.round(h)}h`);
-        const prefix = isToday ? C.bold : '';
-        const peak = ms === maxMs && ms > 0 ? ` ${C.bold}${heat(1)}◆${C.reset}` : '';
-        out.push(`${prefix}${label.padEnd(11)}${C.reset} ${bar(ms, maxMs, 18)} ${C.cyan}${hStr.padStart(5)}${C.reset}${peak}${isToday ? `  ${C.dim}← today${C.reset}` : ''}`);
-      }
-    }
-  }
-  return out;
+  const wk = last7Days(agg.byDay || {});
+  const head = headline('last 7 days', hms(wk.totMs), 'active');
+  const [lw, rw] = split2(cw);
+
+  const cwBody = lw - 4;
+  const dailyBody = wk.days.map(({ label, ms, isToday }) => {
+    const marker = isToday ? `${C.bold}${C.cyan} ‹today${C.reset}` : '';
+    const lbl = isToday ? `${C.bold}${label}${C.reset}` : `${C.dim}${label}${C.reset}`;
+    // Reserve room for the value (1 space + 5) and, on today's row, the marker
+    // (' ‹today' = 7) so the bar never pushes the value off the panel edge.
+    const barW = Math.max(3, cwBody - 11 - 6 - (isToday ? 7 : 0));
+    return `${lbl}${' '.repeat(Math.max(1, 11 - visLen(label)))}${bar(wk.maxMs ? ms / wk.maxMs : 0, barW)} ${C.cyan}${hms(ms).padStart(5)}${C.reset}${marker}`;
+  });
+  const daily = panel('daily', dailyBody, lw);
+
+  const totals = panel('last 7 days', statRows([
+    ['active', `${C.green}${hms(wk.totMs)}${C.reset}`],
+    ['prompts', `${C.yellow}${fmtNum(wk.prompts)}${C.reset}`],
+    ['tool calls', `${C.yellow}${fmtNum(wk.tools)}${C.reset}`],
+    ['sessions', `${C.cyan}${fmtNum(wk.sessions)}${C.reset}`],
+    ['tokens', `${C.bold}${fmtNum(wk.tokens)}${C.reset}`],
+    ['spend', `${C.green}${fmtCost(wk.cost)}${C.reset}`],
+  ], rw - 4), rw);
+
+  return [...head, ...columns([daily, totals])];
 }
 
-function tabStreak(_, data) {
+function tabStreak(data, cw) {
   const v = data.vars;
-  const out = [];
-  out.push('');
-  out.push(`${C.bold}${C.magenta}${v.streak}${C.reset} ${C.dim}day streak${C.reset}    ${C.dim}longest${C.reset} ${C.cyan}${v.longestStreak}${C.reset}`);
-  out.push('');
-  out.push(`${C.dim}days on Claude${C.reset}    ${C.cyan}${String(v.daysSinceFirst).padStart(8)}${C.reset}`);
-  if (v.bestDayDate) {
-    out.push('');
-    out.push(`${C.dim}best day${C.reset}          ${C.bold}${v.bestDayHours}${C.reset} ${C.dim}on ${v.bestDayDate}${C.reset}`);
-    out.push(`                  ${C.dim}${v.bestDayPrompts} prompts · ${v.bestDayTokensFmt} tokens${C.reset}`);
-  }
-  if (v.peakHour) {
-    out.push('');
-    out.push(`${C.dim}peak hour${C.reset}         ${C.bold}${v.peakHour}${C.reset}   ${C.dim}${v.peakHourActiveLabel}${C.reset}`);
-  }
-  if (v.topEditedFile) {
-    out.push('');
-    out.push(`${C.dim}hotspot${C.reset}           ${C.bold}${v.topEditedFile}${C.reset}   ${C.dim}${v.topEditedCountLabel}${C.reset}`);
-  }
-  return out;
+  const [lw, rw] = split2(cw);
+  const head = headline('streak', `${v.streak}d`, `longest ${v.longestStreak}d`);
+  const left = panel('streak', statRows([
+    ['current', `${C.bold}${C.magenta}${v.streak}${C.reset} ${C.dim}days${C.reset}`],
+    ['longest', `${C.cyan}${v.longestStreak}${C.reset} ${C.dim}days${C.reset}`],
+    ['days on Claude', `${C.cyan}${v.daysSinceFirst}${C.reset}`],
+  ], lw - 4), lw);
+  const rb = [];
+  if (v.bestDayDate) rb.push(...statRows([['best day', `${C.bold}${v.bestDayHours}${C.reset} ${C.dim}${v.bestDayDate}${C.reset}`]], rw - 4));
+  if (v.bestDayDate) rb.push(`${C.dim}${v.bestDayPrompts} prompts · ${v.bestDayTokensFmt} tokens${C.reset}`);
+  if (v.peakHour) rb.push(...statRows([['peak hour', `${C.bold}${v.peakHour}${C.reset} ${C.dim}${v.peakHourActiveLabel}${C.reset}`]], rw - 4));
+  if (v.topEditedFile) rb.push(...statRows([['hotspot', `${C.bold}${v.topEditedFile}${C.reset}`]], rw - 4));
+  if (!rb.length) rb.push(`${C.dim}keep going to unlock records${C.reset}`);
+  return [...head, ...columns([left, panel('records', rb, rw)])];
 }
 
-function tabLifetime(_, data) {
+function tabLifetime(data, cw) {
   const v = data.vars;
   const agg = data.aggregate;
-  const out = [];
-  out.push('');
-  out.push(`${C.bold}All-time${C.reset}    ${C.green}${v.allHours}${C.reset} ${C.dim}active · ${v.allWallHours} wall${C.reset}`);
-  out.push('');
-  out.push(`${C.dim}sessions${C.reset}    ${C.yellow}${String(v.allSessions).padStart(8)}${C.reset} ${C.dim}(+${v.allSubagentRuns} subagent runs)${C.reset}`);
-  out.push(`${C.dim}prompts${C.reset}     ${C.yellow}${v.allMessagesFmt.padStart(8)}${C.reset}`);
-  out.push(`${C.dim}tool calls${C.reset}  ${C.yellow}${v.allToolsFmt.padStart(8)}${C.reset}`);
-  out.push(`${C.dim}files${C.reset}       ${C.cyan}${v.allFilesFmt.padStart(8)}${C.reset}`);
-  out.push(`${C.dim}tokens${C.reset}      ${C.bold}${C.magenta}${v.allTokensFmt.padStart(8)}${C.reset} ${C.dim}grand total${C.reset}`);
-  out.push(`              ${C.dim}${v.allInputTokens} in · ${v.allOutputTokens} out · ${v.allCacheTokens} cache${C.reset}`);
-  const projects = agg.projects || {};
-  const top = Object.entries(projects)
-    .sort((a, b) => b[1].activeMs - a[1].activeMs)
-    .slice(0, 4);
-  if (top.length) {
-    out.push('');
-    out.push(`${C.dim}top projects${C.reset}`);
-    const maxMs = top[0][1].activeMs;
-    for (const [name, p] of top) {
-      const h = p.activeMs / 3_600_000;
-      const hStr = h < 1 ? `${Math.round(h * 60)}m` : (h < 10 ? `${h.toFixed(1)}h` : `${Math.round(h)}h`);
-      const pretty = humanProject(name).slice(0, 18).padEnd(20);
-      out.push(`${pretty} ${bar(p.activeMs, maxMs, 16)} ${C.cyan}${hStr.padStart(5)}${C.reset}`);
-    }
-  }
-  return out;
+  const [lw, rw] = split2(cw);
+  const head = headline('all-time', v.allHours, `active · ${v.allWallHours} wall`);
+  const stats = panel('all-time', statRows([
+    ['sessions', `${C.yellow}${v.allSessions}${C.reset} ${C.dim}+${v.allSubagentRuns} sub${C.reset}`],
+    ['prompts', `${C.yellow}${v.allMessagesFmt}${C.reset}`],
+    ['tool calls', `${C.yellow}${v.allToolsFmt}${C.reset}`],
+    ['files', `${C.cyan}${v.allFilesFmt}${C.reset}`],
+    ['tokens', `${C.bold}${C.magenta}${v.allTokensFmt}${C.reset}`],
+    ['spend', `${C.green}${v.allCostFmt}${C.reset}`],
+  ], lw - 4), lw);
+  const top = Object.entries(agg.projects || {}).sort((a, b) => b[1].activeMs - a[1].activeMs).slice(0, 6);
+  const maxMs = top[0] ? top[0][1].activeMs : 1;
+  const projBody = top.length
+    ? top.map(([name, p]) => barRow(humanProject(name), hms(p.activeMs), p.activeMs / maxMs, rw - 4))
+    : [`${C.dim}no projects yet${C.reset}`];
+  return [...head, ...columns([stats, panel('top projects · by time', projBody, rw)])];
 }
 
-function tabCost(_, data) {
+function tabCost(data, cw) {
   const v = data.vars;
   const agg = data.aggregate;
-  const out = [];
-  out.push('');
-  out.push(`${C.bold}Estimated cost${C.reset}    ${C.green}${v.allCostFmt}${C.reset} ${C.dim}all-time · approximate${C.reset}`);
-  out.push('');
-  out.push(`${C.dim}today${C.reset}       ${C.cyan}${v.todayCostFmt.padStart(10)}${C.reset}`);
-  out.push(`${C.dim}this week${C.reset}   ${C.cyan}${v.weekCostFmt.padStart(10)}${C.reset}`);
-  out.push(`${C.dim}this project${C.reset} ${C.cyan}${v.projectCostFmt.padStart(10)}${C.reset}`);
-
-  const byModel = Object.entries(agg.costByModel || {}).sort((a, b) => b[1] - a[1]).slice(0, 6);
-  if (byModel.length) {
-    out.push('');
-    out.push(`${C.dim}by model${C.reset}`);
-    const max = byModel[0][1];
-    for (const [m, val] of byModel) {
-      const pretty = String(m).padEnd(20);
-      out.push(`${pretty} ${bar(val, max, 18)} ${C.cyan}${fmtCost(val).padStart(8)}${C.reset}`);
-    }
-  }
-
-  // Month-to-date forecast.
+  const [lw, rw] = split2(cw);
+  const head = headline('spend', v.allCostFmt, 'all-time · approximate');
+
+  // Per-project spend — the headline ask.
+  const projs = Object.entries(agg.projects || {})
+    .map(([k, p]) => [humanProject(k), p.cost || 0]).filter(([, c]) => c > 0)
+    .sort((a, b) => b[1] - a[1]).slice(0, 8);
+  const maxP = projs[0] ? projs[0][1] : 1;
+  const projBody = projs.length
+    ? projs.map(([name, c]) => barRow(name, fmtCost(c), c / maxP, lw - 4))
+    : [`${C.dim}no spend recorded${C.reset}`];
+  const byProject = panel('by project', projBody, lw);
+
+  const models = Object.entries(agg.costByModel || {}).sort((a, b) => b[1] - a[1]).slice(0, 8);
+  const maxM = models[0] ? models[0][1] : 1;
+  const modelBody = models.length
+    ? models.map(([m, c]) => barRow(m, fmtCost(c), c / maxM, rw - 4))
+    : [`${C.dim}no model data${C.reset}`];
+  const byModel = panel('by model', modelBody, rw);
+
+  const out = [...head, ...columns([byProject, byModel])];
+
+  // Month-to-date + forecast strip.
   const now = new Date();
   const ym = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}`;
   let mtd = 0;
-  for (const [k, day] of Object.entries(agg.byDay || {})) {
-    if (k.startsWith(ym)) mtd += day.cost || 0;
-  }
-  if (mtd > 0) {
-    const daysIn = now.getDate();
-    const daysInMonth = new Date(now.getFullYear(), now.getMonth() + 1, 0).getDate();
-    const forecast = (mtd / daysIn) * daysInMonth;
-    out.push('');
-    out.push(`${C.dim}month-to-date${C.reset} ${C.cyan}${fmtCost(mtd).padStart(8)}${C.reset}`);
-    out.push(`${C.dim}forecast${C.reset}      ${C.bold}${fmtCost(forecast).padStart(8)}${C.reset}`);
-  }
+  for (const [k, day] of Object.entries(agg.byDay || {})) if (k.startsWith(ym)) mtd += day.cost || 0;
+  const forecast = mtd > 0 ? (mtd / now.getDate()) * new Date(now.getFullYear(), now.getMonth() + 1, 0).getDate() : 0;
+  out.push('');
+  out.push(`${C.dim}today${C.reset} ${C.cyan}${v.todayCostFmt}${C.reset}   ${C.dim}week${C.reset} ${C.cyan}${v.weekCostFmt}${C.reset}   ${C.dim}month-to-date${C.reset} ${C.cyan}${fmtCost(mtd)}${C.reset}   ${C.dim}forecast${C.reset} ${C.bold}${fmtCost(forecast)}${C.reset}`);
   return out;
 }
 
-function tabCode(_, data) {
+function tabCode(data, cw) {
   const v = data.vars;
   const agg = data.aggregate;
-  const out = [];
-  out.push('');
-  out.push(`${C.bold}Code churn${C.reset}    ${C.green}+${v.linesAddedFmt}${C.reset} / ${C.red}−${v.linesRemovedFmt}${C.reset}  ${C.dim}net ${v.linesNetFmt}${C.reset}`);
-  out.push('');
-  out.push(`${C.dim}today${C.reset}    ${C.green}+${v.todayLinesAddedFmt}${C.reset}  ${C.dim}(${v.todayLinesNetFmt} net)${C.reset}`);
-  out.push(`${C.dim}this week${C.reset} ${C.green}+${v.weekLinesAddedFmt}${C.reset}  ${C.dim}(${v.weekLinesNetFmt} net)${C.reset}`);
-
+  const [lw, rw] = split2(cw);
+  const head = headline('code churn', `+${v.linesAddedFmt} / −${v.linesRemovedFmt}`, `net ${v.linesNetFmt}`);
   const langs = Object.entries(agg.languages || {}).sort((a, b) => (b[1].edits || 0) - (a[1].edits || 0)).slice(0, 6);
-  if (langs.length) {
-    out.push('');
-    out.push(`${C.dim}languages · by edits${C.reset}`);
-    const max = langs[0][1].edits || 1;
-    for (const [name, l] of langs) {
-      const pretty = name.slice(0, 18).padEnd(20);
-      out.push(`${pretty} ${bar(l.edits, max, 18)} ${C.cyan}${String(l.edits).padStart(6)}${C.reset}`);
-    }
-  }
-
-  const bash = Object.entries(agg.bashCommands || {}).sort((a, b) => b[1] - a[1]).slice(0, 4);
-  if (bash.length) {
-    out.push('');
-    out.push(`${C.dim}top bash${C.reset}`);
-    for (const [k, n] of bash) {
-      out.push(`${k.padEnd(20)} ${C.cyan}${String(n).padStart(6)}${C.reset}`);
-    }
-  }
-  return out;
+  const maxL = langs[0] ? (langs[0][1].edits || 1) : 1;
+  const langBody = [
+    ...statRows([
+      ['today', `${C.green}+${v.todayLinesAddedFmt}${C.reset} ${C.dim}(${v.todayLinesNetFmt} net)${C.reset}`],
+      ['this week', `${C.green}+${v.weekLinesAddedFmt}${C.reset} ${C.dim}(${v.weekLinesNetFmt} net)${C.reset}`],
+    ], lw - 4),
+    '',
+    ...(langs.length ? langs.map(([n, l]) => barRow(n, fmtNum(l.edits || 0), (l.edits || 0) / maxL, lw - 4)) : [`${C.dim}no edits yet${C.reset}`]),
+  ];
+  const churn = panel('languages · by edits', langBody, lw);
+
+  const bash = Object.entries(agg.bashCommands || {}).sort((a, b) => b[1] - a[1]).slice(0, 5);
+  const dom = Object.entries(agg.webDomains || {}).sort((a, b) => b[1] - a[1]).slice(0, 3);
+  const rb = [];
+  if (bash.length) { rb.push(`${C.dim}top bash${C.reset}`); for (const [k, n] of bash) rb.push(`${String(k).slice(0, rw - 12).padEnd(rw - 12)} ${C.cyan}${String(n).padStart(6)}${C.reset}`); }
+  if (dom.length) { rb.push(''); rb.push(`${C.dim}web domains${C.reset}`); for (const [k, n] of dom) rb.push(`${String(k).slice(0, rw - 12).padEnd(rw - 12)} ${C.cyan}${String(n).padStart(6)}${C.reset}`); }
+  if (!rb.length) rb.push(`${C.dim}no shell/web activity${C.reset}`);
+  return [...head, ...columns([churn, panel('shell & web', rb, rw)])];
 }
 
 const TAB_RENDERERS = [tabNow, tabToday, tabWeek, tabStreak, tabLifetime, tabCost, tabCode];
 
-// ── Render ──────────────────────────────────────────────────────────────────
-function render() {
-  const w = width();
-  const h = height();
-  const data = loadSnapshot();
-
-  const header = drawHeader(w);
-  const footer = drawFooter(w);
-  const body = indent(TAB_RENDERERS[currentTab](w, data));
+// ── Frame composition ─────────────────────────────────────────────────────────
+function topBorder(w, title, statusColored) {
+  const fill = Math.max(0, w - title.length - visLen(statusColored) - 8);
+  return `${C.gray}${BX.tl}${BX.h} ${C.bold}${title}${C.reset}${C.gray} ${BX.h.repeat(fill)} ${C.reset}${statusColored}${C.gray} ${BX.h}${BX.tr}${C.reset}`;
+}
+function bottomBorder(w) { return `${C.gray}${BX.bl}${BX.h.repeat(w - 2)}${BX.br}${C.reset}`; }
+function sepLine(w) { return `${C.gray}${BX.sl}${BX.h.repeat(w - 2)}${BX.sr}${C.reset}`; }
+function row(content, w) { return `${C.gray}${BX.v}${C.reset} ${fit(content, w - 4)} ${C.gray}${BX.v}${C.reset}`; }
+
+export function renderFrame(data, { width, height, tab }) {
+  const w = Math.max(64, Math.min(120, width || 100));
+  const h = Math.max(20, Math.min(32, height || 28));
+  const cw = w - 4;
+
+  const status = data.pid
+    ? `${C.green}●${C.reset} ${C.dim}running · pid ${data.pid}${C.reset}`
+    : `${C.red}○${C.reset} ${C.dim}daemon not running${C.reset}`;
+  const tabBar = TABS.map((t, i) => (i === tab
+    ? `${C.bold}${C.cyan}‹ ${t.label} ›${C.reset}`
+    : `${C.dim}${t.label}${C.reset}`)).join('    ');
+  const footer = `${C.dim}1-7${C.reset} jump   ${C.gray}·${C.reset}   ${C.dim}←→ h l${C.reset} tab   ${C.gray}·${C.reset}   ${C.dim}r${C.reset} refresh   ${C.gray}·${C.reset}   ${C.dim}q${C.reset} quit`;
+
+  // Header breathes: blank line, centred tab bar, blank line, then the rule —
+  // so the top reads as a header band with air, not a squished edge strip.
+  const B = Math.max(1, h - 8); // header(border+blank+tabs+blank+rule=5) + footer(rule+keys+border=3)
+  const bodyContent = TAB_RENDERERS[tab](data, cw);
+  const body = bodyContent.slice(0, B);
+  while (body.length < B) body.push('');
+
+  const lines = [
+    topBorder(w, 'claude-rpc', status),
+    row('', w),
+    row(center(tabBar, cw), w),
+    row('', w),
+    sepLine(w),
+  ];
+  for (const b of body) lines.push(row(b, w));
+  lines.push(sepLine(w), row(center(footer, cw), w), bottomBorder(w));
+  return lines.join('\n');
+}
 
-  // Pad body so footer sits at bottom of viewport.
-  const available = h - header.length - footer.length - 1; // -1 for safety
-  while (body.length < available) body.push('');
-  if (body.length > available) body.length = available;
+// ── Live render / input / lifecycle ───────────────────────────────────────────
+// Frame size + centring margins. The frame caps out (max 120×32) and centres
+// in the terminal, so a big full-screen window reads as a centred dashboard with
+// breathing room instead of a frame glued to the top-left edge.
+function frameLayout(termW, termH) {
+  const w = Math.max(64, Math.min(120, termW - 4));
+  const h = Math.max(20, Math.min(28, termH - 2));
+  return { w, h, left: Math.max(0, (termW - w) >> 1), top: Math.max(0, (termH - h) >> 1) };
+}
 
-  process.stdout.write(CLEAR + [...header, ...body, ...footer].join('\n'));
+function render() {
+  const termW = process.stdout.columns || 100;
+  const termH = process.stdout.rows || 30;
+  const { w, h, left, top } = frameLayout(termW, termH);
+  const pad = ' '.repeat(left);
+  const frame = renderFrame(loadSnapshot(), { width: w, height: h, tab: currentTab })
+    .split('\n').map((l) => pad + l).join('\n');
+  process.stdout.write(CLEAR + '\n'.repeat(top) + frame);
 }
 
-// ── Input / lifecycle ───────────────────────────────────────────────────────
 function cleanup() {
   if (exiting) return;
   exiting = true;
   if (refreshTimer) clearInterval(refreshTimer);
   try { process.stdin.setRawMode(false); } catch { /* not a tty (CI, pipe) — no-op */ }
   process.stdin.pause();
-  process.stdout.write(SHOW_CURSOR + CLEAR + '\n');
+  process.stdout.write(SHOW_CURSOR + ALT_OFF);
   process.exit(0);
 }
 
@@ -364,18 +486,9 @@ function handleKey(buf) {
   const key = buf.toString();
   if (key === '\x03' || key.toLowerCase() === 'q') return cleanup();
   if (key.toLowerCase() === 'r') return render();
-  if (key.length === 1 && key >= '1' && key <= String(TABS.length)) {
-    currentTab = Number(key) - 1;
-    return render();
-  }
-  if (key === '\x1b[C' || key === '\x1b[B' || key === '\t' || key === 'l' || key === 'j') {
-    currentTab = (currentTab + 1) % TABS.length;
-    return render();
-  }
-  if (key === '\x1b[D' || key === '\x1b[A' || key === 'h' || key === 'k') {
-    currentTab = (currentTab - 1 + TABS.length) % TABS.length;
-    return render();
-  }
+  if (key.length === 1 && key >= '1' && key <= String(TABS.length)) { currentTab = Number(key) - 1; return render(); }
+  if (key === '\x1b[C' || key === '\x1b[B' || key === '\t' || key === 'l' || key === 'j') { currentTab = (currentTab + 1) % TABS.length; return render(); }
+  if (key === '\x1b[D' || key === '\x1b[A' || key === 'h' || key === 'k') { currentTab = (currentTab - 1 + TABS.length) % TABS.length; return render(); }
 }
 
 export function startTui() {
@@ -383,8 +496,7 @@ export function startTui() {
     console.error('claude-rpc status: not a TTY. Use `claude-rpc status --dump` for plain output.');
     process.exit(1);
   }
-  process.stdout.write(HIDE_CURSOR);
-
+  process.stdout.write(ALT_ON + HIDE_CURSOR);
   try { process.stdin.setRawMode(true); } catch { /* not a tty — TUI will print once and exit */ }
   process.stdin.resume();
   process.stdin.on('data', handleKey);
@@ -394,7 +506,7 @@ export function startTui() {
   process.on('SIGHUP', cleanup);
   process.on('exit', () => {
     try { process.stdin.setRawMode(false); } catch { /* not a tty (CI, pipe) — no-op */ }
-    process.stdout.write(SHOW_CURSOR);
+    process.stdout.write(SHOW_CURSOR + ALT_OFF);
   });
   process.stdout.on('resize', () => render());
 

package/src/version.js

@@ -11,7 +11,7 @@ import { readFileSync } from 'node:fs';
 import { join } from 'node:path';
 import { ROOT } from './paths.js';
 
-const BAKED = '0.20.3';
+const BAKED = '0.21.0';
 
 function readPkgVersion() {
   try {