merge v1.11.3-ctxmax

- llama-server does not emit n_ctx in timings (confirmed empirically);
  dead code at inference.ts:479 and compaction.ts:300 never fired
- New model-context.ts: cached fetch of /upstream/<model>/props
  with positive-cache (no TTL) and 60s negative-cache
- Wired into all 4 ctx_max write sites: 3 in inference.ts
  (executeToolPhase, finalizeCompletion, runCapHitSummary) and
  1 in compaction.ts (summary row INSERT)
- AbortController 3s timeout, lenient parsing with sensible defaults
- 12 new vitest cases for the cache module (59 total)
- 7 historical assistant rows backfilled manually (see notes)

.dockerignore

@@ -10,3 +10,13 @@ dist
 .vite
 coverage
 /tmp
+
+# Secrets and runtime data
+secrets/
+data/
+*.pem
+*.key
+id_rsa*
+id_ed25519*
+known_hosts
+.ssh/

AGENTS.md

@@ -3,7 +3,6 @@
 ## Code Reviewer
 ---
 temperature: 0.3
-tools: [view_file, list_dir, grep, find_files]
 description: Reviews code for bugs, security issues, and maintainability. Read-only.
 ---
 You review code. Find real problems, not style nits.
@@ -33,7 +32,6 @@ If nothing critical or major, say so in one line. Do not pad.
 ## Debugger
 ---
 temperature: 0.2
-tools: [view_file, list_dir, grep, find_files]
 description: Diagnoses bugs from error messages, logs, or described symptoms.
 ---
 You diagnose bugs. Form a hypothesis, prove it with evidence from the code.
@@ -62,7 +60,6 @@ Output:
 ## Refactorer
 ---
 temperature: 0.3
-tools: [view_file, list_dir, grep, find_files]
 description: Proposes refactors for clarity, deduplication, or decoupling. Read-only — outputs plans, not edits.
 ---
 You propose refactors. You do not apply them. The user applies via OpenCode or Claude Code.
@@ -95,7 +92,6 @@ Output:
 ## Architect
 ---
 temperature: 0.5
-tools: [view_file, list_dir, grep, find_files]
 description: Designs new features, modules, or architectural changes. Outputs a build plan.
 ---
 You design. You produce build plans, not code.
@@ -128,7 +124,6 @@ Output:
 ## Security Auditor
 ---
 temperature: 0.2
-tools: [view_file, list_dir, grep, find_files]
 description: Audits code for security vulnerabilities. Read-only.
 ---
 You audit for security issues. Concrete findings only, no generic warnings.
@@ -165,7 +160,6 @@ If the code is clean, say so. Do not invent findings.
 ## Prompt Builder
 ---
 temperature: 0.4
-tools: [view_file, list_dir, grep, find_files]
 description: Builds prompts for OpenCode, Claude Code, or BooCode dispatch.
 ---
 You write prompts that another coding agent will execute. Your output is the prompt, not the work.

CLAUDE.md

@@ -6,6 +6,8 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
 
 Self-hosted single-user developer chat app. AI assistant with read-only file tools (view_file, list_dir, grep, find_files) running against a local llama-swap inference server. Sessions organized by project, with a multi-pane workspace (chat + file browser side by side).
 
+Plus `apps/booterm` (second container, port 9501, bookworm-slim+glibc): Fastify + node-pty + tmux. Browser terminal panes WS to `/ws/term/sessions/:sid/panes/:pid`; per-session tmux session `bc-<sid>`, per-pane window `term-<pid>`. Shells drop privs to samkintop via `gosu` in `tmux.conf` default-command.
+
 ## Commands
 
 ```bash
@@ -35,7 +37,7 @@ Tests: `pnpm -C apps/server test` runs 23 vitest tests. No test harness on `apps
 
 ## Architecture
 
-**Monorepo**: pnpm workspaces with `apps/server` (Fastify + postgres) and `apps/web` (React + Vite).
+**Monorepo**: pnpm workspaces with `apps/server` (Fastify + postgres), `apps/web` (React + Vite), and `apps/booterm` (Fastify + node-pty + tmux).
 
 ### Server (`apps/server/src/`)
 
@@ -66,6 +68,13 @@ Key patterns:
 - **`hooks/useSidebar.ts`** — Module-singleton with Set<setState> subscriber pattern; one bus subscription guarded by `globalThis.__boocode_sidebar_subscribed` for HMR safety. Every new `SessionEvent` type needs a `case` in the `applyEvent` switch (no-op `return prev` is fine).
 - **`api/client.ts`** — Centralized typed fetch wrapper. All endpoints under `api.*` namespace.
 
+Font / CSS pipeline (apps/web):
+- Tailwind v4's `@import "tailwindcss"` directive strips font URLs from subsequent CSS `@import`s — `@fontsource*` packages must be imported as JS side-effect modules in `apps/web/src/main.tsx`, not via `@import` in `globals.css`. Otherwise the woff2 files never make it to `dist/`.
+- Lightning CSS (inside `@tailwindcss/postcss` v4) collapses contiguous unicode-ranges to wildcard shorthand (`U+0000-FFFF` → `U+????`), which iOS Safari/Vivaldi mishandles (silently drops the font from those codepoints). Use explicit non-wildcard-collapsible subranges (e.g. `U+2500-259F` not `U+2500-25FF`). The `apps/web` build script greps `dist/assets/*.css` for `U+2500-259F` and fails the build if missing — preserve that guard.
+- `@font-face` blocks must live AFTER all `@import` statements (CSS spec). Earlier placement silently breaks every subsequent `@import` (this broke the 18 theme palette imports in globals.css for one session).
+- JetBrainsMono Nerd Font self-hosted in `apps/web/src/fonts/` (TTF from ryanoasis/nerd-fonts release) — needed because `@fontsource-variable/jetbrains-mono` ships subsetted woff2s that don't cover `U+2500-259F` (box drawing + block elements, used by opencode's banner). "NL" = No Ligatures (matches `font-feature-settings: "liga" 0`); "Mono" = single-cell icon width so TUI layouts don't desync.
+- xterm-addon-webgl rasterizes glyphs via Canvas2D into a GPU texture atlas. Canvas2D does NOT honor `font-display: block` — it uses whatever font is currently registered. Gate xterm initialization on `document.fonts.load(<font-name>)` resolving before calling `term.open()` (see `fontsReady` useState in `TerminalPane.tsx`). iOS Safari/Vivaldi also reclaims WebGL contexts from backgrounded tabs: keep `webgl.onContextLoss(() => webgl.dispose())` + recreate via visibilitychange. Do NOT manually dispose+recreate the addon after font load — iOS silently fails the second GL context creation and the terminal drops to DOM renderer with stale metrics.
+
 ### Data flow for chat
 
 1. User sends message → POST `/api/sessions/:id/messages` creates user + assistant (status=streaming) rows
@@ -99,6 +108,12 @@ Required: `DATABASE_URL`, `LLAMA_SWAP_URL`. Optional: `PORT` (3000), `HOST` (0.0
 - Don't accumulate `.bak-*` files. Clean them up in the same batch or immediately after merge.
 - Fastify global JSON parser tolerates empty bodies (overridden in `index.ts`); bodyless POSTs (archive, unarchive, stop) work without setting `Content-Type` tricks on the client.
 - Event dedup discipline: for any mutation the server publishes via `broker.publishUser`, do NOT add a local `sessionEvents.emit(...)` after the API call — `useUserEvents` forwards the WS frame onto the bus. Frontend mutation handlers must be idempotent (dedup by id, no-op on already-present).
+- `node:20-*` base images ship a `node` user at uid/gid 1000 — delete it (`userdel`/`groupdel` on debian, `deluser`/`delgroup` on alpine) before adding samkintop at 1000.
+- node-pty's compiled `.node` is libc-specific: proddeps and runtime Dockerfile stages must share libc (alpine↔musl or bookworm-slim↔glibc); the TS-only builder stage can stay alpine for speed.
+- pnpm 10 `--frozen-lockfile` skips node-pty's postinstall — the Docker proddeps stage runs `cd node_modules/node-pty && npm run install` to force the native compile.
+- A local PreToolUse hook (`security_reminder_hook.py`) regex-flags Node's older `child_process` spawn helpers as unsafe (false positive even on the File-suffixed variant). Use `spawn` — it's accepted.
+- `/opt/boolab` hosts a working sibling BooCode terminal at `boocode.indifferentketchup.com`. Useful for visual side-by-side comparison on the same iPhone when debugging booterm rendering. Boolab uses Tailwind v3 (`@tailwind base`); boocode uses v4 — many subtle build differences. Don't assume parity.
+- booterm SSHs to the host as `samkintop@100.114.205.53` (the Tailscale IP). The hostname `ubuntu-homelab` (shown in the bash prompt after login) does NOT resolve from inside the container — only the host's `/etc/hosts` knows it. Override via `BOOTERM_SSH_HOST` / `BOOTERM_SSH_USER` env vars in docker-compose if you ever move the shell to a different machine.
 
 ## Conventions
 
@@ -109,3 +124,7 @@ Required: `DATABASE_URL`, `LLAMA_SWAP_URL`. Optional: `PORT` (3000), `HOST` (0.0
 - Discriminated unions for type narrowing: `Pane` (by `kind`), `SessionEvent` (by `type`), `InferenceFrame` (by `type`).
 - shadcn primitives live in `components/ui/`. Don't modify them unless adding a new primitive.
 - `inferLanguage()` from `lib/attachments.ts` is the canonical file-extension-to-language map. `CodeBlock.tsx` keeps its own `LANG_MAP` because it also resolves markdown fence names.
+- Two UI event buses: `hooks/sessionEvents.ts` for DB-state events (chat_created, session_updated); `lib/events.ts` for ephemeral UI (`sendToTerminal`, `terminalsRegistry`). Don't merge — different subscriber lifecycles.
+- `vite.config.ts` proxy entries are order-sensitive: more-specific prefixes (`/api/term`, `/ws/term`) must come BEFORE `/api`.
+- Mobile pane URL sync (`Session.tsx`): the `?pane=<id>` effect resets `activePaneIdx` whenever `panes` changes. New-pane creation on mobile must push `?pane=` atomically — `addPaneAndSwitch` is the wrapper that does this. `addSplitPane` returns the new pane id for callers.
+- xterm.js v5 uses canvas rendering — browser doesn't see xterm's selection; the native right-click menu has no working Copy for terminal text. App keybindings (`Cmd/Ctrl-C`, `Cmd/Ctrl-Shift-C`) are the path.

apps/booterm/Dockerfile

@@ -0,0 +1,67 @@
+# syntax=docker/dockerfile:1.7
+
+# ---- Build stage: compile TypeScript ----
+FROM node:20-alpine AS builder
+ENV COREPACK_DEFAULT_TO_LATEST=0
+RUN corepack enable && corepack prepare pnpm@10.15.1 --activate
+RUN apk add --no-cache python3 make g++
+WORKDIR /build
+COPY package.json pnpm-workspace.yaml pnpm-lock.yaml tsconfig.base.json ./
+COPY apps/server/package.json ./apps/server/
+COPY apps/web/package.json ./apps/web/
+COPY apps/booterm/package.json ./apps/booterm/
+RUN pnpm install --frozen-lockfile
+COPY apps/booterm ./apps/booterm
+RUN pnpm --filter=@boocode/booterm build
+
+# ---- Prod-deps stage: hoisted, native built via npm rebuild ----
+# v1.10.2: switched to bookworm-slim (glibc) so node-pty's native .node is
+# compiled against the same libc as the runtime stage. A musl-built .node
+# won't dlopen in a glibc node binary, so both stages must match.
+FROM node:20-bookworm-slim AS proddeps
+ENV COREPACK_DEFAULT_TO_LATEST=0
+RUN corepack enable && corepack prepare pnpm@10.15.1 --activate
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    python3 make g++ ca-certificates \
+    && rm -rf /var/lib/apt/lists/*
+WORKDIR /prod
+COPY apps/booterm/package.json ./package.json
+RUN pnpm install --prod --config.node-linker=hoisted --config.strict-peer-dependencies=false
+# pnpm 10 ignores build scripts; force compile with npm directly.
+# node-gyp is bundled with npm in the node:20-bookworm-slim image.
+RUN cd node_modules/node-pty && npm run install
+# Sanity check — fail the build if the artifact still isn't there
+RUN test -f node_modules/node-pty/build/Release/pty.node && echo "pty.node OK" || (echo "pty.node MISSING" && exit 1)
+
+# ---- Runtime ----
+# v1.10.2: switched from node:20-alpine (musl) to node:20-bookworm-slim (glibc)
+# so glibc-linked binaries from /home/samkintop (Claude Code, opencode, the
+# host's nvm node) run inside the container when invoked from the terminal
+# pane. Side-effect: su-exec is alpine-only — Debian replacement is gosu.
+FROM node:20-bookworm-slim AS runtime
+# v1.10.8d: openssh-client added so the terminal can ssh -t samkintop@host
+# (matching boolab's pattern) — that's how the in-pane shell gets access to
+# host tools (docker, claude, opencode) that don't exist inside the container.
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    tmux bash gosu ca-certificates procps openssh-client \
+    && rm -rf /var/lib/apt/lists/*
+# Mirror uid/gid 1000:1000 from the host so the bind-mounted /home/samkintop
+# (added in docker-compose) is owned by the user from the container's view.
+# bookworm-slim ships a `node` user at 1000 — wipe whatever sits on uid/gid
+# 1000 first, then create samkintop fresh.
+RUN if id -u 1000 >/dev/null 2>&1; then \
+        userdel -r "$(id -un 1000)" 2>/dev/null || true; \
+    fi; \
+    if getent group 1000 >/dev/null 2>&1; then \
+        groupdel "$(getent group 1000 | cut -d: -f1)" 2>/dev/null || true; \
+    fi; \
+    groupadd -g 1000 samkintop && \
+    useradd -m -u 1000 -g 1000 -s /bin/bash samkintop
+WORKDIR /app
+COPY --from=builder /build/apps/booterm/dist ./dist
+COPY --from=proddeps /prod/package.json ./package.json
+COPY --from=proddeps /prod/node_modules ./node_modules
+COPY apps/booterm/tmux.conf /etc/booterm/tmux.conf
+ENV NODE_ENV=production
+EXPOSE 3000
+CMD ["node", "dist/index.js"]

apps/booterm/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "@boocode/booterm",
+  "version": "0.0.0",
+  "private": true,
+  "type": "module",
+  "main": "dist/index.js",
+  "scripts": {
+    "dev": "tsx watch src/index.ts",
+    "build": "tsc",
+    "typecheck": "tsc --noEmit",
+    "start": "node dist/index.js"
+  },
+  "dependencies": {
+    "@fastify/websocket": "^10.0.1",
+    "fastify": "^4.28.1",
+    "node-pty": "^1.0.0",
+    "pg": "^8.13.0",
+    "tslib": "^2.6.3",
+    "zod": "^3.23.8"
+  },
+  "devDependencies": {
+    "@types/node": "^20.14.10",
+    "@types/pg": "^8.11.10",
+    "tsx": "^4.16.2",
+    "typescript": "^5.5.0"
+  }
+}

apps/booterm/src/auth.ts

@@ -0,0 +1,11 @@
+import type { FastifyRequest } from 'fastify';
+
+// Mirrors the boocode pattern: there is no app-layer auth — Authelia handles
+// it at the reverse proxy (CLAUDE.md). All broker.publishUser calls use
+// 'default' as the user key. We accept Remote-User when present (set by the
+// proxy in prod) and fall back to 'default' on direct Tailscale access.
+export function getUser(req: FastifyRequest): string {
+  const header = req.headers['remote-user'];
+  if (typeof header === 'string' && header.length > 0) return header;
+  return 'default';
+}

apps/booterm/src/config.ts

@@ -0,0 +1,26 @@
+import { z } from 'zod';
+
+const ConfigSchema = z.object({
+  NODE_ENV: z.enum(['development', 'production', 'test']).default('development'),
+  PORT: z.coerce.number().int().positive().default(3000),
+  HOST: z.string().default('0.0.0.0'),
+  DATABASE_URL: z.string().url(),
+  LOG_LEVEL: z.string().default('info'),
+  TMUX_CONF_PATH: z.string().default('/etc/booterm/tmux.conf'),
+});
+
+export type Config = z.infer<typeof ConfigSchema>;
+
+let cached: Config | null = null;
+
+export function loadConfig(): Config {
+  if (cached) return cached;
+  const parsed = ConfigSchema.safeParse(process.env);
+  if (!parsed.success) {
+    console.error('Invalid environment configuration:');
+    console.error(parsed.error.flatten().fieldErrors);
+    process.exit(1);
+  }
+  cached = parsed.data;
+  return cached;
+}

apps/booterm/src/db.ts

@@ -0,0 +1,46 @@
+import pg from 'pg';
+
+const { Pool } = pg;
+
+let pool: pg.Pool | null = null;
+
+export function getPool(databaseUrl: string): pg.Pool {
+  if (pool) return pool;
+  pool = new Pool({ connectionString: databaseUrl, max: 5, idleTimeoutMillis: 30_000 });
+  return pool;
+}
+
+export interface SessionInfo {
+  id: string;
+  project_id: string;
+  project_path: string;
+}
+
+export async function getSessionInfo(sessionId: string): Promise<SessionInfo | null> {
+  if (!pool) throw new Error('db pool not initialized');
+  const res = await pool.query<SessionInfo>(
+    `SELECT s.id, s.project_id, p.path AS project_path
+     FROM sessions s
+     JOIN projects p ON p.id = s.project_id
+     WHERE s.id = $1`,
+    [sessionId],
+  );
+  return res.rows[0] ?? null;
+}
+
+export async function pingDb(): Promise<boolean> {
+  if (!pool) return false;
+  try {
+    await pool.query('SELECT 1');
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+export async function closeDb(): Promise<void> {
+  if (pool) {
+    await pool.end();
+    pool = null;
+  }
+}

apps/booterm/src/index.ts

@@ -0,0 +1,60 @@
+import Fastify from 'fastify';
+import fastifyWebsocket from '@fastify/websocket';
+import { loadConfig } from './config.js';
+import { getPool, closeDb } from './db.js';
+import { registerHealthRoutes } from './routes/health.js';
+import { registerTerminalRoutes } from './routes/terminals.js';
+import { registerWsAttachRoute } from './ws/attach.js';
+
+async function main(): Promise<void> {
+  const config = loadConfig();
+
+  const app = Fastify({
+    logger: { level: config.LOG_LEVEL },
+  });
+
+  app.removeContentTypeParser(['application/json']);
+  app.addContentTypeParser('application/json', { parseAs: 'string' }, (_req, body, done) => {
+    const str = (body as string) ?? '';
+    if (str.trim().length === 0) {
+      done(null, {});
+      return;
+    }
+    try {
+      done(null, JSON.parse(str));
+    } catch (err) {
+      done(err as Error, undefined);
+    }
+  });
+
+  getPool(config.DATABASE_URL);
+
+  await app.register(fastifyWebsocket);
+
+  registerHealthRoutes(app);
+  registerTerminalRoutes(app, config.TMUX_CONF_PATH);
+  registerWsAttachRoute(app, config.TMUX_CONF_PATH);
+
+  const shutdown = async (signal: string) => {
+    app.log.info(`received ${signal}, shutting down`);
+    try {
+      await app.close();
+      await closeDb();
+      process.exit(0);
+    } catch (err) {
+      app.log.error(err);
+      process.exit(1);
+    }
+  };
+
+  process.on('SIGINT', () => void shutdown('SIGINT'));
+  process.on('SIGTERM', () => void shutdown('SIGTERM'));
+
+  await app.listen({ port: config.PORT, host: config.HOST });
+  app.log.info(`booterm listening on http://${config.HOST}:${config.PORT}`);
+}
+
+main().catch((err) => {
+  console.error('Fatal startup error:', err);
+  process.exit(1);
+});

apps/booterm/src/pty/manager.ts

@@ -0,0 +1,164 @@
+import { spawn } from 'node:child_process';
+import type { FastifyBaseLogger } from 'fastify';
+
+const ID_RE = /^[a-zA-Z0-9_-]{1,64}$/;
+
+export function sanitizeId(raw: string): string | null {
+  if (!ID_RE.test(raw)) return null;
+  return raw.toLowerCase();
+}
+
+// v1.10.8c: per-pane tmux sessions (boolab pattern). Previously booterm used
+// one tmux session per chat-session with one window per pane; that meant the
+// session-level window-size policy was shared across panes, and
+// `attach-session -d` (used to take over from a stale browser) would detach
+// every other pane attached to the same session — the "[detached]" bug.
+// Now each pane gets its own tmux session named `bc-<paneId>`. The bc- prefix
+// namespaces booterm sessions on the shared tmux server.
+export function tmuxSessionName(paneId: string): string {
+  return `bc-${paneId}`;
+}
+
+interface CmdResult {
+  stdout: string;
+  stderr: string;
+  code: number;
+}
+
+function runTmux(tmuxConfPath: string, args: string[]): Promise<CmdResult> {
+  return new Promise((resolve) => {
+    const child = spawn('tmux', ['-f', tmuxConfPath, ...args], { shell: false });
+    let stdout = '';
+    let stderr = '';
+    child.stdout.on('data', (chunk: Buffer) => {
+      stdout += chunk.toString('utf8');
+    });
+    child.stderr.on('data', (chunk: Buffer) => {
+      stderr += chunk.toString('utf8');
+    });
+    child.on('error', (err) => {
+      resolve({ stdout, stderr: stderr + String(err), code: 1 });
+    });
+    child.on('close', (code) => {
+      resolve({ stdout, stderr, code: code ?? 0 });
+    });
+  });
+}
+
+export async function hasSession(tmuxConfPath: string, sessionName: string): Promise<boolean> {
+  const res = await runTmux(tmuxConfPath, ['has-session', '-t', `=${sessionName}`]);
+  return res.code === 0;
+}
+
+// Default fallback size — wider than any real terminal would care about; the
+// real client size lands via the WS resize frame within a few ms of attach.
+const DEFAULT_COLS = 200;
+const DEFAULT_ROWS = 50;
+
+// v1.10.8d: per-pane shell is `ssh -t samkintop@SSH_HOST` (matches boolab's
+// pattern). The container has no docker / claude / opencode binaries; SSH'ing
+// to the host gives the user their full normal shell environment. Default is
+// the host's Tailscale IP (100.114.205.53) — the hostname `ubuntu-homelab`
+// only resolves on the host's local /etc/hosts, not from inside containers,
+// so SSH'ing to the hostname fails with `Could not resolve hostname` even
+// though the host machine is reachable. Boolab uses the same IP.
+const SSH_HOST = process.env['BOOTERM_SSH_HOST']?.trim() || '100.114.205.53';
+const SSH_USER = process.env['BOOTERM_SSH_USER']?.trim() || 'samkintop';
+
+// POSIX shell single-quote escape: wrap in '…', escape embedded singles by
+// closing-the-quote, inserting an escaped quote, and re-opening.
+function shellEscape(s: string): string {
+  return `'${s.replace(/'/g, `'\\''`)}'`;
+}
+
+// Idempotent. Creates the tmux session if it doesn't exist, sized via -x/-y
+// from the client's measured xterm dimensions. With `window-size = largest`
+// + `aggressive-resize on` in tmux.conf, the attached client's actual size
+// wins once it reports in — but seeding at the right size avoids the brief
+// window where bash/TUI inherits the default 80x24 from a stale fallback.
+export async function ensureSession(
+  tmuxConfPath: string,
+  sessionName: string,
+  projectRoot: string,
+  log: FastifyBaseLogger,
+  cols?: number,
+  rows?: number,
+): Promise<void> {
+  if (await hasSession(tmuxConfPath, sessionName)) return;
+  const sizeCols = cols && cols > 0 ? Math.floor(cols) : DEFAULT_COLS;
+  const sizeRows = rows && rows > 0 ? Math.floor(rows) : DEFAULT_ROWS;
+  // Bypass tmux.conf's default-command — build the per-pane argv explicitly
+  // so we can wrap ssh in the gosu privilege drop. The remote shell sequence
+  // (per boolab's invariants in services/tmux_session.py target_cmd_for):
+  //   1. ssh's argv must flatten into a single quoted bash -lc <script>
+  //   2. -l on the outer bash sources ~/.profile on the remote (PATH etc.)
+  //   3. cd to projectRoot, then exec bash -l so the user lands in the repo
+  // /opt is bind-mounted host↔container, so projectRoot resolves to the
+  // same files on both sides.
+  const remoteScript = `cd ${shellEscape(projectRoot)} && exec bash -l`;
+  const remoteCmd = `bash -lc ${shellEscape(remoteScript)}`;
+  const argv = [
+    'new-session', '-d',
+    '-s', sessionName,
+    '-c', projectRoot,
+    '-x', String(sizeCols),
+    '-y', String(sizeRows),
+    '--',
+    // gosu drops privs from the container's root (tmux server runs as root)
+    // to samkintop:samkintop. env restores HOME/USER/SHELL so ssh finds the
+    // right ~/.ssh/id_ed25519 (key is mode 0600 and ssh refuses keys whose
+    // UID doesn't match the running user — both are 1000 here).
+    'gosu', 'samkintop:samkintop',
+    'env', 'HOME=/home/samkintop', 'USER=samkintop', 'SHELL=/bin/bash',
+    'ssh', '-t',
+    '-o', 'StrictHostKeyChecking=yes',
+    '-o', 'ServerAliveInterval=30',
+    '-o', 'ServerAliveCountMax=3',
+    `${SSH_USER}@${SSH_HOST}`,
+    remoteCmd,
+  ];
+  log.info(
+    { sessionName, projectRoot, cols: sizeCols, rows: sizeRows, sshTarget: `${SSH_USER}@${SSH_HOST}` },
+    'creating tmux session (ssh to host)',
+  );
+  const res = await runTmux(tmuxConfPath, argv);
+  if (res.code !== 0) {
+    log.error({ res }, 'tmux new-session failed');
+    throw new Error(`tmux new-session failed: ${res.stderr}`);
+  }
+}
+
+export async function killSession(
+  tmuxConfPath: string,
+  sessionName: string,
+): Promise<boolean> {
+  const res = await runTmux(tmuxConfPath, ['kill-session', '-t', sessionName]);
+  return res.code === 0;
+}
+
+// v1.10.8c: capture-pane on WS attach to replay the buffer state to the fresh
+// xterm (boolab pattern). `-e` preserves ANSI escape sequences so colours and
+// cursor position survive the replay. Returns empty string on failure — the
+// client falls back to whatever tmux itself decides to repaint, which is
+// non-fatal but visually noisier.
+//
+// v1.10.8d: strip trailing blank rows. tmux capture-pane emits one `\n` per
+// pane row (including all the empty rows below the actual content), so on a
+// fresh 35-row pane with just the bash prompt at row 0, the output is
+// `<prompt>` followed by 35 `\n` bytes. When xterm.write()s those naively,
+// the cursor advances row-by-row until it hits the bottom of the canvas and
+// scrolls — pushing the prompt into the scrollback buffer where the user
+// can't see it. Stripping the trailing newlines leaves xterm's cursor at the
+// natural end of the rendered content (matching tmux's actual cursor
+// position for the common single-line-prompt case).
+export async function capturePane(
+  tmuxConfPath: string,
+  sessionName: string,
+  lines: number = 2000,
+): Promise<string> {
+  const res = await runTmux(tmuxConfPath, [
+    'capture-pane', '-t', sessionName, '-p', '-e', '-S', `-${lines}`,
+  ]);
+  if (res.code !== 0) return '';
+  return res.stdout.replace(/(?:\r?\n)+$/, '');
+}

apps/booterm/src/pty/pty.ts

@@ -0,0 +1,48 @@
+import * as pty from 'node-pty';
+import type { IPty } from 'node-pty';
+
+export interface AttachPtyOptions {
+  sessionName: string;
+  projectRoot: string;
+  cols: number;
+  rows: number;
+  tmuxConfPath: string;
+}
+
+function cleanEnv(): { [key: string]: string } {
+  const out: { [key: string]: string } = {};
+  for (const [k, v] of Object.entries(process.env)) {
+    if (typeof v === 'string') out[k] = v;
+  }
+  out['TERM'] = 'screen-256color';
+  return out;
+}
+
+// v1.10.8c: no `-d` (multi-attach friendly — boolab pattern). With per-pane
+// tmux sessions, dropping `-d` means multiple browser tabs viewing the same
+// pane share one tmux session as N clients; tmux fans I/O at the session
+// layer just like boolab's backend. The earlier `-d` flag detached EVERY
+// other client of the session — across windows — which caused the
+// "[detached] from session" bug whenever a new pane attached to a chat
+// session that already had another pane open.
+//
+// Tmux server + session persist across PTY exits, so a refresh resumes with
+// full scrollback. Explicit destroy happens via the /kill route (called from
+// the frontend when the user closes a pane).
+export function attachPty(opts: AttachPtyOptions): IPty {
+  return pty.spawn(
+    'tmux',
+    [
+      '-f', opts.tmuxConfPath,
+      'attach-session',
+      '-t', opts.sessionName,
+    ],
+    {
+      name: 'xterm-256color',
+      cols: opts.cols,
+      rows: opts.rows,
+      cwd: opts.projectRoot,
+      env: cleanEnv(),
+    },
+  );
+}

apps/booterm/src/routes/health.ts

@@ -0,0 +1,9 @@
+import type { FastifyInstance } from 'fastify';
+import { pingDb } from '../db.js';
+
+export function registerHealthRoutes(app: FastifyInstance): void {
+  app.get('/api/term/health', async () => {
+    const dbOk = await pingDb();
+    return { ok: true, db: dbOk };
+  });
+}

apps/booterm/src/routes/terminals.ts

@@ -0,0 +1,93 @@
+import type { FastifyInstance } from 'fastify';
+import { z } from 'zod';
+import { getSessionInfo } from '../db.js';
+import {
+  sanitizeId,
+  tmuxSessionName,
+  ensureSession,
+  killSession,
+  hasSession,
+} from '../pty/manager.js';
+
+const ParamsSchema = z.object({ sid: z.string(), pid: z.string() });
+// v1.10.8c: optional cols/rows on /start so the per-pane tmux session is
+// born at the right dimensions. Bodyless POSTs remain valid (Fastify's
+// tolerant parser).
+const StartBodySchema = z
+  .object({
+    cols: z.coerce.number().int().min(1).max(2000).optional(),
+    rows: z.coerce.number().int().min(1).max(2000).optional(),
+  })
+  .partial()
+  .optional();
+
+export function registerTerminalRoutes(app: FastifyInstance, tmuxConfPath: string): void {
+  // v1.10.8c: /start creates the per-pane tmux session. Idempotent — a second
+  // /start on the same paneId is a no-op (hasSession returns true). The WS
+  // attach handler also calls ensureSession as belt-and-suspenders, so /start
+  // is technically optional, but having it as a separate step surfaces tmux
+  // errors as HTTP responses (vs WS 1011 close codes).
+  app.post<{
+    Params: { sid: string; pid: string };
+    Body: { cols?: number; rows?: number } | undefined;
+  }>(
+    '/api/term/sessions/:sid/panes/:pid/start',
+    async (req, reply) => {
+      const p = ParamsSchema.safeParse(req.params);
+      if (!p.success) return reply.code(400).send({ error: 'bad_params' });
+      const sid = sanitizeId(p.data.sid);
+      const pid = sanitizeId(p.data.pid);
+      if (!sid || !pid) return reply.code(400).send({ error: 'bad_id_format' });
+
+      const b = StartBodySchema.safeParse(req.body ?? {});
+      const cols = b.success ? b.data?.cols : undefined;
+      const rows = b.success ? b.data?.rows : undefined;
+
+      const session = await getSessionInfo(sid);
+      if (!session) return reply.code(404).send({ error: 'unknown_session' });
+
+      const sessionName = tmuxSessionName(pid);
+
+      try {
+        await ensureSession(
+          tmuxConfPath,
+          sessionName,
+          session.project_path,
+          req.log,
+          cols,
+          rows,
+        );
+      } catch (err) {
+        req.log.error({ err }, 'ensureSession failed');
+        return reply.code(500).send({ error: 'tmux_failed' });
+      }
+      return reply.code(200).send({ tmux_session: sessionName });
+    },
+  );
+
+  // v1.10.8c: explicit pane teardown. Frontend calls this when the user
+  // intentionally closes a terminal pane (vs an implicit WS disconnect, which
+  // leaves the tmux session intact for refresh-driven resume).
+  app.post<{ Params: { sid: string; pid: string } }>(
+    '/api/term/sessions/:sid/panes/:pid/kill',
+    async (req, reply) => {
+      const p = ParamsSchema.safeParse(req.params);
+      if (!p.success) return reply.code(400).send({ error: 'bad_params' });
+      const sid = sanitizeId(p.data.sid);
+      const pid = sanitizeId(p.data.pid);
+      if (!sid || !pid) return reply.code(400).send({ error: 'bad_id_format' });
+
+      const sessionName = tmuxSessionName(pid);
+      if (!(await hasSession(tmuxConfPath, sessionName))) {
+        return reply.code(404).send({ error: 'unknown_pane' });
+      }
+      const killed = await killSession(tmuxConfPath, sessionName);
+      if (!killed) return reply.code(500).send({ error: 'tmux_kill_failed' });
+      return reply.code(200).send({ ok: true });
+    },
+  );
+
+  // Resize endpoint removed in v1.10.8c. Resize now flows in-band via the
+  // WebSocket as a `{type:"resize",cols,rows}` text frame — no more race
+  // between active-PTY-map registration and HTTP POST lookup. See ws/attach.ts.
+}

apps/booterm/src/ws/attach.ts

@@ -0,0 +1,168 @@
+import type { FastifyInstance } from 'fastify';
+import type { IPty } from 'node-pty';
+import { getSessionInfo } from '../db.js';
+import {
+  sanitizeId,
+  tmuxSessionName,
+  ensureSession,
+  capturePane,
+} from '../pty/manager.js';
+import { attachPty } from '../pty/pty.js';
+import { getUser } from '../auth.js';
+
+export function registerWsAttachRoute(app: FastifyInstance, tmuxConfPath: string): void {
+  app.get<{
+    Params: { sid: string; pid: string };
+    Querystring: { cols?: string; rows?: string };
+  }>(
+    '/ws/term/sessions/:sid/panes/:pid',
+    { websocket: true },
+    async (socket, req) => {
+      const sid = sanitizeId(req.params.sid);
+      const pid = sanitizeId(req.params.pid);
+      if (!sid || !pid) {
+        socket.close(1008, 'bad_id_format');
+        return;
+      }
+
+      const user = getUser(req);
+      req.log.info({ user, sid, pid }, 'ws attach');
+
+      const session = await getSessionInfo(sid);
+      if (!session) {
+        socket.close(1008, 'unknown_session');
+        return;
+      }
+
+      const sessionName = tmuxSessionName(pid);
+      const cols = parseInt(req.query.cols ?? '', 10) || 80;
+      const rows = parseInt(req.query.rows ?? '', 10) || 24;
+
+      // Idempotent — /start typically created the session already, but cover
+      // the race where the client opens the WS before /start's response lands
+      // (or skips /start entirely). With per-pane tmux sessions there's no
+      // cross-pane interference, so creating-on-attach is safe.
+      try {
+        await ensureSession(
+          tmuxConfPath,
+          sessionName,
+          session.project_path,
+          req.log,
+          cols,
+          rows,
+        );
+      } catch (err) {
+        req.log.error({ err }, 'ensureSession failed in WS handler');
+        socket.close(1011, 'tmux_failed');
+        return;
+      }
+
+      let handle: IPty;
+      try {
+        handle = attachPty({
+          sessionName,
+          projectRoot: session.project_path,
+          cols,
+          rows,
+          tmuxConfPath,
+        });
+      } catch (err) {
+        req.log.error({ err }, 'attachPty failed');
+        socket.close(1011, 'pty_spawn_failed');
+        return;
+      }
+
+      // Frame contract (boolab pattern):
+      //   server → client text:    JSON control — `init` on connect, `exit` on PTY death
+      //   server → client binary:  raw PTY bytes (first frame after init = capture-pane replay)
+      //   client → server binary:  user keystrokes
+      //   client → server text:    JSON control — `{type:"resize", cols, rows}`
+      //
+      // The init frame lets the client term.clear() before paint so a remount
+      // doesn't show stale buffer content. The capture-pane replay then
+      // paints the current tmux pane state into the fresh xterm.
+      try {
+        socket.send(JSON.stringify({ type: 'init', cols, rows, tmux_session: sessionName }));
+      } catch (err) {
+        req.log.warn({ err }, 'init frame send failed');
+      }
+
+      try {
+        const capture = await capturePane(tmuxConfPath, sessionName);
+        if (capture.length > 0) {
+          socket.send(Buffer.from(capture, 'utf8'), { binary: true });
+        }
+      } catch (err) {
+        req.log.warn({ err }, 'capture-pane failed');
+      }
+
+      const onData = (data: string): void => {
+        if (socket.readyState !== socket.OPEN) return;
+        try {
+          socket.send(Buffer.from(data, 'utf8'), { binary: true });
+        } catch (err) {
+          req.log.warn({ err }, 'ws send failed');
+        }
+      };
+      handle.onData(onData);
+
+      socket.on('message', (rawData: Buffer | string, isBinary?: boolean) => {
+        // ws v8 emits Buffer + isBinary boolean; older versions emit string
+        // for text frames. Either way: text path tries JSON parse for the
+        // resize control; binary path writes to the PTY.
+        const isTextFrame = typeof rawData === 'string' || isBinary === false;
+        if (isTextFrame) {
+          const text = typeof rawData === 'string' ? rawData : rawData.toString('utf8');
+          try {
+            const parsed = JSON.parse(text) as { type?: string; cols?: number; rows?: number };
+            if (parsed.type === 'resize') {
+              const newCols = Math.max(1, Math.min(2000, Math.floor(Number(parsed.cols) || 80)));
+              const newRows = Math.max(1, Math.min(2000, Math.floor(Number(parsed.rows) || 24)));
+              req.log.info({ pid, cols: newCols, rows: newRows }, 'resize');
+              try {
+                handle.resize(newCols, newRows);
+              } catch {
+                /* ignore — invalid winsize bubble */
+              }
+            }
+          } catch {
+            /* malformed text frame — drop silently */
+          }
+          return;
+        }
+        try {
+          handle.write((rawData as Buffer).toString('utf8'));
+        } catch (err) {
+          req.log.warn({ err }, 'pty write failed');
+        }
+      });
+
+      handle.onExit(({ exitCode }) => {
+        try {
+          if (socket.readyState === socket.OPEN) {
+            socket.send(JSON.stringify({ type: 'exit', code: exitCode }));
+          }
+        } catch {
+          /* ignore */
+        }
+        try {
+          socket.close(1000);
+        } catch {
+          /* ignore */
+        }
+      });
+
+      // WS close kills the tmux client (the local PTY) but the tmux server +
+      // session persist — so a refresh resumes with full scrollback. Permanent
+      // teardown happens via the /kill route called from the frontend when the
+      // user closes the pane.
+      socket.on('close', () => {
+        try {
+          handle.kill();
+        } catch {
+          /* ignore */
+        }
+      });
+    },
+  );
+}

apps/booterm/tmux.conf

@@ -0,0 +1,30 @@
+set -g default-terminal "screen-256color"
+set -g history-limit 50000
+
+# v1.10.8c: per-pane tmux sessions (boolab pattern). With one session per
+# pane, the session size adapts to the attached client; `window-size = largest`
+# + `aggressive-resize on` make tmux pick up the client's actual cols/rows
+# instead of falling back to 80x24. Critical for opencode/claude TUIs that
+# read TIOCGWINSZ once at fork time.
+set -g window-size largest
+set -g aggressive-resize on
+
+# v1.10.3: `set -g mouse on` removed. tmux's mouse mode captured wheel/touch
+# events at the protocol level, so xterm.js never saw them and the viewport
+# couldn't scroll on mobile. With mouse off, xterm.js handles scrollback
+# natively (wheel on desktop, finger-drag on mobile via touch-action: pan-y).
+# Tradeoff: lose tmux mouse pane-resize and scroll-inside-vim; acceptable for
+# the homelab single-user setup.
+set -g mouse off
+setw -g mode-keys vi
+set -g status off
+set -g destroy-unattached off
+
+# v1.10.1: shells drop privs to samkintop (uid 1000) so the terminal runs in
+# the user's environment, not root. `env HOME=… USER=…` is required because
+# gosu only changes uid/gid — env (including HOME) survives, and the tmux
+# server runs as root so HOME would otherwise be /root. bash -l then sources
+# samkintop's ~/.profile / ~/.bashrc to pick up PATH (nvm, ~/.local/bin,
+# ~/.opencode/bin).
+# v1.10.2: su-exec → gosu (alpine → debian; functionally identical).
+set -g default-command "gosu samkintop:samkintop env HOME=/home/samkintop USER=samkintop SHELL=/bin/bash bash -l"

apps/booterm/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    "outDir": "dist",
+    "rootDir": "src",
+    "lib": ["ES2022"],
+    "types": ["node"],
+    "declaration": false,
+    "sourceMap": true
+  },
+  "include": ["src/**/*"],
+  "exclude": ["**/*.test.ts"]
+}

apps/server/src/index.ts

@@ -15,8 +15,12 @@ import { registerSidebarRoutes } from './routes/sidebar.js';
 import { registerWebSocket } from './routes/ws.js';
 import { registerModelRoutes } from './routes/models.js';
 import { registerAgentRoutes } from './routes/agents.js';
+import { registerSkillsRoutes } from './routes/skills.js';
 import { createInferenceRunner } from './services/inference.js';
 import { createBroker } from './services/broker.js';
+import { listSkills } from './services/skills.js';
+import * as compaction from './services/compaction.js';
+import { configureModelContext } from './services/model-context.js';
 
 async function main() {
   const config = loadConfig();
@@ -45,6 +49,11 @@ async function main() {
   await applySchema(sql);
   app.log.info('database schema applied');
 
+  // v1.11.3: tell the model-context cache where llama-swap lives. Cache
+  // lookups go to ${LLAMA_SWAP_URL}/upstream/<model>/props to read
+  // default_generation_settings.n_ctx — the value persisted as messages.ctx_max.
+  configureModelContext({ llamaSwapUrl: config.LLAMA_SWAP_URL });
+
   await app.register(fastifyWebsocket);
 
   app.get('/api/health', async () => {
@@ -62,6 +71,15 @@ async function main() {
   registerSidebarRoutes(app, sql);
   registerChatRoutes(app, sql, broker);
 
+  // Batch 9.6: warm the skills cache at boot and surface the count. Empty or
+  // missing /data/skills is non-fatal — the skill tools just return empty.
+  try {
+    const skills = await listSkills();
+    app.log.info(`skills loaded: ${skills.length}`);
+  } catch (err) {
+    app.log.warn({ err }, 'skills boot walk failed');
+  }
+
   const inference = createInferenceRunner(
     {
       sql,
@@ -70,6 +88,11 @@ async function main() {
       publish: (sessionId, frame) => {
         broker.publish(sessionId, frame as unknown as Record<string, unknown> & { type: string });
       },
+      // v1.11: broker handle for compaction.process to publish 'compacted'
+      // frames on the per-session channel. Inference's regular publish path
+      // is bound to (sessionId, InferenceFrame); compaction publishes a
+      // different frame shape, so it goes through the raw broker.
+      broker,
     },
     (user, frame) => {
       broker.publishUser(user, frame as unknown as Record<string, unknown> & { type: string });
@@ -79,9 +102,13 @@ async function main() {
     enqueueInference: (sessionId, chatId, assistantId, user) => {
       inference.enqueue(sessionId, chatId, assistantId, user);
     },
-    enqueueCompact: (sessionId, chatId, compactId, user) => {
-      inference.enqueueCompact(sessionId, chatId, compactId, user);
-    },
+    // v1.11: synchronous compaction. Awaits the LLM call inside the route's
+    // request lifecycle; the new summary row arrives via the WS 'compacted'
+    // frame published from inside compaction.process. We let the error
+    // bubble up so the route can reply 500 — manual /compact failures
+    // should be loud (the user just clicked a button).
+    runCompaction: (chatId) =>
+      compaction.process({ sql, config, log: app.log, broker, chatId }),
     cancelInference: async (sessionId, chatId) => {
       return inference.cancel(sessionId, chatId);
     },
@@ -112,6 +139,36 @@ async function main() {
         chat_id: chatId,
       });
     },
+    publishSessionFrame: (sessionId, frame) => {
+      broker.publish(sessionId, frame);
+    },
+  });
+  registerSkillsRoutes(app, sql, {
+    enqueueInference: (sessionId, chatId, assistantId, user) => {
+      inference.enqueue(sessionId, chatId, assistantId, user);
+    },
+    publishUserMessage: (sessionId, chatId, userMessageId, content) => {
+      broker.publish(sessionId, {
+        type: 'message_started',
+        message_id: userMessageId,
+        chat_id: chatId,
+        role: 'user',
+      });
+      broker.publish(sessionId, {
+        type: 'delta',
+        message_id: userMessageId,
+        chat_id: chatId,
+        content,
+      });
+      broker.publish(sessionId, {
+        type: 'message_complete',
+        message_id: userMessageId,
+        chat_id: chatId,
+      });
+    },
+    publishSessionFrame: (sessionId, frame) => {
+      broker.publish(sessionId, frame);
+    },
   });
   registerWebSocket(app, sql, broker);
 

apps/server/src/routes/chats.ts

@@ -123,6 +123,53 @@ export function registerChatRoutes(
     }
   );
 
+  // v1.9: bulk-archive every open chat in a session. Mirrors the single
+  // /chats/:id/archive shape — N chat_archived frames published, useSidebar
+  // reducer handles each via the existing case.
+  app.post<{ Params: { id: string } }>(
+    '/api/sessions/:id/chats/archive-all',
+    async (req, reply) => {
+      const session = await sql`SELECT id FROM sessions WHERE id = ${req.params.id}`;
+      if (session.length === 0) {
+        reply.code(404);
+        return { error: 'session not found' };
+      }
+      const rows = await sql<{ id: string }[]>`
+        UPDATE chats
+           SET status = 'archived', updated_at = clock_timestamp()
+         WHERE session_id = ${req.params.id} AND status = 'open'
+         RETURNING id
+      `;
+      const ids = rows.map((r) => r.id);
+      for (const id of ids) {
+        broker.publishUser('default', {
+          type: 'chat_archived',
+          chat_id: id,
+          session_id: req.params.id,
+        });
+      }
+      return { archived: ids.length, ids };
+    }
+  );
+
+  // v1.9: count helper for the confirm dialog.
+  app.get<{ Params: { id: string } }>(
+    '/api/sessions/:id/chats/open-count',
+    async (req, reply) => {
+      const session = await sql`SELECT id FROM sessions WHERE id = ${req.params.id}`;
+      if (session.length === 0) {
+        reply.code(404);
+        return { error: 'session not found' };
+      }
+      const rows = await sql<{ count: number }[]>`
+        SELECT COUNT(*)::int AS count
+          FROM chats
+         WHERE session_id = ${req.params.id} AND status = 'open'
+      `;
+      return { count: rows[0]?.count ?? 0 };
+    }
+  );
+
   app.post<{ Params: { id: string } }>(
     '/api/chats/:id/archive',
     async (req, reply) => {
@@ -269,7 +316,8 @@ export function registerChatRoutes(
       }
       const rows = await sql<Message[]>`
         SELECT id, session_id, chat_id, role, content, kind, tool_calls, tool_results, status, last_seq,
-               tokens_used, ctx_used, ctx_max, started_at, finished_at, created_at, metadata
+               tokens_used, ctx_used, ctx_max, started_at, finished_at, created_at, metadata,
+               summary, tail_start_id, compacted_at
         FROM messages
         WHERE chat_id = ${req.params.id}
         ORDER BY created_at ASC, id ASC

apps/server/src/routes/messages.ts

@@ -1,7 +1,7 @@
 import type { FastifyInstance } from 'fastify';
 import { z } from 'zod';
 import type { Sql } from '../db.js';
-import type { Chat, Message, Session } from '../types/api.js';
+import type { Chat, Message, Session, ToolCall } from '../types/api.js';
 
 const SendBody = z.object({
   content: z.string().min(1).max(64_000),
@@ -14,9 +14,47 @@ const ContinueBody = z.object({
   sentinel_message_id: z.string().uuid(),
 });
 
+// Batch 9.7: ask_user_input answer submission. Defensive shape — the question
+// content is echoed back for traceability but the server does NOT trust it
+// (the source of truth is the assistant message's tool_calls.args.questions).
+const AnswerUserInputBody = z.object({
+  tool_call_id: z.string().min(1),
+  answers: z
+    .array(
+      z.object({
+        question: z.string(),
+        selected_options: z.array(z.string()),
+        free_text: z.string().nullable(),
+      }),
+    )
+    .min(1)
+    .max(3),
+});
+
+// Same shape the model declared via the tool's zod input. Re-derived here so
+// the route can validate args without depending on services/tools.ts (which
+// would pull in fs/path_guard for nothing).
+const AskUserInputArgs = z.object({
+  questions: z
+    .array(
+      z.object({
+        question: z.string(),
+        type: z.enum(['single_select', 'multi_select']),
+        options: z.array(z.string()).min(1),
+      }),
+    )
+    .min(1)
+    .max(3),
+});
+
 interface MessageHandlers {
   enqueueInference: (sessionId: string, chatId: string, assistantMessageId: string, user: string) => void;
-  enqueueCompact: (sessionId: string, chatId: string, compactMessageId: string, user: string) => void;
+  // v1.11: returns a promise that resolves after compaction.process finishes
+  // (await the LLM call). Throws on failure — the route surfaces a 500.
+  // Replaces the v1.10 enqueueCompact (which fired-and-forgot a kind='compact'
+  // streaming row). The new anchored-rolling strategy inserts a single
+  // summary=true assistant row only after the LLM responds.
+  runCompaction: (chatId: string) => Promise<void>;
   publishUserMessage: (
     sessionId: string,
     chatId: string,
@@ -24,6 +62,13 @@ interface MessageHandlers {
     content: string
   ) => void;
   publishMessagesDeleted: (sessionId: string, chatId: string, messageIds: string[]) => void;
+  // Batch 9.7: lets the answer endpoint emit the tool_result frame that the
+  // pause path intentionally skipped. Matches SkillInvokeHandlers in
+  // routes/skills.ts so index.ts can pass the same broker.publish adapter.
+  publishSessionFrame: (
+    sessionId: string,
+    frame: Record<string, unknown> & { type: string }
+  ) => void;
   cancelInference: (sessionId: string, chatId: string) => Promise<boolean>;
   hasActiveInference: (chatId: string) => boolean;
 }
@@ -41,9 +86,15 @@ export function registerMessageRoutes(
         reply.code(404);
         return { error: 'session not found' };
       }
+      // v1.11: returns ALL messages including compacted ones. The UI
+      // distinguishes via the new `summary` flag (renders an accordion
+      // SummaryCard) and shows compacted_at-stamped rows inline for context.
+      // Internal inference assembly filters compacted_at IS NULL separately —
+      // see services/inference.ts loadContext + services/compaction.ts.
       const rows = await sql<Message[]>`
         SELECT id, session_id, chat_id, role, content, kind, tool_calls, tool_results, status, last_seq,
-               tokens_used, ctx_used, ctx_max, started_at, finished_at, created_at, metadata
+               tokens_used, ctx_used, ctx_max, started_at, finished_at, created_at, metadata,
+               summary, tail_start_id, compacted_at
         FROM messages
         WHERE session_id = ${req.params.id}
         ORDER BY created_at ASC, id ASC
@@ -211,29 +262,30 @@ export function registerMessageRoutes(
     }
   );
 
+  // v1.11: manual /compact. Was a streaming kind='compact' row inserted by
+  // this handler; now delegates to the anchored-rolling compaction service.
+  // Synchronous (we await the LLM call) — callers either await or rely on
+  // the 'compacted' WS frame to refresh their view. The response carries
+  // no body of interest; the new summary row arrives via the WS frame.
   app.post<{ Params: { id: string } }>(
     '/api/chats/:id/compact',
     async (req, reply) => {
-      const chatRows = await sql<Chat[]>`
-        SELECT id, session_id FROM chats WHERE id = ${req.params.id} AND status = 'open'
+      const chatRows = await sql<{ id: string }[]>`
+        SELECT id FROM chats WHERE id = ${req.params.id} AND status = 'open'
       `;
       if (chatRows.length === 0) {
         reply.code(404);
         return { error: 'chat not found' };
       }
-      const chat = chatRows[0]!;
-      const sessionId = chat.session_id;
-
-      const [compactMsg] = await sql<{ id: string }[]>`
-        INSERT INTO messages (session_id, chat_id, role, content, kind, status, created_at)
-        VALUES (${sessionId}, ${chat.id}, 'system', '', 'compact', 'streaming', clock_timestamp())
-        RETURNING id
-      `;
-
-      handlers.enqueueCompact(sessionId, chat.id, compactMsg!.id, 'default');
-
-      reply.code(202);
-      return { compact_message_id: compactMsg!.id };
+      try {
+        await handlers.runCompaction(chatRows[0]!.id);
+      } catch (err) {
+        req.log.error({ err, chatId: chatRows[0]!.id }, 'manual compaction failed');
+        reply.code(500);
+        return { error: err instanceof Error ? err.message : 'compaction failed' };
+      }
+      reply.code(200);
+      return { ok: true };
     }
   );
 
@@ -389,4 +441,169 @@ export function registerMessageRoutes(
       return result;
     }
   );
+
+  // Batch 9.7: resume an ask_user_input pause. Validates the body matches the
+  // question shape the model declared, UPDATEs the pending tool row's
+  // tool_results to the AnswerSet, publishes the deferred tool_result frame,
+  // and enqueues the next assistant turn. Error codes per spec:
+  //   400 invalid_body / mismatched_answer_shape
+  //   404 chat_not_found / unknown_tool_call_id
+  //   409 tool_call_already_answered
+  app.post<{ Params: { id: string } }>(
+    '/api/chats/:id/answer_user_input',
+    async (req, reply) => {
+      const parsed = AnswerUserInputBody.safeParse(req.body);
+      if (!parsed.success) {
+        reply.code(400);
+        return { error: 'invalid_body', details: parsed.error.flatten() };
+      }
+      const { tool_call_id, answers } = parsed.data;
+
+      const chatRows = await sql<Chat[]>`
+        SELECT id, session_id FROM chats WHERE id = ${req.params.id} AND status = 'open'
+      `;
+      if (chatRows.length === 0) {
+        reply.code(404);
+        return { error: 'chat_not_found' };
+      }
+      const chat = chatRows[0]!;
+      const sessionId = chat.session_id;
+
+      // Find the assistant message that emitted this tool_call. Scoped by
+      // chat_id + role to avoid cross-chat lookups; ordered by created_at DESC
+      // because the most recent issuance wins when an LLM reuses call IDs
+      // across turns (the older, already-answered one is a different row with
+      // populated tool_results downstream).
+      const callerRows = await sql<{ id: string; tool_calls: ToolCall[] | null }[]>`
+        SELECT id, tool_calls FROM messages
+        WHERE chat_id = ${chat.id}
+          AND role = 'assistant'
+          AND tool_calls IS NOT NULL
+        ORDER BY created_at DESC
+      `;
+      let foundCall: ToolCall | null = null;
+      for (const row of callerRows) {
+        const match = row.tool_calls?.find((tc) => tc.id === tool_call_id);
+        if (match) {
+          foundCall = match;
+          break;
+        }
+      }
+      if (!foundCall) {
+        reply.code(404);
+        return { error: 'unknown_tool_call_id' };
+      }
+      if (foundCall.name !== 'ask_user_input') {
+        reply.code(400);
+        return { error: 'tool_call_not_ask_user_input' };
+      }
+
+      // Validate the args themselves — the LLM could have emitted bad JSON.
+      const argsParsed = AskUserInputArgs.safeParse(foundCall.args);
+      if (!argsParsed.success) {
+        reply.code(400);
+        return { error: 'mismatched_answer_shape', detail: 'tool_call args invalid' };
+      }
+      const questions = argsParsed.data.questions;
+      if (answers.length !== questions.length) {
+        reply.code(400);
+        return {
+          error: 'mismatched_answer_shape',
+          detail: `expected ${questions.length} answer(s), got ${answers.length}`,
+        };
+      }
+      for (let i = 0; i < questions.length; i++) {
+        const q = questions[i]!;
+        const a = answers[i]!;
+        for (const sel of a.selected_options) {
+          if (!q.options.includes(sel)) {
+            reply.code(400);
+            return {
+              error: 'mismatched_answer_shape',
+              detail: `answer ${i + 1} contains option not in question: ${sel}`,
+            };
+          }
+        }
+        if (q.type === 'single_select' && a.selected_options.length > 1) {
+          reply.code(400);
+          return {
+            error: 'mismatched_answer_shape',
+            detail: `answer ${i + 1} has multiple selections on single_select`,
+          };
+        }
+        const hasOpt = a.selected_options.length > 0;
+        const hasText = a.free_text !== null && a.free_text.trim().length > 0;
+        if (!hasOpt && !hasText) {
+          reply.code(400);
+          return { error: 'mismatched_answer_shape', detail: `answer ${i + 1} is empty` };
+        }
+      }
+
+      // Find the pending tool row. ORDER BY created_at DESC + LIMIT 1 picks
+      // the most recent row with this tool_call_id; the already-answered
+      // check below guards against UPDATE-ing a stale answer.
+      const toolRows = await sql<{
+        id: string;
+        tool_results: { tool_call_id: string; output: unknown } | null;
+      }[]>`
+        SELECT id, tool_results FROM messages
+        WHERE chat_id = ${chat.id}
+          AND role = 'tool'
+          AND tool_results->>'tool_call_id' = ${tool_call_id}
+        ORDER BY created_at DESC
+        LIMIT 1
+      `;
+      const toolRow = toolRows[0];
+      if (!toolRow) {
+        reply.code(404);
+        return { error: 'unknown_tool_call_id', detail: 'tool message not found' };
+      }
+      if (toolRow.tool_results && toolRow.tool_results.output !== null) {
+        reply.code(409);
+        return { error: 'tool_call_already_answered' };
+      }
+
+      const answerSet = { answers };
+      const newToolResults = {
+        tool_call_id,
+        output: answerSet,
+        truncated: false,
+      };
+
+      const result = await sql.begin(async (tx) => {
+        await tx`
+          UPDATE messages
+          SET tool_results = ${tx.json(newToolResults as never)}
+          WHERE id = ${toolRow.id}
+        `;
+        const [assistantMsg] = await tx<{ id: string }[]>`
+          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
+          VALUES (${sessionId}, ${chat.id}, 'assistant', '', 'streaming', clock_timestamp())
+          RETURNING id
+        `;
+        await tx`UPDATE sessions SET updated_at = clock_timestamp() WHERE id = ${sessionId}`;
+        await tx`UPDATE chats SET updated_at = clock_timestamp() WHERE id = ${chat.id}`;
+        return {
+          tool_message_id: toolRow.id,
+          assistant_message_id: assistantMsg!.id,
+        };
+      });
+
+      // Publish the deferred tool_result frame. useSessionStream's reducer
+      // updates the matching tool_run.result so AskUserInputCard flips into
+      // its read-only "answered" mode without a refetch.
+      handlers.publishSessionFrame(sessionId, {
+        type: 'tool_result',
+        tool_message_id: result.tool_message_id,
+        tool_call_id,
+        chat_id: chat.id,
+        output: answerSet,
+        truncated: false,
+      });
+      handlers.enqueueInference(sessionId, chat.id, result.assistant_message_id, 'default');
+
+      reply.code(202);
+      return result;
+    },
+  );
 }

apps/server/src/routes/projects.ts

@@ -22,8 +22,14 @@ const AddProjectBody = z.object({
   name: z.string().min(1).optional(),
 });
 
+// v1.9: PATCH accepts the new per-project defaults. All fields optional so
+// the existing rename-only callers keep working. Empty string on
+// default_system_prompt is the "no override" sentinel — same convention as
+// sessions.system_prompt.
 const PatchProjectBody = z.object({
-  name: z.string().min(1).max(200),
+  name: z.string().min(1).max(200).optional(),
+  default_system_prompt: z.string().max(8000).optional(),
+  default_web_search_enabled: z.boolean().optional(),
 });
 
 const CreateProjectBody = z.object({
@@ -70,7 +76,8 @@ export function registerProjectRoutes(
   app.get<{ Querystring: { status?: string } }>('/api/projects', async (req) => {
     const status = req.query.status === 'archived' ? 'archived' : 'open';
     const rows = await sql<Project[]>`
-      SELECT id, name, path, added_at, last_session_id, status, gitea_remote
+      SELECT id, name, path, added_at, last_session_id, status, gitea_remote,
+             default_system_prompt, default_web_search_enabled
       FROM projects
       WHERE status = ${status}
       ORDER BY added_at DESC
@@ -119,7 +126,8 @@ export function registerProjectRoutes(
       const [row] = await sql<Project[]>`
         INSERT INTO projects (name, path, gitea_remote)
         VALUES (${parsed.data.name}, ${bootstrap.folder_real_path}, ${bootstrap.gitea_remote_url})
-        RETURNING id, name, path, added_at, last_session_id, status, gitea_remote
+        RETURNING id, name, path, added_at, last_session_id, status, gitea_remote,
+                  default_system_prompt, default_web_search_enabled
       `;
       broker.publishUser('default', { type: 'project_created', project: row as unknown as Project });
       reply.code(201);
@@ -173,7 +181,8 @@ export function registerProjectRoutes(
       INSERT INTO projects (name, path)
       VALUES (${name}, ${resolved.real})
       ON CONFLICT (path) DO UPDATE SET status = 'open'
-      RETURNING id, name, path, added_at, last_session_id, status, gitea_remote
+      RETURNING id, name, path, added_at, last_session_id, status, gitea_remote,
+                default_system_prompt, default_web_search_enabled
     `;
 
     if (existing.length === 0) {
@@ -187,22 +196,53 @@ export function registerProjectRoutes(
     return row;
   });
 
+  // v1.9: single-project fetch so the settings pane can refetch on
+  // project_updated without pulling the whole project list.
+  app.get<{ Params: { id: string } }>('/api/projects/:id', async (req, reply) => {
+    const rows = await sql<Project[]>`
+      SELECT id, name, path, added_at, last_session_id, status, gitea_remote,
+             default_system_prompt, default_web_search_enabled
+      FROM projects WHERE id = ${req.params.id}
+    `;
+    if (rows.length === 0) {
+      reply.code(404);
+      return { error: 'not found' };
+    }
+    return rows[0];
+  });
+
   app.patch<{ Params: { id: string } }>('/api/projects/:id', async (req, reply) => {
     const parsed = PatchProjectBody.safeParse(req.body);
     if (!parsed.success) {
       reply.code(400);
       return { error: 'invalid body', details: parsed.error.flatten() };
     }
+    const { name, default_system_prompt, default_web_search_enabled } = parsed.data;
+    // v1.9: every field optional. COALESCE on the bind keeps the prior value
+    // when the caller omits it. Boolean has its own branch since COALESCE
+    // can't disambiguate "omitted" from "explicitly false" via a single
+    // nullable parameter.
+    const dwsProvided = default_web_search_enabled !== undefined;
     const rows = await sql<Project[]>`
-      UPDATE projects SET name = ${parsed.data.name}
+      UPDATE projects
+      SET
+        name = COALESCE(${name ?? null}, name),
+        default_system_prompt = COALESCE(${default_system_prompt ?? null}, default_system_prompt),
+        default_web_search_enabled = CASE WHEN ${dwsProvided}
+          THEN ${default_web_search_enabled ?? false}
+          ELSE default_web_search_enabled END
       WHERE id = ${req.params.id}
-      RETURNING id, name, path, added_at, last_session_id, status, gitea_remote
+      RETURNING id, name, path, added_at, last_session_id, status, gitea_remote,
+                default_system_prompt, default_web_search_enabled
     `;
     if (rows.length === 0) {
       reply.code(404);
       return { error: 'not found' };
     }
     const project = rows[0]!;
+    // v1.9: the project_updated frame still only carries id + name. Clients
+    // that need the new fields refetch via api.projects.list() — keeps the
+    // frame payload lean, per the locked recon decision (d).
     broker.publishUser('default', {
       type: 'project_updated',
       project_id: project.id,
@@ -229,7 +269,8 @@ export function registerProjectRoutes(
     const rows = await sql<Project[]>`
       UPDATE projects SET status = 'open'
       WHERE id = ${req.params.id} AND status = 'archived'
-      RETURNING id, name, path, added_at, last_session_id, status, gitea_remote
+      RETURNING id, name, path, added_at, last_session_id, status, gitea_remote,
+                default_system_prompt, default_web_search_enabled
     `;
     if (rows.length === 0) {
       reply.code(404);

apps/server/src/routes/sessions.ts

@@ -19,6 +19,8 @@ const PatchBody = z.object({
   model: z.string().min(1).max(200).optional(),
   system_prompt: z.string().max(8000).optional(),
   agent_id: z.string().min(1).max(200).nullable().optional(),
+  // v1.9: null = inherit from project default; true/false = explicit override.
+  web_search_enabled: z.boolean().nullable().optional(),
 });
 
 async function resolveDefaultModel(sql: Sql, config: Config): Promise<string> {
@@ -50,7 +52,7 @@ export function registerSessionRoutes(
       }
       const status = req.query.status === 'archived' ? 'archived' : 'open';
       const rows = await sql<Session[]>`
-        SELECT id, project_id, name, model, system_prompt, status, created_at, updated_at, agent_id
+        SELECT id, project_id, name, model, system_prompt, status, created_at, updated_at, agent_id, web_search_enabled
         FROM sessions
         WHERE project_id = ${req.params.id} AND status = ${status}
         ORDER BY updated_at DESC
@@ -100,7 +102,7 @@ export function registerSessionRoutes(
         const [session] = await tx<Session[]>`
           INSERT INTO sessions (project_id, name, model, system_prompt, agent_id)
           VALUES (${req.params.id}, ${name}, ${model}, ${systemPrompt}, ${agentId})
-          RETURNING id, project_id, name, model, system_prompt, status, created_at, updated_at, agent_id
+          RETURNING id, project_id, name, model, system_prompt, status, created_at, updated_at, agent_id, web_search_enabled
         `;
         await tx`
           INSERT INTO chats (session_id, name, status)
@@ -120,7 +122,7 @@ export function registerSessionRoutes(
 
   app.get<{ Params: { id: string } }>('/api/sessions/:id', async (req, reply) => {
     const rows = await sql<Session[]>`
-      SELECT id, project_id, name, model, system_prompt, status, created_at, updated_at, agent_id
+      SELECT id, project_id, name, model, system_prompt, status, created_at, updated_at, agent_id, web_search_enabled
       FROM sessions WHERE id = ${req.params.id}
     `;
     if (rows.length === 0) {
@@ -139,10 +141,13 @@ export function registerSessionRoutes(
         return { error: 'invalid body', details: parsed.error.flatten() };
       }
       const { name, model, system_prompt } = parsed.data;
-      // agent_id is tri-state on the wire: omitted = no change, null = clear,
-      // string = set. CASE WHEN inside SET handles all three atomically.
+      // agent_id and web_search_enabled are both tri-state on the wire: omitted
+      // = no change, null = clear/inherit, value = set. CASE WHEN inside SET
+      // handles all three atomically.
       const agentIdProvided = parsed.data.agent_id !== undefined;
       const newAgentId = parsed.data.agent_id ?? null;
+      const wseProvided = parsed.data.web_search_enabled !== undefined;
+      const newWse = parsed.data.web_search_enabled ?? null;
       // Read the prior name so the post-update publish can skip no-op renames
       // (PATCH { name: "Foo" } where the session is already "Foo"). The window
       // between SELECT and UPDATE is sub-millisecond in the same request handler;
@@ -159,9 +164,11 @@ export function registerSessionRoutes(
           model = COALESCE(${model ?? null}, model),
           system_prompt = COALESCE(${system_prompt ?? null}, system_prompt),
           agent_id = CASE WHEN ${agentIdProvided} THEN ${newAgentId} ELSE agent_id END,
+          web_search_enabled = CASE WHEN ${wseProvided} THEN ${newWse} ELSE web_search_enabled END,
           updated_at = clock_timestamp()
         WHERE id = ${req.params.id}
-        RETURNING id, project_id, name, model, system_prompt, status, created_at, updated_at, agent_id
+        RETURNING id, project_id, name, model, system_prompt, status, created_at, updated_at,
+                  agent_id, web_search_enabled
       `;
       if (rows.length === 0) {
         reply.code(404);
@@ -175,10 +182,69 @@ export function registerSessionRoutes(
           name: session.name,
         });
       }
+      // v1.9: any successful PATCH broadcasts session_updated so listeners
+      // (notably the SettingsPane open in another tab) can refetch and pick
+      // up the new fields. Frame stays lean (decision d) — payload is just
+      // ids + name + updated_at, the client refetches via api.sessions.get.
+      broker.publishUser('default', {
+        type: 'session_updated',
+        session_id: session.id,
+        project_id: session.project_id,
+        name: session.name,
+        updated_at: session.updated_at,
+      });
       return session;
     }
   );
 
+  // v1.9: bulk-archive every open session in a project. Mirrors the
+  // single-archive shape (same broker frame type) so the existing useSidebar
+  // reducer cases handle it without changes — just N frames instead of 1.
+  app.post<{ Params: { id: string } }>(
+    '/api/projects/:id/sessions/archive-all',
+    async (req, reply) => {
+      const project = await sql`SELECT id FROM projects WHERE id = ${req.params.id}`;
+      if (project.length === 0) {
+        reply.code(404);
+        return { error: 'project not found' };
+      }
+      const rows = await sql<{ id: string }[]>`
+        UPDATE sessions
+           SET status = 'archived', updated_at = clock_timestamp()
+         WHERE project_id = ${req.params.id} AND status = 'open'
+         RETURNING id
+      `;
+      const ids = rows.map((r) => r.id);
+      for (const id of ids) {
+        broker.publishUser('default', {
+          type: 'session_archived',
+          session_id: id,
+          project_id: req.params.id,
+        });
+      }
+      return { archived: ids.length, ids };
+    }
+  );
+
+  // v1.9: count helper for the confirm dialog. Cheap COUNT(*) — the settings
+  // pane calls it on click, not on render.
+  app.get<{ Params: { id: string } }>(
+    '/api/projects/:id/sessions/open-count',
+    async (req, reply) => {
+      const project = await sql`SELECT id FROM projects WHERE id = ${req.params.id}`;
+      if (project.length === 0) {
+        reply.code(404);
+        return { error: 'project not found' };
+      }
+      const rows = await sql<{ count: number }[]>`
+        SELECT COUNT(*)::int AS count
+          FROM sessions
+         WHERE project_id = ${req.params.id} AND status = 'open'
+      `;
+      return { count: rows[0]?.count ?? 0 };
+    }
+  );
+
   app.post<{ Params: { id: string } }>(
     '/api/sessions/:id/archive',
     async (req, reply) => {
@@ -207,7 +273,7 @@ export function registerSessionRoutes(
       const rows = await sql<Session[]>`
         UPDATE sessions SET status = 'open', updated_at = clock_timestamp()
         WHERE id = ${req.params.id} AND status = 'archived'
-        RETURNING id, project_id, name, model, system_prompt, status, created_at, updated_at, agent_id
+        RETURNING id, project_id, name, model, system_prompt, status, created_at, updated_at, agent_id, web_search_enabled
       `;
       if (rows.length === 0) {
         reply.code(404);

apps/server/src/routes/settings.ts

@@ -22,6 +22,50 @@ export async function setSetting(
   `;
 }
 
+// themes-v1: whitelist of the 18 preset theme ids. Kept in sync with
+// docs/themes_v1.md §1 and apps/web/src/lib/theme.ts THEMES.
+const THEME_IDS = [
+  'obsidian',
+  'gunmetal',
+  'espresso',
+  'volcanic-brown',
+  'copper',
+  'gold',
+  'oxblood',
+  'crimson',
+  'elderflower',
+  'plum',
+  'steel-pink',
+  'fuchsia-noir',
+  'matrix',
+  'sage',
+  'ivory',
+  'chalk',
+  'cobalt',
+  'midnight-sapphire',
+] as const;
+
+const THEME_MODES = ['dark', 'light', 'system'] as const;
+
+// PATCH body is still a free-form key/value bag for everything except the
+// two theme keys, which carry strict per-key validation. Anything outside
+// THEME_IDS / THEME_MODES on those keys is rejected with 400.
+function validateThemeKeys(body: Record<string, unknown>): string | null {
+  if ('theme_id' in body) {
+    const v = body.theme_id;
+    if (typeof v !== 'string' || !(THEME_IDS as readonly string[]).includes(v)) {
+      return `theme_id must be one of: ${THEME_IDS.join(', ')}`;
+    }
+  }
+  if ('theme_mode' in body) {
+    const v = body.theme_mode;
+    if (typeof v !== 'string' || !(THEME_MODES as readonly string[]).includes(v)) {
+      return `theme_mode must be one of: ${THEME_MODES.join(', ')}`;
+    }
+  }
+  return null;
+}
+
 const PatchBody = z.record(z.string(), z.unknown());
 
 export function registerSettingsRoutes(app: FastifyInstance, sql: Sql): void {
@@ -38,6 +82,11 @@ export function registerSettingsRoutes(app: FastifyInstance, sql: Sql): void {
       reply.code(400);
       return { error: 'invalid body', details: parsed.error.flatten() };
     }
+    const themeError = validateThemeKeys(parsed.data);
+    if (themeError) {
+      reply.code(400);
+      return { error: themeError };
+    }
     for (const [k, v] of Object.entries(parsed.data)) {
       await setSetting(sql, k, v);
     }

apps/server/src/routes/skills.ts

@@ -0,0 +1,156 @@
+import { randomUUID } from 'node:crypto';
+import type { FastifyInstance } from 'fastify';
+import { z } from 'zod';
+import type { Sql } from '../db.js';
+import type { Chat } from '../types/api.js';
+import { getSkillBody, listSkills } from '../services/skills.js';
+
+// Batch 9.6 slash-invoke handlers. Mirrors the MessageHandlers shape in
+// routes/messages.ts so index.ts can pass thin adapters around broker +
+// inference runner without skills.ts importing them directly.
+export interface SkillInvokeHandlers {
+  enqueueInference: (
+    sessionId: string,
+    chatId: string,
+    assistantMessageId: string,
+    user: string,
+  ) => void;
+  publishUserMessage: (
+    sessionId: string,
+    chatId: string,
+    userMessageId: string,
+    content: string,
+  ) => void;
+  publishSessionFrame: (
+    sessionId: string,
+    frame: Record<string, unknown> & { type: string },
+  ) => void;
+}
+
+const SkillInvokeBody = z.object({
+  skill_name: z.string().min(1),
+  // Optional — server fills in a default if absent or whitespace-only so the
+  // model always has something to act on (matches the spec's "Apply this
+  // skill." filler).
+  user_message: z.string().max(64_000).nullable().optional(),
+});
+
+const DEFAULT_USER_MESSAGE = 'Apply this skill.';
+
+export function registerSkillsRoutes(
+  app: FastifyInstance,
+  sql: Sql,
+  handlers: SkillInvokeHandlers,
+): void {
+  // Debug/admin surface — the model interacts with skills via the three
+  // skill_* tools, not through this endpoint.
+  app.get('/api/skills', async () => {
+    return { skills: await listSkills() };
+  });
+
+  // POST /api/chats/:id/skill_invoke — slash-command entry point. Loads the
+  // skill body server-side (clients never get to forge file content),
+  // persists 4 messages in one transaction (synthetic assistant tool_use,
+  // synthetic tool result, real user message, streaming assistant), and
+  // enqueues inference against the updated history.
+  app.post<{ Params: { id: string } }>(
+    '/api/chats/:id/skill_invoke',
+    async (req, reply) => {
+      const parsed = SkillInvokeBody.safeParse(req.body);
+      if (!parsed.success) {
+        reply.code(400);
+        return { error: 'invalid body', details: parsed.error.flatten() };
+      }
+      const { skill_name } = parsed.data;
+      const userText = parsed.data.user_message?.trim() ? parsed.data.user_message : DEFAULT_USER_MESSAGE;
+
+      const chatRows = await sql<Chat[]>`
+        SELECT id, session_id FROM chats WHERE id = ${req.params.id} AND status = 'open'
+      `;
+      if (chatRows.length === 0) {
+        reply.code(404);
+        return { error: 'chat not found' };
+      }
+      const chat = chatRows[0]!;
+      const sessionId = chat.session_id;
+
+      const body = await getSkillBody(skill_name);
+      if (body === null) {
+        reply.code(404);
+        return { error: 'unknown_skill', message: `unknown skill: ${skill_name}` };
+      }
+
+      const toolCallId = randomUUID();
+      const toolCalls = [{ id: toolCallId, name: 'skill_use', args: { name: skill_name } }];
+      const toolResults = { tool_call_id: toolCallId, output: body, truncated: false };
+
+      const result = await sql.begin(async (tx) => {
+        const [synthAssistant] = await tx<{ id: string }[]>`
+          INSERT INTO messages (session_id, chat_id, role, content, tool_calls, status, created_at)
+          VALUES (${sessionId}, ${chat.id}, 'assistant', '', ${sql.json(toolCalls as never)}, 'complete', clock_timestamp())
+          RETURNING id
+        `;
+        const [toolMsg] = await tx<{ id: string }[]>`
+          INSERT INTO messages (session_id, chat_id, role, content, tool_results, status, created_at)
+          VALUES (${sessionId}, ${chat.id}, 'tool', '', ${sql.json(toolResults as never)}, 'complete', clock_timestamp())
+          RETURNING id
+        `;
+        const [userMsg] = await tx<{ id: string }[]>`
+          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
+          VALUES (${sessionId}, ${chat.id}, 'user', ${userText}, 'complete', clock_timestamp())
+          RETURNING id
+        `;
+        const [assistantMsg] = await tx<{ id: string }[]>`
+          INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
+          VALUES (${sessionId}, ${chat.id}, 'assistant', '', 'streaming', clock_timestamp())
+          RETURNING id
+        `;
+        await tx`UPDATE sessions SET updated_at = clock_timestamp() WHERE id = ${sessionId}`;
+        await tx`UPDATE chats SET updated_at = clock_timestamp() WHERE id = ${chat.id}`;
+        return {
+          synth_assistant_id: synthAssistant!.id,
+          tool_message_id: toolMsg!.id,
+          user_message_id: userMsg!.id,
+          assistant_message_id: assistantMsg!.id,
+        };
+      });
+
+      // Synthetic frames so useSessionStream's reducer reflects the new
+      // history without a refetch. Frame shapes match the streaming-inference
+      // protocol (see services/inference.ts InferenceFrame).
+      handlers.publishSessionFrame(sessionId, {
+        type: 'message_started',
+        message_id: result.synth_assistant_id,
+        chat_id: chat.id,
+        role: 'assistant',
+      });
+      handlers.publishSessionFrame(sessionId, {
+        type: 'tool_call',
+        message_id: result.synth_assistant_id,
+        chat_id: chat.id,
+        tool_call: toolCalls[0]!,
+      });
+      handlers.publishSessionFrame(sessionId, {
+        type: 'message_complete',
+        message_id: result.synth_assistant_id,
+        chat_id: chat.id,
+      });
+      // The tool_result frame's reducer branch creates the tool-role message
+      // in-place when it doesn't already exist — no separate message_started
+      // is needed for the tool side.
+      handlers.publishSessionFrame(sessionId, {
+        type: 'tool_result',
+        tool_message_id: result.tool_message_id,
+        tool_call_id: toolCallId,
+        chat_id: chat.id,
+        output: body,
+        truncated: false,
+      });
+      handlers.publishUserMessage(sessionId, chat.id, result.user_message_id, userText);
+      handlers.enqueueInference(sessionId, chat.id, result.assistant_message_id, 'default');
+
+      reply.code(202);
+      return result;
+    },
+  );
+}

apps/server/src/routes/ws.ts

@@ -21,9 +21,12 @@ export function registerWebSocket(
         return;
       }
 
+      // v1.11: snapshot includes compaction fields so MessageBubble can
+      // render the SummaryCard for summary=true rows on first connect.
       const messages = await sql<Message[]>`
         SELECT id, session_id, chat_id, role, content, kind, tool_calls, tool_results, status, last_seq,
-               tokens_used, ctx_used, ctx_max, started_at, finished_at, created_at, metadata
+               tokens_used, ctx_used, ctx_max, started_at, finished_at, created_at, metadata,
+               summary, tail_start_id, compacted_at
         FROM messages
         WHERE session_id = ${sessionId}
         ORDER BY created_at ASC, id ASC

apps/server/src/schema.sql

@@ -53,7 +53,7 @@ CREATE TABLE IF NOT EXISTS session_panes (
   id           UUID PRIMARY KEY DEFAULT gen_random_uuid(),
   session_id   UUID NOT NULL REFERENCES sessions(id) ON DELETE CASCADE,
   position     INTEGER NOT NULL,
-  kind         TEXT NOT NULL CHECK (kind IN ('chat', 'file_browser')),
+  kind         TEXT NOT NULL CHECK (kind IN ('chat', 'file_browser', 'terminal')),
   state        JSONB NOT NULL DEFAULT '{}',
   created_at   TIMESTAMPTZ NOT NULL DEFAULT clock_timestamp(),
   UNIQUE (session_id, position)
@@ -165,3 +165,39 @@ ALTER TABLE sessions ADD COLUMN IF NOT EXISTS agent_id TEXT;
 --                       agent_name: string|null, can_continue: boolean }
 -- Shape for errors:   { error_reason: 'llm_provider_error'|..., error_text: string }
 ALTER TABLE messages ADD COLUMN IF NOT EXISTS metadata JSONB;
+
+-- themes-v1: idempotent seeds for the two theme preference keys. The settings
+-- table is a key/value store (see line 43) so theme prefs live as two rows,
+-- not new columns. Defaults match docs/themes_v1.md: obsidian (dark).
+INSERT INTO settings (key, value) VALUES ('theme_id', '"obsidian"') ON CONFLICT (key) DO NOTHING;
+INSERT INTO settings (key, value) VALUES ('theme_mode', '"dark"') ON CONFLICT (key) DO NOTHING;
+
+-- v1.9: per-project defaults that new sessions inherit, plus a per-session
+-- web-search override. Empty string on either prompt column means "inherit"
+-- (resolved in inference.ts buildSystemPrompt). web_search_enabled is the
+-- only tri-state field: null on session = inherit from project default.
+ALTER TABLE projects ADD COLUMN IF NOT EXISTS default_system_prompt TEXT NOT NULL DEFAULT '';
+ALTER TABLE projects ADD COLUMN IF NOT EXISTS default_web_search_enabled BOOLEAN NOT NULL DEFAULT false;
+ALTER TABLE sessions ADD COLUMN IF NOT EXISTS web_search_enabled BOOLEAN;
+
+-- v1.11: anchored rolling compaction.
+--   compacted_at  — marks rows that are "behind the curtain" of the latest
+--                   summary. Inference assembly filters compacted_at IS NULL;
+--                   the API GET still returns all rows so the UI can show
+--                   history with the summary card inline.
+--   summary       — true on the assistant row that IS the anchored summary.
+--                   Exactly one row per chat is the "current" summary
+--                   (every prior summary row is itself compacted_at-stamped
+--                   when superseded, leaving one live anchor).
+--   tail_start_id — points at the first preserved message that the summary
+--                   covers up to (exclusive). Lets the UI/debug reason about
+--                   the boundary without re-deriving from compacted_at.
+--   needs_compaction — flag on chats (not sessions) because chat history is
+--                   per-chat; sessions have 1:N chats. Set true post-overflow,
+--                   cleared by compaction.process at the start of the next
+--                   inference turn.
+ALTER TABLE messages ADD COLUMN IF NOT EXISTS compacted_at TIMESTAMPTZ;
+ALTER TABLE messages ADD COLUMN IF NOT EXISTS summary BOOLEAN NOT NULL DEFAULT FALSE;
+ALTER TABLE messages ADD COLUMN IF NOT EXISTS tail_start_id UUID REFERENCES messages(id) ON DELETE SET NULL;
+ALTER TABLE chats ADD COLUMN IF NOT EXISTS needs_compaction BOOLEAN NOT NULL DEFAULT FALSE;
+CREATE INDEX IF NOT EXISTS idx_messages_chat_compacted ON messages (chat_id, compacted_at);

apps/server/src/services/__tests__/compaction.test.ts

@@ -0,0 +1,258 @@
+import { describe, it, expect } from 'vitest';
+import {
+  usable,
+  isOverflow,
+  estimate,
+  turns,
+  select,
+  buildPrompt,
+  type CompactionMessage,
+} from '../compaction.js';
+import { SUMMARY_TEMPLATE } from '../compaction-prompt.js';
+
+// ---- fixture ----------------------------------------------------------------
+// Tiny constructor for the message shape `compaction.ts` consumes. Default
+// values match the post-CP1 schema (summary=false, kind='message', complete).
+// Tests that need a summary row pass `summary: true`.
+
+let counter = 0;
+function mkMsg(
+  role: CompactionMessage['role'],
+  content: string,
+  overrides: Partial<CompactionMessage> = {},
+): CompactionMessage {
+  counter += 1;
+  return {
+    id: `m${counter}`,
+    role,
+    content,
+    kind: 'message',
+    summary: false,
+    status: 'complete',
+    tool_calls: null,
+    tool_results: null,
+    metadata: null,
+    created_at: new Date(counter * 1000).toISOString(),
+    ...overrides,
+  };
+}
+
+// ---- usable -----------------------------------------------------------------
+
+describe('usable', () => {
+  it('returns 0 when contextLimit is 0', () => {
+    expect(usable(0)).toBe(0);
+  });
+
+  it('returns 0 when contextLimit is below the 20k buffer', () => {
+    // Math.max(0, x - 20000) clamps the subtraction so we never report
+    // negative headroom. A 10k-context model reports 0 usable, which makes
+    // isOverflow short-circuit to false (correct — we can't size the
+    // compaction with no headroom).
+    expect(usable(10_000)).toBe(0);
+    expect(usable(19_999)).toBe(0);
+    expect(usable(20_000)).toBe(0);
+  });
+
+  it('subtracts the 20k buffer from a normal-sized context window', () => {
+    expect(usable(100_000)).toBe(80_000);
+    expect(usable(32_768)).toBe(12_768);
+  });
+});
+
+// ---- isOverflow -------------------------------------------------------------
+
+describe('isOverflow', () => {
+  it('returns false when usable is 0 (unknown / sub-buffer context)', () => {
+    expect(isOverflow({ prompt_tokens: 999_999, completion_tokens: 0 }, 0)).toBe(false);
+    expect(isOverflow({ prompt_tokens: 0, completion_tokens: 999_999 }, 10_000)).toBe(false);
+  });
+
+  it('returns false at 50% of usable', () => {
+    // usable(100k) = 80k → 50% = 40k.
+    expect(isOverflow({ prompt_tokens: 30_000, completion_tokens: 10_000 }, 100_000)).toBe(false);
+  });
+
+  it('returns false just under usable', () => {
+    expect(isOverflow({ prompt_tokens: 79_000, completion_tokens: 999 }, 100_000)).toBe(false);
+  });
+
+  it('returns true exactly at usable (>=, not strict >)', () => {
+    expect(isOverflow({ prompt_tokens: 80_000, completion_tokens: 0 }, 100_000)).toBe(true);
+  });
+
+  it('returns true above usable', () => {
+    expect(isOverflow({ prompt_tokens: 50_000, completion_tokens: 40_000 }, 100_000)).toBe(true);
+  });
+});
+
+// ---- estimate ---------------------------------------------------------------
+
+describe('estimate', () => {
+  it('returns a tiny value for an empty array (JSON.stringify([]) is "[]")', () => {
+    // Math.ceil('[]'.length / 4) = 1. Documented here so the next reader
+    // doesn't think "0" is the expected baseline — char-count/4 will never
+    // be exactly 0 for any JSON-serializable input.
+    expect(estimate([])).toBe(1);
+  });
+
+  it('scales roughly with content length', () => {
+    const tiny = estimate([mkMsg('user', 'hi')]);
+    const big = estimate([mkMsg('user', 'x'.repeat(4000))]);
+    expect(big).toBeGreaterThan(tiny);
+    expect(big).toBeGreaterThanOrEqual(1000); // 4000 chars / 4 = 1000 floor
+  });
+
+  it('is deterministic across repeated calls', () => {
+    const msgs = [mkMsg('user', 'one'), mkMsg('assistant', 'two')];
+    expect(estimate(msgs)).toBe(estimate(msgs));
+  });
+});
+
+// ---- turns ------------------------------------------------------------------
+
+describe('turns', () => {
+  it('returns [] for an empty message list', () => {
+    expect(turns([])).toEqual([]);
+  });
+
+  it('returns one turn for a single user message', () => {
+    const u = mkMsg('user', 'hi');
+    const result = turns([u]);
+    expect(result).toHaveLength(1);
+    expect(result[0]).toEqual({ start: 0, end: 1, id: u.id });
+  });
+
+  it('returns two turns for user/assistant/user/assistant', () => {
+    const u1 = mkMsg('user', 'q1');
+    const a1 = mkMsg('assistant', 'a1');
+    const u2 = mkMsg('user', 'q2');
+    const a2 = mkMsg('assistant', 'a2');
+    const result = turns([u1, a1, u2, a2]);
+    expect(result).toEqual([
+      { start: 0, end: 2, id: u1.id },
+      { start: 2, end: 4, id: u2.id },
+    ]);
+  });
+
+  it('extends the final turn end to include trailing non-user messages', () => {
+    // Spec wording: "user/assistant + trailing system → trailing included
+    // in last turn's range". Single-turn variant: [user, assistant, system]
+    // should produce one turn with end=3 (covers all three indices).
+    const u = mkMsg('user', 'q');
+    const a = mkMsg('assistant', 'a');
+    const s = mkMsg('system', 'note');
+    const result = turns([u, a, s]);
+    expect(result).toEqual([{ start: 0, end: 3, id: u.id }]);
+  });
+
+  it('skips user rows flagged as summary (anchored-rolling rows)', () => {
+    // Defense-in-depth — process() pre-filters summary rows, but turns()
+    // also skips them so a misuse from another caller doesn't create a
+    // bogus turn boundary on the summary row itself.
+    const u1 = mkMsg('user', 'q1');
+    const a1 = mkMsg('assistant', 'a1');
+    const sum = mkMsg('user', 'rolled-up', { summary: true });
+    const u2 = mkMsg('user', 'q2');
+    const result = turns([u1, a1, sum, u2]);
+    expect(result.map((t) => t.id)).toEqual([u1.id, u2.id]);
+  });
+});
+
+// ---- select -----------------------------------------------------------------
+
+describe('select', () => {
+  it('returns empty head + undefined tail for an empty message list', () => {
+    const result = select([], 100_000);
+    expect(result.head).toEqual([]);
+    expect(result.tail_start_id).toBeUndefined();
+  });
+
+  it('full-preserves when there are fewer turns than tail_turns', () => {
+    // 1 turn but tail_turns=2: keep === turn0 → keep.start === 0 →
+    // sentinel-return path that signals "no compaction this round".
+    const u = mkMsg('user', 'only');
+    const a = mkMsg('assistant', 'a');
+    const result = select([u, a], 100_000, 2);
+    expect(result.head).toEqual([u, a]);
+    expect(result.tail_start_id).toBeUndefined();
+  });
+
+  it('keeps the last tail_turns turns when they all fit the budget', () => {
+    // 3 turns, all small. tail_turns=2 means keep the last 2; head =
+    // messages[0..turn2.start] = just turn1's content.
+    const u1 = mkMsg('user', 'q1');
+    const a1 = mkMsg('assistant', 'a1');
+    const u2 = mkMsg('user', 'q2');
+    const a2 = mkMsg('assistant', 'a2');
+    const u3 = mkMsg('user', 'q3');
+    const a3 = mkMsg('assistant', 'a3');
+    const msgs = [u1, a1, u2, a2, u3, a3];
+    const result = select(msgs, 100_000, 2);
+    // Turn boundaries: [0,2), [2,4), [4,6). slice(-2) = turns at 2 and 4.
+    // Walking backward: u3 fits, then u2 fits → keep={start:2, id:u2.id}.
+    expect(result.tail_start_id).toBe(u2.id);
+    expect(result.head).toEqual([u1, a1]);
+  });
+
+  it('splits a turn mid-stream when the whole turn would overflow the budget', () => {
+    // tail_turns=1 so we look only at the most recent turn. Stuff it past
+    // 8k of content (max preserve budget) and the splitter walks forward
+    // looking for the largest suffix that fits.
+    const u1 = mkMsg('user', 'q1');
+    const a1 = mkMsg('assistant', 'a1');
+    const u2 = mkMsg('user', 'q2 with a giant payload');
+    const huge = mkMsg('assistant', 'X'.repeat(40_000)); // ~10k tokens
+    const smallTail = mkMsg('assistant', 'short answer');
+    const msgs = [u1, a1, u2, huge, smallTail];
+    const result = select(msgs, 100_000, 1);
+    // The split walks from turn.start+1 forward; the first index whose
+    // [i, end) slice fits the budget becomes the new keep. We don't assert
+    // a specific id (depends on character math), only that compaction was
+    // triggered (tail_start_id set, head non-empty) and that the head
+    // doesn't include the final small message.
+    expect(result.tail_start_id).toBeDefined();
+    expect(result.head.length).toBeGreaterThan(0);
+    expect(result.head).not.toContain(smallTail);
+  });
+
+  it('full-preserves when no split point fits', () => {
+    // Single oversized turn; splitTurn walks but each suffix is still too
+    // big. After the loop, keep is undefined → full-preserve sentinel.
+    // Force this with a sub-buffer context so budget is the floor (2k),
+    // and a single 40k-char message.
+    const u = mkMsg('user', 'oversized');
+    const a = mkMsg('assistant', 'Y'.repeat(40_000));
+    const result = select([u, a], 30_000, 1);
+    // usable(30k) = 10k → budget = min(8k, max(2k, floor(10k*0.25))) =
+    // min(8k, max(2k, 2500)) = 2500. 40k chars ≈ 10k tokens. Can't fit.
+    expect(result.tail_start_id).toBeUndefined();
+    expect(result.head).toEqual([u, a]);
+  });
+});
+
+// ---- buildPrompt ------------------------------------------------------------
+
+describe('buildPrompt', () => {
+  it('opens with the "create new" anchor when previousSummary is undefined', () => {
+    const out = buildPrompt(undefined, []);
+    expect(out.startsWith('Create a new anchored summary')).toBe(true);
+    expect(out).toContain(SUMMARY_TEMPLATE);
+    expect(out).not.toContain('<previous-summary>');
+  });
+
+  it('opens with the "update" anchor and embeds previousSummary verbatim', () => {
+    const prev = '## Goal\n- finish v1.11 compaction';
+    const out = buildPrompt(prev, []);
+    expect(out.startsWith('Update the anchored summary')).toBe(true);
+    expect(out).toContain('<previous-summary>');
+    expect(out).toContain(prev);
+    expect(out).toContain('</previous-summary>');
+    expect(out).toContain(SUMMARY_TEMPLATE);
+  });
+
+  it('appends extra context strings after the template (reserved for plugin injection)', () => {
+    const out = buildPrompt(undefined, ['extra-context-line']);
+    expect(out.endsWith('extra-context-line')).toBe(true);
+  });
+});

apps/server/src/services/__tests__/inference.test.ts

@@ -22,6 +22,7 @@ function makeSession(overrides: Partial<Session> = {}): Session {
     created_at: new Date(0).toISOString(),
     updated_at: new Date(0).toISOString(),
     agent_id: null,
+    web_search_enabled: null,
     ...overrides,
   };
 }
@@ -35,6 +36,8 @@ function makeProject(overrides: Partial<Project> = {}): Project {
     last_session_id: null,
     status: 'open',
     gitea_remote: null,
+    default_system_prompt: '',
+    default_web_search_enabled: false,
     ...overrides,
   };
 }

apps/server/src/services/__tests__/model-context.test.ts

@@ -0,0 +1,205 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import {
+  configureModelContext,
+  getModelContext,
+  invalidateModelContext,
+} from '../model-context.js';
+
+// ---- fixtures ---------------------------------------------------------------
+
+const TEST_URL = 'http://llama-swap.test:8401';
+
+function mockOkProps(n_ctx: number, total_slots = 1) {
+  return new Response(
+    JSON.stringify({
+      default_generation_settings: { n_ctx },
+      total_slots,
+    }),
+    { status: 200, headers: { 'Content-Type': 'application/json' } },
+  );
+}
+
+beforeEach(() => {
+  invalidateModelContext();
+  configureModelContext({ llamaSwapUrl: TEST_URL });
+});
+
+afterEach(() => {
+  vi.restoreAllMocks();
+  vi.useRealTimers();
+});
+
+// ---- positive cache ---------------------------------------------------------
+
+describe('getModelContext — positive cache', () => {
+  it('returns the parsed body on a 200 with valid shape', async () => {
+    const fetchSpy = vi.spyOn(globalThis, 'fetch').mockResolvedValueOnce(mockOkProps(262_144, 1));
+    const result = await getModelContext('qwen3.6');
+    expect(result).not.toBeNull();
+    expect(result!.n_ctx).toBe(262_144);
+    expect(result!.total_slots).toBe(1);
+    expect(typeof result!.fetched_at).toBe('number');
+    // Verify the URL was constructed correctly — encodes the model name in
+    // case it contains characters that would break the path.
+    expect(fetchSpy).toHaveBeenCalledExactlyOnceWith(
+      `${TEST_URL}/upstream/qwen3.6/props`,
+      expect.objectContaining({ signal: expect.any(AbortSignal) }),
+    );
+  });
+
+  it('serves the second call from cache without refetching', async () => {
+    const fetchSpy = vi
+      .spyOn(globalThis, 'fetch')
+      .mockResolvedValueOnce(mockOkProps(262_144));
+    const a = await getModelContext('qwen3.6');
+    const b = await getModelContext('qwen3.6');
+    expect(a).toEqual(b);
+    expect(fetchSpy).toHaveBeenCalledTimes(1);
+  });
+
+  it('defaults total_slots to 1 when the server omits it', async () => {
+    // Mirror the docstring claim — total_slots is informational and we don't
+    // reject the response just because it's missing.
+    vi.spyOn(globalThis, 'fetch').mockResolvedValueOnce(
+      new Response(JSON.stringify({ default_generation_settings: { n_ctx: 8192 } }), {
+        status: 200,
+      }),
+    );
+    const result = await getModelContext('partial-model');
+    expect(result).not.toBeNull();
+    expect(result!.n_ctx).toBe(8192);
+    expect(result!.total_slots).toBe(1);
+  });
+});
+
+// ---- negative cache (single-shot) ------------------------------------------
+
+describe('getModelContext — negative cache (single failure modes)', () => {
+  it('returns null and negative-caches when default_generation_settings is missing', async () => {
+    const fetchSpy = vi
+      .spyOn(globalThis, 'fetch')
+      .mockResolvedValueOnce(new Response(JSON.stringify({ total_slots: 1 }), { status: 200 }));
+    const result = await getModelContext('broken');
+    expect(result).toBeNull();
+    // Second call within TTL must not refetch.
+    const result2 = await getModelContext('broken');
+    expect(result2).toBeNull();
+    expect(fetchSpy).toHaveBeenCalledTimes(1);
+  });
+
+  it('returns null and negative-caches when n_ctx is missing inside default_generation_settings', async () => {
+    const fetchSpy = vi.spyOn(globalThis, 'fetch').mockResolvedValueOnce(
+      new Response(JSON.stringify({ default_generation_settings: {}, total_slots: 1 }), {
+        status: 200,
+      }),
+    );
+    await getModelContext('half-broken');
+    await getModelContext('half-broken');
+    expect(fetchSpy).toHaveBeenCalledTimes(1);
+  });
+
+  it('returns null and negative-caches on non-200 (404)', async () => {
+    const fetchSpy = vi
+      .spyOn(globalThis, 'fetch')
+      .mockResolvedValueOnce(new Response('not found', { status: 404 }));
+    const result = await getModelContext('missing-model');
+    expect(result).toBeNull();
+    const result2 = await getModelContext('missing-model');
+    expect(result2).toBeNull();
+    expect(fetchSpy).toHaveBeenCalledTimes(1);
+  });
+
+  it('returns null and negative-caches on network error', async () => {
+    const fetchSpy = vi
+      .spyOn(globalThis, 'fetch')
+      .mockRejectedValueOnce(new TypeError('fetch failed: connect ECONNREFUSED'));
+    const result = await getModelContext('down-upstream');
+    expect(result).toBeNull();
+    const result2 = await getModelContext('down-upstream');
+    expect(result2).toBeNull();
+    expect(fetchSpy).toHaveBeenCalledTimes(1);
+  });
+});
+
+// ---- negative cache TTL -----------------------------------------------------
+
+describe('getModelContext — negative cache TTL', () => {
+  it('does NOT refetch when a second call lands within the 60s TTL', async () => {
+    vi.useFakeTimers();
+    const fetchSpy = vi
+      .spyOn(globalThis, 'fetch')
+      .mockResolvedValueOnce(new Response('boom', { status: 500 }));
+
+    await getModelContext('flapping');
+    vi.advanceTimersByTime(30_000);
+    await getModelContext('flapping');
+    expect(fetchSpy).toHaveBeenCalledTimes(1);
+  });
+
+  it('refetches when the second call lands after the 60s TTL expires', async () => {
+    vi.useFakeTimers();
+    const fetchSpy = vi
+      .spyOn(globalThis, 'fetch')
+      .mockResolvedValueOnce(new Response('boom', { status: 500 }))
+      // Recovered upstream on the retry — we expect a positive cache hit
+      // after this fires.
+      .mockResolvedValueOnce(mockOkProps(8192));
+
+    await getModelContext('flapping');
+    vi.advanceTimersByTime(61_000);
+    const result = await getModelContext('flapping');
+    expect(result).not.toBeNull();
+    expect(result!.n_ctx).toBe(8192);
+    expect(fetchSpy).toHaveBeenCalledTimes(2);
+  });
+});
+
+// ---- invalidateModelContext -------------------------------------------------
+
+describe('invalidateModelContext', () => {
+  it('clears a single positive entry by model name', async () => {
+    const fetchSpy = vi
+      .spyOn(globalThis, 'fetch')
+      .mockResolvedValueOnce(mockOkProps(8192))
+      .mockResolvedValueOnce(mockOkProps(8192));
+
+    await getModelContext('cleared');
+    invalidateModelContext('cleared');
+    await getModelContext('cleared');
+    expect(fetchSpy).toHaveBeenCalledTimes(2);
+  });
+
+  it('clears ALL entries when called with no arg', async () => {
+    const fetchSpy = vi
+      .spyOn(globalThis, 'fetch')
+      .mockResolvedValueOnce(mockOkProps(8192))
+      .mockResolvedValueOnce(mockOkProps(16_384))
+      // After the full clear, both models re-fetch.
+      .mockResolvedValueOnce(mockOkProps(8192))
+      .mockResolvedValueOnce(mockOkProps(16_384));
+
+    await getModelContext('alpha');
+    await getModelContext('beta');
+    invalidateModelContext();
+    await getModelContext('alpha');
+    await getModelContext('beta');
+    expect(fetchSpy).toHaveBeenCalledTimes(4);
+  });
+
+  it('clearing a positive entry also clears the matching negative entry', async () => {
+    // Mixed state: first call fails (negative-caches), then we invalidate
+    // explicitly and the next call should fetch again rather than serve
+    // the stale negative entry.
+    const fetchSpy = vi
+      .spyOn(globalThis, 'fetch')
+      .mockResolvedValueOnce(new Response('boom', { status: 500 }))
+      .mockResolvedValueOnce(mockOkProps(4096));
+
+    await getModelContext('formerly-broken');
+    invalidateModelContext('formerly-broken');
+    const result = await getModelContext('formerly-broken');
+    expect(result).not.toBeNull();
+    expect(result!.n_ctx).toBe(4096);
+    expect(fetchSpy).toHaveBeenCalledTimes(2);
+  });
+});

apps/server/src/services/agents.ts

@@ -11,7 +11,17 @@ const GLOBAL_AGENTS_PATH = '/data/AGENTS.md';
 const CACHE_TTL_MS = 60_000;
 
 // Tools whitelist universe matches services/tools.ts ALL_TOOLS. Keep in sync.
-const ALL_TOOL_NAMES = ['view_file', 'list_dir', 'grep', 'find_files', 'git_status'] as const;
+// Batch 9.6: skill_find / skill_use / skill_resource added. Agents without an
+// explicit `tools:` field inherit the full default set (which now includes
+// the skill tools); agents with an explicit `tools:` array must list any
+// skill tool they want to use — strict opt-in.
+// Batch 9.7: ask_user_input added — same opt-in semantics. Agents with an
+// explicit tools list that omits it cannot trigger the interactive picker.
+const ALL_TOOL_NAMES = [
+  'view_file', 'list_dir', 'grep', 'find_files', 'git_status',
+  'skill_find', 'skill_use', 'skill_resource',
+  'ask_user_input',
+] as const;
 const DEFAULT_TOOLS: string[] = [...ALL_TOOL_NAMES];
 const DEFAULT_TEMPERATURE = 0.7;
 

apps/server/src/services/compaction-prompt.ts

@@ -0,0 +1,40 @@
+// v1.11: anchored rolling summary template. Verbatim port from opencode
+// (packages/opencode/src/session/compaction.ts SUMMARY_TEMPLATE). Kept in a
+// separate module so the long template literal doesn't bloat compaction.ts.
+
+export const SUMMARY_TEMPLATE = `Output exactly the Markdown structure shown inside <template> and keep the section order unchanged. Do not include the <template> tags in your response.
+<template>
+## Goal
+- [single-sentence task summary]
+
+## Constraints & Preferences
+- [user constraints, preferences, specs, or "(none)"]
+
+## Progress
+### Done
+- [completed work or "(none)"]
+
+### In Progress
+- [current work or "(none)"]
+
+### Blocked
+- [blockers or "(none)"]
+
+## Key Decisions
+- [decision and why, or "(none)"]
+
+## Next Steps
+- [ordered next actions or "(none)"]
+
+## Critical Context
+- [important technical facts, errors, open questions, or "(none)"]
+
+## Relevant Files
+- [file or directory path: why it matters, or "(none)"]
+</template>
+
+Rules:
+- Keep every section, even when empty.
+- Use terse bullets, not prose paragraphs.
+- Preserve exact file paths, commands, error strings, and identifiers when known.
+- Do not mention the summary process or that context was compacted.`;

apps/server/src/services/compaction.ts

@@ -0,0 +1,510 @@
+// v1.11: anchored rolling compaction. Ported algorithms (not Effect-TS code)
+// from opencode (packages/opencode/src/session/{compaction,overflow}.ts).
+//
+// What's different from BooCode's legacy /compact:
+//   - Operates per-chat (chats have N:1 to sessions; history is per-chat).
+//   - Detects overflow automatically after each inference completion using
+//     llama-swap's reported n_ctx; flags chats.needs_compaction=true.
+//   - On the next turn (or manual /compact) we summarize the *head* (messages
+//     prior to a preserved tail of N user-turns) into a single
+//     summary=true assistant row. Older messages get compacted_at-stamped so
+//     inference assembly filters them out; the GET endpoint still returns
+//     them so the UI can show history with the summary card inline.
+//   - The summary is *anchored rolling* — exactly one live summary=true row
+//     per chat. Subsequent compactions read the prior summary as
+//     previousSummary, ask the LLM to update-merge it, then mark the prior
+//     summary row compacted_at too (it stays in the UI but isn't sent to the
+//     LLM again).
+
+import type { FastifyBaseLogger } from 'fastify';
+import type { Sql } from '../db.js';
+import type { Config } from '../config.js';
+import type { Broker } from './broker.js';
+import { SUMMARY_TEMPLATE } from './compaction-prompt.js';
+import * as modelContextLookup from './model-context.js';
+
+const COMPACTION_BUFFER = 20_000;
+const MIN_PRESERVE_RECENT_TOKENS = 2_000;
+const MAX_PRESERVE_RECENT_TOKENS = 8_000;
+const DEFAULT_TAIL_TURNS = 2;
+
+// Subset of Message fields compaction touches. Selecting only what's needed
+// keeps process() independent of api.ts mutations and reduces DB egress.
+export interface CompactionMessage {
+  id: string;
+  role: 'user' | 'assistant' | 'system' | 'tool';
+  content: string;
+  kind: 'message' | 'compact';
+  summary: boolean;
+  status: 'streaming' | 'complete' | 'failed' | 'cancelled';
+  tool_calls: Array<{ id: string; name: string; args: Record<string, unknown> }> | null;
+  tool_results: { tool_call_id: string; output: unknown; truncated: boolean; error?: string } | null;
+  metadata: { kind?: string } | null;
+  created_at: string;
+}
+
+// === overflow ===
+
+// Tokens we hold in reserve for the model's response so a near-full context
+// can still produce a useful turn. Mirrors opencode's COMPACTION_BUFFER.
+// Returns 0 when the context limit is unknown (caller treats 0 as "do not
+// trigger overflow"); avoids dividing-by-zero downstream.
+export function usable(contextLimit: number): number {
+  if (!contextLimit || contextLimit <= 0) return 0;
+  return Math.max(0, contextLimit - COMPACTION_BUFFER);
+}
+
+export interface Usage {
+  prompt_tokens: number;
+  completion_tokens: number;
+}
+
+// True when the assistant just used >= usable() tokens. Unknown limit → false
+// (we never auto-trigger compaction without a budget — better to keep
+// inference flowing than to fall into a compaction we can't size properly).
+export function isOverflow(usage: Usage, contextLimit: number): boolean {
+  const budget = usable(contextLimit);
+  if (budget <= 0) return false;
+  return (usage.prompt_tokens + usage.completion_tokens) >= budget;
+}
+
+// === selection ===
+
+interface Turn {
+  start: number;
+  end: number;
+  id: string;
+}
+
+// Char-count / 4 token estimate. Matches opencode's Token.estimate (which
+// also goes through JSON.stringify). Adequate for tail-fitting math; we
+// don't need a real tokenizer here — the 20k buffer absorbs the slop.
+export function estimate(messages: CompactionMessage[]): number {
+  return Math.ceil(JSON.stringify(messages).length / 4);
+}
+
+// Walk messages, return one Turn per user message that is NOT a summary row.
+// end = next-user-start; final turn ends at messages.length.
+export function turns(messages: CompactionMessage[]): Turn[] {
+  const result: Turn[] = [];
+  for (let i = 0; i < messages.length; i++) {
+    const m = messages[i]!;
+    if (m.role !== 'user') continue;
+    if (m.summary) continue;
+    result.push({ start: i, end: messages.length, id: m.id });
+  }
+  for (let i = 0; i < result.length - 1; i++) {
+    result[i]!.end = result[i + 1]!.start;
+  }
+  return result;
+}
+
+// Inside a turn that doesn't fit whole, walk forward from start+1 looking for
+// the largest suffix that fits the remaining budget. Returns the keep-start
+// index (the first preserved message) or undefined if no suffix fits.
+function splitTurn(
+  messages: CompactionMessage[],
+  turn: Turn,
+  budget: number,
+): { start: number; id: string } | undefined {
+  if (budget <= 0) return undefined;
+  if (turn.end - turn.start <= 1) return undefined;
+  for (let start = turn.start + 1; start < turn.end; start++) {
+    const size = estimate(messages.slice(start, turn.end));
+    if (size > budget) continue;
+    return { start, id: messages[start]!.id };
+  }
+  return undefined;
+}
+
+export interface SelectResult {
+  head: CompactionMessage[];
+  tail_start_id: string | undefined;
+}
+
+// Choose the boundary between the "head" (to be summarized) and the "tail"
+// (preserved verbatim). Strategy:
+//   1. Reserve a budget for the recent tail. Default ranges [2k, 8k] tokens
+//      with 25% of usable() as the target.
+//   2. Take the last `tail_turns` user-turns; greedily fit from newest back.
+//   3. If the next-older turn doesn't fit whole, split it mid-turn.
+//   4. If we couldn't keep anything OR everything fit (keep.start === 0),
+//      return full-preserve (no compaction this round).
+export function select(
+  messages: CompactionMessage[],
+  contextLimit: number,
+  tailTurns: number = DEFAULT_TAIL_TURNS,
+): SelectResult {
+  if (tailTurns <= 0) return { head: messages, tail_start_id: undefined };
+  const budget = Math.min(
+    MAX_PRESERVE_RECENT_TOKENS,
+    Math.max(MIN_PRESERVE_RECENT_TOKENS, Math.floor(usable(contextLimit) * 0.25)),
+  );
+
+  const all = turns(messages);
+  if (all.length === 0) return { head: messages, tail_start_id: undefined };
+  const recent = all.slice(-tailTurns);
+
+  let total = 0;
+  let keep: { start: number; id: string } | undefined;
+  for (let i = recent.length - 1; i >= 0; i--) {
+    const turn = recent[i]!;
+    const size = estimate(messages.slice(turn.start, turn.end));
+    if (total + size <= budget) {
+      total += size;
+      keep = { start: turn.start, id: turn.id };
+      continue;
+    }
+    const remaining = budget - total;
+    const split = splitTurn(messages, turn, remaining);
+    if (split) keep = split;
+    break;
+  }
+
+  if (!keep || keep.start === 0) {
+    return { head: messages, tail_start_id: undefined };
+  }
+  return {
+    head: messages.slice(0, keep.start),
+    tail_start_id: keep.id,
+  };
+}
+
+// === prompt assembly ===
+
+// Build the final user message that asks the model to (re)produce the
+// anchored summary. `context` is reserved for future plugin injection;
+// callers pass [] today.
+export function buildPrompt(
+  previousSummary: string | undefined,
+  context: string[],
+): string {
+  const anchor = previousSummary
+    ? [
+        'Update the anchored summary below using the conversation history above.',
+        'Preserve still-true details, remove stale details, and merge in the new facts.',
+        '<previous-summary>',
+        previousSummary,
+        '</previous-summary>',
+      ].join('\n')
+    : 'Create a new anchored summary from the conversation history above.';
+  return [anchor, SUMMARY_TEMPLATE, ...context].join('\n\n');
+}
+
+// === OpenAI conversion (compaction-local; intentionally does NOT call
+// inference.ts buildMessagesPayload because that uses the legacy "find latest
+// kind='compact' marker and skip everything before it" shortcircuit, which
+// would silently drop pre-legacy-compact history before the LLM sees it.
+// Compaction wants to send the entire head, full stop.) ===
+
+interface OpenAiMessage {
+  role: 'system' | 'user' | 'assistant' | 'tool';
+  content: string | null;
+  tool_calls?: Array<{
+    id: string;
+    type: 'function';
+    function: { name: string; arguments: string };
+  }>;
+  tool_call_id?: string;
+}
+
+function isCapHitSentinel(m: CompactionMessage): boolean {
+  return m.role === 'system' && m.metadata != null && m.metadata.kind === 'cap_hit';
+}
+
+function buildHeadPayload(head: CompactionMessage[]): OpenAiMessage[] {
+  const out: OpenAiMessage[] = [];
+  for (const m of head) {
+    if (isCapHitSentinel(m)) continue;
+    if (m.role === 'assistant' && (m.status === 'streaming' || m.status === 'cancelled')) continue;
+    if (m.kind === 'compact') {
+      // Legacy compact row — pass through as system context. The new
+      // anchored summary will subsume it, but the LLM should see it during
+      // the bridging round so it can carry forward the still-true bits.
+      out.push({ role: 'system', content: m.content });
+      continue;
+    }
+    if (m.summary) {
+      // Defense in depth: process() filters these out of the select-input
+      // already. If one slips through, render it as assistant content so we
+      // never crash here.
+      out.push({ role: 'assistant', content: m.content });
+      continue;
+    }
+    if (m.role === 'tool') {
+      const tr = m.tool_results;
+      if (!tr) continue;
+      const outputText = tr.error
+        ? `error: ${tr.error}`
+        : typeof tr.output === 'string'
+          ? tr.output
+          : JSON.stringify(tr.output);
+      out.push({ role: 'tool', content: outputText, tool_call_id: tr.tool_call_id });
+      continue;
+    }
+    if (m.role === 'assistant') {
+      const msg: OpenAiMessage = {
+        role: 'assistant',
+        content: m.content && m.content.length > 0 ? m.content : null,
+      };
+      if (m.tool_calls && m.tool_calls.length > 0) {
+        msg.tool_calls = m.tool_calls.map((tc) => ({
+          id: tc.id,
+          type: 'function' as const,
+          function: { name: tc.name, arguments: JSON.stringify(tc.args) },
+        }));
+      }
+      out.push(msg);
+      continue;
+    }
+    out.push({ role: 'user', content: m.content });
+  }
+  return out;
+}
+
+// === llama-swap call ===
+
+// Non-streaming completion. Opencode streams; for a one-shot summary call a
+// single POST is less code and the latency hit is acceptable (the user
+// doesn't see this directly — useSessionStream emits the toast + refetches
+// on the 'compacted' frame).
+interface CompletionResult {
+  content: string;
+  promptTokens: number;
+  completionTokens: number;
+}
+
+async function callLlamaSwap(
+  config: Config,
+  model: string,
+  messages: OpenAiMessage[],
+  log: FastifyBaseLogger,
+): Promise<CompletionResult> {
+  const res = await fetch(`${config.LLAMA_SWAP_URL}/v1/chat/completions`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ model, messages, stream: false }),
+  });
+  if (!res.ok) {
+    const text = await res.text().catch(() => '');
+    throw new Error(`llama-swap returned ${res.status}: ${text.slice(0, 200)}`);
+  }
+  const json = (await res.json()) as {
+    choices?: Array<{ message?: { content?: string } }>;
+    usage?: { prompt_tokens?: number; completion_tokens?: number };
+  };
+  // v1.11.3: removed the dead `json.timings?.n_ctx` read — llama-server's
+  // completions don't emit n_ctx in timings. ctx_max on the summary row
+  // comes from model-context.getModelContext below in process().
+  const content = json.choices?.[0]?.message?.content ?? '';
+  const promptTokens = json.usage?.prompt_tokens ?? 0;
+  const completionTokens = json.usage?.completion_tokens ?? 0;
+  log.debug({ promptTokens, completionTokens, chars: content.length }, 'compaction llm complete');
+  return { content, promptTokens, completionTokens };
+}
+
+// === entry point ===
+
+export interface ProcessInput {
+  sql: Sql;
+  config: Config;
+  log: FastifyBaseLogger;
+  broker: Broker;
+  chatId: string;
+}
+
+// Runs one round of anchored rolling compaction on `chatId`. No-ops cleanly
+// (clearing needs_compaction) when there's nothing reasonable to compact.
+// Throws on LLM failure — callers decide whether to log+swallow or surface.
+export async function process(input: ProcessInput): Promise<void> {
+  const { sql, config, log, broker, chatId } = input;
+
+  // 1. Resolve chat → session for model + WS publish channel.
+  const chatRows = await sql<{ id: string; session_id: string }[]>`
+    SELECT id, session_id FROM chats WHERE id = ${chatId}
+  `;
+  if (chatRows.length === 0) {
+    log.warn({ chatId }, 'compaction: chat not found');
+    return;
+  }
+  const chat = chatRows[0]!;
+  const sessionId = chat.session_id;
+
+  const sessRows = await sql<{ id: string; model: string }[]>`
+    SELECT id, model FROM sessions WHERE id = ${sessionId}
+  `;
+  if (sessRows.length === 0) {
+    log.warn({ chatId, sessionId }, 'compaction: session not found');
+    return;
+  }
+  const session = sessRows[0]!;
+
+  // 2. All currently-active messages in this chat (compacted_at IS NULL).
+  // ORDER BY (created_at, id) matches loadContext in inference.ts so the
+  // turns() boundary logic sees the same sequence the LLM will.
+  const messages = await sql<CompactionMessage[]>`
+    SELECT id, role, content, kind, summary, status, tool_calls, tool_results, metadata, created_at
+    FROM messages
+    WHERE chat_id = ${chatId} AND compacted_at IS NULL
+    ORDER BY created_at ASC, id ASC
+  `;
+  if (messages.length === 0) {
+    await sql`UPDATE chats SET needs_compaction = false WHERE id = ${chatId}`;
+    return;
+  }
+
+  // 3. Find the prior anchored summary (newest summary=true row). Its content
+  // becomes previousSummary — the anchor in the prompt. Filter it out of the
+  // select-input so we don't double-encode (it's already in the anchor text).
+  const previousSummary = messages.filter((m) => m.summary).at(-1)?.content;
+  const forSelect = messages.filter((m) => !m.summary);
+
+  // 4. Resolve a recent context limit. llama-swap reports timings.n_ctx per
+  // completion; we cache it on messages.ctx_max. Use the most recent value
+  // from any message in this chat (oldest assumption is the same model is
+  // still running). When unknown, fall back to model.context_limit-less
+  // defaults via the buffer-only path (see usable()).
+  const ctxRows = await sql<{ ctx_max: number | null }[]>`
+    SELECT ctx_max FROM messages
+    WHERE chat_id = ${chatId} AND ctx_max IS NOT NULL
+    ORDER BY created_at DESC LIMIT 1
+  `;
+  const contextLimit = ctxRows[0]?.ctx_max ?? 0;
+
+  // 5. Decide head / tail.
+  const sel = select(forSelect, contextLimit);
+  if (!sel.tail_start_id || sel.head.length === 0) {
+    // Full preserve — nothing to compact this round. Clear the flag so we
+    // don't loop. (Could happen when the chat is short or the budget swung
+    // wider after a model context bump.)
+    await sql`UPDATE chats SET needs_compaction = false WHERE id = ${chatId}`;
+    log.info({ chatId, contextLimit, msgCount: messages.length }, 'compaction: nothing to compact');
+    return;
+  }
+
+  // 6. Build the OpenAI request: head as user/assistant/tool turns + a final
+  // user message carrying buildPrompt(previousSummary, []). No system prompt
+  // — matches opencode (`system: []`); the template + anchor are sufficient.
+  const headPayload = buildHeadPayload(sel.head);
+  const finalUser: OpenAiMessage = { role: 'user', content: buildPrompt(previousSummary, []) };
+  const payload = [...headPayload, finalUser];
+
+  log.info(
+    {
+      chatId,
+      contextLimit,
+      headLen: sel.head.length,
+      tailStartId: sel.tail_start_id,
+      hadPrevSummary: previousSummary !== undefined,
+    },
+    'compaction: invoking model',
+  );
+
+  // 6a. Flip the chat dot amber for the duration of the LLM call + DB writes.
+  // Same { type: 'chat_status', status: 'working', at } shape inference.ts
+  // emits at runner enqueue. publishUser → broadcasts on the per-user channel
+  // (all devices / tabs see it) since chat_status is a user-channel frame in
+  // BooCode (see useChatStatus.ts, which is the consumer).
+  broker.publishUser('default', {
+    type: 'chat_status',
+    chat_id: chatId,
+    status: 'working',
+    at: new Date().toISOString(),
+  });
+
+  // try/finally so the dot ALWAYS drops back to idle, even if the LLM call
+  // throws or a downstream DB write fails. The succeeded flag gates the
+  // 'compacted' frame + final log: we only signal completion to the UI when
+  // the new summary row actually landed.
+  let succeeded = false;
+  let newId = '';
+  let result: CompletionResult | undefined;
+  try {
+    // 7. Single completion (no tools). Throws on llama-swap failure.
+    result = await callLlamaSwap(config, session.model, payload, log);
+
+    // 7b. v1.11.3: fetch the model's true context window from llama-swap's
+    // /upstream/<model>/props (the streaming completion doesn't carry it).
+    // Same pattern as inference.ts; the cache makes repeated calls free.
+    const mctx = await modelContextLookup.getModelContext(session.model);
+    const nCtx = mctx?.n_ctx ?? null;
+
+    // 8. Insert the new anchored summary row. role='assistant' per spec; the
+    // UI distinguishes via summary=true. tail_start_id points at the first
+    // preserved tail message so debug surfaces / future tools can reason
+    // about the boundary without re-deriving from compacted_at.
+    const insertRows = await sql<{ id: string }[]>`
+      INSERT INTO messages (
+        session_id, chat_id, role, content, kind, status,
+        summary, tail_start_id,
+        tokens_used, ctx_used, ctx_max,
+        created_at, finished_at
+      )
+      VALUES (
+        ${sessionId}, ${chatId}, 'assistant', ${result.content}, 'message', 'complete',
+        true, ${sel.tail_start_id},
+        ${result.completionTokens}, ${result.promptTokens}, ${nCtx},
+        clock_timestamp(), clock_timestamp()
+      )
+      RETURNING id
+    `;
+    newId = insertRows[0]!.id;
+
+    // 9. Mark every prior live message (head + prior summary) as compacted.
+    // Bound by "created_at strictly less than tail_start_id's created_at" so
+    // the preserved tail stays compacted_at=NULL. Exclude the new summary
+    // row we just inserted (it's "now", which is >= tail_start_id's
+    // created_at anyway, but defensive).
+    await sql`
+      UPDATE messages
+      SET compacted_at = clock_timestamp()
+      WHERE chat_id = ${chatId}
+        AND compacted_at IS NULL
+        AND id != ${newId}
+        AND created_at < (SELECT created_at FROM messages WHERE id = ${sel.tail_start_id})
+    `;
+
+    // 10. Clear the flag and bump the chat's updated_at so the sidebar
+    // reflects recent activity.
+    await sql`
+      UPDATE chats
+      SET needs_compaction = false, updated_at = clock_timestamp()
+      WHERE id = ${chatId}
+    `;
+
+    succeeded = true;
+  } finally {
+    // Always restore the dot. Status='idle' (not 'error') even on failure —
+    // the caller logs/re-surfaces the error separately; the dot doesn't
+    // need to stay red across reloads for a transient compaction blip.
+    broker.publishUser('default', {
+      type: 'chat_status',
+      chat_id: chatId,
+      status: 'idle',
+      at: new Date().toISOString(),
+    });
+  }
+
+  // 11. Tell the client. useSessionStream subscribes to the per-session WS
+  // channel; the handler refetches messages (so the new summary row + the
+  // compacted_at-stamped older rows render correctly) and fires a sonner
+  // toast. Order matters: idle must precede 'compacted' so the dot is
+  // already green by the time the refetch toast appears.
+  if (succeeded) {
+    broker.publish(sessionId, {
+      type: 'compacted',
+      session_id: sessionId,
+      chat_id: chatId,
+      summary_message_id: newId,
+    });
+    log.info(
+      {
+        chatId,
+        newId,
+        completionTokens: result?.completionTokens,
+        promptTokens: result?.promptTokens,
+      },
+      'compaction: complete',
+    );
+  }
+}

apps/server/src/services/inference.ts

@@ -21,6 +21,9 @@ import {
 import { PathScopeError, resolveProjectRoot } from './path_guard.js';
 import { maybeAutoNameChat } from './auto_name.js';
 import { getAgentById } from './agents.js';
+import * as compaction from './compaction.js';
+import * as modelContext from './model-context.js';
+import type { Broker } from './broker.js';
 
 const BASE_SYSTEM_PROMPT = (projectPath: string) =>
   `You are BooCode Chat, a code investigation assistant. The user is working on a project located at ${projectPath}. Use the file-read tools (view_file, list_dir, grep, find_files) to investigate code when needed. Be concise. Cite file paths and line numbers when discussing code. Do not hallucinate file contents — read the file first. Tool results may be truncated; if so, narrow your query rather than guessing.`;
@@ -136,9 +139,6 @@ interface ChatCompletionChunk {
     completion_tokens?: number;
     total_tokens?: number;
   };
-  timings?: {
-    n_ctx?: number;
-  };
 }
 
 export interface InferenceContext {
@@ -147,11 +147,19 @@ export interface InferenceContext {
   log: FastifyBaseLogger;
   publish: FramePublisher;
   publishUser: (frame: UserStreamFrame) => void;
+  // v1.11: passed through so compaction.process can publish 'compacted'
+  // frames on the same session WS channel useSessionStream subscribes to.
+  // Compaction is the only path that needs the raw broker handle (regular
+  // inference goes through `publish`); keeping a separate field avoids
+  // tempting other code paths into bypassing the session-id binding.
+  broker: Broker;
 }
 
-// Resolution order: base prompt < agent.system_prompt < session.system_prompt.
-// Agent prompts layer on top of the base; session prompt is the most specific
-// override and stacks last so callers can append per-session instructions.
+// Resolution order: base prompt < agent.system_prompt < user prompt, where
+// user prompt = session.system_prompt if non-empty, else project's
+// default_system_prompt if non-empty, else nothing. Empty/whitespace-only
+// counts as "no override" for both layers (v1.9 inherit semantics — keeps
+// the column non-nullable so the existing key/value store stays put).
 export function buildSystemPrompt(
   project: Project,
   session: Session,
@@ -161,8 +169,11 @@ export function buildSystemPrompt(
   if (agent && agent.system_prompt.trim().length > 0) {
     out += '\n\n' + agent.system_prompt.trim();
   }
-  if (session.system_prompt && session.system_prompt.trim().length > 0) {
-    out += '\n\n' + session.system_prompt.trim();
+  const sessionPrompt = session.system_prompt?.trim() ?? '';
+  const projectPrompt = project.default_system_prompt?.trim() ?? '';
+  const userPrompt = sessionPrompt || projectPrompt;
+  if (userPrompt.length > 0) {
+    out += '\n\n' + userPrompt;
   }
   return out;
 }
@@ -240,30 +251,63 @@ async function loadContext(
   chatId: string
 ): Promise<{ session: Session; project: Project; history: Message[] } | null> {
   const sessionRows = await sql<Session[]>`
-    SELECT id, project_id, name, model, system_prompt, status, created_at, updated_at, agent_id
+    SELECT id, project_id, name, model, system_prompt, status, created_at, updated_at,
+           agent_id, web_search_enabled
     FROM sessions WHERE id = ${sessionId}
   `;
   if (sessionRows.length === 0) return null;
   const session = sessionRows[0]!;
 
   const projectRows = await sql<Project[]>`
-    SELECT id, name, path, added_at, last_session_id
+    SELECT id, name, path, added_at, last_session_id, status, gitea_remote,
+           default_system_prompt, default_web_search_enabled
     FROM projects WHERE id = ${session.project_id}
   `;
   if (projectRows.length === 0) return null;
   const project = projectRows[0]!;
 
+  // v1.11: filter compacted messages out of the inference assembly. The GET
+  // /api/sessions/:id/messages endpoint still returns everything (so the UI
+  // can show history with the summary card inline); only LLM payloads skip
+  // compacted rows. compacted_at IS NULL keeps the active summary + tail.
   const history = await sql<Message[]>`
     SELECT id, session_id, chat_id, role, content, kind, tool_calls, tool_results, status, last_seq,
            tokens_used, ctx_used, ctx_max, started_at, finished_at, created_at, metadata
     FROM messages
-    WHERE chat_id = ${chatId}
+    WHERE chat_id = ${chatId} AND compacted_at IS NULL
     ORDER BY created_at ASC, id ASC
   `;
 
   return { session, project, history };
 }
 
+// v1.11: shared helper used after both finalizeCompletion and executeToolPhase
+// persist their token counts. Reads tokens off the just-UPDATEd row (which
+// the caller returns from RETURNING), runs compaction.isOverflow, and flips
+// chats.needs_compaction. The next runAssistantTurn invocation acts on it.
+// Silent on missing tokens — llama-swap occasionally omits usage on truncated
+// streams, and we'd rather miss one overflow than crash the inference path.
+async function maybeFlagForCompaction(
+  ctx: InferenceContext,
+  chatId: string,
+  updated: { tokens_used: number | null; ctx_used: number | null; ctx_max: number | null } | undefined,
+): Promise<void> {
+  if (!updated) return;
+  const promptTokens = updated.ctx_used;
+  const completionTokens = updated.tokens_used;
+  const contextLimit = updated.ctx_max;
+  if (typeof promptTokens !== 'number') return;
+  if (typeof completionTokens !== 'number') return;
+  if (typeof contextLimit !== 'number') return;
+  const overflow = compaction.isOverflow(
+    { prompt_tokens: promptTokens, completion_tokens: completionTokens },
+    contextLimit,
+  );
+  if (!overflow) return;
+  await ctx.sql`UPDATE chats SET needs_compaction = true WHERE id = ${chatId}`;
+  ctx.log.info({ chatId, promptTokens, completionTokens, contextLimit }, 'inference: flagged for compaction');
+}
+
 async function* sseLines(stream: ReadableStream<Uint8Array>): AsyncGenerator<string> {
   const reader = stream.getReader();
   const decoder = new TextDecoder('utf-8');
@@ -293,7 +337,6 @@ interface StreamResult {
   toolCalls: ToolCall[];
   promptTokens: number | null;
   completionTokens: number | null;
-  nCtx: number | null;
 }
 
 interface StreamOptions {
@@ -303,6 +346,70 @@ interface StreamOptions {
   temperature?: number;
 }
 
+// v1.10.5 Qwen-coder XML fallback. Some local models (notably qwen3-coder via
+// llama-swap) emit tool calls as inline XML inside delta.content rather than
+// the structured delta.tool_calls field. The XML shape is:
+//   <tool_call>
+//   <function=NAME>
+//   <parameter=KEY>
+//   VALUE
+//   </parameter>
+//   ...more parameters...
+//   </function>
+//   </tool_call>
+// Multiple <tool_call> blocks may appear back-to-back; they never nest.
+// streamCompletion buffers delta.content, extracts complete blocks, parses
+// them via parseXmlToolCall, and pushes synthetic entries into the existing
+// toolCallsBuffer alongside any native JSON-format tool calls.
+const XML_TOOL_OPEN = '<tool_call>';
+const XML_TOOL_CLOSE = '</tool_call>';
+
+function parseXmlToolCall(
+  block: string,
+): { name: string; args: Record<string, unknown> } | null {
+  const nameMatch = block.match(/<function=([^>]+)>/);
+  if (!nameMatch || !nameMatch[1]) return null;
+  const name = nameMatch[1].trim();
+  if (!name) return null;
+  const args: Record<string, unknown> = {};
+  // Non-greedy body so each <parameter=…>…</parameter> pair is matched
+  // independently even when multiple appear in the same block.
+  const paramRe = /<parameter=([^>]+)>([\s\S]*?)<\/parameter>/g;
+  for (const m of block.matchAll(paramRe)) {
+    const key = (m[1] ?? '').trim();
+    if (!key) continue;
+    const raw = (m[2] ?? '').trim();
+    try {
+      args[key] = JSON.parse(raw);
+    } catch {
+      args[key] = raw;
+    }
+  }
+  return { name, args };
+}
+
+// Locate the first character that begins (or completely contains) an
+// unfinished <tool_call> opener in `s`. Returns -1 when `s` can be flushed
+// to the client in full without risking a partial tag leak.
+//   Case 1: a full `<tool_call>` opener with no matching closer — caller
+//           must keep everything from that index forward until the next
+//           chunk arrives with the closer.
+//   Case 2: `s` ends with a strict prefix of `<tool_call>` (e.g. `<tool_c`).
+//           Caller must keep just that suffix in the buffer.
+// Note: case 1 assumes the calling loop already extracted every complete
+// <tool_call>…</tool_call> pair before reaching this check.
+function partialXmlOpenerStart(s: string): number {
+  const fullOpener = s.indexOf(XML_TOOL_OPEN);
+  if (fullOpener !== -1) return fullOpener;
+  const lastLt = s.lastIndexOf('<');
+  if (lastLt === -1) return -1;
+  const suffix = s.slice(lastLt);
+  if (XML_TOOL_OPEN.startsWith(suffix) && suffix.length < XML_TOOL_OPEN.length) {
+    return lastLt;
+  }
+  return -1;
+}
+
 async function streamCompletion(
   ctx: InferenceContext,
   model: string,
@@ -337,10 +444,13 @@ async function streamCompletion(
   }
 
   let content = '';
+  // v1.10.5: holds delta.content bytes that may contain a partial XML tool
+  // call. Anything not part of a (possibly forming) <tool_call>…</tool_call>
+  // pair is flushed to content + onDelta as soon as we know it's safe.
+  let pendingBuffer = '';
   let finishReason: string | null = null;
   let promptTokens: number | null = null;
   let completionTokens: number | null = null;
-  let nCtx: number | null = null;
   const toolCallsBuffer = new Map<number, { id: string; name: string; argsText: string }>();
 
   for await (const line of sseLines(res.body)) {
@@ -362,16 +472,60 @@ async function streamCompletion(
         completionTokens = parsed.usage.completion_tokens;
       }
     }
-    if (parsed.timings && typeof parsed.timings.n_ctx === 'number') {
-      nCtx = parsed.timings.n_ctx;
-    }
+    // v1.11.3: removed dead `parsed.timings.n_ctx` read. llama-server's
+    // streaming completion does NOT emit n_ctx in timings (verified
+    // empirically); the authoritative source is llama-swap's
+    // /upstream/<model>/props endpoint, fetched per-turn via
+    // model-context.getModelContext() at the finalization sites below.
 
     const choice = parsed.choices?.[0];
     if (!choice) continue;
     const delta = choice.delta ?? {};
     if (typeof delta.content === 'string' && delta.content.length > 0) {
-      content += delta.content;
-      onDelta(delta.content);
+      // v1.10.5 XML fallback. Append, then extract any complete tool_call
+      // blocks before deciding what's safe to flush as visible content.
+      pendingBuffer += delta.content;
+      while (true) {
+        const startIdx = pendingBuffer.indexOf(XML_TOOL_OPEN);
+        if (startIdx === -1) break;
+        const closeIdx = pendingBuffer.indexOf(XML_TOOL_CLOSE, startIdx);
+        if (closeIdx === -1) break;
+        const blockEnd = closeIdx + XML_TOOL_CLOSE.length;
+        const block = pendingBuffer.slice(startIdx, blockEnd);
+        // Any text before the opener is plain content — flush it now.
+        if (startIdx > 0) {
+          const before = pendingBuffer.slice(0, startIdx);
+          content += before;
+          onDelta(before);
+        }
+        const parsedCall = parseXmlToolCall(block);
+        if (parsedCall) {
+          const synthIdx = toolCallsBuffer.size;
+          toolCallsBuffer.set(synthIdx, {
+            id: `xml_call_${synthIdx}`,
+            name: parsedCall.name,
+            argsText: JSON.stringify(parsedCall.args),
+          });
+        }
+        // If parsing failed we still drop the block — emitting unparseable
+        // XML to the chat would look worse than silently swallowing it.
+        pendingBuffer = pendingBuffer.slice(blockEnd);
+      }
+      // After all complete blocks are out, hold back any (partial or full)
+      // unclosed opener; flush the rest.
+      const partialIdx = partialXmlOpenerStart(pendingBuffer);
+      if (partialIdx >= 0) {
+        if (partialIdx > 0) {
+          const flush = pendingBuffer.slice(0, partialIdx);
+          content += flush;
+          onDelta(flush);
+        }
+        pendingBuffer = pendingBuffer.slice(partialIdx);
+      } else if (pendingBuffer.length > 0) {
+        content += pendingBuffer;
+        onDelta(pendingBuffer);
+        pendingBuffer = '';
+      }
     }
     if (Array.isArray(delta.tool_calls)) {
       for (const tc of delta.tool_calls) {
@@ -386,6 +540,15 @@ async function streamCompletion(
     if (choice.finish_reason) finishReason = choice.finish_reason;
   }
 
+  // v1.10.5: if the stream ended mid-XML (e.g. model truncated, no closer
+  // ever arrived), flush whatever was buffered as plain content so it isn't
+  // silently dropped. Better to show a stray `<tool_call>` than vanish text.
+  if (pendingBuffer.length > 0) {
+    content += pendingBuffer;
+    onDelta(pendingBuffer);
+    pendingBuffer = '';
+  }
+
   const toolCalls: ToolCall[] = [];
   for (const [, t] of [...toolCallsBuffer.entries()].sort(([a], [b]) => a - b)) {
     let args: Record<string, unknown> = {};
@@ -399,7 +562,7 @@ async function streamCompletion(
     toolCalls.push({ id: t.id || `call_${toolCalls.length}`, name: t.name, args });
   }
 
-  return { finishReason, content, toolCalls, promptTokens, completionTokens, nCtx };
+  return { finishReason, content, toolCalls, promptTokens, completionTokens };
 }
 
 async function executeToolCall(
@@ -616,7 +779,14 @@ async function executeToolPhase(
   projectRoot: string
 ): Promise<void> {
   const { sessionId, chatId, assistantMessageId, toolsUsed, signal } = args;
-  const { content, toolCalls, promptTokens, completionTokens, nCtx } = result;
+  const { content, toolCalls, promptTokens, completionTokens } = result;
+
+  // v1.11.3: ctx_max comes from llama-swap /upstream/<model>/props, not the
+  // streaming completion (which doesn't emit n_ctx). getModelContext caches
+  // the positive lookup for the process lifetime, so this is a single Map
+  // hit after the first invocation per model.
+  const mctx = await modelContext.getModelContext(session.model);
+  const nCtx = mctx?.n_ctx ?? null;
 
   const [updated] = await ctx.sql<
     { tokens_used: number | null; ctx_used: number | null; ctx_max: number | null; finished_at: string | null }[]
@@ -632,6 +802,10 @@ async function executeToolPhase(
     WHERE id = ${assistantMessageId}
     RETURNING tokens_used, ctx_used, ctx_max, finished_at
   `;
+  // v1.11: flag for compaction if this turn pushed us over the usable budget.
+  // We never compact mid-loop (the recursive runAssistantTurn keeps tools
+  // flowing); the flag fires on the NEXT turn's pre-fetch hook above.
+  await maybeFlagForCompaction(ctx, chatId, updated);
   const [toolSessRow] = await ctx.sql<{ project_id: string; name: string; updated_at: string }[]>`
     UPDATE sessions SET updated_at = clock_timestamp()
     WHERE id = ${sessionId}
@@ -658,6 +832,12 @@ async function executeToolPhase(
     model: session.model,
   });
 
+  // Batch 9.7: ask_user_input pauses the loop. The tool row is still inserted
+  // (the answer endpoint needs a target row to UPDATE), but tool_results is
+  // pre-stamped with output=null as a "pending" sentinel and no tool_result
+  // frame goes out — the card renders from the tool_call frame alone. Mixed
+  // batches still execute the other tools normally.
+  let pausingForUserInput = false;
   await Promise.all(
     toolCalls.map(async (tc) => {
       const [toolRow] = await ctx.sql<{ id: string }[]>`
@@ -666,6 +846,16 @@ async function executeToolPhase(
         RETURNING id
       `;
       const toolMessageId = toolRow!.id;
+      if (tc.name === 'ask_user_input') {
+        pausingForUserInput = true;
+        const sentinel = { tool_call_id: tc.id, output: null, truncated: false };
+        await ctx.sql`
+          UPDATE messages
+          SET tool_results = ${ctx.sql.json(sentinel as never)}
+          WHERE id = ${toolMessageId}
+        `;
+        return;
+      }
       const tres = await executeToolCall(projectRoot, tc);
       const stored = {
         tool_call_id: tc.id,
@@ -690,6 +880,23 @@ async function executeToolPhase(
     })
   );
 
+  if (pausingForUserInput) {
+    // Drop the dot back to idle — the card is the actionable surface now.
+    // The next inference turn fires from POST /api/chats/:id/answer_user_input
+    // once the user submits their answers.
+    ctx.publishUser({
+      type: 'chat_status',
+      chat_id: chatId,
+      status: 'idle',
+      at: new Date().toISOString(),
+    });
+    ctx.log.info(
+      { sessionId, chatId, assistantMessageId },
+      'inference paused awaiting user input',
+    );
+    return;
+  }
+
   const [nextAssistant] = await ctx.sql<{ id: string }[]>`
     INSERT INTO messages (session_id, chat_id, role, content, status, created_at)
     VALUES (${sessionId}, ${chatId}, 'assistant', '', 'streaming', clock_timestamp())
@@ -715,7 +922,11 @@ async function finalizeCompletion(
   session: Session
 ): Promise<void> {
   const { sessionId, chatId, assistantMessageId } = args;
-  const { content, finishReason, promptTokens, completionTokens, nCtx } = result;
+  const { content, finishReason, promptTokens, completionTokens } = result;
+
+  // v1.11.3: see executeToolPhase for the rationale.
+  const mctx = await modelContext.getModelContext(session.model);
+  const nCtx = mctx?.n_ctx ?? null;
 
   const [updated] = await ctx.sql<
     { tokens_used: number | null; ctx_used: number | null; ctx_max: number | null; finished_at: string | null }[]
@@ -730,6 +941,9 @@ async function finalizeCompletion(
     WHERE id = ${assistantMessageId}
     RETURNING tokens_used, ctx_used, ctx_max, finished_at
   `;
+  // v1.11: flag for compaction on the terminal turn too. Catches the common
+  // case of a turn that hit the limit without invoking tools.
+  await maybeFlagForCompaction(ctx, chatId, updated);
   const [completeSessRow] = await ctx.sql<{ project_id: string; name: string; updated_at: string }[]>`
     UPDATE sessions SET updated_at = clock_timestamp()
     WHERE id = ${sessionId}
@@ -768,6 +982,29 @@ async function runAssistantTurn(
 ): Promise<void> {
   const { sessionId, chatId } = args;
 
+  // v1.11: if the prior turn flagged this chat for compaction, run it first
+  // so loadContext below reads the post-compaction history. We swallow
+  // compaction failures (clearing the flag so we don't loop) and proceed
+  // with the un-compacted history — a slow turn that hits the model's
+  // hard limit is recoverable; a dead session is not.
+  const chatFlag = await ctx.sql<{ needs_compaction: boolean }[]>`
+    SELECT needs_compaction FROM chats WHERE id = ${chatId}
+  `;
+  if (chatFlag[0]?.needs_compaction) {
+    try {
+      await compaction.process({
+        sql: ctx.sql,
+        config: ctx.config,
+        log: ctx.log,
+        broker: ctx.broker,
+        chatId,
+      });
+    } catch (err) {
+      ctx.log.warn({ err, chatId }, 'auto-compaction failed; clearing flag and proceeding');
+      await ctx.sql`UPDATE chats SET needs_compaction = false WHERE id = ${chatId}`;
+    }
+  }
+
   const loaded = await loadContext(ctx.sql, sessionId, chatId);
   if (!loaded) {
     ctx.log.warn({ sessionId }, 'inference: session or project missing');
@@ -922,6 +1159,9 @@ async function runCapHitSummary(
   // even on a partial / failed summary the chat history shows where the
   // budget was hit.
   if (summaryOk && result) {
+    // v1.11.3: see executeToolPhase for the rationale.
+    const mctx = await modelContext.getModelContext(session.model);
+    const nCtx = mctx?.n_ctx ?? null;
     const [updated] = await ctx.sql<
       { tokens_used: number | null; ctx_used: number | null; ctx_max: number | null; finished_at: string | null }[]
     >`
@@ -930,7 +1170,7 @@ async function runCapHitSummary(
           status = 'complete',
           tokens_used = ${result.completionTokens},
           ctx_used = ${result.promptTokens},
-          ctx_max = ${result.nCtx},
+          ctx_max = ${nCtx},
           finished_at = clock_timestamp()
       WHERE id = ${assistantMessageId}
       RETURNING tokens_used, ctx_used, ctx_max, finished_at
@@ -1078,81 +1318,6 @@ async function insertCapHitSentinel(
   });
 }
 
-const COMPACT_SYSTEM_PROMPT =
-  'Summarize the preceding conversation into a dense but complete context paragraph. Preserve all key facts, decisions, file paths, code patterns, and action items. Do not add any new information. Output only the summary paragraph.';
-
-async function runCompact(
-  ctx: InferenceContext,
-  sessionId: string,
-  chatId: string,
-  compactMessageId: string
-): Promise<void> {
-  const loaded = await loadContext(ctx.sql, sessionId, chatId);
-  if (!loaded) return;
-  const { session, project, history } = loaded;
-
-  const messagesForSummary = buildMessagesPayload(session, project,
-    history.filter((m) => m.id !== compactMessageId)
-  );
-  messagesForSummary.push({
-    role: 'system',
-    content: COMPACT_SYSTEM_PROMPT,
-  });
-
-  ctx.publish(sessionId, {
-    type: 'message_started',
-    message_id: compactMessageId,
-    chat_id: chatId,
-    role: 'assistant',
-  });
-
-  let content = '';
-  try {
-    const result = await streamCompletion(
-      ctx,
-      session.model,
-      messagesForSummary,
-      { tools: null },
-      (delta) => {
-        content += delta;
-        ctx.publish(sessionId, {
-          type: 'delta',
-          message_id: compactMessageId,
-          chat_id: chatId,
-          content: delta,
-        });
-      }
-    );
-    content = result.content;
-  } catch (err) {
-    const errMsg = err instanceof Error ? err.message : String(err);
-    await ctx.sql`
-      UPDATE messages SET status = 'failed', content = ${content}, finished_at = clock_timestamp()
-      WHERE id = ${compactMessageId}
-    `;
-    ctx.publish(sessionId, {
-      type: 'error',
-      message_id: compactMessageId,
-      chat_id: chatId,
-      error: errMsg,
-    });
-    return;
-  }
-
-  const preCompactCount = history.filter((m) => m.id !== compactMessageId && m.kind !== 'compact').length;
-  const summary = `[Context compacted — ${preCompactCount} messages summarized]\n\n${content}`;
-
-  await ctx.sql`
-    UPDATE messages SET content = ${summary}, status = 'complete', finished_at = clock_timestamp()
-    WHERE id = ${compactMessageId}
-  `;
-  ctx.publish(sessionId, {
-    type: 'message_complete',
-    message_id: compactMessageId,
-    chat_id: chatId,
-  });
-}
-
 interface InferenceRegistration {
   controller: AbortController;
   completed: Promise<void>;
@@ -1169,6 +1334,10 @@ export function createInferenceRunner(
       const callCtx: InferenceContext = {
         ...ctx,
         publishUser: (frame) => publishUserFn(user, frame),
+        // v1.11: broker comes in via ctx (set at registration time). Repeated
+        // here so the destructure carries it onto the per-call ctx without
+        // having to add it to every enqueue/cancel signature individually.
+        broker: ctx.broker,
       };
       // v1.8 mobile-tabs: announce working before the async loop starts so
       // every device subscribed to the user channel sees the amber dot.
@@ -1198,20 +1367,6 @@ export function createInferenceRunner(
       })();
     },
 
-    enqueueCompact(sessionId: string, chatId: string, compactMessageId: string, user: string) {
-      const callCtx: InferenceContext = {
-        ...ctx,
-        publishUser: (frame) => publishUserFn(user, frame),
-      };
-      void (async () => {
-        try {
-          await runCompact(callCtx, sessionId, chatId, compactMessageId);
-        } catch (err) {
-          callCtx.log.error({ err }, 'unhandled compact error');
-        }
-      })();
-    },
-
     async cancel(_sessionId: string, chatId: string): Promise<boolean> {
       const reg = registry.get(chatId);
       if (!reg) return false;

apps/server/src/services/model-context.ts

@@ -0,0 +1,113 @@
+// v1.11.3: llama-swap model-context cache. Replaces the dead
+// `parsed.timings.n_ctx` capture in inference.ts / compaction.ts —
+// llama-server's streaming completion never emits n_ctx in timings (verified
+// empirically: timings carries prompt_n / predicted_n / *_ms / *_per_second
+// only). The authoritative source is llama-swap's
+// /upstream/<model>/props endpoint at .default_generation_settings.n_ctx.
+//
+// Cache design:
+//   - Positive entries (n_ctx + total_slots) have no TTL. A model's context
+//     size doesn't change while llama-swap is running; an admin endpoint
+//     can invalidateModelContext() if it ever does.
+//   - Negative entries (failed fetch) have a 60s TTL so a misconfigured or
+//     down model doesn't get hammered every inference turn, but recovers
+//     within a minute once the upstream comes back.
+//   - 3s AbortController timeout on the fetch — long enough for a healthy
+//     upstream, short enough that a stuck upstream doesn't block the
+//     ctx_max UPDATE that follows.
+
+export interface ModelContext {
+  n_ctx: number;
+  total_slots: number;
+  fetched_at: number;
+}
+
+const NEGATIVE_TTL_MS = 60_000;
+const FETCH_TIMEOUT_MS = 3_000;
+
+const positiveCache = new Map<string, ModelContext>();
+// Value is the unix-ms timestamp of the last failed fetch. Used to gate
+// re-fetches within the 60s window.
+const negativeCache = new Map<string, number>();
+
+// Set once at startup by index.ts. We don't import loadConfig() directly
+// here to keep this module trivially mockable in tests (set the URL in
+// beforeEach instead of stubbing process.env + loadConfig's cache).
+let llamaSwapUrl: string | null = null;
+
+export function configureModelContext(opts: { llamaSwapUrl: string }): void {
+  llamaSwapUrl = opts.llamaSwapUrl;
+}
+
+export async function getModelContext(model: string): Promise<ModelContext | null> {
+  // 1. Positive cache hit — no TTL check, model n_ctx is invariant.
+  const pos = positiveCache.get(model);
+  if (pos) return pos;
+
+  // 2. Negative cache hit within TTL — return null without refetching.
+  // Stale negative entries (older than the TTL) fall through to a fresh
+  // attempt below; we don't delete them eagerly because the next successful
+  // fetch will overwrite via the positive map and the negative entry
+  // becomes irrelevant.
+  const negTs = negativeCache.get(model);
+  if (negTs !== undefined && Date.now() - negTs < NEGATIVE_TTL_MS) {
+    return null;
+  }
+
+  // 3. Module not initialized. Defensive — index.ts calls
+  // configureModelContext at startup; if a test forgets, fail closed so
+  // the chat still works (ctx_max stays null, UI degrades gracefully).
+  if (!llamaSwapUrl) {
+    negativeCache.set(model, Date.now());
+    return null;
+  }
+
+  // 4. Fetch with timeout. AbortController fires after FETCH_TIMEOUT_MS;
+  // both the timeout path and a fetch reject end up in the catch below
+  // and produce a negative cache entry.
+  const url = `${llamaSwapUrl}/upstream/${encodeURIComponent(model)}/props`;
+  const controller = new AbortController();
+  const timer = setTimeout(() => controller.abort(), FETCH_TIMEOUT_MS);
+  try {
+    const res = await fetch(url, { signal: controller.signal });
+    clearTimeout(timer);
+    if (!res.ok) {
+      negativeCache.set(model, Date.now());
+      return null;
+    }
+    const body = (await res.json()) as {
+      default_generation_settings?: { n_ctx?: number };
+      total_slots?: number;
+    };
+    const n_ctx = body?.default_generation_settings?.n_ctx;
+    if (typeof n_ctx !== 'number' || n_ctx <= 0) {
+      negativeCache.set(model, Date.now());
+      return null;
+    }
+    // total_slots is informational; default to 1 if missing rather than
+    // reject the whole response. Most local llama-swap setups run a
+    // single slot anyway.
+    const total_slots =
+      typeof body?.total_slots === 'number' && body.total_slots > 0 ? body.total_slots : 1;
+    const entry: ModelContext = { n_ctx, total_slots, fetched_at: Date.now() };
+    positiveCache.set(model, entry);
+    // Clear any stale negative entry so a future query sees the positive
+    // hit cleanly (otherwise the negative TTL never expires from the map).
+    negativeCache.delete(model);
+    return entry;
+  } catch {
+    clearTimeout(timer);
+    negativeCache.set(model, Date.now());
+    return null;
+  }
+}
+
+export function invalidateModelContext(model?: string): void {
+  if (model === undefined) {
+    positiveCache.clear();
+    negativeCache.clear();
+  } else {
+    positiveCache.delete(model);
+    negativeCache.delete(model);
+  }
+}

apps/server/src/services/skills.ts

@@ -0,0 +1,321 @@
+import { promises as fs } from 'node:fs';
+import { join, isAbsolute, basename } from 'node:path';
+import { pathGuard, PathScopeError } from './path_guard.js';
+
+// Batch 9.6: read-only skill library. Folders under /data/skills/<group>/<skill>/
+// contain a SKILL.md with YAML frontmatter (name + description) and a markdown
+// body. Three tools expose the library: skill_find (search), skill_use (load
+// body), skill_resource (read a support file inside the folder).
+//
+// Layout is intentionally uniform — scan /data/skills/*/*/SKILL.md at fixed
+// depth 3. Group folders (depth 1) hold LICENSE + ATTRIBUTION.md + skill
+// subfolders and are NOT themselves skills. Support files inside skill
+// folders are reachable via skill_resource, never auto-parsed.
+//
+// Cache model mirrors agents.ts: walk on first access, TTL re-walk to pick up
+// new skills, per-entry mtime check on body access so a hot-edited SKILL.md
+// is re-read without a restart. No watcher.
+
+const SKILLS_ROOT = '/data/skills';
+const MAX_RESOURCE_BYTES = 5 * 1024 * 1024;
+const LIST_CACHE_TTL_MS = 60_000;
+
+export interface Skill {
+  name: string;
+  description: string;
+  path: string;
+  mtime: number;
+}
+
+interface CachedSkill extends Skill {
+  body: string;
+}
+
+const cache = new Map<string, CachedSkill>();
+let lastWalkedAt = 0;
+
+// ---- Frontmatter parser ----------------------------------------------------
+// Minimal `---\n...\n---` extractor. Only `name` and `description` keys are
+// honored; other frontmatter keys are silently ignored for forward-compat
+// with the anthropics/skills upstream spec.
+
+interface Frontmatter {
+  name?: string;
+  description?: string;
+}
+
+function stripQuotes(s: string): string {
+  if (s.length >= 2 && (s[0] === '"' || s[0] === "'") && s[0] === s[s.length - 1]) {
+    return s.slice(1, -1);
+  }
+  return s;
+}
+
+function parseFrontmatter(yaml: string): Frontmatter {
+  const fm: Frontmatter = {};
+  for (const raw of yaml.split('\n')) {
+    const line = raw.trim();
+    if (line.length === 0) continue;
+    const colon = line.indexOf(':');
+    if (colon < 0) continue;
+    const key = line.slice(0, colon).trim();
+    const val = stripQuotes(line.slice(colon + 1).trim());
+    if (key === 'name') fm.name = val;
+    else if (key === 'description') fm.description = val;
+  }
+  return fm;
+}
+
+interface ParsedSkillFile {
+  name: string;
+  description: string;
+  body: string;
+}
+
+function parseSkillFile(content: string): ParsedSkillFile {
+  const lines = content.split('\n');
+  let openIdx = -1;
+  for (let i = 0; i < lines.length; i++) {
+    const t = lines[i]!.trim();
+    if (t === '') continue;
+    if (t === '---') openIdx = i;
+    break;
+  }
+  if (openIdx < 0) throw new Error('missing opening --- fence');
+  let closeIdx = -1;
+  for (let i = openIdx + 1; i < lines.length; i++) {
+    if (lines[i]!.trim() === '---') { closeIdx = i; break; }
+  }
+  if (closeIdx < 0) throw new Error('missing closing --- fence');
+
+  const yamlText = lines.slice(openIdx + 1, closeIdx).join('\n');
+  const body = lines.slice(closeIdx + 1).join('\n');
+
+  const fm = parseFrontmatter(yamlText);
+  if (!fm.name) throw new Error('frontmatter missing name');
+  if (!fm.description) throw new Error('frontmatter missing description');
+  return { name: fm.name, description: fm.description, body };
+}
+
+// ---- Tree walk -------------------------------------------------------------
+
+// Fixed depth-3 scan: /data/skills/<group>/<skill>/SKILL.md. Two layers of
+// readdir, no recursion. Group folders without SKILL.md are skipped silently;
+// LICENSE / ATTRIBUTION.md / other non-SKILL.md files are ignored entirely.
+// Returns all parseable skills as-found — dedup + collision logging happens
+// in ensureCache where the sort order is established.
+async function walkSkills(root: string): Promise<CachedSkill[]> {
+  const found: CachedSkill[] = [];
+  let groups;
+  try {
+    groups = await fs.readdir(root, { withFileTypes: true });
+  } catch {
+    return found;
+  }
+  for (const group of groups) {
+    if (!group.isDirectory() || group.name.startsWith('.')) continue;
+    const groupPath = join(root, group.name);
+    let entries;
+    try {
+      entries = await fs.readdir(groupPath, { withFileTypes: true });
+    } catch {
+      continue;
+    }
+    for (const entry of entries) {
+      if (!entry.isDirectory() || entry.name.startsWith('.')) continue;
+      const skillFolder = join(groupPath, entry.name);
+      const skillFile = join(skillFolder, 'SKILL.md');
+      let stat;
+      try {
+        stat = await fs.stat(skillFile);
+      } catch {
+        continue; // folder without SKILL.md — silent skip
+      }
+      if (!stat.isFile()) continue;
+      try {
+        const content = await fs.readFile(skillFile, 'utf8');
+        const parsed = parseSkillFile(content);
+        found.push({
+          name: parsed.name,
+          description: parsed.description,
+          path: skillFolder,
+          mtime: stat.mtimeMs,
+          body: parsed.body,
+        });
+      } catch (err) {
+        const reason = err instanceof Error ? err.message : String(err);
+        console.warn(`skills: failed to parse ${skillFile} — ${reason}`);
+      }
+    }
+  }
+  return found;
+}
+
+// ---- Cache ----------------------------------------------------------------
+
+async function ensureCache(): Promise<void> {
+  const now = Date.now();
+  if (cache.size > 0 && now - lastWalkedAt < LIST_CACHE_TTL_MS) return;
+  let stat;
+  try {
+    stat = await fs.stat(SKILLS_ROOT);
+  } catch {
+    cache.clear();
+    lastWalkedAt = now;
+    return;
+  }
+  if (!stat.isDirectory()) {
+    cache.clear();
+    lastWalkedAt = now;
+    return;
+  }
+  const found = await walkSkills(SKILLS_ROOT);
+  // Sort by name asc, then path asc — gives alphabetically-first-wins on
+  // collision and stable, deterministic ordering for /api/skills + skill_find.
+  found.sort((a, b) => {
+    const n = a.name.localeCompare(b.name);
+    return n !== 0 ? n : a.path.localeCompare(b.path);
+  });
+  cache.clear();
+  const winnerPath = new Map<string, string>();
+  for (const skill of found) {
+    const prev = winnerPath.get(skill.name);
+    if (prev) {
+      console.warn(
+        `skills: name collision "${skill.name}" — kept ${prev}, skipped ${skill.path}`,
+      );
+      continue;
+    }
+    winnerPath.set(skill.name, skill.path);
+    cache.set(skill.name, skill);
+  }
+  lastWalkedAt = now;
+}
+
+// ---- Public API -----------------------------------------------------------
+
+export async function listSkills(): Promise<Skill[]> {
+  await ensureCache();
+  return Array.from(cache.values()).map((s) => ({
+    name: s.name,
+    description: s.description,
+    path: s.path,
+    mtime: s.mtime,
+  }));
+}
+
+export interface SkillSummary {
+  name: string;
+  description: string;
+}
+
+export async function findSkills(query: string): Promise<SkillSummary[]> {
+  await ensureCache();
+  const all = Array.from(cache.values());
+  const q = (query ?? '').trim().toLowerCase();
+  if (q === '' || q === '*') {
+    return all.map((s) => ({ name: s.name, description: s.description }));
+  }
+  // name match weighted 2x description match. No fancy ranking — substring
+  // scoring is enough for ≤20 skills.
+  const scored = all
+    .map((s) => {
+      let score = 0;
+      if (s.name.toLowerCase().includes(q)) score += 2;
+      if (s.description.toLowerCase().includes(q)) score += 1;
+      return { s, score };
+    })
+    .filter((x) => x.score > 0)
+    .sort((a, b) => b.score - a.score)
+    .slice(0, 5);
+  return scored.map(({ s }) => ({ name: s.name, description: s.description }));
+}
+
+// Returns the SKILL.md body with frontmatter stripped, or null if the skill
+// is unknown. Single-entry mtime refresh: a hot edit shows up on next call.
+export async function getSkillBody(name: string): Promise<string | null> {
+  await ensureCache();
+  const cached = cache.get(name);
+  if (!cached) return null;
+
+  let stat;
+  try {
+    stat = await fs.stat(join(cached.path, 'SKILL.md'));
+  } catch {
+    cache.delete(name);
+    return null;
+  }
+  if (stat.mtimeMs === cached.mtime) return cached.body;
+  try {
+    const raw = await fs.readFile(join(cached.path, 'SKILL.md'), 'utf8');
+    const parsed = parseSkillFile(raw);
+    if (parsed.name !== name) {
+      // Skill renamed itself; drop the stale entry. Next listSkills() walks.
+      cache.delete(name);
+      return null;
+    }
+    cached.body = parsed.body;
+    cached.description = parsed.description;
+    cached.mtime = stat.mtimeMs;
+    return cached.body;
+  } catch (err) {
+    const reason = err instanceof Error ? err.message : String(err);
+    console.warn(`skills: re-parse failed for ${name} — ${reason}`);
+    cache.delete(name);
+    return null;
+  }
+}
+
+export type SkillResourceErrorCode = 'unknown_skill' | 'unknown_resource' | 'path_escape';
+
+export type SkillResourceResult =
+  | { ok: true; content: string }
+  | { ok: false; code: SkillResourceErrorCode; message: string };
+
+export async function getSkillResource(
+  name: string,
+  relativePath: string,
+): Promise<SkillResourceResult> {
+  await ensureCache();
+  const cached = cache.get(name);
+  if (!cached) {
+    return { ok: false, code: 'unknown_skill', message: `unknown skill: ${name}` };
+  }
+  if (typeof relativePath !== 'string' || relativePath.trim() === '') {
+    return { ok: false, code: 'unknown_resource', message: 'path is required' };
+  }
+  // Syntactic pre-check — catches the common "../../etc/passwd" attempt
+  // before realpath dereferences any symlinks.
+  if (isAbsolute(relativePath) || relativePath.split(/[\\/]/).some((seg) => seg === '..')) {
+    return { ok: false, code: 'path_escape', message: `path escapes skill folder: ${relativePath}` };
+  }
+  // SKILL.md is the manifest — skill_use is the right tool to read it.
+  if (basename(relativePath) === 'SKILL.md') {
+    return { ok: false, code: 'unknown_resource', message: 'use skill_use to read SKILL.md' };
+  }
+  let real: string;
+  try {
+    real = await pathGuard(cached.path, relativePath);
+  } catch (err) {
+    if (err instanceof PathScopeError) {
+      const code: SkillResourceErrorCode = err.message.includes('escapes')
+        ? 'path_escape'
+        : 'unknown_resource';
+      return { ok: false, code, message: err.message };
+    }
+    throw err;
+  }
+  const stat = await fs.stat(real);
+  if (!stat.isFile()) {
+    return { ok: false, code: 'unknown_resource', message: 'not a file' };
+  }
+  if (stat.size > MAX_RESOURCE_BYTES) {
+    return {
+      ok: false,
+      code: 'unknown_resource',
+      message: `file too large (${stat.size} bytes, max ${MAX_RESOURCE_BYTES})`,
+    };
+  }
+  const content = await fs.readFile(real, 'utf8');
+  return { ok: true, content };
+}

apps/server/src/services/tools.ts

@@ -4,6 +4,7 @@ import { z } from 'zod';
 import { pathGuard, PathScopeError } from './path_guard.js';
 import { grep as fileOpsGrep, findFiles as fileOpsFindFiles } from './file_ops.js';
 import { getGitMeta } from './git_meta.js';
+import { findSkills, getSkillBody, getSkillResource } from './skills.js';
 
 const MAX_FILE_BYTES = 5 * 1024 * 1024;
 const DEFAULT_VIEW_LINES = 200;
@@ -300,12 +301,195 @@ export const gitStatus: ToolDef<GitStatusInputT> = {
   },
 };
 
+// Batch 9.6: skill_find, skill_use, skill_resource. Lazy-loaded markdown
+// playbooks at /data/skills/. Three tools rather than one to keep each call
+// cheap — the model lists, then loads, then optionally pulls support files.
+
+const SkillFindInput = z.object({
+  query: z.string().optional(),
+});
+type SkillFindInputT = z.infer<typeof SkillFindInput>;
+
+export const skillFind: ToolDef<SkillFindInputT> = {
+  name: 'skill_find',
+  description:
+    'Find skills (markdown playbooks under /data/skills) by name or description. Returns up to 5 matches. Empty query or "*" returns all available skills. Call this first to discover what skills are available.',
+  inputSchema: SkillFindInput,
+  jsonSchema: {
+    type: 'function',
+    function: {
+      name: 'skill_find',
+      description:
+        'Find skills by name or description. Returns up to 5 matches. Empty or "*" returns all.',
+      parameters: {
+        type: 'object',
+        properties: {
+          query: { type: 'string', description: 'substring matched against skill name and description' },
+        },
+        additionalProperties: false,
+      },
+    },
+  },
+  async execute(input) {
+    return await findSkills(input.query ?? '');
+  },
+};
+
+const SkillUseInput = z.object({
+  name: z.string().min(1),
+});
+type SkillUseInputT = z.infer<typeof SkillUseInput>;
+
+export const skillUse: ToolDef<SkillUseInputT> = {
+  name: 'skill_use',
+  description:
+    "Load the full body of a skill's SKILL.md by name. Returns the markdown playbook to follow. Discover names via skill_find. Errors: unknown_skill.",
+  inputSchema: SkillUseInput,
+  jsonSchema: {
+    type: 'function',
+    function: {
+      name: 'skill_use',
+      description: "Load the full body of a skill's SKILL.md by name.",
+      parameters: {
+        type: 'object',
+        properties: {
+          name: { type: 'string', description: 'skill name from skill_find' },
+        },
+        required: ['name'],
+        additionalProperties: false,
+      },
+    },
+  },
+  async execute(input) {
+    const body = await getSkillBody(input.name);
+    if (body === null) {
+      return { error: 'unknown_skill', message: `unknown skill: ${input.name}` };
+    }
+    return { body };
+  },
+};
+
+const SkillResourceInput = z.object({
+  name: z.string().min(1),
+  path: z.string().min(1),
+});
+type SkillResourceInputT = z.infer<typeof SkillResourceInput>;
+
+export const skillResource: ToolDef<SkillResourceInputT> = {
+  name: 'skill_resource',
+  description:
+    "Read a support file inside a skill's folder (e.g. references/root-cause-tracing.md). Path is relative to the skill folder. Use skill_use to read SKILL.md itself. Errors: unknown_skill, unknown_resource, path_escape.",
+  inputSchema: SkillResourceInput,
+  jsonSchema: {
+    type: 'function',
+    function: {
+      name: 'skill_resource',
+      description: "Read a support file inside a skill's folder. Path is relative to the skill folder.",
+      parameters: {
+        type: 'object',
+        properties: {
+          name: { type: 'string', description: 'skill name' },
+          path: { type: 'string', description: 'relative path under the skill folder' },
+        },
+        required: ['name', 'path'],
+        additionalProperties: false,
+      },
+    },
+  },
+  async execute(input) {
+    const result = await getSkillResource(input.name, input.path);
+    if (!result.ok) {
+      return { error: result.code, message: result.message };
+    }
+    return { content: result.content };
+  },
+};
+
+// Batch 9.7: ask_user_input. Interactive elicitation. The model emits a tool
+// call with 1-3 structured questions; the inference loop PAUSES (does not
+// execute the tool server-side, does not recurse) and waits for the frontend
+// to POST /api/chats/:id/answer_user_input with the user's selections. See
+// routes/messages.ts for the resume path and services/inference.ts for the
+// pause branch in executeToolPhase.
+const AskUserInputInput = z.object({
+  questions: z
+    .array(
+      z.object({
+        question: z.string().min(1).max(200),
+        type: z.enum(['single_select', 'multi_select']),
+        options: z.array(z.string().min(1).max(80)).min(2).max(6),
+      }),
+    )
+    .min(1)
+    .max(3),
+});
+type AskUserInputInputT = z.infer<typeof AskUserInputInput>;
+
+export const askUserInput: ToolDef<AskUserInputInputT> = {
+  name: 'ask_user_input',
+  description:
+    "Ask the user 1-3 structured questions through an inline picker UI. Use when you genuinely need a choice the user must make (e.g. scope, options, preferences) before continuing. Each question has 2-6 options and accepts free-text answers in addition. The tool call pauses the conversation until the user submits — the next assistant turn sees their answers as the tool result. Do not use for trivial yes/no clarifications you could infer; prefer it over multi-paragraph speculation about what the user might want.",
+  inputSchema: AskUserInputInput,
+  jsonSchema: {
+    type: 'function',
+    function: {
+      name: 'ask_user_input',
+      description:
+        'Ask the user 1-3 structured questions through an inline picker. Pauses the conversation until the user answers; the next turn sees their selections.',
+      parameters: {
+        type: 'object',
+        properties: {
+          questions: {
+            type: 'array',
+            minItems: 1,
+            maxItems: 3,
+            items: {
+              type: 'object',
+              properties: {
+                question: { type: 'string', description: '<=200 chars, shown to the user' },
+                type: {
+                  type: 'string',
+                  enum: ['single_select', 'multi_select'],
+                  description: 'single_select = at most one option; multi_select = any subset',
+                },
+                options: {
+                  type: 'array',
+                  minItems: 2,
+                  maxItems: 6,
+                  items: { type: 'string' },
+                  description: '2-6 strings, each <=80 chars; free-text input is always available alongside',
+                },
+              },
+              required: ['question', 'type', 'options'],
+              additionalProperties: false,
+            },
+          },
+        },
+        required: ['questions'],
+        additionalProperties: false,
+      },
+    },
+  },
+  // Server-side no-op. The "execution" of ask_user_input is the user's
+  // response, captured client-side and posted to /api/chats/:id/answer_user_input.
+  // The inference loop detects this tool by name and pauses before reaching
+  // executeToolCall — this fallback only runs if something bypasses that
+  // branch, in which case the pending sentinel matches the pause-path shape.
+  async execute(input) {
+    return { _pending: true, questions: input.questions };
+  },
+};
+
 export const ALL_TOOLS: ReadonlyArray<ToolDef<unknown>> = [
   viewFile as ToolDef<unknown>,
   listDir as ToolDef<unknown>,
   grep as ToolDef<unknown>,
   findFiles as ToolDef<unknown>,
   gitStatus as ToolDef<unknown>,
+  skillFind as ToolDef<unknown>,
+  skillUse as ToolDef<unknown>,
+  skillResource as ToolDef<unknown>,
+  askUserInput as ToolDef<unknown>,
 ];
 
 // v1.8.2: forward-compatible read-only whitelist. An agent whose `tools` is
@@ -313,12 +497,19 @@ export const ALL_TOOLS: ReadonlyArray<ToolDef<unknown>> = [
 // anything outside means the agent can mutate state and gets a tighter
 // default (10). Every tool in v1.8.2 happens to be read-only, so the
 // non-RO branch only takes effect once BooCoder lands write tools.
+// Batch 9.6: skill_* added; all still read-only.
+// Batch 9.7: ask_user_input added — it pauses execution but doesn't mutate
+// project state, so it belongs in the read-only set for budget purposes.
 export const READ_ONLY_TOOL_NAMES = [
   'view_file',
   'list_dir',
   'grep',
   'find_files',
   'git_status',
+  'skill_find',
+  'skill_use',
+  'skill_resource',
+  'ask_user_input',
 ] as const;
 
 export const TOOLS_BY_NAME: Record<string, ToolDef<unknown>> = Object.fromEntries(

apps/server/src/types/api.ts

@@ -10,6 +10,12 @@ export interface Project {
   last_session_id: string | null;
   status: ProjectStatus;
   gitea_remote: string | null;
+  // v1.9: per-project defaults inherited by new sessions. Empty string on
+  // default_system_prompt means "no override" — the model gets the base
+  // BooCode system prompt only. default_web_search_enabled is the inherited
+  // value for sessions where web_search_enabled is null.
+  default_system_prompt: string;
+  default_web_search_enabled: boolean;
 }
 
 export interface AvailableProject {
@@ -29,6 +35,10 @@ export interface Session {
   created_at: string;
   updated_at: string;
   agent_id: string | null;
+  // v1.9: per-session override for web_search. null = inherit from
+  // project.default_web_search_enabled. Plumbed but inert in v1.9 — the
+  // actual web_search tool ships in Batch 8.
+  web_search_enabled: boolean | null;
 }
 
 // v1.8.1: agents come from two sources. 'global' = /data/AGENTS.md (always
@@ -149,6 +159,12 @@ export interface Message {
   // v1.8.2: per-message metadata. See MessageMetadata for the discriminated
   // shapes currently in use.
   metadata: MessageMetadata | null;
+  // v1.11: anchored rolling compaction. Optional so consumers that SELECT
+  // the pre-v1.11 column set still type-check. See compaction.ts +
+  // schema.sql for semantics.
+  summary?: boolean;
+  tail_start_id?: string | null;
+  compacted_at?: string | null;
 }
 
 export interface ModelInfo {

apps/web/index.html

@@ -4,8 +4,31 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>BooCode</title>
+    <script>
+      // themes-v1 FOUC guard: read the last-applied theme from localStorage
+      // and stamp the class on <html> before React mounts. Falls back to
+      // obsidian + dark when no cache. Light-only themes (ivory, chalk) with
+      // a dark mode pref fall back to obsidian dark — mirrors the rule in
+      // lib/theme.ts effectiveThemeId().
+      (function () {
+        try {
+          var t = JSON.parse(localStorage.getItem('boocode.theme') || '{}');
+          var id = t.id || 'obsidian';
+          var mode = t.mode || 'dark';
+          if (mode === 'system') {
+            mode = matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+          }
+          if ((id === 'ivory' || id === 'chalk') && mode === 'dark') {
+            id = 'obsidian';
+          }
+          document.documentElement.className = 'theme-' + id + (mode === 'dark' ? ' dark' : '');
+        } catch (e) {
+          document.documentElement.className = 'theme-obsidian dark';
+        }
+      })();
+    </script>
   </head>
-  <body class="bg-neutral-950 text-neutral-100">
+  <body>
     <div id="root"></div>
     <script type="module" src="/src/main.tsx"></script>
   </body>

apps/web/package.json

@@ -12,6 +12,11 @@
   "dependencies": {
     "@fontsource-variable/inter": "^5.2.8",
     "@fontsource-variable/jetbrains-mono": "^5.2.8",
+    "@xterm/addon-fit": "0.10.0",
+    "@xterm/addon-search": "^0.15.0",
+    "@xterm/addon-web-links": "0.11.0",
+    "@xterm/addon-webgl": "^0.19.0",
+    "@xterm/xterm": "5.5.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "lucide-react": "^1.16.0",

apps/web/src/App.tsx

@@ -6,8 +6,10 @@ import { RightRail } from '@/components/RightRail';
 import { Home } from '@/pages/Home';
 import { Project } from '@/pages/Project';
 import { Session } from '@/pages/Session';
+import { Settings } from '@/pages/Settings';
 import { Toaster } from '@/components/ui/sonner';
 import { useUserEvents } from '@/hooks/useUserEvents';
+import { useTheme } from '@/lib/theme';
 import { SidebarDrawerProvider, useSidebarDrawer } from '@/hooks/useSidebarDrawer';
 import { RightRailDrawerProvider, useRightRailDrawer } from '@/hooks/useRightRailDrawer';
 import { useViewport } from '@/hooks/useViewport';
@@ -61,9 +63,18 @@ function MobileRightRailBackdrop() {
 }
 
 function AppShell() {
+  // themes-v1: useTheme() owns the matchMedia subscription for system mode
+  // and reconciles cache with /api/settings on mount. Mounted first so the
+  // theme class on <html> is correct before any child renders.
+  useTheme();
   useUserEvents();
+  // v1.10.8c: h-dvh (dynamic viewport) instead of h-screen (100vh) so the
+  // root height excludes the iOS URL-bar overlay area. Without this, every
+  // descendant — including the terminal pane — measures itself against a
+  // height that extends behind the URL bar, and xterm allocates extra rows
+  // that scroll out of reach on iPhone.
   return (
-    <div className="dark h-screen flex bg-background text-foreground">
+    <div className="h-dvh flex bg-background text-foreground">
       <ProjectSidebar />
       <MobileBackdrop />
       <main className="flex-1 flex flex-col min-w-0">
@@ -71,6 +82,7 @@ function AppShell() {
           <Route path="/" element={<Home />} />
           <Route path="/project/:id" element={<Project />} />
           <Route path="/session/:id" element={<Session />} />
+          <Route path="/settings" element={<Settings />} />
         </Routes>
       </main>
       <MobileRightRailBackdrop />

apps/web/src/api/client.ts

@@ -10,6 +10,8 @@ import type {
   ViewFileResult,
   AgentsResponse,
   GitMeta,
+  Skill,
+  AskUserAnswer,
 } from './types';
 
 export class ApiError extends Error {
@@ -51,15 +53,29 @@ export const api = {
         method: 'POST',
         body: JSON.stringify(body),
       }),
-    update: (id: string, body: { name: string }) =>
+    update: (
+      id: string,
+      body: Partial<Pick<Project, 'name' | 'default_system_prompt' | 'default_web_search_enabled'>>,
+    ) =>
       request<Project>(`/api/projects/${id}`, {
         method: 'PATCH',
         body: JSON.stringify(body),
       }),
+    get: (id: string) => request<Project>(`/api/projects/${id}`),
     archive: (id: string) =>
       request<void>(`/api/projects/${id}/archive`, { method: 'POST' }),
     unarchive: (id: string) =>
       request<Project>(`/api/projects/${id}/unarchive`, { method: 'POST' }),
+    // v1.9: bulk-archive every open session in this project. Server publishes
+    // one session_archived frame per affected id, so the sidebar reducer
+    // updates incrementally rather than waiting for a refetch.
+    archiveAllSessions: (id: string) =>
+      request<{ archived: number; ids: string[] }>(
+        `/api/projects/${id}/sessions/archive-all`,
+        { method: 'POST' },
+      ),
+    openSessionsCount: (id: string) =>
+      request<{ count: number }>(`/api/projects/${id}/sessions/open-count`),
     create: (body: {
       name: string;
       commit_message?: string;
@@ -106,7 +122,7 @@ export const api = {
     get: (id: string) => request<Session>(`/api/sessions/${id}`),
     update: (
       id: string,
-      body: Partial<Pick<Session, 'name' | 'model' | 'system_prompt' | 'agent_id'>>
+      body: Partial<Pick<Session, 'name' | 'model' | 'system_prompt' | 'agent_id' | 'web_search_enabled'>>
     ) =>
       request<Session>(`/api/sessions/${id}`, {
         method: 'PATCH',
@@ -118,6 +134,15 @@ export const api = {
       request<void>(`/api/sessions/${id}/archive`, { method: 'POST' }),
     unarchive: (id: string) =>
       request<Session>(`/api/sessions/${id}/unarchive`, { method: 'POST' }),
+    // v1.9: bulk-archive every open chat in this session. Same pattern as
+    // archiveAllSessions — server publishes one chat_archived per id.
+    archiveAllChats: (id: string) =>
+      request<{ archived: number; ids: string[] }>(
+        `/api/sessions/${id}/chats/archive-all`,
+        { method: 'POST' },
+      ),
+    openChatsCount: (id: string) =>
+      request<{ count: number }>(`/api/sessions/${id}/chats/open-count`),
   },
 
   chats: {
@@ -143,8 +168,11 @@ export const api = {
       request<void>(`/api/chats/${chatId}`, { method: 'DELETE' }),
     messages: (chatId: string) =>
       request<Message[]>(`/api/chats/${chatId}/messages`),
+    // v1.11: anchored-rolling compaction. POST awaits the LLM call inside
+    // the route's lifecycle; the new summary row arrives via the 'compacted'
+    // WS frame (useSessionStream refetches + toasts).
     compact: (chatId: string) =>
-      request<{ compact_message_id: string }>(`/api/chats/${chatId}/compact`, { method: 'POST' }),
+      request<{ ok: true }>(`/api/chats/${chatId}/compact`, { method: 'POST' }),
     stop: (chatId: string) =>
       request<{ stopped: boolean }>(`/api/chats/${chatId}/stop`, { method: 'POST' }),
     forceSend: (chatId: string, content: string) =>
@@ -164,6 +192,31 @@ export const api = {
         method: 'POST',
         body: JSON.stringify({ message_id: body.messageId, name: body.name }),
       }),
+    // Batch 9.6: slash-command invocation. Server loads the skill body
+    // authoritatively (client doesn't get to forge file contents), persists
+    // a synthetic skill_use tool_use + tool_result + user message + streaming
+    // assistant, and enqueues inference. Returns all 4 new message IDs.
+    skillInvoke: (chatId: string, skillName: string, userMessage: string | null) =>
+      request<{
+        synth_assistant_id: string;
+        tool_message_id: string;
+        user_message_id: string;
+        assistant_message_id: string;
+      }>(`/api/chats/${chatId}/skill_invoke`, {
+        method: 'POST',
+        body: JSON.stringify({ skill_name: skillName, user_message: userMessage }),
+      }),
+    // Batch 9.7: submit answers for a paused ask_user_input call. Server
+    // validates against the question shape, UPDATEs the pending tool row,
+    // publishes the deferred tool_result frame, and enqueues the next turn.
+    answerUserInput: (chatId: string, toolCallId: string, answers: AskUserAnswer[]) =>
+      request<{ tool_message_id: string; assistant_message_id: string }>(
+        `/api/chats/${chatId}/answer_user_input`,
+        {
+          method: 'POST',
+          body: JSON.stringify({ tool_call_id: toolCallId, answers }),
+        },
+      ),
   },
 
   messages: {
@@ -195,6 +248,10 @@ export const api = {
       request<AgentsResponse>(`/api/projects/${projectId}/agents`),
   },
 
+  skills: {
+    list: () => request<{ skills: Skill[] }>('/api/skills'),
+  },
+
   settings: {
     get: () => request<Record<string, unknown>>('/api/settings'),
     patch: (body: Record<string, unknown>) =>
@@ -207,4 +264,31 @@ export const api = {
   sidebar: {
     get: () => request<SidebarResponse>('/api/sidebar'),
   },
+
+  // v1.10 booterm: REST control plane for terminal panes. WebSocket attach
+  // lives at /ws/term/sessions/:sid/panes/:pid (handled directly by
+  // TerminalPane). v1.10.8c: resize moved in-band onto the WebSocket as a
+  // `{type:"resize",cols,rows}` text frame — the old /resize HTTP endpoint is
+  // gone, eliminating the race between WS attach and PTY-map registration.
+  terminals: {
+    // cols/rows are optional. When passed, booterm sizes the per-pane tmux
+    // session at creation time so the inner bash (and any TUI it spawns) is
+    // born with the correct PTY dimensions instead of tmux's 80x24 default.
+    start: (sessionId: string, paneId: string, cols?: number, rows?: number) =>
+      request<{ tmux_session: string }>(
+        `/api/term/sessions/${sessionId}/panes/${paneId}/start`,
+        {
+          method: 'POST',
+          body:
+            cols !== undefined && rows !== undefined
+              ? JSON.stringify({ cols, rows })
+              : undefined,
+        },
+      ),
+    kill: (sessionId: string, paneId: string) =>
+      request<{ ok: true }>(
+        `/api/term/sessions/${sessionId}/panes/${paneId}/kill`,
+        { method: 'POST' },
+      ),
+  },
 };

apps/web/src/api/types.ts

@@ -9,6 +9,10 @@ export interface Project {
   last_session_id: string | null;
   status: ProjectStatus;
   gitea_remote: string | null;
+  // v1.9: per-project defaults. Empty string on default_system_prompt means
+  // "no override" — inference falls through to the base system prompt.
+  default_system_prompt: string;
+  default_web_search_enabled: boolean;
 }
 
 export interface AvailableProject {
@@ -28,6 +32,8 @@ export interface Session {
   created_at: string;
   updated_at: string;
   agent_id: string | null;
+  // v1.9: null = inherit from project.default_web_search_enabled.
+  web_search_enabled: boolean | null;
 }
 
 // v1.8.1: 'global' = /data/AGENTS.md (always-on), 'project' = per-project
@@ -139,6 +145,19 @@ export interface Message {
   // v1.8.2: per-message metadata; see MessageMetadata. null for the vast
   // majority of messages.
   metadata: MessageMetadata | null;
+  // v1.11: anchored rolling compaction fields. Optional on the wire so that
+  // older API responses (or test fixtures) parse without explicit nulls.
+  //   summary       — true on the assistant row that holds the active
+  //                   anchored summary. Render via SummaryCard.
+  //   tail_start_id — first preserved tail message the summary covers up to
+  //                   (exclusive). Diagnostic only on the client.
+  //   compacted_at  — set on rows that are "behind the curtain" of the
+  //                   current summary. Returned by the GET endpoint so the
+  //                   UI can show history, but the server-side inference
+  //                   assembly filters these out.
+  summary?: boolean;
+  tail_start_id?: string | null;
+  compacted_at?: string | null;
 }
 
 export interface ModelInfo {
@@ -225,7 +244,41 @@ export interface GitMeta {
   behind: number;
 }
 
-export type WorkspacePaneKind = 'chat' | 'terminal' | 'agent' | 'empty';
+// Batch 9.6: skill catalog row. Returned by GET /api/skills and consumed by
+// the slash-command dropdown. `path` and `mtime` are exposed for debug surface
+// (/api/skills) but the dropdown only renders name + description.
+export interface Skill {
+  name: string;
+  description: string;
+  path: string;
+  mtime: number;
+}
+
+// Batch 9.7: ask_user_input shapes. The tool_call.args is { questions: AskUserQuestion[] }
+// (1-3 entries); the eventual tool_result.output is { answers: AskUserAnswer[] } in the
+// same order. AskUserInputCard renders questions and POSTs answers.
+export type AskUserQuestionType = 'single_select' | 'multi_select';
+
+export interface AskUserQuestion {
+  question: string;
+  type: AskUserQuestionType;
+  options: string[];
+}
+
+export interface AskUserAnswer {
+  question: string;
+  selected_options: string[];
+  free_text: string | null;
+}
+
+export interface AskUserAnswerSet {
+  answers: AskUserAnswer[];
+}
+
+// v1.9: 'settings' is an ephemeral pane kind — never persisted, always
+// singleton per workspace. The pane hook filters it out before writing to
+// localStorage and dedupes on insertion via toggleSettingsPane().
+export type WorkspacePaneKind = 'chat' | 'terminal' | 'agent' | 'empty' | 'settings';
 
 export interface WorkspacePane {
   id: string;
@@ -265,6 +318,11 @@ export type WsFrame =
     }
   | { type: 'messages_deleted'; message_ids: string[]; chat_id?: string }
   | { type: 'chat_renamed'; chat_id: string; name: string }
+  // v1.11: published by services/compaction.ts after the new anchored
+  // summary row lands. Carries the new summary row id for diagnostics; the
+  // session-stream handler ignores the id and re-fetches the full message
+  // list (the cohort of compacted_at-stamped rows changed too).
+  | { type: 'compacted'; session_id: string; chat_id: string; summary_message_id: string }
   // v1.8.2: `reason` discriminates structured failures (the UI prefers it
   // over `error` text when present).
   | { type: 'error'; message_id?: string; chat_id?: string; error: string; reason?: ErrorReason };

apps/web/src/components/AskUserInputCard.tsx

@@ -0,0 +1,324 @@
+import { useMemo, useState } from 'react';
+import { Check } from 'lucide-react';
+import { toast } from 'sonner';
+import { api } from '@/api/client';
+import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
+import { Button } from '@/components/ui/button';
+import type {
+  AskUserAnswer,
+  AskUserAnswerSet,
+  AskUserQuestion,
+  ToolCall,
+  ToolResult,
+} from '@/api/types';
+
+// Batch 9.7. Inline interactive picker. Renders inside MessageList in place of
+// the standard ToolCallLine when the assistant emits an ask_user_input tool
+// call. While the tool result is null (server pre-stamps a sentinel with
+// output=null), shows the form; once the WS tool_result frame arrives with a
+// real AnswerSet, flips to read-only review mode.
+
+interface Props {
+  toolCall: ToolCall;
+  toolResult: ToolResult | null;
+  chatId: string;
+}
+
+function parseQuestions(raw: unknown): AskUserQuestion[] {
+  if (!raw || typeof raw !== 'object' || !('questions' in raw)) return [];
+  const arr = (raw as { questions: unknown }).questions;
+  if (!Array.isArray(arr)) return [];
+  const out: AskUserQuestion[] = [];
+  for (const item of arr) {
+    if (!item || typeof item !== 'object') continue;
+    const q = item as { question?: unknown; type?: unknown; options?: unknown };
+    if (typeof q.question !== 'string') continue;
+    if (q.type !== 'single_select' && q.type !== 'multi_select') continue;
+    if (!Array.isArray(q.options)) continue;
+    const opts = q.options.filter((o): o is string => typeof o === 'string');
+    if (opts.length < 2) continue;
+    out.push({ question: q.question, type: q.type, options: opts });
+  }
+  return out;
+}
+
+function parseAnswerSet(raw: unknown): AskUserAnswerSet | null {
+  if (!raw || typeof raw !== 'object' || !('answers' in raw)) return null;
+  const arr = (raw as { answers: unknown }).answers;
+  if (!Array.isArray(arr)) return null;
+  const answers: AskUserAnswer[] = [];
+  for (const item of arr) {
+    if (!item || typeof item !== 'object') continue;
+    const a = item as { question?: unknown; selected_options?: unknown; free_text?: unknown };
+    if (typeof a.question !== 'string') continue;
+    if (!Array.isArray(a.selected_options)) continue;
+    if (a.free_text !== null && typeof a.free_text !== 'string') continue;
+    const sel = a.selected_options.filter((s): s is string => typeof s === 'string');
+    answers.push({
+      question: a.question,
+      selected_options: sel,
+      free_text: (a.free_text as string | null) ?? null,
+    });
+  }
+  return { answers };
+}
+
+export function AskUserInputCard({ toolCall, toolResult, chatId }: Props) {
+  const questions = useMemo(() => parseQuestions(toolCall.args), [toolCall.args]);
+
+  if (questions.length === 0) {
+    return (
+      <div className="rounded border border-destructive/40 bg-destructive/10 text-xs px-3 py-2 text-destructive">
+        ask_user_input: malformed tool args
+      </div>
+    );
+  }
+
+  // Tool result with a non-null output means the answer is already submitted.
+  // The pending sentinel uses output=null, so this branch only triggers after
+  // the real WS tool_result frame lands.
+  const answered = toolResult && toolResult.output !== null;
+  if (answered) {
+    const answerSet = parseAnswerSet(toolResult!.output);
+    return <AnsweredView questions={questions} answers={answerSet} />;
+  }
+
+  return (
+    <PendingView questions={questions} toolCallId={toolCall.id} chatId={chatId} />
+  );
+}
+
+function PendingView({
+  questions,
+  toolCallId,
+  chatId,
+}: {
+  questions: AskUserQuestion[];
+  toolCallId: string;
+  chatId: string;
+}) {
+  // Per-question selections + free text. Selections are option arrays so the
+  // multi_select case is uniform; single_select just constrains to length 1.
+  const [selections, setSelections] = useState<string[][]>(() => questions.map(() => []));
+  const [freeTexts, setFreeTexts] = useState<string[]>(() => questions.map(() => ''));
+  const [submitting, setSubmitting] = useState(false);
+
+  const singleQuestion = questions.length === 1;
+  const anyFreeText = freeTexts.some((t) => t.trim().length > 0);
+
+  // Submit button shows when:
+  //   - more than one question (always batched), OR
+  //   - one question and the user has typed free text (committing it needs an
+  //     explicit Submit so an accidental Tab/click doesn't lose it).
+  // For one question with no free text, clicking an option submits inline.
+  const showSubmitButton = !singleQuestion || anyFreeText;
+
+  // Every question must have at least one of (option, free text).
+  const allComplete = questions.every((_, i) => {
+    return selections[i]!.length > 0 || freeTexts[i]!.trim().length > 0;
+  });
+
+  function buildAnswers(): AskUserAnswer[] {
+    return questions.map((q, i) => {
+      const freeText = freeTexts[i]!.trim();
+      return {
+        question: q.question,
+        selected_options: selections[i]!,
+        free_text: freeText.length > 0 ? freeText : null,
+      };
+    });
+  }
+
+  async function submit(answers: AskUserAnswer[]) {
+    if (submitting) return;
+    setSubmitting(true);
+    try {
+      await api.chats.answerUserInput(chatId, toolCallId, answers);
+      // Card stays mounted; the incoming WS tool_result frame will flip it
+      // into AnsweredView via the parent prop change.
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'submit failed');
+      setSubmitting(false);
+    }
+  }
+
+  function pickSingle(qIdx: number, option: string) {
+    setSelections((prev) => prev.map((arr, i) => (i === qIdx ? [option] : arr)));
+    // Immediate submit for the single-question single-select shortcut. Only
+    // fires when no free text exists anywhere — once the user typed, the
+    // Submit button takes over so the typed text isn't silently dropped.
+    if (singleQuestion && !anyFreeText) {
+      const answers: AskUserAnswer[] = [
+        {
+          question: questions[0]!.question,
+          selected_options: [option],
+          free_text: null,
+        },
+      ];
+      void submit(answers);
+    }
+  }
+
+  function toggleMulti(qIdx: number, option: string) {
+    setSelections((prev) =>
+      prev.map((arr, i) => {
+        if (i !== qIdx) return arr;
+        return arr.includes(option) ? arr.filter((o) => o !== option) : [...arr, option];
+      }),
+    );
+  }
+
+  function setFreeText(qIdx: number, value: string) {
+    setFreeTexts((prev) => prev.map((t, i) => (i === qIdx ? value : t)));
+  }
+
+  return (
+    <div className="rounded-lg border bg-muted/20 text-sm">
+      <div className="px-4 py-3 space-y-4">
+        {questions.map((q, i) => (
+          <div key={i} className="space-y-2">
+            {questions.length > 1 && (
+              <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                Question {i + 1}
+              </div>
+            )}
+            <div className="font-medium leading-snug">{q.question}</div>
+            {q.type === 'single_select' ? (
+              <RadioGroup
+                value={selections[i]![0] ?? ''}
+                onValueChange={(v) => pickSingle(i, v)}
+                disabled={submitting}
+                className="gap-1.5"
+              >
+                {q.options.map((opt, j) => {
+                  const id = `q${i}-opt${j}`;
+                  return (
+                    <label
+                      key={j}
+                      htmlFor={id}
+                      className="flex items-start gap-2 text-sm leading-snug cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40"
+                    >
+                      <RadioGroupItem id={id} value={opt} className="mt-0.5" />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </RadioGroup>
+            ) : (
+              <div className="grid gap-1.5">
+                {q.options.map((opt, j) => {
+                  const id = `q${i}-opt${j}`;
+                  const checked = selections[i]!.includes(opt);
+                  return (
+                    <label
+                      key={j}
+                      htmlFor={id}
+                      className="flex items-start gap-2 text-sm leading-snug cursor-pointer rounded px-1 py-0.5 hover:bg-muted/40"
+                    >
+                      <input
+                        id={id}
+                        type="checkbox"
+                        checked={checked}
+                        disabled={submitting}
+                        onChange={() => toggleMulti(i, opt)}
+                        className="mt-1 size-3.5 rounded border-input accent-primary"
+                      />
+                      <span>{opt}</span>
+                    </label>
+                  );
+                })}
+              </div>
+            )}
+            <div className="pt-1 space-y-1">
+              <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                Or type a custom answer
+              </div>
+              <input
+                type="text"
+                value={freeTexts[i]}
+                disabled={submitting}
+                placeholder="Free text…"
+                onChange={(e) => setFreeText(i, e.target.value)}
+                className="w-full rounded border border-input bg-background px-2 py-1 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:opacity-60"
+              />
+            </div>
+          </div>
+        ))}
+      </div>
+      {showSubmitButton && (
+        <div className="flex justify-end gap-2 border-t px-4 py-2">
+          <Button
+            type="button"
+            size="sm"
+            disabled={!allComplete || submitting}
+            onClick={() => void submit(buildAnswers())}
+          >
+            {submitting ? 'Submitting…' : 'Submit'}
+          </Button>
+        </div>
+      )}
+    </div>
+  );
+}
+
+function AnsweredView({
+  questions,
+  answers,
+}: {
+  questions: AskUserQuestion[];
+  answers: AskUserAnswerSet | null;
+}) {
+  if (!answers) {
+    return (
+      <div className="rounded-lg border bg-muted/20 text-xs px-4 py-3 text-muted-foreground">
+        ask_user_input: answers unavailable
+      </div>
+    );
+  }
+
+  return (
+    <div className="rounded-lg border bg-muted/10 text-sm">
+      <div className="px-4 py-3 space-y-3">
+        {questions.map((q, i) => {
+          const a = answers.answers[i];
+          if (!a) return null;
+          return (
+            <div key={i} className="space-y-1.5">
+              {questions.length > 1 && (
+                <div className="text-[10px] uppercase tracking-wide text-muted-foreground/70">
+                  Question {i + 1}
+                </div>
+              )}
+              <div className="font-medium leading-snug">{q.question}</div>
+              <div className="space-y-0.5">
+                {q.options.map((opt, j) => {
+                  const selected = a.selected_options.includes(opt);
+                  return (
+                    <div
+                      key={j}
+                      className={
+                        selected
+                          ? 'flex items-start gap-2 text-sm leading-snug text-foreground'
+                          : 'flex items-start gap-2 text-sm leading-snug text-muted-foreground/60 line-through'
+                      }
+                    >
+                      <span className="mt-0.5 size-3.5 shrink-0 inline-flex items-center justify-center">
+                        {selected && <Check className="size-3 text-primary" />}
+                      </span>
+                      <span>{opt}</span>
+                    </div>
+                  );
+                })}
+              </div>
+              {a.free_text && (
+                <div className="rounded bg-background border px-2 py-1 text-xs font-mono whitespace-pre-wrap">
+                  {a.free_text}
+                </div>
+              )}
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}

apps/web/src/components/ChatInput.tsx

@@ -1,8 +1,14 @@
-import { useCallback, useEffect, useRef, useState, type DragEvent, type KeyboardEvent } from 'react';
-import { Send } from 'lucide-react';
+import { useCallback, useEffect, useMemo, useRef, useState, type DragEvent, type KeyboardEvent } from 'react';
+import { Check, Plus, Send } from 'lucide-react';
 import { toast } from 'sonner';
 import { Textarea } from '@/components/ui/textarea';
 import { Button } from '@/components/ui/button';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
 import {
   flattenToMessage,
   inferLanguage,
@@ -16,8 +22,11 @@ import { AttachmentPreviewModal } from '@/components/AttachmentPreviewModal';
 import { FileMentionPopover } from '@/components/FileMentionPopover';
 import { DropOverlay } from '@/components/DropOverlay';
 import { AgentPicker } from '@/components/AgentPicker';
+import { SkillSlashCommand } from '@/components/SkillSlashCommand';
 import { api } from '@/api/client';
 import { sessionEvents } from '@/hooks/sessionEvents';
+import { chatInputsRegistry, sendToChat } from '@/lib/events';
+import { useSkills } from '@/hooks/useSkills';
 import { useViewport } from '@/hooks/useViewport';
 
 const MAX_ATTACHMENTS = 10;
@@ -29,11 +38,30 @@ interface Props {
   // When omitted, the toolbar row is hidden entirely.
   agentId?: string | null;
   onAgentChange?: (agentId: string | null) => void | Promise<void>;
+  // v1.9: when sessionId + webSearchEnabled are both provided, the + menu
+  // renders next to the AgentPicker with a single "Web search" toggle item.
+  // The check reflects the *stored* session value (not the effective one):
+  // null counts as unchecked. Clicking PATCHes session.web_search_enabled
+  // with the inverted boolean (null → true, true → false, false → true).
+  sessionId?: string;
+  webSearchEnabled?: boolean | null;
   onSend: (content: string) => void | Promise<void>;
   onForceSend?: (content: string) => void | Promise<void>;
+  // Batch 9.6: slash-command dispatch. When the input parses to a known skill,
+  // ChatInput calls this with the skill name + the post-name args (possibly
+  // empty). Callers wire this to api.chats.skillInvoke. Omitting the prop
+  // disables slash-command dispatch (input is sent as literal text).
+  onSlashCommand?: (skillName: string, userMessage: string) => void | Promise<void>;
+  // v1.10.4: send-to-chat reverse path. When chatId is provided, this input
+  // registers in chatInputsRegistry so the terminal floating menu can list
+  // it, and subscribes to sendToChat events scoped to this chatId. Receiving
+  // an event appends the text to the current draft (with a newline separator
+  // when non-empty) and focuses — no auto-send.
+  chatId?: string;
+  chatLabel?: string;
 }
 
-export function ChatInput({ disabled, projectId, agentId, onAgentChange, onSend, onForceSend }: Props) {
+export function ChatInput({ disabled, projectId, agentId, onAgentChange, sessionId, webSearchEnabled, onSend, onForceSend, onSlashCommand, chatId, chatLabel }: Props) {
   const { isMobile } = useViewport();
   const [value, setValue] = useState('');
   const [busy, setBusy] = useState(false);
@@ -48,6 +76,19 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, onSend,
     atIdx: number;
     anchorRect: { top: number; left: number };
   } | null>(null);
+  // Batch 9.6: slash-command dropdown. Opens when `/` is the first char of
+  // the input and stays open while the input is `/<word>` with no whitespace.
+  // Disabled entirely when the caller doesn't pass onSlashCommand.
+  const [slashState, setSlashState] = useState<{
+    query: string;
+    anchorRect: { top: number; left: number };
+  } | null>(null);
+  const { skills } = useSkills();
+  const skillsLookup = useMemo(() => {
+    const m = new Map<string, true>();
+    for (const s of skills) m.set(s.name, true);
+    return m;
+  }, [skills]);
   const [fileIndex, setFileIndex] = useState<string[] | null>(null);
   const textareaRef = useRef<HTMLTextAreaElement | null>(null);
 
@@ -74,6 +115,35 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, onSend,
     });
   }, []);
 
+  // v1.10.4: register this input in the chat-input registry so the terminal
+  // pane's "Send to chat" menu can list it. Re-registers when chatLabel
+  // changes (e.g. rename) so the menu reflects the current name.
+  useEffect(() => {
+    if (!chatId) return;
+    return chatInputsRegistry.register(chatId, chatLabel ?? 'Chat', () => {
+      textareaRef.current?.focus();
+    });
+  }, [chatId, chatLabel]);
+
+  // v1.10.4: subscribe to send_to_chat events scoped by chatId. Appends the
+  // payload text to the current draft (with a newline separator if the
+  // draft is non-empty) and focuses the textarea. Does NOT auto-submit.
+  useEffect(() => {
+    if (!chatId) return;
+    return sendToChat.subscribe(({ chat_id, text }) => {
+      if (chat_id !== chatId) return;
+      setValue((prev) => (prev.length === 0 ? text : `${prev}\n${text}`));
+      requestAnimationFrame(() => {
+        const ta = textareaRef.current;
+        if (!ta) return;
+        ta.focus();
+        // Put caret at end so the user can keep typing immediately.
+        const end = ta.value.length;
+        ta.selectionStart = ta.selectionEnd = end;
+      });
+    });
+  }, [chatId]);
+
   function removeAttachment(id: string) {
     setAttachments(prev => prev.filter(a => a.id !== id));
   }
@@ -82,6 +152,31 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, onSend,
     const text = value.trim();
     if (!text && attachments.length === 0) return;
     if (disabled || busy) return;
+
+    // Batch 9.6: slash-command dispatch. Only when no attachments and the
+    // input parses to a known skill. Falls through to onSend for unknown
+    // slash names (literal text) or when slash dispatch isn't wired.
+    if (onSlashCommand && attachments.length === 0 && text.startsWith('/')) {
+      const match = text.match(/^\/(\S+)\s*([\s\S]*)$/);
+      if (match && skillsLookup.has(match[1]!)) {
+        const skillName = match[1]!;
+        const args = (match[2] ?? '').trim();
+        setBusy(true);
+        try {
+          await onSlashCommand(skillName, args);
+          setValue('');
+          setAttachments([]);
+          setSlashState(null);
+        } catch (err) {
+          toast.error(err instanceof Error ? err.message : 'skill invocation failed');
+        } finally {
+          setBusy(false);
+        }
+        return;
+      }
+      // Unknown skill name — fall through and send as literal text.
+    }
+
     setBusy(true);
     try {
       const body = flattenToMessage(attachments, text);
@@ -95,6 +190,19 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, onSend,
     }
   }
 
+  function handleSlashSelect(skillName: string) {
+    const next = `/${skillName} `;
+    setValue(next);
+    setSlashState(null);
+    requestAnimationFrame(() => {
+      const ta = textareaRef.current;
+      if (ta) {
+        ta.selectionStart = ta.selectionEnd = next.length;
+        ta.focus();
+      }
+    });
+  }
+
   function getCaretCoords(textarea: HTMLTextAreaElement): { top: number; left: number } {
     const mirror = document.createElement('div');
     const style = window.getComputedStyle(textarea);
@@ -145,6 +253,23 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, onSend,
     const ta = e.target;
     const pos = ta.selectionStart;
 
+    // Batch 9.6: slash-command trigger. Active while the input is a single
+    // slash-prefixed token with no whitespace (i.e. user is still typing the
+    // skill name). Hand off to args mode the moment a space appears or the
+    // slash leaves position 0.
+    if (onSlashCommand && /^\/[^\s]*$/.test(newValue)) {
+      const query = newValue.slice(1);
+      if (!slashState) {
+        const rect = ta.getBoundingClientRect();
+        setSlashState({ query, anchorRect: { top: rect.top, left: rect.left } });
+      } else if (slashState.query !== query) {
+        setSlashState({ ...slashState, query });
+      }
+      if (mentionState?.open) setMentionState(null);
+      return;
+    }
+    if (slashState) setSlashState(null);
+
     // Check for @ trigger
     if (pos > 0 && newValue[pos - 1] === '@') {
       const charBefore = pos >= 2 ? newValue[pos - 2] : null;
@@ -361,6 +486,9 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, onSend,
 
   function onKeyDown(e: KeyboardEvent<HTMLTextAreaElement>) {
     if (mentionState?.open) return;
+    // SkillSlashCommand owns Arrow/Enter/Tab/Esc via a document listener; let
+    // it consume them so the textarea doesn't also submit on Enter.
+    if (slashState) return;
     // IME safety: never act on Enter while an IME composition is in flight
     // (CJK input methods commit composition via Enter). Without this, the
     // first Enter of a Japanese/Chinese/Korean composition would submit
@@ -425,16 +553,51 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, onSend,
           ))}
         </div>
       )}
-      {/* Batch 9 toolbar — agent picker. Sits above the input row so it
-          doesn't compete with the send button for vertical alignment.
-          When Batch 7 lands, ModelPicker and the + button join this row. */}
-      {onAgentChange && (
+      {/* Batch 9 toolbar — agent picker. v1.9 adds the icon-only + menu next
+          to it for quick toggles (currently: Web search). When omitted at the
+          callsite the row stays collapsed so nothing else has to change. */}
+      {(onAgentChange || sessionId) && (
         <div className="px-4 pt-2 flex items-center gap-1.5">
-          <AgentPicker
-            projectId={projectId}
-            value={agentId ?? null}
-            onChange={onAgentChange}
-          />
+          {onAgentChange && (
+            <AgentPicker
+              projectId={projectId}
+              value={agentId ?? null}
+              onChange={onAgentChange}
+            />
+          )}
+          {sessionId && (
+            <DropdownMenu>
+              <DropdownMenuTrigger asChild>
+                <button
+                  type="button"
+                  aria-label="Quick toggles"
+                  title="Quick toggles"
+                  className="inline-flex items-center justify-center size-6 rounded text-muted-foreground hover:bg-muted hover:text-foreground"
+                >
+                  <Plus className="size-3.5" />
+                </button>
+              </DropdownMenuTrigger>
+              <DropdownMenuContent align="start">
+                <DropdownMenuItem
+                  onSelect={async () => {
+                    // v1.9: tri-state collapses to two on the wire when toggled
+                    // here. null (inherit) treated as off; click flips to true.
+                    // To restore "inherit" the user opens SettingsPane.
+                    const next = webSearchEnabled === true ? false : true;
+                    try {
+                      await api.sessions.update(sessionId, { web_search_enabled: next });
+                    } catch (err) {
+                      toast.error(err instanceof Error ? err.message : 'failed to toggle web search');
+                    }
+                  }}
+                  className="text-xs"
+                >
+                  <Check className={`size-3 ${webSearchEnabled === true ? 'opacity-100' : 'opacity-0'}`} />
+                  Web search
+                </DropdownMenuItem>
+              </DropdownMenuContent>
+            </DropdownMenu>
+          )}
         </div>
       )}
       <div className="px-4 py-3 flex items-end gap-2">
@@ -476,6 +639,15 @@ export function ChatInput({ disabled, projectId, agentId, onAgentChange, onSend,
           onClose={closeMention}
         />
       )}
+      {slashState && (
+        <SkillSlashCommand
+          query={slashState.query}
+          skills={skills}
+          anchorRect={slashState.anchorRect}
+          onSelect={handleSlashSelect}
+          onClose={() => setSlashState(null)}
+        />
+      )}
     </div>
   );
 }

apps/web/src/components/ChatTabBar.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { History, MessageSquare, Plus, X } from 'lucide-react';
+import { Bot, History, MessageSquare, Plus, Terminal, X } from 'lucide-react';
 import type { Chat, WorkspacePane } from '@/api/types';
 import { StatusDot } from '@/components/StatusDot';
 import {
@@ -9,6 +9,12 @@ import {
   ContextMenuSeparator,
   ContextMenuTrigger,
 } from '@/components/ui/context-menu';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
 import { useLongPress } from '@/hooks/useLongPress';
 import { cn } from '@/lib/utils';
 
@@ -20,7 +26,7 @@ interface Props {
   onCloseOthers: (chatId: string) => void;
   onCloseToRight: (chatId: string) => void;
   onCloseAll: () => void;
-  onNewChat: () => void;
+  onAddPane: (kind: 'chat' | 'terminal' | 'agent') => void;
   onShowHistory: () => void;
   onRename: (chatId: string, name: string) => Promise<void>;
   onRemovePane?: () => void;
@@ -34,7 +40,7 @@ export function ChatTabBar({
   onCloseOthers,
   onCloseToRight,
   onCloseAll,
-  onNewChat,
+  onAddPane,
   onShowHistory,
   onRename,
   onRemovePane,
@@ -125,7 +131,7 @@ export function ChatTabBar({
               </div>
             </ContextMenuTrigger>
             <ContextMenuContent>
-              <ContextMenuItem onSelect={() => onNewChat()}>
+              <ContextMenuItem onSelect={() => onAddPane('chat')}>
                 New chat
               </ContextMenuItem>
               <ContextMenuSeparator />
@@ -164,15 +170,29 @@ export function ChatTabBar({
       )}
 
       <div className="flex items-center ml-auto gap-0.5 px-1 shrink-0">
-        <button
-          type="button"
-          onClick={onNewChat}
-          className="inline-flex items-center justify-center p-1 rounded text-muted-foreground hover:bg-muted hover:text-foreground max-md:min-h-[44px] max-md:min-w-[44px]"
-          aria-label="New chat"
-          title="New chat"
-        >
-          <Plus size={12} />
-        </button>
+        <DropdownMenu>
+          <DropdownMenuTrigger asChild>
+            <button
+              type="button"
+              className="inline-flex items-center justify-center p-1 rounded text-muted-foreground hover:bg-muted hover:text-foreground max-md:min-h-[44px] max-md:min-w-[44px]"
+              aria-label="New pane"
+              title="New pane"
+            >
+              <Plus size={12} />
+            </button>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent align="end" className="min-w-40">
+            <DropdownMenuItem onSelect={() => onAddPane('chat')}>
+              <MessageSquare size={14} /> New chat
+            </DropdownMenuItem>
+            <DropdownMenuItem onSelect={() => onAddPane('terminal')}>
+              <Terminal size={14} /> New terminal
+            </DropdownMenuItem>
+            <DropdownMenuItem onSelect={() => onAddPane('agent')}>
+              <Bot size={14} /> New agent
+            </DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
         <button
           type="button"
           onClick={onShowHistory}

apps/web/src/components/ContextBar.tsx

@@ -0,0 +1,86 @@
+import type { Message } from '@/api/types';
+
+interface Props {
+  messages: Message[];
+}
+
+// v1.11.2: persistent context-usage indicator above MessageList. Mirrors the
+// server-side compaction.usable() formula — color thresholds are computed
+// against (max - 20k buffer), not raw max, so the bar turns amber/orange
+// /red at the same boundaries auto-compaction will fire. The popover above
+// the input (ChatContextPopover) uses raw-% thresholds and is intentionally
+// kept separate (it's a different surface and a different signal).
+const COMPACTION_BUFFER = 20_000;
+
+// Walk newest-first; first message with both ctx_used and ctx_max non-null
+// AND ctx_max > 0 wins. Older messages may have ctx_used but missing ctx_max
+// (early v1 before llama-swap's n_ctx capture worked) — skip them and keep
+// walking. If nothing usable in the chat, caller renders null.
+function latestPair(messages: Message[]): { used: number; max: number } | null {
+  for (let i = messages.length - 1; i >= 0; i--) {
+    const m = messages[i]!;
+    if (m.ctx_used == null || m.ctx_max == null) continue;
+    if (m.ctx_max <= 0) continue;
+    return { used: m.ctx_used, max: m.ctx_max };
+  }
+  return null;
+}
+
+interface ColorTier {
+  // Tailwind utility for the label / numbers. Uses literal palette names
+  // rather than design tokens because we want three distinct severities
+  // (amber → orange → red) and BooCode only defines one warning token
+  // (`destructive`). Literal classes keep the gradation explicit.
+  text: string;
+  bar: string;
+}
+
+function tierFor(usablePct: number): ColorTier {
+  if (usablePct >= 0.95) return { text: 'text-red-600 dark:text-red-400', bar: 'bg-red-500' };
+  if (usablePct >= 0.80) return { text: 'text-orange-600 dark:text-orange-400', bar: 'bg-orange-500' };
+  if (usablePct >= 0.60) return { text: 'text-amber-600 dark:text-amber-400', bar: 'bg-amber-500' };
+  return { text: 'text-muted-foreground', bar: 'bg-muted-foreground/40' };
+}
+
+export function ContextBar({ messages }: Props) {
+  const pair = latestPair(messages);
+  if (!pair) return null;
+
+  const { used, max } = pair;
+  const usable = Math.max(0, max - COMPACTION_BUFFER);
+  const pct = used / max;
+  const usablePct = usable > 0 ? used / usable : 0;
+  const tier = tierFor(usablePct);
+
+  // Bar fill is clamped to [0, 100] — over-budget cases (usable < used) still
+  // show the bar at 100% red rather than overflowing the track visually.
+  const fillPct = Math.min(100, Math.max(0, pct * 100));
+  const compactionThresholdPct = max > 0 ? Math.round((usable / max) * 100) : 0;
+
+  return (
+    <div className="border-b px-4 py-1 shrink-0">
+      <div className="max-w-[1000px] mx-auto w-full">
+        <div className="flex items-baseline justify-between text-[10px] font-mono leading-tight">
+          {/* "Context" on >=sm, "Ctx" on phones to save horizontal space. */}
+          <span className={tier.text}>
+            <span className="hidden sm:inline">Context</span>
+            <span className="sm:hidden">Ctx</span>
+          </span>
+          <span
+            className={tier.text}
+            title={`Auto-compaction at ~${compactionThresholdPct}%`}
+          >
+            {used.toLocaleString()} / {max.toLocaleString()}{' '}
+            <span className="max-[380px]:hidden">({Math.round(pct * 100)}%)</span>
+          </span>
+        </div>
+        <div className="mt-1 h-1 rounded-full bg-muted overflow-hidden">
+          <div
+            className={`h-full ${tier.bar} transition-[width] duration-300`}
+            style={{ width: `${fillPct}%` }}
+          />
+        </div>
+      </div>
+    </div>
+  );
+}

apps/web/src/components/MessageBubble.tsx

@@ -1,4 +1,4 @@
-import { Children, cloneElement, isValidElement, useState } from 'react';
+import { Children, cloneElement, isValidElement, useEffect, useState } from 'react';
 import type { ReactElement, ReactNode } from 'react';
 import Markdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
@@ -7,9 +7,19 @@ import { toast } from 'sonner';
 import type { Chat, ErrorReason, Message } from '@/api/types';
 import { api } from '@/api/client';
 import { sessionEvents } from '@/hooks/sessionEvents';
+import { sendToTerminal, terminalsRegistry, type TerminalRegistration } from '@/lib/events';
 import { CapHitSentinel } from './CapHitSentinel';
 import { CodeBlock } from './CodeBlock';
 import { Button } from '@/components/ui/button';
+import {
+  ContextMenu,
+  ContextMenuContent,
+  ContextMenuItem,
+  ContextMenuSub,
+  ContextMenuSubContent,
+  ContextMenuSubTrigger,
+  ContextMenuTrigger,
+} from '@/components/ui/context-menu';
 import {
   Dialog,
   DialogContent,
@@ -19,6 +29,57 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog';
 
+// v1.10 booterm: tiny subscription hook for the mounted-terminals registry.
+// Used by the right-click "Send to terminal" submenu so it always reflects
+// currently-open terminal panes without prop drilling from Workspace.
+function useTerminals(): TerminalRegistration[] {
+  const [list, setList] = useState(() => terminalsRegistry.list());
+  useEffect(() => terminalsRegistry.subscribe(() => setList(terminalsRegistry.list())), []);
+  return list;
+}
+
+// Wrap a message body with a right-click context menu offering "Send to
+// terminal → <pane name>". The submenu is disabled when nothing is selected
+// or no terminal panes are open; clicking a target emits a sendToTerminal
+// event that TerminalPane subscribes to (filtered by pane_id).
+function SendToTerminalMenu({ children }: { children: ReactNode }) {
+  const [selection, setSelection] = useState('');
+  const terminals = useTerminals();
+  const canSend = selection.length > 0 && terminals.length > 0;
+
+  return (
+    <ContextMenu
+      onOpenChange={(open) => {
+        if (open) {
+          const sel = typeof window !== 'undefined' ? window.getSelection()?.toString() ?? '' : '';
+          setSelection(sel);
+        }
+      }}
+    >
+      <ContextMenuTrigger asChild>{children}</ContextMenuTrigger>
+      <ContextMenuContent>
+        <ContextMenuSub>
+          <ContextMenuSubTrigger disabled={!canSend}>Send to terminal</ContextMenuSubTrigger>
+          <ContextMenuSubContent>
+            {terminals.length === 0 ? (
+              <ContextMenuItem disabled>No terminal panes open</ContextMenuItem>
+            ) : (
+              terminals.map((t) => (
+                <ContextMenuItem
+                  key={t.paneId}
+                  onSelect={() => sendToTerminal.emit({ pane_id: t.paneId, text: selection })}
+                >
+                  {t.label}
+                </ContextMenuItem>
+              ))
+            )}
+          </ContextMenuSubContent>
+        </ContextMenuSub>
+      </ContextMenuContent>
+    </ContextMenu>
+  );
+}
+
 // v1.8.2: human labels for the machine-readable error reasons that ride on
 // failed assistant messages via metadata.kind === 'error'. Kept short so the
 // inline render under "message failed" stays a single muted line.
@@ -476,7 +537,70 @@ function CompactCard({ message, sessionChats }: { message: Message; sessionChats
   );
 }
 
+// v1.11 anchored rolling summary. Inserted by services/compaction.ts as a
+// role='assistant', summary=true row. Distinct from legacy CompactCard
+// (which renders the kind='compact' system rows produced by v1.10 /compact).
+// Collapsed by default; header shows the timestamp; body renders the
+// summary markdown when expanded. Copy button matches CompactCard's affordance.
+function SummaryCard({ message }: { message: Message }) {
+  const [expanded, setExpanded] = useState(false);
+  const [copied, setCopied] = useState(false);
+
+  // Use finished_at when available (that's when the summary actually landed);
+  // fall back to created_at for any row missing it. Both are ISO strings.
+  const ts = message.finished_at ?? message.created_at;
+  const headerTs = ts ? new Date(ts).toLocaleString() : '';
+
+  async function handleCopy() {
+    try {
+      await navigator.clipboard.writeText(message.content);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 1200);
+      toast.success('Summary copied to clipboard');
+    } catch {
+      toast.error('Copy failed');
+    }
+  }
+
+  return (
+    <div className="rounded-lg border border-primary/30 bg-primary/5 text-sm">
+      <div className="flex items-center gap-2 px-3 py-2">
+        <button
+          type="button"
+          onClick={() => setExpanded(!expanded)}
+          className="flex items-center gap-1.5 flex-1 min-w-0 text-left text-muted-foreground hover:text-foreground"
+        >
+          {expanded ? <ChevronDown size={14} /> : <ChevronRight size={14} />}
+          <span className="text-xs font-medium truncate">
+            Compacted summary — {headerTs}
+          </span>
+        </button>
+        <button
+          type="button"
+          onClick={() => void handleCopy()}
+          className="p-1 rounded hover:bg-muted text-muted-foreground"
+          aria-label="Copy summary"
+          title="Copy summary"
+        >
+          {copied ? <Check size={12} /> : <Copy size={12} />}
+        </button>
+      </div>
+      {expanded && (
+        <div className="px-3 pb-3 text-xs leading-relaxed border-t pt-2">
+          <MarkdownBody content={message.content} />
+        </div>
+      )}
+    </div>
+  );
+}
+
 export function MessageBubble({ message, sessionChats, capHitInfo }: Props) {
+  // v1.11: anchored rolling summary row. Checked BEFORE the kind==='compact'
+  // branch because summary=true never coexists with kind='compact' (new
+  // compactions emit role='assistant' rows with kind='message'+summary=true).
+  if (message.summary) {
+    return <SummaryCard message={message} />;
+  }
   if (message.kind === 'compact') {
     return <CompactCard message={message} sessionChats={sessionChats} />;
   }
@@ -507,9 +631,11 @@ export function MessageBubble({ message, sessionChats, capHitInfo }: Props) {
   if (message.role === 'user') {
     return (
       <div className="group flex flex-col items-end gap-1">
-        <div className="max-w-[80%] rounded-lg bg-primary text-primary-foreground px-3 py-2 text-sm whitespace-pre-wrap break-words min-w-0">
-          {message.content}
-        </div>
+        <SendToTerminalMenu>
+          <div className="max-w-[80%] rounded-lg bg-primary text-primary-foreground px-3 py-2 text-sm whitespace-pre-wrap break-words min-w-0">
+            {message.content}
+          </div>
+        </SendToTerminalMenu>
         <ActionRow message={message} />
       </div>
     );
@@ -529,12 +655,14 @@ export function MessageBubble({ message, sessionChats, capHitInfo }: Props) {
   return (
     <div className="group flex flex-col gap-2">
       {(hasContent || isStreaming) && (
-        <div className="max-w-[90%] text-sm leading-relaxed space-y-2 break-words min-w-0">
-          {hasContent ? <MarkdownBody content={message.content} /> : null}
-          {isStreaming && (
-            <span className="inline-block w-1.5 h-3.5 align-baseline bg-muted-foreground/60 animate-pulse" />
-          )}
-        </div>
+        <SendToTerminalMenu>
+          <div className="max-w-[90%] text-sm leading-relaxed space-y-2 break-words min-w-0">
+            {hasContent ? <MarkdownBody content={message.content} /> : null}
+            {isStreaming && (
+              <span className="inline-block w-1.5 h-3.5 align-baseline bg-muted-foreground/60 animate-pulse" />
+            )}
+          </div>
+        </SendToTerminalMenu>
       )}
       {failed && (
         <div className="text-xs text-destructive">

apps/web/src/components/MessageList.tsx

@@ -3,6 +3,7 @@ import type { Chat, Message } from '@/api/types';
 import { MessageBubble } from './MessageBubble';
 import { ToolCallGroup } from './ToolCallGroup';
 import { ToolCallLine, type ToolRun } from './ToolCallLine';
+import { AskUserInputCard } from './AskUserInputCard';
 
 interface Props {
   messages: Message[];
@@ -12,9 +13,11 @@ interface Props {
 // v1.8.2: pre-render units. The single linear `messages` array gets walked
 // into a render-time list where each tool_call is a first-class item and
 // tool_result messages are folded onto their matching tool_run by id.
+// Batch 9.7: tool_run carries chat_id so AskUserInputCard can post the
+// answer without threading the chat id through MessageList's parent.
 type RenderItem =
   | { kind: 'message'; message: Message; capHitInfo?: { position: number; isLatest: boolean } }
-  | { kind: 'tool_run'; run: ToolRun; key: string }
+  | { kind: 'tool_run'; run: ToolRun; key: string; chatId: string }
   | { kind: 'tool_group'; runs: ToolRun[]; key: string };
 
 const GROUP_THRESHOLD = 3;
@@ -50,7 +53,7 @@ function flatten(messages: Message[]): RenderItem[] {
       for (const tc of m.tool_calls!) {
         const run: ToolRun = { call: tc, result: null };
         runsByCallId.set(tc.id, run);
-        items.push({ kind: 'tool_run', run, key: tc.id });
+        items.push({ kind: 'tool_run', run, key: tc.id, chatId: m.chat_id });
       }
       continue;
     }
@@ -63,6 +66,9 @@ function flatten(messages: Message[]): RenderItem[] {
 // Second pass: collapse runs of >=GROUP_THRESHOLD consecutive tool_run items
 // of the same tool name into a single tool_group. Any other render item
 // (text bubble, sentinel, user message) breaks the chain.
+// Batch 9.7: ask_user_input never groups — each pause has its own card so
+// grouping would render them as collapsed ToolCallLines which can't surface
+// the interactive form.
 function group(items: RenderItem[]): RenderItem[] {
   const out: RenderItem[] = [];
   let i = 0;
@@ -74,6 +80,11 @@ function group(items: RenderItem[]): RenderItem[] {
       continue;
     }
     const name = item.run.call.name;
+    if (name === 'ask_user_input') {
+      out.push(item);
+      i += 1;
+      continue;
+    }
     let j = i + 1;
     while (
       j < items.length &&
@@ -82,7 +93,12 @@ function group(items: RenderItem[]): RenderItem[] {
     ) {
       j += 1;
     }
-    const run = items.slice(i, j) as Array<{ kind: 'tool_run'; run: ToolRun; key: string }>;
+    const run = items.slice(i, j) as Array<{
+      kind: 'tool_run';
+      run: ToolRun;
+      key: string;
+      chatId: string;
+    }>;
     if (run.length >= GROUP_THRESHOLD) {
       out.push({
         kind: 'tool_group',
@@ -150,6 +166,16 @@ export function MessageList({ messages, sessionChats }: Props) {
             );
           }
           if (item.kind === 'tool_run') {
+            if (item.run.call.name === 'ask_user_input') {
+              return (
+                <AskUserInputCard
+                  key={item.key}
+                  toolCall={item.run.call}
+                  toolResult={item.run.result}
+                  chatId={item.chatId}
+                />
+              );
+            }
             return <ToolCallLine key={item.key} run={item.run} />;
           }
           return <ToolCallGroup key={item.key} runs={item.runs} />;

apps/web/src/components/MobileTabSwitcher.tsx

@@ -1,10 +1,11 @@
-import { useState } from 'react';
+import { useRef, useState } from 'react';
 import {
   Bot,
   ChevronDown,
   Edit2,
   MessageSquare,
   MoreHorizontal,
+  Settings as SettingsIcon,
   Terminal,
   X,
 } from 'lucide-react';
@@ -30,9 +31,19 @@ interface Props {
   onRenameChat: (chatId: string, name: string) => Promise<void>;
 }
 
+// v1.10.4: swipe-left-to-close on the pane pill. Threshold matches the spec
+// (80px). Vertical bail-out at 30px because the pill sits inside a vertical
+// scrollable header — diagonal-ish swipes shouldn't accidentally close panes.
+const SWIPE_CLOSE_PX = 80;
+const SWIPE_VERTICAL_BAIL_PX = 30;
+// Visual cap: pill translates left up to this much. Past this, dragX stays
+// pinned so the user has a clear "release to close" indicator.
+const SWIPE_VISUAL_CAP = 120;
+
 function paneIcon(kind: WorkspacePane['kind']) {
   if (kind === 'terminal') return <Terminal size={14} />;
   if (kind === 'agent') return <Bot size={14} />;
+  if (kind === 'settings') return <SettingsIcon size={14} />;
   return <MessageSquare size={14} />;
 }
 
@@ -53,6 +64,7 @@ function paneLabel(pane: WorkspacePane, chats: Chat[]): string {
   if (pane.kind === 'chat') return 'Chat';
   if (pane.kind === 'terminal') return 'Terminal';
   if (pane.kind === 'agent') return 'Agent';
+  if (pane.kind === 'settings') return 'Settings';
   return 'Empty';
 }
 
@@ -67,11 +79,66 @@ export function MobileTabSwitcher({
   const [open, setOpen] = useState(false);
   const [renamingChatId, setRenamingChatId] = useState<string | null>(null);
   const [renameValue, setRenameValue] = useState('');
+  // v1.10.4: swipe-left state. dragX is the (clamped, negative) drag offset
+  // in px. suppressClick latches when a swipe completes so the trailing click
+  // doesn't pop open the BottomSheet on the just-closed pane.
+  const [dragX, setDragX] = useState(0);
+  const swipeStart = useRef<{ x: number; y: number } | null>(null);
+  const swipeBailed = useRef(false);
+  const suppressClick = useRef(false);
 
   const active = panes[activePaneIdx];
   const activeLabel = active ? paneLabel(active, chats) : 'Empty';
   const activeChatId = paneActiveChatId(active);
 
+  function onPillTouchStart(e: React.TouchEvent<HTMLDivElement>): void {
+    if (e.touches.length !== 1) return;
+    const t = e.touches[0]!;
+    swipeStart.current = { x: t.clientX, y: t.clientY };
+    swipeBailed.current = false;
+    setDragX(0);
+  }
+  function onPillTouchMove(e: React.TouchEvent<HTMLDivElement>): void {
+    if (!swipeStart.current || swipeBailed.current) return;
+    if (e.touches.length !== 1) return;
+    const t = e.touches[0]!;
+    const dx = t.clientX - swipeStart.current.x;
+    const dy = t.clientY - swipeStart.current.y;
+    // Bail to scroll if vertical motion dominates before horizontal.
+    if (Math.abs(dy) > SWIPE_VERTICAL_BAIL_PX && Math.abs(dy) > Math.abs(dx)) {
+      swipeBailed.current = true;
+      setDragX(0);
+      return;
+    }
+    // Only allow leftward drag (negative). Cap visual displacement.
+    const clamped = Math.max(-SWIPE_VISUAL_CAP, Math.min(0, dx));
+    setDragX(clamped);
+  }
+  function onPillTouchEnd(): void {
+    const finalDx = dragX;
+    swipeStart.current = null;
+    if (swipeBailed.current) {
+      setDragX(0);
+      return;
+    }
+    if (finalDx <= -SWIPE_CLOSE_PX && panes.length > 1) {
+      suppressClick.current = true;
+      // Reset dragX after the close so subsequent re-renders look right.
+      setDragX(0);
+      onRemovePane(activePaneIdx);
+      return;
+    }
+    setDragX(0);
+  }
+  function onPillClick(): void {
+    if (suppressClick.current) {
+      suppressClick.current = false;
+      return;
+    }
+    setOpen(true);
+  }
+  const swipeProgress = Math.min(1, Math.abs(dragX) / SWIPE_CLOSE_PX);
+
   // Long-press mirrors ChatTabBar: synthesize a contextmenu event on the row
   // so the trailing kebab's Radix DropdownMenu opens at the touch point.
   const longPress = useLongPress(({ clientX, clientY, target }) => {
@@ -110,17 +177,39 @@ export function MobileTabSwitcher({
 
   return (
     <>
-      <button
-        type="button"
-        onClick={() => setOpen(true)}
-        className="flex-1 inline-flex items-center gap-1.5 min-h-[44px] px-3 text-sm rounded-full bg-muted/40 hover:bg-muted/70 text-foreground min-w-0"
-        aria-label="Switch pane"
+      <div
+        className="flex-1 relative min-w-0"
+        onTouchStart={onPillTouchStart}
+        onTouchMove={onPillTouchMove}
+        onTouchEnd={onPillTouchEnd}
+        onTouchCancel={onPillTouchEnd}
       >
-        <span className="shrink-0 text-muted-foreground">{paneIcon(active?.kind ?? 'chat')}</span>
-        <StatusDot chatId={activeChatId} />
-        <span className="truncate flex-1 text-left">{activeLabel}</span>
-        <ChevronDown size={14} className="opacity-60 shrink-0" />
-      </button>
+        {/* v1.10.4: red "Close" hint behind the pill. Opacity tracks the
+            swipe progress (0 at rest, 1 at the close threshold). aria-hidden
+            because the actionable affordance is the swipe, not this label. */}
+        <div
+          aria-hidden="true"
+          className="absolute inset-0 flex items-center justify-end pr-4 rounded-full bg-destructive/80 text-destructive-foreground text-xs font-medium"
+          style={{ opacity: swipeProgress, pointerEvents: 'none' }}
+        >
+          Close
+        </div>
+        <button
+          type="button"
+          onClick={onPillClick}
+          className="flex-1 w-full inline-flex items-center gap-1.5 min-h-[44px] px-3 text-sm rounded-full bg-muted/40 hover:bg-muted/70 text-foreground min-w-0 relative"
+          aria-label="Switch pane"
+          style={{
+            transform: `translateX(${dragX}px)`,
+            transition: dragX === 0 ? 'transform 180ms ease-out' : 'none',
+          }}
+        >
+          <span className="shrink-0 text-muted-foreground">{paneIcon(active?.kind ?? 'chat')}</span>
+          <StatusDot chatId={activeChatId} />
+          <span className="truncate flex-1 text-left">{activeLabel}</span>
+          <ChevronDown size={14} className="opacity-60 shrink-0" />
+        </button>
+      </div>
 
       <BottomSheet open={open} onClose={() => setOpen(false)} title="Panes">
         <ul className="px-2 py-2 space-y-1">

apps/web/src/components/ModelPicker.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react';
-import { Check, ChevronDown } from 'lucide-react';
+import { Check, ChevronDown, Cpu } from 'lucide-react';
 import { api } from '@/api/client';
 import type { ModelInfo } from '@/api/types';
 import {
@@ -8,26 +8,94 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from '@/components/ui/dropdown-menu';
+import { BottomSheet } from '@/components/BottomSheet';
+import { useViewport } from '@/hooks/useViewport';
 
 interface Props {
   value: string;
   onChange: (model: string) => void | Promise<void>;
 }
 
+// v1.9: shared list rendered inside both shells. Lazy-fetches /api/models on
+// first open so the picker doesn't pay for a request when it's never shown.
+function ModelList({
+  models,
+  error,
+  value,
+  onPick,
+}: {
+  models: ModelInfo[] | null;
+  error: string | null;
+  value: string;
+  onPick: (id: string) => void;
+}) {
+  if (error) {
+    return <div className="px-2 py-1.5 text-xs text-destructive">{error}</div>;
+  }
+  if (models === null) {
+    return <div className="px-2 py-1.5 text-xs text-muted-foreground">Loading…</div>;
+  }
+  return (
+    <>
+      {models.map((m) => (
+        <button
+          key={m.id}
+          type="button"
+          onClick={() => onPick(m.id)}
+          className="w-full text-left flex items-center gap-2 font-mono text-xs px-2 py-1.5 hover:bg-accent rounded"
+        >
+          <Check className={`size-3 ${m.id === value ? 'opacity-100' : 'opacity-0'}`} />
+          <span className="truncate">{m.id}</span>
+        </button>
+      ))}
+    </>
+  );
+}
+
 export function ModelPicker({ value, onChange }: Props) {
+  const { isMobile } = useViewport();
   const [models, setModels] = useState<ModelInfo[] | null>(null);
   const [error, setError] = useState<string | null>(null);
   const [open, setOpen] = useState(false);
 
   useEffect(() => {
     if (!open || models !== null) return;
-    api.models()
+    api
+      .models()
       .then(setModels)
       .catch((err) =>
-        setError(err instanceof Error ? err.message : 'failed to load models')
+        setError(err instanceof Error ? err.message : 'failed to load models'),
       );
   }, [open, models]);
 
+  function handlePick(id: string) {
+    setOpen(false);
+    void onChange(id);
+  }
+
+  // v1.9: mobile = icon-only trigger + bottom-sheet shell. Desktop = labeled
+  // trigger (model name + chevron) + dropdown. Same ModelList under the hood.
+  if (isMobile) {
+    return (
+      <>
+        <button
+          type="button"
+          onClick={() => setOpen(true)}
+          aria-label={`Model: ${value}`}
+          title={value}
+          className="inline-flex items-center justify-center min-h-[44px] min-w-[44px] rounded text-muted-foreground hover:text-foreground"
+        >
+          <Cpu className="size-4" />
+        </button>
+        <BottomSheet open={open} onClose={() => setOpen(false)} title="Model">
+          <div className="px-2 py-2 space-y-1">
+            <ModelList models={models} error={error} value={value} onPick={handlePick} />
+          </div>
+        </BottomSheet>
+      </>
+    );
+  }
+
   return (
     <DropdownMenu open={open} onOpenChange={setOpen}>
       <DropdownMenuTrigger asChild>
@@ -49,7 +117,7 @@ export function ModelPicker({ value, onChange }: Props) {
         {models?.map((m) => (
           <DropdownMenuItem
             key={m.id}
-            onSelect={() => void onChange(m.id)}
+            onSelect={() => handlePick(m.id)}
             className="font-mono text-xs"
           >
             <Check

apps/web/src/components/ProjectSidebar.tsx

@@ -1,8 +1,9 @@
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { NavLink, useLocation, useNavigate } from 'react-router-dom';
-import { ChevronRight, ExternalLink, Folder, MessageSquare, Plus } from 'lucide-react';
+import { ChevronRight, ExternalLink, Folder, MessageSquare, Plus, Settings as SettingsIcon } from 'lucide-react';
 import { toast } from 'sonner';
 import { Button } from '@/components/ui/button';
+import { sessionEvents } from '@/hooks/sessionEvents';
 import {
   ContextMenu,
   ContextMenuContent,
@@ -198,7 +199,7 @@ export function ProjectSidebar() {
   const rowCls = (active: boolean) =>
     active ? 'bg-sidebar-accent text-sidebar-accent-foreground' : 'hover:bg-sidebar-accent/60';
 
-  const { open: drawerOpen } = useSidebarDrawer();
+  const { open: drawerOpen, setOpen: setDrawerOpen } = useSidebarDrawer();
   const { isMobile } = useViewport();
   const pull = usePullToRefresh(() => retry(), { enabled: isMobile });
 
@@ -412,6 +413,30 @@ export function ProjectSidebar() {
           })}
       </nav>
 
+      {/* v1.9: bottom-pinned Settings button. In a session, opens/focuses the
+          workspace settings pane via the sessionEvents bus (Session.tsx owns
+          the panesHook). Outside a session there's no workspace to mount the
+          pane in, so we navigate to /settings (themes page) instead. */}
+      <div className="border-t shrink-0 p-2">
+        <button
+          type="button"
+          onClick={() => {
+            if (activeSession) {
+              sessionEvents.emit({ type: 'open_settings_pane' });
+              if (isMobile) setDrawerOpen(false);
+            } else {
+              navigate('/settings');
+              if (isMobile) setDrawerOpen(false);
+            }
+          }}
+          className="w-full flex items-center gap-2 px-2 py-1.5 rounded-md text-sm hover:bg-sidebar-accent/60 text-sidebar-foreground"
+          aria-label="Settings"
+        >
+          <SettingsIcon className="size-3.5 shrink-0 opacity-70" />
+          <span className="flex-1 text-left">Settings</span>
+        </button>
+      </div>
+
       <AddProjectModal open={addOpen} onOpenChange={setAddOpen} onAdded={() => {}} />
 
       <Dialog open={archiveProjectConfirm !== null} onOpenChange={(open) => { if (!open) setArchiveProjectConfirm(null); }}>

apps/web/src/components/SessionLandingPage.tsx

@@ -3,7 +3,6 @@ import { Archive, MessageSquare, Send, ChevronDown, ChevronRight, RotateCcw, Tra
 import type { Chat } from '@/api/types';
 import { Button } from '@/components/ui/button';
 import { Textarea } from '@/components/ui/textarea';
-import { Input } from '@/components/ui/input';
 import {
   ContextMenu,
   ContextMenuContent,
@@ -165,7 +164,6 @@ export function SessionLandingPage({
   const [renameValue, setRenameValue] = useState('');
   const [archiveConfirm, setArchiveConfirm] = useState<Chat | null>(null);
   const [deleteConfirm, setDeleteConfirm] = useState<Chat | null>(null);
-  const [deleteInput, setDeleteInput] = useState('');
 
   const openChats = chats
     .filter((c) => c.status === 'open')
@@ -193,9 +191,6 @@ export function SessionLandingPage({
     setRenamingId(null);
   }
 
-  const deleteExpected = deleteConfirm?.name ?? '';
-  const deleteEnabled = deleteConfirm !== null && deleteInput === deleteExpected && deleteExpected.length > 0;
-
   // TODO: Landing page chat counts are a snapshot at mount. New messages in
   // visible chats won't update the per-row stats until next mount/navigation.
   return (
@@ -217,7 +212,7 @@ export function SessionLandingPage({
                     onCancelRename={() => setRenamingId(null)}
                     onContextStartRename={() => startRename(chat)}
                     onContextArchive={() => setArchiveConfirm(chat)}
-                    onContextDelete={() => { setDeleteConfirm(chat); setDeleteInput(''); }}
+                    onContextDelete={() => setDeleteConfirm(chat)}
                     showContextMenu
                     actions={
                       <>
@@ -242,7 +237,6 @@ export function SessionLandingPage({
                           onClick={(e) => {
                             e.stopPropagation();
                             setDeleteConfirm(chat);
-                            setDeleteInput('');
                           }}
                         >
                           <Trash2 size={14} />
@@ -352,36 +346,25 @@ export function SessionLandingPage({
         </DialogContent>
       </Dialog>
 
-      <Dialog open={deleteConfirm !== null} onOpenChange={(open) => { if (!open) { setDeleteConfirm(null); setDeleteInput(''); } }}>
+      <Dialog open={deleteConfirm !== null} onOpenChange={(open) => { if (!open) setDeleteConfirm(null); }}>
         <DialogContent>
           <DialogHeader>
             <DialogTitle>Delete chat?</DialogTitle>
             <DialogDescription>
-              Type the chat name to confirm:
-              {' '}
-              <span className="font-mono font-medium text-foreground">{deleteExpected || '(unnamed — cannot type-confirm)'}</span>
+              Permanently delete{' '}
+              <span className="font-mono font-medium text-foreground">{deleteConfirm?.name || '(unnamed)'}</span>
+              {' '}and all its messages. This cannot be undone.
             </DialogDescription>
           </DialogHeader>
-          <Input
-            value={deleteInput}
-            onChange={(e) => setDeleteInput(e.target.value)}
-            placeholder={deleteExpected}
-            disabled={!deleteExpected}
-          />
-          <div className="text-xs text-muted-foreground">
-            This will permanently delete this chat and all its messages. This cannot be undone.
-          </div>
           <div className="flex gap-2 justify-end pt-2">
-            <Button variant="outline" onClick={() => { setDeleteConfirm(null); setDeleteInput(''); }}>
+            <Button variant="outline" onClick={() => setDeleteConfirm(null)}>
               Cancel
             </Button>
             <Button
               variant="destructive"
-              disabled={!deleteEnabled}
               onClick={() => {
-                if (deleteConfirm && deleteEnabled) void onDeleteChat(deleteConfirm.id);
+                if (deleteConfirm) void onDeleteChat(deleteConfirm.id);
                 setDeleteConfirm(null);
-                setDeleteInput('');
               }}
             >
               Delete

apps/web/src/components/SkillSlashCommand.tsx

@@ -0,0 +1,137 @@
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { cn } from '@/lib/utils';
+import type { Skill } from '@/api/types';
+
+interface Props {
+  query: string;
+  skills: Skill[];
+  anchorRect: { top: number; left: number };
+  onSelect: (skillName: string) => void;
+  onClose: () => void;
+}
+
+// Batch 9.6: slash-command dropdown. Models FileMentionPopover's pattern —
+// fixed-positioned popover, keyboard nav, click-outside-to-close. shadcn
+// `Command` (cmdk) isn't installed in this project; per the addendum we use
+// a plain div + Tailwind instead of pulling a new primitive autonomously.
+
+// Case-insensitive prefix match on `name` only. Description is display-only
+// in v1 (substring search across description is deferred to a polish batch).
+function filterByPrefix(skills: Skill[], query: string): Skill[] {
+  const q = query.toLowerCase();
+  const filtered = q
+    ? skills.filter((s) => s.name.toLowerCase().startsWith(q))
+    : skills;
+  // Stable alphabetical ordering matches the server's cache order (skills.ts
+  // sorts on name asc) but we re-sort here so a stale client cache doesn't
+  // surprise the user.
+  return [...filtered].sort((a, b) => a.name.localeCompare(b.name));
+}
+
+export function SkillSlashCommand({ query, skills, anchorRect, onSelect, onClose }: Props) {
+  const [highlightIndex, setHighlightIndex] = useState(0);
+  const popoverRef = useRef<HTMLDivElement>(null);
+  const filtered = useMemo(() => filterByPrefix(skills, query), [skills, query]);
+
+  useEffect(() => { setHighlightIndex(0); }, [query]);
+
+  // Arrow / Enter / Tab / Escape. Bound on document so keystrokes from the
+  // textarea reach the popover even though focus stays in the textarea.
+  useEffect(() => {
+    function handleKeyDown(e: KeyboardEvent) {
+      if (e.key === 'ArrowDown') {
+        e.preventDefault();
+        setHighlightIndex((prev) => (prev < filtered.length - 1 ? prev + 1 : 0));
+      } else if (e.key === 'ArrowUp') {
+        e.preventDefault();
+        setHighlightIndex((prev) => (prev > 0 ? prev - 1 : filtered.length - 1));
+      } else if (e.key === 'Enter' || e.key === 'Tab') {
+        if (filtered.length === 0) return;
+        e.preventDefault();
+        const target = filtered[highlightIndex] ?? filtered[0];
+        if (target) onSelect(target.name);
+      } else if (e.key === 'Escape') {
+        e.preventDefault();
+        onClose();
+      }
+    }
+    document.addEventListener('keydown', handleKeyDown);
+    return () => document.removeEventListener('keydown', handleKeyDown);
+  }, [filtered, highlightIndex, onSelect, onClose]);
+
+  useEffect(() => {
+    function handleMouseDown(e: MouseEvent) {
+      if (popoverRef.current && !popoverRef.current.contains(e.target as Node)) {
+        onClose();
+      }
+    }
+    document.addEventListener('mousedown', handleMouseDown);
+    return () => document.removeEventListener('mousedown', handleMouseDown);
+  }, [onClose]);
+
+  useEffect(() => {
+    const el = popoverRef.current?.querySelector('[data-highlighted="true"]');
+    if (el) el.scrollIntoView({ block: 'nearest' });
+  }, [highlightIndex]);
+
+  // Anchor sits above the input — translate(-100%) on Y so the dropdown
+  // expands upward from the anchor point rather than over the textarea.
+  const style = {
+    top: anchorRect.top,
+    left: anchorRect.left,
+    transform: 'translateY(-100%)',
+  } as const;
+
+  if (filtered.length === 0) {
+    return (
+      <div
+        ref={popoverRef}
+        className="fixed z-50 bg-popover border border-border rounded-md shadow min-w-[320px] p-2"
+        style={style}
+      >
+        <div className="text-xs text-muted-foreground px-2 py-1">
+          {query ? `No skill starts with "/${query}"` : 'No skills available'}
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div
+      ref={popoverRef}
+      className="fixed z-50 bg-popover border border-border rounded-md shadow min-w-[320px] max-w-[420px] max-h-[320px] overflow-y-auto"
+      style={style}
+    >
+      {filtered.map((skill, i) => (
+        <button
+          key={skill.name}
+          type="button"
+          data-highlighted={i === highlightIndex}
+          className={cn(
+            'w-full text-left px-2.5 py-2 cursor-pointer block',
+            i === highlightIndex && 'bg-muted',
+          )}
+          onMouseEnter={() => setHighlightIndex(i)}
+          onMouseDown={(e) => {
+            // mousedown not click — click runs after blur/focus shuffles which
+            // can race with the textarea's onBlur close path.
+            e.preventDefault();
+            onSelect(skill.name);
+          }}
+        >
+          <div className="font-mono text-xs font-bold text-foreground">/{skill.name}</div>
+          <div
+            className="text-xs text-muted-foreground overflow-hidden"
+            style={{
+              display: '-webkit-box',
+              WebkitLineClamp: 2,
+              WebkitBoxOrient: 'vertical',
+            }}
+          >
+            {skill.description}
+          </div>
+        </button>
+      ))}
+    </div>
+  );
+}

apps/web/src/components/ThemePicker.tsx

@@ -0,0 +1,122 @@
+import { useState } from 'react';
+import { Check } from 'lucide-react';
+import { toast } from 'sonner';
+import { Card } from '@/components/ui/card';
+import { Label } from '@/components/ui/label';
+import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
+import { THEMES, setTheme, useTheme, type ThemeId, type ThemeMode } from '@/lib/theme';
+import { cn } from '@/lib/utils';
+
+// v1.9: lifted out of pages/Settings.tsx so the SettingsPane Theme tab and
+// the standalone /settings route render the same picker. Theme is global —
+// not per-project, not per-session — so no contextual props are needed.
+
+const MODES: { value: ThemeMode; label: string; hint: string }[] = [
+  { value: 'dark', label: 'Dark', hint: 'Use the dark variant.' },
+  { value: 'light', label: 'Light', hint: 'Use the light variant.' },
+  { value: 'system', label: 'System', hint: 'Follow OS preference.' },
+];
+
+export function ThemePicker() {
+  const { id: currentId, mode: currentMode } = useTheme();
+  // Track the most recent in-flight pick so the picker can show a subtle
+  // "applying…" state on the targeted card while the PATCH is in flight.
+  const [pending, setPending] = useState<
+    { kind: 'theme'; id: ThemeId } | { kind: 'mode'; mode: ThemeMode } | null
+  >(null);
+
+  async function pickTheme(id: ThemeId) {
+    if (id === currentId || pending) return;
+    setPending({ kind: 'theme', id });
+    try {
+      await setTheme(id, currentMode);
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'failed to apply theme');
+    } finally {
+      setPending(null);
+    }
+  }
+
+  async function pickMode(mode: ThemeMode) {
+    if (mode === currentMode || pending) return;
+    setPending({ kind: 'mode', mode });
+    try {
+      await setTheme(currentId, mode);
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'failed to apply mode');
+    } finally {
+      setPending(null);
+    }
+  }
+
+  return (
+    <div className="space-y-8">
+      <section className="space-y-3">
+        <h2 className="text-sm font-medium">Mode</h2>
+        <RadioGroup
+          value={currentMode}
+          onValueChange={(v) => void pickMode(v as ThemeMode)}
+          className="flex flex-wrap gap-4"
+        >
+          {MODES.map((m) => (
+            <div key={m.value} className="flex items-center gap-2">
+              <RadioGroupItem id={`mode-${m.value}`} value={m.value} />
+              <Label htmlFor={`mode-${m.value}`} className="cursor-pointer">
+                <span className="font-medium">{m.label}</span>
+                <span className="ml-2 text-xs text-muted-foreground">{m.hint}</span>
+              </Label>
+            </div>
+          ))}
+        </RadioGroup>
+      </section>
+
+      <section className="space-y-3">
+        <h2 className="text-sm font-medium">Theme</h2>
+        <div className="grid grid-cols-2 md:grid-cols-3 gap-3">
+          {THEMES.map((t) => {
+            const isActive = t.id === currentId;
+            const isPending = pending?.kind === 'theme' && pending.id === t.id;
+            const isLightOnly = !t.supportsDark;
+            return (
+              <Card
+                key={t.id}
+                onClick={() => void pickTheme(t.id)}
+                className={cn(
+                  'p-3 cursor-pointer transition-colors',
+                  'hover:bg-accent/10',
+                  isActive && 'ring-2 ring-ring',
+                  isPending && 'opacity-60',
+                )}
+              >
+                <div className="flex items-center justify-between gap-2">
+                  <div className="min-w-0">
+                    <div className="font-mono text-sm truncate">{t.name}</div>
+                    <div className="text-xs text-muted-foreground">{t.family}</div>
+                  </div>
+                  {isActive && (
+                    <span className="inline-flex items-center gap-1 text-xs text-primary shrink-0">
+                      <Check className="size-3" /> Selected
+                    </span>
+                  )}
+                </div>
+                <div className="flex mt-2 rounded overflow-hidden border border-border/40">
+                  {t.anchors.map((hex, i) => (
+                    <div
+                      key={i}
+                      className="flex-1 h-6"
+                      style={{ backgroundColor: hex }}
+                      aria-hidden="true"
+                    />
+                  ))}
+                </div>
+                {isLightOnly && (
+                  <div className="mt-2 text-xs text-muted-foreground italic">Light only</div>
+                )}
+              </Card>
+            );
+          })}
+        </div>
+      </section>
+    </div>
+  );
+}

apps/web/src/components/Workspace.tsx

@@ -1,9 +1,13 @@
-import { PanelRight, MessageSquare, Terminal, Bot } from 'lucide-react';
-import type { Chat, WorkspacePane } from '@/api/types';
+import { useEffect, useMemo, useState } from 'react';
+import { PanelRight, MessageSquare, Terminal, Bot, Clipboard, Plus, X } from 'lucide-react';
+import type { Chat, Project, Session, WorkspacePane } from '@/api/types';
 import { MAX_PANES, type UseWorkspacePanesResult } from '@/hooks/useWorkspacePanes';
 import type { UseSessionChatsResult } from '@/hooks/useSessionChats';
 import { useViewport } from '@/hooks/useViewport';
+import { terminalsRegistry } from '@/lib/events';
 import { ChatPane } from '@/components/panes/ChatPane';
+import { SettingsPane } from '@/components/panes/SettingsPane';
+import { TerminalPane } from '@/components/panes/TerminalPane';
 import { ChatTabBar } from '@/components/ChatTabBar';
 import { SessionLandingPage } from '@/components/SessionLandingPage';
 import {
@@ -24,6 +28,9 @@ interface Props {
   // (MobileTabSwitcher) can share state with the pane grid.
   panesHook: UseWorkspacePanesResult;
   chatsHook: UseSessionChatsResult;
+  // v1.9: passed through to SettingsPane when one is mounted in the grid.
+  session: Session;
+  project: Project | null;
 }
 
 export function Workspace({
@@ -33,6 +40,8 @@ export function Workspace({
   onAgentChange,
   panesHook,
   chatsHook,
+  session,
+  project,
 }: Props) {
   const {
     panes,
@@ -67,12 +76,61 @@ export function Workspace({
 
   const { isMobile } = useViewport();
 
+  // v1.9: workspace-level maximize state for the settings pane. CSS-only:
+  // sibling panes get display:none, the maximized pane fills the grid cell.
+  // ESC listener only mounted while maximized. Mobile is always full-width
+  // for a single pane so maximize doesn't apply.
+  const [maximized, setMaximized] = useState(false);
+  const settingsIdx = panes.findIndex((p) => p.kind === 'settings');
+
+  // Esc semantics: maximized → restore; otherwise → close settings pane (only
+  // when it's the active pane). Bail when the user is typing in a field or
+  // inside an open dialog so we don't eat their cancel keystroke.
+  useEffect(() => {
+    if (settingsIdx < 0) return;
+    function onKey(e: KeyboardEvent) {
+      if (e.key !== 'Escape') return;
+      const t = e.target;
+      if (t instanceof HTMLElement) {
+        if (t.tagName === 'INPUT' || t.tagName === 'TEXTAREA' || t.isContentEditable) return;
+        if (t.closest('[role="dialog"]')) return;
+      }
+      if (maximized) {
+        setMaximized(false);
+      } else if (activePaneIdx === settingsIdx) {
+        removePane(settingsIdx);
+      }
+    }
+    window.addEventListener('keydown', onKey);
+    return () => window.removeEventListener('keydown', onKey);
+  }, [maximized, settingsIdx, activePaneIdx, removePane]);
+
+  // If the settings pane was closed (no longer in panes) while maximized,
+  // clear the maximize state so the grid renders normally.
+  useEffect(() => {
+    if (maximized && settingsIdx < 0) setMaximized(false);
+  }, [maximized, settingsIdx]);
+
   function chatsForPane(pane: WorkspacePane): Chat[] {
     return pane.chatIds
       .map((id) => chats.find((c) => c.id === id))
       .filter((c): c is Chat => c !== undefined);
   }
 
+  // v1.10 booterm: per-terminal label used by the registry that powers the
+  // MessageBubble "Send to terminal" submenu. Numbered in workspace order.
+  const terminalLabels = useMemo(() => {
+    const out = new Map<string, string>();
+    let n = 0;
+    for (const p of panes) {
+      if (p.kind === 'terminal') {
+        n += 1;
+        out.set(p.id, `Terminal ${n}`);
+      }
+    }
+    return out;
+  }, [panes]);
+
   return (
     <div className="flex flex-col h-full min-h-0">
       {!isMobile && (
@@ -81,10 +139,12 @@ export function Workspace({
             <DropdownMenuTrigger asChild>
               <button
                 type="button"
-                disabled={panes.length >= MAX_PANES}
+                // v1.9: settings panes excluded from the MAX cap (decision c).
+                disabled={panes.filter((p) => p.kind !== 'settings').length >= MAX_PANES}
                 className={cn(
                   'flex items-center gap-1 text-xs px-2 py-1 rounded hover:bg-muted',
-                  panes.length >= MAX_PANES && 'opacity-40 cursor-not-allowed hover:bg-transparent'
+                  panes.filter((p) => p.kind !== 'settings').length >= MAX_PANES &&
+                    'opacity-40 cursor-not-allowed hover:bg-transparent'
                 )}
               >
                 <PanelRight size={14} />
@@ -114,12 +174,28 @@ export function Workspace({
         style={
           isMobile
             ? undefined
-            : { gridTemplateColumns: `repeat(${panes.length}, minmax(0, 1fr))` }
+            : maximized && settingsIdx >= 0
+              ? { gridTemplateColumns: 'minmax(0, 1fr)' }
+              : { gridTemplateColumns: `repeat(${panes.length}, minmax(0, 1fr))` }
         }
       >
         {panes.map((pane, idx) => {
-          const visible = !isMobile || idx === activePaneIdx;
-          if (!visible) return null;
+          const isSettings = pane.kind === 'settings';
+          const isTerminal = pane.kind === 'terminal';
+          // v1.9: when maximized, hide every pane except the settings one.
+          // display:none keeps the React tree mounted so streams / drafts
+          // survive the toggle without re-mount cost.
+          const hiddenForMaximize = !isMobile && maximized && idx !== settingsIdx;
+          const visible = (!isMobile || idx === activePaneIdx) && !hiddenForMaximize;
+          if (!visible) {
+            if (hiddenForMaximize) {
+              return <div key={pane.id} className="hidden" />;
+            }
+            return null;
+          }
+          // Terminal panes own their tab strip (no chats, no ChatTabBar) and
+          // are not drag-reorderable for now — keeps the layout grid simple.
+          const isChromeless = isSettings || isTerminal;
           return (
           <div
             key={pane.id}
@@ -131,19 +207,18 @@ export function Workspace({
                 'before:absolute before:inset-y-0 before:left-0 before:w-0.5 before:bg-primary before:z-10'
             )}
             onClick={() => setActivePaneIdx(idx)}
-            onDragOver={!isMobile && panes.length > 1 ? handlePaneDragOver(idx) : undefined}
-            onDragLeave={!isMobile && panes.length > 1 ? handlePaneDragLeave : undefined}
-            onDrop={!isMobile && panes.length > 1 ? handlePaneDrop(idx) : undefined}
+            onDragOver={!isMobile && !isChromeless && panes.length > 1 ? handlePaneDragOver(idx) : undefined}
+            onDragLeave={!isMobile && !isChromeless && panes.length > 1 ? handlePaneDragLeave : undefined}
+            onDrop={!isMobile && !isChromeless && panes.length > 1 ? handlePaneDrop(idx) : undefined}
           >
             <div
-              draggable={!isMobile && panes.length > 1}
-              onDragStart={!isMobile && panes.length > 1 ? handlePaneDragStart(idx) : undefined}
-              onDragEnd={!isMobile && panes.length > 1 ? handlePaneDragEnd : undefined}
+              draggable={!isMobile && !isChromeless && panes.length > 1}
+              onDragStart={!isMobile && !isChromeless && panes.length > 1 ? handlePaneDragStart(idx) : undefined}
+              onDragEnd={!isMobile && !isChromeless && panes.length > 1 ? handlePaneDragEnd : undefined}
             >
-              {/* Hidden on mobile per v1.8: chat-within-pane navigation
-                  is not exposed on small screens; users switch panes via
-                  the header pill instead. */}
-              {!isMobile && (
+              {/* Hidden on mobile per v1.8; settings + terminal panes own
+                  their own header (no chats, so no ChatTabBar). */}
+              {!isMobile && !isChromeless && (
                 <ChatTabBar
                   pane={pane}
                   tabs={chatsForPane(pane)}
@@ -152,16 +227,98 @@ export function Workspace({
                   onCloseOthers={(chatId) => closeOtherTabs(idx, chatId)}
                   onCloseToRight={(chatId) => closeTabsToRight(idx, chatId)}
                   onCloseAll={() => closeAllTabs(idx)}
-                  onNewChat={() => void createChat(idx)}
+                  onAddPane={(kind) => {
+                    if (kind === 'chat') void createChat(idx);
+                    else addSplitPane(kind);
+                  }}
                   onShowHistory={() => showLandingPage(idx)}
                   onRename={renameChat}
                   onRemovePane={panes.length > 1 ? () => removePane(idx) : undefined}
                 />
               )}
+              {isTerminal && (
+                <div className="flex items-center gap-2 border-b border-border bg-muted/30 px-2 py-1 shrink-0">
+                  <Terminal size={12} className="text-muted-foreground" />
+                  <span className="text-xs text-muted-foreground">
+                    {terminalLabels.get(pane.id) ?? 'Terminal'}
+                  </span>
+                  <DropdownMenu>
+                    <DropdownMenuTrigger asChild>
+                      <button
+                        type="button"
+                        onClick={(e) => e.stopPropagation()}
+                        className="ml-auto inline-flex items-center justify-center size-5 rounded text-muted-foreground hover:bg-muted hover:text-foreground max-md:size-7"
+                        aria-label="New pane"
+                        title="New pane"
+                      >
+                        <Plus size={12} />
+                      </button>
+                    </DropdownMenuTrigger>
+                    <DropdownMenuContent align="end" className="min-w-40">
+                      <DropdownMenuItem onSelect={() => addSplitPane('chat')}>
+                        <MessageSquare size={14} /> New chat
+                      </DropdownMenuItem>
+                      <DropdownMenuItem onSelect={() => addSplitPane('terminal')}>
+                        <Terminal size={14} /> New terminal
+                      </DropdownMenuItem>
+                      <DropdownMenuItem onSelect={() => addSplitPane('agent')}>
+                        <Bot size={14} /> New agent
+                      </DropdownMenuItem>
+                    </DropdownMenuContent>
+                  </DropdownMenu>
+                  {/* v1.10.4: iOS Safari restricts navigator.clipboard.readText
+                      outside direct user gestures. A real button click IS a
+                      gesture, so this works where keystroke-driven paste may
+                      not on iOS. The action lives in TerminalPane behind the
+                      registry's paste() callback. */}
+                  <button
+                    type="button"
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      terminalsRegistry.get(pane.id)?.paste();
+                    }}
+                    className="inline-flex items-center justify-center size-5 rounded text-muted-foreground hover:bg-muted hover:text-foreground max-md:size-7"
+                    aria-label="Paste from clipboard"
+                    title="Paste from clipboard"
+                  >
+                    <Clipboard size={12} />
+                  </button>
+                  {panes.length > 1 && (
+                    <button
+                      type="button"
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        removePane(idx);
+                      }}
+                      className="inline-flex items-center justify-center size-5 rounded text-muted-foreground hover:bg-muted hover:text-foreground max-md:size-7"
+                      aria-label="Close terminal pane"
+                      title="Close terminal pane"
+                    >
+                      <X size={12} />
+                    </button>
+                  )}
+                </div>
+              )}
             </div>
 
             <div className="flex-1 min-h-0 overflow-hidden">
-              {pane.kind === 'chat' && pane.chatId ? (
+              {isSettings && project ? (
+                <SettingsPane
+                  session={session}
+                  project={project}
+                  maximized={maximized}
+                  onToggleMaximize={() => setMaximized((v) => !v)}
+                  onClose={() => removePane(idx)}
+                  isMobile={isMobile}
+                />
+              ) : isTerminal ? (
+                <TerminalPane
+                  sessionId={sessionId}
+                  paneId={pane.id}
+                  label={terminalLabels.get(pane.id) ?? 'Terminal'}
+                  active={idx === activePaneIdx}
+                />
+              ) : pane.kind === 'chat' && pane.chatId ? (
                 <ChatPane
                   sessionId={sessionId}
                   chatId={pane.chatId}
@@ -169,6 +326,7 @@ export function Workspace({
                   agentId={agentId}
                   onAgentChange={onAgentChange}
                   sessionChats={chats}
+                  webSearchEnabled={session.web_search_enabled}
                 />
               ) : (
                 <SessionLandingPage

apps/web/src/components/panes/ChatPane.tsx

@@ -7,6 +7,7 @@ import { useChatContextStats } from '@/hooks/useChatContextStats';
 import { MessageList } from '@/components/MessageList';
 import { ChatInput } from '@/components/ChatInput';
 import { ChatContextPopover } from '@/components/ChatContextPopover';
+import { ContextBar } from '@/components/ContextBar';
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -22,9 +23,13 @@ interface Props {
   agentId?: string | null;
   onAgentChange?: (agentId: string | null) => void | Promise<void>;
   sessionChats?: import('@/api/types').Chat[];
+  // v1.9: threaded down to ChatInput's + menu (Web search quick toggle).
+  // null means "inherit project default" — ChatInput PATCHes with the
+  // opposite of the effective value.
+  webSearchEnabled?: boolean | null;
 }
 
-export function ChatPane({ sessionId, chatId, projectId, agentId, onAgentChange, sessionChats }: Props) {
+export function ChatPane({ sessionId, chatId, projectId, agentId, onAgentChange, sessionChats, webSearchEnabled }: Props) {
   const stream = useSessionStream(sessionId);
   const lastErrorRef = useRef<string | null>(null);
   const [queue, setQueue] = useState<string[]>([]);
@@ -92,6 +97,18 @@ export function ChatPane({ sessionId, chatId, projectId, agentId, onAgentChange,
     }
   }, [chatId]);
 
+  // Batch 9.6: slash-command dispatch. Sent regardless of streaming state —
+  // matches the existing /compact precedent (which also fires immediately).
+  // Empty args go to the server as null; the server fills in a default user
+  // message ("Apply this skill.") so the model has something to act on.
+  const handleSlashCommand = useCallback(async (skillName: string, userMessage: string) => {
+    try {
+      await api.chats.skillInvoke(chatId, skillName, userMessage.length > 0 ? userMessage : null);
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : `/${skillName} failed`);
+    }
+  }, [chatId]);
+
   function removeQueued(idx: number) {
     setQueue((prev) => prev.filter((_, i) => i !== idx));
   }
@@ -109,6 +126,10 @@ export function ChatPane({ sessionId, chatId, projectId, agentId, onAgentChange,
 
   return (
     <div className="flex flex-col h-full min-h-0">
+      {/* v1.11.2: persistent context-usage indicator. Renders null when there
+          are no assistant messages yet (fresh chat). shrink-0 keeps it out of
+          the MessageList scroll region — bar stays pinned, list scrolls. */}
+      <ContextBar messages={chatMessages} />
       <MessageList messages={chatMessages} sessionChats={sessionChats} />
 
       {/* Queued messages */}
@@ -173,10 +194,15 @@ export function ChatPane({ sessionId, chatId, projectId, agentId, onAgentChange,
         <ChatInput
           disabled={false}
           projectId={projectId}
+          sessionId={sessionId}
           agentId={agentId}
           onAgentChange={onAgentChange}
+          webSearchEnabled={webSearchEnabled}
           onSend={handleSend}
           onForceSend={streaming ? handleForceSend : undefined}
+          onSlashCommand={handleSlashCommand}
+          chatId={chatId}
+          chatLabel={sessionChats?.find((c) => c.id === chatId)?.name ?? 'Chat'}
         />
       </div>
     </div>

apps/web/src/components/panes/SettingsPane.tsx

@@ -0,0 +1,530 @@
+import { useEffect, useState } from 'react';
+import { Archive, Maximize2, Minimize2, X } from 'lucide-react';
+import { toast } from 'sonner';
+import { api } from '@/api/client';
+import type { Project, Session } from '@/api/types';
+import { Button } from '@/components/ui/button';
+import { Textarea } from '@/components/ui/textarea';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog';
+import { ModelPicker } from '@/components/ModelPicker';
+import { ThemePicker } from '@/components/ThemePicker';
+import { cn } from '@/lib/utils';
+
+type Section = 'session' | 'project' | 'theme';
+
+interface Props {
+  session: Session;
+  project: Project;
+  maximized: boolean;
+  onToggleMaximize: () => void;
+  onClose: () => void;
+  isMobile: boolean;
+}
+
+// v1.9: hand-rolled Switch primitive. No shadcn switch in the existing
+// ui/ set and the dispatch said don't pnpm dlx for v1.9 either. Single
+// purpose — clicking flips aria-checked + calls onCheckedChange.
+function Switch({
+  checked,
+  onCheckedChange,
+  disabled,
+  id,
+}: {
+  checked: boolean;
+  onCheckedChange: (v: boolean) => void;
+  disabled?: boolean;
+  id?: string;
+}) {
+  return (
+    <button
+      id={id}
+      type="button"
+      role="switch"
+      aria-checked={checked}
+      disabled={disabled}
+      onClick={() => onCheckedChange(!checked)}
+      className={cn(
+        'relative inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full transition-colors',
+        checked ? 'bg-primary' : 'bg-muted',
+        disabled && 'opacity-50 cursor-not-allowed',
+      )}
+    >
+      <span
+        className={cn(
+          'inline-block h-4 w-4 transform rounded-full bg-background transition-transform',
+          checked ? 'translate-x-[1.125rem]' : 'translate-x-0.5',
+        )}
+      />
+    </button>
+  );
+}
+
+export function SettingsPane({ session, project, maximized, onToggleMaximize, onClose, isMobile }: Props) {
+  const [activeSection, setActiveSection] = useState<Section>('session');
+
+  return (
+    <div className="flex flex-col h-full min-h-0">
+      <div className="flex items-center gap-2 border-b border-border bg-muted/20 px-3 py-1.5 shrink-0">
+        <div className="flex items-center gap-1 flex-1 min-w-0">
+          {(['session', 'project', 'theme'] as const).map((s) => (
+            <button
+              key={s}
+              type="button"
+              onClick={() => setActiveSection(s)}
+              className={cn(
+                'text-xs px-2 py-1 rounded capitalize',
+                activeSection === s
+                  ? 'bg-background text-foreground'
+                  : 'text-muted-foreground hover:bg-muted',
+              )}
+            >
+              {s}
+            </button>
+          ))}
+        </div>
+        {!isMobile && (
+          <button
+            type="button"
+            onClick={onToggleMaximize}
+            className="inline-flex items-center justify-center p-1 rounded text-muted-foreground hover:bg-muted hover:text-foreground"
+            aria-label={maximized ? 'Restore' : 'Maximize'}
+            title={maximized ? 'Restore (Esc)' : 'Maximize'}
+          >
+            {maximized ? <Minimize2 size={14} /> : <Maximize2 size={14} />}
+          </button>
+        )}
+        <button
+          type="button"
+          onClick={onClose}
+          className="inline-flex items-center justify-center p-1 rounded text-muted-foreground hover:bg-muted hover:text-foreground max-md:min-h-[44px] max-md:min-w-[44px]"
+          aria-label="Close settings"
+          title="Close (Esc)"
+        >
+          <X size={14} />
+        </button>
+      </div>
+
+      <div className="flex-1 overflow-y-auto">
+        <div className="max-w-[720px] mx-auto w-full px-4 py-4 space-y-6">
+          {activeSection === 'session' && <SessionSection session={session} project={project} />}
+          {activeSection === 'project' && <ProjectSection project={project} />}
+          {activeSection === 'theme' && <ThemePicker />}
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function SessionSection({ session, project }: { session: Session; project: Project }) {
+  const [name, setName] = useState(session.name);
+  const [systemPrompt, setSystemPrompt] = useState(session.system_prompt);
+  // v1.9: tri-state on the wire (null = inherit). UI surfaces a 3-way toggle
+  // via "Inherit project default" checkbox plus the override switch.
+  const [webSearch, setWebSearch] = useState<boolean | null>(session.web_search_enabled);
+  const [saving, setSaving] = useState(false);
+  // v1.9: bulk-archive chats. Two-step: openChatsCount → confirm dialog →
+  // archiveAllChats. Server publishes one chat_archived frame per id so
+  // useSidebar / chat lists update incrementally.
+  const [archiveOpen, setArchiveOpen] = useState(false);
+  const [archiveCount, setArchiveCount] = useState(0);
+  const [archiving, setArchiving] = useState(false);
+
+  useEffect(() => {
+    setName(session.name);
+    setSystemPrompt(session.system_prompt);
+    setWebSearch(session.web_search_enabled);
+  }, [session.id, session.name, session.system_prompt, session.web_search_enabled]);
+
+  const dirty =
+    name !== session.name ||
+    systemPrompt !== session.system_prompt ||
+    webSearch !== session.web_search_enabled;
+
+  const effectiveWebSearch = webSearch ?? project.default_web_search_enabled;
+  const projectPreview = project.default_system_prompt.trim().slice(0, 200);
+
+  async function save() {
+    if (saving) return;
+    setSaving(true);
+    try {
+      await api.sessions.update(session.id, {
+        name: name.trim() || session.name,
+        system_prompt: systemPrompt,
+        web_search_enabled: webSearch,
+      });
+      toast.success('Session saved');
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'save failed');
+    } finally {
+      setSaving(false);
+    }
+  }
+
+  async function resetSystemPrompt() {
+    if (saving) return;
+    setSaving(true);
+    try {
+      await api.sessions.update(session.id, { system_prompt: '' });
+      toast.success('Reset to project default');
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'reset failed');
+    } finally {
+      setSaving(false);
+    }
+  }
+
+  async function openArchiveDialog() {
+    if (archiving) return;
+    try {
+      const { count } = await api.sessions.openChatsCount(session.id);
+      if (count === 0) {
+        toast('No open chats to archive.');
+        return;
+      }
+      setArchiveCount(count);
+      setArchiveOpen(true);
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'failed to count chats');
+    }
+  }
+
+  async function confirmArchive() {
+    if (archiving) return;
+    setArchiving(true);
+    try {
+      const { archived } = await api.sessions.archiveAllChats(session.id);
+      toast.success(`Archived ${archived} chat${archived === 1 ? '' : 's'}`);
+      setArchiveOpen(false);
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'archive failed');
+    } finally {
+      setArchiving(false);
+    }
+  }
+
+  return (
+    <div className="space-y-6">
+      <div className="space-y-1.5">
+        <label className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
+          Session name
+        </label>
+        <input
+          type="text"
+          value={name}
+          onChange={(e) => setName(e.target.value)}
+          className="w-full bg-background border border-border rounded px-2 py-1.5 text-sm outline-none focus:border-ring"
+        />
+      </div>
+
+      <div className="space-y-1.5">
+        <label className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
+          Model
+        </label>
+        <div className="inline-flex items-center rounded-full bg-muted/40 hover:bg-muted/70 px-1">
+          <ModelPicker
+            value={session.model}
+            onChange={async (model) => {
+              try {
+                await api.sessions.update(session.id, { model });
+                toast.success('Model updated');
+              } catch (err) {
+                toast.error(err instanceof Error ? err.message : 'failed to set model');
+              }
+            }}
+          />
+        </div>
+      </div>
+
+      <div className="space-y-1.5">
+        <div className="flex items-center justify-between gap-3">
+          <label htmlFor="session-web-search" className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
+            Web search
+          </label>
+          <Switch
+            id="session-web-search"
+            checked={effectiveWebSearch}
+            onCheckedChange={(v) => setWebSearch(v)}
+          />
+        </div>
+        <div className="flex items-center gap-2 text-xs text-muted-foreground">
+          <input
+            type="checkbox"
+            id="session-web-search-inherit"
+            checked={webSearch === null}
+            onChange={(e) => setWebSearch(e.target.checked ? null : project.default_web_search_enabled)}
+          />
+          <label htmlFor="session-web-search-inherit" className="cursor-pointer">
+            Inherit project default ({project.default_web_search_enabled ? 'on' : 'off'})
+          </label>
+        </div>
+        <p className="text-xs text-muted-foreground italic">
+          Plumbed for Batch 8 (web_search tool). No effect yet.
+        </p>
+      </div>
+
+      <div className="space-y-1.5">
+        <div className="flex items-center justify-between gap-3">
+          <label className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
+            System prompt
+          </label>
+          <button
+            type="button"
+            onClick={() => void resetSystemPrompt()}
+            disabled={saving || session.system_prompt === ''}
+            className="text-xs text-muted-foreground hover:text-foreground disabled:opacity-40 disabled:cursor-not-allowed"
+          >
+            Reset to project default
+          </button>
+        </div>
+        <Textarea
+          value={systemPrompt}
+          onChange={(e) => setSystemPrompt(e.target.value)}
+          rows={6}
+          className="resize-y min-h-[120px] max-h-[60vh]"
+          placeholder="Per-session override (optional). Empty = inherit project default."
+        />
+        {systemPrompt.trim().length === 0 && projectPreview.length > 0 && (
+          <p className="text-xs text-muted-foreground">
+            Falls back to project default: <span className="italic">{projectPreview}{projectPreview.length === 200 ? '…' : ''}</span>
+          </p>
+        )}
+      </div>
+
+      <div className="flex justify-end gap-2">
+        <Button onClick={() => void save()} disabled={!dirty || saving}>
+          {saving ? 'Saving…' : 'Save'}
+        </Button>
+      </div>
+
+      <div className="border-t pt-4">
+        <Button
+          variant="outline"
+          onClick={() => void openArchiveDialog()}
+          disabled={archiving}
+          className="gap-1.5"
+        >
+          <Archive size={14} /> Archive all chats
+        </Button>
+      </div>
+
+      <Dialog open={archiveOpen} onOpenChange={(open) => { if (!archiving) setArchiveOpen(open); }}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>Archive all chats?</DialogTitle>
+            <DialogDescription>
+              Archive {archiveCount} open chat{archiveCount === 1 ? '' : 's'} in this session?
+              Archived chats stay accessible via the archive view.
+            </DialogDescription>
+          </DialogHeader>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setArchiveOpen(false)} disabled={archiving}>
+              Cancel
+            </Button>
+            <Button onClick={() => void confirmArchive()} disabled={archiving}>
+              {archiving ? 'Archiving…' : `Archive ${archiveCount}`}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </div>
+  );
+}
+
+function ProjectSection({ project }: { project: Project }) {
+  const [name, setName] = useState(project.name);
+  const [defaultPrompt, setDefaultPrompt] = useState(project.default_system_prompt);
+  const [defaultWebSearch, setDefaultWebSearch] = useState(project.default_web_search_enabled);
+  const [saving, setSaving] = useState(false);
+  // v1.9: bulk-archive sessions. Same shape as the chats-archive flow in
+  // SessionSection — count, confirm, fire.
+  const [archiveOpen, setArchiveOpen] = useState(false);
+  const [archiveCount, setArchiveCount] = useState(0);
+  const [archiving, setArchiving] = useState(false);
+
+  useEffect(() => {
+    setName(project.name);
+    setDefaultPrompt(project.default_system_prompt);
+    setDefaultWebSearch(project.default_web_search_enabled);
+  }, [
+    project.id,
+    project.name,
+    project.default_system_prompt,
+    project.default_web_search_enabled,
+  ]);
+
+  const dirty =
+    name !== project.name ||
+    defaultPrompt !== project.default_system_prompt ||
+    defaultWebSearch !== project.default_web_search_enabled;
+
+  async function save() {
+    if (saving) return;
+    setSaving(true);
+    try {
+      await api.projects.update(project.id, {
+        name: name.trim() || project.name,
+        default_system_prompt: defaultPrompt,
+        default_web_search_enabled: defaultWebSearch,
+      });
+      toast.success('Project saved');
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'save failed');
+    } finally {
+      setSaving(false);
+    }
+  }
+
+  async function clearDefaultPrompt() {
+    if (saving) return;
+    setSaving(true);
+    try {
+      await api.projects.update(project.id, { default_system_prompt: '' });
+      toast.success('Cleared');
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'clear failed');
+    } finally {
+      setSaving(false);
+    }
+  }
+
+  async function openArchiveDialog() {
+    if (archiving) return;
+    try {
+      const { count } = await api.projects.openSessionsCount(project.id);
+      if (count === 0) {
+        toast('No open sessions to archive.');
+        return;
+      }
+      setArchiveCount(count);
+      setArchiveOpen(true);
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'failed to count sessions');
+    }
+  }
+
+  async function confirmArchive() {
+    if (archiving) return;
+    setArchiving(true);
+    try {
+      const { archived } = await api.projects.archiveAllSessions(project.id);
+      toast.success(`Archived ${archived} session${archived === 1 ? '' : 's'}`);
+      setArchiveOpen(false);
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : 'archive failed');
+    } finally {
+      setArchiving(false);
+    }
+  }
+
+  return (
+    <div className="space-y-6">
+      <div className="space-y-1.5">
+        <label className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
+          Project name
+        </label>
+        <input
+          type="text"
+          value={name}
+          onChange={(e) => setName(e.target.value)}
+          className="w-full bg-background border border-border rounded px-2 py-1.5 text-sm outline-none focus:border-ring"
+        />
+      </div>
+
+      <div className="space-y-1.5">
+        <label className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
+          Root path
+        </label>
+        <div className="font-mono text-xs text-muted-foreground bg-muted/40 rounded px-2 py-1.5 select-all">
+          {project.path}
+        </div>
+      </div>
+
+      <div className="space-y-1.5">
+        <div className="flex items-center justify-between gap-3">
+          <label htmlFor="project-default-web-search" className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
+            Default web search
+          </label>
+          <Switch
+            id="project-default-web-search"
+            checked={defaultWebSearch}
+            onCheckedChange={setDefaultWebSearch}
+          />
+        </div>
+        <p className="text-xs text-muted-foreground italic">
+          Applies to new sessions only. Plumbed for Batch 8.
+        </p>
+      </div>
+
+      <div className="space-y-1.5">
+        <div className="flex items-center justify-between gap-3">
+          <label className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
+            Default system prompt
+          </label>
+          <button
+            type="button"
+            onClick={() => void clearDefaultPrompt()}
+            disabled={saving || project.default_system_prompt === ''}
+            className="text-xs text-muted-foreground hover:text-foreground disabled:opacity-40 disabled:cursor-not-allowed"
+          >
+            Clear
+          </button>
+        </div>
+        <Textarea
+          value={defaultPrompt}
+          onChange={(e) => setDefaultPrompt(e.target.value)}
+          rows={6}
+          className="resize-y min-h-[120px] max-h-[60vh]"
+          placeholder="Prepended to every new session's system prompt (when its own is empty). Empty = no project default."
+        />
+      </div>
+
+      <p className="text-xs text-muted-foreground">
+        Existing sessions are not affected by changes here.
+      </p>
+
+      <div className="flex justify-end gap-2">
+        <Button onClick={() => void save()} disabled={!dirty || saving}>
+          {saving ? 'Saving…' : 'Save'}
+        </Button>
+      </div>
+
+      <div className="border-t pt-4">
+        <Button
+          variant="outline"
+          onClick={() => void openArchiveDialog()}
+          disabled={archiving}
+          className="gap-1.5"
+        >
+          <Archive size={14} /> Archive all sessions
+        </Button>
+      </div>
+
+      <Dialog open={archiveOpen} onOpenChange={(open) => { if (!archiving) setArchiveOpen(open); }}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>Archive all sessions?</DialogTitle>
+            <DialogDescription>
+              Archive {archiveCount} open session{archiveCount === 1 ? '' : 's'} in this project?
+              Archived sessions stay accessible via the archive view.
+            </DialogDescription>
+          </DialogHeader>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setArchiveOpen(false)} disabled={archiving}>
+              Cancel
+            </Button>
+            <Button onClick={() => void confirmArchive()} disabled={archiving}>
+              {archiving ? 'Archiving…' : `Archive ${archiveCount}`}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </div>
+  );
+}

apps/web/src/components/ui/card.tsx

@@ -0,0 +1,103 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+function Card({
+  className,
+  size = "default",
+  ...props
+}: React.ComponentProps<"div"> & { size?: "default" | "sm" }) {
+  return (
+    <div
+      data-slot="card"
+      data-size={size}
+      className={cn(
+        "group/card flex flex-col gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-header"
+      className={cn(
+        "group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-title"
+      className={cn(
+        "text-base leading-snug font-medium group-data-[size=sm]/card:text-sm",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-description"
+      className={cn("text-sm text-muted-foreground", className)}
+      {...props}
+    />
+  )
+}
+
+function CardAction({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-action"
+      className={cn(
+        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function CardContent({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-content"
+      className={cn("px-4 group-data-[size=sm]/card:px-3", className)}
+      {...props}
+    />
+  )
+}
+
+function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="card-footer"
+      className={cn(
+        "flex items-center rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/card:p-3",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+export {
+  Card,
+  CardHeader,
+  CardFooter,
+  CardTitle,
+  CardAction,
+  CardDescription,
+  CardContent,
+}

apps/web/src/components/ui/radio-group.tsx

@@ -0,0 +1,42 @@
+import * as React from "react"
+import { RadioGroup as RadioGroupPrimitive } from "radix-ui"
+
+import { cn } from "@/lib/utils"
+
+function RadioGroup({
+  className,
+  ...props
+}: React.ComponentProps<typeof RadioGroupPrimitive.Root>) {
+  return (
+    <RadioGroupPrimitive.Root
+      data-slot="radio-group"
+      className={cn("grid w-full gap-2", className)}
+      {...props}
+    />
+  )
+}
+
+function RadioGroupItem({
+  className,
+  ...props
+}: React.ComponentProps<typeof RadioGroupPrimitive.Item>) {
+  return (
+    <RadioGroupPrimitive.Item
+      data-slot="radio-group-item"
+      className={cn(
+        "group/radio-group-item peer relative flex aspect-square size-4 shrink-0 rounded-full border border-input outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground dark:data-checked:bg-primary",
+        className
+      )}
+      {...props}
+    >
+      <RadioGroupPrimitive.Indicator
+        data-slot="radio-group-indicator"
+        className="flex size-4 items-center justify-center"
+      >
+        <span className="absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary-foreground" />
+      </RadioGroupPrimitive.Indicator>
+    </RadioGroupPrimitive.Item>
+  )
+}
+
+export { RadioGroup, RadioGroupItem }

apps/web/src/hooks/sessionEvents.ts

@@ -62,6 +62,14 @@ export interface OpenChatInActivePaneEvent {
   chat_id: string;
 }
 
+// Client-side event fired by the sidebar Settings button when a session is
+// currently mounted. Session.tsx subscribes and calls
+// panesHook.toggleSettingsPane() (open on first click, close on second).
+// Sidebar handles the no-session case by navigating to /settings directly.
+export interface OpenSettingsPaneEvent {
+  type: 'open_settings_pane';
+}
+
 export interface SessionArchivedEvent {
   type: 'session_archived';
   session_id: string;
@@ -139,6 +147,7 @@ export type SessionEvent =
   | OpenFileInBrowserEvent
   | AttachChatFileEvent
   | OpenChatInActivePaneEvent
+  | OpenSettingsPaneEvent
   | SessionArchivedEvent
   | ChatCreatedEvent
   | ChatUpdatedEvent

apps/web/src/hooks/useSessionStream.ts

@@ -1,5 +1,7 @@
 import { useEffect, useRef, useState } from 'react';
+import { toast } from 'sonner';
 import type { Message, WsFrame } from '@/api/types';
+import { api } from '@/api/client';
 import { sessionEvents } from './sessionEvents';
 
 // session_renamed frame removed from WsFrame — it was declared but never
@@ -161,6 +163,12 @@ function applyFrame(state: State, frame: WsFrame): State {
         : state.messages;
       return { ...state, messages: next, error: frame.error };
     }
+    case 'compacted': {
+      // v1.11: side effects (refetch + toast) live in ws.onmessage; the
+      // reducer just no-ops so TS exhaustiveness is satisfied without
+      // duplicating async work inside a synchronous reducer.
+      return state;
+    }
   }
 }
 
@@ -196,6 +204,25 @@ export function useSessionStream(sessionId: string | undefined) {
       ws.onmessage = (ev) => {
         try {
           const frame = JSON.parse(typeof ev.data === 'string' ? ev.data : '') as WsFrame;
+          // v1.11: on a compaction completion, re-fetch the message list so
+          // the new summary row + the cohort of compacted_at-stamped older
+          // rows render correctly. We dispatch the fresh list as a synthetic
+          // 'snapshot' frame so the reducer's existing path handles state
+          // replacement (no need for a parallel "refetched" path).
+          // The toast is purely UX feedback; missing it would still leave
+          // the chat in a valid state.
+          if (frame.type === 'compacted') {
+            toast.success('Context compacted to free space');
+            void api.messages
+              .list(frame.session_id)
+              .then((messages) => {
+                setState((s) => applyFrame(s, { type: 'snapshot', messages }));
+              })
+              .catch((err: unknown) => {
+                console.warn('compacted refetch failed', err);
+              });
+            return;
+          }
           setState((s) => applyFrame(s, frame));
         } catch (err) {
           console.warn('bad ws frame', err);

apps/web/src/hooks/useSidebar.ts

@@ -151,6 +151,10 @@ function applyEvent(prev: SidebarResponse, event: import('./sessionEvents').Sess
     case 'open_chat_in_active_pane':
       // Consumed by Workspace; sidebar has no business with pane state.
       return prev;
+    case 'open_settings_pane':
+      // Consumed by Session.tsx (calls toggleSettingsPane on its panesHook).
+      // Sidebar data is untouched.
+      return prev;
     case 'session_archived': {
       let changed = false;
       const projects = prev.projects.map((p) => {

apps/web/src/hooks/useSkills.ts

@@ -0,0 +1,43 @@
+import { useEffect, useState } from 'react';
+import { api } from '@/api/client';
+import type { Skill } from '@/api/types';
+
+// Batch 9.6: shared in-memory cache for the slash-command dropdown. One fetch
+// per process; subsequent mounts of useSkills() return the cached list and
+// don't re-hit /api/skills. Matches the useSidebar / useChatStatus module-
+// singleton pattern so the dropdown stays cheap even with many ChatInputs
+// mounted at once.
+
+let cachedSkills: Skill[] | null = null;
+let inflight: Promise<Skill[]> | null = null;
+const subscribers = new Set<(s: Skill[]) => void>();
+
+async function loadSkills(): Promise<Skill[]> {
+  if (inflight) return inflight;
+  inflight = api.skills
+    .list()
+    .then((r) => {
+      cachedSkills = r.skills;
+      for (const sub of subscribers) {
+        try { sub(cachedSkills); } catch { /* swallow */ }
+      }
+      return cachedSkills;
+    })
+    .finally(() => { inflight = null; });
+  return inflight;
+}
+
+export function useSkills(): { skills: Skill[]; loaded: boolean } {
+  const [skills, setSkills] = useState<Skill[]>(cachedSkills ?? []);
+  const [loaded, setLoaded] = useState<boolean>(cachedSkills !== null);
+
+  useEffect(() => {
+    subscribers.add(setSkills);
+    if (cachedSkills === null) {
+      void loadSkills().then(() => setLoaded(true)).catch(() => setLoaded(true));
+    }
+    return () => { subscribers.delete(setSkills); };
+  }, []);
+
+  return { skills, loaded };
+}

apps/web/src/hooks/useWorkspacePanes.ts

@@ -1,6 +1,7 @@
 import { useCallback, useEffect, useRef, useState } from 'react';
 import type { DragEvent } from 'react';
 import { toast } from 'sonner';
+import { api } from '@/api/client';
 import type { WorkspacePane } from '@/api/types';
 import { setActivePaneInfo, clearActivePane } from '@/hooks/useActivePane';
 
@@ -11,14 +12,45 @@ function generateId(): string {
   return crypto.randomUUID();
 }
 
-function emptyPane(): WorkspacePane {
-  return { id: generateId(), kind: 'empty', chatIds: [], activeChatIdx: -1 };
+// v1.10.3: optional id arg lets addSplitPane lift id generation out of the
+// setPanes updater so the new pane's id can be returned synchronously to the
+// caller (needed for mobile URL state).
+function emptyPane(id: string = generateId()): WorkspacePane {
+  return { id, kind: 'empty', chatIds: [], activeChatIdx: -1 };
 }
 
 function chatPane(chatId: string): WorkspacePane {
   return { id: generateId(), kind: 'chat', chatId, chatIds: [chatId], activeChatIdx: 0 };
 }
 
+// v1.10 booterm: terminal panes carry no chats. Their `id` is used as the
+// tmux window key on booterm — see apps/booterm/src/pty/manager.ts. They
+// persist in localStorage along with chat panes so a refresh resumes the
+// same tmux window via the idempotent start endpoint.
+function terminalPane(id: string = generateId()): WorkspacePane {
+  return { id, kind: 'terminal', chatIds: [], activeChatIdx: -1 };
+}
+
+// v1.9: settings pane factory. No chats, no state beyond identity — the
+// SettingsPane component renders Session/Project sections from the
+// surrounding session/project.
+function settingsPane(): WorkspacePane {
+  return { id: generateId(), kind: 'settings', chatIds: [], activeChatIdx: -1 };
+}
+
+// v1.9: settings panes are ephemeral. Filter them out before persisting so a
+// page reload always returns to a clean workspace; the user re-opens via the
+// sidebar Settings button when needed.
+function persistablePanes(panes: WorkspacePane[]): WorkspacePane[] {
+  return panes.filter((p) => p.kind !== 'settings');
+}
+
+// v1.9: per recon decision (c), settings panes don't count toward MAX_PANES.
+// Helper used at every pane-insertion site so the rule lives in one place.
+function nonSettingsCount(panes: WorkspacePane[]): number {
+  return panes.reduce((n, p) => n + (p.kind === 'settings' ? 0 : 1), 0);
+}
+
 function loadPanes(sessionId: string): WorkspacePane[] | null {
   try {
     const raw = localStorage.getItem(`${STORAGE_KEY}.${sessionId}`);
@@ -33,7 +65,10 @@ function loadPanes(sessionId: string): WorkspacePane[] | null {
 
 function savePanes(sessionId: string, panes: WorkspacePane[]): void {
   try {
-    localStorage.setItem(`${STORAGE_KEY}.${sessionId}`, JSON.stringify(panes));
+    localStorage.setItem(
+      `${STORAGE_KEY}.${sessionId}`,
+      JSON.stringify(persistablePanes(panes)),
+    );
   } catch { /* quota or disabled */ }
 }
 
@@ -49,7 +84,15 @@ export interface UseWorkspacePanesResult {
   closeTabsToRight: (paneIdx: number, pivotChatId: string) => void;
   closeAllTabs: (paneIdx: number) => void;
   showLandingPage: (paneIdx: number) => void;
-  addSplitPane: (kind: 'chat' | 'terminal' | 'agent') => void;
+  // v1.10.3: returns the new pane's id (or null if the operation was a no-op:
+  // 'agent' kind is a toast stub, or max panes reached). Callers can use the
+  // id to update mobile URL state so the URL-sync effect doesn't fight the
+  // freshly-set activePaneIdx.
+  addSplitPane: (kind: 'chat' | 'terminal' | 'agent') => string | null;
+  // Open-on-first-click, close-on-second-click. Singleton — settings panes
+  // don't count toward MAX_PANES. Closing the only remaining pane (edge case)
+  // falls back to an empty pane to preserve the "always one pane" invariant.
+  toggleSettingsPane: () => void;
   removePane: (idx: number) => void;
   removeChatFromPanes: (chatId: string) => void;
   initializeFirstChatIfEmpty: (chatId: string) => void;
@@ -206,34 +249,73 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
     });
   }, []);
 
-  const addSplitPane = useCallback((kind: 'chat' | 'terminal' | 'agent') => {
-    if (kind === 'terminal') {
-      toast('Terminal panes coming in BooTerm');
-      return;
-    }
+  const addSplitPane = useCallback((kind: 'chat' | 'terminal' | 'agent'): string | null => {
     if (kind === 'agent') {
       toast('Agent panes coming in BooCoder');
-      return;
+      return null;
     }
+    // Generate the id outside the updater so we can return it deterministically.
+    // setPanes's updater can be invoked twice in strict mode; using a fixed id
+    // ensures both invocations agree and the returned id matches what landed.
+    const newPaneId = generateId();
+    let success = false;
     setPanes((prev) => {
-      if (prev.length >= MAX_PANES) {
+      // v1.9: settings panes are excluded from the MAX cap (decision c).
+      if (nonSettingsCount(prev) >= MAX_PANES) {
         toast.error(`Maximum ${MAX_PANES} panes`);
         return prev;
       }
-      const next = [...prev, emptyPane()];
+      const newPane = kind === 'terminal' ? terminalPane(newPaneId) : emptyPane(newPaneId);
+      const next = [...prev, newPane];
       setActivePaneIdx(next.length - 1);
+      success = true;
+      return next;
+    });
+    return success ? newPaneId : null;
+  }, []);
+
+  const toggleSettingsPane = useCallback(() => {
+    setPanes((prev) => {
+      const existingIdx = prev.findIndex((p) => p.kind === 'settings');
+      if (existingIdx < 0) {
+        const next = [...prev, settingsPane()];
+        setActivePaneIdx(next.length - 1);
+        return next;
+      }
+      if (prev.length <= 1) {
+        setActivePaneIdx(0);
+        return [emptyPane()];
+      }
+      const next = prev.filter((_, i) => i !== existingIdx);
+      setActivePaneIdx((ai) => Math.min(ai, next.length - 1));
       return next;
     });
   }, []);
 
   const removePane = useCallback((idx: number) => {
     setPanes((prev) => {
-      if (prev.length <= 1) return prev;
+      if (prev.length <= 1) {
+        // Settings is the only kind that can be the last pane and still need
+        // closing (X / Esc / sidebar toggle). Fall back to empty.
+        if (prev[idx]?.kind === 'settings') {
+          setActivePaneIdx(0);
+          return [emptyPane()];
+        }
+        return prev;
+      }
+      // v1.10.8c: with per-pane tmux sessions, an unkilled session leaks until
+      // the next `tmux kill-server`. Fire-and-forget /kill on terminal removal.
+      // The endpoint is idempotent (404 on missing session) so a strict-mode
+      // double-invoke of the updater is safe.
+      const removed = prev[idx];
+      if (removed?.kind === 'terminal') {
+        api.terminals.kill(sessionId, removed.id).catch(() => { /* non-fatal */ });
+      }
       const next = prev.filter((_, i) => i !== idx);
       setActivePaneIdx((ai) => Math.min(ai, next.length - 1));
       return next;
     });
-  }, []);
+  }, [sessionId]);
 
   // Replaces a single empty default pane with a chat pane. Used by the initial
   // chat fetch to land on the most-recent open chat if no saved pane state.
@@ -325,6 +407,7 @@ export function useWorkspacePanes(sessionId: string): UseWorkspacePanesResult {
     closeAllTabs,
     showLandingPage,
     addSplitPane,
+    toggleSettingsPane,
     removePane,
     removeChatFromPanes,
     initializeFirstChatIfEmpty,

apps/web/src/lib/events.ts

@@ -0,0 +1,151 @@
+// Minimal pub/sub for ephemeral UI events that don't belong on the sessionEvents
+// bus (sessionEvents is for DB-state changes; this file is for UI-only signals
+// like "user clicked send-to-terminal on selected text").
+//
+// Also exposes a tiny registry of currently-mounted terminal panes so the
+// MessageBubble context menu can list them. TerminalPane registers on mount,
+// unregisters on unmount. v1.10.4 adds a parallel ChatInput registry used by
+// the terminal floating menu's "Send to chat" submenu.
+
+type Listener<T> = (payload: T) => void;
+
+interface EventBus<T> {
+  emit(payload: T): void;
+  subscribe(listener: Listener<T>): () => void;
+}
+
+function createEvent<T>(): EventBus<T> {
+  const listeners = new Set<Listener<T>>();
+  return {
+    emit(payload) {
+      for (const l of listeners) {
+        try {
+          l(payload);
+        } catch {
+          /* one bad listener shouldn't break others */
+        }
+      }
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => {
+        listeners.delete(listener);
+      };
+    },
+  };
+}
+
+export interface SendToTerminalPayload {
+  pane_id: string;
+  text: string;
+}
+
+export const sendToTerminal = createEvent<SendToTerminalPayload>();
+
+// v1.10.4: reverse direction. Terminal floating menu "Send to chat" emits this
+// with the target chat's chat_id; ChatInput subscribes and appends to its draft.
+export interface SendToChatPayload {
+  chat_id: string;
+  text: string;
+}
+
+export const sendToChat = createEvent<SendToChatPayload>();
+
+export interface TerminalRegistration {
+  paneId: string;
+  label: string;
+  // v1.10.3 kbd-shortcuts: Cmd+` needs to focus the active terminal's xterm
+  // input layer. TerminalPane binds this to term.focus().
+  focus: () => void;
+  // v1.10.4: Cmd+F opens the search bar over the active terminal. Workspace
+  // also binds a "Paste" button in the terminal pane header to paste().
+  openSearch: () => void;
+  paste: () => void;
+}
+
+const terminalRegistry = new Map<string, TerminalRegistration>();
+const registryListeners = new Set<Listener<void>>();
+
+function notifyRegistry(): void {
+  for (const l of registryListeners) {
+    try {
+      l();
+    } catch {
+      /* ignore */
+    }
+  }
+}
+
+export const terminalsRegistry = {
+  register(
+    paneId: string,
+    label: string,
+    focus: () => void,
+    openSearch: () => void,
+    paste: () => void,
+  ): () => void {
+    terminalRegistry.set(paneId, { paneId, label, focus, openSearch, paste });
+    notifyRegistry();
+    return () => {
+      terminalRegistry.delete(paneId);
+      notifyRegistry();
+    };
+  },
+  list(): TerminalRegistration[] {
+    return Array.from(terminalRegistry.values());
+  },
+  get(paneId: string): TerminalRegistration | undefined {
+    return terminalRegistry.get(paneId);
+  },
+  subscribe(listener: Listener<void>): () => void {
+    registryListeners.add(listener);
+    return () => {
+      registryListeners.delete(listener);
+    };
+  },
+};
+
+// v1.10.4: parallel registry of mounted ChatInput components so the terminal
+// floating menu's "Send to chat" submenu can list open chats. Mirrors
+// terminalsRegistry exactly; same subscriber pattern.
+export interface ChatInputRegistration {
+  chatId: string;
+  label: string;
+  focus: () => void;
+}
+
+const chatInputRegistry = new Map<string, ChatInputRegistration>();
+const chatInputListeners = new Set<Listener<void>>();
+
+function notifyChatInputs(): void {
+  for (const l of chatInputListeners) {
+    try {
+      l();
+    } catch {
+      /* ignore */
+    }
+  }
+}
+
+export const chatInputsRegistry = {
+  register(chatId: string, label: string, focus: () => void): () => void {
+    chatInputRegistry.set(chatId, { chatId, label, focus });
+    notifyChatInputs();
+    return () => {
+      chatInputRegistry.delete(chatId);
+      notifyChatInputs();
+    };
+  },
+  list(): ChatInputRegistration[] {
+    return Array.from(chatInputRegistry.values());
+  },
+  get(chatId: string): ChatInputRegistration | undefined {
+    return chatInputRegistry.get(chatId);
+  },
+  subscribe(listener: Listener<void>): () => void {
+    chatInputListeners.add(listener);
+    return () => {
+      chatInputListeners.delete(listener);
+    };
+  },
+};

apps/web/src/lib/theme.ts

@@ -0,0 +1,226 @@
+import { useEffect, useState } from 'react';
+import { api } from '@/api/client';
+
+// themes-v1: source of truth for the 18 presets. id and name are surfaced in
+// the picker; family groups visually; supportsDark/supportsLight reflect
+// whether the corresponding selector exists in styles/themes/<id>.css; anchors
+// are the 5 dark swatches (or the light palette for the two light-only themes)
+// used in the picker preview strip.
+export type ThemeId =
+  | 'obsidian'
+  | 'gunmetal'
+  | 'espresso'
+  | 'volcanic-brown'
+  | 'copper'
+  | 'gold'
+  | 'oxblood'
+  | 'crimson'
+  | 'elderflower'
+  | 'plum'
+  | 'steel-pink'
+  | 'fuchsia-noir'
+  | 'matrix'
+  | 'sage'
+  | 'ivory'
+  | 'chalk'
+  | 'cobalt'
+  | 'midnight-sapphire';
+
+export type ThemeMode = 'dark' | 'light' | 'system';
+
+export interface ThemeMeta {
+  id: ThemeId;
+  name: string;
+  family: string;
+  supportsDark: boolean;
+  supportsLight: boolean;
+  anchors: [string, string, string, string, string];
+}
+
+export const THEMES: readonly ThemeMeta[] = [
+  { id: 'obsidian', name: 'Obsidian', family: 'Charcoal', supportsDark: true, supportsLight: true,
+    anchors: ['#0c0c0e', '#15151a', '#1f1f23', '#6b6b75', '#8b5cf6'] },
+  { id: 'gunmetal', name: 'Gunmetal', family: 'Charcoal', supportsDark: true, supportsLight: true,
+    anchors: ['#0d1117', '#161b22', '#21262d', '#7d8590', '#388bfd'] },
+  { id: 'espresso', name: 'Espresso', family: 'Brown', supportsDark: true, supportsLight: true,
+    anchors: ['#1c1410', '#241a14', '#2e2218', '#8a7058', '#c8a880'] },
+  { id: 'volcanic-brown', name: 'Volcanic Brown', family: 'Brown', supportsDark: true, supportsLight: true,
+    anchors: ['#140906', '#1e0e0a', '#2e1610', '#7a4030', '#cc4a1a'] },
+  { id: 'copper', name: 'Copper', family: 'Amber', supportsDark: true, supportsLight: true,
+    anchors: ['#100800', '#1c1408', '#2e1f0a', '#8a6040', '#b87333'] },
+  { id: 'gold', name: 'Gold', family: 'Amber', supportsDark: true, supportsLight: true,
+    anchors: ['#0e0800', '#1a1200', '#2a1f00', '#a07c30', '#d4af37'] },
+  { id: 'oxblood', name: 'Oxblood', family: 'Crimson', supportsDark: true, supportsLight: true,
+    anchors: ['#0a0303', '#180606', '#2a0808', '#7a3028', '#8b1a1a'] },
+  { id: 'crimson', name: 'Crimson', family: 'Crimson', supportsDark: true, supportsLight: true,
+    anchors: ['#0e0404', '#1a0808', '#2e0a0a', '#8a3030', '#dc143c'] },
+  { id: 'elderflower', name: 'Elderflower', family: 'Violet', supportsDark: true, supportsLight: true,
+    anchors: ['#100818', '#1c1024', '#2c1830', '#8a78a0', '#b89cd8'] },
+  { id: 'plum', name: 'Plum', family: 'Violet', supportsDark: true, supportsLight: true,
+    anchors: ['#0c0814', '#180e20', '#241830', '#7a4878', '#8e4585'] },
+  { id: 'steel-pink', name: 'Steel Pink', family: 'Magenta', supportsDark: true, supportsLight: true,
+    anchors: ['#0e0408', '#1a080e', '#2e0c1a', '#9a4070', '#cc33aa'] },
+  { id: 'fuchsia-noir', name: 'Fuchsia Noir', family: 'Magenta', supportsDark: true, supportsLight: true,
+    anchors: ['#0a0610', '#14081a', '#2a0c2e', '#8a3878', '#ff1493'] },
+  { id: 'matrix', name: 'Matrix', family: 'Green', supportsDark: true, supportsLight: true,
+    anchors: ['#000a00', '#031403', '#0a200a', '#208030', '#00ff41'] },
+  { id: 'sage', name: 'Sage', family: 'Green', supportsDark: true, supportsLight: true,
+    anchors: ['#0a0e08', '#141a10', '#1e2e1a', '#7a8870', '#9caf88'] },
+  { id: 'ivory', name: 'Ivory', family: 'Light', supportsDark: false, supportsLight: true,
+    anchors: ['#fdfcf8', '#f5f2e8', '#e8e4d8', '#8a8478', '#3a3328'] },
+  { id: 'chalk', name: 'Chalk', family: 'Light', supportsDark: false, supportsLight: true,
+    anchors: ['#fafaf7', '#f0f0ec', '#e5e5e0', '#75756e', '#2a2a28'] },
+  { id: 'cobalt', name: 'Cobalt', family: 'Blue', supportsDark: true, supportsLight: true,
+    anchors: ['#020817', '#061434', '#0c2244', '#3060a0', '#0047ab'] },
+  { id: 'midnight-sapphire', name: 'Midnight Sapphire', family: 'Blue', supportsDark: true, supportsLight: true,
+    anchors: ['#02050e', '#060c1f', '#0e1a36', '#4a6088', '#1e3a8a'] },
+] as const;
+
+export const DEFAULT_THEME_ID: ThemeId = 'obsidian';
+export const DEFAULT_THEME_MODE: ThemeMode = 'dark';
+export const STORAGE_KEY = 'boocode.theme';
+
+const THEME_IDS_SET: ReadonlySet<string> = new Set(THEMES.map((t) => t.id));
+
+export function isThemeId(s: string): s is ThemeId {
+  return THEME_IDS_SET.has(s);
+}
+
+function resolvedMode(mode: ThemeMode): 'dark' | 'light' {
+  if (mode !== 'system') return mode;
+  if (typeof window === 'undefined') return 'dark';
+  return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+}
+
+// Light-only themes (ivory, chalk) can't render dark — fall back to obsidian
+// dark per spec §8 decision 1. Keeps the fallback explicit so the caller
+// doesn't accidentally apply theme-ivory.dark (which has no rule block).
+function effectiveThemeId(id: ThemeId, mode: 'dark' | 'light'): ThemeId {
+  if (mode === 'dark') {
+    const meta = THEMES.find((t) => t.id === id);
+    if (meta && !meta.supportsDark) return DEFAULT_THEME_ID;
+  }
+  return id;
+}
+
+export function applyTheme(id: ThemeId, mode: ThemeMode): void {
+  if (typeof document === 'undefined') return;
+  const resolved = resolvedMode(mode);
+  const effective = effectiveThemeId(id, resolved);
+  document.documentElement.className =
+    `theme-${effective}${resolved === 'dark' ? ' dark' : ''}`;
+  try {
+    localStorage.setItem(STORAGE_KEY, JSON.stringify({ id, mode }));
+  } catch {
+    // quota / disabled storage — apply still succeeds, persistence falls
+    // back to the next /api/settings round-trip.
+  }
+}
+
+interface ThemeState {
+  id: ThemeId;
+  mode: ThemeMode;
+}
+
+// Module-level singleton, mirrors the useChatStatus / useSidebar pattern.
+// One shared state across every useTheme() consumer; setTheme() mutates it
+// and notifies subscribers so the App-level hook (which owns the matchMedia
+// listener) and the Settings picker stay in lockstep without prop drilling.
+function readCache(): ThemeState | null {
+  if (typeof localStorage === 'undefined') return null;
+  try {
+    const raw = localStorage.getItem(STORAGE_KEY);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw) as { id?: unknown; mode?: unknown };
+    if (typeof parsed.id !== 'string' || !isThemeId(parsed.id)) return null;
+    const m = parsed.mode;
+    if (m !== 'dark' && m !== 'light' && m !== 'system') return null;
+    return { id: parsed.id, mode: m };
+  } catch {
+    return null;
+  }
+}
+
+let _state: ThemeState = readCache() ?? { id: DEFAULT_THEME_ID, mode: DEFAULT_THEME_MODE };
+let _initialized = false;
+const _subscribers = new Set<(s: ThemeState) => void>();
+
+function notify(): void {
+  for (const sub of _subscribers) {
+    try {
+      sub(_state);
+    } catch {
+      // swallow — one bad subscriber shouldn't break others
+    }
+  }
+}
+
+// Optimistic update: applies immediately, PATCHes server, reverts on failure
+// so the picker can show a toast without manual state juggling. Throws on
+// failure so the caller can surface the error.
+export async function setTheme(id: ThemeId, mode: ThemeMode): Promise<void> {
+  const prev = _state;
+  _state = { id, mode };
+  applyTheme(id, mode);
+  notify();
+  try {
+    await api.settings.patch({ theme_id: id, theme_mode: mode });
+  } catch (err) {
+    _state = prev;
+    applyTheme(prev.id, prev.mode);
+    notify();
+    throw err;
+  }
+}
+
+// useTheme — mounts as many times as needed across the tree. The first mount
+// (initialized=false) triggers a single /api/settings fetch to reconcile the
+// local cache with the server. Every mount installs the matchMedia listener
+// when mode === 'system'; cleanup runs on unmount or when mode flips away.
+export function useTheme(): ThemeState {
+  const [state, setState] = useState<ThemeState>(_state);
+
+  useEffect(() => {
+    _subscribers.add(setState);
+    // Ensure the DOM reflects current state on mount — the FOUC script in
+    // index.html runs before this hook, but we re-apply in case the cache
+    // was stale relative to a fresh fetch above.
+    applyTheme(_state.id, _state.mode);
+    if (!_initialized) {
+      _initialized = true;
+      api.settings
+        .get()
+        .then((s) => {
+          const rawId = s['theme_id'];
+          const rawMode = s['theme_mode'];
+          const id =
+            typeof rawId === 'string' && isThemeId(rawId) ? rawId : DEFAULT_THEME_ID;
+          const mode: ThemeMode =
+            rawMode === 'dark' || rawMode === 'light' || rawMode === 'system'
+              ? rawMode
+              : DEFAULT_THEME_MODE;
+          _state = { id, mode };
+          applyTheme(id, mode);
+          notify();
+        })
+        .catch(() => {
+          // Settings fetch failed — keep whatever the FOUC script applied.
+          // The picker still works; PATCH will retry on next selection.
+        });
+    }
+    return () => {
+      _subscribers.delete(setState);
+    };
+  }, []);
+
+  useEffect(() => {
+    if (state.mode !== 'system') return;
+    if (typeof window === 'undefined') return;
+    const mql = window.matchMedia('(prefers-color-scheme: dark)');
+    const onChange = () => applyTheme(state.id, 'system');
+    mql.addEventListener('change', onChange);
+    return () => mql.removeEventListener('change', onChange);
+  }, [state.id, state.mode]);
+
+  return state;
+}

apps/web/src/main.tsx

@@ -1,3 +1,8 @@
+// Fonts imported as JS side-effect modules (boolab pattern, adapted for
+// Tailwind v4 + Vite asset-pipeline URL rewriting). Must precede the React
+// imports so the @font-face CSS lands before any component-tree render.
+import '@fontsource-variable/inter';
+import '@fontsource-variable/jetbrains-mono';
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App';

apps/web/src/pages/Home.tsx

@@ -47,6 +47,11 @@ export function Home() {
               last_session_id: null,
               status: 'archived' as const,
               gitea_remote: fromSidebar.gitea_remote,
+              // v1.9: synthesized stub for an archived project that only the
+              // sidebar cache has — defaults match the schema NOT NULL DEFAULT
+              // values. The full row gets re-fetched on unarchive.
+              default_system_prompt: '',
+              default_web_search_enabled: false,
             },
             ...prev,
           ];

apps/web/src/pages/Session.tsx

@@ -10,6 +10,7 @@ import { ChevronRight, FolderTree, Menu } from 'lucide-react';
 import { api } from '@/api/client';
 import type { Project, Session as SessionType } from '@/api/types';
 import { sessionEvents } from '@/hooks/sessionEvents';
+import { terminalsRegistry } from '@/lib/events';
 import { useActivePane } from '@/hooks/useActivePane';
 import { useSidebarDrawer } from '@/hooks/useSidebarDrawer';
 import { useRightRailDrawer } from '@/hooks/useRightRailDrawer';
@@ -116,9 +117,31 @@ function SessionInner({ sessionId }: { sessionId: string }) {
         event.session_id === sessionId
       ) {
         navigate(`/project/${event.project_id}`);
+        return;
+      }
+      // v1.9: any session_updated for this session triggers a full refetch so
+      // SettingsPane (mounted in a workspace pane) picks up system_prompt /
+      // web_search_enabled / model edits made from another tab.
+      if (event.type === 'session_updated' && event.session_id === sessionId) {
+        void api.sessions.get(sessionId).then((s) => {
+          setSession(s);
+          setName((prev) => (editingName ? prev : s.name));
+        }).catch(() => {});
+        return;
+      }
+      // v1.9: project_updated → refetch project so the Project section in
+      // SettingsPane reflects the new defaults.
+      if (event.type === 'project_updated' && project && event.project_id === project.id) {
+        void api.projects.get(project.id).then(setProject).catch(() => {});
+        return;
+      }
+      // Sidebar Settings button broadcasts this when a session is mounted;
+      // toggleSettingsPane opens on first click, closes on second.
+      if (event.type === 'open_settings_pane') {
+        panesHook.toggleSettingsPane();
       }
     });
-  }, [sessionId, editingName, navigate]);
+  }, [sessionId, editingName, navigate, project, panesHook]);
 
   // v1.8: URL ?pane= sync (mobile only). Lifted from Workspace.tsx so
   // MobileTabSwitcher's onSwitchPane can push the same URL state and the
@@ -148,6 +171,122 @@ function SessionInner({ sessionId }: { sessionId: string }) {
     [setActivePaneIdx, isMobile, panes, navigate, location.pathname, location.search],
   );
 
+  // v1.10.3 fix: addSplitPane sets activePaneIdx, but on mobile the URL-sync
+  // effect below sees a stale ?pane= and immediately resets the index. Push
+  // the new pane's id to the URL atomically so the effect's next pass sees a
+  // matching id and is a no-op. Desktop has no URL pane state — fall through.
+  const addPaneAndSwitch = useCallback(
+    (kind: 'chat' | 'terminal' | 'agent') => {
+      const newPaneId = addSplitPane(kind);
+      if (newPaneId === null) return;
+      if (isMobile) {
+        const params = new URLSearchParams(location.search);
+        params.set('pane', newPaneId);
+        navigate(`${location.pathname}?${params.toString()}`);
+      }
+    },
+    [addSplitPane, isMobile, navigate, location.pathname, location.search],
+  );
+
+  // v1.10.3 keyboard shortcuts. Window-level keydown so they fire from
+  // anywhere in the session view. Only Cmd/Ctrl-Shift-C defers to the xterm
+  // (which has its own copy binding for that combo); everything else fires
+  // regardless of focus. Cmd-W and Cmd-T are typically reserved by the
+  // browser — preventDefault() works in most browsers but not all.
+  useEffect(() => {
+    function onKey(e: KeyboardEvent): void {
+      const mod = e.ctrlKey || e.metaKey;
+      if (!mod) return;
+      const key = e.key.toLowerCase();
+      const target = e.target;
+      const inXterm = target instanceof Element && target.closest('.xterm') !== null;
+
+      // Cmd/Ctrl + ` — focus the active terminal or jump to the most recent
+      // terminal pane and focus it. No-op if there are no terminal panes.
+      if (key === '`') {
+        e.preventDefault();
+        const activePane = panes[activePaneIdx];
+        if (activePane?.kind === 'terminal') {
+          terminalsRegistry.get(activePane.id)?.focus();
+          return;
+        }
+        let lastTermIdx = -1;
+        for (let i = panes.length - 1; i >= 0; i--) {
+          if (panes[i]?.kind === 'terminal') {
+            lastTermIdx = i;
+            break;
+          }
+        }
+        if (lastTermIdx < 0) return;
+        const target = panes[lastTermIdx];
+        switchActivePane(lastTermIdx);
+        if (target) {
+          // The terminal may have just mounted on mobile (it was return-null
+          // before the switch). Defer focus until the new render commits.
+          setTimeout(() => terminalsRegistry.get(target.id)?.focus(), 80);
+        }
+        return;
+      }
+
+      // Cmd/Ctrl + Shift + T — new terminal pane and switch to it.
+      if (key === 't' && e.shiftKey) {
+        e.preventDefault();
+        addPaneAndSwitch('terminal');
+        return;
+      }
+
+      // Cmd/Ctrl + Shift + C — new chat pane and switch to it. The xterm's
+      // own Shift-C binding is "copy selection" — defer to it when in xterm.
+      if (key === 'c' && e.shiftKey) {
+        if (inXterm) return;
+        e.preventDefault();
+        addPaneAndSwitch('chat');
+        return;
+      }
+
+      // Cmd/Ctrl + W — close the active pane.
+      if (key === 'w' && !e.shiftKey) {
+        e.preventDefault();
+        removePane(activePaneIdx);
+        return;
+      }
+
+      // v1.10.4: Cmd/Ctrl + F — when the active pane is a terminal, open the
+      // scrollback search bar. When it isn't, fall through to the browser's
+      // native find (no preventDefault, no early return).
+      if (key === 'f' && !e.shiftKey) {
+        const activePane = panes[activePaneIdx];
+        if (activePane?.kind === 'terminal') {
+          e.preventDefault();
+          terminalsRegistry.get(activePane.id)?.openSearch();
+        }
+        return;
+      }
+
+      // Cmd/Ctrl + Tab / Shift+Tab — cycle through panes.
+      if (key === 'tab') {
+        if (panes.length <= 1) return;
+        e.preventDefault();
+        const dir = e.shiftKey ? -1 : 1;
+        const next = (activePaneIdx + dir + panes.length) % panes.length;
+        switchActivePane(next);
+        return;
+      }
+
+      // Cmd/Ctrl + 1..9 — direct jump to pane N.
+      if (/^[1-9]$/.test(key)) {
+        const idx = parseInt(key, 10) - 1;
+        if (idx < panes.length) {
+          e.preventDefault();
+          switchActivePane(idx);
+        }
+        return;
+      }
+    }
+    window.addEventListener('keydown', onKey);
+    return () => window.removeEventListener('keydown', onKey);
+  }, [panes, activePaneIdx, switchActivePane, addPaneAndSwitch, removePane]);
+
   async function saveName() {
     if (!session) return;
     const trimmed = name.trim();
@@ -211,15 +350,13 @@ function SessionInner({ sessionId }: { sessionId: string }) {
               </div>
 
               {session && (
-                <div className="inline-flex items-center rounded-full bg-muted/40 hover:bg-muted/70 px-1 shrink-0">
-                  <ModelPicker
-                    value={session.model}
-                    onChange={async (model) => {
-                      const updated = await api.sessions.update(session.id, { model });
-                      setSession(updated);
-                    }}
-                  />
-                </div>
+                <ModelPicker
+                  value={session.model}
+                  onChange={async (model) => {
+                    const updated = await api.sessions.update(session.id, { model });
+                    setSession(updated);
+                  }}
+                />
               )}
 
               <button
@@ -244,7 +381,7 @@ function SessionInner({ sessionId }: { sessionId: string }) {
                 onRenameChat={renameChat}
               />
               <NewPaneMenu
-                onAddPane={addSplitPane}
+                onAddPane={addPaneAndSwitch}
                 disabled={panes.length >= MAX_PANES}
               />
             </div>
@@ -337,6 +474,8 @@ function SessionInner({ sessionId }: { sessionId: string }) {
           }}
           panesHook={panesHook}
           chatsHook={chatsHook}
+          session={session}
+          project={project}
         />
       )}
     </div>

apps/web/src/pages/Settings.tsx

@@ -0,0 +1,47 @@
+import { ArrowLeft } from 'lucide-react';
+import { useNavigate } from 'react-router-dom';
+import { ThemePicker } from '@/components/ThemePicker';
+
+// v1.9: thin wrapper around <ThemePicker />. The picker itself moved to a
+// reusable component (also rendered in the workspace SettingsPane Theme tab).
+// This page-level shell adds the back affordance + heading chrome that's
+// appropriate when the picker is the entire route.
+export function Settings() {
+  const navigate = useNavigate();
+
+  function handleBack() {
+    // History-aware: jump back to where the user came from when possible.
+    // Direct loads of /settings (no history) land on Home so the button
+    // always does *something* useful.
+    if (window.history.length > 1) {
+      navigate(-1);
+    } else {
+      navigate('/');
+    }
+  }
+
+  return (
+    <div className="flex-1 overflow-y-auto">
+      <div className="max-w-[1000px] mx-auto w-full px-6 py-6 space-y-8">
+        <header className="space-y-2">
+          <button
+            type="button"
+            onClick={handleBack}
+            className="inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground -ml-1 px-1 py-0.5 rounded"
+            aria-label="Back"
+          >
+            <ArrowLeft className="size-4" />
+            <span>Back</span>
+          </button>
+          <div>
+            <h1 className="text-xl font-semibold">Settings</h1>
+            <p className="text-sm text-muted-foreground mt-1">
+              Theme appearance. Saved on change, applies immediately.
+            </p>
+          </div>
+        </header>
+        <ThemePicker />
+      </div>
+    </div>
+  );
+}

apps/web/src/styles/globals.css

@@ -1,8 +1,30 @@
 @import "tailwindcss";
 @import "tw-animate-css";
 @import "shadcn/tailwind.css";
-@import "@fontsource-variable/inter";
-@import "@fontsource-variable/jetbrains-mono";
+/* @fontsource-variable JBM + Inter imported from main.tsx as JS modules. */
+
+/* themes-v1: 18 preset palettes. Order matches docs/themes_v1.md §1 with
+   obsidian first (default). Each file declares .theme-<id> for the light
+   variant and .theme-<id>.dark for the dark variant (except ivory/chalk
+   which are light-only). lib/theme.ts owns the class composition on <html>. */
+@import "./themes/obsidian.css";
+@import "./themes/gunmetal.css";
+@import "./themes/espresso.css";
+@import "./themes/volcanic-brown.css";
+@import "./themes/copper.css";
+@import "./themes/gold.css";
+@import "./themes/oxblood.css";
+@import "./themes/crimson.css";
+@import "./themes/elderflower.css";
+@import "./themes/plum.css";
+@import "./themes/steel-pink.css";
+@import "./themes/fuchsia-noir.css";
+@import "./themes/matrix.css";
+@import "./themes/sage.css";
+@import "./themes/ivory.css";
+@import "./themes/chalk.css";
+@import "./themes/cobalt.css";
+@import "./themes/midnight-sapphire.css";
 
 @custom-variant dark (&:is(.dark *));
 
@@ -129,3 +151,96 @@
     @apply font-sans;
   }
 }
+
+/*
+ * iOS Safari auto-enlarges text in narrow viewports (anti-zoom). On its own
+ * that's fine for HTML chrome, but xterm.js measures its cell width from a
+ * hidden text-measure element — so when iOS up-sizes that element, xterm
+ * computes wider cells and the terminal ends up at fewer cols than it should.
+ * In opencode this surfaces as the small fragmented banner instead of the
+ * big chunky one (opencode picks the banner glyph set based on terminal
+ * width). 100% disables the auto-adjust and keeps boocode at the same
+ * effective cols as boolab on the same iPhone.
+ */
+html, body {
+  -webkit-text-size-adjust: 100% !important;
+  -ms-text-size-adjust: 100% !important;
+  text-size-adjust: 100% !important;
+}
+
+/* iOS Safari auto-zooms when a user taps an input/textarea whose font-size
+ * is under 16px. Pin every input/textarea/select to 16px (boolab pattern)
+ * to suppress the zoom — applies globally; specific components can override
+ * with `text-base` or inline if a smaller visual is intentional. */
+input, textarea, select {
+  font-size: 16px !important;
+}
+
+/*
+ * xterm.js overrides (boolab pattern — see /opt/boolab/frontend/src/styles/globals.css).
+ *
+ * Why these live in a global stylesheet, not in an inline <style> inside the
+ * component: an inline <style> inserted at component-mount time races the
+ * upstream @xterm/xterm/css/xterm.css that ships with the addon. We saw the
+ * right-edge stripe persist on iOS even though the override was identical to
+ * boolab's — moving the rules here so they're parsed alongside index.css
+ * eliminates that race.
+ */
+
+.xterm,
+.xterm *,
+.xterm .xterm-rows,
+.xterm .xterm-rows * {
+  font-family: 'JetBrains Mono Variable', 'JetBrains Mono', 'Fira Code', Menlo, monospace !important;
+}
+
+/* Fill the host node — xterm's only non-absolute sizing comes from the canvas,
+ * and fractional rounding would otherwise leave a phantom right-edge stripe.
+ */
+.xterm {
+  width: 100% !important;
+  height: 100% !important;
+}
+
+/* Lock cell metrics so block-element glyphs (U+2580..U+259F) tile without
+ * subpixel gaps. Any non-zero letter-spacing or line-height ≠ 1 leaves
+ * fractional space between cells that paints as a horizontal/vertical
+ * stripe through the opencode banner on iOS. Disabling ligatures
+ * (font-feature-settings + font-variant-ligatures) prevents the renderer
+ * from collapsing adjacent block chars into shaped glyphs at unpredictable
+ * widths.
+ */
+.xterm,
+.xterm .xterm-rows {
+  letter-spacing: 0 !important;
+  line-height: 1 !important;
+  font-feature-settings: "liga" 0, "calt" 0 !important;
+  font-variant-ligatures: none !important;
+}
+
+.xterm .xterm-viewport {
+  overflow-y: hidden !important;
+  scrollbar-width: none !important;
+  -ms-overflow-style: none !important;
+  /*
+   * xterm.css ships `background-color: #000` on the viewport (kept for OS X
+   * scrollbar opacity in the upstream default). FitAddon rounds cols down
+   * to integer cells, so .xterm-screen is up to `cellWidth - 1` pixels
+   * narrower than .xterm-viewport — the strip between the canvas right
+   * edge and the viewport right edge then paints viewport's #000, which
+   * differs from the theme background (#0b0f14, set on the host wrapper in
+   * TerminalPane.tsx + via Terminal options.theme.background) and shows up
+   * as a visible right-edge gap.
+   *
+   * Setting viewport's background transparent lets the host wrapper's
+   * #0b0f14 show through, hiding the sub-cell remainder. Single source of
+   * truth for the bg color: the host.
+   */
+  background-color: transparent !important;
+}
+
+.xterm .xterm-viewport::-webkit-scrollbar {
+  width: 0 !important;
+  height: 0 !important;
+  display: none !important;
+}

apps/web/src/styles/themes/chalk.css

@@ -0,0 +1,33 @@
+/* themes-v1: Chalk (family: light-only).
+   Anchors used directly as light palette: #fafaf7 #f0f0ec #e5e5e0 #75756e #2a2a28.
+   No .theme-chalk.dark — selecting dark mode on chalk falls back to obsidian
+   dark via lib/theme.ts. */
+.theme-chalk {
+  --background: #fafaf7;
+  --foreground: #2a2a28;
+  --card: #f0f0ec;
+  --card-foreground: #2a2a28;
+  --popover: #f0f0ec;
+  --popover-foreground: #2a2a28;
+  --primary: #2a2a28;
+  --primary-foreground: #fafaf7;
+  --secondary: #e5e5e0;
+  --secondary-foreground: #2a2a28;
+  --muted: #e5e5e0;
+  --muted-foreground: #75756e;
+  --accent: #2a2a28;
+  --accent-foreground: #fafaf7;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #e5e5e0;
+  --input: #e5e5e0;
+  --ring: #2a2a28;
+  --sidebar: #f0f0ec;
+  --sidebar-foreground: #2a2a28;
+  --sidebar-primary: #2a2a28;
+  --sidebar-primary-foreground: #fafaf7;
+  --sidebar-accent: #e5e5e0;
+  --sidebar-accent-foreground: #2a2a28;
+  --sidebar-border: #e5e5e0;
+  --sidebar-ring: #2a2a28;
+}

apps/web/src/styles/themes/cobalt.css

@@ -0,0 +1,60 @@
+/* themes-v1: Cobalt (family: blue).
+   Dark anchors: #020817 #061434 #0c2244 #3060a0 #0047ab. */
+.theme-cobalt {
+  --background: #f4f8ff;
+  --foreground: #0a1428;
+  --card: #e8f0fc;
+  --card-foreground: #0a1428;
+  --popover: #e8f0fc;
+  --popover-foreground: #0a1428;
+  --primary: #003278;
+  --primary-foreground: #ffffff;
+  --secondary: #d4e0f4;
+  --secondary-foreground: #0a1428;
+  --muted: #d4e0f4;
+  --muted-foreground: #284878;
+  --accent: #003278;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #d4e0f4;
+  --input: #d4e0f4;
+  --ring: #003278;
+  --sidebar: #e8f0fc;
+  --sidebar-foreground: #0a1428;
+  --sidebar-primary: #003278;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #d4e0f4;
+  --sidebar-accent-foreground: #0a1428;
+  --sidebar-border: #d4e0f4;
+  --sidebar-ring: #003278;
+}
+.theme-cobalt.dark {
+  --background: #020817;
+  --foreground: #dce4f0;
+  --card: #061434;
+  --card-foreground: #dce4f0;
+  --popover: #061434;
+  --popover-foreground: #dce4f0;
+  --primary: #0047ab;
+  --primary-foreground: #dce4f0;
+  --secondary: #0c2244;
+  --secondary-foreground: #dce4f0;
+  --muted: #0c2244;
+  --muted-foreground: #3060a0;
+  --accent: #0047ab;
+  --accent-foreground: #dce4f0;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #0c2244;
+  --input: #0c2244;
+  --ring: #0047ab;
+  --sidebar: #061434;
+  --sidebar-foreground: #dce4f0;
+  --sidebar-primary: #0047ab;
+  --sidebar-primary-foreground: #dce4f0;
+  --sidebar-accent: #0047ab;
+  --sidebar-accent-foreground: #dce4f0;
+  --sidebar-border: #0c2244;
+  --sidebar-ring: #0047ab;
+}

apps/web/src/styles/themes/copper.css

@@ -0,0 +1,60 @@
+/* themes-v1: Copper (family: orange/amber).
+   Dark anchors: #100800 #1c1408 #2e1f0a #8a6040 #b87333. */
+.theme-copper {
+  --background: #fdf8f0;
+  --foreground: #2a1f0a;
+  --card: #faf0e0;
+  --card-foreground: #2a1f0a;
+  --popover: #faf0e0;
+  --popover-foreground: #2a1f0a;
+  --primary: #8a5424;
+  --primary-foreground: #ffffff;
+  --secondary: #f0e0c0;
+  --secondary-foreground: #2a1f0a;
+  --muted: #f0e0c0;
+  --muted-foreground: #6e4828;
+  --accent: #8a5424;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #f0e0c0;
+  --input: #f0e0c0;
+  --ring: #8a5424;
+  --sidebar: #faf0e0;
+  --sidebar-foreground: #2a1f0a;
+  --sidebar-primary: #8a5424;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #f0e0c0;
+  --sidebar-accent-foreground: #2a1f0a;
+  --sidebar-border: #f0e0c0;
+  --sidebar-ring: #8a5424;
+}
+.theme-copper.dark {
+  --background: #100800;
+  --foreground: #f8e8c8;
+  --card: #1c1408;
+  --card-foreground: #f8e8c8;
+  --popover: #1c1408;
+  --popover-foreground: #f8e8c8;
+  --primary: #b87333;
+  --primary-foreground: #100800;
+  --secondary: #2e1f0a;
+  --secondary-foreground: #f8e8c8;
+  --muted: #2e1f0a;
+  --muted-foreground: #8a6040;
+  --accent: #b87333;
+  --accent-foreground: #100800;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #2e1f0a;
+  --input: #2e1f0a;
+  --ring: #b87333;
+  --sidebar: #1c1408;
+  --sidebar-foreground: #f8e8c8;
+  --sidebar-primary: #b87333;
+  --sidebar-primary-foreground: #100800;
+  --sidebar-accent: #b87333;
+  --sidebar-accent-foreground: #100800;
+  --sidebar-border: #2e1f0a;
+  --sidebar-ring: #b87333;
+}

apps/web/src/styles/themes/crimson.css

@@ -0,0 +1,60 @@
+/* themes-v1: Crimson (family: red/crimson).
+   Dark anchors: #0e0404 #1a0808 #2e0a0a #8a3030 #dc143c. */
+.theme-crimson {
+  --background: #fef4f6;
+  --foreground: #2a0a12;
+  --card: #fde6ea;
+  --card-foreground: #2a0a12;
+  --popover: #fde6ea;
+  --popover-foreground: #2a0a12;
+  --primary: #a40e2d;
+  --primary-foreground: #ffffff;
+  --secondary: #f4d0d8;
+  --secondary-foreground: #2a0a12;
+  --muted: #f4d0d8;
+  --muted-foreground: #6a2030;
+  --accent: #a40e2d;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #f4d0d8;
+  --input: #f4d0d8;
+  --ring: #a40e2d;
+  --sidebar: #fde6ea;
+  --sidebar-foreground: #2a0a12;
+  --sidebar-primary: #a40e2d;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #f4d0d8;
+  --sidebar-accent-foreground: #2a0a12;
+  --sidebar-border: #f4d0d8;
+  --sidebar-ring: #a40e2d;
+}
+.theme-crimson.dark {
+  --background: #0e0404;
+  --foreground: #f0d4d8;
+  --card: #1a0808;
+  --card-foreground: #f0d4d8;
+  --popover: #1a0808;
+  --popover-foreground: #f0d4d8;
+  --primary: #dc143c;
+  --primary-foreground: #0e0404;
+  --secondary: #2e0a0a;
+  --secondary-foreground: #f0d4d8;
+  --muted: #2e0a0a;
+  --muted-foreground: #8a3030;
+  --accent: #dc143c;
+  --accent-foreground: #0e0404;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #2e0a0a;
+  --input: #2e0a0a;
+  --ring: #dc143c;
+  --sidebar: #1a0808;
+  --sidebar-foreground: #f0d4d8;
+  --sidebar-primary: #dc143c;
+  --sidebar-primary-foreground: #0e0404;
+  --sidebar-accent: #dc143c;
+  --sidebar-accent-foreground: #0e0404;
+  --sidebar-border: #2e0a0a;
+  --sidebar-ring: #dc143c;
+}

apps/web/src/styles/themes/elderflower.css

@@ -0,0 +1,60 @@
+/* themes-v1: Elderflower (family: purple/violet).
+   Dark anchors: #100818 #1c1024 #2c1830 #8a78a0 #b89cd8. */
+.theme-elderflower {
+  --background: #faf8fd;
+  --foreground: #1f1428;
+  --card: #f4eef9;
+  --card-foreground: #1f1428;
+  --popover: #f4eef9;
+  --popover-foreground: #1f1428;
+  --primary: #8a70b4;
+  --primary-foreground: #ffffff;
+  --secondary: #e8def0;
+  --secondary-foreground: #1f1428;
+  --muted: #e8def0;
+  --muted-foreground: #6e5a82;
+  --accent: #8a70b4;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #e8def0;
+  --input: #e8def0;
+  --ring: #8a70b4;
+  --sidebar: #f4eef9;
+  --sidebar-foreground: #1f1428;
+  --sidebar-primary: #8a70b4;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #e8def0;
+  --sidebar-accent-foreground: #1f1428;
+  --sidebar-border: #e8def0;
+  --sidebar-ring: #8a70b4;
+}
+.theme-elderflower.dark {
+  --background: #100818;
+  --foreground: #ece4f0;
+  --card: #1c1024;
+  --card-foreground: #ece4f0;
+  --popover: #1c1024;
+  --popover-foreground: #ece4f0;
+  --primary: #b89cd8;
+  --primary-foreground: #100818;
+  --secondary: #2c1830;
+  --secondary-foreground: #ece4f0;
+  --muted: #2c1830;
+  --muted-foreground: #8a78a0;
+  --accent: #b89cd8;
+  --accent-foreground: #100818;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #2c1830;
+  --input: #2c1830;
+  --ring: #b89cd8;
+  --sidebar: #1c1024;
+  --sidebar-foreground: #ece4f0;
+  --sidebar-primary: #b89cd8;
+  --sidebar-primary-foreground: #100818;
+  --sidebar-accent: #b89cd8;
+  --sidebar-accent-foreground: #100818;
+  --sidebar-border: #2c1830;
+  --sidebar-ring: #b89cd8;
+}

apps/web/src/styles/themes/espresso.css

@@ -0,0 +1,60 @@
+/* themes-v1: Espresso (family: brown/earth).
+   Dark anchors: #1c1410 #241a14 #2e2218 #8a7058 #c8a880. */
+.theme-espresso {
+  --background: #faf6f0;
+  --foreground: #2a1f15;
+  --card: #f3ece0;
+  --card-foreground: #2a1f15;
+  --popover: #f3ece0;
+  --popover-foreground: #2a1f15;
+  --primary: #9c7948;
+  --primary-foreground: #ffffff;
+  --secondary: #e6dccc;
+  --secondary-foreground: #2a1f15;
+  --muted: #e6dccc;
+  --muted-foreground: #6e5944;
+  --accent: #9c7948;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #e6dccc;
+  --input: #e6dccc;
+  --ring: #9c7948;
+  --sidebar: #f3ece0;
+  --sidebar-foreground: #2a1f15;
+  --sidebar-primary: #9c7948;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #e6dccc;
+  --sidebar-accent-foreground: #2a1f15;
+  --sidebar-border: #e6dccc;
+  --sidebar-ring: #9c7948;
+}
+.theme-espresso.dark {
+  --background: #1c1410;
+  --foreground: #f0e8d8;
+  --card: #241a14;
+  --card-foreground: #f0e8d8;
+  --popover: #241a14;
+  --popover-foreground: #f0e8d8;
+  --primary: #c8a880;
+  --primary-foreground: #1c1410;
+  --secondary: #2e2218;
+  --secondary-foreground: #f0e8d8;
+  --muted: #2e2218;
+  --muted-foreground: #8a7058;
+  --accent: #c8a880;
+  --accent-foreground: #1c1410;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #2e2218;
+  --input: #2e2218;
+  --ring: #c8a880;
+  --sidebar: #241a14;
+  --sidebar-foreground: #f0e8d8;
+  --sidebar-primary: #c8a880;
+  --sidebar-primary-foreground: #1c1410;
+  --sidebar-accent: #c8a880;
+  --sidebar-accent-foreground: #1c1410;
+  --sidebar-border: #2e2218;
+  --sidebar-ring: #c8a880;
+}

apps/web/src/styles/themes/fuchsia-noir.css

@@ -0,0 +1,60 @@
+/* themes-v1: Fuchsia Noir (family: pink/magenta).
+   Dark anchors: #0a0610 #14081a #2a0c2e #8a3878 #ff1493. */
+.theme-fuchsia-noir {
+  --background: #fdf4f8;
+  --foreground: #2a0a1c;
+  --card: #fbe6f0;
+  --card-foreground: #2a0a1c;
+  --popover: #fbe6f0;
+  --popover-foreground: #2a0a1c;
+  --primary: #c20070;
+  --primary-foreground: #ffffff;
+  --secondary: #f4d0e4;
+  --secondary-foreground: #2a0a1c;
+  --muted: #f4d0e4;
+  --muted-foreground: #7a2860;
+  --accent: #c20070;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #f4d0e4;
+  --input: #f4d0e4;
+  --ring: #c20070;
+  --sidebar: #fbe6f0;
+  --sidebar-foreground: #2a0a1c;
+  --sidebar-primary: #c20070;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #f4d0e4;
+  --sidebar-accent-foreground: #2a0a1c;
+  --sidebar-border: #f4d0e4;
+  --sidebar-ring: #c20070;
+}
+.theme-fuchsia-noir.dark {
+  --background: #0a0610;
+  --foreground: #f0d8e8;
+  --card: #14081a;
+  --card-foreground: #f0d8e8;
+  --popover: #14081a;
+  --popover-foreground: #f0d8e8;
+  --primary: #ff1493;
+  --primary-foreground: #0a0610;
+  --secondary: #2a0c2e;
+  --secondary-foreground: #f0d8e8;
+  --muted: #2a0c2e;
+  --muted-foreground: #8a3878;
+  --accent: #ff1493;
+  --accent-foreground: #0a0610;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #2a0c2e;
+  --input: #2a0c2e;
+  --ring: #ff1493;
+  --sidebar: #14081a;
+  --sidebar-foreground: #f0d8e8;
+  --sidebar-primary: #ff1493;
+  --sidebar-primary-foreground: #0a0610;
+  --sidebar-accent: #ff1493;
+  --sidebar-accent-foreground: #0a0610;
+  --sidebar-border: #2a0c2e;
+  --sidebar-ring: #ff1493;
+}

apps/web/src/styles/themes/gold.css

@@ -0,0 +1,60 @@
+/* themes-v1: Gold (family: orange/amber).
+   Dark anchors: #0e0800 #1a1200 #2a1f00 #a07c30 #d4af37. */
+.theme-gold {
+  --background: #fffbf0;
+  --foreground: #2a200a;
+  --card: #fdf3d0;
+  --card-foreground: #2a200a;
+  --popover: #fdf3d0;
+  --popover-foreground: #2a200a;
+  --primary: #a18229;
+  --primary-foreground: #ffffff;
+  --secondary: #f0e0a0;
+  --secondary-foreground: #2a200a;
+  --muted: #f0e0a0;
+  --muted-foreground: #786020;
+  --accent: #a18229;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #f0e0a0;
+  --input: #f0e0a0;
+  --ring: #a18229;
+  --sidebar: #fdf3d0;
+  --sidebar-foreground: #2a200a;
+  --sidebar-primary: #a18229;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #f0e0a0;
+  --sidebar-accent-foreground: #2a200a;
+  --sidebar-border: #f0e0a0;
+  --sidebar-ring: #a18229;
+}
+.theme-gold.dark {
+  --background: #0e0800;
+  --foreground: #fff0d0;
+  --card: #1a1200;
+  --card-foreground: #fff0d0;
+  --popover: #1a1200;
+  --popover-foreground: #fff0d0;
+  --primary: #d4af37;
+  --primary-foreground: #0e0800;
+  --secondary: #2a1f00;
+  --secondary-foreground: #fff0d0;
+  --muted: #2a1f00;
+  --muted-foreground: #a07c30;
+  --accent: #d4af37;
+  --accent-foreground: #0e0800;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #2a1f00;
+  --input: #2a1f00;
+  --ring: #d4af37;
+  --sidebar: #1a1200;
+  --sidebar-foreground: #fff0d0;
+  --sidebar-primary: #d4af37;
+  --sidebar-primary-foreground: #0e0800;
+  --sidebar-accent: #d4af37;
+  --sidebar-accent-foreground: #0e0800;
+  --sidebar-border: #2a1f00;
+  --sidebar-ring: #d4af37;
+}

apps/web/src/styles/themes/gunmetal.css

@@ -0,0 +1,60 @@
+/* themes-v1: Gunmetal (family: charcoal/black).
+   Dark anchors: #0d1117 #161b22 #21262d #7d8590 #388bfd. */
+.theme-gunmetal {
+  --background: #fafafa;
+  --foreground: #14181f;
+  --card: #f1f3f6;
+  --card-foreground: #14181f;
+  --popover: #f1f3f6;
+  --popover-foreground: #14181f;
+  --primary: #0c6dd0;
+  --primary-foreground: #ffffff;
+  --secondary: #dde1e8;
+  --secondary-foreground: #14181f;
+  --muted: #dde1e8;
+  --muted-foreground: #5a6470;
+  --accent: #0c6dd0;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #dde1e8;
+  --input: #dde1e8;
+  --ring: #0c6dd0;
+  --sidebar: #f1f3f6;
+  --sidebar-foreground: #14181f;
+  --sidebar-primary: #0c6dd0;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #dde1e8;
+  --sidebar-accent-foreground: #14181f;
+  --sidebar-border: #dde1e8;
+  --sidebar-ring: #0c6dd0;
+}
+.theme-gunmetal.dark {
+  --background: #0d1117;
+  --foreground: #e6ecf0;
+  --card: #161b22;
+  --card-foreground: #e6ecf0;
+  --popover: #161b22;
+  --popover-foreground: #e6ecf0;
+  --primary: #388bfd;
+  --primary-foreground: #0d1117;
+  --secondary: #21262d;
+  --secondary-foreground: #e6ecf0;
+  --muted: #21262d;
+  --muted-foreground: #7d8590;
+  --accent: #388bfd;
+  --accent-foreground: #0d1117;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #21262d;
+  --input: #21262d;
+  --ring: #388bfd;
+  --sidebar: #161b22;
+  --sidebar-foreground: #e6ecf0;
+  --sidebar-primary: #388bfd;
+  --sidebar-primary-foreground: #0d1117;
+  --sidebar-accent: #388bfd;
+  --sidebar-accent-foreground: #0d1117;
+  --sidebar-border: #21262d;
+  --sidebar-ring: #388bfd;
+}

apps/web/src/styles/themes/ivory.css

@@ -0,0 +1,33 @@
+/* themes-v1: Ivory (family: light-only).
+   Anchors used directly as light palette: #fdfcf8 #f5f2e8 #e8e4d8 #8a8478 #3a3328.
+   No .theme-ivory.dark — selecting dark mode on ivory falls back to obsidian
+   dark via lib/theme.ts. */
+.theme-ivory {
+  --background: #fdfcf8;
+  --foreground: #3a3328;
+  --card: #f5f2e8;
+  --card-foreground: #3a3328;
+  --popover: #f5f2e8;
+  --popover-foreground: #3a3328;
+  --primary: #3a3328;
+  --primary-foreground: #fdfcf8;
+  --secondary: #e8e4d8;
+  --secondary-foreground: #3a3328;
+  --muted: #e8e4d8;
+  --muted-foreground: #8a8478;
+  --accent: #3a3328;
+  --accent-foreground: #fdfcf8;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #e8e4d8;
+  --input: #e8e4d8;
+  --ring: #3a3328;
+  --sidebar: #f5f2e8;
+  --sidebar-foreground: #3a3328;
+  --sidebar-primary: #3a3328;
+  --sidebar-primary-foreground: #fdfcf8;
+  --sidebar-accent: #e8e4d8;
+  --sidebar-accent-foreground: #3a3328;
+  --sidebar-border: #e8e4d8;
+  --sidebar-ring: #3a3328;
+}

apps/web/src/styles/themes/matrix.css

@@ -0,0 +1,60 @@
+/* themes-v1: Matrix (family: green, neon).
+   Dark anchors: #000a00 #031403 #0a200a #208030 #00ff41. */
+.theme-matrix {
+  --background: #f0fff4;
+  --foreground: #0a2a15;
+  --card: #e0f8e8;
+  --card-foreground: #0a2a15;
+  --popover: #e0f8e8;
+  --popover-foreground: #0a2a15;
+  --primary: #00b830;
+  --primary-foreground: #ffffff;
+  --secondary: #c0e8d0;
+  --secondary-foreground: #0a2a15;
+  --muted: #c0e8d0;
+  --muted-foreground: #208048;
+  --accent: #00b830;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #c0e8d0;
+  --input: #c0e8d0;
+  --ring: #00b830;
+  --sidebar: #e0f8e8;
+  --sidebar-foreground: #0a2a15;
+  --sidebar-primary: #00b830;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #c0e8d0;
+  --sidebar-accent-foreground: #0a2a15;
+  --sidebar-border: #c0e8d0;
+  --sidebar-ring: #00b830;
+}
+.theme-matrix.dark {
+  --background: #000a00;
+  --foreground: #d8f8e0;
+  --card: #031403;
+  --card-foreground: #d8f8e0;
+  --popover: #031403;
+  --popover-foreground: #d8f8e0;
+  --primary: #00ff41;
+  --primary-foreground: #000a00;
+  --secondary: #0a200a;
+  --secondary-foreground: #d8f8e0;
+  --muted: #0a200a;
+  --muted-foreground: #208030;
+  --accent: #00ff41;
+  --accent-foreground: #000a00;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #0a200a;
+  --input: #0a200a;
+  --ring: #00ff41;
+  --sidebar: #031403;
+  --sidebar-foreground: #d8f8e0;
+  --sidebar-primary: #00ff41;
+  --sidebar-primary-foreground: #000a00;
+  --sidebar-accent: #00ff41;
+  --sidebar-accent-foreground: #000a00;
+  --sidebar-border: #0a200a;
+  --sidebar-ring: #00ff41;
+}

apps/web/src/styles/themes/midnight-sapphire.css

@@ -0,0 +1,60 @@
+/* themes-v1: Midnight Sapphire (family: blue).
+   Dark anchors: #02050e #060c1f #0e1a36 #4a6088 #1e3a8a. */
+.theme-midnight-sapphire {
+  --background: #f4f6fc;
+  --foreground: #0a1024;
+  --card: #e6eaf6;
+  --card-foreground: #0a1024;
+  --popover: #e6eaf6;
+  --popover-foreground: #0a1024;
+  --primary: #142a60;
+  --primary-foreground: #ffffff;
+  --secondary: #d0d8ec;
+  --secondary-foreground: #0a1024;
+  --muted: #d0d8ec;
+  --muted-foreground: #36507a;
+  --accent: #142a60;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #d0d8ec;
+  --input: #d0d8ec;
+  --ring: #142a60;
+  --sidebar: #e6eaf6;
+  --sidebar-foreground: #0a1024;
+  --sidebar-primary: #142a60;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #d0d8ec;
+  --sidebar-accent-foreground: #0a1024;
+  --sidebar-border: #d0d8ec;
+  --sidebar-ring: #142a60;
+}
+.theme-midnight-sapphire.dark {
+  --background: #02050e;
+  --foreground: #dce0f0;
+  --card: #060c1f;
+  --card-foreground: #dce0f0;
+  --popover: #060c1f;
+  --popover-foreground: #dce0f0;
+  --primary: #1e3a8a;
+  --primary-foreground: #dce0f0;
+  --secondary: #0e1a36;
+  --secondary-foreground: #dce0f0;
+  --muted: #0e1a36;
+  --muted-foreground: #4a6088;
+  --accent: #1e3a8a;
+  --accent-foreground: #dce0f0;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #0e1a36;
+  --input: #0e1a36;
+  --ring: #1e3a8a;
+  --sidebar: #060c1f;
+  --sidebar-foreground: #dce0f0;
+  --sidebar-primary: #1e3a8a;
+  --sidebar-primary-foreground: #dce0f0;
+  --sidebar-accent: #1e3a8a;
+  --sidebar-accent-foreground: #dce0f0;
+  --sidebar-border: #0e1a36;
+  --sidebar-ring: #1e3a8a;
+}

apps/web/src/styles/themes/obsidian.css

@@ -0,0 +1,60 @@
+/* themes-v1: Obsidian (family: charcoal/black). Default theme.
+   Dark anchors: #0c0c0e #15151a #1f1f23 #6b6b75 #8b5cf6. Light variant per spec §3. */
+.theme-obsidian {
+  --background: #fafafa;
+  --foreground: #18181b;
+  --card: #f4f4f5;
+  --card-foreground: #18181b;
+  --popover: #f4f4f5;
+  --popover-foreground: #18181b;
+  --primary: #6d40e8;
+  --primary-foreground: #ffffff;
+  --secondary: #e4e4e7;
+  --secondary-foreground: #18181b;
+  --muted: #e4e4e7;
+  --muted-foreground: #71717a;
+  --accent: #6d40e8;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #e4e4e7;
+  --input: #e4e4e7;
+  --ring: #6d40e8;
+  --sidebar: #f4f4f5;
+  --sidebar-foreground: #18181b;
+  --sidebar-primary: #6d40e8;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #e4e4e7;
+  --sidebar-accent-foreground: #18181b;
+  --sidebar-border: #e4e4e7;
+  --sidebar-ring: #6d40e8;
+}
+.theme-obsidian.dark {
+  --background: #0c0c0e;
+  --foreground: #ece9f0;
+  --card: #15151a;
+  --card-foreground: #ece9f0;
+  --popover: #15151a;
+  --popover-foreground: #ece9f0;
+  --primary: #8b5cf6;
+  --primary-foreground: #0c0c0e;
+  --secondary: #1f1f23;
+  --secondary-foreground: #ece9f0;
+  --muted: #1f1f23;
+  --muted-foreground: #6b6b75;
+  --accent: #8b5cf6;
+  --accent-foreground: #0c0c0e;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #1f1f23;
+  --input: #1f1f23;
+  --ring: #8b5cf6;
+  --sidebar: #15151a;
+  --sidebar-foreground: #ece9f0;
+  --sidebar-primary: #8b5cf6;
+  --sidebar-primary-foreground: #0c0c0e;
+  --sidebar-accent: #8b5cf6;
+  --sidebar-accent-foreground: #0c0c0e;
+  --sidebar-border: #1f1f23;
+  --sidebar-ring: #8b5cf6;
+}

apps/web/src/styles/themes/oxblood.css

@@ -0,0 +1,60 @@
+/* themes-v1: Oxblood (family: red/crimson).
+   Dark anchors: #0a0303 #180606 #2a0808 #7a3028 #8b1a1a. */
+.theme-oxblood {
+  --background: #fdf4f4;
+  --foreground: #2a0a0a;
+  --card: #fae6e6;
+  --card-foreground: #2a0a0a;
+  --popover: #fae6e6;
+  --popover-foreground: #2a0a0a;
+  --primary: #5e1010;
+  --primary-foreground: #ffffff;
+  --secondary: #f0d0d0;
+  --secondary-foreground: #2a0a0a;
+  --muted: #f0d0d0;
+  --muted-foreground: #582020;
+  --accent: #5e1010;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #f0d0d0;
+  --input: #f0d0d0;
+  --ring: #5e1010;
+  --sidebar: #fae6e6;
+  --sidebar-foreground: #2a0a0a;
+  --sidebar-primary: #5e1010;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #f0d0d0;
+  --sidebar-accent-foreground: #2a0a0a;
+  --sidebar-border: #f0d0d0;
+  --sidebar-ring: #5e1010;
+}
+.theme-oxblood.dark {
+  --background: #0a0303;
+  --foreground: #f0d8d8;
+  --card: #180606;
+  --card-foreground: #f0d8d8;
+  --popover: #180606;
+  --popover-foreground: #f0d8d8;
+  --primary: #8b1a1a;
+  --primary-foreground: #0a0303;
+  --secondary: #2a0808;
+  --secondary-foreground: #f0d8d8;
+  --muted: #2a0808;
+  --muted-foreground: #7a3028;
+  --accent: #8b1a1a;
+  --accent-foreground: #0a0303;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #2a0808;
+  --input: #2a0808;
+  --ring: #8b1a1a;
+  --sidebar: #180606;
+  --sidebar-foreground: #f0d8d8;
+  --sidebar-primary: #8b1a1a;
+  --sidebar-primary-foreground: #0a0303;
+  --sidebar-accent: #8b1a1a;
+  --sidebar-accent-foreground: #0a0303;
+  --sidebar-border: #2a0808;
+  --sidebar-ring: #8b1a1a;
+}

apps/web/src/styles/themes/plum.css

@@ -0,0 +1,60 @@
+/* themes-v1: Plum (family: purple/violet).
+   Dark anchors: #0c0814 #180e20 #241830 #7a4878 #8e4585. */
+.theme-plum {
+  --background: #fbf7fd;
+  --foreground: #1f0f24;
+  --card: #f4ebf6;
+  --card-foreground: #1f0f24;
+  --popover: #f4ebf6;
+  --popover-foreground: #1f0f24;
+  --primary: #6a3263;
+  --primary-foreground: #ffffff;
+  --secondary: #e8d8ea;
+  --secondary-foreground: #1f0f24;
+  --muted: #e8d8ea;
+  --muted-foreground: #5e3858;
+  --accent: #6a3263;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #e8d8ea;
+  --input: #e8d8ea;
+  --ring: #6a3263;
+  --sidebar: #f4ebf6;
+  --sidebar-foreground: #1f0f24;
+  --sidebar-primary: #6a3263;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #e8d8ea;
+  --sidebar-accent-foreground: #1f0f24;
+  --sidebar-border: #e8d8ea;
+  --sidebar-ring: #6a3263;
+}
+.theme-plum.dark {
+  --background: #0c0814;
+  --foreground: #ecd8ec;
+  --card: #180e20;
+  --card-foreground: #ecd8ec;
+  --popover: #180e20;
+  --popover-foreground: #ecd8ec;
+  --primary: #8e4585;
+  --primary-foreground: #0c0814;
+  --secondary: #241830;
+  --secondary-foreground: #ecd8ec;
+  --muted: #241830;
+  --muted-foreground: #7a4878;
+  --accent: #8e4585;
+  --accent-foreground: #0c0814;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #241830;
+  --input: #241830;
+  --ring: #8e4585;
+  --sidebar: #180e20;
+  --sidebar-foreground: #ecd8ec;
+  --sidebar-primary: #8e4585;
+  --sidebar-primary-foreground: #0c0814;
+  --sidebar-accent: #8e4585;
+  --sidebar-accent-foreground: #0c0814;
+  --sidebar-border: #241830;
+  --sidebar-ring: #8e4585;
+}

apps/web/src/styles/themes/sage.css

@@ -0,0 +1,60 @@
+/* themes-v1: Sage (family: green, warm).
+   Dark anchors: #0a0e08 #141a10 #1e2e1a #7a8870 #9caf88. */
+.theme-sage {
+  --background: #f4f8f0;
+  --foreground: #1a2510;
+  --card: #ebf2e2;
+  --card-foreground: #1a2510;
+  --popover: #ebf2e2;
+  --popover-foreground: #1a2510;
+  --primary: #708868;
+  --primary-foreground: #ffffff;
+  --secondary: #d8e2c8;
+  --secondary-foreground: #1a2510;
+  --muted: #d8e2c8;
+  --muted-foreground: #5a6850;
+  --accent: #708868;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #d8e2c8;
+  --input: #d8e2c8;
+  --ring: #708868;
+  --sidebar: #ebf2e2;
+  --sidebar-foreground: #1a2510;
+  --sidebar-primary: #708868;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #d8e2c8;
+  --sidebar-accent-foreground: #1a2510;
+  --sidebar-border: #d8e2c8;
+  --sidebar-ring: #708868;
+}
+.theme-sage.dark {
+  --background: #0a0e08;
+  --foreground: #e8eee0;
+  --card: #141a10;
+  --card-foreground: #e8eee0;
+  --popover: #141a10;
+  --popover-foreground: #e8eee0;
+  --primary: #9caf88;
+  --primary-foreground: #0a0e08;
+  --secondary: #1e2e1a;
+  --secondary-foreground: #e8eee0;
+  --muted: #1e2e1a;
+  --muted-foreground: #7a8870;
+  --accent: #9caf88;
+  --accent-foreground: #0a0e08;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #1e2e1a;
+  --input: #1e2e1a;
+  --ring: #9caf88;
+  --sidebar: #141a10;
+  --sidebar-foreground: #e8eee0;
+  --sidebar-primary: #9caf88;
+  --sidebar-primary-foreground: #0a0e08;
+  --sidebar-accent: #9caf88;
+  --sidebar-accent-foreground: #0a0e08;
+  --sidebar-border: #1e2e1a;
+  --sidebar-ring: #9caf88;
+}

apps/web/src/styles/themes/steel-pink.css

@@ -0,0 +1,60 @@
+/* themes-v1: Steel Pink (family: pink/magenta).
+   Dark anchors: #0e0408 #1a080e #2e0c1a #9a4070 #cc33aa. */
+.theme-steel-pink {
+  --background: #fdf4fa;
+  --foreground: #2a0a1f;
+  --card: #fbe8f4;
+  --card-foreground: #2a0a1f;
+  --popover: #fbe8f4;
+  --popover-foreground: #2a0a1f;
+  --primary: #952382;
+  --primary-foreground: #ffffff;
+  --secondary: #f4d4ea;
+  --secondary-foreground: #2a0a1f;
+  --muted: #f4d4ea;
+  --muted-foreground: #7a3058;
+  --accent: #952382;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #f4d4ea;
+  --input: #f4d4ea;
+  --ring: #952382;
+  --sidebar: #fbe8f4;
+  --sidebar-foreground: #2a0a1f;
+  --sidebar-primary: #952382;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #f4d4ea;
+  --sidebar-accent-foreground: #2a0a1f;
+  --sidebar-border: #f4d4ea;
+  --sidebar-ring: #952382;
+}
+.theme-steel-pink.dark {
+  --background: #0e0408;
+  --foreground: #f0d8e8;
+  --card: #1a080e;
+  --card-foreground: #f0d8e8;
+  --popover: #1a080e;
+  --popover-foreground: #f0d8e8;
+  --primary: #cc33aa;
+  --primary-foreground: #0e0408;
+  --secondary: #2e0c1a;
+  --secondary-foreground: #f0d8e8;
+  --muted: #2e0c1a;
+  --muted-foreground: #9a4070;
+  --accent: #cc33aa;
+  --accent-foreground: #0e0408;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #2e0c1a;
+  --input: #2e0c1a;
+  --ring: #cc33aa;
+  --sidebar: #1a080e;
+  --sidebar-foreground: #f0d8e8;
+  --sidebar-primary: #cc33aa;
+  --sidebar-primary-foreground: #0e0408;
+  --sidebar-accent: #cc33aa;
+  --sidebar-accent-foreground: #0e0408;
+  --sidebar-border: #2e0c1a;
+  --sidebar-ring: #cc33aa;
+}

apps/web/src/styles/themes/volcanic-brown.css

@@ -0,0 +1,60 @@
+/* themes-v1: Volcanic Brown (family: brown/earth).
+   Dark anchors: #140906 #1e0e0a #2e1610 #7a4030 #cc4a1a. */
+.theme-volcanic-brown {
+  --background: #faf3ee;
+  --foreground: #2a1410;
+  --card: #f3e6dc;
+  --card-foreground: #2a1410;
+  --popover: #f3e6dc;
+  --popover-foreground: #2a1410;
+  --primary: #983614;
+  --primary-foreground: #ffffff;
+  --secondary: #e8d4c4;
+  --secondary-foreground: #2a1410;
+  --muted: #e8d4c4;
+  --muted-foreground: #5e2818;
+  --accent: #983614;
+  --accent-foreground: #ffffff;
+  --destructive: #b91c1c;
+  --destructive-foreground: #ffffff;
+  --border: #e8d4c4;
+  --input: #e8d4c4;
+  --ring: #983614;
+  --sidebar: #f3e6dc;
+  --sidebar-foreground: #2a1410;
+  --sidebar-primary: #983614;
+  --sidebar-primary-foreground: #ffffff;
+  --sidebar-accent: #e8d4c4;
+  --sidebar-accent-foreground: #2a1410;
+  --sidebar-border: #e8d4c4;
+  --sidebar-ring: #983614;
+}
+.theme-volcanic-brown.dark {
+  --background: #140906;
+  --foreground: #f0e0d4;
+  --card: #1e0e0a;
+  --card-foreground: #f0e0d4;
+  --popover: #1e0e0a;
+  --popover-foreground: #f0e0d4;
+  --primary: #cc4a1a;
+  --primary-foreground: #140906;
+  --secondary: #2e1610;
+  --secondary-foreground: #f0e0d4;
+  --muted: #2e1610;
+  --muted-foreground: #7a4030;
+  --accent: #cc4a1a;
+  --accent-foreground: #140906;
+  --destructive: #dc2626;
+  --destructive-foreground: #ffffff;
+  --border: #2e1610;
+  --input: #2e1610;
+  --ring: #cc4a1a;
+  --sidebar: #1e0e0a;
+  --sidebar-foreground: #f0e0d4;
+  --sidebar-primary: #cc4a1a;
+  --sidebar-primary-foreground: #140906;
+  --sidebar-accent: #cc4a1a;
+  --sidebar-accent-foreground: #140906;
+  --sidebar-border: #2e1610;
+  --sidebar-ring: #cc4a1a;
+}

apps/web/vite.config.ts

@@ -12,6 +12,24 @@ export default defineConfig({
   server: {
     port: 5173,
     proxy: {
+      // Booterm runs on a separate port (9501 in compose). Order matters:
+      // /api/term/* and /ws/term/* must be listed before the broader /api
+      // entry so Vite matches the more specific prefix first.
+      '/api/term': {
+        target: process.env.BOOTERM_DEV_URL ?? 'http://127.0.0.1:9501',
+        changeOrigin: true,
+        headers: {
+          'Remote-User': process.env.DEV_REMOTE_USER ?? 'sam',
+        },
+      },
+      '/ws/term': {
+        target: process.env.BOOTERM_DEV_URL ?? 'http://127.0.0.1:9501',
+        changeOrigin: true,
+        ws: true,
+        headers: {
+          'Remote-User': process.env.DEV_REMOTE_USER ?? 'sam',
+        },
+      },
       '/api': {
         target: 'http://127.0.0.1:3000',
         changeOrigin: true,

boocode_batch10.md

@@ -0,0 +1,269 @@
+# BooCode v1.1 — Batch 10
+
+**Theme:** BooTerm. Second container, dedicated to in-browser terminals. Per-session tmux. xterm.js + node-pty in-container. New pane type wires into the BooCode shell.
+**Status:** Planned. Largest batch in v1.1. Depends on Batch 3 (pane system), Batch 7 (settings drawer pattern reused).
+**Repo:** `/opt/boocode/` (shared monorepo). New `apps/booterm/` subdirectory.
+
+## Goals
+
+1. New container `booterm` running Fastify + node-pty + tmux. Per-session tmux session keyed by `(user, session_id)`.
+2. xterm.js terminal pane in the BooCode shell. Multiple terminal panes per session, each attached to a separate tmux window.
+3. PTY traffic over WebSocket. Auth via `Remote-User`.
+4. tmux as session manager so terminals survive WebSocket reconnects, page refreshes, even container restarts.
+5. Read+write capability scoped to project root. No `cd ..` escape.
+6. Path-based routing: `code.indifferentketchup.com/api/term/*` → booterm; `/ws/term/*` → booterm.
+
+## Architecture
+
+```
+browser ──HTTPS──> Caddy (droplet) ──Tailscale──> Authelia
+                                                      │
+                                                      ├── /api/chat/*, /ws/chat/*  → boocode  :9500
+                                                      ├── /api/term/*, /ws/term/*  → booterm  :9501
+                                                      └── /                        → boocode (SPA)
+
+booterm container:
+  - Fastify (Node 20)
+  - node-pty
+  - tmux installed in container (apk add tmux)
+  - same Postgres (boocode_db)
+  - mounts projects rw (scoped)
+```
+
+### Mount strategy
+
+Decided: Option A. Per-project bind mounts in `docker-compose.yml`. Already applied: booterm has `/opt:/opt:rw` to keep parity with the existing boocode mount and avoid enumerating roots. Project root for any given session derives from `projects.root_path` and tmux launches with `cwd` set there.
+
+### tmux session naming
+
+Per-session tmux:
+
+```
+tmux session name: bc-<session_id>     (UUID, sanitized — alphanumeric + hyphen)
+tmux windows:      term-<pane_id>      (one window per terminal pane)
+```
+
+booterm spawns `tmux new-session -d -s bc-<sid> -c <project_root>` lazily on first attach. Subsequent attaches do `tmux new-window -t bc-<sid>` for additional panes, or `tmux attach -t bc-<sid>` and select window.
+
+## Data model
+
+| Column | On | Type | Default | Notes |
+|---|---|---|---|---|
+| (none) | — | — | — | terminals are tmux-managed, no DB rows |
+| `kind = 'terminal'` | `session_panes.kind` CHECK | — | — | Extend CHECK to include `'terminal'` |
+| `state.tmux_window` | `session_panes.state` JSONB | TEXT | NULL | Which tmux window this pane attaches to |
+
+Schema (already applied to live DB + schema.sql):
+
+```sql
+ALTER TABLE session_panes DROP CONSTRAINT IF EXISTS session_panes_kind_check;
+ALTER TABLE session_panes ADD CONSTRAINT session_panes_kind_check
+  CHECK (kind IN ('chat', 'file_browser', 'terminal'));
+```
+
+## Backend (booterm)
+
+New app at `apps/booterm/`:
+
+```
+apps/booterm/
+├── src/
+│   ├── index.ts        # Fastify + WS + auth
+│   ├── auth.ts         # Remote-User middleware (same pattern as boocode)
+│   ├── db.ts           # pg pool (shared boocode_db)
+│   ├── routes/
+│   │   ├── health.ts
+│   │   └── terminals.ts  # POST /api/term/sessions/:sid/panes/:pid/start (creates tmux window)
+│   ├── pty/
+│   │   ├── manager.ts    # tmux process management
+│   │   └── pty.ts        # node-pty wrapper for `tmux attach -t ... -d`
+│   └── ws/
+│       └── attach.ts     # WS /ws/term/sessions/:sid/panes/:pid → PTY bidi pipe
+├── package.json
+└── tsconfig.json
+```
+
+### Endpoints
+
+| Method | Path | Notes |
+|---|---|---|
+| GET | `/api/term/health` | Ping |
+| POST | `/api/term/sessions/:sid/panes/:pid/start` | Idempotent tmux window create. Returns `{tmux_window: "term-<pid>"}` |
+| WS | `/ws/term/sessions/:sid/panes/:pid` | Attach PTY |
+| POST | `/api/term/sessions/:sid/panes/:pid/resize` | `{cols, rows}` |
+| POST | `/api/term/sessions/:sid/panes/:pid/kill` | Kill the tmux window |
+
+WS frames (binary or text):
+
+```
+client → server: pty input (raw bytes, typed by user)
+server → client: pty output (raw bytes from shell)
+server → client: {type: "exit", code} on window close
+```
+
+### Auth + scoping
+
+- `Remote-User` required on WS upgrade.
+- `session_id` validated: lookup in `sessions` table; require row exists.
+- `pane_id` validated: must exist in `session_panes` with `kind = 'terminal'` and matching `session_id`.
+- Project root derived from `sessions.project_id → projects.root_path`. tmux starts `cd <root>` in that dir. **No chroot.** User can `cd /` and read anything mounted into the container.
+  - Future hardening: namespace/chroot. Out of v1.1 scope.
+
+### tmux config
+
+`apps/booterm/tmux.conf` bundled into image at `/etc/booterm/tmux.conf`; tmux invocations use `-f /etc/booterm/tmux.conf`:
+
+```
+set -g default-terminal "screen-256color"
+set -g history-limit 50000
+set -g mouse on
+setw -g mode-keys vi
+set -g status off
+set -g destroy-unattached off
+```
+
+Boolab pattern (from `services/tmux_session.py`).
+
+## Frontend
+
+| File | Change |
+|---|---|
+| `apps/web/src/components/panes/TerminalPane.tsx` (NEW) | xterm.js mount, WS attach, resize handler |
+| `apps/web/src/api/client.ts` | `api.terminals.start(sessionId, paneId)`, `api.terminals.resize(...)`, `api.terminals.kill(...)` |
+| `apps/web/src/components/Workspace.tsx` | Add 'terminal' to the pane kind enum; spawn button → POST start → render TerminalPane. Tab UI lives in Workspace.tsx — there is no PaneTab.tsx file. |
+| `apps/web/package.json` | `xterm` + `xterm-addon-fit` + `xterm-addon-web-links` |
+
+### TerminalPane
+
+```tsx
+useEffect(() => {
+  const term = new Terminal({ fontFamily: 'JetBrains Mono', fontSize: 14, theme: ... });
+  const fit = new FitAddon();
+  term.loadAddon(fit);
+  term.loadAddon(new WebLinksAddon());
+  term.open(containerRef.current);
+  fit.fit();
+
+  const proto = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
+  const ws = new WebSocket(`${proto}//${window.location.host}/ws/term/sessions/${sid}/panes/${pid}`);
+  ws.binaryType = 'arraybuffer';
+  ws.onmessage = e => term.write(typeof e.data === 'string' ? e.data : new Uint8Array(e.data));
+  term.onData(data => ws.send(data));
+  term.onResize(({ cols, rows }) => api.terminals.resize(sid, pid, cols, rows));
+
+  const ro = new ResizeObserver(() => fit.fit());
+  ro.observe(containerRef.current);
+
+  return () => { ws.close(); term.dispose(); ro.disconnect(); };
+}, [sid, pid]);
+```
+
+Dev: vite.config.ts needs `/api/term` and `/ws/term` proxy entries mirroring the existing `/api` and `/ws` ones.
+
+## Send-to-terminal from chat
+
+Boolab pattern: select text in a message → "Send to terminal" button → text becomes terminal input.
+
+- Right-click context menu on selected text in chat → "Send to terminal" submenu lists open terminal panes.
+- Click target → sends `<text>\n` to that pane's WS.
+
+Implementation:
+
+| File | Change |
+|---|---|
+| `apps/web/src/components/MessageBubble.tsx` | Selection handler + context menu |
+| `apps/web/src/lib/events.ts` | New event `send_to_terminal` with payload `{pane_id, text}` |
+| `apps/web/src/components/panes/TerminalPane.tsx` | Subscribe to event for its `pane_id`, write to WS |
+
+## Docker compose (already applied)
+
+booterm service is already in `docker-compose.yml` with:
+- build context `.`, dockerfile `apps/booterm/Dockerfile`
+- port `100.114.205.53:9501:3000`
+- `/opt:/opt:rw` mount
+- `DATABASE_URL` env pointing at `boocode_db`
+- `boocode_net` network
+- depends_on: `boocode_db`
+
+Do not re-edit compose.
+
+## Backend dependencies
+
+`apps/booterm/package.json`:
+- `fastify`
+- `@fastify/websocket`
+- `pg`
+- `zod`
+- `node-pty`
+- `tslib`
+
+`node-pty` requires native build. Dockerfile installs `python3 make g++` in build stage and `tmux` in runtime stage:
+
+```dockerfile
+FROM node:20-alpine AS build
+RUN apk add --no-cache python3 make g++ tmux
+WORKDIR /app
+COPY ...
+RUN pnpm install --frozen-lockfile && pnpm build
+
+FROM node:20-alpine
+RUN apk add --no-cache tmux
+WORKDIR /app
+COPY --from=build /app/apps/booterm/dist ./dist
+COPY --from=build /app/node_modules ./node_modules
+EXPOSE 3000
+CMD ["node", "dist/index.js"]
+```
+
+## Files to touch
+
+**New app:**
+
+- `apps/booterm/` (entire subtree)
+
+**Existing changes:**
+
+- `apps/web/package.json`
+- `apps/web/src/api/client.ts`
+- `apps/web/src/api/types.ts`
+- `apps/web/src/components/Workspace.tsx`
+- `apps/web/src/components/MessageBubble.tsx`
+- `apps/web/src/components/panes/TerminalPane.tsx` (NEW)
+- `apps/web/src/lib/events.ts`
+- `apps/web/vite.config.ts` (proxy entries)
+
+**Already done by user — do not touch:**
+
+- `docker-compose.yml` (booterm service added)
+- `apps/server/src/schema.sql` (terminal CHECK constraint)
+- Live DB constraint applied
+
+## Verification
+
+1. `docker compose up -d --build booterm` → container healthy.
+2. `curl -s http://100.114.205.53:9501/api/term/health -H 'Remote-User: sam'` → 200.
+3. Browser smoke test:
+   - Open a session. Workspace → "+ Terminal" → terminal pane appears with shell prompt in project root.
+   - Type `ls -la` → output.
+   - Type `vim test.txt`, write something, save, `:q` → file exists on host (since rw mount).
+   - Refresh browser → terminal reconnects, history intact (tmux persistence).
+   - Open second terminal pane → same project, separate tmux window. Both work independently.
+   - Select code in chat → right-click → "Send to terminal" → terminal pane receives the text.
+   - Container restart (`docker compose restart booterm`) → on reconnect, tmux session resumes from where it left off.
+   - Close pane via tab context menu → tmux window killed. Reopen pane → fresh shell.
+
+## Constraints
+
+- node-pty is a native dep. Image size grows.
+- tmux history capped at 50k lines per window.
+- WebSocket frames are bidirectional binary; `binaryType = 'arraybuffer'`.
+- Resize debounced 100ms client-side; backend `tmux resize-window` per resize.
+- No chroot/namespace isolation in v1.1. User has full read+write under `/opt/`. Acceptable for single-user homelab.
+- Don't expose 9501 on 0.0.0.0. Tailscale binding only (already configured in compose).
+
+## Open
+
+- Color theme matching for xterm.js. Defer.
+- File-drop into terminal (upload via terminal pane). Out of scope.
+- Multi-user (each user gets own tmux server) — defer until BooCode goes multi-user, which isn't planned.
+- BooCoder container — same skeleton as booterm but with edit_file / create_file tools instead of PTY. Will follow this pattern when built.

boocode_roadmap.md

@@ -1,341 +1,201 @@
-# BooCode v1.x — Roadmap
+# BooCode — Roadmap
 
-Last updated: 2026-05-16
+Last updated: 2026-05-17
 
 ## Overview
 
-BooCode is a standalone code-chat tool at `/opt/boocode/`. Read-only by design — pick a project, chat with a local LLM that has file-inspection tools, get streaming responses over WebSocket.
+BooCode is a standalone code-chat tool at `/opt/boocode/`. Read-only by design in v1.x — pick a project, chat with a local LLM that has file-inspection tools, get streaming responses over WebSocket.
 
 Live at `https://code.indifferentketchup.com` (Caddy → Authelia → Tailscale → `100.114.205.53:9500`).
 
 **Architectural commitments:**
 
-- No embeddings. The model uses file-view tools (`view_file`, `list_dir`, `grep`, `find_files`) + sidecar analyzers (codecontext, codesight). Walked away from the RAG pipeline May 2026.
+- No embeddings. File-view tools + sidecar analyzers replace RAG.
 - Read-only in v1.x. Write tools land in BooCoder (separate container, post-v1.x).
 - One Postgres (`boocode_db`), one frontend SPA, container-per-service for new capabilities.
 
-External code lifted from / referenced in: see `boocode_code_review.md` for full inventory.
+## Current state
 
------
+- **main:** v1.8.1 (`b09d0ff` was last known tip prior to v1.8.2).
+- **Just merged / committed to main:** v1.8.2 — tool-loop fixes (read-only loop cap raised, "tool loop depth exceeded" error surfaced with continue button, `max_tool_calls` AGENTS.md frontmatter, `messages.metadata` column).
+- **In flight RIGHT NOW:** **v1.x-themes** branch — Claude Code implementing 18-theme system. See "Active work" below.
+
+## Active work
+
+### v1.x-themes — Theme system (in flight)
+
+**Spec source:** locked in this session. Anchors below derived from `/mnt/user-data/uploads/boocode-theme-previews.html` (16 themes extracted) + spec §3 family rules for the two missing (`fuchsia-noir`, `midnight-sapphire`).
+
+**18 themes, grouped:**
+
+| Family | IDs |
+|---|---|
+| Neutral dark | obsidian (default), gunmetal |
+| Brown / warm | espresso, volcanic-brown |
+| Orange / amber | copper, gold |
+| Red | oxblood, crimson |
+| Purple | elderflower, plum |
+| Pink / magenta | steel-pink, fuchsia-noir |
+| Green | matrix, sage |
+| Blue | cobalt, midnight-sapphire |
+| Light-only | ivory, chalk |
+
+**Dark anchors (bg, card, border, muted-fg, accent):**
+
+```
+obsidian          #0c0c0e #15151a #1f1f23 #6b6b75 #8b5cf6
+gunmetal          #0d1117 #161b22 #21262d #7d8590 #388bfd
+espresso          #1c1410 #241a14 #2e2218 #8a7058 #c8a880
+volcanic-brown    #140906 #1e0e0a #2e1610 #7a4030 #cc4a1a
+copper            #100800 #1c1408 #2e1f0a #8a6040 #b87333
+gold              #0e0800 #1a1200 #2a1f00 #a07c30 #d4af37
+oxblood           #0a0303 #180606 #2a0808 #7a3028 #8b1a1a
+crimson           #0e0404 #1a0808 #2e0a0a #8a3030 #dc143c
+elderflower       #100818 #1c1024 #2c1830 #8a78a0 #b89cd8
+plum              #0c0814 #180e20 #241830 #7a4878 #8e4585
+steel-pink        #0e0408 #1a080e #2e0c1a #9a4070 #cc33aa
+fuchsia-noir      #0a0610 #14081a #2a0c2e #8a3878 #ff1493
+matrix            #000a00 #031403 #0a200a #208030 #00ff41
+sage              #0a0e08 #141a10 #1e2e1a #7a8870 #9caf88
+cobalt            #020817 #061434 #0c2244 #3060a0 #0047ab
+midnight-sapphire #02050e #060c1f #0e1a36 #4a6088 #1e3a8a
+ivory             #fdfcf8 #f5f2e8 #e8e4d8 #8a8478 #3a3328   (light-only)
+chalk             #fafaf7 #f0f0ec #e5e5e0 #75756e #2a2a28   (light-only)
+```
+
+**Light-variant derivation (for the 16 dark themes):**
+- Lightest anchor → background
+- Accent darkens ~15% (HSL L − 15pp)
+- Foreground = near-black tinted toward family hue
+- Surfaces / borders scale up symmetrically
+
+**Fallback:** `ivory` or `chalk` + dark mode → `obsidian` dark.
+
+**Token map (shadcn nova set):**
+```
+background        ← anchor 1
+card / popover    ← anchor 2
+border / muted    ← anchor 3
+muted-foreground  ← anchor 4
+primary / accent  ← anchor 5
+foreground        ← derived: anchor-5 hue, ~92% L, ~25% S
+--destructive     ← red family, unchanged across themes
+--ring            ← per-theme accent
+--radius          ← 0.5rem locked
+fonts             ← Inter + JetBrains Mono locked
+```
+
+**Wiring locked:**
+- Schema: `settings.theme_id TEXT NOT NULL DEFAULT 'obsidian'`, `settings.theme_mode TEXT NOT NULL DEFAULT 'dark' CHECK IN ('dark','light','system')`
+- API: GET `/api/settings` extended, PATCH whitelists 18 theme ids → 400 otherwise
+- CSS: `apps/web/src/styles/themes/*.css` (18 + `_tokens.css`), imported from `globals.css` (NOT `index.css`)
+- `.theme-<id>` + `.theme-<id>.dark` composed on `<html>`
+- `apps/web/src/lib/theme.ts` (new): `THEMES` const, `applyTheme(id, mode)`, `useTheme()` hook. matchMedia subscribed only when `mode === 'system'`
+- `apps/web/src/App.tsx`: `useTheme()` at top
+- Settings page: card grid, mode toggle (radio: Dark/Light/System). No header dropdown.
+- shadcn primitives: `card`, `radio-group` installed via `pnpm dlx shadcn@latest add`. `button`, `label` already present.
+- FOUC mitigation: localStorage cache + inline `<script>` in `index.html` sets `<html>` class before React hydrates
+
+**Out of scope (v1):**
+- Custom user palettes (no color picker)
+- Per-project / per-session themes
+- Shiki syntax-highlighting themes
+- Header quick-switcher
+
+**Verify after Claude Code hands back:**
+- `fuchsia-noir` and `midnight-sapphire` visual check — derived, not from preview. Swap hexes if they read wrong.
+- Light variants of the 16 dark themes — algorithmic. Spot-check 3-4 across families (warm/cool/dark/saturated).
+- FOUC on hard reload, theme-switch persistence, system-mode matchMedia teardown.
 
 ## Batch summary
 
-|Batch                                     |Theme                                                                              |Status     |Branch / Notes                         |
-|------------------------------------------|-----------------------------------------------------------------------------------|-----------|---------------------------------------|
-|1                                         |Markdown, Copy + Regen, tok/s + ctx, AI naming                                     |✅ Done     |`v1.1-batch1` merged                   |
-|2                                         |Sidebar restructure                                                                |✅ Done     |`v1.1-batch2` merged                   |
-|3                                         |Pane system, FileBrowserPane + Shiki, cross-tab                                    |✅ Done     |`v1.1-batch3` merged                   |
-|3.5                                       |Chip infrastructure, `@file`, line-select                                          |✅ Done     |merged                                 |
-|4 (v1.2)                                  |Chats inside sessions, right-rail, `/compact`, archive, force-send                 |✅ Done     |merged                                 |
-|4.1–4.4                                   |Project archive, sidebar context, Gitea API, bootstrap                             |✅ Done     |merged                                 |
-|v1.5 cleanup                              |resolveProjectPath, BOOTSTRAP_ROOT, vitest pin                                     |✅ Done     |merged                                 |
-|v1.6 mobile                               |Drawer, single-pane, long-press, IME-safe, pull-to-refresh, swipe-close            |✅ Done     |merged                                 |
-|v1.6.1                                    |RightRail mobile wrapper fix                                                       |✅ Done     |merged                                 |
-|Tool-loop bump                            |MAX_TOOL_LOOP_DEPTH 5→15                                                           |✅ Done     |merged                                 |
-|v1.6.2                                    |Workspace + Session+Project headers + ChatTabBar new-chat + RightRail mobile drawer|🔄 In flight|`v1.6.2-mobile-ui-fixes`               |
-|**v1.8 mobile tabs**                      |**Bottom-sheet pane switcher + cross-tab `pane_status` WS sync + StatusDot on tabs**|**Next up**|`v1.8-mobile-tabs`; hand-rolled sheet  |
-|9 (REORDERED, DECOUPLED)                  |Agents (Tier 2): `AGENTS.md`, per-agent temp/tools, picker in ChatInput toolbar    |✅ Implemented, uncommitted|six builtins; on `main` awaiting commit|
-|5                                         |Fork message, delete message, header polish                                        |Planned    |                                       |
-|6                                         |Drag-drop file + paste-as-attachment                                               |Planned    |thin extension of 3.5 chips            |
-|7                                         |Settings drawer: system prompt, web search toggle, agent entry                     |Planned    |adds SettingsDrawer agent entry (Batch 9 deferred half) |
-|8                                         |Web search backend: SearXNG `web_search` + `web_fetch`                             |Planned    |                                       |
-|10                                        |BooTerm: separate container, xterm.js + node-pty + tmux                            |Planned    |                                       |
-|11 — Architect: codebase map              |codecontext sidecar + MCP tool wiring                                              |Planned    |from nmakod/codecontext                |
-|11b — Architect: repo health              |call graph, circular deps, dead code                                               |Planned    |from spirituslab/codesight             |
-|12 — Tool approval + plan/act mode        |Read-only invariant, per-tool gating                                               |Planned    |from cline                             |
-|13 — Append-only event log                |Replace messages-table semantics                                                   |Planned    |from OpenHands V1                      |
-|14 — BooCoder: pending changes            |Sandboxed edit queue, atomic apply                                                 |Post-v1.x  |from plandex                           |
-|15 — BooCoder runtime isolation           |Per-session Docker sandbox                                                         |Post-v1.x  |from OpenHands                         |
-|16 — Multi-provider LLM                   |Optional litellm-style abstraction                                                 |Optional   |from pi-ai                             |
-|17 — Workflow graphs                      |Multi-agent coordination                                                           |Far future |from microsoft/agent-framework concepts|
-
-**Old Batch 12 (codebase indexer w/ Harrier embeddings) — REMOVED.** Replaced by Batch 11/11b sidecar approach. See `boocode_code_review.md` decisions log.
-
-**Batch 9 reordered ahead of 5–8, 10.** Picker mounts in `ChatInput.tsx` toolbar only. SettingsDrawer agent entry rolled into Batch 7 when it lands. No UI dependency on Batches 5/6/7, so it can ship anytime after v1.6.2.
-
------
-
-## Batch details (planned / new)
-
-### Batch 9 — Agents (Tier 2, DECOUPLED)
-
-**Spec:** `boocode_batch9.md` with the deltas below.
-
-**Status:** Next up after v1.6.2 merges. Decoupled from Batch 7.
-
-**Deltas from `boocode_batch9.md`:**
-
-1. Builtin defaults in `agents.ts` OMIT the `model` field. Resolution order makes `session.model` win when `agent.model` is null. Spec line 30 example is misleading — do not hardcode any model in builtins.
-2. Builtin defaults are the six agents shipped in `/opt/boocode/AGENTS.md`: **Code Reviewer, Debugger, Refactorer, Architect, Security Auditor, Prompt Builder.** If project root `AGENTS.md` exists, only its agents show. If absent, show the six builtins.
-3. AgentPicker mounts in `ChatInput.tsx` toolbar between ModelPicker and the `+` button. **No `SettingsDrawer.tsx` or `Header.tsx` changes in this batch.**
-4. SettingsDrawer agent entry + Header active-agent badge moved to Batch 7.
-
-**Files to create:**
-
-- `apps/server/src/services/agents.ts` — parser, six builtin defaults, mtime-keyed cache.
-- `apps/server/src/routes/agents.ts` — `GET /api/projects/:id/agents`.
-- `apps/web/src/components/AgentPicker.tsx` — dropdown, matches ModelPicker pattern.
-
-**Files to modify:**
-
-- `apps/server/src/schema.sql` — `ALTER TABLE sessions ADD COLUMN IF NOT EXISTS agent_id TEXT;`
-- `apps/server/src/services/inference.ts` — resolution order: `effective_system_prompt`, `effective_model`, `effective_temperature`, `effective_tools` from session + agent + project. Filter tools array against agent whitelist before sending to llama-swap.
-- `apps/server/src/routes/sessions.ts` — PATCH accepts `agent_id`.
-- `apps/server/src/types/api.ts` — Agent type, extend Session with `agent_id`.
-- `apps/web/src/api/client.ts`, `apps/web/src/api/types.ts` — Agent type, `api.agents.list(projectId)`.
-- `apps/web/src/components/ChatInput.tsx` — mount AgentPicker.
-
-**Testing plan (manual, before locking temps):**
-
-- Drop `/opt/boocode/AGENTS.md` (six agents, no `model` field on any).
-- For each of the 7 keeper models, switch session model and run the same target prompt against each agent. Log tok/s, instruction-following quality.
-- Adjust per-agent temperature in `AGENTS.md` based on results.
-- A/B candidates: qwen3.6-35b-a3b-mxfp4 (daily), qwopus3.6-35b-a3b-q4 (reasoning), qwopus3.5-27b-q4, qwen3.6-27b-ud-q4-xl, nemotron-3-nano-30b, gemma-4-26b-a4b-mxfp4, qwen3-coder-30b-apex.
-
-**Dependencies:** v1.6.2 merged.
-
------
-
-### Batch 11 — Architect: codebase map (REVISED)
-
-**Inspiration / lift:** `nmakod/codecontext` (MIT, Go binary).
-
-**What it gives BooCode:** an architect-grade codebase overview without embeddings. Codecontext parses the repo with tree-sitter, extracts symbols, builds import/dependency relationships, and exposes the result via an MCP server with 8 tools. The model gets a structural map of any codebase on demand.
-
-**Why this replaces the original Batch 11 (aider PageRank port):** codecontext is a finished binary in our stack language (Go), with watch mode, incremental updates, framework detection, and git-co-change-based semantic neighborhoods (no embeddings). The aider port would be reimplementing what codecontext already ships.
-
-**Scope:**
-
-- Add `codecontext` sidecar container to `docker-compose.yml`. Mount the project root read-only. One sidecar per BooCode instance — projects are addressed by absolute path.
-- Wire each codecontext MCP tool into BooCode’s `inference/tools.ts` as a native tool the model can call:
- - `repo_overview(project_id)` → codecontext `get_codebase_overview`
- - `repo_file_analysis(project_id, path)` → `get_file_analysis`
- - `repo_symbol_info(project_id, symbol)` → `get_symbol_info`
- - `repo_search_symbols(project_id, query)` → `search_symbols`
- - `repo_dependencies(project_id, path)` → `get_dependencies`
- - `repo_semantic_neighborhoods(project_id, path)` → `get_semantic_neighborhoods` (git co-change)
- - `repo_framework_analysis(project_id)` → `get_framework_analysis`
-- `path_guard.ts` extension: incorporate `continuedev/continue` `DEFAULT_SECURITY_IGNORE_FILETYPES` so codecontext can’t surface `.env`, `.pem`, keys, etc.
-- Fallback grammars: drop `Aider-AI/aider`‘s `aider/queries/tree-sitter-*.scm` files for any language codecontext doesn’t cover. Use them via an in-process tree-sitter wrapper *only if* a project needs an unsupported language. Defer wrapper build until that’s an actual gap.
-
-**Where it goes:** new `apps/server/src/architect/` directory. No new tables — codecontext maintains its own state on disk. New env: `CODECONTEXT_URL=http://codecontext:8765` (MCP endpoint).
-
-**Decisions to make at recon time:**
-
-- Bundle the binary directly in the BooCode Dockerfile, or run codecontext as its own service? Sidecar is cleaner. Bundle is one less container.
-- How does the model discover codecontext tools — register them statically in the tools registry, or proxy MCP `tools/list` at startup?
-
-**Dependencies:** none. Can ship before Batches 5–10.
-
------
-
-### Batch 11b — Architect: repo health (NEW)
-
-**Inspiration / lift:** `spirituslab/codesight` (MIT-ish, TS/Node).
-
-**What it gives BooCode:** complement to Batch 11. Where codecontext answers “what is this codebase,” repo health answers “what’s wrong with this codebase.” Call graph, circular dependency detection, dead code flagging.
-
-**Scope:**
-
-- Port codesight’s `analyze.mjs` analyzer core into `apps/server/src/architect/repo_health.ts`. Drop the VS Code extension shell. Keep:
- - Symbol extraction (already overlaps codecontext — call codecontext where possible, only redo what’s needed for graph edges).
- - Call graph builder (function-to-function edges).
- - Circular dependency detector.
- - Dead code detector (exported symbols never imported or called).
-- New tool: `repo_health(project_id)` returning `{ circular_dependencies: [...], dead_code: [...] }`. Output respects codesight’s documented false-positive caveats (customElements.define, framework entry points, dynamic imports) — surface those in the tool description so the model doesn’t trust dead-code flags blindly.
-- Cache results in `boocode_db` keyed by `(project_id, file_hashes)`. Invalidate on file change via file-index hash check.
-
-**Decisions:**
-
-- Build it in-process (Node) vs spawn a CLI? In-process is simpler. Spawn matches codecontext sidecar pattern but adds latency.
-
-**Dependencies:** Batch 11 merged (so we can reuse codecontext’s parse output where possible). Can be deferred until after Batches 5–10.
-
------
-
-### Batch 12 — Tool approval gating + plan/act mode
-
-**Inspiration / lift:** `cline/cline` (Apache-2.0).
-
-**What it gives BooCode:** per-session control over which tools the model can call. Lays the groundwork for BooCoder by building the gating mechanism before there are any write tools to gate.
-
-**Scope:**
-
-- New column `sessions.tool_approval_mode TEXT` — values: `read_only` (v1.x default), `plan`, `act_auto`, `act_approve`.
-- New column `sessions.approved_tools JSONB` — per-session whitelist for `act_approve` mode.
-- Tool registry refactor: tools tagged `read_only` or `write`. In `read_only` mode (v1.x), write tools never appear in the model’s tools array. In `plan` mode, same — write tools hidden, model produces a plan only. `act_*` modes unlock writes (post-v1.x).
-- UI: mode picker in SettingsDrawer (Batch 7 dependency). Inline indicator in chat header.
-
-**Dependencies:** Batch 7 (SettingsDrawer).
-
------
-
-### Batch 13 — Append-only event log
-
-**Inspiration / lift:** `OpenHands/OpenHands` V1 (MIT).
-
-**What it gives BooCode:** replaces the ad-hoc `messages` table semantics with a typed event stream. Unlocks rewind, time-travel, and clean handoff semantics for multi-agent flows.
-
-**Scope:**
-
-- New `session_events` table: `(id, session_id, ts, kind, payload JSONB, parent_id)`. Event kinds: `user_message`, `assistant_message`, `tool_call`, `tool_result`, `pane_action`, `mode_change`, `system`.
-- Existing `messages` table becomes a derived view over `session_events` for backward compatibility, then deprecated over a release.
-- Inference loop emits events instead of mutating message rows.
-- Frontend `useSessionStream` reducer rewritten to consume events.
-
-**Migration is non-trivial.** Plan in a dedicated batch with explicit cutover window.
-
-**Dependencies:** Batches 5 (fork/delete) and 7 (settings) merged. Must not be in flight with other backend work.
-
------
-
-### Batch 14 — BooCoder: pending changes
-
-**Inspiration / lift:** `plandex-ai/plandex` (MIT).
-
-**What it gives BooCode:** safe write tools. Edits queue in a virtual layer; nothing touches the filesystem until explicit `/apply`.
-
-**Scope:**
-
-- New container `boocoder` at `100.114.205.53:9502`. Owns write tools (`edit_file`, `create_file`, `delete_file`, `apply_pending`, `rewind`).
-- New table `pending_changes (id, session_id, file_path, diff TEXT, status, created_at)`. Status: `pending`, `applied`, `rejected`.
-- Tools execute against the pending-changes layer, not the filesystem. `apply_pending` is the only path that touches disk. `rewind` rolls back a `pending`-id back to disk state.
-- BooCode chat container stays read-only (`/opt:/opt:ro`). BooCoder mounts `/opt/repos:/opt/repos:rw` and uses git worktree pattern from paseo for isolation.
-- Frontend: new pane kind `pending_diff` shows the queued diff inline with Approve/Reject per chunk.
-
-**Dependencies:** Batches 12 (gating) + 13 (events). Don’t start until both are live.
-
------
-
-### Batch 15 — BooCoder runtime isolation
-
-**Inspiration / lift:** `OpenHands/OpenHands` (MIT).
-
-**What it gives BooCode:** per-session Docker sandbox for BooCoder writes. Closes the `/opt:ro` mount risk identified in v1.x open items.
-
-**Scope:**
-
-- Per-session container spawned by BooCoder on first write. Container has only the project’s path mounted, not `/opt`.
-- Container lifecycle: spawn on first write call, idle-timeout after 30 min, recreate on resume.
-- Action execution server pattern: HTTP API inside the container, BooCoder calls in. Standard OpenHands runtime contract.
-
-**Dependencies:** Batch 14.
-
------
-
-### Batch 16 — Multi-provider LLM abstraction
-
-**Inspiration / lift:** `earendil-works/pi` `pi-ai` (MIT).
-
-**What it gives BooCode:** optional non-llama-swap inference paths (Anthropic, OpenAI, Mistral direct). Currently we have one provider (llama-swap) and the existing `streamCompletion` is hardcoded to OpenAI-compatible at that endpoint.
-
-**Scope:**
-
-- Provider abstraction: `interface LLMProvider { stream(req): AsyncIterator<Frame> }`.
-- Built-in: llama-swap (current), Anthropic, OpenAI (Codex-style).
-- Per-session `provider_id` column.
-
-**Status:** **Optional. Skip unless a concrete need surfaces.** llama-swap covers daily driver work.
-
------
-
-### Batch 17 — Workflow graphs
-
-**Inspiration / lift:** `microsoft/agent-framework` (MIT) — concepts only.
-
-**What it gives BooCode:** multi-agent coordination. Architect → Coder → Reviewer → Verifier handoffs orchestrated by a YAML-defined workflow.
-
-**Status:** **Far future.** Read agent-framework’s `docs/decisions/` ADRs. Don’t port code — Azure/.NET-heavy.
-
-**Dependencies:** Batches 12 (modes), 13 (events). Realistically a v2.x topic.
-
------
+| Version | Theme | Status |
+|---|---|---|
+| v1.0 | Initial scaffold, read-only tools, WS streaming | ✅ Merged |
+| v1.1-batch1 | Markdown, Copy + Regen, tok/s + ctx, AI naming | ✅ Merged |
+| v1.1-batch2 | Sidebar restructure | ✅ Merged |
+| v1.1-batch3 | Pane system, FileBrowserPane + Shiki, cross-tab | ✅ Merged |
+| v1.1-batch3.5 | Chip infra, `@file`, line-select | ✅ Merged |
+| v1.2 | Chats inside sessions, right-rail, `/compact`, archive, force-send | ✅ Merged |
+| v1.2-project-ux | Project archive, sidebar context, Gitea API, bootstrap | ✅ Merged |
+| v1.3 | Tab-close + chat-archive | ✅ Merged |
+| v1.4 | Fork message, delete message, header polish (was original Batch 5) | ✅ Merged |
+| v1.5 | resolveProjectPath, BOOTSTRAP_ROOT, vitest pin | ✅ Merged |
+| v1.5.1 | Bootstrap hotfix (git in container, SSH keypair, known_hosts) | ✅ Merged (`4a9f207`) |
+| v1.6 | Mobile pass: drawer, single-pane, long-press, IME-safe, pull-to-refresh, swipe-close | ✅ Merged |
+| v1.6.1 | RightRail mobile wrapper fix | ✅ Merged |
+| Tool-loop bump | MAX_TOOL_LOOP_DEPTH 5→15 | ✅ Merged |
+| v1.6.2 | Workspace + Session+Project headers, ChatTabBar new-chat, RightRail mobile drawer | ✅ Merged |
+| v1.7 | Drag-drop file + paste-as-attachment (was Batch 6) | ✅ Merged |
+| v1.8 | Settings drawer + `git_status` added to ALL_TOOL_NAMES (was Batch 7) | ✅ Merged |
+| v1.8.1 | WS reconnect toast tuning (silent/gray/red thresholds), pane status indicators | ✅ Merged |
+| v1.8.2 | Tool-loop fixes: read-only cap raised, "depth exceeded" error + continue, `max_tool_calls` frontmatter, `messages.metadata` | ✅ Merged |
+| **v1.x-themes** | **18 themes, settings page, dark/light/system, FOUC mitigation** | **🔄 Claude Code in flight** |
+| v1.8.3 | Tool call UI compaction: collapse-by-default, group consecutive same-tool, result preview cap | Planned (small, frontend-only) |
+| v1.9 | Settings pane (system prompt per project + session, web search toggle, `+` button) | Planned (spec locked, was on branch `v1.9-settings-pane`) |
+| v1.10 | Web search backend: SearXNG `web_search` + `web_fetch` | Planned |
+| v1.11 | Agents Tier 2: `AGENTS.md`, per-agent temp/tools whitelist, AgentPicker in ChatInput | Planned |
+| v1.12 | BooTerm: separate container, xterm.js + node-pty + tmux | Planned |
+| v1.13 | Architect: codecontext sidecar (MCP, tree-sitter, no embeddings) | Planned |
+| v1.13b | Architect: repo health (call graph, circular deps, dead code) | Planned |
+| v1.14 | Tool approval + plan/act mode (cline-style) | Planned |
+| Post-v1.x | Append-only event log (OpenHands V1) | Planned |
+| Post-v1.x | BooCoder pending-changes (plandex) | Planned |
+| Post-v1.x | BooCoder runtime isolation (per-session Docker sandbox) | Planned |
+| Optional | Multi-provider LLM abstraction (pi-ai) | Skip unless need surfaces |
+| Far future | Workflow graphs (microsoft/agent-framework concepts) | v2.x topic |
+
+## Flagged follow-ups (not in a batch yet)
+
+- Agents in `/data/AGENTS.md` don't list `git_status` in their `tools:` blocks. Out of scope until pre-BooCoder cleanup pass.
+- v1.9 dispatch had item (g): verify `useUserEvents` broadcasts `project_updated` on PATCH `/projects/:id`. Add if missing.
+- v1.8.2 follow-up: confirm `messages.metadata` migration ran clean in prod DB after deploy.
 
 ## Order of operations
 
-Two tracks. Pick one to drive next.
+1. **v1.x-themes** finishes (Claude Code in flight). Audit + smoke test. Merge.
+2. **v1.8.3** — tool call UI compaction. Small frontend batch, addresses current pain.
+3. **v1.9** — settings pane. Branch already named `v1.9-settings-pane`. Spec locked.
+4. **v1.10** — web search backend.
+5. **v1.11** — agents.
+6. **v1.12** — BooTerm.
 
-**Track A — Finish v1.x mobile + polish then agents:**
-
-- v1.6.2 ships (in flight)
-- **Batch 9 (agents)** — decoupled, can land next; no UI dependency on 5/6/7
-- Batches 5, 6, 7, 8 in order. Each is small, frontend-heavy, no architecture risk. Batch 7 absorbs SettingsDrawer agent entry.
-
-**Track B — Begin architect capabilities in parallel:**
-
-- Batch 11 (codecontext sidecar) — biggest single capability jump. Frontend stays the same; new tools appear to the model.
-- Batch 11b (repo health) — follow-up.
-- Batch 12 (gating) — sets up everything post-v1.x.
-
-Recommendation: ship v1.6.2, then **Batch 9 (agents)** next so the test bed exists before Track A continues. Then Track A through Batch 7. Batch 11 can run in parallel with Batches 8–10 since 11 has no UI dependency.
-
------
+Track B (architect, no UI dep, can run parallel anytime): v1.13 → v1.13b → v1.14.
 
 ## Architecture target state
 
-### Containers
+| Container | Port | Mount | Purpose | Status |
+|---|---|---|---|---|
+| `boocode` | `100.114.205.53:9500` | `/opt:/opt:ro` | Chat + read-only tools + SPA | Live |
+| `boocode_db` | `127.0.0.1:5500` | `boocode_pgdata` volume | Postgres 16-alpine | Live |
+| `codecontext` | `100.114.205.53:8765` (internal) | project root :ro | MCP server for architect tools | v1.13 |
+| `booterm` | `100.114.205.53:9501` | `/opt/repos:/opt/repos:rw` | Terminals (tmux + node-pty) | v1.12 |
+| `boocoder` | `100.114.205.53:9502` | per-session sandbox | Write tools | Post-v1.x |
 
-|Container    |Port                            |Mount                     |Purpose                       |Status  |
-|-------------|--------------------------------|--------------------------|------------------------------|--------|
-|`boocode`    |`100.114.205.53:9500`           |`/opt:/opt:ro`            |Chat + read-only tools + SPA  |Live    |
-|`boocode_db` |`127.0.0.1:5500`                |`boocode_pgdata` volume   |Postgres 16-alpine            |Live    |
-|`codecontext`|`100.114.205.53:8765` (internal)|project root :ro          |MCP server for architect tools|Batch 11|
-|`booterm`    |`100.114.205.53:9501`           |`/opt/repos:/opt/repos:rw`|Terminals (tmux + node-pty)   |Batch 10|
-|`boocoder`   |`100.114.205.53:9502`           |per-session sandbox       |Write tools                   |Batch 14|
+## Schema additions ahead
 
-### Schema additions
-
-**Batch 9:** `sessions.agent_id TEXT` (nullable; references AGENTS.md by slug).
-**Batch 11:** none (codecontext stateless on disk).
-**Batch 11b:** `repo_health_cache (project_id, file_hashes_sig, payload JSONB, created_at)`.
-**Batch 12:** `sessions.tool_approval_mode`, `sessions.approved_tools`.
-**Batch 13:** `session_events`; deprecate `messages` long-tail.
-**Batch 14:** `pending_changes`.
-
------
-
-## Lift sources (summary)
-
-Full inventory in `boocode_code_review.md`. Headline items:
-
-|Source                                |Used for                                |Where                |
-|--------------------------------------|----------------------------------------|---------------------|
-|nmakod/codecontext (MIT, Go)          |Architect: codebase map sidecar         |Batch 11             |
-|spirituslab/codesight (MIT-ish, TS)   |Architect: repo health analyzer         |Batch 11b            |
-|Aider-AI/aider (Apache-2.0)           |Fallback `.scm` grammars (60+ languages)|Batch 11 (fallback)  |
-|continuedev/continue (Apache-2.0)     |DEFAULT_SECURITY_IGNORE_FILETYPES       |Batch 11 prep        |
-|cline/cline (Apache-2.0)              |Plan/Act mode pattern                   |Batch 12             |
-|plandex-ai/plandex (MIT)              |Pending-changes data model              |Batch 14             |
-|OpenHands/OpenHands (MIT)             |Event log + sandbox runtime             |Batches 13, 15       |
-|aimasteracc/tree-sitter-analyzer (MIT)|Outline-first response patterns         |Reference            |
-|earendil-works/pi (MIT)               |Multi-provider LLM                      |Batch 16 (optional)  |
-|rshah515/claude-code-subagents (MIT)  |Reference for builtin agent prompts     |Batch 9 (six builtins)|
-|microsoft/agent-framework (MIT)       |Workflow concepts                       |Batch 17 (far future)|
-
------
+- v1.x-themes (current): `settings.theme_id`, `settings.theme_mode`
+- v1.9: `projects.default_system_prompt`, `projects.default_web_search_enabled`, `sessions.web_search_enabled`
+- v1.11: `sessions.agent_id`
+- v1.13b: `repo_health_cache (project_id, file_hashes_sig, payload JSONB, created_at)`
+- v1.14: `sessions.tool_approval_mode`, `sessions.approved_tools`
+- Post-v1.x: `session_events`; deprecate `messages` long-tail
+- Post-v1.x: `pending_changes`
 
 ## Decisions log
 
-- **Embeddings dropped from BooCode.** Replaced RAG with file-view tools + sidecar analyzers.
-- **Original Batch 11 (aider PageRank port) replaced** by codecontext sidecar approach.
-- **Original Batch 12 (codebase indexer w/ Harrier) removed** entirely. No embedding infrastructure in BooCode v1.x.
-- **Globstar parked** — not an architect tool, future verify-before-commit candidate only.
-- **codeprysm rejected** — embedding-based; node/edge taxonomy noted as reference if we ever build our own graph.
-- **Batch 9 decoupled from Batch 7 (2026-05-16).** AgentPicker mounts in `ChatInput.tsx` toolbar only. SettingsDrawer agent entry and Header active-agent badge moved to Batch 7. Builtin defaults shipped: six agents (Code Reviewer, Debugger, Refactorer, Architect, Security Auditor, Prompt Builder) with no `model` field — session model wins by default.
-
-## Follow-ups (post-ship docs / cleanup)
-
-- **After v1.8.2 ships:** Add explicit `max_tool_calls: 30` to all 6 agents in `/data/AGENTS.md` and `/opt/boocode/AGENTS.md`. Purely for documentation/discoverability — defaults handle behavior identically (all 6 agents use only read-only tools, default is already 30).
-
------
+- Embeddings dropped from BooCode. File-view tools + sidecar analyzers replace RAG.
+- Old Batch 11 (aider PageRank port) → replaced by codecontext sidecar (v1.13).
+- Old Batch 12 (Harrier indexer) → removed entirely.
+- Batch 9 reordered ahead of 5–8, decoupled from Batch 7 (2026-05-16). Subsequently superseded — settings pane (v1.9) and themes (v1.x-themes) jumped ahead. Agents now slated as v1.11.
+- Theme work split into its own version (v1.x-themes) rather than blocked behind v1.9 (2026-05-17). Branched off main after v1.8.2 committed.
 
 ## Workflow
 
 Each batch:
-
-1. Verify previous batch merged.
-2. Dispatch via Paseo to Claude Code at `/opt/boocode`.
-3. Claude Code recon → blocking questions → implement → hand back.
+1. Verify previous merged.
+2. Dispatch via Paseo to Claude Code at `/opt/boocode` (or OpenCode for smaller batches).
+3. Recon → blocking questions → implement → hand back.
 4. Compliance review in separate Claude chat.
 5. Deploy: `docker compose up --build -d`.
 6. Smoke test.

docker-compose.yml

@@ -9,15 +9,32 @@ services:
     environment:
       DATABASE_URL: postgres://boocode:${POSTGRES_PASSWORD}@boocode_db:5432/boocode
     volumes:
-      # Read-only mount for legacy/existing project add-existing flow.
-      - /opt:/opt:ro
-      # Writable mount only for the create-new-project bootstrap target.
-      # Host must `mkdir -p /opt/projects` before container start.
+      - /opt:/opt
       - /opt/projects:/opt/projects:rw
       - ./secrets/boocode_gitea:/root/.ssh/id_ed25519:ro
-      # v1.8.1: global agents file. Host seeds it once before deploy:
-      # cp /opt/boocode/AGENTS.md /opt/boocode/data/AGENTS.md
-      - ./data:/data:ro
+      - ./data:/data
+      - /opt/skills:/data/skills
+    depends_on:
+      - boocode_db
+    networks:
+      - boocode_net
+
+  booterm:
+    build:
+      context: .
+      dockerfile: apps/booterm/Dockerfile
+    container_name: booterm
+    restart: unless-stopped
+    ports:
+      - "100.114.205.53:9501:3000"
+    env_file: .env
+    environment:
+      NODE_ENV: production
+      PORT: 3000
+      DATABASE_URL: postgres://boocode:${POSTGRES_PASSWORD}@boocode_db:5432/boocode
+    volumes:
+      - /opt:/opt:rw
+      - /home/samkintop:/home/samkintop:rw
     depends_on:
       - boocode_db
     networks:

docs/themes_v1.md

@@ -0,0 +1,263 @@
+# BooCode — Theme System v1
+
+Standalone BooCode (`/opt/boocode/`). Tailwind v4 + shadcn nova preset. 18 preset themes × 2 modes (dark/light) = 36 palettes. User-selectable in Settings only. Persists to `settings` table.
+
+-----
+
+## 1. Theme list (locked)
+
+| # | id                  | Display name      | Family         | Mode default         |
+|---|---------------------|-------------------|----------------|----------------------|
+| 1 | `obsidian`          | Obsidian          | Charcoal/Black | dark (default theme) |
+| 2 | `gunmetal`          | Gunmetal          | Charcoal/Black | dark                 |
+| 3 | `espresso`          | Espresso          | Brown/Earth    | dark                 |
+| 4 | `volcanic-brown`    | Volcanic Brown    | Brown/Earth    | dark                 |
+| 5 | `copper`            | Copper            | Orange/Amber   | dark                 |
+| 6 | `gold`              | Gold              | Orange/Amber   | dark                 |
+| 7 | `oxblood`           | Oxblood           | Red/Crimson    | dark                 |
+| 8 | `crimson`           | Crimson           | Red/Crimson    | dark                 |
+| 9 | `elderflower`       | Elderflower       | Purple/Violet  | dark                 |
+| 10| `plum`              | Plum              | Purple/Violet  | dark                 |
+| 11| `steel-pink`        | Steel Pink        | Pink/Magenta   | dark                 |
+| 12| `fuchsia-noir`      | Fuchsia Noir      | Pink/Magenta   | dark                 |
+| 13| `matrix`            | Matrix            | Green          | dark                 |
+| 14| `sage`              | Sage              | Green          | dark                 |
+| 15| `ivory`             | Ivory             | Light          | light (always)       |
+| 16| `chalk`             | Chalk             | Light          | light (always)       |
+| 17| `cobalt`            | Cobalt            | Blue           | dark                 |
+| 18| `midnight-sapphire` | Midnight Sapphire | Blue           | dark                 |
+
+**Default on first load:** `obsidian` (dark).
+**Light variants:** every dark theme ships a paired light variant. `ivory` and `chalk` have no dark variant — they are light-only.
+
+-----
+
+## 2. Storage model
+
+### Schema change
+
+Additive only. In `apps/server/src/schema.sql`:
+
+```sql
+ALTER TABLE settings ADD COLUMN IF NOT EXISTS theme_id TEXT NOT NULL DEFAULT 'obsidian';
+ALTER TABLE settings ADD COLUMN IF NOT EXISTS theme_mode TEXT NOT NULL DEFAULT 'dark'
+  CHECK (theme_mode IN ('dark', 'light', 'system'));
+```
+
+### API surface
+
+Extend `GET /api/settings` and `PATCH /api/settings`. No new routes.
+
+`GET` response includes `theme_id`, `theme_mode`. `PATCH` accepts both. Validation:
+
+- `theme_id` must be one of the 18 ids listed in section 1.
+- `theme_mode` ∈ `{dark, light, system}`.
+- Reject otherwise with 400.
+
+-----
+
+## 3. CSS token layer
+
+Tailwind v4 + shadcn nova uses CSS custom properties.
+
+### File layout
+
+```
+apps/web/src/styles/
+├── globals.css           # existing Tailwind entrypoint
+└── themes/
+    ├── obsidian.css
+    ├── gunmetal.css
+    ├── espresso.css
+    ├── volcanic-brown.css
+    ├── copper.css
+    ├── gold.css
+    ├── oxblood.css
+    ├── crimson.css
+    ├── elderflower.css
+    ├── plum.css
+    ├── steel-pink.css
+    ├── fuchsia-noir.css
+    ├── matrix.css
+    ├── sage.css
+    ├── ivory.css
+    ├── chalk.css
+    ├── cobalt.css
+    └── midnight-sapphire.css
+```
+
+Each per-theme file declares `.theme-<id>` (light tokens) and `.theme-<id>.dark` (dark tokens), overriding the shadcn nova CSS variables. `ivory.css` and `chalk.css` declare only the light selector.
+
+`globals.css` imports all 18 theme files after the existing Tailwind/shadcn `@import` lines.
+
+### Tokens overridden per theme
+
+```
+--background
+--foreground
+--card
+--card-foreground
+--popover
+--popover-foreground
+--primary
+--primary-foreground
+--secondary
+--secondary-foreground
+--muted
+--muted-foreground
+--accent
+--accent-foreground
+--destructive
+--destructive-foreground
+--border
+--input
+--ring
+--sidebar
+--sidebar-foreground
+--sidebar-primary
+--sidebar-primary-foreground
+--sidebar-accent
+--sidebar-accent-foreground
+--sidebar-border
+--sidebar-ring
+```
+
+`--radius` is locked at `0.5rem` (not per-theme). `--destructive` stays in the red family across all themes — error states are not theme-shifted.
+
+### Anchor-to-token mapping
+
+Five anchor swatches per theme map as follows:
+
+```
+background                       ← anchor 1 (deepest)
+card / popover / sidebar         ← anchor 2 (surface)
+border / input / muted           ← anchor 3 (line)
+muted-foreground                 ← anchor 4 (dimmed text)
+primary / accent / ring /
+  sidebar-primary /
+  sidebar-accent                 ← anchor 5 (accent)
+foreground                       ← computed: anchor-5 hue, ~92% L, ~25% S
+                                   (warm tint for warm themes, cool for cool)
+sidebar-foreground               ← same as foreground
+sidebar-border                   ← same as border (anchor 3)
+sidebar-ring                     ← same as ring (anchor 5)
+destructive                      ← red family — dark mode: #dc2626,
+                                   light mode: #b91c1c
+*-foreground variants            ← derived high-contrast against parent
+```
+
+### Dark anchor values
+
+```
+obsidian          #0c0c0e #15151a #1f1f23 #6b6b75 #8b5cf6
+gunmetal          #0d1117 #161b22 #21262d #7d8590 #388bfd
+espresso          #1c1410 #241a14 #2e2218 #8a7058 #c8a880
+volcanic-brown    #140906 #1e0e0a #2e1610 #7a4030 #cc4a1a
+copper            #100800 #1c1408 #2e1f0a #8a6040 #b87333
+gold              #0e0800 #1a1200 #2a1f00 #a07c30 #d4af37
+oxblood           #0a0303 #180606 #2a0808 #7a3028 #8b1a1a
+crimson           #0e0404 #1a0808 #2e0a0a #8a3030 #dc143c
+elderflower       #100818 #1c1024 #2c1830 #8a78a0 #b89cd8
+plum              #0c0814 #180e20 #241830 #7a4878 #8e4585
+steel-pink        #0e0408 #1a080e #2e0c1a #9a4070 #cc33aa
+fuchsia-noir      #0a0610 #14081a #2a0c2e #8a3878 #ff1493
+matrix            #000a00 #031403 #0a200a #208030 #00ff41
+sage              #0a0e08 #141a10 #1e2e1a #7a8870 #9caf88
+cobalt            #020817 #061434 #0c2244 #3060a0 #0047ab
+midnight-sapphire #02050e #060c1f #0e1a36 #4a6088 #1e3a8a
+```
+
+### Light-only anchors
+
+`ivory` and `chalk` use these values directly as the light palette:
+
+```
+ivory  #fdfcf8 #f5f2e8 #e8e4d8 #8a8478 #3a3328
+chalk  #fafaf7 #f0f0ec #e5e5e0 #75756e #2a2a28
+```
+
+### Light variants of the 16 dark themes
+
+- lightest anchor → background
+- accent darkens ~15% (reduce HSL lightness by 15 percentage points)
+- foreground → near-black tinted toward family hue
+- surfaces, borders scale up in lightness symmetrically
+
+-----
+
+## 4. Mode resolution (dark/light/system)
+
+```ts
+function resolvedMode(mode: 'dark' | 'light' | 'system'): 'dark' | 'light' {
+  if (mode === 'system') {
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+  }
+  return mode;
+}
+```
+
+- If `theme_id` is light-only (`ivory`, `chalk`) and the resolved mode is `dark`, fall back to `obsidian` dark.
+- Otherwise apply `<html class="theme-<id> dark?">`.
+
+System-mode listener: subscribe to `matchMedia('(prefers-color-scheme: dark)').addEventListener('change', ...)` only when `theme_mode === 'system'`.
+
+-----
+
+## 5. Frontend wiring
+
+### `apps/web/src/lib/theme.ts` (new)
+
+Exports:
+
+- `THEMES`: const array of `{ id, name, family, supportsDark, supportsLight, anchors }`
+- `applyTheme(id, mode)`: writes class to `<html>`, updates localStorage cache
+- `useTheme()`: hook reading `theme_id` + `theme_mode` from settings; applies on mount and on change; owns the matchMedia listener (only mounted when mode === 'system')
+
+### `apps/web/src/App.tsx`
+
+Call `useTheme()` at the top of the App component, before children, so the theme is applied before any child renders.
+
+### `apps/web/index.html`
+
+Inline `<script>` BEFORE the React entry that reads `localStorage['boocode.theme']` and sets `className` on `<html>` to prevent FOUC. Cache value: JSON `{ id, mode }`.
+
+### `apps/web/src/pages/Settings.tsx` (new)
+
+Route `/settings`. Layout:
+
+- **Mode radio group** at top — Dark / Light / System (shadcn `radio-group` + `label`).
+- **Theme grid** below — 18 cards. `grid-cols-2` mobile, `grid-cols-3` md+.
+  - Each card: shadcn `Card` containing theme name (font-mono, sm), family label (xs, muted), 5-swatch horizontal strip from `THEMES[i].anchors`, "Selected" badge if active, "Light only" hint on `ivory`/`chalk`.
+- Click card → PATCH `/api/settings` → on 200, `applyTheme()` + update localStorage cache. Optimistic; revert on failure with toast.
+- Mode radio change → same PATCH path.
+
+### `apps/web/src/components/ui/`
+
+Required shadcn primitives (verified present): `card`, `button`, `radio-group`, `label`.
+
+-----
+
+## 6. Build / verification
+
+- `pnpm typecheck` (must pass)
+- `pnpm -F web build` (must pass)
+- Schema migration: `psql ... -c "\d settings"` shows `theme_id` and `theme_mode`.
+- API: `curl GET /api/settings` returns new fields; `PATCH` accepts them; invalid id → 400.
+- Visual: cycle themes, toggle mode, system follows OS, reload persists.
+
+-----
+
+## 7. Out of scope (v1)
+
+- Custom user-defined palettes.
+- Per-project or per-session themes (global only).
+- Syntax-highlighting themes for `CodeBlock`.
+- Header quick-switcher dropdown (Settings only).
+
+-----
+
+## 8. Decisions on ambiguous points
+
+1. **Light-only theme + dark mode request:** fall back to `obsidian` dark. No inline message.
+2. **Font per theme:** locked at Inter + JetBrains Mono. No theme changes typography in v1.
+3. **Animation on swap:** instant class change. No CSS transitions on `--background` (they cause flicker on first paint).

pnpm-lock.yaml

@@ -12,6 +12,40 @@ importers:
         specifier: ^5.5.0
         version: 5.9.3
 
+  apps/booterm:
+    dependencies:
+      '@fastify/websocket':
+        specifier: ^10.0.1
+        version: 10.0.1
+      fastify:
+        specifier: ^4.28.1
+        version: 4.29.1
+      node-pty:
+        specifier: ^1.0.0
+        version: 1.1.0
+      pg:
+        specifier: ^8.13.0
+        version: 8.20.0
+      tslib:
+        specifier: ^2.6.3
+        version: 2.8.1
+      zod:
+        specifier: ^3.23.8
+        version: 3.25.76
+    devDependencies:
+      '@types/node':
+        specifier: ^20.14.10
+        version: 20.19.41
+      '@types/pg':
+        specifier: ^8.11.10
+        version: 8.20.0
+      tsx:
+        specifier: ^4.16.2
+        version: 4.22.0
+      typescript:
+        specifier: ^5.5.0
+        version: 5.9.3
+
   apps/server:
     dependencies:
       '@fastify/static':
@@ -57,6 +91,21 @@ importers:
       '@fontsource-variable/jetbrains-mono':
         specifier: ^5.2.8
         version: 5.2.8
+      '@xterm/addon-fit':
+        specifier: 0.10.0
+        version: 0.10.0(@xterm/xterm@5.5.0)
+      '@xterm/addon-search':
+        specifier: ^0.15.0
+        version: 0.15.0(@xterm/xterm@5.5.0)
+      '@xterm/addon-web-links':
+        specifier: 0.11.0
+        version: 0.11.0(@xterm/xterm@5.5.0)
+      '@xterm/addon-webgl':
+        specifier: ^0.19.0
+        version: 0.19.0
+      '@xterm/xterm':
+        specifier: 5.5.0
+        version: 5.5.0
       class-variance-authority:
         specifier: ^0.7.1
         version: 0.7.1
@@ -1727,6 +1776,9 @@ packages:
   '@types/node@20.19.41':
     resolution: {integrity: sha512-ECymXOukMnOoVkC2bb1Vc/w/836DXncOg5m8Xj1RH7xSHZJWNYY6Zh7EH477vcnD5egKNNfy2RpNOmuChhFPgQ==}
 
+  '@types/pg@8.20.0':
+    resolution: {integrity: sha512-bEPFOaMAHTEP1EzpvHTbmwR8UsFyHSKsRisLIHVMXnpNefSbGA1bD6CVy+qKjGSqmZqNqBDV2azOBo8TgkcVow==}
+
   '@types/prop-types@15.7.15':
     resolution: {integrity: sha512-F6bEyamV9jKGAFBEmlQnesRPGOQqS2+Uwi0Em15xenOxHaf2hv6L8YCVn3rPdPJOiJfPiCnLIRyvwVaqMY3MIw==}
 
@@ -1794,6 +1846,27 @@ packages:
   '@vitest/utils@3.2.4':
     resolution: {integrity: sha512-fB2V0JFrQSMsCo9HiSq3Ezpdv4iYaXRG1Sx8edX3MwxfyNn83mKiGzOcH+Fkxt4MHxr3y42fQi1oeAInqgX2QA==}
 
+  '@xterm/addon-fit@0.10.0':
+    resolution: {integrity: sha512-UFYkDm4HUahf2lnEyHvio51TNGiLK66mqP2JoATy7hRZeXaGMRDr00JiSF7m63vR5WKATF605yEggJKsw0JpMQ==}
+    peerDependencies:
+      '@xterm/xterm': ^5.0.0
+
+  '@xterm/addon-search@0.15.0':
+    resolution: {integrity: sha512-ZBZKLQ+EuKE83CqCmSSz5y1tx+aNOCUaA7dm6emgOX+8J9H1FWXZyrKfzjwzV+V14TV3xToz1goIeRhXBS5qjg==}
+    peerDependencies:
+      '@xterm/xterm': ^5.0.0
+
+  '@xterm/addon-web-links@0.11.0':
+    resolution: {integrity: sha512-nIHQ38pQI+a5kXnRaTgwqSHnX7KE6+4SVoceompgHL26unAxdfP6IPqUTSYPQgSwM56hsElfoNrrW5V7BUED/Q==}
+    peerDependencies:
+      '@xterm/xterm': ^5.0.0
+
+  '@xterm/addon-webgl@0.19.0':
+    resolution: {integrity: sha512-b3fMOsyLVuCeNJWxolACEUED0vm7qC0cy4wRvf3oURSzDTYVQiGPhTnhWZwIHdvC48Y+oLhvYXnY4XDXPoJo6A==}
+
+  '@xterm/xterm@5.5.0':
+    resolution: {integrity: sha512-hqJHYaQb5OptNunnyAnkHyM8aCjZ1MEIDTQu1iIbbTD/xops91NB5yq1ZK/dC2JDbVWtF23zUtl9JE2NqwT87A==}
+
   abstract-logging@2.0.1:
     resolution: {integrity: sha512-2BjRTZxTPvheOvGbBslFSYOUkr+SjPtOnrLP33f+VIWLzezQpZcqVg7ja3L4dBXmzzgwT+a029jRx5PCi3JuiA==}
 
@@ -2964,6 +3037,9 @@ packages:
       react: ^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc
       react-dom: ^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc
 
+  node-addon-api@7.1.1:
+    resolution: {integrity: sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==}
+
   node-domexception@1.0.0:
     resolution: {integrity: sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ==}
     engines: {node: '>=10.5.0'}
@@ -2973,6 +3049,9 @@ packages:
     resolution: {integrity: sha512-dRB78srN/l6gqWulah9SrxeYnxeddIG30+GOqK/9OlLVyLg3HPnr6SqOWTWOXKRwC2eGYCkZ59NNuSgvSrpgOA==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
 
+  node-pty@1.1.0:
+    resolution: {integrity: sha512-20JqtutY6JPXTUnL0ij1uad7Qe1baT46lyolh2sSENDd4sTzKZ4nmAFkeAARDKwmlLjPx6XKRlwRUxwjOy+lUg==}
+
   node-releases@2.0.44:
     resolution: {integrity: sha512-5WUyunoPMsvvEhS8AxHtRzP+oA8UCkJ7YRxatWKjngndhDGLiqEVAQKWjFAiAiuL8zMRGzGSJxFnLetoa43qGQ==}
 
@@ -3079,6 +3158,40 @@ packages:
     resolution: {integrity: sha512-//nshmD55c46FuFw26xV/xFAaB5HF9Xdap7HJBBnrKdAd6/GxDBaNA1870O79+9ueg61cZLSVc+OaFlfmObYVQ==}
     engines: {node: '>= 14.16'}
 
+  pg-cloudflare@1.3.0:
+    resolution: {integrity: sha512-6lswVVSztmHiRtD6I8hw4qP/nDm1EJbKMRhf3HCYaqud7frGysPv7FYJ5noZQdhQtN2xJnimfMtvQq21pdbzyQ==}
+
+  pg-connection-string@2.12.0:
+    resolution: {integrity: sha512-U7qg+bpswf3Cs5xLzRqbXbQl85ng0mfSV/J0nnA31MCLgvEaAo7CIhmeyrmJpOr7o+zm0rXK+hNnT5l9RHkCkQ==}
+
+  pg-int8@1.0.1:
+    resolution: {integrity: sha512-WCtabS6t3c8SkpDBUlb1kjOs7l66xsGdKpIPZsg4wR+B3+u9UAum2odSsF9tnvxg80h4ZxLWMy4pRjOsFIqQpw==}
+    engines: {node: '>=4.0.0'}
+
+  pg-pool@3.13.0:
+    resolution: {integrity: sha512-gB+R+Xud1gLFuRD/QgOIgGOBE2KCQPaPwkzBBGC9oG69pHTkhQeIuejVIk3/cnDyX39av2AxomQiyPT13WKHQA==}
+    peerDependencies:
+      pg: '>=8.0'
+
+  pg-protocol@1.13.0:
+    resolution: {integrity: sha512-zzdvXfS6v89r6v7OcFCHfHlyG/wvry1ALxZo4LqgUoy7W9xhBDMaqOuMiF3qEV45VqsN6rdlcehHrfDtlCPc8w==}
+
+  pg-types@2.2.0:
+    resolution: {integrity: sha512-qTAAlrEsl8s4OiEQY69wDvcMIdQN6wdz5ojQiOy6YRMuynxenON0O5oCpJI6lshc6scgAY8qvJ2On/p+CXY0GA==}
+    engines: {node: '>=4'}
+
+  pg@8.20.0:
+    resolution: {integrity: sha512-ldhMxz2r8fl/6QkXnBD3CR9/xg694oT6DZQ2s6c/RI28OjtSOpxnPrUCGOBJ46RCUxcWdx3p6kw/xnDHjKvaRA==}
+    engines: {node: '>= 16.0.0'}
+    peerDependencies:
+      pg-native: '>=3.0.1'
+    peerDependenciesMeta:
+      pg-native:
+        optional: true
+
+  pgpass@1.0.5:
+    resolution: {integrity: sha512-FdW9r/jQZhSeohs1Z3sI1yxFQNFvMcnmfuj4WBMUTxOrAyLMaTcE1aAMBiTlbMNaXvBCQuVi0R7hd8udDSP7ug==}
+
   picocolors@1.1.1:
     resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
 
@@ -3112,6 +3225,22 @@ packages:
     resolution: {integrity: sha512-SoSL4+OSEtR99LHFZQiJLkT59C5B1amGO1NzTwj7TT1qCUgUO6hxOvzkOYxD+vMrXBM3XJIKzokoERdqQq/Zmg==}
     engines: {node: ^10 || ^12 || >=14}
 
+  postgres-array@2.0.0:
+    resolution: {integrity: sha512-VpZrUqU5A69eQyW2c5CA1jtLecCsN2U/bD6VilrFDWq5+5UIEVO7nazS3TEcHf1zuPYO/sqGvUvW62g86RXZuA==}
+    engines: {node: '>=4'}
+
+  postgres-bytea@1.0.1:
+    resolution: {integrity: sha512-5+5HqXnsZPE65IJZSMkZtURARZelel2oXUEO8rH83VS/hxH5vv1uHquPg5wZs8yMAfdv971IU+kcPUczi7NVBQ==}
+    engines: {node: '>=0.10.0'}
+
+  postgres-date@1.0.7:
+    resolution: {integrity: sha512-suDmjLVQg78nMK2UZ454hAG+OAW+HQPZ6n++TNDUX+L0+uUlLywnoxJKDou51Zm+zTCjrCl0Nq6J9C5hP9vK/Q==}
+    engines: {node: '>=0.10.0'}
+
+  postgres-interval@1.2.0:
+    resolution: {integrity: sha512-9ZhXKM/rw350N1ovuWHbGxnGh/SNJ4cnxHiM0rxE4VN41wsg8P8zWn9hv/buK00RP4WvlOyr/RBDiptyxVbkZQ==}
+    engines: {node: '>=0.10.0'}
+
   postgres@3.4.9:
     resolution: {integrity: sha512-GD3qdB0x1z9xgFI6cdRD6xu2Sp2WCOEoe3mtnyB5Ee0XrrL5Pe+e4CCnJrRMnL1zYtRDZmQQVbvOttLnKDLnaw==}
     engines: {node: '>=12'}
@@ -3797,6 +3926,10 @@ packages:
     resolution: {integrity: sha512-g/eziiSUNBSsdDJtCLB8bdYEUMj4jR7AGeUo96p/3dTafgjHhpF4RiCFPiRILwjQoDXx5MqkBr4fwWtR3Ky4Wg==}
     engines: {node: '>=20'}
 
+  xtend@4.0.2:
+    resolution: {integrity: sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==}
+    engines: {node: '>=0.4'}
+
   y18n@5.0.8:
     resolution: {integrity: sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==}
     engines: {node: '>=10'}
@@ -5380,6 +5513,12 @@ snapshots:
     dependencies:
       undici-types: 6.21.0
 
+  '@types/pg@8.20.0':
+    dependencies:
+      '@types/node': 20.19.41
+      pg-protocol: 1.13.0
+      pg-types: 2.2.0
+
   '@types/prop-types@15.7.15': {}
 
   '@types/react-dom@18.3.7(@types/react@18.3.28)':
@@ -5464,6 +5603,22 @@ snapshots:
       loupe: 3.2.1
       tinyrainbow: 2.0.0
 
+  '@xterm/addon-fit@0.10.0(@xterm/xterm@5.5.0)':
+    dependencies:
+      '@xterm/xterm': 5.5.0
+
+  '@xterm/addon-search@0.15.0(@xterm/xterm@5.5.0)':
+    dependencies:
+      '@xterm/xterm': 5.5.0
+
+  '@xterm/addon-web-links@0.11.0(@xterm/xterm@5.5.0)':
+    dependencies:
+      '@xterm/xterm': 5.5.0
+
+  '@xterm/addon-webgl@0.19.0': {}
+
+  '@xterm/xterm@5.5.0': {}
+
   abstract-logging@2.0.1: {}
 
   accepts@2.0.0:
@@ -6817,6 +6972,8 @@ snapshots:
       react: 18.3.1
       react-dom: 18.3.1(react@18.3.1)
 
+  node-addon-api@7.1.1: {}
+
   node-domexception@1.0.0: {}
 
   node-fetch@3.3.2:
@@ -6825,6 +6982,10 @@ snapshots:
       fetch-blob: 3.2.0
       formdata-polyfill: 4.0.10
 
+  node-pty@1.1.0:
+    dependencies:
+      node-addon-api: 7.1.1
+
   node-releases@2.0.44: {}
 
   npm-run-path@4.0.1:
@@ -6935,6 +7096,41 @@ snapshots:
 
   pathval@2.0.1: {}
 
+  pg-cloudflare@1.3.0:
+    optional: true
+
+  pg-connection-string@2.12.0: {}
+
+  pg-int8@1.0.1: {}
+
+  pg-pool@3.13.0(pg@8.20.0):
+    dependencies:
+      pg: 8.20.0
+
+  pg-protocol@1.13.0: {}
+
+  pg-types@2.2.0:
+    dependencies:
+      pg-int8: 1.0.1
+      postgres-array: 2.0.0
+      postgres-bytea: 1.0.1
+      postgres-date: 1.0.7
+      postgres-interval: 1.2.0
+
+  pg@8.20.0:
+    dependencies:
+      pg-connection-string: 2.12.0
+      pg-pool: 3.13.0(pg@8.20.0)
+      pg-protocol: 1.13.0
+      pg-types: 2.2.0
+      pgpass: 1.0.5
+    optionalDependencies:
+      pg-cloudflare: 1.3.0
+
+  pgpass@1.0.5:
+    dependencies:
+      split2: 4.2.0
+
   picocolors@1.1.1: {}
 
   picomatch@2.3.2: {}
@@ -6974,6 +7170,16 @@ snapshots:
       picocolors: 1.1.1
       source-map-js: 1.2.1
 
+  postgres-array@2.0.0: {}
+
+  postgres-bytea@1.0.1: {}
+
+  postgres-date@1.0.7: {}
+
+  postgres-interval@1.2.0:
+    dependencies:
+      xtend: 4.0.2
+
   postgres@3.4.9: {}
 
   powershell-utils@0.1.0: {}
@@ -7782,6 +7988,8 @@ snapshots:
       is-wsl: 3.1.1
       powershell-utils: 0.1.0
 
+  xtend@4.0.2: {}
+
   y18n@5.0.8: {}
 
   yallist@3.1.1: {}