fix(server): retain restart-safe images with async processing

Integrate current main while preserving stable attachment storage, async materialization, bounded decoding and atomic publication. Adapt the restart regression and private-storage tests to the asynchronous API and isolate all materialization tests from the real home.

packages/app/e2e/browser/agent-message-submission.spec.ts

@@ -18,7 +18,9 @@ import {
   expectComposerVisible,
   cancelAgent,
   composerLocator,
+  expectQueuedMessageButton,
   fillComposerDraft,
+  holdSendButton,
   sendDraftToQueue,
   startRunningMockAgent,
   submitMessage,
@@ -51,6 +53,7 @@ import {
 import { expectInFlightForkAvailable } from "../support/helpers/assistant-fork";
 import {
   scrollTimelineToNewestLoadedEdge,
+  userScrollsTimelineToHistoryStart,
   scrollTimelineUntilOlderHistoryIsReachable,
 } from "../support/helpers/timeline-pagination";
 import {
@@ -984,7 +987,7 @@ test.describe("Agent message submission", () => {
     }
   });
 
-  test("keeps one prompt when its provider echo crosses the bounded tail", async ({
+  test("keeps one prompt when a delayed provider echo belongs to a large whole turn", async ({
     page,
   }, testInfo) => {
     const workspace = await seedWorkspace({
@@ -1001,8 +1004,10 @@ test.describe("Agent message submission", () => {
       await expectVisibleAgentSurfacesIdle(page);
       await page.reload();
 
-      await expect(submittedPrompt).toHaveCount(0);
-      await scrollTimelineUntilOlderHistoryIsReachable(page, prompt);
+      // The complete turn arrives on reload; scrolling mounts its oldest rows
+      // without requiring another page or an increase in total content height.
+      await userScrollsTimelineToHistoryStart(page);
+      await expect(submittedPrompt).toBeVisible();
       await expect(submittedPrompt).toHaveCount(1);
       await expect(submittedPrompt).toHaveAttribute("aria-busy", "false");
     } finally {
@@ -1290,6 +1295,49 @@ test.describe("Agent message submission", () => {
     }
   });
 
+  test("queues a draft by holding Send while a tap still steers", async ({ page }, testInfo) => {
+    test.setTimeout(120_000);
+    const gate = await gateNextAgentMessage(page);
+    const agent = await startRunningMockAgent(page, {
+      prefix: `hold-send-queue-${testInfo.workerIndex}-`,
+      model: "one-minute-stream",
+      prompt: "Keep this turn active while the user holds Send.",
+    });
+    try {
+      await expectComposerVisible(page);
+      await expectAgentReadyToInterrupt(page);
+
+      const queuedPrompt = "Queue this follow-up by holding Send.";
+      await test.step("holding Send queues the draft", async () => {
+        await fillComposerDraft(page, queuedPrompt);
+        await holdSendButton(page, "Send and steer");
+        await expectQueuedMessageButton(page);
+        await expectComposerDraft(page, "");
+        await expectAgentReadyToInterrupt(page);
+        await expect(
+          page.getByTestId("user-message").filter({ hasText: queuedPrompt }),
+        ).toHaveCount(0);
+      });
+
+      await test.step("tapping Send still steers", async () => {
+        const steeredPrompt = "Steer this turn with a tap.";
+        await fillComposerDraft(page, steeredPrompt);
+        await page.getByRole("button", { name: "Send and steer", exact: true }).click();
+
+        const request = await gate.waitForRequest();
+        expect(request.text).toBe(steeredPrompt);
+        expect(request.activeTurnBehavior).toBe("steer");
+        gate.accept();
+        await expect(
+          page.getByTestId("user-message").filter({ hasText: steeredPrompt }),
+        ).toHaveCount(1);
+        await expectQueuedMessageButton(page);
+      });
+    } finally {
+      await agent.cleanup();
+    }
+  });
+
   test("replays Claude-shaped steering inside one active turn", async ({ page }, testInfo) => {
     test.setTimeout(120_000);
     await replaySteeredSleepTurnInBrowser(page, testInfo, "claude");

packages/app/e2e/browser/composer-recall.spec.ts

@@ -0,0 +1,81 @@
+import { expect, test, type Page } from "../support/fixtures";
+import {
+  composerLocator,
+  expectComposerDraft,
+  expectComposerVisible,
+  submitMessage,
+  typeIntoFocusedComposer,
+} from "../support/helpers/composer";
+import { openAgentRoute, seedMockAgentWorkspace } from "../support/helpers/mock-agent";
+
+function userMessages(page: Page) {
+  return page.getByTestId("user-message");
+}
+
+async function sendAndWaitForMessage(page: Page, text: string, expectedCount: number) {
+  await submitMessage(page, text);
+  await expect(userMessages(page)).toHaveCount(expectedCount, { timeout: 30_000 });
+  await expectComposerDraft(page, "");
+}
+
+async function pressInComposer(page: Page, key: string) {
+  await composerLocator(page).press(key);
+}
+
+test.describe("Composer recall", () => {
+  test("Up and Down walk sent messages from an empty composer", async ({ page }) => {
+    const session = await seedMockAgentWorkspace({
+      repoPrefix: "composer-recall-",
+      title: "Composer recall",
+    });
+    try {
+      await openAgentRoute(page, session);
+      await expectComposerVisible(page);
+      await sendAndWaitForMessage(page, "fix the auth bug", 1);
+      await sendAndWaitForMessage(page, "add tests", 2);
+
+      await pressInComposer(page, "ArrowUp");
+      await expectComposerDraft(page, "add tests");
+      await pressInComposer(page, "ArrowUp");
+      await expectComposerDraft(page, "fix the auth bug");
+      await pressInComposer(page, "ArrowDown");
+      await expectComposerDraft(page, "add tests");
+      await pressInComposer(page, "ArrowDown");
+      await expectComposerDraft(page, "");
+
+      await pressInComposer(page, "ArrowUp");
+      await typeIntoFocusedComposer(page, " for login");
+      await expectComposerDraft(page, "add tests for login");
+      await pressInComposer(page, "ArrowUp");
+      await expectComposerDraft(page, "add tests for login");
+
+      await pressInComposer(page, "Enter");
+      await expect(userMessages(page)).toHaveCount(3, { timeout: 30_000 });
+      await expect(userMessages(page).last()).toContainText("add tests for login");
+    } finally {
+      await session.cleanup();
+    }
+  });
+
+  test("a recalled slash message does not open the command picker", async ({ page }) => {
+    const session = await seedMockAgentWorkspace({
+      repoPrefix: "composer-recall-slash-",
+      title: "Composer recall slash",
+    });
+    try {
+      await openAgentRoute(page, session);
+      await expectComposerVisible(page);
+      await sendAndWaitForMessage(page, "/tdd", 1);
+
+      const popover = page.getByTestId("composer-autocomplete-popover").filter({ visible: true });
+      await pressInComposer(page, "ArrowUp");
+      await expectComposerDraft(page, "/tdd");
+      await expect(popover).toHaveCount(0);
+
+      await typeIntoFocusedComposer(page, "x");
+      await expect(popover.first()).toBeVisible({ timeout: 30_000 });
+    } finally {
+      await session.cleanup();
+    }
+  });
+});

packages/app/e2e/browser/context-window-meter.spec.ts

@@ -42,6 +42,14 @@ const test = base.extend<{ agent: MockAgentSession }>({
   },
 });
 
+// The outer meter owns the accessible usage label; its SVG is decorative.
+async function expectDecorativeContextRing(meter: Locator): Promise<void> {
+  const ring = meter.locator("svg");
+  await expect(ring).toHaveAttribute("aria-hidden", "true");
+  await expect(ring).not.toHaveAttribute("accessibilityElementsHidden");
+  await expect(ring).not.toHaveAttribute("importantForAccessibility");
+}
+
 // Where the progress arc is painted, as its centroid relative to the ring's centre in pixels.
 // Reads the rendered pixels, so any rotation that does not reach the screen counts as none.
 async function progressArcCentroid(meter: Locator): Promise<{ x: number; y: number }> {
@@ -100,6 +108,7 @@ test.describe("context window meter", () => {
       const meter = page.getByTestId("context-window-meter");
       await expect(meter).toHaveAccessibleName(/25%/, { timeout: 30_000 });
 
+      await expectDecorativeContextRing(meter);
       const centroid = await progressArcCentroid(meter);
       expect(centroid.x).toBeGreaterThan(1);
       expect(centroid.y).toBeLessThan(-1);

packages/app/e2e/browser/diff-performance.spec.ts

@@ -1,6 +1,7 @@
 import { writeFile } from "node:fs/promises";
 import path from "node:path";
 import type { CDPSession, Locator, Page, TestInfo } from "@playwright/test";
+import { pullRequestCorpus } from "../../src/git/diff-document/benchmark-corpus";
 import { buildHostWorkspaceRoute } from "../../src/utils/host-routes";
 import { test, expect } from "../support/fixtures";
 import { getServerId } from "../support/helpers/server-id";
@@ -296,8 +297,187 @@ diffPerfDescribe("Diff canvas performance", () => {
       await repo.cleanup().catch(() => undefined);
     }
   });
+  test("toggling line wrap on a pull-request-sized diff", async ({ page }, testInfo) => {
+    test.setTimeout(300_000);
+    const corpus = await createPullRequestCorpusRepository();
+    const client = await connectSeedClient();
+
+    try {
+      const created = await client.createWorkspace({
+        source: { kind: "directory", path: corpus.repo.path },
+      });
+      if (!created.workspace) {
+        throw new Error(created.error ?? "Failed to create wrap performance workspace");
+      }
+
+      await configureUnwrappedUnifiedDiff(page);
+      await instrumentDiffLatency(page);
+      await page.setViewportSize({ width: 1400, height: 900 });
+      await page.goto(buildHostWorkspaceRoute(getServerId(), created.workspace.id));
+      await waitForWorkspaceTabsVisible(page);
+      const openStartedAt = performance.now();
+      await openChangesPanel(page, 90_000);
+      await expect(page.getByTestId("git-diff-canvas")).toBeVisible({ timeout: 30_000 });
+      const open = {
+        readyMs: Math.round(performance.now() - openStartedAt),
+        ...(await readDiffDocumentRenders(page)),
+      };
+
+      const toggles: WrapToggleMeasurement[] = [];
+      for (const name of [
+        "wrap on (cold)",
+        "wrap off (cold)",
+        "wrap on (warm)",
+        "wrap off (warm)",
+      ]) {
+        toggles.push(await measureWrapToggle(page, name));
+      }
+      const unwrappedScroll = await continuouslyScrollCanvas(page);
+      toggles.push(await measureWrapToggle(page, "wrap on (warm, scrolled)"));
+      const wrappedScroll = await continuouslyScrollCanvas(page);
+
+      const report = {
+        scenario: "wrap-toggle",
+        sourceFiles: corpus.fileCount,
+        sourceLines: corpus.lineCount,
+        open,
+        toggles,
+        scroll: {
+          unwrapped: summarizeScroll(unwrappedScroll),
+          wrapped: summarizeScroll(wrappedScroll),
+        },
+      };
+      await attachPerformanceReport(testInfo, report);
+      console.log(`[perf] Wrap toggle: ${JSON.stringify(report)}`);
+
+      const [wrapOn, wrapOff] = toggles;
+      expect(wrapOn!.scrollHeightAfter).toBeGreaterThan(wrapOn!.scrollHeightBefore);
+      expect(wrapOff!.scrollHeightAfter).toBe(wrapOn!.scrollHeightBefore);
+    } finally {
+      await client.close().catch(() => undefined);
+      await corpus.repo.cleanup().catch(() => undefined);
+    }
+  });
 });
 
+interface WrapToggleMeasurement {
+  name: string;
+  /** Pointer down on the toolbar button to two painted frames after the document resized. */
+  latencyMs: number;
+  scrollHeightBefore: number;
+  scrollHeightAfter: number;
+  longestTaskMs: number;
+  longTaskTotalMs: number;
+  diffDocumentCommits: number;
+  diffDocumentRenderMs: number;
+}
+
+interface LongTask {
+  startTime: number;
+  duration: number;
+}
+
+interface DiffLatencyScope {
+  __PASEO_RENDER_PROFILE_ENABLED__?: boolean;
+  __PASEO_RENDER_PROFILE__?: Array<{ id: string; actualDuration: number }>;
+  __PASEO_RESET_RENDER_PROFILE__?: () => void;
+  __PASEO_LONG_TASKS__?: LongTask[];
+  __PASEO_WRAP_TOGGLE_AT__?: number;
+}
+
+async function createPullRequestCorpusRepository() {
+  const files = pullRequestCorpus();
+  const repo = await createTempGitRepo("diff-wrap-perf-", {
+    files: files.map((file) => ({ path: file.path, content: "baseline\n" })),
+  });
+  for (const file of files) {
+    await writeFile(path.join(repo.path, file.path), `${file.lines.join("\n")}\n`);
+  }
+  return {
+    repo,
+    fileCount: files.length,
+    lineCount: files.reduce((count, file) => count + file.lines.length, 0),
+  };
+}
+
+async function instrumentDiffLatency(page: Page): Promise<void> {
+  await page.addInitScript(() => {
+    const scope = globalThis as typeof globalThis & DiffLatencyScope;
+    scope.__PASEO_RENDER_PROFILE_ENABLED__ = true;
+    scope.__PASEO_LONG_TASKS__ = [];
+    new PerformanceObserver((list) => {
+      for (const entry of list.getEntries()) {
+        scope.__PASEO_LONG_TASKS__?.push({ startTime: entry.startTime, duration: entry.duration });
+      }
+    }).observe({ type: "longtask", buffered: true });
+  });
+}
+
+async function readDiffDocumentRenders(
+  page: Page,
+): Promise<{ diffDocumentCommits: number; diffDocumentRenderMs: number }> {
+  return page.evaluate(() => {
+    const scope = globalThis as typeof globalThis & DiffLatencyScope;
+    const samples = (scope.__PASEO_RENDER_PROFILE__ ?? []).filter(
+      (sample) => sample.id === "DiffDocument",
+    );
+    return {
+      diffDocumentCommits: samples.length,
+      diffDocumentRenderMs: Math.round(
+        samples.reduce((total, sample) => total + sample.actualDuration, 0),
+      ),
+    };
+  });
+}
+
+async function measureWrapToggle(page: Page, name: string): Promise<WrapToggleMeasurement> {
+  const scroll = page.getByTestId("git-diff-scroll");
+  const scrollHeightBefore = await scroll.evaluate((element) => element.scrollHeight);
+  await page.evaluate(() => {
+    const scope = globalThis as typeof globalThis & DiffLatencyScope;
+    scope.__PASEO_RESET_RENDER_PROFILE__?.();
+    scope.__PASEO_LONG_TASKS__ = [];
+    scope.__PASEO_WRAP_TOGGLE_AT__ = undefined;
+    document.addEventListener(
+      "pointerdown",
+      () => {
+        scope.__PASEO_WRAP_TOGGLE_AT__ = performance.now();
+      },
+      { capture: true, once: true },
+    );
+  });
+  await page.getByTestId("changes-toggle-wrap-lines").click();
+  const measured = await scroll.evaluate(async (element, before) => {
+    const scope = globalThis as typeof globalThis & DiffLatencyScope;
+    const deadline = performance.now() + 240_000;
+    while (element.scrollHeight === before && performance.now() < deadline) {
+      await new Promise((resolve) => setTimeout(resolve, 5));
+    }
+    await new Promise<void>((resolve) =>
+      requestAnimationFrame(() => requestAnimationFrame(() => resolve())),
+    );
+    const doneAt = performance.now();
+    // Long task entries are delivered after the task ends; give the observer a turn.
+    await new Promise((resolve) => setTimeout(resolve, 50));
+    const startedAt = scope.__PASEO_WRAP_TOGGLE_AT__ ?? doneAt;
+    const longTasks = (scope.__PASEO_LONG_TASKS__ ?? []).filter(
+      (task) => task.startTime + task.duration >= startedAt && task.startTime <= doneAt,
+    );
+    return {
+      latencyMs: Math.round(doneAt - startedAt),
+      scrollHeightAfter: element.scrollHeight,
+      longestTaskMs: Math.round(Math.max(0, ...longTasks.map((task) => task.duration))),
+      longTaskTotalMs: Math.round(longTasks.reduce((total, task) => total + task.duration, 0)),
+    };
+  }, scrollHeightBefore);
+  return { name, scrollHeightBefore, ...measured, ...(await readDiffDocumentRenders(page)) };
+}
+
+function summarizeScroll(report: Awaited<ReturnType<typeof continuouslyScrollCanvas>>) {
+  const { frameSignatures: _frameSignatures, ...summary } = report;
+  return summary;
+}
+
 async function measureAdditionalPerformanceScenario(
   page: Page,
   cdp: CDPSession,

packages/app/e2e/browser/owned-subscriptions-old-daemon.spec.ts

@@ -1,5 +1,4 @@
 import { randomUUID } from "node:crypto";
-import { submitMessage, expectComposerEditable } from "../support/helpers/composer";
 import {
   focusTerminalSurface,
   typeInTerminal,
@@ -12,13 +11,11 @@ import { startIsolatedHostDaemon } from "../support/helpers/isolated-host-daemon
 import type { MockAgentWorkspace } from "../support/helpers/mock-agent";
 import { seedWorkspace } from "../support/helpers/seed-client";
 import {
-  expectTimelinePromptVisible,
-  holdOlderHistoryPages,
   openAgentTimeline,
-  scrollThroughOlderHistoryPages,
+  expectTimelinePromptVisible,
 } from "../support/helpers/timeline-pagination";
 
-test("does not repeat an assistant block when the current app paginates a published 0.2.5 daemon", async ({
+test("loads history across browser reconnection while retaining old-daemon connections and terminals", async ({
   page,
 }) => {
   test.setTimeout(120_000);
@@ -58,22 +55,8 @@ test("does not repeat an assistant block when the current app paginates a publis
   };
 
   try {
-    for (let index = 0; index < 40; index += 1) {
-      await agent.client.sendAgentMessage(
-        agent.agentId,
-        `timeline-pagination-older-turn-${index}: emit 1 coalesced agent stream updates`,
-      );
-      await agent.client.waitForFinish(agent.agentId, 15_000);
-    }
-    await agent.client.sendAgentMessage(agent.agentId, "build a realistic long mock timeline");
-    await agent.client.waitForFinish(agent.agentId, 20_000);
-    for (let index = 0; index < 20; index += 1) {
-      await agent.client.sendAgentMessage(
-        agent.agentId,
-        `timeline-pagination-turn-${index}: emit 1 coalesced agent stream updates`,
-      );
-      await agent.client.waitForFinish(agent.agentId, 15_000);
-    }
+    await agent.client.sendAgentMessage(agent.agentId, "emit 1 coalesced agent stream updates");
+    await agent.client.waitForFinish(agent.agentId, 15_000);
 
     const host = buildSeededHost({
       serverId,
@@ -89,34 +72,15 @@ test("does not repeat an assistant block when the current app paginates a publis
       { seededHost: host, preferences: buildCreateAgentPreferences() },
     );
 
-    const history = await holdOlderHistoryPages(page, agent, daemon.port);
     await openAgentTimeline(page, agent, serverId);
-    await expectTimelinePromptVisible(
-      page,
-      "timeline-pagination-turn-19: emit 1 coalesced agent stream updates",
-    );
-    await scrollThroughOlderHistoryPages(page, 3, history);
-
-    history.expectRepeatedEntries();
-    await history.expectOwnedTextRendered("Now I have a clearer picture.");
+    await expectTimelinePromptVisible(page, "emit 1 coalesced agent stream updates");
     expect(observationSockets.size).toBe(1);
 
-    await test.step("send a live turn after reconnecting the old daemon", async () => {
-      await daemon.restart();
-      await expect.poll(() => observationSockets.size, { timeout: 30_000 }).toBe(2);
-      await expectComposerEditable(page);
-      await submitMessage(
-        page,
-        "compatibility-after-reconnect: emit 1 coalesced agent stream updates",
-      );
-      await expectTimelinePromptVisible(
-        page,
-        "compatibility-after-reconnect: emit 1 coalesced agent stream updates",
-      );
-      // The browser and the seed client reconnect independently after the restart.
-      await agent.client.connect();
-      await agent.client.waitForFinish(agent.agentId, 20_000);
-      await page.screenshot({ path: test.info().outputPath("old-daemon-live-reconnect.png") });
+    await test.step("reconnect the browser and reload the old daemon history", async () => {
+      observationSockets.clear();
+      await page.reload();
+      await expectTimelinePromptVisible(page, "emit 1 coalesced agent stream updates");
+      await expect.poll(() => observationSockets.size).toBe(1);
     });
 
     await test.step("open a terminal and receive its output", async () => {
@@ -130,7 +94,6 @@ test("does not repeat an assistant block when the current app paginates a publis
       await expect
         .poll(() => getTerminalBufferText(page), { timeout: 15_000 })
         .toContain("compatibility-terminal-output");
-      await page.screenshot({ path: test.info().outputPath("old-daemon-terminal.png") });
       await agent.client.killTerminal(terminalId);
     });
   } finally {

packages/app/e2e/browser/settings-host-page.spec.ts

@@ -1,3 +1,7 @@
+import { readFile, mkdir, rename, rm } from "node:fs/promises";
+import path from "node:path";
+import type { DaemonClient } from "@getpaseo/client/internal/daemon-client";
+import { connectDaemonClient } from "../support/helpers/daemon-client-loader";
 import { expect, test } from "../support/fixtures";
 import { gotoAppShell, openSettings } from "../support/helpers/app";
 import { getE2EDaemonPort } from "../support/helpers/daemon-port";
@@ -25,6 +29,8 @@ import {
   removeHostFromHostPage,
   addDirectHostFromSettings,
   expectHostOnlineWithoutError,
+  expectIdleAgentRelease,
+  setIdleAgentRelease,
 } from "../support/helpers/settings";
 
 test.describe("Settings host page", () => {
@@ -137,6 +143,100 @@ test.describe("Settings host page", () => {
     }
   });
 
+  test("idle agent release changes live on one host and stays saved without restarting", async ({
+    page,
+  }) => {
+    test.setTimeout(120_000);
+    const primaryServerId = getServerId();
+    const daemon = await startIsolatedHostDaemon("srv_e2e_idle_agent_release");
+    const client = await connectDaemonClient<DaemonClient>({
+      clientIdPrefix: "idle-release-settings",
+      port: daemon.port,
+    });
+    const originalPid = (await client.getDaemonStatus()).pid;
+    const expectLiveSavedSetting = async (enabled: boolean) => {
+      const saved = JSON.parse(await readFile(path.join(daemon.paseoHome, "config.json"), "utf8"));
+      expect(saved.agents.idleRuntimeCleanup).toBe(enabled);
+      expect((await client.getDaemonConfig()).config.idleRuntimeCleanup).toBe(enabled);
+      expect((await client.reloadDaemonConfig()).restartRequiredPaths).toEqual([]);
+      expect((await client.getDaemonStatus()).pid).toBe(originalPid);
+    };
+    const hosts = [
+      {
+        serverId: primaryServerId,
+        label: TEST_HOST_LABEL,
+        endpoint: `127.0.0.1:${getE2EDaemonPort()}`,
+      },
+      {
+        serverId: daemon.serverId,
+        label: "Idle release host",
+        endpoint: `127.0.0.1:${daemon.port}`,
+      },
+    ];
+    const openHostAgentsInFreshApp = async (serverId: string) => {
+      await seedSavedSettingsHosts(page, hosts);
+      await page.reload();
+      await openSettings(page);
+      await selectSettingsHost(page, serverId);
+      await openHostSection(page, serverId, "agents");
+    };
+    try {
+      await test.step("idle agent release starts on and turns off", async () => {
+        await openHostAgentsInFreshApp(daemon.serverId);
+        await expectIdleAgentRelease(page, true);
+        await setIdleAgentRelease(page, false);
+        await expectLiveSavedSetting(false);
+      });
+
+      await test.step("a fresh app reads the saved setting from the same running host", async () => {
+        await openHostAgentsInFreshApp(daemon.serverId);
+        await expectIdleAgentRelease(page, false);
+        await expectLiveSavedSetting(false);
+        await setIdleAgentRelease(page, true);
+        await expectLiveSavedSetting(true);
+        await setIdleAgentRelease(page, false);
+      });
+
+      await test.step("other hosts keep their own setting", async () => {
+        await selectSettingsHost(page, primaryServerId);
+        await openHostSection(page, primaryServerId, "agents");
+        await expectIdleAgentRelease(page, true);
+        await expectLiveSavedSetting(false);
+      });
+    } finally {
+      await client.close();
+      await daemon.close();
+    }
+  });
+
+  test("a failed idle release save stays visible and retry applies it live", async ({ page }) => {
+    const daemon = await startIsolatedHostDaemon("srv_e2e_idle_release_failure");
+    const configPath = path.join(daemon.paseoHome, "config.json");
+    try {
+      await seedSavedSettingsHosts(page, [
+        { serverId: daemon.serverId, label: "Failure host", endpoint: `127.0.0.1:${daemon.port}` },
+      ]);
+      await page.reload();
+      await openSettings(page);
+      await openHostSection(page, daemon.serverId, "agents");
+      await expectIdleAgentRelease(page, true);
+      // A real filesystem failure, with the daemon and RPC path intact.
+      await rename(configPath, `${configPath}.saved`);
+      await mkdir(configPath);
+      await page.getByRole("switch", { name: "Release idle agents" }).click();
+      await expect(page.getByTestId("host-page-idle-runtime-cleanup-error")).toContainText(
+        "Failed to read",
+      );
+      await expectIdleAgentRelease(page, true);
+      await rm(configPath, { recursive: true });
+      await rename(`${configPath}.saved`, configPath);
+      await setIdleAgentRelease(page, false);
+      await expect(page.getByTestId("host-page-idle-runtime-cleanup-error")).toHaveCount(0);
+    } finally {
+      await daemon.close();
+    }
+  });
+
   test("navigating to /settings/hosts/[serverId] redirects to the connections section", async ({
     page,
   }) => {

packages/app/e2e/browser/settings-host-selection.spec.ts

@@ -6,7 +6,10 @@ import {
   addDirectHostFromSettings,
   clickSettingsBackToWorkspace,
   openSettingsHostSection,
+  openSettingsSection,
+  selectSettingsHost,
 } from "../support/helpers/settings";
+import { getServerId } from "../support/helpers/server-id";
 import { seedWorkspace } from "../support/helpers/seed-client";
 import { switchWorkspaceViaSidebar } from "../support/helpers/workspace-ui";
 
@@ -44,6 +47,14 @@ test.describe("Settings host selection", () => {
       await openSettings(page);
 
       await openSettingsHostSection(page, remoteDaemon.serverId, "connections");
+
+      await selectSettingsHost(page, getServerId());
+      await openSettingsSection(page, "appearance");
+      await openSettingsHostSection(page, getServerId(), "connections");
+
+      await clickSettingsBackToWorkspace(page);
+      await openSettings(page);
+      await openSettingsHostSection(page, remoteDaemon.serverId, "connections");
     } finally {
       await remoteWorkspace.cleanup().catch(() => undefined);
       await remoteDaemon.close().catch(() => undefined);

packages/app/e2e/browser/settings-navigation.spec.ts

@@ -10,6 +10,15 @@ import { gotoAppShell, openSettings } from "../support/helpers/app";
 import { getE2EDaemonPort } from "../support/helpers/daemon-port";
 import {
   closeCompactSettings,
+  scrollSettingsSidebarToEnd,
+  revealSettingsSidebarSection,
+  expectSettingsSidebarScrollSettled,
+  scrollSettingsSidebarUp,
+  changeSettingsInterfaceFontSize,
+  selectSettingsHostSectionsRapidly,
+  expectSettingsSidebarScrollOffset,
+  scrollSettingsDetailDown,
+  expectSettingsDetailScrollOffset,
   openSettingsSection,
   expectSettingsHeader,
   openAddHostFlow,
@@ -54,6 +63,98 @@ async function openWorkspace(
   await expect(page.getByTestId("menu-button")).toBeVisible();
 }
 
+test.describe("Settings sidebar scroll position", () => {
+  test.use({ viewport: { width: 1000, height: 500 } });
+
+  test("clamps after resizing and starts a fresh visit at the top", async ({ page }) => {
+    await gotoAppShell(page);
+    await openSettings(page);
+    await scrollSettingsSidebarToEnd(page);
+    await page.setViewportSize({ width: 1000, height: 1100 });
+    await expectSettingsSidebarScrollOffset(page, 0);
+    await page.setViewportSize({ width: 1000, height: 500 });
+    await openSettingsSection(page, "appearance");
+    await expectSettingsSidebarScrollOffset(page, 0);
+    await scrollSettingsSidebarToEnd(page);
+    await clickSettingsBackToWorkspace(page);
+    await openSettings(page);
+    await expectSettingsSidebarScrollOffset(page, 0);
+  });
+
+  test("keeps the sidebar position through interface font changes", async ({ page }) => {
+    await gotoAppShell(page);
+    await openSettings(page);
+    await openSettingsSection(page, "appearance");
+    const offset = await scrollSettingsSidebarToEnd(page);
+    await changeSettingsInterfaceFontSize(page, 20);
+    await expectSettingsSidebarScrollOffset(page, offset);
+    await openSettingsHostSection(page, getServerId(), "providers");
+    await expectSettingsSidebarScrollOffset(page, offset);
+  });
+
+  test("scrolls the sidebar and detail pane independently", async ({ page }) => {
+    await gotoAppShell(page);
+    await openSettings(page);
+    const sidebarOffset = await scrollSettingsSidebarToEnd(page);
+    await openSettingsHostSection(page, getServerId(), "providers");
+    await expect(page.getByTestId("host-page-providers-card")).toBeVisible();
+    const detailOffset = await scrollSettingsDetailDown(page);
+    await expectSettingsSidebarScrollOffset(page, sidebarOffset);
+
+    await scrollSettingsSidebarUp(page, 60);
+    await expectSettingsSidebarScrollOffset(page, sidebarOffset - 60);
+    await expectSettingsDetailScrollOffset(page, detailOffset);
+  });
+
+  test("keeps the sidebar position after rapid consecutive selections", async ({ page }) => {
+    await gotoAppShell(page);
+    await openSettings(page);
+
+    const scrollTop = await scrollSettingsSidebarToEnd(page);
+
+    await selectSettingsHostSectionsRapidly(page);
+    await expectSettingsSidebarScrollOffset(page, scrollTop);
+
+    await expectSettingsSidebarScrollSettled(page, scrollTop);
+  });
+
+  test("keeps the sidebar position when switching between app and host sections", async ({
+    page,
+  }) => {
+    await gotoAppShell(page);
+    await openSettings(page);
+
+    const hostScrollTop = await scrollSettingsSidebarToEnd(page);
+    await expect(page.getByTestId("settings-host-section-providers")).toBeInViewport();
+
+    for (const section of [
+      "providers",
+      "terminals",
+      "providers",
+      "terminals",
+      "providers",
+    ] as const) {
+      await openSettingsHostSection(page, getServerId(), section);
+      await expect(page.getByTestId("page-title")).toHaveText(
+        section === "providers" ? "Providers" : "Terminals",
+      );
+      await expectSettingsSidebarScrollOffset(page, hostScrollTop);
+    }
+
+    const sidebar = page.getByTestId("settings-sidebar");
+    const appScrollTop = await revealSettingsSidebarSection(page, "diagnostics");
+    await expect(sidebar.getByRole("button", { name: "About", exact: true })).toBeInViewport();
+
+    await openSettingsSection(page, "about");
+    await expectAboutContent(page);
+    await expectSettingsSidebarScrollOffset(page, appScrollTop);
+
+    await openSettingsSection(page, "diagnostics");
+    await expectDiagnosticsContent(page);
+    await expectSettingsSidebarScrollOffset(page, appScrollTop);
+  });
+});
+
 test.describe("Settings sidebar navigation", () => {
   test("opening Settings closes the composer model selector until it is opened again", async ({
     page,
@@ -147,6 +248,28 @@ test.describe("Settings sidebar navigation", () => {
     await expect(page).not.toHaveURL(/\/settings(\/|$)/);
   });
 
+  test("host choice survives app sections and host screen replacements", async ({ page }) => {
+    const primaryServerId = getServerId();
+    const secondaryServerId = "srv_e2e_settings_secondary";
+    const endpoint = `127.0.0.1:${getE2EDaemonPort()}`;
+    await seedSavedSettingsHosts(page, [
+      { serverId: primaryServerId, label: "First horse", endpoint },
+      { serverId: secondaryServerId, label: "Stable horse", endpoint },
+    ]);
+    await gotoAppShell(page);
+    await openSettings(page);
+    await selectSettingsHost(page, secondaryServerId);
+    await openSettingsHostSection(page, secondaryServerId, "connections");
+    await openSettingsSection(page, "appearance");
+    await expectSettingsHostPickerLabel(page, "Stable horse");
+    await openSettingsSection(page, "general");
+    await expectSettingsHostPickerLabel(page, "Stable horse");
+    await openSettingsHostSection(page, secondaryServerId, "connections");
+    await selectSettingsHost(page, primaryServerId);
+    await openSettingsSection(page, "about");
+    await expectSettingsHostPickerLabel(page, "First horse");
+  });
+
   test("/h/[serverId]/settings redirects to the host connections section", async ({ page }) => {
     await gotoAppShell(page);
     await verifyLegacyHostSettingsRedirect(page);
@@ -329,6 +452,15 @@ test.describe("Settings — compact master-detail", () => {
     await expectSettingsHostPickerLabel(page, secondaryHostLabel);
 
     await openSettingsHostSection(page, secondaryServerId, "connections");
+    await goBackInSettings(page);
+    await expectSettingsHostPickerLabel(page, secondaryHostLabel);
+
+    await openSettingsSection(page, "appearance");
+    await goBackInSettings(page);
+    await expectSettingsHostPickerLabel(page, secondaryHostLabel);
+    await openSettingsHostSection(page, secondaryServerId, "connections");
+    await goBackInSettings(page);
+    await expectSettingsHostPickerLabel(page, secondaryHostLabel);
   });
 
   test("removing the last active host returns to welcome after settings closes", async ({

packages/app/e2e/browser/settings-toggle-tab-regression.spec.ts

@@ -1,3 +1,4 @@
+import { openAgentRoute, seedMockAgentWorkspace } from "../support/helpers/mock-agent";
 import { buildHostAgentDetailRoute, buildHostWorkspaceRoute } from "@/utils/host-routes";
 import { expect, test } from "../support/fixtures";
 import { createMockIdleAgent, openWorkspaceWithAgents } from "../support/helpers/archive-tab";
@@ -274,3 +275,123 @@ test.describe("Settings toggle tab regression", () => {
     }
   });
 });
+
+async function selectSendingOption(
+  page: import("@playwright/test").Page,
+  setting: string,
+  option: string,
+) {
+  await page.getByRole("button", { name: new RegExp(`^${setting}:`) }).click();
+  await page.getByRole("menuitem", { name: option, exact: true }).click();
+  await expect(
+    page.getByRole("button", { name: `${setting}: ${option}`, exact: true }),
+  ).toBeVisible();
+}
+
+async function sendDraftWithShortcut(
+  page: import("@playwright/test").Page,
+  draft: string,
+  shortcut: string,
+) {
+  const composer = page.getByRole("textbox", { name: "Message agent..." });
+  await composer.fill(draft);
+  await composer.press(shortcut);
+  await expect(composer).toHaveValue("");
+  await expect(page.getByText(draft, { exact: true })).toBeVisible();
+}
+
+test("send shortcut selection persists and controls the composer", async ({ page }, testInfo) => {
+  test.setTimeout(180_000);
+  const workspace = await seedWorkspace({ repoPrefix: "send-shortcut-" });
+  const modifierLabel = process.platform === "darwin" ? "⌘" : "Ctrl";
+  try {
+    const agent = await createMockIdleAgent(workspace.client, {
+      cwd: workspace.repoPath,
+      workspaceId: workspace.workspaceId,
+      title: "Send shortcut",
+    });
+    await openAgentRouteAndExpectFocused({
+      page,
+      serverId: getServerId(),
+      workspaceId: workspace.workspaceId,
+      agentId: agent.id,
+    });
+    await openComposerTab(page, agent.id);
+    const composer = page.getByRole("textbox", { name: "Message agent..." });
+
+    await test.step("Enter sends by default", async () => {
+      await sendDraftWithShortcut(page, "Default Enter submission", "Enter");
+    });
+    await test.step("choose the explicit modifier shortcut and retain it after reload", async () => {
+      await pressSettingsToggleShortcut(page);
+      await expect(
+        page.getByRole("button", { name: "Send shortcut: Enter", exact: true }),
+      ).toBeVisible();
+      await page.getByRole("button", { name: "Send shortcut: Enter", exact: true }).click();
+      await expect(page.getByRole("menuitem")).toHaveText(["Enter", `${modifierLabel}+Enter`]);
+      // Let the menu opening animation settle for visual QA.
+      await page.waitForTimeout(300);
+      await page.screenshot({ path: testInfo.outputPath("send-shortcut-selector.png") });
+      await page.getByRole("menuitem", { name: `${modifierLabel}+Enter`, exact: true }).click();
+      await page.reload();
+      await expect(
+        page.getByRole("button", { name: `Send shortcut: ${modifierLabel}+Enter`, exact: true }),
+      ).toBeVisible();
+      await pressSettingsToggleShortcut(page);
+      await expect(composer).toBeVisible();
+    });
+    await test.step("Enter and Shift+Enter keep editing; modifier Enter sends", async () => {
+      await composer.fill("First line");
+      await composer.press("Enter");
+      await expect(composer).toHaveValue("First line\n");
+      await composer.press("Shift+Enter");
+      await expect(composer).toHaveValue("First line\n\n");
+      await sendDraftWithShortcut(page, "Sent with Control", "Control+Enter");
+      await sendDraftWithShortcut(page, "Sent with Command", "Meta+Enter");
+    });
+    await test.step("switch back to Enter without changing the default send behavior", async () => {
+      await pressSettingsToggleShortcut(page);
+      await selectSendingOption(page, "Send shortcut", "Enter");
+      await pressSettingsToggleShortcut(page);
+      await composer.fill("Shift still edits");
+      await composer.press("Shift+Enter");
+      await expect(composer).toHaveValue("Shift still edits\n");
+      await sendDraftWithShortcut(page, "Restored Enter submission", "Enter");
+    });
+  } finally {
+    await workspace.cleanup();
+  }
+});
+
+for (const behavior of ["Steer", "Interrupt", "Queue"] as const) {
+  test(`modifier send shortcut follows ${behavior} while an agent runs`, async ({ page }) => {
+    const agent = await seedMockAgentWorkspace({
+      repoPrefix: "running-send-shortcut-",
+      title: "Running send shortcut",
+      model: "one-minute-stream",
+    });
+    const modifierLabel = process.platform === "darwin" ? "⌘" : "Ctrl";
+    try {
+      await openAgentRoute(page, agent);
+      await expect(page.getByRole("textbox", { name: "Message agent..." })).toBeVisible();
+      await pressSettingsToggleShortcut(page);
+      await selectSendingOption(page, "Send shortcut", `${modifierLabel}+Enter`);
+      await selectSendingOption(page, "Default send", behavior);
+      await pressSettingsToggleShortcut(page);
+      await sendDraftWithShortcut(page, "Stay running while I write a follow-up", "Control+Enter");
+      await expect(page.getByRole("button", { name: "Stop agent", exact: true })).toBeVisible();
+      const composer = page.getByRole("textbox", { name: "Message agent..." });
+      await composer.fill("Follow-up");
+      await composer.press("Enter");
+      await expect(composer).toHaveValue("Follow-up\n");
+      await composer.press("Control+Enter");
+      await expect(composer).toHaveValue("");
+      await expect(page.getByText("Follow-up", { exact: true })).toBeVisible();
+      await expect(page.getByRole("button", { name: "Send queued message" })).toHaveCount(
+        behavior === "Queue" ? 1 : 0,
+      );
+    } finally {
+      await agent.cleanup();
+    }
+  });
+}

packages/app/e2e/browser/turn-collapse.spec.ts

@@ -1,8 +1,29 @@
-import type { Page } from "@playwright/test";
+import type { DaemonClient } from "@getpaseo/client/internal/daemon-client";
+import path from "node:path";
+import {
+  holdOlderHistoryPages,
+  userScrollsTimelineToHistoryStart,
+} from "../support/helpers/timeline-pagination";
+import { getActiveTabTestId } from "../support/helpers/launcher";
+import type { Page, Locator } from "@playwright/test";
 import { test, expect } from "../support/fixtures";
 import { expectComposerVisible } from "../support/helpers/composer";
 import { openAgentRoute, seedMockAgentWorkspace } from "../support/helpers/mock-agent";
 
+test.use({
+  e2eDaemonConfig: {
+    version: 1,
+    agents: {
+      providers: {
+        codex: {
+          enabled: true,
+          command: [process.execPath, path.resolve("e2e/fixtures/catalog-codex.mjs")],
+        },
+      },
+    },
+  },
+});
+
 type ChatDisplay = "full" | "collapseToolCalls" | "collapseTurns";
 
 async function useChatDisplay(page: Page, chatDisplay: ChatDisplay): Promise<void> {
@@ -19,7 +40,10 @@ async function seedAnsweredAgent(title: string) {
     initialPrompt: "Why does the chat stop following new output?",
   });
   await agent.client.waitForFinish(agent.agentId, 30_000);
-  await agent.client.sendAgentMessage(agent.agentId, "Make the fix and run the burst script.");
+  await agent.client.sendAgentMessage(
+    agent.agentId,
+    "Make the fix and run the burst script.\n" + "Keep the previous response visible.\n".repeat(40),
+  );
   await agent.client.waitForFinish(agent.agentId, 30_000);
   return agent;
 }
@@ -36,17 +60,84 @@ async function rowsBetweenLatestSummaryAndReply(page: Page): Promise<number> {
   });
 }
 
+async function groupedToolsInsideLatestTurn(page: Page): Promise<string[]> {
+  return page.evaluate(() => {
+    const rows = [...document.querySelectorAll("[data-message-id]")];
+    const start = rows.findLastIndex((row) => row.querySelector("[data-testid=turn-summary]"));
+    const end = rows.findLastIndex((row) => row.querySelector("[data-testid=assistant-message]"));
+    return rows
+      .slice(start + 1, end)
+      .flatMap((row) =>
+        [...row.querySelectorAll("[data-testid=tool-call-group]")].map(
+          (group) => group.textContent ?? "",
+        ),
+      );
+  });
+}
+
+async function expectCompactMessageToggle(prompt: Locator, label: string) {
+  const button = prompt.getByRole("button", { name: label, exact: true });
+  const text = prompt.getByText(label, { exact: true });
+  await expect
+    .poll(
+      async () => {
+        const control = (await button.boundingBox())!;
+        const glyphs = (await text.boundingBox())!;
+        return control.height - glyphs.height;
+      },
+      { message: "The inline toggle adds no vertical space beyond its text" },
+    )
+    .toBe(0);
+}
+
+async function expandAndCollapseLongPrompt(page: Page) {
+  const prompt = page.getByTestId("user-message").last();
+  const before = await prompt.boundingBox();
+  const text = prompt.locator('[data-message-text="true"]');
+  const messageLeft = (await text.boundingBox())!.x;
+  await expect
+    .poll(async () => (await prompt.getByText("Show more", { exact: true }).boundingBox())!.x)
+    .toBe(messageLeft);
+  await expectCompactMessageToggle(prompt, "Show more");
+  await prompt.getByRole("button", { name: "Show more", exact: true }).click();
+  await expect(prompt.getByRole("button", { name: "Show less", exact: true })).toBeVisible();
+  await expect
+    .poll(async () => (await prompt.getByText("Show less", { exact: true }).boundingBox())!.x)
+    .toBe(messageLeft);
+  await expect
+    .poll(async () => (await prompt.boundingBox())?.height ?? 0)
+    .toBeGreaterThan(before!.height);
+  await expectCompactMessageToggle(prompt, "Show less");
+  await prompt.getByRole("button", { name: "Show less", exact: true }).click();
+  await expect.poll(async () => (await prompt.boundingBox())?.height ?? 0).toBe(before!.height);
+  await prompt.scrollIntoViewIfNeeded();
+  const bounds = (await prompt.boundingBox())!;
+  const body = (await text.boundingBox())!;
+  await page.screenshot({
+    path: "/tmp/message-toggle-aligned.png",
+    clip: {
+      x: body.x - 16,
+      y: bounds.y,
+      width: bounds.x + bounds.width - body.x + 16,
+      height: bounds.height,
+    },
+  });
+}
+
 test.describe("Turn collapse", () => {
   test("folds each answered turn behind a summary line that opens it", async ({ page }) => {
     test.setTimeout(120_000);
+    await page.setViewportSize({ width: 1280, height: 1000 });
     await useChatDisplay(page, "collapseTurns");
     const agent = await seedAnsweredAgent("Turn collapse");
     try {
       await openAgentRoute(page, agent);
       await expectComposerVisible(page);
 
+      await expandAndCollapseLongPrompt(page);
+
       const summary = page.getByTestId("turn-summary").last().getByRole("button");
-      await expect(summary).toHaveText(/^Wrote \d+ messages?, edited 1 file/);
+      await expect(summary).toHaveText(/^Edited 1 file/);
       // Text chunks that stream back to back merge into one message, so the reply holds
       // at least the stream's last chunk.
       await expect(page.getByTestId("assistant-message").last()).toHaveText(
@@ -57,6 +148,9 @@ test.describe("Turn collapse", () => {
       await summary.click();
       await expect.poll(() => rowsBetweenLatestSummaryAndReply(page)).toBeGreaterThan(0);
       await expect(summary).toBeInViewport();
+      await summary.evaluate((element) => element.scrollIntoView({ block: "start" }));
+      await page.screenshot({ path: "/tmp/turn-rail-aligned.png" });
+      await expect.poll(() => groupedToolsInsideLatestTurn(page)).toEqual([]);
 
       await summary.click();
       await expect.poll(() => rowsBetweenLatestSummaryAndReply(page)).toBe(0);
@@ -65,3 +159,255 @@ test.describe("Turn collapse", () => {
     }
   });
 });
+
+test("received messages show their sender and open that agent", async ({ page }) => {
+  await page.addInitScript(() =>
+    localStorage.setItem("@paseo:app-settings", JSON.stringify({ theme: "dark" })),
+  );
+  const recipient = await seedMockAgentWorkspace({
+    repoPrefix: "sender-attribution-",
+    title: "Implementation",
+  });
+  try {
+    const sender = await recipient.client.createAgent({
+      provider: "codex",
+      cwd: recipient.cwd,
+      workspaceId: recipient.workspaceId,
+      title: "Reviewer",
+      model: "gpt-6.1-sol",
+      modeId: "full-access",
+    });
+    await recipient.client.sendAgentMessage(
+      recipient.agentId,
+      "I reviewed the turn-grouping changes. Heartbeats now keep their own timing footer, and the previous response stays visible.",
+      { sourceAgentId: sender.id },
+    );
+    await openAgentRoute(page, recipient);
+    await expectComposerVisible(page);
+    const attribution = page.getByRole("button", { name: "Sent by Reviewer", exact: true });
+    await expect(attribution).toBeVisible();
+    await expect(page.getByTestId("user-message").filter({ has: attribution })).toContainText(
+      "I reviewed the turn-grouping changes.",
+    );
+    const labelColor = await attribution
+      .getByText("Sent by Reviewer", { exact: true })
+      .evaluate((element) => getComputedStyle(element).color);
+    await expect(attribution.locator("svg")).toHaveCSS("fill", labelColor);
+    await attribution.scrollIntoViewIfNeeded();
+    await page.screenshot({ path: "/tmp/sender-attribution.png" });
+    await attribution.click();
+    await expect.poll(() => getActiveTabTestId(page)).toContain(sender.id);
+  } finally {
+    await recipient.cleanup();
+  }
+});
+
+async function seedWholeTurnHistory() {
+  const agent = await seedMockAgentWorkspace({
+    repoPrefix: "whole-turn-history-",
+    title: "Whole turns",
+    model: "e2e-fast-stream",
+  });
+  for (const prompt of [
+    ...Array.from(
+      { length: 25 },
+      (_, index) => `Short ${index}: emit 1 coalesced agent stream updates`,
+    ),
+    "Older long turn: emit 60 tool agent stream updates",
+    "Latest long turn: emit 120 tool agent stream updates",
+  ]) {
+    await agent.client.sendAgentMessage(agent.agentId, prompt);
+    await agent.client.waitForFinish(agent.agentId, 15_000);
+  }
+  return agent;
+}
+
+test("loads complete long turns and preserves expansion while revealing older history", async ({
+  page,
+}) => {
+  test.setTimeout(120_000);
+  await useChatDisplay(page, "collapseTurns");
+  const agent = await seedWholeTurnHistory();
+  try {
+    const history = await holdOlderHistoryPages(page, agent);
+    await openAgentRoute(page, agent);
+    await expectComposerVisible(page);
+    const latest = page
+      .getByTestId("turn-summary")
+      .getByRole("button", { name: "Ran 120 commands", exact: true });
+    await expect(latest).toBeVisible();
+    await expect.poll(() => rowsBetweenLatestSummaryAndReply(page)).toBe(0);
+    await latest.click();
+    await expect.poll(() => rowsBetweenLatestSummaryAndReply(page)).toBe(120);
+    await userScrollsTimelineToHistoryStart(page);
+    await history.expectRequestedPages(1);
+    history.releasePage(1);
+    await expect(
+      page
+        .getByTestId("turn-summary")
+        .getByRole("button", { name: "Ran 60 commands", exact: true }),
+    ).toBeVisible();
+    await expect.poll(() => rowsBetweenLatestSummaryAndReply(page)).toBe(120);
+    history.expectNoRepeatedEntries();
+    await latest.scrollIntoViewIfNeeded();
+    await latest.click();
+    await expect.poll(() => rowsBetweenLatestSummaryAndReply(page)).toBe(0);
+  } finally {
+    await agent.cleanup();
+  }
+});
+
+async function useThinkingDisplay(
+  page: Page,
+  autoExpandReasoning: boolean,
+  chatDisplay: ChatDisplay,
+) {
+  await page.addInitScript(
+    (settings) => {
+      localStorage.setItem(
+        "@paseo:app-settings",
+        JSON.stringify({
+          ...settings,
+          chatDisplay: sessionStorage.getItem("e2e-chat-display") ?? settings.chatDisplay,
+        }),
+      );
+    },
+    { autoExpandReasoning, chatDisplay },
+  );
+}
+
+for (const autoExpandReasoning of [false, true]) {
+  test(`reasoning follows Expand thinking (${autoExpandReasoning}) when opening its turn`, async ({
+    page,
+  }) => {
+    await page.setViewportSize({ width: 1280, height: 1000 });
+    await useThinkingDisplay(page, autoExpandReasoning, "collapseToolCalls");
+    const agent = await seedMockAgentWorkspace({
+      repoPrefix: "thinking-group-",
+      title: "Thinking with tools",
+      model: "ten-second-stream",
+      initialPrompt: "Inspect the scroll container",
+    });
+    try {
+      await agent.client.waitForFinish(agent.agentId, 30_000);
+      await openAgentRoute(page, agent);
+      await expectComposerVisible(page);
+      const reasoning = page
+        .getByText(/Need to find the scroll container, the layout effect/)
+        .filter({ visible: true })
+        .first();
+      await expectThinkingPresentation(page, autoExpandReasoning);
+      await switchToCollapsedTurns(page);
+      await expectComposerVisible(page);
+      const summary = page.getByTestId("turn-summary").last().getByRole("button");
+      await expect(summary).toBeVisible();
+      await expect(reasoning).toHaveCount(0);
+      await summary.click();
+      await expect(reasoning).toHaveCount(autoExpandReasoning ? 1 : 0);
+      await expect.poll(() => groupedToolsInsideLatestTurn(page)).toEqual([]);
+      await openOneToolOutput(page);
+      await summary.click();
+      await expect(reasoning).toHaveCount(0);
+    } finally {
+      await agent.cleanup();
+    }
+  });
+}
+
+async function openOneToolOutput(page: Page) {
+  const output = page.getByText(/\[burst\] tick 1 userIsAtBottom=true/).filter({ visible: true });
+  await expect(output).toHaveCount(0);
+  const command = page
+    .getByTestId("tool-call-badge")
+    .filter({ hasText: "node scripts/simulate-stream-burst.mjs" })
+    .first();
+  await command.getByRole("button").first().click();
+  await expect(output.first()).toBeVisible();
+  await command.getByRole("button").first().click();
+  await expect(output).toHaveCount(0);
+}
+
+async function expectThinkingPresentation(page: Page, autoExpandReasoning: boolean) {
+  const reasoning = page
+    .getByText(/Need to find the scroll container, the layout effect/)
+    .filter({ visible: true })
+    .first();
+  if (autoExpandReasoning) {
+    await expect(reasoning).toBeVisible();
+    await expect(page.getByTestId("tool-call-group").filter({ hasText: /thought/ })).toHaveCount(0);
+  } else {
+    await expect(reasoning).toHaveCount(0);
+    const group = page
+      .getByTestId("tool-call-group")
+      .filter({ hasText: /thought/, visible: true })
+      .last();
+    await expect(group).toContainText(/read 1 file/i);
+    await group.getByRole("button").first().click();
+    await expect(reasoning).toBeVisible();
+  }
+}
+
+async function switchToCollapsedTurns(page: Page) {
+  await page.evaluate(() => {
+    sessionStorage.setItem("e2e-chat-display", "collapseTurns");
+  });
+  await page.reload();
+}
+
+test("a scheduled heartbeat opens a separate turn without reopening the previous response", async ({
+  page,
+}) => {
+  test.setTimeout(90_000);
+  await useChatDisplay(page, "collapseTurns");
+  const agent = await seedMockAgentWorkspace({
+    repoPrefix: "heartbeat-turn-",
+    title: "Heartbeat turns",
+    model: "ten-second-stream",
+    initialPrompt: "Inspect the scroll container",
+  });
+  const schedules = agent.client as unknown as Pick<
+    DaemonClient,
+    "scheduleCreate" | "scheduleRunOnce" | "scheduleDelete"
+  >;
+  let scheduleId: string | undefined;
+  try {
+    await agent.client.waitForFinish(agent.agentId, 30_000);
+    await openAgentRoute(page, agent);
+    await expectComposerVisible(page);
+    const summaries = page.getByTestId("turn-summary");
+    await expect(summaries).toHaveCount(1);
+    const previousSummary = await summaries.first().innerText();
+    const previousReplyId = await page
+      .getByTestId("assistant-message")
+      .last()
+      .evaluate((element) => element.closest("[data-message-id]")!.getAttribute("data-message-id"));
+    const created = await schedules.scheduleCreate({
+      name: "Check the completed work",
+      prompt: "Inspect the scroll container again",
+      cadence: { type: "cron", expression: "0 0 1 1 *" },
+      target: { type: "self", agentId: agent.agentId },
+      runOnCreate: false,
+    });
+    expect(created.error).toBeNull();
+    scheduleId = created.schedule!.id;
+    const fired = await schedules.scheduleRunOnce({ id: scheduleId });
+    expect(fired.error).toBeNull();
+    await expect(
+      page.getByTestId("tool-call-badge").filter({ hasText: /^Heartbeat/ }),
+    ).toBeVisible();
+    await expect(summaries.first()).toHaveText(previousSummary);
+    const previousReply = page
+      .locator(`[data-message-id="${previousReplyId}"]`)
+      .getByTestId("assistant-message");
+    await expect(previousReply).toBeVisible();
+    await expect(previousReply).toContainText("(end of synthetic stream)");
+    await agent.client.waitForFinish(agent.agentId, 30_000);
+    await expect(summaries).toHaveCount(2);
+    await expect.poll(() => rowsBetweenLatestSummaryAndReply(page)).toBe(0);
+    await expect(page.getByRole("button", { name: /^Worked for/ })).toHaveCount(2);
+    await page.screenshot({ path: "/tmp/heartbeat-turn-footer.png" });
+  } finally {
+    if (scheduleId) await schedules.scheduleDelete({ id: scheduleId });
+    await agent.cleanup();
+  }
+});

packages/app/e2e/browser/voice-settings.spec.ts

@@ -0,0 +1,93 @@
+import { expect, test } from "../support/fixtures";
+import {
+  apiKeyInput,
+  baseUrlInput,
+  expectSheetClosed,
+  expectSpeechSiteSummary,
+  openSpeechSite,
+  openVoiceSettings,
+  providerOption,
+  readSpeechSite,
+  resetSpeechSite,
+  saveSpeechSite,
+  withUnwritableDaemonConfig,
+} from "../support/helpers/voice-settings";
+
+// E2E daemons pin every speech provider to OpenAI through env vars so no test starts a model
+// download. That makes the provider picker read-only here; the env key covers the key fallback.
+const ENV_API_KEY = "sk-e2e-env-fallback";
+const SAVED_API_KEY = "sk-e2e-saved-key";
+const BASE_URL = "http://127.0.0.1:9/v1";
+
+test.use({ e2eDaemonEnvironment: { OPENAI_API_KEY: ENV_API_KEY } });
+
+test("configures an env-pinned OpenAI site and keeps the saved key on later saves", async ({
+  page,
+}) => {
+  try {
+    await openVoiceSettings(page);
+    await expectSpeechSiteSummary(page, "Listening", "OpenAI · whisper-1");
+
+    const sheet = await test.step("the env var decides the provider", async () => {
+      const opened = await openSpeechSite(page, "Listening");
+      await expect(opened.getByText("Set by PASEO_VOICE_STT_PROVIDER")).toBeVisible();
+      await expect(providerOption(opened, "Local")).toBeDisabled();
+      await expect(providerOption(opened, "OpenAI")).toHaveAttribute("aria-selected", "true");
+      await expect(opened.getByText("Set by OPENAI_API_KEY")).toBeVisible();
+      return opened;
+    });
+
+    await test.step("a saved key and base URL win over the env key", async () => {
+      await apiKeyInput(sheet).fill(SAVED_API_KEY);
+      await baseUrlInput(sheet).fill(BASE_URL);
+      await saveSpeechSite(sheet);
+      await expectSheetClosed(page);
+      await expect
+        .poll(() => readSpeechSite("voiceMode.stt"))
+        .toMatchObject({ provider: "openai", hasApiKey: true, baseUrl: BASE_URL });
+    });
+
+    await test.step("reopening shows the key as saved without revealing it", async () => {
+      const reopened = await openSpeechSite(page, "Listening");
+      await expect(apiKeyInput(reopened)).toHaveValue("");
+      await expect(apiKeyInput(reopened)).toHaveAttribute("placeholder", "Saved");
+      await expect(reopened.getByText("Set by OPENAI_API_KEY")).toHaveCount(0);
+      await expect(baseUrlInput(reopened)).toHaveValue(BASE_URL);
+      await expect(reopened.getByRole("button", { name: "Save", exact: true })).toBeDisabled();
+    });
+
+    await test.step("clearing the base URL keeps the saved key", async () => {
+      const sheetAgain = page.getByRole("dialog");
+      await baseUrlInput(sheetAgain).fill("");
+      await saveSpeechSite(sheetAgain);
+      await expectSheetClosed(page);
+      const site = await readSpeechSite("voiceMode.stt");
+      expect(site).toMatchObject({ provider: "openai", hasApiKey: true });
+      expect(site).not.toHaveProperty("baseUrl");
+    });
+  } finally {
+    await resetSpeechSite("voiceMode.stt");
+  }
+});
+
+test("a failed save keeps the sheet open with the user's input", async ({ page }) => {
+  try {
+    await openVoiceSettings(page);
+    const sheet = await openSpeechSite(page, "Speaking");
+    await baseUrlInput(sheet).fill(BASE_URL);
+
+    await withUnwritableDaemonConfig(async () => {
+      await saveSpeechSite(sheet);
+      await expect(page.getByText(/^Unable to update voice settings: /)).toBeVisible();
+    });
+
+    await expect(baseUrlInput(sheet)).toHaveValue(BASE_URL);
+    await saveSpeechSite(sheet);
+    await expectSheetClosed(page);
+    await expect
+      .poll(() => readSpeechSite("voiceMode.tts"))
+      .toMatchObject({ provider: "openai", baseUrl: BASE_URL });
+  } finally {
+    await resetSpeechSite("voiceMode.tts");
+  }
+});

packages/app/e2e/browser/workspace-navigation-regression.spec.ts

@@ -11,7 +11,10 @@ import {
   expectWorkspaceTabVisible,
   openWorkspaceWithAgents,
 } from "../support/helpers/archive-tab";
-import { expectAgentAbsentFromWorkspaceLayout } from "../support/helpers/workspace-layout";
+import {
+  expectAgentAbsentFromWorkspaceLayout,
+  seedForeignPinnedAgentTab,
+} from "../support/helpers/workspace-layout";
 import { clickNewChat } from "../support/helpers/launcher";
 import { expectComposerVisible } from "../support/helpers/composer";
 import { daemonWsRoutePattern } from "../support/helpers/daemon-port";
@@ -105,6 +108,83 @@ async function openWorkspaceTabUrl(page: Page, route: string): Promise<void> {
 test.describe("Workspace navigation regression", () => {
   test.describe.configure({ timeout: 240_000 });
 
+  test("removes a foreign pinned agent when restoring a saved workspace layout", async ({
+    page,
+  }, testInfo) => {
+    const serverId = getServerId();
+    const firstWorkspace = await seedWorkspace({
+      repoPrefix: "workspace-owner-",
+      title: "Original workspace",
+    });
+    const secondWorkspace = await seedWorkspace({
+      repoPrefix: "workspace-restored-",
+      title: "Restored workspace",
+    });
+    try {
+      const firstAgent = await createMockIdleAgent(firstWorkspace.client, {
+        cwd: firstWorkspace.repoPath,
+        workspaceId: firstWorkspace.workspaceId,
+        title: "Original workspace agent",
+      });
+      const secondAgent = await createMockIdleAgent(secondWorkspace.client, {
+        cwd: secondWorkspace.repoPath,
+        workspaceId: secondWorkspace.workspaceId,
+        title: "Restored workspace agent",
+      });
+      await gotoAppShell(page);
+      await openWorkspaceWithAgents(page, [firstAgent, secondAgent]);
+      await seedForeignPinnedAgentTab(page, {
+        serverId,
+        workspaceId: secondWorkspace.workspaceId,
+        agentId: firstAgent.id,
+      });
+
+      await page.reload();
+      await waitForSidebarHydration(page);
+      await waitForWorkspaceTabsVisible(page);
+      await expectWorkspaceHeader(page, {
+        title: secondWorkspace.workspaceName,
+        subtitle: secondWorkspace.projectDisplayName,
+      });
+      await testInfo.attach("hydrated-workspace", {
+        body: await page.screenshot({ path: testInfo.outputPath("hydrated-workspace.png") }),
+        contentType: "image/png",
+      });
+      await expectAgentAbsentFromWorkspaceLayout(page, {
+        serverId,
+        workspaceId: secondWorkspace.workspaceId,
+        agentId: firstAgent.id,
+      });
+      await expectOnlyWorkspaceAgentTabsVisible(page, [secondAgent.id]);
+      await testInfo.attach("restored-workspace", {
+        body: await page.screenshot({ path: testInfo.outputPath("restored-workspace.png") }),
+        contentType: "image/png",
+      });
+
+      await switchWorkspaceViaSidebar({
+        page,
+        serverId,
+        workspaceId: firstWorkspace.workspaceId,
+      });
+      await waitForWorkspaceTabsVisible(page);
+      await expectOnlyWorkspaceAgentTabsVisible(page, [firstAgent.id]);
+      const agents = await firstWorkspace.client.fetchAgents();
+      expect(
+        agents.entries.find(({ agent }) => agent.id === firstAgent.id)?.agent.workspaceId,
+      ).toBe(firstWorkspace.workspaceId);
+      expect(
+        agents.entries.find(({ agent }) => agent.id === secondAgent.id)?.agent.workspaceId,
+      ).toBe(secondWorkspace.workspaceId);
+      await testInfo.attach("original-workspace", {
+        body: await page.screenshot({ path: testInfo.outputPath("original-workspace.png") }),
+        contentType: "image/png",
+      });
+    } finally {
+      await secondWorkspace.cleanup();
+      await firstWorkspace.cleanup();
+    }
+  });
+
   test("keeps an offline notification on the agent route until the host connects", async ({
     page,
   }) => {

packages/app/e2e/mobile/composer-keyboard/autocomplete-placement.mjs

@@ -28,7 +28,10 @@ function contains(outer, inner) {
  * while suggestions are open, so its callers read the composer from `reference`: a
  * snapshot in the same keyboard state with an empty input.
  */
-export function resolveAutocompletePlacement(snapshot, { expected, keyboardTop, reference }) {
+export function resolveAutocompletePlacement(
+  snapshot,
+  { expected, keyboardTop, reference, anchorGap },
+) {
   if (!snapshot.success || !snapshot.data?.nodes?.length) throw new Error("Empty device snapshot");
   const nodes = snapshot.data.nodes;
   const popover = findById(nodes, "composer-autocomplete-popover").rect;
@@ -40,6 +43,10 @@ export function resolveAutocompletePlacement(snapshot, { expected, keyboardTop,
   const keyboardY =
     keyboardTop ?? nodes.find((node) => node.type === "Keyboard" && node.rect)?.rect.y;
   const popoverBottom = bottomOf(popover);
+  const gap = composer.y - popoverBottom;
+  if (anchorGap !== undefined && Math.abs(gap - anchorGap) > 1) {
+    throw new Error(`Autocomplete lost its anchor gap: gap=${gap}, expected=${anchorGap}`);
+  }
   if (popoverBottom > composer.y + 1) {
     throw new Error(
       `Autocomplete overlaps the composer: popover bottom=${popoverBottom}, composer top=${composer.y}`,

packages/app/e2e/mobile/composer-keyboard/ios.mjs

@@ -14,7 +14,8 @@ const env = (name, fallback) => process.env[`PASEO_COMPOSER_KEYBOARD_${name}`] ?
 const serverId = env("SERVER_ID");
 const agentId = env("AGENT_ID");
 const workspaceId = env("WORKSPACE_ID");
-if (!serverId || !agentId || !workspaceId) {
+const scenario = env("SCENARIO", "all");
+if (!serverId || !workspaceId || (scenario === "all" && !agentId)) {
   throw new Error(
     "Set PASEO_COMPOSER_KEYBOARD_SERVER_ID, _AGENT_ID (an idle chat) and _WORKSPACE_ID (its workspace)",
   );
@@ -22,7 +23,12 @@ if (!serverId || !agentId || !workspaceId) {
 const draftId = env("DRAFT_ID", "composer-keyboard");
 const session = env("SESSION", "composer-keyboard-ios");
 const device = env("DEVICE", "iPhone 16 Pro");
-const artifactsDir = path.join(repoRoot, ".dev/agent-device-artifacts/composer-keyboard-ios");
+const udid = env("UDID");
+const deviceArgs = udid ? ["--udid", udid] : ["--device", device];
+const artifactsDir = env(
+  "ARTIFACTS_DIR",
+  path.join(repoRoot, ".dev/agent-device-artifacts/composer-keyboard-ios"),
+);
 const grownPrefix = "grown line one\ngrown line two\ngrown line three\n";
 // Partial queries with known best matches. `inserted` is the composer text after
 // tapping the best match.
@@ -35,7 +41,7 @@ const chatCommandCase = { text: "/mo", expected: "/mock", inserted: "/mock " };
 fs.mkdirSync(artifactsDir, { recursive: true });
 
 function ad(...args) {
-  return execFileSync("agent-device", [...args, "--session", session], {
+  return execFileSync("agent-device", [args[0], "--session", session, ...args.slice(1)], {
     encoding: "utf8",
     maxBuffer: 64 * 1024 * 1024,
   });
@@ -77,7 +83,7 @@ async function settledPlacement(name, keyboard) {
 }
 
 function assertPlacement(name, snap, expected) {
-  const placement = resolveAutocompletePlacement(snap, { expected });
+  const placement = resolveAutocompletePlacement(snap, { expected, anchorGap: 12 });
   process.stdout.write(
     `PASS ${name}: popover ${Math.round(placement.popover.y)}-${Math.round(
       placement.popover.y + placement.popover.height,
@@ -123,21 +129,34 @@ async function clearInput(name) {
   )?.rect;
   if (!deleteKey) throw new Error("Missing keyboard delete key");
   const length = composerText(keyboard).length;
-  ad(
-    "press",
-    String(Math.round(deleteKey.x + deleteKey.width / 2)),
-    String(Math.round(deleteKey.y + deleteKey.height / 2)),
-    "--count",
-    String(length + 2),
-    "--interval-ms",
-    "40",
-  );
+  for (let remaining = length + 2; remaining > 0; remaining -= 100) {
+    ad(
+      "press",
+      String(Math.round(deleteKey.x + deleteKey.width / 2)),
+      String(Math.round(deleteKey.y + deleteKey.height / 2)),
+      "--count",
+      String(Math.min(remaining, 100)),
+      "--interval-ms",
+      "40",
+    );
+  }
 }
 
 // The accessibility value drops a trailing space.
 const sameText = (actual, expected) => actual.trimEnd() === expected.trimEnd();
 
-async function runCase(host, kind, { text, expected, inserted }) {
+async function selectRow(name, row, inserted) {
+  ad("press", String(row.x), String(row.y));
+  const selected = await waitFor(`${name}-selected`, (snap) =>
+    sameText(composerText(snap), inserted),
+  );
+  if (!keyboardShown(selected)) throw new Error(`Selecting ${row.label} closed the keyboard`);
+  process.stdout.write(
+    `PASS ${name}: tapped ${row.label}, composer now ${JSON.stringify(inserted)}\n`,
+  );
+}
+
+async function runCase(host, kind, { text, expected, inserted, selectionKeyboard = "reopened" }) {
   const name = `${host}-${kind}`;
   await clearInput(name);
   await dismissKeyboard(snapshot(`${name}-empty`));
@@ -151,31 +170,32 @@ async function runCase(host, kind, { text, expected, inserted }) {
   await clearInput(`${name}-settled`);
   await waitFor(`${name}-settled-empty`, (snap) => composerText(snap) === "");
   ad("type", text);
-  assertPlacement(
+  const opened = assertPlacement(
     `${name} opened after keyboard settled`,
     await settledPlacement(`${name}-open`, true),
     expected,
   );
+  if (selectionKeyboard === "shown") {
+    await selectRow(name, opened, inserted);
+    return;
+  }
   await dismissKeyboard(snapshot(`${name}-before-close`));
-  assertPlacement(
+  const closed = assertPlacement(
     `${name} keyboard closed`,
     await settledPlacement(`${name}-closed`, false),
     expected,
   );
+  if (selectionKeyboard === "hidden") {
+    await selectRow(name, closed, inserted);
+    return;
+  }
   focusAtEnd(snapshot(`${name}-before-reopen`));
   const reopened = assertPlacement(
     `${name} keyboard opened under open suggestions`,
     await settledPlacement(`${name}-reopened`, true),
     expected,
   );
-  ad("press", String(reopened.x), String(reopened.y));
-  const selected = await waitFor(`${name}-selected`, (snap) =>
-    sameText(composerText(snap), inserted),
-  );
-  if (!keyboardShown(selected)) throw new Error(`Selecting ${expected} closed the keyboard`);
-  process.stdout.write(
-    `PASS ${name}: tapped ${expected}, composer now ${JSON.stringify(inserted)}\n`,
-  );
+  await selectRow(name, reopened, inserted);
 }
 
 // Drafts list commands for their selected provider, and a fresh install selects none.
@@ -216,13 +236,104 @@ async function runHost(host) {
   await dismissKeyboard(snapshot(`${host}-done`));
 }
 
+// These cases use the selected draft provider's real skills. Run on a 402pt-wide
+// iPhone for growth and a small phone (SE) for previews, with Codex selected.
+async function runLiveGrowth() {
+  await clearInput("live-growth");
+  ad("type", "Please do the following now /paseo");
+  const before = await settledPlacement("live-growth-before", true);
+  assertPlacement("before growth", before, "/paseo");
+  const inputHeight = (snap) =>
+    snap.data.nodes.find((node) => node.type === "TextView").rect.height;
+  ad("type", "--", "-committee");
+  const grown = await settledPlacement("live-growth-after", true);
+  if (inputHeight(grown) <= inputHeight(before))
+    throw new Error("Draft did not wrap onto a new line");
+  assertPlacement("live growth without reopening", grown, "/paseo-committee");
+  const deleteKey = grown.data.nodes.find(
+    (node) => node.type === "Key" && node.label === "delete",
+  ).rect;
+  ad(
+    "press",
+    String(deleteKey.x + deleteKey.width / 2),
+    String(deleteKey.y + deleteKey.height / 2),
+    "--count",
+    "10",
+    "--interval-ms",
+    "40",
+  );
+  const shrunk = await settledPlacement("live-growth-shrunk", true);
+  if (inputHeight(shrunk) !== inputHeight(before))
+    throw new Error("Draft did not shrink back to one line");
+  assertPlacement("live shrink without reopening", shrunk, "/paseo");
+  ad("type", "--", "-committ");
+  const partial = await settledPlacement("live-growth-partial", true);
+  if (!sameText(composerText(partial), "Please do the following now /paseo-committ")) {
+    throw new Error("Could not prepare a partial command for selection");
+  }
+  const row = assertPlacement("partial command after growth", partial, "/paseo-committee");
+  ad("press", String(row.x), String(row.y));
+  await waitFor("live-growth-selected", (snap) =>
+    sameText(composerText(snap), "Please do the following now /paseo-committee "),
+  );
+  await clearInput("live-growth-done");
+}
+
+async function runBoundedPreview() {
+  const prefix =
+    "Please do the following / testing inline selection.\n" +
+    "Line two with details.\nLine three with details.\nLine four with details.\n" +
+    "Line five with details.\nLine six with details.\nLine seven with details.\nPlease use ";
+  await runCase("preview", "long", {
+    text: `${prefix}/openai`,
+    expected: "/openai-docs",
+    inserted: `${prefix}/openai-docs `,
+    selectionKeyboard: "shown",
+  });
+  await runCase("preview", "long-hidden", {
+    text: `${prefix}/openai`,
+    expected: "/openai-docs",
+    inserted: `${prefix}/openai-docs `,
+    selectionKeyboard: "hidden",
+  });
+  await runCase("preview", "longest", {
+    text: `${prefix}/paseo-plug`,
+    expected: "/paseo-plugin",
+    inserted: `${prefix}/paseo-plugin `,
+    selectionKeyboard: "shown",
+  });
+  await runCase("preview", "short", {
+    text: `${prefix}/com`,
+    expected: "/commit",
+    inserted: `${prefix}/commit `,
+    selectionKeyboard: "shown",
+  });
+  await runCase("preview", "files", fileCase);
+}
+
+if (scenario !== "all") {
+  ad(
+    "open",
+    `paseo://h/${serverId}/workspace/${workspaceId}?open=draft%3A${draftId}`,
+    "--platform",
+    "ios",
+    ...deviceArgs,
+  );
+  await waitFor("draft", (snap) => Boolean(nodeById(snap, "message-input-root")), 60_000);
+  if (scenario === "growth") await runLiveGrowth();
+  else if (scenario === "previews") await runBoundedPreview();
+  else throw new Error(`Unknown scenario: ${scenario}`);
+  process.stdout.write(`Composer ${scenario} regression passed. Artifacts: ${artifactsDir}\n`);
+  process.exit(0);
+}
+
 const hosts = [
   ["chat", `paseo://h/${serverId}/agent/${agentId}`],
   ["workspace-draft", `paseo://h/${serverId}/workspace/${workspaceId}?open=draft%3A${draftId}`],
   ["new-workspace", `paseo://new?serverId=${serverId}`],
 ];
 for (const [host, url] of hosts) {
-  ad("open", url, "--platform", "ios", "--device", device);
+  ad("open", url, "--platform", "ios", ...deviceArgs);
   await waitFor(host, (snap) => Boolean(nodeById(snap, "message-input-root")), 60_000);
   await runHost(host);
 }

packages/app/e2e/mobile/markdown-formatting/README.md

@@ -0,0 +1,25 @@
+# Inline code formatting
+
+This fixture renders the production `MarkdownRenderer` with plain, bold, italic,
+combined emphasis, strikethrough and linked code, plus bold code in headings,
+lists and quotes. Toggle regular/compact text. Inline code uses the theme’s
+code-to-body size ratio at every heading level; fenced code keeps the code-size
+token. Bold and links preserve the resulting size. Check the glyphs, not the background height: native backgrounds use
+line metrics.
+
+Use a development client rebuilt from this checkout. Follow the temporary entry
+point and Metro workflow in [status-ring](../status-ring/README.md), importing
+`MarkdownFormattingRegression` from `./e2e/mobile/markdown-formatting/native`.
+Open the same Metro URL in a browser to compare web. Restore `index.ts` afterward.
+
+The package patch contains `InlineCodeFormattingTest`, which exercises actual
+Android spans in Robolectric native graphics mode, covering draw and measurement,
+span order, code inside paragraph/heading sizes, bold/italic composition, and
+links preserving code and emphasized prose fonts.
+It runs in the existing `test:android` CI job. To run only this regression locally,
+from `packages/app/android` after Expo prebuild:
+
+```sh
+./gradlew :react-native-enriched-markdown:testDebugUnitTest \
+  --tests '*InlineCodeFormattingTest' --no-daemon --max-workers=2
+```

packages/app/e2e/mobile/markdown-formatting/native.tsx

@@ -0,0 +1,52 @@
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { useCallback, useState } from "react";
+import { Button, ScrollView, Text } from "react-native";
+import { StyleSheet } from "react-native-unistyles";
+import { GestureHandlerRootView } from "react-native-gesture-handler";
+import { MarkdownRenderer } from "@/components/markdown/renderer";
+
+const styles = StyleSheet.create((theme) => ({
+  root: { flex: 1 },
+  scroll: { backgroundColor: theme.colors.surface0 },
+  content: { padding: 32, paddingTop: 60 },
+  title: { color: theme.colors.foreground },
+}));
+
+const queryClient = new QueryClient();
+
+const source = [
+  "Plain: `MMMMiiii`",
+  "Bold: **`MMMMiiii`**",
+  "Italic: *`MMMMiiii`*",
+  "Both: ***`MMMMiiii`***",
+  "Strike: ~~`MMMMiiii`~~",
+  "Link: [`MMMMiiii`](https://example.com)",
+  "# Heading **`MMMMiiii`**",
+  "## Heading *`MMMMiiii`*",
+  "### Heading [`MMMMiiii`](https://example.com)",
+  "#### Heading ~~`MMMMiiii`~~",
+  "##### Heading ***`MMMMiiii`***",
+  "###### Heading `MMMMiiii`",
+  "- List **`MMMMiiii`**",
+  "> Quote **`MMMMiiii`**",
+  "Normal **bold** and *italic* prose.",
+].join("\n\n");
+
+export default function MarkdownFormattingRegression() {
+  const [compact, setCompact] = useState(false);
+  const toggleCompact = useCallback(() => setCompact((value) => !value), []);
+  return (
+    <QueryClientProvider client={queryClient}>
+      <GestureHandlerRootView style={styles.root}>
+        <ScrollView style={styles.scroll} contentContainerStyle={styles.content}>
+          <Text style={styles.title}>Inline code formatting regression</Text>
+          <Button
+            title={compact ? "Use regular text" : "Use compact text"}
+            onPress={toggleCompact}
+          />
+          <MarkdownRenderer text={source} compact={compact} />
+        </ScrollView>
+      </GestureHandlerRootView>
+    </QueryClientProvider>
+  );
+}

packages/app/e2e/support/helpers/composer.ts

@@ -87,6 +87,14 @@ export async function sendDraftToQueue(page: Page): Promise<void> {
   await composerInput(page).press("Control+Enter");
 }
 
+/** Long-press the Send button: the composer takes the draft while the pointer is still down. */
+export async function holdSendButton(page: Page, label: string): Promise<void> {
+  await page.getByRole("button", { name: label, exact: true }).hover();
+  await page.mouse.down();
+  await expect(composerInput(page)).toHaveValue("", { timeout: 5_000 });
+  await page.mouse.up();
+}
+
 export async function expectQueuedMessageButton(page: Page): Promise<void> {
   await expect(page.getByRole("button", { name: "Send queued message now" })).toBeVisible({
     timeout: 10_000,

packages/app/e2e/support/helpers/custom-models.ts

@@ -19,6 +19,9 @@ export async function addCustomModel(page: Page, id: string): Promise<void> {
     .getByRole("button", { name: "Add", exact: true })
     .click();
   await expect(page.getByRole("button", { name: `Remove ${id}`, exact: true })).toHaveCount(1);
+  // Config updates before provider refresh finishes and dismisses the add sheet.
+  // Resizing or interacting with the model list must wait for that save to finish.
+  await expect(page.getByTestId("add-custom-model-sheet")).toBeHidden();
 }
 
 export async function removeCustomModel(page: Page, id: string): Promise<void> {

packages/app/e2e/support/helpers/seed-client.ts

@@ -149,7 +149,11 @@ export interface SeedDaemonClient {
     timeout?: number,
   ): Promise<{ status: string }>;
   cancelAgent(agentId: string): Promise<void>;
-  sendAgentMessage(agentId: string, text: string): Promise<void>;
+  sendAgentMessage(
+    agentId: string,
+    text: string,
+    options?: { sourceAgentId?: string },
+  ): Promise<void>;
   waitForFinish(
     agentId: string,
     timeout?: number,

packages/app/e2e/support/helpers/settings.ts

@@ -42,6 +42,7 @@ type HostSection =
   | "pair-device"
   | "agents"
   | "metadata"
+  | "voice"
   | "workspaces"
   | "providers"
   | "usage"
@@ -57,6 +58,92 @@ export async function openSettingsSection(page: Page, section: SettingsSection):
   await expectAppRoute(page, buildSettingsSectionRoute(section));
 }
 
+export async function revealSettingsSidebarSection(
+  page: Page,
+  section: SettingsSection,
+): Promise<number> {
+  await page
+    .getByRole("navigation", { name: "Settings" })
+    .getByRole("button", { name: SECTION_LABELS[section], exact: true })
+    .scrollIntoViewIfNeeded();
+  const offset = await page
+    .getByTestId("settings-sidebar-scroll-body")
+    .evaluate((node) => node.scrollTop);
+  expect(offset).toBeGreaterThan(0);
+  return offset;
+}
+
+export async function expectSettingsSidebarScrollSettled(
+  page: Page,
+  offset: number,
+): Promise<void> {
+  // RN Web emits its final scroll callback 100 ms after scrolling stops.
+  await page.waitForTimeout(200);
+  await expectSettingsSidebarScrollOffset(page, offset);
+}
+
+export async function selectSettingsHostSectionsRapidly(page: Page): Promise<void> {
+  for (let selection = 0; selection < 5; selection += 1) {
+    await page
+      .getByRole("navigation", { name: "Settings" })
+      .getByRole("button", { name: "Providers", exact: true })
+      .click();
+    await page
+      .getByRole("navigation", { name: "Settings" })
+      .getByRole("button", { name: "Terminals", exact: true })
+      .click();
+    await expectSettingsHeader(page, "Terminals");
+  }
+}
+
+export async function scrollSettingsSidebarUp(page: Page, pixels: number): Promise<void> {
+  await page.getByTestId("settings-sidebar-scroll-body").hover();
+  await page.mouse.wheel(0, -pixels);
+}
+
+export async function changeSettingsInterfaceFontSize(page: Page, size: number): Promise<void> {
+  const input = page.getByRole("textbox", { name: "Interface font size" });
+  await input.fill(String(size));
+  await input.press("Tab");
+  await expect(input).toHaveValue(String(size));
+}
+
+export async function scrollSettingsSidebarToEnd(page: Page): Promise<number> {
+  const scrollBody = page.locator('[data-testid="settings-sidebar-scroll-body"]:visible');
+  await scrollBody.hover();
+  await page.mouse.wheel(0, 2000);
+  await expect
+    .poll(() =>
+      scrollBody.evaluate((node) => node.scrollHeight - node.clientHeight - node.scrollTop),
+    )
+    .toBe(0);
+  const offset = await scrollBody.evaluate((node) => node.scrollTop);
+  expect(offset).toBeGreaterThan(0);
+  return offset;
+}
+
+export async function expectSettingsSidebarScrollOffset(page: Page, offset: number): Promise<void> {
+  const scrollBody = page.locator('[data-testid="settings-sidebar-scroll-body"]:visible');
+  await expect.poll(() => scrollBody.evaluate((node) => node.scrollTop)).toBe(offset);
+}
+
+export async function scrollSettingsDetailDown(page: Page): Promise<number> {
+  const scrollBody = page.getByTestId("settings-detail-scroll-body");
+  await expect
+    .poll(() => scrollBody.evaluate((node) => node.scrollHeight - node.clientHeight))
+    .toBeGreaterThan(0);
+  await scrollBody.hover();
+  await page.mouse.wheel(0, 1000);
+  await expect.poll(() => scrollBody.evaluate((node) => node.scrollTop)).toBeGreaterThan(0);
+  const offset = await scrollBody.evaluate((node) => node.scrollTop);
+  return offset;
+}
+
+export async function expectSettingsDetailScrollOffset(page: Page, offset: number): Promise<void> {
+  const scrollBody = page.getByTestId("settings-detail-scroll-body");
+  await expect.poll(() => scrollBody.evaluate((node) => node.scrollTop)).toBe(offset);
+}
+
 export async function openSettingsHost(page: Page, serverId: string): Promise<void> {
   // Host sections are now flat top-level rows under the Host group. Navigate by
   // clicking the Connections section row; the picker only matters when >1 host.
@@ -326,6 +413,25 @@ export async function expectHostInjectMcpCard(page: Page): Promise<void> {
   await expect(card.getByRole("switch", { name: "Inject Paseo tools" })).toBeVisible();
 }
 
+function idleAgentReleaseSwitch(page: Page) {
+  return page
+    .getByTestId("host-page-idle-runtime-cleanup-card")
+    .getByRole("switch", { name: "Release idle agents" });
+}
+
+export async function expectIdleAgentRelease(page: Page, enabled: boolean): Promise<void> {
+  const toggle = idleAgentReleaseSwitch(page);
+  await expect(toggle).toBeEnabled();
+  await expect(toggle).toHaveAttribute("aria-checked", String(enabled));
+}
+
+export async function setIdleAgentRelease(page: Page, enabled: boolean): Promise<void> {
+  const toggle = idleAgentReleaseSwitch(page);
+  await expect(toggle).toHaveAttribute("aria-checked", String(!enabled));
+  await toggle.click();
+  await expectIdleAgentRelease(page, enabled);
+}
+
 export async function openHostSection(
   page: Page,
   serverId: string,

packages/app/e2e/support/helpers/subagents.ts

@@ -188,7 +188,7 @@ export async function expectManagedSubagentArchived(
 }
 
 export async function archiveFinishedSubagents(page: Page): Promise<void> {
-  await page.getByRole("button", { name: "Archive finished subagents" }).click();
+  await page.getByRole("menuitem", { name: "Archive finished subagents" }).click();
 }
 
 export async function expectArchiveFinishedInProgress(
@@ -196,7 +196,7 @@ export async function expectArchiveFinishedInProgress(
   completed: number,
   total: number,
 ): Promise<void> {
-  await expect(page.getByRole("button", { name: "Archive finished subagents" })).toBeDisabled();
+  await expect(page.getByRole("menuitem", { name: "Archive finished subagents" })).toBeDisabled();
   await expect(page.getByText(`${completed}/${total}`, { exact: true })).toBeVisible();
 }
 
@@ -206,7 +206,7 @@ export async function expectArchiveFinishedRetry(
   total: number,
 ): Promise<void> {
   await expect(page.getByText(`Retry (${failed}/${total})`, { exact: true })).toBeVisible();
-  await expect(page.getByRole("button", { name: "Archive finished subagents" })).toBeEnabled();
+  await expect(page.getByRole("menuitem", { name: "Archive finished subagents" })).toBeEnabled();
 }
 
 export async function holdManagedSubagentArchiveRequest(

packages/app/e2e/support/helpers/voice-settings.ts

@@ -0,0 +1,99 @@
+import { rename, mkdir, rmdir } from "node:fs/promises";
+import path from "node:path";
+import { expect, type Locator, type Page } from "@playwright/test";
+import { gotoAppShell, openSettings } from "./app";
+import { connectNewWorkspaceDaemonClient } from "./new-workspace";
+import { getServerId } from "./server-id";
+import { expectSettingsHeader, openHostSection, openSettingsHost } from "./settings";
+
+export type SpeechSiteLabel = "Speech-to-text" | "Listening" | "Speaking";
+type SpeechSiteId = "dictation.stt" | "voiceMode.stt" | "voiceMode.tts";
+
+export async function openVoiceSettings(page: Page): Promise<void> {
+  const serverId = getServerId();
+  await gotoAppShell(page);
+  await openSettings(page);
+  await openSettingsHost(page, serverId);
+  await openHostSection(page, serverId, "voice");
+  await expectSettingsHeader(page, "Voice");
+}
+
+function speechSiteRow(page: Page, label: SpeechSiteLabel): Locator {
+  return page.getByRole("button", { name: new RegExp(`^${label}, `) });
+}
+
+export async function expectSpeechSiteSummary(
+  page: Page,
+  label: SpeechSiteLabel,
+  summary: string,
+): Promise<void> {
+  await expect(speechSiteRow(page, label)).toHaveAccessibleName(`${label}, ${summary}`);
+}
+
+/** Opens the provider sheet for one use site and returns it. */
+export async function openSpeechSite(page: Page, label: SpeechSiteLabel): Promise<Locator> {
+  await speechSiteRow(page, label).click();
+  const sheet = page.getByRole("dialog");
+  await expect(sheet.getByText(label, { exact: true })).toBeVisible();
+  return sheet;
+}
+
+export function providerOption(sheet: Locator, provider: "Local" | "OpenAI"): Locator {
+  return sheet.getByRole("button", { name: provider, exact: true });
+}
+
+export function apiKeyInput(sheet: Locator): Locator {
+  return sheet.getByRole("textbox", { name: "API key" });
+}
+
+export function baseUrlInput(sheet: Locator): Locator {
+  return sheet.getByRole("textbox", { name: "Base URL" });
+}
+
+export async function saveSpeechSite(sheet: Locator): Promise<void> {
+  await sheet.getByRole("button", { name: "Save", exact: true }).click();
+}
+
+export async function expectSheetClosed(page: Page): Promise<void> {
+  await expect(page.getByRole("dialog")).toHaveCount(0);
+}
+
+/** The speech site as the daemon reports it; the API key itself never leaves the daemon. */
+export async function readSpeechSite(siteId: SpeechSiteId): Promise<Record<string, unknown>> {
+  const client = await connectNewWorkspaceDaemonClient({ ownProjects: false });
+  try {
+    const { config } = await client.getDaemonConfig();
+    const features = config.features as Record<string, Record<string, unknown>>;
+    const [feature, site] = siteId.split(".");
+    return features[feature][site] as Record<string, unknown>;
+  } finally {
+    await client.close().catch(() => undefined);
+  }
+}
+
+/** Puts a speech site back to the default provider so later tests start from a known state. */
+export async function resetSpeechSite(siteId: SpeechSiteId): Promise<void> {
+  const client = await connectNewWorkspaceDaemonClient({ ownProjects: false });
+  try {
+    const [feature, site] = siteId.split(".");
+    await client.patchDaemonConfig({ features: { [feature]: { [site]: { provider: "local" } } } });
+  } finally {
+    await client.close().catch(() => undefined);
+  }
+}
+
+/** Makes the daemon's config file unreadable for the duration of `run`. */
+export async function withUnwritableDaemonConfig(run: () => Promise<void>): Promise<void> {
+  const paseoHome = process.env.E2E_PASEO_HOME;
+  if (!paseoHome) throw new Error("E2E_PASEO_HOME is required to break the daemon config");
+  const configPath = path.join(paseoHome, "config.json");
+  const asidePath = `${configPath}.aside`;
+  await rename(configPath, asidePath);
+  await mkdir(configPath);
+  try {
+    await run();
+  } finally {
+    await rmdir(configPath);
+    await rename(asidePath, configPath);
+  }
+}

packages/app/e2e/support/helpers/workspace-layout.ts

@@ -1,12 +1,47 @@
 import { expect, type Page } from "@playwright/test";
 import { z } from "zod";
 import { WorkspaceLayoutPersistedStateSchema } from "../../../src/stores/workspace-layout-storage";
+import { openTabInLayoutFocused } from "../../../src/stores/workspace-layout-actions";
 import {
   buildWorkspaceTabPersistenceKey,
   type WorkspaceTab,
 } from "../../../src/workspace-tabs/model";
 import { getServerId } from "./server-id";
 
+export async function seedForeignPinnedAgentTab(
+  page: Page,
+  input: { serverId: string; workspaceId: string; agentId: string },
+): Promise<void> {
+  const raw = await page.evaluate(() => localStorage.getItem("workspace-layout-state"));
+  if (raw === null) throw new Error("Workspace layout was not persisted");
+  const stored = z
+    .object({ state: WorkspaceLayoutPersistedStateSchema, version: z.number().optional() })
+    .parse(JSON.parse(raw));
+  const key = buildWorkspaceTabPersistenceKey(input);
+  const layout = key ? stored.state.layoutByWorkspace[key] : null;
+  if (!key || !layout) throw new Error(`No persisted layout for workspace ${input.workspaceId}`);
+  const opened = openTabInLayoutFocused({
+    layout,
+    target: { kind: "agent", agentId: input.agentId },
+    now: 1,
+    placement: { mode: "focused" },
+    explorerSidebarPaneId: stored.state.explorerSidebarPaneIdByWorkspace?.[key] ?? null,
+  });
+  if (!opened) throw new Error("Failed to seed foreign agent tab");
+  stored.state = WorkspaceLayoutPersistedStateSchema.parse({
+    ...stored.state,
+    layoutByWorkspace: { ...stored.state.layoutByWorkspace, [key]: opened.layout },
+    pinnedAgentIdsByWorkspace: {
+      ...stored.state.pinnedAgentIdsByWorkspace,
+      [key]: [...(stored.state.pinnedAgentIdsByWorkspace?.[key] ?? []), input.agentId],
+    },
+  });
+  await page.evaluate(
+    (value) => localStorage.setItem("workspace-layout-state", value),
+    JSON.stringify(stored),
+  );
+}
+
 /** Seed the reported hidden Explorer-only layout with 2,250 saved agent draft tabs. */
 export async function seedCorruptedWorkspaceLayout(page: Page, workspaceId: string): Promise<void> {
   const raw = await page.evaluate(() => localStorage.getItem("workspace-layout-state"));

packages/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getpaseo/app",
-  "version": "0.13.0",
+  "version": "0.13.2",
   "private": true,
   "main": "index.ts",
   "scripts": {
@@ -40,7 +40,7 @@
     "dev:ios": "npm --prefix ../.. run build:client && cross-env APP_VARIANT=development expo run:ios",
     "build:apk": "npm --prefix ../.. run build:apk",
     "build:apk:arm64": "npm --prefix ../.. run build:apk:arm64",
-    "test:android": "expo prebuild --platform android --no-install && cd android && ./gradlew :paseo-native-trace:testReleaseUnitTest --no-daemon --max-workers=2 -Dorg.gradle.parallel=false"
+    "test:android": "expo prebuild --platform android --no-install && cd android && ./gradlew :paseo-native-trace:testReleaseUnitTest :react-native-enriched-markdown:testReleaseUnitTest --tests '*InlineCodeFormattingTest' --no-daemon --max-workers=2 -Dorg.gradle.parallel=false"
   },
   "dependencies": {
     "@codemirror/commands": "6.10.4",
@@ -76,8 +76,8 @@
     "@xterm/addon-search": "^0.17.0-beta.213",
     "@xterm/addon-unicode11": "^0.10.0-beta.213",
     "@xterm/addon-web-links": "^0.13.0-beta.213",
-    "@xterm/addon-webgl": "^0.20.0-beta.212",
-    "@xterm/xterm": "^6.1.0-beta.213",
+    "@xterm/addon-webgl": "0.20.0-beta.291",
+    "@xterm/xterm": "6.1.0-beta.292",
     "buffer": "^6.0.3",
     "expo": "~57.0.30",
     "expo-asset": "~57.0.20",
@@ -126,14 +126,14 @@
     "react-native-gesture-handler": "~2.32.0",
     "react-native-keyboard-controller": "1.21.12",
     "react-native-nitro-modules": "0.35.5",
-    "react-native-reanimated": "4.5.1",
+    "react-native-reanimated": "4.5.5",
     "react-native-safe-area-context": "~5.7.0",
     "react-native-screens": "~4.26.0",
     "react-native-svg": "15.15.4",
     "react-native-unistyles": "^3.2.4",
     "react-native-web": "~0.21.0",
     "react-native-webview": "13.16.1",
-    "react-native-worklets": "0.10.1",
+    "react-native-worklets": "0.10.4",
     "tiny-invariant": "^1.3.3",
     "turndown": "^7.2.4",
     "turndown-plugin-gfm": "^1.0.2",
@@ -198,6 +198,14 @@
     ],
     "enableVideo": false
   },
+  "expo": {
+    "install": {
+      "exclude": [
+        "react-native-reanimated",
+        "react-native-worklets"
+      ]
+    }
+  },
   "reanimated": {
     "staticFeatureFlags": {
       "FORCE_REACT_RENDER_FOR_SETTLED_ANIMATIONS": false

packages/app/src/agent-stream/footer-spacing.test.ts

@@ -71,7 +71,7 @@ function layoutFor(input: { platform: "web" | "native"; isTurnActive: boolean })
       isTurnActive: input.isTurnActive,
       history: strategy.orderTail([userMessage("user"), assistant]),
       liveHead: [],
-      timingByAssistantId: timingFor(assistant.id),
+      timingByItemId: timingFor(assistant.id),
     }),
   };
 }

packages/app/src/agent-stream/history-window.ts

@@ -1,4 +1,5 @@
 import type { StreamItem } from "@/types/stream";
+import { continuesTurn } from "./turn-membership";
 
 export const DEFAULT_MOUNTED_RECENT_STREAM_ITEMS = 20;
 
@@ -32,7 +33,7 @@ export function findMountedWindowStart(input: {
   }
 
   let startIndex = Math.max(items.length - minMountedCount, 0);
-  while (startIndex > 0 && items[startIndex]?.kind !== "user_message") {
+  while (startIndex > 0 && continuesTurn(items[startIndex - 1], items[startIndex])) {
     startIndex -= 1;
   }
   return startIndex;

packages/app/src/agent-stream/layout.test.ts

@@ -104,7 +104,7 @@ function layoutFor(input: {
       strategy,
       streamHead: input.head ?? [],
     }),
-    timingByAssistantId: timingFor(...(input.timingIds ?? [])),
+    timingByItemId: timingFor(...(input.timingIds ?? [])),
   });
 }
 
@@ -148,7 +148,7 @@ function findLayoutItem(layout: StreamLayout, id: string): StreamLayoutItem {
 }
 
 describe("layoutStream", () => {
-  it("places one response footer after an adjacent tagged tool-only turn", () => {
+  it("keeps separate footers for an assistant turn and an adjacent tool-only turn", () => {
     const priorAssistant = assistantMessage("prior", 1, undefined, "turn-1");
     const nextTool = toolCall("next-tool", 2, "turn-2");
     const layout = layoutFor({
@@ -157,8 +157,8 @@ describe("layoutStream", () => {
       timingIds: [priorAssistant.id],
     });
 
-    expect(layout.auxiliaryTurnFooter?.itemId).toBe(priorAssistant.id);
-    expect(footerOwners(layout)).toEqual([priorAssistant.id]);
+    expect(layout.auxiliaryTurnFooter?.itemId).toBe(nextTool.id);
+    expect(footerOwners(layout)).toEqual([priorAssistant.id, nextTool.id]);
   });
 
   it("recomputes cached history layout when only the live boundary turn changes", () => {
@@ -171,7 +171,7 @@ describe("layoutStream", () => {
       isTurnActive: true,
       history,
       liveHead,
-      timingByAssistantId: timingFor(priorAssistant.id),
+      timingByItemId: timingFor(priorAssistant.id),
     });
 
     liveHead[0] = { ...liveHead[0]!, turnId: "turn-2" };
@@ -180,7 +180,7 @@ describe("layoutStream", () => {
       isTurnActive: true,
       history,
       liveHead,
-      timingByAssistantId: timingFor(priorAssistant.id),
+      timingByItemId: timingFor(priorAssistant.id),
     });
 
     expect(footerOwners(first)).toEqual([]);

packages/app/src/agent-stream/layout.ts

@@ -39,13 +39,13 @@ export interface StreamLayoutInput {
   isTurnActive: boolean;
   history: StreamItem[];
   liveHead: StreamItem[];
-  timingByAssistantId: Map<string, TurnTiming>;
+  timingByItemId: Map<string, TurnTiming>;
 }
 
 interface LayoutSegmentInput {
   strategy: StreamStrategy;
   items: StreamItem[];
-  timingByAssistantId: Map<string, TurnTiming>;
+  timingByItemId: Map<string, TurnTiming>;
   auxiliaryTurnFooter: TurnFooterHost | null;
   hasAuxiliaryFooter: boolean;
   frameOrder: StreamFrameChildOrder;
@@ -57,8 +57,8 @@ interface LayoutSegmentInput {
   phase: "streaming" | "complete";
 }
 
-interface AssistantFooterSource {
-  item: Extract<StreamItem, { kind: "assistant_message" }>;
+interface TurnFooterSource {
+  item: StreamItem;
   items: StreamItem[];
   index: number;
 }
@@ -67,23 +67,26 @@ function createTurnFooterHost(input: {
   item: StreamItem;
   items: StreamItem[];
   index: number;
-  timingByAssistantId: Map<string, TurnTiming>;
+  timingByItemId: Map<string, TurnTiming>;
 }): TurnFooterHost {
   return {
     itemId: input.item.id,
     items: input.items,
-    timing: input.timingByAssistantId.get(input.item.id),
+    timing: input.timingByItemId.get(input.item.id),
     startIndex: input.index,
   };
 }
 
-function findLatestAssistantInResponse(input: {
+function findTurnFooterSource(input: {
   strategy: StreamStrategy;
   items: StreamItem[];
   startIndex: number;
   boundaryAboveItems?: StreamItem[] | null;
   boundaryAboveIndex?: number | null;
-}): AssistantFooterSource | null {
+}): TurnFooterSource | null {
+  const last = input.items[input.startIndex];
+  const toolFallback: TurnFooterSource | null =
+    last?.kind === "tool_call" ? { item: last, items: input.items, index: input.startIndex } : null;
   let items = input.items;
   let index = input.startIndex;
   let canCrossBoundary = true;
@@ -97,7 +100,7 @@ function findLatestAssistantInResponse(input: {
     ) {
       const item = items[index];
       if (!item || (laterItem && !continuesResponse(item, laterItem))) {
-        return null;
+        return toolFallback;
       }
       if (item.kind === "assistant_message") {
         return { item, items, index };
@@ -111,7 +114,7 @@ function findLatestAssistantInResponse(input: {
       input.boundaryAboveIndex === null ||
       input.boundaryAboveIndex === undefined
     ) {
-      return null;
+      return toolFallback;
     }
 
     items = input.boundaryAboveItems;
@@ -131,20 +134,20 @@ function resolveAuxiliaryTurnFooter(input: StreamLayoutInput): TurnFooterHost |
     return null;
   }
 
-  const assistant = findLatestAssistantInResponse({
+  const source = findTurnFooterSource({
     strategy: input.strategy,
     items: footerItems,
     startIndex: latestIndex,
   });
-  if (!assistant) {
+  if (!source) {
     return null;
   }
 
   return createTurnFooterHost({
-    item: assistant.item,
-    items: assistant.items,
-    index: assistant.index,
-    timingByAssistantId: input.timingByAssistantId,
+    item: source.item,
+    items: source.items,
+    index: source.index,
+    timingByItemId: input.timingByItemId,
   });
 }
 
@@ -154,7 +157,7 @@ function resolveCompletedFooter(input: {
   index: number;
   item: StreamItem;
   belowItem: StreamItem | null;
-  timingByAssistantId: Map<string, TurnTiming>;
+  timingByItemId: Map<string, TurnTiming>;
   auxiliaryTurnFooter: TurnFooterHost | null;
   boundaryAboveItems: StreamItem[] | null;
   boundaryAboveIndex: number | null;
@@ -163,21 +166,21 @@ function resolveCompletedFooter(input: {
     return null;
   }
 
-  const assistant = findLatestAssistantInResponse({
+  const source = findTurnFooterSource({
     strategy: input.strategy,
     items: input.items,
     startIndex: input.index,
     boundaryAboveItems: input.boundaryAboveItems,
     boundaryAboveIndex: input.boundaryAboveIndex,
   });
-  if (!assistant || input.auxiliaryTurnFooter?.itemId === assistant.item.id) {
+  if (!source || input.auxiliaryTurnFooter?.itemId === source.item.id) {
     return null;
   }
   return createTurnFooterHost({
-    item: assistant.item,
-    items: assistant.items,
-    index: assistant.index,
-    timingByAssistantId: input.timingByAssistantId,
+    item: source.item,
+    items: source.items,
+    index: source.index,
+    timingByItemId: input.timingByItemId,
   });
 }
 
@@ -306,7 +309,7 @@ function layoutSegmentItem(
     index,
     item,
     belowItem,
-    timingByAssistantId: input.timingByAssistantId,
+    timingByItemId: input.timingByItemId,
     auxiliaryTurnFooter: input.auxiliaryTurnFooter,
     boundaryAboveItems: input.boundaryAboveItems,
     boundaryAboveIndex: input.boundaryAboveIndex,
@@ -375,7 +378,7 @@ export function layoutStream(input: StreamLayoutInput): StreamLayout {
       history = layoutSegment({
         strategy: input.strategy,
         items: input.history,
-        timingByAssistantId: input.timingByAssistantId,
+        timingByItemId: input.timingByItemId,
         auxiliaryTurnFooter,
         hasAuxiliaryFooter,
         frameOrder,
@@ -395,7 +398,7 @@ export function layoutStream(input: StreamLayoutInput): StreamLayout {
   const liveHead = layoutSegment({
     strategy: input.strategy,
     items: input.liveHead,
-    timingByAssistantId: input.timingByAssistantId,
+    timingByItemId: input.timingByItemId,
     auxiliaryTurnFooter,
     hasAuxiliaryFooter,
     frameOrder,

packages/app/src/agent-stream/model.test.ts

@@ -69,8 +69,8 @@ describe("buildAgentStreamRenderModel", () => {
       historyStart: 2,
     });
 
-    expect(model.turnTiming.byAssistantId.has("hidden-a")).toBe(false);
-    expect(model.turnTiming.byAssistantId.get("visible-a")).toEqual({
+    expect(model.turnTiming.byItemId.has("hidden-a")).toBe(false);
+    expect(model.turnTiming.byItemId.get("visible-a")).toEqual({
       completedAt: tail[3]?.timestamp,
       durationMs: 1000,
     });
@@ -184,7 +184,7 @@ describe("buildAgentStreamRenderModel", () => {
     });
 
     expect(model.turnTiming.runningStartedAt).toBe(tail[0]?.timestamp);
-    expect(model.turnTiming.byAssistantId.has("live-a")).toBe(false);
+    expect(model.turnTiming.byItemId.has("live-a")).toBe(false);
   });
 
   it("maps completed turn timing to assistant ids across committed history and live head", () => {
@@ -201,7 +201,7 @@ describe("buildAgentStreamRenderModel", () => {
     });
 
     expect(model.turnTiming.runningStartedAt).toBe(null);
-    expect(model.turnTiming.byAssistantId.get("live-a")).toEqual({
+    expect(model.turnTiming.byItemId.get("live-a")).toEqual({
       completedAt: head[0]?.timestamp,
       durationMs: 3000,
     });
@@ -220,7 +220,7 @@ describe("buildAgentStreamRenderModel", () => {
     });
 
     expect(model.segments.historyMounted.map((item) => item.id)).toEqual(["a1", "u1"]);
-    expect(model.turnTiming.byAssistantId.get("a1")).toEqual({
+    expect(model.turnTiming.byItemId.get("a1")).toEqual({
       completedAt: tail[1]?.timestamp,
       durationMs: 3000,
     });
@@ -238,7 +238,7 @@ describe("buildAgentStreamRenderModel", () => {
       isMobileBreakpoint: false,
     });
 
-    expect(model.turnTiming.byAssistantId.size).toBe(0);
+    expect(model.turnTiming.byItemId.size).toBe(0);
   });
 
   it.each(["web", "native"] as const)(
@@ -274,10 +274,10 @@ describe("buildAgentStreamRenderModel", () => {
 
       expect(second.history).toBe(first.history);
       expect(second.segments.historyMounted).toBe(first.segments.historyMounted);
-      expect(second.turnTiming.byAssistantId).toBe(first.turnTiming.byAssistantId);
+      expect(second.turnTiming.byItemId).toBe(first.turnTiming.byItemId);
       expect(first.history).toHaveLength(20);
-      expect(first.turnTiming.byAssistantId.has("a29")).toBe(false);
-      expect(first.turnTiming.byAssistantId.get("a38")).toEqual({
+      expect(first.turnTiming.byItemId.has("a29")).toBe(false);
+      expect(first.turnTiming.byItemId.get("a38")).toEqual({
         completedAt: tail[77]?.timestamp,
         durationMs: 1000,
       });

packages/app/src/agent-stream/presentation.test.ts

@@ -588,3 +588,129 @@ describe("timeline presentation", () => {
     expect(projectTimelineItems([source], () => [])).toEqual([]);
   });
 });
+
+it("opening a turn reveals individual calls rather than another tool group", () => {
+  const present = createStreamPresentation();
+  const timestamp = new Date();
+  const tail: StreamItem[] = [
+    { kind: "user_message", id: "prompt", text: "Work", timestamp },
+    toolCall("one", "Bash"),
+    toolCall("two", "Bash"),
+    { kind: "assistant_message", id: "reply", text: "Done", timestamp },
+  ];
+  const result = present({
+    ...presentationOptions,
+    transform: undefined,
+    tail,
+    head: [],
+    display: "collapseTurns",
+    isTurnActive: false,
+    expandedTurnHostIds: new Set(["prompt"]),
+  });
+  expect(result.tail.map((item) => item.id)).toEqual(tail.map((item) => item.id));
+  expect(result.groupsByHostId.size).toBe(0);
+});
+
+it("presents received agent messages as attributed bubbles with the original turn identity", () => {
+  const call = toolCall("received", "agent_message");
+  if (call.payload.source !== "agent") throw new Error("Expected agent tool");
+  call.turnId = "turn";
+  call.payload.data.agentMessage = {
+    event: "message",
+    sender: { id: "sender", title: "Reviewer" },
+    text: "Ready",
+  };
+  const result = createStreamPresentation()({
+    ...presentationOptions,
+    transform: undefined,
+    tail: [call],
+    head: [],
+  });
+  expect(result.tail[0]).toMatchObject({
+    kind: "user_message",
+    id: call.id,
+    turnId: "turn",
+    text: "Ready",
+    sender: { id: "sender", title: "Reviewer" },
+  });
+});
+
+it("does not reopen the previous turn while a new run waits for its first row", () => {
+  const timestamp = new Date();
+  const tail: StreamItem[] = [
+    { kind: "user_message", id: "prompt", text: "Work", timestamp },
+    toolCall("one", "Bash"),
+    { kind: "assistant_message", id: "reply", text: "Done", timestamp },
+  ];
+  for (const item of tail) item.turnId = "completed";
+  const result = createStreamPresentation()({
+    ...presentationOptions,
+    transform: undefined,
+    tail,
+    head: [],
+    display: "collapseTurns",
+    isTurnActive: true,
+    activeTurnId: "new",
+  });
+  expect(result.tail.map((item) => item.id)).toEqual(["prompt", "reply"]);
+});
+
+it("groups reasoning with tools unless Expand thinking is enabled, including setting changes", () => {
+  const present = createStreamPresentation();
+  const timestamp = new Date();
+  const thought: StreamItem = {
+    kind: "thought",
+    id: "thought",
+    text: "Consider this",
+    status: "ready",
+    timestamp,
+  };
+  const tail: StreamItem[] = [toolCall("one", "Bash"), thought, toolCall("two", "Bash")];
+  for (const item of tail) item.turnId = "run";
+  const input = {
+    ...presentationOptions,
+    transform: undefined,
+    tail,
+    head: [],
+    display: "collapseToolCalls" as const,
+    isTurnActive: false,
+  };
+  const grouped = present({ ...input, autoExpandReasoning: false });
+  expect(grouped.tail).toHaveLength(1);
+  expect(grouped.groupsByHostId.get("tool-one")?.run.calls).toEqual(tail);
+  const separate = present({ ...input, autoExpandReasoning: true });
+  expect(separate.tail.map((item) => item.id)).toEqual(["tool-one", "thought", "tool-two"]);
+  expect(separate.groupsByHostId.has("thought")).toBe(false);
+  const next = { ...thought, id: "next", turnId: "next-run" };
+  const bounded = present({ ...input, tail: [...tail, next], autoExpandReasoning: false });
+  expect(bounded.tail.map((item) => item.id)).toEqual(["tool-one", "next"]);
+});
+
+it.each([false, true])(
+  "reveals raw reasoning when opening a turn (Expand thinking %s)",
+  (autoExpandReasoning) => {
+    const timestamp = new Date();
+    const tail: StreamItem[] = [
+      { kind: "user_message", id: "prompt", text: "Work", timestamp },
+      { kind: "thought", id: "thought", text: "Consider this", status: "ready", timestamp },
+      toolCall("one", "Bash"),
+      { kind: "assistant_message", id: "reply", text: "Done", timestamp },
+    ];
+    const input = {
+      ...presentationOptions,
+      transform: undefined,
+      tail,
+      head: [],
+      display: "collapseTurns" as const,
+      isTurnActive: false,
+      autoExpandReasoning,
+    };
+    const present = createStreamPresentation();
+    const closed = present(input);
+    expect(closed.tail.some((item) => item.id === "thought")).toBe(false);
+    const opened = present({ ...input, expandedTurnHostIds: new Set(["prompt"]) });
+    expect(opened.tail).toEqual(tail);
+    expect(opened.turns.nestedItemIds.has("thought")).toBe(true);
+    expect(opened.groupsByHostId.size).toBe(0);
+  },
+);

packages/app/src/agent-stream/presentation.ts

@@ -1,3 +1,4 @@
+import { isTurnBoundary } from "./turn-membership";
 import type { ChatDisplay } from "@/hooks/use-settings";
 import type { TimelineItemTransform } from "@/plugins/timeline/model";
 import { projectPluginTimelineItems } from "@/plugins/timeline/projection";
@@ -16,9 +17,11 @@ interface PresentationInput {
   head: StreamItem[];
   transform: TimelineItemTransform | undefined;
   display: ChatDisplay;
+  autoExpandReasoning?: boolean;
   /** User messages whose collapsed turn the reader opened. */
   expandedTurnHostIds: ReadonlySet<string>;
   isTurnActive: boolean;
+  activeTurnId?: string | null;
 }
 
 export interface StreamPresentation extends ToolCallDetailProjection {
@@ -55,6 +58,7 @@ export function createStreamPresentation() {
   let historyTransform: TimelineItemTransform | undefined;
   let historyRows: StreamItem[] = [];
   let preparedTail: StreamItem[] | undefined;
+  let preparedAutoExpandReasoning: boolean | undefined;
   let preparedLevel: ToolCallDetailLevel | undefined;
   let preparedHistory: PreparedToolCallHistory | null = null;
   let collapsedSource: StreamItem[] | undefined;
@@ -63,6 +67,22 @@ export function createStreamPresentation() {
   let collapsed: TurnCollapse | undefined;
 
   function presentRows(item: StreamItem): StreamItem[] {
+    if (item.kind === "tool_call" && item.payload.source === "agent") {
+      const message = item.payload.data.agentMessage;
+      if (message?.event === "message") {
+        return [
+          {
+            kind: "user_message",
+            id: item.id,
+            turnId: item.turnId,
+            timelineCursor: item.timelineCursor,
+            timestamp: item.timestamp,
+            text: message.text,
+            sender: message.sender,
+          },
+        ];
+      }
+    }
     return [item.kind === "user_message" ? presentUserMessage(item) : item];
   }
 
@@ -75,7 +95,14 @@ export function createStreamPresentation() {
     }
     // Live text updates reach the head only, so the folded history is reused until the
     // retained rows, the latest turn's liveness, or the reader's expanded turns change.
-    const isLatestTurnOpen = input.isTurnActive || projection.head.length > 0;
+    const isLatestTurnOpen =
+      (input.isTurnActive || projection.head.length > 0) &&
+      !isTurnBoundary(projection.tail.at(-1) ?? null, projection.head[0] ?? null) &&
+      !(
+        input.activeTurnId &&
+        projection.tail.at(-1)?.turnId &&
+        input.activeTurnId !== projection.tail.at(-1)?.turnId
+      );
     if (
       !collapsed ||
       collapsedSource !== projection.tail ||
@@ -93,7 +120,20 @@ export function createStreamPresentation() {
       collapsedExpandedHostIds = input.expandedTurnHostIds;
     }
     const { tail, ...turns } = collapsed;
-    return { ...projection, tail, turns };
+    if (turns.nestedItemIds.size === 0) return { ...projection, tail, turns };
+    // Opening a turn reveals its raw calls; those rows must not become group hosts again.
+    const withoutExpandedRows = (groups: StreamPresentation["groupsByHostId"]) => ({
+      size: groups.size - [...turns.nestedItemIds].filter((id) => groups.has(id)).length,
+      get: (id: string) => (turns.nestedItemIds.has(id) ? undefined : groups.get(id)),
+      has: (id: string) => !turns.nestedItemIds.has(id) && groups.has(id),
+    });
+    return {
+      ...projection,
+      tail,
+      turns,
+      groupsByHostId: withoutExpandedRows(projection.groupsByHostId),
+      historyGroupUpdatesByHostId: withoutExpandedRows(projection.historyGroupUpdatesByHostId),
+    };
   }
 
   return (input: PresentationInput): StreamPresentation => {
@@ -111,10 +151,15 @@ export function createStreamPresentation() {
       const blocks = presentRows(item);
       head.push(...blocks);
     }
-    if (preparedTail !== historyRows || preparedLevel !== level) {
-      preparedHistory = prepareToolCallHistory(level, historyRows);
+    if (
+      preparedTail !== historyRows ||
+      preparedLevel !== level ||
+      preparedAutoExpandReasoning !== input.autoExpandReasoning
+    ) {
+      preparedHistory = prepareToolCallHistory(level, historyRows, input.autoExpandReasoning);
       preparedTail = historyRows;
       preparedLevel = level;
+      preparedAutoExpandReasoning = input.autoExpandReasoning;
     }
     return collapse(
       projectToolCallDetailLevel({

packages/app/src/agent-stream/render-strategy.test.ts

@@ -214,7 +214,7 @@ describe("neighbor and traversal semantics", () => {
     ).toBe("assistant-1\n\nassistant-2");
   });
 
-  it("collects copy content across adjacent turns without a visible prompt", () => {
+  it("keeps copied content within the canonical turn without a visible prompt", () => {
     const chronological: StreamItem[] = [
       { ...assistantMessage("a1", "first turn", 1), turnId: "turn-1" },
       { ...toolCall("tool", 2), turnId: "turn-2" },
@@ -228,7 +228,7 @@ describe("neighbor and traversal semantics", () => {
         items: chronological,
         startIndex: 2,
       }),
-    ).toBe("first turn\n\nsecond turn");
+    ).toBe("second turn");
   });
 
   it("returns undefined neighbor when index would be out of bounds", () => {

packages/app/src/agent-stream/strategy-web.test.tsx

@@ -7,7 +7,7 @@ import { act } from "react";
 import { createRoot, type Root } from "react-dom/client";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 import { RetainedPanelActivity } from "@/components/retained-panel";
-import type { StreamItem } from "@/types/stream";
+import { reduceStreamUpdate, type StreamItem } from "@/types/stream";
 import type { StreamRenderInput, StreamSegmentRenderers, StreamViewportHandle } from "./strategy";
 import { createWebStreamStrategy } from "./strategy-web";
 
@@ -131,6 +131,79 @@ describe("createWebStreamStrategy", () => {
     vi.restoreAllMocks();
   });
 
+  it.each(["liveHead", "historyMounted"] as const)(
+    "keeps one rendered tool row after late prior-turn updates in %s",
+    (lane) => {
+      const strategy = createWebStreamStrategy({ isMobileBreakpoint: true });
+      container = document.createElement("div");
+      document.body.appendChild(container);
+      root = createRoot(container);
+      const input: StreamRenderInput = {
+        agentId: "agent",
+        segments: { historyVirtualized: [], historyMounted: [], liveHead: [] },
+        boundary: {
+          hasVirtualizedHistory: false,
+          hasMountedHistory: lane === "historyMounted",
+          hasLiveHead: lane === "liveHead",
+        },
+        renderers: createRenderers(() => {}),
+        listEmptyComponent: null,
+        viewportRef: React.createRef<StreamViewportHandle>(),
+        routeBottomAnchorRequest: null,
+        isAuthoritativeHistoryReady: true,
+        onNearBottomChange: () => {},
+        onNearHistoryStart: () => true,
+        isLoadingOlderHistory: false,
+        hasOlderHistory: false,
+        olderHistoryProgressKey: null,
+        scrollEnabled: true,
+        listStyle: null,
+        baseListContentContainerStyle: null,
+        forwardListContentContainerStyle: null,
+        contentMaxWidth: DEFAULT_CONTENT_MAX_WIDTH,
+      };
+      let items: StreamItem[] = [];
+      const updates = [
+        { callId: "background", turnId: "old", status: "running" },
+        { callId: "exec", turnId: "current", status: "running" },
+        { callId: "background", turnId: "old", status: "completed" },
+        { callId: "exec", turnId: "current", status: "completed" },
+      ] as const;
+      for (const [index, update] of updates.entries()) {
+        items = reduceStreamUpdate(
+          items,
+          {
+            type: "timeline",
+            provider: "codex",
+            turnId: update.turnId,
+            item: {
+              type: "tool_call",
+              callId: update.callId,
+              name: "exec_command",
+              status: update.status,
+              error: null,
+              detail: { type: "shell", command: update.callId },
+            },
+          },
+          new Date(index),
+        );
+        act(() =>
+          root?.render(
+            strategy.render({
+              ...input,
+              segments: { ...input.segments, [lane]: items },
+            }),
+          ),
+        );
+      }
+      const rows = [...container.querySelectorAll("[data-history-row-id]")];
+      expect(rows.map((row) => row.getAttribute("data-history-row-id"))).toEqual([
+        "agent_tool_turn:old/background",
+        "agent_tool_turn:current/exec",
+      ]);
+    },
+  );
+
   it("mounts virtualized history without recursive row measurement updates", () => {
     const rowRenderCount = vi.fn();
     const strategy = createWebStreamStrategy({ isMobileBreakpoint: true });

packages/app/src/agent-stream/stream-tick.bench.ts

@@ -110,7 +110,7 @@ function runTicks(input: { tail: StreamItem[]; historyStart: number; heads: Stre
       isTurnActive: true,
       history: model.history,
       liveHead: model.segments.liveHead,
-      timingByAssistantId: model.turnTiming.byAssistantId,
+      timingByItemId: model.turnTiming.byItemId,
     });
   }
 }

packages/app/src/agent-stream/turn-collapse/model.test.ts

@@ -48,6 +48,41 @@ function collapse(tail: StreamItem[], options: Partial<CollapseTurnsInput> = {})
 const ids = (items: StreamItem[]) => items.map((item) => item.id);
 
 describe("collapseTurns", () => {
+  it("keeps lifecycle events and compaction recognizable beside a semantic action summary", () => {
+    const create = shell("create");
+    if (create.payload.source !== "agent") throw new Error("Expected agent tool");
+    create.payload.data.name = "mcp__paseo__create_agent";
+    create.payload.data.detail = { type: "unknown", input: { title: "Side fix" }, output: null };
+    const finished = shell("finished");
+    if (finished.payload.source !== "agent") throw new Error("Expected agent tool");
+    finished.payload.data.name = "agent_notification";
+    finished.payload.data.agentMessage = {
+      event: "finished",
+      sender: { id: "worker", title: "PR helper" },
+      text: "Finished",
+    };
+    const items: StreamItem[] = [
+      user("u1"),
+      create,
+      finished,
+      {
+        kind: "compaction",
+        id: "compaction",
+        timestamp: at,
+        status: "completed",
+      } satisfies StreamItem,
+      shell("bash"),
+      reply("done"),
+    ].map((item) => Object.assign(item, { turnId: "same-run" }));
+    const result = collapse(items);
+    expect(ids(result.tail)).toEqual(["u1", "finished", "compaction", "done"]);
+    expect(result.turnsByHostId.get("u1")?.summary.tools).toMatchObject({
+      commandCount: 1,
+      otherToolCount: 0,
+      paseoActions: { "Created agent": 1 },
+    });
+  });
+
   it("folds a finished turn's work into its user message and keeps the reply", () => {
     const result = collapse([
       user("u1"),
@@ -63,7 +98,6 @@ describe("collapseTurns", () => {
       hostId: "u1",
       expanded: false,
       summary: {
-        messageCount: 1,
         tools: expect.objectContaining({ commandCount: 2 }),
       },
     });
@@ -121,6 +155,34 @@ describe("collapseTurns", () => {
     expect(result.turnsByHostId.size).toBe(0);
   });
 
+  it("keeps a completed response folded when a promptless canonical turn starts", () => {
+    const first = [user("u1"), shell("c1"), reply("r1")].map((item) =>
+      Object.assign(item, { turnId: "first" }),
+    );
+    const next = { ...shell("heartbeat"), turnId: "second" };
+    const result = collapse([...first, next], { isLatestTurnOpen: true });
+    expect(ids(result.tail)).toEqual(["u1", "r1", "heartbeat"]);
+    expect(result.turnsByHostId.has("u1")).toBe(true);
+  });
+
+  it("keeps mid-turn messages visible when work is folded", () => {
+    const tail = [user("prompt"), shell("work"), user("steer"), shell("more"), reply("done")];
+    for (const item of tail) item.turnId = "same-turn";
+    const result = collapse(tail);
+    expect(ids(result.tail)).toEqual(["prompt", "steer", "done"]);
+    expect(result.hostIdByFoldedMessageId.has("steer")).toBe(false);
+  });
+
+  it("reveals every raw call inside an expanded turn", () => {
+    const calls = [shell("one"), shell("two")];
+    const result = collapse([user("prompt"), calls[0]!, reply("done")], {
+      expandedHostIds: new Set(["prompt"]),
+      getGroupedCalls: (id) => (id === "one" ? calls : undefined),
+    });
+    expect(ids(result.tail)).toEqual(["prompt", "one", "two", "done"]);
+    expect([...result.nestedItemIds]).toEqual(["one", "two"]);
+  });
+
   it("counts every call a tool-call group row stands for", () => {
     const group = [shell("c1"), shell("c2"), shell("c3")];
     const result = collapse([user("u1"), group[0]!, reply("final")], {

packages/app/src/agent-stream/turn-collapse/model.ts

@@ -1,13 +1,18 @@
-import { getStreamItemMessageId, type StreamItem, type ToolCallItem } from "@/types/stream";
+import { isTurnBoundary, isTurnTrigger } from "../turn-membership";
+import {
+  getStreamItemMessageId,
+  type StreamItem,
+  type ThoughtItem,
+  type ToolCallItem,
+} from "@/types/stream";
 import { summarizeToolCalls, type OverviewSummary } from "@/tool-calls/detail-level/overview/model";
 
 export interface TurnSummary {
-  messageCount: number;
   tools: OverviewSummary;
 }
 
 export interface CollapsedTurn {
-  /** The user message the turn answers. Its row carries the turn's summary line. */
+  /** The input or first loaded row that carries the turn's summary line. */
   hostId: string;
   expanded: boolean;
   summary: TurnSummary;
@@ -28,7 +33,7 @@ export interface CollapseTurnsInput {
   isLatestTurnOpen: boolean;
   expandedHostIds: ReadonlySet<string>;
   /** The calls a tool-call group row stands for; undefined for a single call. */
-  getGroupedCalls: (itemId: string) => readonly ToolCallItem[] | undefined;
+  getGroupedCalls: (itemId: string) => readonly (ToolCallItem | ThoughtItem)[] | undefined;
 }
 
 const EMPTY_TURNS: ReadonlyMap<string, CollapsedTurn> = new Map();
@@ -39,17 +44,21 @@ function summarizeTurn(
   items: readonly StreamItem[],
   getGroupedCalls: CollapseTurnsInput["getGroupedCalls"],
 ): TurnSummary {
-  const calls: ToolCallItem[] = [];
-  let messageCount = 0;
+  const calls: (ToolCallItem | ThoughtItem)[] = [];
   for (const item of items) {
-    if (item.kind === "assistant_message") messageCount += 1;
-    else if (item.kind === "tool_call") calls.push(...(getGroupedCalls(item.id) ?? [item]));
+    if ((item.kind === "tool_call" || item.kind === "thought") && !isTurnTrigger(item))
+      calls.push(...(getGroupedCalls(item.id) ?? [item]));
   }
-  return { messageCount, tools: summarizeToolCalls(calls) };
+  return { tools: summarizeToolCalls(calls) };
 }
 
 function hasWork(summary: TurnSummary): boolean {
-  return summary.messageCount > 0 || Object.values(summary.tools).some((count) => count > 0);
+  const { paseoActions, thoughtCount: _thoughtCount, ...counts } = summary.tools;
+  return Object.keys(paseoActions).length > 0 || Object.values(counts).some((count) => count > 0);
+}
+
+function staysVisibleWhenCollapsed(item: StreamItem): boolean {
+  return isTurnTrigger(item) || item.kind === "compaction";
 }
 
 function findLastAssistantIndex(tail: StreamItem[], start: number, end: number): number {
@@ -63,7 +72,7 @@ function findLastAssistantIndex(tail: StreamItem[], start: number, end: number):
  * Folds each answered turn into its user message: everything the agent did before its last
  * message collapses into one summary line, and that message stays in the chat. A turn folds
  * only once it is complete, its user message is loaded, and it sent messages or called tools
- * before its reply. Thoughts fold with the turn but are not counted.
+ * before its reply. Reasoning is revealed only when the turn opens.
  */
 export function collapseTurns(input: CollapseTurnsInput): TurnCollapse {
   const { tail } = input;
@@ -77,28 +86,47 @@ export function collapseTurns(input: CollapseTurnsInput): TurnCollapse {
     const host = tail[runStart - 1];
     const isClosed = runEnd < tail.length || !input.isLatestTurnOpen;
     const replyIndex = findLastAssistantIndex(tail, runStart, runEnd);
-    if (host?.kind !== "user_message" || !isClosed || replyIndex <= runStart) {
+    if (
+      !host ||
+      (host.kind !== "user_message" && host.kind !== "tool_call") ||
+      !isClosed ||
+      replyIndex <= runStart
+    ) {
       output.push(...tail.slice(runStart, runEnd));
       return;
     }
     const folded = tail.slice(runStart, replyIndex);
     const summary = summarizeTurn(folded, input.getGroupedCalls);
-    if (!hasWork(summary)) {
+    if (!hasWork(summary) && !folded.some((item) => item.kind === "assistant_message")) {
       output.push(...tail.slice(runStart, runEnd));
       return;
     }
     const expanded = input.expandedHostIds.has(host.id);
     turnsByHostId.set(host.id, { hostId: host.id, expanded, summary });
-    for (const item of folded) {
+    const revealed = expanded
+      ? folded.flatMap<StreamItem>((item) =>
+          item.kind === "tool_call" || item.kind === "thought"
+            ? [...(input.getGroupedCalls(item.id) ?? [item])]
+            : [item],
+        )
+      : folded;
+    for (const item of revealed) {
+      if (staysVisibleWhenCollapsed(item)) continue;
       hostIdByFoldedMessageId.set(getStreamItemMessageId(item), host.id);
       if (expanded) nestedItemIds.add(item.id);
     }
-    if (expanded) output.push(...folded);
+    output.push(
+      ...(expanded ? revealed : folded.filter((item) => staysVisibleWhenCollapsed(item))),
+    );
     output.push(...tail.slice(replyIndex, runEnd));
   };
 
   for (let index = 0; index < tail.length; index += 1) {
-    if (tail[index]?.kind !== "user_message") continue;
+    if (
+      !(index === 0 && isTurnTrigger(tail[index]!)) &&
+      !isTurnBoundary(tail[index - 1] ?? null, tail[index] ?? null)
+    )
+      continue;
     flushRun(index);
     output.push(tail[index]!);
     runStart = index + 1;
@@ -114,7 +142,10 @@ export function collapseTurns(input: CollapseTurnsInput): TurnCollapse {
     };
   }
   return {
-    tail: output.length === tail.length ? tail : output,
+    tail:
+      output.length === tail.length && output.every((item, index) => item === tail[index])
+        ? tail
+        : output,
     turnsByHostId,
     nestedItemIds,
     hostIdByFoldedMessageId,

packages/app/src/agent-stream/turn-collapse/summary-line.tsx

@@ -1,4 +1,4 @@
-import { memo, useCallback, useMemo } from "react";
+import { memo, useCallback } from "react";
 import { useTranslation } from "react-i18next";
 import { Summary } from "lucide-react-native";
 import { ExpandableBadge } from "@/components/message";
@@ -17,19 +17,7 @@ export const TurnSummaryLine = memo(function TurnSummaryLine({
   onExpandedChange: (hostId: string, expanded: boolean) => void;
 }) {
   const { t } = useTranslation();
-  const { messageCount, tools } = turn.summary;
-  const messageParts = useMemo(
-    () =>
-      messageCount > 0
-        ? [
-            t(`turnSummary.messages.${messageCount === 1 ? "one" : "other"}`, {
-              count: messageCount,
-            }),
-          ]
-        : [],
-    [messageCount, t],
-  );
-  const label = useOverviewSummaryLabel(tools, messageParts);
+  const label = useOverviewSummaryLabel(turn.summary.tools) || t("turnSummary.details");
   const toggle = useCallback(
     () => onExpandedChange(turn.hostId, !turn.expanded),
     [onExpandedChange, turn.expanded, turn.hostId],

packages/app/src/agent-stream/turn-footer.tsx

@@ -197,7 +197,7 @@ function CompletedTurnFooter({
   return (
     <View style={stylesheet.turnFooterSlot}>
       <AssistantTurnFooter
-        getContent={getContent}
+        getContent={items[startIndex]?.kind === "assistant_message" ? getContent : undefined}
         completedAt={timing?.completedAt}
         durationMs={timing?.durationMs}
         onFork={boundary && onForkAssistantTurn ? handleFork : undefined}

packages/app/src/agent-stream/turn-membership.test.ts

@@ -53,7 +53,7 @@ function layoutFor(items: StreamItem[], isTurnActive: boolean) {
       isTurnActive,
       history: model.segments.historyMounted,
       liveHead: model.segments.liveHead,
-      timingByAssistantId: model.turnTiming.byAssistantId,
+      timingByItemId: model.turnTiming.byItemId,
     }),
   };
 }
@@ -67,6 +67,24 @@ function completedFooterIds(layout: ReturnType<typeof layoutFor>["layout"]): str
 }
 
 describe("canonical turn membership", () => {
+  it("uses trigger fallback for missing IDs without pretending to recover batching", () => {
+    const previous = assistant("reply", 1, "first");
+    const trigger = runningTool("heartbeat", 2, "first");
+    if (trigger.kind !== "tool_call" || trigger.payload.source !== "agent")
+      throw new Error("Expected agent tool");
+    trigger.payload.data.name = "heartbeat";
+    expect(continuesTurn(previous, trigger)).toBe(true);
+    delete trigger.turnId;
+    expect(continuesTurn(previous, trigger)).toBe(false);
+    trigger.payload.data.name = "agent_message";
+    trigger.payload.data.agentMessage = {
+      event: "finished",
+      sender: { id: "worker" },
+      text: "Done",
+    };
+    expect(continuesTurn(previous, trigger)).toBe(false);
+  });
+
   it("stops tagged traversal at every mismatching turn ID", () => {
     expect(continuesTurn(assistant("first", 1, "turn-1"), runningTool("next", 2, "turn-2"))).toBe(
       false,
@@ -76,7 +94,7 @@ describe("canonical turn membership", () => {
     );
   });
 
-  it("renders adjacent turns without visible prompts as one response", () => {
+  it("renders a separate footer for each canonical turn without visible prompts", () => {
     const items = [
       user("prompt", 1, "turn-1"),
       assistant("first reply", 2, "turn-1"),
@@ -88,7 +106,11 @@ describe("canonical turn membership", () => {
 
     const completed = layoutFor(items, false);
 
-    expect(completedFooterIds(completed.layout)).toEqual(["heartbeat-2-reply"]);
+    expect(completedFooterIds(completed.layout)).toEqual([
+      "first reply",
+      "heartbeat-1-reply",
+      "heartbeat-2-reply",
+    ]);
     expect(completed.layout.auxiliaryTurnFooter?.timing).toEqual({
       completedAt: at(6),
       durationMs: null,
@@ -123,7 +145,7 @@ describe("canonical turn membership", () => {
     const completedItems = [...build(turnId), assistant("done", 9, turnId)];
     const completed = layoutFor(completedItems, false);
     expect(completedFooterIds(completed.layout)).toEqual(["done"]);
-    expect(completed.model.turnTiming.byAssistantId.get("done")).toMatchObject({
+    expect(completed.model.turnTiming.byItemId.get("done")).toMatchObject({
       completedAt: at(9),
       durationMs: 8000,
     });

packages/app/src/agent-stream/turn-membership.ts

@@ -1,24 +1,21 @@
+import { continuesTimelineTurn, isTimelineTurnTrigger } from "@getpaseo/protocol/timeline-turn";
 import type { StreamItem } from "@/types/stream";
 
 /**
  * Canonical turn IDs take precedence. Timelines without them retain the legacy
- * user-message boundary rule so old daemons and persisted rows need no rewrite.
+ * trigger boundary rule; missing IDs cannot reconstruct historical batching.
  */
 export function continuesTurn(previous: StreamItem | null, next: StreamItem | null): boolean {
   if (!previous || !next) return false;
-  if (previous.turnId !== undefined && next.turnId !== undefined) {
-    return previous.turnId === next.turnId;
-  }
-  return next.kind !== "user_message";
+  return continuesTimelineTurn(previous.turnId, next.turnId, isTurnTrigger(next));
 }
 
 /**
- * A visible response can span multiple canonical turns when their prompts are
- * system-injected and therefore absent from the Paseo timeline.
+ * Every canonical turn owns its response, including system-triggered runs.
  */
 export function continuesResponse(previous: StreamItem | null, next: StreamItem | null): boolean {
   if (!previous || !next) return false;
-  return continuesTurn(previous, next) || next.kind !== "user_message";
+  return continuesTurn(previous, next);
 }
 
 export function isTurnBoundary(previous: StreamItem | null, next: StreamItem | null): boolean {
@@ -37,3 +34,12 @@ export function startsNewTurn(item: StreamItem, previous: StreamItem | null): bo
 export function belongsToTurn(item: StreamItem, turnId: string | null): boolean {
   return turnId !== null && item.turnId === turnId;
 }
+
+/** Inputs that start a turn when older history has no canonical turn IDs. */
+export function isTurnTrigger(item: StreamItem): boolean {
+  return isTimelineTurnTrigger(
+    item.kind === "tool_call" && item.payload.source === "agent"
+      ? { type: item.kind, ...item.payload.data }
+      : { type: item.kind },
+  );
+}

packages/app/src/agent-stream/use-agent-stream-tail.ts

@@ -0,0 +1,12 @@
+import { useRetainedPanelActive } from "@/components/retained-panel";
+import { useSessionStore } from "@/stores/session-store";
+
+// The view retains its last visible transcript. Selecting a stable value here
+// also prevents incoming chunks from scheduling React work in a hidden panel.
+// Revealing the panel reads the current tail directly from the model.
+export function useAgentStreamTail(serverId: string, agentId: string | undefined) {
+  const active = useRetainedPanelActive();
+  return useSessionStore((state) =>
+    active && agentId ? state.sessions[serverId]?.agentStreamTail.get(agentId) : undefined,
+  );
+}

packages/app/src/agent-stream/view.tsx

@@ -524,8 +524,10 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
           head: effectiveStreamHead ?? EMPTY_STREAM_HEAD,
           transform: transformTimelineItem,
           display: chatDisplay,
+          autoExpandReasoning,
           expandedTurnHostIds,
           isTurnActive,
+          activeTurnId: effectiveTurnPresentation.turnId,
         }),
       [
         presentStream,
@@ -533,8 +535,10 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
         effectiveStreamHead,
         transformTimelineItem,
         chatDisplay,
+        autoExpandReasoning,
         expandedTurnHostIds,
         isTurnActive,
+        effectiveTurnPresentation.turnId,
       ],
     );
     const {
@@ -576,12 +580,12 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
           isTurnActive,
           history: baseRenderModel.history,
           liveHead: baseRenderModel.segments.liveHead,
-          timingByAssistantId: baseRenderModel.turnTiming.byAssistantId,
+          timingByItemId: baseRenderModel.turnTiming.byItemId,
         }),
       [
         baseRenderModel.history,
         baseRenderModel.segments.liveHead,
-        baseRenderModel.turnTiming.byAssistantId,
+        baseRenderModel.turnTiming.byItemId,
         isTurnActive,
         streamRenderStrategy,
       ],
@@ -722,6 +726,7 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
             agentId={agentId}
             messageId={item.messageId}
             message={item.text}
+            sender={item.sender}
             images={item.images}
             attachments={item.attachments}
             timestamp={item.timestamp.getTime()}
@@ -868,10 +873,15 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
       presentation.groupsByHostId.get(hostId),
     );
     const renderToolCallItem = useCallback(
-      (layoutItem: StreamLayoutItem, item: Extract<StreamItem, { kind: "tool_call" }>) => {
+      (
+        layoutItem: StreamLayoutItem,
+        item: Extract<StreamItem, { kind: "tool_call" | "thought" }>,
+      ) => {
         const group = getToolCallGroup(item.id);
         if (!group) {
-          return renderSingleToolCallItem(item, layoutItem.isLastInToolSequence);
+          return item.kind === "thought"
+            ? renderThoughtItem(layoutItem, item)
+            : renderSingleToolCallItem(item, layoutItem.isLastInToolSequence);
         }
         const expanded = expandedToolCallGroupIds.has(group.run.id);
         return (
@@ -884,10 +894,21 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
             {expanded
               ? group.run.calls.map((call, index) => (
                   <React.Fragment key={call.id}>
-                    {renderSingleToolCallItem(
-                      call,
-                      index === group.run.calls.length - 1,
-                      GROUPED_TOOL_CALL_DETAIL_MAX_HEIGHT,
+                    {call.kind === "thought" ? (
+                      <ThoughtSlot
+                        itemId={call.id}
+                        text={call.text}
+                        status={call.status}
+                        isLastInSequence={index === group.run.calls.length - 1}
+                        defaultExpanded
+                        onInlineDetailsExpandedChangeByItemId={setInlineDetailsExpanded}
+                      />
+                    ) : (
+                      renderSingleToolCallItem(
+                        call,
+                        index === group.run.calls.length - 1,
+                        GROUPED_TOOL_CALL_DETAIL_MAX_HEIGHT,
+                      )
                     )}
                   </React.Fragment>
                 ))
@@ -897,6 +918,8 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
       },
       [
         expandedToolCallGroupIds,
+        renderThoughtItem,
+        setInlineDetailsExpanded,
         getToolCallGroup,
         renderSingleToolCallItem,
         setToolCallGroupExpanded,
@@ -914,10 +937,20 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
             return renderAssistantMessageItem(layoutItem, item);
 
           case "thought":
-            return renderThoughtItem(layoutItem, item);
+            return renderToolCallItem(layoutItem, item);
 
           case "tool_call":
-            return renderToolCallItem(layoutItem, item);
+            return (
+              <>
+                {renderToolCallItem(layoutItem, item)}
+                {getCollapsedTurn(item.id) ? (
+                  <TurnSummaryLine
+                    turn={getCollapsedTurn(item.id)!}
+                    onExpandedChange={setTurnExpanded}
+                  />
+                ) : null}
+              </>
+            );
 
           case "notification":
             return <Notification level={item.level} message={item.message} />;
@@ -947,8 +980,9 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
         agentId,
         renderUserMessageItem,
         renderAssistantMessageItem,
-        renderThoughtItem,
         renderToolCallItem,
+        getCollapsedTurn,
+        setTurnExpanded,
         resolvedServerId,
       ],
     );

packages/app/src/agent-stream/web-virtualization.test.ts

@@ -70,6 +70,17 @@ function indexEntries(items: StreamItem[]): IndexedStreamItem[] {
 }
 
 describe("findMountedWindowStart", () => {
+  it("mounts complete autonomous runs and keeps same-run steers together", () => {
+    const items = [
+      { ...userMessage("human", 1), turnId: "first" },
+      { ...assistantMessage("reply", 2), turnId: "first" },
+      { ...toolCall("wake", 3), turnId: "autonomous" },
+      { ...userMessage("steer", 4), turnId: "autonomous" },
+      { ...assistantMessage("done", 5), turnId: "autonomous" },
+    ];
+    expect(findMountedWindowStart({ items, minMountedCount: 1 })).toBe(2);
+  });
+
   it("keeps all items mounted when the chat is below the threshold", () => {
     const items = [userMessage("u1", 1), assistantMessage("a1", 2)];
 

packages/app/src/app/_layout.tsx

@@ -72,6 +72,7 @@ import {
   type StartupBlocker,
 } from "@/navigation/host-runtime-bootstrap";
 import { registerWorkspaceRouteNavigationRef } from "@/navigation/workspace-route-navigation";
+import { useSettingsRouteEntry } from "@/navigation/settings-presentation";
 import { ThemedStack } from "@/navigation/themed-stack";
 import { shouldUseDesktopDaemon } from "@/desktop/daemon/desktop-daemon";
 import { AgentNavigationListener } from "@/desktop/agent-navigation";
@@ -759,6 +760,7 @@ function OpenProjectListener() {
 }
 
 function AppWithSidebar({ children }: { children: ReactNode }) {
+  useSettingsRouteEntry();
   const pathname = usePathname();
   const hosts = useHosts();
   const storeReady = useStoreReady();

packages/app/src/app/h/[serverId]/agent/[agentId].tsx

@@ -5,6 +5,7 @@ import { useFetchQuery } from "@/data/query";
 import { resolveAgentRoute, type AgentRouteLookup } from "@/navigation/agent-route-resolution";
 import { AgentRouteResolutionView } from "@/navigation/agent-route-resolution-view";
 import { useHasHydratedWorkspaces } from "@/stores/session-store-hooks";
+import { useDirectoryDemand } from "@/hooks/use-directory-demand";
 import { useWorkspaceLayoutStoreHydrated } from "@/stores/workspace-layout-store";
 import { useSessionStore } from "@/stores/session-store";
 import { getHostRuntimeStore, useHostRuntimeSnapshot, useHosts } from "@/runtime/host-runtime";
@@ -87,11 +88,7 @@ function HostAgentReadyRouteContent() {
   ]);
   const hasHydratedWorkspaces = useHasHydratedWorkspaces(serverId);
   const hasHydratedLayout = useWorkspaceLayoutStoreHydrated();
-  useEffect(() => {
-    if (!serverId) return;
-    // A compact app can open this route before its sidebar has demanded the directory.
-    return getHostRuntimeStore().acquireDirectoryDemand(serverId);
-  }, [serverId]);
+  useDirectoryDemand(serverId);
   const resolution = resolveAgentRoute({
     hasHydratedWorkspaces,
     hasHydratedLayout,

packages/app/src/app/h/[serverId]/workspace/[workspaceId]/index.tsx

@@ -9,6 +9,7 @@ import {
   useActiveWorkspaceSelection,
 } from "@/stores/navigation-active-workspace-store";
 import { useHasHydratedWorkspaces, useWorkspaceExists } from "@/stores/session-store-hooks";
+import { useDirectoryDemand } from "@/hooks/use-directory-demand";
 import type { WorkspaceTabTarget } from "@/workspace-tabs/model";
 import { WorkspaceScreen } from "@/screens/workspace/workspace-screen";
 import { useWorkspaceLayoutStore } from "@/stores/workspace-layout-store";
@@ -110,6 +111,10 @@ function HostWorkspaceRouteContent() {
     ? (decodeWorkspaceIdFromPathSegment(workspaceValue) ?? "")
     : "";
   const openValue = getParamValue(params.open);
+  // A restored workspace with no open chat has nothing else demanding its host's directory on a
+  // phone, where the sidebar only demands while its panel is active. Without demand the deck
+  // waits on workspace hydration that never starts.
+  useDirectoryDemand(serverId);
   useEffect(() => {
     if (!serverId || !workspaceId) {
       return;

packages/app/src/components/context-window-meter.tsx

@@ -112,8 +112,9 @@ const ContextWindowRing = withUnistyles(function ContextWindowRing({
       width={size}
       height={size}
       viewBox={`0 0 ${size} ${size}`}
-      accessibilityElementsHidden
-      importantForAccessibility="no-hide-descendants"
+      {...(isNative
+        ? { accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants" }
+        : { "aria-hidden": true })}
     >
       <Circle
         cx={center}

packages/app/src/components/file-explorer-pane.tsx

@@ -77,6 +77,7 @@ import { useWorkspaceFileDragSource } from "@/attachments/use-workspace-file-dra
 import { confirmDialog } from "@/utils/confirm-dialog";
 import { useToast } from "@/contexts/toast-context";
 import { openDesktopTarget, useDesktopOpenTargets } from "@/workspace/desktop-open-targets";
+import { useWorkspaceFields } from "@/stores/session-store-hooks";
 import { useOpenDirectoryInEditor } from "@/workspace/open-in-editor/directory";
 
 const SORT_OPTIONS: { value: SortOption }[] = [
@@ -450,9 +451,15 @@ export function FileExplorerPane({
     isLocalExecution: isLocalDaemon,
   });
   const fileManagerTarget = desktopOpenTargets.find((target) => target.kind === "file-manager");
+  const projectId = useWorkspaceFields(
+    serverId,
+    workspaceId ?? null,
+    (workspace) => workspace.projectId,
+  );
   const openDirectoryInEditor = useOpenDirectoryInEditor({
     serverId,
     workspaceDirectory: normalizedWorkspaceRoot,
+    projectId,
   });
   // COMPAT(fsEntryOps): added in v0.3.0, remove gate after 2027-02-08.
   const fsEntryOpsEnabled = useSessionStore(

packages/app/src/components/indent-rail.tsx

@@ -3,11 +3,10 @@ import { View, type StyleProp, type ViewStyle } from "react-native";
 import { StyleSheet } from "react-native-unistyles";
 
 /**
- * Collapsed chat rows badge their summary with an icon whose center sits 7px into the content
- * column (`ExpandableBadge` bleeds 13px left, then 1px border, 8px padding, 22px icon). The rail
- * hangs from that center so opened rows read as children of the line that opened them.
+ * Align the rail with the expanded caret's left edge. Keep the content offset fixed so
+ * expanded tool cards stay in place, with a gap between their border and the rail.
  */
-const RAIL_LEFT = 7;
+const RAIL_LEFT = 1;
 const RAIL_WIDTH = 1;
 export const INDENT_RAIL_CONTENT_OFFSET = 21;
 

packages/app/src/components/markdown/renderer.test.ts

@@ -804,3 +804,18 @@ it("makes the web Markdown container selectable in Safari as well as unprefixed
     WebkitUserSelect: "text",
   });
 });
+
+it.each([false, true])(
+  "scales inline code from theme tokens with its surrounding block (compact: %s)",
+  (compact) => {
+    const theme = {
+      ...darkTheme,
+      fontSize: { ...darkTheme.fontSize, code: 13, content: 17, base: 16 },
+    };
+    const { markdownStyle } = createMarkdownStyles(theme, { compact, blockGap: 16 });
+    const bodySize = compact ? theme.fontSize.base : theme.fontSize.content;
+    expect(markdownStyle.code).not.toHaveProperty("fontSize");
+    expect(markdownStyle.code).toHaveProperty("fontScale", theme.fontSize.code / bodySize);
+    expect(markdownStyle.codeBlock?.fontSize).toBe(theme.fontSize.code);
+  },
+);

packages/app/src/components/markdown/styles.ts

@@ -72,7 +72,7 @@ export function createMarkdownStyles(
       },
       code: {
         fontFamily: theme.fontFamily.mono === "ui-monospace" && !isWeb ? "" : theme.fontFamily.mono,
-        fontSize: theme.fontSize.code,
+        fontScale: theme.fontSize.code / fontSize,
         color: theme.colors.foreground,
         backgroundColor: theme.colors.surface2,
         borderColor: "transparent",

packages/app/src/components/message.tsx

@@ -1,3 +1,4 @@
+import { MessagePreview, MessageSender } from "@/components/user-message";
 import { useStableEvent } from "@/hooks/use-stable-event";
 import { getAgentAttachmentPillContent } from "@/attachments/attachment-pill-content";
 import { AssistantForkMenu, type AssistantForkTarget } from "@/components/assistant-fork-menu";
@@ -89,6 +90,7 @@ export type { InlinePathTarget } from "@/assistant-file-links";
 export type { AssistantForkTarget };
 
 interface UserMessageProps {
+  sender?: AgentMessage["sender"];
   serverId?: string;
   agentId?: string;
   messageId?: string;
@@ -387,6 +389,7 @@ function UserMessageImagePill({ image, onOpen, accessibilityLabel }: UserMessage
 const MESSAGE_TEXT_DATASET = { messageText: "true" };
 
 export const UserMessage = memo(function UserMessage({
+  sender,
   serverId,
   agentId,
   messageId,
@@ -473,42 +476,45 @@ export const UserMessage = memo(function UserMessage({
         onPointerEnter={handlePointerEnter}
         onPointerLeave={handlePointerLeave}
       >
+        {sender ? <MessageSender sender={sender} serverId={serverId} /> : null}
         <View style={userMessageStylesheet.bubble}>
-          {hasImages ? (
-            <View style={imagePreviewContainerStyle}>
-              {images.map((image) => (
-                <UserMessageImagePill
-                  key={image.id}
-                  image={image}
-                  onOpen={setLightboxMetadata}
-                  accessibilityLabel={t("composer.attachments.openImage")}
-                />
-              ))}
-            </View>
-          ) : null}
-          {hasAttachments ? (
-            <View style={attachmentPreviewContainerStyle}>
-              {attachments.map((attachment, index) => {
-                const content = getAgentAttachmentPillContent(attachment, t);
-                return (
-                  <AttachmentFrame
-                    key={`${attachment.type}:${"number" in attachment ? attachment.number : index}`}
-                  >
-                    <AttachmentLabel
-                      icon={content.icon}
-                      title={content.title}
-                      subtitle={content.subtitle}
-                    />
-                  </AttachmentFrame>
-                );
-              })}
-            </View>
-          ) : null}
-          {hasText ? (
-            <Text selectable style={userMessageStylesheet.text} dataSet={MESSAGE_TEXT_DATASET}>
-              {message}
-            </Text>
-          ) : null}
+          <MessagePreview>
+            {hasImages ? (
+              <View style={imagePreviewContainerStyle}>
+                {images.map((image) => (
+                  <UserMessageImagePill
+                    key={image.id}
+                    image={image}
+                    onOpen={setLightboxMetadata}
+                    accessibilityLabel={t("composer.attachments.openImage")}
+                  />
+                ))}
+              </View>
+            ) : null}
+            {hasAttachments ? (
+              <View style={attachmentPreviewContainerStyle}>
+                {attachments.map((attachment, index) => {
+                  const content = getAgentAttachmentPillContent(attachment, t);
+                  return (
+                    <AttachmentFrame
+                      key={`${attachment.type}:${"number" in attachment ? attachment.number : index}`}
+                    >
+                      <AttachmentLabel
+                        icon={content.icon}
+                        title={content.title}
+                        subtitle={content.subtitle}
+                      />
+                    </AttachmentFrame>
+                  );
+                })}
+              </View>
+            ) : null}
+            {hasText ? (
+              <Text selectable style={userMessageStylesheet.text} dataSet={MESSAGE_TEXT_DATASET}>
+                {message}
+              </Text>
+            ) : null}
+          </MessagePreview>
         </View>
         {hasText ? (
           <View
@@ -541,7 +547,7 @@ export const UserMessage = memo(function UserMessage({
 });
 
 interface AssistantTurnFooterProps {
-  getContent: () => string;
+  getContent?: () => string;
   completedAt?: Date;
   durationMs?: number | null;
   onFork?: (target: AssistantForkTarget) => Promise<void> | void;
@@ -641,10 +647,12 @@ export const AssistantTurnFooter = memo(function AssistantTurnFooter({
 
   return (
     <View style={assistantTurnFooterStylesheet.container}>
-      <TurnCopyButton
-        getContent={getContent}
-        containerStyle={assistantTurnFooterStylesheet.copyButton}
-      />
+      {getContent ? (
+        <TurnCopyButton
+          getContent={getContent}
+          containerStyle={assistantTurnFooterStylesheet.copyButton}
+        />
+      ) : null}
       {canFork ? <AssistantForkMenu onFork={handleFork} /> : null}
       {primaryLabel ? (
         <Pressable

packages/app/src/components/rewind/use-rewind-agent-mutation.ts

@@ -1,3 +1,4 @@
+import { planTimelineTailFetch } from "@/timeline/timeline-sync-plan";
 import { useCallback } from "react";
 import { useTranslation } from "react-i18next";
 import { useMutation } from "@tanstack/react-query";
@@ -42,8 +43,7 @@ export function useRewindAgentMutation(input: UseRewindAgentMutationInput): {
           : undefined;
         if (!input.serverId) throw new Error(t("common.errors.daemonClientUnavailable"));
         await getHostRuntimeStore().fetchAgentTimeline(input.serverId, input.agentId, {
-          direction: "tail",
-          projection: "projected",
+          ...planTimelineTailFetch(),
           ...(cursor ? { cursor: { epoch: cursor.epoch, seq: cursor.endSeq } } : {}),
         });
       }

packages/app/src/components/settings/collapsible-row.tsx

@@ -1,20 +1,18 @@
-import { ChevronRight } from "lucide-react-native";
 import { Children, isValidElement, useCallback, useMemo, useState, type ReactNode } from "react";
-import { Pressable, Text, View, type PressableStateCallbackType } from "react-native";
-import { StyleSheet, withUnistyles } from "react-native-unistyles";
-import { mutedIconColorMapping } from "@/components/ui/icon-color";
+import { View } from "react-native";
+import { StyleSheet } from "react-native-unistyles";
 import { isWeb } from "@/constants/platform";
 import { settingsStyles } from "@/styles/settings";
-import { ICON_SIZE, type Theme } from "@/styles/theme";
-
-const ThemedChevron = withUnistyles(ChevronRight);
-const hoveredIconColorMapping = (theme: Theme) => ({ color: theme.colors.foreground });
+import { NestedSettingsRows } from "./row-density";
+import { SettingsRowHeader } from "./row-header";
 
 interface SettingsCollapsibleRowProps {
   label: string;
+  /** A short status shown before the chevron, so the row says something while collapsed. */
+  summary?: string;
   defaultExpanded?: boolean;
   testID?: string;
-  /** The rows revealed underneath, separated like the rows of a `SettingsCard`. */
+  /** The rows revealed underneath, separated like the rows of a `SettingsCard` and laid out as nested rows. */
   children: ReactNode;
 }
 
@@ -25,6 +23,7 @@ interface SettingsCollapsibleRowProps {
  */
 export function SettingsCollapsibleRow({
   label,
+  summary,
   defaultExpanded = false,
   testID,
   children,
@@ -37,66 +36,39 @@ export function SettingsCollapsibleRow({
     () => (isWeb ? ({ "aria-expanded": expanded } as const) : null),
     [expanded],
   );
-  const headerStyle = useCallback(
-    ({ hovered, pressed }: PressableStateCallbackType & { hovered?: boolean }) => [
-      settingsStyles.row,
-      hovered && styles.headerHovered,
-      pressed && styles.headerPressed,
-    ],
-    [],
-  );
-  const chevronStyle = useMemo(
-    () => [styles.chevron, expanded && styles.chevronExpanded],
-    [expanded],
-  );
 
   return (
     <View testID={testID}>
-      <Pressable
-        {...webExpandedProps}
-        accessibilityRole="button"
-        accessibilityLabel={label}
-        accessibilityState={accessibilityState}
+      <SettingsRowHeader
+        label={label}
+        summary={summary}
         onPress={toggle}
-        style={headerStyle}
+        expanded={expanded}
+        accessibilityState={accessibilityState}
+        webAccessibilityProps={webExpandedProps}
         testID={testID ? `${testID}-toggle` : undefined}
-      >
-        {({ hovered }: PressableStateCallbackType & { hovered?: boolean }) => (
-          <>
-            <View style={settingsStyles.rowContent}>
-              <Text style={settingsStyles.rowTitle}>{label}</Text>
-            </View>
-            <View style={chevronStyle}>
-              <ThemedChevron
-                size={ICON_SIZE.sm}
-                uniProps={hovered ? hoveredIconColorMapping : mutedIconColorMapping}
-              />
-            </View>
-          </>
-        )}
-      </Pressable>
-      {expanded
-        ? Children.toArray(children).map((child, index) => (
-            <View key={isValidElement(child) ? child.key : index} style={settingsStyles.rowBorder}>
-              {child}
-            </View>
-          ))
-        : null}
+      />
+      {expanded ? (
+        <View style={styles.children}>
+          <NestedSettingsRows>
+            {Children.toArray(children).map((child, index) => (
+              <View
+                key={isValidElement(child) ? child.key : index}
+                style={settingsStyles.rowBorder}
+              >
+                {child}
+              </View>
+            ))}
+          </NestedSettingsRows>
+        </View>
+      ) : null}
     </View>
   );
 }
 
 const styles = StyleSheet.create((theme) => ({
-  headerHovered: {
-    backgroundColor: theme.colors.surface2,
-  },
-  headerPressed: {
-    backgroundColor: theme.colors.surface3,
-  },
-  // Optical: the chevron's ink sits about 4px inside its box whether it points right or down; this
-  // puts the ink on the card's trailing rail, where the switch and the reports' refresh buttons end.
-  chevron: { marginRight: -theme.spacing[1] },
-  chevronExpanded: {
-    transform: [{ rotate: "90deg" }],
+  // The revealed rows keep the card's rails; the tint is what groups them under their header.
+  children: {
+    backgroundColor: theme.colors.surface0,
   },
 }));

packages/app/src/components/settings/detail-row.tsx

@@ -0,0 +1,33 @@
+import { SettingsRowHeader } from "./row-header";
+
+interface SettingsDetailRowProps {
+  label: string;
+  /** What the detail is set to, so the row says it without being opened. */
+  summary?: string;
+  onPress: () => void;
+  /** A row that cannot be opened keeps its summary and drops the chevron. */
+  disabled?: boolean;
+  testID?: string;
+}
+
+/**
+ * A settings row that opens a detail, such as a sheet, for one setting. The label, a one-line
+ * summary of the current value and a chevron pointing right. Sits inside a `SettingsCard`.
+ */
+export function SettingsDetailRow({
+  label,
+  summary,
+  onPress,
+  disabled,
+  testID,
+}: SettingsDetailRowProps) {
+  return (
+    <SettingsRowHeader
+      label={label}
+      summary={summary}
+      onPress={onPress}
+      disabled={disabled}
+      testID={testID}
+    />
+  );
+}

packages/app/src/components/settings/headings/settings-info-tip.tsx

@@ -1,4 +1,4 @@
-import type { ReactNode } from "react";
+import type { ComponentType, ReactNode } from "react";
 import { Pressable, Text } from "react-native";
 import { useTranslation } from "react-i18next";
 import { Info } from "lucide-react-native";
@@ -6,7 +6,13 @@ import { StyleSheet, withUnistyles } from "react-native-unistyles";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import { ICON_SIZE, type Theme } from "@/styles/theme";
 
-const ThemedInfo = withUnistyles(Info);
+type TipIconComponent = ComponentType<{ size: number; color: string }>;
+
+function TipIcon({ icon: Icon, color }: { icon: TipIconComponent; color: string }) {
+  return <Icon size={ICON_SIZE.sm} color={color} />;
+}
+
+const ThemedTipIcon = withUnistyles(TipIcon);
 
 const mutedIconMapping = (theme: Theme) => ({ color: theme.colors.foregroundMuted });
 
@@ -14,27 +20,37 @@ interface SettingsInfoTipProps {
   /** Header the tip belongs to; used for the accessibility label. */
   title: string;
   info: ReactNode;
+  /** Defaults to the info icon. */
+  icon?: TipIconComponent;
+  /** Defaults to "About {title}". */
+  accessibilityLabel?: string;
   testID?: string;
 }
 
 /**
  * The one way a settings group or section explains itself: an info icon on the
  * header that opens a tooltip. Never a paragraph under the header — see
- * docs/design.md §7.
+ * docs/design.md §7. Rows use it the same way to keep secondary details on one line.
  */
-export function SettingsInfoTip({ title, info, testID }: SettingsInfoTipProps) {
+export function SettingsInfoTip({
+  title,
+  info,
+  icon = Info,
+  accessibilityLabel,
+  testID,
+}: SettingsInfoTipProps) {
   const { t } = useTranslation();
   return (
     <Tooltip delayDuration={0} enabledOnDesktop enabledOnMobile>
       <TooltipTrigger asChild>
         <Pressable
           accessibilityRole="button"
-          accessibilityLabel={t("settings.groupInfo", { title })}
+          accessibilityLabel={accessibilityLabel ?? t("settings.groupInfo", { title })}
           testID={testID}
           hitSlop={8}
           style={styles.button}
         >
-          <ThemedInfo size={ICON_SIZE.sm} uniProps={mutedIconMapping} />
+          <ThemedTipIcon icon={icon} uniProps={mutedIconMapping} />
         </Pressable>
       </TooltipTrigger>
       <TooltipContent side="top" align="start" offset={8}>

packages/app/src/components/settings/index.tsx

@@ -24,15 +24,23 @@ import { DropdownMenu, DropdownMenuContent, DropdownMenuItem } from "@/component
 import { DropdownTrigger } from "@/components/ui/dropdown-trigger";
 import { useIsCompactFormFactor } from "@/constants/layout";
 import { settingsStyles } from "@/styles/settings";
+import { ControlSizeProvider } from "@/components/ui/control-size";
+import { useSettingsRowLayout } from "./row-density";
 export { SettingsGroup } from "./headings/settings-group";
 export { SettingsSection } from "./headings/settings-section";
 export { SettingsCollapsibleRow } from "./collapsible-row";
+export { SettingsDetailRow } from "./detail-row";
+export { SettingsInfoTip } from "./headings/settings-info-tip";
 
-interface AppSettingsRowProps extends Omit<SettingsRowProps, "hint"> {
-  hint?: ReactNode;
+/** What app screens can add to a plugin-facing row: an accessory beside the label, such as an info tip. */
+interface AppRowExtras {
   labelAccessory?: ReactNode;
 }
 
+interface AppSettingsRowProps extends Omit<SettingsRowProps, "hint">, AppRowExtras {
+  hint?: ReactNode;
+}
+
 export function SettingsCard({ children, testID }: { children: ReactNode; testID?: string }) {
   return (
     <View style={settingsStyles.card} testID={testID}>
@@ -57,26 +65,32 @@ export function SettingsRow({
   testID,
 }: AppSettingsRowProps) {
   const compact = useIsCompactFormFactor();
-  const rowStyle = useMemo(() => [settingsStyles.row, compact && styles.compactRow], [compact]);
+  const layout = useSettingsRowLayout();
+  const rowStyle = useMemo(() => [layout.row, compact && styles.compactRow], [compact, layout]);
+  const accessoryTitleStyle = useMemo(() => [layout.title, styles.accessoryLabel], [layout]);
   return (
     <View style={rowStyle} testID={testID}>
       <View style={styles.label}>
         {labelAccessory ? (
           <View style={styles.labelRow}>
-            <Text style={[settingsStyles.rowTitle, styles.accessoryLabel]}>{label}</Text>
+            <Text style={accessoryTitleStyle}>{label}</Text>
             {labelAccessory}
           </View>
         ) : (
-          <Text style={settingsStyles.rowTitle}>{label}</Text>
+          <Text style={layout.title}>{label}</Text>
         )}
-        {typeof hint === "string" ? <Text style={settingsStyles.rowHint}>{hint}</Text> : hint}
+        {typeof hint === "string" ? <Text style={layout.hint}>{hint}</Text> : hint}
         {error ? (
           <Text accessibilityRole="alert" style={settingsStyles.rowError}>
             {error}
           </Text>
         ) : null}
       </View>
-      {children ? <View style={styles.control}>{children}</View> : null}
+      {children ? (
+        <View style={styles.control}>
+          <ControlSizeProvider size={layout.controlSize}>{children}</ControlSizeProvider>
+        </View>
+      ) : null}
     </View>
   );
 }
@@ -117,7 +131,7 @@ export function SettingsSelect<Value extends string>({
   onValueChange,
   disabled,
   ...row
-}: SettingsSelectProps<Value>) {
+}: SettingsSelectProps<Value> & AppRowExtras) {
   const selectedLabel = options.find((option) => option.value === value)?.label ?? value;
   return (
     <SettingsRow {...row}>
@@ -152,7 +166,7 @@ export function SettingsInput({
   secureTextEntry,
   ref,
   ...row
-}: SettingsInputProps) {
+}: SettingsInputProps & AppRowExtras) {
   const compact = useIsCompactFormFactor();
   const input = useRef<EditingTextInputHandle>(null);
   useImperativeHandle(
@@ -175,7 +189,7 @@ export function SettingsInput({
         editable={!disabled}
         secureTextEntry={secureTextEntry}
         accessibilityLabel={row.label}
-        size={compact ? "md" : "sm"}
+        size={compact ? "md" : undefined}
         style={styles.input}
       />
     </SettingsRow>
@@ -185,7 +199,7 @@ export function SettingsInput({
 export function SettingsAction({ actionLabel, onPress, disabled, ...row }: SettingsActionProps) {
   return (
     <SettingsRow {...row}>
-      <Button variant="outline" size="sm" onPress={onPress} disabled={disabled}>
+      <Button variant="outline" onPress={onPress} disabled={disabled}>
         {actionLabel}
       </Button>
     </SettingsRow>

packages/app/src/components/settings/row-density.browser.test.tsx

@@ -0,0 +1,77 @@
+import React, { act } from "react";
+import { createRoot, type Root } from "react-dom/client";
+import { afterEach, describe, expect, it } from "vitest";
+import { Button } from "@/components/ui/button";
+import { SettingsCard, SettingsCollapsibleRow, SettingsRow } from "@/components/settings";
+
+let root: Root | null = null;
+let container: HTMLDivElement | null = null;
+
+afterEach(() => {
+  act(() => root?.unmount());
+  container?.remove();
+  root = null;
+  container = null;
+});
+
+function mountRows() {
+  container = document.createElement("div");
+  document.body.appendChild(container);
+  root = createRoot(container);
+  act(() =>
+    root?.render(
+      <SettingsCard>
+        <SettingsRow label="Card row" testID="card-row">
+          <Button variant="outline" testID="card-button">
+            Download
+          </Button>
+        </SettingsRow>
+        <SettingsCollapsibleRow label="Group" defaultExpanded testID="group">
+          <SettingsRow label="Nested with a button" testID="nested-with-button">
+            <Button variant="outline" testID="nested-button">
+              Download
+            </Button>
+          </SettingsRow>
+          <SettingsRow label="Nested without a button" testID="nested-without-button" />
+        </SettingsCollapsibleRow>
+      </SettingsCard>,
+    ),
+  );
+}
+
+function element(testID: string): HTMLElement {
+  const found = document.querySelector(`[data-testid="${testID}"]`);
+  if (!(found instanceof HTMLElement)) throw new Error(`Nothing rendered as ${testID}`);
+  return found;
+}
+
+function heightOf(testID: string): number {
+  return element(testID).getBoundingClientRect().height;
+}
+
+function titleFontSize(rowTestID: string, label: string): number {
+  const title = [...element(rowTestID).querySelectorAll("div")].find(
+    (node) => node.textContent === label && node.children.length === 0,
+  );
+  if (!title) throw new Error(`No title ${label}`);
+  return Number.parseFloat(getComputedStyle(title).fontSize);
+}
+
+describe("settings row density", () => {
+  it("lines up nested rows with and without a button, tighter than card rows", () => {
+    mountRows();
+
+    expect(heightOf("nested-with-button")).toBe(heightOf("nested-without-button"));
+    expect(heightOf("nested-with-button")).toBeLessThan(heightOf("card-row"));
+    expect(heightOf("group-toggle")).toBeGreaterThan(heightOf("nested-without-button"));
+  });
+
+  it("sizes nested text and controls one step below card rows", () => {
+    mountRows();
+
+    expect(heightOf("nested-button")).toBeLessThan(heightOf("card-button"));
+    expect(titleFontSize("nested-with-button", "Nested with a button")).toBeLessThan(
+      titleFontSize("card-row", "Card row"),
+    );
+  });
+});

packages/app/src/components/settings/row-density.tsx

@@ -0,0 +1,57 @@
+import { createContext, useContext, useMemo, type ReactNode } from "react";
+import type { StyleProp, TextStyle, ViewStyle } from "react-native";
+import { StyleSheet } from "react-native-unistyles";
+import { CONTROL_HEIGHTS } from "@/components/ui/control-geometry";
+import type { ContainedControlSize } from "@/components/ui/control-size";
+import { settingsStyles } from "@/styles/settings";
+
+// Rows revealed under a collapsible row belong to it, so they sit one step smaller than the rows
+// of the card: tighter padding, smaller text, smaller controls. The container decides; a row
+// never knows on its own that it is nested.
+const NestedRowsContext = createContext(false);
+
+export function NestedSettingsRows({ children }: { children: ReactNode }) {
+  return <NestedRowsContext.Provider value>{children}</NestedRowsContext.Provider>;
+}
+
+export interface SettingsRowLayout {
+  row: StyleProp<ViewStyle>;
+  title: StyleProp<TextStyle>;
+  hint: StyleProp<TextStyle>;
+  /** The size of the controls in the row's trailing slot. */
+  controlSize: ContainedControlSize;
+}
+
+/** How a row lays out where it is rendered: in a card, or nested under a collapsible row. */
+export function useSettingsRowLayout(): SettingsRowLayout {
+  const nested = useContext(NestedRowsContext);
+  return useMemo(
+    () =>
+      nested
+        ? {
+            row: [settingsStyles.row, styles.nestedRow],
+            title: [settingsStyles.rowTitle, styles.nestedText],
+            hint: [settingsStyles.rowHint, styles.nestedText],
+            controlSize: "xs",
+          }
+        : {
+            row: settingsStyles.row,
+            title: settingsStyles.rowTitle,
+            hint: settingsStyles.rowHint,
+            controlSize: "sm",
+          },
+    [nested],
+  );
+}
+
+const styles = StyleSheet.create((theme) => ({
+  // Every nested row is as tall as one holding an `xs` control, so rows with and without a
+  // trailing button line up.
+  nestedRow: {
+    paddingVertical: theme.spacing[2],
+    minHeight: CONTROL_HEIGHTS.tight + theme.spacing[2] * 2,
+  },
+  nestedText: {
+    fontSize: theme.fontSize.sm,
+  },
+}));

packages/app/src/components/settings/row-header.tsx

@@ -0,0 +1,113 @@
+import { ChevronRight } from "lucide-react-native";
+import { useCallback, useMemo } from "react";
+import { Text, View, type AccessibilityState, type PressableStateCallbackType } from "react-native";
+import { StyleSheet, withUnistyles } from "react-native-unistyles";
+import { mutedIconColorMapping } from "@/components/ui/icon-color";
+import { PressHighlight } from "@/components/ui/press-highlight";
+import { settingsStyles } from "@/styles/settings";
+import { ICON_SIZE, type Theme } from "@/styles/theme";
+import { useSettingsRowLayout } from "./row-density";
+
+const ThemedChevron = withUnistyles(ChevronRight);
+const hoveredIconColorMapping = (theme: Theme) => ({ color: theme.colors.foreground });
+
+type HoverState = PressableStateCallbackType & { hovered?: boolean };
+
+export interface SettingsRowHeaderProps {
+  label: string;
+  /** A short status shown before the chevron. */
+  summary?: string;
+  onPress: () => void;
+  disabled?: boolean;
+  /** Turns the chevron down, for a row whose children are revealed in place. */
+  expanded?: boolean;
+  accessibilityState?: AccessibilityState;
+  /** Props React Native Web does not derive from `accessibilityState`, such as `aria-expanded`. */
+  webAccessibilityProps?: Record<string, unknown> | null;
+  testID?: string;
+}
+
+/**
+ * The pressable line shared by settings rows that lead somewhere: a label, an optional summary and
+ * a trailing chevron. A collapsible row turns the chevron down; a row that opens a sheet keeps it
+ * pointing right.
+ */
+export function SettingsRowHeader({
+  label,
+  summary,
+  onPress,
+  disabled,
+  expanded = false,
+  accessibilityState,
+  webAccessibilityProps,
+  testID,
+}: SettingsRowHeaderProps) {
+  const layout = useSettingsRowLayout();
+  const rowStyle = useCallback(
+    ({ hovered, pressed }: HoverState) => [
+      layout.row,
+      !disabled && hovered && styles.hovered,
+      !disabled && pressed && styles.pressed,
+    ],
+    [disabled, layout],
+  );
+  const chevronStyle = useMemo(
+    () => [styles.chevron, expanded && styles.chevronExpanded],
+    [expanded],
+  );
+  return (
+    <PressHighlight
+      {...webAccessibilityProps}
+      accessibilityRole="button"
+      accessibilityLabel={summary ? `${label}, ${summary}` : label}
+      accessibilityState={accessibilityState}
+      disabled={disabled}
+      onPress={onPress}
+      style={rowStyle}
+      highlightStyle={styles.pressed}
+      testID={testID}
+    >
+      {({ hovered }: HoverState) => (
+        <>
+          <View style={settingsStyles.rowContent}>
+            <Text style={layout.title}>{label}</Text>
+          </View>
+          {summary ? (
+            <Text style={styles.summary} numberOfLines={1}>
+              {summary}
+            </Text>
+          ) : null}
+          {disabled ? null : (
+            <View style={chevronStyle}>
+              <ThemedChevron
+                size={ICON_SIZE.sm}
+                uniProps={hovered ? hoveredIconColorMapping : mutedIconColorMapping}
+              />
+            </View>
+          )}
+        </>
+      )}
+    </PressHighlight>
+  );
+}
+
+const styles = StyleSheet.create((theme) => ({
+  summary: {
+    flexShrink: 1,
+    color: theme.colors.foregroundMuted,
+    fontSize: theme.fontSize.sm,
+    marginRight: theme.spacing[2],
+  },
+  hovered: {
+    backgroundColor: theme.colors.surface2,
+  },
+  pressed: {
+    backgroundColor: theme.colors.surface3,
+  },
+  // Optical: the chevron's ink sits about 4px inside its box whether it points right or down; this
+  // puts the ink on the card's trailing rail, where the switch and the reports' refresh buttons end.
+  chevron: { marginRight: -theme.spacing[1] },
+  chevronExpanded: {
+    transform: [{ rotate: "90deg" }],
+  },
+}));

packages/app/src/components/sidebar-workspace-list.test.tsx

@@ -2,6 +2,7 @@
  * @vitest-environment jsdom
  */
 import { act, renderHook } from "@testing-library/react";
+import { createWorkspaceVisibilityPolicy } from "@/components/sidebar/sidebar-group-visibility";
 import { useLimitedSidebarGroup } from "@/components/sidebar/use-limited-sidebar-group";
 import type { DaemonClient } from "@getpaseo/client/internal/daemon-client";
 import type { WorkspaceScriptPayload } from "@getpaseo/protocol/messages";
@@ -486,6 +487,20 @@ describe("sidebar group visibility", () => {
     },
   );
 
+  it("treats placements without a hydrated entry as Done", () => {
+    const items = entries([...Array(8).fill("done"), "running", "done"]);
+    const hydrated = new Map(items.slice(0, 9).map((item) => [item.workspaceKey, item]));
+    for (const entriesByKey of [new Map(), hydrated]) {
+      const { result } = renderHook(() =>
+        useLimitedSidebarGroup(items, createWorkspaceVisibilityPolicy(entriesByKey)),
+      );
+      expect(result.current.canToggle).toBe(true);
+      expect(names(result.current.visibleItems)).toEqual(
+        entriesByKey.size === 0 ? names(items.slice(0, 7)) : [...names(items.slice(0, 7)), "row-9"],
+      );
+    }
+  });
+
   it("shows eight active rows once with no redundant toggle", () => {
     const items = entries([
       "running",

packages/app/src/components/sidebar-workspace-list.tsx

@@ -30,7 +30,7 @@ import {
   type ActiveWorkspaceSelection,
 } from "@/stores/navigation-active-workspace-store";
 import { StyleSheet, withUnistyles } from "react-native-unistyles";
-import { density, densityIconBox } from "@/styles/density";
+import { density, densityIconBox, densityIconProps } from "@/styles/density";
 import type { Theme } from "@/styles/theme";
 import type { SidebarSurfaceBackdrop } from "@/styles/surface-backdrop";
 import { getSidebarRowBackdrop } from "@/components/sidebar/sidebar-row-backdrop";
@@ -99,6 +99,7 @@ import {
 import { useLongPressDragInteraction } from "@/components/sidebar/use-long-press-drag-interaction";
 import { SidebarSectionHeader } from "@/components/sidebar/sidebar-section-header";
 import { SidebarGroupToggleRow } from "@/components/sidebar/sidebar-group-toggle-row";
+import { createWorkspaceVisibilityPolicy } from "@/components/sidebar/sidebar-group-visibility";
 import { useLimitedSidebarGroup } from "@/components/sidebar/use-limited-sidebar-group";
 import {
   SidebarWorkspaceRowFrame,
@@ -462,12 +463,12 @@ const openInNewWindowLeadingIcon = (
   <ThemedExternalLink size={14} uniProps={foregroundMutedColorMapping} />
 );
 
+const kebabTriggerIconProps = densityIconProps("sm", foregroundMutedColorMapping);
+const kebabTriggerIconHoveredProps = densityIconProps("sm", foregroundColorMapping);
+
 function renderKebabTriggerIcon({ hovered }: { hovered?: boolean }) {
   return (
-    <ThemedMoreVertical
-      size={14}
-      uniProps={hovered ? foregroundColorMapping : foregroundMutedColorMapping}
-    />
+    <ThemedMoreVertical uniProps={hovered ? kebabTriggerIconHoveredProps : kebabTriggerIconProps} />
   );
 }
 
@@ -1593,11 +1594,7 @@ function ProjectBlock({
   onToggleWorkspacePin: ToggleSidebarWorkspacePin;
 }) {
   const visibilityPolicy = useMemo(
-    () => ({
-      kind: "workspaces" as const,
-      getStatusBucket: (workspace: SidebarWorkspacePlacement) =>
-        workspaceEntriesByKey.get(workspace.workspaceKey)!.statusBucket,
-    }),
+    () => createWorkspaceVisibilityPolicy<SidebarWorkspacePlacement>(workspaceEntriesByKey),
     [workspaceEntriesByKey],
   );
   const {
@@ -2708,8 +2705,12 @@ const styles = StyleSheet.create((theme) => ({
     marginRight: -6,
   },
   projectKebabButton: {
-    width: 24,
-    height: 24,
+    // Larger on compact so the kebab is an easy tap target. The negative margins keep its
+    // dots on the same rail as the 24px desktop box and the row at its 44px height.
+    width: { xs: 32, md: 24 },
+    height: { xs: 32, md: 24 },
+    marginRight: { xs: -4, md: 0 },
+    marginVertical: { xs: -4, md: 0 },
     borderRadius: theme.borderRadius.md,
     alignItems: "center",
     justifyContent: "center",

packages/app/src/components/sidebar/sidebar-group-visibility.ts

@@ -4,6 +4,18 @@ export type SidebarGroupVisibilityPolicy<T> =
   | { kind: "pinned" }
   | { kind: "workspaces"; getStatusBucket: (item: T) => SidebarStateBucket };
 
+// A placement can outrun its entry: a retained sidebar that is inactive (compact layout with the
+// sidebar closed) or still waiting for sessions keeps an empty entry map. A missing entry renders
+// no row, so it counts as Done and claims no slot past the limit.
+export function createWorkspaceVisibilityPolicy<T extends { workspaceKey: string }>(
+  entriesByKey: ReadonlyMap<string, { statusBucket: SidebarStateBucket }>,
+): SidebarGroupVisibilityPolicy<T> {
+  return {
+    kind: "workspaces",
+    getStatusBucket: (item) => entriesByKey.get(item.workspaceKey)?.statusBucket ?? "done",
+  };
+}
+
 export function selectSidebarGroupVisibility<T>(
   items: readonly T[],
   expanded: boolean,

packages/app/src/components/sidebar/sidebar-workspace-menu.tsx

@@ -17,6 +17,7 @@ import { isWeb } from "@/constants/platform";
 import { getForgePresentation, normalizeForge } from "@/git/forge";
 import type { SidebarWorkspaceEntry } from "@/hooks/use-sidebar-workspaces-list";
 import { useAppSettings } from "@/hooks/use-settings";
+import { densityIconProps } from "@/styles/density";
 import type { Theme } from "@/styles/theme";
 import type { ShortcutKey } from "@/utils/format-shortcut";
 import {
@@ -70,13 +71,11 @@ const archiveLeadingIcon = <ThemedArchive size={14} uniProps={foregroundMutedCol
 const pinLeadingIcon = <ThemedPin size={14} uniProps={foregroundMutedColorMapping} />;
 const unpinLeadingIcon = <ThemedPinOff size={14} uniProps={foregroundMutedColorMapping} />;
 
+const triggerIconProps = densityIconProps("sm", foregroundMutedColorMapping);
+const triggerIconHoveredProps = densityIconProps("sm", foregroundColorMapping);
+
 function renderTriggerIcon({ hovered }: { hovered?: boolean }) {
-  return (
-    <ThemedMoreVertical
-      size={14}
-      uniProps={hovered ? foregroundColorMapping : foregroundMutedColorMapping}
-    />
-  );
+  return <ThemedMoreVertical uniProps={hovered ? triggerIconHoveredProps : triggerIconProps} />;
 }
 
 export interface SidebarWorkspaceMenuProps {
@@ -439,12 +438,18 @@ function triggerStyle({ hovered = false }: PressableStateCallbackType & { hovere
 
 const styles = StyleSheet.create((theme) => ({
   trigger: {
-    padding: 2,
+    // Larger on compact so the kebab is an easy tap target.
+    width: { xs: 32, md: 18 },
+    height: { xs: 32, md: 18 },
+    alignItems: "center",
+    justifyContent: "center",
     borderRadius: 4,
     marginLeft: 2,
+    // Center the compact box on the 20px title line it is anchored to.
+    marginTop: { xs: -6, md: 0 },
     // MoreVertical paints only around the center of its SVG. Keep the padded hit box, but
     // pull the painted dots through that unused view-box space onto the trailing-content rail.
-    marginRight: -7,
+    marginRight: { xs: -14, md: -7 },
   },
   triggerHovered: {
     backgroundColor: theme.colors.surface2,

packages/app/src/components/ui/autocomplete-popover.tsx

@@ -5,9 +5,9 @@ import {
   useRef,
   useState,
   type ReactElement,
-  type RefObject,
+  type ReactNode,
 } from "react";
-import { View, useWindowDimensions } from "react-native";
+import { View, useWindowDimensions, type StyleProp, type ViewStyle } from "react-native";
 import { Portal } from "@gorhom/portal";
 import Animated, { useAnimatedReaction, useAnimatedStyle } from "react-native-reanimated";
 import { scheduleOnRN } from "react-native-worklets";
@@ -32,7 +32,8 @@ interface RelativeAnchorRect {
 
 interface AutocompletePopoverProps {
   visible: boolean;
-  anchorRef: RefObject<View | null>;
+  children: ReactNode;
+  anchorStyle?: StyleProp<ViewStyle>;
   options: readonly AutocompleteOption[];
   selectedIndex: number;
   onSelect: (option: AutocompleteOption) => void;
@@ -44,7 +45,8 @@ interface AutocompletePopoverProps {
 
 export function AutocompletePopover({
   visible,
-  anchorRef,
+  children,
+  anchorStyle,
   options,
   selectedIndex,
   onSelect,
@@ -55,6 +57,7 @@ export function AutocompletePopover({
 }: AutocompletePopoverProps): ReactElement | null {
   "use no memo";
   // React Compiler memoizes effect captures by reading SharedValue.value during render.
+  const anchorRef = useRef<View>(null);
   const [relativeAnchorRect, setRelativeAnchorRect] = useState<RelativeAnchorRect | null>(null);
   const windowDimensions = useWindowDimensions();
   const safeAreaInsets = useSafeAreaInsets();
@@ -137,25 +140,29 @@ export function AutocompletePopover({
     [anchorY, reservedLift, safeAreaInsets.top],
   );
 
-  if (!visible || !relativeAnchorRect || !baseStyle) return null;
-  if (options.length > 0 && selectedIndex < 0) return null;
+  const showPopover = canMeasure && relativeAnchorRect && baseStyle;
 
   // The translate view is the popover's own frame, so it lifts only the popover.
   return (
-    <Portal hostName={portalHostName}>
-      <KeyboardTranslateView {...anchor.translation} style={baseStyle}>
-        <Animated.View testID="composer-autocomplete-popover" style={heightStyle}>
-          <Autocomplete
-            options={options}
-            selectedIndex={selectedIndex}
-            onSelect={onSelect}
-            isLoading={isLoading}
-            errorMessage={errorMessage}
-            loadingText={loadingText}
-            emptyText={emptyText}
-          />
-        </Animated.View>
-      </KeyboardTranslateView>
-    </Portal>
+    <View ref={anchorRef} onLayout={remeasure} style={anchorStyle} collapsable={false}>
+      {children}
+      {showPopover ? (
+        <Portal hostName={portalHostName}>
+          <KeyboardTranslateView {...anchor.translation} style={baseStyle}>
+            <Animated.View testID="composer-autocomplete-popover" style={heightStyle}>
+              <Autocomplete
+                options={options}
+                selectedIndex={selectedIndex}
+                onSelect={onSelect}
+                isLoading={isLoading}
+                errorMessage={errorMessage}
+                loadingText={loadingText}
+                emptyText={emptyText}
+              />
+            </Animated.View>
+          </KeyboardTranslateView>
+        </Portal>
+      ) : null}
+    </View>
   );
 }

packages/app/src/components/ui/autocomplete.tsx

@@ -247,14 +247,16 @@ export function Autocomplete({
     <View style={styles.outerWrapper}>
       {selectedOption?.kind === "command" && selectedOption.description ? (
         <View style={styles.detailCard}>
-          <Text style={styles.detailLabel}>
+          <Text style={styles.detailLabel} numberOfLines={1}>
             {removeBoltGlyphs(selectedOption.label) ?? selectedOption.label}
           </Text>
-          <Text style={styles.detailDescription}>
+          <Text style={styles.detailDescription} numberOfLines={2} ellipsizeMode="tail">
             {removeBoltGlyphs(selectedOption.description)}
           </Text>
           {selectedOption.detail ? (
-            <Text style={styles.detailHint}>{removeBoltGlyphs(selectedOption.detail)}</Text>
+            <Text style={styles.detailHint} numberOfLines={1}>
+              {removeBoltGlyphs(selectedOption.detail)}
+            </Text>
           ) : null}
         </View>
       ) : null}
@@ -293,6 +295,9 @@ const styles = StyleSheet.create((theme: Theme) => ({
     gap: theme.spacing[1],
   },
   detailCard: {
+    flexShrink: 1,
+    minHeight: 0,
+    overflow: "hidden",
     backgroundColor: theme.colors.surface1,
     borderWidth: theme.borderWidth[1],
     borderColor: theme.colors.borderAccent,
@@ -318,7 +323,8 @@ const styles = StyleSheet.create((theme: Theme) => ({
   },
   container: {
     flexShrink: 1,
-    minHeight: 0,
+    // Keep a complete selectable row (36), list padding (8), and borders (2).
+    minHeight: 46,
     backgroundColor: theme.colors.surface1,
     borderWidth: theme.borderWidth[1],
     borderColor: theme.colors.borderAccent,

packages/app/src/components/ui/button.tsx

@@ -1,4 +1,5 @@
 import { LoadingSpinner } from "@/components/ui/loading-spinner";
+import { useContainedControlSize } from "@/components/ui/control-size";
 import {
   default as React,
   useCallback,
@@ -162,7 +163,7 @@ const styles = StyleSheet.create((theme) => {
 export function Button({
   children,
   variant = "secondary",
-  size = "md",
+  size: sizeProp,
   leftIcon,
   trailing,
   style,
@@ -185,6 +186,8 @@ export function Button({
   }
 >) {
   const [hovered, setHovered] = useState(false);
+  const containedSize = useContainedControlSize();
+  const size = sizeProp ?? containedSize ?? "md";
   const isDisabled = disabled || loading;
 
   let variantStyle: ViewStyle;

packages/app/src/components/ui/control-geometry.test.ts

@@ -81,6 +81,8 @@ describe("control geometry", () => {
   it("keeps field text sizing tied to control size", () => {
     const geometry = createControlGeometry(theme);
 
+    expect(geometry.fieldTextXs.fontSize).toBe(12);
+    expect(geometry.fieldTextXs.lineHeight).toBe(17);
     expect(geometry.fieldTextSm.fontSize).toBe(14);
     expect(geometry.fieldTextSm.lineHeight).toBe(20);
     expect(geometry.fieldTextMd.fontSize).toBe(14);
@@ -95,6 +97,13 @@ describe("control geometry", () => {
     const geometry = createControlGeometry(theme);
     const borderWidth = theme.borderWidth[1];
 
+    expect(geometry.fieldControlXs.minHeight).toBe(28);
+    expect(
+      geometry.fieldTextXs.lineHeight +
+        geometry.fieldControlXs.paddingVertical * 2 +
+        borderWidth * 2,
+    ).toBe(geometry.fieldControlXs.minHeight);
+
     expect(geometry.fieldControlSm.minHeight).toBe(32);
     expect(geometry.fieldControlSm.paddingVertical).toBe(5);
     expect(

packages/app/src/components/ui/control-geometry.ts

@@ -2,7 +2,7 @@ import type { StyleProp, ViewStyle } from "react-native";
 import { ICON_SIZE, type Theme } from "@/styles/theme";
 
 export type ButtonControlSize = "xs" | "sm" | "md" | "lg";
-export type FieldControlSize = "sm" | "md";
+export type FieldControlSize = "xs" | "sm" | "md";
 export type SegmentedControlSize = "xs" | "sm" | "md";
 export type ControlInteractionPhase = "rest" | "hover" | "active";
 
@@ -188,8 +188,19 @@ export function resolveControlInteractionStyles(
 
 export function createControlGeometry(theme: Theme) {
   const controlBorderWidth = theme.borderWidth[1];
+  const fieldTextXsLineHeight = fieldLineHeight(theme.fontSize.sm);
   const fieldTextSmLineHeight = fieldLineHeight(theme.fontSize.base);
   const fieldTextMdLineHeight = fieldLineHeight(theme.fontSize.base);
+  const fieldControlXs = {
+    minHeight: CONTROL_HEIGHTS.tight,
+    paddingHorizontal: theme.spacing[2],
+    paddingVertical: fieldVerticalPadding(
+      CONTROL_HEIGHTS.tight,
+      fieldTextXsLineHeight,
+      controlBorderWidth,
+    ),
+    borderRadius: theme.borderRadius.md,
+  };
   const fieldControlSm = {
     minHeight: CONTROL_HEIGHTS.compact,
     paddingHorizontal: theme.spacing[3],
@@ -210,6 +221,10 @@ export function createControlGeometry(theme: Theme) {
     ),
     borderRadius: theme.borderRadius.lg,
   };
+  const fieldTextXs = {
+    fontSize: theme.fontSize.sm,
+    lineHeight: fieldTextXsLineHeight,
+  };
   const fieldTextSm = {
     fontSize: theme.fontSize.base,
     lineHeight: fieldTextSmLineHeight,
@@ -252,6 +267,10 @@ export function createControlGeometry(theme: Theme) {
       fontSize: theme.fontSize.sm,
     },
     alert,
+    formTextInputXs: {
+      ...fieldControlXs,
+      ...fieldTextXs,
+    },
     formTextInputSm: {
       ...fieldControlSm,
       ...fieldTextSm,
@@ -264,8 +283,10 @@ export function createControlGeometry(theme: Theme) {
       ...fieldControlMd,
       ...fieldTextMd,
     },
+    fieldControlXs,
     fieldControlSm,
     fieldControlMd,
+    fieldTextXs,
     fieldTextSm,
     fieldTextMd,
     controlRest: {

packages/app/src/components/ui/control-size.tsx

@@ -0,0 +1,23 @@
+import { createContext, useContext, type ReactNode } from "react";
+
+/** The control sizes a container can ask of the controls placed in it. */
+export type ContainedControlSize = "xs" | "sm";
+
+// A row decides how big its controls are, so a button or field placed in it needs no size of
+// its own. A size passed to the control still wins.
+const ControlSizeContext = createContext<ContainedControlSize | null>(null);
+
+export function ControlSizeProvider({
+  size,
+  children,
+}: {
+  size: ContainedControlSize;
+  children: ReactNode;
+}) {
+  return <ControlSizeContext.Provider value={size}>{children}</ControlSizeContext.Provider>;
+}
+
+/** The size the surrounding container asks for, or null outside one. */
+export function useContainedControlSize(): ContainedControlSize | null {
+  return useContext(ControlSizeContext);
+}

packages/app/src/components/ui/dropdown-trigger.tsx

@@ -9,6 +9,7 @@ import {
 } from "@/components/ui/control-geometry";
 import type { Theme } from "@/styles/theme";
 import { DropdownMenuTrigger, type DropdownMenuTriggerProps } from "@/components/ui/dropdown-menu";
+import { useContainedControlSize } from "@/components/ui/control-size";
 
 const ThemedChevronDown = withUnistyles(ChevronDown);
 
@@ -32,10 +33,12 @@ interface DropdownTriggerProps extends Omit<DropdownMenuTriggerProps, "children"
 export function DropdownTrigger({
   children,
   leading,
-  size = "sm",
+  size: sizeProp,
   disabled,
   ...props
 }: DropdownTriggerProps): ReactElement {
+  const containedSize = useContainedControlSize();
+  const size = sizeProp ?? containedSize ?? "sm";
   let sizeStyle: ViewStyle;
   if (size === "xs") {
     sizeStyle = styles.xs;

packages/app/src/components/ui/edge-fade.tsx

@@ -4,9 +4,10 @@ import Svg, { Defs, LinearGradient as SvgLinearGradient, Rect, Stop } from "reac
 import { withUnistyles } from "react-native-unistyles";
 import type { Theme } from "@/styles/theme";
 
-type EdgeFadeBackdrop = "surface0" | "surfaceWorkspace";
+type EdgeFadeBackdrop = "surface0" | "surfaceWorkspace" | "surface3";
 
 const backdropColorMappings: Record<EdgeFadeBackdrop, (theme: Theme) => { color: string }> = {
+  surface3: (theme) => ({ color: theme.colors.surface3 }),
   surface0: (theme) => ({ color: theme.colors.surface0 }),
   surfaceWorkspace: (theme) => ({ color: theme.colors.surfaceWorkspace }),
 };

packages/app/src/components/ui/form-field.tsx

@@ -23,6 +23,16 @@ import {
   resolveControlInteractionStyles,
   type FieldControlSize,
 } from "@/components/ui/control-geometry";
+import { useContainedControlSize } from "@/components/ui/control-size";
+
+const FIELD_CHROME = { xs: "chromeXs", sm: "chromeSm", md: "chromeMd" } as const satisfies Record<
+  FieldControlSize,
+  string
+>;
+const FIELD_TEXT = { xs: "inputXs", sm: "inputSm", md: "inputMd" } as const satisfies Record<
+  FieldControlSize,
+  string
+>;
 
 interface FieldProps {
   label: string;
@@ -159,11 +169,13 @@ function assignTextInputRef(
 }
 
 export const FormTextInput = forwardRef<EditingTextInputHandle, FormTextInputProps>(
-  function FormTextInput({ size = "md", style, onFocus, onBlur, editable, ...props }, ref) {
+  function FormTextInput({ size: sizeProp, style, onFocus, onBlur, editable, ...props }, ref) {
     const [focused, setFocused] = useState(false);
+    const containedSize = useContainedControlSize();
+    const size = sizeProp ?? containedSize ?? "md";
     const isDisabled = editable === false;
-    const chromeSizeStyle = size === "sm" ? formInputStyles.chromeSm : formInputStyles.chromeMd;
-    const inputSizeStyle = size === "sm" ? formInputStyles.inputSm : formInputStyles.inputMd;
+    const chromeSizeStyle = formInputStyles[FIELD_CHROME[size]];
+    const inputSizeStyle = formInputStyles[FIELD_TEXT[size]];
     const splitStyle = useMemo(() => splitFormTextInputStyle(style), [style]);
     const setInputRef = useCallback(
       (node: EditingTextInputHandle | null) => {
@@ -262,6 +274,9 @@ const formInputStyles = StyleSheet.create((theme) => {
     chrome: {
       backgroundColor: theme.colors.surface2,
     },
+    chromeXs: {
+      ...geometry.fieldControlXs,
+    },
     chromeSm: {
       ...geometry.fieldControlSm,
     },
@@ -289,6 +304,9 @@ const formInputStyles = StyleSheet.create((theme) => {
       outlineColor: "transparent",
       outlineWidth: 0,
     },
+    inputXs: {
+      ...geometry.fieldTextXs,
+    },
     inputSm: {
       ...geometry.fieldTextSm,
     },

packages/app/src/components/ui/icon-color.ts

@@ -1,5 +1,9 @@
 import type { Theme } from "@/styles/theme";
 
+export const foregroundIconColorMapping = (theme: Theme) => ({
+  color: theme.colors.foreground,
+});
+
 export const mutedIconColorMapping = (theme: Theme) => ({
   color: theme.colors.foregroundMuted,
 });

packages/app/src/components/ui/isolated-bottom-sheet-modal/index.test.tsx

@@ -58,6 +58,7 @@ vi.mock("@gorhom/bottom-sheet", async () => {
 });
 
 import { IsolatedBottomSheetModal, type ContextBridge } from ".";
+import { useAnimatedLayout } from "@gorhom/bottom-sheet/src/hooks/useAnimatedLayout";
 import { useIsInsideBottomSheet } from "@/components/ui/bottom-sheet-scope";
 
 /** Renders whatever the portal is currently holding, from its own place in the tree. */
@@ -200,3 +201,35 @@ describe("IsolatedBottomSheetModal context bridging", () => {
     ).toEqual(["false", "true"]);
   });
 });
+
+describe("bottom sheet layout subscription", () => {
+  it("stops updating a dismissed sheet when the window resizes", () => {
+    const container = document.createElement("div");
+    const root = createRoot(container);
+    let layout: ReturnType<typeof useAnimatedLayout> | undefined;
+    const viewport = document.documentElement;
+    const originalWidth = Object.getOwnPropertyDescriptor(viewport, "clientWidth");
+    function resize(width: number) {
+      Object.defineProperty(viewport, "clientWidth", { configurable: true, value: width });
+      act(() => window.dispatchEvent(new Event("resize")));
+    }
+    function LayoutProbe() {
+      layout = useAnimatedLayout(undefined, 0, 0);
+      return null;
+    }
+    try {
+      act(() => root.render(<LayoutProbe />));
+      if (!layout) throw new Error("Sheet layout did not mount");
+      const mountedLayout = layout;
+      resize(640);
+      expect(mountedLayout.get().window.width).toBe(640);
+      act(() => root.render(null));
+      resize(960);
+      expect(mountedLayout.get().window.width).toBe(640);
+    } finally {
+      act(() => root.unmount());
+      if (originalWidth) Object.defineProperty(viewport, "clientWidth", originalWidth);
+      else Reflect.deleteProperty(viewport, "clientWidth");
+    }
+  });
+});

packages/app/src/components/ui/segmented-control.tsx

@@ -7,6 +7,7 @@ import {
   segmentedIconSize,
   type SegmentedControlSize,
 } from "@/components/ui/control-geometry";
+import { useContainedControlSize } from "@/components/ui/control-size";
 import type { Theme } from "@/styles/theme";
 
 type SegmentedControlIconRenderer = (props: { color: string; size: number }) => ReactNode;
@@ -48,11 +49,13 @@ export function SegmentedControl<T extends string>({
   options,
   value,
   onValueChange,
-  size = "md",
+  size: sizeProp,
   hideLabels = false,
   style,
   testID,
 }: SegmentedControlProps<T>) {
+  const containedSize = useContainedControlSize();
+  const size = sizeProp ?? containedSize ?? "md";
   const sizeStyles = {
     xs: { container: styles.containerXs, segment: styles.segmentXs, label: styles.labelXs },
     sm: { container: styles.containerSm, segment: styles.segmentSm, label: styles.labelSm },

packages/app/src/components/user-message/index.tsx

@@ -0,0 +1,89 @@
+import { useState, useCallback, useMemo, type ReactNode } from "react";
+import { View, type LayoutChangeEvent } from "react-native";
+import { StyleSheet } from "react-native-unistyles";
+import { useTranslation } from "react-i18next";
+import type { AgentMessage } from "@getpaseo/protocol/agent-message";
+import { Button } from "@/components/ui/button";
+import { EdgeFade } from "@/components/ui/edge-fade";
+import { useProviderIcon } from "@/components/provider-icons";
+import { useSessionStore } from "@/stores/session-store";
+import { navigateToAgent } from "@/utils/navigate-to-agent";
+
+const PREVIEW_HEIGHT = 240;
+
+export function MessagePreview({ children }: { children: ReactNode }) {
+  const { t } = useTranslation();
+  const [expanded, setExpanded] = useState(false);
+  const [height, setHeight] = useState(0);
+  const overflowing = height > PREVIEW_HEIGHT;
+  const measure = useCallback(
+    (event: LayoutChangeEvent) => setHeight(event.nativeEvent.layout.height),
+    [],
+  );
+  const toggle = useCallback(() => setExpanded((value) => !value), []);
+  const accessibilityState = useMemo(() => ({ expanded }), [expanded]);
+  return (
+    <>
+      <View style={!expanded && styles.preview}>
+        <View style={styles.body} onLayout={measure}>
+          {children}
+        </View>
+        {overflowing && !expanded ? (
+          <EdgeFade edge="bottom" solidFraction={0} backdrop="surface3" style={styles.fade} />
+        ) : null}
+      </View>
+      {overflowing ? (
+        <Button
+          variant="ghost"
+          size="sm"
+          style={styles.toggle}
+          accessibilityState={accessibilityState}
+          onPress={toggle}
+        >
+          {t(expanded ? "turnSummary.showLess" : "turnSummary.showMore")}
+        </Button>
+      ) : null}
+    </>
+  );
+}
+
+export function MessageSender({
+  sender,
+  serverId,
+}: {
+  sender: AgentMessage["sender"];
+  serverId?: string;
+}) {
+  const { t } = useTranslation();
+  const host = sender.serverId ?? serverId;
+  const agent = useSessionStore((state) => {
+    const session = host ? state.sessions[host] : undefined;
+    return session?.agents.get(sender.id) ?? session?.agentDetails.get(sender.id);
+  });
+  const ProviderIcon = useProviderIcon(agent?.provider ?? "", host);
+  const renderProviderIcon = useCallback(
+    (color: string) => <ProviderIcon size={16} color={color} />,
+    [ProviderIcon],
+  );
+  const openSender = useCallback(() => {
+    if (host) navigateToAgent({ serverId: host, agentId: sender.id });
+  }, [host, sender.id]);
+  return (
+    <Button
+      variant="ghost"
+      size="sm"
+      leftIcon={renderProviderIcon}
+      disabled={!host}
+      onPress={openSender}
+    >
+      {t("turnSummary.sentBy", { name: agent?.title ?? sender.title ?? sender.id })}
+    </Button>
+  );
+}
+
+const styles = StyleSheet.create((theme) => ({
+  preview: { maxHeight: PREVIEW_HEIGHT, overflow: "hidden" },
+  body: { flexShrink: 0 },
+  toggle: { alignSelf: "flex-start", paddingHorizontal: 0, minHeight: 0, borderWidth: 0 },
+  fade: { position: "absolute", bottom: 0, left: 0, right: 0, height: theme.spacing[12] },
+}));

packages/app/src/composer/index.tsx

@@ -55,7 +55,11 @@ import {
 } from "@/composer/agent-controls";
 import { ContextWindowMeter } from "@/components/context-window-meter";
 import { useImageAttachmentPicker } from "@/hooks/use-image-attachment-picker";
-import { selectAgentTurnPresentation, useSessionStore } from "@/stores/session-store";
+import {
+  selectAgentSentMessages,
+  selectAgentTurnPresentation,
+  useSessionStore,
+} from "@/stores/session-store";
 import { useFilePicker } from "@/hooks/use-file-picker";
 import { useFileDrop } from "@/components/file-drop/use-file-drop";
 import type { DroppedItem } from "@/components/file-drop/types";
@@ -118,6 +122,7 @@ import { useKeyboardActionHandler } from "@/hooks/use-keyboard-action-handler";
 import type { KeyboardActionDefinition } from "@/keyboard/keyboard-action-dispatcher";
 import type { MessageInputKeyboardActionKind } from "@/keyboard/actions";
 import { submitAgentInput } from "@/composer/submit";
+import { ComposerRecall } from "@/composer/recall";
 import { createMessageSubmissionWriter } from "@/composer/submission/writer";
 import { ComposerKeyboardScopeProvider, useComposerKeyboardScope } from "@/composer/keyboard-scope";
 import { useAppSettings } from "@/hooks/use-settings";
@@ -995,20 +1000,24 @@ interface ComposerAutocompleteHandle {
 function ComposerAutocompleteBinding({
   text,
   cursor,
+  recall,
   configuration,
   inputRef,
-  anchorRef,
+  children,
+  anchorStyle,
   show,
   ref,
 }: {
   text: ComposerTextSource;
   cursor: StoreApi<number>;
+  recall: ComposerRecall;
   configuration: Omit<
     Parameters<typeof useAgentAutocomplete>[0],
     "userInput" | "cursorIndex" | "onAutocompleteApplied"
   >;
   inputRef: React.RefObject<MessageInputRef | null>;
-  anchorRef: React.RefObject<View | null>;
+  children: React.ReactNode;
+  anchorStyle: React.ComponentProps<typeof View>["style"];
   show: boolean;
   ref: React.Ref<ComposerAutocompleteHandle>;
 }) {
@@ -1020,9 +1029,11 @@ function ComposerAutocompleteBinding({
     cursorIndex: Math.min(cursorIndex, userInput.length),
     onAutocompleteApplied: () => inputRef.current?.focus(),
   });
+  // A recalled message is sent as is; its leading `/command` must not open the picker.
+  const isShown = show && !recall.isShowing(userInput);
   const handleKeyPress = autocomplete.onKeyPress;
-  useImperativeHandle(ref, () => ({ onKeyPress: (event) => show && handleKeyPress(event) }), [
-    show,
+  useImperativeHandle(ref, () => ({ onKeyPress: (event) => isShown && handleKeyPress(event) }), [
+    isShown,
     handleKeyPress,
   ]);
   const selectOption = autocomplete.onSelectOption;
@@ -1032,8 +1043,8 @@ function ComposerAutocompleteBinding({
   );
   return (
     <ComposerAutocomplete
-      visible={autocomplete.isVisible && show}
-      anchorRef={anchorRef}
+      visible={autocomplete.isVisible && isShown}
+      anchorStyle={anchorStyle}
       options={autocomplete.options}
       selectedIndex={autocomplete.selectedIndex}
       onSelect={onSelect}
@@ -1041,7 +1052,9 @@ function ComposerAutocompleteBinding({
       errorMessage={autocomplete.errorMessage}
       loadingText={autocomplete.loadingText}
       emptyText={autocomplete.emptyText}
-    />
+    >
+      {children}
+    </ComposerAutocomplete>
   );
 }
 
@@ -1362,6 +1375,7 @@ function ComposerContentImpl({
   );
   useEffect(() => () => cursorPublication.cancel(), [cursorPublication]);
   const autocompleteRef = useRef<ComposerAutocompleteHandle>(null);
+  const recall = useMemo(() => new ComposerRecall(), []);
   const [isProcessing, setIsProcessing] = useState(false);
   const [pendingFiles, setPendingFiles] = useState<PendingFileAttachment[]>([]);
   const nextPendingFileId = useRef(0);
@@ -1981,10 +1995,19 @@ function ComposerContentImpl({
 
   const hasSendableContent = hasText || selectedAttachments.length > 0;
 
-  // Handle keyboard navigation for command autocomplete.
+  // An open autocomplete owns the arrows; otherwise they may recall sent messages.
   const handleCommandKeyPress = useCallback(
-    (event: ComposerKeyPressEvent) => autocompleteRef.current?.onKeyPress(event) ?? false,
-    [],
+    (event: ComposerKeyPressEvent) => {
+      if (autocompleteRef.current?.onKeyPress(event)) return true;
+      const recalledText = recall.handleKeyPress(event, () =>
+        selectAgentSentMessages(useSessionStore.getState().sessions[serverId], agentId),
+      );
+      if (recalledText === null) return false;
+      event.preventDefault();
+      replaceUserInput(recalledText);
+      return true;
+    },
+    [agentId, recall, replaceUserInput, serverId],
   );
 
   const cancelButtonStyle = useMemo(
@@ -2360,7 +2383,6 @@ function ComposerContentImpl({
       pluginClientSlashCommands,
     ],
   );
-  const messageInputContainerRef = useRef<View>(null);
 
   const isSubmitLoadingVisible =
     isProcessing || isSubmitLoading || isUploadingFile || pendingNativeImagePastes > 0;
@@ -2419,16 +2441,16 @@ function ComposerContentImpl({
             {isFullscreen ? null : queueList}
             {!isFullscreen && sendErrorNode}
 
-            <View ref={messageInputContainerRef} style={messageInputContainerStyle}>
-              <ComposerAutocompleteBinding
-                text={textSource}
-                cursor={cursor}
-                inputRef={messageInputRef}
-                anchorRef={messageInputContainerRef}
-                show={mode.showAutocomplete && !isFullscreen}
-                ref={autocompleteRef}
-                configuration={autocompleteConfiguration}
-              />
+            <ComposerAutocompleteBinding
+              text={textSource}
+              cursor={cursor}
+              recall={recall}
+              inputRef={messageInputRef}
+              anchorStyle={messageInputContainerStyle}
+              show={mode.showAutocomplete && !isFullscreen}
+              ref={autocompleteRef}
+              configuration={autocompleteConfiguration}
+            >
               <ComposerForgeBinding
                 text={textSource}
                 configuration={forgeConfiguration}
@@ -2473,6 +2495,7 @@ function ComposerContentImpl({
                   voiceAgentId={agentId}
                   isAgentRunning={isAgentRunning}
                   defaultSendBehavior={activeSendBehavior}
+                  sendShortcut={appSettings.sendShortcut}
                   onQueue={handleQueue}
                   onSubmitLoadingPress={submitLoadingPressHandler}
                   onKeyPress={handleCommandKeyPress}
@@ -2508,7 +2531,7 @@ function ComposerContentImpl({
                 renderOption={renderGithubPickerOption}
               />
               {pluginAttachments.picker}
-            </View>
+            </ComposerAutocompleteBinding>
           </View>
         </View>
       </View>

packages/app/src/composer/input/input.tsx

@@ -1,3 +1,4 @@
+import type { SendShortcut } from "@/hooks/use-settings";
 import {
   useComposerEditingSession,
   useComposerFullscreen,
@@ -27,6 +28,7 @@ import { StyleSheet, withUnistyles } from "react-native-unistyles";
 import { useTranslation } from "react-i18next";
 import { ICON_SIZE, type Theme } from "@/styles/theme";
 import { ArrowUp, Mic, MicOff, CornerDownLeft, Plus, Square } from "lucide-react-native";
+import * as Haptics from "expo-haptics";
 import { useDictation } from "@/hooks/use-dictation";
 import { hasFinePointer } from "@/hooks/use-fine-pointer";
 import { DictationOverlay } from "@/components/dictation-controls";
@@ -57,7 +59,7 @@ import { formatShortcut, type ShortcutKey } from "@/utils/format-shortcut";
 import { getShortcutOs } from "@/utils/shortcut-platform";
 import type { MessageInputKeyboardActionKind } from "@/keyboard/actions";
 import { isImeComposingKeyboardEvent } from "@/utils/keyboard-ime";
-import { isWeb } from "@/constants/platform";
+import { isNative, isWeb } from "@/constants/platform";
 import { useIsCompactFormFactor } from "@/constants/layout";
 import { useComposerKeyboardScope } from "@/composer/keyboard-scope";
 import { RenderProfile } from "@/utils/render-profiler";
@@ -76,6 +78,7 @@ const ComposerTextInput = withUnistyles(EditingTextInput, (theme) => ({
 }));
 import {
   resolveSendTooltipLabel,
+  resolveSubmitAccessibilityHint,
   resolveSubmitAccessibilityLabel,
   resolveVoiceAccessibilityLabel,
   resolveVoiceTooltipText,
@@ -83,8 +86,10 @@ import {
 import {
   applyDictationTranscript,
   computeCanStartDictation,
+  resolveAlternateSendAction,
   resolveComposerSurfacePresentation,
   resolveComposerSurfaceText,
+  resolveMessageInputEnterAction,
   resolveRetainedSelection,
   runAlternateSendAction,
   runDefaultSendAction,
@@ -93,6 +98,11 @@ import {
 } from "./state";
 
 const DEFAULT_SEND_KEYS: ShortcutKey[][] = [["Enter"]];
+const MOD_ENTER_SEND_KEYS: ShortcutKey[][] = [["mod", "Enter"]];
+
+function resolveSendKeys(sendShortcut: SendShortcut): ShortcutKey[][] {
+  return sendShortcut === "mod-enter" ? MOD_ENTER_SEND_KEYS : DEFAULT_SEND_KEYS;
+}
 const COMPOSER_INPUT_DATASET = { composerInput: "" } as const;
 
 export interface AttachmentMenuItem {
@@ -110,6 +120,8 @@ export interface ComposerInputSnapshot {
 
 export interface ComposerKeyPressEvent {
   key: string;
+  /** Shift, Alt, Ctrl, or Meta was held. */
+  hasModifier: boolean;
   preventDefault: () => void;
   input: ComposerInputSnapshot;
 }
@@ -162,6 +174,7 @@ export interface MessageInputProps {
    *  running. "interrupt" and "steer" send immediately, "queue" queues. Required so the default
    *  lives only in DEFAULT_CLIENT_SETTINGS. */
   defaultSendBehavior: "interrupt" | "steer" | "queue";
+  sendShortcut: SendShortcut;
   /** Callback for queue button when agent is running */
   onQueue?: (payload: MessagePayload) => void;
   /** Optional handler used when submit button is in loading state. */
@@ -210,6 +223,7 @@ type WebTextInputKeyPressEvent = NativeSyntheticEvent<
     metaKey?: boolean;
     ctrlKey?: boolean;
     shiftKey?: boolean;
+    altKey?: boolean;
     // Web-only: present on DOM KeyboardEvent during IME composition (CJK input).
     isComposing?: boolean;
     keyCode?: number;
@@ -396,6 +410,7 @@ interface DesktopKeyPressContext {
   onKeyPressCallback: ((event: ComposerKeyPressEvent) => boolean) | undefined;
   input: ComposerKeyPressEvent["input"];
   submitOnEnter: boolean;
+  sendShortcut: SendShortcut;
   isAgentRunning: boolean;
   onQueue: ((payload: MessagePayload) => void) | undefined;
   isSubmitDisabled: boolean;
@@ -411,30 +426,37 @@ function handleDesktopKeyPressImpl(
 ): void {
   if (isImeComposingKeyboardEvent(event.nativeEvent)) return;
 
+  const { shiftKey, metaKey, ctrlKey, altKey } = event.nativeEvent;
+
   if (ctx.onKeyPressCallback) {
     const handled = ctx.onKeyPressCallback({
       key: event.nativeEvent.key,
+      hasModifier: Boolean(shiftKey || metaKey || ctrlKey || altKey),
       preventDefault: () => event.preventDefault(),
       input: ctx.input,
     });
     if (handled) return;
   }
 
-  const { shiftKey, metaKey, ctrlKey } = event.nativeEvent;
-
   if (event.nativeEvent.key !== "Enter") return;
-  if (!ctx.submitOnEnter) return;
-  if (shiftKey) return;
 
-  if ((metaKey || ctrlKey) && ctx.isAgentRunning && ctx.onQueue) {
-    if (ctx.isSubmitDisabled || ctx.isSubmitLoading || ctx.disabled) return;
-    event.preventDefault();
-    ctx.handleAlternateSendAction();
-    return;
-  }
+  const action = resolveMessageInputEnterAction({
+    submitOnEnter: ctx.submitOnEnter,
+    sendShortcut: ctx.sendShortcut,
+    shiftKey: shiftKey ?? false,
+    metaKey: metaKey ?? false,
+    ctrlKey: ctrlKey ?? false,
+    isAgentRunning: ctx.isAgentRunning,
+    onQueue: ctx.onQueue,
+  });
+  if (action === null) return;
 
   if (ctx.isSubmitDisabled || ctx.isSubmitLoading || ctx.disabled) return;
   event.preventDefault();
+  if (action === "alternate-send") {
+    ctx.handleAlternateSendAction();
+    return;
+  }
   ctx.handleDefaultSendAction();
 }
 
@@ -765,8 +787,10 @@ function SendButtonTooltip({
   canPressLoadingButton,
   onSubmitLoadingPress,
   onDefaultSendAction,
+  onLongPressSend,
   isSendButtonDisabled,
   submitAccessibilityLabel,
+  submitAccessibilityHint,
   sendButtonCombinedStyle,
   isSubmitLoading,
   submitIcon,
@@ -780,8 +804,10 @@ function SendButtonTooltip({
   canPressLoadingButton: boolean;
   onSubmitLoadingPress: (() => void) | undefined;
   onDefaultSendAction: () => void;
+  onLongPressSend: () => void;
   isSendButtonDisabled: boolean;
   submitAccessibilityLabel: string;
+  submitAccessibilityHint: string | undefined;
   sendButtonCombinedStyle: React.ComponentProps<typeof TooltipTrigger>["style"];
   isSubmitLoading: boolean;
   submitIcon: "arrow" | "return";
@@ -796,8 +822,10 @@ function SendButtonTooltip({
     <Tooltip delayDuration={0} enabledOnDesktop enabledOnMobile={false}>
       <TooltipTrigger
         onPress={canPressLoadingButton ? onSubmitLoadingPress : onDefaultSendAction}
+        onLongPress={canPressLoadingButton ? undefined : onLongPressSend}
         disabled={isSendButtonDisabled}
         accessibilityLabel={submitAccessibilityLabel}
+        accessibilityHint={submitAccessibilityHint}
         accessibilityRole="button"
         testID={submitButtonTestID}
         style={sendButtonCombinedStyle}
@@ -1104,6 +1132,7 @@ interface ResolvedMessageInputProps {
   voiceAgentId: string | undefined;
   isAgentRunning: boolean;
   defaultSendBehavior: "interrupt" | "steer" | "queue";
+  sendShortcut: SendShortcut;
   onQueue: ((payload: MessagePayload) => void) | undefined;
   onSubmitLoadingPress: (() => void) | undefined;
   onKeyPressCallback: ((event: ComposerKeyPressEvent) => boolean) | undefined;
@@ -1151,6 +1180,7 @@ function resolveMessageInputProps(props: MessageInputProps): ResolvedMessageInpu
     voiceAgentId: props.voiceAgentId,
     isAgentRunning: props.isAgentRunning ?? false,
     defaultSendBehavior: props.defaultSendBehavior,
+    sendShortcut: props.sendShortcut,
     onQueue: props.onQueue,
     onSubmitLoadingPress: props.onSubmitLoadingPress,
     onKeyPressCallback: props.onKeyPress,
@@ -1228,6 +1258,7 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(
       voiceAgentId,
       isAgentRunning,
       defaultSendBehavior,
+      sendShortcut,
       onQueue,
       onSubmitLoadingPress,
       onKeyPressCallback,
@@ -1701,6 +1732,19 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(
       });
     }, [defaultSendBehavior, isAgentRunning, handleSendMessage, handleQueueMessage, onQueue]);
 
+    const alternateSendAction = resolveAlternateSendAction({
+      defaultSendBehavior,
+      isAgentRunning,
+      onQueue,
+    });
+
+    const handleLongPressSend = useCallback(() => {
+      if (alternateSendAction && isNative) {
+        void Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Medium).catch(() => {});
+      }
+      handleAlternateSendAction();
+    }, [alternateSendAction, handleAlternateSendAction]);
+
     usePasteImagesEffect({
       textarea: webTextArea,
       isConnected,
@@ -1734,6 +1778,7 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(
             selectionRef.current,
           ),
           submitOnEnter: shouldSubmitOnEnter,
+          sendShortcut,
           isAgentRunning,
           onQueue,
           isSubmitDisabled,
@@ -1747,6 +1792,7 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(
         shouldHandleWebKeyPress,
         onKeyPressCallback,
         shouldSubmitOnEnter,
+        sendShortcut,
         isAgentRunning,
         onQueue,
         isSubmitDisabled,
@@ -1788,6 +1834,11 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(
       isAgentRunning,
       t,
     });
+    const submitAccessibilityHint = resolveSubmitAccessibilityHint({
+      canPressLoadingButton,
+      alternateSendAction,
+      t,
+    });
 
     const voiceButtonAccessibilityLabel = resolveVoiceAccessibilityLabel({
       isRealtimeVoiceForCurrentAgent,
@@ -1948,15 +1999,17 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(
           canPressLoadingButton={canPressLoadingButton}
           onSubmitLoadingPress={onSubmitLoadingPress}
           onDefaultSendAction={handleDefaultSendAction}
+          onLongPressSend={handleLongPressSend}
           isSendButtonDisabled={isPresentedSendDisabled}
           submitAccessibilityLabel={submitAccessibilityLabel}
+          submitAccessibilityHint={submitAccessibilityHint}
           sendButtonCombinedStyle={sendButtonCombinedStyle}
           isSubmitLoading={isSubmitLoading}
           submitIcon={submitIcon}
           submitLabel={submitLabel}
           submitButtonTestID={submitButtonTestID}
           buttonIconSize={buttonIconSize}
-          sendKeys={DEFAULT_SEND_KEYS}
+          sendKeys={resolveSendKeys(sendShortcut)}
           sendTooltipLabel={sendTooltipLabel}
         />
       ),
@@ -1967,14 +2020,17 @@ export const MessageInput = forwardRef<MessageInputRef, MessageInputProps>(
         canPressLoadingButton,
         onSubmitLoadingPress,
         handleDefaultSendAction,
+        handleLongPressSend,
         isPresentedSendDisabled,
         submitAccessibilityLabel,
+        submitAccessibilityHint,
         sendButtonCombinedStyle,
         isSubmitLoading,
         submitIcon,
         submitLabel,
         submitButtonTestID,
         buttonIconSize,
+        sendShortcut,
         sendTooltipLabel,
       ],
     );

packages/app/src/composer/input/labels.test.ts

@@ -1,6 +1,7 @@
 import { describe, expect, it } from "vitest";
 import {
   resolveSendTooltipLabel,
+  resolveSubmitAccessibilityHint,
   resolveSubmitAccessibilityLabel,
   resolveVoiceAccessibilityLabel,
   resolveVoiceTooltipText,
@@ -12,6 +13,8 @@ const translations: Record<string, string> = {
   "composer.input.sendAndInterrupt": "Send and interrupt",
   "composer.input.sendAndSteer": "Send and steer",
   "composer.input.sendMessage": "Send message",
+  "composer.input.longPressToQueue": "Long press to queue",
+  "composer.input.longPressToSendNow": "Long press to send now",
   "composer.input.queue": "Queue",
   "composer.input.send": "Send",
   "composer.voice.unmuteVoiceMode": "Unmute Voice mode",
@@ -26,6 +29,37 @@ const translations: Record<string, string> = {
 const t = ((key: string) => translations[key] ?? key) as never;
 
 describe("composer input labels", () => {
+  it("names the long-press action in the submit hint only when one exists", () => {
+    expect(
+      resolveSubmitAccessibilityHint({
+        canPressLoadingButton: false,
+        alternateSendAction: "queue",
+        t,
+      }),
+    ).toBe("Long press to queue");
+    expect(
+      resolveSubmitAccessibilityHint({
+        canPressLoadingButton: false,
+        alternateSendAction: "send",
+        t,
+      }),
+    ).toBe("Long press to send now");
+    expect(
+      resolveSubmitAccessibilityHint({
+        canPressLoadingButton: false,
+        alternateSendAction: null,
+        t,
+      }),
+    ).toBeUndefined();
+    expect(
+      resolveSubmitAccessibilityHint({
+        canPressLoadingButton: true,
+        alternateSendAction: "queue",
+        t,
+      }),
+    ).toBeUndefined();
+  });
+
   it("resolves submit accessibility labels from translations", () => {
     expect(
       resolveSubmitAccessibilityLabel({

packages/app/src/composer/input/labels.ts

@@ -1,5 +1,6 @@
 import type { TFunction } from "i18next";
 import type { SendBehavior } from "@/hooks/use-settings/storage";
+import type { AlternateSendAction } from "./state";
 
 export function resolveSubmitAccessibilityLabel(input: {
   submitButtonAccessibilityLabel: string | undefined;
@@ -22,6 +23,19 @@ export function resolveSubmitAccessibilityLabel(input: {
   return input.t("composer.input.sendMessage");
 }
 
+export function resolveSubmitAccessibilityHint(input: {
+  canPressLoadingButton: boolean;
+  alternateSendAction: AlternateSendAction | null;
+  t: TFunction;
+}): string | undefined {
+  if (input.canPressLoadingButton || !input.alternateSendAction) return undefined;
+  return input.t(
+    input.alternateSendAction === "queue"
+      ? "composer.input.longPressToQueue"
+      : "composer.input.longPressToSendNow",
+  );
+}
+
 export function resolveVoiceAccessibilityLabel(input: {
   isRealtimeVoiceForCurrentAgent: boolean;
   isMuted: boolean;

packages/app/src/composer/input/state.test.ts

@@ -2,11 +2,14 @@ import { describe, expect, it, vi } from "vitest";
 import {
   applyDictationTranscript,
   computeCanStartDictation,
+  type MessageInputEnterContext,
   resolveActiveSendBehavior,
   resolveComposerSurfacePresentation,
   resolveComposerSurfaceText,
   resolveGlyphRailOffset,
+  resolveMessageInputEnterAction,
   resolveRetainedSelection,
+  resolveAlternateSendAction,
   runAlternateSendAction,
   runDefaultSendAction,
   runMessageInputKeyboardAction,
@@ -276,6 +279,253 @@ describe("composer send behavior", () => {
     expect(defaultAction.calls).toEqual(["queue"]);
     expect(alternateAction.calls).toEqual(["send"]);
   });
+
+  it("sends with the alternate action while no turn is running", () => {
+    for (const defaultSendBehavior of ["steer", "interrupt", "queue"] as const) {
+      const alternateAction = actions();
+      runAlternateSendAction({
+        defaultSendBehavior,
+        isAgentRunning: false,
+        onQueue: alternateAction.onQueue,
+        handleSendMessage: alternateAction.handleSendMessage,
+        handleQueueMessage: alternateAction.handleQueueMessage,
+      });
+      expect(alternateAction.calls).toEqual(["send"]);
+    }
+  });
+
+  it("offers an alternate action only while a turn runs and the composer can queue", () => {
+    const onQueue = () => undefined;
+    expect(
+      resolveAlternateSendAction({ defaultSendBehavior: "steer", isAgentRunning: true, onQueue }),
+    ).toBe("queue");
+    expect(
+      resolveAlternateSendAction({
+        defaultSendBehavior: "interrupt",
+        isAgentRunning: true,
+        onQueue,
+      }),
+    ).toBe("queue");
+    expect(
+      resolveAlternateSendAction({ defaultSendBehavior: "queue", isAgentRunning: true, onQueue }),
+    ).toBe("send");
+    expect(
+      resolveAlternateSendAction({ defaultSendBehavior: "steer", isAgentRunning: false, onQueue }),
+    ).toBeNull();
+    expect(
+      resolveAlternateSendAction({
+        defaultSendBehavior: "queue",
+        isAgentRunning: true,
+        onQueue: undefined,
+      }),
+    ).toBeNull();
+  });
+});
+
+describe("resolveMessageInputEnterAction", () => {
+  function enterContext(
+    overrides: Partial<MessageInputEnterContext> = {},
+  ): MessageInputEnterContext {
+    return {
+      submitOnEnter: true,
+      sendShortcut: "enter",
+      shiftKey: false,
+      metaKey: false,
+      ctrlKey: false,
+      isAgentRunning: false,
+      onQueue: () => undefined,
+      ...overrides,
+    };
+  }
+
+  it("returns null for plain, Shift, and modifier Enter when submit on enter is disabled", () => {
+    expect(resolveMessageInputEnterAction(enterContext({ submitOnEnter: false }))).toBeNull();
+    expect(
+      resolveMessageInputEnterAction(enterContext({ submitOnEnter: false, shiftKey: true })),
+    ).toBeNull();
+    expect(
+      resolveMessageInputEnterAction(enterContext({ submitOnEnter: false, metaKey: true })),
+    ).toBeNull();
+    expect(
+      resolveMessageInputEnterAction(enterContext({ submitOnEnter: false, ctrlKey: true })),
+    ).toBeNull();
+  });
+
+  it("still returns null when modifier Enter sends and submit on enter is disabled", () => {
+    expect(
+      resolveMessageInputEnterAction(
+        enterContext({ sendShortcut: "mod-enter", submitOnEnter: false, metaKey: true }),
+      ),
+    ).toBeNull();
+    expect(
+      resolveMessageInputEnterAction(
+        enterContext({ sendShortcut: "mod-enter", submitOnEnter: false }),
+      ),
+    ).toBeNull();
+  });
+
+  it("sends on plain Enter when Enter sends", () => {
+    expect(resolveMessageInputEnterAction(enterContext())).toBe("default-send");
+  });
+
+  it("returns null for Shift+Enter when Enter sends", () => {
+    expect(resolveMessageInputEnterAction(enterContext({ shiftKey: true }))).toBeNull();
+  });
+
+  it("returns null for Shift+Cmd+Enter and Shift+Ctrl+Enter so Shift keeps its newline", () => {
+    expect(
+      resolveMessageInputEnterAction(
+        enterContext({ shiftKey: true, metaKey: true, isAgentRunning: true }),
+      ),
+    ).toBeNull();
+    expect(
+      resolveMessageInputEnterAction(
+        enterContext({ shiftKey: true, ctrlKey: true, isAgentRunning: true }),
+      ),
+    ).toBeNull();
+  });
+
+  it("sends on Cmd+Enter and Ctrl+Enter while idle even with a queue handler", () => {
+    expect(resolveMessageInputEnterAction(enterContext({ metaKey: true }))).toBe("default-send");
+    expect(resolveMessageInputEnterAction(enterContext({ ctrlKey: true }))).toBe("default-send");
+  });
+
+  it("queues on Cmd+Enter and Ctrl+Enter while the agent is running with a queue handler", () => {
+    expect(
+      resolveMessageInputEnterAction(enterContext({ metaKey: true, isAgentRunning: true })),
+    ).toBe("alternate-send");
+    expect(
+      resolveMessageInputEnterAction(enterContext({ ctrlKey: true, isAgentRunning: true })),
+    ).toBe("alternate-send");
+  });
+
+  it("sends on Cmd+Enter and Ctrl+Enter while running when no queue handler exists", () => {
+    expect(
+      resolveMessageInputEnterAction(
+        enterContext({ metaKey: true, isAgentRunning: true, onQueue: undefined }),
+      ),
+    ).toBe("default-send");
+    expect(
+      resolveMessageInputEnterAction(
+        enterContext({ ctrlKey: true, isAgentRunning: true, onQueue: undefined }),
+      ),
+    ).toBe("default-send");
+  });
+
+  it("returns null for plain and Shift+Enter when modifier Enter sends", () => {
+    expect(resolveMessageInputEnterAction(enterContext({ sendShortcut: "mod-enter" }))).toBeNull();
+    expect(
+      resolveMessageInputEnterAction(enterContext({ sendShortcut: "mod-enter", shiftKey: true })),
+    ).toBeNull();
+  });
+
+  it("returns null for Shift+Cmd+Enter and Shift+Ctrl+Enter when modifier Enter sends", () => {
+    expect(
+      resolveMessageInputEnterAction(
+        enterContext({ sendShortcut: "mod-enter", shiftKey: true, metaKey: true }),
+      ),
+    ).toBeNull();
+    expect(
+      resolveMessageInputEnterAction(
+        enterContext({ sendShortcut: "mod-enter", shiftKey: true, ctrlKey: true }),
+      ),
+    ).toBeNull();
+  });
+
+  it("sends on Cmd+Enter and Ctrl+Enter while idle when modifier Enter sends", () => {
+    expect(
+      resolveMessageInputEnterAction(enterContext({ sendShortcut: "mod-enter", metaKey: true })),
+    ).toBe("default-send");
+    expect(
+      resolveMessageInputEnterAction(enterContext({ sendShortcut: "mod-enter", ctrlKey: true })),
+    ).toBe("default-send");
+  });
+
+  it("uses the default action on modifier Enter while running when modifier Enter sends", () => {
+    expect(
+      resolveMessageInputEnterAction(
+        enterContext({ sendShortcut: "mod-enter", metaKey: true, isAgentRunning: true }),
+      ),
+    ).toBe("default-send");
+    expect(
+      resolveMessageInputEnterAction(
+        enterContext({ sendShortcut: "mod-enter", ctrlKey: true, isAgentRunning: true }),
+      ),
+    ).toBe("default-send");
+  });
+
+  describe("composed with the send actions", () => {
+    function actions() {
+      const calls: string[] = [];
+      return {
+        calls,
+        handleSendMessage: () => calls.push("send"),
+        handleQueueMessage: () => calls.push("queue"),
+        onQueue: () => undefined,
+      };
+    }
+
+    function resolveCommandEnterToSendModifierEnter() {
+      return resolveMessageInputEnterAction(
+        enterContext({ sendShortcut: "mod-enter", metaKey: true, isAgentRunning: true }),
+      );
+    }
+
+    it("queues through the default send action when queue behavior is selected and the agent is running", () => {
+      const sendAction = actions();
+
+      expect(resolveCommandEnterToSendModifierEnter()).toBe("default-send");
+
+      runDefaultSendAction({
+        defaultSendBehavior: "queue",
+        isAgentRunning: true,
+        onQueue: sendAction.onQueue,
+        handleSendMessage: sendAction.handleSendMessage,
+        handleQueueMessage: sendAction.handleQueueMessage,
+      });
+
+      expect(sendAction.calls).toEqual(["queue"]);
+    });
+
+    it("sends through the default send action when queue behavior is selected and the agent is idle", () => {
+      const sendAction = actions();
+
+      expect(
+        resolveMessageInputEnterAction(
+          enterContext({ sendShortcut: "mod-enter", metaKey: true, isAgentRunning: false }),
+        ),
+      ).toBe("default-send");
+
+      runDefaultSendAction({
+        defaultSendBehavior: "queue",
+        isAgentRunning: false,
+        onQueue: sendAction.onQueue,
+        handleSendMessage: sendAction.handleSendMessage,
+        handleQueueMessage: sendAction.handleQueueMessage,
+      });
+
+      expect(sendAction.calls).toEqual(["send"]);
+    });
+
+    it.each([{ defaultSendBehavior: "steer" }, { defaultSendBehavior: "interrupt" }] as const)(
+      "sends through the default send action when $defaultSendBehavior behavior is selected and the agent is running",
+      ({ defaultSendBehavior }) => {
+        const sendAction = actions();
+
+        expect(resolveCommandEnterToSendModifierEnter()).toBe("default-send");
+
+        runDefaultSendAction({
+          defaultSendBehavior,
+          isAgentRunning: true,
+          onQueue: sendAction.onQueue,
+          handleSendMessage: sendAction.handleSendMessage,
+          handleQueueMessage: sendAction.handleQueueMessage,
+        });
+
+        expect(sendAction.calls).toEqual(["send"]);
+      },
+    );
+  });
 });
 
 describe("stopRealtimeVoice", () => {

packages/app/src/composer/input/state.ts

@@ -1,3 +1,4 @@
+import type { SendShortcut } from "@/hooks/use-settings";
 import type { DaemonClient } from "@getpaseo/client/internal/daemon-client";
 import type { ActiveTurnBehavior } from "@getpaseo/protocol/messages";
 import type { MessagePayload, TextReplacement } from "@/composer/types";
@@ -125,14 +126,53 @@ export function runDefaultSendAction(ctx: SendActionContext): void {
   ctx.handleSendMessage();
 }
 
+export type AlternateSendAction = "queue" | "send";
+
+/**
+ * What Mod+Enter and a long-press on Send do instead of the default send. Null while
+ * no turn is running, where both fall back to the default send.
+ */
+export function resolveAlternateSendAction(
+  ctx: Pick<SendActionContext, "defaultSendBehavior" | "isAgentRunning" | "onQueue">,
+): AlternateSendAction | null {
+  if (!ctx.isAgentRunning || !ctx.onQueue) return null;
+  return ctx.defaultSendBehavior === "queue" ? "send" : "queue";
+}
+
 export function runAlternateSendAction(ctx: SendActionContext): void {
-  if (ctx.defaultSendBehavior === "queue") {
+  const action = resolveAlternateSendAction(ctx);
+  if (action === "queue") {
+    ctx.handleQueueMessage();
+    return;
+  }
+  if (action === "send") {
     ctx.handleSendMessage();
     return;
   }
-  if (ctx.isAgentRunning && ctx.onQueue) {
-    ctx.handleQueueMessage();
-  }
+  runDefaultSendAction(ctx);
+}
+
+export type MessageInputEnterAction = "alternate-send" | "default-send";
+
+export interface MessageInputEnterContext {
+  submitOnEnter: boolean;
+  sendShortcut: SendShortcut;
+  shiftKey: boolean;
+  metaKey: boolean;
+  ctrlKey: boolean;
+  isAgentRunning: boolean;
+  onQueue: ((payload: MessagePayload) => void) | undefined;
+}
+
+export function resolveMessageInputEnterAction(
+  ctx: MessageInputEnterContext,
+): MessageInputEnterAction | null {
+  if (!ctx.submitOnEnter) return null;
+  if (ctx.shiftKey) return null;
+  const hasModifier = ctx.metaKey || ctx.ctrlKey;
+  if (ctx.sendShortcut === "mod-enter") return hasModifier ? "default-send" : null;
+  if (hasModifier && ctx.isAgentRunning && ctx.onQueue) return "alternate-send";
+  return "default-send";
 }
 
 export function runMessageInputKeyboardAction(

packages/app/src/composer/recall.test.ts

@@ -0,0 +1,109 @@
+import { describe, expect, it } from "vitest";
+import type { ComposerKeyPressEvent } from "@/composer/input/input";
+import { ComposerRecall } from "@/composer/recall";
+
+const SENT = ["add tests", "fix the auth bug"];
+
+function press(
+  key: string,
+  text: string,
+  options: { caret?: number; selectionEnd?: number; hasModifier?: boolean } = {},
+): ComposerKeyPressEvent {
+  const caret = options.caret ?? text.length;
+  return {
+    key,
+    hasModifier: options.hasModifier ?? false,
+    preventDefault: () => undefined,
+    input: { text, selection: { start: caret, end: options.selectionEnd ?? caret } },
+  };
+}
+
+/** Drives recall the way the composer does: each result becomes the composer text, caret at the end. */
+function composerWithRecall(sent: readonly string[] = SENT) {
+  const recall = new ComposerRecall();
+  let text = "";
+  return {
+    recall,
+    get text() {
+      return text;
+    },
+    type(next: string) {
+      text = next;
+    },
+    press(key: string, options: { caret?: number; hasModifier?: boolean } = {}) {
+      const result = recall.handleKeyPress(press(key, text, options), () => sent);
+      if (result !== null) text = result;
+      return result;
+    },
+  };
+}
+
+describe("ComposerRecall", () => {
+  it("walks back through sent messages and forward to an empty composer", () => {
+    const composer = composerWithRecall();
+
+    expect(composer.press("ArrowUp")).toBe("add tests");
+    expect(composer.press("ArrowUp")).toBe("fix the auth bug");
+    expect(composer.press("ArrowDown")).toBe("add tests");
+    expect(composer.press("ArrowDown")).toBe("");
+    expect(composer.recall.isShowing(composer.text)).toBe(false);
+  });
+
+  it("leaves the caret to the input past the oldest message", () => {
+    const composer = composerWithRecall();
+    composer.press("ArrowUp");
+    composer.press("ArrowUp");
+
+    expect(composer.press("ArrowUp")).toBeNull();
+    expect(composer.text).toBe("fix the auth bug");
+  });
+
+  it("only starts from an empty composer", () => {
+    const composer = composerWithRecall();
+    composer.type("half written");
+
+    expect(composer.press("ArrowUp")).toBeNull();
+    expect(composer.press("ArrowDown")).toBeNull();
+  });
+
+  it("ignores Down from an empty composer and Up with no history", () => {
+    expect(composerWithRecall().press("ArrowDown")).toBeNull();
+    expect(composerWithRecall([]).press("ArrowUp")).toBeNull();
+  });
+
+  it("hands the arrows back to the caret once the recalled message is edited", () => {
+    const composer = composerWithRecall();
+    composer.press("ArrowUp");
+    composer.type("add tests for login");
+
+    expect(composer.recall.isShowing(composer.text)).toBe(false);
+    expect(composer.press("ArrowUp")).toBeNull();
+    expect(composer.press("ArrowDown")).toBeNull();
+  });
+
+  it("moves between lines of a multi-line message before changing message", () => {
+    const composer = composerWithRecall(["first line\nsecond line", "older"]);
+    composer.press("ArrowUp");
+
+    expect(composer.press("ArrowUp", { caret: "first line\nsec".length })).toBeNull();
+    expect(composer.press("ArrowUp", { caret: 3 })).toBe("older");
+    expect(composer.press("ArrowDown")).toBe("first line\nsecond line");
+    expect(composer.press("ArrowDown", { caret: 3 })).toBeNull();
+    expect(composer.press("ArrowDown")).toBe("");
+  });
+
+  it("ignores modified arrows, other keys, and a selection", () => {
+    const composer = composerWithRecall();
+
+    expect(composer.press("ArrowUp", { hasModifier: true })).toBeNull();
+    expect(composer.press("Enter")).toBeNull();
+    composer.press("ArrowUp");
+    const recall = composer.recall;
+    expect(
+      recall.handleKeyPress(
+        press("ArrowUp", "add tests", { caret: 0, selectionEnd: 3 }),
+        () => SENT,
+      ),
+    ).toBeNull();
+  });
+});

packages/app/src/composer/recall.ts

@@ -0,0 +1,68 @@
+import type { ComposerKeyPressEvent } from "@/composer/input/input";
+
+interface RecalledMessage {
+  index: number;
+  text: string;
+}
+
+/**
+ * Walks the messages already sent to an agent from an empty composer, like a
+ * shell's Up/Down history. A message stays recalled only while the composer
+ * still holds its exact text; the first edit hands the arrows back to the caret.
+ */
+export class ComposerRecall {
+  private recalled: RecalledMessage | null = null;
+
+  /** True while the composer shows a recalled message the user has not edited. */
+  isShowing(text: string): boolean {
+    return this.recalled !== null && this.recalled.text === text;
+  }
+
+  /**
+   * Returns the text the composer should show for this key press, or null to
+   * leave the key to the input. `readSentMessages` is newest first and is only
+   * read for keys recall acts on.
+   */
+  handleKeyPress(
+    event: ComposerKeyPressEvent,
+    readSentMessages: () => readonly string[],
+  ): string | null {
+    if (event.key !== "ArrowUp" && event.key !== "ArrowDown") return null;
+    if (event.hasModifier) return null;
+    const { text, selection } = event.input;
+    if (selection.start !== selection.end) return null;
+
+    const recalled = this.isShowing(text) ? this.recalled : null;
+    if (!recalled) {
+      this.recalled = null;
+      if (event.key !== "ArrowUp" || text.length > 0) return null;
+      return this.show(readSentMessages(), 0);
+    }
+
+    if (event.key === "ArrowUp") {
+      if (!isCaretOnFirstLine(text, selection.start)) return null;
+      return this.show(readSentMessages(), recalled.index + 1);
+    }
+    if (!isCaretOnLastLine(text, selection.start)) return null;
+    if (recalled.index === 0) {
+      this.recalled = null;
+      return "";
+    }
+    return this.show(readSentMessages(), recalled.index - 1);
+  }
+
+  private show(messages: readonly string[], index: number): string | null {
+    const text = messages[index];
+    if (text === undefined) return null;
+    this.recalled = { index, text };
+    return text;
+  }
+}
+
+function isCaretOnFirstLine(text: string, caret: number): boolean {
+  return !text.slice(0, caret).includes("\n");
+}
+
+function isCaretOnLastLine(text: string, caret: number): boolean {
+  return !text.slice(caret).includes("\n");
+}

packages/app/src/composer/tracks-panel.browser.test.tsx

@@ -162,12 +162,34 @@ describe("composer track panel", () => {
     );
 
     openPanel();
+    expect(document.querySelector("button button")).toBeNull();
+    expect(row("row")?.getAttribute("role")).toBe("menuitem");
     click(row("row-archive") as Element);
 
     expect(onAction).toHaveBeenCalledTimes(1);
     expect(onPress).not.toHaveBeenCalled();
     expect(isPanelOpen()).toBe(true);
   });
+
+  it.each(["Enter", " "])("selects a track row with %j", (key) => {
+    const select = vi.fn();
+    mount(
+      <ComposerTrackPill testID="pill" segments={SUBAGENT_SEGMENTS} panelTitle="Subagents">
+        <ComposerTrackRow accessibilityLabel="Subagent one" testID="row" onPress={select}>
+          <Text>Subagent one</Text>
+        </ComposerTrackRow>
+      </ComposerTrackPill>,
+    );
+    openPanel();
+    const target = row("row") as HTMLElement;
+    act(() => {
+      target.focus();
+      target.dispatchEvent(new KeyboardEvent("keydown", { key, bubbles: true }));
+      target.dispatchEvent(new KeyboardEvent("keyup", { key, bubbles: true }));
+    });
+    expect(select).toHaveBeenCalledTimes(1);
+    expect(isPanelOpen()).toBe(false);
+  });
 });
 
 describe("composer track pill status mark", () => {

packages/app/src/composer/tracks.tsx

@@ -233,6 +233,11 @@ export function ComposerTrackRow({
     [closeOnSelect, onPress, selectItem],
   );
 
+  const itemDataSet = useMemo(
+    () => ({ menuItem: "true", menuDisabled: disabled ? "true" : "false" }),
+    [disabled],
+  );
+
   const renderRow = useCallback(
     (active: boolean) => (
       <View style={active ? styles.rowActive : styles.row}>
@@ -253,7 +258,8 @@ export function ComposerTrackRow({
   return (
     <View onPointerEnter={handlePointerEnter} onPointerLeave={handlePointerLeave}>
       <Pressable
-        accessibilityRole="button"
+        accessibilityRole="menuitem"
+        dataSet={itemDataSet}
         accessibilityLabel={accessibilityLabel}
         testID={testID}
         disabled={disabled}

packages/app/src/desktop/host.ts

@@ -80,7 +80,7 @@ export interface DesktopEditorOpenTargetInput {
 }
 
 export interface DesktopEditorBridge {
-  listTargets?: () => Promise<DesktopEditorTargetDescriptor[]>;
+  listTargets?: (input?: { workspacePath?: string }) => Promise<DesktopEditorTargetDescriptor[]>;
   openTarget?: (input: DesktopEditorOpenTargetInput) => Promise<void>;
 }
 

packages/app/src/git/diff-document/benchmark-corpus.ts

@@ -0,0 +1,65 @@
+import { readFileSync } from "node:fs";
+import path from "node:path";
+
+/**
+ * The diff shapes the layout benchmarks measure, shared by the node bench
+ * (`model.bench.ts`) and the browser benchmark (`e2e/browser/diff-performance.spec.ts`)
+ * so both report against the same text.
+ */
+export interface BenchmarkCorpusFile {
+  path: string;
+  lines: string[];
+}
+
+function repeatToLength(unit: string, length: number): string {
+  return unit.repeat(Math.ceil(length / unit.length)).slice(0, length);
+}
+
+/** A real source file: short lines, a few with ligature punctuation. */
+export function realCodeCorpusFile(): BenchmarkCorpusFile {
+  const source = readFileSync(path.resolve(__dirname, "../diff-pane.tsx"), "utf8");
+  return { path: "packages/app/src/git/diff-pane.tsx", lines: source.split("\n") };
+}
+
+/** The CHANGELOG shape that once froze the renderer: 42 lines, longest ~600 characters. */
+export function changelogCorpusFile(): BenchmarkCorpusFile {
+  const sentence =
+    "- Fixed an issue where the diff viewer re-measured every line -> on toggle, which made wrapping painfully slow. ";
+  return {
+    path: "CHANGELOG.md",
+    lines: Array.from({ length: 42 }, (_, index) =>
+      repeatToLength(sentence, 200 + ((index * 97) % 398)),
+    ),
+  };
+}
+
+/** Generated TypeScript: ligature punctuation on every line, every tenth line long. */
+export function generatedCodeCorpusFile(lineCount: number): BenchmarkCorpusFile {
+  return {
+    path: "src/generated.ts",
+    lines: Array.from({ length: lineCount }, (_, index) => {
+      const base = `const handler${index} = async (event) => items.filter((item) => item.id !== ${index} && item.kind === "selected");`;
+      return index % 10 === 9 ? repeatToLength(`${base} // `, 320) : base;
+    }),
+  };
+}
+
+/** Serialized data: no ligatures, every line wraps several times. */
+export function jsonCorpusFile(lineCount: number): BenchmarkCorpusFile {
+  return {
+    path: "fixtures/data.json",
+    lines: Array.from({ length: lineCount }, (_, index) =>
+      repeatToLength(`{"id": ${index}, "label": "row ${index}", "tags": ["alpha", "beta"]}, `, 300),
+    ),
+  };
+}
+
+/** A pull-request-sized working diff: one of each shape above. */
+export function pullRequestCorpus(): BenchmarkCorpusFile[] {
+  return [
+    realCodeCorpusFile(),
+    changelogCorpusFile(),
+    generatedCodeCorpusFile(1200),
+    jsonCorpusFile(300),
+  ];
+}

packages/app/src/git/diff-document/model.bench.ts

@@ -0,0 +1,317 @@
+import type { ParsedDiffFile } from "@getpaseo/protocol/messages";
+import { bench, describe } from "vitest";
+import {
+  changelogCorpusFile,
+  generatedCodeCorpusFile,
+  jsonCorpusFile,
+  pullRequestCorpus,
+  realCodeCorpusFile,
+  type BenchmarkCorpusFile,
+} from "./benchmark-corpus";
+import { buildDiffDocumentModel } from "./model";
+import {
+  createAdditiveAdvances,
+  createChunkedAdvanceMeasurer,
+  createChunkedWidthMeasurer,
+  createMeasuredAdvances,
+  requiresShaping,
+} from "./text-measurement";
+import type { BuildDiffDocumentModelInput, TextMeasurer } from "./types";
+
+// The pure layout work the diff surface does when a diff opens or line wrap is
+// toggled, without a browser or Skia. Counts are the backend-independent cost
+// owners (how many strings a shaper has to see), timings are the JS overhead
+// around them:
+//   npx vitest bench --project unit src/git/diff-document/model.bench.ts
+
+const DESKTOP_VIEWPORT = { width: 1400, height: 900 };
+const PHONE_VIEWPORT = { width: 390, height: 800 };
+const CELL_WIDTH = 7.8;
+
+interface MeasurementStats {
+  /** Whole strings handed to the backend. */
+  calls: number;
+  /** Characters inside those strings; canvas and Skia cost scales with this. */
+  characters: number;
+}
+
+interface Backend {
+  measurer: TextMeasurer;
+  stats: MeasurementStats;
+}
+
+function monospaceWidth(text: string): number {
+  let width = 0;
+  for (const character of text) width += character.charCodeAt(0) > 0x2e7f ? 2 : 1;
+  return width * CELL_WIDTH;
+}
+
+function countingMeasure(stats: MeasurementStats): (text: string) => number {
+  return (text) => {
+    stats.calls += 1;
+    stats.characters += text.length;
+    return monospaceWidth(text);
+  };
+}
+
+/** Previous web backend, retained to isolate the cost of width-only probes. */
+function webBackendWithoutWidthProbe(): Backend {
+  const stats: MeasurementStats = { calls: 0, characters: 0 };
+  const measure = countingMeasure(stats);
+  return { stats, measurer: { measure, measureAdvances: createMeasuredAdvances(measure) } };
+}
+
+/**
+ * `createWebTextMeasurer` in surface.web.tsx, with canvas replaced by a counter.
+ * Width-only probes shape one string per chunk, like the native measurer; the
+ * widths are the same sums, in the same order, as the last cumulative advance.
+ */
+function webBackend(): Backend {
+  const stats: MeasurementStats = { calls: 0, characters: 0 };
+  const measure = countingMeasure(stats);
+  const additive = createAdditiveAdvances(measure);
+  return {
+    stats,
+    measurer: {
+      measure,
+      measureAdvances: createMeasuredAdvances(measure),
+      measureWidth: createChunkedWidthMeasurer((graphemes) => {
+        const text = graphemes.join("");
+        return requiresShaping(text) ? measure(text) : (additive(graphemes).at(-1) ?? 0);
+      }),
+    },
+  };
+}
+
+/** `createNativeTextMeasurer` in text.native.ts, with Skia replaced by a counter. */
+function nativeBackend(): Backend {
+  const stats: MeasurementStats = { calls: 0, characters: 0 };
+  const widths = new Map<string, number>();
+  const additive = (graphemes: readonly string[]) => {
+    let advance = 0;
+    return graphemes.map((grapheme) => {
+      let width = widths.get(grapheme);
+      if (width === undefined) {
+        stats.calls += 1;
+        stats.characters += grapheme.length;
+        width = monospaceWidth(grapheme);
+        widths.set(grapheme, width);
+      }
+      return (advance += width);
+    });
+  };
+  const shape = countingMeasure(stats);
+  return {
+    stats,
+    measurer: {
+      measure(text) {
+        return requiresShaping(text) ? shape(text) : (additive([...text]).at(-1) ?? 0);
+      },
+      measureWidth: createChunkedWidthMeasurer((graphemes) => {
+        const text = graphemes.join("");
+        return requiresShaping(text) ? shape(text) : (additive(graphemes).at(-1) ?? 0);
+      }),
+      measureAdvances: createChunkedAdvanceMeasurer({
+        requiresShaping,
+        measureAdditive: additive,
+        measureShaped(graphemes) {
+          shape(graphemes.join(""));
+          let advance = 0;
+          return graphemes.map((grapheme) => (advance += monospaceWidth(grapheme)));
+        },
+      }),
+    },
+  };
+}
+
+function addedFile(file: BenchmarkCorpusFile): ParsedDiffFile {
+  return {
+    path: file.path,
+    isNew: true,
+    isDeleted: false,
+    additions: file.lines.length,
+    deletions: 0,
+    hunks: [
+      {
+        oldStart: 0,
+        oldCount: 0,
+        newStart: 1,
+        newCount: file.lines.length,
+        lines: file.lines.map((content) => ({
+          type: "add" as const,
+          content,
+          tokens: [{ text: content, style: null }],
+        })),
+      },
+    ],
+  };
+}
+
+interface Scenario {
+  name: string;
+  files: ParsedDiffFile[];
+}
+
+const SCENARIOS: Scenario[] = [
+  { name: "real code (diff-pane.tsx)", files: [addedFile(realCodeCorpusFile())] },
+  { name: "changelog (42 long prose lines)", files: [addedFile(changelogCorpusFile())] },
+  { name: "generated code (1200 lines)", files: [addedFile(generatedCodeCorpusFile(1200))] },
+  { name: "json (300 lines x 300 chars)", files: [addedFile(jsonCorpusFile(300))] },
+  { name: "pull request (all of the above)", files: pullRequestCorpus().map(addedFile) },
+];
+
+function input(
+  scenario: Scenario,
+  options: {
+    wrapLines: boolean;
+    viewport: { width: number; height: number };
+    measureText: TextMeasurer;
+  },
+): BuildDiffDocumentModelInput {
+  return {
+    files: scenario.files,
+    collapsedFilePaths: new Set(),
+    layout: "unified",
+    wrapLines: options.wrapLines,
+    viewportWidth: options.viewport.width,
+    typography: { family: "monospace", size: 13, lineHeight: 20 },
+    measureText: options.measureText,
+    palette: {
+      surface: "#000",
+      headerSurface: "#111",
+      border: "#222",
+      foreground: "#fff",
+      foregroundMuted: "#aaa",
+      addition: "green",
+      deletion: "red",
+      additionBackground: "#010",
+      deletionBackground: "#100",
+      emptyBackground: "#111",
+      selection: "blue",
+      headerActiveSurface: "#222",
+      headerBorder: "#333",
+      statusSuccess: "green",
+      statusDanger: "red",
+      statusWarning: "orange",
+      syntax: {},
+    },
+    labels: { binary: "Binary", tooLarge: "Too large" },
+    // What the surfaces pass at scrollTop 0: five viewports tall.
+    materializationWindow: { top: 0, height: options.viewport.height * 5 },
+  };
+}
+
+interface Variant {
+  name: string;
+  wrapLines: boolean;
+  viewport: { width: number; height: number };
+  backend: () => Backend;
+}
+
+const VARIANTS: Variant[] = [
+  {
+    name: "unwrapped desktop | web",
+    wrapLines: false,
+    viewport: DESKTOP_VIEWPORT,
+    backend: webBackend,
+  },
+  {
+    name: "wrapped desktop | web",
+    wrapLines: true,
+    viewport: DESKTOP_VIEWPORT,
+    backend: webBackend,
+  },
+  {
+    name: "wrapped desktop | web without width probe",
+    wrapLines: true,
+    viewport: DESKTOP_VIEWPORT,
+    backend: webBackendWithoutWidthProbe,
+  },
+  {
+    name: "wrapped phone | web",
+    wrapLines: true,
+    viewport: PHONE_VIEWPORT,
+    backend: webBackend,
+  },
+  {
+    name: "unwrapped desktop | native",
+    wrapLines: false,
+    viewport: DESKTOP_VIEWPORT,
+    backend: nativeBackend,
+  },
+  {
+    name: "wrapped desktop | native",
+    wrapLines: true,
+    viewport: DESKTOP_VIEWPORT,
+    backend: nativeBackend,
+  },
+  {
+    name: "wrapped phone | native",
+    wrapLines: true,
+    viewport: PHONE_VIEWPORT,
+    backend: nativeBackend,
+  },
+];
+
+function countModel(scenario: Scenario, variant: Variant) {
+  const { measurer, stats } = variant.backend();
+  const started = performance.now();
+  const model = buildDiffDocumentModel(
+    input(scenario, {
+      wrapLines: variant.wrapLines,
+      viewport: variant.viewport,
+      measureText: measurer,
+    }),
+  );
+  const elapsedMs = performance.now() - started;
+  let materializedCells = 0;
+  let fragments = 0;
+  let graphemes = 0;
+  for (const row of model.rows) {
+    if (row.kind !== "line") continue;
+    for (const cell of row.cells) {
+      if (!cell || cell.fragments.length === 0) continue;
+      materializedCells += 1;
+      fragments += cell.fragments.length;
+      for (const fragment of cell.fragments) graphemes += fragment.graphemes.length;
+    }
+  }
+  const sourceLines = scenario.files.reduce(
+    (count, file) => count + file.hunks.reduce((total, hunk) => total + hunk.lines.length, 0),
+    0,
+  );
+  return {
+    sourceLines,
+    materializedCells,
+    fragments,
+    graphemeObjects: graphemes,
+    measureCalls: stats.calls,
+    measuredCharacters: stats.characters,
+    coldMs: Number(elapsedMs.toFixed(1)),
+  };
+}
+
+const report: Record<string, ReturnType<typeof countModel>> = {};
+for (const scenario of SCENARIOS) {
+  for (const variant of VARIANTS) {
+    report[`${scenario.name} | ${variant.name}`] = countModel(scenario, variant);
+  }
+}
+console.table(report);
+
+for (const scenario of SCENARIOS) {
+  describe(scenario.name, () => {
+    for (const variant of VARIANTS) {
+      if (variant.backend === nativeBackend) continue;
+      bench(variant.name, () => {
+        buildDiffDocumentModel(
+          input(scenario, {
+            wrapLines: variant.wrapLines,
+            viewport: variant.viewport,
+            measureText: variant.backend().measurer,
+          }),
+        );
+      });
+    }
+  });
+}

packages/app/src/git/diff-document/model.test.ts

@@ -10,7 +10,7 @@ import {
   resolveRelayoutScrollTop,
   shouldApplyRelayoutScroll,
 } from "./model";
-import type { BuildDiffDocumentModelInput, TextMeasurer } from "./types";
+import type { BuildDiffDocumentModelInput, DiffCell, TextMeasurer } from "./types";
 
 const measurer: TextMeasurer = { measure: (text) => Array.from(text).length * 10 };
 
@@ -639,17 +639,119 @@ describe("diff document model", () => {
     expect(firstLineCells(last, "b.ts")).toBe(firstLineCells(first, "b.ts"));
   });
 
-  it("keeps wrapped geometry fully measured", () => {
+  it("replaces estimated wrapped heights through reuse and preserves the scroll anchor", () => {
+    const changed = fileWithChangedLine("x".repeat(100));
+    const files = [changed, file("later.ts")];
+    // Deliberately inaccurate M width makes the estimate differ from exact layout.
+    const measureText = {
+      measure: (text: string) => (text === "M" ? 5 : Array.from(text).length * 10),
+    };
+    const options = input({ files, measureText });
+    const first = buildDiffDocumentModel({
+      ...options,
+      materializationWindow: { top: 30, height: 1 },
+    });
+    const eager = buildDiffDocumentModel(options);
+    const exact = buildDiffDocumentModel({ ...options, reuseFrom: [first] });
+    expect(first.height).not.toBe(eager.height);
+    expect(exact.rows).toEqual(eager.rows);
+    expect(exact.height).toBe(eager.height);
+    expect(firstLineCells(exact, changed.path)).toBe(firstLineCells(first, changed.path));
+    const scrollTop = first.files[1]!.bodyTop + 3;
+    const nextScrollTop = resolveRelayoutScrollTop(first, exact, scrollTop);
+    expect(nextScrollTop).toBe(exact.files[1]!.bodyTop + 3);
+    expect(captureScrollAnchor(exact, nextScrollTop)).toEqual(
+      captureScrollAnchor(first, scrollTop),
+    );
+  });
+
+  it("preserves the wrapped source offset when resize leaves the anchor outside the window", () => {
+    const source = file();
+    source.hunks[0]!.lines = Array.from({ length: 200 }, () => ({
+      type: "add" as const,
+      content: "x".repeat(200),
+    }));
+    const options = input({ files: [source], viewportWidth: 500 });
+    const before = buildDiffDocumentModel(options);
+    const scrollTop = before.rows[100]!.top + 36;
+    const anchor = captureScrollAnchor(before, scrollTop)!;
+    expect(anchor).toMatchObject({ kind: "text", cellOffset: 90 });
+    const resizedOptions = { ...options, viewportWidth: 180 };
+    const estimated = buildDiffDocumentModel({
+      ...resizedOptions,
+      materializationWindow: {
+        top: Math.floor(scrollTop / 800) * 800 - 800,
+        height: 2000,
+      },
+    });
+    const estimatedRow = estimated.rows[100]!;
+    expect(estimatedRow.kind === "line" && estimatedRow.cells[0]?.fragments).toEqual([]);
+    const restored = resolveRelayoutScrollTop(before, estimated, scrollTop);
+    const recaptured = captureScrollAnchor(estimated, restored)!;
+    expect(recaptured).toMatchObject({ kind: "text", cellOffset: 78 });
+
+    const materialized = buildDiffDocumentModel({
+      ...resizedOptions,
+      materializationWindow: { top: restored - 800, height: 2000 },
+      reuseFrom: [estimated],
+    });
+    const eager = buildDiffDocumentModel(resizedOptions);
+    const expected = resolveRelayoutScrollTop(before, eager, scrollTop);
+    expect(expected).toBe(28_938);
+    expect(Math.abs(restored - expected)).toBeLessThan(before.lineHeight);
+    expect(resolveRelayoutScrollTop(estimated, materialized, restored)).toBe(expected);
+  });
+
+  it("materializes the relayout anchor even when off-screen height estimates are inaccurate", () => {
+    const source = file();
+    source.hunks[0]!.lines = Array.from({ length: 200 }, () => ({
+      type: "add" as const,
+      content: "x".repeat(200),
+    }));
+    const options = input({ files: [source], viewportWidth: 500 });
+    const before = buildDiffDocumentModel(options);
+    const scrollTop = before.rows[100]!.top + 38;
+    const anchor = captureScrollAnchor(before, scrollTop)!;
+    const resizedOptions = {
+      ...options,
+      viewportWidth: 180,
+      measureText: { measure: (text: string) => (text === "M" ? 5 : text.length * 10) },
+    };
+    const resized = buildDiffDocumentModel({
+      ...resizedOptions,
+      materializationWindow: { top: scrollTop - 800, height: 2000 },
+      materializationAnchor: anchor,
+    });
+    const row = resized.rows[100]!;
+    expect(row.kind === "line" && row.cells[0]!.fragments.length).toBeGreaterThan(0);
+    const restored = resolveRelayoutScrollTop(before, resized, scrollTop);
+    const materialized = buildDiffDocumentModel({
+      ...resizedOptions,
+      materializationWindow: { top: restored - 800, height: 2000 },
+      materializationAnchor: captureScrollAnchor(resized, restored),
+      reuseFrom: [resized],
+    });
+    const nextScrollTop = resolveRelayoutScrollTop(resized, materialized, restored);
+    const nextAnchor = captureScrollAnchor(materialized, nextScrollTop);
+    // Offset 90 belongs to the fragment beginning at 78 after narrowing.
+    expect(nextAnchor).toMatchObject({ kind: "text", cellOffset: 78, viewportDelta: -2 });
+    expect(nextScrollTop).toBe(resolveScrollAnchor(materialized, anchor));
+  });
+
+  it("materializes wrapped text only inside the window", () => {
     const model = buildDiffDocumentModel(
       input({
         files: [file("a.ts"), file("b.ts")],
         wrapLines: true,
-        materializationWindow: { top: 0, height: FILE_HEADER_HEIGHT },
+        materializationWindow: { top: FILE_HEADER_HEIGHT, height: 1 },
       }),
     );
 
     expect(measuredFragments(model, "a.ts")).toBeGreaterThan(0);
-    expect(measuredFragments(model, "b.ts")).toBeGreaterThan(0);
+    expect(measuredFragments(model, "b.ts")).toBe(0);
+    expect(
+      model.rows.filter((row) => row.kind === "line" && row.cells.some(hasFragments)),
+    ).toHaveLength(1);
   });
 });
 
@@ -798,3 +900,7 @@ function reviewActionsWithEditor(
     onDeleteComment() {},
   };
 }
+
+function hasFragments(cell: DiffCell | null): boolean {
+  return cell !== null && cell.fragments.length > 0;
+}

packages/app/src/git/diff-document/model.ts

@@ -154,27 +154,38 @@ function appendReusableFileRows(candidate: {
 }): FileRowsResult {
   const reusedRows = candidate.model.rows.slice(candidate.file.rowStart, candidate.file.rowEnd);
   const retainsRowGeometry =
-    !candidate.input.wrapLines &&
     candidate.model.reviewGeometryKey === candidate.reviewGeometryKey &&
     candidate.file.top === candidate.fileTop &&
     candidate.file.fileIndex === candidate.fileIndex &&
     candidate.file.rowStart === candidate.rows.length;
   let top = candidate.bodyTop;
   for (const reusedRow of reusedRows) {
-    let nextRow = retainsRowGeometry ? reusedRow : repositionReusedRow(reusedRow, candidate, top);
+    let nextRow =
+      retainsRowGeometry && reusedRow.top === top
+        ? reusedRow
+        : repositionReusedRow(reusedRow, candidate, top);
     if (
       nextRow.kind === "line" &&
-      intersectsMaterializationWindow(candidate.input, top, top + nextRow.height) &&
+      (intersectsMaterializationWindow(candidate.input, top, top + nextRow.height) ||
+        containsMaterializationAnchor(candidate.input, candidate.file.path, nextRow.cells)) &&
       nextRow.cells.some((cell) => cell && cell.fragments.length === 0)
     ) {
+      const cells = materializeCells(
+        nextRow.cells,
+        candidate.file.file,
+        candidate.file.gutterWidth,
+        candidate.input,
+      );
       nextRow = {
         ...nextRow,
-        cells: materializeCells(
-          nextRow.cells,
-          candidate.file.file,
-          candidate.file.gutterWidth,
-          candidate.input,
-        ),
+        cells,
+        height:
+          Math.max(
+            candidate.input.typography.lineHeight,
+            ...cells.map(
+              (cell) => (cell?.fragments.length ?? 1) * candidate.input.typography.lineHeight,
+            ),
+          ) + nextRow.reviewHeight,
       };
     }
     candidate.rows.push(nextRow);
@@ -240,6 +251,7 @@ function appendNewFileRows(candidate: {
   const lines = geometryLines(
     lineSources(candidate.file, candidate.input.layout, false),
     candidate.input,
+    candidate.gutterWidth,
   );
   const fileBottom =
     candidate.bodyTop +
@@ -252,8 +264,8 @@ function appendNewFileRows(candidate: {
   let maximumHorizontalOverflow = 0;
   for (const line of lines) {
     const shouldMaterialize =
-      candidate.input.wrapLines ||
-      intersectsMaterializationWindow(candidate.input, top, top + line.height);
+      intersectsMaterializationWindow(candidate.input, top, top + line.height) ||
+      containsMaterializationAnchor(candidate.input, candidate.file.path, line.cells);
     const cells = shouldMaterialize
       ? materializeCells(line.cells, candidate.file, candidate.gutterWidth, candidate.input)
       : line.cells;
@@ -275,7 +287,7 @@ function appendNewFileRows(candidate: {
       candidate.input.typography.lineHeight,
       ...cells.map((cell) => (cell?.fragments.length ?? 1) * candidate.input.typography.lineHeight),
     );
-    const height = textHeight + line.reviewHeight;
+    const height = shouldMaterialize ? textHeight + line.reviewHeight : line.height;
     candidate.rows.push({
       kind: "line",
       index: candidate.rows.length,
@@ -412,13 +424,14 @@ function cellSource(line: SplitDiffDisplayLine | null, includeTokens: boolean):
   };
 }
 
-function geometryCell(source: CellSource): DiffCell {
+function geometryCell(source: CellSource, estimatedWrapColumns: number): DiffCell {
   return {
     type: source.type,
     content: source.content,
     lineNumber: source.lineNumber,
     tokens: [],
     fragments: [],
+    estimatedWrapColumns,
     reviewTarget: source.reviewTarget,
     sourceIdentity: source.sourceIdentity,
   };
@@ -427,20 +440,87 @@ function geometryCell(source: CellSource): DiffCell {
 function geometryLines(
   sources: Array<[CellSource] | [CellSource | null, CellSource | null]>,
   input: BuildDiffDocumentModelInput,
+  gutterWidth: number,
 ): GeometryLine[] {
+  const characterWidth = input.wrapLines ? input.measureText.measure("M") : 0;
   return sources.map((sourceCells) => {
+    const columns = input.wrapLines
+      ? Math.max(
+          1,
+          Math.floor(
+            (input.viewportWidth / sourceCells.length - gutterWidth - CODE_HORIZONTAL_PADDING) /
+              characterWidth,
+          ),
+        )
+      : Infinity;
     const cells = sourceCells.map((source) =>
-      source ? geometryCell(source) : null,
+      source ? geometryCell(source, columns) : null,
     ) as DiffLineRow["cells"];
     const reviewHeight = reviewHeightForCells(cells, input);
     return {
       cells,
       reviewHeight,
-      height: input.typography.lineHeight + reviewHeight,
+      // Unseen wrapped rows use a monospace estimate; materialization replaces
+      // it with the exact fragment count without changing source identity.
+      height:
+        input.typography.lineHeight *
+          Math.max(
+            1,
+            ...cells.map((cell) => {
+              return cell && input.wrapLines
+                ? Math.ceil(estimatedDisplayOffset(cell.content) / columns)
+                : 1;
+            }),
+          ) +
+        reviewHeight,
     };
   });
 }
 
+// Use the same tab expansion and column count for estimated heights and anchors.
+function estimatedDisplayOffset(text: string): number {
+  return text.length + (text.match(/\t/g)?.length ?? 0) * 3;
+}
+
+function estimatedVisualLine(cell: DiffCell, sourceOffset: number): number {
+  return Math.floor(
+    estimatedDisplayOffset(cell.content.slice(0, sourceOffset)) /
+      (cell.estimatedWrapColumns ?? Infinity),
+  );
+}
+
+function estimatedFragment(cell: DiffCell, visualIndex: number, lineHeight: number) {
+  const columns = cell.estimatedWrapColumns ?? Infinity;
+  const lastIndex = Math.max(0, Math.ceil(estimatedDisplayOffset(cell.content) / columns) - 1);
+  const index = Math.min(visualIndex, lastIndex);
+  const displayOffset = index === 0 ? 0 : index * columns;
+  let start = Math.min(displayOffset, cell.content.length);
+  if (cell.content.includes("\t")) {
+    let offset = 0;
+    start = 0;
+    while (start < cell.content.length && offset < displayOffset) {
+      offset += cell.content[start] === "\t" ? 4 : 1;
+      start += 1;
+    }
+  }
+  return { start, top: index * lineHeight };
+}
+
+// A resize can move the anchor outside the old window. Measure that row in the
+// same pass: estimated columns cannot identify exact shaped-text fragments.
+function containsMaterializationAnchor(
+  input: BuildDiffDocumentModelInput,
+  path: string,
+  cells: DiffLineRow["cells"],
+): boolean {
+  const anchor = input.materializationAnchor;
+  return (
+    anchor?.kind === "text" &&
+    anchor.path === path &&
+    cells.some((cell) => cell && sameSourceIdentity(cell.sourceIdentity, anchor.sourceIdentity))
+  );
+}
+
 function intersectsMaterializationWindow(
   input: BuildDiffDocumentModelInput,
   fileTop: number,
@@ -795,17 +875,27 @@ export function captureScrollAnchor(
   }
   const textY = Math.max(0, Math.min(scrollTop - row.top, row.height - row.reviewHeight));
   const visualIndex = Math.max(0, Math.floor(textY / model.lineHeight));
-  let cellIndex = row.cells.findIndex((cell) => Boolean(cell?.fragments[visualIndex]));
+  let cellIndex = row.cells.findIndex(
+    (cell) =>
+      cell &&
+      (cell.fragments.length > 0
+        ? Boolean(cell.fragments[visualIndex])
+        : estimatedFragment(cell, visualIndex, model.lineHeight).top ===
+          visualIndex * model.lineHeight),
+  );
   if (cellIndex < 0) cellIndex = row.cells.findIndex((cell) => cell !== null);
   const cell = row.cells[cellIndex];
   if (!cell) return { kind: "header", path: file.path, viewportDelta: row.top - scrollTop };
-  const fragment = cell.fragments[Math.min(cell.fragments.length - 1, visualIndex)];
-  const anchorY = row.top + (fragment?.top ?? 0);
+  const fragment =
+    cell.fragments.length > 0
+      ? cell.fragments[Math.min(cell.fragments.length - 1, visualIndex)]!
+      : estimatedFragment(cell, visualIndex, model.lineHeight);
+  const anchorY = row.top + fragment.top;
   return {
     kind: "text",
     path: file.path,
     sourceIdentity: cell.sourceIdentity,
-    cellOffset: fragment?.start ?? 0,
+    cellOffset: fragment.start,
     viewportDelta: anchorY - scrollTop,
   };
 }
@@ -831,8 +921,10 @@ export function resolveScrollAnchor(model: DiffDocumentModel, anchor: DiffScroll
   const fragment =
     cell.fragments.find(
       (candidate) => candidate.start <= anchor.cellOffset && anchor.cellOffset < candidate.end,
-    ) ?? cell.fragments.at(-1);
-  return Math.max(0, row.top + (fragment?.top ?? 0) - anchor.viewportDelta);
+    ) ??
+    cell.fragments.at(-1) ??
+    estimatedFragment(cell, estimatedVisualLine(cell, anchor.cellOffset), model.lineHeight);
+  return Math.max(0, row.top + fragment.top - anchor.viewportDelta);
 }
 
 export function resolveRelayoutScrollTop(

packages/app/src/git/diff-document/surface.native.tsx

@@ -38,6 +38,7 @@ import {
 } from "./horizontal-offsets";
 import {
   buildDiffDocumentModel,
+  captureScrollAnchor,
   resolveRelayoutScrollTop,
   retainReusableModels,
   shouldApplyRelayoutScroll,
@@ -138,6 +139,9 @@ export function DiffSurface(props: DiffSurfaceProps) {
         tooLarge: t("workspace.git.diff.tooLarge"),
       },
       materializationWindow: diffMaterializationWindow(fileWindowTop, viewport.height),
+      materializationAnchor: previousModelRef.current
+        ? captureScrollAnchor(previousModelRef.current, scrollTop.get())
+        : null,
       reuseFrom,
     });
     reusableModelRef.current = {
@@ -148,6 +152,7 @@ export function DiffSurface(props: DiffSurfaceProps) {
   }, [
     measurement,
     fileWindowTop,
+    scrollTop,
     props.collapsedFilePaths,
     props.displayPreferences.layout,
     props.displayPreferences.wrapLines,

packages/app/src/git/diff-document/surface.web.tsx

@@ -28,10 +28,20 @@ import {
 } from "./hit-testing";
 import { retainHorizontalOffsetMapForPaths } from "./horizontal-offsets";
 import { HorizontalScroll } from "./horizontal-scroll.web";
-import { buildDiffDocumentModel, FILE_HEADER_HEIGHT, resolveRelayoutScrollTop } from "./model";
+import {
+  buildDiffDocumentModel,
+  captureScrollAnchor,
+  FILE_HEADER_HEIGHT,
+  resolveRelayoutScrollTop,
+} from "./model";
 import { paintWebFileHeader, paintWebViewport } from "./paint.web";
 import { hasPointerDragStarted } from "./pointer-gesture";
-import { createMeasuredAdvances } from "./text-measurement";
+import {
+  createMeasuredAdvances,
+  createAdditiveAdvances,
+  createChunkedWidthMeasurer,
+  requiresShaping,
+} from "./text-measurement";
 import { retainDiffViewport } from "./viewport";
 import type {
   DiffHit,
@@ -183,6 +193,9 @@ export function DiffSurface(props: DiffSurfaceProps) {
         tooLarge: t("workspace.git.diff.tooLarge"),
       },
       materializationWindow: diffMaterializationWindow(fileWindowTop, viewport.height),
+      materializationAnchor: previousModelRef.current
+        ? captureScrollAnchor(previousModelRef.current, scrollTopRef.current)
+        : null,
     });
     return next;
   }, [
@@ -1166,5 +1179,13 @@ function createWebTextMeasurer(typography: DiffTypography): TextMeasurer {
   };
   // Canvas exposes no glyph coverage, so `requiresShaping` alone decides which
   // runs a shaper has to see -- there is no `glyphIds` to fall back on.
-  return { measure, measureAdvances: createMeasuredAdvances((text) => measure(text)) };
+  const additive = createAdditiveAdvances(measure);
+  return {
+    measure,
+    measureAdvances: createMeasuredAdvances(measure),
+    measureWidth: createChunkedWidthMeasurer((graphemes) => {
+      const text = graphemes.join("");
+      return requiresShaping(text) ? measure(text) : (additive(graphemes).at(-1) ?? 0);
+    }),
+  };
 }

packages/app/src/git/diff-document/types.ts

@@ -112,6 +112,8 @@ export interface DiffCell {
   lineNumber: number | null;
   tokens: DiffTokenRun[];
   fragments: DiffFragment[];
+  /** Monospace columns per visual line until this cell is measured. */
+  estimatedWrapColumns?: number;
   reviewTarget: ReviewableDiffTarget | null;
   sourceIdentity: DiffSourceIdentity;
 }
@@ -185,6 +187,8 @@ export interface BuildDiffDocumentModelInput {
   reviewActions?: InlineReviewActions;
   labels: { binary: string; tooLarge: string };
   materializationWindow?: { top: number; height: number };
+  /** Also measure the anchored row so relayout can restore its exact fragment. */
+  materializationAnchor?: DiffScrollAnchor | null;
   /** A geometry-compatible model whose unchanged file measurements may be reused. */
   reuseFrom?: readonly DiffDocumentModel[];
 }

packages/app/src/git/diff-document/workspace-cache.test.ts

@@ -95,6 +95,37 @@ describe("diff document workspace cache", () => {
     expect(stats.calls).toBe(0);
   });
 
+  it("materializes a new anchor when the viewport window is unchanged", () => {
+    const cache = createDiffDocumentWorkspaceCache();
+    const source = diffFile();
+    source.hunks[0]!.lines = Array.from({ length: 100 }, () => ({
+      type: "add" as const,
+      content: "x".repeat(200),
+    }));
+    const { measureText } = countingMeasurer();
+    const input = modelInput([source], measureText, {
+      wrapLines: true,
+      materializationWindow: { top: 30, height: 54 },
+    });
+    const first = cache.buildModel(input);
+    const anchored = cache.buildModel({
+      ...input,
+      materializationAnchor: {
+        kind: "text",
+        path: source.path,
+        sourceIdentity: { hunkIndex: 0, lineIndex: 50, side: "new" },
+        cellOffset: 90,
+        viewportDelta: -2,
+      },
+    });
+    const firstRow = first.rows[50]!;
+    const anchoredRow = anchored.rows[50]!;
+    expect(firstRow.kind === "line" && firstRow.cells[0]!.fragments.length).toBe(0);
+    expect(anchoredRow.kind === "line" && anchoredRow.cells[0]!.fragments.length).toBeGreaterThan(
+      0,
+    );
+  });
+
   it("retains text cells for unchanged files when another file changes", () => {
     const cache = createDiffDocumentWorkspaceCache();
     const { measureText } = countingMeasurer();

packages/app/src/git/diff-document/workspace-cache.tsx

@@ -128,7 +128,9 @@ function exactModelKey(input: Omit<BuildDiffDocumentModelInput, "reuseFrom">): s
   const materializationWindow = input.materializationWindow
     ? [input.materializationWindow.top, input.materializationWindow.height]
     : null;
-  return JSON.stringify([collapsedFilePaths, reviewGeometry, materializationWindow]);
+  const anchor = input.materializationAnchor;
+  const anchoredRow = anchor?.kind === "text" ? [anchor.path, anchor.sourceIdentity] : null;
+  return JSON.stringify([collapsedFilePaths, reviewGeometry, materializationWindow, anchoredRow]);
 }
 
 function typographyKey(typography: DiffTypography): string {

packages/app/src/git/pull-request-panel/checks-ring.tsx

@@ -1,3 +1,4 @@
+import { isNative } from "@/constants/platform";
 import Svg, { Circle } from "react-native-svg";
 import { StyleSheet, withUnistyles } from "react-native-unistyles";
 import type { Theme } from "@/styles/theme";
@@ -75,8 +76,9 @@ function ChecksRingSvg({
       height={size}
       viewBox={`0 0 ${VIEW_BOX} ${VIEW_BOX}`}
       style={ringStyles.svg}
-      accessibilityElementsHidden
-      importantForAccessibility="no-hide-descendants"
+      {...(isNative
+        ? { accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants" }
+        : { "aria-hidden": true })}
     >
       <Circle
         cx={CENTER}

packages/app/src/hooks/use-agent-initialization.test.ts

@@ -78,6 +78,7 @@ describe("ensureAgentIsInitialized", () => {
           cursor: { epoch: "epoch-1", seq: 42 },
           limit: TIMELINE_FETCH_PAGE_SIZE,
           projection: "projected",
+          wholeTurns: true,
         },
       },
     ]);
@@ -105,6 +106,7 @@ describe("ensureAgentIsInitialized", () => {
           direction: "tail",
           limit: TIMELINE_FETCH_PAGE_SIZE,
           projection: "projected",
+          wholeTurns: true,
         },
       },
     ]);
@@ -148,6 +150,7 @@ describe("ensureAgentIsInitialized", () => {
           direction: "tail",
           limit: TIMELINE_FETCH_PAGE_SIZE,
           projection: "projected",
+          wholeTurns: true,
         },
       },
     ]);
@@ -192,6 +195,7 @@ describe("ensureAgentIsInitialized", () => {
           cursor: { epoch: "epoch-1", seq: 12 },
           limit: TIMELINE_FETCH_PAGE_SIZE,
           projection: "projected",
+          wholeTurns: true,
         },
       },
     ]);
@@ -283,6 +287,7 @@ describe("refreshAgent", () => {
           direction: "tail",
           limit: TIMELINE_FETCH_PAGE_SIZE,
           projection: "projected",
+          wholeTurns: true,
         },
       },
     ]);

packages/app/src/hooks/use-directory-demand.test.tsx

@@ -0,0 +1,40 @@
+/**
+ * @vitest-environment jsdom
+ */
+import { act } from "react";
+import { createRoot, type Root } from "react-dom/client";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { getHostRuntimeStore } from "@/runtime/host-runtime";
+import { useDirectoryDemand } from "./use-directory-demand";
+
+function Probe({ serverId }: { serverId: string | null }) {
+  useDirectoryDemand(serverId);
+  return null;
+}
+
+describe("useDirectoryDemand", () => {
+  let root: Root | null = null;
+  afterEach(() => {
+    act(() => root?.unmount());
+    root = null;
+    vi.restoreAllMocks();
+  });
+
+  it("demands the host directory while mounted and releases it on unmount", () => {
+    const release = vi.fn();
+    const acquire = vi
+      .spyOn(getHostRuntimeStore(), "acquireDirectoryDemand")
+      .mockImplementation(() => release);
+    const container = document.createElement("div");
+    root = createRoot(container);
+
+    act(() => root?.render(<Probe serverId="srv_a" />));
+    expect(acquire).toHaveBeenCalledTimes(1);
+    expect(acquire).toHaveBeenCalledWith("srv_a");
+    expect(release).not.toHaveBeenCalled();
+
+    act(() => root?.render(<Probe serverId={null} />));
+    expect(release).toHaveBeenCalledTimes(1);
+    expect(acquire).toHaveBeenCalledTimes(1);
+  });
+});