From b42b768d00956ca3f8c7bb2b028750061ded081e Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Sun, 6 Sep 2026 11:47:28 +0000
Subject: [PATCH 1/4] feat(workspaces): generalize WebPi host into multi-wire
 WebSessionHost

Extract the Pi RPC session host into a transport-driven WebSessionHost with
pi-rpc, acp, claude-stream-json, and codex-app-server transports. Declare
web-surface capabilities on every adapter that exposes a structured stdio
protocol and expose the surface through /api/workspaces/:id/web/* routes.

Co-authored-by: RainMona <RainMona@users.noreply.github.com>
---
 PLANS.md                                      |   5 +
 plans/web-conversation-surface.md             | 103 ++++
 src/webui/routes/workspaces.spec.ts           |  98 ++--
 src/webui/routes/workspaces.ts                | 146 +++---
 src/workspaces/adapters/claude.ts             |  31 ++
 src/workspaces/adapters/codex.ts              |  36 +-
 src/workspaces/adapters/cursor.ts             |  18 +
 src/workspaces/adapters/grok.ts               |  18 +
 src/workspaces/adapters/omp.ts                |  22 +
 src/workspaces/adapters/opencode.ts           |  14 +
 src/workspaces/adapters/pi.ts                 |  14 +-
 src/workspaces/adapters/web-command.spec.ts   |  71 +++
 src/workspaces/cli-adapter.ts                 |  32 +-
 src/workspaces/public-session.spec.ts         |   4 +-
 src/workspaces/public-session.ts              |  16 +-
 src/workspaces/service.ts                     |  80 ++-
 src/workspaces/web-session-host.spec.ts       | 486 ++++++++++++++++++
 src/workspaces/web-session-host.ts            | 369 +++++++++++++
 src/workspaces/web-session/acp-transport.ts   | 291 +++++++++++
 .../claude-stream-json-transport.ts           | 252 +++++++++
 .../web-session/codex-app-server-transport.ts | 401 +++++++++++++++
 src/workspaces/web-session/json-rpc.ts        |  99 ++++
 src/workspaces/web-session/model.ts           | 105 ++++
 .../web-session/pi-rpc-transport.ts           | 212 ++++++++
 .../web-session/transcript-builder.ts         | 132 +++++
 src/workspaces/web-session/transport.ts       | 216 ++++++++
 src/workspaces/webpi-session-host.spec.ts     | 157 ------
 src/workspaces/webpi-session-host.ts          | 403 ---------------
 src/workspaces/workspace-lifecycle.ts         |   6 +-
 29 files changed, 3128 insertions(+), 709 deletions(-)
 create mode 100644 plans/web-conversation-surface.md
 create mode 100644 src/workspaces/adapters/web-command.spec.ts
 create mode 100644 src/workspaces/web-session-host.spec.ts
 create mode 100644 src/workspaces/web-session-host.ts
 create mode 100644 src/workspaces/web-session/acp-transport.ts
 create mode 100644 src/workspaces/web-session/claude-stream-json-transport.ts
 create mode 100644 src/workspaces/web-session/codex-app-server-transport.ts
 create mode 100644 src/workspaces/web-session/json-rpc.ts
 create mode 100644 src/workspaces/web-session/model.ts
 create mode 100644 src/workspaces/web-session/pi-rpc-transport.ts
 create mode 100644 src/workspaces/web-session/transcript-builder.ts
 create mode 100644 src/workspaces/web-session/transport.ts
 delete mode 100644 src/workspaces/webpi-session-host.spec.ts
 delete mode 100644 src/workspaces/webpi-session-host.ts

diff --git a/PLANS.md b/PLANS.md
index 4c6522b424..f84e02f7ea 100644
--- a/PLANS.md
+++ b/PLANS.md
@@ -29,6 +29,11 @@ the durable truth after it changes. Git history is the archive.
 
 ## Active
 
+- [[plans/web-conversation-surface.md]] — Generalizes WebPi into one Web
+  conversation surface: a neutral `WebSessionHost` with `pi-rpc`, `acp`,
+  `claude-stream-json`, and `codex-app-server` transports, first-class
+  permission requests, and capability-gated UI. Live per-runtime acceptance
+  remains open.
 - [[plans/unified-page-topbar.md]] — Unifies navigator and content toolbars
   across the UI, with fixed page actions and content-owned sidebar restoration.
   Held on `codex/ui-usability-followup` for visual acceptance.
diff --git a/plans/web-conversation-surface.md b/plans/web-conversation-surface.md
new file mode 100644
index 0000000000..614f93ccbb
--- /dev/null
+++ b/plans/web-conversation-surface.md
@@ -0,0 +1,103 @@
+# Plan: Web conversation surface for every structured Agent runtime
+
+**Status:** active  
+**Owner guides:** [[docs/web-conversation-surface.md]], [[docs/ui-interaction-and-motion.md]], [[docs/workspace-manager.md]]  
+**Delivery:** serial PR to `dev` (`area:workspace`, `area:ui`).
+
+## Goal
+
+WebPi proved that a browser conversation over a long-lived structured CLI
+process is a better product surface than a PTY for many tasks. It shipped as a
+Pi-only special case: the host spoke Pi's RPC protocol, the routes checked
+`agent === 'pi'`, and the UI gated every affordance on the same literal.
+
+This plan turns "WebPi" into one Web surface that any Agent runtime can join by
+declaring a wire protocol. The browser keeps the adapter-neutral conversation
+presentation from PR #1385; Alice gains a transport layer that normalizes each
+runtime's live protocol into one message model, one phase model, and one
+permission-request model.
+
+## Alternatives considered
+
+1. **One native host per runtime** (the WebPi approach repeated N times).
+   Closest fit to each CLI, but N protocol parsers and N snapshot shapes, and
+   the browser would need N presenters. Rejected as the primary structure.
+2. **Everything through ACP** (Agent Client Protocol). One client covers
+   cursor, grok, opencode, omp natively; claude, codex, and pi need an extra
+   npm adapter package, agy has no trustworthy implementation, and ACP is the
+   lowest common denominator (no compaction, model, or thinking controls
+   without vendor `_meta`). Rejected as the only path, adopted as one transport.
+3. **Hybrid (chosen):** a neutral `WebSessionHost` with pluggable transports.
+   `pi-rpc` reuses the existing code for pi and omp; `acp` covers the three
+   runtimes whose own binary speaks ACP; `claude-stream-json` and
+   `codex-app-server` use the vendor protocols that are richer than ACP and
+   need no extra install. Pi's minimal message shape becomes the neutral
+   model because every other protocol maps onto it losslessly enough for
+   presentation, and the browser presenter already understands it.
+
+## Decisions
+
+- The neutral model is presentation-grade, not a persisted store. Each
+  runtime's own transcript remains the durable conversation; Alice keeps one
+  live process per Session record, exactly as WebPi did.
+- `SessionRecord.surface: 'webpi'` is a shipped persisted value (migration
+  0040) and stays. It now means "structured web conversation" for any agent.
+  HTTP paths move from `/webpi/*` to `/web/*` because UI and server ship
+  together; no compatibility alias.
+- Adapters opt in with `capabilities.web = { wire }` plus `composeWebCommand`.
+  The UI reads the capability from `/api/workspaces/agents`; no runtime id
+  literal decides whether a Web button exists.
+- Permission prompts become first-class: transports surface
+  `session/request_permission` (ACP), `can_use_tool` control requests
+  (Claude), and `item/*/requestApproval` (Codex) as neutral requests with
+  options; the browser answers through `POST .../web/respond`. Pi and omp
+  keep launch-time approval (`--approve` / `--auto-approve`) because their RPC
+  modes have no per-tool prompt.
+- Fresh Web sessions are allowed for runtimes that create sessions in-band
+  (ACP `session/new`, Codex `thread/start`, Claude `--session-id`, omp fresh
+  RPC). The transport reports the native id and Alice binds it to the
+  `resumeId` the same way PTY discovery does.
+- agy stays TUI-only: its new `--input-format stream-json` has no permission
+  round-trip and no native ACP; revisit when either lands.
+- Workspace Manager keeps its Pi-only WebPi quick start; other runtimes still
+  need a manager-contract injection path before they can join it.
+
+## UI design decision
+
+Alternatives for permission prompts: (a) inline as a transcript item, (b) a
+modal dialog, (c) a card pinned above the composer. (c) is chosen: it keeps
+the transcript an audit trail, does not steal focus from a user who is typing
+a follow-up, and matches the compaction status treatment already pinned in
+the same slot. Options render as buttons in the order the runtime supplies;
+allow-style options are primary, reject-style are outline. Reduced motion is
+inherited from the shared primitives.
+
+## Work
+
+- [ ] Neutral message/request/snapshot model and transport contract
+- [ ] `WebSessionHost` with process supervision shared by all transports
+- [ ] `pi-rpc` transport (pi, omp) extracted from `WebPiSessionHost`
+- [ ] `acp` transport (cursor, grok, opencode) with permission requests
+- [ ] `claude-stream-json` transport with `can_use_tool` and interrupt
+- [ ] `codex-app-server` transport with approvals and `turn/interrupt`
+- [ ] Adapter capability declarations and `composeWebCommand` per runtime
+- [ ] Service/routes: `/web/*`, `respond`, native-id binding, capability checks
+- [ ] UI: generic hook/presenter/view, permission cards, capability gating, demo
+- [ ] Owner guide + doc updates
+- [ ] Live acceptance against each installed runtime (see verification)
+
+## Verification
+
+- `npx tsc --noEmit`, `pnpm test`, `cd ui && npx tsc -b`.
+- Transport specs drive fake child processes over stdio for every wire.
+- Demo route (`pnpm -F open-alice-ui dev:demo`) walks open → prompt →
+  permission request → respond → stop for a non-Pi runtime.
+- Live runtimes are not available in the authoring environment. Before
+  promotion, open one Session per installed runtime, send a prompt that needs
+  a tool, answer the permission card, stop mid-turn, and reopen the same
+  Session in the TUI to confirm the native transcript is shared.
+
+## Completion
+
+Delete this file and its [[PLANS.md]] bullet when the live acceptance is
+recorded and the PR is accepted.
diff --git a/src/webui/routes/workspaces.spec.ts b/src/webui/routes/workspaces.spec.ts
index 37a2700c77..0c8700c389 100644
--- a/src/webui/routes/workspaces.spec.ts
+++ b/src/webui/routes/workspaces.spec.ts
@@ -1630,16 +1630,16 @@ describe('POST /:id/sessions/:sid/resume — concurrent coalescing (ANG-120)', (
   });
 });
 
-describe('WebPi surface routes', () => {
+describe('Web surface routes', () => {
   const TOKEN = 'pi-calm-amber-river';
 
-  function buildWebPi() {
+  function buildWeb(agent = 'pi', capabilities: Record<string, unknown> = { resumeById: true, web: { wire: 'pi-rpc', permissionPrompts: false, freshSession: true } }) {
     const order: string[] = [];
     const record = {
       id: TOKEN,
-      resumeId: 'resume-webpi',
+      resumeId: 'resume-web',
       wsId: 'ws-1',
-      agent: 'pi',
+      agent,
       name: 'p1',
       createdAt: '2026-07-12T00:00:00.000Z',
       lastActiveAt: '2026-07-12T00:00:00.000Z',
@@ -1649,30 +1649,36 @@ describe('WebPi surface routes', () => {
     const snapshot = {
       recordId: TOKEN,
       wsId: 'ws-1',
-      resumeId: 'resume-webpi',
+      resumeId: 'resume-web',
+      agent,
+      wire: 'pi-rpc',
+      nativeSessionId: 'native-pi',
       pid: 9001,
       startedAt: 1,
       phase: 'idle',
-      state: {},
       messages: [],
       streamingMessage: null,
+      requests: [],
       error: null,
       stderrTail: '',
       revision: 1,
     };
     const adapter = {
-      id: 'pi',
-      capabilities: { resumeById: true },
+      id: agent,
+      displayName: agent,
+      capabilities,
+      composeWebCommand: capabilities['web'] ? vi.fn(() => [agent]) : undefined,
       readAiConfig: vi.fn(async () => ({ baseUrl: 'https://example.test', apiKey: 'test', model: 'model' })),
       writeAiConfig: vi.fn(async () => undefined),
       lifecycle: { prepareWorkspace: vi.fn(async () => { order.push('prepare-workspace'); }) },
     };
-    const webPi = {
+    const web = {
       get: vi.fn(() => snapshot),
       has: vi.fn(() => false),
       stop: vi.fn(async () => false),
       prompt: vi.fn(async () => ({ ...snapshot, phase: 'working' })),
       abort: vi.fn(async () => snapshot),
+      respond: vi.fn(async () => ({ ...snapshot, requests: [] })),
     };
     const svc = {
       registry: { get: () => ({ id: 'ws-1', dir: '/w' }) },
@@ -1686,34 +1692,58 @@ describe('WebPi surface routes', () => {
         get: vi.fn(() => ({ pid: 123, startedAt: 1 })),
         disposeToken: vi.fn(() => { order.push('terminal-stopped'); return true; }),
       },
-      webPi,
-      startWebPiSession: vi.fn(async () => { order.push('webpi-started'); return snapshot; }),
+      web,
+      startWebSession: vi.fn(async () => { order.push('web-started'); return snapshot; }),
       isResumeActive: vi.fn(() => false),
       config: { launcherRepoRoot: '/repo' },
     } as unknown as WorkspaceService;
-    return { app: createWorkspaceRoutes(svc), order, svc, webPi };
+    return { app: createWorkspaceRoutes(svc), order, svc, web };
   }
 
-  it('hands an existing Pi Session from its PTY to WebPi', async () => {
-    const { app, order, svc } = buildWebPi();
-    const result = await post(app, `/ws-1/sessions/${TOKEN}/webpi/open`);
+  it('hands an existing Session from its PTY to the Web surface', async () => {
+    const { app, order, svc } = buildWeb();
+    const result = await post(app, `/ws-1/sessions/${TOKEN}/web/open`);
     expect(result.status).toBe(200);
-    expect(result.body.snapshot).toMatchObject({ resumeId: 'resume-webpi', phase: 'idle' });
-    expect(order).toEqual(['prepare-workspace', 'terminal-stopped', 'webpi-started']);
-    expect(svc.startWebPiSession).toHaveBeenCalledOnce();
+    expect(result.body.snapshot).toMatchObject({ resumeId: 'resume-web', phase: 'idle' });
+    expect(order).toEqual(['prepare-workspace', 'terminal-stopped', 'web-started']);
+    expect(svc.startWebSession).toHaveBeenCalledOnce();
   });
 
-  it('passes browser prompts straight to the live Pi RPC host', async () => {
-    const { app, webPi } = buildWebPi();
-    const result = await post(app, `/ws-1/sessions/${TOKEN}/webpi/prompt`, { message: 'hello Pi' });
+  it('opens any runtime that declares a Web capability, not only Pi', async () => {
+    const { app, svc } = buildWeb('codex', { resumeById: true, web: { wire: 'codex-app-server', permissionPrompts: true, freshSession: true } });
+    const result = await post(app, `/ws-1/sessions/${TOKEN}/web/open`);
     expect(result.status).toBe(200);
-    expect(webPi.prompt).toHaveBeenCalledWith(TOKEN, 'hello Pi');
+    expect(svc.startWebSession).toHaveBeenCalledOnce();
+  });
+
+  it('refuses runtimes without a Web capability instead of checking the agent id', async () => {
+    const { app, svc } = buildWeb('agy', { resumeById: true });
+    const result = await post(app, `/ws-1/sessions/${TOKEN}/web/open`);
+    expect(result.status).toBe(409);
+    expect(result.body.error).toBe('unsupported_surface');
+    expect(svc.startWebSession).not.toHaveBeenCalled();
+  });
+
+  it('passes browser prompts straight to the live host', async () => {
+    const { app, web } = buildWeb();
+    const result = await post(app, `/ws-1/sessions/${TOKEN}/web/prompt`, { message: 'hello Pi' });
+    expect(result.status).toBe(200);
+    expect(web.prompt).toHaveBeenCalledWith(TOKEN, 'hello Pi');
     expect(result.body.snapshot.phase).toBe('working');
   });
 
+  it('answers runtime permission requests with the chosen option', async () => {
+    const { app, web } = buildWeb();
+    const result = await post(app, `/ws-1/sessions/${TOKEN}/web/respond`, { requestId: 'acp-7', optionId: 'allow_once' });
+    expect(result.status).toBe(200);
+    expect(web.respond).toHaveBeenCalledWith(TOKEN, 'acp-7', 'allow_once');
+    const bad = await post(app, `/ws-1/sessions/${TOKEN}/web/respond`, { requestId: 'acp-7' });
+    expect(bad.status).toBe(400);
+  });
+
   it('returns a tiny unchanged response when the browser already has the revision', async () => {
-    const { app } = buildWebPi();
-    const result = await get(app, `/ws-1/sessions/${TOKEN}/webpi?revision=1`);
+    const { app } = buildWeb();
+    const result = await get(app, `/ws-1/sessions/${TOKEN}/web?revision=1`);
     expect(result.status).toBe(200);
     expect(result.body).toEqual({ unchanged: true, revision: 1 });
   });
@@ -1795,7 +1825,7 @@ describe('Workspace manager surface routes', () => {
     );
   });
 
-  it('starts a launcher-owned Pi conversation directly in WebPi with the manager contract', async () => {
+  it('starts a launcher-owned Pi conversation directly in the Web surface with the manager contract', async () => {
     const meta = {
       id: 'workspace-manager',
       tag: 'Workspace Manager',
@@ -1824,7 +1854,7 @@ describe('Workspace manager surface routes', () => {
       stderrTail: '',
       revision: 1,
     };
-    const startWebPiSession = vi.fn(async () => snapshot);
+    const startWebSession = vi.fn(async () => snapshot);
     const prompt = vi.fn(async () => snapshot);
     const disposeToken = vi.fn(() => true);
     const ensureManagerSession = vi.fn(async (input: any) => {
@@ -1900,8 +1930,8 @@ describe('Workspace manager surface routes', () => {
         disposeToken,
       },
       isResumeActive: vi.fn(() => false),
-      startWebPiSession,
-      webPi: { get: vi.fn(() => snapshot), prompt },
+      startWebSession,
+      web: { get: vi.fn(() => snapshot), prompt },
       config: { launcherRepoRoot: '/repo' },
     } as unknown as WorkspaceService;
     const app = createWorkspaceRoutes(svc);
@@ -1918,8 +1948,8 @@ describe('Workspace manager surface routes', () => {
       session: { wsId: 'workspace-manager', agent: 'pi', surface: 'webpi' },
       snapshot: { phase: 'working' },
     });
-    expect(disposeToken).toHaveBeenCalledWith(createdRecord.id, 'switch fresh manager Session to WebPi');
-    expect(startWebPiSession).toHaveBeenCalledWith(
+    expect(disposeToken).toHaveBeenCalledWith(createdRecord.id, 'switch fresh manager Session to Web');
+    expect(startWebSession).toHaveBeenCalledWith(
       meta,
       createdRecord,
       expect.objectContaining({
@@ -1948,7 +1978,7 @@ describe('Workspace manager surface routes', () => {
     };
     let spawnedContext: any = null;
     let liveSession: any = null;
-    const startWebPiSession = vi.fn();
+    const startWebSession = vi.fn();
     const ensureManagerSession = vi.fn(async (input: any) => {
       const identity = {
         resumeId: 'resume-manager-codex',
@@ -2027,8 +2057,8 @@ describe('Workspace manager surface routes', () => {
         }),
       },
       isResumeActive: vi.fn(() => false),
-      startWebPiSession,
-      webPi: { get: vi.fn(() => null) },
+      startWebSession,
+      web: { get: vi.fn(() => null) },
       config: { launcherRepoRoot: '/repo' },
     } as unknown as WorkspaceService;
     const app = createWorkspaceRoutes(svc);
@@ -2061,7 +2091,7 @@ describe('Workspace manager surface routes', () => {
     expect(result.body).toMatchObject({ session: { title: 'Map ownership.' } });
     expect(spawnedContext.initialPrompt).toContain('OpenAlice Workspace Manager');
     expect(spawnedContext.initialPrompt).toContain('User request:\nMap ownership.');
-    expect(startWebPiSession).not.toHaveBeenCalled();
+    expect(startWebSession).not.toHaveBeenCalled();
 
     const unsupported = await post(app, '/manager/quick-start', {
       prompt: 'Open a shell.',
diff --git a/src/webui/routes/workspaces.ts b/src/webui/routes/workspaces.ts
index a8ee5592b3..bed601f60d 100644
--- a/src/webui/routes/workspaces.ts
+++ b/src/webui/routes/workspaces.ts
@@ -7,7 +7,7 @@ import { prepareProjectWorkspaces, readProjectWorkspaceSetup } from '../../works
  * the original `server/src/index.ts` `handleHttp` switch did.
  */
 
-import { Hono } from 'hono';
+import { Hono, type Context } from 'hono';
 import { existsSync } from 'node:fs';
 import { readFile } from 'node:fs/promises';
 import { join, resolve as resolvePath } from 'node:path';
@@ -597,12 +597,12 @@ export function createWorkspaceRoutes(
 
   const publicSession = (record: SessionRecord): PublicSession => {
     const terminal = svc.pool.get(record.id);
-    const browser = svc.webPi?.get(record.id) ?? null;
+    const browser = svc.web?.get(record.id) ?? null;
     const identity = svc.resumeRegistry.get(record.resumeId);
     const binding = identity?.runtimeBinding;
     return projectPublicSession(record, {
       terminal,
-      webPi: browser,
+      web: browser,
       headless: svc.isResumeActive(record.resumeId),
       runtimeBinding: binding,
       ...(identity?.displayName ? { displayName: identity.displayName } : {}),
@@ -629,7 +629,7 @@ export function createWorkspaceRoutes(
   ): Promise<OpenHeadlessSessionResult> => {
     await svc.sessionRegistry.ensureLoaded(meta.id);
     const existing = svc.sessionRegistry.findByResumeId(meta.id, resumeId);
-    if (existing && (svc.pool.get(existing.id) || svc.webPi.get(existing.id))) {
+    if (existing && (svc.pool.get(existing.id) || svc.web.get(existing.id))) {
       return { ok: true, created: false, session: publicSession(existing) };
     }
     const identity = svc.resumeRegistry.get(resumeId);
@@ -691,10 +691,10 @@ export function createWorkspaceRoutes(
     }
   };
 
-  const managerWebPiOptions = {
+  const managerWebOptions = {
     appendSystemPrompt: MANAGER_SYSTEM_PROMPT,
     skills: [managerSkillPath(svc.config.launcherRepoRoot)],
-    // WebPi has no TUI in which it could render Pi's trust prompt. Entering the
+    // The Web surface has no TUI in which it could render Pi's trust prompt. Entering the
     // explicit manager surface is the user's approval for its launcher-owned
     // skill and active-office-floor cwd.
     approveProject: true,
@@ -722,8 +722,9 @@ export function createWorkspaceRoutes(
   // ── launcher-owned Workspace manager ───────────────────────────────────
   // The manager's cwd is the active office floor, but it is intentionally not
   // inserted into the business Workspace registry. Its sessions live in the
-  // same durable Session/Resume registries. Pi opens through WebPi; the other
-  // supported agent runtimes keep their native TUI surface.
+  // same durable Session/Resume registries. Pi opens through the Web surface
+  // with the manager contract; the other runtimes keep their native TUI until
+  // they gain a manager-prompt injection path.
   app.get('/manager', async (c) => c.json({ manager: await publicManager() }));
 
   app.post('/manager/quick-start', async (c) => {
@@ -797,9 +798,9 @@ export function createWorkspaceRoutes(
       // A fresh native Pi id is allocated by the ordinary interactive spawn
       // seam. Stop its unused TUI immediately, then reopen that exact native
       // conversation in RPC mode and submit the visible user prompt.
-      svc.pool.disposeToken(record.id, 'switch fresh manager Session to WebPi');
-      await svc.startWebPiSession(meta, record, managerWebPiOptions);
-      const snapshot = await svc.webPi.prompt(record.id, prompt);
+      svc.pool.disposeToken(record.id, 'switch fresh manager Session to Web');
+      await svc.startWebSession(meta, record, managerWebOptions);
+      const snapshot = await svc.web.prompt(record.id, prompt);
       return c.json({
         manager: await publicManager(),
         session: publicSession(record),
@@ -1783,7 +1784,7 @@ export function createWorkspaceRoutes(
       && (
         interactive.state === 'running'
         || svc.pool.get(interactive.id)
-        || svc.webPi?.has(interactive.id)
+        || svc.web?.has(interactive.id)
       )
     ) {
       return c.json({
@@ -2149,8 +2150,8 @@ export function createWorkspaceRoutes(
         }
       }
       const wasTerminalRunning = svc.pool.disposeToken(token, action === 'pause' ? 'paused' : 'tab stop');
-      const wasWebPiRunning = await svc.webPi?.stop(token, action === 'pause' ? 'paused' : 'tab stop') ?? false;
-      const wasRunning = wasTerminalRunning || wasWebPiRunning;
+      const wasWebRunning = await svc.web?.stop(token, action === 'pause' ? 'paused' : 'tab stop') ?? false;
+      const wasRunning = wasTerminalRunning || wasWebRunning;
       if (record) {
         const patch: Partial<SessionRecord> = {
           state: 'paused',
@@ -2176,7 +2177,7 @@ export function createWorkspaceRoutes(
           resumeId: record.resumeId,
           agent: record.agent,
           sessionRecordId: record.id,
-          surface: wasWebPiRunning && !wasTerminalRunning ? 'webpi' : 'terminal',
+          surface: wasWebRunning && !wasTerminalRunning ? 'webpi' : 'terminal',
           status: 'paused',
         })
       }
@@ -2195,7 +2196,7 @@ export function createWorkspaceRoutes(
     if (
       record.state !== 'paused'
       || svc.pool.get(token)
-      || svc.webPi?.has(token)
+      || svc.web?.has(token)
     ) {
       return c.json({
         error: 'session_not_paused',
@@ -2308,7 +2309,7 @@ export function createWorkspaceRoutes(
       }
       // Choosing the terminal surface is an explicit handoff. Never leave Pi's
       // RPC host and PTY alive against the same native session file.
-      if (svc.webPi?.has(token)) await svc.webPi.stop(token, 'switch to terminal');
+      if (svc.web?.has(token)) await svc.web.stop(token, 'switch to terminal');
       const meta = svc.resolveRuntimeWorkspace?.(id) ?? svc.registry.get(id);
       if (!meta) return c.json({ error: 'workspace_not_found' }, 404);
       const adapter = svc.adapters.get(record.agent);
@@ -2483,38 +2484,49 @@ export function createWorkspaceRoutes(
     }
   });
 
-  // WebPi is a presentation of an existing Pi Session, not another runtime.
-  // The four routes below expose Pi's own RPC state/messages without adapting
-  // them into OpenAlice message blocks.
-  app.post('/:id/sessions/:sid/webpi/open', async (c) => {
+  // The Web surface is a presentation of an existing Session through its
+  // runtime's structured protocol, not another runtime. The routes below
+  // expose the neutral live snapshot; adapters and transports own the wire.
+  const webSessionContext = (c: Context) => {
     const id = c.req.param('id');
     const token = c.req.param('sid');
-    if (!validId(id) || !validId(token)) return c.json({ error: 'not_found' }, 404);
+    if (!validId(id) || !validId(token)) return null;
+    const record = svc.sessionRegistry.get(id, token);
+    if (!record) return null;
+    return { id, token, record };
+  };
+
+  app.post('/:id/sessions/:sid/web/open', async (c) => {
+    const ctx = webSessionContext(c);
+    if (!ctx) return c.json({ error: 'not_found' }, 404);
+    const { id, token, record } = ctx;
     // Older embedders/tests may provide only the business registry. Keep the
     // ordinary Workspace path compatible while the launcher-owned manager is
     // resolved through the newer service seam.
     const meta = svc.resolveRuntimeWorkspace?.(id) ?? svc.registry.get(id);
-    const record = svc.sessionRegistry.get(id, token);
-    if (!meta || !record) return c.json({ error: 'not_found' }, 404);
-    if (record.agent !== 'pi') {
-      return c.json({ error: 'unsupported_surface', message: 'WebPi is available only for Pi Sessions' }, 409);
+    if (!meta) return c.json({ error: 'not_found' }, 404);
+    const adapter = svc.adapters.get(record.agent);
+    if (!adapter) return c.json({ error: 'unknown_agent' }, 500);
+    if (!adapter.capabilities.web || !adapter.composeWebCommand) {
+      return c.json({
+        error: 'unsupported_surface',
+        message: `${adapter.displayName} has no Web conversation surface; open it in the terminal instead`,
+      }, 409);
     }
     if (svc.isResumeActive(record.resumeId)) {
       return c.json({ error: 'resume_busy', message: 'this conversation has a running headless turn' }, 409);
     }
-    const adapter = svc.adapters.get('pi');
-    if (!adapter) return c.json({ error: 'unknown_agent' }, 500);
     try {
       await prepareAgentRuntimeWorkspace(adapter, {
         wsId: id,
         cwd: meta.dir,
         launcherRepoRoot: svc.config.launcherRepoRoot,
       });
-      if (svc.pool.get(token)) svc.pool.disposeToken(token, 'switch to WebPi');
-      const snapshot = await svc.startWebPiSession(
+      if (svc.pool.get(token)) svc.pool.disposeToken(token, 'switch to Web');
+      const snapshot = await svc.startWebSession(
         meta,
         record,
-        id === svc.managerWorkspace?.id ? managerWebPiOptions : undefined,
+        id === svc.managerWorkspace?.id ? managerWebOptions : undefined,
       );
       return c.json({ ok: true, snapshot, session: publicSession(record) });
     } catch (err) {
@@ -2524,19 +2536,16 @@ export function createWorkspaceRoutes(
         lastActiveAt: new Date().toISOString(),
       }).catch(() => undefined);
       if (err instanceof AgentCredentialError) return c.json(err.toBody(), 400);
-      launcherLogger.error('webpi.open_failed', { id, token, err });
-      return c.json({ error: 'webpi_open_failed', message: (err as Error).message }, 500);
+      launcherLogger.error('web_session.open_failed', { id, token, err });
+      return c.json({ error: 'web_open_failed', message: (err as Error).message }, 500);
     }
   });
 
-  app.get('/:id/sessions/:sid/webpi', (c) => {
-    const id = c.req.param('id');
-    const token = c.req.param('sid');
-    if (!validId(id) || !validId(token)) return c.json({ error: 'not_found' }, 404);
-    const record = svc.sessionRegistry.get(id, token);
-    if (!record) return c.json({ error: 'not_found' }, 404);
-    const snapshot = svc.webPi.get(token);
-    if (!snapshot) return c.json({ error: 'webpi_not_running' }, 409);
+  app.get('/:id/sessions/:sid/web', (c) => {
+    const ctx = webSessionContext(c);
+    if (!ctx) return c.json({ error: 'not_found' }, 404);
+    const snapshot = svc.web.get(ctx.token);
+    if (!snapshot) return c.json({ error: 'web_not_running' }, 409);
     const knownRevision = Number.parseInt(c.req.query('revision') ?? '', 10);
     if (Number.isSafeInteger(knownRevision) && knownRevision === snapshot.revision) {
       return c.json({ unchanged: true, revision: snapshot.revision });
@@ -2544,36 +2553,51 @@ export function createWorkspaceRoutes(
     return c.json({ snapshot });
   });
 
-  app.post('/:id/sessions/:sid/webpi/prompt', async (c) => {
-    const id = c.req.param('id');
-    const token = c.req.param('sid');
-    if (!validId(id) || !validId(token)) return c.json({ error: 'not_found' }, 404);
-    const record = svc.sessionRegistry.get(id, token);
-    if (!record || record.agent !== 'pi') return c.json({ error: 'not_found' }, 404);
+  app.post('/:id/sessions/:sid/web/prompt', async (c) => {
+    const ctx = webSessionContext(c);
+    if (!ctx) return c.json({ error: 'not_found' }, 404);
     const body = await safeJson(c).catch(() => null);
     const message = body && typeof body === 'object' ? (body as Record<string, unknown>)['message'] : null;
     if (typeof message !== 'string' || !message.trim()) {
       return c.json({ error: 'bad_request', message: 'message is required' }, 400);
     }
     try {
-      const snapshot = await svc.webPi.prompt(token, message);
-      await svc.sessionRegistry.update(id, token, { lastActiveAt: new Date().toISOString() });
+      const snapshot = await svc.web.prompt(ctx.token, message);
+      await svc.sessionRegistry.update(ctx.id, ctx.token, { lastActiveAt: new Date().toISOString() });
       return c.json({ ok: true, snapshot });
     } catch (err) {
-      return c.json({ error: 'webpi_prompt_failed', message: (err as Error).message }, 409);
+      return c.json({ error: 'web_prompt_failed', message: (err as Error).message }, 409);
     }
   });
 
-  app.post('/:id/sessions/:sid/webpi/abort', async (c) => {
-    const id = c.req.param('id');
-    const token = c.req.param('sid');
-    if (!validId(id) || !validId(token)) return c.json({ error: 'not_found' }, 404);
-    const record = svc.sessionRegistry.get(id, token);
-    if (!record || record.agent !== 'pi') return c.json({ error: 'not_found' }, 404);
+  app.post('/:id/sessions/:sid/web/abort', async (c) => {
+    const ctx = webSessionContext(c);
+    if (!ctx) return c.json({ error: 'not_found' }, 404);
     try {
-      return c.json({ ok: true, snapshot: await svc.webPi.abort(token) });
+      return c.json({ ok: true, snapshot: await svc.web.abort(ctx.token) });
+    } catch (err) {
+      return c.json({ error: 'web_abort_failed', message: (err as Error).message }, 409);
+    }
+  });
+
+  // Answer a runtime permission/question request with one of the options the
+  // runtime itself offered. The transport validates the option id.
+  app.post('/:id/sessions/:sid/web/respond', async (c) => {
+    const ctx = webSessionContext(c);
+    if (!ctx) return c.json({ error: 'not_found' }, 404);
+    const body = await safeJson(c).catch(() => null);
+    const fields = body && typeof body === 'object' ? body as Record<string, unknown> : {};
+    const requestId = fields['requestId'];
+    const optionId = fields['optionId'];
+    if (typeof requestId !== 'string' || !requestId || typeof optionId !== 'string') {
+      return c.json({ error: 'bad_request', message: 'requestId and optionId are required' }, 400);
+    }
+    try {
+      const snapshot = await svc.web.respond(ctx.token, requestId, optionId);
+      await svc.sessionRegistry.update(ctx.id, ctx.token, { lastActiveAt: new Date().toISOString() });
+      return c.json({ ok: true, snapshot });
     } catch (err) {
-      return c.json({ error: 'webpi_abort_failed', message: (err as Error).message }, 409);
+      return c.json({ error: 'web_respond_failed', message: (err as Error).message }, 409);
     }
   });
 
@@ -2911,8 +2935,8 @@ export function createWorkspaceRoutes(
     const record = svc.sessionRegistry.get(id, token);
     if (!record) return c.json({ error: 'not_found' }, 404);
     const wasTerminalRunning = svc.pool.disposeToken(token, 'session deleted');
-    const wasWebPiRunning = await svc.webPi?.stop(token, 'session deleted') ?? false;
-    const wasRunning = wasTerminalRunning || wasWebPiRunning;
+    const wasWebRunning = await svc.web?.stop(token, 'session deleted') ?? false;
+    const wasRunning = wasTerminalRunning || wasWebRunning;
     if (record.scrollbackFile) {
       await svc.scrollbackStore.remove(record.scrollbackFile);
     }
@@ -2928,7 +2952,7 @@ export function createWorkspaceRoutes(
         resumeId: record.resumeId,
         agent: record.agent,
         sessionRecordId: record.id,
-        surface: wasWebPiRunning && !wasTerminalRunning ? 'webpi' : 'terminal',
+        surface: wasWebRunning && !wasTerminalRunning ? 'webpi' : 'terminal',
         status: 'interrupted',
       });
     }
diff --git a/src/workspaces/adapters/claude.ts b/src/workspaces/adapters/claude.ts
index 53897f64bc..1177dba8ad 100644
--- a/src/workspaces/adapters/claude.ts
+++ b/src/workspaces/adapters/claude.ts
@@ -1,3 +1,4 @@
+import { randomUUID } from 'node:crypto';
 import { createReadStream } from 'node:fs';
 import { readFile, realpath } from 'node:fs/promises';
 import { homedir } from 'node:os';
@@ -188,6 +189,11 @@ export const claudeAdapter: CliAdapter = {
     resumeById: true,
     transcriptDiscovery: 'fs-watch',
     headless: true,
+    // Bidirectional stream-json keeps one `claude -p` alive across turns and
+    // routes tool permission prompts over stdio (`--permission-prompt-tool
+    // stdio`). `--session-id <uuid>` creates the session on a fresh Session so
+    // the same id resumes in the TUI later.
+    web: { wire: 'claude-stream-json', permissionPrompts: true, freshSession: true },
     aiProvider: {
       credentialSource: 'runtime-or-workspace',
       wirePreference: ['anthropic'],
@@ -284,6 +290,31 @@ export const claudeAdapter: CliAdapter = {
     ];
   },
 
+  // Web surface: bidirectional stream-json. `--input-format stream-json` keeps
+  // the process alive between turns, `--include-partial-messages` streams text
+  // deltas, and `--permission-prompt-tool stdio` turns tool permission prompts
+  // into `control_request` frames the transport can present in the browser
+  // (no `--allowedTools` here: a human is attached). A fresh Session mints its
+  // uuid up front so `--resume <id>` reopens the identical conversation in the
+  // TUI afterwards. MCP still rides the workspace `.mcp.json` via the same
+  // autotrust settings as the TUI.
+  composeWebCommand(base: readonly string[], ctx: SpawnContext): readonly string[] {
+    if (ctx.resume === 'last') throw new Error('the Web surface requires a concrete Claude session id or a fresh Session');
+    return [
+      ...base,
+      '--settings', AUTOTRUST_SETTINGS,
+      ...(ctx.sessionRuntime?.webArgs ?? ctx.sessionRuntime?.interactiveArgs ?? []),
+      ...(ctx.appendSystemPrompt ? ['--append-system-prompt', ctx.appendSystemPrompt] : []),
+      ...(ctx.resume ? ['--resume', ctx.resume.sessionId] : ['--session-id', randomUUID()]),
+      '-p',
+      '--input-format', 'stream-json',
+      '--output-format', 'stream-json',
+      '--verbose',
+      '--include-partial-messages',
+      '--permission-prompt-tool', 'stdio',
+    ];
+  },
+
   extractHeadlessSessionId(line: string): string | null {
     try {
       const evt = JSON.parse(line) as Record<string, unknown>;
diff --git a/src/workspaces/adapters/codex.ts b/src/workspaces/adapters/codex.ts
index dfb773a37e..5c2f953e9b 100644
--- a/src/workspaces/adapters/codex.ts
+++ b/src/workspaces/adapters/codex.ts
@@ -188,6 +188,10 @@ export const codexAdapter: CliAdapter = {
     // resumeHint. Then `codex resume <id>` (composeCommand) resumes by id.
     transcriptDiscovery: 'subprocess',
     headless: true,
+    // `codex app-server` speaks JSON-RPC over stdio; threads are created or
+    // resumed in-band, and command/file-change approvals round-trip to the
+    // browser under `approvalPolicy: onRequest`.
+    web: { wire: 'codex-app-server', permissionPrompts: true, freshSession: true },
     aiProvider: {
       credentialSource: 'runtime-or-workspace',
       wirePreference: ['openai-responses'],
@@ -291,6 +295,26 @@ export const codexAdapter: CliAdapter = {
     ];
   },
 
+  // Web surface: `codex app-server --listen stdio://`. Session identity,
+  // approval policy, and sandbox are selected in-band by the transport
+  // (`thread/start` / `thread/resume` with `approvalPolicy: onRequest` and a
+  // workspace-write sandbox), so no TUI permission flags belong here. The
+  // network override keeps the injected `alice*` CLIs reachable from inside
+  // that sandbox, same as headless. MCP registration mirrors the TUI.
+  composeWebCommand(_base: readonly string[], ctx: SpawnContext): readonly string[] {
+    if (ctx.resume === 'last') throw new Error('the Web surface requires a concrete Codex thread id or a fresh Session');
+    return [
+      'codex',
+      ...(ctx.sessionRuntime?.webArgs ?? ctx.sessionRuntime?.interactiveArgs ?? []),
+      ...codexMcpConfigArgs(ctx),
+      '-c',
+      'sandbox_workspace_write.network_access=true',
+      'app-server',
+      '--listen',
+      'stdio://',
+    ];
+  },
+
   // `codex exec --json` line 1 is `{"type":"thread.started","thread_id":…}`;
   // the thread_id EQUALS the rollout's `session_meta.id` (verified 0.137.0,
   // 2026-06-11 — same uuid in ~/.codex/sessions/…/rollout-*.jsonl), so it
@@ -667,18 +691,18 @@ function codexMcpHead(ctx: SpawnContext): string[] {
         `model_provider=${tomlString(CODEX_PROVIDER_NAME)}`,
       ]
     : [];
+  return ['codex', ...selection, ...CODEX_INTERACTIVE_PERMISSION_ARGS, ...codexMcpConfigArgs(ctx)];
+}
+
+/** `-c mcp_servers.*` overrides that register the launcher's MCP gateway. */
+function codexMcpConfigArgs(ctx: SpawnContext): string[] {
   const mcpUrl = ctx.env['OPENALICE_MCP_URL'];
-  if (!mcpUrl) {
-    return ['codex', ...selection, ...CODEX_INTERACTIVE_PERMISSION_ARGS];
-  }
+  if (!mcpUrl) return [];
   const workspaceId = ctx.env['AQ_WS_ID'];
   if (!workspaceId) {
     throw new Error('codex adapter: AQ_WS_ID missing from spawn env');
   }
   return [
-    'codex',
-    ...selection,
-    ...CODEX_INTERACTIVE_PERMISSION_ARGS,
     '-c',
     `mcp_servers.openalice.url="${mcpUrl}"`,
     '-c',
diff --git a/src/workspaces/adapters/cursor.ts b/src/workspaces/adapters/cursor.ts
index ac6be86927..9f026b98aa 100644
--- a/src/workspaces/adapters/cursor.ts
+++ b/src/workspaces/adapters/cursor.ts
@@ -199,6 +199,10 @@ export const cursorAdapter: CliAdapter = {
     resumeById: true,
     transcriptDiscovery: 'subprocess',
     headless: true,
+    // `cursor-agent acp` is a native Agent Client Protocol agent: sessions are
+    // created/loaded in-band and tool permissions arrive as
+    // `session/request_permission`.
+    web: { wire: 'acp', permissionPrompts: true, freshSession: true },
     aiProvider: {
       credentialSource: 'runtime-or-workspace',
       // Cursor Dashboard credentials stay in the shared provider vault, but
@@ -234,6 +238,20 @@ export const cursorAdapter: CliAdapter = {
     return [...cmd, ...cursorResumeArgs(ctx.resume)];
   },
 
+  // Web surface: `cursor-agent [global flags] acp`. Global options (model,
+  // trust) precede the subcommand, as in Cursor's own ACP documentation
+  // (`agent --api-key … acp`). Resume/new is negotiated in ACP
+  // (`session/load` / `session/new`), so no resume flag belongs here.
+  composeWebCommand(_base: readonly string[], ctx: SpawnContext): readonly string[] {
+    if (ctx.resume === 'last') throw new Error('the Web surface requires a concrete Cursor session id or a fresh Session');
+    return [
+      'cursor-agent',
+      ...(ctx.sessionRuntime?.webArgs ?? ctx.sessionRuntime?.interactiveArgs ?? []),
+      ...(ctx.approveProject ? ['--trust'] : []),
+      'acp',
+    ];
+  },
+
   composeHeadlessCommand(
     _base: readonly string[],
     ctx: SpawnContext,
diff --git a/src/workspaces/adapters/grok.ts b/src/workspaces/adapters/grok.ts
index 1799b70eaf..f5b07f2bfa 100644
--- a/src/workspaces/adapters/grok.ts
+++ b/src/workspaces/adapters/grok.ts
@@ -304,6 +304,10 @@ export const grokAdapter: CliAdapter = {
     resumeById: true,
     transcriptDiscovery: 'subprocess',
     headless: true,
+    // `grok agent stdio` serves the Agent Client Protocol natively; Grok's
+    // on-disk `updates.jsonl` is already ACP-wrapped, so this is the same
+    // conversation the TUI resumes.
+    web: { wire: 'acp', permissionPrompts: true, freshSession: true },
     aiProvider: {
       credentialSource: 'runtime-or-workspace',
       wirePreference: ['openai-chat', 'openai-responses'],
@@ -349,6 +353,20 @@ export const grokAdapter: CliAdapter = {
     return [...cmd, ...grokResumeArgs(ctx.resume)];
   },
 
+  // Web surface: `grok --no-leader [model/effort] [--rules …] agent stdio`.
+  // Session identity is negotiated over ACP, so no `--resume`/`--continue`.
+  composeWebCommand(_base: readonly string[], ctx: SpawnContext): readonly string[] {
+    if (ctx.resume === 'last') throw new Error('the Web surface requires a concrete Grok session id or a fresh Session');
+    return [
+      'grok',
+      '--no-leader',
+      ...(ctx.sessionRuntime?.webArgs ?? ctx.sessionRuntime?.interactiveArgs ?? []),
+      ...grokRulesArgs(ctx),
+      'agent',
+      'stdio',
+    ];
+  },
+
   composeHeadlessCommand(
     _base: readonly string[],
     ctx: SpawnContext,
diff --git a/src/workspaces/adapters/omp.ts b/src/workspaces/adapters/omp.ts
index 17708084cb..f997b42335 100644
--- a/src/workspaces/adapters/omp.ts
+++ b/src/workspaces/adapters/omp.ts
@@ -225,6 +225,11 @@ export const ompAdapter: CliAdapter = {
     resumeById: true,
     transcriptDiscovery: 'subprocess',
     headless: true,
+    // omp keeps Pi's `--mode rpc` protocol (plus a `ready` frame). Like Pi it
+    // has no per-tool prompt in RPC mode, so the surface launches with
+    // `--auto-approve`; a fresh Session lets omp mint its snowflake id and the
+    // transport reads it back from `get_state`.
+    web: { wire: 'pi-rpc', permissionPrompts: false, freshSession: true },
     aiProvider: {
       credentialSource: 'runtime-or-workspace',
       wirePreference: ['google-generative-ai', 'openai-chat', 'anthropic', 'openai-responses'],
@@ -288,6 +293,23 @@ export const ompAdapter: CliAdapter = {
     ];
   },
 
+  // Web surface: omp's `--mode rpc` is Pi's RPC protocol. `--resume <id>`
+  // reopens the recorded conversation; a fresh Session omits it and omp mints
+  // the id. `--continue` is never used here because the surface must reopen
+  // exactly the Session the registry owns.
+  composeWebCommand(_base: readonly string[], ctx: SpawnContext): readonly string[] {
+    if (ctx.resume === 'last') throw new Error('the Web surface requires a concrete omp session id or a fresh Session');
+    return [
+      'omp',
+      ...(ctx.sessionRuntime?.webArgs ?? ctx.sessionRuntime?.interactiveArgs ?? []),
+      ...ompRoleArgs(ctx),
+      '--mode',
+      'rpc',
+      '--auto-approve',
+      ...ompResumeArgs(ctx.resume),
+    ];
+  },
+
   extractHeadlessSessionId(line: string): string | null {
     const evt = parseJsonRecord(line);
     if (!evt || evt['type'] !== 'session') return null;
diff --git a/src/workspaces/adapters/opencode.ts b/src/workspaces/adapters/opencode.ts
index cd933877e2..4d37ca0501 100644
--- a/src/workspaces/adapters/opencode.ts
+++ b/src/workspaces/adapters/opencode.ts
@@ -296,6 +296,9 @@ export const opencodeAdapter: CliAdapter = {
     // `opencode --session <id>` (composeCommand) resumes by id.
     transcriptDiscovery: 'subprocess',
     headless: true,
+    // `opencode acp` serves the Agent Client Protocol from the same SQLite
+    // session store the TUI uses, so `session/load` reopens `ses_…` ids.
+    web: { wire: 'acp', permissionPrompts: true, freshSession: true },
     aiProvider: {
       credentialSource: 'runtime-or-workspace',
       wirePreference: ['google-generative-ai', 'openai-chat', 'anthropic', 'openai-responses'],
@@ -366,6 +369,17 @@ export const opencodeAdapter: CliAdapter = {
     return [...head, '--session', ctx.resume.sessionId];
   },
 
+  // Web surface: `opencode [--model …] acp`. Model selection stays on the
+  // top-level flag/env projection; session identity is negotiated over ACP.
+  composeWebCommand(_base: readonly string[], ctx: SpawnContext): readonly string[] {
+    if (ctx.resume === 'last') throw new Error('the Web surface requires a concrete opencode session id or a fresh Session');
+    return [
+      'opencode',
+      ...(ctx.sessionRuntime?.webArgs ?? ctx.sessionRuntime?.interactiveArgs ?? []),
+      'acp',
+    ];
+  },
+
   // Headless: `opencode run <prompt>` is non-interactive and exits at the turn
   // boundary. Tool access is via the injected CLI shims and bundled skills;
   // prompt is the trailing positional after a `--` end-of-options terminator
diff --git a/src/workspaces/adapters/pi.ts b/src/workspaces/adapters/pi.ts
index 5a8fa5361d..d86baad287 100644
--- a/src/workspaces/adapters/pi.ts
+++ b/src/workspaces/adapters/pi.ts
@@ -231,6 +231,10 @@ export const piAdapter: CliAdapter = {
     // immune to pi's lazy transcript write.
     assignsSessionId: true,
     headless: true,
+    // Pi's RPC mode has no per-tool permission prompt; the Web surface launches
+    // it approved like headless does. The launcher mints the id at spawn, so
+    // a fresh Session always arrives here with a concrete `--session-id`.
+    web: { wire: 'pi-rpc', permissionPrompts: false, freshSession: true },
     aiProvider: {
       credentialSource: 'runtime-or-workspace',
       wirePreference: ['google-generative-ai', 'openai-chat', 'anthropic', 'openai-responses'],
@@ -327,14 +331,14 @@ export const piAdapter: CliAdapter = {
       : null;
   },
 
-  // WebPi is a second VIEW over the same Pi session, not another runtime.
-  // RPC stays completely separate from the TUI argv above: selecting WebPi
-  // cannot change ordinary Pi startup, trust prompts, input handling, or PTY
-  // behavior. It is always by-id so switching surfaces reopens the exact
+  // The Web surface is a second VIEW over the same Pi session, not another
+  // runtime. RPC stays completely separate from the TUI argv above: selecting
+  // it cannot change ordinary Pi startup, trust prompts, input handling, or
+  // PTY behavior. It is always by-id so switching surfaces reopens the exact
   // conversation that the OpenAlice resume registry already owns.
   composeWebCommand(_base: readonly string[], ctx: SpawnContext): readonly string[] {
     if (!ctx.resume || ctx.resume === 'last') {
-      throw new Error('WebPi requires a concrete Pi session id');
+      throw new Error('the Pi Web surface requires a concrete Pi session id');
     }
     return [
       ...piCommandHead(ctx.env),
diff --git a/src/workspaces/adapters/web-command.spec.ts b/src/workspaces/adapters/web-command.spec.ts
new file mode 100644
index 0000000000..94ee44e97b
--- /dev/null
+++ b/src/workspaces/adapters/web-command.spec.ts
@@ -0,0 +1,71 @@
+import { describe, expect, it } from 'vitest'
+
+import type { CliAdapter, SpawnContext } from '../cli-adapter.js'
+import { agyAdapter } from './agy.js'
+import { claudeAdapter } from './claude.js'
+import { codexAdapter } from './codex.js'
+import { cursorAdapter } from './cursor.js'
+import { grokAdapter } from './grok.js'
+import { ompAdapter } from './omp.js'
+import { opencodeAdapter } from './opencode.js'
+import { piAdapter } from './pi.js'
+
+const ctx = (overrides: Partial<SpawnContext> = {}): SpawnContext => ({
+  cwd: '/w',
+  env: { AQ_WS_ID: 'ws-1' },
+  resume: undefined,
+  ...overrides,
+})
+
+const webAdapters: readonly CliAdapter[] = [piAdapter, ompAdapter, claudeAdapter, codexAdapter, cursorAdapter, grokAdapter, opencodeAdapter]
+
+describe('Web surface command composition', () => {
+  it('declares a wire for every adapter that composes a Web command, and vice versa', () => {
+    for (const adapter of webAdapters) {
+      expect(adapter.capabilities.web, adapter.id).toBeDefined()
+      expect(typeof adapter.composeWebCommand, adapter.id).toBe('function')
+    }
+    expect(agyAdapter.capabilities.web).toBeUndefined()
+    expect(agyAdapter.composeWebCommand).toBeUndefined()
+  })
+
+  it('never resumes "last": the surface must reopen the exact recorded Session', () => {
+    for (const adapter of webAdapters) {
+      expect(() => adapter.composeWebCommand!(['x'], ctx({ resume: 'last' })), adapter.id).toThrow()
+    }
+  })
+
+  it('composes omp RPC with auto-approve and by-id resume', () => {
+    expect(ompAdapter.composeWebCommand!([], ctx({ resume: { sessionId: 'omp-1' } })))
+      .toEqual(['omp', '--mode', 'rpc', '--auto-approve', '--resume', 'omp-1'])
+    expect(ompAdapter.composeWebCommand!([], ctx())).toEqual(['omp', '--mode', 'rpc', '--auto-approve'])
+  })
+
+  it('composes Claude bidirectional stream-json with stdio permission prompts', () => {
+    const resumed = claudeAdapter.composeWebCommand!(['claude'], ctx({ resume: { sessionId: 'c-1' } }))
+    expect(resumed).toEqual([
+      'claude', '--settings', '{"enableAllProjectMcpServers":true}', '--resume', 'c-1',
+      '-p', '--input-format', 'stream-json', '--output-format', 'stream-json', '--verbose',
+      '--include-partial-messages', '--permission-prompt-tool', 'stdio',
+    ])
+    const fresh = claudeAdapter.composeWebCommand!(['claude'], ctx())
+    expect(fresh).toContain('--session-id')
+    expect(fresh[fresh.indexOf('--session-id') + 1]).toMatch(/^[0-9a-f-]{36}$/)
+    expect(fresh).not.toContain('--allowedTools')
+  })
+
+  it('composes Codex app-server over stdio with MCP registration but no TUI permission flags', () => {
+    const argv = codexAdapter.composeWebCommand!([], ctx({ env: { AQ_WS_ID: 'ws-1', OPENALICE_MCP_URL: 'http://127.0.0.1:1/mcp' } }))
+    expect(argv.slice(-3)).toEqual(['app-server', '--listen', 'stdio://'])
+    expect(argv).toContain('mcp_servers.openalice.url="http://127.0.0.1:1/mcp"')
+    expect(argv).toContain('sandbox_workspace_write.network_access=true')
+    expect(argv).not.toContain('--ask-for-approval')
+    expect(argv).not.toContain('--sandbox')
+  })
+
+  it('composes the three native ACP agents', () => {
+    expect(cursorAdapter.composeWebCommand!([], ctx({ approveProject: true }))).toEqual(['cursor-agent', '--trust', 'acp'])
+    expect(grokAdapter.composeWebCommand!([], ctx())).toEqual(['grok', '--no-leader', 'agent', 'stdio'])
+    expect(opencodeAdapter.composeWebCommand!([], ctx())).toEqual(['opencode', 'acp'])
+  })
+})
diff --git a/src/workspaces/cli-adapter.ts b/src/workspaces/cli-adapter.ts
index 3f315342d0..fa89d6be2c 100644
--- a/src/workspaces/cli-adapter.ts
+++ b/src/workspaces/cli-adapter.ts
@@ -85,6 +85,21 @@ export interface AgentProviderVendorPolicy {
   readonly legacyRequestedWireFallbacks?: Readonly<Partial<Record<WireShape, WireShape>>>;
 }
 
+/** Alice-side transport that projects a runtime's live protocol onto the Web surface. */
+export type WebSessionWire = 'pi-rpc' | 'acp' | 'claude-stream-json' | 'codex-app-server';
+
+export interface WebSurfaceCapability {
+  readonly wire: WebSessionWire;
+  /**
+   * The runtime asks before running tools and the transport routes those
+   * prompts to the browser. Runtimes without a per-tool prompt in their
+   * structured mode launch with their own approve-all flag instead.
+   */
+  readonly permissionPrompts: boolean;
+  /** A Session with no native id yet may still open in the Web surface. */
+  readonly freshSession: boolean;
+}
+
 export interface AgentProviderCapabilities {
   /**
    * Whether the runtime can start from its own native/global login, or needs a
@@ -298,6 +313,14 @@ export interface CliAdapter {
      * set this; `shell` does not (no agent-turn concept).
      */
     readonly headless?: boolean;
+    /**
+     * The adapter can serve the browser Web conversation surface through a
+     * long-lived structured process (`composeWebCommand`). `wire` selects the
+     * Alice transport that speaks the runtime's protocol; the UI reads this to
+     * decide whether a Session may open in the Web surface. Omit for runtimes
+     * whose only interactive mode is the TUI.
+     */
+    readonly web?: WebSurfaceCapability;
     /**
      * Native AI-provider projection contract. Shared credential/model logic
      * consumes this declaration instead of branching on adapter ids. Omit for
@@ -338,10 +361,11 @@ export interface CliAdapter {
   /**
    * Optional long-lived structured interactive surface. Unlike headless mode,
    * this process remains alive and accepts multiple prompts over stdin/stdout.
-   * WebPi is the first consumer: it opens the SAME native Pi session through
-   * Pi's documented RPC mode while the ordinary terminal keeps using
-   * `composeCommand`. Keeping this opt-in prevents any other runtime's launch
-   * path from changing merely because WebPi exists.
+   * It opens the SAME native session the ordinary terminal would resume, so
+   * switching surfaces never forks a conversation. `ctx.resume` is `undefined`
+   * when the Session has no native id yet; runtimes that create sessions
+   * in-band (ACP `session/new`, Codex `thread/start`) accept that, runtimes
+   * that need an id at launch must throw. Present iff `capabilities.web`.
    */
   composeWebCommand?(base: readonly string[], ctx: SpawnContext): readonly string[];
 
diff --git a/src/workspaces/public-session.spec.ts b/src/workspaces/public-session.spec.ts
index 2d3d8036fc..7b62e42bfc 100644
--- a/src/workspaces/public-session.spec.ts
+++ b/src/workspaces/public-session.spec.ts
@@ -46,9 +46,9 @@ describe('projectPublicSession', () => {
     expect(projected).not.toHaveProperty('runtime');
   });
 
-  it('derives live state and WebPi surface from the same process snapshot', () => {
+  it('derives live state and Web surface from the same process snapshot', () => {
     expect(projectPublicSession(record, {
-      webPi: { pid: 42, startedAt: 1_723_337_000_000 },
+      web: { pid: 42, startedAt: 1_723_337_000_000 },
     })).toMatchObject({
       state: 'running',
       surface: 'webpi',
diff --git a/src/workspaces/public-session.ts b/src/workspaces/public-session.ts
index c1f55a2205..b188322571 100644
--- a/src/workspaces/public-session.ts
+++ b/src/workspaces/public-session.ts
@@ -12,7 +12,7 @@ export interface PublicSessionRuntime {
   readonly reasoningEffort?: ModelReasoningEffort;
 }
 
-/** A running terminal or WebPi record owns the interactive execution slot.
+/** A running terminal or Web-surface record owns the interactive execution slot.
  * Headless records use the separate launcher lease so stale persisted state
  * cannot make an Issue owner look busy after its process has exited. */
 export function isInteractiveSessionActive(
@@ -63,8 +63,8 @@ interface LiveSessionProjection {
 
 export interface PublicSessionProjectionContext {
   readonly terminal?: LiveSessionProjection | null;
-  readonly webPi?: LiveSessionProjection | null;
-  /** A one-shot execution currently owns the Session without a PTY/WebPi pid. */
+  readonly web?: LiveSessionProjection | null;
+  /** A one-shot execution currently owns the Session without a PTY/Web-surface pid. */
   readonly headless?: boolean;
   readonly runtimeBinding?: SessionRuntimeBinding | null;
   readonly displayName?: string;
@@ -85,7 +85,7 @@ export function projectPublicSession(
   context: PublicSessionProjectionContext = {},
 ): PublicSession {
   const terminal = context.terminal ?? null;
-  const webPi = context.webPi ?? null;
+  const web = context.web ?? null;
   const headless = context.headless === true;
   const binding = context.runtimeBinding ?? null;
 
@@ -96,11 +96,11 @@ export function projectPublicSession(
     name: record.name,
     createdAt: record.createdAt,
     lastActiveAt: record.lastActiveAt,
-    state: record.state === 'running' && (terminal || webPi || headless) ? 'running' : 'paused',
-    surface: webPi ? 'webpi' : terminal ? 'terminal' : (record.surface ?? 'terminal'),
+    state: record.state === 'running' && (terminal || web || headless) ? 'running' : 'paused',
+    surface: web ? 'webpi' : terminal ? 'terminal' : (record.surface ?? 'terminal'),
     resumeId: record.resumeId,
-    pid: terminal?.pid ?? webPi?.pid ?? null,
-    startedAt: terminal?.startedAt ?? webPi?.startedAt ?? null,
+    pid: terminal?.pid ?? web?.pid ?? null,
+    startedAt: terminal?.startedAt ?? web?.startedAt ?? null,
     title: projectSessionPresentationTitle({
       record,
       ...(context.createdBy ? { createdBy: context.createdBy } : {}),
diff --git a/src/workspaces/service.ts b/src/workspaces/service.ts
index c69193b3ae..9be9c35a1f 100644
--- a/src/workspaces/service.ts
+++ b/src/workspaces/service.ts
@@ -380,7 +380,7 @@ import {
   WorkspaceHeadlessActivityTracker,
   type WorkspaceRuntimeActivity,
 } from './workspace-runtime-activity.js';
-import { WebPiSessionHost, type WebPiSnapshot } from './webpi-session-host.js';
+import { WebSessionHost, type WebSessionSnapshot } from './web-session-host.js';
 import { WorkspaceRegistry, type WorkspaceMeta } from './workspace-registry.js';
 import { readHarnessSource } from './harness-source.js';
 import { HarnessSourceUpgradeManager } from './harness-source-upgrade.js';
@@ -430,7 +430,8 @@ export interface WorkspaceService {
   readonly adapters: AdapterRegistry;
   readonly creator: WorkspaceCreator;
   readonly pool: SessionPool;
-  readonly webPi: WebPiSessionHost;
+  /** Long-lived structured Agent processes presented in the browser (Web surface). */
+  readonly web: WebSessionHost;
   /** Launcher-owned control plane. Not part of the business Workspace registry. */
   readonly managerWorkspace: WorkspaceMeta;
   /** Resolve a runtime target, including the special manager control plane. */
@@ -453,8 +454,8 @@ export interface WorkspaceService {
   /** Resolve the Workspace default, installation fallback, then first registered runtime. */
   resolveDefaultAgentId(meta: WorkspaceMeta): Promise<string | undefined>;
   resolveAdapter(meta: WorkspaceMeta, agentId?: string): CliAdapter;
-  /** Open the same persisted Pi Session through Pi RPC instead of its PTY. */
-  startWebPiSession(
+  /** Open the same persisted Session through its runtime's structured protocol instead of a PTY. */
+  startWebSession(
     meta: WorkspaceMeta,
     record: SessionRecord,
     opts?: {
@@ -462,7 +463,7 @@ export interface WorkspaceService {
       skills?: readonly string[];
       approveProject?: boolean;
     },
-  ): Promise<WebPiSnapshot>;
+  ): Promise<WebSessionSnapshot>;
   /** Best-effort background reconciliation of native runtime Session titles. */
   refreshSessionTitles?(meta: WorkspaceMeta): Promise<void>;
   publicMeta(w: WorkspaceMeta): Promise<unknown>;
@@ -2851,20 +2852,20 @@ export async function createWorkspaceService(opts: CreateWorkspaceServiceOptions
     transcriptWatcher,
   );
 
-  const webPi = new WebPiSessionHost(
-    launcherLogger.child({ scope: 'webpi-host' }),
+  const web = new WebSessionHost(
+    launcherLogger.child({ scope: 'web-session-host' }),
     {
       onExit: (recordId, reason) => {
         // Intentional handoffs are followed by an explicit caller-owned state
         // update (paused, terminal-running, or deleted). Letting this async
-        // callback also write `paused` would race a WebPi -> TUI switch.
+        // callback also write `paused` would race a Web -> TUI switch.
         if (reason.intentional) return;
         const record = sessionRegistry.findById(recordId);
         if (!record) return;
         void sessionRegistry.update(record.wsId, record.id, {
           state: 'paused',
           lastActiveAt: new Date().toISOString(),
-        }).catch((err) => launcherLogger.warn('webpi.pause_update_failed', { recordId, err }));
+        }).catch((err) => launcherLogger.warn('web_session.pause_update_failed', { recordId, err }));
         void agentRuntimeLog.record('runtime.stopped', {
           workspaceId: record.wsId,
           resumeId: record.resumeId,
@@ -2874,10 +2875,25 @@ export async function createWorkspaceService(opts: CreateWorkspaceServiceOptions
           status: 'paused',
         });
       },
+      onNativeSessionId: (recordId, nativeSessionId) => {
+        // Runtimes that create sessions in-band (ACP, Codex, fresh omp/Claude)
+        // announce their id after spawn; bind it exactly like PTY discovery so
+        // the TUI can resume the same conversation later.
+        const record = sessionRegistry.findById(recordId);
+        if (!record) return;
+        void resumeRegistry.bindAgentSessionId(record.resumeId, nativeSessionId).catch((err) =>
+          launcherLogger.warn('web_session.native_id_bind_failed', { recordId, resumeId: record.resumeId, err }),
+        );
+        if (record.resumeHint?.value !== nativeSessionId) {
+          void sessionRegistry.update(record.wsId, record.id, {
+            resumeHint: { kind: 'agent-session-id', value: nativeSessionId },
+          }).catch((err) => launcherLogger.warn('web_session.resume_hint_update_failed', { recordId, err }));
+        }
+      },
     },
   );
 
-  const startWebPiSession = async (
+  const startWebSession = async (
     meta: WorkspaceMeta,
     record: SessionRecord,
     opts: {
@@ -2885,17 +2901,22 @@ export async function createWorkspaceService(opts: CreateWorkspaceServiceOptions
       skills?: readonly string[];
       approveProject?: boolean;
     } = {},
-  ): Promise<WebPiSnapshot> => {
-    const operationLease = workspaceOperationGuard.acquire(meta.id, 'webpi-start');
+  ): Promise<WebSessionSnapshot> => {
+    const operationLease = workspaceOperationGuard.acquire(meta.id, 'web-session-start');
     if (!operationLease) throw new Error(`workspace is busy with ${workspaceOperationGuard.current(meta.id)}`);
     try {
-    if (record.agent !== 'pi') throw new Error('WebPi is available only for Pi Sessions');
-    const adapter = adapters.get('pi');
-    if (!adapter?.composeWebCommand) throw new Error('installed Pi adapter has no WebPi surface');
+    const adapter = adapters.get(record.agent);
+    if (!adapter) throw new Error(`unknown agent runtime: ${record.agent}`);
+    const webCapability = adapter.capabilities.web;
+    if (!webCapability || !adapter.composeWebCommand) {
+      throw new Error(`${adapter.displayName} has no Web conversation surface; open it in the terminal instead`);
+    }
     const nativeSessionId = resumeRegistry.get(record.resumeId)?.agentSessionId
       ?? record.resumeHint?.value;
-    if (!nativeSessionId) throw new Error('Pi Session has no resumable native session id');
-    const resume = { sessionId: nativeSessionId } as const;
+    if (!nativeSessionId && !webCapability.freshSession) {
+      throw new Error(`${adapter.displayName} Session has no resumable native session id`);
+    }
+    const resume = nativeSessionId ? { sessionId: nativeSessionId } as const : undefined;
     const identity = resumeRegistry.get(record.resumeId);
     const sessionRuntime = identity?.runtimeBinding
       ? await resolveSessionRuntimeBinding({
@@ -2927,21 +2948,28 @@ export async function createWorkspaceService(opts: CreateWorkspaceServiceOptions
       ...(opts.approveProject ? { approveProject: true } : {}),
     });
     launcherLogger.event('path.trace', {
-      where: 'webpi.spawn',
+      where: 'web_session.spawn',
       wsId: meta.id,
       recordId: record.id,
       resumeId: record.resumeId,
-      nativeSessionId,
+      agent: record.agent,
+      wire: webCapability.wire,
+      nativeSessionId: nativeSessionId ?? null,
       spawnCwd: cwd,
       composedCommand: command,
     });
-    const snapshot = await webPi.start({
+    const snapshot = await web.start({
       recordId: record.id,
       wsId: record.wsId,
       resumeId: record.resumeId,
+      agent: record.agent,
+      wire: webCapability.wire,
       command,
       cwd,
       env,
+      ...(nativeSessionId ? { nativeSessionId } : {}),
+      ...(sessionRuntime.binding.model ? { model: sessionRuntime.binding.model } : {}),
+      ...(sessionRuntime.binding.reasoningEffort ? { reasoningEffort: sessionRuntime.binding.reasoningEffort } : {}),
     });
     await sessionRegistry.update(record.wsId, record.id, {
       state: 'running',
@@ -2965,7 +2993,7 @@ export async function createWorkspaceService(opts: CreateWorkspaceServiceOptions
   const workspaceRuntimeActivityMethod = (workspaceId: string): WorkspaceRuntimeActivity => {
     const sessions = sessionRegistry.listFor(workspaceId).flatMap((record) => {
       const terminal = pool.get(record.id);
-      const browser = webPi.get(record.id);
+      const browser = web.get(record.id);
       if (!terminal && !browser) return [];
       return [{
         sessionId: record.id,
@@ -2992,7 +3020,7 @@ export async function createWorkspaceService(opts: CreateWorkspaceServiceOptions
     scrollbackStore,
     headlessTasks,
     pool,
-    webPi,
+    web,
     isWorkspaceHeadlessActive: (id) => headlessActivity.has(id),
     operationGuard: workspaceOperationGuard,
     cleanupWorkspaceState: async (_record, cwd) => {
@@ -3059,7 +3087,7 @@ export async function createWorkspaceService(opts: CreateWorkspaceServiceOptions
       if (!identity || identity.lifecycle === 'retired' || sessionPresence(identity) === 'deleted') return [];
       return [projectPublicSession(record, {
         terminal: pool.get(record.id),
-        webPi: webPi.get(record.id),
+        web: web.get(record.id),
         headless: activeResumeIds.has(record.resumeId),
         runtimeBinding: identity.runtimeBinding,
         displayName: identity.displayName,
@@ -3148,7 +3176,7 @@ export async function createWorkspaceService(opts: CreateWorkspaceServiceOptions
     stopInboxActivity?.();
     await harnessSurfaces.dispose();
     pool.disposeAll('plugin shutdown');
-    await webPi.stopAll('plugin shutdown');
+    await web.stopAll('plugin shutdown');
     transcriptWatcher.disposeAll();
   };
 
@@ -3246,7 +3274,7 @@ export async function createWorkspaceService(opts: CreateWorkspaceServiceOptions
     adapters,
     creator,
     pool,
-    webPi,
+    web,
     managerWorkspace,
     resolveRuntimeWorkspace,
     transcriptWatcher,
@@ -3256,7 +3284,7 @@ export async function createWorkspaceService(opts: CreateWorkspaceServiceOptions
     resolveOrCreateAutoPredictionWorkspace: resolveOrCreateAutoPredictionWorkspaceMethod,
     resolveDefaultAgentId,
     resolveAdapter,
-    startWebPiSession,
+    startWebSession,
     refreshSessionTitles,
     publicMeta,
     detectAgents,
diff --git a/src/workspaces/web-session-host.spec.ts b/src/workspaces/web-session-host.spec.ts
new file mode 100644
index 0000000000..0ad6971905
--- /dev/null
+++ b/src/workspaces/web-session-host.spec.ts
@@ -0,0 +1,486 @@
+import { EventEmitter } from 'node:events'
+import { PassThrough } from 'node:stream'
+
+import { describe, expect, it, vi } from 'vitest'
+
+import type { Logger } from './logger.js'
+import { WebSessionHost, type StartWebSessionInput, type WebSessionSnapshot } from './web-session-host.js'
+
+type Json = Record<string, unknown>
+
+/** Minimal stdio child: parses JSONL commands from stdin, answers on stdout. */
+class FakeProcess extends EventEmitter {
+  readonly pid = 4242
+  readonly stdin = new PassThrough()
+  readonly stdout = new PassThrough()
+  readonly stderr = new PassThrough()
+  readonly received: Json[] = []
+
+  constructor(private readonly onCommand: (command: Json, self: FakeProcess) => void) {
+    super()
+    this.stdin.setEncoding('utf8')
+    let buffer = ''
+    this.stdin.on('data', (chunk: string) => {
+      buffer += chunk
+      let nl = buffer.indexOf('\n')
+      while (nl >= 0) {
+        const line = buffer.slice(0, nl)
+        buffer = buffer.slice(nl + 1)
+        if (line) {
+          const parsed = JSON.parse(line) as Json
+          this.received.push(parsed)
+          this.onCommand(parsed, this)
+        }
+        nl = buffer.indexOf('\n')
+      }
+    })
+    queueMicrotask(() => this.emit('spawn'))
+  }
+
+  kill(signal: NodeJS.Signals = 'SIGTERM'): boolean {
+    queueMicrotask(() => this.emit('exit', 0, signal))
+    return true
+  }
+
+  line(value: unknown): void {
+    this.stdout.write(`${JSON.stringify(value)}\n`)
+  }
+}
+
+const logger = {
+  child: () => logger,
+  info: vi.fn(),
+  warn: vi.fn(),
+  error: vi.fn(),
+  event: vi.fn(),
+} as unknown as Logger
+
+const settle = (ms = 60) => new Promise((resolve) => setTimeout(resolve, ms))
+
+function input(overrides: Partial<StartWebSessionInput>): StartWebSessionInput {
+  return {
+    recordId: 'record-1',
+    wsId: 'chat-ws',
+    resumeId: 'resume-1',
+    agent: 'pi',
+    wire: 'pi-rpc',
+    command: ['pi', '--mode', 'rpc'],
+    cwd: '/tmp/workspace',
+    env: {},
+    ...overrides,
+  }
+}
+
+function texts(snapshot: WebSessionSnapshot | null): string[] {
+  return (snapshot?.messages ?? []).map((message) => {
+    if (message.role === 'user' || message.role === 'assistant') {
+      return typeof message.content === 'string'
+        ? `${message.role}:${message.content}`
+        : `${message.role}:${message.content.map((part) => (part.type === 'text' ? part.text : part.type === 'toolCall' ? `[${part.name}]` : part.type)).join('|')}`
+    }
+    if (message.role === 'toolResult') return `toolResult:${message.toolName}:${message.isError ? 'error' : 'ok'}`
+    if (message.role === 'notice') return `notice:${message.text}`
+    return 'unknown'
+  })
+}
+
+// ── pi-rpc ─────────────────────────────────────────────────────────────────
+
+function piRpcProcess(state: Json = {}): FakeProcess {
+  let messages: unknown[] = []
+  const rpcState = { sessionId: 'native-pi', isStreaming: false, isCompacting: false, ...state }
+  return new FakeProcess((command, self) => {
+    const id = command['id']
+    const type = command['type']
+    if (type === 'get_state') self.line({ type: 'response', id, command: type, success: true, data: { ...rpcState, messageCount: messages.length } })
+    if (type === 'get_messages') self.line({ type: 'response', id, command: type, success: true, data: { messages } })
+    if (type === 'prompt') {
+      const user = { role: 'user', content: command['message'] }
+      const assistant = { role: 'assistant', content: [{ type: 'text', text: 'hello' }] }
+      messages = [...messages, user, assistant]
+      self.line({ type: 'response', id, command: type, success: true })
+      self.line({ type: 'agent_start' })
+      self.line({ type: 'message_update', message: { role: 'assistant', content: [{ type: 'text', text: 'hel' }] } })
+      self.line({ type: 'message_end', message: assistant })
+      self.line({ type: 'agent_settled' })
+    }
+    if (type === 'abort') self.line({ type: 'response', id, command: type, success: true })
+  })
+}
+
+describe('WebSessionHost with the pi-rpc transport', () => {
+  it('projects Pi messages into the neutral model without accumulating update frames', async () => {
+    const host = new WebSessionHost(logger, {}, () => piRpcProcess() as never)
+    const started = await host.start(input({ nativeSessionId: 'native-pi' }))
+    expect(started.phase).toBe('idle')
+    expect(started.wire).toBe('pi-rpc')
+    expect(started.messages).toEqual([])
+
+    await host.prompt('record-1', 'hi')
+    await settle(80)
+    const snapshot = host.get('record-1')
+    expect(snapshot?.phase).toBe('idle')
+    expect(snapshot?.messages).toEqual([
+      { role: 'user', content: 'hi' },
+      { role: 'assistant', content: [{ type: 'text', text: 'hello' }] },
+    ])
+    expect(snapshot?.streamingMessage).toBeNull()
+  })
+
+  it('binds the runtime-minted session id for a fresh omp session', async () => {
+    const onNativeSessionId = vi.fn()
+    const host = new WebSessionHost(logger, { onNativeSessionId }, () => piRpcProcess({ sessionId: 'omp-777' }) as never)
+    const started = await host.start(input({ agent: 'omp', command: ['omp', '--mode', 'rpc'] }))
+    expect(started.nativeSessionId).toBe('omp-777')
+    expect(onNativeSessionId).toHaveBeenCalledWith('record-1', 'omp-777')
+  })
+
+  it('deduplicates repeated opens and stops intentionally', async () => {
+    let spawns = 0
+    const onExit = vi.fn()
+    const host = new WebSessionHost(logger, { onExit }, () => {
+      spawns += 1
+      return piRpcProcess() as never
+    })
+    await host.start(input({}))
+    await host.start(input({}))
+    expect(spawns).toBe(1)
+    expect(await host.stop('record-1', 'switch to TUI')).toBe(true)
+    expect(host.has('record-1')).toBe(false)
+    expect(onExit).toHaveBeenCalledWith('record-1', expect.objectContaining({ intentional: true }))
+  })
+
+  it('follows Pi compaction events until the agent settles', async () => {
+    const rpc = piRpcProcess({ isCompacting: true })
+    const host = new WebSessionHost(logger, {}, () => rpc as never)
+    expect((await host.start(input({}))).phase).toBe('compacting')
+    rpc.line({ type: 'compaction_end', reason: 'threshold', willRetry: false })
+    await settle(10)
+    expect(host.get('record-1')?.phase).toBe('working')
+    rpc.line({ type: 'agent_settled' })
+    await settle(10)
+    expect(host.get('record-1')?.phase).toBe('idle')
+  })
+
+  it('marks the session failed when the process dies unexpectedly', async () => {
+    const rpc = piRpcProcess()
+    const onExit = vi.fn()
+    const host = new WebSessionHost(logger, { onExit }, () => rpc as never)
+    await host.start(input({}))
+    rpc.emit('exit', 1, null)
+    await settle(10)
+    expect(host.has('record-1')).toBe(false)
+    expect(onExit).toHaveBeenCalledWith('record-1', expect.objectContaining({ intentional: false, code: 1 }))
+  })
+})
+
+// ── acp ────────────────────────────────────────────────────────────────────
+
+function acpProcess(options: { loadSession?: boolean; failAuth?: boolean } = {}): FakeProcess {
+  return new FakeProcess((command, self) => {
+    const id = command['id']
+    const method = command['method']
+    const params = (command['params'] ?? {}) as Json
+    if (method === 'initialize') {
+      self.line({ jsonrpc: '2.0', id, result: { protocolVersion: 1, agentCapabilities: { loadSession: options.loadSession ?? true }, authMethods: [] } })
+      return
+    }
+    if (method === 'session/new') {
+      if (options.failAuth) {
+        self.line({ jsonrpc: '2.0', id, error: { code: -32000, message: 'Authentication required' } })
+        return
+      }
+      self.line({ jsonrpc: '2.0', id, result: { sessionId: 'ses_new' } })
+      return
+    }
+    if (method === 'session/load') {
+      self.line({ jsonrpc: '2.0', method: 'session/update', params: { sessionId: params['sessionId'], update: { sessionUpdate: 'user_message_chunk', content: { type: 'text', text: 'earlier ' } } } })
+      self.line({ jsonrpc: '2.0', method: 'session/update', params: { sessionId: params['sessionId'], update: { sessionUpdate: 'user_message_chunk', content: { type: 'text', text: 'question' } } } })
+      self.line({ jsonrpc: '2.0', method: 'session/update', params: { sessionId: params['sessionId'], update: { sessionUpdate: 'agent_message_chunk', content: { type: 'text', text: 'earlier answer' } } } })
+      self.line({ jsonrpc: '2.0', id, result: {} })
+      return
+    }
+    if (method === 'session/prompt') {
+      const sessionId = params['sessionId']
+      self.line({ jsonrpc: '2.0', method: 'session/update', params: { sessionId, update: { sessionUpdate: 'agent_thought_chunk', content: { type: 'text', text: 'let me look' } } } })
+      self.line({ jsonrpc: '2.0', method: 'session/update', params: { sessionId, update: { sessionUpdate: 'agent_message_chunk', content: { type: 'text', text: 'Reading ' } } } })
+      self.line({ jsonrpc: '2.0', method: 'session/update', params: { sessionId, update: { sessionUpdate: 'tool_call', toolCallId: 'call_1', title: 'Read README.md', kind: 'read', status: 'pending', rawInput: { path: 'README.md' } } } })
+      self.line({ jsonrpc: '2.0', id: 'srv-1', method: 'session/request_permission', params: {
+        sessionId,
+        toolCall: { toolCallId: 'call_1', title: 'Read README.md', kind: 'read', rawInput: { path: 'README.md' } },
+        options: [
+          { optionId: 'allow-once', name: 'Allow once', kind: 'allow_once' },
+          { optionId: 'reject-once', name: 'Reject', kind: 'reject_once' },
+        ],
+      } })
+      ;(self as FakeProcess & { promptId?: unknown }).promptId = id
+      return
+    }
+    if ('result' in command && command['id'] === 'srv-1') {
+      const outcome = ((command['result'] as Json)['outcome'] as Json)
+      const promptId = (self as FakeProcess & { promptId?: unknown }).promptId
+      if (outcome['outcome'] === 'selected' && outcome['optionId'] === 'allow-once') {
+        self.line({ jsonrpc: '2.0', method: 'session/update', params: { sessionId: 'ses_new', update: { sessionUpdate: 'tool_call_update', toolCallId: 'call_1', status: 'completed', content: [{ type: 'content', content: { type: 'text', text: '# OpenAlice' } }] } } })
+        self.line({ jsonrpc: '2.0', method: 'session/update', params: { sessionId: 'ses_new', update: { sessionUpdate: 'agent_message_chunk', content: { type: 'text', text: 'the README.' } } } })
+        self.line({ jsonrpc: '2.0', id: promptId, result: { stopReason: 'end_turn' } })
+      } else {
+        self.line({ jsonrpc: '2.0', method: 'session/update', params: { sessionId: 'ses_new', update: { sessionUpdate: 'tool_call_update', toolCallId: 'call_1', status: 'failed' } } })
+        self.line({ jsonrpc: '2.0', id: promptId, result: { stopReason: 'end_turn' } })
+      }
+      return
+    }
+    if (method === 'session/cancel') {
+      const promptId = (self as FakeProcess & { promptId?: unknown }).promptId
+      self.line({ jsonrpc: '2.0', id: promptId, result: { stopReason: 'cancelled' } })
+    }
+  })
+}
+
+describe('WebSessionHost with the acp transport', () => {
+  const acpInput = input({ agent: 'cursor', wire: 'acp', command: ['cursor-agent', 'acp'] })
+
+  it('creates a session, streams a turn, and routes permission requests to the browser', async () => {
+    const onNativeSessionId = vi.fn()
+    const process = acpProcess()
+    const host = new WebSessionHost(logger, { onNativeSessionId }, () => process as never)
+    const started = await host.start(acpInput)
+    expect(started.nativeSessionId).toBe('ses_new')
+    expect(onNativeSessionId).toHaveBeenCalledWith('record-1', 'ses_new')
+    expect(process.received[0]).toMatchObject({ method: 'initialize', params: { protocolVersion: 1 } })
+
+    await host.prompt('record-1', 'summarize the readme')
+    await settle()
+    const waiting = host.get('record-1')!
+    expect(waiting.phase).toBe('awaiting-input')
+    expect(waiting.requests).toHaveLength(1)
+    expect(waiting.requests[0]).toMatchObject({
+      kind: 'permission',
+      title: 'Read README.md',
+      tool: { name: 'Read README.md', input: { path: 'README.md' } },
+      options: [
+        { id: 'allow-once', label: 'Allow once', tone: 'allow' },
+        { id: 'reject-once', label: 'Reject', tone: 'deny' },
+      ],
+    })
+    expect(waiting.streamingMessage).toMatchObject({ role: 'assistant' })
+
+    await expect(host.respond('record-1', waiting.requests[0]!.id, 'nope')).rejects.toThrow(/not offered/)
+    await host.respond('record-1', waiting.requests[0]!.id, 'allow-once')
+    await settle()
+    const done = host.get('record-1')!
+    expect(done.phase).toBe('idle')
+    expect(done.requests).toEqual([])
+    expect(texts(done)).toEqual([
+      'user:summarize the readme',
+      'assistant:thinking|Reading |[Read README.md]',
+      'toolResult:Read README.md:ok',
+      'assistant:the README.',
+    ])
+    expect(process.received.find((c) => c['id'] === 'srv-1')).toMatchObject({ result: { outcome: { outcome: 'selected', optionId: 'allow-once' } } })
+  })
+
+  it('reloads a known session and replays its history', async () => {
+    const host = new WebSessionHost(logger, {}, () => acpProcess() as never)
+    const started = await host.start({ ...acpInput, nativeSessionId: 'ses_old' })
+    expect(started.nativeSessionId).toBe('ses_old')
+    expect(texts(started)).toEqual(['user:earlier question', 'assistant:earlier answer'])
+  })
+
+  it('cancels outstanding permission requests when the turn is aborted', async () => {
+    const process = acpProcess()
+    const host = new WebSessionHost(logger, {}, () => process as never)
+    await host.start(acpInput)
+    await host.prompt('record-1', 'go')
+    await settle()
+    expect(host.get('record-1')?.requests).toHaveLength(1)
+    await host.abort('record-1')
+    await settle()
+    const snapshot = host.get('record-1')!
+    expect(snapshot.requests).toEqual([])
+    expect(snapshot.phase).toBe('idle')
+    expect(process.received.find((c) => c['id'] === 'srv-1')).toMatchObject({ result: { outcome: { outcome: 'cancelled' } } })
+  })
+
+  it('explains authentication failures instead of a bare JSON-RPC error', async () => {
+    const host = new WebSessionHost(logger, {}, () => acpProcess({ failAuth: true }) as never)
+    await expect(host.start(acpInput)).rejects.toThrow(/cursor requires authentication/)
+    expect(host.has('record-1')).toBe(false)
+  })
+})
+
+// ── claude-stream-json ─────────────────────────────────────────────────────
+
+function claudeProcess(): FakeProcess {
+  return new FakeProcess((command, self) => {
+    if (command['type'] === 'user') {
+      self.line({ type: 'system', subtype: 'init', session_id: 'claude-sess', model: 'claude' })
+      self.line({ type: 'stream_event', session_id: 'claude-sess', event: { type: 'content_block_delta', index: 0, delta: { type: 'text_delta', text: 'Let me ' } } })
+      self.line({ type: 'stream_event', session_id: 'claude-sess', event: { type: 'content_block_delta', index: 0, delta: { type: 'text_delta', text: 'check.' } } })
+      self.line({ type: 'assistant', session_id: 'claude-sess', message: { id: 'msg_1', role: 'assistant', content: [{ type: 'text', text: 'Let me check.' }] } })
+      self.line({ type: 'assistant', session_id: 'claude-sess', message: { id: 'msg_1', role: 'assistant', content: [{ type: 'tool_use', id: 'toolu_1', name: 'Bash', input: { command: 'ls' } }] } })
+      self.line({ type: 'control_request', request_id: 'req_1', request: { subtype: 'can_use_tool', tool_name: 'Bash', input: { command: 'ls' } } })
+      return
+    }
+    if (command['type'] === 'control_response') {
+      const response = command['response'] as Json
+      const inner = response['response'] as Json
+      if (inner['behavior'] === 'allow') {
+        self.line({ type: 'user', session_id: 'claude-sess', message: { role: 'user', content: [{ type: 'tool_result', tool_use_id: 'toolu_1', content: 'README.md\nsrc', is_error: false }] } })
+        self.line({ type: 'assistant', session_id: 'claude-sess', message: { id: 'msg_2', role: 'assistant', content: [{ type: 'text', text: 'Two entries.' }] } })
+        self.line({ type: 'result', subtype: 'success', session_id: 'claude-sess', is_error: false, result: 'Two entries.' })
+      } else {
+        self.line({ type: 'user', session_id: 'claude-sess', message: { role: 'user', content: [{ type: 'tool_result', tool_use_id: 'toolu_1', content: 'denied', is_error: true }] } })
+        self.line({ type: 'result', subtype: 'success', session_id: 'claude-sess', is_error: false, result: 'ok' })
+      }
+      return
+    }
+    if (command['type'] === 'control_request') {
+      const request = command['request'] as Json
+      if (request['subtype'] === 'interrupt') {
+        self.line({ type: 'control_response', response: { subtype: 'success', request_id: command['request_id'] } })
+        self.line({ type: 'result', subtype: 'error_during_execution', session_id: 'claude-sess', is_error: true, result: 'interrupted' })
+      }
+    }
+  })
+}
+
+describe('WebSessionHost with the claude-stream-json transport', () => {
+  const claudeInput = input({ agent: 'claude', wire: 'claude-stream-json', command: ['claude', '-p'] })
+
+  it('streams deltas, asks for tool permission, and finishes on the result frame', async () => {
+    const onNativeSessionId = vi.fn()
+    const process = claudeProcess()
+    const host = new WebSessionHost(logger, { onNativeSessionId }, () => process as never)
+    const started = await host.start(claudeInput)
+    expect(started.phase).toBe('idle')
+
+    await host.prompt('record-1', 'list files')
+    await settle()
+    expect(onNativeSessionId).toHaveBeenCalledWith('record-1', 'claude-sess')
+    expect(process.received[0]).toMatchObject({ type: 'user', message: { role: 'user', content: [{ type: 'text', text: 'list files' }] } })
+    const waiting = host.get('record-1')!
+    expect(waiting.phase).toBe('awaiting-input')
+    expect(waiting.requests[0]).toMatchObject({ title: 'Bash', tool: { name: 'Bash', input: { command: 'ls' } } })
+    expect(waiting.streamingMessage).toMatchObject({ role: 'assistant', content: [{ type: 'text', text: 'Let me check.' }, { type: 'toolCall', id: 'toolu_1', name: 'Bash' }] })
+
+    await host.respond('record-1', waiting.requests[0]!.id, 'allow')
+    await settle()
+    const done = host.get('record-1')!
+    expect(done.phase).toBe('idle')
+    expect(texts(done)).toEqual(['user:list files', 'assistant:Let me check.|[Bash]', 'toolResult:Bash:ok', 'assistant:Two entries.'])
+    expect(process.received.at(-1)).toMatchObject({ type: 'control_response', response: { request_id: 'req_1', response: { behavior: 'allow', updatedInput: { command: 'ls' } } } })
+  })
+
+  it('sends an interrupt control request on abort', async () => {
+    const process = claudeProcess()
+    const host = new WebSessionHost(logger, {}, () => process as never)
+    await host.start(claudeInput)
+    await host.prompt('record-1', 'list files')
+    await settle()
+    await host.abort('record-1')
+    await settle()
+    expect(process.received.some((c) => c['type'] === 'control_request' && (c['request'] as Json)['subtype'] === 'interrupt')).toBe(true)
+    const snapshot = host.get('record-1')!
+    expect(snapshot.phase).toBe('idle')
+    expect(snapshot.requests).toEqual([])
+    expect(snapshot.error).toBe('interrupted')
+  })
+})
+
+// ── codex-app-server ───────────────────────────────────────────────────────
+
+function codexProcess(options: { history?: boolean } = {}): FakeProcess {
+  return new FakeProcess((command, self) => {
+    const id = command['id']
+    const method = command['method']
+    const params = (command['params'] ?? {}) as Json
+    if (method === 'initialize') { self.line({ id, result: { userAgent: 'codex' } }); return }
+    if (method === 'thread/start') { self.line({ id, result: { thread: { id: 'thr_new', turns: [] } } }); return }
+    if (method === 'thread/resume') {
+      self.line({ id, result: { thread: { id: params['threadId'], turns: options.history ? [{
+        id: 'turn_0',
+        items: [
+          { type: 'userMessage', id: 'u0', content: [{ type: 'text', text: 'old question' }] },
+          { type: 'commandExecution', id: 'c0', command: 'pwd', cwd: '/w', status: 'completed', aggregatedOutput: '/w\n', exitCode: 0 },
+          { type: 'agentMessage', id: 'a0', text: 'old answer' },
+        ],
+      }] : [] } } })
+      return
+    }
+    if (method === 'turn/start') {
+      self.line({ id, result: { turn: { id: 'turn_1', status: 'inProgress', items: [] } } })
+      self.line({ method: 'turn/started', params: { turn: { id: 'turn_1' } } })
+      self.line({ method: 'item/started', params: { item: { type: 'agentMessage', id: 'a1', text: '' } } })
+      self.line({ method: 'item/agentMessage/delta', params: { itemId: 'a1', delta: 'Running ' } })
+      self.line({ method: 'item/agentMessage/delta', params: { itemId: 'a1', delta: 'tests.' } })
+      self.line({ method: 'item/completed', params: { item: { type: 'agentMessage', id: 'a1', text: 'Running tests.' } } })
+      self.line({ method: 'item/started', params: { item: { type: 'commandExecution', id: 'c1', command: 'pnpm test', cwd: '/w', status: 'inProgress' } } })
+      self.line({ id: 'approval-1', method: 'item/commandExecution/requestApproval', params: { itemId: 'c1', threadId: 'thr_new', turnId: 'turn_1', command: 'pnpm test', cwd: '/w', reason: 'runs outside the sandbox' } })
+      return
+    }
+    if (command['id'] === 'approval-1' && 'result' in command) {
+      const decision = (command['result'] as Json)['decision']
+      const status = decision === 'accept' || decision === 'acceptForSession' ? 'completed' : 'declined'
+      self.line({ method: 'item/completed', params: { item: { type: 'commandExecution', id: 'c1', command: 'pnpm test', cwd: '/w', status, aggregatedOutput: status === 'completed' ? '12 passed\n' : '', exitCode: status === 'completed' ? 0 : null } } })
+      self.line({ method: 'turn/completed', params: { turn: { id: 'turn_1', status: decision === 'cancel' ? 'interrupted' : 'completed' } } })
+      return
+    }
+    if (method === 'turn/interrupt') {
+      self.line({ id, result: {} })
+      self.line({ method: 'turn/completed', params: { turn: { id: 'turn_1', status: 'interrupted' } } })
+    }
+  })
+}
+
+describe('WebSessionHost with the codex-app-server transport', () => {
+  const codexInput = input({ agent: 'codex', wire: 'codex-app-server', command: ['codex', 'app-server'] })
+
+  it('starts a thread, streams items, and routes command approvals to the browser', async () => {
+    const onNativeSessionId = vi.fn()
+    const process = codexProcess()
+    const host = new WebSessionHost(logger, { onNativeSessionId }, () => process as never)
+    const started = await host.start(codexInput)
+    expect(started.nativeSessionId).toBe('thr_new')
+    expect(onNativeSessionId).toHaveBeenCalledWith('record-1', 'thr_new')
+    expect(process.received.map((c) => c['method'])).toEqual(['initialize', 'initialized', 'thread/start'])
+    expect(process.received[2]).toMatchObject({ params: { cwd: '/tmp/workspace', approvalPolicy: 'onRequest', sandbox: 'workspaceWrite' } })
+
+    await host.prompt('record-1', 'run the tests')
+    await settle()
+    const waiting = host.get('record-1')!
+    expect(waiting.phase).toBe('awaiting-input')
+    expect(waiting.requests[0]).toMatchObject({
+      title: 'Run pnpm test',
+      description: 'runs outside the sandbox',
+      options: [{ id: 'accept', tone: 'allow' }, { id: 'acceptForSession', tone: 'allow' }, { id: 'decline', tone: 'deny' }],
+    })
+    await host.respond('record-1', waiting.requests[0]!.id, 'accept')
+    await settle()
+    const done = host.get('record-1')!
+    expect(done.phase).toBe('idle')
+    expect(texts(done)).toEqual(['user:run the tests', 'assistant:Running tests.|[shell]', 'toolResult:shell:ok'])
+    expect(process.received.find((c) => c['id'] === 'approval-1')).toEqual({ id: 'approval-1', result: { decision: 'accept' } })
+  })
+
+  it('replays thread history on resume', async () => {
+    const host = new WebSessionHost(logger, {}, () => codexProcess({ history: true }) as never)
+    const started = await host.start({ ...codexInput, nativeSessionId: 'thr_old' })
+    expect(started.nativeSessionId).toBe('thr_old')
+    expect(texts(started)).toEqual(['user:old question', 'assistant:[shell]', 'toolResult:shell:ok', 'assistant:old answer'])
+  })
+
+  it('interrupts the active turn and cancels pending approvals', async () => {
+    const process = codexProcess()
+    const host = new WebSessionHost(logger, {}, () => process as never)
+    await host.start(codexInput)
+    await host.prompt('record-1', 'run the tests')
+    await settle()
+    await host.abort('record-1')
+    await settle()
+    expect(process.received.some((c) => c['method'] === 'turn/interrupt')).toBe(true)
+    const snapshot = host.get('record-1')!
+    expect(snapshot.requests).toEqual([])
+    expect(snapshot.phase).toBe('idle')
+    expect(texts(snapshot).at(-1)).toBe('notice:Turn interrupted.')
+  })
+})
diff --git a/src/workspaces/web-session-host.ts b/src/workspaces/web-session-host.ts
new file mode 100644
index 0000000000..8c1b7209d9
--- /dev/null
+++ b/src/workspaces/web-session-host.ts
@@ -0,0 +1,369 @@
+/**
+ * Web conversation surface — one long-lived structured Agent process per
+ * Session record, presented in the browser instead of a PTY.
+ *
+ * The host owns process supervision (spawn, stdio framing, stderr tail, exit)
+ * and hands each process to the transport that speaks its protocol. Transports
+ * project the runtime's live protocol onto the neutral model in
+ * `web-session/model.ts`; nothing here knows any vendor event name.
+ */
+import { spawn, type ChildProcessWithoutNullStreams } from 'node:child_process'
+import { StringDecoder } from 'node:string_decoder'
+
+import type { Logger } from './logger.js'
+import { AcpTransport } from './web-session/acp-transport.js'
+import { ClaudeStreamJsonTransport } from './web-session/claude-stream-json-transport.js'
+import { CodexAppServerTransport } from './web-session/codex-app-server-transport.js'
+import { isJsonObject, type JsonObject, type WebSessionSnapshot, type WebSessionWire } from './web-session/model.js'
+import { PiRpcTransport } from './web-session/pi-rpc-transport.js'
+import {
+  WebSessionState,
+  type JsonlChannel,
+  type StartWebSessionInput,
+  type WebSessionTransport,
+  type WebTransportFactory,
+} from './web-session/transport.js'
+import { resolveLaunchCommand } from './win-command.js'
+
+export type { StartWebSessionInput } from './web-session/transport.js'
+export type {
+  WebConversationMessage,
+  WebPermissionRequest,
+  WebSessionPhase,
+  WebSessionSnapshot,
+  WebSessionWire,
+} from './web-session/model.js'
+
+const STDERR_MAX_CHARS = 64 * 1024
+
+export interface WebSessionProcess {
+  readonly pid?: number
+  readonly stdin: ChildProcessWithoutNullStreams['stdin']
+  readonly stdout: ChildProcessWithoutNullStreams['stdout']
+  readonly stderr: ChildProcessWithoutNullStreams['stderr']
+  once(event: 'spawn', listener: () => void): this
+  once(event: 'error', listener: (error: Error) => void): this
+  once(event: 'exit', listener: (code: number | null, signal: NodeJS.Signals | null) => void): this
+  on(event: 'error', listener: (error: Error) => void): this
+  kill(signal?: NodeJS.Signals): boolean
+}
+
+export interface WebSessionExitReason {
+  readonly code: number | null
+  readonly signal: NodeJS.Signals | null
+  readonly intentional: boolean
+}
+
+interface HostCallbacks {
+  readonly onExit?: (recordId: string, reason: WebSessionExitReason) => void
+  /** Fired once a transport learns (or confirms) the runtime's session id. */
+  readonly onNativeSessionId?: (recordId: string, nativeSessionId: string) => void
+}
+
+type SpawnProcess = (input: StartWebSessionInput) => WebSessionProcess
+
+export const WEB_TRANSPORTS: Readonly<Record<WebSessionWire, WebTransportFactory>> = {
+  'pi-rpc': (ctx) => new PiRpcTransport(ctx),
+  acp: (ctx) => new AcpTransport(ctx),
+  'claude-stream-json': (ctx) => new ClaudeStreamJsonTransport(ctx),
+  'codex-app-server': (ctx) => new CodexAppServerTransport(ctx),
+}
+
+export class WebSessionHost {
+  private readonly sessions = new Map<string, LiveWebSession>()
+
+  constructor(
+    private readonly logger: Logger,
+    private readonly callbacks: HostCallbacks = {},
+    private readonly spawnProcess: SpawnProcess = defaultSpawnProcess,
+    private readonly transports: Readonly<Record<WebSessionWire, WebTransportFactory>> = WEB_TRANSPORTS,
+  ) {}
+
+  has(recordId: string): boolean {
+    return this.sessions.has(recordId)
+  }
+
+  get(recordId: string): WebSessionSnapshot | null {
+    return this.sessions.get(recordId)?.snapshot() ?? null
+  }
+
+  async start(input: StartWebSessionInput): Promise<WebSessionSnapshot> {
+    const existing = this.sessions.get(input.recordId)
+    if (existing) return existing.snapshot()
+    const factory = this.transports[input.wire]
+    if (!factory) throw new Error(`no Web transport for wire ${String(input.wire)}`)
+    const session = new LiveWebSession(
+      input,
+      this.spawnProcess(input),
+      factory,
+      this.logger.child({ scope: 'web-session', wsId: input.wsId, recordId: input.recordId, wire: input.wire }),
+      {
+        onExit: (reason) => {
+          if (this.sessions.get(input.recordId) === session) this.sessions.delete(input.recordId)
+          this.callbacks.onExit?.(input.recordId, reason)
+        },
+        onNativeSessionId: (id) => this.callbacks.onNativeSessionId?.(input.recordId, id),
+      },
+    )
+    this.sessions.set(input.recordId, session)
+    try {
+      await session.start()
+      return session.snapshot()
+    } catch (error) {
+      this.sessions.delete(input.recordId)
+      await session.stop('startup failed').catch(() => undefined)
+      throw error
+    }
+  }
+
+  async prompt(recordId: string, message: string): Promise<WebSessionSnapshot> {
+    const session = this.require(recordId)
+    await session.prompt(message)
+    return session.snapshot()
+  }
+
+  async abort(recordId: string): Promise<WebSessionSnapshot> {
+    const session = this.require(recordId)
+    await session.abort()
+    return session.snapshot()
+  }
+
+  async respond(recordId: string, requestId: string, optionId: string): Promise<WebSessionSnapshot> {
+    const session = this.require(recordId)
+    await session.respond(requestId, optionId)
+    return session.snapshot()
+  }
+
+  async stop(recordId: string, reason = 'stopped'): Promise<boolean> {
+    const session = this.sessions.get(recordId)
+    if (!session) return false
+    this.sessions.delete(recordId)
+    await session.stop(reason)
+    return true
+  }
+
+  async stopAll(reason = 'host disposed'): Promise<void> {
+    const sessions = Array.from(this.sessions.values())
+    this.sessions.clear()
+    await Promise.allSettled(sessions.map((session) => session.stop(reason)))
+  }
+
+  private require(recordId: string): LiveWebSession {
+    const session = this.sessions.get(recordId)
+    if (!session) throw new Error(`Web session is not running: ${recordId}`)
+    return session
+  }
+}
+
+class LiveWebSession {
+  private readonly state: WebSessionState
+  private readonly channel: ChildJsonlChannel
+  private readonly transport: WebSessionTransport
+  private stderrTail = ''
+  private intentionalStop = false
+  private exited = false
+  private readonly startedAt = Date.now()
+
+  constructor(
+    private readonly input: StartWebSessionInput,
+    private readonly child: WebSessionProcess,
+    factory: WebTransportFactory,
+    private readonly logger: Logger,
+    private readonly callbacks: {
+      onExit: (reason: WebSessionExitReason) => void
+      onNativeSessionId: (id: string) => void
+    },
+  ) {
+    let lastNativeId: string | null = input.nativeSessionId ?? null
+    this.state = new WebSessionState(() => {
+      if (this.state.nativeSessionId && this.state.nativeSessionId !== lastNativeId) {
+        lastNativeId = this.state.nativeSessionId
+        this.callbacks.onNativeSessionId(lastNativeId)
+      }
+    })
+    if (input.nativeSessionId) this.state.nativeSessionId = input.nativeSessionId
+    this.channel = new ChildJsonlChannel(child, logger)
+    this.transport = factory({ input, state: this.state, channel: this.channel, logger })
+  }
+
+  async start(): Promise<void> {
+    this.child.stderr.on('data', (chunk: Buffer) => this.onStderr(chunk))
+    this.child.on('error', (error) => this.fail(error))
+    this.child.once('exit', (code, signal) => this.handleExit(code, signal))
+    this.channel.attach()
+    await new Promise<void>((resolve, reject) => {
+      this.child.once('spawn', resolve)
+      this.child.once('error', reject)
+    })
+    this.logger.info('web_session.started', { pid: this.child.pid ?? null, command: this.input.command })
+    await this.transport.start()
+    if (this.exited) throw new Error(this.state.error ?? 'Web session process exited during startup')
+    if (this.state.phase === 'starting') this.state.setPhase('idle')
+  }
+
+  snapshot(): WebSessionSnapshot {
+    return {
+      recordId: this.input.recordId,
+      wsId: this.input.wsId,
+      resumeId: this.input.resumeId,
+      agent: this.input.agent,
+      wire: this.input.wire,
+      nativeSessionId: this.state.nativeSessionId,
+      pid: this.exited ? null : this.child.pid ?? null,
+      startedAt: this.startedAt,
+      phase: this.state.phase,
+      messages: this.state.messages,
+      streamingMessage: this.state.streamingMessage,
+      requests: this.state.requests,
+      error: this.state.error,
+      stderrTail: this.stderrTail,
+      revision: this.state.revision,
+    }
+  }
+
+  prompt(message: string): Promise<void> {
+    this.assertLive()
+    return this.transport.prompt(message)
+  }
+
+  abort(): Promise<void> {
+    this.assertLive()
+    return this.transport.abort()
+  }
+
+  respond(requestId: string, optionId: string): Promise<void> {
+    this.assertLive()
+    return this.transport.respond(requestId, optionId)
+  }
+
+  async stop(reason: string): Promise<void> {
+    if (this.exited) return
+    this.intentionalStop = true
+    this.logger.info('web_session.stopping', { reason })
+    try {
+      this.transport.dispose?.()
+    } catch (error) {
+      this.logger.warn('web_session.dispose_failed', { error })
+    }
+    this.channel.close()
+    this.child.kill('SIGTERM')
+    await Promise.race([
+      new Promise<void>((resolve) => this.child.once('exit', () => resolve())),
+      new Promise<void>((resolve) => setTimeout(resolve, 2_000)),
+    ])
+    if (!this.exited) this.child.kill('SIGKILL')
+  }
+
+  private assertLive(): void {
+    if (this.exited) throw new Error(this.state.error ?? 'Web session process exited')
+  }
+
+  private onStderr(chunk: Buffer): void {
+    this.stderrTail = `${this.stderrTail}${chunk.toString('utf8')}`.slice(-STDERR_MAX_CHARS)
+    this.state.bump()
+  }
+
+  private fail(error: Error): void {
+    this.state.fail(error.message)
+    this.logger.error('web_session.failed', { error })
+  }
+
+  private handleExit(code: number | null, signal: NodeJS.Signals | null): void {
+    if (this.exited) return
+    this.exited = true
+    this.channel.close()
+    try {
+      this.transport.dispose?.()
+    } catch {
+      // The process is already gone; a transport cleanup failure is not actionable.
+    }
+    this.state.phase = this.intentionalStop ? 'stopped' : 'failed'
+    if (!this.intentionalStop && !this.state.error) {
+      this.state.error = `${this.input.agent} exited (code=${String(code)}, signal=${String(signal)})`
+    }
+    this.state.clearRequests()
+    this.state.bump()
+    this.logger.info('web_session.exited', { code, signal, intentional: this.intentionalStop })
+    this.callbacks.onExit({ code, signal, intentional: this.intentionalStop })
+  }
+}
+
+class ChildJsonlChannel implements JsonlChannel {
+  private readonly decoder = new StringDecoder('utf8')
+  private buffer = ''
+  private handlers: Array<(value: JsonObject) => void> = []
+  closed = false
+
+  constructor(private readonly child: WebSessionProcess, private readonly logger: Logger) {}
+
+  attach(): void {
+    this.child.stdout.on('data', (chunk: Buffer) => this.onData(chunk))
+  }
+
+  send(value: unknown): Promise<void> {
+    if (this.closed) return Promise.reject(new Error('process stdin is closed'))
+    const line = `${JSON.stringify(value)}\n`
+    return new Promise<void>((resolve, reject) => {
+      this.child.stdin.write(line, (error) => (error ? reject(error) : resolve()))
+    })
+  }
+
+  onMessage(handler: (value: JsonObject) => void): void {
+    this.handlers.push(handler)
+  }
+
+  close(): void {
+    if (this.closed) return
+    this.closed = true
+    try {
+      this.child.stdin.end()
+    } catch {
+      // stdin may already be destroyed by the exiting process
+    }
+  }
+
+  private onData(chunk: Buffer): void {
+    this.buffer += this.decoder.write(chunk)
+    let newline = this.buffer.indexOf('\n')
+    while (newline >= 0) {
+      const line = this.buffer.slice(0, newline)
+      this.buffer = this.buffer.slice(newline + 1)
+      this.handleLine(line)
+      newline = this.buffer.indexOf('\n')
+    }
+  }
+
+  private handleLine(raw: string): void {
+    const line = raw.endsWith('\r') ? raw.slice(0, -1) : raw
+    if (!line.trim()) return
+    let parsed: unknown
+    try {
+      parsed = JSON.parse(line)
+    } catch (error) {
+      // Some runtimes print banners or progress text on stdout before/around
+      // their protocol frames; keep them out of the transcript but visible.
+      this.logger.warn('web_session.non_json_stdout', { error, line: line.slice(0, 500) })
+      return
+    }
+    if (!isJsonObject(parsed)) return
+    for (const handler of this.handlers) {
+      try {
+        handler(parsed)
+      } catch (error) {
+        this.logger.error('web_session.handler_failed', { error })
+      }
+    }
+  }
+}
+
+function defaultSpawnProcess(input: StartWebSessionInput): WebSessionProcess {
+  const resolved = resolveLaunchCommand(input.command, { env: input.env, cwd: input.cwd })
+  const [file, ...args] = resolved.argv
+  if (!file) throw new Error('Web session command is empty')
+  return spawn(file, args, {
+    cwd: input.cwd,
+    env: { ...input.env },
+    stdio: ['pipe', 'pipe', 'pipe'],
+    windowsHide: true,
+  })
+}
diff --git a/src/workspaces/web-session/acp-transport.ts b/src/workspaces/web-session/acp-transport.ts
new file mode 100644
index 0000000000..d8e9e7e0bd
--- /dev/null
+++ b/src/workspaces/web-session/acp-transport.ts
@@ -0,0 +1,291 @@
+/**
+ * Agent Client Protocol (https://agentclientprotocol.com) over stdio.
+ *
+ * Cursor Agent (`agent acp`), Grok Build (`grok agent stdio`) and opencode
+ * (`opencode acp`) implement the agent side natively. Alice is the client: it
+ * advertises no filesystem or terminal capabilities, so agents keep using
+ * their own tools, and only permission requests round-trip to the browser.
+ */
+import { JsonRpcPeer, type JsonRpcError } from './json-rpc.js'
+import {
+  isJsonObject,
+  stringOrNull,
+  type JsonObject,
+  type WebContentPart,
+  type WebPermissionRequest,
+  type WebRequestOption,
+  type WebRequestOptionTone,
+} from './model.js'
+import { TranscriptBuilder } from './transcript-builder.js'
+import type { WebSessionTransport, WebTransportContext } from './transport.js'
+
+const ACP_PROTOCOL_VERSION = 1
+const SESSION_LOAD_TIMEOUT_MS = 120_000
+
+interface PendingPermission {
+  readonly rpcId: string | number
+  readonly resolve: (outcome: JsonObject) => void
+}
+
+export class AcpTransport implements WebSessionTransport {
+  private readonly peer: JsonRpcPeer
+  private readonly builder: TranscriptBuilder
+  private readonly permissions = new Map<string, PendingPermission>()
+  private sessionId: string | null
+  private pendingUserText: string | null = null
+  private turnActive = false
+
+  constructor(private readonly ctx: WebTransportContext) {
+    this.sessionId = ctx.input.nativeSessionId ?? null
+    this.builder = new TranscriptBuilder(ctx.state)
+    this.peer = new JsonRpcPeer(ctx.channel, ctx.logger, {
+      onNotification: (method, params) => this.onNotification(method, params),
+      onRequest: (method, params, id) => this.onRequest(method, params, id),
+    })
+  }
+
+  async start(): Promise<void> {
+    const init = await this.peer.request('initialize', {
+      protocolVersion: ACP_PROTOCOL_VERSION,
+      clientCapabilities: { fs: { readTextFile: false, writeTextFile: false }, terminal: false },
+      clientInfo: { name: 'openalice', title: 'OpenAlice', version: '1' },
+    })
+    const capabilities = isJsonObject(init) && isJsonObject(init['agentCapabilities']) ? init['agentCapabilities'] : {}
+    const canLoad = capabilities['loadSession'] === true
+    const params = { cwd: this.ctx.input.cwd, mcpServers: [] }
+    try {
+      if (this.sessionId && canLoad) {
+        await this.peer.request('session/load', { sessionId: this.sessionId, ...params }, SESSION_LOAD_TIMEOUT_MS)
+        this.flushUser()
+        this.builder.endTurn()
+      } else {
+        if (this.sessionId) {
+          this.builder.notice(`${this.ctx.input.agent} cannot reload session ${this.sessionId} over ACP; a new native session was started.`)
+        }
+        const created = await this.peer.request('session/new', params)
+        const id = isJsonObject(created) ? stringOrNull(created['sessionId']) : null
+        if (!id) throw new Error('ACP session/new returned no sessionId')
+        this.sessionId = id
+      }
+    } catch (error) {
+      throw describeAcpFailure(error, this.ctx.input.agent)
+    }
+    this.ctx.state.setNativeSessionId(this.sessionId)
+    this.ctx.state.setPhase('idle')
+  }
+
+  async prompt(message: string): Promise<void> {
+    const text = message.trim()
+    if (!text) throw new Error('prompt cannot be empty')
+    if (!this.sessionId) throw new Error('ACP session is not established')
+    if (this.turnActive) throw new Error(`${this.ctx.input.agent} is still working on the previous prompt`)
+    this.turnActive = true
+    this.ctx.state.error = null
+    this.builder.user(text)
+    this.ctx.state.setPhase('working')
+    const turn = this.peer.request('session/prompt', {
+      sessionId: this.sessionId,
+      prompt: [{ type: 'text', text }],
+    }, null)
+    void turn.then(
+      (result) => this.finishTurn(isJsonObject(result) ? stringOrNull(result['stopReason']) : null, null),
+      (error: Error) => this.finishTurn(null, error),
+    )
+  }
+
+  async abort(): Promise<void> {
+    if (!this.sessionId) return
+    await this.peer.notify('session/cancel', { sessionId: this.sessionId })
+  }
+
+  async respond(requestId: string, optionId: string): Promise<void> {
+    const request = this.ctx.state.requests.find((r) => r.id === requestId)
+    const pending = this.permissions.get(requestId)
+    if (!request || !pending) throw new Error(`no pending request ${requestId}`)
+    if (!request.options.some((option) => option.id === optionId)) {
+      throw new Error(`option ${optionId} is not offered by request ${requestId}`)
+    }
+    this.permissions.delete(requestId)
+    this.ctx.state.removeRequest(requestId)
+    pending.resolve({ outcome: { outcome: 'selected', optionId } })
+  }
+
+  dispose(): void {
+    this.cancelPermissions()
+    this.peer.dispose(new Error('ACP session stopped'))
+  }
+
+  private finishTurn(stopReason: string | null, error: Error | null): void {
+    this.turnActive = false
+    this.cancelPermissions()
+    this.flushUser()
+    this.builder.endTurn()
+    if (error) {
+      if (!this.ctx.channel.closed) {
+        this.ctx.state.error = error.message
+        this.ctx.state.setPhase('idle')
+      }
+      return
+    }
+    if (stopReason === 'refusal') this.builder.notice(`${this.ctx.input.agent} refused to continue this turn.`)
+    if (stopReason === 'max_tokens') this.builder.notice('The turn stopped at the model output limit.')
+    if (stopReason === 'max_turn_requests') this.builder.notice('The turn stopped at the request limit.')
+    this.ctx.state.setPhase('idle')
+  }
+
+  private onNotification(method: string, params: unknown): void {
+    if (method !== 'session/update' || !isJsonObject(params)) return
+    const update = params['update']
+    if (!isJsonObject(update)) return
+    const kind = update['sessionUpdate']
+    if (kind !== 'user_message_chunk') this.flushUser()
+    switch (kind) {
+      case 'user_message_chunk':
+        this.pendingUserText = `${this.pendingUserText ?? ''}${contentBlockText(update['content'])}`
+        break
+      case 'agent_message_chunk':
+        this.builder.text(contentBlockText(update['content']))
+        break
+      case 'agent_thought_chunk':
+        this.builder.thinking(contentBlockText(update['content']))
+        break
+      case 'tool_call': {
+        const id = stringOrNull(update['toolCallId'])
+        if (!id) break
+        this.builder.toolCall(id, toolTitle(update), update['rawInput'] ?? {})
+        this.applyToolStatus(id, update)
+        break
+      }
+      case 'tool_call_update': {
+        const id = stringOrNull(update['toolCallId'])
+        if (!id) break
+        const name = stringOrNull(update['title'])
+        this.builder.toolCallUpdate(id, {
+          ...(name ? { name } : {}),
+          ...(update['rawInput'] !== undefined ? { args: update['rawInput'] } : {}),
+        })
+        this.applyToolStatus(id, update)
+        break
+      }
+      default:
+        // plan, available_commands_update, current_mode_update, config_option_update
+        break
+    }
+  }
+
+  private applyToolStatus(id: string, update: JsonObject): void {
+    const status = update['status']
+    if (status !== 'completed' && status !== 'failed') return
+    const content = toolCallContent(update['content'])
+    const output = content.length > 0
+      ? content
+      : update['rawOutput'] !== undefined
+        ? [{ type: 'data', value: update['rawOutput'] } satisfies WebContentPart]
+        : ''
+    this.builder.toolResult(id, output, status === 'failed')
+  }
+
+  private async onRequest(method: string, params: unknown, id: string | number): Promise<unknown> {
+    if (method === 'session/request_permission' && isJsonObject(params)) {
+      return this.requestPermission(params, id)
+    }
+    const error = new Error(`OpenAlice does not implement ${method}`) as Error & { code: number }
+    error.code = -32601
+    throw error
+  }
+
+  private requestPermission(params: JsonObject, rpcId: string | number): Promise<JsonObject> {
+    const toolCall = isJsonObject(params['toolCall']) ? params['toolCall'] : {}
+    const requestId = `acp-${String(rpcId)}`
+    const options = Array.isArray(params['options'])
+      ? params['options'].flatMap((option): WebRequestOption[] => {
+          if (!isJsonObject(option)) return []
+          const optionId = stringOrNull(option['optionId'])
+          if (!optionId) return []
+          return [{ id: optionId, label: stringOrNull(option['name']) ?? optionId, tone: toneFromKind(option['kind']) }]
+        })
+      : []
+    const toolName = toolTitle(toolCall)
+    const request: WebPermissionRequest = {
+      id: requestId,
+      kind: 'permission',
+      title: toolName === 'tool' ? `${this.ctx.input.agent} requests permission` : toolName,
+      description: `${this.ctx.input.agent} wants to run this tool.`,
+      tool: { name: toolName, input: toolCall['rawInput'] ?? {} },
+      options: options.length > 0
+        ? options
+        : [{ id: 'allow', label: 'Allow', tone: 'allow' }, { id: 'reject', label: 'Reject', tone: 'deny' }],
+      createdAt: Date.now(),
+    }
+    return new Promise<JsonObject>((resolve) => {
+      this.permissions.set(requestId, { rpcId, resolve })
+      this.ctx.state.addRequest(request)
+    })
+  }
+
+  private cancelPermissions(): void {
+    for (const [requestId, pending] of this.permissions) {
+      this.permissions.delete(requestId)
+      this.ctx.state.removeRequest(requestId)
+      pending.resolve({ outcome: { outcome: 'cancelled' } })
+    }
+  }
+
+  private flushUser(): void {
+    if (this.pendingUserText === null) return
+    const text = this.pendingUserText
+    this.pendingUserText = null
+    if (text.trim()) this.builder.user(text)
+  }
+}
+
+function toolTitle(record: JsonObject): string {
+  return stringOrNull(record['title']) ?? stringOrNull(record['kind']) ?? 'tool'
+}
+
+function toneFromKind(kind: unknown): WebRequestOptionTone {
+  if (kind === 'allow_once' || kind === 'allow_always') return 'allow'
+  if (kind === 'reject_once' || kind === 'reject_always') return 'deny'
+  return 'neutral'
+}
+
+function contentBlockText(block: unknown): string {
+  if (!isJsonObject(block)) return ''
+  if (block['type'] === 'text') return stringOrNull(block['text']) ?? ''
+  if (block['type'] === 'resource_link') return stringOrNull(block['uri']) ?? ''
+  if (block['type'] === 'resource' && isJsonObject(block['resource'])) return stringOrNull(block['resource']['text']) ?? ''
+  return ''
+}
+
+function toolCallContent(value: unknown): WebContentPart[] {
+  if (!Array.isArray(value)) return []
+  return value.flatMap((entry): WebContentPart[] => {
+    if (!isJsonObject(entry)) return []
+    if (entry['type'] === 'content') {
+      const text = contentBlockText(entry['content'])
+      return text ? [{ type: 'text', text }] : []
+    }
+    if (entry['type'] === 'diff') {
+      const path = stringOrNull(entry['path']) ?? 'file'
+      const oldText = stringOrNull(entry['oldText'])
+      const newText = stringOrNull(entry['newText']) ?? ''
+      return [{ type: 'text', text: `Edited ${path}\n\n\`\`\`diff\n${diffPreview(oldText, newText)}\n\`\`\`` }]
+    }
+    if (entry['type'] === 'terminal') return [{ type: 'data', value: entry }]
+    return [{ type: 'data', value: entry }]
+  })
+}
+
+function diffPreview(oldText: string | null, newText: string): string {
+  const removed = oldText ? oldText.split('\n').map((line) => `- ${line}`) : []
+  const added = newText.split('\n').map((line) => `+ ${line}`)
+  return [...removed, ...added].join('\n')
+}
+
+function describeAcpFailure(error: unknown, agent: string): Error {
+  const rpc = error as Partial<JsonRpcError>
+  if (rpc.code === -32000 || /auth/i.test(rpc.message ?? '')) {
+    return new Error(`${agent} requires authentication before it can open a Web session: ${rpc.message ?? 'auth required'}`)
+  }
+  return error instanceof Error ? error : new Error(String(error))
+}
diff --git a/src/workspaces/web-session/claude-stream-json-transport.ts b/src/workspaces/web-session/claude-stream-json-transport.ts
new file mode 100644
index 0000000000..7f97428baa
--- /dev/null
+++ b/src/workspaces/web-session/claude-stream-json-transport.ts
@@ -0,0 +1,252 @@
+/**
+ * Claude Code's bidirectional stream-json mode:
+ * `claude -p --input-format stream-json --output-format stream-json --verbose
+ *  --permission-prompt-tool stdio`.
+ *
+ * The process stays alive between turns. Tool permission prompts arrive as
+ * `control_request` frames (`can_use_tool`) and are answered with
+ * `control_response`; `interrupt` is a client-initiated control request.
+ */
+import {
+  isJsonObject,
+  stringOrNull,
+  type JsonObject,
+  type WebContentPart,
+  type WebPermissionRequest,
+} from './model.js'
+import { partsFromUnknownContent, TranscriptBuilder } from './transcript-builder.js'
+import { PendingRequests, type WebSessionTransport, type WebTransportContext } from './transport.js'
+
+const ALLOW = 'allow'
+const DENY = 'deny'
+
+interface PendingControl {
+  readonly requestId: string
+  readonly input: unknown
+}
+
+export class ClaudeStreamJsonTransport implements WebSessionTransport {
+  private readonly builder: TranscriptBuilder
+  private readonly controls = new PendingRequests<JsonObject>('web-claude')
+  private readonly permissions = new Map<string, PendingControl>()
+  private turnActive = false
+  private blocks: WebContentPart[] = []
+  private partial: WebContentPart[] = []
+  private assistantMessageId: string | null = null
+
+  constructor(private readonly ctx: WebTransportContext) {
+    this.builder = new TranscriptBuilder(ctx.state)
+    ctx.channel.onMessage((event) => this.handleEvent(event))
+  }
+
+  async start(): Promise<void> {
+    // Claude prints `system/init` only once the first user message arrives,
+    // so there is nothing to await here beyond a live process.
+    this.ctx.state.setPhase('idle')
+  }
+
+  async prompt(message: string): Promise<void> {
+    const text = message.trim()
+    if (!text) throw new Error('prompt cannot be empty')
+    if (this.turnActive) throw new Error('Claude is still working on the previous prompt')
+    this.turnActive = true
+    this.ctx.state.error = null
+    this.builder.user(text)
+    this.ctx.state.setPhase('working')
+    await this.ctx.channel.send({
+      type: 'user',
+      message: { role: 'user', content: [{ type: 'text', text }] },
+      ...(this.ctx.state.nativeSessionId ? { session_id: this.ctx.state.nativeSessionId } : {}),
+    })
+  }
+
+  async abort(): Promise<void> {
+    if (!this.turnActive) return
+    const requestId = this.controls.nextId()
+    const wait = this.controls.wait(requestId, 'Claude interrupt')
+    await this.ctx.channel.send({ type: 'control_request', request_id: requestId, request: { subtype: 'interrupt' } })
+    await wait.catch(() => undefined)
+  }
+
+  async respond(requestId: string, optionId: string): Promise<void> {
+    const pending = this.permissions.get(requestId)
+    if (!pending) throw new Error(`no pending request ${requestId}`)
+    if (optionId !== ALLOW && optionId !== DENY) throw new Error(`option ${optionId} is not offered by request ${requestId}`)
+    this.permissions.delete(requestId)
+    this.ctx.state.removeRequest(requestId)
+    await this.ctx.channel.send({
+      type: 'control_response',
+      response: {
+        subtype: 'success',
+        request_id: pending.requestId,
+        response: optionId === ALLOW
+          ? { behavior: 'allow', updatedInput: pending.input }
+          : { behavior: 'deny', message: 'The user declined this tool use in OpenAlice.' },
+      },
+    })
+  }
+
+  dispose(): void {
+    this.permissions.clear()
+    this.controls.rejectAll(new Error('Claude session stopped'))
+  }
+
+  private handleEvent(event: JsonObject): void {
+    const sessionId = stringOrNull(event['session_id'])
+    if (sessionId) this.ctx.state.setNativeSessionId(sessionId)
+    switch (event['type']) {
+      case 'system':
+        if (event['subtype'] === 'compact_boundary') this.builder.notice('Claude compacted the conversation context.')
+        break
+      case 'stream_event':
+        this.handleStreamEvent(event['event'])
+        break
+      case 'assistant':
+        this.handleAssistant(event['message'])
+        break
+      case 'user':
+        this.handleUser(event['message'])
+        break
+      case 'result':
+        this.finishTurn(event)
+        break
+      case 'control_request':
+        this.handleControlRequest(event)
+        break
+      case 'control_response': {
+        const response = isJsonObject(event['response']) ? event['response'] : null
+        const id = stringOrNull(response?.['request_id'])
+        if (id) this.controls.resolve(id, response ?? {})
+        break
+      }
+      default:
+        break
+    }
+  }
+
+  private handleStreamEvent(raw: unknown): void {
+    if (!isJsonObject(raw)) return
+    if (raw['type'] !== 'content_block_delta' || !isJsonObject(raw['delta'])) return
+    const delta = raw['delta']
+    const last = this.partial[this.partial.length - 1]
+    if (delta['type'] === 'text_delta' && typeof delta['text'] === 'string') {
+      if (last?.type === 'text') this.partial[this.partial.length - 1] = { type: 'text', text: last.text + delta['text'] }
+      else this.partial.push({ type: 'text', text: delta['text'] })
+    } else if (delta['type'] === 'thinking_delta' && typeof delta['thinking'] === 'string') {
+      if (last?.type === 'thinking') this.partial[this.partial.length - 1] = { type: 'thinking', thinking: last.thinking + delta['thinking'] }
+      else this.partial.push({ type: 'thinking', thinking: delta['thinking'] })
+    } else {
+      return
+    }
+    this.render()
+  }
+
+  private handleAssistant(message: unknown): void {
+    if (!isJsonObject(message) || !Array.isArray(message['content'])) return
+    const id = stringOrNull(message['id'])
+    if (id !== this.assistantMessageId) {
+      this.assistantMessageId = id
+      this.blocks = []
+    }
+    // Each stream-json `assistant` frame carries the content blocks that
+    // completed so far for one API message; deltas for those blocks are now
+    // authoritative in `blocks` and no longer needed as partial text.
+    this.partial = []
+    for (const block of message['content']) {
+      const part = convertClaudeBlock(block)
+      if (part) this.blocks.push(part)
+    }
+    this.render()
+    for (const part of this.blocks) {
+      if (part.type === 'toolCall' && !this.builder.hasOpenToolCall(part.id)) {
+        this.builder.trackToolCall(part.id, part.name)
+      }
+    }
+  }
+
+  private handleUser(message: unknown): void {
+    if (!isJsonObject(message) || !Array.isArray(message['content'])) return
+    for (const block of message['content']) {
+      if (!isJsonObject(block) || block['type'] !== 'tool_result') continue
+      const toolUseId = stringOrNull(block['tool_use_id'])
+      if (!toolUseId) continue
+      this.commitBlocks()
+      this.builder.toolResult(toolUseId, partsFromUnknownContent(block['content'] ?? ''), block['is_error'] === true)
+    }
+  }
+
+  private handleControlRequest(event: JsonObject): void {
+    const requestId = stringOrNull(event['request_id'])
+    const request = isJsonObject(event['request']) ? event['request'] : null
+    if (!requestId || !request) return
+    if (request['subtype'] !== 'can_use_tool') {
+      void this.ctx.channel.send({
+        type: 'control_response',
+        response: { subtype: 'error', request_id: requestId, error: `OpenAlice does not handle ${String(request['subtype'])}` },
+      })
+      return
+    }
+    const toolName = stringOrNull(request['tool_name']) ?? 'tool'
+    const id = `claude-${requestId}`
+    this.permissions.set(id, { requestId, input: request['input'] ?? {} })
+    const permission: WebPermissionRequest = {
+      id,
+      kind: 'permission',
+      title: toolName,
+      description: stringOrNull(request['description']) ?? 'Claude wants to use this tool.',
+      tool: { name: toolName, input: request['input'] ?? {} },
+      options: [
+        { id: ALLOW, label: 'Allow', tone: 'allow' },
+        { id: DENY, label: 'Deny', tone: 'deny' },
+      ],
+      createdAt: Date.now(),
+    }
+    this.ctx.state.addRequest(permission)
+  }
+
+  private finishTurn(event: JsonObject): void {
+    this.turnActive = false
+    for (const [id] of this.permissions) this.ctx.state.removeRequest(id)
+    this.permissions.clear()
+    this.commitBlocks()
+    this.builder.endTurn()
+    if (event['is_error'] === true) {
+      const errors = Array.isArray(event['errors']) ? event['errors'].map(String).join('\n') : ''
+      const detail = stringOrNull(event['result']) || errors || stringOrNull(event['subtype']) || 'Claude turn failed'
+      this.ctx.state.error = detail
+    }
+    this.ctx.state.setPhase('idle')
+  }
+
+  private render(): void {
+    this.ctx.state.setStreaming({ role: 'assistant', content: [...this.blocks, ...this.partial], timestamp: Date.now() })
+  }
+
+  private commitBlocks(): void {
+    if (this.blocks.length === 0 && this.partial.length === 0) return
+    this.render()
+    this.ctx.state.commitStreaming()
+    this.blocks = []
+    this.partial = []
+    this.assistantMessageId = null
+  }
+}
+
+function convertClaudeBlock(block: unknown): WebContentPart | null {
+  if (!isJsonObject(block)) return null
+  switch (block['type']) {
+    case 'text':
+      return typeof block['text'] === 'string' && block['text'] ? { type: 'text', text: block['text'] } : null
+    case 'thinking':
+      return { type: 'thinking', thinking: stringOrNull(block['thinking']) ?? '' }
+    case 'tool_use':
+      return {
+        type: 'toolCall',
+        id: stringOrNull(block['id']) ?? `tool-${Date.now()}`,
+        name: stringOrNull(block['name']) ?? 'tool',
+        arguments: block['input'] ?? {},
+      }
+    default:
+      return { type: 'data', value: block }
+  }
+}
diff --git a/src/workspaces/web-session/codex-app-server-transport.ts b/src/workspaces/web-session/codex-app-server-transport.ts
new file mode 100644
index 0000000000..14c83568cd
--- /dev/null
+++ b/src/workspaces/web-session/codex-app-server-transport.ts
@@ -0,0 +1,401 @@
+/**
+ * Codex `app-server` over stdio (JSON-RPC 2.0 without the version header).
+ *
+ * Threads are Codex's sessions; a Web session resumes the recorded thread or
+ * starts a new one, drives turns with `turn/start`, and answers command,
+ * file-change, permission, and user-input requests from the browser.
+ */
+import { JsonRpcPeer } from './json-rpc.js'
+import {
+  isJsonObject,
+  stringOrNull,
+  type JsonObject,
+  type WebContentPart,
+  type WebPermissionRequest,
+  type WebRequestOption,
+} from './model.js'
+import { TranscriptBuilder } from './transcript-builder.js'
+import type { WebSessionTransport, WebTransportContext } from './transport.js'
+
+const THREAD_TIMEOUT_MS = 60_000
+
+type Answer = (value: unknown) => void
+
+interface PendingApproval {
+  readonly answer: Answer
+  readonly respondWith: (optionId: string) => unknown
+}
+
+const DEFAULT_DECISIONS: readonly WebRequestOption[] = [
+  { id: 'accept', label: 'Approve', tone: 'allow' },
+  { id: 'acceptForSession', label: 'Approve for this session', tone: 'allow' },
+  { id: 'decline', label: 'Decline', tone: 'deny' },
+]
+
+export class CodexAppServerTransport implements WebSessionTransport {
+  private readonly peer: JsonRpcPeer
+  private readonly builder: TranscriptBuilder
+  private readonly approvals = new Map<string, PendingApproval>()
+  private readonly deltaItems = new Set<string>()
+  private threadId: string | null
+  private turnId: string | null = null
+  private requestSeq = 0
+
+  constructor(private readonly ctx: WebTransportContext) {
+    this.threadId = ctx.input.nativeSessionId ?? null
+    this.builder = new TranscriptBuilder(ctx.state)
+    this.peer = new JsonRpcPeer(ctx.channel, ctx.logger, {
+      onNotification: (method, params) => this.onNotification(method, params),
+      onRequest: (method, params, id) => this.onRequest(method, params, id),
+    }, { header: false })
+  }
+
+  async start(): Promise<void> {
+    await this.peer.request('initialize', {
+      clientInfo: { name: 'openalice', title: 'OpenAlice', version: '1' },
+      capabilities: {},
+    })
+    await this.peer.notify('initialized', {})
+    const options = {
+      cwd: this.ctx.input.cwd,
+      approvalPolicy: 'onRequest',
+      sandbox: 'workspaceWrite',
+      ...(this.ctx.input.model ? { model: this.ctx.input.model } : {}),
+    }
+    const result = this.threadId
+      ? await this.peer.request('thread/resume', { threadId: this.threadId, ...options }, THREAD_TIMEOUT_MS)
+      : await this.peer.request('thread/start', options, THREAD_TIMEOUT_MS)
+    const thread = isJsonObject(result) && isJsonObject(result['thread']) ? result['thread'] : null
+    const id = thread ? stringOrNull(thread['id']) : null
+    if (!id) throw new Error('Codex app-server returned no thread id')
+    this.threadId = id
+    if (thread && Array.isArray(thread['turns'])) this.replayHistory(thread['turns'])
+    this.ctx.state.setNativeSessionId(id)
+    this.ctx.state.setPhase('idle')
+  }
+
+  async prompt(message: string): Promise<void> {
+    const text = message.trim()
+    if (!text) throw new Error('prompt cannot be empty')
+    if (!this.threadId) throw new Error('Codex thread is not established')
+    if (this.turnId) throw new Error('Codex is still working on the previous prompt')
+    this.ctx.state.error = null
+    this.builder.user(text)
+    this.ctx.state.setPhase('working')
+    const result = await this.peer.request('turn/start', {
+      threadId: this.threadId,
+      input: [{ type: 'text', text }],
+    }).catch((error: Error) => {
+      this.ctx.state.setPhase('idle')
+      throw error
+    })
+    const turn = isJsonObject(result) && isJsonObject(result['turn']) ? result['turn'] : null
+    this.turnId = (turn ? stringOrNull(turn['id']) : null) ?? 'pending'
+  }
+
+  async abort(): Promise<void> {
+    if (!this.threadId || !this.turnId || this.turnId === 'pending') return
+    await this.peer.request('turn/interrupt', { threadId: this.threadId, turnId: this.turnId })
+  }
+
+  async respond(requestId: string, optionId: string): Promise<void> {
+    const request = this.ctx.state.requests.find((r) => r.id === requestId)
+    const pending = this.approvals.get(requestId)
+    if (!request || !pending) throw new Error(`no pending request ${requestId}`)
+    if (!request.options.some((option) => option.id === optionId)) {
+      throw new Error(`option ${optionId} is not offered by request ${requestId}`)
+    }
+    this.approvals.delete(requestId)
+    this.ctx.state.removeRequest(requestId)
+    pending.answer(pending.respondWith(optionId))
+  }
+
+  dispose(): void {
+    this.cancelApprovals()
+    this.peer.dispose(new Error('Codex session stopped'))
+  }
+
+  private onNotification(method: string, params: unknown): void {
+    const p = isJsonObject(params) ? params : {}
+    switch (method) {
+      case 'turn/started': {
+        const turn = isJsonObject(p['turn']) ? p['turn'] : null
+        const id = turn ? stringOrNull(turn['id']) : null
+        if (id) this.turnId = id
+        this.ctx.state.setPhase('working')
+        break
+      }
+      case 'turn/completed': {
+        const turn = isJsonObject(p['turn']) ? p['turn'] : null
+        this.turnId = null
+        this.cancelApprovals()
+        this.builder.endTurn()
+        this.deltaItems.clear()
+        if (turn?.['status'] === 'failed') {
+          const error = isJsonObject(turn['error']) ? turn['error'] : null
+          this.ctx.state.error = stringOrNull(error?.['message']) ?? 'Codex turn failed'
+        } else if (turn?.['status'] === 'interrupted') {
+          this.builder.notice('Turn interrupted.')
+        }
+        this.ctx.state.setPhase('idle')
+        break
+      }
+      case 'item/started':
+        this.onItemStarted(p['item'])
+        break
+      case 'item/completed':
+        this.onItemCompleted(p['item'])
+        break
+      case 'item/agentMessage/delta': {
+        const itemId = stringOrNull(p['itemId'])
+        if (itemId) this.deltaItems.add(itemId)
+        this.builder.text(stringOrNull(p['delta']) ?? '')
+        break
+      }
+      case 'item/reasoning/summaryTextDelta':
+      case 'item/reasoning/textDelta': {
+        const itemId = stringOrNull(p['itemId'])
+        if (itemId) this.deltaItems.add(itemId)
+        this.builder.thinking(stringOrNull(p['delta']) ?? '')
+        break
+      }
+      case 'item/reasoning/summaryPartAdded':
+        this.builder.thinking('\n\n')
+        break
+      case 'error': {
+        const error = isJsonObject(p['error']) ? p['error'] : p
+        this.ctx.state.error = stringOrNull(error['message']) ?? 'Codex reported an error'
+        this.ctx.state.bump()
+        break
+      }
+      case 'warning':
+        this.ctx.logger.warn('web_session.codex_warning', { message: p['message'] })
+        break
+      default:
+        break
+    }
+  }
+
+  private onItemStarted(raw: unknown): void {
+    if (!isJsonObject(raw)) return
+    const id = stringOrNull(raw['id'])
+    if (!id) return
+    switch (raw['type']) {
+      case 'commandExecution':
+        this.builder.toolCall(id, 'shell', { command: raw['command'], cwd: raw['cwd'] })
+        break
+      case 'fileChange':
+        this.builder.toolCall(id, 'apply_patch', { changes: raw['changes'] ?? [] })
+        break
+      case 'mcpToolCall':
+        this.builder.toolCall(id, `${stringOrNull(raw['server']) ?? 'mcp'}/${stringOrNull(raw['tool']) ?? 'tool'}`, raw['arguments'] ?? {})
+        break
+      case 'webSearch':
+        this.builder.toolCall(id, 'web_search', { query: raw['query'] })
+        break
+      case 'imageGeneration':
+        this.builder.toolCall(id, 'image_generation', {})
+        break
+      case 'contextCompaction':
+        this.ctx.state.setPhase('compacting')
+        break
+      default:
+        break
+    }
+  }
+
+  private onItemCompleted(raw: unknown): void {
+    if (!isJsonObject(raw)) return
+    const id = stringOrNull(raw['id'])
+    if (!id) return
+    const streamed = this.deltaItems.has(id)
+    switch (raw['type']) {
+      case 'agentMessage':
+        if (!streamed) this.builder.text(stringOrNull(raw['text']) ?? '')
+        break
+      case 'reasoning':
+        if (!streamed) {
+          const summary = Array.isArray(raw['summary']) ? raw['summary'].map(String).join('\n\n') : ''
+          const content = Array.isArray(raw['content']) ? raw['content'].map(String).join('\n\n') : ''
+          this.builder.thinking(summary || content)
+        }
+        break
+      case 'commandExecution': {
+        const command = commandLabel(raw['command'])
+        const output = stringOrNull(raw['aggregatedOutput']) ?? ''
+        const exitCode = raw['exitCode']
+        const text = [
+          `$ ${command}`,
+          output.trimEnd(),
+          exitCode === undefined || exitCode === null ? '' : `(exit ${String(exitCode)})`,
+        ].filter(Boolean).join('\n')
+        this.builder.toolResult(id, text, raw['status'] === 'failed' || raw['status'] === 'declined')
+        break
+      }
+      case 'fileChange': {
+        const changes = Array.isArray(raw['changes']) ? raw['changes'] : []
+        const text = changes.map((change) => {
+          if (!isJsonObject(change)) return ''
+          const diff = stringOrNull(change['diff'])
+          return `${stringOrNull(change['kind']) ?? 'edit'} ${stringOrNull(change['path']) ?? ''}${diff ? `\n\`\`\`diff\n${diff}\n\`\`\`` : ''}`
+        }).filter(Boolean).join('\n\n')
+        this.builder.toolResult(id, text || 'No file changes', raw['status'] === 'failed' || raw['status'] === 'declined')
+        break
+      }
+      case 'mcpToolCall': {
+        const failed = raw['status'] === 'failed'
+        const body: readonly WebContentPart[] = failed
+          ? [{ type: 'text', text: stringOrNull(isJsonObject(raw['error']) ? raw['error']['message'] : raw['error']) ?? 'MCP call failed' }]
+          : [{ type: 'data', value: raw['result'] ?? null }]
+        this.builder.toolResult(id, body, failed)
+        break
+      }
+      case 'webSearch':
+        this.builder.toolResult(id, [{ type: 'data', value: raw['results'] ?? raw['action'] ?? null }], false)
+        break
+      case 'imageGeneration':
+        this.builder.toolResult(id, stringOrNull(raw['savedPath']) ?? 'Image generated', raw['status'] === 'failed')
+        break
+      case 'contextCompaction':
+        this.builder.notice('Codex compacted the conversation context.')
+        if (this.turnId) this.ctx.state.setPhase('working')
+        break
+      default:
+        break
+    }
+  }
+
+  private replayHistory(turns: readonly unknown[]): void {
+    for (const turn of turns) {
+      if (!isJsonObject(turn) || !Array.isArray(turn['items'])) continue
+      for (const item of turn['items']) {
+        if (!isJsonObject(item)) continue
+        if (item['type'] === 'userMessage') {
+          const content = Array.isArray(item['content']) ? item['content'] : []
+          const text = content.map((part) => (isJsonObject(part) && typeof part['text'] === 'string' ? part['text'] : '')).filter(Boolean).join('\n')
+          this.builder.user(text)
+          continue
+        }
+        this.onItemStarted(item)
+        this.onItemCompleted(item)
+      }
+      this.builder.endTurn()
+    }
+    this.deltaItems.clear()
+  }
+
+  private async onRequest(method: string, params: unknown, _id: string | number): Promise<unknown> {
+    const p = isJsonObject(params) ? params : {}
+    switch (method) {
+      case 'item/commandExecution/requestApproval':
+        return this.approval(p, {
+          title: `Run ${commandLabel(p['command'])}`,
+          description: stringOrNull(p['reason']) ?? `Codex wants to run a command in ${stringOrNull(p['cwd']) ?? 'the workspace'}.`,
+          tool: { name: 'shell', input: { command: p['command'], cwd: p['cwd'] } },
+        })
+      case 'item/fileChange/requestApproval':
+        return this.approval(p, {
+          title: 'Apply file changes',
+          description: stringOrNull(p['reason']) ?? 'Codex wants to edit files in the workspace.',
+          tool: { name: 'apply_patch', input: { itemId: p['itemId'], grantRoot: p['grantRoot'] } },
+        })
+      case 'item/permissions/requestApproval':
+        return this.approval(p, {
+          title: 'Grant additional permissions',
+          description: 'Codex requests network or filesystem access beyond its sandbox.',
+          tool: { name: 'request_permissions', input: p['permissions'] ?? p },
+        }, [
+          { id: 'accept', label: 'Grant', tone: 'allow' },
+          { id: 'decline', label: 'Decline', tone: 'deny' },
+        ])
+      case 'item/tool/requestUserInput':
+        return this.userInput(p)
+      default: {
+        const error = new Error(`OpenAlice does not implement ${method}`) as Error & { code: number }
+        error.code = -32601
+        throw error
+      }
+    }
+  }
+
+  private approval(
+    params: JsonObject,
+    shape: { title: string; description: string; tool: WebPermissionRequest['tool'] },
+    fallback: readonly WebRequestOption[] = DEFAULT_DECISIONS,
+  ): Promise<unknown> {
+    const available = Array.isArray(params['availableDecisions'])
+      ? params['availableDecisions'].flatMap((decision): WebRequestOption[] => {
+          const id = typeof decision === 'string' ? decision : null
+          if (!id) return []
+          return [{ id, label: decisionLabel(id), tone: id.startsWith('accept') || id.startsWith('apply') ? 'allow' : 'deny' }]
+        })
+      : []
+    const options = available.length > 0 ? available : fallback
+    return this.enqueue({
+      kind: 'permission',
+      title: shape.title,
+      description: shape.description,
+      ...(shape.tool ? { tool: shape.tool } : {}),
+      options,
+    }, (optionId) => ({ decision: optionId }))
+  }
+
+  private async userInput(params: JsonObject): Promise<unknown> {
+    const questions = Array.isArray(params['questions']) ? params['questions'].filter(isJsonObject) : []
+    const answers: Record<string, { answers: string[] }> = {}
+    for (const question of questions) {
+      const questionId = stringOrNull(question['id']) ?? `q${Object.keys(answers).length}`
+      const options = Array.isArray(question['options'])
+        ? question['options'].flatMap((option): WebRequestOption[] => {
+            if (!isJsonObject(option)) return []
+            const label = stringOrNull(option['label'])
+            return label ? [{ id: label, label, tone: 'neutral' }] : []
+          })
+        : []
+      const choice = await this.enqueue({
+        kind: 'question',
+        title: stringOrNull(question['header']) ?? 'Codex has a question',
+        description: stringOrNull(question['question']) ?? '',
+        options: options.length > 0 ? options : [{ id: '', label: 'Continue without an answer', tone: 'neutral' }],
+      }, (optionId) => optionId)
+      answers[questionId] = { answers: typeof choice === 'string' && choice ? [choice] : [] }
+    }
+    return { answers }
+  }
+
+  private enqueue(
+    request: Omit<WebPermissionRequest, 'id' | 'createdAt'>,
+    respondWith: (optionId: string) => unknown,
+  ): Promise<unknown> {
+    this.requestSeq += 1
+    const id = `codex-${this.requestSeq}`
+    return new Promise<unknown>((resolve) => {
+      this.approvals.set(id, { answer: resolve, respondWith })
+      this.ctx.state.addRequest({ ...request, id, createdAt: Date.now() })
+    })
+  }
+
+  private cancelApprovals(): void {
+    for (const [id, pending] of this.approvals) {
+      this.approvals.delete(id)
+      this.ctx.state.removeRequest(id)
+      pending.answer({ decision: 'cancel' })
+    }
+  }
+}
+
+function commandLabel(command: unknown): string {
+  if (typeof command === 'string') return command
+  if (Array.isArray(command)) return command.map(String).join(' ')
+  return 'command'
+}
+
+function decisionLabel(id: string): string {
+  switch (id) {
+    case 'accept': return 'Approve'
+    case 'acceptForSession': return 'Approve for this session'
+    case 'decline': return 'Decline'
+    case 'cancel': return 'Cancel'
+    default: return id
+  }
+}
diff --git a/src/workspaces/web-session/json-rpc.ts b/src/workspaces/web-session/json-rpc.ts
new file mode 100644
index 0000000000..0584ccb169
--- /dev/null
+++ b/src/workspaces/web-session/json-rpc.ts
@@ -0,0 +1,99 @@
+import type { Logger } from '../logger.js'
+import { isJsonObject, type JsonObject } from './model.js'
+import { PendingRequests, REQUEST_TIMEOUT_MS, type JsonlChannel } from './transport.js'
+
+export interface JsonRpcError extends Error {
+  readonly code: number
+  readonly data?: unknown
+}
+
+export interface JsonRpcPeerHandlers {
+  readonly onNotification: (method: string, params: unknown) => void
+  /** Server-initiated request; the returned value becomes the JSON-RPC result. */
+  readonly onRequest: (method: string, params: unknown, id: string | number) => Promise<unknown>
+}
+
+/**
+ * Minimal bidirectional JSON-RPC 2.0 over a JSONL channel. ACP and Codex
+ * app-server both use it; Codex omits the `jsonrpc` header on the wire, so the
+ * header is optional on input and configurable on output.
+ */
+export class JsonRpcPeer {
+  private readonly pending = new PendingRequests<unknown>('web-rpc')
+
+  constructor(
+    private readonly channel: JsonlChannel,
+    private readonly logger: Logger,
+    private readonly handlers: JsonRpcPeerHandlers,
+    private readonly options: { readonly header: boolean } = { header: true },
+  ) {
+    channel.onMessage((message) => this.handle(message))
+  }
+
+  request(method: string, params: unknown = {}, timeoutMs: number | null = REQUEST_TIMEOUT_MS): Promise<unknown> {
+    if (this.channel.closed) return Promise.reject(new Error(`${method}: process exited`))
+    const id = this.pending.nextId()
+    const wait = this.pending.wait(id, method, timeoutMs)
+    void this.channel.send(this.frame({ id, method, params })).catch((error: Error) => this.pending.reject(id, error))
+    return wait
+  }
+
+  notify(method: string, params: unknown = {}): Promise<void> {
+    if (this.channel.closed) return Promise.resolve()
+    return this.channel.send(this.frame({ method, params })).catch((error: Error) => {
+      this.logger.warn('web_session.notify_failed', { method, error })
+    })
+  }
+
+  respond(id: string | number, result: unknown): Promise<void> {
+    return this.channel.send(this.frame({ id, result })).catch((error: Error) => {
+      this.logger.warn('web_session.respond_failed', { id, error })
+    })
+  }
+
+  respondError(id: string | number, code: number, message: string): Promise<void> {
+    return this.channel.send(this.frame({ id, error: { code, message } })).catch((error: Error) => {
+      this.logger.warn('web_session.respond_failed', { id, error })
+    })
+  }
+
+  dispose(error: Error): void {
+    this.pending.rejectAll(error)
+  }
+
+  private frame(body: JsonObject): JsonObject {
+    return this.options.header ? { jsonrpc: '2.0', ...body } : body
+  }
+
+  private handle(message: JsonObject): void {
+    const id = message['id']
+    const hasId = typeof id === 'string' || typeof id === 'number'
+    if (typeof message['method'] === 'string') {
+      if (hasId) {
+        void this.handlers.onRequest(message['method'], message['params'], id)
+          .then((result) => this.respond(id, result ?? {}))
+          .catch((error: unknown) => {
+            const rpc = error as Partial<JsonRpcError>
+            return this.respondError(id, typeof rpc.code === 'number' ? rpc.code : -32603, rpc.message ?? String(error))
+          })
+      } else {
+        this.handlers.onNotification(message['method'], message['params'])
+      }
+      return
+    }
+    if (!hasId) return
+    const key = String(id)
+    if ('error' in message && message['error'] !== null && message['error'] !== undefined) {
+      const error = message['error']
+      const detail = isJsonObject(error) ? error : { message: String(error) }
+      const failure = new Error(
+        `${this.pending.label(key) ?? 'request'} failed: ${String(detail['message'] ?? 'unknown error')}`,
+      ) as JsonRpcError & { code: number; data?: unknown }
+      failure.code = typeof detail['code'] === 'number' ? detail['code'] : -32000
+      failure.data = detail['data']
+      this.pending.reject(key, failure)
+      return
+    }
+    this.pending.resolve(key, message['result'])
+  }
+}
diff --git a/src/workspaces/web-session/model.ts b/src/workspaces/web-session/model.ts
new file mode 100644
index 0000000000..07f9f80c24
--- /dev/null
+++ b/src/workspaces/web-session/model.ts
@@ -0,0 +1,105 @@
+/**
+ * Neutral live-conversation model shared by every Web transport.
+ *
+ * This is presentation-grade state for the browser, not a persisted store.
+ * Each runtime's own transcript (Pi JSONL, Claude project files, Codex
+ * rollouts, ACP agent storage) stays the durable conversation; Alice keeps one
+ * live process per Session record and projects its protocol into this shape.
+ * The shape borrows Pi's minimal message model on purpose: every supported
+ * wire maps onto it without inventing a new schema, and the browser presenter
+ * already groups it into turns.
+ */
+
+import type { WebSessionWire } from '../cli-adapter.js'
+
+export type { WebSessionWire }
+
+export type WebContentPart =
+  | { readonly type: 'text'; readonly text: string }
+  | { readonly type: 'thinking'; readonly thinking: string }
+  | { readonly type: 'toolCall'; readonly id: string; readonly name: string; readonly arguments: unknown }
+  | { readonly type: 'data'; readonly value: unknown }
+
+export type WebConversationMessage =
+  | { readonly role: 'user'; readonly content: readonly WebContentPart[] | string; readonly timestamp?: number }
+  | { readonly role: 'assistant'; readonly content: readonly WebContentPart[]; readonly timestamp?: number }
+  | {
+      readonly role: 'toolResult'
+      readonly toolCallId: string
+      readonly toolName: string
+      readonly content: readonly WebContentPart[] | string
+      readonly isError: boolean
+      readonly timestamp?: number
+    }
+  | { readonly role: 'notice'; readonly text: string; readonly timestamp?: number }
+  /** A runtime record the transport could not classify; kept for the audit trail. */
+  | { readonly role: 'unknown'; readonly value: unknown; readonly timestamp?: number }
+
+export type WebRequestOptionTone = 'allow' | 'deny' | 'neutral'
+
+export interface WebRequestOption {
+  readonly id: string
+  readonly label: string
+  readonly tone: WebRequestOptionTone
+}
+
+/**
+ * A question the runtime cannot answer on its own: a tool permission, a file
+ * change approval, or a free-form user question. The browser presents the
+ * options verbatim and answers with one `optionId`.
+ */
+export interface WebPermissionRequest {
+  readonly id: string
+  readonly kind: 'permission' | 'question'
+  readonly title: string
+  readonly description?: string
+  readonly tool?: { readonly name: string; readonly input: unknown }
+  readonly options: readonly WebRequestOption[]
+  readonly createdAt: number
+}
+
+export type WebSessionPhase =
+  | 'starting'
+  | 'idle'
+  | 'working'
+  | 'awaiting-input'
+  | 'compacting'
+  | 'retrying'
+  | 'stopped'
+  | 'failed'
+
+export interface WebSessionSnapshot {
+  readonly recordId: string
+  readonly wsId: string
+  readonly resumeId: string
+  readonly agent: string
+  readonly wire: WebSessionWire
+  /** Runtime-owned session identity once the transport has learned it. */
+  readonly nativeSessionId: string | null
+  readonly pid: number | null
+  readonly startedAt: number
+  readonly phase: WebSessionPhase
+  readonly messages: readonly WebConversationMessage[]
+  /** Current cumulative in-flight assistant message; replaced, never accumulated. */
+  readonly streamingMessage: WebConversationMessage | null
+  readonly requests: readonly WebPermissionRequest[]
+  readonly error: string | null
+  readonly stderrTail: string
+  readonly revision: number
+}
+
+export type JsonObject = Record<string, unknown>
+
+export function isJsonObject(value: unknown): value is JsonObject {
+  return typeof value === 'object' && value !== null && !Array.isArray(value)
+}
+
+export function stringOrNull(value: unknown): string | null {
+  return typeof value === 'string' ? value : null
+}
+
+/** Plain text of a neutral message body, for presenters and summaries. */
+export function webContentText(content: readonly WebContentPart[] | string): string {
+  if (typeof content === 'string') return content
+  return content.flatMap((part) => (part.type === 'text' ? [part.text] : [])).join('\n')
+}
diff --git a/src/workspaces/web-session/pi-rpc-transport.ts b/src/workspaces/web-session/pi-rpc-transport.ts
new file mode 100644
index 0000000000..127ec2e29b
--- /dev/null
+++ b/src/workspaces/web-session/pi-rpc-transport.ts
@@ -0,0 +1,212 @@
+/**
+ * Pi's documented `--mode rpc` (and Oh My Pi's protocol-compatible fork).
+ *
+ * Pi exposes a canonical message list through `get_messages`, so this
+ * transport refreshes that list at turn boundaries instead of accumulating
+ * deltas. `message_update` frames only replace the streaming message.
+ */
+import {
+  isJsonObject,
+  stringOrNull,
+  type JsonObject,
+  type WebContentPart,
+  type WebConversationMessage,
+} from './model.js'
+import {
+  PendingRequests,
+  type WebSessionTransport,
+  type WebTransportContext,
+} from './transport.js'
+
+const MAX_PROMPT_CHARS = 16_000
+
+export class PiRpcTransport implements WebSessionTransport {
+  private readonly pending = new PendingRequests<JsonObject>('web-rpc')
+  private refreshTimer: ReturnType<typeof setTimeout> | null = null
+  private disposed = false
+
+  constructor(private readonly ctx: WebTransportContext) {
+    ctx.channel.onMessage((event) => this.handleMessage(event))
+  }
+
+  async start(): Promise<void> {
+    const rpcState = await this.refresh()
+    this.ctx.state.setPhase(phaseFromRpcState(rpcState))
+  }
+
+  async prompt(message: string): Promise<void> {
+    const trimmed = message.trim()
+    if (!trimmed) throw new Error('prompt cannot be empty')
+    if (trimmed.length > MAX_PROMPT_CHARS) throw new Error(`prompt exceeds ${MAX_PROMPT_CHARS} characters`)
+    this.ctx.state.error = null
+    this.ctx.state.setPhase('working')
+    await this.request('prompt', { message: trimmed })
+    this.scheduleRefresh(50)
+  }
+
+  async abort(): Promise<void> {
+    await this.request('abort')
+    this.scheduleRefresh(0)
+  }
+
+  async respond(requestId: string): Promise<void> {
+    throw new Error(`Pi RPC has no pending request ${requestId}`)
+  }
+
+  dispose(): void {
+    this.disposed = true
+    if (this.refreshTimer) clearTimeout(this.refreshTimer)
+    this.refreshTimer = null
+    this.pending.rejectAll(new Error('Pi RPC stopped'))
+  }
+
+  private async refresh(): Promise<JsonObject | null> {
+    const [stateResponse, messageResponse] = await Promise.all([
+      this.request('get_state'),
+      this.request('get_messages'),
+    ])
+    const nextState = isJsonObject(stateResponse['data']) ? stateResponse['data'] : null
+    if (nextState) {
+      const id = stringOrNull(nextState['sessionId']) ?? stringOrNull(nextState['session_id'])
+      if (id) this.ctx.state.setNativeSessionId(id)
+    }
+    const data = messageResponse['data']
+    if (isJsonObject(data) && Array.isArray(data['messages'])) {
+      this.ctx.state.replaceMessages(data['messages'].map(convertPiMessage))
+    }
+    this.ctx.state.bump()
+    return nextState
+  }
+
+  private scheduleRefresh(delayMs: number): void {
+    if (this.disposed) return
+    if (this.refreshTimer) clearTimeout(this.refreshTimer)
+    this.refreshTimer = setTimeout(() => {
+      this.refreshTimer = null
+      void this.refresh().catch((error: Error) => {
+        if (!this.disposed && !this.ctx.channel.closed) this.ctx.state.fail(error.message)
+      })
+    }, delayMs)
+  }
+
+  private request(command: string, payload: JsonObject = {}): Promise<JsonObject> {
+    if (this.ctx.channel.closed) return Promise.reject(new Error('Pi RPC process exited'))
+    const id = this.pending.nextId()
+    const wait = this.pending.wait(id, `Pi RPC ${command}`)
+    void this.ctx.channel.send({ id, type: command, ...payload }).catch((error: Error) => {
+      this.pending.reject(id, error)
+    })
+    return wait
+  }
+
+  private handleMessage(event: JsonObject): void {
+    if (event['type'] === 'response' && typeof event['id'] === 'string') {
+      const label = this.pending.label(event['id'])
+      if (!label) return
+      if (event['success'] === false) {
+        this.pending.reject(event['id'], new Error(stringOrNull(event['error']) ?? `${label} failed`))
+      } else {
+        this.pending.resolve(event['id'], event)
+      }
+      return
+    }
+    this.handleEvent(event)
+  }
+
+  private handleEvent(event: JsonObject): void {
+    const state = this.ctx.state
+    switch (event['type']) {
+      case 'ready':
+        // Oh My Pi announces protocol versions before serving commands.
+        break
+      case 'agent_start':
+      case 'turn_start':
+        state.phase = 'working'
+        break
+      case 'message_update':
+        state.streamingMessage = isJsonObject(event['message']) ? convertPiMessage(event['message']) : null
+        break
+      case 'message_end':
+      case 'tool_execution_end':
+      case 'queue_update':
+        this.scheduleRefresh(30)
+        break
+      case 'agent_settled':
+        state.phase = 'idle'
+        state.streamingMessage = null
+        this.scheduleRefresh(0)
+        break
+      case 'compaction_start':
+        state.phase = 'compacting'
+        break
+      case 'compaction_end':
+        state.phase = 'working'
+        this.scheduleRefresh(0)
+        break
+      case 'auto_retry_start':
+        state.phase = 'retrying'
+        break
+      case 'auto_retry_end':
+        state.phase = 'working'
+        break
+      case 'extension_error':
+        state.error = stringOrNull(event['error']) ?? 'Pi extension failed'
+        break
+      default:
+        break
+    }
+    state.bump()
+  }
+}
+
+function phaseFromRpcState(state: JsonObject | null): 'compacting' | 'working' | 'idle' {
+  if (state?.['isCompacting'] === true) return 'compacting'
+  return state?.['isStreaming'] === true ? 'working' : 'idle'
+}
+
+/** Pi's AgentMessage already matches the neutral shape; validate rather than translate. */
+export function convertPiMessage(value: unknown): WebConversationMessage {
+  if (!isJsonObject(value)) return { role: 'unknown', value }
+  const timestamp = typeof value['timestamp'] === 'number' ? { timestamp: value['timestamp'] } : {}
+  switch (value['role']) {
+    case 'user':
+      return { role: 'user', content: piContent(value['content']), ...timestamp }
+    case 'assistant': {
+      const content = piContent(value['content'])
+      return { role: 'assistant', content: typeof content === 'string' ? [{ type: 'text', text: content }] : content, ...timestamp }
+    }
+    case 'toolResult':
+    case 'tool':
+      return {
+        role: 'toolResult',
+        toolCallId: stringOrNull(value['toolCallId']) ?? '',
+        toolName: stringOrNull(value['toolName']) ?? 'tool',
+        content: piContent(value['content']),
+        isError: value['isError'] === true,
+        ...timestamp,
+      }
+    default:
+      return { role: 'unknown', value, ...timestamp }
+  }
+}
+
+function piContent(value: unknown): readonly WebContentPart[] | string {
+  if (typeof value === 'string') return value
+  if (!Array.isArray(value)) return value === undefined ? '' : [{ type: 'data', value }]
+  return value.map((part): WebContentPart => {
+    if (!isJsonObject(part)) return { type: 'data', value: part }
+    if (part['type'] === 'text' && typeof part['text'] === 'string') return { type: 'text', text: part['text'] }
+    if (part['type'] === 'thinking') {
+      return { type: 'thinking', thinking: stringOrNull(part['thinking']) ?? stringOrNull(part['text']) ?? '' }
+    }
+    if (part['type'] === 'toolCall') {
+      return {
+        type: 'toolCall',
+        id: stringOrNull(part['id']) ?? stringOrNull(part['toolCallId']) ?? '',
+        name: stringOrNull(part['name']) ?? 'tool',
+        arguments: part['arguments'] ?? {},
+      }
+    }
+    return { type: 'data', value: part }
+  })
+}
diff --git a/src/workspaces/web-session/transcript-builder.ts b/src/workspaces/web-session/transcript-builder.ts
new file mode 100644
index 0000000000..115925bad9
--- /dev/null
+++ b/src/workspaces/web-session/transcript-builder.ts
@@ -0,0 +1,132 @@
+import type { WebContentPart, WebConversationMessage } from './model.js'
+import type { WebSessionState } from './transport.js'
+
+/**
+ * Turns an event stream (deltas, tool starts, tool results) into the neutral
+ * message list. Protocols that expose a canonical message list (Pi RPC) do not
+ * need this; ACP, Claude stream-json, and Codex app-server all stream.
+ *
+ * The in-flight assistant message lives in `state.streamingMessage`. A tool
+ * result closes it (matching how Pi persists assistant/toolResult hops), and
+ * later text opens a fresh one so the browser groups the whole exchange into a
+ * single turn.
+ */
+export class TranscriptBuilder {
+  private readonly toolNames = new Map<string, string>()
+  private readonly openToolCalls = new Set<string>()
+
+  constructor(private readonly state: WebSessionState) {}
+
+  user(content: string | readonly WebContentPart[]): void {
+    this.state.commitStreaming()
+    this.state.append({ role: 'user', content, timestamp: Date.now() })
+  }
+
+  text(delta: string): void {
+    if (!delta) return
+    const parts = [...this.streamingParts()]
+    const last = parts[parts.length - 1]
+    if (last?.type === 'text') parts[parts.length - 1] = { type: 'text', text: last.text + delta }
+    else parts.push({ type: 'text', text: delta })
+    this.setParts(parts)
+  }
+
+  /** Replace the accumulated text with a full snapshot (cumulative protocols). */
+  textSnapshot(text: string): void {
+    const parts: WebContentPart[] = this.streamingParts().filter((part) => part.type !== 'text')
+    if (text) parts.push({ type: 'text', text })
+    this.setParts(parts)
+  }
+
+  thinking(delta: string): void {
+    if (!delta) return
+    const parts = [...this.streamingParts()]
+    const last = parts[parts.length - 1]
+    if (last?.type === 'thinking') parts[parts.length - 1] = { type: 'thinking', thinking: last.thinking + delta }
+    else parts.push({ type: 'thinking', thinking: delta })
+    this.setParts(parts)
+  }
+
+  toolCall(id: string, name: string, args: unknown): void {
+    this.toolNames.set(id, name)
+    this.openToolCalls.add(id)
+    const parts = this.streamingParts().filter((part) => !(part.type === 'toolCall' && part.id === id))
+    parts.push({ type: 'toolCall', id, name, arguments: args })
+    this.setParts(parts)
+  }
+
+  /** Record a call that the caller already rendered into the streaming message. */
+  trackToolCall(id: string, name: string): void {
+    this.toolNames.set(id, name)
+    this.openToolCalls.add(id)
+  }
+
+  /** Update an in-flight call whose name or input arrived after it started. */
+  toolCallUpdate(id: string, update: { name?: string; args?: unknown }): void {
+    if (!this.openToolCalls.has(id)) {
+      this.toolCall(id, update.name ?? this.toolNames.get(id) ?? 'tool', update.args ?? {})
+      return
+    }
+    if (update.name) this.toolNames.set(id, update.name)
+    const parts = this.streamingParts().map((part): WebContentPart => (
+      part.type === 'toolCall' && part.id === id
+        ? { type: 'toolCall', id, name: update.name ?? part.name, arguments: update.args ?? part.arguments }
+        : part
+    ))
+    this.setParts(parts)
+  }
+
+  toolResult(id: string, content: string | readonly WebContentPart[], isError: boolean, name?: string): void {
+    const toolName = name ?? this.toolNames.get(id) ?? 'tool'
+    if (!this.openToolCalls.has(id)) this.toolCall(id, toolName, {})
+    this.openToolCalls.delete(id)
+    this.state.commitStreaming()
+    this.state.append({ role: 'toolResult', toolCallId: id, toolName, content, isError, timestamp: Date.now() })
+  }
+
+  notice(text: string): void {
+    this.state.commitStreaming()
+    this.state.append({ role: 'notice', text, timestamp: Date.now() })
+  }
+
+  hasOpenToolCall(id: string): boolean {
+    return this.openToolCalls.has(id)
+  }
+
+  toolName(id: string): string | null {
+    return this.toolNames.get(id) ?? null
+  }
+
+  endTurn(): void {
+    // Calls that never reported a result are closed as failed so the browser
+    // does not show a spinner forever after an interrupted turn.
+    for (const id of [...this.openToolCalls]) {
+      this.toolResult(id, 'No result: the turn ended before this call finished.', true)
+    }
+    this.state.commitStreaming()
+  }
+
+  private streamingParts(): readonly WebContentPart[] {
+    const streaming = this.state.streamingMessage
+    return streaming?.role === 'assistant' ? streaming.content : []
+  }
+
+  private setParts(parts: readonly WebContentPart[]): void {
+    this.state.setStreaming({ role: 'assistant', content: parts, timestamp: Date.now() })
+  }
+}
+
+export function partsFromUnknownContent(value: unknown): readonly WebContentPart[] | string {
+  if (typeof value === 'string') return value
+  if (!Array.isArray(value)) return [{ type: 'data', value }]
+  return value.map((entry): WebContentPart => {
+    if (typeof entry === 'string') return { type: 'text', text: entry }
+    if (entry && typeof entry === 'object') {
+      const record = entry as Record<string, unknown>
+      if (typeof record['text'] === 'string' && (record['type'] === 'text' || record['type'] === undefined)) {
+        return { type: 'text', text: record['text'] }
+      }
+    }
+    return { type: 'data', value: entry }
+  })
+}
diff --git a/src/workspaces/web-session/transport.ts b/src/workspaces/web-session/transport.ts
new file mode 100644
index 0000000000..5f83e2816c
--- /dev/null
+++ b/src/workspaces/web-session/transport.ts
@@ -0,0 +1,216 @@
+import type { Logger } from '../logger.js'
+import {
+  type JsonObject,
+  type WebConversationMessage,
+  type WebPermissionRequest,
+  type WebSessionPhase,
+  type WebSessionWire,
+} from './model.js'
+
+export interface StartWebSessionInput {
+  readonly recordId: string
+  readonly wsId: string
+  readonly resumeId: string
+  readonly agent: string
+  readonly wire: WebSessionWire
+  readonly command: readonly string[]
+  readonly cwd: string
+  readonly env: Readonly<Record<string, string>>
+  /**
+   * Native session to reopen. Absent means the transport must create a new
+   * runtime session and report its id through `WebSessionState.nativeSessionId`.
+   */
+  readonly nativeSessionId?: string
+  /** Runtime-specific launch options the transport may forward in-band. */
+  readonly model?: string
+  readonly reasoningEffort?: string
+}
+
+/**
+ * Mutable live state one transport owns. Every mutation bumps `revision` so
+ * the browser's `?revision=` long-poll sees each change exactly once.
+ */
+export class WebSessionState {
+  phase: WebSessionPhase = 'starting'
+  nativeSessionId: string | null = null
+  messages: readonly WebConversationMessage[] = []
+  streamingMessage: WebConversationMessage | null = null
+  requests: readonly WebPermissionRequest[] = []
+  error: string | null = null
+  revision = 0
+
+  constructor(private readonly onChange: () => void = () => undefined) {}
+
+  bump(): void {
+    this.revision += 1
+    this.onChange()
+  }
+
+  setPhase(phase: WebSessionPhase): void {
+    this.phase = phase
+    this.bump()
+  }
+
+  setNativeSessionId(id: string | null): void {
+    if (id === this.nativeSessionId) return
+    this.nativeSessionId = id
+    this.bump()
+  }
+
+  replaceMessages(messages: readonly WebConversationMessage[]): void {
+    this.messages = messages
+    this.bump()
+  }
+
+  append(message: WebConversationMessage): void {
+    this.messages = [...this.messages, message]
+    this.bump()
+  }
+
+  setStreaming(message: WebConversationMessage | null): void {
+    this.streamingMessage = message
+    this.bump()
+  }
+
+  /** Move the in-flight assistant message into the committed transcript. */
+  commitStreaming(): void {
+    const streaming = this.streamingMessage
+    if (!streaming) return
+    this.streamingMessage = null
+    if (streaming.role === 'assistant' && streaming.content.length === 0) {
+      this.bump()
+      return
+    }
+    this.messages = [...this.messages, streaming]
+    this.bump()
+  }
+
+  addRequest(request: WebPermissionRequest): void {
+    this.requests = [...this.requests.filter((r) => r.id !== request.id), request]
+    this.phase = 'awaiting-input'
+    this.bump()
+  }
+
+  removeRequest(requestId: string): WebPermissionRequest | null {
+    const request = this.requests.find((r) => r.id === requestId) ?? null
+    if (!request) return null
+    this.requests = this.requests.filter((r) => r.id !== requestId)
+    if (this.phase === 'awaiting-input' && this.requests.length === 0) this.phase = 'working'
+    this.bump()
+    return request
+  }
+
+  clearRequests(): readonly WebPermissionRequest[] {
+    const cleared = this.requests
+    this.requests = []
+    if (cleared.length > 0) this.bump()
+    return cleared
+  }
+
+  fail(message: string): void {
+    this.error = message
+    this.phase = 'failed'
+    this.bump()
+  }
+}
+
+/**
+ * Line-oriented JSON channel over the child's stdio. The host owns the
+ * process; transports only read complete JSON objects and write complete
+ * lines, so framing, decoding, and stderr capture stay in one place.
+ */
+export interface JsonlChannel {
+  send(value: unknown): Promise<void>
+  onMessage(handler: (value: JsonObject) => void): void
+  readonly closed: boolean
+}
+
+export interface WebTransportContext {
+  readonly input: StartWebSessionInput
+  readonly state: WebSessionState
+  readonly channel: JsonlChannel
+  readonly logger: Logger
+}
+
+/**
+ * One runtime protocol projected onto the neutral live model. Transports are
+ * created after the process spawns and must be idempotent to a `stop` that
+ * arrives before `start` resolves.
+ */
+export interface WebSessionTransport {
+  /** Establish or reopen the native session; resolves when prompts may be sent. */
+  start(): Promise<void>
+  prompt(message: string): Promise<void>
+  abort(): Promise<void>
+  /** Answer one outstanding request with the chosen option id. */
+  respond(requestId: string, optionId: string): Promise<void>
+  /** Polite shutdown before the host closes stdin and signals the process. */
+  dispose?(): void
+}
+
+export type WebTransportFactory = (ctx: WebTransportContext) => WebSessionTransport
+
+export const REQUEST_TIMEOUT_MS = 15_000
+
+interface Pending<T> {
+  readonly label: string
+  readonly resolve: (value: T) => void
+  readonly reject: (error: Error) => void
+  readonly timer: ReturnType<typeof setTimeout> | null
+}
+
+/** Request/response correlation shared by every protocol on this channel. */
+export class PendingRequests<T = JsonObject> {
+  private readonly pending = new Map<string, Pending<T>>()
+  private seq = 0
+
+  constructor(private readonly prefix: string) {}
+
+  nextId(): string {
+    this.seq += 1
+    return `${this.prefix}-${this.seq}`
+  }
+
+  /** `timeoutMs: null` waits indefinitely (long-running turns). */
+  wait(id: string, label: string, timeoutMs: number | null = REQUEST_TIMEOUT_MS): Promise<T> {
+    return new Promise<T>((resolve, reject) => {
+      const timer = timeoutMs === null
+        ? null
+        : setTimeout(() => {
+            this.pending.delete(id)
+            reject(new Error(`${label} timed out`))
+          }, timeoutMs)
+      this.pending.set(id, { label, resolve, reject, timer })
+    })
+  }
+
+  has(id: string): boolean {
+    return this.pending.has(id)
+  }
+
+  label(id: string): string | null {
+    return this.pending.get(id)?.label ?? null
+  }
+
+  resolve(id: string, value: T): boolean {
+    const pending = this.pending.get(id)
+    if (!pending) return false
+    if (pending.timer) clearTimeout(pending.timer)
+    this.pending.delete(id)
+    pending.resolve(value)
+    return true
+  }
+
+  reject(id: string, error: Error): boolean {
+    const pending = this.pending.get(id)
+    if (!pending) return false
+    if (pending.timer) clearTimeout(pending.timer)
+    this.pending.delete(id)
+    pending.reject(error)
+    return true
+  }
+
+  rejectAll(error: Error): void {
+    for (const [id] of this.pending) this.reject(id, error)
+  }
+}
diff --git a/src/workspaces/webpi-session-host.spec.ts b/src/workspaces/webpi-session-host.spec.ts
deleted file mode 100644
index 1b1d82ff5d..0000000000
--- a/src/workspaces/webpi-session-host.spec.ts
+++ /dev/null
@@ -1,157 +0,0 @@
-import { EventEmitter } from 'node:events'
-import { PassThrough } from 'node:stream'
-
-import { describe, expect, it, vi } from 'vitest'
-
-import type { Logger } from './logger.js'
-import { WebPiSessionHost, type StartWebPiInput } from './webpi-session-host.js'
-
-class FakeRpcProcess extends EventEmitter {
-  readonly pid = 4242
-  readonly stdin = new PassThrough()
-  readonly stdout = new PassThrough()
-  readonly stderr = new PassThrough()
-  private messages: unknown[] = []
-  private state: Record<string, unknown>
-
-  constructor(state: Record<string, unknown> = {}) {
-    super()
-    this.state = {
-      sessionId: 'native-pi', thinkingLevel: 'medium', isStreaming: false,
-      isCompacting: false, steeringMode: 'all', followUpMode: 'one-at-a-time',
-      autoCompactionEnabled: true, messageCount: 0, pendingMessageCount: 0,
-      ...state,
-    }
-    this.stdin.setEncoding('utf8')
-    let buffer = ''
-    this.stdin.on('data', (chunk: string) => {
-      buffer += chunk
-      let nl = buffer.indexOf('\n')
-      while (nl >= 0) {
-        const line = buffer.slice(0, nl)
-        buffer = buffer.slice(nl + 1)
-        if (line) this.command(JSON.parse(line) as Record<string, unknown>)
-        nl = buffer.indexOf('\n')
-      }
-    })
-    queueMicrotask(() => this.emit('spawn'))
-  }
-
-  kill(signal: NodeJS.Signals = 'SIGTERM'): boolean {
-    queueMicrotask(() => this.emit('exit', 0, signal))
-    return true
-  }
-
-  event(value: Record<string, unknown>): void {
-    this.line(value)
-  }
-
-  private command(command: Record<string, unknown>): void {
-    const id = command['id']
-    const type = command['type']
-    if (type === 'get_state') {
-      this.line({
-        type: 'response', id, command: type, success: true,
-        data: { ...this.state, messageCount: this.messages.length },
-      })
-      return
-    }
-    if (type === 'get_messages') {
-      this.line({ type: 'response', id, command: type, success: true, data: { messages: this.messages } })
-      return
-    }
-    if (type === 'prompt') {
-      const user = { role: 'user', content: command['message'] }
-      const partialA = { role: 'assistant', content: [{ type: 'text', text: 'hel' }] }
-      const partialB = { role: 'assistant', content: [{ type: 'text', text: 'hello' }] }
-      const assistant = partialB
-      this.messages = [...this.messages, user, assistant]
-      this.line({ type: 'response', id, command: type, success: true })
-      this.line({ type: 'agent_start' })
-      this.line({ type: 'message_update', message: partialA })
-      this.line({ type: 'message_update', message: partialB })
-      this.line({ type: 'message_end', message: assistant })
-      this.line({ type: 'agent_settled' })
-      return
-    }
-    if (type === 'abort') {
-      this.line({ type: 'response', id, command: type, success: true })
-    }
-  }
-
-  private line(value: unknown): void {
-    this.stdout.write(`${JSON.stringify(value)}\n`)
-  }
-}
-
-const logger = {
-  child: () => logger,
-  info: vi.fn(),
-  warn: vi.fn(),
-  error: vi.fn(),
-} as unknown as Logger
-
-const input: StartWebPiInput = {
-  recordId: 'pi-record',
-  wsId: 'chat-ws',
-  resumeId: 'resume-pi',
-  command: ['pi', '--session-id', 'native-pi', '--mode', 'rpc'],
-  cwd: '/tmp/workspace',
-  env: {},
-}
-
-describe('WebPiSessionHost', () => {
-  it('opens one RPC view and exposes Pi messages without accumulating update frames', async () => {
-    const host = new WebPiSessionHost(logger, {}, () => new FakeRpcProcess() as never)
-    const started = await host.start(input)
-    expect(started.phase).toBe('idle')
-    expect(started.messages).toEqual([])
-
-    await host.prompt(input.recordId, 'hi')
-    await new Promise((resolve) => setTimeout(resolve, 80))
-    const snapshot = host.get(input.recordId)
-    expect(snapshot?.phase).toBe('idle')
-    expect(snapshot?.messages).toEqual([
-      { role: 'user', content: 'hi' },
-      { role: 'assistant', content: [{ type: 'text', text: 'hello' }] },
-    ])
-    expect(snapshot?.streamingMessage).toBeNull()
-  })
-
-  it('deduplicates repeated opens and stops intentionally', async () => {
-    let spawns = 0
-    const onExit = vi.fn()
-    const host = new WebPiSessionHost(logger, { onExit }, () => {
-      spawns += 1
-      return new FakeRpcProcess() as never
-    })
-    await host.start(input)
-    await host.start(input)
-    expect(spawns).toBe(1)
-    expect(await host.stop(input.recordId, 'switch to TUI')).toBe(true)
-    expect(host.has(input.recordId)).toBe(false)
-    expect(onExit).toHaveBeenCalledWith(input.recordId, expect.objectContaining({ intentional: true }))
-  })
-
-  it('restores Pi compaction state reported at startup', async () => {
-    const rpc = new FakeRpcProcess({ isCompacting: true })
-    const host = new WebPiSessionHost(logger, {}, () => rpc as never)
-
-    expect((await host.start(input)).phase).toBe('compacting')
-  })
-
-  it('follows Pi compaction events until the agent settles', async () => {
-    const rpc = new FakeRpcProcess()
-    const host = new WebPiSessionHost(logger, {}, () => rpc as never)
-    await host.start(input)
-
-    rpc.event({ type: 'compaction_start', reason: 'threshold' })
-    expect(host.get(input.recordId)?.phase).toBe('compacting')
-
-    rpc.event({ type: 'compaction_end', reason: 'threshold', willRetry: false })
-    expect(host.get(input.recordId)?.phase).toBe('working')
-
-    rpc.event({ type: 'agent_settled' })
-    expect(host.get(input.recordId)?.phase).toBe('idle')
-  })
-})
diff --git a/src/workspaces/webpi-session-host.ts b/src/workspaces/webpi-session-host.ts
deleted file mode 100644
index 24b622b9a1..0000000000
--- a/src/workspaces/webpi-session-host.ts
+++ /dev/null
@@ -1,403 +0,0 @@
-/**
- * WebPi — Pi's documented RPC mode supervised as a second interactive surface.
- *
- * This deliberately does NOT translate Pi messages into an OpenAlice message
- * model. The browser receives Pi's own AgentMessage objects plus the current
- * cumulative streaming message. Pi's JSONL session remains the only durable
- * conversation store; this host owns only one live RPC process per record.
- */
-import { spawn, type ChildProcessWithoutNullStreams } from 'node:child_process'
-import { StringDecoder } from 'node:string_decoder'
-
-import type { Logger } from './logger.js'
-import { resolveLaunchCommand } from './win-command.js'
-
-const REQUEST_TIMEOUT_MS = 15_000
-const STDERR_MAX_CHARS = 64 * 1024
-
-type JsonObject = Record<string, unknown>
-
-interface RpcProcess {
-  readonly pid?: number
-  readonly stdin: ChildProcessWithoutNullStreams['stdin']
-  readonly stdout: ChildProcessWithoutNullStreams['stdout']
-  readonly stderr: ChildProcessWithoutNullStreams['stderr']
-  once(event: 'spawn', listener: () => void): this
-  once(event: 'error', listener: (error: Error) => void): this
-  once(event: 'exit', listener: (code: number | null, signal: NodeJS.Signals | null) => void): this
-  on(event: 'error', listener: (error: Error) => void): this
-  kill(signal?: NodeJS.Signals): boolean
-}
-
-export interface WebPiSnapshot {
-  readonly recordId: string
-  readonly wsId: string
-  readonly resumeId: string
-  readonly pid: number | null
-  readonly startedAt: number
-  readonly phase: 'starting' | 'idle' | 'working' | 'compacting' | 'retrying' | 'stopped' | 'failed'
-  readonly state: JsonObject | null
-  readonly messages: readonly unknown[]
-  /** Pi's current cumulative assistant message; replaced, never accumulated. */
-  readonly streamingMessage: unknown | null
-  readonly error: string | null
-  readonly stderrTail: string
-  readonly revision: number
-}
-
-export interface StartWebPiInput {
-  readonly recordId: string
-  readonly wsId: string
-  readonly resumeId: string
-  readonly command: readonly string[]
-  readonly cwd: string
-  readonly env: Readonly<Record<string, string>>
-}
-
-interface PendingRequest {
-  readonly command: string
-  readonly resolve: (response: JsonObject) => void
-  readonly reject: (error: Error) => void
-  readonly timer: ReturnType<typeof setTimeout>
-}
-
-interface HostCallbacks {
-  readonly onExit?: (recordId: string, reason: { code: number | null; signal: NodeJS.Signals | null; intentional: boolean }) => void
-}
-
-type SpawnProcess = (input: StartWebPiInput) => RpcProcess
-
-export class WebPiSessionHost {
-  private readonly sessions = new Map<string, LiveWebPiSession>()
-
-  constructor(
-    private readonly logger: Logger,
-    private readonly callbacks: HostCallbacks = {},
-    private readonly spawnProcess: SpawnProcess = defaultSpawnProcess,
-  ) {}
-
-  has(recordId: string): boolean {
-    return this.sessions.has(recordId)
-  }
-
-  get(recordId: string): WebPiSnapshot | null {
-    return this.sessions.get(recordId)?.snapshot() ?? null
-  }
-
-  async start(input: StartWebPiInput): Promise<WebPiSnapshot> {
-    const existing = this.sessions.get(input.recordId)
-    if (existing) return existing.snapshot()
-    const session = new LiveWebPiSession(
-      input,
-      this.spawnProcess(input),
-      this.logger.child({ scope: 'webpi', wsId: input.wsId, recordId: input.recordId }),
-      (reason) => {
-        if (this.sessions.get(input.recordId) === session) this.sessions.delete(input.recordId)
-        this.callbacks.onExit?.(input.recordId, reason)
-      },
-    )
-    this.sessions.set(input.recordId, session)
-    try {
-      await session.start()
-      return session.snapshot()
-    } catch (error) {
-      this.sessions.delete(input.recordId)
-      await session.stop('startup failed').catch(() => undefined)
-      throw error
-    }
-  }
-
-  async prompt(recordId: string, message: string): Promise<WebPiSnapshot> {
-    const session = this.require(recordId)
-    await session.prompt(message)
-    return session.snapshot()
-  }
-
-  async abort(recordId: string): Promise<WebPiSnapshot> {
-    const session = this.require(recordId)
-    await session.abort()
-    return session.snapshot()
-  }
-
-  async stop(recordId: string, reason = 'stopped'): Promise<boolean> {
-    const session = this.sessions.get(recordId)
-    if (!session) return false
-    this.sessions.delete(recordId)
-    await session.stop(reason)
-    return true
-  }
-
-  async stopAll(reason = 'host disposed'): Promise<void> {
-    const sessions = Array.from(this.sessions.values())
-    this.sessions.clear()
-    await Promise.allSettled(sessions.map((session) => session.stop(reason)))
-  }
-
-  private require(recordId: string): LiveWebPiSession {
-    const session = this.sessions.get(recordId)
-    if (!session) throw new Error(`WebPi session is not running: ${recordId}`)
-    return session
-  }
-}
-
-class LiveWebPiSession {
-  private readonly pending = new Map<string, PendingRequest>()
-  private requestSeq = 0
-  private decoder = new StringDecoder('utf8')
-  private stdoutBuffer = ''
-  private stderrTail = ''
-  private phase: WebPiSnapshot['phase'] = 'starting'
-  private state: JsonObject | null = null
-  private messages: readonly unknown[] = []
-  private streamingMessage: unknown | null = null
-  private error: string | null = null
-  private revision = 0
-  private intentionalStop = false
-  private refreshTimer: ReturnType<typeof setTimeout> | null = null
-  private exited = false
-  private readonly startedAt = Date.now()
-
-  constructor(
-    private readonly input: StartWebPiInput,
-    private readonly child: RpcProcess,
-    private readonly logger: Logger,
-    private readonly onExit: (reason: { code: number | null; signal: NodeJS.Signals | null; intentional: boolean }) => void,
-  ) {}
-
-  async start(): Promise<void> {
-    this.child.stdout.on('data', (chunk: Buffer) => this.onStdout(chunk))
-    this.child.stderr.on('data', (chunk: Buffer) => this.onStderr(chunk))
-    this.child.on('error', (error) => this.fail(error))
-    this.child.once('exit', (code, signal) => this.handleExit(code, signal))
-    await new Promise<void>((resolve, reject) => {
-      this.child.once('spawn', resolve)
-      this.child.once('error', reject)
-    })
-    this.logger.info('webpi.started', { pid: this.child.pid ?? null, command: this.input.command })
-    await this.refresh()
-    this.phase = phaseFromRpcState(this.state)
-    this.bump()
-  }
-
-  snapshot(): WebPiSnapshot {
-    return {
-      recordId: this.input.recordId,
-      wsId: this.input.wsId,
-      resumeId: this.input.resumeId,
-      pid: this.exited ? null : this.child.pid ?? null,
-      startedAt: this.startedAt,
-      phase: this.phase,
-      state: this.state,
-      messages: this.messages,
-      streamingMessage: this.streamingMessage,
-      error: this.error,
-      stderrTail: this.stderrTail,
-      revision: this.revision,
-    }
-  }
-
-  async prompt(message: string): Promise<void> {
-    const trimmed = message.trim()
-    if (!trimmed) throw new Error('WebPi prompt cannot be empty')
-    if (trimmed.length > 16_000) throw new Error('WebPi prompt exceeds 16000 characters')
-    this.phase = 'working'
-    this.error = null
-    this.bump()
-    await this.request('prompt', { message: trimmed })
-    this.scheduleRefresh(50)
-  }
-
-  async abort(): Promise<void> {
-    await this.request('abort')
-    this.scheduleRefresh(0)
-  }
-
-  async stop(reason: string): Promise<void> {
-    if (this.exited) return
-    this.intentionalStop = true
-    this.logger.info('webpi.stopping', { reason })
-    this.child.stdin.end()
-    this.child.kill('SIGTERM')
-    await Promise.race([
-      new Promise<void>((resolve) => this.child.once('exit', () => resolve())),
-      new Promise<void>((resolve) => setTimeout(resolve, 2_000)),
-    ])
-    if (!this.exited) this.child.kill('SIGKILL')
-  }
-
-  private async refresh(): Promise<void> {
-    const [stateResponse, messageResponse] = await Promise.all([
-      this.request('get_state'),
-      this.request('get_messages'),
-    ])
-    const nextState = stateResponse['data']
-    if (isObject(nextState)) this.state = nextState
-    const data = messageResponse['data']
-    if (isObject(data) && Array.isArray(data['messages'])) this.messages = data['messages']
-    this.bump()
-  }
-
-  private scheduleRefresh(delayMs: number): void {
-    if (this.refreshTimer) clearTimeout(this.refreshTimer)
-    this.refreshTimer = setTimeout(() => {
-      this.refreshTimer = null
-      void this.refresh().catch((error) => this.fail(error))
-    }, delayMs)
-  }
-
-  private request(command: string, payload: JsonObject = {}): Promise<JsonObject> {
-    if (this.exited) return Promise.reject(new Error('WebPi process exited'))
-    const id = `webpi-${++this.requestSeq}`
-    return new Promise<JsonObject>((resolve, reject) => {
-      const timer = setTimeout(() => {
-        this.pending.delete(id)
-        reject(new Error(`WebPi RPC ${command} timed out`))
-      }, REQUEST_TIMEOUT_MS)
-      this.pending.set(id, { command, resolve, reject, timer })
-      const line = `${JSON.stringify({ id, type: command, ...payload })}\n`
-      this.child.stdin.write(line, (error) => {
-        if (!error) return
-        const pending = this.pending.get(id)
-        if (!pending) return
-        clearTimeout(pending.timer)
-        this.pending.delete(id)
-        pending.reject(error)
-      })
-    })
-  }
-
-  private onStdout(chunk: Buffer): void {
-    this.stdoutBuffer += this.decoder.write(chunk)
-    let newline = this.stdoutBuffer.indexOf('\n')
-    while (newline >= 0) {
-      const line = this.stdoutBuffer.slice(0, newline)
-      this.stdoutBuffer = this.stdoutBuffer.slice(newline + 1)
-      this.handleLine(line)
-      newline = this.stdoutBuffer.indexOf('\n')
-    }
-  }
-
-  private handleLine(raw: string): void {
-    const line = raw.endsWith('\r') ? raw.slice(0, -1) : raw
-    if (!line) return
-    let event: JsonObject
-    try {
-      const parsed: unknown = JSON.parse(line)
-      if (!isObject(parsed)) return
-      event = parsed
-    } catch (error) {
-      this.logger.warn('webpi.invalid_json', { error, line: line.slice(0, 500) })
-      return
-    }
-    if (event['type'] === 'response' && typeof event['id'] === 'string') {
-      const pending = this.pending.get(event['id'])
-      if (!pending) return
-      clearTimeout(pending.timer)
-      this.pending.delete(event['id'])
-      if (event['success'] === false) {
-        pending.reject(new Error(typeof event['error'] === 'string' ? event['error'] : `WebPi RPC ${pending.command} failed`))
-      } else {
-        pending.resolve(event)
-      }
-      return
-    }
-    this.handleEvent(event)
-  }
-
-  private handleEvent(event: JsonObject): void {
-    switch (event['type']) {
-      case 'agent_start':
-      case 'turn_start':
-        this.phase = 'working'
-        break
-      case 'message_update':
-        this.streamingMessage = event['message'] ?? null
-        break
-      case 'message_end':
-      case 'tool_execution_end':
-      case 'queue_update':
-        this.scheduleRefresh(30)
-        break
-      case 'agent_settled':
-        this.phase = 'idle'
-        this.streamingMessage = null
-        this.scheduleRefresh(0)
-        break
-      case 'compaction_start':
-        this.phase = 'compacting'
-        break
-      case 'compaction_end':
-        this.phase = 'working'
-        this.scheduleRefresh(0)
-        break
-      case 'auto_retry_start':
-        this.phase = 'retrying'
-        break
-      case 'auto_retry_end':
-        this.phase = 'working'
-        break
-      case 'extension_error':
-        this.error = typeof event['error'] === 'string' ? event['error'] : 'Pi extension failed'
-        break
-      default:
-        break
-    }
-    this.bump()
-  }
-
-  private onStderr(chunk: Buffer): void {
-    this.stderrTail = `${this.stderrTail}${chunk.toString('utf8')}`.slice(-STDERR_MAX_CHARS)
-    this.bump()
-  }
-
-  private fail(error: Error): void {
-    this.error = error.message
-    this.phase = 'failed'
-    this.bump()
-    this.logger.error('webpi.failed', { error })
-  }
-
-  private handleExit(code: number | null, signal: NodeJS.Signals | null): void {
-    if (this.exited) return
-    this.exited = true
-    if (this.refreshTimer) clearTimeout(this.refreshTimer)
-    this.refreshTimer = null
-    this.phase = this.intentionalStop ? 'stopped' : 'failed'
-    if (!this.intentionalStop && !this.error) {
-      this.error = `Pi RPC exited (code=${String(code)}, signal=${String(signal)})`
-    }
-    for (const pending of this.pending.values()) {
-      clearTimeout(pending.timer)
-      pending.reject(new Error(this.error ?? 'WebPi stopped'))
-    }
-    this.pending.clear()
-    this.bump()
-    this.logger.info('webpi.exited', { code, signal, intentional: this.intentionalStop })
-    this.onExit({ code, signal, intentional: this.intentionalStop })
-  }
-
-  private bump(): void {
-    this.revision += 1
-  }
-}
-
-function defaultSpawnProcess(input: StartWebPiInput): RpcProcess {
-  const resolved = resolveLaunchCommand(input.command, { env: input.env, cwd: input.cwd })
-  const [file, ...args] = resolved.argv
-  if (!file) throw new Error('WebPi command is empty')
-  return spawn(file, args, {
-    cwd: input.cwd,
-    env: { ...input.env },
-    stdio: ['pipe', 'pipe', 'pipe'],
-    windowsHide: true,
-  })
-}
-
-function phaseFromRpcState(state: JsonObject | null): WebPiSnapshot['phase'] {
-  if (state?.['isCompacting'] === true) return 'compacting'
-  return state?.['isStreaming'] === true ? 'working' : 'idle'
-}
-
-function isObject(value: unknown): value is JsonObject {
-  return typeof value === 'object' && value !== null && !Array.isArray(value)
-}
diff --git a/src/workspaces/workspace-lifecycle.ts b/src/workspaces/workspace-lifecycle.ts
index 1204b21a96..5f6ae0e99c 100644
--- a/src/workspaces/workspace-lifecycle.ts
+++ b/src/workspaces/workspace-lifecycle.ts
@@ -9,7 +9,7 @@ import type { Logger } from './logger.js'
 import type { ResumeRegistry } from './resume-registry.js'
 import type { ScrollbackStore } from './scrollback-store.js'
 import type { SessionPool } from './session-pool.js'
-import type { WebPiSessionHost } from './webpi-session-host.js'
+import type { WebSessionHost } from './web-session-host.js'
 import type { SessionRecord, SessionRegistry } from './session-registry.js'
 import {
   catalogRecordToMeta,
@@ -47,7 +47,7 @@ export interface WorkspaceLifecycleManagerDeps {
   scrollbackStore: ScrollbackStore
   headlessTasks: HeadlessTaskRegistry
   pool: SessionPool
-  webPi?: WebPiSessionHost
+  web?: WebSessionHost
   /** Includes synchronous wait:true/probe-style runs not yet in HeadlessTaskRegistry. */
   isWorkspaceHeadlessActive?: (workspaceId: string) => boolean
   /** Serializes checkout-wide mutations with Template Upgrade and Merge. */
@@ -398,7 +398,7 @@ export class WorkspaceLifecycleManager {
         if (dump.length > 0) scrollbackFile = await this.deps.scrollbackStore.dump(wsId, record.id, dump)
       }
       this.deps.pool.disposeToken(record.id, 'workspace offboarded')
-      await this.deps.webPi?.stop(record.id, 'workspace offboarded')
+      await this.deps.web?.stop(record.id, 'workspace offboarded')
       if (record.state === 'running' || scrollbackFile) {
         await this.deps.sessionRegistry.update(wsId, record.id, {
           state: 'paused',

From b2be6a0f84195178dae64b09e74eb0b584279192 Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Sun, 6 Sep 2026 12:07:23 +0000
Subject: [PATCH 2/4] feat(ui): present any web-capable runtime in the Web
 conversation surface

Rename the WebPi browser modules to runtime-neutral names, read the new
/web/* snapshot shape, gate Web launch on the runtime's declared capability,
and add a pinned request card so permission prompts from Claude, Codex, and
ACP runtimes can be answered from the browser. Demo handlers mirror the
capability table and script a permission turn for prompting runtimes.

Co-authored-by: RainMona <RainMona@users.noreply.github.com>
---
 .../conversation/ConversationRequestCard.tsx  |  97 +++++
 .../conversation/ConversationTranscript.tsx   |   7 +
 .../components/conversation/conversation.css  |  29 +-
 ui/src/components/conversation/types.ts       |   2 +
 .../ChatWorkspaceSection.auto-quant.spec.tsx  |   2 +-
 .../workspace/ChatWorkspaceSection.spec.tsx   |   8 +-
 .../workspace/ChatWorkspaceSection.tsx        |   4 +-
 .../components/workspace/ResumeCta.spec.tsx   |  73 +++-
 ui/src/components/workspace/ResumeCta.tsx     |  31 +-
 .../components/workspace/WebPiView.spec.tsx   | 183 ---------
 ui/src/components/workspace/WebPiView.tsx     |  51 ---
 .../workspace/WebSessionView.spec.tsx         | 301 +++++++++++++++
 .../components/workspace/WebSessionView.tsx   | 122 ++++++
 .../WorkspaceTemplateUpgradePanel.spec.tsx    |   2 +-
 .../WorkspaceTemplateUpgradePanel.tsx         |   2 +-
 .../workspace/WorkspaceView.spec.tsx          |  12 +-
 ui/src/components/workspace/WorkspaceView.tsx |  14 +-
 ui/src/components/workspace/api.ts            | 168 +++++---
 .../components/workspace/harness-sessions.ts  |   2 +-
 .../workspace/useWebConversation.ts           |  72 ++++
 .../workspace/useWebPiConversation.ts         |  44 ---
 ...ation.spec.ts => web-presentation.spec.ts} |   6 +-
 ...pi-presentation.ts => web-presentation.ts} |  20 +-
 ...nscript.spec.ts => web-transcript.spec.ts} |  12 +-
 ...{webpi-transcript.ts => web-transcript.ts} |  53 ++-
 ui/src/components/workspace/workspaces.css    |   2 +-
 ui/src/contexts/WorkspacesContext.spec.tsx    |  16 +-
 ui/src/contexts/WorkspacesContext.tsx         |  10 +-
 ui/src/contexts/workspaces-context.ts         |   2 +-
 ui/src/demo/README.md                         |  12 +-
 ui/src/demo/fixtures/web-session.ts           | 360 ++++++++++++++++++
 ui/src/demo/fixtures/webpi.ts                 | 226 -----------
 ui/src/demo/fixtures/workspaces.ts            |   2 +-
 .../demo/handlers/workspaces-resume.spec.ts   |   4 +-
 ui/src/demo/handlers/workspaces-web.spec.ts   | 186 +++++++++
 ui/src/demo/handlers/workspaces-webpi.spec.ts | 111 ------
 ui/src/demo/handlers/workspaces.ts            | 240 ++++++++----
 ui/src/i18n/locales/en.ts                     |   6 +-
 ui/src/i18n/locales/ja.ts                     |   6 +-
 ui/src/i18n/locales/zh-Hant.ts                |   6 +-
 ui/src/i18n/locales/zh.ts                     |   6 +-
 ui/src/pages/AutoPredictionSetupPage.spec.tsx |   2 +-
 ui/src/pages/AutoQuantSetupPage.spec.tsx      |   2 +-
 ui/src/pages/ChatLandingPage.render.spec.tsx  |   2 +-
 ui/src/pages/ChatSetupPage.spec.tsx           |   2 +-
 ui/src/pages/WorkspaceListPage.spec.tsx       |   2 +-
 ui/src/pages/WorkspaceManagerPage.spec.tsx    |  33 +-
 ui/src/pages/WorkspaceManagerPage.tsx         |  19 +-
 ui/src/pages/WorkspacePage.spec.tsx           |   4 +-
 ui/src/pages/WorkspacePage.tsx                |  30 +-
 50 files changed, 1729 insertions(+), 879 deletions(-)
 create mode 100644 ui/src/components/conversation/ConversationRequestCard.tsx
 delete mode 100644 ui/src/components/workspace/WebPiView.spec.tsx
 delete mode 100644 ui/src/components/workspace/WebPiView.tsx
 create mode 100644 ui/src/components/workspace/WebSessionView.spec.tsx
 create mode 100644 ui/src/components/workspace/WebSessionView.tsx
 create mode 100644 ui/src/components/workspace/useWebConversation.ts
 delete mode 100644 ui/src/components/workspace/useWebPiConversation.ts
 rename ui/src/components/workspace/{webpi-presentation.spec.ts => web-presentation.spec.ts} (79%)
 rename ui/src/components/workspace/{webpi-presentation.ts => web-presentation.ts} (68%)
 rename ui/src/components/workspace/{webpi-transcript.spec.ts => web-transcript.spec.ts} (93%)
 rename ui/src/components/workspace/{webpi-transcript.ts => web-transcript.ts} (82%)
 create mode 100644 ui/src/demo/fixtures/web-session.ts
 delete mode 100644 ui/src/demo/fixtures/webpi.ts
 create mode 100644 ui/src/demo/handlers/workspaces-web.spec.ts
 delete mode 100644 ui/src/demo/handlers/workspaces-webpi.spec.ts

diff --git a/ui/src/components/conversation/ConversationRequestCard.tsx b/ui/src/components/conversation/ConversationRequestCard.tsx
new file mode 100644
index 0000000000..cda2fc5fa4
--- /dev/null
+++ b/ui/src/components/conversation/ConversationRequestCard.tsx
@@ -0,0 +1,97 @@
+import { useState, type ReactElement } from 'react'
+import { CircleHelp, LoaderCircle, ShieldQuestion } from 'lucide-react'
+import { Button } from '../ui/button'
+
+export interface ConversationRequestOption {
+  readonly id: string
+  readonly label: string
+  readonly tone: 'allow' | 'deny' | 'neutral'
+}
+
+export interface ConversationRequest {
+  readonly id: string
+  readonly kind: 'permission' | 'question'
+  readonly title: string
+  readonly description?: string
+  /** Pre-rendered tool detail; the adapter decides how the input is summarized. */
+  readonly tool?: { readonly name: string; readonly summary: string | null; readonly input: string }
+  readonly options: readonly ConversationRequestOption[]
+}
+
+export interface ConversationRequestCardProps {
+  readonly request: ConversationRequest
+  /** How many further requests wait behind this one. */
+  readonly queued: number
+  readonly respond: (requestId: string, optionId: string) => Promise<void>
+}
+
+/**
+ * The runtime stopped to ask something. Rendered pinned above the composer
+ * rather than inline so the question is never scrolled away while the answer
+ * is the only way forward; the transcript stays a record, the card is the
+ * live decision. Options are shown verbatim from the runtime.
+ */
+export function ConversationRequestCard({ request, queued, respond }: ConversationRequestCardProps): ReactElement {
+  const [pendingOption, setPendingOption] = useState<string | null>(null)
+  const [error, setError] = useState<string | null>(null)
+  const permission = request.kind === 'permission'
+
+  async function choose(optionId: string) {
+    if (pendingOption) return
+    setPendingOption(optionId)
+    setError(null)
+    try { await respond(request.id, optionId) }
+    catch (cause) { setError(cause instanceof Error ? cause.message : String(cause)) }
+    finally { setPendingOption(null) }
+  }
+
+  return (
+    <section
+      className={`conversation-request${permission ? ' is-permission' : ' is-question'}`}
+      role="group"
+      aria-labelledby={`conversation-request-${request.id}`}
+      aria-live="polite"
+    >
+      <header className="conversation-request-header">
+        <span className="conversation-request-icon" aria-hidden="true">
+          {permission ? <ShieldQuestion size={15} /> : <CircleHelp size={15} />}
+        </span>
+        <div className="conversation-request-heading">
+          <span className="conversation-request-kicker">
+            {permission ? 'Permission needed' : 'Question from the agent'}
+            {queued > 0 && <span className="conversation-request-queue">+{queued} more</span>}
+          </span>
+          <h3 id={`conversation-request-${request.id}`} className="conversation-request-title">{request.title}</h3>
+        </div>
+      </header>
+      {request.description && <p className="conversation-request-description">{request.description}</p>}
+      {request.tool && (
+        <details className="conversation-request-tool">
+          <summary>
+            <code>{request.tool.name}</code>
+            {request.tool.summary && <span className="conversation-request-tool-summary">{request.tool.summary}</span>}
+          </summary>
+          <pre>{request.tool.input}</pre>
+        </details>
+      )}
+      <div className="conversation-request-actions">
+        {request.options.map((option) => (
+          <Button
+            key={option.id}
+            type="button"
+            size="sm"
+            variant={option.tone === 'allow' ? 'default' : option.tone === 'deny' ? 'outline' : 'secondary'}
+            className={`conversation-request-option is-${option.tone}`}
+            disabled={pendingOption !== null}
+            aria-busy={pendingOption === option.id}
+            onClick={() => void choose(option.id)}
+          >
+            {pendingOption === option.id && <LoaderCircle size={13} className="animate-spin" aria-hidden />}
+            {option.label}
+          </Button>
+        ))}
+      </div>
+      {error && <p className="conversation-request-error" role="alert">{error}</p>}
+    </section>
+  )
+}
diff --git a/ui/src/components/conversation/ConversationTranscript.tsx b/ui/src/components/conversation/ConversationTranscript.tsx
index c509dd1689..b177d68f55 100644
--- a/ui/src/components/conversation/ConversationTranscript.tsx
+++ b/ui/src/components/conversation/ConversationTranscript.tsx
@@ -17,6 +17,13 @@ export function ConversationTranscriptItem({
       </article>
     )
   }
+  if (item.kind === 'notice') {
+    return (
+      <aside className="conversation-message is-notice" role="note">
+        <div className="conversation-notice-body">{item.text}</div>
+      </aside>
+    )
+  }
   if (item.kind === 'unknown') {
     return (
       <article className="conversation-message is-assistant">
diff --git a/ui/src/components/conversation/conversation.css b/ui/src/components/conversation/conversation.css
index 4c841f4ee9..03534d4855 100644
--- a/ui/src/components/conversation/conversation.css
+++ b/ui/src/components/conversation/conversation.css
@@ -145,6 +145,32 @@
 .conversation-reasoning-notes { display: grid; gap: 8px; margin: 0 0 7px; padding: 8px 10px; border-left: 2px solid color-mix(in srgb, var(--primary) 24%, var(--border)); color: color-mix(in srgb, var(--foreground) 82%, var(--muted-foreground)); font-size: 10px; }
 .conversation-reasoning pre { max-height: 220px; margin: 0 0 7px; overflow: auto; white-space: pre-wrap; font: 10px/1.5 var(--font-mono, monospace); }
 
+.conversation-message.is-notice { justify-content: center; margin: 0 0 18px; }
+.conversation-notice-body { max-width: 100%; padding: 4px 10px; border-radius: 999px; color: var(--muted-foreground); background: color-mix(in srgb, var(--secondary) 70%, transparent); font-size: 11px; line-height: 1.5; text-align: center; overflow-wrap: anywhere; }
+
+/* A runtime request is the live decision; the transcript stays a record. */
+.conversation-request { display: grid; gap: 9px; margin: 0 0 10px; padding: 12px 13px; border: 1px solid color-mix(in srgb, var(--primary) 34%, var(--border)); border-radius: 12px; background: color-mix(in srgb, var(--primary) 6%, var(--secondary)); box-shadow: 0 8px 24px color-mix(in srgb, var(--shadow-color) 6%, transparent); animation: conversation-detail-reveal 150ms ease-out both; }
+.conversation-request.is-question { border-color: color-mix(in srgb, var(--foreground) 18%, var(--border)); background: color-mix(in srgb, var(--secondary) 82%, transparent); }
+.conversation-request-header { display: flex; align-items: flex-start; gap: 9px; min-width: 0; }
+.conversation-request-icon { width: 26px; height: 26px; flex: 0 0 26px; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: color-mix(in srgb, var(--primary) 12%, transparent); }
+.conversation-request.is-question .conversation-request-icon { color: var(--foreground); background: color-mix(in srgb, var(--border) 60%, transparent); }
+.conversation-request-heading { display: grid; gap: 1px; min-width: 0; }
+.conversation-request-kicker { display: inline-flex; align-items: center; gap: 6px; color: var(--muted-foreground); font-size: 10px; font-weight: 650; letter-spacing: .02em; text-transform: uppercase; }
+.conversation-request-queue { padding: 1px 6px; border-radius: 999px; color: var(--muted-foreground); background: color-mix(in srgb, var(--border) 70%, transparent); font-weight: 600; letter-spacing: 0; text-transform: none; }
+.conversation-request-title { margin: 0; color: var(--foreground); font-size: 13px; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
+.conversation-request-description { margin: 0; color: color-mix(in srgb, var(--foreground) 82%, var(--muted-foreground)); font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
+.conversation-request-tool { min-width: 0; border: 1px solid color-mix(in srgb, var(--border) 80%, transparent); border-radius: 8px; background: color-mix(in srgb, var(--background) 70%, transparent); font-size: 11px; }
+.conversation-request-tool > summary { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 6px 9px; cursor: pointer; user-select: none; color: var(--muted-foreground); }
+.conversation-request-tool > summary code { flex: 0 0 auto; color: var(--foreground); font: 600 11px/1.4 var(--font-mono, monospace); }
+.conversation-request-tool-summary { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 10px/1.4 var(--font-mono, monospace); }
+.conversation-request-tool > pre { max-height: 200px; margin: 0; padding: 0 9px 8px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; color: color-mix(in srgb, var(--foreground) 88%, var(--muted-foreground)); font: 10px/1.5 var(--font-mono, monospace); }
+.conversation-request-actions { display: flex; flex-wrap: wrap; gap: 7px; }
+.conversation-request-option[data-slot="button"] { gap: 6px; }
+.conversation-request-option.is-deny[data-slot="button"] { color: var(--destructive); border-color: color-mix(in srgb, var(--destructive) 40%, var(--border)); }
+.conversation-request-option.is-deny[data-slot="button"]:hover { background: color-mix(in srgb, var(--destructive) 8%, transparent); }
+.conversation-request-error { margin: 0; color: var(--destructive); font-size: 11px; }
+.conversation-request-tool summary:focus-visible { outline: 2px solid var(--oa-focus-ring); outline-offset: -2px; }
+
 .conversation-error { display: grid; gap: 7px; margin: 20px 0; padding: 13px; border: 1px solid color-mix(in srgb, var(--destructive) 50%, var(--border)); border-radius: 10px; color: var(--destructive); font-size: 12px; }
 .conversation-error button { width: fit-content; color: var(--foreground); text-decoration: underline; }
 .conversation-jump-latest { position: absolute; right: max(18px, calc((100% - 736px) / 2)); bottom: 82px; z-index: 2; padding: 6px 10px; border: 1px solid color-mix(in srgb, var(--primary) 42%, var(--border)); border-radius: 999px; color: var(--foreground); background: color-mix(in srgb, var(--secondary) 92%, transparent); box-shadow: 0 5px 18px color-mix(in srgb, var(--shadow-color) 16%, transparent); font-size: 10px; font-weight: 650; }
@@ -175,7 +201,8 @@
 
 @media (prefers-reduced-motion: reduce) {
   .conversation-activity[open] > .conversation-activity-body,
-  .conversation-tool-step[open] > .conversation-step-detail { animation: none; }
+  .conversation-tool-step[open] > .conversation-step-detail,
+  .conversation-request { animation: none; }
 }
 
 /* Conversation shares the viewport with the global rail and Workspace sidebar. Its
diff --git a/ui/src/components/conversation/types.ts b/ui/src/components/conversation/types.ts
index 082129db7c..74ebcffd31 100644
--- a/ui/src/components/conversation/types.ts
+++ b/ui/src/components/conversation/types.ts
@@ -26,4 +26,6 @@ export interface ConversationActivity {
 export type ConversationItem =
   | { readonly kind: 'user'; readonly key: string; readonly content: ConversationContent }
   | { readonly kind: 'assistant-turn'; readonly key: string; readonly progress: readonly string[]; readonly final: string | null; readonly activity: ConversationActivity | null }
+  /** A runtime/system remark that is neither party speaking: mode changes, restarts, aborted turns. */
+  | { readonly kind: 'notice'; readonly key: string; readonly text: string }
   | { readonly kind: 'unknown'; readonly key: string; readonly content: ConversationContent }
diff --git a/ui/src/components/workspace/ChatWorkspaceSection.auto-quant.spec.tsx b/ui/src/components/workspace/ChatWorkspaceSection.auto-quant.spec.tsx
index 927b2be64b..894a184f0e 100644
--- a/ui/src/components/workspace/ChatWorkspaceSection.auto-quant.spec.tsx
+++ b/ui/src/components/workspace/ChatWorkspaceSection.auto-quant.spec.tsx
@@ -114,7 +114,7 @@ function context(): WorkspacesContextValue {
     quickChat: vi.fn(async () => session.id),
     pauseSession: actions.pauseSession,
     resumeSession: actions.resumeSession,
-    openWebPiSession: vi.fn(async () => undefined),
+    openWebSession: vi.fn(async () => undefined),
     requestDeleteSession: actions.requestDeleteSession,
     setSessionPresence: actions.setSessionPresence,
     setSessionDisplayName: actions.setSessionDisplayName,
diff --git a/ui/src/components/workspace/ChatWorkspaceSection.spec.tsx b/ui/src/components/workspace/ChatWorkspaceSection.spec.tsx
index 2f63757fe7..2139b52867 100644
--- a/ui/src/components/workspace/ChatWorkspaceSection.spec.tsx
+++ b/ui/src/components/workspace/ChatWorkspaceSection.spec.tsx
@@ -19,7 +19,7 @@ const actions = vi.hoisted(() => ({
   openOrFocus: vi.fn(),
   pauseSession: vi.fn(async () => undefined),
   resumeSession: vi.fn(async () => undefined),
-  openWebPiSession: vi.fn(async () => undefined),
+  openWebSession: vi.fn(async () => undefined),
   openHeadlessRun: vi.fn(async () => undefined),
   requestDeleteSession: vi.fn(),
   setSessionPresence: vi.fn(async () => undefined),
@@ -135,7 +135,7 @@ function workspaceContext(
     quickChat: vi.fn(async () => 'session-1'),
     pauseSession: actions.pauseSession,
     resumeSession: actions.resumeSession,
-    openWebPiSession: actions.openWebPiSession,
+    openWebSession: actions.openWebSession,
     requestDeleteSession: actions.requestDeleteSession,
     setSessionPresence: actions.setSessionPresence,
     setSessionDisplayName: actions.setSessionDisplayName,
@@ -203,7 +203,7 @@ describe('ChatWorkspaceSection actions', () => {
     expect(screen.queryByRole('button', { name: 'Other office conversation' })).toBeNull()
     fireEvent.click(screen.getByRole('button', { name: 'Conversation 1' }))
     expect(actions.resumeSession).toHaveBeenCalledWith(current.id, current.sessions[0].id, 'chat')
-    expect(actions.openWebPiSession).not.toHaveBeenCalled()
+    expect(actions.openWebSession).not.toHaveBeenCalled()
     expect(screen.getByRole('button', { name: 'View all 9 conversations' })).toBeTruthy()
   })
 
@@ -764,7 +764,7 @@ describe('ChatWorkspaceSection actions', () => {
     expect(onNavigate).toHaveBeenCalledTimes(1)
 
     fireEvent.click(managerUi.getByRole('button', { name: 'Resume Coordinate owners' }))
-    expect(actions.openWebPiSession).toHaveBeenCalledWith(MANAGER_WORKSPACE_ID, 'manager-pi')
+    expect(actions.openWebSession).toHaveBeenCalledWith(MANAGER_WORKSPACE_ID, 'manager-pi')
     expect(onNavigate).toHaveBeenCalledTimes(2)
 
     const pausedRow = pausedSession.parentElement
diff --git a/ui/src/components/workspace/ChatWorkspaceSection.tsx b/ui/src/components/workspace/ChatWorkspaceSection.tsx
index 43ea22cb88..1d50cf16a2 100644
--- a/ui/src/components/workspace/ChatWorkspaceSection.tsx
+++ b/ui/src/components/workspace/ChatWorkspaceSection.tsx
@@ -278,7 +278,7 @@ export function ChatWorkspaceSection({
     if (row.headlessOccupying || !row.resumable) return
     rememberViewedWorkspace(row.workspaceId)
     if (row.session.surface === 'webpi') {
-      await ctx.openWebPiSession(row.workspaceId, row.session.id, source)
+      await ctx.openWebSession(row.workspaceId, row.session.id, source)
     } else {
       await ctx.resumeSession(row.workspaceId, row.session.id, source)
     }
@@ -541,7 +541,7 @@ export function ChatWorkspaceSection({
           onPauseSession={(sessionId) => void ctx.pauseSession(MANAGER_WORKSPACE_ID, sessionId)}
           onResumeSession={(sessionId, surface) => {
             if (surface === 'webpi') {
-              void ctx.openWebPiSession(MANAGER_WORKSPACE_ID, sessionId)
+              void ctx.openWebSession(MANAGER_WORKSPACE_ID, sessionId)
             } else {
               void ctx.resumeSession(MANAGER_WORKSPACE_ID, sessionId)
             }
diff --git a/ui/src/components/workspace/ResumeCta.spec.tsx b/ui/src/components/workspace/ResumeCta.spec.tsx
index 904d4b33e3..81bd882267 100644
--- a/ui/src/components/workspace/ResumeCta.spec.tsx
+++ b/ui/src/components/workspace/ResumeCta.spec.tsx
@@ -3,9 +3,39 @@
 import { cleanup, fireEvent, render, screen } from '@testing-library/react'
 import { afterEach, describe, expect, it, vi } from 'vitest'
 
-import type { SessionRecord } from './api'
+import type { AgentInfo, SessionRecord } from './api'
 import { ResumeCta } from './ResumeCta'
 
+const agents: readonly AgentInfo[] = [
+  {
+    id: 'pi',
+    displayName: 'Pi',
+    capabilities: {
+      parallelPerCwd: true,
+      resumeLast: true,
+      resumeById: true,
+      transcriptDiscovery: 'none',
+      web: { wire: 'pi-rpc', permissionPrompts: false, freshSession: true },
+    },
+  },
+  {
+    id: 'claude',
+    displayName: 'Claude Code',
+    capabilities: {
+      parallelPerCwd: true,
+      resumeLast: false,
+      resumeById: true,
+      transcriptDiscovery: 'fs-watch',
+      web: { wire: 'claude-stream-json', permissionPrompts: true, freshSession: true },
+    },
+  },
+  {
+    id: 'agy',
+    displayName: 'Antigravity',
+    capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess' },
+  },
+]
+
 function record(runtime?: SessionRecord['runtime']): SessionRecord {
   return {
     id: 'session-1',
@@ -30,26 +60,59 @@ describe('ResumeCta runtime facts', () => {
   it('preserves a long title and all Pi actions without starting the session on mount', async () => {
     const title = 'Research the complete cross-market impact of a changing policy regime across multiple portfolios'
     const onResume = vi.fn(async () => {})
-    const onOpenWebPi = vi.fn(async () => { throw new Error('Surface unavailable') })
+    const onOpenWeb = vi.fn(async () => { throw new Error('Surface unavailable') })
     render(<ResumeCta
       record={{ ...record(), agent: 'pi', title }}
+      agents={agents}
       workspaceId="workspace-1"
       onSaveDisplayName={vi.fn(async () => {})}
       onResume={onResume}
-      onOpenWebPi={onOpenWebPi}
+      onOpenWeb={onOpenWeb}
     />)
 
     expect(screen.getByRole('heading', { name: title }).textContent).toBe(title)
     expect(screen.getByRole('button', { name: 'Resume in TUI' })).toBeTruthy()
     expect(document.querySelector('.resume-cta-actions')?.querySelectorAll('button')).toHaveLength(3)
     expect(onResume).not.toHaveBeenCalled()
-    expect(onOpenWebPi).not.toHaveBeenCalled()
-    fireEvent.click(screen.getByRole('button', { name: 'Open in WebPi' }))
+    expect(onOpenWeb).not.toHaveBeenCalled()
+    fireEvent.click(screen.getByRole('button', { name: 'Open in Web' }))
     expect((await screen.findByRole('alert')).textContent).toBe('Surface unavailable')
     expect(onResume).not.toHaveBeenCalled()
     expect((screen.getByRole('button', { name: 'Resume in TUI' }) as HTMLButtonElement).disabled).toBe(false)
   })
 
+  it('offers the Web surface to every runtime that declares it, not only Pi', () => {
+    render(<ResumeCta
+      record={record()}
+      agents={agents}
+      onResume={vi.fn(async () => {})}
+      onOpenWeb={vi.fn(async () => {})}
+    />)
+
+    expect(screen.getByRole('button', { name: 'Open in Web' })).toBeTruthy()
+  })
+
+  it('hides the Web surface for runtimes without a structured protocol', () => {
+    render(<ResumeCta
+      record={{ ...record(), agent: 'agy' }}
+      agents={agents}
+      onResume={vi.fn(async () => {})}
+      onOpenWeb={vi.fn(async () => {})}
+    />)
+
+    expect(screen.queryByRole('button', { name: 'Open in Web' })).toBeNull()
+  })
+
+  it('hides the Web surface when the runtime list has not loaded', () => {
+    render(<ResumeCta
+      record={{ ...record(), agent: 'pi' }}
+      onResume={vi.fn(async () => {})}
+      onOpenWeb={vi.fn(async () => {})}
+    />)
+
+    expect(screen.queryByRole('button', { name: 'Open in Web' })).toBeNull()
+  })
+
   it('shows the persisted Vault binding', () => {
     render(<ResumeCta
       record={record({
diff --git a/ui/src/components/workspace/ResumeCta.tsx b/ui/src/components/workspace/ResumeCta.tsx
index c7555151a0..eafd7d1346 100644
--- a/ui/src/components/workspace/ResumeCta.tsx
+++ b/ui/src/components/workspace/ResumeCta.tsx
@@ -7,10 +7,11 @@ import { useTranslation } from 'react-i18next';
 import { AgentRuntimeIcon } from '../../lib/agentRuntimeIcon';
 import { SessionSettingsDialog } from './SessionSettingsDialog';
 import { sessionCoworkerLabel } from './display';
-import type {
-  AgentInfo,
-  PausedSessionRuntimeUpdate,
-  SessionRecord,
+import {
+  agentSupportsWeb,
+  type AgentInfo,
+  type PausedSessionRuntimeUpdate,
+  type SessionRecord,
 } from './api';
 
 export interface ResumeCtaProps {
@@ -20,7 +21,8 @@ export interface ResumeCtaProps {
   readonly onUpdateRuntime?: (update: PausedSessionRuntimeUpdate) => Promise<void>;
   readonly onSaveDisplayName?: (displayName: string | null) => Promise<void>;
   readonly onResume: () => Promise<void>;
-  readonly onOpenWebPi?: () => Promise<void>;
+  /** Offered only when the runtime declares a Web conversation surface. */
+  readonly onOpenWeb?: () => Promise<void>;
 }
 
 /**
@@ -44,20 +46,21 @@ export interface ResumeCtaProps {
  */
 export function ResumeCta(props: ResumeCtaProps): ReactElement {
   const { t } = useTranslation();
-  const [resuming, setResuming] = useState<'terminal' | 'webpi' | null>(null);
+  const [resuming, setResuming] = useState<'terminal' | 'web' | null>(null);
   const [settingsOpen, setSettingsOpen] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const r = props.record;
   const sessionTitle = sessionCoworkerLabel(r);
   const runtimeFacts = sessionRuntimeFacts(r);
   const canOpenSettings = Boolean(props.workspaceId && props.onSaveDisplayName);
+  const canOpenWeb = Boolean(props.onOpenWeb) && agentSupportsWeb(props.agents, r.agent);
 
-  const run = async (surface: 'terminal' | 'webpi'): Promise<void> => {
+  const run = async (surface: 'terminal' | 'web'): Promise<void> => {
     if (resuming) return;
     setError(null);
     setResuming(surface);
     try {
-      if (surface === 'webpi') await props.onOpenWebPi?.();
+      if (surface === 'web') await props.onOpenWeb?.();
       else await props.onResume();
     } catch (err) {
       setError(err instanceof Error ? err.message : String(err));
@@ -108,17 +111,17 @@ export function ResumeCta(props: ResumeCtaProps): ReactElement {
                 <SquareTerminal size={15} strokeWidth={2.1} aria-hidden="true" />
                 <span>{resuming === 'terminal' ? 'Restoring…' : 'Resume in TUI'}</span>
               </button>
-              {r.agent === 'pi' && props.onOpenWebPi && (
+              {canOpenWeb && (
                 <button
                   type="button"
-                  className="resume-cta-btn is-webpi oa-pressable"
-                  onClick={() => void run('webpi')}
+                  className="resume-cta-btn is-web oa-pressable"
+                  onClick={() => void run('web')}
                   disabled={resuming !== null}
-                  aria-label="Open in WebPi"
+                  aria-label="Open in Web"
                 >
                   <Bot size={14} strokeWidth={2.25} aria-hidden="true" />
-                  <span>{resuming === 'webpi' ? 'Opening…' : 'Open in WebPi'}</span>
-                  {resuming !== 'webpi' && <span className="resume-cta-beta">Beta</span>}
+                  <span>{resuming === 'web' ? 'Opening…' : 'Open in Web'}</span>
+                  {resuming !== 'web' && <span className="resume-cta-beta">Beta</span>}
                 </button>
               )}
             </div>
diff --git a/ui/src/components/workspace/WebPiView.spec.tsx b/ui/src/components/workspace/WebPiView.spec.tsx
deleted file mode 100644
index eeb3b84da5..0000000000
--- a/ui/src/components/workspace/WebPiView.spec.tsx
+++ /dev/null
@@ -1,183 +0,0 @@
-// @vitest-environment jsdom
-
-import { act, cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react'
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-
-import type { WebPiSnapshot } from './api'
-import { isWebPiNearBottom, WebPiView } from './WebPiView'
-
-const mocks = vi.hoisted(() => ({
-  abortWebPiSession: vi.fn(),
-  getWebPiSession: vi.fn(),
-  promptWebPiSession: vi.fn(),
-}))
-
-vi.mock('./api', async (importOriginal) => {
-  const actual = await importOriginal<typeof import('./api')>()
-  return {
-    ...actual,
-    abortWebPiSession: mocks.abortWebPiSession,
-    getWebPiSession: mocks.getWebPiSession,
-    promptWebPiSession: mocks.promptWebPiSession,
-  }
-})
-
-function snapshot(phase: WebPiSnapshot['phase']): WebPiSnapshot {
-  return {
-    recordId: 'p1',
-    wsId: 'workspace-manager',
-    resumeId: 'resume-pi',
-    pid: 42,
-    startedAt: 1,
-    phase,
-    state: { isCompacting: phase === 'compacting', isStreaming: phase === 'working' },
-    messages: [],
-    streamingMessage: null,
-    error: null,
-    stderrTail: '',
-    revision: 1,
-  }
-}
-
-beforeEach(() => {
-  vi.clearAllMocks()
-  Object.defineProperty(HTMLElement.prototype, 'scrollTo', { configurable: true, value: vi.fn() })
-  mocks.getWebPiSession.mockResolvedValue(snapshot('compacting'))
-  mocks.abortWebPiSession.mockResolvedValue(snapshot('idle'))
-  mocks.promptWebPiSession.mockResolvedValue(snapshot('idle'))
-})
-
-afterEach(() => {
-  cleanup()
-  vi.useRealTimers()
-})
-
-describe('WebPi transcript scrolling', () => {
-  it('distinguishes a reader browsing history from one following the tail', () => {
-    expect(isWebPiNearBottom({ scrollTop: 100, clientHeight: 300, scrollHeight: 1_000 } as HTMLElement)).toBe(false)
-    expect(isWebPiNearBottom({ scrollTop: 650, clientHeight: 300, scrollHeight: 1_000 } as HTMLElement)).toBe(true)
-  })
-
-  it('does not force history readers back to the bottom and offers an explicit jump', async () => {
-    mocks.getWebPiSession.mockResolvedValue(snapshot('idle'))
-    const { container } = render(
-      <WebPiView wsId="workspace-manager" sessionId="p1" onSessionLost={vi.fn()} />,
-    )
-    await waitFor(() => expect(mocks.getWebPiSession).toHaveBeenCalled())
-
-    const scroller = container.querySelector('.conversation-messages') as HTMLDivElement
-    Object.defineProperties(scroller, {
-      scrollTop: { configurable: true, writable: true, value: 120 },
-      clientHeight: { configurable: true, value: 300 },
-      scrollHeight: { configurable: true, value: 1_000 },
-    })
-    fireEvent.scroll(scroller)
-
-    const jump = screen.getByRole('button', { name: 'Jump to latest' })
-    fireEvent.click(jump)
-
-    expect(scroller.scrollTo).toHaveBeenLastCalledWith({ top: 1_000, behavior: 'smooth' })
-    expect(screen.queryByRole('button', { name: 'Jump to latest' })).toBeNull()
-  })
-
-  it('does not force history readers back down when a new snapshot revision arrives', async () => {
-    vi.useFakeTimers()
-    let current = snapshot('idle')
-    mocks.getWebPiSession.mockImplementation(async () => current)
-    const { container } = render(
-      <WebPiView wsId="workspace-manager" sessionId="p1" onSessionLost={vi.fn()} />,
-    )
-    await act(async () => {
-      await vi.advanceTimersByTimeAsync(0)
-    })
-
-    const scroller = container.querySelector('.conversation-messages') as HTMLDivElement
-    Object.defineProperties(scroller, {
-      scrollTop: { configurable: true, writable: true, value: 120 },
-      clientHeight: { configurable: true, value: 300 },
-      scrollHeight: { configurable: true, value: 1_000 },
-    })
-    fireEvent.scroll(scroller)
-    const scrollCallsBeforeUpdate = vi.mocked(scroller.scrollTo).mock.calls.length
-
-    current = { ...current, revision: current.revision + 1, phase: 'working' }
-    await act(async () => {
-      await vi.advanceTimersByTimeAsync(1_500)
-    })
-
-    expect(mocks.getWebPiSession).toHaveBeenCalledTimes(2)
-    expect(scroller.scrollTo).toHaveBeenCalledTimes(scrollCallsBeforeUpdate)
-    expect(screen.getByRole('button', { name: 'Jump to latest' })).toBeTruthy()
-  })
-})
-
-describe('WebPi composer keyboard submission', () => {
-  it('does not let a late response from the previous session replace the selected one', async () => {
-    let resolvePrevious!: (value: WebPiSnapshot) => void
-    mocks.getWebPiSession.mockImplementation((_workspace: string, id: string) => id === 'old'
-      ? new Promise<WebPiSnapshot>((resolve) => { resolvePrevious = resolve })
-      : Promise.resolve({ ...snapshot('idle'), recordId: 'new', messages: [{ role: 'user', content: 'New conversation' }] }))
-    const { rerender } = render(<WebPiView wsId="workspace-manager" sessionId="old" onSessionLost={vi.fn()} />)
-    rerender(<WebPiView wsId="workspace-manager" sessionId="new" onSessionLost={vi.fn()} />)
-    expect(await screen.findByText('New conversation')).toBeTruthy()
-    await act(async () => { resolvePrevious({ ...snapshot('idle'), messages: [{ role: 'user', content: 'Old conversation' }] }) })
-    expect(screen.queryByText('Old conversation')).toBeNull()
-  })
-
-  it('uses the shared content-sized textarea so multiline prompts grow until the CSS cap', async () => {
-    mocks.getWebPiSession.mockResolvedValue(snapshot('idle'))
-    render(
-      <WebPiView wsId="workspace-manager" sessionId="p1" onSessionLost={vi.fn()} />,
-    )
-
-    const composer = await screen.findByPlaceholderText('Message Pi…')
-    expect(composer.getAttribute('data-slot')).toBe('textarea')
-    expect(composer.className).toContain('field-sizing-content')
-    expect(composer.getAttribute('rows')).toBe('1')
-  })
-
-  it('does not submit when Enter confirms an IME composition candidate', async () => {
-    mocks.getWebPiSession.mockResolvedValue(snapshot('idle'))
-    render(
-      <WebPiView wsId="workspace-manager" sessionId="p1" onSessionLost={vi.fn()} />,
-    )
-
-    const composer = await screen.findByPlaceholderText('Message Pi…')
-    fireEvent.change(composer, { target: { value: '继续检查' } })
-
-    fireEvent.keyDown(composer, { key: 'Enter', code: 'Enter', isComposing: true })
-    expect(mocks.promptWebPiSession).not.toHaveBeenCalled()
-
-    fireEvent.keyDown(composer, { key: 'Enter', code: 'Enter', isComposing: false })
-    await waitFor(() => expect(mocks.promptWebPiSession).toHaveBeenCalledWith(
-      'workspace-manager',
-      'p1',
-      '继续检查',
-    ))
-  })
-})
-
-describe('WebPiView compaction state', () => {
-  it('explains the pause and keeps the stop action available while Pi compacts', async () => {
-    render(
-      <WebPiView
-        wsId="workspace-manager"
-        sessionId="p1"
-        label="Workspace Manager"
-        onSessionLost={vi.fn()}
-      />,
-    )
-
-    const status = await screen.findByRole('status')
-    expect(status.textContent).toContain('Compacting conversation context')
-    expect(status.textContent).toContain('summarizing older history')
-    expect(screen.getByText('compacting')).toBeTruthy()
-    expect(screen.getByRole('button', { name: 'Stop Pi' })).toBeTruthy()
-    expect(screen.queryByRole('button', { name: 'Send message' })).toBeNull()
-
-    fireEvent.click(screen.getByRole('button', { name: 'Stop Pi' }))
-    await waitFor(() => expect(mocks.abortWebPiSession).toHaveBeenCalledWith('workspace-manager', 'p1'))
-    expect(screen.queryByRole('status')).toBeNull()
-    expect(screen.getByRole('button', { name: 'Send message' })).toBeTruthy()
-  })
-})
diff --git a/ui/src/components/workspace/WebPiView.tsx b/ui/src/components/workspace/WebPiView.tsx
deleted file mode 100644
index e834d576bc..0000000000
--- a/ui/src/components/workspace/WebPiView.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import { type ReactNode } from 'react'
-import { LoaderCircle } from 'lucide-react'
-import { PageTopBar } from '../PageTopBar'
-import { ConversationView } from '../conversation/ConversationView'
-import { useWebPiConversation } from './useWebPiConversation'
-
-export { isConversationNearBottom as isWebPiNearBottom } from '../conversation/ConversationView'
-
-interface Props {
-  readonly wsId: string
-  readonly sessionId: string
-  readonly label?: string
-  readonly headerActions?: ReactNode
-  readonly onSessionLost: () => void
-}
-
-export function WebPiView(props: Props) {
-  return <WebPiSession key={JSON.stringify([props.wsId, props.sessionId])} {...props} />
-}
-
-function WebPiSession({ wsId, sessionId, label, headerActions, onSessionLost }: Props) {
-  const session = useWebPiConversation(wsId, sessionId)
-  const { snapshot, busy } = session
-  return <>
-    <PageTopBar title={label ?? 'Conversation'} actions={headerActions}>
-      {(busy || !snapshot || snapshot.phase === 'failed') && <span className="inline-flex items-center gap-1.5 text-xs text-muted-foreground">
-        {(busy || !snapshot) && <LoaderCircle size={12} className="animate-spin" aria-hidden />}
-        {snapshot?.phase ?? 'starting'}
-      </span>}
-    </PageTopBar>
-    <ConversationView
-      items={session.items}
-      revision={snapshot?.revision ?? 0}
-      busy={busy}
-      ready={!!snapshot && snapshot.phase !== 'failed' && snapshot.phase !== 'starting' && snapshot.phase !== 'stopped'}
-      placeholder="Message Pi…"
-      empty={snapshot ? 'What should Alice work on next?' : 'Opening conversation…'}
-      controls={<span className="px-1.5 py-1 text-xs text-muted-foreground" title="Pi browser adapter">Pi <span className="opacity-60">· Web preview</span></span>}
-      status={snapshot?.phase === 'compacting' && <div className="conversation-compaction-status" role="status">
-        <LoaderCircle size={14} className="animate-spin" aria-hidden />
-        <div><strong>Compacting conversation context</strong><span>Pi is summarizing older history. Sending will resume when the compact finishes.</span></div>
-      </div>}
-      error={session.error ?? (snapshot?.phase === 'stopped' ? 'This session has stopped. Refresh the session to reconnect.' : null)}
-      send={session.send}
-      stop={session.stop}
-      stopLabel="Stop Pi"
-      retry={() => void session.refresh()}
-      recover={onSessionLost}
-    />
-  </>
-}
diff --git a/ui/src/components/workspace/WebSessionView.spec.tsx b/ui/src/components/workspace/WebSessionView.spec.tsx
new file mode 100644
index 0000000000..d0fe20e32e
--- /dev/null
+++ b/ui/src/components/workspace/WebSessionView.spec.tsx
@@ -0,0 +1,301 @@
+// @vitest-environment jsdom
+
+import { act, cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+import type { AgentInfo, WebSessionSnapshot } from './api'
+import { isWebSessionNearBottom, WebSessionView } from './WebSessionView'
+
+const mocks = vi.hoisted(() => ({
+  abortWebSession: vi.fn(),
+  getWebSession: vi.fn(),
+  promptWebSession: vi.fn(),
+  respondWebSession: vi.fn(),
+}))
+
+vi.mock('./api', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('./api')>()
+  return {
+    ...actual,
+    abortWebSession: mocks.abortWebSession,
+    getWebSession: mocks.getWebSession,
+    promptWebSession: mocks.promptWebSession,
+    respondWebSession: mocks.respondWebSession,
+  }
+})
+
+const agents: readonly AgentInfo[] = [
+  {
+    id: 'pi',
+    displayName: 'Pi',
+    capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'none', web: { wire: 'pi-rpc', permissionPrompts: false, freshSession: true } },
+  },
+  {
+    id: 'claude',
+    displayName: 'Claude Code',
+    capabilities: { parallelPerCwd: true, resumeLast: false, resumeById: true, transcriptDiscovery: 'fs-watch', web: { wire: 'claude-stream-json', permissionPrompts: true, freshSession: true } },
+  },
+]
+
+function snapshot(phase: WebSessionSnapshot['phase'], overrides: Partial<WebSessionSnapshot> = {}): WebSessionSnapshot {
+  return {
+    recordId: 'p1',
+    wsId: 'workspace-manager',
+    resumeId: 'resume-pi',
+    agent: 'pi',
+    wire: 'pi-rpc',
+    nativeSessionId: 'native-1',
+    pid: 42,
+    startedAt: 1,
+    phase,
+    messages: [],
+    streamingMessage: null,
+    requests: [],
+    error: null,
+    stderrTail: '',
+    revision: 1,
+    ...overrides,
+  }
+}
+
+beforeEach(() => {
+  vi.clearAllMocks()
+  Object.defineProperty(HTMLElement.prototype, 'scrollTo', { configurable: true, value: vi.fn() })
+  mocks.getWebSession.mockResolvedValue(snapshot('compacting'))
+  mocks.abortWebSession.mockResolvedValue(snapshot('idle'))
+  mocks.promptWebSession.mockResolvedValue(snapshot('idle'))
+  mocks.respondWebSession.mockResolvedValue(snapshot('working'))
+})
+
+afterEach(() => {
+  cleanup()
+  vi.useRealTimers()
+})
+
+describe('Web transcript scrolling', () => {
+  it('distinguishes a reader browsing history from one following the tail', () => {
+    expect(isWebSessionNearBottom({ scrollTop: 100, clientHeight: 300, scrollHeight: 1_000 } as HTMLElement)).toBe(false)
+    expect(isWebSessionNearBottom({ scrollTop: 650, clientHeight: 300, scrollHeight: 1_000 } as HTMLElement)).toBe(true)
+  })
+
+  it('does not force history readers back to the bottom and offers an explicit jump', async () => {
+    mocks.getWebSession.mockResolvedValue(snapshot('idle'))
+    const { container } = render(
+      <WebSessionView wsId="workspace-manager" sessionId="p1" onSessionLost={vi.fn()} />,
+    )
+    await waitFor(() => expect(mocks.getWebSession).toHaveBeenCalled())
+
+    const scroller = container.querySelector('.conversation-messages') as HTMLDivElement
+    Object.defineProperties(scroller, {
+      scrollTop: { configurable: true, writable: true, value: 120 },
+      clientHeight: { configurable: true, value: 300 },
+      scrollHeight: { configurable: true, value: 1_000 },
+    })
+    fireEvent.scroll(scroller)
+
+    const jump = screen.getByRole('button', { name: 'Jump to latest' })
+    fireEvent.click(jump)
+
+    expect(scroller.scrollTo).toHaveBeenLastCalledWith({ top: 1_000, behavior: 'smooth' })
+    expect(screen.queryByRole('button', { name: 'Jump to latest' })).toBeNull()
+  })
+
+  it('does not force history readers back down when a new snapshot revision arrives', async () => {
+    vi.useFakeTimers()
+    let current = snapshot('idle')
+    mocks.getWebSession.mockImplementation(async () => current)
+    const { container } = render(
+      <WebSessionView wsId="workspace-manager" sessionId="p1" onSessionLost={vi.fn()} />,
+    )
+    await act(async () => {
+      await vi.advanceTimersByTimeAsync(0)
+    })
+
+    const scroller = container.querySelector('.conversation-messages') as HTMLDivElement
+    Object.defineProperties(scroller, {
+      scrollTop: { configurable: true, writable: true, value: 120 },
+      clientHeight: { configurable: true, value: 300 },
+      scrollHeight: { configurable: true, value: 1_000 },
+    })
+    fireEvent.scroll(scroller)
+    const scrollCallsBeforeUpdate = vi.mocked(scroller.scrollTo).mock.calls.length
+
+    current = { ...current, revision: current.revision + 1, phase: 'working' }
+    await act(async () => {
+      await vi.advanceTimersByTimeAsync(1_500)
+    })
+
+    expect(mocks.getWebSession).toHaveBeenCalledTimes(2)
+    expect(scroller.scrollTo).toHaveBeenCalledTimes(scrollCallsBeforeUpdate)
+    expect(screen.getByRole('button', { name: 'Jump to latest' })).toBeTruthy()
+  })
+})
+
+describe('Web composer keyboard submission', () => {
+  it('does not let a late response from the previous session replace the selected one', async () => {
+    let resolvePrevious!: (value: WebSessionSnapshot) => void
+    mocks.getWebSession.mockImplementation((_workspace: string, id: string) => id === 'old'
+      ? new Promise<WebSessionSnapshot>((resolve) => { resolvePrevious = resolve })
+      : Promise.resolve(snapshot('idle', { recordId: 'new', messages: [{ role: 'user', content: 'New conversation' }] })))
+    const { rerender } = render(<WebSessionView wsId="workspace-manager" sessionId="old" onSessionLost={vi.fn()} />)
+    rerender(<WebSessionView wsId="workspace-manager" sessionId="new" onSessionLost={vi.fn()} />)
+    expect(await screen.findByText('New conversation')).toBeTruthy()
+    await act(async () => { resolvePrevious(snapshot('idle', { messages: [{ role: 'user', content: 'Old conversation' }] })) })
+    expect(screen.queryByText('Old conversation')).toBeNull()
+  })
+
+  it('uses the shared content-sized textarea so multiline prompts grow until the CSS cap', async () => {
+    mocks.getWebSession.mockResolvedValue(snapshot('idle'))
+    render(
+      <WebSessionView wsId="workspace-manager" sessionId="p1" agents={agents} onSessionLost={vi.fn()} />,
+    )
+
+    const composer = await screen.findByPlaceholderText('Message Pi…')
+    expect(composer.getAttribute('data-slot')).toBe('textarea')
+    expect(composer.className).toContain('field-sizing-content')
+    expect(composer.getAttribute('rows')).toBe('1')
+  })
+
+  it('does not submit when Enter confirms an IME composition candidate', async () => {
+    mocks.getWebSession.mockResolvedValue(snapshot('idle'))
+    render(
+      <WebSessionView wsId="workspace-manager" sessionId="p1" onSessionLost={vi.fn()} />,
+    )
+
+    const composer = await screen.findByPlaceholderText('Message Pi…')
+    fireEvent.change(composer, { target: { value: '继续检查' } })
+
+    fireEvent.keyDown(composer, { key: 'Enter', code: 'Enter', isComposing: true })
+    expect(mocks.promptWebSession).not.toHaveBeenCalled()
+
+    fireEvent.keyDown(composer, { key: 'Enter', code: 'Enter', isComposing: false })
+    await waitFor(() => expect(mocks.promptWebSession).toHaveBeenCalledWith(
+      'workspace-manager',
+      'p1',
+      '继续检查',
+    ))
+  })
+})
+
+describe('WebSessionView runtime identity', () => {
+  it('labels the composer and stop action after the Session runtime, not Pi', async () => {
+    mocks.getWebSession.mockResolvedValue(snapshot('working', { agent: 'claude', wire: 'claude-stream-json' }))
+    render(
+      <WebSessionView wsId="ws-1" sessionId="c1" agent="claude" agents={agents} onSessionLost={vi.fn()} />,
+    )
+
+    expect(await screen.findByRole('button', { name: 'Stop Claude Code' })).toBeTruthy()
+    expect(screen.getByTitle('Claude Code stream-json over stdio')).toBeTruthy()
+    expect(screen.queryByText(/Message Pi/)).toBeNull()
+  })
+
+  it('renders runtime notices as neutral system remarks between turns', async () => {
+    mocks.getWebSession.mockResolvedValue(snapshot('idle', {
+      messages: [
+        { role: 'user', content: 'hi' },
+        { role: 'notice', text: 'Turn stopped by the user.' },
+      ],
+    }))
+    render(<WebSessionView wsId="ws-1" sessionId="c1" onSessionLost={vi.fn()} />)
+
+    const note = await screen.findByRole('note')
+    expect(note.textContent).toBe('Turn stopped by the user.')
+  })
+})
+
+describe('WebSessionView compaction state', () => {
+  it('explains the pause and keeps the stop action available while the runtime compacts', async () => {
+    render(
+      <WebSessionView
+        wsId="workspace-manager"
+        sessionId="p1"
+        label="Workspace Manager"
+        onSessionLost={vi.fn()}
+      />,
+    )
+
+    const status = await screen.findByRole('status')
+    expect(status.textContent).toContain('Compacting conversation context')
+    expect(status.textContent).toContain('summarizing older history')
+    expect(screen.getByText('compacting')).toBeTruthy()
+    expect(screen.getByRole('button', { name: 'Stop Pi' })).toBeTruthy()
+    expect(screen.queryByRole('button', { name: 'Send message' })).toBeNull()
+
+    fireEvent.click(screen.getByRole('button', { name: 'Stop Pi' }))
+    await waitFor(() => expect(mocks.abortWebSession).toHaveBeenCalledWith('workspace-manager', 'p1'))
+    expect(screen.queryByRole('status')).toBeNull()
+    expect(screen.getByRole('button', { name: 'Send message' })).toBeTruthy()
+  })
+})
+
+describe('WebSessionView permission requests', () => {
+  const awaiting = () => snapshot('awaiting-input', {
+    agent: 'claude',
+    wire: 'claude-stream-json',
+    messages: [{ role: 'user', content: 'check the notes' }],
+    streamingMessage: {
+      role: 'assistant',
+      content: [{ type: 'toolCall', id: 'req-1', name: 'Read', arguments: { file_path: 'research/notes.md' } }],
+    },
+    requests: [{
+      id: 'req-1',
+      kind: 'permission',
+      title: 'Allow Read?',
+      description: 'Claude wants to read a file.',
+      tool: { name: 'Read', input: { file_path: 'research/notes.md' } },
+      options: [
+        { id: 'allow', label: 'Allow', tone: 'allow' },
+        { id: 'deny', label: 'Deny', tone: 'deny' },
+      ],
+      createdAt: 1,
+    }],
+  })
+
+  it('pins the runtime question above the composer with its options and tool detail', async () => {
+    mocks.getWebSession.mockResolvedValue(awaiting())
+    render(<WebSessionView wsId="ws-1" sessionId="c1" agents={agents} onSessionLost={vi.fn()} />)
+
+    const card = await screen.findByRole('group', { name: 'Allow Read?' })
+    expect(card.textContent).toContain('Permission needed')
+    expect(card.textContent).toContain('Claude wants to read a file.')
+    expect(card.textContent).toContain('research/notes.md')
+    expect(screen.getByText('waiting for you')).toBeTruthy()
+    // The turn is still in flight: stop stays available, a new prompt is not the way forward.
+    expect(screen.getByRole('button', { name: 'Stop Claude Code' })).toBeTruthy()
+    expect(screen.queryByRole('button', { name: 'Send message' })).toBeNull()
+  })
+
+  it('answers with the chosen option id and adopts the returned snapshot', async () => {
+    mocks.getWebSession.mockResolvedValue(awaiting())
+    mocks.respondWebSession.mockResolvedValue(snapshot('working', { agent: 'claude', wire: 'claude-stream-json', revision: 2 }))
+    render(<WebSessionView wsId="ws-1" sessionId="c1" agents={agents} onSessionLost={vi.fn()} />)
+
+    fireEvent.click(await screen.findByRole('button', { name: 'Deny' }))
+    await waitFor(() => expect(mocks.respondWebSession).toHaveBeenCalledWith('ws-1', 'c1', 'req-1', 'deny'))
+    await waitFor(() => expect(screen.queryByRole('group', { name: 'Allow Read?' })).toBeNull())
+  })
+
+  it('keeps the card and surfaces the failure when the answer is rejected', async () => {
+    mocks.getWebSession.mockResolvedValue(awaiting())
+    mocks.respondWebSession.mockRejectedValue(new Error('no pending request req-1'))
+    render(<WebSessionView wsId="ws-1" sessionId="c1" agents={agents} onSessionLost={vi.fn()} />)
+
+    fireEvent.click(await screen.findByRole('button', { name: 'Allow' }))
+    expect((await screen.findByRole('alert')).textContent).toBe('no pending request req-1')
+    expect(screen.getByRole('group', { name: 'Allow Read?' })).toBeTruthy()
+    expect((screen.getByRole('button', { name: 'Allow' }) as HTMLButtonElement).disabled).toBe(false)
+  })
+
+  it('shows how many further requests wait behind the active one', async () => {
+    const base = awaiting()
+    mocks.getWebSession.mockResolvedValue({
+      ...base,
+      requests: [...base.requests, { ...base.requests[0]!, id: 'req-2', title: 'Allow Bash?' }],
+    })
+    render(<WebSessionView wsId="ws-1" sessionId="c1" agents={agents} onSessionLost={vi.fn()} />)
+
+    const card = await screen.findByRole('group', { name: 'Allow Read?' })
+    expect(card.textContent).toContain('+1 more')
+    expect(screen.queryByRole('group', { name: 'Allow Bash?' })).toBeNull()
+  })
+})
diff --git a/ui/src/components/workspace/WebSessionView.tsx b/ui/src/components/workspace/WebSessionView.tsx
new file mode 100644
index 0000000000..c059b6bb2b
--- /dev/null
+++ b/ui/src/components/workspace/WebSessionView.tsx
@@ -0,0 +1,122 @@
+import { useMemo, type ReactNode } from 'react'
+import { LoaderCircle } from 'lucide-react'
+import { PageTopBar } from '../PageTopBar'
+import { ConversationView } from '../conversation/ConversationView'
+import { ConversationRequestCard, type ConversationRequest } from '../conversation/ConversationRequestCard'
+import { AgentRuntimeIcon } from '../../lib/agentRuntimeIcon'
+import type { AgentInfo, WebPermissionRequest, WebSessionPhase, WebSessionWire } from './api'
+import { useWebConversation } from './useWebConversation'
+import { summarizeToolInput } from './web-transcript'
+
+export { isConversationNearBottom as isWebSessionNearBottom } from '../conversation/ConversationView'
+
+interface Props {
+  readonly wsId: string
+  readonly sessionId: string
+  /** Runtime id of the Session; the snapshot confirms it once loaded. */
+  readonly agent?: string
+  readonly agents?: readonly AgentInfo[]
+  readonly label?: string
+  readonly headerActions?: ReactNode
+  readonly onSessionLost: () => void
+}
+
+/**
+ * Browser conversation surface for any runtime that speaks a structured
+ * protocol. The runtime and its wire are presentation facts here: copy adapts
+ * to them, but the view never touches the protocol itself.
+ */
+export function WebSessionView(props: Props) {
+  return <WebSession key={JSON.stringify([props.wsId, props.sessionId])} {...props} />
+}
+
+function WebSession({ wsId, sessionId, agent, agents, label, headerActions, onSessionLost }: Props) {
+  const session = useWebConversation(wsId, sessionId)
+  const { snapshot, busy, requests } = session
+  const agentId = snapshot?.agent ?? agent ?? 'agent'
+  const agentLabel = agents?.find((entry) => entry.id === agentId)?.displayName ?? fallbackAgentLabel(agentId)
+  const activeRequest = useMemo(() => requests[0] ? presentRequest(requests[0]) : null, [requests])
+  const phaseLabel = snapshot ? describePhase(snapshot.phase) : 'starting'
+  const stopped = snapshot?.phase === 'stopped'
+
+  return <>
+    <PageTopBar title={label ?? 'Conversation'} actions={headerActions}>
+      {(busy || !snapshot || snapshot.phase === 'failed') && <span className="inline-flex items-center gap-1.5 text-xs text-muted-foreground">
+        {(busy || !snapshot) && <LoaderCircle size={12} className="animate-spin" aria-hidden />}
+        {phaseLabel}
+      </span>}
+    </PageTopBar>
+    <ConversationView
+      items={session.items}
+      revision={snapshot?.revision ?? 0}
+      busy={busy}
+      ready={!!snapshot && snapshot.phase !== 'failed' && snapshot.phase !== 'starting' && !stopped}
+      placeholder={`Message ${agentLabel}…`}
+      empty={snapshot ? 'What should Alice work on next?' : 'Opening conversation…'}
+      controls={<span className="inline-flex items-center gap-1.5 px-1.5 py-1 text-xs text-muted-foreground" title={snapshot ? wireDescription(snapshot.wire) : 'Web conversation surface'}>
+        <AgentRuntimeIcon agentId={agentId} className="h-[12px] w-[12px]" />
+        {agentLabel} <span className="opacity-60">· Web</span>
+      </span>}
+      status={<>
+        {snapshot?.phase === 'compacting' && <div className="conversation-compaction-status" role="status">
+          <LoaderCircle size={14} className="animate-spin" aria-hidden />
+          <div><strong>Compacting conversation context</strong><span>{agentLabel} is summarizing older history. Sending will resume when the compact finishes.</span></div>
+        </div>}
+        {activeRequest && <ConversationRequestCard
+          request={activeRequest}
+          queued={requests.length - 1}
+          respond={session.respond}
+        />}
+      </>}
+      error={session.error ?? (stopped ? 'This session has stopped. Refresh the session to reconnect.' : null)}
+      send={session.send}
+      stop={session.stop}
+      stopLabel={`Stop ${agentLabel}`}
+      retry={() => void session.refresh()}
+      recover={onSessionLost}
+    />
+  </>
+}
+
+function presentRequest(request: WebPermissionRequest): ConversationRequest {
+  return {
+    id: request.id,
+    kind: request.kind,
+    title: request.title,
+    ...(request.description ? { description: request.description } : {}),
+    ...(request.tool ? {
+      tool: {
+        name: request.tool.name,
+        summary: summarizeToolInput(request.tool.name, request.tool.input),
+        input: JSON.stringify(request.tool.input, null, 2) ?? '',
+      },
+    } : {}),
+    options: request.options,
+  }
+}
+
+function describePhase(phase: WebSessionPhase): string {
+  return phase === 'awaiting-input' ? 'waiting for you' : phase
+}
+
+function wireDescription(wire: WebSessionWire): string {
+  switch (wire) {
+    case 'pi-rpc': return 'Pi RPC over stdio'
+    case 'acp': return 'Agent Client Protocol over stdio'
+    case 'claude-stream-json': return 'Claude Code stream-json over stdio'
+    case 'codex-app-server': return 'Codex app-server over stdio'
+  }
+}
+
+function fallbackAgentLabel(agentId: string): string {
+  switch (agentId) {
+    case 'claude': return 'Claude Code'
+    case 'codex': return 'Codex'
+    case 'cursor': return 'Cursor Agent'
+    case 'grok': return 'Grok Build'
+    case 'omp': return 'Oh My Pi'
+    case 'opencode': return 'opencode'
+    case 'pi': return 'Pi'
+    default: return agentId
+  }
+}
diff --git a/ui/src/components/workspace/WorkspaceTemplateUpgradePanel.spec.tsx b/ui/src/components/workspace/WorkspaceTemplateUpgradePanel.spec.tsx
index 90c5301157..b233ee6860 100644
--- a/ui/src/components/workspace/WorkspaceTemplateUpgradePanel.spec.tsx
+++ b/ui/src/components/workspace/WorkspaceTemplateUpgradePanel.spec.tsx
@@ -143,6 +143,6 @@ describe('WorkspaceTemplateUpgradePanel', () => {
     render(<WorkspaceTemplateUpgradePanel wsId="chat-old" onWorkspaceChanged={vi.fn()} onClose={vi.fn()} />)
 
     expect(await screen.findByText('Prepare this Workspace before applying')).toBeTruthy()
-    expect(screen.getByText(/p1.*pi.*WebPi/i)).toBeTruthy()
+    expect(screen.getByText(/p1.*pi.*Web/i)).toBeTruthy()
   })
 })
diff --git a/ui/src/components/workspace/WorkspaceTemplateUpgradePanel.tsx b/ui/src/components/workspace/WorkspaceTemplateUpgradePanel.tsx
index 02c21193d4..a20192a41d 100644
--- a/ui/src/components/workspace/WorkspaceTemplateUpgradePanel.tsx
+++ b/ui/src/components/workspace/WorkspaceTemplateUpgradePanel.tsx
@@ -179,7 +179,7 @@ export function WorkspaceTemplateUpgradePanel({
                       {t('workspace.upgradeBlockedSessionItem', {
                         name: session.name,
                         agent: session.agent,
-                        surface: session.surface === 'webpi' ? 'WebPi' : 'TUI',
+                        surface: session.surface === 'webpi' ? 'Web' : 'TUI',
                       })}
                     </li>
                   ))}
diff --git a/ui/src/components/workspace/WorkspaceView.spec.tsx b/ui/src/components/workspace/WorkspaceView.spec.tsx
index c6ae6e5e01..6adf735e69 100644
--- a/ui/src/components/workspace/WorkspaceView.spec.tsx
+++ b/ui/src/components/workspace/WorkspaceView.spec.tsx
@@ -28,7 +28,7 @@ vi.mock('./Terminal', () => ({
     return <div data-testid="terminal-view" />
   },
 }))
-vi.mock('./WebPiView', () => ({ WebPiView: () => null }))
+vi.mock('./WebSessionView', () => ({ WebSessionView: () => null }))
 
 function session(index: number, state: SessionRecord['state']): SessionRecord {
   return {
@@ -75,7 +75,7 @@ describe('WorkspaceView Session library', () => {
         sessions={sessions}
         onSpawnFresh={onSpawnFresh}
         onResume={onResume}
-        onOpenWebPi={vi.fn()}
+        onOpenWeb={vi.fn()}
         onSelectSession={onSelectSession}
         onSessionLost={vi.fn()}
       />,
@@ -122,7 +122,7 @@ describe('WorkspaceView Files panel', () => {
       sessions={[]}
       onSpawnFresh={vi.fn()}
       onResume={vi.fn()}
-      onOpenWebPi={vi.fn()}
+      onOpenWeb={vi.fn()}
       onSelectSession={vi.fn()}
       onSessionLost={vi.fn()}
     />,
@@ -146,7 +146,7 @@ describe('WorkspaceView Files panel', () => {
         sessions={[]}
         onSpawnFresh={vi.fn()}
         onResume={vi.fn()}
-        onOpenWebPi={vi.fn()}
+        onOpenWeb={vi.fn()}
         onSelectSession={vi.fn()}
         onSessionLost={vi.fn()}
       />,
@@ -187,7 +187,7 @@ describe('WorkspaceView paused Session recovery', () => {
         sessions={[paused]}
         onSpawnFresh={vi.fn()}
         onResume={onResume}
-        onOpenWebPi={vi.fn(async () => undefined)}
+        onOpenWeb={vi.fn(async () => undefined)}
         onSelectSession={vi.fn()}
         onSessionLost={vi.fn()}
       />,
@@ -228,7 +228,7 @@ describe('WorkspaceView terminal canvas', () => {
         terminalHeaderActions={headerActions}
         onSpawnFresh={vi.fn()}
         onResume={vi.fn()}
-        onOpenWebPi={vi.fn()}
+        onOpenWeb={vi.fn()}
         onSelectSession={vi.fn()}
         onSessionLost={vi.fn()}
       />,
diff --git a/ui/src/components/workspace/WorkspaceView.tsx b/ui/src/components/workspace/WorkspaceView.tsx
index a323e4f30b..eb3a83f45e 100644
--- a/ui/src/components/workspace/WorkspaceView.tsx
+++ b/ui/src/components/workspace/WorkspaceView.tsx
@@ -10,7 +10,7 @@ import { FilesPanel } from './FilesPanel';
 import { ResumeCta } from './ResumeCta';
 import { formatRelativeTime } from '../../lib/intl';
 import { TerminalView } from './Terminal';
-import { WebPiView } from './WebPiView';
+import { WebSessionView } from './WebSessionView';
 import { useIsDesktop } from '../../live/use-is-desktop';
 import { useWorkspaceSidePanels } from '../../live/workspace-side-panels';
 import type { WorkspaceSource } from '../../tabs/types';
@@ -32,7 +32,7 @@ export interface WorkspaceViewProps {
   readonly sessions: readonly SessionRecord[];
   readonly agents?: readonly AgentInfo[];
   readonly label?: string;
-  /** Actions promoted into the live terminal or WebPi shared titlebar. */
+  /** Actions promoted into the live terminal or Web conversation shared titlebar. */
   readonly terminalHeaderActions?: ReactNode;
   readonly onSpawnFresh: () => void;
   readonly onResume: (sessionId: string) => Promise<void>;
@@ -44,7 +44,7 @@ export interface WorkspaceViewProps {
     resumeId: string,
     displayName: string | null,
   ) => Promise<void>;
-  readonly onOpenWebPi: (sessionId: string) => Promise<void>;
+  readonly onOpenWeb: (sessionId: string) => Promise<void>;
   /** Navigate to an already-running session without re-spawning it. Library
    *  rows call this for running entries; paused entries go through `onResume`. */
   readonly onSelectSession: (sessionId: string) => void;
@@ -121,7 +121,7 @@ export function WorkspaceView(props: WorkspaceViewProps): ReactElement {
               )
               : undefined}
             onResume={() => props.onResume(props.activeRecord!.id)}
-            onOpenWebPi={() => props.onOpenWebPi(props.activeRecord!.id)}
+            onOpenWeb={() => props.onOpenWeb(props.activeRecord!.id)}
           />
         )}
         {!showPausedCta &&
@@ -132,10 +132,12 @@ export function WorkspaceView(props: WorkspaceViewProps): ReactElement {
                 key={s.id}
                 className={`workspace-terminal-slot ${isActive ? 'is-active' : 'is-hidden'}`}
               >
-                {(s.surface ?? 'terminal') === 'webpi' && s.agent === 'pi' ? (
-                  <WebPiView
+                {(s.surface ?? 'terminal') === 'webpi' ? (
+                  <WebSessionView
                     wsId={props.wsId}
                     sessionId={s.id}
+                    agent={s.agent}
+                    {...(props.agents ? { agents: props.agents } : {})}
                     {...(props.label !== undefined ? { label: `${props.label} · ${s.name}` } : {})}
                     onSessionLost={props.onSessionLost}
                     headerActions={props.terminalHeaderActions}
diff --git a/ui/src/components/workspace/api.ts b/ui/src/components/workspace/api.ts
index 280efa7a2f..510a01aeb7 100644
--- a/ui/src/components/workspace/api.ts
+++ b/ui/src/components/workspace/api.ts
@@ -538,9 +538,26 @@ export interface AgentCapabilities {
   readonly transcriptDiscovery: 'fs-watch' | 'subprocess' | 'none';
   readonly assignsSessionId?: boolean;
   readonly headless?: boolean;
+  /** Present when the runtime can drive the browser conversation surface. */
+  readonly web?: WebSurfaceCapability;
   readonly aiProvider?: AgentProviderCapabilities;
 }
 
+export type WebSessionWire = 'pi-rpc' | 'acp' | 'claude-stream-json' | 'codex-app-server';
+
+export interface WebSurfaceCapability {
+  readonly wire: WebSessionWire;
+  /** The runtime asks before tools run and those prompts reach the browser. */
+  readonly permissionPrompts: boolean;
+  /** A Session with no native id yet may still open in the Web surface. */
+  readonly freshSession: boolean;
+}
+
+/** Whether a Session's runtime can present in the Web conversation surface. */
+export function agentSupportsWeb(agents: readonly AgentInfo[] | undefined, agentId: string): boolean {
+  return Boolean(agents?.find((agent) => agent.id === agentId)?.capabilities.web);
+}
+
 export interface AgentProviderCapabilities {
   readonly credentialSource: 'runtime-or-workspace' | 'workspace-required';
   readonly wirePreference: readonly WireShape[];
@@ -760,7 +777,7 @@ export async function setIssueDefaultAgent(agent: string | null): Promise<string
 // ── sessions ─────────────────────────────────────────────────────────────────
 //
 // One persistent product Session record shared by headless, terminal, and
-// WebPi execution surfaces. `pid` + `startedAt` are live read-side projections
+// Web execution surfaces. `pid` + `startedAt` are live read-side projections
 // and are non-null only when an interactive process is attached.
 // Persisted server-side at <OPENALICE_HOME>/workspaces/state/sessions/<wsId>.json
 // so records survive PTY death and server restarts.
@@ -774,7 +791,10 @@ export interface SessionRecord {
   readonly createdAt: string;
   readonly lastActiveAt: string;
   readonly state: 'running' | 'paused';
-  /** UI surface only; `agent` remains `pi` for WebPi. */
+  /**
+   * UI surface only; `agent` stays the runtime id. `webpi` is the persisted
+   * name of the browser conversation surface for every web-capable runtime.
+   */
   readonly surface?: 'terminal' | 'webpi' | 'headless';
   readonly pid: number | null;
   readonly startedAt: number | null;
@@ -808,16 +828,72 @@ export interface SpawnedSession {
   readonly surface?: 'terminal' | 'webpi';
 }
 
-export interface WebPiSnapshot {
+// ── web conversation surface ─────────────────────────────────────────────────
+//
+// Mirrors src/workspaces/web-session/model.ts. The backend projects each
+// runtime's structured protocol (Pi RPC, ACP, Claude stream-json, Codex
+// app-server) into this one neutral shape; the browser never sees the wire.
+
+export type WebContentPart =
+  | { readonly type: 'text'; readonly text: string }
+  | { readonly type: 'thinking'; readonly thinking: string }
+  | { readonly type: 'toolCall'; readonly id: string; readonly name: string; readonly arguments: unknown }
+  | { readonly type: 'data'; readonly value: unknown };
+
+export type WebConversationMessage =
+  | { readonly role: 'user'; readonly content: readonly WebContentPart[] | string; readonly timestamp?: number }
+  | { readonly role: 'assistant'; readonly content: readonly WebContentPart[]; readonly timestamp?: number }
+  | {
+      readonly role: 'toolResult';
+      readonly toolCallId: string;
+      readonly toolName: string;
+      readonly content: readonly WebContentPart[] | string;
+      readonly isError: boolean;
+      readonly timestamp?: number;
+    }
+  | { readonly role: 'notice'; readonly text: string; readonly timestamp?: number }
+  | { readonly role: 'unknown'; readonly value: unknown; readonly timestamp?: number };
+
+export interface WebRequestOption {
+  readonly id: string;
+  readonly label: string;
+  readonly tone: 'allow' | 'deny' | 'neutral';
+}
+
+/** A tool permission, file-change approval, or question the runtime needs answered. */
+export interface WebPermissionRequest {
+  readonly id: string;
+  readonly kind: 'permission' | 'question';
+  readonly title: string;
+  readonly description?: string;
+  readonly tool?: { readonly name: string; readonly input: unknown };
+  readonly options: readonly WebRequestOption[];
+  readonly createdAt: number;
+}
+
+export type WebSessionPhase =
+  | 'starting'
+  | 'idle'
+  | 'working'
+  | 'awaiting-input'
+  | 'compacting'
+  | 'retrying'
+  | 'stopped'
+  | 'failed';
+
+export interface WebSessionSnapshot {
   readonly recordId: string;
   readonly wsId: string;
   readonly resumeId: string;
+  readonly agent: string;
+  readonly wire: WebSessionWire;
+  readonly nativeSessionId: string | null;
   readonly pid: number | null;
   readonly startedAt: number;
-  readonly phase: 'starting' | 'idle' | 'working' | 'compacting' | 'retrying' | 'stopped' | 'failed';
-  readonly state: Record<string, unknown> | null;
-  readonly messages: readonly unknown[];
-  readonly streamingMessage: unknown | null;
+  readonly phase: WebSessionPhase;
+  readonly messages: readonly WebConversationMessage[];
+  readonly streamingMessage: WebConversationMessage | null;
+  readonly requests: readonly WebPermissionRequest[];
   readonly error: string | null;
   readonly stderrTail: string;
   readonly revision: number;
@@ -1145,8 +1221,8 @@ export interface ManagerWorkspaceSnapshot {
 export interface ManagerQuickStartResult {
   readonly manager: ManagerWorkspaceSnapshot
   readonly session: SessionRecord
-  /** Pi opens in WebPi; native TUI runtimes return no structured snapshot. */
-  readonly snapshot: WebPiSnapshot | null
+  /** Pi opens in the Web surface; native TUI runtimes return no structured snapshot. */
+  readonly snapshot: WebSessionSnapshot | null
 }
 
 export async function getWorkspaceManager(): Promise<ManagerWorkspaceSnapshot> {
@@ -1326,62 +1402,64 @@ export async function updateResumeRuntime(
   return { resumeId: body.resumeId, agent: body.agent, runtime: body.runtime };
 }
 
-export async function openWebPiSession(wsId: string, sessionId: string): Promise<WebPiSnapshot> {
-  const res = await fetch(
-    `/api/workspaces/${encodeURIComponent(wsId)}/sessions/${encodeURIComponent(sessionId)}/webpi/open`,
-    { method: 'POST' },
-  );
-  const body = (await res.json().catch(() => null)) as { snapshot?: WebPiSnapshot; message?: string } | null;
-  if (!res.ok || !body?.snapshot) throw new Error(body?.message ?? `WebPi open failed: ${res.status}`);
+function webSessionUrl(wsId: string, sessionId: string, tail = ''): string {
+  return `/api/workspaces/${encodeURIComponent(wsId)}/sessions/${encodeURIComponent(sessionId)}/web${tail}`;
+}
+
+async function webSessionMutation(url: string, action: string, payload?: unknown): Promise<WebSessionSnapshot> {
+  const res = await fetch(url, {
+    method: 'POST',
+    ...(payload === undefined
+      ? {}
+      : { headers: { 'content-type': 'application/json' }, body: JSON.stringify(payload) }),
+  });
+  const body = (await res.json().catch(() => null)) as { snapshot?: WebSessionSnapshot; message?: string } | null;
+  if (!res.ok || !body?.snapshot) throw new Error(body?.message ?? `Web ${action} failed: ${res.status}`);
   return body.snapshot;
 }
 
-export async function getWebPiSession(
+export async function openWebSession(wsId: string, sessionId: string): Promise<WebSessionSnapshot> {
+  return webSessionMutation(webSessionUrl(wsId, sessionId, '/open'), 'open');
+}
+
+export async function getWebSession(
   wsId: string,
   sessionId: string,
   revision?: number,
-): Promise<WebPiSnapshot | null> {
+): Promise<WebSessionSnapshot | null> {
   const query = revision === undefined ? '' : `?revision=${encodeURIComponent(String(revision))}`;
-  const res = await fetch(
-    `/api/workspaces/${encodeURIComponent(wsId)}/sessions/${encodeURIComponent(sessionId)}/webpi${query}`,
-  );
+  const res = await fetch(webSessionUrl(wsId, sessionId, query));
   const body = (await res.json().catch(() => null)) as {
-    snapshot?: WebPiSnapshot;
+    snapshot?: WebSessionSnapshot;
     unchanged?: boolean;
     message?: string;
   } | null;
-  if (!res.ok) throw new Error(body?.message ?? `WebPi read failed: ${res.status}`);
+  if (!res.ok) throw new Error(body?.message ?? `Web read failed: ${res.status}`);
   if (body?.unchanged) return null;
-  if (!body?.snapshot) throw new Error('WebPi response has no snapshot');
+  if (!body?.snapshot) throw new Error('Web response has no snapshot');
   return body.snapshot;
 }
 
-export async function promptWebPiSession(
+export async function promptWebSession(
   wsId: string,
   sessionId: string,
   message: string,
-): Promise<WebPiSnapshot> {
-  const res = await fetch(
-    `/api/workspaces/${encodeURIComponent(wsId)}/sessions/${encodeURIComponent(sessionId)}/webpi/prompt`,
-    {
-      method: 'POST',
-      headers: { 'content-type': 'application/json' },
-      body: JSON.stringify({ message }),
-    },
-  );
-  const body = (await res.json().catch(() => null)) as { snapshot?: WebPiSnapshot; message?: string } | null;
-  if (!res.ok || !body?.snapshot) throw new Error(body?.message ?? `WebPi prompt failed: ${res.status}`);
-  return body.snapshot;
+): Promise<WebSessionSnapshot> {
+  return webSessionMutation(webSessionUrl(wsId, sessionId, '/prompt'), 'prompt', { message });
 }
 
-export async function abortWebPiSession(wsId: string, sessionId: string): Promise<WebPiSnapshot> {
-  const res = await fetch(
-    `/api/workspaces/${encodeURIComponent(wsId)}/sessions/${encodeURIComponent(sessionId)}/webpi/abort`,
-    { method: 'POST' },
-  );
-  const body = (await res.json().catch(() => null)) as { snapshot?: WebPiSnapshot; message?: string } | null;
-  if (!res.ok || !body?.snapshot) throw new Error(body?.message ?? `WebPi abort failed: ${res.status}`);
-  return body.snapshot;
+export async function abortWebSession(wsId: string, sessionId: string): Promise<WebSessionSnapshot> {
+  return webSessionMutation(webSessionUrl(wsId, sessionId, '/abort'), 'abort');
+}
+
+/** Answer a runtime permission/question with one of the options it offered. */
+export async function respondWebSession(
+  wsId: string,
+  sessionId: string,
+  requestId: string,
+  optionId: string,
+): Promise<WebSessionSnapshot> {
+  return webSessionMutation(webSessionUrl(wsId, sessionId, '/respond'), 'respond', { requestId, optionId });
 }
 
 /** Remove a conversation from the active floor (kills its process first). */
diff --git a/ui/src/components/workspace/harness-sessions.ts b/ui/src/components/workspace/harness-sessions.ts
index 44068b306b..174b0efb89 100644
--- a/ui/src/components/workspace/harness-sessions.ts
+++ b/ui/src/components/workspace/harness-sessions.ts
@@ -103,7 +103,7 @@ export function toHarnessSession(
 
 /**
  * A Session that was born on a headless turn and has never opened a TUI or
- * WebPi. Ask Alice / Auto Quant hide these by default; the Issue page still
+ * Web conversation. Ask Alice / Auto Quant hide these by default; the Issue page still
  * owns them.
  */
 export function isHeadlessBornWithoutInteractive(
diff --git a/ui/src/components/workspace/useWebConversation.ts b/ui/src/components/workspace/useWebConversation.ts
new file mode 100644
index 0000000000..5e751395df
--- /dev/null
+++ b/ui/src/components/workspace/useWebConversation.ts
@@ -0,0 +1,72 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import {
+  abortWebSession,
+  getWebSession,
+  promptWebSession,
+  respondWebSession,
+  type WebSessionPhase,
+  type WebSessionSnapshot,
+} from './api'
+import { presentWebTranscript } from './web-presentation'
+
+/**
+ * Live view of one Web conversation. Polls faster while the runtime works and
+ * only accepts monotonically newer revisions so a late response from a
+ * previous poll can never roll the transcript back.
+ *
+ * One mounted identity; WebSessionView keys this hook's owner by workspace/session.
+ */
+export function useWebConversation(wsId: string, sessionId: string) {
+  const [snapshot, setSnapshot] = useState<WebSessionSnapshot | null>(null)
+  const [error, setError] = useState<string | null>(null)
+  const current = useRef<WebSessionSnapshot | null>(null)
+  const alive = useRef(false)
+  const accept = useCallback((next: WebSessionSnapshot) => {
+    if (!alive.current || (current.current && next.revision < current.current.revision)) return
+    current.current = next
+    setSnapshot(next)
+    setError(next.error)
+  }, [])
+  const refresh = useCallback(async () => {
+    try {
+      const next = await getWebSession(wsId, sessionId, current.current?.revision)
+      if (next) accept(next)
+      else if (alive.current) setError(current.current?.error ?? null)
+    } catch (error) { if (alive.current) setError(error instanceof Error ? error.message : String(error)) }
+  }, [accept, wsId, sessionId])
+  useEffect(() => {
+    alive.current = true
+    let cancelled = false
+    let timer: number | undefined
+    async function poll() {
+      await refresh()
+      if (cancelled) return
+      timer = window.setTimeout(() => void poll(), isBusy(current.current?.phase) ? 350 : 1500)
+    }
+    void poll()
+    return () => { alive.current = false; cancelled = true; window.clearTimeout(timer) }
+  }, [refresh])
+  const items = useMemo(() => presentWebTranscript(snapshot ? [...snapshot.messages, ...(snapshot.streamingMessage ? [snapshot.streamingMessage] : [])] : []), [snapshot])
+  return {
+    snapshot,
+    error,
+    items,
+    busy: isBusy(snapshot?.phase),
+    requests: snapshot?.requests ?? [],
+    refresh,
+    send: async (message: string) => { accept(await promptWebSession(wsId, sessionId, message)) },
+    stop: async () => { accept(await abortWebSession(wsId, sessionId)) },
+    respond: async (requestId: string, optionId: string) => {
+      accept(await respondWebSession(wsId, sessionId, requestId, optionId))
+    },
+  }
+}
+
+/**
+ * A turn is in flight. `awaiting-input` counts: the runtime is mid-turn and
+ * blocked on the user answering a request, so the composer stays in stop mode
+ * and the request card, not a new prompt, is the way forward.
+ */
+export function isBusy(phase: WebSessionPhase | undefined): boolean {
+  return phase === 'working' || phase === 'retrying' || phase === 'compacting' || phase === 'awaiting-input'
+}
diff --git a/ui/src/components/workspace/useWebPiConversation.ts b/ui/src/components/workspace/useWebPiConversation.ts
deleted file mode 100644
index 9413be429b..0000000000
--- a/ui/src/components/workspace/useWebPiConversation.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
-import { abortWebPiSession, getWebPiSession, promptWebPiSession, type WebPiSnapshot } from './api'
-import { presentPiTranscript } from './webpi-presentation'
-
-/** One mounted identity; WebPiView keys this hook's owner by workspace/session. */
-export function useWebPiConversation(wsId: string, sessionId: string) {
-  const [snapshot, setSnapshot] = useState<WebPiSnapshot | null>(null)
-  const [error, setError] = useState<string | null>(null)
-  const current = useRef<WebPiSnapshot | null>(null)
-  const alive = useRef(false)
-  const accept = useCallback((next: WebPiSnapshot) => {
-    if (!alive.current || (current.current && next.revision < current.current.revision)) return
-    current.current = next
-    setSnapshot(next)
-    setError(next.error)
-  }, [])
-  const refresh = useCallback(async () => {
-    try {
-      const next = await getWebPiSession(wsId, sessionId, current.current?.revision)
-      if (next) accept(next)
-      else if (alive.current) setError(current.current?.error ?? null)
-    } catch (error) { if (alive.current) setError(error instanceof Error ? error.message : String(error)) }
-  }, [accept, wsId, sessionId])
-  useEffect(() => {
-    alive.current = true
-    let cancelled = false
-    let timer: number | undefined
-    async function poll() {
-      await refresh()
-      if (cancelled) return
-      timer = window.setTimeout(() => void poll(), isBusy(current.current?.phase) ? 350 : 1500)
-    }
-    void poll()
-    return () => { alive.current = false; cancelled = true; window.clearTimeout(timer) }
-  }, [refresh])
-  const items = useMemo(() => presentPiTranscript(snapshot ? [...snapshot.messages, ...(snapshot.streamingMessage ? [snapshot.streamingMessage] : [])] : []), [snapshot])
-  return {
-    snapshot, error, items, busy: isBusy(snapshot?.phase), refresh,
-    send: async (message: string) => { accept(await promptWebPiSession(wsId, sessionId, message)) },
-    stop: async () => { accept(await abortWebPiSession(wsId, sessionId)) },
-  }
-}
-
-function isBusy(phase: WebPiSnapshot['phase'] | undefined) { return phase === 'working' || phase === 'retrying' || phase === 'compacting' }
diff --git a/ui/src/components/workspace/webpi-presentation.spec.ts b/ui/src/components/workspace/web-presentation.spec.ts
similarity index 79%
rename from ui/src/components/workspace/webpi-presentation.spec.ts
rename to ui/src/components/workspace/web-presentation.spec.ts
index 5baeca5e90..c7947aec2b 100644
--- a/ui/src/components/workspace/webpi-presentation.spec.ts
+++ b/ui/src/components/workspace/web-presentation.spec.ts
@@ -1,16 +1,16 @@
 import { describe, expect, it } from 'vitest'
-import { piContent, presentPiTranscript } from './webpi-presentation'
+import { webContent, presentWebTranscript } from './web-presentation'
 
 describe('Pi presentation boundary', () => {
   it('normalizes wire content without losing unrecognized events', () => {
-    expect(piContent([{ type: 'text', text: 'Hello' }, { type: 'thinking', thinking: 'Reason' }, { type: 'future', value: 42 }])).toEqual([
+    expect(webContent([{ type: 'text', text: 'Hello' }, { type: 'thinking', thinking: 'Reason' }, { type: 'future', value: 42 }])).toEqual([
       { kind: 'markdown', text: 'Hello' },
       { kind: 'disclosure', label: 'Thinking', content: [{ kind: 'markdown', text: 'Reason' }] },
       { kind: 'data', text: JSON.stringify({ type: 'future', value: 42 }, null, 2) },
     ])
   })
   it('normalizes correlated tool results rather than passing Pi parts into the UI', () => {
-    const items = presentPiTranscript([
+    const items = presentWebTranscript([
       { role: 'assistant', content: [{ type: 'toolCall', id: 'call-1', name: 'read', arguments: { path: 'README.md' } }] },
       { role: 'toolResult', toolCallId: 'call-1', content: [{ type: 'text', text: 'Not found' }], isError: true },
     ])
diff --git a/ui/src/components/workspace/webpi-presentation.ts b/ui/src/components/workspace/web-presentation.ts
similarity index 68%
rename from ui/src/components/workspace/webpi-presentation.ts
rename to ui/src/components/workspace/web-presentation.ts
index cd19408136..2888a46798 100644
--- a/ui/src/components/workspace/webpi-presentation.ts
+++ b/ui/src/components/workspace/web-presentation.ts
@@ -1,8 +1,12 @@
 import type { ConversationContent, ConversationItem } from '../conversation/types'
-import { contentText, groupWebPiTranscript, summarizeToolInput } from './webpi-transcript'
+import { contentText, groupWebTranscript, summarizeToolInput } from './web-transcript'
 
-/** Pi's wire content is interpreted here, never by the shared renderer. */
-export function piContent(value: unknown): ConversationContent {
+/**
+ * Neutral Web content parts are interpreted here, never by the shared
+ * renderer. The shape is Pi's minimal message model, which every transport
+ * (Pi RPC, ACP, Claude stream-json, Codex app-server) projects onto.
+ */
+export function webContent(value: unknown): ConversationContent {
   if (typeof value === 'string') return [{ kind: 'markdown', text: value }]
   if (!Array.isArray(value)) {
     const item = record(value)
@@ -15,13 +19,15 @@ export function piContent(value: unknown): ConversationContent {
     if (item?.type === 'text' && typeof item.text === 'string') return [{ kind: 'markdown', text: item.text }]
     if (item?.type === 'thinking') return [{ kind: 'disclosure', label: 'Thinking', content: [{ kind: 'markdown', text: String(item.thinking ?? item.text ?? '') }] }]
     if (item?.type === 'toolCall') return [{ kind: 'disclosure', label: `Used ${String(item.name ?? 'tool')}`, content: [{ kind: 'data', text: json(item.arguments ?? {}) }] }]
+    if (item?.type === 'data') return [{ kind: 'data', text: json(item.value) }]
     return [{ kind: 'data', text: json(part) }]
   })
 }
 
-export function presentPiTranscript(messages: readonly unknown[]): ConversationItem[] {
-  return groupWebPiTranscript(messages).map((item): ConversationItem => {
-    if (item.kind === 'user') return { ...item, content: piContent(item.content) }
+export function presentWebTranscript(messages: readonly unknown[]): ConversationItem[] {
+  return groupWebTranscript(messages).map((item): ConversationItem => {
+    if (item.kind === 'user') return { ...item, content: webContent(item.content) }
+    if (item.kind === 'notice') return item
     if (item.kind === 'unknown') return { kind: 'unknown', key: item.key, content: [{ kind: 'data', text: json(item.value) }] }
     return {
       ...item,
@@ -32,7 +38,7 @@ export function presentPiTranscript(messages: readonly unknown[]): ConversationI
           ...step,
           summary: summarizeToolInput(step.name, step.input),
           input: json(step.input),
-          result: step.result === undefined ? undefined : piContent(step.result),
+          result: step.result === undefined ? undefined : webContent(step.result),
           resultChars: step.result === undefined ? undefined : contentText(step.result).length,
         })),
       },
diff --git a/ui/src/components/workspace/webpi-transcript.spec.ts b/ui/src/components/workspace/web-transcript.spec.ts
similarity index 93%
rename from ui/src/components/workspace/webpi-transcript.spec.ts
rename to ui/src/components/workspace/web-transcript.spec.ts
index b8382694a5..f58dc5f950 100644
--- a/ui/src/components/workspace/webpi-transcript.spec.ts
+++ b/ui/src/components/workspace/web-transcript.spec.ts
@@ -1,13 +1,13 @@
 import { describe, expect, it } from 'vitest'
 import {
   activityToolLabel,
-  groupWebPiTranscript,
+  groupWebTranscript,
   summarizeToolInput,
-} from './webpi-transcript'
+} from './web-transcript'
 
-describe('groupWebPiTranscript', () => {
+describe('groupWebTranscript', () => {
   it('turns Pi assistant/tool hops into one auditable activity group', () => {
-    const transcript = groupWebPiTranscript([
+    const transcript = groupWebTranscript([
       { role: 'user', content: [{ type: 'text', text: 'Send the report.' }] },
       {
         role: 'assistant',
@@ -46,7 +46,7 @@ describe('groupWebPiTranscript', () => {
   })
 
   it('keeps failures openable and preserves unmatched native tool results', () => {
-    const transcript = groupWebPiTranscript([
+    const transcript = groupWebTranscript([
       { role: 'assistant', content: [{ type: 'toolCall', id: 'pending', name: 'bash', arguments: {} }] },
       { role: 'toolResult', toolCallId: 'orphan', toolName: 'read', isError: true, content: [{ type: 'text', text: 'missing' }] },
     ])
@@ -62,7 +62,7 @@ describe('groupWebPiTranscript', () => {
   })
 })
 
-describe('WebPi activity summaries', () => {
+describe('Web activity summaries', () => {
   it('summarizes safe, useful arguments without exposing write contents', () => {
     expect(summarizeToolInput('write', { path: 'research/report.md', content: 'secret body' }))
       .toBe('research/report.md')
diff --git a/ui/src/components/workspace/webpi-transcript.ts b/ui/src/components/workspace/web-transcript.ts
similarity index 82%
rename from ui/src/components/workspace/webpi-transcript.ts
rename to ui/src/components/workspace/web-transcript.ts
index e3088f3c01..e8cd5a165d 100644
--- a/ui/src/components/workspace/webpi-transcript.ts
+++ b/ui/src/components/workspace/web-transcript.ts
@@ -1,4 +1,4 @@
-export interface WebPiToolStep {
+export interface WebToolStep {
   readonly id: string
   readonly name: string
   readonly input: unknown
@@ -7,13 +7,13 @@ export interface WebPiToolStep {
   readonly status: 'running' | 'succeeded' | 'failed'
 }
 
-export interface WebPiActivity {
-  readonly steps: readonly WebPiToolStep[]
+export interface WebActivity {
+  readonly steps: readonly WebToolStep[]
   readonly thinking: readonly string[]
   readonly unknownParts: readonly unknown[]
 }
 
-export type WebPiTranscriptItem =
+export type WebTranscriptItem =
   | {
       readonly kind: 'user'
       readonly key: string
@@ -24,7 +24,12 @@ export type WebPiTranscriptItem =
       readonly key: string
       readonly progress: readonly string[]
       readonly final: string | null
-      readonly activity: WebPiActivity | null
+      readonly activity: WebActivity | null
+    }
+  | {
+      readonly kind: 'notice'
+      readonly key: string
+      readonly text: string
     }
   | {
       readonly kind: 'unknown'
@@ -42,12 +47,13 @@ interface ToolResultRecord {
 }
 
 /**
- * Pi persists each assistant/tool-result hop as a native message. The browser
- * should present those records as one conversational turn without replacing
- * Pi's schema or losing the raw audit trail.
+ * Every Web transport projects its runtime into the neutral message list:
+ * one record per assistant hop and tool result. The browser presents those
+ * records as one conversational turn without replacing the runtime's own
+ * schema or losing the raw audit trail.
  */
-export function groupWebPiTranscript(messages: readonly unknown[]): WebPiTranscriptItem[] {
-  const items: WebPiTranscriptItem[] = []
+export function groupWebTranscript(messages: readonly unknown[]): WebTranscriptItem[] {
+  const items: WebTranscriptItem[] = []
   let turn: MutableTurn | null = null
 
   const flushTurn = (): void => {
@@ -74,7 +80,15 @@ export function groupWebPiTranscript(messages: readonly unknown[]): WebPiTranscr
       return
     }
     flushTurn()
-    items.push({ kind: 'unknown', key: messageKey(value, index), value })
+    if (role === 'notice' && typeof record?.['text'] === 'string') {
+      items.push({ kind: 'notice', key: messageKey(value, index), text: record['text'] })
+      return
+    }
+    items.push({
+      kind: 'unknown',
+      key: messageKey(value, index),
+      value: role === 'unknown' && record && 'value' in record ? record['value'] : value,
+    })
   })
   flushTurn()
   return items
@@ -83,7 +97,7 @@ export function groupWebPiTranscript(messages: readonly unknown[]): WebPiTranscr
 export function summarizeToolInput(_name: string, input: unknown): string | null {
   const record = asRecord(input)
   if (!record) return primitiveSummary(input)
-  const path = firstString(record, ['path', 'file', 'filePath', 'target'])
+  const path = firstString(record, ['path', 'file', 'filePath', 'file_path', 'target'])
   if (path) return truncateLine(path, 84)
   const command = firstString(record, ['command', 'cmd'])
   if (command) return truncateLine(command, 84)
@@ -95,7 +109,7 @@ export function summarizeToolInput(_name: string, input: unknown): string | null
   return fallback ? truncateLine(String(fallback[1]), 84) : null
 }
 
-export function activityToolLabel(steps: readonly WebPiToolStep[]): string {
+export function activityToolLabel(steps: readonly WebToolStep[]): string {
   const counts = new Map<string, number>()
   for (const step of steps) counts.set(step.name, (counts.get(step.name) ?? 0) + 1)
   return [...counts].map(([name, count]) => count > 1 ? `${name} ×${count}` : name).join(' · ')
@@ -113,7 +127,7 @@ export function contentText(value: unknown): string {
   }).join('\n')
 }
 
-function buildAssistantTurn(turn: MutableTurn): WebPiTranscriptItem {
+function buildAssistantTurn(turn: MutableTurn): WebTranscriptItem {
   const results = new Map<string, ToolResultRecord>()
   for (const message of turn.messages) {
     const record = asRecord(message.value)
@@ -126,7 +140,7 @@ function buildAssistantTurn(turn: MutableTurn): WebPiTranscriptItem {
 
   const usedResults = new Set<string>()
   const texts: string[] = []
-  const steps: WebPiToolStep[] = []
+  const steps: WebToolStep[] = []
   const detachedThinking: string[] = []
   const unknownParts: unknown[] = []
 
@@ -172,6 +186,10 @@ function buildAssistantTurn(turn: MutableTurn): WebPiTranscriptItem {
         pendingThinking = []
         continue
       }
+      if (type === 'data') {
+        unknownParts.push(item?.['value'] ?? part)
+        continue
+      }
       unknownParts.push(part)
     }
     detachedThinking.push(...pendingThinking)
@@ -195,8 +213,9 @@ function buildAssistantTurn(turn: MutableTurn): WebPiTranscriptItem {
     : null
   return {
     kind: 'assistant-turn',
-    // Keep the key stable while Pi appends tool calls/results during polling.
-    // Otherwise every newly-arrived step remounts the disclosure and closes it.
+    // Keep the key stable while the runtime appends tool calls/results during
+    // polling. Otherwise every newly-arrived step remounts the disclosure and
+    // closes it.
     key: `assistant-${turn.startIndex}`,
     progress: texts.slice(0, -1),
     final,
diff --git a/ui/src/components/workspace/workspaces.css b/ui/src/components/workspace/workspaces.css
index 03148c7348..fd914dc0c4 100644
--- a/ui/src/components/workspace/workspaces.css
+++ b/ui/src/components/workspace/workspaces.css
@@ -1296,7 +1296,7 @@ button.files-row:focus-visible {
   padding-inline: 14px;
 }
 
-.resume-cta-btn.is-webpi {
+.resume-cta-btn.is-web {
   background: color-mix(in srgb, var(--primary) 13%, var(--secondary));
   color: var(--foreground);
 }
diff --git a/ui/src/contexts/WorkspacesContext.spec.tsx b/ui/src/contexts/WorkspacesContext.spec.tsx
index dd835631ed..d9860c8e34 100644
--- a/ui/src/contexts/WorkspacesContext.spec.tsx
+++ b/ui/src/contexts/WorkspacesContext.spec.tsx
@@ -28,7 +28,7 @@ const mocks = vi.hoisted(() => ({
   getWorkspaceManager: vi.fn(),
   pauseSession: vi.fn(),
   resumeSession: vi.fn(),
-  openWebPiSession: vi.fn(),
+  openWebSession: vi.fn(),
   quickChat: vi.fn(),
   deleteSession: vi.fn(),
   getWorkspaceState: vi.fn(),
@@ -59,7 +59,7 @@ vi.mock('../components/workspace/api', async (importOriginal) => {
     getWorkspaceManager: mocks.getWorkspaceManager,
     pauseSession: mocks.pauseSession,
     resumeSession: mocks.resumeSession,
-    openWebPiSession: mocks.openWebPiSession,
+    openWebSession: mocks.openWebSession,
     quickChat: mocks.quickChat,
     deleteSession: mocks.deleteSession,
   }
@@ -146,7 +146,7 @@ function ManagerProbe() {
     workspaceManager,
     pauseSession,
     resumeSession,
-    openWebPiSession,
+    openWebSession,
     requestDeleteSession,
   } = useWorkspaces()
   const session = workspaceManager?.sessions[0]
@@ -156,7 +156,7 @@ function ManagerProbe() {
       <span>{session.title}</span>
       <button type="button" onClick={() => void pauseSession(MANAGER_WORKSPACE_ID, session.id)}>Pause manager</button>
       <button type="button" onClick={() => void resumeSession(MANAGER_WORKSPACE_ID, session.id)}>Resume manager</button>
-      <button type="button" onClick={() => void openWebPiSession(MANAGER_WORKSPACE_ID, session.id)}>Open manager WebPi</button>
+      <button type="button" onClick={() => void openWebSession(MANAGER_WORKSPACE_ID, session.id)}>Open manager Web</button>
       <button type="button" onClick={() => requestDeleteSession(MANAGER_WORKSPACE_ID, session.id)}>Delete manager</button>
     </div>
   )
@@ -198,7 +198,7 @@ beforeEach(async () => {
   mocks.getWorkspaceManager.mockResolvedValue(managerSnapshot())
   mocks.pauseSession.mockResolvedValue(true)
   mocks.resumeSession.mockResolvedValue(null)
-  mocks.openWebPiSession.mockResolvedValue({ pid: 43, startedAt: 3 })
+  mocks.openWebSession.mockResolvedValue({ pid: 43, startedAt: 3 })
   mocks.quickChat.mockResolvedValue({
     workspace: workspace(),
     session: {
@@ -228,7 +228,7 @@ beforeEach(async () => {
 afterEach(cleanup)
 
 describe('WorkspacesProvider conversation routing', () => {
-  it('adopts an explicit WebPi surface returned by quick-chat', async () => {
+  it('adopts an explicit Web surface returned by quick-chat', async () => {
     mocks.listWorkspaces
       .mockResolvedValueOnce([workspace()])
       .mockImplementation(() => new Promise(() => undefined))
@@ -297,8 +297,8 @@ describe('WorkspacesProvider conversation routing', () => {
       params: { sessionId: 'opencode-manager-session' },
     }))
 
-    fireEvent.click(screen.getByRole('button', { name: 'Open manager WebPi' }))
-    await waitFor(() => expect(mocks.openWebPiSession).toHaveBeenCalledWith(
+    fireEvent.click(screen.getByRole('button', { name: 'Open manager Web' }))
+    await waitFor(() => expect(mocks.openWebSession).toHaveBeenCalledWith(
       MANAGER_WORKSPACE_ID,
       'opencode-manager-session',
     ))
diff --git a/ui/src/contexts/WorkspacesContext.tsx b/ui/src/contexts/WorkspacesContext.tsx
index 9697a5e8a8..b89205de52 100644
--- a/ui/src/contexts/WorkspacesContext.tsx
+++ b/ui/src/contexts/WorkspacesContext.tsx
@@ -48,7 +48,7 @@ import {
   initializeAutoQuantWorkspace as apiInitializeAutoQuantWorkspace,
   initializeAutoPredictionWorkspace as apiInitializeAutoPredictionWorkspace,
   initializeChatWorkspace as apiInitializeChatWorkspace,
-  openWebPiSession as apiOpenWebPiSession,
+  openWebSession as apiOpenWebSession,
   openResumeSession,
   pauseSession as apiPauseSession,
   quickChat as apiQuickChat,
@@ -555,9 +555,9 @@ export function WorkspacesProvider({ children }: { children: ReactNode }) {
     [ensureTerminalAppearancePublished, refresh, refreshWorkspaceManager, openOrFocus],
   )
 
-  const openWebPiSession = useCallback(
+  const openWebSession = useCallback(
     async (wsId: string, sessionId: string, source?: WorkspaceSource): Promise<void> => {
-      const snapshot = await apiOpenWebPiSession(wsId, sessionId)
+      const snapshot = await apiOpenWebSession(wsId, sessionId)
       const patch = {
         state: 'running' as const,
         surface: 'webpi' as const,
@@ -792,7 +792,7 @@ export function WorkspacesProvider({ children }: { children: ReactNode }) {
     quickChat,
     pauseSession,
     resumeSession,
-    openWebPiSession,
+    openWebSession,
     requestDeleteSession,
     setSessionPresence,
     setSessionDisplayName,
@@ -817,7 +817,7 @@ export function WorkspacesProvider({ children }: { children: ReactNode }) {
     listError,
     openAgentConfig,
     openHeadlessRun,
-    openWebPiSession,
+    openWebSession,
     pauseSession,
     quickChat,
     quickStartWorkspaceManager,
diff --git a/ui/src/contexts/workspaces-context.ts b/ui/src/contexts/workspaces-context.ts
index 6183daac38..c6f3291c24 100644
--- a/ui/src/contexts/workspaces-context.ts
+++ b/ui/src/contexts/workspaces-context.ts
@@ -73,7 +73,7 @@ export interface WorkspacesContextValue {
   ): Promise<string>
   pauseSession(wsId: string, sessionId: string): Promise<void>
   resumeSession(wsId: string, sessionId: string, source?: WorkspaceSource): Promise<void>
-  openWebPiSession(wsId: string, sessionId: string, source?: WorkspaceSource): Promise<void>
+  openWebSession(wsId: string, sessionId: string, source?: WorkspaceSource): Promise<void>
   requestDeleteSession(wsId: string, sessionId: string): void
   setSessionPresence(
     wsId: string,
diff --git a/ui/src/demo/README.md b/ui/src/demo/README.md
index e67b251811..a150bc96b1 100644
--- a/ui/src/demo/README.md
+++ b/ui/src/demo/README.md
@@ -15,11 +15,13 @@ Gated by `import.meta.env.VITE_DEMO_MODE`; tree-shaken in production builds.
   last in `handlers/index.ts`.
 - `fixtures/` — typed const exports. Only non-trivial shapes get their own
   file; empty arrays / nulls live inline in handlers.
-- `fixtures/webpi.ts` — recorded native Pi messages for the featured Sessions.
-  The normal `WebPiView` renders them; demo mode replaces only the HTTP
-  transport and never forks the conversation UI.
+- `fixtures/web-session.ts` — recorded neutral Web messages for the featured
+  Sessions plus the per-runtime Web capability table and the scripted
+  permission-request turn for runtimes that prompt before tools. The normal
+  `WebSessionView` renders them; demo mode replaces only the HTTP transport
+  and never forks the conversation UI.
 - `DemoTerminalReplay.tsx` / `DemoTerminalStub.tsx` — legacy TUI preview and
-  fallback for the non-Pi runtime rows retained in the demo.
+  fallback for runtime rows without a Web surface (Antigravity, shell).
 
 ## Running
 
@@ -35,5 +37,5 @@ endpoints that need real handlers. Then:
 
 - Rich fixtures (multiple UTAs, varied positions, P&L, workspace sessions).
 - Scripted timelines for the remaining event-driven surfaces.
-- Richer multi-turn WebPi recordings and explicit scenario selection.
+- Richer multi-turn Web recordings and explicit scenario selection.
 - In-memory mutation coverage beyond Quick Chat (create-then-reload survives).
diff --git a/ui/src/demo/fixtures/web-session.ts b/ui/src/demo/fixtures/web-session.ts
new file mode 100644
index 0000000000..7fc5aeb0f4
--- /dev/null
+++ b/ui/src/demo/fixtures/web-session.ts
@@ -0,0 +1,360 @@
+import type {
+  WebConversationMessage,
+  WebPermissionRequest,
+  WebSessionSnapshot,
+  WebSessionWire,
+  WebSurfaceCapability,
+} from '../../components/workspace/api'
+import {
+  DEMO_CHAT_SESSION_ID,
+  DEMO_CHAT_WORKSPACE_ID,
+  DEMO_SESSION_ID,
+  DEMO_WORKSPACE_ID,
+} from './workspaces'
+
+/**
+ * Web surface capability per demo runtime. Mirrors the adapter declarations
+ * in src/workspaces/adapters so the demo gates the same buttons production
+ * does. Antigravity has no structured protocol and therefore stays TUI-only.
+ */
+export const demoWebCapabilities: Readonly<Record<string, WebSurfaceCapability>> = {
+  claude: { wire: 'claude-stream-json', permissionPrompts: true, freshSession: true },
+  codex: { wire: 'codex-app-server', permissionPrompts: true, freshSession: true },
+  cursor: { wire: 'acp', permissionPrompts: true, freshSession: true },
+  grok: { wire: 'acp', permissionPrompts: true, freshSession: true },
+  omp: { wire: 'pi-rpc', permissionPrompts: false, freshSession: true },
+  opencode: { wire: 'acp', permissionPrompts: true, freshSession: true },
+  pi: { wire: 'pi-rpc', permissionPrompts: false, freshSession: true },
+}
+
+export function demoWebWire(agent: string): WebSessionWire {
+  return demoWebCapabilities[agent]?.wire ?? 'pi-rpc'
+}
+
+export interface DemoWebSeed {
+  readonly wsId: string
+  readonly sessionId: string
+  readonly resumeId: string
+  readonly agent: string
+  readonly startedAt: number
+  readonly messages: readonly WebConversationMessage[]
+}
+
+const aaplResearchMessages: readonly WebConversationMessage[] = [
+  {
+    role: 'user',
+    content: "Hey, what jumped out from Apple's Q1 earnings?",
+  },
+  {
+    role: 'assistant',
+    content: [
+      {
+        type: 'thinking',
+        thinking: 'I should compare the quarter with the recent trend instead of repeating the headline EPS result.',
+      },
+      {
+        type: 'toolCall',
+        id: 'aapl-filings',
+        name: 'read',
+        arguments: { path: 'data/sec/aapl/10-Q-Q1-2026.json' },
+      },
+    ],
+  },
+  {
+    role: 'toolResult',
+    toolCallId: 'aapl-filings',
+    toolName: 'read',
+    isError: false,
+    content: 'Services revenue YoY: Q2 +16.3%, Q3 +14.2%, Q4 +12.0%, Q1 +9.1%. Services gross margin remains the company margin anchor.',
+  },
+  {
+    role: 'assistant',
+    content: [
+      {
+        type: 'thinking',
+        thinking: 'The useful signal is the three-quarter deceleration. I should preserve the evidence and make the threshold explicit.',
+      },
+      {
+        type: 'text',
+        text: 'The headline beat looks fine, but the Services trend is more interesting. I’m writing the comparison into the Workspace so it remains reviewable.',
+      },
+      {
+        type: 'toolCall',
+        id: 'aapl-report',
+        name: 'write',
+        arguments: { path: 'research/AAPL-q1-hidden-deceleration.md' },
+      },
+    ],
+  },
+  {
+    role: 'toolResult',
+    toolCallId: 'aapl-report',
+    toolName: 'write',
+    isError: false,
+    content: 'Wrote research/AAPL-q1-hidden-deceleration.md',
+  },
+  {
+    role: 'assistant',
+    content: [
+      {
+        type: 'toolCall',
+        id: 'aapl-inbox',
+        name: 'bash',
+        arguments: {
+          command: 'alice-workspace inbox push --doc research/AAPL-q1-hidden-deceleration.md',
+        },
+      },
+    ],
+  },
+  {
+    role: 'toolResult',
+    toolCallId: 'aapl-inbox',
+    toolName: 'bash',
+    isError: false,
+    content: 'Inbox entry created: AAPL Q1 — Hidden Deceleration Signal',
+  },
+  {
+    role: 'assistant',
+    content: [
+      {
+        type: 'text',
+        text: [
+          'The thing I would watch is **Services growth decelerating for a third consecutive quarter**:',
+          '',
+          '| Quarter | Services YoY |',
+          '| --- | ---: |',
+          '| Q2 FY25 | +16.3% |',
+          '| Q3 FY25 | +14.2% |',
+          '| Q4 FY25 | +12.0% |',
+          '| Q1 FY26 | **+9.1%** |',
+          '',
+          'Services is still the margin anchor, so a move below roughly **8%** would weaken the SaaS-like multiple argument. I saved the full note and posted it to Inbox.',
+        ].join('\n'),
+      },
+    ],
+  },
+]
+
+const semiconductorMessages: readonly WebConversationMessage[] = [
+  {
+    role: 'user',
+    content: "What's moving in semiconductors today?",
+  },
+  {
+    role: 'assistant',
+    content: [
+      {
+        type: 'thinking',
+        thinking: 'I need a cross-check between price leadership, the supply chain, and the latest desk notes before calling a move durable.',
+      },
+      {
+        type: 'toolCall',
+        id: 'semis-board',
+        name: 'bash',
+        arguments: { command: 'traderhub board get --board movers' },
+      },
+    ],
+  },
+  {
+    role: 'toolResult',
+    toolCallId: 'semis-board',
+    toolName: 'bash',
+    isError: false,
+    content: 'Semiconductor snapshot: memory and foundry suppliers are leading; broad-market participation is mixed. Recorded demo data, not a live quote.',
+  },
+  {
+    role: 'assistant',
+    content: [
+      {
+        type: 'thinking',
+        thinking: 'The move is concentrated enough that the catalyst map matters more than the index-level percentage.',
+      },
+      {
+        type: 'toolCall',
+        id: 'semis-notes',
+        name: 'read',
+        arguments: { path: 'research/semiconductor-monitor.md' },
+      },
+    ],
+  },
+  {
+    role: 'toolResult',
+    toolCallId: 'semis-notes',
+    toolName: 'read',
+    isError: false,
+    content: 'Desk notes: HBM supply remains the near-term bottleneck; advanced packaging lead times are improving slowly; foundry utilization is the next confirmation point.',
+  },
+  {
+    role: 'assistant',
+    content: [
+      {
+        type: 'text',
+        text: [
+          'The move is **narrower than the headline suggests**. The recorded snapshot points to three things:',
+          '',
+          '- **Memory/HBM is leading** — the clearest expression of AI accelerator demand.',
+          '- **Advanced packaging is still the bottleneck**, although lead times are improving.',
+          '- **Foundry utilization is the confirmation signal**; without it, this is supplier rotation rather than a full-cycle acceleration.',
+          '',
+          'I’d watch whether leadership broadens into equipment and foundry names before treating it as a durable sector breakout.',
+        ].join('\n'),
+      },
+    ],
+  },
+]
+
+export const demoWebSeeds: readonly DemoWebSeed[] = [
+  {
+    wsId: DEMO_WORKSPACE_ID,
+    sessionId: DEMO_SESSION_ID,
+    resumeId: 'demo-resume-main',
+    agent: 'pi',
+    startedAt: Date.now() - 8 * 60_000,
+    messages: aaplResearchMessages,
+  },
+  {
+    wsId: DEMO_CHAT_WORKSPACE_ID,
+    sessionId: DEMO_CHAT_SESSION_ID,
+    resumeId: 'demo-resume-chat',
+    agent: 'pi',
+    startedAt: Date.now() - 4 * 60_000,
+    messages: semiconductorMessages,
+  },
+]
+
+export function createDemoWebSnapshot(seed: DemoWebSeed): WebSessionSnapshot {
+  return {
+    recordId: seed.sessionId,
+    wsId: seed.wsId,
+    resumeId: seed.resumeId,
+    agent: seed.agent,
+    wire: demoWebWire(seed.agent),
+    nativeSessionId: `demo-native-${seed.sessionId}`,
+    pid: 0,
+    startedAt: seed.startedAt,
+    phase: 'idle',
+    messages: structuredClone(seed.messages),
+    streamingMessage: null,
+    requests: [],
+    error: null,
+    stderrTail: '',
+    revision: seed.messages.length,
+  }
+}
+
+const DEMO_REQUEST_FILE = 'research/positioning-notes.md'
+
+/**
+ * Runtimes with per-tool prompts stop and ask before reading the Workspace.
+ * The demo reproduces that pause so visitors see the request card exactly as
+ * a live Claude/Codex/ACP session would present it.
+ */
+export function demoWebPermissionRequest(agent: string, requestId: string): WebPermissionRequest {
+  const wire = demoWebWire(agent)
+  return {
+    id: requestId,
+    kind: 'permission',
+    title: `Allow ${wire === 'codex-app-server' ? 'reading' : 'read access to'} ${DEMO_REQUEST_FILE}?`,
+    description: 'The agent wants to check the desk notes before answering. Recorded demo: no file is read.',
+    tool: { name: 'read', input: { path: DEMO_REQUEST_FILE } },
+    options: wire === 'acp'
+      ? [
+          { id: 'allow_once', label: 'Allow once', tone: 'allow' },
+          { id: 'allow_always', label: 'Always allow', tone: 'allow' },
+          { id: 'reject_once', label: 'Reject', tone: 'deny' },
+        ]
+      : [
+          { id: 'allow', label: 'Allow', tone: 'allow' },
+          { id: 'deny', label: 'Deny', tone: 'deny' },
+        ],
+    createdAt: Date.now(),
+  }
+}
+
+/** The in-flight assistant message while a permission request is pending. */
+export function demoWebPendingToolCall(requestId: string): WebConversationMessage {
+  return {
+    role: 'assistant',
+    content: [
+      { type: 'thinking', thinking: 'The desk notes should settle this faster than re-deriving the positioning from scratch.' },
+      { type: 'toolCall', id: requestId, name: 'read', arguments: { path: DEMO_REQUEST_FILE } },
+    ],
+  }
+}
+
+export function demoWebPermissionOutcome(
+  agent: string,
+  requestId: string,
+  allowed: boolean,
+): readonly WebConversationMessage[] {
+  const label = demoRuntimeLabel(agent)
+  if (!allowed) {
+    return [
+      demoWebPendingToolCall(requestId),
+      {
+        role: 'toolResult',
+        toolCallId: requestId,
+        toolName: 'read',
+        isError: true,
+        content: 'Permission denied by the user.',
+      },
+      {
+        role: 'assistant',
+        content: [{
+          type: 'text',
+          text: `Understood — I won’t read ${DEMO_REQUEST_FILE}. This public preview of ${label} in the Web surface does not call a live model, so this reply is simulated; install OpenAlice locally to continue with your own runtime.`,
+        }],
+      },
+    ]
+  }
+  return [
+    demoWebPendingToolCall(requestId),
+    {
+      role: 'toolResult',
+      toolCallId: requestId,
+      toolName: 'read',
+      isError: false,
+      content: 'Desk notes: net long semis, hedged with index puts; review threshold is a two-day close below the 20-day average.',
+    },
+    {
+      role: 'assistant',
+      content: [{
+        type: 'text',
+        text: `Thanks. The desk is **net long semis with an index-put hedge**, and the review trigger is a two-day close below the 20-day average. This is the real **Web conversation surface** for ${label} backed by recorded demo data; the public preview does not call a live model, so this reply is simulated.`,
+      }],
+    },
+  ]
+}
+
+export function demoWebFollowUp(agent: string, message: string): readonly WebConversationMessage[] {
+  const label = demoRuntimeLabel(agent)
+  return [
+    { role: 'user', content: message },
+    {
+      role: 'assistant',
+      content: [
+        {
+          type: 'thinking',
+          thinking: 'This public preview keeps the runtime’s native conversation shape, but it must not imply that a live model or trading service was called.',
+        },
+        {
+          type: 'text',
+          text: `This is the real **Web conversation surface** for ${label} backed by recorded demo data. The public preview does not call a live model, so this reply is simulated; install OpenAlice locally to continue the research with your own runtime and data sources.`,
+        },
+      ],
+    },
+  ]
+}
+
+function demoRuntimeLabel(agent: string): string {
+  switch (agent) {
+    case 'claude': return 'Claude Code'
+    case 'codex': return 'Codex'
+    case 'cursor': return 'Cursor Agent'
+    case 'grok': return 'Grok Build'
+    case 'omp': return 'Oh My Pi'
+    case 'opencode': return 'opencode'
+    case 'pi': return 'Pi'
+    default: return agent
+  }
+}
diff --git a/ui/src/demo/fixtures/webpi.ts b/ui/src/demo/fixtures/webpi.ts
deleted file mode 100644
index 6958d9e4df..0000000000
--- a/ui/src/demo/fixtures/webpi.ts
+++ /dev/null
@@ -1,226 +0,0 @@
-import type { WebPiSnapshot } from '../../components/workspace/api'
-import {
-  DEMO_CHAT_SESSION_ID,
-  DEMO_CHAT_WORKSPACE_ID,
-  DEMO_SESSION_ID,
-  DEMO_WORKSPACE_ID,
-} from './workspaces'
-
-export interface DemoWebPiSeed {
-  readonly wsId: string
-  readonly sessionId: string
-  readonly resumeId: string
-  readonly startedAt: number
-  readonly messages: readonly unknown[]
-}
-
-const aaplResearchMessages: readonly unknown[] = [
-  {
-    role: 'user',
-    content: "Hey, what jumped out from Apple's Q1 earnings?",
-  },
-  {
-    role: 'assistant',
-    content: [
-      {
-        type: 'thinking',
-        thinking: 'I should compare the quarter with the recent trend instead of repeating the headline EPS result.',
-      },
-      {
-        type: 'toolCall',
-        id: 'aapl-filings',
-        name: 'read',
-        arguments: { path: 'data/sec/aapl/10-Q-Q1-2026.json' },
-      },
-    ],
-  },
-  {
-    role: 'toolResult',
-    toolCallId: 'aapl-filings',
-    toolName: 'read',
-    content: 'Services revenue YoY: Q2 +16.3%, Q3 +14.2%, Q4 +12.0%, Q1 +9.1%. Services gross margin remains the company margin anchor.',
-  },
-  {
-    role: 'assistant',
-    content: [
-      {
-        type: 'thinking',
-        thinking: 'The useful signal is the three-quarter deceleration. I should preserve the evidence and make the threshold explicit.',
-      },
-      {
-        type: 'text',
-        text: 'The headline beat looks fine, but the Services trend is more interesting. I’m writing the comparison into the Workspace so it remains reviewable.',
-      },
-      {
-        type: 'toolCall',
-        id: 'aapl-report',
-        name: 'write',
-        arguments: { path: 'research/AAPL-q1-hidden-deceleration.md' },
-      },
-    ],
-  },
-  {
-    role: 'toolResult',
-    toolCallId: 'aapl-report',
-    toolName: 'write',
-    content: 'Wrote research/AAPL-q1-hidden-deceleration.md',
-  },
-  {
-    role: 'assistant',
-    content: [
-      {
-        type: 'toolCall',
-        id: 'aapl-inbox',
-        name: 'bash',
-        arguments: {
-          command: 'alice-workspace inbox push --doc research/AAPL-q1-hidden-deceleration.md',
-        },
-      },
-    ],
-  },
-  {
-    role: 'toolResult',
-    toolCallId: 'aapl-inbox',
-    toolName: 'bash',
-    content: 'Inbox entry created: AAPL Q1 — Hidden Deceleration Signal',
-  },
-  {
-    role: 'assistant',
-    content: [
-      {
-        type: 'text',
-        text: [
-          'The thing I would watch is **Services growth decelerating for a third consecutive quarter**:',
-          '',
-          '| Quarter | Services YoY |',
-          '| --- | ---: |',
-          '| Q2 FY25 | +16.3% |',
-          '| Q3 FY25 | +14.2% |',
-          '| Q4 FY25 | +12.0% |',
-          '| Q1 FY26 | **+9.1%** |',
-          '',
-          'Services is still the margin anchor, so a move below roughly **8%** would weaken the SaaS-like multiple argument. I saved the full note and posted it to Inbox.',
-        ].join('\n'),
-      },
-    ],
-  },
-]
-
-const semiconductorMessages: readonly unknown[] = [
-  {
-    role: 'user',
-    content: "What's moving in semiconductors today?",
-  },
-  {
-    role: 'assistant',
-    content: [
-      {
-        type: 'thinking',
-        thinking: 'I need a cross-check between price leadership, the supply chain, and the latest desk notes before calling a move durable.',
-      },
-      {
-        type: 'toolCall',
-        id: 'semis-board',
-        name: 'bash',
-        arguments: { command: 'traderhub board get --board movers' },
-      },
-    ],
-  },
-  {
-    role: 'toolResult',
-    toolCallId: 'semis-board',
-    toolName: 'bash',
-    content: 'Semiconductor snapshot: memory and foundry suppliers are leading; broad-market participation is mixed. Recorded demo data, not a live quote.',
-  },
-  {
-    role: 'assistant',
-    content: [
-      {
-        type: 'thinking',
-        thinking: 'The move is concentrated enough that the catalyst map matters more than the index-level percentage.',
-      },
-      {
-        type: 'toolCall',
-        id: 'semis-notes',
-        name: 'read',
-        arguments: { path: 'research/semiconductor-monitor.md' },
-      },
-    ],
-  },
-  {
-    role: 'toolResult',
-    toolCallId: 'semis-notes',
-    toolName: 'read',
-    content: 'Desk notes: HBM supply remains the near-term bottleneck; advanced packaging lead times are improving slowly; foundry utilization is the next confirmation point.',
-  },
-  {
-    role: 'assistant',
-    content: [
-      {
-        type: 'text',
-        text: [
-          'The move is **narrower than the headline suggests**. The recorded snapshot points to three things:',
-          '',
-          '- **Memory/HBM is leading** — the clearest expression of AI accelerator demand.',
-          '- **Advanced packaging is still the bottleneck**, although lead times are improving.',
-          '- **Foundry utilization is the confirmation signal**; without it, this is supplier rotation rather than a full-cycle acceleration.',
-          '',
-          'I’d watch whether leadership broadens into equipment and foundry names before treating it as a durable sector breakout.',
-        ].join('\n'),
-      },
-    ],
-  },
-]
-
-export const demoWebPiSeeds: readonly DemoWebPiSeed[] = [
-  {
-    wsId: DEMO_WORKSPACE_ID,
-    sessionId: DEMO_SESSION_ID,
-    resumeId: 'demo-resume-main',
-    startedAt: Date.now() - 8 * 60_000,
-    messages: aaplResearchMessages,
-  },
-  {
-    wsId: DEMO_CHAT_WORKSPACE_ID,
-    sessionId: DEMO_CHAT_SESSION_ID,
-    resumeId: 'demo-resume-chat',
-    startedAt: Date.now() - 4 * 60_000,
-    messages: semiconductorMessages,
-  },
-]
-
-export function createDemoWebPiSnapshot(seed: DemoWebPiSeed): WebPiSnapshot {
-  return {
-    recordId: seed.sessionId,
-    wsId: seed.wsId,
-    resumeId: seed.resumeId,
-    pid: 0,
-    startedAt: seed.startedAt,
-    phase: 'idle',
-    state: { isStreaming: false, isCompacting: false },
-    messages: structuredClone(seed.messages),
-    streamingMessage: null,
-    error: null,
-    stderrTail: '',
-    revision: seed.messages.length,
-  }
-}
-
-export function demoWebPiFollowUp(message: string): readonly unknown[] {
-  return [
-    { role: 'user', content: message },
-    {
-      role: 'assistant',
-      content: [
-        {
-          type: 'thinking',
-          thinking: 'This public preview keeps Pi’s native conversation shape, but it must not imply that a live model or trading service was called.',
-        },
-        {
-          type: 'text',
-          text: 'This is the real **WebPi conversation surface** backed by recorded demo data. The public preview does not call a live model, so this reply is simulated; install OpenAlice locally to continue the research with your own Pi runtime and data sources.',
-        },
-      ],
-    },
-  ]
-}
diff --git a/ui/src/demo/fixtures/workspaces.ts b/ui/src/demo/fixtures/workspaces.ts
index db7d2d2297..f568401346 100644
--- a/ui/src/demo/fixtures/workspaces.ts
+++ b/ui/src/demo/fixtures/workspaces.ts
@@ -59,7 +59,7 @@ export const demoWorkspace: Workspace = {
 }
 
 // Chat workspace — populates the Chat activity sidebar (which filters
-// `template === 'chat'`). Its featured Session uses the real WebPi renderer
+// `template === 'chat'`). Its featured Session uses the real Web conversation renderer
 // over recorded native Pi messages; the remaining rows keep the multi-runtime
 // history visible.
 export const DEMO_CHAT_WORKSPACE_ID = 'demo-chat-ws'
diff --git a/ui/src/demo/handlers/workspaces-resume.spec.ts b/ui/src/demo/handlers/workspaces-resume.spec.ts
index 4df42d5bb6..a2d0834718 100644
--- a/ui/src/demo/handlers/workspaces-resume.spec.ts
+++ b/ui/src/demo/handlers/workspaces-resume.spec.ts
@@ -8,7 +8,7 @@ import {
   DEMO_CHAT_WORKSPACE_ID,
   DEMO_MACRO_WORKSPACE_ID,
 } from '../fixtures/workspaces'
-import { resetDemoWorkspaceWebPiState, workspacesHandlers } from './workspaces'
+import { resetDemoWorkspaceWebState, workspacesHandlers } from './workspaces'
 
 const server = setupServer(...workspacesHandlers)
 const baseUrl = window.location.origin
@@ -16,7 +16,7 @@ const baseUrl = window.location.origin
 beforeAll(() => server.listen({ onUnhandledRequest: 'error' }))
 afterEach(() => {
   server.resetHandlers()
-  resetDemoWorkspaceWebPiState()
+  resetDemoWorkspaceWebState()
 })
 afterAll(() => server.close())
 
diff --git a/ui/src/demo/handlers/workspaces-web.spec.ts b/ui/src/demo/handlers/workspaces-web.spec.ts
new file mode 100644
index 0000000000..3743a5496d
--- /dev/null
+++ b/ui/src/demo/handlers/workspaces-web.spec.ts
@@ -0,0 +1,186 @@
+// @vitest-environment jsdom
+
+import { afterAll, afterEach, beforeAll, describe, expect, it } from 'vitest'
+import { setupServer } from 'msw/node'
+
+import {
+  DEMO_CHAT_SESSION_ID,
+  DEMO_CHAT_WORKSPACE_ID,
+  DEMO_SESSION_ID,
+  DEMO_WORKSPACE_ID,
+} from '../fixtures/workspaces'
+import { resetDemoWorkspaceWebState, workspacesHandlers } from './workspaces'
+
+const server = setupServer(...workspacesHandlers)
+const baseUrl = window.location.origin
+
+beforeAll(() => server.listen({ onUnhandledRequest: 'error' }))
+afterEach(() => {
+  server.resetHandlers()
+  resetDemoWorkspaceWebState()
+})
+afterAll(() => server.close())
+
+const webUrl = (wsId: string, sessionId: string, tail = '') =>
+  `${baseUrl}/api/workspaces/${wsId}/sessions/${sessionId}/web${tail}`
+
+async function postJson(url: string, body?: unknown) {
+  const response = await fetch(url, {
+    method: 'POST',
+    ...(body === undefined ? {} : { headers: { 'content-type': 'application/json' }, body: JSON.stringify(body) }),
+  })
+  return { status: response.status, body: await response.json() }
+}
+
+async function quickChat(agent: string, prompt: string) {
+  const { status, body } = await postJson(`${baseUrl}/api/workspaces/quick-chat`, {
+    prompt,
+    agent,
+    targetWsId: DEMO_CHAT_WORKSPACE_ID,
+  })
+  expect(status).toBe(201)
+  return body
+}
+
+describe('demo Web Session handlers', () => {
+  it('serves each featured Session with its own recorded transcript in the neutral shape', async () => {
+    const semisResponse = await fetch(webUrl(DEMO_CHAT_WORKSPACE_ID, DEMO_CHAT_SESSION_ID))
+    const aaplResponse = await fetch(webUrl(DEMO_WORKSPACE_ID, DEMO_SESSION_ID))
+    const semis = await semisResponse.json()
+    const aapl = await aaplResponse.json()
+
+    expect(semisResponse.status).toBe(200)
+    expect(semis.snapshot).toMatchObject({
+      wsId: DEMO_CHAT_WORKSPACE_ID,
+      recordId: DEMO_CHAT_SESSION_ID,
+      agent: 'pi',
+      wire: 'pi-rpc',
+      phase: 'idle',
+      requests: [],
+    })
+    expect(JSON.stringify(semis.snapshot.messages)).toContain('semiconductors')
+
+    expect(aaplResponse.status).toBe(200)
+    expect(aapl.snapshot).toMatchObject({
+      wsId: DEMO_WORKSPACE_ID,
+      recordId: DEMO_SESSION_ID,
+      phase: 'idle',
+    })
+    expect(JSON.stringify(aapl.snapshot.messages)).toContain('Services growth decelerating')
+  })
+
+  it('honors revisions and scopes simulated follow-ups to the selected Session', async () => {
+    const first = await fetch(webUrl(DEMO_CHAT_WORKSPACE_ID, DEMO_CHAT_SESSION_ID)).then((response) => response.json())
+
+    const unchanged = await fetch(
+      webUrl(DEMO_CHAT_WORKSPACE_ID, DEMO_CHAT_SESSION_ID, `?revision=${first.snapshot.revision}`),
+    )
+    expect(await unchanged.json()).toEqual({ unchanged: true, revision: first.snapshot.revision })
+
+    const followUp = await postJson(
+      webUrl(DEMO_CHAT_WORKSPACE_ID, DEMO_CHAT_SESSION_ID, '/prompt'),
+      { message: 'What would confirm the move?' },
+    )
+
+    expect(followUp.body.snapshot.revision).toBe(first.snapshot.revision + 1)
+    expect(followUp.body.snapshot.messages).toHaveLength(first.snapshot.messages.length + 2)
+    expect(JSON.stringify(followUp.body.snapshot.messages)).toContain('public preview does not call a live model')
+
+    const aapl = await fetch(webUrl(DEMO_WORKSPACE_ID, DEMO_SESSION_ID)).then((response) => response.json())
+    expect(JSON.stringify(aapl.snapshot.messages)).not.toContain('What would confirm the move?')
+  })
+
+  it('rejects an empty prompt like the real route', async () => {
+    const { status, body } = await postJson(webUrl(DEMO_CHAT_WORKSPACE_ID, DEMO_CHAT_SESSION_ID, '/prompt'), { message: '  ' })
+    expect(status).toBe(400)
+    expect(body.error).toBe('bad_request')
+  })
+
+  it('creates a durable in-memory Web Session when demo Quick Chat launches Pi', async () => {
+    const body = await quickChat('pi', 'Map the next confirmation signals.')
+
+    expect(body.session).toMatchObject({ agent: 'pi', surface: 'webpi' })
+    expect(body.workspace.sessions.some((session: { id: string }) => session.id === body.session.sessionId)).toBe(true)
+
+    const snapshotResponse = await fetch(webUrl(DEMO_CHAT_WORKSPACE_ID, body.session.sessionId))
+    const snapshot = await snapshotResponse.json()
+    expect(snapshotResponse.status).toBe(200)
+    expect(snapshot.snapshot).toMatchObject({ recordId: body.session.sessionId, agent: 'pi', phase: 'idle' })
+    expect(JSON.stringify(snapshot.snapshot.messages)).toContain('Map the next confirmation signals.')
+
+    const workspaceList = await fetch(`${baseUrl}/api/workspaces`).then((result) => result.json())
+    const chatWorkspace = workspaceList.workspaces.find(
+      (workspace: { id: string }) => workspace.id === DEMO_CHAT_WORKSPACE_ID,
+    )
+    expect(chatWorkspace.sessions.some((session: { id: string }) => session.id === body.session.sessionId)).toBe(true)
+  })
+
+  it('opens every runtime with a structured protocol in the Web surface and keeps TUI-only runtimes in the terminal', async () => {
+    const claude = await quickChat('claude', 'Check the desk notes.')
+    expect(claude.session).toMatchObject({ agent: 'claude', surface: 'webpi' })
+
+    const agy = await quickChat('agy', 'Check the desk notes.')
+    expect(agy.session).toMatchObject({ agent: 'agy', surface: 'terminal' })
+
+    const open = await postJson(webUrl(DEMO_CHAT_WORKSPACE_ID, agy.session.sessionId, '/open'))
+    expect(open.status).toBe(409)
+    expect(open.body.error).toBe('unsupported_surface')
+  })
+
+  it('pauses a prompting runtime on a permission request and finishes the turn from the answer', async () => {
+    const launched = await quickChat('claude', 'Check the desk notes.')
+    const sessionId = launched.session.sessionId
+
+    const pending = await fetch(webUrl(DEMO_CHAT_WORKSPACE_ID, sessionId)).then((response) => response.json())
+    expect(pending.snapshot).toMatchObject({ agent: 'claude', wire: 'claude-stream-json', phase: 'awaiting-input' })
+    expect(pending.snapshot.requests).toHaveLength(1)
+    expect(pending.snapshot.requests[0]).toMatchObject({ kind: 'permission', tool: { name: 'read' } })
+    expect(pending.snapshot.streamingMessage.role).toBe('assistant')
+
+    const blocked = await postJson(webUrl(DEMO_CHAT_WORKSPACE_ID, sessionId, '/prompt'), { message: 'hurry' })
+    expect(blocked.status).toBe(409)
+
+    const wrongOption = await postJson(webUrl(DEMO_CHAT_WORKSPACE_ID, sessionId, '/respond'), {
+      requestId: pending.snapshot.requests[0].id,
+      optionId: 'nope',
+    })
+    expect(wrongOption.status).toBe(409)
+    expect(wrongOption.body.error).toBe('web_respond_failed')
+
+    const answered = await postJson(webUrl(DEMO_CHAT_WORKSPACE_ID, sessionId, '/respond'), {
+      requestId: pending.snapshot.requests[0].id,
+      optionId: 'allow',
+    })
+    expect(answered.status).toBe(200)
+    expect(answered.body.snapshot).toMatchObject({ phase: 'idle', requests: [], streamingMessage: null })
+    const roles = answered.body.snapshot.messages.map((message: { role: string }) => message.role)
+    expect(roles).toEqual(['user', 'assistant', 'toolResult', 'assistant'])
+    expect(answered.body.snapshot.messages[2]).toMatchObject({ isError: false })
+  })
+
+  it('offers ACP-style option ids for ACP runtimes and records a denial as a failed tool result', async () => {
+    const launched = await quickChat('cursor', 'Check the desk notes.')
+    const sessionId = launched.session.sessionId
+    const pending = await fetch(webUrl(DEMO_CHAT_WORKSPACE_ID, sessionId)).then((response) => response.json())
+    expect(pending.snapshot.wire).toBe('acp')
+    expect(pending.snapshot.requests[0].options.map((option: { id: string }) => option.id))
+      .toEqual(['allow_once', 'allow_always', 'reject_once'])
+
+    const denied = await postJson(webUrl(DEMO_CHAT_WORKSPACE_ID, sessionId, '/respond'), {
+      requestId: pending.snapshot.requests[0].id,
+      optionId: 'reject_once',
+    })
+    expect(denied.status).toBe(200)
+    expect(denied.body.snapshot.messages[2]).toMatchObject({ role: 'toolResult', isError: true })
+  })
+
+  it('drops a pending request when the turn is aborted and leaves a notice in the transcript', async () => {
+    const launched = await quickChat('codex', 'Check the desk notes.')
+    const sessionId = launched.session.sessionId
+
+    const aborted = await postJson(webUrl(DEMO_CHAT_WORKSPACE_ID, sessionId, '/abort'))
+    expect(aborted.status).toBe(200)
+    expect(aborted.body.snapshot).toMatchObject({ phase: 'idle', requests: [], streamingMessage: null })
+    expect(aborted.body.snapshot.messages.at(-1)).toEqual({ role: 'notice', text: 'Turn stopped by the user.' })
+  })
+})
diff --git a/ui/src/demo/handlers/workspaces-webpi.spec.ts b/ui/src/demo/handlers/workspaces-webpi.spec.ts
deleted file mode 100644
index efc246a233..0000000000
--- a/ui/src/demo/handlers/workspaces-webpi.spec.ts
+++ /dev/null
@@ -1,111 +0,0 @@
-// @vitest-environment jsdom
-
-import { afterAll, afterEach, beforeAll, describe, expect, it } from 'vitest'
-import { setupServer } from 'msw/node'
-
-import {
-  DEMO_CHAT_SESSION_ID,
-  DEMO_CHAT_WORKSPACE_ID,
-  DEMO_SESSION_ID,
-  DEMO_WORKSPACE_ID,
-} from '../fixtures/workspaces'
-import { resetDemoWorkspaceWebPiState, workspacesHandlers } from './workspaces'
-
-const server = setupServer(...workspacesHandlers)
-const baseUrl = window.location.origin
-
-beforeAll(() => server.listen({ onUnhandledRequest: 'error' }))
-afterEach(() => {
-  server.resetHandlers()
-  resetDemoWorkspaceWebPiState()
-})
-afterAll(() => server.close())
-
-describe('demo WebPi Session handlers', () => {
-  it('serves each featured Session with its own recorded native Pi transcript', async () => {
-    const semisResponse = await fetch(
-      `${baseUrl}/api/workspaces/${DEMO_CHAT_WORKSPACE_ID}/sessions/${DEMO_CHAT_SESSION_ID}/webpi`,
-    )
-    const aaplResponse = await fetch(
-      `${baseUrl}/api/workspaces/${DEMO_WORKSPACE_ID}/sessions/${DEMO_SESSION_ID}/webpi`,
-    )
-    const semis = await semisResponse.json()
-    const aapl = await aaplResponse.json()
-
-    expect(semisResponse.status).toBe(200)
-    expect(semis.snapshot).toMatchObject({
-      wsId: DEMO_CHAT_WORKSPACE_ID,
-      recordId: DEMO_CHAT_SESSION_ID,
-      phase: 'idle',
-    })
-    expect(JSON.stringify(semis.snapshot.messages)).toContain('semiconductors')
-
-    expect(aaplResponse.status).toBe(200)
-    expect(aapl.snapshot).toMatchObject({
-      wsId: DEMO_WORKSPACE_ID,
-      recordId: DEMO_SESSION_ID,
-      phase: 'idle',
-    })
-    expect(JSON.stringify(aapl.snapshot.messages)).toContain('Services growth decelerating')
-  })
-
-  it('honors revisions and scopes simulated follow-ups to the selected Session', async () => {
-    const first = await fetch(
-      `${baseUrl}/api/workspaces/${DEMO_CHAT_WORKSPACE_ID}/sessions/${DEMO_CHAT_SESSION_ID}/webpi`,
-    ).then((response) => response.json())
-
-    const unchanged = await fetch(
-      `${baseUrl}/api/workspaces/${DEMO_CHAT_WORKSPACE_ID}/sessions/${DEMO_CHAT_SESSION_ID}/webpi?revision=${first.snapshot.revision}`,
-    )
-    expect(await unchanged.json()).toEqual({ unchanged: true })
-
-    const followUp = await fetch(
-      `${baseUrl}/api/workspaces/${DEMO_CHAT_WORKSPACE_ID}/sessions/${DEMO_CHAT_SESSION_ID}/webpi/prompt`,
-      {
-        method: 'POST',
-        headers: { 'content-type': 'application/json' },
-        body: JSON.stringify({ message: 'What would confirm the move?' }),
-      },
-    ).then((response) => response.json())
-
-    expect(followUp.snapshot.revision).toBe(first.snapshot.revision + 1)
-    expect(followUp.snapshot.messages).toHaveLength(first.snapshot.messages.length + 2)
-    expect(JSON.stringify(followUp.snapshot.messages)).toContain('public preview does not call a live model')
-
-    const aapl = await fetch(
-      `${baseUrl}/api/workspaces/${DEMO_WORKSPACE_ID}/sessions/${DEMO_SESSION_ID}/webpi`,
-    ).then((response) => response.json())
-    expect(JSON.stringify(aapl.snapshot.messages)).not.toContain('What would confirm the move?')
-  })
-
-  it('creates a durable in-memory WebPi Session when demo Quick Chat launches Pi', async () => {
-    const response = await fetch(`${baseUrl}/api/workspaces/quick-chat`, {
-      method: 'POST',
-      headers: { 'content-type': 'application/json' },
-      body: JSON.stringify({
-        prompt: 'Map the next confirmation signals.',
-        agent: 'pi',
-        targetWsId: DEMO_CHAT_WORKSPACE_ID,
-      }),
-    })
-    const body = await response.json()
-
-    expect(response.status).toBe(201)
-    expect(body.session).toMatchObject({ agent: 'pi', surface: 'webpi' })
-    expect(body.workspace.sessions.some((session: { id: string }) => session.id === body.session.sessionId)).toBe(true)
-
-    const snapshotResponse = await fetch(
-      `${baseUrl}/api/workspaces/${DEMO_CHAT_WORKSPACE_ID}/sessions/${body.session.sessionId}/webpi`,
-    )
-    const snapshot = await snapshotResponse.json()
-    expect(snapshotResponse.status).toBe(200)
-    expect(snapshot.snapshot.recordId).toBe(body.session.sessionId)
-    expect(JSON.stringify(snapshot.snapshot.messages)).toContain('Map the next confirmation signals.')
-
-    const workspaceList = await fetch(`${baseUrl}/api/workspaces`).then((result) => result.json())
-    const chatWorkspace = workspaceList.workspaces.find(
-      (workspace: { id: string }) => workspace.id === DEMO_CHAT_WORKSPACE_ID,
-    )
-    expect(chatWorkspace.sessions.some((session: { id: string }) => session.id === body.session.sessionId)).toBe(true)
-  })
-})
diff --git a/ui/src/demo/handlers/workspaces.ts b/ui/src/demo/handlers/workspaces.ts
index fba7eb3d16..c4f2866090 100644
--- a/ui/src/demo/handlers/workspaces.ts
+++ b/ui/src/demo/handlers/workspaces.ts
@@ -9,11 +9,16 @@ import {
 } from '../fixtures/workspaces'
 import { demoWorkspaceFilePaths, demoWorkspaceFiles } from '../fixtures/inbox'
 import {
-  createDemoWebPiSnapshot,
-  demoWebPiFollowUp,
-  demoWebPiSeeds,
-  type DemoWebPiSeed,
-} from '../fixtures/webpi'
+  createDemoWebSnapshot,
+  demoWebCapabilities,
+  demoWebFollowUp,
+  demoWebPendingToolCall,
+  demoWebPermissionOutcome,
+  demoWebPermissionRequest,
+  demoWebSeeds,
+  demoWebWire,
+  type DemoWebSeed,
+} from '../fixtures/web-session'
 import type {
   AgentConfig,
   AgentConfigBundle,
@@ -21,7 +26,8 @@ import type {
   DepartedWorkspace,
   PausedSessionRuntimeUpdate,
   SessionRecord,
-  WebPiSnapshot,
+  WebConversationMessage,
+  WebSessionSnapshot,
   Workspace,
   WorkspaceMetadataPatch,
   WorkspaceRuntimePreference,
@@ -51,7 +57,7 @@ const demoManagerSession = {
   title: 'Audit the active Workspace floor',
 }
 
-let demoManagerMessages: unknown[] = []
+let demoManagerMessages: WebConversationMessage[] = []
 let demoQuickChatSequence = 0
 let demoWorkspaceCreateSequence = 0
 let demoAutoQuantDefaultWorkspaceId: string | null = DEMO_AUTO_QUANT_WORKSPACE_ID
@@ -70,23 +76,25 @@ export function resetDemoWorkspaceCreateState(): void {
   demoAutoPredictionDefaultWorkspaceId = DEMO_AUTO_PREDICTION_WORKSPACE_ID
 }
 
-function webPiKey(wsId: string, sessionId: string): string {
+function webKey(wsId: string, sessionId: string): string {
   return `${wsId}::${sessionId}`
 }
 
-function createSeededWebPiSessions(): Map<string, WebPiSnapshot> {
-  return new Map(demoWebPiSeeds.map((seed) => [
-    webPiKey(seed.wsId, seed.sessionId),
-    createDemoWebPiSnapshot(seed),
+function createSeededWebSessions(): Map<string, WebSessionSnapshot> {
+  return new Map(demoWebSeeds.map((seed) => [
+    webKey(seed.wsId, seed.sessionId),
+    createDemoWebSnapshot(seed),
   ]))
 }
 
-let demoWebPiSessions = createSeededWebPiSessions()
+let demoWebSessions = createSeededWebSessions()
+let demoWebRequestSequence = 0
 
-export function resetDemoWorkspaceWebPiState(): void {
+export function resetDemoWorkspaceWebState(): void {
   demoManagerMessages = []
   demoQuickChatSequence = 0
-  demoWebPiSessions = createSeededWebPiSessions()
+  demoWebRequestSequence = 0
+  demoWebSessions = createSeededWebSessions()
   demoResumeRuntimes.clear()
   demoResumeRuntimes.set('resume-demo-thesis-owner', {
     credentialSource: 'native',
@@ -104,32 +112,45 @@ export function resetDemoWorkspaceWebPiState(): void {
   }
 }
 
-function setDemoWebPiSession(seed: DemoWebPiSeed): WebPiSnapshot {
-  const snapshot = createDemoWebPiSnapshot(seed)
-  demoWebPiSessions.set(webPiKey(seed.wsId, seed.sessionId), snapshot)
+function setDemoWebSession(seed: DemoWebSeed): WebSessionSnapshot {
+  const snapshot = createDemoWebSnapshot(seed)
+  demoWebSessions.set(webKey(seed.wsId, seed.sessionId), snapshot)
   return snapshot
 }
 
-function findDemoWebPiSession(wsId: string, sessionId: string): WebPiSnapshot | null {
-  return demoWebPiSessions.get(webPiKey(wsId, sessionId)) ?? null
+function findDemoWebSession(wsId: string, sessionId: string): WebSessionSnapshot | null {
+  return demoWebSessions.get(webKey(wsId, sessionId)) ?? null
 }
 
-function ensureDemoWebPiSession(wsId: string, sessionId: string): WebPiSnapshot | null {
-  const existing = findDemoWebPiSession(wsId, sessionId)
+function ensureDemoWebSession(wsId: string, sessionId: string): WebSessionSnapshot | null {
+  const existing = findDemoWebSession(wsId, sessionId)
   if (existing) return existing
   const record = demoWorkspaces
     .find((workspace) => workspace.id === wsId)
-    ?.sessions.find((session) => session.id === sessionId && session.agent === 'pi')
+    ?.sessions.find((session) => session.id === sessionId && session.agent in demoWebCapabilities)
   if (!record) return null
-  return setDemoWebPiSession({
+  return setDemoWebSession({
     wsId,
     sessionId,
     resumeId: record.resumeId,
+    agent: record.agent,
     startedAt: record.startedAt ?? Date.now(),
     messages: [],
   })
 }
 
+function updateDemoWebSession(
+  wsId: string,
+  sessionId: string,
+  patch: (current: WebSessionSnapshot) => Partial<WebSessionSnapshot>,
+): WebSessionSnapshot | null {
+  const current = ensureDemoWebSession(wsId, sessionId)
+  if (!current) return null
+  const next: WebSessionSnapshot = { ...current, ...patch(current), revision: current.revision + 1 }
+  demoWebSessions.set(webKey(wsId, sessionId), next)
+  return next
+}
+
 const DEMO_FILE_MTIME = new Date().toISOString()
 
 function demoDirectoryListing(workspaceId: string, requestedPath: string) {
@@ -174,22 +195,53 @@ function demoDirectoryListing(workspaceId: string, requestedPath: string) {
   }
 }
 
-function appendDemoWebPiMessages(
+function appendDemoWebMessages(
   wsId: string,
   sessionId: string,
-  messages: readonly unknown[],
-): WebPiSnapshot | null {
-  const current = ensureDemoWebPiSession(wsId, sessionId)
-  if (!current) return null
-  const next: WebPiSnapshot = {
-    ...current,
+  messages: readonly WebConversationMessage[],
+): WebSessionSnapshot | null {
+  return updateDemoWebSession(wsId, sessionId, (current) => ({
     phase: 'idle',
     messages: [...current.messages, ...messages],
     streamingMessage: null,
-    revision: current.revision + 1,
+    requests: [],
+  }))
+}
+
+// Runtimes that ask before running tools pause on the first prompt with a
+// pending permission request; the user's answer decides how the turn ends.
+function startDemoWebTurn(wsId: string, sessionId: string, message: string): WebSessionSnapshot | null {
+  const current = ensureDemoWebSession(wsId, sessionId)
+  if (!current) return null
+  if (!demoWebCapabilities[current.agent]?.permissionPrompts) {
+    return appendDemoWebMessages(wsId, sessionId, demoWebFollowUp(current.agent, message))
   }
-  demoWebPiSessions.set(webPiKey(wsId, sessionId), next)
-  return next
+  const requestId = `demo-web-request-${++demoWebRequestSequence}`
+  return updateDemoWebSession(wsId, sessionId, () => ({
+    phase: 'awaiting-input',
+    messages: [...current.messages, { role: 'user', content: message }],
+    streamingMessage: demoWebPendingToolCall(requestId),
+    requests: [demoWebPermissionRequest(current.agent, requestId)],
+  }))
+}
+
+function answerDemoWebRequest(
+  wsId: string,
+  sessionId: string,
+  requestId: string,
+  optionId: string,
+): WebSessionSnapshot | null | 'unknown_request' | 'unknown_option' {
+  const current = findDemoWebSession(wsId, sessionId)
+  if (!current) return null
+  const request = current.requests.find((entry) => entry.id === requestId)
+  if (!request) return 'unknown_request'
+  const option = request.options.find((entry) => entry.id === optionId)
+  if (!option) return 'unknown_option'
+  return appendDemoWebMessages(
+    wsId,
+    sessionId,
+    demoWebPermissionOutcome(current.agent, requestId, option.tone === 'allow'),
+  )
 }
 
 // Demo mutations live only for the current MSW worker lifetime. Keeping agent
@@ -207,17 +259,20 @@ function demoAgentConfigBundle(workspaceId: string): AgentConfigBundle {
   }
 }
 
-function demoManagerSnapshot(): WebPiSnapshot {
+function demoManagerSnapshot(): WebSessionSnapshot {
   return {
     recordId: demoManagerSession.id,
     wsId: demoManagerSession.wsId,
     resumeId: demoManagerSession.resumeId,
+    agent: demoManagerSession.agent,
+    wire: demoWebWire(demoManagerSession.agent),
+    nativeSessionId: 'demo-native-manager',
     pid: 0,
     startedAt: demoManagerSession.startedAt,
     phase: 'idle' as const,
-    state: null,
     messages: demoManagerMessages,
     streamingMessage: null,
+    requests: [],
     error: null,
     stderrTail: '',
     revision: demoManagerMessages.length,
@@ -436,7 +491,7 @@ export const workspacesHandlers = [
     }
     demoManagerMessages = [
       { role: 'user', content: body.prompt ?? 'Audit the active Workspace floor.' },
-      { role: 'assistant', content: 'Demo manager: active desks are inventoried and ready for coordination.' },
+      { role: 'assistant', content: [{ type: 'text', text: 'Demo manager: active desks are inventoried and ready for coordination.' }] },
     ]
     return HttpResponse.json({
       manager: {
@@ -814,14 +869,14 @@ export const workspacesHandlers = [
       // probe, so present everything as installed (a clean showcase, not a
       // "go install things" prompt).
       agents: [
-        { id: 'claude', displayName: 'Claude Code', installed: true, binPath: '/usr/local/bin/claude', capabilities: { parallelPerCwd: true, resumeLast: false, resumeById: true, transcriptDiscovery: 'fs-watch', headless: true, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['anthropic'], defaultWire: 'anthropic' } } },
-        { id: 'codex', displayName: 'Codex', installed: true, binPath: '/usr/local/bin/codex', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['openai-responses'], defaultWire: 'openai-responses' } } },
-        { id: 'cursor', displayName: 'Cursor Agent', installed: true, binPath: '/usr/local/bin/cursor-agent', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: [], directVendors: ['cursor'] } } },
+        { id: 'claude', displayName: 'Claude Code', installed: true, binPath: '/usr/local/bin/claude', capabilities: { parallelPerCwd: true, resumeLast: false, resumeById: true, transcriptDiscovery: 'fs-watch', headless: true, web: { wire: 'claude-stream-json', permissionPrompts: true, freshSession: true }, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['anthropic'], defaultWire: 'anthropic' } } },
+        { id: 'codex', displayName: 'Codex', installed: true, binPath: '/usr/local/bin/codex', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, web: { wire: 'codex-app-server', permissionPrompts: true, freshSession: true }, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['openai-responses'], defaultWire: 'openai-responses' } } },
+        { id: 'cursor', displayName: 'Cursor Agent', installed: true, binPath: '/usr/local/bin/cursor-agent', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, web: { wire: 'acp', permissionPrompts: true, freshSession: true }, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: [], directVendors: ['cursor'] } } },
         { id: 'agy', displayName: 'Antigravity', installed: true, binPath: '/usr/local/bin/agy', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['google-generative-ai'], defaultWire: 'google-generative-ai' } } },
-        { id: 'grok', displayName: 'Grok Build', installed: true, binPath: '/usr/local/bin/grok', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['openai-chat', 'openai-responses'], defaultWire: 'openai-chat' } } },
-        { id: 'omp', displayName: 'Oh My Pi', installed: true, binPath: '/usr/local/bin/omp', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['google-generative-ai', 'openai-chat', 'anthropic', 'openai-responses'], defaultWire: 'openai-chat', vendorPolicies: { minimax: { wirePreference: ['anthropic'], legacyRequestedWireFallbacks: { 'openai-chat': 'anthropic' } } }, modelRegistration: { contextWindow: true, reasoning: true } } } },
-        { id: 'opencode', displayName: 'opencode', installed: true, binPath: '/usr/local/bin/opencode', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['google-generative-ai', 'openai-chat', 'anthropic', 'openai-responses'], defaultWire: 'openai-chat', vendorPolicies: { minimax: { wirePreference: ['anthropic'], legacyRequestedWireFallbacks: { 'openai-chat': 'anthropic' } } }, modelRegistration: { contextWindow: true, reasoning: true, effortVariants: true } } } },
-        { id: 'pi', displayName: 'Pi', installed: true, binPath: '/usr/local/bin/pi', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'none', headless: true, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['google-generative-ai', 'openai-chat', 'anthropic', 'openai-responses'], defaultWire: 'openai-chat', vendorPolicies: { minimax: { wirePreference: ['anthropic'], legacyRequestedWireFallbacks: { 'openai-chat': 'anthropic' } } }, modelRegistration: { contextWindow: true, reasoning: true } } } },
+        { id: 'grok', displayName: 'Grok Build', installed: true, binPath: '/usr/local/bin/grok', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, web: { wire: 'acp', permissionPrompts: true, freshSession: true }, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['openai-chat', 'openai-responses'], defaultWire: 'openai-chat' } } },
+        { id: 'omp', displayName: 'Oh My Pi', installed: true, binPath: '/usr/local/bin/omp', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, web: { wire: 'pi-rpc', permissionPrompts: false, freshSession: true }, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['google-generative-ai', 'openai-chat', 'anthropic', 'openai-responses'], defaultWire: 'openai-chat', vendorPolicies: { minimax: { wirePreference: ['anthropic'], legacyRequestedWireFallbacks: { 'openai-chat': 'anthropic' } } }, modelRegistration: { contextWindow: true, reasoning: true } } } },
+        { id: 'opencode', displayName: 'opencode', installed: true, binPath: '/usr/local/bin/opencode', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'subprocess', headless: true, web: { wire: 'acp', permissionPrompts: true, freshSession: true }, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['google-generative-ai', 'openai-chat', 'anthropic', 'openai-responses'], defaultWire: 'openai-chat', vendorPolicies: { minimax: { wirePreference: ['anthropic'], legacyRequestedWireFallbacks: { 'openai-chat': 'anthropic' } } }, modelRegistration: { contextWindow: true, reasoning: true, effortVariants: true } } } },
+        { id: 'pi', displayName: 'Pi', installed: true, binPath: '/usr/local/bin/pi', capabilities: { parallelPerCwd: true, resumeLast: true, resumeById: true, transcriptDiscovery: 'none', headless: true, web: { wire: 'pi-rpc', permissionPrompts: false, freshSession: true }, aiProvider: { credentialSource: 'runtime-or-workspace', wirePreference: ['google-generative-ai', 'openai-chat', 'anthropic', 'openai-responses'], defaultWire: 'openai-chat', vendorPolicies: { minimax: { wirePreference: ['anthropic'], legacyRequestedWireFallbacks: { 'openai-chat': 'anthropic' } } }, modelRegistration: { contextWindow: true, reasoning: true } } } },
       ],
     }),
   ),
@@ -1188,9 +1243,10 @@ export const workspacesHandlers = [
   }),
 
   // Quick-chat launch — honor an explicit Chat Workspace target and otherwise
-  // reuse the recent demo Chat workspace. Pi launches use the real WebPi UI
-  // with a recorded native-message response; other runtimes retain the TUI
-  // placeholder so visitors can still see that OpenAlice is multi-runtime.
+  // reuse the recent demo Chat workspace. Runtimes with a structured protocol
+  // open in the real Web conversation UI with a recorded response; runtimes
+  // without one keep the TUI placeholder so visitors still see that OpenAlice
+  // is multi-runtime.
   http.post('/api/workspaces/quick-chat', async ({ request }) => {
     const body = (await request.json().catch(() => null)) as {
       prompt?: unknown
@@ -1225,7 +1281,7 @@ export const workspacesHandlers = [
     const prefix = ({ claude: 'c', codex: 'x', grok: 'g', omp: 'om', opencode: 'o', pi: 'p' } as Record<string, string>)[agent]
       ?? agent.slice(0, 1)
     const name = `${prefix}${ws.sessions.filter((session) => session.agent === agent).length + 1}`
-    const surface = agent === 'pi' ? 'webpi' as const : 'terminal' as const
+    const surface = agent in demoWebCapabilities ? 'webpi' as const : 'terminal' as const
     const record: SessionRecord = {
       id: sessionId,
       wsId: ws.id,
@@ -1248,13 +1304,15 @@ export const workspacesHandlers = [
     demoWorkspaces[workspaceIndex] = updatedWorkspace
 
     if (surface === 'webpi') {
-      setDemoWebPiSession({
+      setDemoWebSession({
         wsId: ws.id,
         sessionId,
         resumeId,
+        agent,
         startedAt,
-        messages: demoWebPiFollowUp(prompt),
+        messages: [],
       })
+      startDemoWebTurn(ws.id, sessionId, prompt)
     }
     return HttpResponse.json(
       {
@@ -1325,61 +1383,105 @@ export const workspacesHandlers = [
         sessions: workspace.sessions.filter((session) => session.id !== sessionId),
       }
     }
-    demoWebPiSessions.delete(webPiKey(wsId, sessionId))
+    demoWebSessions.delete(webKey(wsId, sessionId))
     return HttpResponse.json(true)
   }),
   http.get('/api/workspaces/:id/sessions/:sid/diagnostics', () =>
     HttpResponse.json({ status: 'demo' }),
   ),
-  http.post('/api/workspaces/:id/sessions/:sid/webpi/open', ({ params }) => {
+  http.post('/api/workspaces/:id/sessions/:sid/web/open', ({ params }) => {
     const wsId = String(params.id)
     const sessionId = String(params.sid)
-    const snapshot = wsId === demoManagerSession.wsId && sessionId === demoManagerSession.id
-      ? demoManagerSnapshot()
-      : ensureDemoWebPiSession(wsId, sessionId)
+    if (wsId === demoManagerSession.wsId && sessionId === demoManagerSession.id) {
+      return HttpResponse.json({ snapshot: demoManagerSnapshot() })
+    }
+    const record = demoWorkspaces
+      .find((workspace) => workspace.id === wsId)
+      ?.sessions.find((session) => session.id === sessionId)
+    if (record && !(record.agent in demoWebCapabilities)) {
+      return HttpResponse.json({
+        error: 'unsupported_surface',
+        message: `${record.agent} has no Web conversation surface; open it in the terminal instead`,
+      }, { status: 409 })
+    }
+    const snapshot = ensureDemoWebSession(wsId, sessionId)
     return snapshot
       ? HttpResponse.json({ snapshot })
-      : HttpResponse.json({ error: 'webpi_session_not_found' }, { status: 404 })
+      : HttpResponse.json({ error: 'web_session_not_found' }, { status: 404 })
   }),
-  http.get('/api/workspaces/:id/sessions/:sid/webpi', ({ params, request }) => {
+  http.get('/api/workspaces/:id/sessions/:sid/web', ({ params, request }) => {
     const wsId = String(params.id)
     const sessionId = String(params.sid)
     const snapshot = wsId === demoManagerSession.wsId && sessionId === demoManagerSession.id
       ? demoManagerSnapshot()
-      : findDemoWebPiSession(wsId, sessionId)
-    if (!snapshot) return HttpResponse.json({ error: 'webpi_session_not_found' }, { status: 404 })
+      : findDemoWebSession(wsId, sessionId)
+    if (!snapshot) return HttpResponse.json({ error: 'web_not_running' }, { status: 409 })
     const revision = Number.parseInt(new URL(request.url).searchParams.get('revision') ?? '', 10)
     return Number.isFinite(revision) && revision === snapshot.revision
-      ? HttpResponse.json({ unchanged: true })
+      ? HttpResponse.json({ unchanged: true, revision: snapshot.revision })
       : HttpResponse.json({ snapshot })
   }),
-  http.post('/api/workspaces/:id/sessions/:sid/webpi/prompt', async ({ params, request }) => {
+  http.post('/api/workspaces/:id/sessions/:sid/web/prompt', async ({ params, request }) => {
     const body = await request.json().catch(() => ({})) as { message?: string }
     const wsId = String(params.id)
     const sessionId = String(params.sid)
     const message = body.message?.trim() ?? ''
+    if (!message) return HttpResponse.json({ error: 'bad_request', message: 'message is required' }, { status: 400 })
     if (wsId === demoManagerSession.wsId && sessionId === demoManagerSession.id) {
       demoManagerMessages = [
         ...demoManagerMessages,
         { role: 'user', content: message },
-        { role: 'assistant', content: 'Demo manager: I would inspect the live CLI indexes before changing any desk.' },
+        { role: 'assistant', content: [{ type: 'text', text: 'Demo manager: I would inspect the live CLI indexes before changing any desk.' }] },
       ]
       return HttpResponse.json({ snapshot: demoManagerSnapshot() })
     }
-    const snapshot = appendDemoWebPiMessages(wsId, sessionId, demoWebPiFollowUp(message))
+    const current = findDemoWebSession(wsId, sessionId)
+    if (current && current.phase === 'awaiting-input') {
+      return HttpResponse.json({
+        error: 'web_prompt_failed',
+        message: 'answer the pending request before sending another message',
+      }, { status: 409 })
+    }
+    const snapshot = startDemoWebTurn(wsId, sessionId, message)
     return snapshot
       ? HttpResponse.json({ snapshot })
-      : HttpResponse.json({ error: 'webpi_session_not_found' }, { status: 404 })
+      : HttpResponse.json({ error: 'web_not_running' }, { status: 409 })
   }),
-  http.post('/api/workspaces/:id/sessions/:sid/webpi/abort', ({ params }) => {
+  http.post('/api/workspaces/:id/sessions/:sid/web/abort', ({ params }) => {
     const wsId = String(params.id)
     const sessionId = String(params.sid)
-    const snapshot = wsId === demoManagerSession.wsId && sessionId === demoManagerSession.id
-      ? demoManagerSnapshot()
-      : findDemoWebPiSession(wsId, sessionId)
+    if (wsId === demoManagerSession.wsId && sessionId === demoManagerSession.id) {
+      return HttpResponse.json({ snapshot: demoManagerSnapshot() })
+    }
+    // Aborting mid-request drops the pending question and records the stop.
+    const snapshot = updateDemoWebSession(wsId, sessionId, (current) => ({
+      phase: 'idle',
+      streamingMessage: null,
+      requests: [],
+      messages: current.requests.length > 0 || current.streamingMessage
+        ? [...current.messages, { role: 'notice', text: 'Turn stopped by the user.' }]
+        : current.messages,
+    }))
     return snapshot
       ? HttpResponse.json({ snapshot })
-      : HttpResponse.json({ error: 'webpi_session_not_found' }, { status: 404 })
+      : HttpResponse.json({ error: 'web_not_running' }, { status: 409 })
+  }),
+  http.post('/api/workspaces/:id/sessions/:sid/web/respond', async ({ params, request }) => {
+    const body = await request.json().catch(() => ({})) as { requestId?: unknown; optionId?: unknown }
+    const wsId = String(params.id)
+    const sessionId = String(params.sid)
+    if (typeof body.requestId !== 'string' || typeof body.optionId !== 'string') {
+      return HttpResponse.json({ error: 'bad_request', message: 'requestId and optionId are required' }, { status: 400 })
+    }
+    const result = answerDemoWebRequest(wsId, sessionId, body.requestId, body.optionId)
+    if (result === null) return HttpResponse.json({ error: 'web_not_running' }, { status: 409 })
+    if (result === 'unknown_request') {
+      return HttpResponse.json({ error: 'web_respond_failed', message: `no pending request ${body.requestId}` }, { status: 409 })
+    }
+    if (result === 'unknown_option') {
+      return HttpResponse.json({ error: 'web_respond_failed', message: `unknown option ${body.optionId}` }, { status: 409 })
+    }
+    return HttpResponse.json({ snapshot: result })
   }),
 
   http.get('/api/workspaces/:id/agent-config', ({ params }) =>
diff --git a/ui/src/i18n/locales/en.ts b/ui/src/i18n/locales/en.ts
index 41d1676c58..a7b1fb3e2c 100644
--- a/ui/src/i18n/locales/en.ts
+++ b/ui/src/i18n/locales/en.ts
@@ -76,7 +76,7 @@ export const en = {
     badge: 'Demo',
     compact: 'Recorded preview',
     description:
-      'You’re looking at a snapshot of OpenAlice with recorded data. Changes aren’t saved; WebPi replies are simulated.',
+      'You’re looking at a snapshot of OpenAlice with recorded data. Changes aren’t saved; Web replies are simulated.',
     install: 'Install OpenAlice',
   },
   issues: {
@@ -637,7 +637,7 @@ export const en = {
       shared: 'Shared Harness behavior',
       sharedDescription: 'These installation-level options apply across Harness Workspaces.',
       showHeadlessBorn: 'Show headless-born Sessions',
-      showHeadlessBornDescription: 'Off by default. Sessions that started from an Issue or API turn and have never opened a TUI or WebPi stay on the Issue page instead of the desk roster.',
+      showHeadlessBornDescription: 'Off by default. Sessions that started from an Issue or API turn and have never opened a TUI or Web conversation stay on the Issue page instead of the desk roster.',
       showIssueAttached: 'Show Issue-attached Sessions',
       showIssueAttachedDescription: 'Off by default. Enable this to add Sessions currently owned or occupied by ordinary Issues to the shared desk roster. Connector chat Sessions always stay hidden.',
       showUnverifiedReleases: 'Show unverified Harness releases',
@@ -1076,7 +1076,7 @@ export const en = {
     runningInBackground: 'Running in background',
     allConversationsRunning: 'All current conversations are still running in the background.',
     headlessBusyTitle: 'This Session is running in the background',
-    headlessBusyDescription: 'OpenAlice keeps one Agent process attached to a Session at a time so two processes cannot write to the same transcript. TUI and WebPi become available when this run finishes.',
+    headlessBusyDescription: 'OpenAlice keeps one Agent process attached to a Session at a time so two processes cannot write to the same transcript. TUI and Web become available when this run finishes.',
     headlessBusyIssue: 'Started by Issue {{issue}}',
     headlessBusyAgent: 'Running with {{agent}}',
     recentAcrossWorkspaces: 'Recent across Workspaces',
diff --git a/ui/src/i18n/locales/ja.ts b/ui/src/i18n/locales/ja.ts
index fed82c1c29..ea6438f129 100644
--- a/ui/src/i18n/locales/ja.ts
+++ b/ui/src/i18n/locales/ja.ts
@@ -65,7 +65,7 @@ export const ja: Resources = {
     badge: 'デモ',
     compact: '記録済みプレビュー',
     description:
-      '記録済みデータを使った OpenAlice のスナップショットを表示しています。変更は保存されず、WebPi の応答はシミュレーションです。',
+      '記録済みデータを使った OpenAlice のスナップショットを表示しています。変更は保存されず、Web の応答はシミュレーションです。',
     install: 'OpenAlice をインストール',
   },
   issues: {
@@ -626,7 +626,7 @@ export const ja: Resources = {
       shared: '共有 Harness 動作',
       sharedDescription: 'これらのインストール単位の設定は Harness Workspace 全体に適用されます。',
       showHeadlessBorn: 'ヘッドレス生まれの Session を表示',
-      showHeadlessBornDescription: '既定はオフです。Issue や API から始まり、TUI / WebPi を一度も開いていない Session は Issue ページに残り、デスク名簿には出しません。',
+      showHeadlessBornDescription: '既定はオフです。Issue や API から始まり、TUI / Web を一度も開いていない Session は Issue ページに残り、デスク名簿には出しません。',
       showIssueAttached: 'Issue に紐づく Session を表示',
       showIssueAttachedDescription: '既定はオフです。有効にすると、通常の Issue が現在所有または使用している Session を共有デスク名簿に追加します。Connector チャットの Session は常に非表示です。',
       showUnverifiedReleases: '未検証の Harness リリースを表示',
@@ -1065,7 +1065,7 @@ export const ja: Resources = {
     runningInBackground: 'バックグラウンドで実行中',
     allConversationsRunning: '現在の会話はすべてバックグラウンドで実行中です。',
     headlessBusyTitle: 'この Session はバックグラウンドで実行中です',
-    headlessBusyDescription: '同じ会話履歴に二つの Agent プロセスが同時に書き込まないよう、OpenAlice は一度に一つのプロセスだけを Session に接続します。この実行が完了すると TUI または WebPi で開けます。',
+    headlessBusyDescription: '同じ会話履歴に二つの Agent プロセスが同時に書き込まないよう、OpenAlice は一度に一つのプロセスだけを Session に接続します。この実行が完了すると TUI または Web で開けます。',
     headlessBusyIssue: 'Issue {{issue}} から開始',
     headlessBusyAgent: '{{agent}} で実行中',
     recentAcrossWorkspaces: '全ワークスペースの最近の会話',
diff --git a/ui/src/i18n/locales/zh-Hant.ts b/ui/src/i18n/locales/zh-Hant.ts
index 24948a698f..98c7b71907 100644
--- a/ui/src/i18n/locales/zh-Hant.ts
+++ b/ui/src/i18n/locales/zh-Hant.ts
@@ -72,7 +72,7 @@ export const zhHant: Resources = {
   demoBanner: {
     badge: '示範',
     compact: '錄製預覽',
-    description: '你正在查看包含錄製資料的 OpenAlice 快照。變更不會儲存；WebPi 回覆為模擬產生。',
+    description: '你正在查看包含錄製資料的 OpenAlice 快照。變更不會儲存；Web 回覆為模擬產生。',
     install: '安裝 OpenAlice',
   },
   issues: {
@@ -633,7 +633,7 @@ export const zhHant: Resources = {
       shared: '共用 Harness 行為',
       sharedDescription: '這些安裝層級選項作用於所有 Harness Workspace。',
       showHeadlessBorn: '顯示無頭出身的 Session',
-      showHeadlessBornDescription: '預設關閉。從 Issue 或 API 跑起來、從未開過 TUI / WebPi 的 Session 留在 Issue 頁，不進桌子名冊。',
+      showHeadlessBornDescription: '預設關閉。從 Issue 或 API 跑起來、從未開過 TUI / Web 的 Session 留在 Issue 頁，不進桌子名冊。',
       showIssueAttached: '顯示掛靠 Issue 的 Session',
       showIssueAttachedDescription: '預設關閉。開啟後，普通 Issue 目前持有或佔用的 Session 會進入共享桌子名冊；Connector 聊天 Session 一律隱藏。',
       showUnverifiedReleases: '顯示未經認證的 Harness 版本',
@@ -1072,7 +1072,7 @@ export const zhHant: Resources = {
     runningInBackground: '背景執行中',
     allConversationsRunning: '目前對話都還在背景執行。',
     headlessBusyTitle: '這個 Session 正在背景執行',
-    headlessBusyDescription: '為避免兩個 Agent 行程同時寫入同一份對話記錄，OpenAlice 一次只允許一個行程占用 Session。此次任務結束後即可使用 TUI 或 WebPi 開啟。',
+    headlessBusyDescription: '為避免兩個 Agent 行程同時寫入同一份對話記錄，OpenAlice 一次只允許一個行程占用 Session。此次任務結束後即可使用 TUI 或 Web 開啟。',
     headlessBusyIssue: '由 Issue {{issue}} 啟動',
     headlessBusyAgent: '正在使用 {{agent}} 執行',
     recentAcrossWorkspaces: '全部工作區的最近對話',
diff --git a/ui/src/i18n/locales/zh.ts b/ui/src/i18n/locales/zh.ts
index 7445769ffc..8712718b4b 100644
--- a/ui/src/i18n/locales/zh.ts
+++ b/ui/src/i18n/locales/zh.ts
@@ -64,7 +64,7 @@ export const zh: Resources = {
   demoBanner: {
     badge: '演示',
     compact: '录制预览',
-    description: '你正在查看包含录制数据的 OpenAlice 快照。更改不会保存；WebPi 回复为模拟生成。',
+    description: '你正在查看包含录制数据的 OpenAlice 快照。更改不会保存；Web 回复为模拟生成。',
     install: '安装 OpenAlice',
   },
   issues: {
@@ -625,7 +625,7 @@ export const zh: Resources = {
       shared: '共用 Harness 行为',
       sharedDescription: '这些安装级选项作用于所有 Harness Workspace。',
       showHeadlessBorn: '显示无头出身的 Session',
-      showHeadlessBornDescription: '默认关闭。从 Issue 或 API 跑起来、从未打开过 TUI / WebPi 的 Session 留在 Issue 页，不进桌子名册。',
+      showHeadlessBornDescription: '默认关闭。从 Issue 或 API 跑起来、从未打开过 TUI / Web 的 Session 留在 Issue 页，不进桌子名册。',
       showIssueAttached: '显示挂靠 Issue 的 Session',
       showIssueAttachedDescription: '默认关闭。开启后，普通 Issue 当前持有或占用的 Session 会进入共享桌子名册；Connector 聊天 Session 始终隐藏。',
       showUnverifiedReleases: '显示未经认证的 Harness 版本',
@@ -1064,7 +1064,7 @@ export const zh: Resources = {
     runningInBackground: '后台运行中',
     allConversationsRunning: '当前会话都还在后台运行。',
     headlessBusyTitle: '这个 Session 正在后台运行',
-    headlessBusyDescription: '为避免两个 Agent 进程同时写入同一份会话记录，OpenAlice 一次只允许一个进程占用 Session。此次任务结束后即可使用 TUI 或 WebPi 打开。',
+    headlessBusyDescription: '为避免两个 Agent 进程同时写入同一份会话记录，OpenAlice 一次只允许一个进程占用 Session。此次任务结束后即可使用 TUI 或 Web 打开。',
     headlessBusyIssue: '由 Issue {{issue}} 启动',
     headlessBusyAgent: '正在使用 {{agent}} 运行',
     recentAcrossWorkspaces: '全部工作区的最近对话',
diff --git a/ui/src/pages/AutoPredictionSetupPage.spec.tsx b/ui/src/pages/AutoPredictionSetupPage.spec.tsx
index a70e59512c..25d6514cbb 100644
--- a/ui/src/pages/AutoPredictionSetupPage.spec.tsx
+++ b/ui/src/pages/AutoPredictionSetupPage.spec.tsx
@@ -68,7 +68,7 @@ function context(workspaces: readonly Workspace[]): WorkspacesContextValue {
     setAutoQuantDefaultWorkspace: vi.fn(async () => undefined),
     setAutoPredictionDefaultWorkspace: mocks.select,
     quickChat: vi.fn(async () => ''), pauseSession: vi.fn(async () => undefined),
-    resumeSession: vi.fn(async () => undefined), openWebPiSession: vi.fn(async () => undefined),
+    resumeSession: vi.fn(async () => undefined), openWebSession: vi.fn(async () => undefined),
     requestDeleteSession: vi.fn(), setSessionPresence: vi.fn(async () => undefined),
     setSessionDisplayName: vi.fn(async () => undefined), updateSessionRuntime: vi.fn(async () => undefined),
     openAgentConfig: vi.fn(), saveWorkspaceMetadata: vi.fn(async () => undefined),
diff --git a/ui/src/pages/AutoQuantSetupPage.spec.tsx b/ui/src/pages/AutoQuantSetupPage.spec.tsx
index 1f65c7ddcc..c24610e279 100644
--- a/ui/src/pages/AutoQuantSetupPage.spec.tsx
+++ b/ui/src/pages/AutoQuantSetupPage.spec.tsx
@@ -99,7 +99,7 @@ function context(workspaces: readonly Workspace[]): WorkspacesContextValue {
     quickChat: vi.fn(async () => ''),
     pauseSession: vi.fn(async () => undefined),
     resumeSession: vi.fn(async () => undefined),
-    openWebPiSession: vi.fn(async () => undefined),
+    openWebSession: vi.fn(async () => undefined),
     requestDeleteSession: vi.fn(),
     setSessionPresence: vi.fn(async () => undefined),
     setSessionDisplayName: vi.fn(async () => undefined),
diff --git a/ui/src/pages/ChatLandingPage.render.spec.tsx b/ui/src/pages/ChatLandingPage.render.spec.tsx
index bdc73a799b..621ac5e83a 100644
--- a/ui/src/pages/ChatLandingPage.render.spec.tsx
+++ b/ui/src/pages/ChatLandingPage.render.spec.tsx
@@ -171,7 +171,7 @@ function context(
     quickChat: mocks.quickChat,
     pauseSession: vi.fn(async () => undefined),
     resumeSession: vi.fn(async () => undefined),
-    openWebPiSession: vi.fn(async () => undefined),
+    openWebSession: vi.fn(async () => undefined),
     requestDeleteSession: vi.fn(),
     setSessionPresence: vi.fn(async () => undefined),
     setSessionDisplayName: vi.fn(async () => undefined),
diff --git a/ui/src/pages/ChatSetupPage.spec.tsx b/ui/src/pages/ChatSetupPage.spec.tsx
index fe29149a82..f8b1651eb0 100644
--- a/ui/src/pages/ChatSetupPage.spec.tsx
+++ b/ui/src/pages/ChatSetupPage.spec.tsx
@@ -82,7 +82,7 @@ function context(workspaces: readonly Workspace[]): WorkspacesContextValue {
     quickChat: vi.fn(async () => ''),
     pauseSession: vi.fn(async () => undefined),
     resumeSession: vi.fn(async () => undefined),
-    openWebPiSession: vi.fn(async () => undefined),
+    openWebSession: vi.fn(async () => undefined),
     requestDeleteSession: vi.fn(),
     setSessionPresence: vi.fn(async () => undefined),
     setSessionDisplayName: vi.fn(async () => undefined),
diff --git a/ui/src/pages/WorkspaceListPage.spec.tsx b/ui/src/pages/WorkspaceListPage.spec.tsx
index 6f619010a3..a0cbd6c128 100644
--- a/ui/src/pages/WorkspaceListPage.spec.tsx
+++ b/ui/src/pages/WorkspaceListPage.spec.tsx
@@ -71,7 +71,7 @@ function context(): WorkspacesContextValue {
     quickChat: vi.fn(async () => ''),
     pauseSession: vi.fn(async () => undefined),
     resumeSession: vi.fn(async () => undefined),
-    openWebPiSession: vi.fn(async () => undefined),
+    openWebSession: vi.fn(async () => undefined),
     requestDeleteSession: vi.fn(),
     setSessionPresence: vi.fn(async () => undefined),
     setSessionDisplayName: vi.fn(async () => undefined),
diff --git a/ui/src/pages/WorkspaceManagerPage.spec.tsx b/ui/src/pages/WorkspaceManagerPage.spec.tsx
index 2f88cdaf13..46eef0f579 100644
--- a/ui/src/pages/WorkspaceManagerPage.spec.tsx
+++ b/ui/src/pages/WorkspaceManagerPage.spec.tsx
@@ -24,7 +24,7 @@ const mocks = vi.hoisted(() => ({
   getWorkspaceCredentialDefaults: vi.fn(),
   getPresets: vi.fn(),
   quickStartWorkspaceManager: vi.fn(),
-  openWebPiSession: vi.fn(),
+  openWebSession: vi.fn(),
   resumeSession: vi.fn(),
   getQuickChat: vi.fn(),
   rememberQuickChatLaunch: vi.fn(),
@@ -53,7 +53,7 @@ vi.mock('../components/workspace/api', async (importOriginal) => {
     detectWorkspaceCredential: mocks.detectWorkspaceCredential,
     getAgentReadiness: mocks.getAgentReadiness,
     quickStartWorkspaceManager: mocks.quickStartWorkspaceManager,
-    openWebPiSession: mocks.openWebPiSession,
+    openWebSession: mocks.openWebSession,
     resumeSession: mocks.resumeSession,
   }
 })
@@ -92,8 +92,8 @@ vi.mock('../components/workspace/Terminal', () => ({
   ),
 }))
 
-vi.mock('../components/workspace/WebPiView', () => ({
-  WebPiView: () => <div data-testid="webpi-view" />,
+vi.mock('../components/workspace/WebSessionView', () => ({
+  WebSessionView: () => <div data-testid="web-session-view" />,
 }))
 
 const runtimeIds = ['claude', 'codex', 'cursor', 'agy', 'grok', 'omp', 'opencode', 'pi'] as const
@@ -117,6 +117,11 @@ const runtimeAgents: AgentInfo[] = [
     resumeLast: true,
     resumeById: true,
     transcriptDiscovery: 'none',
+    ...(id === 'pi' || id === 'omp'
+      ? { web: { wire: 'pi-rpc' as const, permissionPrompts: false, freshSession: true } }
+      : id === 'claude'
+        ? { web: { wire: 'claude-stream-json' as const, permissionPrompts: true, freshSession: true } }
+        : {}),
     ...(id !== 'shell' ? {
       aiProvider: {
         credentialSource: id === 'opencode' || id === 'pi'
@@ -185,7 +190,7 @@ function context(
     quickChat: vi.fn(async () => ''),
     pauseSession: vi.fn(async () => undefined),
     resumeSession: mocks.resumeSession,
-    openWebPiSession: mocks.openWebPiSession,
+    openWebSession: mocks.openWebSession,
     requestDeleteSession: vi.fn(),
     setSessionPresence: vi.fn(async () => undefined),
     setSessionDisplayName: vi.fn(async () => undefined),
@@ -248,7 +253,7 @@ beforeEach(async () => {
   mocks.getPresets.mockResolvedValue({ presets: [] })
   mocks.getQuickChat.mockResolvedValue({ lastCredentialByAgent: {}, recentChatWorkspaceId: null })
   mocks.rememberQuickChatLaunch.mockResolvedValue(undefined)
-  mocks.openWebPiSession.mockResolvedValue(undefined)
+  mocks.openWebSession.mockResolvedValue(undefined)
   mocks.resumeSession.mockResolvedValue(undefined)
   mocks.refreshWorkspaceManager.mockResolvedValue(undefined)
   mocks.quickStartWorkspaceManager.mockResolvedValue({
@@ -644,7 +649,7 @@ describe('WorkspaceManagerPage runtime selection', () => {
       'workspace-manager',
       session.id,
     )
-    expect(mocks.openWebPiSession).not.toHaveBeenCalled()
+    expect(mocks.openWebSession).not.toHaveBeenCalled()
   })
 
   it('makes a running Manager terminal the owning canvas', () => {
@@ -677,7 +682,7 @@ describe('WorkspaceManagerPage runtime selection', () => {
     expect(screen.getByText('Codex TUI')).toBeTruthy()
   })
 
-  it('reopens a paused Pi Manager Session in its saved WebPi surface', () => {
+  it('reopens a paused Pi Manager Session in its saved Web surface', () => {
     const session: SessionRecord = {
       id: 'manager-pi',
       resumeId: 'manager-pi-resume',
@@ -690,7 +695,7 @@ describe('WorkspaceManagerPage runtime selection', () => {
       surface: 'webpi',
       pid: null,
       startedAt: null,
-      title: 'Resume WebPi manager',
+      title: 'Resume Web manager',
     }
     mocks.useWorkspaces.mockImplementation(() => context('pi', managerSnapshot([session])))
 
@@ -699,12 +704,12 @@ describe('WorkspaceManagerPage runtime selection', () => {
       params: { sessionId: session.id },
     }} />)
 
-    expect(mocks.openWebPiSession).not.toHaveBeenCalled()
-    const openWebPi = screen.getByText('Open in WebPi').closest('button')
-    expect(openWebPi).toBeTruthy()
-    fireEvent.click(openWebPi as HTMLButtonElement)
+    expect(mocks.openWebSession).not.toHaveBeenCalled()
+    const openWeb = screen.getByText('Open in Web').closest('button')
+    expect(openWeb).toBeTruthy()
+    fireEvent.click(openWeb as HTMLButtonElement)
 
-    expect(mocks.openWebPiSession).toHaveBeenCalledWith('workspace-manager', session.id)
+    expect(mocks.openWebSession).toHaveBeenCalledWith('workspace-manager', session.id)
     expect(mocks.resumeSession).not.toHaveBeenCalled()
   })
 })
diff --git a/ui/src/pages/WorkspaceManagerPage.tsx b/ui/src/pages/WorkspaceManagerPage.tsx
index 0fa71ee4f8..640144ad3e 100644
--- a/ui/src/pages/WorkspaceManagerPage.tsx
+++ b/ui/src/pages/WorkspaceManagerPage.tsx
@@ -22,7 +22,7 @@ import {
   type AgentLaunchSelectorsHandle,
 } from '../components/workspace/AgentLaunchControls'
 import { TerminalView } from '../components/workspace/Terminal'
-import { WebPiView } from '../components/workspace/WebPiView'
+import { WebSessionView } from '../components/workspace/WebSessionView'
 import { ResumeCta } from '../components/workspace/ResumeCta'
 import { Button } from '../components/ui/button'
 import { useWorkspaces } from '../contexts/workspaces-context'
@@ -49,7 +49,7 @@ export function WorkspaceManagerPage({ spec }: { spec: ManagerSpec }) {
     refreshWorkspaceManager,
     quickStartWorkspaceManager,
     resumeSession,
-    openWebPiSession,
+    openWebSession,
   } = useWorkspaces()
   const openOrFocus = useWorkspace((state) => state.openOrFocus)
   const [draft, setDraft] = useState('')
@@ -136,7 +136,7 @@ export function WorkspaceManagerPage({ spec }: { spec: ManagerSpec }) {
     const terminalCanvas =
       session.state === 'running' &&
       (session.surface ?? 'terminal') === 'terminal'
-    const webPiCanvas = session.state === 'running' && session.agent === 'pi' && session.surface === 'webpi'
+    const webCanvas = session.state === 'running' && session.surface === 'webpi'
     const backButton = (
       <Button
         type="button"
@@ -153,26 +153,29 @@ export function WorkspaceManagerPage({ spec }: { spec: ManagerSpec }) {
     const runtimeBadge = (
       <span className="inline-flex items-center gap-1.5 rounded-full border border-border/70 bg-background px-2 py-1 text-[10px] leading-[14px] font-medium text-muted-foreground">
         <AgentRuntimeIcon agentId={session.agent} className="h-[11px] w-[11px]" />
-        {runtimeLabel(session.agent, agents)} {session.surface === 'webpi' ? 'WebPi' : 'TUI'}
+        {runtimeLabel(session.agent, agents)} {session.surface === 'webpi' ? 'Web' : 'TUI'}
       </span>
     )
 
     return (
       <div className={`workspaces-root flex h-full min-h-0 flex-col bg-background${terminalCanvas ? ' workspace-manager-terminal-canvas' : ''}`}>
-        {!terminalCanvas && !webPiCanvas && (
+        {!terminalCanvas && !webCanvas && (
           <PageTopBar title={session.title ?? session.name} leading={backButton} actions={runtimeBadge} />
         )}
         <div className={`flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden${terminalCanvas ? '' : ' p-2 md:p-3'}`}>
           {session.state === 'paused' ? (
             <ResumeCta
               record={session}
+              agents={agents}
               onResume={() => resumeSession(MANAGER_WORKSPACE_ID, session.id)}
-              onOpenWebPi={() => openWebPiSession(MANAGER_WORKSPACE_ID, session.id)}
+              onOpenWeb={() => openWebSession(MANAGER_WORKSPACE_ID, session.id)}
             />
-          ) : session.agent === 'pi' && session.surface === 'webpi' ? (
-            <WebPiView
+          ) : session.surface === 'webpi' ? (
+            <WebSessionView
               wsId={MANAGER_WORKSPACE_ID}
               sessionId={sessionId}
+              agent={session.agent}
+              agents={agents}
               label={t('workspaceManager.title')}
               headerActions={<>{backButton}{runtimeBadge}</>}
               onSessionLost={() => void refreshWorkspaceManager()}
diff --git a/ui/src/pages/WorkspacePage.spec.tsx b/ui/src/pages/WorkspacePage.spec.tsx
index 6b440ba8d9..744284fb11 100644
--- a/ui/src/pages/WorkspacePage.spec.tsx
+++ b/ui/src/pages/WorkspacePage.spec.tsx
@@ -13,7 +13,7 @@ const mocks = vi.hoisted(() => ({
   spawn: vi.fn(),
   openAgentConfig: vi.fn(),
   resumeSession: vi.fn(),
-  openWebPiSession: vi.fn(),
+  openWebSession: vi.fn(),
   refresh: vi.fn(),
   workspaceViewProps: vi.fn(),
   workspaces: [] as Workspace[],
@@ -27,7 +27,7 @@ vi.mock('../contexts/workspaces-context', () => ({
     spawn: mocks.spawn,
     openAgentConfig: mocks.openAgentConfig,
     resumeSession: mocks.resumeSession,
-    openWebPiSession: mocks.openWebPiSession,
+    openWebSession: mocks.openWebSession,
     refresh: mocks.refresh,
   }),
 }))
diff --git a/ui/src/pages/WorkspacePage.tsx b/ui/src/pages/WorkspacePage.tsx
index 9019046fcc..2785f1d21b 100644
--- a/ui/src/pages/WorkspacePage.tsx
+++ b/ui/src/pages/WorkspacePage.tsx
@@ -24,6 +24,7 @@ import '@xterm/xterm/css/xterm.css'
 import { useWorkspaces } from '../contexts/workspaces-context'
 import { useWorkspaceSessionData } from '../hooks/useWorkspaceData'
 import { useWorkspace } from '../tabs/store'
+import { agentSupportsWeb } from '../components/workspace/api'
 import { workspaceDisplayName, workspaceDisplayTitle } from '../components/workspace/display'
 import { WorkspaceView } from '../components/workspace/WorkspaceView'
 import { PageTopBar } from '../components/PageTopBar'
@@ -105,29 +106,36 @@ export function WorkspacePage({ spec, visible }: Props) {
     activeRecord?.state === 'running' &&
     (activeRecord.surface ?? 'terminal') === 'terminal'
   const pausedCanvas = activeRecord?.state === 'paused'
-  const webPiCanvas = activeRecord?.state === 'running' && activeRecord.surface === 'webpi' && activeRecord.agent === 'pi'
+  const webCanvas = activeRecord?.state === 'running' && activeRecord.surface === 'webpi'
   const workspaceCanvas = terminalCanvas || pausedCanvas
+  // The surface toggle is offered only for runtimes that expose a structured
+  // protocol; a TUI-only runtime keeps its terminal without a dead button.
+  const canSwitchSurface = activeRecord?.state === 'running'
+    && (webCanvas || agentSupportsWeb(ctx.agents, activeRecord.agent))
+  const runtimeLabel = activeRecord
+    ? ctx.agents.find((agent) => agent.id === activeRecord.agent)?.displayName ?? activeRecord.agent
+    : ''
   const workspaceActions = (
     <>
-      {activeRecord?.agent === 'pi' && activeRecord.state === 'running' && (
+      {activeRecord && canSwitchSurface && (
         <Button
           type="button"
           onClick={() => {
-            if ((activeRecord.surface ?? 'terminal') === 'webpi') {
+            if (webCanvas) {
               void ctx.resumeSession(wsId, activeRecord.id, source)
             } else {
-              void ctx.openWebPiSession(wsId, activeRecord.id, source)
+              void ctx.openWebSession(wsId, activeRecord.id, source)
             }
           }}
           variant="ghost"
           size="sm"
           className="text-[11px]"
-          title={(activeRecord.surface ?? 'terminal') === 'webpi' ? 'Open this Pi Session in the terminal' : 'Open this Pi Session in WebPi'}
+          title={webCanvas ? `Open this ${runtimeLabel} Session in the terminal` : `Open this ${runtimeLabel} Session in Web`}
         >
-          {(activeRecord.surface ?? 'terminal') === 'webpi'
+          {webCanvas
             ? <Monitor size={13} strokeWidth={2.25} aria-hidden="true" />
-            : <AgentRuntimeIcon agentId="pi" className="h-[13px] w-[13px]" />}
-          {(activeRecord.surface ?? 'terminal') === 'webpi' ? 'Open TUI' : 'WebPi Beta'}
+            : <AgentRuntimeIcon agentId={activeRecord.agent} className="h-[13px] w-[13px]" />}
+          {webCanvas ? 'Open TUI' : 'Web Beta'}
         </Button>
       )}
       <WorkspaceFilesToggle />
@@ -154,7 +162,7 @@ export function WorkspacePage({ spec, visible }: Props) {
     <div className={`workspaces-root workspace-page-shell flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden${terminalCanvas ? ' is-terminal-canvas' : ''}${pausedCanvas ? ' is-paused-canvas' : ''}`}>
       {/* Running renderers fill the shared header slot with session identity
        * and these actions. Libraries and paused sessions own their header here. */}
-      {!terminalCanvas && !webPiCanvas && (
+      {!terminalCanvas && !webCanvas && (
         <PageTopBar title={workspaceName} titleHint={workspaceDisplayTitle(workspace)} actions={workspaceActions}>
             {hasCustomName && (
               <span className="hidden shrink-0 font-mono text-[10px] text-muted-foreground/70 sm:inline">
@@ -173,14 +181,14 @@ export function WorkspacePage({ spec, visible }: Props) {
           sessions={sessions}
           agents={ctx.agents}
           label={workspaceName}
-          terminalHeaderActions={terminalCanvas || webPiCanvas ? workspaceActions : undefined}
+          terminalHeaderActions={terminalCanvas || webCanvas ? workspaceActions : undefined}
           onSpawnFresh={spawnDefault}
           onResume={(id) => ctx.resumeSession(wsId, id, source)}
           onUpdateSessionRuntime={(_id, update) => updateRuntime(update).then(() => undefined)}
           onSaveSessionDisplayName={(resumeId, displayName) => (
             ctx.setSessionDisplayName(wsId, resumeId, displayName)
           )}
-          onOpenWebPi={(id) => ctx.openWebPiSession(wsId, id, source)}
+          onOpenWeb={(id) => ctx.openWebSession(wsId, id, source)}
           onSelectSession={(id) => {
             // Running session — already alive on the server, just
             // navigate. Mirrors the sidebar's onSelectSession path.

From 68e64c1139f29d6828ce39b3c02f060a2bffe662 Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Sun, 6 Sep 2026 12:12:15 +0000
Subject: [PATCH 3/4] docs: describe the Web conversation surface owner
 contract

Add docs/web-conversation-surface.md, register it in the owner-guide index,
retire WebPi wording from the guides that referenced it, and record plan
progress.

Co-authored-by: RainMona <RainMona@users.noreply.github.com>
---
 docs/README.md                                |   3 +-
 docs/conversation-provenance.md               |   2 +-
 docs/managed-workspace-runtime.md             |   4 +-
 docs/model-semantics-and-runtime-injection.md |   2 +-
 docs/project-structure.md                     |  10 +-
 docs/remote-access.md                         |   7 +-
 docs/ui-interaction-and-motion.md             |  24 +++-
 docs/web-conversation-surface.md              | 106 ++++++++++++++++++
 docs/workspace-absorb.md                      |   2 +-
 docs/workspace-manager.md                     |  23 ++--
 docs/workspace-template-upgrade.md            |   2 +-
 plans/web-conversation-surface.md             |  29 ++---
 12 files changed, 178 insertions(+), 36 deletions(-)
 create mode 100644 docs/web-conversation-surface.md

diff --git a/docs/README.md b/docs/README.md
index 0bb12c1a20..facef0e992 100644
--- a/docs/README.md
+++ b/docs/README.md
@@ -28,7 +28,8 @@ GitHub navigation.
 | [[docs/ui-interaction-and-motion.md]] | [UI interaction and motion](ui-interaction-and-motion.md) | Clickable affordances, shared motion tokens, entrances/disclosures, reduced-motion policy |
 | [[docs/workspace-agent-guidance.md]] | [Workspace agent guidance](workspace-agent-guidance.md) | Always-loaded prompt contract, skill ownership, live CLI authority, guidance versioning |
 | [[docs/workspace-lifecycle.md]] | [Workspace and Session lifecycle](workspace-lifecycle.md) | Offboarding, departed directories, handoff, restore/purge, Session retirement |
-| [[docs/workspace-manager.md]] | [Workspace Manager](workspace-manager.md) | Launcher-owned control plane, WebPi quick start, active-desk inventory, and management boundaries |
+| [[docs/workspace-manager.md]] | [Workspace Manager](workspace-manager.md) | Launcher-owned control plane, Web quick start, active-desk inventory, and management boundaries |
+| [[docs/web-conversation-surface.md]] | [Web conversation surface](web-conversation-surface.md) | Structured-protocol browser conversation for any runtime: wires, transports, neutral snapshot, permission requests, routes |
 | [[docs/workspace-template-upgrade.md]] | [Workspace Template Upgrade](workspace-template-upgrade.md) | Managed-asset baselines, three-way review, apply transactions, recovery, and the future Merge/Absorb boundary |
 | [[docs/workspace-absorb.md]] | [Workspace Absorb](workspace-absorb.md) | Directional Workspace consolidation, collision review, archived source identity, and recovery |
 | [[docs/workspace-issues-and-scheduling.md]] | [Workspace issues and scheduling](workspace-issues-and-scheduling.md) | Markdown issue contract, global board, schedule scanner, headless execution, Inbox delivery |
diff --git a/docs/conversation-provenance.md b/docs/conversation-provenance.md
index e441875127..a58daabc41 100644
--- a/docs/conversation-provenance.md
+++ b/docs/conversation-provenance.md
@@ -75,7 +75,7 @@ Ask Alice and AutoQuant list those colleagues from persistent
 Directory (`GET /api/workspaces/:id/resumes`) decorates those rows with
 identity, presence, birth, and latest-execution facts; it never invents roster
 membership. Settings → Harness controls whether a headless-born Session that
-has never opened a TUI or WebPi appears on that shared roster (default off);
+has never opened a TUI or Web conversation appears on that shared roster (default off);
 the Issue page still owns those rows. The roster shows only
 `presence=active` coworkers; Archive files them without destroying either
 their `resumeId` or Session record. Soft-delete (`presence=deleted`) is still
diff --git a/docs/managed-workspace-runtime.md b/docs/managed-workspace-runtime.md
index d575439081..a01c1fb51e 100644
--- a/docs/managed-workspace-runtime.md
+++ b/docs/managed-workspace-runtime.md
@@ -345,10 +345,10 @@ authorize complete argv, prompts, credentials, or environment values in logs.
 
 Pi project trust follows the runtime boundary:
 
-- before TUI or WebPi startup, the Pi adapter records a genuinely undecided
+- before TUI or Web startup, the Pi adapter records a genuinely undecided
   OpenAlice-managed Workspace in the trust store used by that Pi process. This
   prevents a fresh Quick Chat from stalling behind a terminal-only trust
-  selector that WebPi cannot render;
+  selector that the Web surface cannot render;
 - an explicit saved allow or deny decision on the Workspace or its nearest
   parent remains authoritative. OpenAlice never flips that decision;
 - interactive argv does not receive the version-sensitive `--approve` flag.
diff --git a/docs/model-semantics-and-runtime-injection.md b/docs/model-semantics-and-runtime-injection.md
index 9b299e44f5..76432bd9fe 100644
--- a/docs/model-semantics-and-runtime-injection.md
+++ b/docs/model-semantics-and-runtime-injection.md
@@ -474,7 +474,7 @@ Native Agent configuration files may contain user- or runtime-owned settings.
 The compatibility exporter must update only OpenAlice-owned keys/nodes,
 preserve unknown data, and restore the prior value on reset where a shared
 scalar is overridden. It is reached through the advanced deprecated surface;
-normal Workspace creation, Quick Chat, Issues, probes, WebPi, and resume do not
+normal Workspace creation, Quick Chat, Issues, probes, Web Sessions, and resume do not
 call it.
 
 Pi uses one generic OpenAlice-managed project extension plus local provider and
diff --git a/docs/project-structure.md b/docs/project-structure.md
index 5cf1e56071..87ac5db31a 100644
--- a/docs/project-structure.md
+++ b/docs/project-structure.md
@@ -209,6 +209,12 @@ Load-bearing paths:
 
 - `src/workspaces/service.ts` — Workspace lifecycle and composition.
 - `src/workspaces/session-pool.ts` — PTY process ownership.
+- `src/workspaces/web-session-host.ts` and `src/workspaces/web-session/` —
+  the browser conversation surface: one long-lived structured-protocol
+  process per Session record, projected into a neutral snapshot. Transports
+  own the wire (`pi-rpc`, `acp`, `claude-stream-json`, `codex-app-server`);
+  adapters declare `capabilities.web` and compose the process command. The
+  persisted `SessionRecord.surface` value stays `webpi` for every runtime.
 - `src/workspaces/harness-surface-manager.ts` — managed Harness web processes,
   readiness, routes, logs, and cleanup.
 - `src/workspaces/session-registry.ts` — durable session metadata.
@@ -244,7 +250,7 @@ provenance link:
 
 Do not use a headless task id directly as a roster or process-attachment id,
 and do not create another `SessionRecord` when the same `resumeId` changes
-between headless, terminal, and WebPi execution. The run is execution
+between headless, terminal, and Web execution. The run is execution
 provenance; `resumeId` is the product identity; `SessionRecord` is its one
 durable launcher-owned roster record.
 
@@ -323,7 +329,7 @@ Inbox is the durable agent-to-user delivery surface. Agents publish reports or
 status by calling the injected `inbox_push` capability. Alice stamps the
 product Session and exact execution identity out-of-band. The user can return
 to the exact originating Session regardless of whether its first turn was
-headless or interactive; opening TUI/WebPi attaches a process to the existing
+headless or interactive; opening TUI/Web attaches a process to the existing
 durable Session record.
 
 ## Persistent State
diff --git a/docs/remote-access.md b/docs/remote-access.md
index 3c85d23e3a..040699bbeb 100644
--- a/docs/remote-access.md
+++ b/docs/remote-access.md
@@ -602,8 +602,9 @@ That is a later protocol, not a shortcut in the SSH phase.
 The existing Workspace PTY WebSocket crosses the SSH tunnel unchanged. The
 remote PTY and Agent TUI remain authoritative; the local xterm-compatible
 surface renders received terminal bytes. Shell, Claude Code, Codex, opencode,
-and Pi retain the same terminal semantics. WebPi remains an optional structured
-Pi surface, not a prerequisite or replacement for shell/TUI workflows.
+and Pi retain the same terminal semantics. The Web conversation surface remains
+an optional structured presentation of a runtime's own protocol, not a
+prerequisite or replacement for shell/TUI workflows.
 
 The browser's core health probe publishes a monotonic recovery generation only
 when Alice transitions from unavailable back to available. PTY views use that
@@ -942,7 +943,7 @@ behavior.
 - persistent terminal screen history by default;
 - simultaneous writable control from multiple clients;
 - replacing Electron with a browser wrapper;
-- replacing Shell or native Agent TUIs with Pi/WebPi;
+- replacing Shell or native Agent TUIs with the Web conversation surface;
 - scanning arbitrary remote directories or silently cloning OpenAlice; managed
   clone/update is restricted to the displayed destination and explicit plan;
 - installing, pinning, downgrading, or repairing Agent Runtime executables on a
diff --git a/docs/ui-interaction-and-motion.md b/docs/ui-interaction-and-motion.md
index 3c78e5d64b..7c2386a36c 100644
--- a/docs/ui-interaction-and-motion.md
+++ b/docs/ui-interaction-and-motion.md
@@ -179,8 +179,28 @@ before rendering and supplies only supported send/stop actions. Missing actions
 do not produce fake controls. Reasoning, tool input/output, failed operations,
 and unknown payloads remain inspectable; failures expand their activity details.
 Presentation must not import runtime APIs, parse provider event discriminators,
-or fetch Workspace data. Pi's conversion lives in `webpi-presentation.ts` and
-its polling/commands in `useWebPiConversation`; `WebPiView` composes the adapter.
+or fetch Workspace data. The backend already projects every runtime wire (Pi
+RPC, ACP, Claude stream-json, Codex app-server) into one neutral message list;
+`web-presentation.ts` converts that list, `useWebConversation` owns
+polling/commands, and `WebSessionView` composes the adapter for any runtime
+whose `capabilities.web` is declared. Runtime identity is a presentation fact
+(placeholder, stop label, wire tooltip), never a branch on the protocol.
+
+Runtime requests (tool permissions, file-change approvals, questions) render in
+`ConversationRequestCard`, pinned above the composer in the `status` slot
+rather than inline in the transcript, so the pending decision cannot scroll
+away while it is the only way forward. Options come verbatim from the runtime
+and answer with one option id; `allow`/`deny`/`neutral` tones map to the shared
+button variants. While a request is pending the phase is `awaiting-input`: the
+composer stays in stop mode, the card is the primary action, and further
+requests are counted rather than stacked. Answer failures keep the card and
+surface the error inline. `notice` items are neutral system remarks between
+turns (stopped turn, mode change), not assistant prose.
+
+Launch affordances (Resume CTA "Open in Web", the Workspace header surface
+toggle, Manager Quick Start) gate on `agentSupportsWeb(agents, agent)`; a
+runtime without a structured protocol keeps its terminal without a dead button,
+and an unloaded runtime list hides the affordance rather than guessing.
 
 Pending sends keep and lock their draft until acknowledgement, reject repeated
 submission, and preserve the draft on failure. Enter respects IME composition;
diff --git a/docs/web-conversation-surface.md b/docs/web-conversation-surface.md
new file mode 100644
index 0000000000..20b3609cce
--- /dev/null
+++ b/docs/web-conversation-surface.md
@@ -0,0 +1,106 @@
+# Web conversation surface
+
+The Web surface presents an existing Workspace Session in the browser through
+its runtime's own structured protocol instead of a PTY. It is a presentation of
+the same durable Session, not another runtime: the runtime still owns the
+transcript, credentials, tools, and approvals; Alice keeps one long-lived child
+process per Session record and projects that process's protocol into one
+neutral live snapshot.
+
+Read this guide before changing `src/workspaces/web-session-host.ts`,
+`src/workspaces/web-session/`, `composeWebCommand`, the `/api/workspaces/:id/sessions/:sid/web/*`
+routes, or the browser modules `useWebConversation`, `web-presentation.ts`,
+`WebSessionView`, and `ConversationRequestCard`. Rendering rules live in
+[[docs/ui-interaction-and-motion.md]]; Manager-specific launch rules live in
+[[docs/workspace-manager.md]].
+
+## Ownership
+
+| Layer | Owner | Must not |
+|---|---|---|
+| Adapter (`src/workspaces/adapters/<agent>.ts`) | Declare `capabilities.web = { wire, permissionPrompts, freshSession }` and compose the structured-mode argv in `composeWebCommand` | Parse protocol output or hold session state |
+| Transport (`src/workspaces/web-session/<wire>-transport.ts`) | Speak exactly one wire over the child's stdio, drive `WebSessionState`, surface requests, learn the native session id | Spawn processes, touch the registry, or know which adapter launched it |
+| Host (`src/workspaces/web-session-host.ts`) | Spawn/supervise the process, own the snapshot revision, dispatch prompt/abort/respond to the transport, tail stderr | Branch on agent ids or wire names |
+| Service/routes | Bind the Session record and `resumeId`, enforce one live process per Session, expose the snapshot | Reach into transport internals |
+| Browser | Poll the snapshot, group the neutral messages into turns, answer requests with an option id | Import runtime APIs or branch on the wire beyond copy |
+
+`agy` and `shell` have no structured protocol and stay TUI-only. Do not add a
+Web capability to a runtime whose structured mode cannot round-trip tool
+approval or cannot reopen an exact recorded conversation.
+
+## Wires
+
+| Wire | Runtimes | Process | Permission prompts | Fresh session |
+|---|---|---|---|---|
+| `pi-rpc` | `pi`, `omp` | `--mode rpc` JSONL; Pi additionally `--approve`, omp `--auto-approve` | none in RPC mode; launch-time approval | yes (RPC allocates the id) |
+| `acp` | `cursor`, `grok`, `opencode` | Agent Client Protocol JSON-RPC over stdio (`cursor-agent acp`, `grok agent stdio`, `opencode acp`) | `session/request_permission` with the agent's own options | `session/new`; resume via `session/load` when advertised |
+| `claude-stream-json` | `claude` | `-p --input-format stream-json --output-format stream-json --include-partial-messages --permission-prompt-tool stdio` | `control_request` `can_use_tool`; answered with allow/deny | `--session-id <uuid>` chosen by the adapter |
+| `codex-app-server` | `codex` | `codex app-server --listen stdio://` with MCP registration and `workspace-write` sandbox | `item/commandExecution/requestApproval`, `item/fileChange/requestApproval` | `thread/start`; resume via `thread/resume` |
+
+The Web surface never resumes "last": it reopens the exact recorded native id
+or starts a fresh conversation the transport reports back, so the Session's
+`resumeId` binds to one native transcript exactly as PTY discovery does.
+
+## Neutral model
+
+`src/workspaces/web-session/model.ts` is the contract the browser mirrors in
+`ui/src/components/workspace/api.ts`:
+
+- `WebConversationMessage` borrows Pi's minimal roles — `user`, `assistant`
+  (text / thinking / toolCall / data parts), `toolResult`, plus `notice` for
+  system remarks and `unknown` for records a transport could not classify.
+  Keep unknown records; they are the audit trail for protocol drift.
+- `WebPermissionRequest` carries the runtime's own option list. Transports
+  translate protocol enums into `{ id, label, tone }`; the browser answers
+  with the same `id`. Never synthesize options a runtime did not offer.
+- `WebSessionPhase` adds `awaiting-input` to the WebPi phases: the turn is
+  still in flight and blocked on the user. Prompting during it is rejected;
+  aborting drops the pending requests.
+- `streamingMessage` is the cumulative in-flight assistant message and is
+  replaced, never appended; transports move it into `messages` when the turn
+  ends.
+
+The snapshot is ephemeral. Do not persist it, do not migrate it, and do not
+read it back as a transcript.
+
+## Persisted surface value
+
+`SessionRecord.surface` keeps the shipped value `webpi` (migration 0040) for
+every runtime that opens in the Web surface. Renaming it would require a
+migration for no behavioral gain; free-floating identifiers (routes, host,
+components, labels) use "Web". User-facing copy says "Web", never "WebPi".
+
+## Routes
+
+- `POST /web/open` — checks `capabilities.web`, refuses a Session with a
+  running headless turn, disposes a PTY on the same record, starts the host.
+- `GET /web?revision=` — snapshot or `{ unchanged: true }`.
+- `POST /web/prompt`, `POST /web/abort` — turn control.
+- `POST /web/respond { requestId, optionId }` — answers one request; the
+  transport validates the option id and fails with `web_respond_failed`.
+
+Switching a running Web Session to the TUI stops the Web process first; the
+reverse disposes the PTY. Exactly one process may own a Session record.
+
+## Browser
+
+`agentSupportsWeb(agents, agent)` is the only gate for launch affordances.
+Runtime identity affects copy (placeholder, stop label, wire tooltip) and
+nothing else. The request card is pinned above the composer; see
+[[docs/ui-interaction-and-motion.md]] for the interaction rules. Demo mode
+mirrors the capability table in `ui/src/demo/fixtures/web-session.ts` and
+scripts a permission turn for prompting runtimes; update it with any contract
+change.
+
+## Verification
+
+- `npx tsc --noEmit`, `pnpm test`, `cd ui && npx tsc -b`.
+- `src/workspaces/web-session-host.spec.ts` drives a fake child over stdio for
+  every wire; extend it when a transport learns a new message.
+- `src/workspaces/adapters/web-command.spec.ts` pins each runtime's argv.
+- `pnpm -F open-alice-ui dev:demo`: open a Claude/Codex/ACP quick chat, answer
+  the request card, stop mid-turn, and confirm the notice.
+- Live acceptance needs installed runtimes and is not part of routine CI: for
+  each runtime, open one Session in Web, send a prompt that needs a tool,
+  answer the card, stop mid-turn, then reopen the same Session in the TUI and
+  confirm the native transcript is shared. State the gap when this was not run.
diff --git a/docs/workspace-absorb.md b/docs/workspace-absorb.md
index 46badb042f..5c0abe84ab 100644
--- a/docs/workspace-absorb.md
+++ b/docs/workspace-absorb.md
@@ -60,7 +60,7 @@ target Session the author of the source's old work.
 
 Preview and apply inspect process-backed Workspace activity, not persisted
 `state: running` flags or a bare counter. The review lists the exact open TUI,
-WebPi, and headless turns. An exited child process is pruned from the guard even
+Web, and headless turns. An exited child process is pruned from the guard even
 if an outer cleanup promise was lost, preventing a zombie “someone is working”
 blocker.
 
diff --git a/docs/workspace-manager.md b/docs/workspace-manager.md
index 6eab762bba..e11594e4b5 100644
--- a/docs/workspace-manager.md
+++ b/docs/workspace-manager.md
@@ -31,8 +31,13 @@ runtime.
 Its runtime picker consumes the same registered Agent list, saved default,
 install state, readiness, credential, model, and context contract as Quick
 Chat. `useAgentLaunchConfig` owns that resolution and the shared
-`AgentLaunchControls` components render it on both surfaces. Pi uses WebPi;
-Claude, Codex, and OpenCode retain their native TUI surfaces.
+`AgentLaunchControls` components render it on both surfaces. Quick Start opens
+Pi in the Web conversation surface; Claude, Codex, and OpenCode start in their
+native TUI surfaces. A paused Manager Session of any runtime that declares
+`capabilities.web` may later be reopened in the Web surface from its resume
+choice; that reopen carries the same manager options (`appendSystemPrompt`,
+skills, project approval) and each adapter projects what its structured mode
+supports.
 
 For OpenCode and Pi, the summary describes the exact credential, model, and
 context that the next launch will inject. An existing Manager config wins over
@@ -70,7 +75,7 @@ files remain owned by their Workspace at `.alice/sessions/<resumeId>.json`.
 ## Runtime Contract
 
 Every Manager runtime receives the same launcher-owned role contract. Pi appends
-it as a system prompt and loads `default/skills/workspace-manager` on every WebPi
+it as a system prompt and loads `default/skills/workspace-manager` on every Web
 start, including resume after restart. Native TUIs receive the contract in the
 fresh interactive seed because those CLIs do not share one portable system-
 prompt flag; their durable native transcript carries it across later resumes.
@@ -85,9 +90,9 @@ The contract says:
 - choose a target Workspace for durable work, and commit any approved direct
   edit inside that target.
 
-WebPi explicitly approves this launcher-owned cwd. There is no TUI trust prompt
-to render, and entering the dedicated manager surface is the user's visible
-approval for the bundled skill and control-plane directory. Native runtimes keep
+The Web surface explicitly approves this launcher-owned cwd. There is no TUI
+trust prompt to render, and entering the dedicated manager surface is the
+user's visible approval for the bundled skill and control-plane directory. Native runtimes keep
 their existing login, provider-injection, install, and trust behavior.
 
 OpenCode's OpenTUI startup asks the terminal emulator for cursor, mode, color,
@@ -144,7 +149,7 @@ apply remains preview-first.
 
 - `src/workspaces/manager-workspace.ts` — reserved identity and system contract.
 - `src/workspaces/service.ts` — special runtime resolution and durable Sessions.
-- `src/workspaces/adapters/pi.ts` — explicit WebPi prompt/skill/trust flags.
+- `src/workspaces/adapters/pi.ts` — explicit Web (RPC) prompt/skill/trust flags.
 - `src/tool/workspace-list.ts` — active floor inventory.
 - `src/server/cli.ts` and `src/server/cli-commands.ts` — embedded CLI exposure.
 - `src/webui/routes/workspaces.ts` — manager status, quick start, resume, and
@@ -154,7 +159,7 @@ apply remains preview-first.
   model, context, and launch-parameter resolution.
 - `ui/src/components/workspace/AgentLaunchControls.tsx` — shared selectors and
   truthful launch summary.
-- `ui/src/pages/WorkspaceManagerPage.tsx` — manager composer and WebPi/TUI shell.
+- `ui/src/pages/WorkspaceManagerPage.tsx` — manager composer and Web/TUI shell.
 - `ui/src/components/workspace/ChatWorkspaceSection.tsx` — Chat sidebar entry.
 
 ## Verification
@@ -175,7 +180,7 @@ Then use the real `/chat/manager` route with at least two available runtimes:
    saved default;
 2. on Pi or OpenCode, verify the visible model/context matches the Manager
    Workspace config, switch provider, and confirm the launch uses the new one;
-3. start one Pi/WebPi and one native-TUI Manager Session, then reopen both from
+3. start one Pi/Web and one native-TUI Manager Session, then reopen both from
    the collapsible Manager list in the Chat sidebar;
 4. inventory the active floor and confirm real `peer list` tool use;
 5. compare a harmless `--ws-id` reconstruction with an exact `--resume-id`
diff --git a/docs/workspace-template-upgrade.md b/docs/workspace-template-upgrade.md
index 02d7d91b10..39a3e2a66f 100644
--- a/docs/workspace-template-upgrade.md
+++ b/docs/workspace-template-upgrade.md
@@ -84,7 +84,7 @@ Apply takes the shared checkout-operation lease and is serialized per Workspace.
 Offboarding uses the same lease; a future Merge/Absorb operation must do so as
 well, so directory reconciliation and directory moves cannot race. Apply also
 refuses to start while an interactive
-Session, WebPi Session, or headless run is active. It also refuses an already
+Session, Web Session, or headless run is active. It also refuses an already
 staged Git index so the template change cannot absorb an unrelated staged
 change.
 
diff --git a/plans/web-conversation-surface.md b/plans/web-conversation-surface.md
index 614f93ccbb..2832699914 100644
--- a/plans/web-conversation-surface.md
+++ b/plans/web-conversation-surface.md
@@ -2,7 +2,7 @@
 
 **Status:** active  
 **Owner guides:** [[docs/web-conversation-surface.md]], [[docs/ui-interaction-and-motion.md]], [[docs/workspace-manager.md]]  
-**Delivery:** serial PR to `dev` (`area:workspace`, `area:ui`).
+**Delivery:** PR `cursor/web-conversation-transports-1c9d` → `dev` (`area:workspace`, `area:ui`).
 
 ## Goal
 
@@ -59,8 +59,11 @@ permission-request model.
   `resumeId` the same way PTY discovery does.
 - agy stays TUI-only: its new `--input-format stream-json` has no permission
   round-trip and no native ACP; revisit when either lands.
-- Workspace Manager keeps its Pi-only WebPi quick start; other runtimes still
-  need a manager-contract injection path before they can join it.
+- Workspace Manager Quick Start keeps opening Pi in Web and other runtimes in
+  their TUI. A paused Manager Session of any web-capable runtime may be
+  reopened in Web from its resume choice; the manager options travel with it
+  and each adapter projects what its structured mode supports
+  (`--append-system-prompt` for claude/omp/pi, `--rules` for grok).
 
 ## UI design decision
 
@@ -74,16 +77,16 @@ inherited from the shared primitives.
 
 ## Work
 
-- [ ] Neutral message/request/snapshot model and transport contract
-- [ ] `WebSessionHost` with process supervision shared by all transports
-- [ ] `pi-rpc` transport (pi, omp) extracted from `WebPiSessionHost`
-- [ ] `acp` transport (cursor, grok, opencode) with permission requests
-- [ ] `claude-stream-json` transport with `can_use_tool` and interrupt
-- [ ] `codex-app-server` transport with approvals and `turn/interrupt`
-- [ ] Adapter capability declarations and `composeWebCommand` per runtime
-- [ ] Service/routes: `/web/*`, `respond`, native-id binding, capability checks
-- [ ] UI: generic hook/presenter/view, permission cards, capability gating, demo
-- [ ] Owner guide + doc updates
+- [x] Neutral message/request/snapshot model and transport contract
+- [x] `WebSessionHost` with process supervision shared by all transports
+- [x] `pi-rpc` transport (pi, omp) extracted from `WebPiSessionHost`
+- [x] `acp` transport (cursor, grok, opencode) with permission requests
+- [x] `claude-stream-json` transport with `can_use_tool` and interrupt
+- [x] `codex-app-server` transport with approvals and `turn/interrupt`
+- [x] Adapter capability declarations and `composeWebCommand` per runtime
+- [x] Service/routes: `/web/*`, `respond`, native-id binding, capability checks
+- [x] UI: generic hook/presenter/view, permission cards, capability gating, demo
+- [x] Owner guide ([[docs/web-conversation-surface.md]]) + doc updates
 - [ ] Live acceptance against each installed runtime (see verification)
 
 ## Verification

From 2b6cf119cc08819ac3f2777c384cee23eda4f657 Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Sun, 6 Sep 2026 12:42:58 +0000
Subject: [PATCH 4/4] fix(web-session): align Codex wire enums and request
 shapes with the real app-server; settle rejected prompts

Real-binary smoke against codex 0.153.4, pi 0.85.1, opencode 1.18.29 and
claude 2.1.263 found three contract gaps:

- Codex thread/start rejected approvalPolicy 'onRequest' / sandbox
  'workspaceWrite'; AskForApproval and SandboxMode are kebab-case on the
  wire ('on-request', 'workspace-write'), verified via
  codex app-server generate-json-schema.
- item/permissions/requestApproval answers with { permissions, scope }, not
  { decision }; grant now echoes the requested profile (turn or session
  scope) and decline/cancel send an empty grant. Cancel payloads are now
  per-request so user-input questions are not answered with a decision enum.
- Pi rejects prompts synchronously when no model credential is configured;
  the transport left the snapshot in 'working'. Pi, Codex and Claude now
  record the rejection in snapshot.error and return to idle.

Plan and owner guide record the smoke matrix and the remaining credentialed
acceptance gap.

Co-authored-by: RainMona <RainMona@users.noreply.github.com>
---
 docs/web-conversation-surface.md              | 13 +++-
 plans/web-conversation-surface.md             | 28 +++++--
 src/workspaces/web-session-host.spec.ts       | 76 ++++++++++++++++++-
 .../claude-stream-json-transport.ts           | 17 +++--
 .../web-session/codex-app-server-transport.ts | 45 +++++++----
 .../web-session/pi-rpc-transport.ts           | 11 ++-
 6 files changed, 161 insertions(+), 29 deletions(-)

diff --git a/docs/web-conversation-surface.md b/docs/web-conversation-surface.md
index 20b3609cce..0e7ab3651d 100644
--- a/docs/web-conversation-surface.md
+++ b/docs/web-conversation-surface.md
@@ -35,12 +35,23 @@ approval or cannot reopen an exact recorded conversation.
 | `pi-rpc` | `pi`, `omp` | `--mode rpc` JSONL; Pi additionally `--approve`, omp `--auto-approve` | none in RPC mode; launch-time approval | yes (RPC allocates the id) |
 | `acp` | `cursor`, `grok`, `opencode` | Agent Client Protocol JSON-RPC over stdio (`cursor-agent acp`, `grok agent stdio`, `opencode acp`) | `session/request_permission` with the agent's own options | `session/new`; resume via `session/load` when advertised |
 | `claude-stream-json` | `claude` | `-p --input-format stream-json --output-format stream-json --include-partial-messages --permission-prompt-tool stdio` | `control_request` `can_use_tool`; answered with allow/deny | `--session-id <uuid>` chosen by the adapter |
-| `codex-app-server` | `codex` | `codex app-server --listen stdio://` with MCP registration and `workspace-write` sandbox | `item/commandExecution/requestApproval`, `item/fileChange/requestApproval` | `thread/start`; resume via `thread/resume` |
+| `codex-app-server` | `codex` | `codex app-server --listen stdio://` with MCP registration, `approvalPolicy: on-request`, `sandbox: workspace-write` | `item/commandExecution/requestApproval`, `item/fileChange/requestApproval` (answered with a `decision` enum), `item/permissions/requestApproval` (answered with the granted `permissions` profile + `scope`), `item/tool/requestUserInput` | `thread/start`; resume via `thread/resume` |
 
 The Web surface never resumes "last": it reopens the exact recorded native id
 or starts a fresh conversation the transport reports back, so the Session's
 `resumeId` binds to one native transcript exactly as PTY discovery does.
 
+Codex wire enums (`AskForApproval`, `SandboxMode`) are kebab-case and its
+server-request response shapes differ per method; verify against
+`codex app-server generate-json-schema --out <dir>` from the installed binary
+before changing the transport rather than inferring from TypeScript-style
+names.
+
+Every transport must leave the snapshot in `idle` (or `failed` when the process
+is gone) with `error` set when a prompt is rejected before the turn starts —
+for example missing credentials. A snapshot stuck in `working` with no turn in
+flight is a transport bug, not a runtime condition.
+
 ## Neutral model
 
 `src/workspaces/web-session/model.ts` is the contract the browser mirrors in
diff --git a/plans/web-conversation-surface.md b/plans/web-conversation-surface.md
index 2832699914..d929f3b99f 100644
--- a/plans/web-conversation-surface.md
+++ b/plans/web-conversation-surface.md
@@ -87,7 +87,11 @@ inherited from the shared primitives.
 - [x] Service/routes: `/web/*`, `respond`, native-id binding, capability checks
 - [x] UI: generic hook/presenter/view, permission cards, capability gating, demo
 - [x] Owner guide ([[docs/web-conversation-surface.md]]) + doc updates
-- [ ] Live acceptance against each installed runtime (see verification)
+- [x] Real-binary handshake and prompt-path smoke for every wire (see
+  verification); fixed the Codex enum casing, permission-response shape, and
+  Pi rejected-prompt phase it uncovered
+- [ ] Credentialed live acceptance per runtime: tool-using prompt, answer the
+  permission card, stop mid-turn, reopen in the TUI (see verification)
 
 ## Verification
 
@@ -95,10 +99,24 @@ inherited from the shared primitives.
 - Transport specs drive fake child processes over stdio for every wire.
 - Demo route (`pnpm -F open-alice-ui dev:demo`) walks open → prompt →
   permission request → respond → stop for a non-Pi runtime.
-- Live runtimes are not available in the authoring environment. Before
-  promotion, open one Session per installed runtime, send a prompt that needs
-  a tool, answer the permission card, stop mid-turn, and reopen the same
-  Session in the TUI to confirm the native transcript is shared.
+- Real-binary smoke (done once with `@earendil-works/pi-coding-agent` 0.85.1,
+  `opencode-ai` 1.18.29, `@openai/codex` 0.153.4, `@anthropic-ai/claude-code`
+  2.1.263 installed under a throwaway `HOME`, driving `WebSessionHost` with the
+  argv each adapter composes):
+  - every wire completes its handshake (`pi-rpc` `get_state`, ACP
+    `initialize`→`session/new`, Codex `initialize`→`thread/start`, Claude
+    stays live and binds the session id on `system/init`);
+  - without credentials, Pi/Codex/Claude each surface the runtime's own
+    auth error as `snapshot.error` and return to `idle` instead of sticking in
+    `working`;
+  - OpenCode's bundled free model completed a real turn over ACP (user →
+    thinking → text), so that wire is accepted end to end.
+  - Codex request/response shapes were checked against
+    `codex app-server generate-json-schema` rather than memory.
+- Credentialed acceptance still needs a maintainer machine: per runtime, open
+  one Session in Web, send a prompt that needs a tool, answer the card, stop
+  mid-turn, then reopen the same Session in the TUI and confirm the native
+  transcript is shared.
 
 ## Completion
 
diff --git a/src/workspaces/web-session-host.spec.ts b/src/workspaces/web-session-host.spec.ts
index 0ad6971905..38295d8c0e 100644
--- a/src/workspaces/web-session-host.spec.ts
+++ b/src/workspaces/web-session-host.spec.ts
@@ -86,7 +86,7 @@ function texts(snapshot: WebSessionSnapshot | null): string[] {
 
 // ── pi-rpc ─────────────────────────────────────────────────────────────────
 
-function piRpcProcess(state: Json = {}): FakeProcess {
+function piRpcProcess(state: Json = {}, options: { rejectPrompt?: string } = {}): FakeProcess {
   let messages: unknown[] = []
   const rpcState = { sessionId: 'native-pi', isStreaming: false, isCompacting: false, ...state }
   return new FakeProcess((command, self) => {
@@ -94,6 +94,10 @@ function piRpcProcess(state: Json = {}): FakeProcess {
     const type = command['type']
     if (type === 'get_state') self.line({ type: 'response', id, command: type, success: true, data: { ...rpcState, messageCount: messages.length } })
     if (type === 'get_messages') self.line({ type: 'response', id, command: type, success: true, data: { messages } })
+    if (type === 'prompt' && options.rejectPrompt) {
+      self.line({ type: 'response', id, command: type, success: false, error: options.rejectPrompt })
+      return
+    }
     if (type === 'prompt') {
       const user = { role: 'user', content: command['message'] }
       const assistant = { role: 'assistant', content: [{ type: 'text', text: 'hello' }] }
@@ -162,6 +166,17 @@ describe('WebSessionHost with the pi-rpc transport', () => {
     expect(host.get('record-1')?.phase).toBe('idle')
   })
 
+  it('returns to idle with the reason when Pi rejects a prompt before the turn starts', async () => {
+    const rpc = piRpcProcess({}, { rejectPrompt: 'No API key found for the selected model.' })
+    const host = new WebSessionHost(logger, {}, () => rpc as never)
+    await host.start(input({}))
+    await expect(host.prompt('record-1', 'hi')).rejects.toThrow('No API key found')
+    const snapshot = host.get('record-1')!
+    expect(snapshot.phase).toBe('idle')
+    expect(snapshot.error).toBe('No API key found for the selected model.')
+    expect(snapshot.messages).toEqual([])
+  })
+
   it('marks the session failed when the process dies unexpectedly', async () => {
     const rpc = piRpcProcess()
     const onExit = vi.fn()
@@ -389,12 +404,31 @@ describe('WebSessionHost with the claude-stream-json transport', () => {
 
 // ── codex-app-server ───────────────────────────────────────────────────────
 
-function codexProcess(options: { history?: boolean } = {}): FakeProcess {
+function codexProcess(options: { history?: boolean; permissions?: boolean } = {}): FakeProcess {
   return new FakeProcess((command, self) => {
     const id = command['id']
     const method = command['method']
     const params = (command['params'] ?? {}) as Json
     if (method === 'initialize') { self.line({ id, result: { userAgent: 'codex' } }); return }
+    if (options.permissions) {
+      if (method === 'thread/start') { self.line({ id, result: { thread: { id: 'thr_perm', turns: [] } } }); return }
+      if (method === 'turn/start') {
+        self.line({ id, result: { turn: { id: 'turn_p', status: 'inProgress', items: [] } } })
+        self.line({ id: 'perm-1', method: 'item/permissions/requestApproval', params: {
+          itemId: 'p1', threadId: 'thr_perm', turnId: 'turn_p', cwd: '/w', reason: 'needs to reach the registry',
+          permissions: { network: { enabled: true } },
+        } })
+        return
+      }
+      if (command['id'] === 'perm-1' && 'result' in command) {
+        self.line({ method: 'turn/completed', params: { turn: { id: 'turn_p', status: 'completed' } } })
+      }
+      if (method === 'turn/interrupt') {
+        self.line({ id, result: {} })
+        self.line({ method: 'turn/completed', params: { turn: { id: 'turn_p', status: 'interrupted' } } })
+      }
+      return
+    }
     if (method === 'thread/start') { self.line({ id, result: { thread: { id: 'thr_new', turns: [] } } }); return }
     if (method === 'thread/resume') {
       self.line({ id, result: { thread: { id: params['threadId'], turns: options.history ? [{
@@ -443,7 +477,7 @@ describe('WebSessionHost with the codex-app-server transport', () => {
     expect(started.nativeSessionId).toBe('thr_new')
     expect(onNativeSessionId).toHaveBeenCalledWith('record-1', 'thr_new')
     expect(process.received.map((c) => c['method'])).toEqual(['initialize', 'initialized', 'thread/start'])
-    expect(process.received[2]).toMatchObject({ params: { cwd: '/tmp/workspace', approvalPolicy: 'onRequest', sandbox: 'workspaceWrite' } })
+    expect(process.received[2]).toMatchObject({ params: { cwd: '/tmp/workspace', approvalPolicy: 'on-request', sandbox: 'workspace-write' } })
 
     await host.prompt('record-1', 'run the tests')
     await settle()
@@ -462,6 +496,42 @@ describe('WebSessionHost with the codex-app-server transport', () => {
     expect(process.received.find((c) => c['id'] === 'approval-1')).toEqual({ id: 'approval-1', result: { decision: 'accept' } })
   })
 
+  it('answers permission requests with the granted profile, not a decision enum', async () => {
+    const process = codexProcess({ permissions: true })
+    const host = new WebSessionHost(logger, {}, () => process as never)
+    await host.start(codexInput)
+    await host.prompt('record-1', 'install deps')
+    await settle()
+    const waiting = host.get('record-1')!
+    expect(waiting.phase).toBe('awaiting-input')
+    expect(waiting.requests[0]).toMatchObject({
+      title: 'Grant additional permissions',
+      description: 'needs to reach the registry',
+      tool: { name: 'request_permissions', input: { network: { enabled: true } } },
+      options: [{ id: 'grant', tone: 'allow' }, { id: 'grantForSession', tone: 'allow' }, { id: 'decline', tone: 'deny' }],
+    })
+    await host.respond('record-1', waiting.requests[0]!.id, 'grantForSession')
+    await settle()
+    expect(process.received.find((c) => c['id'] === 'perm-1')).toEqual({
+      id: 'perm-1',
+      result: { permissions: { network: { enabled: true } }, scope: 'session' },
+    })
+    expect(host.get('record-1')!.phase).toBe('idle')
+  })
+
+  it('cancels a pending permission request with an empty grant when the turn ends first', async () => {
+    const process = codexProcess({ permissions: true })
+    const host = new WebSessionHost(logger, {}, () => process as never)
+    await host.start(codexInput)
+    await host.prompt('record-1', 'install deps')
+    await settle()
+    expect(host.get('record-1')!.requests).toHaveLength(1)
+    await host.abort('record-1')
+    await settle()
+    expect(process.received.find((c) => c['id'] === 'perm-1')).toEqual({ id: 'perm-1', result: { permissions: {} } })
+    expect(host.get('record-1')!.requests).toEqual([])
+  })
+
   it('replays thread history on resume', async () => {
     const host = new WebSessionHost(logger, {}, () => codexProcess({ history: true }) as never)
     const started = await host.start({ ...codexInput, nativeSessionId: 'thr_old' })
diff --git a/src/workspaces/web-session/claude-stream-json-transport.ts b/src/workspaces/web-session/claude-stream-json-transport.ts
index 7f97428baa..b3370c6667 100644
--- a/src/workspaces/web-session/claude-stream-json-transport.ts
+++ b/src/workspaces/web-session/claude-stream-json-transport.ts
@@ -53,11 +53,18 @@ export class ClaudeStreamJsonTransport implements WebSessionTransport {
     this.ctx.state.error = null
     this.builder.user(text)
     this.ctx.state.setPhase('working')
-    await this.ctx.channel.send({
-      type: 'user',
-      message: { role: 'user', content: [{ type: 'text', text }] },
-      ...(this.ctx.state.nativeSessionId ? { session_id: this.ctx.state.nativeSessionId } : {}),
-    })
+    try {
+      await this.ctx.channel.send({
+        type: 'user',
+        message: { role: 'user', content: [{ type: 'text', text }] },
+        ...(this.ctx.state.nativeSessionId ? { session_id: this.ctx.state.nativeSessionId } : {}),
+      })
+    } catch (error) {
+      this.turnActive = false
+      this.ctx.state.error = error instanceof Error ? error.message : String(error)
+      this.ctx.state.setPhase(this.ctx.channel.closed ? 'failed' : 'idle')
+      throw error
+    }
   }
 
   async abort(): Promise<void> {
diff --git a/src/workspaces/web-session/codex-app-server-transport.ts b/src/workspaces/web-session/codex-app-server-transport.ts
index 14c83568cd..786ba1754c 100644
--- a/src/workspaces/web-session/codex-app-server-transport.ts
+++ b/src/workspaces/web-session/codex-app-server-transport.ts
@@ -24,6 +24,8 @@ type Answer = (value: unknown) => void
 interface PendingApproval {
   readonly answer: Answer
   readonly respondWith: (optionId: string) => unknown
+  /** Payload sent when the turn ends or stops before the browser answers. */
+  readonly cancelWith: unknown
 }
 
 const DEFAULT_DECISIONS: readonly WebRequestOption[] = [
@@ -56,10 +58,12 @@ export class CodexAppServerTransport implements WebSessionTransport {
       capabilities: {},
     })
     await this.peer.notify('initialized', {})
+    // `AskForApproval` / `SandboxMode` are kebab-case wire enums (verified
+    // against `codex app-server generate-json-schema`, 0.153.x).
     const options = {
       cwd: this.ctx.input.cwd,
-      approvalPolicy: 'onRequest',
-      sandbox: 'workspaceWrite',
+      approvalPolicy: 'on-request',
+      sandbox: 'workspace-write',
       ...(this.ctx.input.model ? { model: this.ctx.input.model } : {}),
     }
     const result = this.threadId
@@ -86,6 +90,7 @@ export class CodexAppServerTransport implements WebSessionTransport {
       threadId: this.threadId,
       input: [{ type: 'text', text }],
     }).catch((error: Error) => {
+      this.ctx.state.error = error.message
       this.ctx.state.setPhase('idle')
       throw error
     })
@@ -299,15 +304,26 @@ export class CodexAppServerTransport implements WebSessionTransport {
           description: stringOrNull(p['reason']) ?? 'Codex wants to edit files in the workspace.',
           tool: { name: 'apply_patch', input: { itemId: p['itemId'], grantRoot: p['grantRoot'] } },
         })
-      case 'item/permissions/requestApproval':
-        return this.approval(p, {
+      case 'item/permissions/requestApproval': {
+        // Unlike command/file approvals, this request answers with the granted
+        // profile (`{ permissions, scope }`), not a decision enum. Granting
+        // echoes the requested profile; declining grants nothing.
+        const requested = isJsonObject(p['permissions']) ? p['permissions'] : {}
+        return this.enqueue({
+          kind: 'permission',
           title: 'Grant additional permissions',
-          description: 'Codex requests network or filesystem access beyond its sandbox.',
-          tool: { name: 'request_permissions', input: p['permissions'] ?? p },
-        }, [
-          { id: 'accept', label: 'Grant', tone: 'allow' },
-          { id: 'decline', label: 'Decline', tone: 'deny' },
-        ])
+          description: stringOrNull(p['reason']) ?? 'Codex requests network or filesystem access beyond its sandbox.',
+          tool: { name: 'request_permissions', input: requested },
+          options: [
+            { id: 'grant', label: 'Grant for this turn', tone: 'allow' },
+            { id: 'grantForSession', label: 'Grant for this session', tone: 'allow' },
+            { id: 'decline', label: 'Decline', tone: 'deny' },
+          ],
+        }, (optionId) => optionId === 'decline'
+          ? { permissions: {} }
+          : { permissions: requested, scope: optionId === 'grantForSession' ? 'session' : 'turn' },
+        { permissions: {} })
+      }
       case 'item/tool/requestUserInput':
         return this.userInput(p)
       default: {
@@ -337,7 +353,7 @@ export class CodexAppServerTransport implements WebSessionTransport {
       description: shape.description,
       ...(shape.tool ? { tool: shape.tool } : {}),
       options,
-    }, (optionId) => ({ decision: optionId }))
+    }, (optionId) => ({ decision: optionId }), { decision: 'cancel' })
   }
 
   private async userInput(params: JsonObject): Promise<unknown> {
@@ -357,7 +373,7 @@ export class CodexAppServerTransport implements WebSessionTransport {
         title: stringOrNull(question['header']) ?? 'Codex has a question',
         description: stringOrNull(question['question']) ?? '',
         options: options.length > 0 ? options : [{ id: '', label: 'Continue without an answer', tone: 'neutral' }],
-      }, (optionId) => optionId)
+      }, (optionId) => optionId, '')
       answers[questionId] = { answers: typeof choice === 'string' && choice ? [choice] : [] }
     }
     return { answers }
@@ -366,11 +382,12 @@ export class CodexAppServerTransport implements WebSessionTransport {
   private enqueue(
     request: Omit<WebPermissionRequest, 'id' | 'createdAt'>,
     respondWith: (optionId: string) => unknown,
+    cancelWith: unknown,
   ): Promise<unknown> {
     this.requestSeq += 1
     const id = `codex-${this.requestSeq}`
     return new Promise<unknown>((resolve) => {
-      this.approvals.set(id, { answer: resolve, respondWith })
+      this.approvals.set(id, { answer: resolve, respondWith, cancelWith })
       this.ctx.state.addRequest({ ...request, id, createdAt: Date.now() })
     })
   }
@@ -379,7 +396,7 @@ export class CodexAppServerTransport implements WebSessionTransport {
     for (const [id, pending] of this.approvals) {
       this.approvals.delete(id)
       this.ctx.state.removeRequest(id)
-      pending.answer({ decision: 'cancel' })
+      pending.answer(pending.cancelWith)
     }
   }
 }
diff --git a/src/workspaces/web-session/pi-rpc-transport.ts b/src/workspaces/web-session/pi-rpc-transport.ts
index 127ec2e29b..40aa922f30 100644
--- a/src/workspaces/web-session/pi-rpc-transport.ts
+++ b/src/workspaces/web-session/pi-rpc-transport.ts
@@ -40,7 +40,16 @@ export class PiRpcTransport implements WebSessionTransport {
     if (trimmed.length > MAX_PROMPT_CHARS) throw new Error(`prompt exceeds ${MAX_PROMPT_CHARS} characters`)
     this.ctx.state.error = null
     this.ctx.state.setPhase('working')
-    await this.request('prompt', { message: trimmed })
+    try {
+      await this.request('prompt', { message: trimmed })
+    } catch (error) {
+      // Pi rejects prompts synchronously for missing credentials or a bad
+      // model; the turn never started, so fall back to idle and keep the
+      // reason visible in the snapshot as well as in the thrown error.
+      this.ctx.state.error = error instanceof Error ? error.message : String(error)
+      this.ctx.state.setPhase(this.ctx.channel.closed ? 'failed' : 'idle')
+      throw error
+    }
     this.scheduleRefresh(50)
   }