@njeybe/nativ 2.6.0 → 2.8.0

package/dist/server/studio-ui/shell/model.js

@@ -2,6 +2,7 @@
 export const modelScript = String.raw `  // ─── Studio client model: buildModel(api) is pure ──────────────────────────
   var RUN_ACTIVE = { spawning_worktree: 1, running: 1, verifying: 1, merging: 1 };
   function isRunActive(run) { return !!run && !!RUN_ACTIVE[run.status]; }
+  var STALE_MS = 4 * 3600 * 1000;
 
   /** Text before the first colon, at most 46 characters. */
   function shortName(name) {
@@ -46,11 +47,14 @@ export const modelScript = String.raw `  // ─── Studio client model: build
     if (startT == null && run && isRunActive(run)) startT = toTime(run.startedAt);
     var cost = b && b.actual ? positive(b.actual.costUsd) : null;
     if (cost == null && b && b.estimated) cost = positive(b.estimated.costUsd);
+    var claimT = toTime(t.claimedAt);
+    var stale = running && claimT != null && Studio.now() - claimT > STALE_MS && !isRunActive(run);
     return {
       id: t.id,
       title: t.title || t.id,
       description: t.description || '',
-      status: t.status,
+      status: stale ? 'pending' : t.status,
+      claimedStatus: t.status,
       agent: t.assignedSubagent || null,
       deps: t.dependencies || [],
       files: t.targetFiles || [],
@@ -62,6 +66,8 @@ export const modelScript = String.raw `  // ─── Studio client model: build
       reason: t.status === 'blocked' && t.notes ? String(t.notes).replace(/^\s+|\s+$/g, '') || null : null,
       attempt: attemptsOf(t, running),
       maxAttempts: (t.circuitBreaker && t.circuitBreaker.maxThreshold) || 3,
+      claimT: claimT,
+      stale: stale,
       startT: startT,
       endT: t.status === 'completed' && b ? toTime(b.completedAt) : null,
       durationMs: b ? positive(b.durationMs) : null,
@@ -175,7 +181,7 @@ export const modelScript = String.raw `  // ─── Studio client model: build
       tasks: tasks,
       byId: byId,
       activeMilestoneId: active,
-      running: tasks.filter(function (t) { return t.status === 'in_progress'; }),
+      running: tasks.filter(function (t) { return t.status === 'in_progress' && !t.stale; }),
       stuck: tasks.filter(function (t) { return t.status === 'blocked'; }),
       needsYou: needsYouItems(tasks, byId, api.escalations),
       summary: summaryOf(api, milestones, tasks)

package/dist/server/studio-ui/shell/paint.js

@@ -67,11 +67,9 @@ export const paintScript = String.raw `  // ─── Painting ─────
     var side = $('side-nav');
     var main = mainWorktree();
     var agents = pipe.worktrees.filter(function (w) { return w.isAgentWorktree; }).length;
-    var s = pipe.report && pipe.report.summary;
     var navHtml = Studio.sidebarHtml({
       model: Studio.model, view: Studio.state.view,
-      worktreeCount: pipe.loaded.worktrees && !pipe.errors.worktrees ? agents : null,
-      benchmarkText: s ? compactNum(Number(s.averageThroughputOpsPerSec) || 0) : ''
+      worktreeCount: pipe.loaded.worktrees && !pipe.errors.worktrees ? agents : null
     });
     if (side.__html !== navHtml) { side.innerHTML = navHtml; side.__html = navHtml; }
     var foot = $('side-foot');
@@ -79,7 +77,10 @@ export const paintScript = String.raw `  // ─── Painting ─────
     if (foot.__html !== footHtml) { foot.innerHTML = footHtml; foot.__html = footHtml; }
     var lost = !!(pipe.errors.tasks || pipe.errors.status) || live.mode === 'offline';
     $('banner').hidden = !lost;
+    Studio.afterPaint.forEach(function (fn) { try { fn(); } catch (e) { /* one hook must not break painting */ } });
   }
+  Studio.afterPaint = Studio.afterPaint || [];
+  Studio.onPaint = function (fn) { Studio.afterPaint.push(fn); };
 
   /** One entry point after data or state changes: model, sidebar, current page, panel, palette. */
   function refreshUi(parts) {

package/dist/server/studio-ui/shell/pipeline-state.js

@@ -117,18 +117,9 @@ export const pipelineStateScript = String.raw `  // ─── Pipeline state ─
     return main;
   }
 
-  /** 1234 becomes "1.2k" so the sidebar badge stays small. */
-  function compactNum(n) {
-    if (!isFinite(n)) return '–';
-    if (n >= 1e6) return (n / 1e6).toFixed(1).replace(/\.0$/, '') + 'M';
-    if (n >= 1e3) return (n / 1e3).toFixed(1).replace(/\.0$/, '') + 'k';
-    return String(Math.round(n));
-  }
-
-  /** Newest Just-finished style helpers live in pages; here only what the runner tools need. */
   var RUN_LABEL = {
-    spawning_worktree: 'Worktree', running: 'Claude Running', verifying: 'Verifying', merging: 'Merging',
-    completed: 'Run completed', failed: 'Run failed', aborted: 'Run aborted'
+    spawning_worktree: 'Running', running: 'Running', verifying: 'Running', merging: 'Running',
+    completed: 'Done', failed: 'Stuck', aborted: 'Up next'
   };
   function runFor(taskId) {
     var found = null;

package/dist/server/studio-ui/shell/proposals.js

@@ -111,6 +111,7 @@ export const proposalsScript = String.raw `  // ─── Console tab 3: self-he
 
   function openConsole(taskId, quiet, tab) {
     var drawer = $('runner-console-drawer');
+    rememberInspectorOpener();
     if (rc.taskId !== taskId) {
       rc.taskId = taskId;
       rc.backfilled = false;
@@ -130,10 +131,11 @@ export const proposalsScript = String.raw `  // ─── Console tab 3: self-he
     rc.minimized = false;
     drawer.hidden = false;
     drawer.classList.remove('is-min');
-    $('rc-minimize').textContent = 'Minimize';
+    $('rc-minimize').textContent = 'Collapse';
     $('rc-minimize').setAttribute('aria-expanded', 'true');
     document.body.classList.add('has-console');
     document.body.classList.remove('has-console-min');
+    applyInspectorMode();
     syncConsole();
     syncHealTab();
     rcTick();
@@ -149,6 +151,8 @@ export const proposalsScript = String.raw `  // ─── Console tab 3: self-he
     rc.diffTimer = null;
     $('runner-console-drawer').hidden = true;
     document.body.classList.remove('has-console', 'has-console-min');
+    applyInspectorMode();
+    restoreInspectorFocus();
   }
 
   function toggleConsoleMinimized() {
@@ -158,7 +162,7 @@ export const proposalsScript = String.raw `  // ─── Console tab 3: self-he
     document.body.classList.toggle('has-console', !rc.minimized);
     document.body.classList.toggle('has-console-min', rc.minimized);
     var btn = $('rc-minimize');
-    btn.textContent = rc.minimized ? 'Expand' : 'Minimize';
+    btn.textContent = rc.minimized ? 'Expand' : 'Collapse';
     btn.setAttribute('aria-expanded', String(!rc.minimized));
     if (!rc.minimized && rc.tab === 'diff' && rc.taskId) loadConsoleDiff(rc.taskId);
   }

package/dist/server/studio-ui/shell/pulse.d.ts

@@ -0,0 +1 @@
+export declare const pulseScript: string;

package/dist/server/studio-ui/shell/pulse.js

@@ -0,0 +1,68 @@
+// Pulse strip: active milestone plus running, blocked and decision counts under the header.
+export const pulseScript = String.raw `  // ─── Pulse strip ───────────────────────────────────────────────────────────
+  /** Pure: turns raw counts into the strip's parts. in = { loaded, offline, ms, running, blocked, decisions }. */
+  function pulseParts(s) {
+    if (s.offline) return { kind: 'offline', text: 'Offline, retrying' };
+    if (!s.loaded) return { kind: 'loading', text: '-- -- -- --' };
+    var counts = [
+      { key: 'running', label: 'running', n: s.running, tone: 'run' },
+      { key: 'stuck', label: 'stuck', n: s.blocked, tone: 'bad' },
+      { key: 'decisions', label: s.decisions === 1 ? 'decision' : 'decisions', n: s.decisions, tone: 'warn' }
+    ];
+    counts = counts.filter(function (c) { return c.n > 0; });
+    counts.forEach(function (c) { c.zero = false; });
+    return { kind: 'ready', ms: s.ms, counts: counts };
+  }
+
+  function pulseHtml(p) {
+    if (p.kind !== 'ready') {
+      return '<span class="pulse-note ' + p.kind + '">' + esc(p.text) + '</span>';
+    }
+    if (!p.counts.length) return '';
+    var out = '<span class="pulse-ms num">' + esc(p.ms) + '</span>';
+    p.counts.forEach(function (c) {
+      out += '<button type="button" class="pulse-item ' + c.tone + '" data-pulse="' + c.key + '">' +
+        '<span class="num">' + c.n + '</span> ' + c.label + '</button>';
+    });
+    return out;
+  }
+
+  function pulseInput() {
+    var m = Studio.model;
+    var ms = null;
+    if (m) m.milestones.forEach(function (x) { if (x.id === m.activeMilestoneId) ms = x; });
+    // Same source as the Home decision queue, so the two counts agree.
+    var decisions = m && m.needsYou ? m.needsYou : [];
+    return {
+      loaded: !!(m && pipe.loaded.tasks),
+      offline: live.mode === 'offline',
+      ms: ms ? ms.id + ' ' + ms.done + '/' + ms.total : '',
+      running: m ? m.running.length : 0,
+      blocked: m ? m.stuck.length : 0,
+      decisions: decisions.length
+    };
+  }
+
+  var pulseEl = $('pulse');
+  function paintPulse() {
+    if (!pulseEl) return;
+    var html = pulseHtml(pulseParts(pulseInput()));
+    if (pulseEl.__html === html) return;
+    pulseEl.innerHTML = html;
+    pulseEl.hidden = !html;
+    pulseEl.__html = html;
+  }
+
+  // Studio.taskFilter ('running' or 'stuck') is read by the Tasks page when it opens.
+  if (pulseEl) pulseEl.addEventListener('click', function (e) {
+    var b = e.target.closest ? e.target.closest('[data-pulse]') : null;
+    if (!b) return;
+    var key = b.getAttribute('data-pulse');
+    if (key === 'decisions') { location.hash = '#home'; return; }
+    Studio.taskFilter = key;
+    location.hash = '#tasks';
+  });
+  Studio.onPaint(paintPulse);
+  paintPulse();
+
+`;

package/dist/server/studio-ui/shell/router.js

@@ -88,6 +88,31 @@ export const routerScript = String.raw `  // ─── Router and shell-wide eve
     });
   }, 1000);
 
+  // Active milestone: the one with running tasks, else the highest-index one.
+  Studio.activeMilestone = function (model) {
+    var list = (model && model.milestones) || [];
+    var run = list.filter(function (m) {
+      return m.tasks.some(function (t) { return t.status === 'in_progress'; });
+    });
+    var pool = run.length ? run : list;
+    return pool.length ? pool[pool.length - 1] : null;
+  };
+
+  var autoNavDone = false;
+  Studio.autoNav = function () {
+    if (autoNavDone || !pipe.loaded.tasks || !Studio.model) return;
+    var ms = Studio.activeMilestone(Studio.model);
+    if (!ms) return;
+    autoNavDone = true;
+    var S = Studio.state;
+    var opts = { milestoneId: ms.id, keepDetail: true, scroll: false };
+    if (!S.view) Studio.go('tasks', opts);
+    else { S.milestoneId = ms.id; paintPage(S.view); }
+    var el = document.querySelector('[data-milestone="' + cssEsc(ms.id) + '"], [data-ms-group="' + cssEsc(ms.id) + '"]');
+    if (el && el.scrollIntoView) el.scrollIntoView({ block: 'start' });
+  };
+  if (typeof Studio.onPaint === 'function') { Studio.onPaint(function () { Studio.autoNav(); }); }
+
   Studio.api = api;
   Studio.postJson = postJson;
   Studio.toast = function (message, kind) { toast(message, kind); };

package/dist/server/studio-ui/shell/sidebar-view.js

@@ -5,19 +5,21 @@ export const sidebarViewScript = String.raw `  // ─── Sidebar markup (pure
   function navBadges(env) {
     var badges = {}, model = env.model;
     if (model && model.needsYou.length) badges.home = ['warn', model.needsYou.length];
-    if (model && model.running.length) badges.tasks = ['run', model.running.length];
+    var ready = model ? model.tasks.filter(Studio.status.isReady).length : 0;
+    var active = model ? model.running.length + ready : 0;
+    if (active) badges.tasks = [model.running.length ? 'run' : '', active];
     if (env.worktreeCount != null) badges.worktrees = ['', env.worktreeCount];
-    if (env.benchmarkText) badges.benchmarks = ['', env.benchmarkText];
     return badges;
   }
 
-  /** env = { model, view, worktreeCount, benchmarkText }. */
+  /** env = { model, view, worktreeCount }. */
   Studio.sidebarHtml = function (env) {
     var badges = navBadges(env);
     var item = function (p) {
       var b = badges[p.id];
       return '<button type="button" class="nav-item" data-go="' + esc(p.id) + '"' +
-        (env.view === p.id ? ' aria-current="page"' : '') + '>' + ui.svg(p.icon) +
+        (env.view === p.id ? ' aria-current="page"' : '') +
+        ' aria-label="' + esc(p.label) + '" title="' + esc(p.label) + '"' + '>' + ui.svg(p.icon) +
         '<span class="nav-text">' + esc(p.label) + '</span>' +
         (b ? '<span class="nav-badge' + (b[0] ? ' ' + b[0] : '') + '">' + esc(b[1]) + '</span>' : '') + '</button>';
     };
@@ -32,7 +34,7 @@ export const sidebarViewScript = String.raw `  // ─── Sidebar markup (pure
   /** env = { root, branch }. */
   Studio.sideFootHtml = function (env) {
     return '<span>Workspace</span><span class="mono" id="sb-root" title="' + esc(env.root || '') + '">' +
-      esc(env.root || '–') + '</span><span>branch <span class="mono" id="sb-branch-name">' + esc(env.branch || '–') + '</span></span>';
+      esc(env.root || '-') + '</span><span>branch <span class="mono" id="sb-branch-name">' + esc(env.branch || '-') + '</span></span>';
   };
 
 `;

package/dist/server/studio-ui/shell/toasts-format.js

@@ -48,16 +48,16 @@ export const toastsFormatScript = String.raw `  // ─── Toasts ────
 
   // ─── Formatting ────────────────────────────────────────────────────────────
   function num(n) {
-    if (n == null || n === '' || isNaN(n)) return '–';
+    if (n == null || n === '' || isNaN(n)) return '-';
     return Number(n).toLocaleString('en-US', { maximumFractionDigits: 3 });
   }
   function usd(n) {
-    if (n == null || isNaN(n)) return '–';
+    if (n == null || isNaN(n)) return '-';
     n = Number(n);
     return '$' + (n >= 100 ? n.toFixed(0) : n >= 1 ? n.toFixed(2) : n.toFixed(3));
   }
   function fmtMs(ms) {
-    if (ms == null || isNaN(ms)) return '–';
+    if (ms == null || isNaN(ms)) return '-';
     if (ms < 1000) return Math.round(ms) + ' ms';
     if (ms < 60000) return (ms / 1000).toFixed(2) + ' s';
     return Math.floor(ms / 60000) + 'm ' + Math.round((ms % 60000) / 1000) + 's';
@@ -83,7 +83,7 @@ export const toastsFormatScript = String.raw `  // ─── Toasts ────
     if (typeof v === 'number') return num(v);
     if (Array.isArray(v)) return v.map(String).join(', ');
     if (v && typeof v === 'object') return JSON.stringify(v);
-    return String(v == null ? '–' : v);
+    return String(v == null ? '-' : v);
   }
 
 `;

package/dist/server/studio-ui/shell/triage.js

@@ -35,7 +35,7 @@ export const triageScript = String.raw `  // ─── Tier 1 AI Strategist (/ap
     $('t1-chip-model').textContent = modelName(model);
     $('t1-model').textContent = model;
     var last = lastTriage();
-    $('t1-latency').textContent = last ? fmtMs(last.latencyMs) + ' · ' + modelName(last.model || model) : 'No evaluations yet';
+    $('t1-latency').textContent = last ? fmtMs(last.latencyMs) + ', ' + modelName(last.model || model) : 'No evaluations yet';
     $('t1-key').textContent = pipe.errors.triage && !t ? 'Status unavailable' : !t ? 'Checking' : t.hasApiKey ? 'Configured' : 'Not set (offline rules)';
     var sw = $('t1-auto');
     var on = !!(t && t.autoTriageEnabled);

package/dist/server/studio-ui/styles/console.js

@@ -1,20 +1,40 @@
 // Runner console drawer and proposal review styles.
-export const consoleCss = String.raw `/* Live runner console drawer */
-body.has-console { padding-bottom: min(58vh, 520px); }
-body.has-console-min { padding-bottom: 56px; }
-#runner-console-drawer { position: fixed; inset: auto 0 0 var(--sidebar-w); z-index: 60; display: flex; flex-direction: column; max-height: min(58vh, 520px); background: var(--term-bg); color: var(--term-text); border-top: 1px solid var(--chip-border); box-shadow: var(--shadow-float); animation: rc-slide-up .28s cubic-bezier(.2, .8, .2, 1); }
+export const consoleCss = String.raw `/* Runner inspector: right pane at 1024px and up, modal sheet below. */
+#runner-console-drawer { position: fixed; top: var(--inspector-top, 96px); right: 0; bottom: 0; z-index: 30; width: 320px; display: flex; flex-direction: column; background: var(--term-bg); color: var(--term-text); border-left: 1px solid var(--line); transition: width .2s ease; }
 #runner-console-drawer[hidden] { display: none; }
-#runner-console-drawer.is-min .rc-body, #runner-console-drawer.is-min .rc-foot { display: none; }
-@keyframes rc-slide-up { from { transform: translateY(100%); } to { transform: translateY(0); } }
-.rc-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 14px; border-bottom: 1px solid var(--term-line); }
+/* Content reflows beside the pane instead of sitting under it. */
+body.has-console main, body:has(#runner-console-drawer:not([hidden])) main { margin-right: 320px; }
+body.has-console-min main { margin-right: 56px; }
+@media (min-width: 1280px) {
+  #runner-console-drawer { width: 360px; }
+  body.has-console main, body:has(#runner-console-drawer:not([hidden])) main { margin-right: 360px; }
+}
+#runner-console-drawer.is-min { width: 56px; overflow: hidden; }
+#runner-console-drawer.is-min .rc-body, #runner-console-drawer.is-min .rc-foot, #runner-console-drawer.is-min .rc-title, #runner-console-drawer.is-min .rc-steps, #runner-console-drawer.is-min .rc-status, #runner-console-drawer.is-min .rc-clock { display: none; }
+@media (max-width: 1023px) {
+  #runner-console-drawer { top: 0; width: min(420px, 92vw); max-width: 92vw; z-index: 40; border-radius: 6px 0 0 6px; box-shadow: var(--shadow); }
+  body.has-console main, body.has-console-min main, body:has(#runner-console-drawer:not([hidden])) main { margin-right: 0; }
+}
+/* The task detail dialog stays modal above the inspector. */
+#task-drawer { z-index: 45; }
+.rc-id-row { display: flex; align-items: center; gap: 10px; width: 100%; }
+.rc-status { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--term-muted); }
+.rc-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--term-muted); }
+.rc-status[data-tone="ok"] .rc-dot { background: var(--ok); }
+.rc-status[data-tone="err"] .rc-dot { background: var(--danger); }
+.rc-status[data-tone="run"] .rc-dot { background: var(--warn); }
+.rc-clock { margin-left: auto; font-family: var(--mono); font-size: 12px; font-variant-numeric: tabular-nums; color: var(--term-muted); }
 .rc-task { font-family: var(--mono); font-size: 12.5px; font-weight: 600; }
-.rc-title { font-size: 12.5px; color: var(--term-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 34ch; }
-.rc-steps { display: flex; align-items: center; gap: 6px; margin: 0 0 0 auto; padding: 0; list-style: none; }
+.rc-title { font-size: 12.5px; color: var(--term-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; flex: 1 1 100%; }
+.rc-steps { display: flex; align-items: center; gap: 6px; margin: 0; padding: 0; list-style: none; flex-wrap: wrap; }
 .rc-step { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; font-size: 11px; color: var(--term-muted); border: 1px solid var(--term-line); border-radius: var(--r-control); }
 .rc-step.is-done { color: var(--ok); border-color: color-mix(in srgb, var(--ok) 55%, transparent); }
 .rc-step.is-active { color: var(--term-text); background: color-mix(in srgb, var(--primary) 32%, transparent); border-color: var(--primary); }
 .rc-step.is-failed { color: var(--term-text); background: color-mix(in srgb, var(--danger) 32%, transparent); border-color: var(--danger); }
-.rc-controls { display: flex; gap: 6px; flex: none; }
+.rc-controls { display: flex; gap: 6px; flex-wrap: wrap; }
+.rc-more { position: relative; }
+.rc-menu { position: absolute; top: calc(100% + 4px); left: 0; z-index: 2; display: flex; flex-direction: column; gap: 4px; padding: 6px; background: var(--term-bg); border: 1px solid var(--term-line); border-radius: var(--r-control); }
+.rc-menu[hidden], .rc-btn[hidden], .rc-steps[hidden], .rc-foot[hidden] { display: none; }
 .rc-btn { padding: 5px 9px; font: 500 11px/1 var(--font); color: var(--term-text); background: transparent; border: 1px solid var(--term-line); border-radius: var(--r-control); cursor: pointer; }
 .rc-btn:hover { background: color-mix(in srgb, var(--term-muted) 22%, transparent); }
 .rc-btn:disabled { opacity: .45; cursor: not-allowed; }
@@ -22,7 +42,7 @@ body.has-console-min { padding-bottom: 56px; }
 .rc-btn.danger { color: var(--term-text); border-color: var(--danger); }
 .rc-btn.danger:hover { background: color-mix(in srgb, var(--danger) 30%, transparent); }
 .rc-btn:focus-visible { outline: 2px solid var(--term-text); outline-offset: 2px; }
-.rc-body { flex: 1 1 auto; min-height: 120px; margin: 0; padding: 10px 14px; overflow: auto; font-family: var(--mono); font-size: 12.5px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
+.rc-body { flex: 1 1 auto; min-height: 120px; margin: 0; padding: 10px 14px; overflow: auto; font-family: var(--mono); font-size: 12.5px; font-variant-numeric: tabular-nums; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
 .rc-body:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
 .rc-empty { color: var(--term-muted); }
 .rc-fg-muted { color: var(--term-muted); }
@@ -31,10 +51,10 @@ body.has-console-min { padding-bottom: 56px; }
 .rc-fg-info { color: var(--accent); }
 .rc-fg-danger { color: color-mix(in srgb, var(--danger) 55%, #fff); }
 .rc-bold { font-weight: 700; }
-.rc-foot { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 7px 14px; font-size: 11.5px; color: var(--term-muted); border-top: 1px solid var(--term-line); }
+.rc-foot { font-variant-numeric: tabular-nums; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 7px 14px; font-size: 11.5px; color: var(--term-muted); border-top: 1px solid var(--term-line); }
 .rc-foot strong { font-family: var(--mono); font-weight: 600; color: var(--term-text); }
 #runner-console-drawer.is-min .rc-tabs { display: none; }
-.rc-tabs { display: flex; gap: 2px; padding: 0 14px; border-bottom: 1px solid var(--term-line); }
+.rc-tabs { display: flex; gap: 2px; padding: 0 10px; overflow-x: auto; border-bottom: 1px solid var(--line); }
 .rc-tab { display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; font: 500 12px/1 var(--font); color: var(--term-muted); background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; }
 .rc-tab:hover { color: var(--term-text); }
 .rc-tab[aria-selected="true"] { color: var(--term-text); border-bottom-color: var(--primary); }
@@ -80,4 +100,7 @@ body.has-console-min { padding-bottom: 56px; }
 .heal-result.is-error { color: color-mix(in srgb, var(--danger) 55%, #fff); border-color: color-mix(in srgb, var(--danger) 45%, transparent); }
 .heal-skel { height: 12px; margin: 8px 0; border-radius: 4px; background: var(--term-line); animation: blink 1.4s ease-in-out infinite; }
 @media (max-width: 768px) { .heal-grid { grid-template-columns: 1fr; } }
+@media (prefers-reduced-motion: reduce) {
+  #runner-console-drawer, #runner-console-drawer * { transition: none !important; animation: none !important; }
+}
 `;

package/dist/server/studio-ui/styles/dialogs.js

@@ -2,7 +2,7 @@
 export const dialogsCss = String.raw `/* Toasts */
 /* Bottom-right so notifications never cover the sticky header and navigation. */
 .toast-host { position: fixed; right: 16px; bottom: 16px; z-index: 100; display: flex; flex-direction: column; gap: 8px; width: min(440px, calc(100vw - 32px)); pointer-events: none; }
-.toast { pointer-events: auto; display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; font-size: 13.5px; background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--danger); border-radius: var(--r-card); box-shadow: var(--shadow-float); animation: toast-in .18s ease-out; }
+.toast { pointer-events: auto; display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; font-size: 13.5px; background: var(--surface); border: 1px solid var(--line-2); border-left: 3px solid var(--danger); border-radius: var(--r-card); box-shadow: var(--shadow); animation: toast-in .18s ease-out; }
 .toast.ok { border-left-color: var(--success); }
 .toast .t-body { flex: 1; min-width: 0; overflow-wrap: anywhere; }
 .toast .t-hint { color: var(--muted); font-size: 12.5px; }
@@ -12,8 +12,8 @@ export const dialogsCss = String.raw `/* Toasts */
 /* Dialogs */
 dialog { border: none; padding: 0; background: transparent; color: var(--text); width: min(640px, calc(100vw - 32px)); max-height: calc(100vh - 32px); }
 dialog.narrow { width: min(460px, calc(100vw - 32px)); }
-dialog::backdrop { background: rgb(10 10 20 / 0.4); backdrop-filter: blur(2px); }
-.modal { padding: 22px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-card); box-shadow: var(--shadow-float); }
+dialog::backdrop { background: color-mix(in srgb, var(--text) 40%, transparent); backdrop-filter: blur(2px); }
+.modal { padding: 22px; background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r-card); box-shadow: var(--shadow); }
 .modal h2 { margin: 0 0 4px; font-size: 18px; font-weight: 600; }
 .modal .lead { color: var(--muted); margin: 0 0 16px; font-size: 14px; line-height: 1.55; }
 .field { margin-bottom: 16px; }
@@ -112,7 +112,7 @@ textarea.cmd-preview { min-height: 92px; font-family: var(--mono); font-size: 12
 .switch-text { display: flex; flex-direction: column; font-size: 13.5px; }
 .switch-text b { font-weight: 600; }
 .switch-text span { font-size: 12.5px; color: var(--muted); }
-kbd { padding: 0 5px; font-family: var(--mono); font-size: 11px; color: var(--muted); background: var(--chip); border: 1px solid var(--chip-border); border-radius: 4px; }
+kbd { padding: 0 5px; font-family: var(--mono); font-size: 11px; color: var(--muted); background: var(--chip); border: 1px solid var(--chip-border); border-radius: var(--r-control); }
 .btn.primary kbd { color: var(--accent-fg); background: transparent; border-color: color-mix(in srgb, var(--accent-fg) 45%, transparent); }
 
 `;

package/dist/server/studio-ui/styles/responsive.js

@@ -1,5 +1,13 @@
 // Responsive rules for the kept pages and dialogs.
 export const responsiveCss = String.raw `/* Responsive */
+@media (max-width: 1023px) and (min-width: 761px) {
+  :root { --sidebar-w: 56px; }
+  .side { padding: 16px 8px; align-items: center; }
+  .brand { padding: 0; justify-content: center; }
+  .brand .wordmark { height: 16px; width: 16px; overflow: hidden; }
+  .brand b, .brand .ver, .nav-glabel, .nav-text, .nav-badge, .side-foot { display: none; }
+  .nav-item { justify-content: center; padding: 6px; width: 40px; }
+}
 @media (max-width: 900px) {
   #runner-console-drawer { inset: auto 0 0 0; }
   .panes { grid-template-columns: 1fr; }

package/dist/server/studio-ui/styles/shell.js

@@ -3,22 +3,23 @@ export const shellCss = String.raw `/* Layout */
 .app { display: grid; grid-template-columns: var(--sidebar-w) minmax(0, 1fr); min-height: 100vh; }
 .side { border-right: 1px solid var(--line); background: var(--surface); padding: 16px 12px; display: flex; flex-direction: column; gap: 20px; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
 .brand { display: flex; align-items: center; gap: 10px; padding: 0 6px; }
-.logo { width: 26px; height: 26px; border-radius: 7px; background: var(--accent); color: var(--accent-fg); display: grid; place-items: center; font-weight: 700; font-size: 14px; flex: none; }
+.wordmark { height: 18px; width: auto; color: var(--fg); display: block; flex: none; }
+.wordmark.is-rail { height: 16px; }
 .brand b { font-weight: 600; white-space: nowrap; }
-.brand .ver { margin-left: auto; font: 11px var(--mono); color: var(--fg-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.side-foot .ver { font: 11px var(--mono); color: var(--fg-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .nav { display: flex; flex-direction: column; gap: 14px; }
 .nav-group { display: flex; flex-direction: column; gap: 2px; }
 .nav-glabel { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--fg-3); padding: 0 8px 4px; }
 .nav-item { display: flex; align-items: center; gap: 10px; min-height: 32px; padding: 7px 8px; border-radius: 7px; border: 0; background: none; text-align: left; color: var(--fg-2); width: 100%; cursor: pointer; transition: background .15s, color .15s; }
-.nav-item svg { width: 16px; height: 16px; flex: none; }
+.nav-item svg { width: 20px; height: 20px; flex: none; }
 .nav-item:hover { background: var(--surface-2); color: var(--fg); }
-.nav-item[aria-current="page"] { background: var(--accent-soft); color: var(--accent); font-weight: 500; }
+.nav-item[aria-current="page"] { background: var(--accent-soft); color: var(--fg); font-weight: 600; }
 .nav-badge { margin-left: auto; font: 500 11px var(--font); font-variant-numeric: tabular-nums; min-width: 20px; padding: 1px 6px; border-radius: 999px; background: var(--surface-2); color: var(--fg-2); text-align: center; }
 .nav-badge.warn { background: var(--warn-soft); color: var(--warn); }
 .nav-badge.run { background: var(--run-soft); color: var(--run); }
 .side-foot { margin-top: auto; font-size: 12px; color: var(--fg-3); padding: 0 8px; display: flex; flex-direction: column; gap: 4px; }
 .side-foot > div { display: flex; flex-direction: column; gap: 4px; }
-.side-foot .mono { color: var(--fg-2); font-size: 11px; word-break: break-all; }
+.side-foot .mono { color: var(--fg-2); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .foot-project { color: var(--fg); font-weight: 500; }
 .main { min-width: 0; display: flex; flex-direction: column; }
 .top { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 24px; }
@@ -27,6 +28,22 @@ export const shellCss = String.raw `/* Layout */
 .top-right { margin-left: auto; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
 .btn.ghost { background: none; border-color: transparent; color: var(--fg-2); box-shadow: none; }
 .btn.ghost:hover { background: var(--surface-2); }
+.spacer { flex: 1; }
+.ic-sun, .ic-moon { display: inline-flex; }
+.ic-moon { display: none; }
+:root[data-theme="light"] .ic-sun { display: none; }
+:root[data-theme="light"] .ic-moon { display: inline-flex; }
+@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .ic-sun { display: none; } :root:not([data-theme="dark"]) .ic-moon { display: inline-flex; } }
+#pulse[hidden] { display: none; }
+.pulse-strip { min-height: 32px; height: auto; width: auto; border-radius: 0; background: none; box-shadow: none; animation: none; display: flex; flex-wrap: wrap; align-items: center; gap: 0 20px; padding: 0 24px; border-bottom: 1px solid var(--line); font: 12.5px var(--mono); color: var(--fg-2); }
+#pulse .num { font-variant-numeric: tabular-nums; }
+#pulse .pulse-ms { color: var(--fg); padding-right: 20px; border-right: 1px solid var(--line); }
+#pulse .pulse-item { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0; border: 0; background: none; font: inherit; cursor: pointer; }
+#pulse .pulse-note.loading { color: var(--fg-3); }
+#pulse .pulse-item.run { color: var(--run); } #pulse .pulse-item.bad { color: var(--bad); } #pulse .pulse-item.warn, #pulse .pulse-note.offline { color: var(--warn); }
+@media (max-width: 1023px) { .pulse-strip { padding-top: 4px; padding-bottom: 4px; gap: 0 16px; } #pulse .pulse-ms { flex-basis: 100%; border-right: 0; padding-right: 0; } }
+.wordmark.is-rail { display: none; }
+@media (max-width: 1023px) { .wordmark { display: none; } .wordmark.is-rail { display: block; } }
 .btn svg { width: 14px; height: 14px; }
 .kbd { font: 11px var(--mono); padding: 0 5px; border: 1px solid var(--line); border-radius: 4px; color: var(--fg-3); }
 .live { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--fg-2); }
@@ -113,5 +130,5 @@ export const shellCss = String.raw `/* Layout */
   .drawer { width: 100%; }
   #runner-console-drawer { inset: auto 0 0 0; }
 }
-@media (prefers-reduced-motion: reduce) { .pulse, .live-dot.flash { animation: none; } * { transition: none !important; } }
+@media (prefers-reduced-motion: reduce) { .pulse, .live-dot.flash { animation: none !important; } * { transition: none !important; } }
 `;

package/dist/server/studio-ui/styles/strategist.js

@@ -12,30 +12,30 @@ export const strategistCss = String.raw `/* Tier 1 AI Strategist (ui_specs.md §
 .t1-chip-label { color: var(--muted); }
 .t1-caret { color: var(--muted); transition: transform .15s; }
 .t1-chip[aria-expanded="true"] .t1-caret { transform: rotate(180deg); }
-.t1-menu { position: absolute; top: calc(100% + 6px); right: 0; z-index: 30; width: 300px; padding: 12px; font-size: 12.5px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-card); box-shadow: var(--shadow-float); }
+.t1-menu { position: absolute; top: calc(100% + 6px); right: 0; z-index: 30; width: 300px; padding: 12px; font-size: 12.5px; background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r-card); box-shadow: var(--shadow); }
 .t1-menu:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
 .t1-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 28px; color: var(--muted); }
 .t1-row b, .t1-row code { color: var(--text); font-weight: 500; font-variant-numeric: tabular-nums; }
 .t1-row code { font-family: var(--mono); font-size: 12px; }
-.t1-switch { position: relative; width: 54px; height: 24px; padding: 0 8px; font: 600 10.5px/22px var(--mono); color: var(--muted); text-align: right; background: var(--chip); border: 1px solid var(--chip-border); border-radius: 12px; cursor: pointer; transition: background .15s, border-color .15s; }
+.t1-switch { position: relative; width: 54px; height: 24px; padding: 0 8px; font: 600 10.5px/22px var(--mono); color: var(--muted); text-align: right; background: var(--chip); border: 1px solid var(--chip-border); border-radius: var(--r-control); cursor: pointer; transition: background .15s, border-color .15s; }
 .t1-switch::before { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--surface); box-shadow: var(--shadow); transition: transform .15s; }
-.t1-switch[aria-checked="true"] { color: #fff; text-align: left; background: var(--success); border-color: var(--success); }
+.t1-switch[aria-checked="true"] { color: var(--accent-fg); text-align: left; background: var(--success); border-color: var(--success); }
 .t1-switch[aria-checked="true"]::before { transform: translateX(30px); }
 .t1-switch:disabled { opacity: .5; cursor: not-allowed; }
 .t1-policy { display: flex; gap: 6px; margin: 8px 0; padding: 8px; line-height: 1.45; color: var(--muted); background: var(--bg); border: 1px solid var(--border); border-radius: var(--r-control); }
 .t1-policy .icon { flex: none; margin-top: 1px; color: var(--success); }
 .t1-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 0; }
-.t1-stats div { min-width: 0; padding: 6px 8px; border: 1px solid var(--border); border-radius: var(--r-control); }
+.t1-stats div { min-width: 0; padding: 6px 8px; border: 0; border-left: 1px solid var(--line); border-radius: 0; font-variant-numeric: tabular-nums; }
 .t1-stats dt { font-size: 11px; color: var(--muted); }
 .t1-stats dd { margin: 2px 0 0; font: 600 15px/1.2 var(--mono); font-variant-numeric: tabular-nums; color: var(--text); }
 .t1-strip { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 0 0 10px; padding: 8px 10px; color: var(--term-muted); border: 1px solid var(--term-line); border-radius: var(--r-control); }
 .t1-strip > span { display: inline-flex; align-items: center; gap: 6px; }
 .t1-strip strong { color: var(--term-text); font-weight: 600; }
 .t1-strip.is-triaging { border-color: color-mix(in srgb, var(--active) 60%, transparent); background: color-mix(in srgb, var(--active) 14%, transparent); }
-.rc-btn.t1-run { color: #fff; background: var(--active); border-color: var(--active); }
-.rc-btn.t1-run:hover:not(:disabled) { background: color-mix(in srgb, var(--active) 88%, #000); }
+.rc-btn.t1-run { color: var(--accent-fg); background: var(--active); border-color: var(--active); }
+.rc-btn.t1-run:hover:not(:disabled) { background: color-mix(in srgb, var(--active) 88%, var(--text)); }
 .t1-banner { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; padding: 8px 10px; font-weight: 600; border-radius: var(--r-control); }
-.t1-banner.is-resolved { color: #fff; background: var(--success); }
+.t1-banner.is-resolved { color: var(--accent-fg); background: var(--success); }
 .t1-banner.is-safe { color: var(--ok); border: 1px solid color-mix(in srgb, var(--ok) 45%, transparent); }
 .t1-card { margin: 0 0 12px; padding: 12px 12px 12px 16px; border: 1px solid var(--term-line); border-left: 4px solid var(--proposal); border-radius: var(--r-card); }
 .t1-card-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
@@ -53,10 +53,10 @@ export const strategistCss = String.raw `/* Tier 1 AI Strategist (ui_specs.md §
 .t1-opt:hover { border-color: var(--term-text); }
 .t1-opt.is-recommended { background: var(--primary); border-color: var(--primary); }
 .t1-opt.is-recommended:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
-.t1-opt.is-recommended span { color: color-mix(in srgb, #fff 82%, var(--primary)); }
+.t1-opt.is-recommended span { color: color-mix(in srgb, var(--accent-fg) 82%, var(--primary)); }
 .t1-opt[aria-checked="true"] { box-shadow: 0 0 0 2px var(--term-bg), 0 0 0 4px var(--proposal); }
 .t1-custom { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; font-size: 12px; color: var(--term-muted); }
-.t1-custom textarea { width: 100%; box-sizing: border-box; min-height: 52px; padding: 6px 8px; font: 12.5px/1.45 var(--font); color: var(--term-text); background: rgb(148 163 184 / 0.08); border: 1px solid var(--term-line); border-radius: var(--r-control); resize: vertical; }
+.t1-custom textarea { width: 100%; box-sizing: border-box; min-height: 52px; padding: 6px 8px; font: 12.5px/1.45 var(--font); color: var(--term-text); background: color-mix(in srgb, var(--term-text) 8%, transparent); border: 1px solid var(--term-line); border-radius: var(--r-control); resize: vertical; }
 .t1-custom textarea:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
 .t1-decided { margin: 8px 0 0; font-size: 12px; color: var(--term-muted); }
 @media (prefers-reduced-motion: reduce) { .t1-chip[data-state="triaging"] .t1-spark { animation: none; } }
@@ -65,7 +65,7 @@ export const strategistCss = String.raw `/* Tier 1 AI Strategist (ui_specs.md §
   .t1-menu { position: fixed; top: 56px; left: 16px; right: 16px; width: auto; }
 }
 .df-add { display: block; color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); }
-.df-del { display: block; color: color-mix(in srgb, var(--danger) 55%, #fff); background: color-mix(in srgb, var(--danger) 14%, transparent); }
+.df-del { display: block; color: color-mix(in srgb, var(--danger) 55%, var(--accent-fg)); background: color-mix(in srgb, var(--danger) 14%, transparent); }
 .df-hunk { display: block; color: var(--accent); }
 .df-file { display: block; margin-top: 8px; font-weight: 700; color: var(--term-text); }
 .df-meta { display: block; color: var(--term-muted); }