synabun 2.0.9 → 2.1.0

package/neural-interface/public/shared/assistant/asst-sidepanel.js

@@ -30,6 +30,7 @@ import { brainLabel, readStoredBrain, restoredSessionName } from './asst-state.j
 import { closeMenu, isMenuOpen, openMenu } from './asst-menu.js';
 import { injectAssistantSidepanelStyles } from './asst-sidepanel-styles.js';
 import { createMascot, mascotCameoSvg } from '../synabun-mascot.js';
+import { createTutorialPreview } from '../ui-tutorial-preview.js';
 
 const PANEL_OWNER = 'assistant-sidepanel';
 const HOST_ID = 'sidepanel';
@@ -55,6 +56,7 @@ let _toastTimer = null;
 let _renaming = false;
 const _tabs = [];   // { sessionId, viewport, toolbar, ctl, pill, label, userRenamed, status, brain }
 let _activeIdx = -1;
+let _tourPresenting = false;
 
 // ── Helpers ──────────────────────────────────────────────────────────────────
 
@@ -408,13 +410,13 @@ function focusSession(sessionId, { prompt = '' } = {}) {
   if (prompt) _tabs[idx].ctl?.send(prompt);
 }
 
-async function startSession() {
+async function startSession(prompt = '') {
   if (_starting || _tabs.length) return;
   _starting = true;
   _startError = '';
   renderPlaceholder('starting');
   try {
-    const res = await openAssistant({ host: HOST_ID });
+    const res = await openAssistant(prompt ? { host: HOST_ID, prompt } : { host: HOST_ID });
     if (!_tabs.length) renderPlaceholder(res ? null : 'failed');
   } finally {
     _starting = false;
@@ -563,8 +565,8 @@ function applyVisibility(nextVisible) {
   const tab = activeTab();
   if (_visible) {
     state.lastActivePanel = 'assistant';
-    if (!_tabs.length) startSession();
-    else if (tab) {
+    if (!_tabs.length && !_tourPresenting) startSession();
+    else if (tab && !_tourPresenting) {
       if (tab.status === 'done') tab.status = 'idle';
       try { tab.ctl?.onShown(); } catch { /* ignore */ }
       noteAssistantFocus(tab.sessionId, HOST_ID);
@@ -617,6 +619,67 @@ export function assistantPanelPeekable() {
   return !assistantBlocked() && _tabs.length > 0;
 }
 
+/**
+ * Present the panel for the Workspace tour (ui-tutorial.js), reversibly: it never
+ * creates a session. The tour plays on the active tab when its empty state shows
+ * its character (the tab's own controls, composer and director: tourHost());
+ * otherwise (no tab, or a conversation on screen) on a session-free preview laid
+ * over the tab. Returns { host, live, restore({ reason }) } or null when the
+ * Assistant is blocked. restore() puts back the panel's visibility, the docked
+ * peers and the last-active panels, unless the tour ended on its hand-off to a
+ * live tab ('done'): then the panel stays and the tab's composer takes the focus.
+ */
+export function beginAssistantTour({ onPreviewSend = () => {} } = {}) {
+  if (assistantBlocked()) return null;
+  ensurePanel();
+  const wasVisible = _visible;
+  const previousPanel = state.lastActivePanel;
+  const previousSidepanel = state.lastActiveSidepanel;
+  const peers = ['#topright-claude-panel-btn', '#topright-codex-panel-btn', '#topright-opencode-panel-btn']
+    .map(s => document.querySelector(s)).filter(b => b?.classList.contains('active'));
+  _tourPresenting = true;
+  const tab = activeTab();
+  let liveHost = null;
+  try { liveHost = tab?.ctl?.tourHost?.() || null; } catch { liveHost = null; }
+  const preview = liveHost ? null : createTutorialPreview(_panel, { onSend: (text) => onPreviewSend(text) });
+  if (preview) _panel.classList.add('tour-covering');
+  setVisible(true);
+  let restored = false;
+  const host = liveHost || preview.host;
+  return {
+    host,
+    live: !!liveHost,
+    /**
+     * The user sent `text` from the preview's composer (after restore({ reason: 'sent' })):
+     * with no session, it starts one with that message (the user's own send); with a
+     * conversation on screen, it becomes that conversation's draft, never sent for them.
+     */
+    deliver(text) {
+      const message = String(text || '').trim();
+      if (!message) return;
+      const current = activeTab();
+      if (current?.ctl) { focusSession(current.sessionId); current.ctl.insertText?.(message); current.ctl.focus?.(); return; }
+      startSession(message);
+    },
+    restore({ reason = 'skip' } = {}) {
+      if (restored) return;
+      restored = true;
+      closeMenu();
+      preview?.destroy();
+      _panel.classList.remove('tour-covering');
+      _tourPresenting = false;
+      const keep = (reason === 'done' && !!liveHost) || reason === 'sent';
+      if (keep) {
+        if (tab && findTab(tab.sessionId)) { try { tab.ctl?.onShown(); } catch { /* ignore */ } }
+        return;
+      }
+      if (!wasVisible) setVisible(false);
+      for (const button of peers) if (!button.classList.contains('active')) button.click();
+      state.lastActivePanel = previousPanel; state.lastActiveSidepanel = previousSidepanel;
+    },
+  };
+}
+
 /** The top-right SynaBun button. */
 export async function toggleAssistantPanel() {
   if (assistantBlocked()) {

package/neural-interface/public/shared/assistant/asst-slash.js

@@ -7,7 +7,7 @@
 import { normalizeComputerMode, normalizeProvider, normalizeRouteMode } from './asst-state.js';
 
 export const SLASH_COMMANDS = [
-  { name: 'dispatch', usage: '/dispatch <provider> [--model m] [--effort e] [--agent a] [--project p] [--mcp profile] [--account id] [--ask] [--title "t"] <task>', descKey: 'assistant.slash.dispatch', desc: 'Dispatch a task to a sidepanel agent' },
+  { name: 'dispatch', usage: '/dispatch <provider> [--model m] [--effort e] [--agent a] [--project p] [--tools a,b] [--account id] [--ask] [--title "t"] <task>', descKey: 'assistant.slash.dispatch', desc: 'Dispatch a task to a sidepanel agent' },
   { name: 'agents', usage: '/agents [all]', descKey: 'assistant.slash.agents', desc: 'List dispatched runs' },
   { name: 'recall', usage: '/recall <query>', descKey: 'assistant.slash.recall', desc: 'Search memories' },
   { name: 'remember', usage: '/remember <text>', descKey: 'assistant.slash.remember', desc: 'Store a memory' },
@@ -17,7 +17,7 @@ export const SLASH_COMMANDS = [
   { name: 'models', usage: '/models [list | archived | hide <id…> | show <id…>]', descKey: 'assistant.slash.models', desc: 'Switch models off or on for the Assistant (or open the Models list)' },
   { name: 'budget', usage: '/budget', descKey: 'assistant.slash.budget', desc: 'Set the session budget and view provider shares' },
   { name: 'computer', usage: '/computer [on|off]', descKey: 'assistant.slash.computer', desc: 'Let the assistant use your Mac' },
-  { name: 'stop', usage: '/stop [runId|all]', descKey: 'assistant.slash.stop', desc: 'Stop a run, everything, or the current turn' },
+  { name: 'stop', usage: '/stop [runId|title|all]', descKey: 'assistant.slash.stop', desc: 'Stop a run, everything, or the current turn' },
   { name: 'new', usage: '/new [provider]', descKey: 'assistant.slash.new', desc: 'Start a fresh session' },
   { name: 'resume', usage: '/resume [sessionId]', descKey: 'assistant.slash.resume', desc: 'Resume a previous session' },
   { name: 'compact', usage: '/compact', descKey: 'assistant.slash.compact', desc: 'Compact the context' },
@@ -33,7 +33,7 @@ export const DISPATCH_FLAGS = {
   effort: 'effort', e: 'effort',
   agent: 'agent',
   project: 'project', p: 'project', cwd: 'project',
-  mcp: 'mcp', profile: 'mcp',
+  tools: 'tools',
   account: 'account', a: 'account',
   title: 'title', t: 'title',
   budget: 'budget',
@@ -219,10 +219,10 @@ export function matchSlashCommands(query) {
 
 /**
  * Build the POST /api/assistant/dispatch body from a parsed /dispatch command.
- * Only explicit flags set model/effort — the brain's project, MCP profile and
+ * Only explicit flags set model/effort — the brain's project and
  * (same-provider) account are inherited, models are left to the server default.
  */
-export function buildDispatchSpec(parsed, brain = {}, { assistantSessionId = null } = {}) {
+export function buildDispatchSpec(parsed, brain = {}, { assistantSessionId = null, toolCatalog = null } = {}) {
   if (!parsed || parsed.name !== 'dispatch' || parsed.error) return null;
   const o = parsed.options || {};
   const spec = {
@@ -236,8 +236,7 @@ export function buildDispatchSpec(parsed, brain = {}, { assistantSessionId = nul
   if (o.model) spec.model = o.model;
   if (o.effort) spec.effort = o.effort;
   if (o.agent) spec.agent = o.agent;
-  const mcp = o.mcp || brain.mcpProfile;
-  if (mcp) spec.mcpProfile = mcp;
+  if (o.tools !== undefined) spec.tools = String(o.tools).split(',').map(id => id.trim()).filter(Boolean);
   const account = o.account || (brain.provider === parsed.provider ? brain.accountId : null);
   if (account) {
     if (parsed.provider === 'codex') spec.codexAccountId = account;
@@ -247,6 +246,9 @@ export function buildDispatchSpec(parsed, brain = {}, { assistantSessionId = nul
   if (o.budget !== undefined && Number.isFinite(Number(o.budget))) spec.budgetUsd = Number(o.budget);
   if (o.minutes !== undefined && Number.isFinite(Number(o.minutes))) spec.maxMinutes = Number(o.minutes);
   if (o.browser) spec.usesBrowser = true;
+  // A browser-reading slash launch uses the workspace guard, just like a routed browser task.
+  // Group metadata comes from the catalog, never from a second list of browser ids.
+  if (o.browser || (spec.tools || []).some(id => id === 'all' || toolCatalog?.groups?.some(group => group.id === id && group.browser))) spec.capability = 'workspace';
   if (assistantSessionId) spec.assistantSessionId = assistantSessionId;
   return spec;
 }

package/neural-interface/public/shared/assistant/asst-state.js

@@ -64,7 +64,7 @@ export const DEFAULT_BRAIN = Object.freeze({
   effort: null,
   agent: null,
   project: null,
-  mcpProfile: '',
+  tools: Object.freeze(['all']),
   accountId: null,
   permissionMode: 'default',
   planMode: false,
@@ -105,7 +105,7 @@ export function normalizeBrain(raw, fallback = DEFAULT_BRAIN) {
     effort: str(src.effort) || null,
     agent: provider === 'opencode' ? (str(src.agent) || null) : null,
     project: str(src.project ?? src.cwd) || null,
-    mcpProfile: str(src.mcpProfile),
+    tools: provider === 'opencode' ? (Array.isArray(src.tools) ? [...src.tools] : null) : ['all'],
     accountId: ACCOUNT_PROVIDERS.has(provider) ? (str(src.accountId) || null) : null,
     permissionMode: modes.some(m => m.id === mode) ? mode : 'default',
     planMode: PLAN_MODE_PROVIDERS.has(provider) && (src.planMode === true || legacyPlan),
@@ -145,7 +145,7 @@ function pickDefault(list) {
  *   efforts: { [provider]: [{ id, tier? }] },
  *   accounts: { [provider]: [{ id, label }] },
  *   agents: [{ name, mode? }],                 // OpenCode
- *   mcpProfiles: { [id]: { label } }, defaultMcpProfile,
+ *   toolCatalog: { default, groups },
  *   projects: [{ path, label }],
  * }
  */
@@ -188,14 +188,8 @@ export function resolveBrainDefaults(brain, catalog = {}) {
     b.accountId = null;
   }
 
-  const profiles = catalog.mcpProfiles && typeof catalog.mcpProfiles === 'object' ? catalog.mcpProfiles : null;
-  if (profiles) {
-    const ids = Object.keys(profiles);
-    if (ids.length && !ids.includes(b.mcpProfile)) {
-      b.mcpProfile = ids.includes(catalog.defaultMcpProfile) ? catalog.defaultMcpProfile : (ids.includes('full') ? 'full' : ids[0]);
-    }
-  } else if (!b.mcpProfile && catalog.defaultMcpProfile) {
-    b.mcpProfile = catalog.defaultMcpProfile;
+  if (b.provider === 'opencode' && b.tools == null && catalog.toolCatalog) {
+    b.tools = [...new Set([...(catalog.toolCatalog.default || []).filter(id => id !== 'git'), 'browser'])];
   }
 
   if (!b.project && Array.isArray(catalog.projects) && catalog.projects.length === 1) {
@@ -285,7 +279,7 @@ export function emptyProjectView(project, projects = [], tr = (_key, fallback, p
 export function brainRequiresSwitch(a, b) {
   const x = normalizeBrain(a);
   const y = normalizeBrain(b);
-  return x.provider !== y.provider || x.accountId !== y.accountId || x.mcpProfile !== y.mcpProfile;
+  return x.provider !== y.provider || x.accountId !== y.accountId || JSON.stringify(x.tools) !== JSON.stringify(y.tools);
 }
 
 // ── Runs ────────────────────────────────────────────────────────────────────
@@ -295,9 +289,11 @@ export function isTerminalRunStatus(status) {
 }
 
 // Dispatcher views carry `state` (queued, awaiting_route, starting, running,
-// idle, awaiting_permission, completed, failed, stopped, interrupted); runtime
-// descriptors (sidepanel:run-*) carry `status`. The tray reads `status`.
-const STATE_STATUS = { queued: 'queued', awaiting_route: 'queued', starting: 'starting', running: 'running', idle: 'running', awaiting_permission: 'running' };
+// idle, awaiting_permission, suspended, resuming, completed, failed, stopped,
+// interrupted); runtime descriptors (sidepanel:run-*) carry `status`. The tray
+// reads `status`. A run a server restart suspended is still running; one being
+// resumed is starting.
+const STATE_STATUS = { queued: 'queued', awaiting_route: 'queued', starting: 'starting', running: 'running', idle: 'running', awaiting_permission: 'running', suspended: 'running', resuming: 'starting' };
 
 export function runStatusFromState(state) {
   const value = str(state);
@@ -429,6 +425,20 @@ export function runTone(run) {
   return 'running';
 }
 
+/**
+ * What a session's status is (the tray pill, the sidepanel header, the terminal tab's badge):
+ * 'action' while anything waits on you (a card of its own, or a worker's permission, question or
+ * model choice), 'working' while its own turn runs or any worker it dispatched works (queued for a
+ * free slot, starting, in a turn), else what its own last turn left ('done' when it ended out of
+ * sight, else 'idle'). A worker outlives the turn that dispatched it, and so does the gold.
+ * `own` is the brain's own status; `workers` the agents tray's counts (asst-agents-dock.js counts()).
+ */
+export function sessionStatus(own, workers = {}) {
+  if (own === 'action' || Number(workers?.waiting) > 0) return 'action';
+  if (own === 'working' || Number(workers?.working) > 0) return 'working';
+  return own === 'done' ? 'done' : 'idle';
+}
+
 function toMs(value) {
   if (value == null || value === '') return 0;
   if (typeof value === 'number') return Number.isFinite(value) ? value : 0;

package/neural-interface/public/shared/assistant/asst-stop.js

@@ -0,0 +1,127 @@
+// ═══════════════════════════════════════════
+// SynaBun Assistant — what a stop names
+// ═══════════════════════════════════════════
+// Pure module (no DOM, no i18n import) so node:test can exercise it.
+//
+// A stop ends the work the user named and nothing else:
+//   resolveStopTarget   `/stop <target>`: the one run of this session the target names (its id, the
+//                       start of its id, its title or the words of its title), or why it names none.
+//                       Two candidates stop nothing: the user picks one.
+//   createConfirmGate   the agents tray's "Stop all": the first press arms it, a second press inside
+//                       the window stops every run of the session at once. A single stray click, a
+//                       double click or a held key never does (2026-10-24: one "Stop all" press
+//                       ended both runs of a session while the user meant one of them).
+// Words the user types to stop everything ("stop", "cancel") go to the brain, which stops runs
+// with agent_stop (assistant-persona.js): nothing here reads a message.
+
+import { isTerminalRunStatus } from './asst-state.js';
+
+/** How long an armed "Stop all" waits for its second press, and the least time between the two. */
+export const STOP_ALL_CONFIRM_MS = 4000;
+export const STOP_ALL_MIN_GAP_MS = 300;
+
+// Words that say "a run" without saying which one: "/stop the OpenCode settings run" names it by the rest.
+const FILLER = new Set(['the', 'a', 'an', 'that', 'this', 'my', 'our', 'one', 'run', 'runs', 'agent', 'agents', 'worker', 'workers', 'task', 'job', 'please', 'o', 'os', 'as', 'do', 'da', 'de']);
+const FULL_RUN_ID = /^[0-9a-f]{32}$/i;
+const ID_PREFIX = /^[0-9a-f][0-9a-f-]{3,}$/i;
+
+function words(text) {
+  return String(text ?? '').toLowerCase().split(/[^\p{L}\p{N}]+/u).filter(Boolean);
+}
+
+function unquote(text) {
+  const s = String(text ?? '').trim();
+  const m = s.match(/^(["'“‘])([\s\S]*)(["'”’])$/);
+  return m ? m[2].trim() : s;
+}
+
+/**
+ * The run `/stop <target>` names among `runs` (the tray's runs of this session).
+ * → { run, by: 'id' | 'prefix' | 'title' | 'words' }
+ *   | { error: 'empty' | 'none' | 'finished' | 'ambiguous', matches?: run[], run? }
+ * An exact id names that run whatever its state (the server says when it already ended). Every
+ * other way names a run that still works; one that ended is `finished`. A full id the tray does not
+ * know is handed on as `{ error: 'none', passthrough: id }`: the server knows more runs than a tray.
+ */
+export function resolveStopTarget(target, runs = []) {
+  const raw = unquote(target);
+  if (!raw) return { error: 'empty' };
+  const list = (Array.isArray(runs) ? runs : []).filter((run) => run && run.runId && run.removed !== true);
+  const live = list.filter((run) => !isTerminalRunStatus(run.status));
+  const one = (matches, by) => {
+    if (matches.length === 1) return isTerminalRunStatus(matches[0].status) ? { error: 'finished', run: matches[0] } : { run: matches[0], by };
+    if (matches.length > 1) return { error: 'ambiguous', matches };
+    return null;
+  };
+  const lower = raw.toLowerCase();
+
+  const exact = list.find((run) => String(run.runId).toLowerCase() === lower);
+  if (exact) return { run: exact, by: 'id' };
+  if (ID_PREFIX.test(raw)) {
+    const byPrefix = one(list.filter((run) => String(run.runId).toLowerCase().startsWith(lower)), 'prefix');
+    if (byPrefix) return byPrefix;
+  }
+
+  const title = (run) => words(run.title || run.task || '').join(' ');
+  const wanted = words(raw).join(' ');
+  if (wanted) {
+    const byTitle = one(live.filter((run) => title(run) === wanted), 'title');
+    if (byTitle) return byTitle;
+  }
+  // The words that say which run: each one is a word of its title, or the start of one.
+  const keys = words(raw).filter((word) => !FILLER.has(word));
+  if (keys.length) {
+    const fits = (run) => { const have = words(run.title || run.task || ''); return keys.every((key) => have.some((word) => word === key || (key.length >= 3 && word.startsWith(key)))); };
+    const byWords = one(live.filter(fits), 'words');
+    if (byWords) return byWords;
+    const ended = list.filter((run) => isTerminalRunStatus(run.status) && (title(run) === wanted || fits(run)));
+    if (ended.length === 1) return { error: 'finished', run: ended[0] };
+  }
+  return FULL_RUN_ID.test(raw) ? { error: 'none', passthrough: raw } : { error: 'none' };
+}
+
+/**
+ * A press that only counts as the second of two. `press()` → 'armed' (the first: `onChange(true)`),
+ * 'confirmed' (the second, inside `windowMs` and at least `minGapMs` after the first:
+ * `onChange(false)`, the caller stops everything) or 'ignored' (too soon after the first: a double
+ * click, a held key). The arm lapses after `windowMs` by itself (`onChange(false)`).
+ */
+export function createConfirmGate({
+  windowMs = STOP_ALL_CONFIRM_MS,
+  minGapMs = STOP_ALL_MIN_GAP_MS,
+  now = Date.now,
+  setTimer = (fn, ms) => setTimeout(fn, ms),
+  clearTimer = (id) => clearTimeout(id),
+  onChange = () => {},
+} = {}) {
+  let armedAt = null;
+  let timer = null;
+  const notify = (armed) => { try { onChange(armed); } catch { /* the button is gone */ } };
+  function reset() {
+    if (timer !== null) { clearTimer(timer); timer = null; }
+    if (armedAt === null) return false;
+    armedAt = null;
+    notify(false);
+    return true;
+  }
+  function press() {
+    const at = now();
+    // An arm whose timer never ran (a throttled background tab) has lapsed all the same.
+    if (armedAt !== null && at - armedAt > windowMs) reset();
+    if (armedAt === null) {
+      armedAt = at;
+      timer = setTimer(() => { timer = null; reset(); }, windowMs);
+      notify(true);
+      return 'armed';
+    }
+    if (at - armedAt < minGapMs) return 'ignored';
+    reset();
+    return 'confirmed';
+  }
+  return {
+    press,
+    reset,
+    isArmed: () => armedAt !== null,
+    destroy() { if (timer !== null) { clearTimer(timer); timer = null; } armedAt = null; },
+  };
+}

package/neural-interface/public/shared/assistant/asst-styles.js

@@ -345,32 +345,62 @@ export function injectAssistantStyles() {
     .asst-transcript > .asst-status + .asst-status,
     .asst-transcript > .asst-route-line + .asst-route-line { margin-top: 4px; }
     .asst-transcript > .asst-working { margin-top: 8px; }
+    /* The open card waits at the bottom (asst-ask-tail.js): under every row that arrives after it,
+       above the "Working…" row, until it is answered and goes back under its message. */
+    .asst-ask-tail { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
+    .asst-ask-tail > * { margin-top: 0; }
+    /* The card sheet is injected after this one: restate its own gap margin at its specificity. */
+    .asst-ask-tail > .asst-followups.asst-ask,
+    .asst-ask-tail > .asst-control.asst-ask { margin-top: 0; }
 
-    /* ── Empty state ────────────────────────────────────────────────── */
+    /* ── Empty state ────────────────────────────────────────────────────
+       One column, one hierarchy: the character and the heading, then the
+       starters as ghost rows (a prop glyph and a label, no capsule and no
+       seam: a faint fill with the md corners only while hovered or
+       focused), then the context line (Project · Budget) as quiet sm text
+       controls that open the toolbar's own menus (an open menu alone
+       wears the gold on-state). The rows and the line come in staggered
+       (--i, 40 ms apart), recede while the composer holds a draft, and
+       the picked starter keeps the gold on-state until the draft is
+       cleared. All of it static under reduced motion (the blanket at the
+       end). */
     .asst-empty {
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
-      gap: 10px;
+      gap: 6px;
       min-height: 100%;
       padding: 16px 4px;
       text-align: center;
     }
-    .asst-empty-title { color: var(--asst-text); font-family: var(--ff-heading, inherit); font-size: 20px; font-weight: 600; letter-spacing: -.01em; }
-    .asst-empty-body { max-width: 440px; color: var(--asst-text-3); font-size: 13px; line-height: 1.55; }
-    /* The greeting (public/shared/greeting/) takes the lead's place when there is one. */
+    @keyframes asst-empty-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
+    .asst-empty-title { margin-bottom: 8px; color: var(--asst-text); font-family: var(--ff-heading, inherit); font-size: 20px; font-weight: 600; letter-spacing: -.01em; animation: asst-empty-in var(--asst-dur-moderate) var(--asst-ease-enter) backwards; }
+    /* The greeting (public/shared/greeting/) sits between the heading and the starters. */
     .asst-empty-greet { display: contents; }
-    .asst-empty.has-greeting .asst-empty-body { display: none; }
-    .asst-suggestions { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; max-width: 560px; margin-top: 6px; }
-    .asst-chip.asst-suggestion { --cap-h: var(--asst-pill-h-md); --cap-r: var(--asst-pill-r-md); --cap-px: var(--asst-pill-px-md); --cap-fs: 12px; justify-content: flex-start; text-align: left; }
+    .asst-suggestions { display: flex; flex-direction: column; align-items: stretch; gap: 2px; width: min(100%, 380px); margin-top: 2px; }
+    .asst-chip.asst-suggestion { --cap-h: var(--asst-pill-h-md); --cap-r: var(--asst-pill-r-md); --cap-px: var(--asst-pill-px-md); --cap-fs: 12.5px; --cap-gap: 10px; justify-content: flex-start; max-width: none; height: auto; min-height: var(--cap-h); padding: 5px var(--cap-px); background: transparent; box-shadow: none; color: var(--asst-text-2); text-align: left; white-space: normal; line-height: 1.3; animation: asst-empty-in var(--asst-dur-moderate) var(--asst-ease-enter) backwards; animation-delay: calc(var(--i, 0) * 40ms); }
+    .asst-chip.asst-suggestion .asst-chip-text { white-space: normal; overflow: visible; text-overflow: clip; }
     .asst-chip.asst-suggestion > .asst-icon svg { width: 20px; height: 14px; }
-    .asst-chip.asst-suggestion > .asst-icon { color: var(--asst-text-3); }
-    .asst-chip.asst-suggestion:is(:hover, :focus-visible) > .asst-icon { color: var(--asst-text); }
-    /* Project and Budget: shared md capsules under the lead, like the suggestions. */
-    .asst-empty-project { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; max-width: 100%; }
-    .asst-dd.asst-empty-control-btn { max-width: min(100%, 360px); }
-    .asst-empty-control-btn .asst-dd-label { max-width: 30ch; }
+    .asst-suggestions .asst-chip.asst-suggestion > .asst-icon:not([hidden]) { margin: 0; padding: 0; box-shadow: none; color: var(--asst-text-3); }
+    .asst-suggestions .asst-chip.asst-suggestion:is(:hover, :focus-visible) { background: var(--asst-fill-1); box-shadow: none; color: var(--asst-text); }
+    .asst-suggestions .asst-chip.asst-suggestion:is(:hover, :focus-visible) > .asst-icon { box-shadow: none; color: var(--asst-text); }
+    .asst-suggestions .asst-chip.asst-suggestion.is-picked { background: var(--asst-pill-on-fill); box-shadow: inset 0 0 0 1px var(--asst-pill-on-ring); color: var(--asst-text); }
+    .asst-suggestions .asst-chip.asst-suggestion.is-picked > .asst-icon { color: var(--asst-brand); }
+    .asst-empty.is-drafting .asst-chip.asst-suggestion:not(.is-picked):not(:hover):not(:focus-visible) { opacity: .55; }
+    /* A starter's quiet aside (the Workspace tour's "· 2 min"): the row's own font, the faint tone. */
+    .asst-suggestions .asst-chip.asst-suggestion .asst-chip-meta { flex-shrink: 0; margin-left: 2px; color: var(--asst-text-4); font: inherit; font-size: 11.5px; white-space: nowrap; }
+    .asst-suggestions .asst-chip.asst-suggestion .asst-chip-meta::before { content: '· '; }
+    /* The context line: the toolbar's Project field drawn once more, and Budget, as quiet sm text controls. */
+    .asst-empty-project { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2px 8px; max-width: 100%; margin-top: 10px; animation: asst-empty-in var(--asst-dur-moderate) var(--asst-ease-enter) backwards; animation-delay: calc(var(--i, 0) * 40ms); }
+    .asst-empty-project .asst-dd.asst-empty-control-btn { --cap-h: var(--asst-pill-h-sm); --cap-r: var(--asst-pill-r-sm); --cap-px: var(--asst-pill-px-xs); --cap-gap: 4px; --cap-icon: 12px; --cap-fs: 11.5px; isolation: isolate; max-width: min(100%, 320px); color: var(--asst-text-2); }
+    .asst-empty-project .asst-dd.asst-empty-control-btn::after { content: ''; position: absolute; inset: -2px; z-index: -1; border-radius: inherit; }
+    .asst-empty-project .asst-dd.asst-empty-control-btn:not([aria-expanded="true"]) { background: transparent; box-shadow: none; }
+    .asst-empty-project .asst-dd.asst-empty-control-btn:hover:not([aria-expanded="true"]) { background: var(--asst-fill-1); color: var(--asst-text); }
+    .asst-empty-project .asst-dd.asst-empty-control-btn[aria-expanded="true"] { color: var(--asst-text); }
+    .asst-empty-project .asst-dd.asst-empty-control-btn > .asst-icon:not([hidden]) { margin: 0; padding: 0; box-shadow: none; color: var(--asst-text-3); }
+    .asst-empty-project .asst-dd.asst-empty-control-btn:is(:hover, [aria-expanded="true"]) > .asst-icon:not([hidden]) { box-shadow: none; }
+    .asst-empty-project .asst-dd.asst-empty-control-btn .asst-dd-label { max-width: 24ch; }
     .asst-empty-project-key { flex-shrink: 0; color: var(--asst-text-3); font-weight: 400; }
 
     /* ── Messages ───────────────────────────────────────────────────── */
@@ -998,6 +1028,12 @@ export function injectAssistantStyles() {
     .asst-usage-run-tokens { color: var(--asst-text-3); font-family: var(--asst-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
 
     /* The provider's usage limit: one line under the gauge, replaced in place (never a transcript row). */
+    .asst-route-fields { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
+    .asst-route-fields .asst-dd { min-width: 0; max-width: 100%; }
+    .asst-route-fields .asst-dd-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
+    .asst-limit-dock { position: sticky; bottom: 0; flex: none; z-index: 2; background: var(--asst-bg); }
+    .asst-limit-dock[hidden] { display: none; }
+    .asst-limit-dock .asst-limit-wait { margin: 8px 12px; }
     .asst-limit {
       flex: 0 0 auto;
       display: flex;
@@ -1327,6 +1363,8 @@ export function injectAssistantStyles() {
     .asst-control-plan-body { min-width: 0; }
     .asst-control-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
 
+    /* Follow-ups and the question cards are drawn by the mascot: their sheet is asst-ask-styles.js. */
+
     /* Route card */
     .asst-route-summary { color: var(--asst-text); }
     .asst-route-reasons { margin-top: -4px; color: var(--asst-text-3); font-size: 11.5px; }
@@ -1399,6 +1437,8 @@ export function injectAssistantStyles() {
     /* Deny / Decline: a neutral ghost with ✕ (red only ever means failed). */
     .asst-btn-danger { background: transparent; box-shadow: inset 0 0 0 1px var(--asst-line-2); color: var(--asst-text-2); }
     .asst-btn-danger:hover:not(:disabled) { background: var(--asst-fill-1); box-shadow: inset 0 0 0 1px var(--asst-text-3); color: var(--asst-text); }
+    /* "Stop all" armed: it waits for a second press (asst-agents-dock.js), in the attention tone. */
+    .asst-dock-stopall[data-armed="true"], .asst-dock-stopall[data-armed="true"]:hover:not(:disabled) { background: var(--asst-fill-1); box-shadow: inset 0 0 0 1px var(--asst-pill-warn-ring); color: var(--asst-warn); }
     .asst-btn-icon { display: inline-flex; margin-left: -2px; }
     .asst-btn-icon svg { width: 12px; height: 12px; }
 
@@ -1412,7 +1452,7 @@ export function injectAssistantStyles() {
     .assistant-panel :is(.asp-header, .asp-body) :is(button, [role="button"], [tabindex]):focus-visible,
     .asp-session-pill:focus-visible,
     .asp-session-pill .term-minimized-pill-close:focus-visible,
-    :is(.asst-control-cmd, .asst-control-deny-msg, .asst-control-custom):focus-visible {
+    :is(.asst-control-cmd, .asst-control-deny-msg, .asst-control-custom, .asst-ask-input):focus-visible {
       outline: 2px solid var(--asst-focus);
       outline-offset: 1px;
     }
@@ -1513,6 +1553,28 @@ export function injectAssistantStyles() {
     .asst-dd-btnrow { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; }
     .asst-dd-btnrow-label { flex: 1 1 auto; min-width: 0; padding: 5px 10px; color: var(--asst-text-2); overflow-wrap: anywhere; }
     .asst-dd-btnrow .asst-dd-item { flex: 0 1 auto; width: auto; }
+    /* A row with its own action (asst-menu.js item.action: the Sessions menu's Remove): a sm icon button at
+       the row's end, over the room the row keeps free for it; shown on hover and keyboard focus, neutral at
+       rest, red on hover (a destructive action). Touch screens have no hover: it always shows there. */
+    .asst-dd-itemrow { position: relative; }
+    .asst-dd-itemrow > .asst-dd-item { padding-right: calc(var(--asst-pill-h-sm) + 12px); }
+    .asst-dd-item-action.asst-iconbtn {
+      --cap-h: var(--asst-pill-h-sm);
+      --cap-r: var(--asst-pill-r-sm);
+      --cap-icon: 13px;
+      position: absolute;
+      top: calc(50% - var(--cap-h) / 2);
+      right: 6px;
+      opacity: 0;
+      pointer-events: none;
+    }
+    .asst-dd-itemrow:is(:hover, :focus-within) > .asst-dd-item-action,
+    .asst-dd-itemrow > .asst-dd-item.focused + .asst-dd-item-action { opacity: 1; pointer-events: auto; }
+    .asst-dd-item-action.asst-iconbtn:is(:hover, :focus-visible):not(:disabled) { color: var(--asst-live); }
+    @media (hover: none) { .asst-dd-item-action.asst-iconbtn { opacity: 1; pointer-events: auto; } }
+    /* The Sessions menu's "Remove …?" row: the question, then Remove and Cancel, set off from the list. */
+    .asst-dd-btnrow.asst-dd-confirm { justify-content: flex-end; margin: 2px 0; padding: 2px; border-radius: calc(var(--asst-r-card) - 4px); background: var(--asst-fill-1); box-shadow: inset 0 0 0 1px var(--asst-line); }
+    .asst-dd-btnrow.asst-dd-confirm .asst-dd-btnrow-label { flex-basis: 100%; color: var(--asst-text); }
 
     /* ── Account menu (asst-account-menu.js) ────────────────────────
        Every account once: initial · name ✓ · plan or credential badge, then who it is and its
@@ -1828,6 +1890,27 @@ export function injectAssistantStyles() {
     .asst-lightbox-caption { max-width: 92vw; color: var(--asst-text-2); font-size: 12.5px; text-align: center; }
     .asst-lightbox-close { position: absolute; top: 14px; right: 14px; background: var(--asst-popover); box-shadow: 0 0 0 1px var(--asst-popover-ring); color: var(--asst-text); }
 
+    /* ── Tray pill (#term-minimized-tray, outside the component) ─────────
+       What a session minimises to, in either host: the sidepanel's tab
+       (asst-sidepanel.js) and the terminal's floating tab (ui-terminal.js)
+       both draw the shared .term-minimized-pill of styles.css, exactly like
+       the Claude, Codex and OpenCode pills: 32px, 8px corners, a 1px
+       hairline, icon · name · ✕, no geometry of its own. Only the identity is
+       SynaBun's: the two-pill mark, and the cameo in its place while the
+       session works (gold, with a gold hairline: its own turn or a worker it
+       dispatched, asst-state.js sessionStatus); a session that needs you
+       tints the mark and the hairline. The sidepanel's is a button
+       (Enter/Space) with the panel's focus ring; its ✕ keeps the tray's 24px
+       target. Paused while the UI is dragged and still under reduced motion
+       (Motion, below): the state stays, only the glance stops. */
+    .asp-session-pill .term-minimized-pill-icon .syna-cameo { display: none; }
+    .asp-session-pill.asp-pill-running { border-color: var(--asst-pill-on-ring); }
+    .asp-session-pill.asp-pill-running .term-minimized-pill-icon { color: var(--asst-brand); }
+    .asp-session-pill.asp-pill-running .term-minimized-pill-icon > svg:not(.syna-cameo) { display: none; }
+    .asp-session-pill.asp-pill-running .term-minimized-pill-icon .syna-cameo { display: inline-flex; }
+    .asp-session-pill.asp-pill-attention { border-color: var(--asst-pill-warn-ring); }
+    .asp-session-pill.asp-pill-attention .term-minimized-pill-icon { color: var(--asst-warn); }
+
     /* ── Float header brain chip (lives in ui-terminal's float window) ─ */
     .term-float-brain-chip {
       display: inline-flex;
@@ -1916,11 +1999,9 @@ export function injectAssistantStyles() {
     @container asst (max-width: 400px) {
       .asst-root > * { --asst-inline: 6px; }
       :is(.asst-cost, .asst-bar-group[data-group="context"]) { display: none !important; }
-      .asst-suggestions { flex-direction: column; align-items: stretch; width: 100%; }
-      .asst-chip.asst-suggestion { justify-content: flex-start; max-width: none; }
-      .asst-empty-project { width: 100%; }
-      .asst-dd.asst-empty-control-btn { flex: 1 1 auto; justify-content: flex-start; max-width: none; }
-      .asst-empty-control-btn .asst-dd-label { flex: 1 1 auto; max-width: none; text-align: start; }
+      .asst-empty { padding-inline: 0; }
+      .asst-suggestions { width: 100%; }
+      .asst-empty-project .asst-dd.asst-empty-control-btn { max-width: 100%; }
       .asst-msg.msg-user .asst-msg-content { max-width: 92%; }
       .asst-route-opt-sub { display: none; }
       .asst-run-main { flex-wrap: wrap; row-gap: 2px; }
@@ -1935,7 +2016,7 @@ export function injectAssistantStyles() {
     }
     @container asst (max-height: 260px) {
       /* the toolbar stays: it carries the controls */
-      :is(.asst-empty-body, .asst-empty-mascot, .asst-empty-project, .asst-suggestions, .asst-empty-greet) { display: none !important; }
+      :is(.asst-empty-mascot, .asst-empty-project, .asst-suggestions, .asst-empty-greet) { display: none !important; }
       .asst-empty { gap: 4px; padding: 4px; }
       .asst-empty-title { font-size: 14px; }
       .asst-bottom { margin-top: 6px; }