fix(codex): honor full-access MCP elicitations

Codex's never-ask policy accepts empty MCP forms, but Paseo routed those app-server requests into its permission channel. Mirror that provider contract while declining data-bearing forms that Paseo cannot answer.

.agents/skills/release-beta/SKILL.md

@@ -1,13 +1,9 @@
 ---
 name: release-beta
-description: Cut a beta release of Paseo. Use when the user says "release beta", "cut a beta", "ship a beta", "beta release", or "/release-beta". Betas are release candidates on the beta channel — they carry an in-place changelog entry, don't move the website download target, and publish npm only on the beta dist-tag.
+description: Cut a beta release of Paseo. Use when the user says "release beta", "cut a beta", "ship a beta", "beta release", or "/release-beta".
 user-invocable: true
 ---
 
 # Release beta
 
-Read `docs/release.md` in the Paseo repo and follow the **Beta flow** section end-to-end. Run the **Beta release** completion checklist at the bottom of that doc.
-
-During preparation, classify the previous-stable-to-`HEAD` diff as patch or minor and show the target version and rationale to the user. Agents never select a major version autonomously.
-
-Each beta updates an in-place `CHANGELOG.md` entry (`## X.Y.Z-beta.N`) that gets overwritten at promotion, and npm publishes only on the explicit `beta` dist-tag.
+Follow the **Beta flow** and **Beta release** completion checklist in `docs/release.md` end-to-end.

.agents/skills/release-stable/SKILL.md

@@ -6,8 +6,4 @@ user-invocable: true
 
 # Release stable
 
-Read `docs/release.md` in the Paseo repo and follow the **Standard release (stable)** flow if cutting fresh, or the **Beta flow** promotion step if promoting an existing beta. Run the **Stable release (or promotion)** completion checklist at the bottom of that doc.
-
-For a fresh release, classify the previous-stable-to-`HEAD` diff as patch or minor and show the target version and rationale to the user. Agents never select a major version autonomously.
-
-The doc covers the changelog, pre-release sanity check, and post-release babysit pattern. Don't skip steps.
+Follow the applicable flow and the **Stable release (or promotion)** completion checklist in `docs/release.md` end-to-end.

CHANGELOG.md

@@ -1,5 +1,33 @@
 # Changelog
 
+## 0.3.1 - 2026-08-09
+
+### Added
+
+- Unassign keyboard shortcuts and see the effective bindings in shortcut help ([#2510](https://github.com/getpaseo/paseo/pull/2510) by [@cleiter](https://github.com/cleiter), [#2985](https://github.com/getpaseo/paseo/pull/2985) by [@cleiter](https://github.com/cleiter))
+- Choose a Pure black theme ([#3012](https://github.com/getpaseo/paseo/pull/3012) by [@shrimpwtf](https://github.com/shrimpwtf))
+
+### Improved
+
+- Running agents use a clearer animated status ring ([c0daf8e](https://github.com/getpaseo/paseo/commit/c0daf8e066e0d7379723a2a6ddea20afc71ead20) by [@cleiter](https://github.com/cleiter))
+- Workspace Git updates stay responsive under file-watcher failures, heavy Git activity, and large shared-worktree repositories ([#3056](https://github.com/getpaseo/paseo/pull/3056), [#3033](https://github.com/getpaseo/paseo/pull/3033) by [@dwyanewang](https://github.com/dwyanewang), [#3078](https://github.com/getpaseo/paseo/pull/3078))
+- Kimi usage refreshes correctly and shows five-hour limits and reasoning levels ([#2743](https://github.com/getpaseo/paseo/pull/2743) by [@UnbrokenHunter](https://github.com/UnbrokenHunter))
+- Resize the desktop sidebar with touch ([#2953](https://github.com/getpaseo/paseo/pull/2953) by [@colonelpanic8](https://github.com/colonelpanic8))
+
+### Fixed
+
+- Direct LAN connections work again on macOS ([#3071](https://github.com/getpaseo/paseo/pull/3071))
+- Desktop update checks no longer report an error while platform downloads are still publishing ([#3076](https://github.com/getpaseo/paseo/pull/3076))
+- Copied lists keep their markers across selection boundaries ([#3055](https://github.com/getpaseo/paseo/pull/3055))
+- Switching hosts keeps the active project selected ([#3051](https://github.com/getpaseo/paseo/pull/3051))
+- New Workspace keeps project and isolation controls inside the composer ([#3050](https://github.com/getpaseo/paseo/pull/3050))
+- Session rename is reachable from the mobile sessions menu ([#2924](https://github.com/getpaseo/paseo/pull/2924) by [@kaspesi](https://github.com/kaspesi))
+- Desktop notification sounds play again ([#2582](https://github.com/getpaseo/paseo/pull/2582) by [@gstamp](https://github.com/gstamp))
+- Codex slash commands omit disabled skills ([#2759](https://github.com/getpaseo/paseo/pull/2759) by [@jasonhnd](https://github.com/jasonhnd))
+- Exact ignored file paths resolve correctly ([#3042](https://github.com/getpaseo/paseo/pull/3042) by [@cleiter](https://github.com/cleiter))
+- Claude question notifications summarize the requested input ([#2925](https://github.com/getpaseo/paseo/pull/2925) by [@SihyeonJeon](https://github.com/SihyeonJeon))
+- The crash screen stays readable and keeps its retry action reachable ([#3043](https://github.com/getpaseo/paseo/pull/3043))
+
 ## 0.3.0 - 2026-08-08
 
 ### Added

CLAUDE.md

@@ -46,6 +46,7 @@ At the start of non-trivial work, list `docs/` and skim anything relevant to the
 | [docs/protocol-compatibility.md](docs/protocol-compatibility.md)   | Why app/daemon versions drift, protocol vs feature contract, capability gating, COMPAT tagging                                 |
 | [docs/protocol-validation.md](docs/protocol-validation.md)         | zod-aot generated inbound WebSocket validation, patched compiler regressions, schema-purity rules                              |
 | [docs/terminal-performance.md](docs/terminal-performance.md)       | Terminal latency pipeline, coalescing/backpressure invariants, benchmark + perf spec usage                                     |
+| [docs/file-observation.md](docs/file-observation.md)               | Recursive watcher ownership, Linux constraints, teardown invariants, and Parcel comparison                                     |
 | [docs/testing.md](docs/testing.md)                                 | TDD workflow, determinism, real dependencies over mocks, test organization                                                     |
 | [docs/qa.md](docs/qa.md)                                           | QA evidence bar for pull requests — platform matrix, version drift, performance, UI proof                                      |
 | [docs/mobile-testing.md](docs/mobile-testing.md)                   | Maestro and mobile test workflows                                                                                              |
@@ -57,6 +58,7 @@ At the start of non-trivial work, list `docs/` and skim anything relevant to the
 | [docs/release.md](docs/release.md)                                 | Release playbook, draft releases, completion checklist                                                                         |
 | [docs/terminal-activity.md](docs/terminal-activity.md)             | Terminal activity indicators — source-agnostic tracker, agent hook reporting, adding a new hook provider                       |
 | [SECURITY.md](SECURITY.md)                                         | Relay threat model, E2E encryption, DNS rebinding, agent auth                                                                  |
+| [public-docs/hub/security.md](public-docs/hub/security.md)         | Public Hub guide — trust boundaries, untrusted triggers, provider controls, and output authority                               |
 
 ### Writing docs
 

README.md

@@ -105,7 +105,7 @@ Everything you can do in the app, you can do from the terminal.
 
 ```bash
 paseo run --provider claude/opus-4.6 "implement user authentication"
-paseo run --provider codex/gpt-5.4 --worktree feature-x "implement feature X"
+paseo run --provider codex/gpt-5.5 --worktree feature-x "implement feature X"
 
 paseo ls                           # list running agents
 paseo attach abc123                # stream live output
@@ -117,6 +117,30 @@ paseo --host workstation.local:6767 run "run the full test suite"
 
 See the [full CLI reference](https://paseo.sh/docs/cli) for more.
 
+## TypeScript SDK
+
+Build issue integrations, dashboards, and orchestration services with `@getpaseo/client`:
+
+```ts
+import { createPaseoClient } from "@getpaseo/client";
+
+const client = createPaseoClient({ url: "ws://127.0.0.1:6767/ws" });
+await client.connect();
+
+const agent = await client.agents.create({
+  config: { provider: "codex/gpt-5.5" },
+  cwd: "/Users/me/dev/storefront",
+  prompt: "Review the current diff and name the riskiest change.",
+});
+
+const result = await agent.waitForFinish();
+console.log(result.lastMessage);
+
+await client.close();
+```
+
+See the [SDK quickstart](https://paseo.sh/docs/sdk/quickstart), [recipes](https://paseo.sh/docs/sdk/recipes), and [API reference](https://paseo.sh/docs/sdk/reference).
+
 ## Skills
 
 Skills teach your agent to use Paseo to orchestrate other agents.

docs/data-model.md

@@ -341,7 +341,7 @@ One file per schedule. ID is 8 hex characters.
 ### Nested: ScheduleTarget (discriminated union on `type`)
 
 - `{ type: "agent", agentId: string }` — send to existing agent
-- `{ type: "new-agent", config: { provider, cwd, modeId?, model?, thinkingOptionId?, title?, approvalPolicy?, sandboxMode?, networkAccess?, webSearch?, extra?, systemPrompt?, mcpServers? } }` — create a new agent
+- `{ type: "new-agent", config: { provider, cwd, modeId?, model?, thinkingOptionId?, title?, providerOptions?, featureValues?, systemPrompt?, mcpServers? } }` — create a new agent
 
 ### Nested: ScheduleRun
 

docs/design.md

@@ -223,7 +223,7 @@ Selected state on rows in a desktop list+detail uses `surfaceSidebarHover` as th
 
 There is exactly one token per status signal — `statusSuccess`, `statusDanger`, `statusWarning`, `statusMerged` — and every status surface uses it: PR state icons, CI check icons and pies, diff stats, file-change icons, status pills, usage bars. A surface does not get a quieter or louder variant because of where it sits. If a dense list feels loud, that is a density or weight problem; fix the density, not the color. The tokens are generated, not hand-picked — see the rule in `packages/app/src/styles/theme.ts` and regenerate rather than nudging one value. The level is set by the densest consumer, the sidebar workspace list.
 
-Status **dots** are the one exception, and they are a family of their own — `statusDotSuccess`, `statusDotDanger`, `statusDotWarning`, `statusDotRunning`, read only by `getStatusDotColor` (`packages/app/src/utils/status-dot-color.ts`). Same hues and the same generation rule, but their own band: pushed away from the surface rather than toward it (darker in light, lighter in dark) and at 90% of gamut chroma against the status family's 55–60%. A dot is a few points of solid color with no shape to read and no label attached, and the running one pulses, so at the status band's lightness the dots read dimmer than the metadata beside them — backwards, since the dot is the row's state. All four move together; regenerate the set, never one hue.
+Status **dots** are the one exception, and they are a family of their own — `statusDotSuccess`, `statusDotDanger`, `statusDotWarning`, `statusDotRunning`, read only by `getStatusDotColor` (`packages/app/src/utils/status-dot-color.ts`). Same hues and the same generation rule, but their own band: 90% of gamut chroma against the status family's 55–60%. A dot is a few points of solid color with no shape to read and no label attached, and the running one pulses, so at the status band's chroma the dots read dimmer than the metadata beside them — backwards, since the dot is the row's state. Lightness is set by hue separation rather than by distance from the surface: at 6pt four dark hues on a light surface all read as one dark blob no matter how much contrast they have. So the light band runs as bright as the contrast floor allows at L=0.62, the last step where all four clear 3:1 against the sidebar's `surface2`; the dark band sits at L=0.72, where danger turns pink above. All four move together; regenerate the set, never one hue.
 
 Status pills are the status token as foreground on a 10%-alpha tint of the same token (`${token}1a`), with a 20% border (`${token}33`). The `<StatusBadge>` primitive (`packages/app/src/components/ui/status-badge.tsx`) is canonical; a pill never reaches into `palette`.
 

docs/file-observation.md

@@ -0,0 +1,19 @@
+# File observation
+
+Use `packages/server/src/server/file-observer` for recursive filesystem observation. Create one observer service at the owning service boundary, subscribe roots through it, and close it during owner shutdown. Keep platform watchers, directory discovery, exclusion reconciliation, event batching, failure cleanup, diagnostics, and teardown inside the module. A consumer supplies a root and excluded subtrees; it must not branch on the platform or manage child watchers.
+
+Do not replace the Linux implementation with `fs.watch({ recursive: true })`. Node 22 implements Linux recursion in JavaScript by walking the tree and watching every file and directory. Paseo's directory-only Linux watcher already exhausted resources before ignored-tree pruning and a watcher cap were added in [#794](https://github.com/getpaseo/paseo/pull/794).
+
+Closing an observation must remain safe after its root is renamed or removed. Workspace archive removes owned worktrees while releasing observation references, so teardown cannot assume the watched path still exists.
+
+`unsubscribe()` is an awaited barrier. Once it resolves, no scan, reconciliation, queued event, native handle, or callback may remain. `updateIgnore()` is the equivalent barrier for excluded paths: events queued below a newly excluded root cannot be delivered after it resolves. Treat path disappearance while scanning, attaching, or receiving a watcher error as rename/archive churn. Surface permission and resource errors so WorkspaceGit can enter bounded polling.
+
+Linux topology repair is trailing-debounced and scoped to the renamed path. A file rename needs one classification stat; a new or moved directory scans only its subtree. Full-tree scans are reserved for startup and ignore-set replacement. The initial Linux scan conservatively emits existing files discovered before their directory watcher was installed; WorkspaceGit batches these into one refresh. Benchmark this startup cost with pre-populated trees.
+
+Windows and macOS use one native recursive watcher plus an ignored-pruned, directory-indexed inventory. Native events deliver immediately. Named events trigger serialized shallow scans of their parent directories; known directory events also reconcile that subtree. This recovers concrete create and delete paths omitted by coalescing without walking the whole root for each edit. Startup and exclusion changes use an awaited full inventory barrier. Activity arms a full safety audit 30 seconds after it settles, with a 30-second minimum interval and a five-minute starvation bound; pathless native events also trigger an immediate shallow root scan. Observation fails into polling rather than retaining more than 250,000 file and directory entries per root.
+
+Read aggregate health from the owning observer service. Runtime metrics include active observations, native handles, tracked native files, pending events and immediate reconciliation work, scoped and full reconciliation activity and latency, and failure counts. Delayed safety audits do not count as pending work. Closing the service releases every subscription and clears its diagnostics. Do not add path lists, watcher handles, or platform-specific controls to this interface.
+
+Git owns Git-ignore evaluation. The observer accepts absolute excluded roots and applies updates without replacing the observation or exposing its watcher topology. This keeps tracked files inside otherwise ignored directories observable and keeps Git policy out of the filesystem module.
+
+The real-filesystem contracts and daemon auto-archive lifecycle run in the normal server test suite. Use the scripts only for manual performance and soak work: `npm run measure:file-observer --workspace=@getpaseo/server` measures burst and sustained-create behavior, and `npm run repro:file-observer-teardown --workspace=@getpaseo/server` runs the teardown soak.

docs/hub.md

@@ -2,7 +2,9 @@
 
 Paseo Hub is an explicit opt-in connection from one Paseo daemon to one Hub. Running a daemon does
 not register it with a Hub. The relationship begins only when a user runs
-`paseo hub connect <url> --token <token>` from the daemon machine.
+`paseo hub connect [url]` from the daemon machine with an explicit API key or matching stored CLI login.
+
+The human CLI login and daemon relationship are separate identities. `paseo hub login [url]` stores a durable organization-scoped CLI credential keyed by normalized Hub origin under `PASEO_HOME`. Origin resolution uses explicit command input, `PASEO_HUB_URL`, active login, then `https://hub.paseo.sh`. Connect uses exact-origin authority to request a one-time enrollment token, then passes only that token to the daemon. The daemon generates and persists its own relationship credential.
 
 ## Connection and authority
 
@@ -44,12 +46,30 @@ daemon, execution, and agent identity with that terminal state. Paseo never stor
 replays the original prompt. A duplicate create returns the existing agent without starting another
 turn.
 
-Hub creates use the same agent creation path as trusted clients. They may select any existing
-worktree target shape and carry optional MCP server configuration for the agent session. The daemon
-keeps that configuration in its private agent record so provider sessions can recover after a
-restart; neither ordinary client snapshots and updates nor Hub projections expose session
-configuration. Execution completion policy remains outside the daemon: a completed agent turn does
-not imply that the Hub execution is terminal.
+Every Hub execution creates a fresh Paseo workspace. The workspace owns the execution's agents and
+terminals. Local checkout and worktree targets select only the workspace backing and isolation; the
+Hub cannot select or reuse an existing workspace. Hub creates use the same agent creation path as
+trusted clients. They may select any worktree target shape and carry optional MCP server configuration and provider-native
+`providerOptions` for the agent session. The daemon keeps that configuration in its private agent
+record so provider sessions can recover after a restart; neither ordinary client snapshots and
+updates nor Hub projections expose session configuration. See [providers.md](providers.md) for the
+supported provider keys.
+
+Hub tool preapproval is a private, structured list of `{ kind: "mcp", server, tool }` references.
+Every reference must name an MCP server injected by the same create request. The daemon translates
+only those identities into the selected provider's native approval configuration. The protocol
+cannot name or preapprove native tools such as Bash, Edit, or Write. Explicit local or managed ask
+and deny policy takes precedence. Providers without exact MCP preapproval support reject unattended
+Hub creation instead of broadening access or waiting for an invisible prompt.
+When a create request includes a tool policy, a successful response includes
+`toolPolicyApplied: true`; absence of that acknowledgement is not success for unattended execution.
+
+A Hub workflow may use read-only provider settings for classifier steps. This is defense in depth,
+not a security boundary: classifier labels and prompt intent do not authorize tools. Exact MCP grants
+and the provider's local or managed policy remain the authorization controls.
+
+Execution completion policy remains outside the daemon: a completed agent turn does not imply that
+the Hub execution is terminal.
 
 The Hub ends an execution by sending `hub.execution.control.request` with the durable execution ID
 and either `interrupt` or `archive`. The daemon resolves the agent from the authenticated daemon
@@ -59,11 +79,11 @@ If no execution exists for that authenticated daemon and execution ID, interrupt
 success because the requested stopped or archived state already holds. An execution owned by another
 daemon is indistinguishable from a missing execution and is never exposed or affected.
 
-Interrupt uses the ordinary agent cancellation lifecycle. Archive first archives the owned agent.
-When that agent belongs to an active Paseo-owned worktree workspace, the daemon also archives the
-workspace through the shared workspace archive service, so the backing directory is removed only
-after its final active workspace reference disappears. Local and shared checkouts archive only the
-execution-owned agent.
+Interrupt uses the ordinary agent cancellation lifecycle. Archive resolves the execution agent's
+required workspaceId and sends it through the shared workspace archive service. The service archives
+that workspace's agents and terminals, then removes Paseo-owned backing directories only after their
+final active workspace reference disappears. Local checkouts remain on disk; sibling workspaces
+sharing a backing directory remain active.
 
 ## Disconnect and revocation
 
@@ -81,9 +101,13 @@ opening a Hub socket. This also covers an enrollment whose request may have succ
 response was lost. `--force` removes local authority immediately and warns that remote revocation may
 still be pending.
 
+`paseo hub logout` removes only the active human CLI credential and preserves credentials for other origins. Interactive logout inspects and optionally disconnects a same-origin daemon before deleting the login; a failed requested disconnect preserves the login. JSON and noninteractive logout never prompt or disconnect implicitly.
+
 ## Cross-repository compatibility
 
 The consumer implementation lives in Paseo Cloud. Cloud owns its copy of the Hub wire schemas and
 has no Paseo runtime or build dependency. Cross-repository end-to-end verification separately builds
 a Paseo source checkout and exercises the real daemon, CLI, direct WebSocket, Cloud service, and
 Postgres. That compatibility fixture is not a package dependency or fallback implementation.
+Its `hub-e2e` ACP provider accepts only exact tool names on the injected `hub` MCP server. Other
+custom ACP providers remain unsupported for unattended preapproval.

docs/providers.md

@@ -2,6 +2,46 @@
 
 This guide walks through adding a new agent provider end-to-end. There are two integration patterns, and this doc covers both.
 
+## Provider-native session options
+
+`AgentSessionConfig.providerOptions` carries JSON-safe configuration for the selected provider. The
+names and nesting are the provider's native contract; options are not portable between providers.
+Paseo validates the object with the selected provider's strict schema before constructing a session.
+Unknown keys fail with their `providerOptions.*` path. Paseo-owned controls such as cwd, model,
+prompt, environment, session identity, MCP transport, callbacks, and hooks cannot be passed here.
+
+This Paseo version accepts these keys:
+
+- **Codex:** `approval_policy`, `sandbox_mode`,
+  `sandbox_workspace_write.{writable_roots,network_access,exclude_slash_tmp,exclude_tmpdir_env_var}`,
+  `web_search`, `features.multi_agent_v2`, and `features.network_proxy`. A network proxy object may
+  contain `enabled`, `proxy_url`, `socks_url`, `enable_socks5`, `enable_socks5_udp`,
+  `allow_local_binding`, `allow_upstream_proxy`, `dangerously_allow_all_unix_sockets`,
+  `dangerously_allow_non_loopback_proxy`, `domains`, and `unix_sockets`. See the
+  [Codex configuration reference](https://developers.openai.com/codex/config-reference).
+- **Claude:** `allowedTools`, `disallowedTools`, `additionalDirectories`, `sandbox`, and `settings`.
+  The accepted sandbox fields cover enablement, fail-if-unavailable behavior, excluded and
+  unsandboxed commands, filesystem read/write rules, network domain/socket/local-binding rules,
+  weaker nested sandboxing, ignored violations, and the ripgrep command. `settings` accepts native
+  `permissions.{allow,ask,deny}` and sandbox settings. See the
+  [Claude Agent SDK TypeScript reference](https://platform.claude.com/docs/en/agent-sdk/typescript)
+  and [Claude settings reference](https://code.claude.com/docs/en/settings).
+- **OpenCode:** `permission`, either one `ask`/`allow`/`deny` action or the native per-tool rule
+  object. Supported entries are `read`, `edit`, `glob`, `grep`, `list`, `bash`, `task`,
+  `external_directory`, `todowrite`, `question`, `webfetch`, `websearch`, `codesearch`,
+  `repo_clone`, `repo_overview`, `lsp`, `doom_loop`, and `skill`. See the
+  [OpenCode permissions reference](https://opencode.ai/docs/permissions/). OpenCode permissions are
+  application policy, not an OS sandbox.
+
+Each provider definition owns its option schema and exact MCP preapproval mapping. A new provider
+must fail closed for Hub unattended execution until it can approve one exact injected MCP server
+and tool identity without approving native tools.
+
+Codex **Full Access** sends `approvalPolicy: "never"` and `danger-full-access` to the app server.
+If a permission-only MCP form still reaches the provider, Paseo accepts it when its schema has no
+properties. Forms with fields and URL/auth flows are declined because Paseo cannot supply user data
+or credentials. Restricted Codex modes keep their existing approval behavior.
+
 ## Two Integration Patterns
 
 ### ACP (Agent Client Protocol) -- recommended

docs/release.md

@@ -9,19 +9,17 @@ A release has exactly two steps. The agent does the first, the user authorizes t
 **Preparation** (local, reversible — agent does this):
 
 - format, lint, typecheck all green
-- ACP provider catalog drift checked with `npm run acp:version-drift:check`;
-  if stale package-runner pins are intentional, say so explicitly, otherwise run
-  `npm run acp:version-drift:update` and commit the updated catalog
-- classify the previous-stable-to-`HEAD` diff as patch or minor, then show the
+- resolve the release source to one commit and confirm that commit's existing CI is green
+- classify the diff from the previous stable to the release source as patch or minor, then show the
   target version and rationale to the user
 - draft the changelog, show it to the user, wait for review
 - run the pre-release sanity check, surface findings to the user
-- confirm CI is green
 
 **Go-ahead** (user says "go ahead"):
 
-- commit the approved changelog
-- run the release
+- commit the approved release inputs locally
+- run the release, which publishes npm and pushes the prepared branch and tag
+- create the release heartbeat immediately and babysit it to completion
 
 Rules that apply to both steps:
 
@@ -31,12 +29,43 @@ Rules that apply to both steps:
 - Invoking a release skill is intent to start the flow, not blanket authorization to publish.
 - If the user asks for a release preview, show the prospective changelog/release contents and answer questions, but do not commit, tag, publish, or run release commands until they explicitly authorize the release.
 
+## Release source and CI
+
+The default release source is `origin/main`. Fetch `origin`, then record the
+resolved commit. The default release checkout is a clean local `main` whose
+`HEAD` equals `origin/main`.
+
+An explicit user instruction can select another ref, such as a hotfix commit or
+tag. Resolve that ref once and apply every source, diff, and CI check to that
+commit instead of `origin/main`.
+
+Before making release-preparation commits, confirm the existing CI run for the
+resolved commit is green. Pending CI is watched to completion. Release
+preparation then stays local through the changelog, any explicitly requested ACP
+catalog update, lockfile preparation, and the version commit. After approval,
+commit the prepared inputs locally and run the release command. Its branch and
+tag push is the one remote release batch and starts CI for the complete release
+commit.
+
+## ACP catalog updates
+
+ACP catalog work enters a release through an explicit user request:
+
+- **Check ACP drift** — run `npm run acp:version-drift:check`. When drift exists,
+  run `npm run acp:version-drift:update`, verify the catalog, and include the
+  update in the local release-preparation commits.
+- **Update ACP** — run `npm run acp:version-drift:update`, verify the catalog, and
+  include the update in the local release-preparation commits.
+
+The release authorization covers the requested ACP commit. It ships in the same
+release push as the changelog and version commit.
+
 ## Two paths
 
-There are two supported ways to ship from `main`:
+There are two supported release paths:
 
 1. **Direct stable release**: you are ready to ship the current `main` commit to everyone immediately.
-2. **Beta flow**: release candidates on the `beta` channel. Betas carry an in-place changelog entry (beta users check it), publish npm only on the explicit `beta` dist-tag, and never become the website's default download — they sit behind the Stable/Beta switch on `/download`.
+2. **Beta flow**: release candidates on the `beta` channel. Each beta carries its own changelog entry, publishes npm only on the explicit `beta` dist-tag, and stays behind the Stable/Beta switch on `/download`.
 
 Paseo has one linear release track even though npm dist-tags are independent
 pointers. The npm invariant is:
@@ -48,8 +77,9 @@ pointers. The npm invariant is:
 
 ## Release version decision
 
-Every fresh release starts by classifying the full previous-stable-to-`HEAD`
-diff. The highest-impact change determines the version:
+Every fresh release starts by classifying the full diff from the previous
+stable to the resolved release source. The highest-impact change determines the
+version:
 
 - **Minor** — a user would experience the release as a significant upgrade. This
   includes substantial new workflows, providers, forges, platforms, integrations,
@@ -72,7 +102,7 @@ as described in **Fixing a failed release build**.
 
 Before running any stable release command:
 
-- Make sure the intended release commit is already committed to `main` and the working tree is clean.
+- Make sure the resolved release source passed CI, the approved release inputs are committed locally on the intended branch, and the working tree is clean.
 - **Run `npm run format`, `npm run lint`, and `npm run typecheck` and commit any resulting changes BEFORE you start any `release:*` command.** `release:check` runs `npm install --workspaces --include-workspace-root` as part of `release:prepare`, which can mutate `package-lock.json` (e.g. churning `"dev": true` markers on optional deps). The next step, `version:all:*`, runs `npm version` which aborts when the working tree is dirty. If this happens mid-flight you have to commit the lockfile churn before retrying — and the pre-commit format hook will reject a lockfile-only commit because oxfmt internally skips `package-lock.json` while lefthook's glob still matches it. Avoid the whole mess by running format/lint/typecheck first, then `release:prepare` once on its own to absorb any lockfile churn into a normal commit, then start the release.
 - Do not use a release command as a substitute for checking whether the current commit is actually ready.
 
@@ -133,7 +163,7 @@ npm run release:promote          # Promote X.Y.Z-beta.N to stable X.Y.Z
 - `release:promote` creates a fresh stable tag like `v0.1.41`; the final release never reuses the beta tag
 - Desktop assets now come from the Electron package at `packages/desktop`
 - Beta releases use Electron's `beta` update channel. Users on the stable channel only receive stable releases; users on the beta channel receive beta releases and the final stable release when it is published.
-- **Betas carry a changelog entry.** Beta users read release notes, so each beta updates an in-place `CHANGELOG.md` entry (`## X.Y.Z-beta.N`) that `Release Notes Sync` mirrors into the prerelease body on the tag push. The entry is intermediary: promotion overwrites it in place with the final stable entry, so no `-beta.N` heading is ever left behind. See the Changelog policy section.
+- **Each beta carries its own changelog entry.** `Release Notes Sync` mirrors the matching `## X.Y.Z-beta.N` entry into that prerelease body. Promotion collapses every beta entry for the version into one final stable entry. See the Changelog policy section.
 
 Use the beta path when you need to:
 
@@ -291,11 +321,30 @@ Do not treat `build_ios: SUCCESS` or `submit_ios: SUCCESS` as a completed iOS re
 
 To confirm the submission landed, inspect the EAS workflow with `npx eas workflow:view <workflow-run-id> --json`. App Store Connect (review state for the matching version/build) and the Play Console track are the final ground truth.
 
-### Babysitting mobile after a release
+## Release completion and heartbeat
 
-The user rarely opens the Expo dashboard. A failed EAS build or submit/review job can sit silently until users complain about a stale version. After every stable release, set up a long-delay babysit that re-checks GitHub Actions, EAS builds, and the EAS `Release Mobile` workflow for the release tag. If any build is `ERRORED`/`CANCELED`, any workflow is `FAILURE`, or any required submit/review job fails, surface it immediately. If all builds are `FINISHED` and all required submit/review jobs are `SUCCESS`, confirm and stop.
+A release is **in progress** after npm publication and tag push. Report it as
+**shipped** only after every applicable build, publication, asset, manifest, and
+store submission passes the completion checklist.
 
-**Use `create_heartbeat`, never `create_schedule`, for release babysitting.** Babysitting fires back into the current conversation as a wake-up prompt. `create_schedule` starts a fresh agent the user has to find and read; `create_heartbeat` surfaces the build status inline in the conversation that owns the release, where it is impossible to miss. If you find yourself reaching for `create_schedule` for a release babysit, you are about to ship a status report into a void.
+Immediately after every beta, stable, or promotion tag push, create a heartbeat
+that resumes the release in the current conversation. Create it automatically
+with `create_heartbeat`. The heartbeat owns the release until it either reaches
+the completion checklist or finds a failure that needs new user authority.
+
+Each heartbeat checks the release tag commit, all GitHub Actions runs for the
+release branch and tag, npm dist-tags, the GitHub Release body and assets,
+desktop updater manifests, the published Docker image, and the applicable EAS
+workflow. Inspect the GitHub Release itself and confirm that the macOS, Linux,
+Windows, and Android APK assets are present along with the channel manifests
+(`latest-mac.yml`, `latest-linux.yml`, and `latest.yml` for stable;
+`beta-mac.yml`, `beta-linux.yml`, and `beta.yml` for beta).
+
+For stable releases, also confirm every required mobile build, upload, store
+submission, and review-submission job for the release commit. For betas, confirm
+the beta EAS workflow completed its TestFlight distribution and Beta App Review
+path. Delete the heartbeat only after every applicable checklist item passes,
+then report the release as shipped.
 
 Pattern:
 
@@ -303,13 +352,16 @@ Pattern:
 // mcp__paseo__create_heartbeat arguments
 {
   "name": "vX.Y.Z release babysit heartbeat",
-  "cron": "*/15 * * * *",
-  "maxRuns": 8, // covers ~2h of build + store-submission window
-  "prompt": "Heartbeat: check vX.Y.Z release. Run gh run list, eas build:list, eas workflow:runs, and eas workflow:view for the matching Release Mobile run. Report concisely. The release is not done until desktop/APK workflows are green, EAS builds are FINISHED, Android submit_android is SUCCESS, and iOS submit_ios + submit_ios_for_review are SUCCESS. Flag any ERRORED/FAILED/CANCELED/FAILURE loudly.",
+  "cron": "*/10 * * * *",
+  "timezone": "UTC",
+  "maxRuns": 120,
+  "expiresIn": "24h",
+  "prompt": "Resume the vX.Y.Z release babysit for commit <sha>. Check npm tags; every GitHub Actions run for the release branch and tag; the published GitHub Release body, expected desktop/APK assets, and channel manifests; the Docker image; and the matching EAS workflow. Completion requires every applicable checklist item. For stable, require build_ios, submit_ios, submit_ios_for_review, build_android, and submit_android to succeed. For beta, require the beta TestFlight distribution and Beta App Review path. If work is pending, wait for the next heartbeat. If a failure can be retried safely for the same version, follow the failed-release procedure; otherwise report the blocker. When every applicable completion-checklist item passes, delete THIS heartbeat, report shipped, and stop.",
 }
 ```
 
-Tight cadence on purpose. The first run fires immediately, giving a near-real-time status check before the conversation closes. Subsequent runs at 15-minute intervals catch transitions quickly: a failed EAS build or failed App Store review submission at +20m should not wait until +50m to surface. Keep the prompt short — the heartbeat is a status probe, not a research task — and have it bail out as soon as every platform is actually on its store path so the remaining runs do not generate noise.
+Run an immediate status check after creating the heartbeat. The heartbeat handles
+later transitions and stops itself when the release is complete.
 
 ## Release notes on GitHub
 
@@ -322,7 +374,7 @@ The GitHub Release body is populated automatically by the `Release Notes Sync` w
 - Homebrew, the Play Store, the App Store, and `app.paseo.sh` have no beta. The Beta view drops those rows, and the whole Web section, rather than showing an inert "stable only" placeholder. When a surface gains a beta path — say a public TestFlight link — add its row back in `packages/website/src/routes/download.tsx`.
 - The default download target only moves when you publish the final stable release tag like `v0.1.41`.
 - The public `/changelog` page renders `CHANGELOG.md` as-is, so the in-flight `-beta.N` entry shows there once it lands on `main` — that's intended, it's where beta users check what's coming. Only the **default download target** stays pinned to the latest stable; the download links read GitHub's releases API, not the changelog, so a `-beta.N` heading on top never affects them.
-- The download page's "What's new" link deep-links the **minor group** anchor (`/changelog#release-0.3`), not the exact entry: promotion rewrites the `-beta.N` entry in place, so that anchor dies while the group survives. A version with no entry in the bundled changelog — a tag whose changelog commit hasn't redeployed the site yet — links the plain `/changelog` instead of a dead anchor.
+- The download page's "What's new" link deep-links the **minor group** anchor (`/changelog#release-0.3`), not the exact entry: promotion collapses the beta entries into one stable entry, so the minor group remains the durable target. A version with no entry in the bundled changelog — a tag whose changelog commit hasn't redeployed the site yet — links the plain `/changelog` instead of a dead anchor.
 - The website itself is deployed by `Deploy Website` (Cloudflare Workers), which redeploys on `release: published` for non-prerelease releases and on pushes to `main` that touch `CHANGELOG.md` or `packages/website/**`.
 
 ## Fixing a failed release build
@@ -403,17 +455,16 @@ No prefix (`v`), no extra text. `Release Notes Sync` matches the `## X.Y.Z` (or
 
 ## Changelog policy
 
-- `CHANGELOG.md` includes stable releases and the current beta line.
+- `CHANGELOG.md` includes stable releases and every entry in the current beta series.
 - The first beta of a version inserts a top entry like `## 0.1.60-beta.1 - YYYY-MM-DD`.
-- Each subsequent beta updates that same top entry in place — bump the heading (`0.1.60-beta.1` → `0.1.60-beta.2`) and fold in whatever else landed.
-- Stable promotion updates that same entry in place one last time: heading to `0.1.60`, date to the promotion day.
-- One entry per version line. The `-beta.N` heading is intermediary — overwrite it, never append. Don't leave stale `-beta.N` entries behind and don't create a duplicate entry per beta.
-- It always covers the full diff from the previous stable tag, regardless of how many betas were cut in between.
+- Each subsequent beta inserts a new top entry with the next beta number. Its notes cover the changes since the previous beta tag.
+- Stable promotion replaces every beta entry for that version with one `## 0.1.60 - YYYY-MM-DD` entry.
+- The promoted stable entry covers the full diff from the previous stable tag and collapses internal iterations across the beta series.
 
 ## Changelog ownership
 
-- **The agent running the release writes the changelog entry — beta or stable.** Do not hand the changelog to another model or agent. The release agent has the release context and owns the final wording.
-- Draft the entry from the previous-stable-to-`HEAD` diff, review it against the changelog policy below, show it to the user, and wait for approval before committing it. Each beta refreshes the same entry; promotion refreshes it one last time from the full previous-stable-to-`HEAD` diff.
+- **The agent running the release writes the changelog entry — beta or stable.** The release context and final wording stay with that agent.
+- For the first beta or a direct stable release, draft from the previous stable tag to the release source. For later betas, draft from the previous beta tag to the release source. Promotion replaces the beta series with one entry drafted from the previous stable tag to the release source. Review the result against the changelog policy below, show it to the user, and wait for approval before committing it.
 
 ## Changelog voice
 
@@ -434,10 +485,8 @@ The changelog is shown on the Paseo homepage. Write it for **end users**, not de
 
   Test: would a non-developer reader recognise what changed when using the app? If they'd need an engineer to translate ("what's a remount?"), the bullet is still implementation-facing — rewrite it as the symptom the user experiences.
 
-- **Collapse internal iterations.** If a feature was added and then fixed within the same release, just list the feature as working. Users never saw the broken version.
-- **Only list changes relative to the previous stable release.** The diff is `v(previous)..HEAD`. If something was introduced and fixed between those two tags, it never shipped — don't mention the fix.
-  - **Common trap:** when drafting from `git log`, every commit looks like a separate bullet — including the "fix X" commits that landed on top of a brand-new feature in the same release window. Before listing a Fixed entry, check whether the thing being fixed was itself added in this same release. If so, drop the fix and fold it into the feature bullet.
-  - **Example:** if the release adds an in-app browser and also contains a commit "fix: browser pane keyboard handling no longer steals shortcuts", do **not** list the keyboard fix under Fixed. The browser is shipping for the first time, so users will only ever see the working version. The Added entry covers it.
+- **Use the entry's release scope.** Include changes within the matching range in **Changelog scope**.
+- **Collapse internal iterations within that scope.** Present a feature added and fixed in one range as working. A later beta can describe a fix to behavior delivered in an earlier beta; promotion folds the complete beta series into the final stable behavior.
 - **Cut low-signal entries.** "Toolbar buttons have consistent sizing" is too granular. Combine small polish items or drop them.
 
 ## Changelog conciseness
@@ -480,7 +529,7 @@ Rules:
 
   This returns every distinct GitHub login that authored or co-authored a commit in the PR. Use those logins for attribution. Fall back to `gh pr view N --json author` only if the commits command returns nothing (which should not happen for merged PRs).
 
-  When listing PR numbers, `git log --format='%H %s' v<previous>..HEAD | grep -E '\(#[0-9]+\)$'` pulls the PR number out of squash commit subjects.
+  When listing PR numbers, `git log --format='%H %s' v<previous>..<release-source-sha> | grep -E '\(#[0-9]+\)$'` pulls the PR number out of squash commit subjects.
 
 ## Changelog ordering
 
@@ -494,51 +543,68 @@ Entries within each section (Added, Improved, Fixed) are ordered by user impact:
 
 Before cutting a **stable** release, the release agent reviews the diff as a last line of defence against shipping bugs. Skip this for betas — the beta itself is the smoke test, and gating each beta on a code review defeats the point of using betas as fast release candidates.
 
-Review the diff between the latest release tag and `HEAD`. Focus on:
+Review the diff between the latest release tag and the resolved release source. Focus on:
 
 1. **Breaking changes** — especially in the WebSocket protocol, agent lifecycle, and any server↔client contract.
 2. **Backward compatibility** — the important direction is old app clients talking to newly updated daemons. Users update desktop and daemon first, then keep running the old app for a while. Flag anything that breaks old clients against new daemons or requires both sides to update in lockstep.
 3. **Regressions** — anything that looks like it could break existing functionality.
 
-Use `git diff <latest-release-tag>..HEAD` as the review input. This is a deep sanity check, not a full code review. If anything looks risky, investigate before proceeding and surface the finding to the user.
+Use `git diff <latest-release-tag>..<release-source-sha>` as the review input. This is a deep sanity check, not a full code review. If anything looks risky, investigate before proceeding and surface the finding to the user.
 
 ## Changelog scope
 
-The changelog always covers **previous-stable-to-`HEAD`**, beta and stable alike:
+Changelog scope follows the release being described:
 
-- **Beta release**: the entry covers `previous stable tag → HEAD`. Update the current in-place beta entry; don't start a fresh one per beta.
-- **Stable promotion**: the same entry is promoted in place. It still captures the full delta from the previous stable release, not just what changed since the last beta.
+- **First beta**: `previous stable tag → release source`
+- **Later beta**: `previous beta tag → release source`
+- **Direct stable release**: `previous stable tag → release source`
+- **Stable promotion**: replace the full beta series with one entry covering `previous stable tag → release source`
 
-Betas are checkpoints along the way; the entry is the single record for the jump from one stable version to the next, and beta users read it in the meantime.
+Each beta entry records what its testers receive. Promotion produces the single stable record for the full jump from one stable version to the next.
 
 ## Completion checklist
 
 ### Beta release
 
-- [ ] Working tree is clean and the intended commit is on `main`
-- [ ] Update the in-place beta entry in `CHANGELOG.md` (heading `## X.Y.Z-beta.N - YYYY-MM-DD`), review it against the changelog policy, get approval, and commit it before cutting the release
-- [ ] The previous-stable-to-`HEAD` diff is classified as patch or minor, with the target version and rationale approved
+- [ ] The resolved release source is the intended commit (default `origin/main`) and its existing CI is green
+- [ ] Add a new `CHANGELOG.md` entry for this beta (heading `## X.Y.Z-beta.N - YYYY-MM-DD`), review it against the changelog policy, get approval, and commit it before cutting the release
+- [ ] The diff from the previous stable to the resolved release source is classified as patch or minor, with the target version and rationale approved
+- [ ] Release preparation stayed local until the approved release command pushed the complete branch and tag
 - [ ] `npm run release:beta:patch`, `npm run release:beta:minor`, or `npm run release:beta:next` completes successfully
+- [ ] Every GitHub Actions run for the complete release commit and tag is green
 - [ ] npm shows the version under the `beta` dist-tag, not `latest`
+- [ ] The GitHub prerelease exists with the changelog body and every expected macOS, Linux, Windows, and Android APK asset
 - [ ] GitHub `Desktop Release` workflow for the `v*-beta.N` tag is green
+- [ ] The GitHub prerelease contains `beta-mac.yml`, `beta-linux.yml`, and `beta.yml`
 - [ ] GitHub `Android APK Release` workflow for the same tag is green
+- [ ] GitHub `Docker` workflow is green and the versioned beta image is published without moving `latest`
 - [ ] GitHub `Release Notes Sync` mirrored the beta entry into the prerelease body
+- [ ] EAS `Release iOS Beta` completed its build, TestFlight distribution, external beta group, and Beta App Review path
+- [ ] The release heartbeat was created after the tag push and deleted only after every item above passed
 
 ### Stable release (or promotion)
 
 - [ ] Run the pre-release sanity check (see above) and address any findings
-- [ ] The previous-stable-to-`HEAD` diff is classified as patch or minor, with the target version and rationale approved
-- [ ] Ensure the intended release commit is already committed and the git worktree is clean before running any release command
+- [ ] The diff from the previous stable to the resolved release source is classified as patch or minor, with the target version and rationale approved
+- [ ] The resolved release source is the intended commit (default `origin/main`) and its existing CI is green
+- [ ] Ensure the approved release inputs are committed locally and the git worktree is clean before running any release command
 - [ ] Ensure local `npm run typecheck` passes on that exact commit before running any release command
-- [ ] Update `CHANGELOG.md` with user-facing release notes (features, fixes — not refactors). When promoting from beta, overwrite the existing `## X.Y.Z-beta.N` heading in place (heading → `X.Y.Z`, date → promotion day) — do not add a new entry on top of the beta one
+- [ ] Update `CHANGELOG.md` with user-facing release notes (features, fixes — not refactors). Promotion replaces every `## X.Y.Z-beta.N` entry in the series with one `## X.Y.Z - YYYY-MM-DD` entry covering the full release
 - [ ] Verify the changelog heading follows strict `## X.Y.Z - YYYY-MM-DD` format
+- [ ] Release preparation stayed local until the approved release command pushed the complete branch and tag
 - [ ] `npm run release:patch`, `npm run release:minor`, or `npm run release:promote` completes successfully
+- [ ] Every GitHub Actions run for the complete release commit and tag is green
 - [ ] Move npm's `beta` dist-tag to the new stable version for every published package and verify both `latest` and `beta` resolve to it
+- [ ] The published GitHub Release exists with the changelog body and every expected macOS, Linux, Windows, and Android APK asset
 - [ ] GitHub `Desktop Release` workflow for the `v*` tag is green
+- [ ] The GitHub Release contains `latest-mac.yml`, `latest-linux.yml`, and `latest.yml`
 - [ ] GitHub `Android APK Release` workflow for the same tag is green
+- [ ] GitHub `Docker` workflow is green and both the versioned and `latest` images are published
+- [ ] GitHub `Release Notes Sync` is green and the release body matches the stable changelog entry
 - [ ] EAS `Release Mobile` workflow for the same tag is green
 - [ ] EAS iOS `build_ios` completes for the same tag
 - [ ] EAS iOS `submit_ios` succeeds, uploading the build to App Store Connect/TestFlight
 - [ ] EAS iOS `submit_ios_for_review` succeeds, putting the build into App Store review
 - [ ] EAS Android `build_android` completes for the same tag
 - [ ] EAS Android `submit_android` succeeds, putting the build on its Play Store track
+- [ ] The release heartbeat was created after the tag push and deleted only after every item above passed

docs/unistyles.md

@@ -345,7 +345,7 @@ Gotchas:
 - **Narrow the discriminated union before spreading.** `updateTheme`'s updater returns the theme union; spreading the union widens `colorScheme` to `"light" | "dark"`, which is assignable to neither concrete member. Branch on `t.colorScheme` so each branch spreads a single narrowed theme type (no `as`).
 - **`lineHeight.diff` is the code/diff line-height axis** — it is coupled to the code-font-size control (≈ `codeFontSize * 1.5`). Do NOT use it for prose. Markdown body line-height scales with the UI ramp (`Math.round(theme.fontSize.base * 1.4)`); routing prose through `lineHeight.diff` clips text at small code sizes.
 - **High-churn draft values** (live-while-typing in the appearance preview) bypass the theme: apply them as inline styles marked with `inlineUnistylesStyle` so per-keystroke values don't grow the `#unistyles-web` CSS registry.
-- **Mounted parsed content uses `AppearanceStyleBoundary`.** Markdown, syntax-highlighted code, and tool-call detail bodies can contain memoized/custom renderer trees that do not naturally re-run when runtime-patched appearance tokens change. Wrap the parsed surface once with `packages/app/src/components/appearance-style-boundary.tsx`; do not add local "appearance key" props at each callsite.
+- **The app shell uses one `AppearanceStyleBoundary`.** Runtime-patched numeric theme values are baked into Unistyles web classes rather than CSS variables, while parsed/memoized content also does not naturally re-run when appearance tokens change. The boundary sits below stable runtime providers in `app/_layout.tsx` and remounts the visual shell once. `applyAppearance` patches the active theme before inactive registry entries so its subscribers receive the committed values in the same update. Do not add local appearance keys or nested boundaries.
 - **Dynamic font tokens stay widened.** `fontFamily`, `fontSize`, and `lineHeight` on `commonTheme` are annotated `string`/`number` (not narrowed by `as const`) so the updater's return assigns; the platform default stacks live in `DEFAULT_UI_FONT_STACK` / `DEFAULT_MONO_FONT_STACK`.
 
 ## Debugging

nix/npm-deps.hash

@@ -1 +1 @@
-sha256-MDuVQQ5DmNoPlb9+LlrZYxGbP+22rYpfhcDJQxmIUsU=
+sha256-tB0WZG6F6VFMS5zFqo73giSAn7SqfkJISF5fMjDioJQ=

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "paseo",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "paseo",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "hasInstallScript": true,
       "license": "AGPL-3.0-or-later",
       "workspaces": [
@@ -9515,280 +9515,6 @@
         "node": "^20.19.0 || >=22.12.0"
       }
     },
-    "node_modules/@parcel/watcher": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.6.0.tgz",
-      "integrity": "sha512-7FNeNl8NCE7aINx7WXiKQrPYZWC/hvrTsmk6zmxbI7LTXE7hVek/n8AfVgpe2y82zl3w0HvCHN0bVKMBoJcC0w==",
-      "hasInstallScript": true,
-      "license": "MIT",
-      "dependencies": {
-        "detect-libc": "^2.0.3",
-        "is-glob": "^4.0.3",
-        "node-addon-api": "^7.0.0",
-        "picomatch": "^4.0.4"
-      },
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      },
-      "optionalDependencies": {
-        "@parcel/watcher-android-arm64": "2.6.0",
-        "@parcel/watcher-darwin-arm64": "2.6.0",
-        "@parcel/watcher-darwin-x64": "2.6.0",
-        "@parcel/watcher-freebsd-x64": "2.6.0",
-        "@parcel/watcher-linux-arm-glibc": "2.6.0",
-        "@parcel/watcher-linux-arm-musl": "2.6.0",
-        "@parcel/watcher-linux-arm64-glibc": "2.6.0",
-        "@parcel/watcher-linux-arm64-musl": "2.6.0",
-        "@parcel/watcher-linux-x64-glibc": "2.6.0",
-        "@parcel/watcher-linux-x64-musl": "2.6.0",
-        "@parcel/watcher-win32-arm64": "2.6.0",
-        "@parcel/watcher-win32-x64": "2.6.0"
-      }
-    },
-    "node_modules/@parcel/watcher-android-arm64": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.6.0.tgz",
-      "integrity": "sha512-trgpLSCKRC/huFjXX/Smh+0sWe4+YtKfktIToiMl59ghz7z+qkH6kMvNnUbLyRs9N11t8l4svSCs1+5B3rOAhA==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "android"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-darwin-arm64": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.6.0.tgz",
-      "integrity": "sha512-Y3QV0gl7Q1zbfueunkWIERICbEojQFCgpyG7YqOGNFLsckXyI1xu9mAIUpKY9QBYzBtSkN8dBPwd3yiAO9ovMw==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-darwin-x64": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.6.0.tgz",
-      "integrity": "sha512-Ohv6OpzhUfKYD7Beb8kDvG0jbIxORCYY1JRdZnaBtnjjkJxgD7ZVL0nw2sCYd0yTMKTvz3nnTnOF3cDifK+kvw==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-freebsd-x64": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.6.0.tgz",
-      "integrity": "sha512-5HmXvDgs8VK+74jF9y9/2FE3/OnlcKmc56tjmSrEuZjpSZOGL+fvAu+HKJBdPs9uwoP2hE6TlSUpXZ/C5jUFmQ==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "freebsd"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm-glibc": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.6.0.tgz",
-      "integrity": "sha512-Ps/hui3A+vMbjdqlqAowK2ZL8+BO8dBjxeWXj6npTBs3jx4wWmbPpaLuqwrQrSqIVMCnpWo238bJ1U37GhQOYg==",
-      "cpu": [
-        "arm"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm-musl": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-musl/-/watcher-linux-arm-musl-2.6.0.tgz",
-      "integrity": "sha512-9c6AUHgHoG+IY88MRIHupztQiQnrbqHYQjkM2btA+Bf/wQnQMuiD0Wfk1EVv3TlNT3x41uU71rn6E4xh/+zvkw==",
-      "cpu": [
-        "arm"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm64-glibc": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.6.0.tgz",
-      "integrity": "sha512-yHRqS2owEXe6Hic9z6Mh1ECsCd+ODVOGvZDyciqRd21+v+o+DnXMOrw50DSpIG2sb8GPEaPPmfeCAWKPJdq46g==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm64-musl": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.6.0.tgz",
-      "integrity": "sha512-WhB2e/V7rqdHHWZusBSPuy5Ei8S6lSz6FE5TKKQz5h3a0O+C+mhY7vxU9b/stqvMb8beLnPY82ZrFTLKs+SrKA==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-x64-glibc": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.6.0.tgz",
-      "integrity": "sha512-ulGE6x6Oz6iAwg75T8YQSoguBWasniIbX+QWpaYPcCnDOpdWX3k+4xbEYPZVLxOuoJI+svJJPD3sEj8G7lrQ3A==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-x64-musl": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-musl/-/watcher-linux-x64-musl-2.6.0.tgz",
-      "integrity": "sha512-tkBYKt7YQrjIJWYDnto2YgO8MRkjlMTSNoRHzsXinBqbLdeOM3L32wPZJvIZxqaLMfSlS/4sUjH/6STVP/XDLw==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-win32-arm64": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.6.0.tgz",
-      "integrity": "sha512-gIZAP23jaHjGWasY/TY6yL7NHFClf0Ga7FN+iINvk+KN94rhm94lYZhFsbYFNcA04/onvGD9kKmiJLJB2HbNwQ==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-win32-x64": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.6.0.tgz",
-      "integrity": "sha512-cA+/pXV2YkfxlIcXOQ5fSWqAzzPyD78/x5qbK/I0vUkrlYHA8TIz+MXjAbGouguKVSI4bOmkTSJ1/poVSsgt+A==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
     "node_modules/@pinojs/redact": {
       "version": "0.4.0",
       "resolved": "https://registry.npmjs.org/@pinojs/redact/-/redact-0.4.0.tgz",
@@ -23278,6 +23004,7 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
       "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -23331,6 +23058,7 @@
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
       "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "is-extglob": "^2.1.1"
@@ -25579,6 +25307,27 @@
         "is-buffer": "~1.1.6"
       }
     },
+    "node_modules/mdast-util-directive": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/mdast-util-directive/-/mdast-util-directive-3.1.0.tgz",
+      "integrity": "sha512-I3fNFt+DHmpWCYAT7quoM6lHf9wuqtI+oCOfvILnoicNIqjh5E3dEJWiXuYME2gNe8vl1iMQwyUHa7bgFmak6Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "@types/unist": "^3.0.0",
+        "ccount": "^2.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0",
+        "parse-entities": "^4.0.0",
+        "stringify-entities": "^4.0.0",
+        "unist-util-visit-parents": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/mdast-util-find-and-replace": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/mdast-util-find-and-replace/-/mdast-util-find-and-replace-3.0.2.tgz",
@@ -26414,6 +26163,25 @@
         "micromark-util-types": "^2.0.0"
       }
     },
+    "node_modules/micromark-extension-directive": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/micromark-extension-directive/-/micromark-extension-directive-4.0.0.tgz",
+      "integrity": "sha512-/C2nqVmXXmiseSSuCdItCMho7ybwwop6RrrRPk0KbOHW21JKoCldC+8rFOaundDoRBUWBnJJcxeA/Kvi34WQXg==",
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-factory-whitespace": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0",
+        "parse-entities": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/micromark-extension-gfm": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/micromark-extension-gfm/-/micromark-extension-gfm-3.0.0.tgz",
@@ -30588,6 +30356,22 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/remark-directive": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/remark-directive/-/remark-directive-4.0.0.tgz",
+      "integrity": "sha512-7sxn4RfF1o3izevPV1DheyGDD6X4c9hrGpfdUpm7uC++dqrnJxIZVkk7CoKqcLm0VUMAuOol7Mno3m6g8cfMuA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-directive": "^3.0.0",
+        "micromark-extension-directive": "^4.0.0",
+        "unified": "^11.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/remark-gfm": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/remark-gfm/-/remark-gfm-4.0.1.tgz",
@@ -35299,7 +35083,7 @@
     },
     "packages/app": {
       "name": "@getpaseo/app",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "dependencies": {
         "@codemirror/commands": "6.10.4",
         "@codemirror/language": "6.12.4",
@@ -36353,12 +36137,12 @@
     },
     "packages/cli": {
       "name": "@getpaseo/cli",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "dependencies": {
         "@clack/prompts": "^1.0.0",
-        "@getpaseo/client": "0.3.0",
-        "@getpaseo/protocol": "0.3.0",
-        "@getpaseo/server": "0.3.0",
+        "@getpaseo/client": "0.3.1",
+        "@getpaseo/protocol": "0.3.1",
+        "@getpaseo/server": "0.3.1",
         "chalk": "^5.3.0",
         "commander": "^12.0.0",
         "mime-types": "^2.1.35",
@@ -36605,10 +36389,10 @@
     },
     "packages/client": {
       "name": "@getpaseo/client",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "dependencies": {
-        "@getpaseo/protocol": "0.3.0",
-        "@getpaseo/relay": "0.3.0",
+        "@getpaseo/protocol": "0.3.1",
+        "@getpaseo/relay": "0.3.1",
         "zod": "^4.4.3"
       },
       "devDependencies": {
@@ -36619,7 +36403,7 @@
     },
     "packages/desktop": {
       "name": "@getpaseo/desktop",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "license": "AGPL-3.0-or-later",
       "dependencies": {
         "@getpaseo/cli": "*",
@@ -36862,7 +36646,7 @@
     },
     "packages/expo-two-way-audio": {
       "name": "@getpaseo/expo-two-way-audio",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "license": "MIT",
       "devDependencies": {
         "@types/jest": "^29.5.14",
@@ -37758,7 +37542,7 @@
     },
     "packages/highlight": {
       "name": "@getpaseo/highlight",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "dependencies": {
         "@codemirror/language": "6.12.4",
         "@codemirror/legacy-modes": "^6.5.3",
@@ -37990,7 +37774,7 @@
     },
     "packages/protocol": {
       "name": "@getpaseo/protocol",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "dependencies": {
         "zod": "^4.4.3"
       },
@@ -38003,7 +37787,7 @@
     },
     "packages/relay": {
       "name": "@getpaseo/relay",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "dependencies": {
         "base64-js": "^1.5.1",
         "tweetnacl": "^1.0.3",
@@ -38221,19 +38005,18 @@
     },
     "packages/server": {
       "name": "@getpaseo/server",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "dependencies": {
         "@agentclientprotocol/sdk": "^0.17.1",
         "@anthropic-ai/claude-agent-sdk": "^0.3.220",
         "@anthropic-ai/sdk": "^0.104.2",
-        "@getpaseo/client": "0.3.0",
-        "@getpaseo/highlight": "0.3.0",
-        "@getpaseo/protocol": "0.3.0",
-        "@getpaseo/relay": "0.3.0",
+        "@getpaseo/client": "0.3.1",
+        "@getpaseo/highlight": "0.3.1",
+        "@getpaseo/protocol": "0.3.1",
+        "@getpaseo/relay": "0.3.1",
         "@isaacs/ttlcache": "^2.1.4",
         "@modelcontextprotocol/sdk": "^1.20.1",
         "@opencode-ai/sdk": "1.14.46",
-        "@parcel/watcher": "^2.6.0",
         "@xterm/headless": "^6.0.0",
         "ai": "5.0.78",
         "ajv": "^8.20.0",
@@ -38778,7 +38561,7 @@
     },
     "packages/website": {
       "name": "@getpaseo/website",
-      "version": "0.3.0",
+      "version": "0.3.1",
       "dependencies": {
         "@cloudflare/vite-plugin": "^1.29.1",
         "@cloudflare/workers-types": "^4.20260317.1",
@@ -38793,6 +38576,7 @@
         "rehype-autolink-headings": "^7.1.0",
         "rehype-pretty-code": "^0.14.3",
         "rehype-slug": "^6.0.0",
+        "remark-directive": "^4.0.0",
         "remark-gfm": "^4.0.1",
         "shiki": "^4.0.2",
         "wrangler": "^4.75.0"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "paseo",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "private": true,
   "description": "Paseo: voice-controlled development environment for local AI coding agents",
   "keywords": [

packages/app/e2e/browser/add-project-flow.spec.ts

@@ -13,6 +13,7 @@ import {
   expectAddProjectPage,
   expectNewWorkspaceForAddedProject,
   openAddProjectFlow,
+  openAddProjectHostSelection,
 } from "../support/helpers/add-project-flow";
 import { gotoAppShell } from "../support/helpers/app";
 import {
@@ -65,12 +66,14 @@ async function expectProjectHasNoWorkspaces(projectId: string): Promise<void> {
 test.describe("Add Project command-center flow", () => {
   test.describe.configure({ timeout: 180_000 });
 
-  test("a single connected host opens directly on method selection", async ({ page }) => {
+  test("method selection has no search field", async ({ page }) => {
     await gotoAppShell(page);
 
     await openAddProjectFlow(page);
 
     await expect(addProjectFlowMethod(page, "directory-search")).toBeVisible();
+    await expect(addProjectFlowInput(page)).toHaveCount(0);
+    await expect(addProjectFlow(page).getByRole("textbox")).toHaveCount(0);
     await expect(page.getByTestId("add-project-flow-page-host")).toHaveCount(0);
   });
 
@@ -146,7 +149,7 @@ test.describe("Add Project command-center flow", () => {
         serverId: SECONDARY_HOST_ID,
         endpoint: `localhost:${secondaryHost.port}`,
       });
-      await openAddProjectFlow(page, "host");
+      await openAddProjectHostSelection(page);
 
       await page.keyboard.press("ArrowDown");
       await page.keyboard.press("Enter");
@@ -155,7 +158,7 @@ test.describe("Add Project command-center flow", () => {
       await expect(addProjectFlow(page)).toContainText(SECONDARY_HOST_LABEL);
     });
 
-    test("Escape and Back restore page input and active selection before closing at the root", async ({
+    test("Escape and Back restore searchable page input before closing at the root", async ({
       page,
     }) => {
       await gotoAppShell(page);
@@ -168,21 +171,20 @@ test.describe("Add Project command-center flow", () => {
         serverId: SECONDARY_HOST_ID,
         endpoint: `localhost:${secondaryHost.port}`,
       });
-      await openAddProjectFlow(page, "host");
+      await openAddProjectHostSelection(page);
 
       await addProjectFlowInput(page).fill("o");
       await page.keyboard.press("ArrowDown");
       await page.keyboard.press("Enter");
       await expectAddProjectPage(page, "method");
 
-      await addProjectFlowInput(page).fill("new");
-      await page.keyboard.press("Enter");
+      await chooseAddProjectMethod(page, "new-directory");
       await expectAddProjectPage(page, "new-directory-parent");
       await page.keyboard.press("Escape");
 
       await expectAddProjectPage(page, "method");
-      await expect(addProjectFlowInput(page)).toHaveValue("new");
-      await page.keyboard.press("Enter");
+      await expect(addProjectFlowInput(page)).toHaveCount(0);
+      await chooseAddProjectMethod(page, "new-directory");
       await expectAddProjectPage(page, "new-directory-parent");
       await addProjectFlowBack(page).click();
 
@@ -216,7 +218,7 @@ test.describe("Add Project command-center flow", () => {
           serverId: SECONDARY_HOST_ID,
           endpoint: `localhost:${secondaryHost.port}`,
         });
-        await openAddProjectFlow(page, "host");
+        await openAddProjectHostSelection(page);
         await addProjectFlowHost(page, SECONDARY_HOST_ID).click();
         await expectAddProjectPage(page, "method");
 

packages/app/e2e/browser/appearance-theme-picker.spec.ts

@@ -0,0 +1,36 @@
+import { expect, test } from "../support/fixtures";
+import { openSettingsSection } from "../support/helpers/settings";
+
+test("shows Pure black in the appearance picker", async ({ page }, testInfo) => {
+  await page.goto("/settings");
+  await expect(page.getByTestId("settings-sidebar")).toBeVisible();
+  await openSettingsSection(page, "appearance");
+
+  const themeTrigger = page.getByLabel("Theme: System", { exact: true });
+  await themeTrigger.click();
+  await expect(page.getByText("Pure black", { exact: true })).toBeVisible();
+  await page.screenshot({
+    path: testInfo.outputPath("appearance-theme-picker.png"),
+    fullPage: true,
+  });
+});
+
+test("applies the interface font size to settings text", async ({ page }) => {
+  await page.addInitScript(() => {
+    localStorage.setItem("@paseo:app-settings", JSON.stringify({ uiFontSize: 24 }));
+  });
+  await page.goto("/settings");
+  await expect(page.getByTestId("settings-sidebar")).toBeVisible();
+  await openSettingsSection(page, "appearance");
+
+  const sectionTitle = page.getByText("Theme", { exact: true }).first();
+  await expect(sectionTitle).toHaveCSS("font-size", "18px");
+
+  const fontSizeInput = page.getByLabel("Interface font size");
+  await expect(fontSizeInput).toHaveValue("24");
+  await fontSizeInput.fill("12");
+  await fontSizeInput.press("Tab");
+
+  await expect(fontSizeInput).toHaveValue("12");
+  await expect(sectionTitle).toHaveCSS("font-size", "9px");
+});

packages/app/e2e/browser/assistant-selection-copy.spec.ts

@@ -118,6 +118,53 @@ async function selectAssistantText(page: Page, text: string): Promise<void> {
   await selectAssistantTextRange(page, text, text);
 }
 
+async function selectAssistantListItemFromMarker(
+  page: Page,
+  listTag: "ol" | "ul",
+  itemText: string,
+  endText: string,
+): Promise<void> {
+  const assistantMessage = page.getByTestId("assistant-message").filter({
+    hasText: "Direct matches:",
+  });
+  const item = assistantMessage
+    .locator(`[data-paseo-markdown-tag="${listTag}"]`)
+    .filter({ hasText: itemText })
+    .locator(':scope > [data-paseo-markdown-tag="li"]')
+    .filter({ hasText: itemText });
+
+  await item.evaluate((element, selectedEndText) => {
+    const marker = element.querySelector(':scope > [data-paseo-markdown-list-marker="true"]');
+    const markerText = marker?.firstChild;
+    if (!(markerText instanceof Text)) {
+      throw new Error("Expected rendered list marker text");
+    }
+
+    const walker = document.createTreeWalker(element, NodeFilter.SHOW_TEXT);
+    let endNode: Text | null = null;
+    let endOffset = -1;
+    while (walker.nextNode()) {
+      const node = walker.currentNode;
+      const offset = node.textContent?.indexOf(selectedEndText) ?? -1;
+      if (node instanceof Text && offset >= 0) {
+        endNode = node;
+        endOffset = offset + selectedEndText.length;
+        break;
+      }
+    }
+    if (!endNode) {
+      throw new Error(`Could not find list item selection end: ${selectedEndText}`);
+    }
+
+    const range = document.createRange();
+    range.setStart(markerText, 0);
+    range.setEnd(endNode, endOffset);
+    const selection = window.getSelection();
+    selection?.removeAllRanges();
+    selection?.addRange(range);
+  }, endText);
+}
+
 async function doubleClickAssistantMarkdownText(
   page: Page,
   tag: "code" | "strong",
@@ -405,6 +452,24 @@ test("copying an assistant selection preserves Markdown structure and links", as
       '<div>- <strong><a href="https://example.com/issues/1">First issue</a></strong>',
     );
 
+    await selectAssistantListItemFromMarker(page, "ul", "First issue", "failure.");
+    await copySelection(page);
+
+    const draggedBulletClipboard = await readRichClipboard(page);
+    expect(draggedBulletClipboard.plainText).toBe(
+      "- **[First issue](https://example.com/issues/1)**: exact `apply_patch` failure.",
+    );
+    expect(draggedBulletClipboard.html).toContain(
+      '<div>- <strong><a href="https://example.com/issues/1">First issue</a></strong>',
+    );
+
+    await selectAssistantListItemFromMarker(page, "ol", "Sixth item", "Sixth item");
+    await copySelection(page);
+
+    const draggedNumberClipboard = await readRichClipboard(page);
+    expect(draggedNumberClipboard.plainText).toBe("6. Sixth item");
+    expect(draggedNumberClipboard.html).toContain("<div>6. Sixth item</div>");
+
     await selectAssistantText(page, "docs");
     await copySelection(page);
 

packages/app/e2e/browser/command-center-file-search.spec.ts

@@ -0,0 +1,139 @@
+import { expect, test } from "../support/fixtures";
+import { openCommandCenter } from "../support/helpers/command-center";
+import {
+  delayDirectorySuggestionResponses,
+  expectOneLineTruncatedFileResult,
+  expectStableCommandCenterLayout,
+  failDirectorySuggestionRequests,
+  startCommandCenterLayoutObservation,
+} from "../support/helpers/command-center-file-search";
+import { expectFileTabOpen } from "../support/helpers/file-explorer";
+import { gotoWorkspace } from "../support/helpers/launcher";
+import { seedWorkspace, type SeededWorkspace } from "../support/helpers/seed-client";
+
+const FILE_PATH =
+  "packages/app/src/command-center/features/workspace-file-search/layout-stability/needle-layout-stability-command-center.tsx";
+const FILE_NAME = "needle-layout-stability-command-center.tsx";
+const FILE_DIRECTORY =
+  "packages/app/src/command-center/features/workspace-file-search/layout-stability";
+
+function paseoSizedFiles(): Array<{ path: string; content: string }> {
+  const files = Array.from({ length: 120 }, (_, index) => ({
+    path: `packages/app/src/features/feature-${String(index).padStart(3, "0")}/index.ts`,
+    content: `export const feature${index} = ${index};\n`,
+  }));
+  files.push({ path: FILE_PATH, content: "export const layoutNeedle = true;\n" });
+  return files;
+}
+
+async function seedMatchingWorkspaces(count: number): Promise<SeededWorkspace[]> {
+  return Promise.all(
+    Array.from({ length: count }, (_, index) =>
+      seedWorkspace({
+        repoPrefix: `command-center-file-search-error-${String(index).padStart(2, "0")}-`,
+        title: `Home failure ${String(index).padStart(2, "0")}`,
+      }),
+    ),
+  );
+}
+
+test.use({
+  userAgent:
+    "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 Chrome/145.0 Safari/537.36",
+});
+
+test("workspace file search stays geometrically stable through delayed loading and results", async ({
+  page,
+}) => {
+  test.setTimeout(120_000);
+  const seeded = await seedWorkspace({
+    repoPrefix: "command-center-file-search-",
+    title: "Paseo-shaped file search",
+    repo: { files: paseoSizedFiles() },
+  });
+
+  try {
+    await delayDirectorySuggestionResponses(page, 800);
+    await gotoWorkspace(page, seeded.workspaceId);
+    await page.keyboard.press("Meta+P");
+
+    const panel = page.getByTestId("command-center-panel");
+    await expect(panel).toBeVisible({ timeout: 30_000 });
+    await expect(panel.getByRole("button", { name: "Files" })).toBeVisible();
+    await startCommandCenterLayoutObservation(page);
+
+    await panel.getByTestId("command-center-input").fill(FILE_NAME);
+    const row = panel.getByRole("button", {
+      name: `${FILE_NAME} ${FILE_DIRECTORY}`,
+    });
+    await expect(row).toBeVisible({ timeout: 30_000 });
+    await expectOneLineTruncatedFileResult(row, {
+      filename: FILE_NAME,
+      path: FILE_DIRECTORY,
+    });
+
+    await panel.getByTestId("command-center-input").fill("needle-layout");
+    await page.waitForTimeout(150);
+    expect(await row.isVisible()).toBe(true);
+    await expect(panel.getByTestId("command-center-file-search-loading")).toBeVisible();
+    await expect(panel.getByText("Searching files...", { exact: true })).toHaveCount(0);
+    await expect(panel.getByTestId("command-center-file-search-loading")).toBeHidden();
+    await expectStableCommandCenterLayout(page);
+
+    await row.click();
+    await expectFileTabOpen(page, FILE_PATH);
+  } finally {
+    await seeded.cleanup();
+  }
+});
+
+test("dropping the files scope leaves the search row the same height", async ({ page }) => {
+  const seeded = await seedWorkspace({
+    repoPrefix: "command-center-file-search-scope-",
+    title: "Scope chip height",
+  });
+
+  try {
+    await gotoWorkspace(page, seeded.workspaceId);
+    await page.keyboard.press("Meta+P");
+
+    const panel = page.getByTestId("command-center-panel");
+    await expect(panel).toBeVisible({ timeout: 30_000 });
+    const header = panel.getByTestId("command-center-header");
+    const scoped = await header.boundingBox();
+
+    await page.getByTestId("command-center-files-scope").click();
+    await expect(page.getByTestId("command-center-files-scope")).toHaveCount(0);
+    const unscoped = await header.boundingBox();
+
+    expect(scoped?.height).toBe(unscoped?.height);
+  } finally {
+    await seeded.cleanup();
+  }
+});
+
+test("unscoped command search keeps commands visible and reports file-search failures", async ({
+  page,
+}) => {
+  test.setTimeout(120_000);
+  const seeded = await seedMatchingWorkspaces(9);
+
+  try {
+    await failDirectorySuggestionRequests(page);
+    await gotoWorkspace(page, seeded[0].workspaceId);
+    const panel = await openCommandCenter(page);
+    await panel.getByTestId("command-center-input").fill("home");
+
+    await expect(panel.getByRole("button", { name: "Home", exact: true })).toBeVisible();
+    await expect(panel.getByRole("button", { name: /Home failure 08/ })).toBeVisible();
+    await expect(panel.getByTestId("command-center-file-search-error")).toHaveText(
+      "Error: Test file search transport failure.",
+    );
+    await expect(panel.getByTestId("command-center-file-search-error")).toBeInViewport({
+      ratio: 1,
+    });
+    await expect(panel.getByText("No matches", { exact: true })).toHaveCount(0);
+  } finally {
+    await Promise.allSettled(seeded.map((workspace) => workspace.cleanup()));
+  }
+});

packages/app/e2e/browser/new-workspace-host-project-preservation.spec.ts

@@ -13,6 +13,7 @@ import {
 } from "../support/helpers/new-workspace";
 import { connectSeedClient, type SeedDaemonClient } from "../support/helpers/seed-client";
 import { getServerId } from "../support/helpers/server-id";
+import { addConnectedHostsAndReload } from "../support/helpers/hosts";
 import { switchWorkspaceViaSidebar } from "../support/helpers/workspace-ui";
 import { createTempGitRepo } from "../support/helpers/workspace";
 
@@ -29,6 +30,7 @@ interface CreatedProject {
 
 interface CrossHostProjectScenario {
   contextWorkspaceId: string;
+  primarySharedWorkspaceId: string;
   selectedProjectViewKey: string;
   sharedProjectKey: string;
   secondaryHost: {
@@ -149,6 +151,7 @@ const test = base.extend<{ crossHostProject: CrossHostProjectScenario }>({
 
       await provide({
         contextWorkspaceId: contextProject.workspaceId,
+        primarySharedWorkspaceId: primarySharedProject.workspaceId,
         selectedProjectViewKey: projectPlacementViewKey(
           getServerId(),
           primarySharedProject.projectId,
@@ -196,4 +199,33 @@ test.describe("New workspace host project preservation", () => {
 
     await expectNewWorkspaceProjectSelected(page, SHARED_PROJECT_NAME);
   });
+
+  test("keeps the active workspace project selected when switching hosts", async ({
+    page,
+    crossHostProject,
+  }) => {
+    await openProjectDirectoryWithHosts(page, {
+      hosts: [crossHostProject.secondaryHost],
+      primaryLabel: PRIMARY_HOST_LABEL,
+    });
+    await switchWorkspaceViaSidebar({
+      page,
+      serverId: getServerId(),
+      workspaceId: crossHostProject.primarySharedWorkspaceId,
+    });
+    await openGlobalNewWorkspaceComposer(page);
+    await expectNewWorkspaceProjectSelected(page, SHARED_PROJECT_NAME);
+
+    await selectNewWorkspaceHost(page, SECONDARY_HOST_LABEL);
+
+    await expectNewWorkspaceProjectSelected(page, SHARED_PROJECT_NAME);
+
+    await addConnectedHostsAndReload(page, [crossHostProject.secondaryHost], {
+      primaryLabel: PRIMARY_HOST_LABEL,
+    });
+    await expectNewWorkspaceProjectSelected(page, SHARED_PROJECT_NAME);
+    await selectNewWorkspaceHost(page, SECONDARY_HOST_LABEL);
+
+    await expectNewWorkspaceProjectSelected(page, SHARED_PROJECT_NAME);
+  });
 });

packages/app/e2e/browser/new-workspace-meta-row-layout.spec.ts

@@ -0,0 +1,87 @@
+import { expect, test } from "../support/fixtures";
+import { gotoAppShell } from "../support/helpers/app";
+import { getE2EDaemonPort } from "../support/helpers/daemon-port";
+import {
+  openNewWorkspaceComposer,
+  openStartingRefPicker,
+  selectBranchInPicker,
+  selectWorkspaceIsolation,
+} from "../support/helpers/new-workspace";
+import { seedWorkspace, type SeededWorkspace } from "../support/helpers/seed-client";
+import { getServerId } from "../support/helpers/server-id";
+import { seedSavedSettingsHosts } from "../support/helpers/settings";
+import { waitForSidebarHydration } from "../support/helpers/workspace-ui";
+
+const LONG_HOST_NAME =
+  "development-macbook-pro.local-connected-through-a-very-long-private-hostname";
+const LONG_BRANCH_NAME =
+  "feat/app/add-amoled-theme-with-a-very-long-pull-request-and-branch-description";
+
+function measureControlRightEdges(controls: HTMLElement[]) {
+  const measurements: Array<{ label: string | null; right: number }> = [];
+  for (const control of controls) {
+    const rect = control.getBoundingClientRect();
+    measurements.push({ label: control.getAttribute("aria-label"), right: rect.right });
+  }
+  return measurements;
+}
+
+test.describe("New workspace metadata row layout", () => {
+  let workspace: SeededWorkspace;
+
+  test.beforeEach(async () => {
+    workspace = await seedWorkspace({
+      repoPrefix: "new-workspace-layout-",
+      repo: { branches: [LONG_BRANCH_NAME] },
+    });
+  });
+
+  test.afterEach(async () => {
+    await workspace?.cleanup();
+  });
+
+  test("long host and branch names stay inside the composer's right rail", async ({ page }) => {
+    await page.setViewportSize({ width: 2048, height: 878 });
+    await seedSavedSettingsHosts(page, [
+      {
+        serverId: getServerId(),
+        label: LONG_HOST_NAME,
+        endpoint: `127.0.0.1:${getE2EDaemonPort()}`,
+      },
+      {
+        serverId: "srv_e2e_layout_offline",
+        label: "Offline host",
+        endpoint: "127.0.0.1:9",
+      },
+    ]);
+
+    await gotoAppShell(page);
+    await waitForSidebarHydration(page);
+    await openNewWorkspaceComposer(page, {
+      projectKey: workspace.projectKey,
+      projectDisplayName: workspace.projectDisplayName,
+    });
+    await selectWorkspaceIsolation(page, "worktree");
+    await openStartingRefPicker(page);
+    await selectBranchInPicker(page, LONG_BRANCH_NAME);
+
+    const composer = page.locator('[data-testid="message-input-root"]:visible');
+    const metadataRow = page.getByTestId("new-workspace-ref-picker-row");
+    await expect(composer).toBeVisible();
+    await expect(metadataRow).toBeVisible();
+
+    const [composerBox, controlBoxes] = await Promise.all([
+      composer.boundingBox(),
+      metadataRow.getByRole("button").evaluateAll(measureControlRightEdges),
+    ]);
+    expect(composerBox).not.toBeNull();
+    const composerRightRail = composerBox!.x + composerBox!.width;
+
+    for (const control of controlBoxes) {
+      expect(
+        control.right,
+        `${control.label ?? "Metadata control"} crossed the composer rail`,
+      ).toBeLessThanOrEqual(composerRightRail + 1);
+    }
+  });
+});

packages/app/e2e/browser/provider-settings-refresh.spec.ts

@@ -160,7 +160,6 @@ test.describe("provider settings overlay stack", () => {
       await commandCenter.getByText("Add project", { exact: true }).click();
       const addProject = page.getByTestId("add-project-flow");
       await expect(addProject).toBeVisible({ timeout: 10_000 });
-      await expect(addProject.getByTestId("add-project-flow-input")).toBeFocused();
       await page.keyboard.press("Escape");
       await expect(addProject).not.toBeVisible({ timeout: 10_000 });
       await expect(selector).toBeVisible();

packages/app/e2e/browser/provider-subagents.real.spec.ts

@@ -34,7 +34,7 @@ const cases: ProviderSubagentCase[] = [
     provider: "codex",
     sentinel: "CODEX_CHILD_SENTINEL",
     expectedName: "Sentinel child",
-    providerConfig: { extra: { codex: { features: { multi_agent_v2: true } } } },
+    providerConfig: { providerOptions: { features: { multi_agent_v2: true } } },
     prompt:
       'Use the native collaboration.spawn_agent tool exactly once with task_name "sentinel_child" and fork_turns "none". Ask it to reply with exactly CODEX_CHILD_SENTINEL and do nothing else. Wait for it with collaboration.wait_agent, then reply ROOT_DONE. Do not use Paseo tools.',
   },

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

@@ -114,16 +114,6 @@ test.describe("Settings sidebar navigation", () => {
     await expectDirectHostUriHidden(page);
   });
 
-  test("browser web hides direct connection custom headers", async ({ page }) => {
-    await gotoAppShell(page);
-    await openSettings(page);
-    await openAddHostFlow(page);
-    await selectHostConnectionType(page, "direct");
-    await toggleHostAdvanced(page);
-
-    await expect(page.getByTestId("direct-header-add")).toHaveCount(0);
-  });
-
   test("sidebar shows a Back to workspace row that leaves /settings", async ({ page }) => {
     await gotoAppShell(page);
     await openSettings(page);

packages/app/e2e/browser/sidebar-resize-handle.spec.ts

@@ -8,7 +8,6 @@ async function expectBorderHighlight(page: Page, testID: string) {
   await expect(page.getByTestId(`${testID}-highlight`)).toHaveCount(0);
 
   await handle.hover();
-  await expect(page.getByTestId(`${testID}-highlight`)).toHaveCount(0);
 
   const highlight = page.getByTestId(`${testID}-highlight`);
   await expect(highlight).toBeVisible();

packages/app/e2e/browser/sidebar-workspace.spec.ts

@@ -304,7 +304,9 @@ test.describe("Half-screen desktop layout", () => {
     await gotoAppShell(page);
 
     const openToggle = page.getByTestId("menu-button");
-    const openBounds = await openToggle.locator("svg").first().boundingBox();
+    const openIcon = openToggle.locator("svg").first();
+    await expect(openIcon).toBeVisible();
+    const openBounds = await openIcon.boundingBox();
     expect(openBounds).not.toBeNull();
     expect(openBounds?.x).toBeGreaterThan(12);
 
@@ -312,7 +314,9 @@ test.describe("Half-screen desktop layout", () => {
     await expect(page.getByTestId("sidebar-global-new-workspace")).not.toBeVisible();
 
     const closedToggle = page.getByTestId("menu-button");
-    const closedBounds = await closedToggle.locator("svg").first().boundingBox();
+    const closedIcon = closedToggle.locator("svg").first();
+    await expect(closedIcon).toBeVisible();
+    const closedBounds = await closedIcon.boundingBox();
     expect(closedBounds).not.toBeNull();
     expect(closedBounds?.x).toBeCloseTo(12, 0);
     expect(closedBounds?.y).toBe(openBounds?.y);

packages/app/e2e/browser/workspace-model-restart.spec.ts

@@ -503,12 +503,16 @@ test.describe("Workspace model restart regressions", () => {
             createdWorkspaceId,
           ]),
         )
-        .toEqual({
-          [seeded.workspaceA]: "running",
+        .toMatchObject({
           [seeded.workspaceB]: "done",
           [createdWorkspaceId]: "done",
         });
 
+      // The restarted provider session may settle while the browser creates the sibling. Its
+      // initial running status is asserted above; this phase verifies that ownership never moves.
+      const workspaceStatuses = await fetchWorkspaceStatuses(client, [seeded.workspaceA]);
+      expect(["running", "done"]).toContain(workspaceStatuses[seeded.workspaceA]);
+
       await expectWorkspaceRowDoesNotShowIndicator(page, {
         serverId,
         workspaceId: seeded.workspaceB,
@@ -519,11 +523,6 @@ test.describe("Workspace model restart regressions", () => {
         workspaceId: createdWorkspaceId,
         indicator: "running",
       });
-      await expectWorkspaceRowInStatusBucket(page, {
-        serverId,
-        workspaceId: seeded.workspaceA,
-        bucket: "running",
-      });
       await expectWorkspaceRowInStatusBucket(page, {
         serverId,
         workspaceId: seeded.workspaceB,

packages/app/e2e/browser/workspace-tab-switcher-rename.spec.ts

@@ -0,0 +1,76 @@
+import { randomUUID } from "node:crypto";
+import { test, expect } from "../support/fixtures";
+import { openAgentRoute, seedMockAgentWorkspace } from "../support/helpers/mock-agent";
+import { renameModalInput, renameModalSubmit } from "../support/helpers/rename";
+import type { SeedDaemonClient } from "../support/helpers/seed-client";
+
+const MOBILE_VIEWPORT = { width: 390, height: 844 };
+
+async function fetchAgentTitle(client: SeedDaemonClient, agentId: string): Promise<string | null> {
+  const result = await client.fetchAgents({ scope: "active" });
+  return result.entries.find((entry) => entry.agent.id === agentId)?.agent.title ?? null;
+}
+
+/**
+ * Compact "sessions dropdown" rename path. The desktop rename specs drive the right-click
+ * `workspace-tab-context-*` menu, which portals into overlay-root and was never broken. This
+ * exercises the tab switcher's per-session actions on a phone-sized viewport — the path that
+ * regressed when the actions menu presented as a popover instead of a bottom sheet.
+ */
+test.describe("Workspace session rename (compact tab switcher)", () => {
+  test("renames an agent session from the switcher's per-session actions sheet", async ({
+    page,
+  }) => {
+    test.setTimeout(120_000);
+
+    await page.setViewportSize(MOBILE_VIEWPORT);
+    const initialTitle = `switcher-rename-${randomUUID().slice(0, 8)}`;
+    const session = await seedMockAgentWorkspace({
+      repoPrefix: "workspace-switcher-rename-",
+      title: initialTitle,
+    });
+
+    try {
+      await openAgentRoute(page, session);
+      await expect(page.getByTestId("workspace-tab-switcher-trigger")).toBeVisible({
+        timeout: 30_000,
+      });
+
+      // Open the sessions dropdown (a bottom sheet on compact).
+      await page.getByRole("button", { name: /Switch tabs/ }).click();
+      await expect(page.getByRole("button", { name: "Bottom sheet backdrop" }).first()).toBeVisible(
+        {
+          timeout: 10_000,
+        },
+      );
+
+      // Open this session's "…" actions. Before the fix this tried to open a popover-Modal
+      // that never surfaced over the sheet on native; it now opens as a stacked sheet.
+      const menuBase = `workspace-tab-menu-agent_${session.agentId}`;
+      const actionsTrigger = page.getByTestId(`${menuBase}-trigger`);
+      await expect(actionsTrigger).toBeVisible({ timeout: 15_000 });
+      await actionsTrigger.click();
+
+      const renameItem = page.getByTestId(`${menuBase}-rename`);
+      await expect(renameItem).toBeVisible({ timeout: 10_000 });
+      await renameItem.click();
+
+      const modalPrefix = `workspace-tab-rename-modal-agent-${session.agentId}`;
+      const input = renameModalInput(page, modalPrefix);
+      await expect(input).toBeVisible({ timeout: 10_000 });
+      await expect(input).toHaveValue(initialTitle);
+
+      const renamed = "Renamed from the dropdown";
+      await input.fill(renamed);
+      await renameModalSubmit(page, modalPrefix).click();
+
+      await expect(input).toHaveCount(0, { timeout: 15_000 });
+      await expect(page.getByTestId("workspace-tab-switcher-trigger")).toContainText(renamed, {
+        timeout: 15_000,
+      });
+      await expect.poll(() => fetchAgentTitle(session.client, session.agentId)).toBe(renamed);
+    } finally {
+      await session.cleanup();
+    }
+  });
+});

packages/app/e2e/support/helpers/add-project-flow.ts

@@ -43,13 +43,21 @@ export async function expectAddProjectPage(page: Page, kind: AddProjectFlowPage)
   return currentPage;
 }
 
-export async function openAddProjectFlow(
+async function openAddProjectFlowSurface(
   page: Page,
-  expectedPage: "host" | "method" = "method",
+  expectedPage: "host" | "method",
 ): Promise<void> {
   await page.getByTestId("sidebar-add-project").click();
   await expect(addProjectFlow(page)).toBeVisible({ timeout: 30_000 });
   await expectAddProjectPage(page, expectedPage);
+}
+
+export async function openAddProjectFlow(page: Page): Promise<void> {
+  await openAddProjectFlowSurface(page, "method");
+}
+
+export async function openAddProjectHostSelection(page: Page): Promise<void> {
+  await openAddProjectFlowSurface(page, "host");
   await expect(addProjectFlowInput(page)).toBeFocused();
 }
 

packages/app/e2e/support/helpers/command-center-file-search.ts

@@ -0,0 +1,211 @@
+import { expect, type Locator, type Page } from "@playwright/test";
+import { daemonWsRoutePattern } from "./daemon-port";
+
+type WebSocketMessage = string | Buffer;
+
+interface SurfaceRect {
+  height: number;
+  width: number;
+  x: number;
+  y: number;
+}
+
+interface LayoutObservation {
+  active: boolean;
+  layoutShift: number;
+  samples: Record<string, SurfaceRect[]>;
+}
+
+type LayoutOracleWindow = Window & {
+  __commandCenterLayoutObservation?: LayoutObservation;
+};
+
+const SURFACE_SELECTORS = {
+  panel: '[data-testid="command-center-panel"]',
+  header: '[data-testid="command-center-header"]',
+  input: '[data-testid="command-center-input"]',
+  fileSearchStatus: '[data-testid="command-center-file-search-status"]',
+  results: '[data-testid="command-center-results"]',
+  scope: '[data-testid="command-center-files-scope"]',
+  fileRow: '[data-testid^="command-center-file-row-"]',
+  fileIcon: '[data-testid="command-center-file-icon"]',
+  fileLine: '[data-testid="command-center-file-line"]',
+} as const;
+
+function parseSessionMessage(message: WebSocketMessage): Record<string, unknown> | null {
+  const raw = typeof message === "string" ? message : message.toString("utf8");
+  try {
+    const envelope = JSON.parse(raw) as { type?: unknown; message?: unknown };
+    return envelope.type === "session" && envelope.message && typeof envelope.message === "object"
+      ? (envelope.message as Record<string, unknown>)
+      : null;
+  } catch {
+    return null;
+  }
+}
+
+export async function delayDirectorySuggestionResponses(page: Page, delayMs = 400): Promise<void> {
+  await page.routeWebSocket(daemonWsRoutePattern(), (ws) => {
+    const server = ws.connectToServer();
+    ws.onMessage((message) => server.send(message));
+    server.onMessage((message) => {
+      const sessionMessage = parseSessionMessage(message);
+      if (sessionMessage?.type === "directory_suggestions_response") {
+        setTimeout(() => ws.send(message), delayMs);
+        return;
+      }
+      ws.send(message);
+    });
+  });
+}
+
+export async function failDirectorySuggestionRequests(page: Page): Promise<void> {
+  await page.routeWebSocket(daemonWsRoutePattern(), (ws) => {
+    const server = ws.connectToServer();
+    ws.onMessage((message) => {
+      const sessionMessage = parseSessionMessage(message);
+      if (sessionMessage?.type === "directory_suggestions_request") {
+        const requestId = sessionMessage.requestId;
+        if (typeof requestId === "string") {
+          ws.send(
+            JSON.stringify({
+              type: "session",
+              message: {
+                type: "rpc_error",
+                payload: {
+                  requestId,
+                  requestType: "directory_suggestions_request",
+                  error: "Test file search transport failure.",
+                  code: "transport",
+                },
+              },
+            }),
+          );
+        }
+        return;
+      }
+      server.send(message);
+    });
+    server.onMessage((message) => ws.send(message));
+  });
+}
+
+export async function startCommandCenterLayoutObservation(page: Page): Promise<void> {
+  await page.evaluate((selectors) => {
+    const oracleWindow = window as LayoutOracleWindow;
+    const observation: LayoutObservation = { active: true, layoutShift: 0, samples: {} };
+    oracleWindow.__commandCenterLayoutObservation = observation;
+
+    const observedElements = new WeakSet<Element>();
+    const resizeObserver = new ResizeObserver(record);
+    const mutationObserver = new MutationObserver(discover);
+
+    function record(): void {
+      if (!observation.active) return;
+      for (const [name, selector] of Object.entries(selectors)) {
+        const element = document.querySelector<HTMLElement>(selector);
+        if (!element) continue;
+        const rect = element.getBoundingClientRect();
+        (observation.samples[name] ??= []).push({
+          height: rect.height,
+          width: rect.width,
+          x: rect.x,
+          y: rect.y,
+        });
+      }
+    }
+
+    function discover(): void {
+      for (const selector of Object.values(selectors)) {
+        const element = document.querySelector(selector);
+        if (!element || observedElements.has(element)) continue;
+        observedElements.add(element);
+        resizeObserver.observe(element);
+      }
+      record();
+    }
+
+    mutationObserver.observe(document.body, { attributes: true, childList: true, subtree: true });
+    discover();
+
+    const sampleFrame = () => {
+      if (!observation.active) {
+        mutationObserver.disconnect();
+        resizeObserver.disconnect();
+        return;
+      }
+      record();
+      requestAnimationFrame(sampleFrame);
+    };
+    requestAnimationFrame(sampleFrame);
+
+    if (typeof PerformanceObserver !== "undefined") {
+      try {
+        const performanceObserver = new PerformanceObserver((list) => {
+          for (const entry of list.getEntries()) {
+            observation.layoutShift += (entry as PerformanceEntry & { value?: number }).value ?? 0;
+          }
+        });
+        performanceObserver.observe({ type: "layout-shift", buffered: false });
+      } catch {
+        // LayoutShift is diagnostic-only on engines that do not expose it.
+      }
+    }
+  }, SURFACE_SELECTORS);
+}
+
+export async function expectStableCommandCenterLayout(page: Page): Promise<void> {
+  await page.waitForTimeout(500);
+  const observation = await page.evaluate(() => {
+    const state = (window as LayoutOracleWindow).__commandCenterLayoutObservation;
+    if (!state) throw new Error("Command center layout observer was not installed");
+    state.active = false;
+    return state;
+  });
+
+  for (const surface of Object.keys(SURFACE_SELECTORS)) {
+    const samples = observation.samples[surface] ?? [];
+    expect(samples.length, `${surface}: ${JSON.stringify(observation)}`).toBeGreaterThan(0);
+    for (const dimension of ["height", "width", "x", "y"] as const) {
+      const values = samples.map((sample) => sample[dimension]);
+      expect(
+        Math.max(...values) - Math.min(...values),
+        `${surface}.${dimension}: ${JSON.stringify(samples)}`,
+      ).toBeLessThanOrEqual(1);
+    }
+  }
+  expect(observation.layoutShift, JSON.stringify(observation)).toBeLessThanOrEqual(0.001);
+}
+
+export async function expectOneLineTruncatedFileResult(
+  row: Locator,
+  input: { filename: string; path: string },
+): Promise<void> {
+  await expect(row).toContainText(`${input.filename} ${input.path}`);
+  await expect(row.getByTestId("command-center-file-icon")).toBeVisible();
+  const line = row.getByTestId("command-center-file-line");
+  const filename = row.getByTestId("command-center-file-name");
+  const filePath = row.getByTestId("command-center-file-path");
+  const geometry = await Promise.all([
+    row.boundingBox(),
+    line.boundingBox(),
+    filename.boundingBox(),
+    filePath.boundingBox(),
+    line.evaluate((element) => ({
+      clientWidth: element.clientWidth,
+      overflow: getComputedStyle(element).overflow,
+      scrollWidth: element.scrollWidth,
+      whiteSpace: getComputedStyle(element).whiteSpace,
+    })),
+  ]);
+  const [rowBox, lineBox, filenameBox, pathBox, overflow] = geometry;
+  expect(rowBox).not.toBeNull();
+  expect(lineBox).not.toBeNull();
+  expect(filenameBox).not.toBeNull();
+  expect(pathBox).not.toBeNull();
+  expect(rowBox?.height).toBe(36);
+  expect(Math.abs((filenameBox?.y ?? 0) - (pathBox?.y ?? 0))).toBeLessThanOrEqual(1);
+  expect(overflow.scrollWidth).toBeGreaterThan(overflow.clientWidth);
+  expect(overflow.overflow).toBe("hidden");
+  expect(overflow.whiteSpace).toBe("nowrap");
+}

packages/app/e2e/support/helpers/pair-device.ts

@@ -17,6 +17,49 @@ interface PairingHostInput {
   endpoint: string;
 }
 
+export async function prepareLocalPairingHost(
+  page: Page,
+  daemon: IsolatedHostDaemon | OutdatedDaemon,
+  additionalHosts: PairingHostInput[] = [],
+): Promise<void> {
+  await page.addInitScript((localServerId) => {
+    (window as unknown as { paseoDesktop: unknown }).paseoDesktop = {
+      platform: "darwin",
+      invoke: async (command: string) => {
+        if (command === "desktop_daemon_status") {
+          return {
+            serverId: localServerId,
+            status: "running",
+            listen: null,
+            hostname: null,
+            pid: null,
+            home: "",
+            version: null,
+            desktopManaged: true,
+            error: null,
+          };
+        }
+        if (command === "get_desktop_settings") {
+          return {
+            releaseChannel: "stable",
+            daemon: { manageBuiltInDaemon: false, keepRunningAfterQuit: true },
+          };
+        }
+        return null;
+      },
+      getPendingOpenProject: async () => null,
+      events: { on: async () => () => undefined },
+      opener: {
+        openUrl: async (url: string) => {
+          localStorage.setItem("@paseo:e2e-opened-url", url);
+        },
+      },
+    };
+  }, daemon.serverId);
+
+  await preparePairingHost(page, daemon, additionalHosts);
+}
+
 export async function preparePairingHost(
   page: Page,
   daemon: IsolatedHostDaemon | OutdatedDaemon,

packages/app/e2e/support/helpers/rewind-flow.ts

@@ -160,7 +160,7 @@ export async function launchAgent(input: {
     model?: string;
     modeId?: string;
     featureValues?: Record<string, unknown>;
-    extra?: { codex?: { features?: { multi_agent_v2?: boolean } } };
+    providerOptions?: { features?: { multi_agent_v2?: boolean } };
   };
 }): Promise<AgentHandle> {
   execFileSync("git", ["init", "-b", "main"], { cwd: input.cwd, stdio: "ignore" });

packages/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getpaseo/app",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "private": true,
   "main": "index.ts",
   "scripts": {

packages/app/src/add-project-flow/model.test.ts

@@ -39,9 +39,9 @@ describe("Add Project navigation", () => {
     expect(currentAddProjectPage(state)).toEqual({
       kind: "method",
       hostId: "host-1",
-      query: "",
       activeIndex: 0,
       error: null,
+      isSubmitting: false,
     });
     expect(backAddProjectPage(state)).toBeNull();
   });

packages/app/src/add-project-flow/model.ts

@@ -17,15 +17,18 @@ export interface GithubRepositoryChoice {
   updatedAt: string | null;
 }
 
-interface SearchPageState {
-  query: string;
+interface PageState {
   activeIndex: number;
   error: string | null;
 }
 
+interface SearchPageState extends PageState {
+  query: string;
+}
+
 export type AddProjectPage =
   | ({ kind: "host" } & SearchPageState)
-  | ({ kind: "method"; hostId: string } & SearchPageState)
+  | ({ kind: "method"; hostId: string; isSubmitting: boolean } & PageState)
   | ({ kind: "directory-search"; hostId: string; isSubmitting: boolean } & SearchPageState)
   | ({ kind: "github-search"; hostId: string } & SearchPageState)
   | ({
@@ -57,12 +60,14 @@ export interface OpenAddProjectFlowInput {
   preferredHostId?: string;
 }
 
-function searchPage<TKind extends AddProjectPage["kind"]>(kind: TKind) {
+type SearchPageKind = Extract<AddProjectPage, { query: string }>["kind"];
+
+function searchPage<TKind extends SearchPageKind>(kind: TKind) {
   return { kind, query: "", activeIndex: 0, error: null } as const;
 }
 
 function methodPage(hostId: string): AddProjectPage {
-  return { ...searchPage("method"), hostId };
+  return { kind: "method", hostId, activeIndex: 0, error: null, isSubmitting: false };
 }
 
 export function openAddProjectFlow(input: OpenAddProjectFlowInput): AddProjectFlowState {
@@ -209,6 +214,7 @@ export function setAddProjectPageInput(
     if (current.kind === "new-directory-name") {
       return { ...current, name: value, activeIndex: 0, error: null };
     }
+    if (current.kind === "method") return current;
     return { ...current, query: value, activeIndex: 0, error: null };
   });
   if (page.kind !== "github-location") return updated;

packages/app/src/app/_layout.tsx

@@ -26,6 +26,7 @@ import { CommandCenterRootActions } from "@/command-center/root-registration";
 import { CommandCenterProvider } from "@/command-center/provider";
 import { CommandCenterWorkspaceActions } from "@/command-center/workspace-registration";
 import { AddProjectFlowHost } from "@/components/add-project-flow-host";
+import { AppearanceStyleBoundary } from "@/components/appearance-style-boundary";
 import { WorktreeSetupCalloutSource } from "@/components/worktree-setup-callout-source";
 import { DownloadToast } from "@/components/download-toast";
 import { QuittingOverlay } from "@/components/quitting-overlay";
@@ -643,7 +644,7 @@ function ProvidersWrapper({ children }: { children: ReactNode }) {
 
   // Apply font / size / syntax appearance settings on mount and when they change.
   // Sibling to the theme effect above; order is irrelevant because both patch all
-  // six registered theme keys, so the active key is always current.
+  // registered theme keys, so the active key is always current.
   useEffect(() => {
     if (settingsLoading) return;
     applyAppearance({
@@ -668,7 +669,7 @@ function ProvidersWrapper({ children }: { children: ReactNode }) {
       <OfferLinkListener upsertDaemonFromOfferUrl={upsertConnectionFromOfferUrl} />
       <HostSessionManager />
       <FaviconStatusSync />
-      {children}
+      <AppearanceStyleBoundary>{children}</AppearanceStyleBoundary>
     </VoiceProvider>
   );
 }
@@ -954,19 +955,17 @@ function RuntimeProviders({ children }: { children: ReactNode }) {
 // context and need one shared provider for sibling sheets to stack.
 function RootProviders({ children }: { children: ReactNode }) {
   return (
-    <SafeAreaProvider>
-      <WindowChromeProvider>
-        <KeyboardProvider>
-          <KeyboardShiftProvider>
-            <ToastProvider>
-              <PortalProvider>
-                <BottomSheetModalProvider>{children}</BottomSheetModalProvider>
-              </PortalProvider>
-            </ToastProvider>
-          </KeyboardShiftProvider>
-        </KeyboardProvider>
-      </WindowChromeProvider>
-    </SafeAreaProvider>
+    <WindowChromeProvider>
+      <KeyboardProvider>
+        <KeyboardShiftProvider>
+          <ToastProvider>
+            <PortalProvider>
+              <BottomSheetModalProvider>{children}</BottomSheetModalProvider>
+            </PortalProvider>
+          </ToastProvider>
+        </KeyboardShiftProvider>
+      </KeyboardProvider>
+    </WindowChromeProvider>
   );
 }
 
@@ -998,9 +997,11 @@ export default function RootLayout() {
   return (
     <QueryProvider>
       <I18nProvider>
-        <RootErrorBoundary>
-          <RootAppTree />
-        </RootErrorBoundary>
+        <SafeAreaProvider>
+          <RootErrorBoundary>
+            <RootAppTree />
+          </RootErrorBoundary>
+        </SafeAreaProvider>
       </I18nProvider>
     </QueryProvider>
   );

packages/app/src/assistant-selection-copy/content.browser.test.ts

@@ -5,8 +5,8 @@ const fixture = `
   <div data-testid="assistant-message">
     <div data-paseo-markdown-tag="p">Prefix <span data-paseo-markdown-tag="strong">bold text</span> and <span data-paseo-markdown-tag="code">inline code</span> suffix.</div>
     <div data-paseo-markdown-tag="ul">
-      <div data-paseo-markdown-tag="li"><span data-paseo-markdown-ignore="true">•</span><div><span>First bullet text</span></div></div>
-      <div data-paseo-markdown-tag="li"><span data-paseo-markdown-ignore="true">•</span><div><span>Second bullet text</span></div></div>
+      <div data-paseo-markdown-tag="li"><span data-paseo-markdown-ignore="true" data-paseo-markdown-list-marker="true">•</span><div><span>First bullet text</span></div></div>
+      <div data-paseo-markdown-tag="li"><span data-paseo-markdown-ignore="true" data-paseo-markdown-list-marker="true">•</span><div><span>Second bullet text</span></div></div>
     </div>
     <div data-paseo-markdown-tag="pre" data-paseo-markdown-language="ts"><span data-paseo-markdown-tag="code">const answer = true;</span></div>
   </div>
@@ -203,6 +203,97 @@ describe("assistant selection copy ranges", () => {
     expect(copiedMarkdown(selectNodeContents(item))).toBe("- First bullet text");
   });
 
+  it("retains a bullet when a drag selects from the rendered marker through the item text", () => {
+    const message = mountFixture();
+    const marker = fixtureElement(message, '[data-paseo-markdown-list-marker="true"]');
+    const itemText = fixtureElement(message, '[data-paseo-markdown-tag="li"] div span');
+
+    const content = createAssistantSelectionClipboardContent(
+      selectRange(marker, 0, itemText, textNode(itemText).length),
+    );
+    expect(content?.plainText).toBe("- First bullet text");
+    expect(content?.html).toContain("<div>- First bullet text</div>");
+    expect(content?.html).not.toContain("<ul>");
+    expect(content?.html).not.toContain("<li>");
+  });
+
+  it("retains a bullet when a drag includes the marker and part of the item text", () => {
+    const message = mountFixture();
+    const marker = fixtureElement(message, '[data-paseo-markdown-list-marker="true"]');
+    const itemText = fixtureElement(message, '[data-paseo-markdown-tag="li"] div span');
+
+    expect(copiedMarkdown(selectRange(marker, 0, itemText, 5))).toBe("- First");
+  });
+
+  it("does not invent a bullet when a drag starts after the rendered marker", () => {
+    const message = mountFixture();
+    const marker = fixtureElement(message, '[data-paseo-markdown-list-marker="true"]');
+    const itemText = fixtureElement(message, '[data-paseo-markdown-tag="li"] div span');
+
+    expect(
+      copiedMarkdown(
+        selectRange(marker, textNode(marker).length, itemText, textNode(itemText).length),
+      ),
+    ).toBe("First bullet text");
+  });
+
+  it("retains every selected marker across a partial multi-item drag", () => {
+    const message = mountFixture();
+    const markerSelector = '[data-paseo-markdown-list-marker="true"]';
+    const textSelector = '[data-paseo-markdown-tag="li"] div span';
+    const firstMarker = fixtureElement(message, markerSelector);
+    const secondText = fixtureElement(message, textSelector, 1);
+
+    expect(copiedMarkdown(selectRange(firstMarker, 0, secondText, 6))).toBe(
+      "- First bullet text\n- Second",
+    );
+  });
+
+  it("retains the original number when a marker drag starts mid-list", () => {
+    const message = mountFixture();
+    const list = fixtureElement(message, '[data-paseo-markdown-tag="ul"]');
+    list.setAttribute("data-paseo-markdown-tag", "ol");
+    list.setAttribute("data-paseo-markdown-list-start", "5");
+    const markers = list.querySelectorAll<HTMLElement>('[data-paseo-markdown-list-marker="true"]');
+    markers.item(0).textContent = "5.";
+    markers.item(1).textContent = "6.";
+    const secondMarker = fixtureElement(list, '[data-paseo-markdown-list-marker="true"]', 1);
+    const secondText = fixtureElement(list, '[data-paseo-markdown-tag="li"] div span', 1);
+
+    expect(
+      copiedMarkdown(selectRange(secondMarker, 0, secondText, textNode(secondText).length)),
+    ).toBe("6. Second bullet text");
+  });
+
+  it("retains nested markers when a drag includes the complete outer item", () => {
+    const message = mountFixture();
+    const firstItem = fixtureElement(message, '[data-paseo-markdown-tag="li"]');
+    firstItem.innerHTML = [
+      '<span data-paseo-markdown-ignore="true" data-paseo-markdown-list-marker="true">•</span>',
+      "<div>",
+      "<span>Outer text</span>",
+      '<div data-paseo-markdown-tag="ul">',
+      '<div data-paseo-markdown-tag="li">',
+      '<span data-paseo-markdown-ignore="true" data-paseo-markdown-list-marker="true">•</span>',
+      "<div><span>Inner text</span></div>",
+      "</div>",
+      "</div>",
+      "</div>",
+    ].join("");
+    const outerMarker = fixtureElement(
+      firstItem,
+      ':scope > [data-paseo-markdown-list-marker="true"]',
+    );
+    const innerText = fixtureElement(
+      firstItem,
+      ':scope [data-paseo-markdown-tag="ul"] > [data-paseo-markdown-tag="li"] > div > span',
+    );
+
+    expect(copiedMarkdown(selectRange(outerMarker, 0, innerText, textNode(innerText).length))).toBe(
+      "- Outer text\n    - Inner text",
+    );
+  });
+
   it("preserves paragraph breaks when rich HTML flattens a loose list item", () => {
     const message = mountFixture();
     const item = fixtureElement(message, '[data-paseo-markdown-tag="li"]');

packages/app/src/assistant-selection-copy/content.web.ts

@@ -9,6 +9,7 @@ import {
   MARKDOWN_COPY_ALIGN_ATTRIBUTE,
   MARKDOWN_COPY_IGNORE_ATTRIBUTE,
   MARKDOWN_COPY_LANGUAGE_ATTRIBUTE,
+  MARKDOWN_COPY_LIST_MARKER_ATTRIBUTE,
   MARKDOWN_COPY_LIST_START_ATTRIBUTE,
   MARKDOWN_COPY_TAG_ATTRIBUTE,
   MARKDOWN_COPY_UNWRAP_ATTRIBUTE,
@@ -278,7 +279,7 @@ function shouldPreserveSemanticElement(range: Range, element: Element): boolean
   if (tag === "p" || isTableStructure(tag)) {
     return true;
   }
-  const isSelectableSemantic = tag !== null && tag !== "ol" && tag !== "ul";
+  const isSelectableSemantic = tag !== null && tag !== "li" && tag !== "ol" && tag !== "ul";
   if (
     (isSelectableSemantic || element.tagName === "A") &&
     selectionStaysInsideElement(range, element)
@@ -287,7 +288,12 @@ function shouldPreserveSemanticElement(range: Range, element: Element): boolean
   }
   if (tag === "ol" || tag === "ul") {
     const selectedItems = selectedListItems(element, range);
-    return selectedItems.some((item) => hasSelectedAllContents(range, item, true));
+    return selectedItems.some(
+      (item) => hasSelectedListMarker(range, item) || hasSelectedAllContents(range, item, true),
+    );
+  }
+  if (tag === "li" && hasSelectedListMarker(range, element)) {
+    return true;
   }
   return hasSelectedAllContents(range, element, tag === "li");
 }
@@ -311,6 +317,31 @@ function selectedListItems(list: Element, range: Range): Element[] {
   );
 }
 
+function hasSelectedListMarker(range: Range, item: Element): boolean {
+  const marker = item.querySelector(`:scope > [${MARKDOWN_COPY_LIST_MARKER_ATTRIBUTE}]`);
+  if (!marker) {
+    return false;
+  }
+
+  const markerContents = document.createRange();
+  markerContents.selectNodeContents(marker);
+  const selectionEndsBeforeMarker =
+    range.compareBoundaryPoints(Range.END_TO_START, markerContents) >= 0;
+  const selectionStartsAfterMarker =
+    range.compareBoundaryPoints(Range.START_TO_END, markerContents) <= 0;
+  if (selectionEndsBeforeMarker || selectionStartsAfterMarker) {
+    return false;
+  }
+
+  if (range.compareBoundaryPoints(Range.START_TO_START, markerContents) > 0) {
+    markerContents.setStart(range.startContainer, range.startOffset);
+  }
+  if (range.compareBoundaryPoints(Range.END_TO_END, markerContents) < 0) {
+    markerContents.setEnd(range.endContainer, range.endOffset);
+  }
+  return hasMarkdownContent(markerContents.cloneContents(), true);
+}
+
 function normalizeOrderedListStart(copy: Element, original: Element, range: Range): void {
   if (original.getAttribute(MARKDOWN_COPY_TAG_ATTRIBUTE) !== "ol") {
     return;

packages/app/src/assistant-selection-copy/markup.ts

@@ -1,5 +1,6 @@
 export const MARKDOWN_COPY_TAG_ATTRIBUTE = "data-paseo-markdown-tag";
 export const MARKDOWN_COPY_IGNORE_ATTRIBUTE = "data-paseo-markdown-ignore";
+export const MARKDOWN_COPY_LIST_MARKER_ATTRIBUTE = "data-paseo-markdown-list-marker";
 export const MARKDOWN_COPY_UNWRAP_ATTRIBUTE = "data-paseo-markdown-unwrap";
 export const MARKDOWN_COPY_LIST_START_ATTRIBUTE = "data-paseo-markdown-list-start";
 export const MARKDOWN_COPY_LANGUAGE_ATTRIBUTE = "data-paseo-markdown-language";
@@ -28,6 +29,7 @@ export const markdownCopyDataSet = {
   hr: { paseoMarkdownTag: "hr" },
   ignore: { paseoMarkdownIgnore: "true" },
   li: { paseoMarkdownTag: "li" },
+  listMarker: { paseoMarkdownIgnore: "true", paseoMarkdownListMarker: "true" },
   ol: { paseoMarkdownTag: "ol" },
   p: { paseoMarkdownTag: "p" },
   pre: { paseoMarkdownTag: "pre" },

packages/app/src/command-center/command-center.tsx

@@ -13,7 +13,7 @@ import {
 } from "react-native";
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Check, ChevronRight, Folder } from "lucide-react-native";
+import { Check, ChevronRight, Folder, X } from "lucide-react-native";
 import { StyleSheet, withUnistyles } from "react-native-unistyles";
 import {
   BottomSheetBackdrop,
@@ -22,6 +22,8 @@ import {
   type BottomSheetFlatListMethods,
 } from "@gorhom/bottom-sheet";
 import { AgentStatusDot } from "@/components/agent-status-dot";
+import { MaterialFileIcon } from "@/components/material-file-icon";
+import { LoadingSpinner } from "@/components/ui/loading-spinner";
 import { Shortcut } from "@/components/ui/shortcut";
 import {
   IsolatedBottomSheetModal,
@@ -37,7 +39,10 @@ import {
   useWebOverlayRegistration,
 } from "@/lib/overlay-root";
 import { useHosts } from "@/runtime/host-runtime";
-import { useKeyboardShortcutsStore } from "@/stores/keyboard-shortcuts-store";
+import {
+  useKeyboardShortcutsStore,
+  type CommandCenterScope,
+} from "@/stores/keyboard-shortcuts-store";
 import { navigateToWorkspace } from "@/stores/navigation-active-workspace-store";
 import { keyboardActionDispatcher } from "@/keyboard/keyboard-action-dispatcher";
 import {
@@ -56,11 +61,13 @@ import {
   preserveActiveResultId,
   projectCommandCenterRows,
   type CommandCenterAgentResult,
+  type CommandCenterFileResult,
   type CommandCenterListRow,
   type CommandCenterResult,
   type CommandCenterResultSection,
   type CommandCenterWorkspaceResult,
 } from "./results";
+import { useWorkspaceFileSearch } from "./workspace-file-search";
 
 const ThemedBottomSheetTextInput = withUnistyles(BottomSheetTextInput, (theme) => ({
   placeholderTextColor: theme.colors.foregroundMuted,
@@ -73,6 +80,10 @@ const ThemedCheck = withUnistyles(Check, (theme) => ({ color: theme.colors.foreg
 const ThemedChevronRight = withUnistyles(ChevronRight, (theme) => ({
   color: theme.colors.foregroundMuted,
 }));
+const ThemedX = withUnistyles(X, (theme) => ({ color: theme.colors.foregroundMuted }));
+const ThemedLoadingSpinner = withUnistyles(LoadingSpinner, (theme) => ({
+  color: theme.colors.foregroundMuted,
+}));
 const COMMAND_CENTER_SNAP_POINTS = ["60%", "90%"];
 const KEYBOARD_SHOULD_PERSIST_TAPS = "always" as const;
 const DEFAULT_CATEGORY_RESULT_LIMIT = 5;
@@ -191,6 +202,8 @@ function useBuiltInSections(open: boolean, query: string): CommandCenterResultSe
 
 interface CommandCenterState {
   open: boolean;
+  scope: CommandCenterScope;
+  clearScope(): void;
   query: string;
   setQuery(query: string): void;
   activeId: string | null;
@@ -199,27 +212,58 @@ interface CommandCenterState {
   rowIndexByResultId: ReadonlyMap<string, number>;
   offsets: readonly number[];
   inputRef: React.RefObject<TextInput | null>;
+  fileSearchLoading: boolean;
+  fileSearchError: string | null;
   close(): void;
   select(result: CommandCenterResult): void;
   key(key: string): boolean;
 }
 
 function useCommandCenterState(): CommandCenterState {
+  const { t } = useTranslation();
   const open = useKeyboardShortcutsStore((state) => state.commandCenterOpen);
+  const scope = useKeyboardShortcutsStore((state) => state.commandCenterScope);
   const setOpen = useKeyboardShortcutsStore((state) => state.setCommandCenterOpen);
+  const setScope = useKeyboardShortcutsStore((state) => state.setCommandCenterScope);
   const snapshot = useCommandCenterContributions();
   const inputRef = useRef<TextInput>(null);
   const previousOpenRef = useRef(open);
   const [query, setQuery] = useState("");
   const [activeId, setActiveId] = useState<string | null>(null);
   const builtInSections = useBuiltInSections(open, query);
+  const {
+    entries: fileSearchEntries,
+    loading: fileSearchLoading,
+    error: fileSearchError,
+    openFile,
+  } = useWorkspaceFileSearch({
+    enabled: open && (scope === "files" || Boolean(query.trim())),
+    query,
+  });
+  const fileSections = useMemo<CommandCenterResultSection[]>(() => {
+    const results = fileSearchEntries.map<CommandCenterFileResult>((entry) => ({
+      kind: "file",
+      id: `file:${entry.path}`,
+      filePath: entry.path,
+      title: entry.name,
+      subtitle: entry.directory,
+      searchText: entry.path.toLowerCase(),
+      run: () => openFile(entry.path),
+    }));
+    return [{ id: "files", rank: 4, title: t("shell.commandCenter.files"), results }];
+  }, [fileSearchEntries, openFile, t]);
   const contributionSections = useMemo(
     () => buildContributionSections(snapshot.contributions, query),
     [query, snapshot.contributions],
   );
   const projection = useMemo(
-    () => projectCommandCenterRows([...contributionSections, ...builtInSections]),
-    [builtInSections, contributionSections],
+    () =>
+      projectCommandCenterRows(
+        scope === "files"
+          ? fileSections
+          : [...contributionSections, ...fileSections, ...builtInSections],
+      ),
+    [builtInSections, contributionSections, fileSections, scope],
   );
   const resolvedActiveId = preserveActiveResultId(activeId, projection.selectableResults);
 
@@ -239,6 +283,10 @@ function useCommandCenterState(): CommandCenterState {
         close();
         return true;
       }
+      if (pressed === "Backspace" && !query.trim() && scope) {
+        setScope(null);
+        return true;
+      }
       if (pressed === "Enter") {
         const selected = results.find((result) => result.id === resolvedActiveId);
         if (!selected) return false;
@@ -251,7 +299,7 @@ function useCommandCenterState(): CommandCenterState {
       setActiveId(moveActiveResultId(resolvedActiveId, results, direction));
       return true;
     },
-    [close, open, projection.selectableResults, resolvedActiveId, select],
+    [close, open, projection.selectableResults, query, resolvedActiveId, scope, select, setScope],
   );
 
   useEffect(() => {
@@ -277,6 +325,8 @@ function useCommandCenterState(): CommandCenterState {
 
   return {
     open,
+    scope,
+    clearScope: () => setScope(null),
     query,
     setQuery,
     activeId: resolvedActiveId,
@@ -285,6 +335,8 @@ function useCommandCenterState(): CommandCenterState {
     rowIndexByResultId: projection.rowIndexByResultId,
     offsets: projection.offsets,
     inputRef,
+    fileSearchLoading,
+    fileSearchError,
     close,
     select,
     key,
@@ -303,7 +355,10 @@ const ResultRow = memo(function ResultRow({ result, active, onSelect }: ResultRo
     result.kind === "contribution" && result.contribution.presentation.kind === "choice"
       ? result.contribution.presentation
       : null;
-  const accessibilityLabel = choice?.path.join(" › ");
+  const accessibilityLabel =
+    result.kind === "file"
+      ? [result.title, result.subtitle].filter(Boolean).join(" ")
+      : choice?.path.join(" › ");
   const accessibilityState = useMemo(
     () => (isNative && choice ? { selected: choice.selected } : undefined),
     [choice],
@@ -329,7 +384,9 @@ const ResultRow = memo(function ResultRow({ result, active, onSelect }: ResultRo
       accessibilityLabel={accessibilityLabel}
       accessibilityState={accessibilityState}
       aria-pressed={isWeb ? choice?.selected : undefined}
-      testID={choice?.testId}
+      testID={
+        result.kind === "file" ? `command-center-file-row-${result.filePath}` : choice?.testId
+      }
     >
       <ResultContent result={result} />
     </Pressable>
@@ -337,6 +394,28 @@ const ResultRow = memo(function ResultRow({ result, active, onSelect }: ResultRo
 });
 
 function ResultContent({ result }: { result: CommandCenterResult }) {
+  if (result.kind === "file") {
+    return (
+      <View style={styles.rowContent}>
+        <View style={styles.rowMain}>
+          <View style={styles.iconSlot} testID="command-center-file-icon">
+            <MaterialFileIcon fileName={result.title} size={16} />
+          </View>
+          <Text style={styles.fileLine} numberOfLines={1} testID="command-center-file-line">
+            <Text style={styles.fileName} testID="command-center-file-name">
+              {result.title}
+            </Text>
+            {result.subtitle ? (
+              <Text style={styles.filePath} testID="command-center-file-path">
+                {" "}
+                {result.subtitle}
+              </Text>
+            ) : null}
+          </Text>
+        </View>
+      </View>
+    );
+  }
   if (result.kind === "agent") {
     const agent = result.agent;
     return (
@@ -545,8 +624,24 @@ export function CommandCenter() {
   );
   const keyExtractor = useCallback((row: CommandCenterListRow) => row.key, []);
   const empty = useMemo(
-    () => <Text style={styles.emptyText}>{t("shell.commandCenter.noMatches")}</Text>,
-    [t],
+    () =>
+      state.fileSearchError || state.fileSearchLoading ? null : (
+        <Text style={styles.emptyText}>{t("shell.commandCenter.noMatches")}</Text>
+      ),
+    [state.fileSearchError, state.fileSearchLoading, t],
+  );
+  const fileSearchError = useMemo(
+    () =>
+      state.fileSearchError ? (
+        <Text
+          accessibilityLiveRegion="polite"
+          style={styles.errorText}
+          testID="command-center-file-search-error"
+        >
+          {t("common.errors.error")}: {state.fileSearchError}
+        </Text>
+      ) : null,
+    [state.fileSearchError, t],
   );
   const commonListProps = {
     data: state.rows,
@@ -554,6 +649,8 @@ export function CommandCenter() {
     keyExtractor,
     getItemLayout,
     ListEmptyComponent: empty,
+    style: styles.results,
+    testID: "command-center-results",
     keyboardShouldPersistTaps: KEYBOARD_SHOULD_PERSIST_TAPS,
     showsVerticalScrollIndicator: false,
     initialNumToRender: 12,
@@ -606,7 +703,10 @@ export function CommandCenter() {
         keyboardBlurBehavior="restore"
         accessible={false}
       >
-        <View style={styles.bottomSheetHeader}>
+        <View style={[styles.bottomSheetHeader, styles.searchRow]} testID="command-center-header">
+          {state.scope === "files" ? (
+            <ScopeChip label={t("shell.commandCenter.files")} onRemove={state.clearScope} />
+          ) : null}
           <ThemedBottomSheetTextInput
             testID="command-center-input"
             ref={bottomSheetInputRef}
@@ -614,13 +714,22 @@ export function CommandCenter() {
             onChangeText={state.setQuery}
             onKeyPress={keyPress}
             onSubmitEditing={submit}
-            placeholder={t("shell.commandCenter.placeholder")}
-            style={styles.input}
+            placeholder={
+              state.scope === "files"
+                ? t("shell.commandCenter.filePlaceholder")
+                : t("shell.commandCenter.placeholder")
+            }
+            style={[styles.input, styles.growingInput]}
             autoCapitalize="none"
             autoCorrect={false}
             autoFocus
           />
+          <FileSearchLoadingIndicator
+            loading={state.fileSearchLoading}
+            label={t("shell.commandCenter.searchingFiles")}
+          />
         </View>
+        {fileSearchError}
         <BottomSheetFlatList ref={bottomSheetListRef} {...commonListProps} />
       </IsolatedBottomSheetModal>
     );
@@ -632,20 +741,32 @@ export function CommandCenter() {
         <View style={styles.overlay}>
           <Pressable style={styles.backdrop} onPress={state.close} />
           <View ref={setWebOverlayScope} testID="command-center-panel" style={styles.panel}>
-            <View style={styles.header}>
+            <View style={[styles.header, styles.searchRow]} testID="command-center-header">
+              {state.scope === "files" ? (
+                <ScopeChip label={t("shell.commandCenter.files")} onRemove={state.clearScope} />
+              ) : null}
               <ThemedTextInput
                 testID="command-center-input"
                 ref={state.inputRef}
                 value={state.query}
                 onChangeText={state.setQuery}
-                placeholder={t("shell.commandCenter.placeholder")}
-                style={styles.input}
+                placeholder={
+                  state.scope === "files"
+                    ? t("shell.commandCenter.filePlaceholder")
+                    : t("shell.commandCenter.placeholder")
+                }
+                style={[styles.input, styles.growingInput]}
                 autoCapitalize="none"
                 autoCorrect={false}
                 autoFocus
               />
+              <FileSearchLoadingIndicator
+                loading={state.fileSearchLoading}
+                label={t("shell.commandCenter.searchingFiles")}
+              />
             </View>
-            <FlatList ref={listRef} style={styles.results} {...commonListProps} />
+            {fileSearchError}
+            <FlatList ref={listRef} {...commonListProps} />
           </View>
         </View>
       </Modal>
@@ -653,6 +774,41 @@ export function CommandCenter() {
   );
 }
 
+function FileSearchLoadingIndicator({ loading, label }: { loading: boolean; label: string }) {
+  return (
+    <View style={styles.fileSearchStatus} testID="command-center-file-search-status">
+      {loading ? (
+        <View
+          accessibilityLabel={label}
+          accessibilityRole="progressbar"
+          testID="command-center-file-search-loading"
+        >
+          <ThemedLoadingSpinner size={14} />
+        </View>
+      ) : null}
+    </View>
+  );
+}
+
+// The chip sits at the input's own height and type size so it reads as the scope of the field
+// rather than a badge dropped into the query. Its 28px matches the input's line box, so showing or
+// dropping the scope cannot resize the header.
+function ScopeChip({ label, onRemove }: { label: string; onRemove(): void }) {
+  return (
+    <Pressable
+      accessibilityRole="button"
+      accessibilityLabel={label}
+      onPress={onRemove}
+      style={styles.scopeChip}
+      testID="command-center-files-scope"
+    >
+      <ThemedFolder size={14} strokeWidth={2.2} />
+      <Text style={styles.scopeChipLabel}>{label}</Text>
+      <ThemedX size={12} strokeWidth={2.2} />
+    </Pressable>
+  );
+}
+
 const styles = StyleSheet.create((theme) => ({
   overlay: {
     flex: 1,
@@ -663,6 +819,7 @@ const styles = StyleSheet.create((theme) => ({
   backdrop: { ...StyleSheet.absoluteFillObject, backgroundColor: "rgba(0, 0, 0, 0.5)" },
   panel: {
     width: 640,
+    height: 560,
     maxWidth: "92%",
     maxHeight: "80%",
     borderWidth: 1,
@@ -690,7 +847,29 @@ const styles = StyleSheet.create((theme) => ({
     color: theme.colors.foreground,
     outlineWidth: 0,
   },
-  results: { flexGrow: 0 },
+  growingInput: { flex: 1, minWidth: 0 },
+  searchRow: { flexDirection: "row", alignItems: "center", gap: theme.spacing[2] },
+  fileSearchStatus: { width: 14, height: 14, alignItems: "center", justifyContent: "center" },
+  scopeChip: {
+    // Stretching to the row rather than setting a height keeps the chip exactly as tall as the
+    // input's line box, so showing or dropping the scope can never resize the header.
+    alignSelf: "stretch",
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.spacing[1.5],
+    marginRight: theme.spacing[1],
+    paddingHorizontal: theme.spacing[2],
+    borderRadius: theme.borderRadius.md,
+    borderWidth: 1,
+    borderColor: theme.colors.borderAccent,
+    backgroundColor: theme.colors.surface2,
+  },
+  scopeChipLabel: {
+    color: theme.colors.foreground,
+    fontSize: theme.fontSize.sm,
+    fontWeight: "500",
+  },
+  results: { flex: 1 },
   sectionLabel: {
     paddingHorizontal: theme.spacing[4],
     paddingBottom: theme.spacing[2],
@@ -726,6 +905,9 @@ const styles = StyleSheet.create((theme) => ({
     lineHeight: 18,
     flexShrink: 1,
   },
+  fileLine: { flex: 1, minWidth: 0, fontSize: theme.fontSize.sm, lineHeight: 20 },
+  fileName: { color: theme.colors.foreground },
+  filePath: { color: theme.colors.foregroundMuted },
   subtitle: { color: theme.colors.foregroundMuted, fontSize: theme.fontSize.xs, lineHeight: 16 },
   iconSlot: { width: 16, height: 20, alignItems: "center", justifyContent: "center" },
   rowShortcut: { flexShrink: 0 },
@@ -755,6 +937,14 @@ const styles = StyleSheet.create((theme) => ({
     color: theme.colors.foregroundMuted,
     fontSize: theme.fontSize.sm,
   },
+  errorText: {
+    paddingHorizontal: theme.spacing[4],
+    paddingVertical: theme.spacing[3],
+    borderBottomWidth: 1,
+    borderBottomColor: theme.colors.border,
+    color: theme.colors.statusDanger,
+    fontSize: theme.fontSize.sm,
+  },
   sheetBackground: { backgroundColor: theme.colors.surface0 },
   sheetHandle: { backgroundColor: theme.colors.palette.zinc[600] },
   titledSection: { height: 32, justifyContent: "flex-end" },

packages/app/src/command-center/results.ts

@@ -20,6 +20,16 @@ export interface CommandCenterAgentResult {
   run(): void;
 }
 
+export interface CommandCenterFileResult {
+  kind: "file";
+  id: string;
+  filePath: string;
+  title: string;
+  subtitle: string;
+  searchText: string;
+  run(): void;
+}
+
 export interface CommandCenterContributionResult {
   kind: "contribution";
   id: string;
@@ -31,6 +41,7 @@ export interface CommandCenterContributionResult {
 export type CommandCenterResult =
   | CommandCenterWorkspaceResult
   | CommandCenterAgentResult
+  | CommandCenterFileResult
   | CommandCenterContributionResult;
 
 export interface CommandCenterResultSection {
@@ -78,6 +89,7 @@ function contributionSearchText(contribution: CommandCenterContribution): string
 
 function resultHeight(result: CommandCenterResult): number {
   if (result.kind === "workspace" || result.kind === "agent") return 56;
+  if (result.kind === "file") return 36;
   if (result.contribution.presentation.kind === "action") {
     return result.contribution.presentation.subtitle ? 56 : 36;
   }

packages/app/src/command-center/workspace-file-search-model.ts

@@ -0,0 +1,15 @@
+export interface WorkspaceFileSearchEntry {
+  path: string;
+  name: string;
+  directory: string;
+}
+
+export function describeWorkspaceFilePath(path: string): WorkspaceFileSearchEntry {
+  const normalized = path.replace(/\\/g, "/");
+  const separator = normalized.lastIndexOf("/");
+  return {
+    path: normalized,
+    name: separator >= 0 ? normalized.slice(separator + 1) : normalized,
+    directory: separator >= 0 ? normalized.slice(0, separator) : "",
+  };
+}

packages/app/src/command-center/workspace-file-search.test.ts

@@ -0,0 +1,28 @@
+import { describe, expect, it } from "vitest";
+import { describeWorkspaceFilePath } from "./workspace-file-search-model";
+
+describe("describeWorkspaceFilePath", () => {
+  it("separates a workspace-relative file into its row labels", () => {
+    expect(describeWorkspaceFilePath("src/components/message.tsx")).toEqual({
+      path: "src/components/message.tsx",
+      name: "message.tsx",
+      directory: "src/components",
+    });
+  });
+
+  it("normalizes Windows separators before opening or presenting a file", () => {
+    expect(describeWorkspaceFilePath("src\\components\\message.tsx")).toEqual({
+      path: "src/components/message.tsx",
+      name: "message.tsx",
+      directory: "src/components",
+    });
+  });
+
+  it("keeps root files free of a redundant directory label", () => {
+    expect(describeWorkspaceFilePath("package.json")).toEqual({
+      path: "package.json",
+      name: "package.json",
+      directory: "",
+    });
+  });
+});

packages/app/src/command-center/workspace-file-search.ts

@@ -0,0 +1,148 @@
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { openWorkspaceFileFromExplorer } from "@/screens/workspace/workspace-file-open-command";
+import { useActiveWorkspaceSelection } from "@/stores/navigation-active-workspace-store";
+import { usePanelStore } from "@/stores/panel-store";
+import { useSessionStore } from "@/stores/session-store";
+import { useWorkspaceDirectory } from "@/stores/session-store-hooks";
+import { useWorkspaceLayoutStore } from "@/stores/workspace-layout-store";
+import { clearCommandCenterFocusRestoreElement } from "@/utils/command-center-focus-restore";
+import { buildWorkspaceTabPersistenceKey } from "@/workspace-tabs/model";
+import {
+  describeWorkspaceFilePath,
+  type WorkspaceFileSearchEntry,
+} from "./workspace-file-search-model";
+
+interface DirectorySuggestionEntry {
+  path: string;
+}
+
+const FILE_SEARCH_DEBOUNCE_MS = 100;
+const FILE_SEARCH_LIMIT = 100;
+
+interface WorkspaceFileSearchState {
+  sourceKey: string | null;
+  requestKey: string | null;
+  entries: readonly WorkspaceFileSearchEntry[];
+  loading: boolean;
+  error: string | null;
+}
+
+const EMPTY_STATE: WorkspaceFileSearchState = {
+  sourceKey: null,
+  requestKey: null,
+  entries: [],
+  loading: false,
+  error: null,
+};
+
+function errorMessage(error: unknown): string {
+  if (!(error instanceof Error)) return String(error);
+  if (error.name !== "DaemonRpcError") return error.message;
+  return error.message.replace(/ requestType=\S+(?: code=\S+)?$/, "");
+}
+
+function describeFileEntries(
+  entries: readonly DirectorySuggestionEntry[],
+): WorkspaceFileSearchEntry[] {
+  return entries.map(({ path }) => describeWorkspaceFilePath(path));
+}
+
+export function useWorkspaceFileSearch(input: { enabled: boolean; query: string }): {
+  entries: readonly WorkspaceFileSearchEntry[];
+  loading: boolean;
+  error: string | null;
+  openFile(path: string): void;
+} {
+  const selection = useActiveWorkspaceSelection();
+  const serverId = selection?.serverId ?? null;
+  const workspaceId = selection?.workspaceId ?? null;
+  const cwd = useWorkspaceDirectory(serverId, workspaceId);
+  const client = useSessionStore((state) =>
+    serverId ? (state.sessions[serverId]?.client ?? null) : null,
+  );
+  const [state, setState] = useState<WorkspaceFileSearchState>(EMPTY_STATE);
+  const sourceKey = useMemo(
+    () => (serverId && workspaceId && cwd && client ? `${serverId}\0${workspaceId}\0${cwd}` : null),
+    [client, cwd, serverId, workspaceId],
+  );
+  const requestKey = useMemo(
+    () => (input.enabled && sourceKey ? `${sourceKey}\0${input.query}` : null),
+    [input.enabled, input.query, sourceKey],
+  );
+
+  useEffect(() => {
+    if (!requestKey || !client || !cwd) {
+      setState(EMPTY_STATE);
+      return;
+    }
+    const activeClient = client;
+    const activeCwd = cwd;
+
+    let cancelled = false;
+    setState((previous) => ({
+      sourceKey,
+      requestKey,
+      entries: previous.sourceKey === sourceKey ? previous.entries : [],
+      loading: true,
+      error: null,
+    }));
+    async function search(): Promise<void> {
+      try {
+        const payload = await activeClient.getDirectorySuggestions({
+          cwd: activeCwd,
+          query: input.query,
+          includeFiles: true,
+          includeDirectories: false,
+          limit: FILE_SEARCH_LIMIT,
+        });
+        if (cancelled) return;
+        setState({
+          sourceKey,
+          requestKey,
+          entries: payload.error ? [] : describeFileEntries(payload.entries),
+          loading: false,
+          error: payload.error ?? null,
+        });
+      } catch (error) {
+        if (!cancelled) {
+          setState({
+            sourceKey,
+            requestKey,
+            entries: [],
+            loading: false,
+            error: errorMessage(error),
+          });
+        }
+      }
+    }
+
+    const timer = setTimeout(() => void search(), input.query.trim() ? FILE_SEARCH_DEBOUNCE_MS : 0);
+
+    return () => {
+      cancelled = true;
+      clearTimeout(timer);
+    };
+  }, [client, cwd, input.query, requestKey, sourceKey]);
+
+  const openFile = useCallback(
+    (path: string) => {
+      if (!serverId || !workspaceId) return;
+      clearCommandCenterFocusRestoreElement();
+      openWorkspaceFileFromExplorer({
+        filePath: path,
+        persistenceKey: buildWorkspaceTabPersistenceKey({ serverId, workspaceId }),
+        showMobileAgent: usePanelStore.getState().showMobileAgent,
+        openWorkspaceTabFocused: useWorkspaceLayoutStore.getState().openTabFocused,
+        focusWorkspaceTab: useWorkspaceLayoutStore.getState().focusTab,
+      });
+    },
+    [serverId, workspaceId],
+  );
+
+  return {
+    entries: requestKey && state.sourceKey === sourceKey ? state.entries : [],
+    loading: Boolean(requestKey) && (state.requestKey !== requestKey || state.loading),
+    error: state.requestKey === requestKey ? state.error : null,
+    openFile,
+  };
+}

packages/app/src/command-center/workspace-registration.tsx

@@ -6,7 +6,10 @@ import { supportsDesktopPaneSplits, useIsCompactFormFactor } from "@/constants/l
 import { GIT_ACTION_ICONS } from "@/git/action-icons";
 import { useGitActionRunner, useGitActions } from "@/git/use-actions";
 import { useKeyboardShortcutOverrides } from "@/hooks/use-keyboard-shortcut-overrides";
-import { resolveShortcutKeysForAction } from "@/keyboard/keyboard-shortcuts";
+import {
+  resolveShortcutKeysForAction,
+  type ShortcutOverrides,
+} from "@/keyboard/keyboard-shortcuts";
 import { keyboardActionDispatcher } from "@/keyboard/keyboard-action-dispatcher";
 import { useActiveWorkspaceSelection } from "@/stores/navigation-active-workspace-store";
 import { useWorkspaceDirectory } from "@/stores/session-store-hooks";
@@ -36,9 +39,7 @@ function staticIcon(element: ReactElement | undefined): CommandCenterIcon | unde
   return StaticIcon;
 }
 
-function resolveWorkspaceShortcuts(
-  overrides: Readonly<Record<string, string>>,
-): WorkspaceCommandCenterShortcuts {
+function resolveWorkspaceShortcuts(overrides: ShortcutOverrides): WorkspaceCommandCenterShortcuts {
   const platform = { isMac: getShortcutOs() === "mac", isDesktop: getIsElectron() };
   return {
     newAgent: resolveShortcutKeysForAction("workspace-tab-new", overrides, platform) ?? undefined,

packages/app/src/components/add-host-modal.tsx

@@ -1,10 +1,9 @@
-import { useCallback, useMemo, useReducer, useRef, useState } from "react";
+import { useCallback, useMemo, useReducer, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Alert, Pressable, Text, View } from "react-native";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import { useIsCompactFormFactor } from "@/constants/layout";
-import { getIsElectron, isNative } from "@/constants/platform";
-import { Check, ChevronDown, ChevronRight, Eye, EyeOff, Link2, Plus, X } from "lucide-react-native";
+import { Check, ChevronDown, ChevronRight, Eye, EyeOff, Link2 } from "lucide-react-native";
 import type { HostProfile } from "@/types/host-connection";
 import { useHosts, useHostMutations } from "@/runtime/host-runtime";
 import {
@@ -13,11 +12,6 @@ import {
   serializeConnectionUriForStorage,
 } from "@/utils/daemon-endpoints";
 import { DaemonConnectionTestError } from "@/utils/test-daemon-connection";
-import {
-  prepareConnectionHeaders,
-  type ConnectionHeaderDraft,
-  type ConnectionHeaderValidationIssue,
-} from "@/utils/connection-headers";
 import { AdaptiveModalSheet, AdaptiveTextInput, type SheetHeader } from "./adaptive-modal-sheet";
 import { Button } from "@/components/ui/button";
 
@@ -129,30 +123,6 @@ const styles = StyleSheet.create((theme) => ({
     fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
   },
-  advancedContent: {
-    gap: theme.spacing[4],
-  },
-  headerSection: {
-    gap: theme.spacing[2],
-  },
-  headerTitleRow: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    gap: theme.spacing[3],
-  },
-  headerList: {
-    gap: theme.spacing[2],
-  },
-  headerRow: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: theme.spacing[2],
-  },
-  headerInput: {
-    flex: 1,
-    minWidth: 0,
-  },
   actions: {
     flexDirection: "row",
     gap: theme.spacing[3],
@@ -211,94 +181,6 @@ function prepareDirectConnection(
   };
 }
 
-function headerIssueMessage(
-  issue: ConnectionHeaderValidationIssue,
-  t: ReturnType<typeof useTranslation>["t"],
-): string {
-  if (issue.type === "missingName") return t("pairing.direct.headers.errors.missingName");
-  if (issue.type === "invalidName") {
-    return t("pairing.direct.headers.errors.invalidName", { name: issue.name });
-  }
-  if (issue.type === "invalidValue") {
-    return t("pairing.direct.headers.errors.invalidValue", { name: issue.name });
-  }
-  return t("pairing.direct.headers.errors.duplicateName", { name: issue.name });
-}
-
-interface ConnectionHeaderRowProps {
-  draft: ConnectionHeaderDraft;
-  index: number;
-  disabled: boolean;
-  placeholderTextColor: string;
-  iconColor: string;
-  onUpdate: (id: number, field: "name" | "value", value: string) => void;
-  onRemove: (id: number) => void;
-}
-
-function ConnectionHeaderRow({
-  draft,
-  index,
-  disabled,
-  placeholderTextColor,
-  iconColor,
-  onUpdate,
-  onRemove,
-}: ConnectionHeaderRowProps) {
-  const { t } = useTranslation();
-  const handleNameChange = useCallback(
-    (value: string) => onUpdate(draft.id, "name", value),
-    [draft.id, onUpdate],
-  );
-  const handleValueChange = useCallback(
-    (value: string) => onUpdate(draft.id, "value", value),
-    [draft.id, onUpdate],
-  );
-  const handleRemove = useCallback(() => onRemove(draft.id), [draft.id, onRemove]);
-
-  return (
-    <View style={styles.headerRow}>
-      <AdaptiveTextInput
-        testID={`direct-header-name-${index}`}
-        nativeID={`direct-header-name-${draft.id}`}
-        accessibilityLabel={t("pairing.direct.headers.name")}
-        initialValue={draft.name}
-        value={draft.name}
-        onChangeText={handleNameChange}
-        placeholder={t("pairing.direct.headers.name")}
-        placeholderTextColor={placeholderTextColor}
-        style={[styles.input, styles.headerInput]}
-        autoCapitalize="none"
-        autoCorrect={false}
-        editable={!disabled}
-      />
-      <AdaptiveTextInput
-        testID={`direct-header-value-${index}`}
-        nativeID={`direct-header-value-${draft.id}`}
-        accessibilityLabel={t("pairing.direct.headers.value")}
-        initialValue={draft.value}
-        value={draft.value}
-        onChangeText={handleValueChange}
-        placeholder={t("pairing.direct.headers.value")}
-        placeholderTextColor={placeholderTextColor}
-        style={[styles.input, styles.headerInput]}
-        autoCapitalize="none"
-        autoCorrect={false}
-        editable={!disabled}
-      />
-      <Pressable
-        style={styles.iconButton}
-        onPress={handleRemove}
-        disabled={disabled}
-        accessibilityRole="button"
-        accessibilityLabel={t("pairing.direct.headers.remove")}
-        testID={`direct-header-remove-${index}`}
-      >
-        <X size={18} color={iconColor} />
-      </Pressable>
-    </View>
-  );
-}
-
 function draftFromConnectionUri(uri: string): DirectConnectionDraft {
   const parsed = parseConnectionUri(uri);
   return {
@@ -423,8 +305,6 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
   const [isPasswordVisible, setIsPasswordVisible] = useState(false);
   const [isAdvancedOpen, setIsAdvancedOpen] = useState(false);
   const [advancedUri, setAdvancedUri] = useState("");
-  const [headerDrafts, setHeaderDrafts] = useState<ConnectionHeaderDraft[]>([]);
-  const nextHeaderId = useRef(1);
   const [inputResetKey, bumpInputResetKey] = useReducer((key: number) => key + 1, 0);
 
   const clearInput = useCallback(() => {
@@ -435,8 +315,6 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
     setIsPasswordVisible(false);
     setIsAdvancedOpen(false);
     setAdvancedUri("");
-    setHeaderDrafts([]);
-    nextHeaderId.current = 1;
     bumpInputResetKey();
   }, []);
 
@@ -491,18 +369,11 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
     if (isSaving) return;
 
     let connection: PreparedDirectConnection;
-    let headers: Record<string, string> | undefined;
     try {
       connection = prepareDirectConnection(
         { host, port, useTls, password },
         directConnectionLabels,
       );
-      const preparedHeaders = prepareConnectionHeaders(headerDrafts);
-      if (preparedHeaders.issue) {
-        setErrorMessage(headerIssueMessage(preparedHeaders.issue, t));
-        return;
-      }
-      headers = preparedHeaders.headers;
     } catch (error) {
       const message =
         error instanceof Error ? error.message : directConnectionLabels.invalidConnection;
@@ -518,7 +389,6 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
         endpoint: connection.endpoint,
         useTls: connection.useTls,
         ...(connection.password ? { password: connection.password } : {}),
-        ...(headers ? { headers } : {}),
       });
       const isNewHost = !daemons.some((daemon) => daemon.serverId === serverId);
 
@@ -555,7 +425,6 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
     daemons,
     directConnectionLabels,
     handleClose,
-    headerDrafts,
     host,
     isMobile,
     isSaving,
@@ -584,22 +453,6 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
     setIsPasswordVisible((current) => !current);
   }, []);
 
-  const handleAddHeader = useCallback(() => {
-    const id = nextHeaderId.current;
-    nextHeaderId.current += 1;
-    setHeaderDrafts((current) => [...current, { id, name: "", value: "" }]);
-  }, []);
-
-  const handleUpdateHeader = useCallback((id: number, field: "name" | "value", value: string) => {
-    setHeaderDrafts((current) =>
-      current.map((draft) => (draft.id === id ? { ...draft, [field]: value } : draft)),
-    );
-  }, []);
-
-  const handleRemoveHeader = useCallback((id: number) => {
-    setHeaderDrafts((current) => current.filter((draft) => draft.id !== id));
-  }, []);
-
   const handleToggleAdvanced = useCallback(() => {
     if (!isAdvancedOpen) {
       try {
@@ -756,58 +609,24 @@ export function AddHostModal({ visible, onClose, onCancel, onSaved }: AddHostMod
           <Text style={styles.advancedText}>{t("pairing.direct.advanced.label")}</Text>
         </Pressable>
         {isAdvancedOpen ? (
-          <View style={styles.advancedContent}>
-            <AdaptiveTextInput
-              testID="direct-host-uri-input"
-              nativeID="direct-host-uri-input"
-              accessibilityLabel={t("pairing.direct.fields.connectionUri")}
-              initialValue={advancedUri}
-              resetKey={`direct-host-uri-${inputResetKey}`}
-              value={advancedUri}
-              onChangeText={setAdvancedUri}
-              placeholder="tcp://localhost:6767?ssl=true"
-              placeholderTextColor={theme.colors.foregroundMuted}
-              style={styles.input}
-              autoCapitalize="none"
-              autoCorrect={false}
-              keyboardType="url"
-              editable={!isSaving}
-              returnKeyType="done"
-              onSubmitEditing={handleToggleAdvanced}
-            />
-
-            {isNative || getIsElectron() ? (
-              <View style={styles.headerSection}>
-                <View style={styles.headerTitleRow}>
-                  <Text style={styles.label}>{t("pairing.direct.headers.title")}</Text>
-                  <Button
-                    variant="ghost"
-                    size="sm"
-                    leftIcon={Plus}
-                    onPress={handleAddHeader}
-                    disabled={isSaving}
-                    testID="direct-header-add"
-                  >
-                    {t("pairing.direct.headers.add")}
-                  </Button>
-                </View>
-                <View style={styles.headerList}>
-                  {headerDrafts.map((draft, index) => (
-                    <ConnectionHeaderRow
-                      key={draft.id}
-                      draft={draft}
-                      index={index}
-                      disabled={isSaving}
-                      placeholderTextColor={theme.colors.foregroundMuted}
-                      iconColor={theme.colors.foregroundMuted}
-                      onUpdate={handleUpdateHeader}
-                      onRemove={handleRemoveHeader}
-                    />
-                  ))}
-                </View>
-              </View>
-            ) : null}
-          </View>
+          <AdaptiveTextInput
+            testID="direct-host-uri-input"
+            nativeID="direct-host-uri-input"
+            accessibilityLabel={t("pairing.direct.fields.connectionUri")}
+            initialValue={advancedUri}
+            resetKey={`direct-host-uri-${inputResetKey}`}
+            value={advancedUri}
+            onChangeText={setAdvancedUri}
+            placeholder="tcp://localhost:6767?ssl=true"
+            placeholderTextColor={theme.colors.foregroundMuted}
+            style={styles.input}
+            autoCapitalize="none"
+            autoCorrect={false}
+            keyboardType="url"
+            editable={!isSaving}
+            returnKeyType="done"
+            onSubmitEditing={handleToggleAdvanced}
+          />
         ) : null}
         {errorMessage ? <Text style={styles.error}>{errorMessage}</Text> : null}
       </View>

packages/app/src/components/add-project-flow.tsx

@@ -69,7 +69,7 @@ import {
 import { Shortcut } from "@/components/ui/shortcut";
 import { useKeyboardShortcutsAvailable } from "@/keyboard/availability";
 import { getIsElectronRuntime } from "@/constants/layout";
-import { isWeb } from "@/constants/platform";
+import { isNative, isWeb } from "@/constants/platform";
 import { pickDirectory } from "@/desktop/pick-directory";
 import { useFetchQuery } from "@/data/query";
 import { getOpenProjectFailureReason, registerProjectDescriptor } from "@/hooks/open-project";
@@ -222,12 +222,12 @@ function pageTitle(page: AddProjectPage): string {
   }
 }
 
-function pagePlaceholder(page: AddProjectPage): string {
+type AddProjectInputPage = Exclude<AddProjectPage, { kind: "method" }>;
+
+function pagePlaceholder(page: AddProjectInputPage): string {
   switch (page.kind) {
     case "host":
       return "Search hosts...";
-    case "method":
-      return "Search methods...";
     case "directory-search":
       return "Search directories or enter a path...";
     case "github-search":
@@ -240,7 +240,7 @@ function pagePlaceholder(page: AddProjectPage): string {
   }
 }
 
-function pageInput(page: AddProjectPage): string {
+function pageInput(page: AddProjectInputPage): string {
   return page.kind === "new-directory-name" ? page.name : page.query;
 }
 
@@ -374,7 +374,7 @@ export function AddProjectFlow({ request, onClose }: AddProjectFlowProps) {
   const inputRef = useRef<TextInput>(null);
   const submissionInFlightRef = useRef(false);
   const browseInFlightRef = useRef(false);
-  const query = page.kind === "new-directory-name" ? "" : page.query;
+  const query = page.kind === "new-directory-name" || page.kind === "method" ? "" : page.query;
   const [debouncedQuery, setDebouncedQuery] = useState(query);
 
   useEffect(() => {
@@ -599,23 +599,15 @@ export function AddProjectFlow({ request, onClose }: AddProjectFlowProps) {
     }
     if (page.kind === "method") {
       if (!host) return [];
-      const normalized = page.query.trim().toLowerCase();
-      return buildAddProjectMethods(host)
-        .filter(
-          (method) =>
-            !normalized ||
-            method.label.toLowerCase().includes(normalized) ||
-            method.description.toLowerCase().includes(normalized),
-        )
-        .map((method) => ({
-          id: method.id,
-          title: method.label,
-          subtitle: method.description,
-          icon: methodIcon(method.id),
-          disabled: method.disabled,
-          testID: `add-project-flow-method-${method.id}`,
-          select: () => selectMethod(method.id),
-        }));
+      return buildAddProjectMethods(host).map((method) => ({
+        id: method.id,
+        title: method.label,
+        subtitle: method.description,
+        icon: methodIcon(method.id),
+        disabled: method.disabled,
+        testID: `add-project-flow-method-${method.id}`,
+        select: () => selectMethod(method.id),
+      }));
     }
     if (page.kind === "directory-search") {
       return pathOptions.map((option) => {
@@ -863,21 +855,41 @@ export function AddProjectFlow({ request, onClose }: AddProjectFlowProps) {
                 ) : null}
               </View>
             </View>
-            <ThemedTextInput
-              key={page.kind}
-              ref={inputRef}
-              value={pageInput(page)}
-              onChangeText={handleInputChange}
-              onKeyPress={isWeb ? undefined : handleNativeKeyPress}
-              onSubmitEditing={isWeb ? undefined : submitActive}
-              placeholder={pagePlaceholder(page)}
-              style={styles.input}
-              autoCapitalize="none"
-              autoCorrect={false}
-              editable={!isSubmitting}
-              returnKeyType="go"
-              testID="add-project-flow-input"
-            />
+            {page.kind === "method" && isNative ? (
+              // Native hardware-keyboard events need a focused responder even without a visible field.
+              <TextInput
+                key={page.kind}
+                ref={inputRef}
+                onKeyPress={handleNativeKeyPress}
+                onSubmitEditing={submitActive}
+                showSoftInputOnFocus={false}
+                caretHidden
+                contextMenuHidden
+                accessible={false}
+                accessibilityElementsHidden
+                importantForAccessibility="no-hide-descendants"
+                pointerEvents="none"
+                style={styles.keyboardCapture}
+                testID="add-project-flow-keyboard-capture"
+              />
+            ) : null}
+            {page.kind !== "method" ? (
+              <ThemedTextInput
+                key={page.kind}
+                ref={inputRef}
+                value={pageInput(page)}
+                onChangeText={handleInputChange}
+                onKeyPress={isWeb ? undefined : handleNativeKeyPress}
+                onSubmitEditing={isWeb ? undefined : submitActive}
+                placeholder={pagePlaceholder(page)}
+                style={styles.input}
+                autoCapitalize="none"
+                autoCorrect={false}
+                editable={!isSubmitting}
+                returnKeyType="go"
+                testID="add-project-flow-input"
+              />
+            ) : null}
           </View>
           <ScrollView
             style={styles.results}
@@ -1012,6 +1024,12 @@ const styles = StyleSheet.create((theme) => ({
     paddingVertical: theme.spacing[1],
     outlineStyle: "none",
   } as object,
+  keyboardCapture: {
+    position: "absolute",
+    width: 1,
+    height: 1,
+    opacity: 0,
+  },
   results: { flexGrow: 0, flexShrink: 1, minHeight: 0 },
   resultsContent: { paddingVertical: theme.spacing[2] },
   row: {

packages/app/src/components/agent-status-dot.tsx

@@ -7,6 +7,7 @@ import {
 } from "@getpaseo/protocol/agent-lifecycle";
 import { deriveSidebarStateBucket } from "@/utils/sidebar-agent-state";
 import { getStatusDotColor } from "@/utils/status-dot-color";
+import { STATUS_INDICATOR_FILLED_DOT_SIZE } from "@/utils/status-indicator-geometry";
 
 export function AgentStatusDot({
   status,
@@ -56,8 +57,8 @@ function isAgentLifecycleStatus(value: string): value is AgentLifecycleStatus {
 
 const styles = StyleSheet.create((theme) => ({
   dot: {
-    width: 8,
-    height: 8,
+    width: STATUS_INDICATOR_FILLED_DOT_SIZE,
+    height: STATUS_INDICATOR_FILLED_DOT_SIZE,
     borderRadius: theme.borderRadius.full,
   },
 }));

packages/app/src/components/explorer-sidebar.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useRef } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
   View,
   Text,
@@ -8,6 +8,7 @@ import {
 } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 import Animated, { useAnimatedStyle, useSharedValue, runOnJS } from "react-native-reanimated";
+import { scheduleOnRN } from "react-native-worklets";
 import { Gesture } from "react-native-gesture-handler";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import { X } from "lucide-react-native";
@@ -36,6 +37,10 @@ import { RetainedPanelActivity } from "@/components/retained-panel";
 import { SidebarResizeHandle } from "@/components/sidebar-resize-handle";
 import { buildWorkspaceAttachmentScopeKey } from "@/attachments/workspace-attachments-store";
 import { resolveDesktopExplorerWidth } from "@/components/desktop-sidebar-layout";
+import {
+  SIDEBAR_RESIZE_ACTIVATION_OFFSET,
+  SIDEBAR_RESIZE_FAIL_OFFSET,
+} from "@/components/sidebar-resize-handle-layout";
 import { useWorkspaceLayoutStore } from "@/stores/workspace-layout-store";
 import { buildWorkspaceTabPersistenceKey } from "@/workspace-tabs/model";
 import { resolveFocusedChatTarget } from "@/composer/focused-chat-target";
@@ -167,6 +172,9 @@ export function ExplorerSidebar({
   });
   const startWidthRef = useRef(visibleExplorerWidth);
   const resizeWidth = useSharedValue(visibleExplorerWidth);
+  const [resizePressed, setResizePressed] = useState(false);
+  const showResizeGrip = useCallback(() => setResizePressed(true), []);
+  const hideResizeGrip = useCallback(() => setResizePressed(false), []);
 
   useEffect(() => {
     resizeWidth.value = visibleExplorerWidth;
@@ -185,8 +193,15 @@ export function ExplorerSidebar({
       Gesture.Pan()
         .enabled(true)
         .hitSlop({ left: 8, right: 8, top: 0, bottom: 0 })
-        .onStart(() => {
-          startWidthRef.current = visibleExplorerWidth;
+        .onBegin(() => {
+          scheduleOnRN(showResizeGrip);
+        })
+        // See the left sidebar's gesture: horizontal intent only, with the start
+        // width anchored to the activation translation so the threshold is free.
+        .activeOffsetX([-SIDEBAR_RESIZE_ACTIVATION_OFFSET, SIDEBAR_RESIZE_ACTIVATION_OFFSET])
+        .failOffsetY([-SIDEBAR_RESIZE_FAIL_OFFSET, SIDEBAR_RESIZE_FAIL_OFFSET])
+        .onStart((event) => {
+          startWidthRef.current = visibleExplorerWidth + event.translationX;
           resizeWidth.value = visibleExplorerWidth;
         })
         .onUpdate((event) => {
@@ -198,8 +213,18 @@ export function ExplorerSidebar({
         })
         .onEnd(() => {
           runOnJS(setExplorerWidth)(resizeWidth.value);
+        })
+        .onFinalize(() => {
+          scheduleOnRN(hideResizeGrip);
         }),
-    [resizeWidth, setExplorerWidth, viewportWidth, visibleExplorerWidth],
+    [
+      hideResizeGrip,
+      resizeWidth,
+      setExplorerWidth,
+      showResizeGrip,
+      viewportWidth,
+      visibleExplorerWidth,
+    ],
   );
 
   const resizeAnimatedStyle = useAnimatedStyle(() => ({
@@ -220,6 +245,7 @@ export function ExplorerSidebar({
         <SidebarResizeHandle
           edge="left"
           gesture={resizeGesture}
+          pressed={resizePressed}
           testID="explorer-sidebar-resize-handle"
         />
 

packages/app/src/components/keyboard-shortcuts-dialog.tsx

@@ -6,33 +6,16 @@ import { getIsElectronRuntime } from "@/constants/layout";
 import { AdaptiveModalSheet, type SheetHeader } from "@/components/adaptive-modal-sheet";
 import { Shortcut } from "@/components/ui/shortcut";
 import { useKeyboardShortcutsStore } from "@/stores/keyboard-shortcuts-store";
-import { formatShortcut } from "@/utils/format-shortcut";
 import { getShortcutOs } from "@/utils/shortcut-platform";
-import { buildKeyboardShortcutHelpSections } from "@/keyboard/keyboard-shortcuts";
+import {
+  buildEffectiveBindings,
+  buildKeyboardShortcutHelpSections,
+} from "@/keyboard/keyboard-shortcuts";
+import { filterShortcutHelpSections } from "@/keyboard/shortcut-help-search";
+import { useKeyboardShortcutOverrides } from "@/hooks/use-keyboard-shortcut-overrides";
 
 const SNAP_POINTS: string[] = ["70%", "92%"];
 
-function shortcutSearchAliases(keys: string[], shortcutOs: "mac" | "non-mac"): string {
-  const aliases = keys.map((key) => {
-    if (shortcutOs === "mac") {
-      if (key === "mod" || key === "meta") return ["cmd", "command"];
-      if (key === "alt") return ["alt", "option"];
-    } else {
-      if (key === "mod" || key === "ctrl") return ["ctrl", "control"];
-      if (key === "meta") return ["win", "windows"];
-    }
-    return [key];
-  });
-  const combinations = aliases.reduce<string[][]>(
-    (prefixes, choices) =>
-      prefixes.flatMap((prefix) => choices.map((choice) => [...prefix, choice])),
-    [[]],
-  );
-  return combinations
-    .flatMap((combination) => [combination.join(" "), combination.join("+")])
-    .join(" ");
-}
-
 export function KeyboardShortcutsDialog() {
   const { t } = useTranslation();
   const open = useKeyboardShortcutsStore((s) => s.shortcutsDialogOpen);
@@ -42,37 +25,18 @@ export function KeyboardShortcutsDialog() {
   const shortcutOs = getShortcutOs();
   const isMac = shortcutOs === "mac";
   const isDesktopApp = getIsElectronRuntime();
+  const { overrides } = useKeyboardShortcutOverrides();
+  // Effective bindings, so a shortcut the user unassigned lists no keys here
+  // instead of advertising a default that no longer fires.
+  const bindings = useMemo(() => buildEffectiveBindings(overrides), [overrides]);
   const sections = useMemo(
-    () => buildKeyboardShortcutHelpSections({ isMac, isDesktop: isDesktopApp }),
-    [isDesktopApp, isMac],
+    () => buildKeyboardShortcutHelpSections({ isMac, isDesktop: isDesktopApp }, bindings),
+    [bindings, isDesktopApp, isMac],
+  );
+  const visibleSections = useMemo(
+    () => filterShortcutHelpSections({ sections, query, translate: t, shortcutOs }),
+    [query, sections, shortcutOs, t],
   );
-  const visibleSections = useMemo(() => {
-    const normalizedQuery = query.trim().toLocaleLowerCase();
-    if (!normalizedQuery) return sections;
-
-    return sections.flatMap((section) => {
-      const sectionTitle = t(section.titleKey);
-      if (sectionTitle.toLocaleLowerCase().includes(normalizedQuery)) {
-        return [section];
-      }
-
-      const rows = section.rows.filter((row) => {
-        const searchText = [
-          t(row.labelKey),
-          row.noteKey ? t(row.noteKey) : row.note,
-          row.keys.join(" "),
-          formatShortcut(row.keys, shortcutOs),
-          shortcutSearchAliases(row.keys, shortcutOs),
-        ]
-          .filter(Boolean)
-          .join(" ")
-          .toLocaleLowerCase();
-        return searchText.includes(normalizedQuery);
-      });
-
-      return rows.length > 0 ? [{ ...section, rows }] : [];
-    });
-  }, [query, sections, shortcutOs, t]);
 
   useEffect(() => {
     if (!open) setQuery("");
@@ -106,14 +70,18 @@ export function KeyboardShortcutsDialog() {
             <Text style={styles.sectionTitle}>{t(section.titleKey)}</Text>
             <View style={styles.rows}>
               {section.rows.map((row) => (
-                <View key={row.id} style={styles.row}>
+                <View key={row.id} style={styles.row} testID={`shortcut-help-row-${row.id}`}>
                   <View style={styles.rowText}>
                     <Text style={styles.rowLabel}>{t(row.labelKey)}</Text>
                     {row.note ? (
                       <Text style={styles.rowNote}>{row.noteKey ? t(row.noteKey) : row.note}</Text>
                     ) : null}
                   </View>
-                  <Shortcut keys={row.keys} style={styles.rowShortcut} />
+                  {row.chord === null ? (
+                    <Text style={styles.rowUnassigned}>{t("settings.shortcuts.unassigned")}</Text>
+                  ) : (
+                    <Shortcut chord={row.chord} style={styles.rowShortcut} />
+                  )}
                 </View>
               ))}
             </View>
@@ -171,6 +139,13 @@ const styles = StyleSheet.create((theme) => ({
   rowShortcut: {
     alignSelf: "flex-start",
   },
+  // Matches the settings row's unassigned label, so the two screens describe the
+  // same state the same way.
+  rowUnassigned: {
+    alignSelf: "flex-start",
+    fontSize: theme.fontSize.sm,
+    color: theme.colors.foregroundMuted,
+  },
   empty: {
     paddingVertical: theme.spacing[6],
     textAlign: "center",

packages/app/src/components/left-sidebar.tsx

@@ -22,10 +22,15 @@ import {
 } from "react-native";
 import { Gesture } from "react-native-gesture-handler";
 import Animated, { runOnJS, useAnimatedStyle, useSharedValue } from "react-native-reanimated";
+import { scheduleOnRN } from "react-native-worklets";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import { TitlebarDragRegion } from "@/components/desktop/titlebar-drag-region";
 import { resolveDesktopSidebarWidth } from "@/components/desktop-sidebar-layout";
+import {
+  SIDEBAR_RESIZE_ACTIVATION_OFFSET,
+  SIDEBAR_RESIZE_FAIL_OFFSET,
+} from "@/components/sidebar-resize-handle-layout";
 import { HostPicker } from "@/components/hosts/host-picker";
 import { SidebarHeaderRow } from "@/components/sidebar/sidebar-header-row";
 import { SidebarDisplayPreferencesMenu } from "@/components/sidebar/display-preferences/menu";
@@ -771,6 +776,9 @@ function DesktopSidebar({
 
   const startWidthRef = useRef(visibleSidebarWidth);
   const resizeWidth = useSharedValue(visibleSidebarWidth);
+  const [resizePressed, setResizePressed] = useState(false);
+  const showResizeGrip = useCallback(() => setResizePressed(true), []);
+  const hideResizeGrip = useCallback(() => setResizePressed(false), []);
 
   useEffect(() => {
     resizeWidth.value = visibleSidebarWidth;
@@ -780,8 +788,16 @@ function DesktopSidebar({
     () =>
       Gesture.Pan()
         .hitSlop({ left: 8, right: 8, top: 0, bottom: 0 })
-        .onStart(() => {
-          startWidthRef.current = visibleSidebarWidth;
+        .onBegin(() => {
+          scheduleOnRN(showResizeGrip);
+        })
+        // Horizontal intent only, so a finger dragging down the touch grip scrolls
+        // the workspace list instead of resizing. Anchoring the start width to the
+        // activation translation keeps the extra threshold from jumping the edge.
+        .activeOffsetX([-SIDEBAR_RESIZE_ACTIVATION_OFFSET, SIDEBAR_RESIZE_ACTIVATION_OFFSET])
+        .failOffsetY([-SIDEBAR_RESIZE_FAIL_OFFSET, SIDEBAR_RESIZE_FAIL_OFFSET])
+        .onStart((event) => {
+          startWidthRef.current = visibleSidebarWidth - event.translationX;
           resizeWidth.value = visibleSidebarWidth;
         })
         .onUpdate((event) => {
@@ -794,8 +810,18 @@ function DesktopSidebar({
         })
         .onEnd(() => {
           runOnJS(setSidebarWidth)(resizeWidth.value);
+        })
+        .onFinalize(() => {
+          scheduleOnRN(hideResizeGrip);
         }),
-    [resizeWidth, setSidebarWidth, viewportWidth, visibleSidebarWidth],
+    [
+      hideResizeGrip,
+      resizeWidth,
+      setSidebarWidth,
+      showResizeGrip,
+      viewportWidth,
+      visibleSidebarWidth,
+    ],
   );
 
   const resizeAnimatedStyle = useAnimatedStyle(() => ({
@@ -894,6 +920,7 @@ function DesktopSidebar({
         <SidebarResizeHandle
           edge="right"
           gesture={resizeGesture}
+          pressed={resizePressed}
           testID="left-sidebar-resize-handle"
         />
       </View>

packages/app/src/components/markdown/renderer.tsx

@@ -22,7 +22,6 @@ import Markdown, {
   type RenderRules,
 } from "react-native-markdown-display";
 import { StyleSheet, withUnistyles } from "react-native-unistyles";
-import { AppearanceStyleBoundary } from "@/components/appearance-style-boundary";
 import { HighlightedCodeBlock } from "@/components/highlighted-code-block";
 import { MarkdownParagraphView, MarkdownTextSpan } from "@/components/markdown-text";
 import { MarkdownTableCellText } from "@/components/markdown-text-selection";
@@ -110,11 +109,7 @@ export function MarkdownRenderer({
     ],
   );
 
-  return (
-    <AppearanceStyleBoundary>
-      <MarkdownPartList parts={parts} rendererProps={rendererProps} />
-    </AppearanceStyleBoundary>
-  );
+  return <MarkdownPartList parts={parts} rendererProps={rendererProps} />;
 }
 
 type MarkdownPartRendererProps = Omit<MarkdownRendererProps, "text" | "enableHtmlish"> & {

packages/app/src/components/message.tsx

@@ -1806,7 +1806,7 @@ export const AssistantMessage = memo(function AssistantMessage({
 
         return (
           <View key={node.key} style={styles.list_item} dataSet={markdownCopyDataSet.li}>
-            <Text style={iconStyle} dataSet={markdownCopyDataSet.ignore}>
+            <Text style={iconStyle} dataSet={markdownCopyDataSet.listMarker}>
               {marker}
             </Text>
             <MarkdownListItemContent contentStyle={contentStyle}>

packages/app/src/components/project-icon-image.tsx

@@ -0,0 +1,55 @@
+import { Buffer } from "buffer";
+import { type ReactElement, useMemo } from "react";
+import { Image, type ImageStyle, type StyleProp, View } from "react-native";
+import { SvgCss } from "react-native-svg/css";
+
+const SVG_MIME_TYPE = "image/svg+xml";
+const ICO_MIME_TYPES = new Set(["image/x-icon", "image/vnd.microsoft.icon"]);
+const SVG_CONTAINER = { overflow: "hidden" } as const;
+
+export interface ProjectIconImageProps {
+  dataUri: string;
+  fallback: ReactElement;
+  style: StyleProp<ImageStyle>;
+}
+
+function parseDataUri(dataUri: string): { mimeType: string; payload: string } | null {
+  const match = /^data:([^;,]+);base64,(.*)$/s.exec(dataUri);
+  if (!match) return null;
+
+  const [, mimeType, payload] = match;
+  return mimeType && payload ? { mimeType: mimeType.toLowerCase(), payload } : null;
+}
+
+function ignoreSvgParseError() {
+  // Invalid repository SVGs use the same fallback as unsupported icon formats.
+}
+
+export function ProjectIconImage({ dataUri, fallback, style }: ProjectIconImageProps) {
+  const source = useMemo(() => ({ uri: dataUri }), [dataUri]);
+  const parts = useMemo(() => parseDataUri(dataUri), [dataUri]);
+  const svgXml = useMemo(
+    () =>
+      parts?.mimeType === SVG_MIME_TYPE
+        ? Buffer.from(parts.payload, "base64").toString("utf8")
+        : null,
+    [parts],
+  );
+  const svgContainerStyle = useMemo(() => [style, SVG_CONTAINER], [style]);
+
+  if (svgXml) {
+    return (
+      <View style={svgContainerStyle}>
+        <SvgCss
+          xml={svgXml}
+          width="100%"
+          height="100%"
+          fallback={fallback}
+          onError={ignoreSvgParseError}
+        />
+      </View>
+    );
+  }
+  if (parts && ICO_MIME_TYPES.has(parts.mimeType)) return fallback;
+  return <Image source={source} style={style} />;
+}

packages/app/src/components/project-icon-image.web.tsx

@@ -0,0 +1,8 @@
+import { useMemo } from "react";
+import { Image } from "react-native";
+import type { ProjectIconImageProps } from "@/components/project-icon-image";
+
+export function ProjectIconImage({ dataUri, style }: ProjectIconImageProps) {
+  const source = useMemo(() => ({ uri: dataUri }), [dataUri]);
+  return <Image source={source} style={style} />;
+}

packages/app/src/components/project-icon-view.tsx

@@ -1,5 +1,6 @@
 import { useMemo } from "react";
-import { Image, type StyleProp, Text, type TextStyle, View } from "react-native";
+import { type StyleProp, Text, type TextStyle, View } from "react-native";
+import { ProjectIconImage } from "@/components/project-icon-image";
 import { deriveIdentityColorName, identityColor } from "@/styles/identity-colors";
 
 const WHITE_TEXT = { color: "#ffffff" } as const;
@@ -28,6 +29,7 @@ export function projectIconRadius(size: number): number {
  * width/height/radius/centering block, which is how the radius drifted apart in the first
  * place — pass a `size` and the shape follows.
  */
+
 export function ProjectIconView({
   iconDataUri,
   initial,
@@ -41,7 +43,6 @@ export function ProjectIconView({
   size: number;
   textStyle: StyleProp<TextStyle>;
 }) {
-  const imageSource = useMemo(() => ({ uri: iconDataUri ?? "" }), [iconDataUri]);
   // The uploaded image is sized but never clipped — see projectIconRadius.
   const box = useMemo(() => ({ width: size, height: size }), [size]);
   const fallbackStyles = useMemo(
@@ -55,12 +56,18 @@ export function ProjectIconView({
   );
   const textStyles = useMemo(() => [textStyle, WHITE_TEXT], [textStyle]);
 
-  if (iconDataUri) {
-    return <Image source={imageSource} style={box} />;
-  }
-  return (
-    <View style={fallbackStyles}>
-      <Text style={textStyles}>{initial}</Text>
-    </View>
+  const fallback = useMemo(
+    () => (
+      <View style={fallbackStyles}>
+        <Text style={textStyles}>{initial}</Text>
+      </View>
+    ),
+    [fallbackStyles, initial, textStyles],
+  );
+
+  return iconDataUri ? (
+    <ProjectIconImage dataUri={iconDataUri} fallback={fallback} style={box} />
+  ) : (
+    fallback
   );
 }

packages/app/src/components/root-error-boundary.test.tsx

@@ -0,0 +1,95 @@
+import React, { act } from "react";
+import { createRoot, type Root } from "react-dom/client";
+import { JSDOM } from "jsdom";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { RootErrorFallback } from "./root-error-boundary";
+
+const { runtime, theme } = vi.hoisted(() => ({
+  runtime: { breakpoint: "xs" },
+  theme: {
+    spacing: { 2: 8, 3: 12, 4: 16, 6: 24, 8: 32 },
+    borderWidth: { 1: 1 },
+    borderRadius: { md: 6, lg: 8, xl: 12 },
+    fontFamily: { ui: "system-ui", mono: "monospace" },
+    fontSize: { xs: 11, code: 12, sm: 13, base: 15, xl: 20 },
+    fontWeight: { normal: "400", medium: "500", semibold: "600" },
+    colors: {
+      accent: "#369",
+      accentForeground: "#fff",
+      border: "#333",
+      borderAccent: "#444",
+      destructive: "#c33",
+      foreground: "#fff",
+      foregroundMuted: "#aaa",
+      surface0: "#111",
+      surface1: "#181818",
+      surface2: "#222",
+      surface3: "#333",
+    },
+    opacity: { 50: 0.5 },
+  },
+}));
+
+vi.mock("react-native-unistyles", () => ({
+  StyleSheet: {
+    create: (factory: unknown) => (typeof factory === "function" ? factory(theme) : factory),
+  },
+  useUnistyles: () => ({ theme, rt: runtime }),
+  withUnistyles: (component: unknown) => component,
+}));
+
+vi.mock("react-native-safe-area-context", () => ({
+  useSafeAreaInsets: () => ({ top: 47, right: 3, bottom: 34, left: 5 }),
+}));
+
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: (key: string) => key }),
+}));
+
+let root: Root | null = null;
+
+beforeEach(() => {
+  const dom = new JSDOM("<!doctype html><html><body></body></html>");
+  vi.stubGlobal("React", React);
+  vi.stubGlobal("IS_REACT_ACT_ENVIRONMENT", true);
+  vi.stubGlobal("window", dom.window);
+  vi.stubGlobal("document", dom.window.document);
+  vi.stubGlobal("HTMLElement", dom.window.HTMLElement);
+  vi.stubGlobal("Node", dom.window.Node);
+  vi.stubGlobal("navigator", dom.window.navigator);
+
+  const container = document.createElement("div");
+  document.body.appendChild(container);
+  root = createRoot(container);
+});
+
+afterEach(() => {
+  act(() => root?.unmount());
+  root = null;
+  vi.unstubAllGlobals();
+});
+
+describe("RootErrorFallback", () => {
+  for (const breakpoint of ["xs", "lg"]) {
+    it(`keeps the safe-area header and retry action outside the scrollable details on ${breakpoint}`, () => {
+      runtime.breakpoint = breakpoint;
+      act(() => {
+        root?.render(<RootErrorFallback error={"failure\n".repeat(200)} onRetry={vi.fn()} />);
+      });
+
+      const screen = document.querySelector('[data-testid="root-error-boundary"]');
+      const header = document.querySelector('[data-testid="root-error-boundary-header"]');
+      const details = document.querySelector('[data-testid="root-error-boundary-details"]');
+      const retry = document.querySelector('[data-testid="root-error-boundary-retry"]');
+
+      expect(screen).not.toBeNull();
+      expect(header).not.toBeNull();
+      expect(details).not.toBeNull();
+      expect(retry).not.toBeNull();
+      expect(screen?.getAttribute("style")).toContain("padding: 47px 3px 34px 5px");
+      expect(details?.contains(header)).toBe(false);
+      expect(details?.contains(retry)).toBe(false);
+      expect(screen?.contains(retry)).toBe(true);
+    });
+  }
+});

packages/app/src/components/root-error-boundary.tsx

@@ -1,8 +1,11 @@
 import React, { Component, Fragment, type ErrorInfo, type ReactNode } from "react";
-import { Pressable, ScrollView, Text, View } from "react-native";
-import type { PressableStateCallbackType, StyleProp, ViewStyle } from "react-native";
+import { Text, View } from "react-native";
 import { useTranslation } from "react-i18next";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { StyleSheet } from "react-native-unistyles";
+import { Button } from "@/components/ui/button";
+import { ScrollableCodeSurface } from "@/components/ui/scrollable-code-surface";
+import { useIsCompactFormFactor } from "@/constants/layout";
 import { formatCaughtValue } from "./root-error-details";
 
 interface RootErrorBoundaryProps {
@@ -48,110 +51,113 @@ export class RootErrorBoundary extends Component<RootErrorBoundaryProps, RootErr
   }
 }
 
+// A stack trace is reference material, not the screen. Cap it so the message and
+// the retry action stay the shape of the page; the rest scrolls.
+const DETAILS_MAX_HEIGHT = 300;
+
 interface RootErrorFallbackProps {
   error: string;
   onRetry: () => void;
 }
 
-function RootErrorFallback({ error, onRetry }: RootErrorFallbackProps) {
+export function RootErrorFallback({ error, onRetry }: RootErrorFallbackProps) {
   const { t } = useTranslation();
+  const insets = useSafeAreaInsets();
+  const isCompact = useIsCompactFormFactor();
+
+  const retry = (
+    <Button variant="default" onPress={onRetry} testID="root-error-boundary-retry">
+      {t("common.actions.retry")}
+    </Button>
+  );
 
   return (
-    <ScrollView
-      style={styles.container}
-      contentContainerStyle={styles.contentContainer}
+    <View
+      style={[
+        styles.container,
+        {
+          paddingTop: insets.top,
+          paddingRight: insets.right,
+          paddingBottom: insets.bottom,
+          paddingLeft: insets.left,
+        },
+      ]}
       testID="root-error-boundary"
     >
       <View style={styles.content}>
-        <Text style={styles.kicker}>{t("rootError.kicker")}</Text>
-        <Text style={styles.title}>{t("rootError.title")}</Text>
-        <Text style={styles.body}>{t("rootError.body")}</Text>
-        <View style={styles.messageBox}>
-          <Text style={styles.messageLabel}>{t("rootError.details")}</Text>
-          <Text style={styles.message}>{error}</Text>
+        <View style={styles.header} testID="root-error-boundary-header">
+          <Text style={styles.title}>{t("rootError.title")}</Text>
+          <Text style={styles.body}>{t("rootError.body")}</Text>
         </View>
-        <Pressable
-          accessibilityRole="button"
-          onPress={onRetry}
-          style={retryButtonStyle}
-          testID="root-error-boundary-retry"
-        >
-          <Text style={styles.retryButtonText}>{t("common.actions.retry")}</Text>
-        </Pressable>
+        <View style={styles.details}>
+          <Text style={styles.detailsLabel}>{t("rootError.details")}</Text>
+          <ScrollableCodeSurface
+            maxHeight={isCompact ? undefined : DETAILS_MAX_HEIGHT}
+            style={styles.detailsSurface}
+            scrollStyle={styles.detailsScroll}
+            testID="root-error-boundary-details"
+          >
+            {error}
+          </ScrollableCodeSurface>
+        </View>
+        {isCompact ? null : retry}
       </View>
-    </ScrollView>
+      {isCompact ? <View style={styles.footer}>{retry}</View> : null}
+    </View>
   );
 }
 
-function retryButtonStyle({ pressed }: PressableStateCallbackType): StyleProp<ViewStyle> {
-  return [styles.retryButton, pressed ? styles.retryButtonPressed : null];
-}
-
 const styles = StyleSheet.create((theme) => ({
   container: {
     flex: 1,
     backgroundColor: theme.colors.surface0,
   },
-  contentContainer: {
-    flexGrow: 1,
+  content: {
+    flex: 1,
+    alignSelf: "center",
+    width: "100%",
+    maxWidth: 420,
     justifyContent: "center",
+    gap: theme.spacing[6],
     paddingHorizontal: theme.spacing[6],
     paddingVertical: theme.spacing[8],
   },
-  content: {
-    alignSelf: "center",
-    width: "100%",
-    maxWidth: 520,
-    gap: theme.spacing[4],
-  },
-  kicker: {
-    color: theme.colors.destructive,
-    fontSize: theme.fontSize.sm,
-    fontWeight: theme.fontWeight.semibold,
+  header: {
+    alignItems: "center",
+    gap: theme.spacing[2],
   },
   title: {
     color: theme.colors.foreground,
     fontSize: theme.fontSize.xl,
-    fontWeight: theme.fontWeight.semibold,
+    fontWeight: theme.fontWeight.medium,
+    textAlign: "center",
   },
   body: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.base,
-    lineHeight: 22,
-  },
-  messageBox: {
-    gap: theme.spacing[2],
-    borderWidth: 1,
-    borderColor: theme.colors.borderAccent,
-    borderRadius: theme.borderRadius.lg,
-    backgroundColor: theme.colors.surface1,
-    padding: theme.spacing[4],
-  },
-  messageLabel: {
-    color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
-    fontWeight: theme.fontWeight.semibold,
-  },
-  message: {
-    color: theme.colors.foreground,
     fontSize: theme.fontSize.sm,
     lineHeight: 20,
+    textAlign: "center",
   },
-  retryButton: {
-    alignSelf: "flex-start",
-    minHeight: 40,
-    justifyContent: "center",
-    borderRadius: theme.borderRadius.md,
-    backgroundColor: theme.colors.accent,
-    paddingHorizontal: theme.spacing[4],
-    paddingVertical: theme.spacing[2],
+  details: {
+    flexShrink: 1,
+    gap: theme.spacing[2],
   },
-  retryButtonPressed: {
-    opacity: 0.85,
+  detailsLabel: {
+    color: theme.colors.foregroundMuted,
+    fontSize: theme.fontSize.xs,
+    fontWeight: theme.fontWeight.medium,
   },
-  retryButtonText: {
-    color: theme.colors.accentForeground,
-    fontSize: theme.fontSize.sm,
-    fontWeight: theme.fontWeight.semibold,
+  detailsSurface: {
+    flexShrink: 1,
+  },
+  detailsScroll: {
+    flexShrink: 1,
+  },
+  footer: {
+    alignSelf: "center",
+    width: "100%",
+    maxWidth: 420,
+    paddingHorizontal: theme.spacing[6],
+    paddingBottom: theme.spacing[6],
   },
 }));

packages/app/src/components/sidebar-resize-handle-layout.test.ts

@@ -0,0 +1,21 @@
+import { describe, expect, it } from "vitest";
+import { resolveSidebarResizeHandleGeometry } from "./sidebar-resize-handle-layout";
+
+const MIN_TOUCH_TARGET = 24;
+
+describe("resolveSidebarResizeHandleGeometry", () => {
+  it("keeps the touch hit area inside the sidebar so native hit-testing reaches it", () => {
+    const geometry = resolveSidebarResizeHandleGeometry(false);
+
+    expect(geometry.edgeOffset).toBeGreaterThanOrEqual(0);
+    expect(geometry.width).toBeGreaterThanOrEqual(MIN_TOUCH_TARGET);
+    expect(geometry.height ?? 0).toBeGreaterThanOrEqual(MIN_TOUCH_TARGET);
+  });
+
+  it("straddles the border for a fine pointer", () => {
+    const geometry = resolveSidebarResizeHandleGeometry(true);
+
+    expect(geometry.edgeOffset).toBe(-geometry.width / 2);
+    expect(geometry.height).toBeNull();
+  });
+});

packages/app/src/components/sidebar-resize-handle-layout.ts

@@ -0,0 +1,57 @@
+/**
+ * Geometry for the sidebar resize handle.
+ *
+ * A mouse can grab a hairline, so the pointer variant straddles the sidebar
+ * border — half the strip hangs outside the sidebar's own bounds, which is
+ * fine because web hit-testing does not clip to the parent box.
+ *
+ * Native hit-testing does clip: iOS `hitTest:` returns nil for points outside a
+ * view's bounds and Gesture Handler's Android traversal only recurses into
+ * children whose ancestors contain the point. A strip hanging outside the
+ * sidebar is dead on touch, and what remains is far too small for a finger.
+ * So the touch variant sits fully inside the sidebar and is sized for a thumb.
+ */
+
+export const POINTER_HANDLE_WIDTH = 10;
+export const TOUCH_HANDLE_WIDTH = 24;
+export const TOUCH_HANDLE_HEIGHT = 88;
+
+/**
+ * A finger resting on the grip drifts before it commits. Requiring horizontal
+ * intent before the pan activates, and failing it once the drift is mostly
+ * vertical, leaves the sidebar's own scrolling reachable through the grip.
+ * A mouse press moves less than either threshold, so pointer drags are
+ * unaffected.
+ */
+export const SIDEBAR_RESIZE_ACTIVATION_OFFSET = 6;
+export const SIDEBAR_RESIZE_FAIL_OFFSET = 12;
+
+export type SidebarResizeEdge = "left" | "right";
+
+export interface SidebarResizeHandleGeometry {
+  /**
+   * Distance from the sidebar edge to the near side of the hit area. Negative
+   * means the hit area overhangs the sidebar, which only touch forbids.
+   */
+  edgeOffset: number;
+  width: number;
+  /** `null` stretches the hit area to the sidebar's full height. */
+  height: number | null;
+}
+
+export function resolveSidebarResizeHandleGeometry(
+  finePointer: boolean,
+): SidebarResizeHandleGeometry {
+  if (finePointer) {
+    return {
+      edgeOffset: -POINTER_HANDLE_WIDTH / 2,
+      width: POINTER_HANDLE_WIDTH,
+      height: null,
+    };
+  }
+  return {
+    edgeOffset: 0,
+    width: TOUCH_HANDLE_WIDTH,
+    height: TOUCH_HANDLE_HEIGHT,
+  };
+}

packages/app/src/components/sidebar-resize-handle.tsx

@@ -2,11 +2,17 @@ import { useCallback, useEffect, useRef, useState } from "react";
 import { Pressable, View } from "react-native";
 import { GestureDetector, type GestureType } from "react-native-gesture-handler";
 import { StyleSheet } from "react-native-unistyles";
+import {
+  resolveSidebarResizeHandleGeometry,
+  type SidebarResizeEdge,
+} from "@/components/sidebar-resize-handle-layout";
 import { isWeb } from "@/constants/platform";
+import { useHasFinePointer } from "@/hooks/use-fine-pointer";
 
 interface SidebarResizeHandleProps {
-  edge: "left" | "right";
+  edge: SidebarResizeEdge;
   gesture: GestureType;
+  pressed: boolean;
   testID: string;
 }
 
@@ -18,13 +24,29 @@ const webResizeCursorStyle = isWeb
     } as object)
   : null;
 
-export function SidebarResizeHandle({ edge, gesture, testID }: SidebarResizeHandleProps) {
+function edgeOffsetStyle(edge: SidebarResizeEdge, edgeOffset: number) {
+  return edge === "left" ? { left: edgeOffset } : { right: edgeOffset };
+}
+
+export function SidebarResizeHandle({ edge, gesture, pressed, testID }: SidebarResizeHandleProps) {
+  const finePointer = useHasFinePointer();
+
+  if (finePointer) {
+    return <PointerResizeHandle edge={edge} gesture={gesture} pressed={pressed} testID={testID} />;
+  }
+  return <TouchResizeHandle edge={edge} gesture={gesture} pressed={pressed} testID={testID} />;
+}
+
+function PointerResizeHandle({ edge, gesture, testID }: SidebarResizeHandleProps) {
   const [highlighted, setHighlighted] = useState(false);
   const highlightTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-  const hitAreaStyle =
-    edge === "left"
-      ? [styles.hitArea, styles.leftEdge, webResizeCursorStyle]
-      : [styles.hitArea, styles.rightEdge, webResizeCursorStyle];
+  const geometry = resolveSidebarResizeHandleGeometry(true);
+  const hitAreaStyle = [
+    styles.hitArea,
+    { width: geometry.width },
+    edgeOffsetStyle(edge, geometry.edgeOffset),
+    webResizeCursorStyle,
+  ];
 
   const cancelHighlightTimer = useCallback(() => {
     if (highlightTimerRef.current === null) return;
@@ -63,20 +85,49 @@ export function SidebarResizeHandle({ edge, gesture, testID }: SidebarResizeHand
   );
 }
 
+function TouchResizeHandle({ edge, gesture, pressed, testID }: SidebarResizeHandleProps) {
+  const geometry = resolveSidebarResizeHandleGeometry(false);
+  // `box-none` keeps the full-height column out of hit-testing so only the
+  // grab target steals taps from the rows behind it.
+  const layerStyle = [
+    styles.touchLayer,
+    { width: geometry.width },
+    edgeOffsetStyle(edge, geometry.edgeOffset),
+  ];
+  const targetStyle = [
+    styles.touchTarget,
+    { width: geometry.width, height: geometry.height ?? undefined },
+  ];
+  const gripStyle = [
+    styles.grip,
+    edge === "left" ? styles.leftEdgeGrip : styles.rightEdgeGrip,
+    pressed ? styles.visibleGrip : styles.hiddenGrip,
+  ];
+
+  return (
+    <View pointerEvents="box-none" style={layerStyle}>
+      <GestureDetector gesture={gesture}>
+        <View
+          testID={testID}
+          role="separator"
+          aria-orientation="vertical"
+          collapsable={false}
+          style={targetStyle}
+        >
+          <View pointerEvents="none" testID={`${testID}-grip`} style={gripStyle} />
+        </View>
+      </GestureDetector>
+    </View>
+  );
+}
+
 const styles = StyleSheet.create((theme) => ({
   hitArea: {
     position: "absolute",
     top: 0,
     bottom: 0,
-    width: 10,
     zIndex: 10,
   },
-  leftEdge: {
-    left: -5,
-  },
-  rightEdge: {
-    right: -5,
-  },
   highlight: {
     position: "absolute",
     top: 0,
@@ -86,4 +137,36 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.foreground,
     opacity: 0.25,
   },
+  touchLayer: {
+    position: "absolute",
+    top: 0,
+    bottom: 0,
+    zIndex: 10,
+    alignItems: "center",
+    justifyContent: "center",
+  },
+  touchTarget: {
+    alignItems: "center",
+    justifyContent: "center",
+  },
+  grip: {
+    width: 4,
+    height: 36,
+    borderRadius: 2,
+    backgroundColor: theme.colors.foreground,
+  },
+  hiddenGrip: {
+    opacity: 0,
+  },
+  visibleGrip: {
+    opacity: 0.3,
+  },
+  leftEdgeGrip: {
+    alignSelf: "flex-start",
+    marginLeft: theme.spacing[0.5],
+  },
+  rightEdgeGrip: {
+    alignSelf: "flex-end",
+    marginRight: theme.spacing[0.5],
+  },
 }));

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

@@ -376,18 +376,21 @@ function projectKebabStyle({
 
 function getProjectWorkspaceRowStyle({
   isDragging,
+  isPressed,
   selected,
   isHovered,
 }: {
   isDragging: boolean;
+  isPressed: boolean;
   selected: boolean;
   isHovered: boolean;
 }) {
   return [
     styles.workspaceRow,
-    isDragging && styles.workspaceRowDragging,
     selected && styles.sidebarRowSelected,
     isHovered && styles.workspaceRowHovered,
+    isDragging && styles.workspaceRowDragging,
+    isPressed && styles.workspaceRowPressed,
   ];
 }
 
@@ -871,6 +874,7 @@ function ProjectHeaderRow({
   dragHandleProps,
 }: ProjectHeaderRowProps) {
   const [isHovered, setIsHovered] = useState(false);
+  const [isPressed, setIsPressed] = useState(false);
   const [contextMenuOpen, setContextMenuOpen] = useState(false);
   const isMobileBreakpoint = useIsCompactFormFactor();
   const localDaemonServerId = useLocalDaemonServerId();
@@ -917,6 +921,17 @@ function ProjectHeaderRow({
     setContextMenuOpen(open);
     if (open) setIsHovered(false);
   }, []);
+  const handleProjectPressIn = useCallback(
+    (event: GestureResponderEvent) => {
+      setIsPressed(true);
+      interaction.handlePressIn(event);
+    },
+    [interaction],
+  );
+  const handleProjectPressOut = useCallback(() => {
+    setIsPressed(false);
+    interaction.handlePressOut();
+  }, [interaction]);
 
   const projectRowStyle = useCallback(
     ({ pressed }: PressableStateCallbackType) => [
@@ -937,7 +952,7 @@ function ProjectHeaderRow({
           iconDataUri={iconDataUri}
           statusBucket={statusBucket}
           projectViewKey={project.viewKey}
-          backdrop={getSidebarRowBackdrop({ isDragging, selected, isHovered })}
+          backdrop={getSidebarRowBackdrop({ isDragging, isPressed, selected, isHovered })}
           chevron={chevron}
           showChevron={isHovered && chevron !== null}
           isArchiving={isArchiving}
@@ -982,10 +997,10 @@ function ProjectHeaderRow({
         <PressHighlight
           accessibilityRole="button"
           style={projectRowStyle}
-          highlightStyle={styles.projectRowHovered}
-          onPressIn={interaction.handlePressIn}
+          highlightStyle={styles.projectRowPressed}
+          onPressIn={handleProjectPressIn}
           onTouchMove={interaction.handleTouchMove}
-          onPressOut={interaction.handlePressOut}
+          onPressOut={handleProjectPressOut}
           onPress={handlePress}
           testID={`sidebar-project-row-${project.viewKey}`}
         >
@@ -1008,10 +1023,10 @@ function ProjectHeaderRow({
           enabledOnMobile={false}
           accessibilityRole="button"
           style={projectRowStyle}
-          highlightStyle={styles.projectRowHovered}
-          onPressIn={interaction.handlePressIn}
+          highlightStyle={styles.projectRowPressed}
+          onPressIn={handleProjectPressIn}
           onTouchMove={interaction.handleTouchMove}
-          onPressOut={interaction.handlePressOut}
+          onPressOut={handleProjectPressOut}
           onPress={handlePress}
           testID={`sidebar-project-row-${project.viewKey}`}
         >
@@ -1064,6 +1079,7 @@ function WorkspaceRowInner({
   reserveIdleStatusIndicatorSpace = true,
 }: WorkspaceRowInnerProps) {
   const _isCompact = useIsCompactFormFactor();
+  const [isPressed, setIsPressed] = useState(false);
   const isTouchPlatform = platformIsNative;
   const interaction = useLongPressDragInteraction({
     drag,
@@ -1083,6 +1099,17 @@ function WorkspaceRowInner({
     }
     onPress();
   }, [interaction.didLongPressRef, onPress]);
+  const handleWorkspacePressIn = useCallback(
+    (event: GestureResponderEvent) => {
+      setIsPressed(true);
+      interaction.handlePressIn(event);
+    },
+    [interaction],
+  );
+  const handleWorkspacePressOut = useCallback(() => {
+    setIsPressed(false);
+    interaction.handlePressOut();
+  }, [interaction]);
 
   const accessibilityState = useMemo(() => ({ selected }), [selected]);
 
@@ -1093,6 +1120,7 @@ function WorkspaceRowInner({
         const serviceSummary = isDesktop ? selectWorkspaceServiceSummary(workspace.scripts) : null;
         const workspaceRowStyle = getProjectWorkspaceRowStyle({
           isDragging,
+          isPressed,
           selected,
           isHovered,
         });
@@ -1127,10 +1155,10 @@ function WorkspaceRowInner({
               accessibilityRole="button"
               accessibilityState={accessibilityState}
               style={workspaceRowStyle}
-              highlightStyle={styles.workspaceRowHovered}
-              onPressIn={interaction.handlePressIn}
+              highlightStyle={styles.workspaceRowPressed}
+              onPressIn={handleWorkspacePressIn}
               onTouchMove={interaction.handleTouchMove}
-              onPressOut={interaction.handlePressOut}
+              onPressOut={handleWorkspacePressOut}
               onPress={handlePress}
               testID={`sidebar-workspace-row-${workspace.workspaceKey}`}
             >
@@ -1140,7 +1168,7 @@ function WorkspaceRowInner({
                 leadingProjectName={leadingProjectName}
                 leadingProjectIconDataUri={leadingProjectIconDataUri}
                 serviceSummary={serviceSummary}
-                backdrop={getSidebarRowBackdrop({ isDragging, selected, isHovered })}
+                backdrop={getSidebarRowBackdrop({ isDragging, isPressed, selected, isHovered })}
                 isHovered={isHovered}
                 isLoading={isArchiving || isCreating}
                 isCreating={isCreating}

packages/app/src/components/sidebar/project-leading-visual.tsx

@@ -12,8 +12,13 @@ import {
 } from "@/utils/project-status-badge-content";
 import { projectIconPlaceholderLabelFromDisplayName } from "@/utils/project-display-name";
 import { getStatusDotColor } from "@/utils/status-dot-color";
-import { STATUS_INDICATOR_ALERT_SIZE } from "@/utils/status-indicator-geometry";
-import type { SurfaceBackdrop } from "@/styles/surface-backdrop";
+import {
+  STATUS_INDICATOR_ALERT_SIZE,
+  STATUS_INDICATOR_FILLED_DOT_SIZE,
+} from "@/utils/status-indicator-geometry";
+import { StatusRing } from "@/components/status-ring";
+import { getStatusRingOffset } from "@/components/status-ring/geometry";
+import type { SidebarSurfaceBackdrop } from "@/styles/surface-backdrop";
 
 // Every surfaced status shares one badge shell, so the badge never changes size or position
 // between states. Only the thing inside it changes.
@@ -29,7 +34,6 @@ const STATUS_BADGE_OFFSET = -4;
 //
 // The filled alert occupies the full badge shell so needs-input remains more prominent than
 // the passive status dots.
-const STATUS_BADGE_DOT_SIZE = 6;
 // Matches the workspace title's lineHeight (sidebar-workspace-row-content's
 // workspaceBranchText) so the icon centers on the title rather than floating above it.
 const LEADING_SLOT_HEIGHT = 20;
@@ -65,7 +69,7 @@ export function ProjectLeadingVisual({
   statusBucket: SidebarStateBucket | null;
   projectViewKey: string;
   /** The row's current background, so the status badge can knock out of it. */
-  backdrop: SurfaceBackdrop;
+  backdrop: SidebarSurfaceBackdrop;
   chevron?: "expand" | "collapse" | null;
   showChevron?: boolean;
   isArchiving?: boolean;
@@ -116,7 +120,7 @@ export function ProjectStatusIndicator({
   projectViewKey: string;
   statusBucket: SidebarStateBucket | null;
   /** The row's current background, so the status badge can knock out of it. */
-  backdrop: SurfaceBackdrop;
+  backdrop: SidebarSurfaceBackdrop;
   loading?: boolean;
   testID?: string;
 }) {
@@ -164,8 +168,23 @@ function ProjectStatusBadge({
 }: {
   content: ProjectStatusBadgeContent;
   statusBucket: SidebarStateBucket;
-  backdrop: SurfaceBackdrop;
+  backdrop: SidebarSurfaceBackdrop;
 }) {
+  // Running skips the shell. The ring is wider than the 12pt shell and carries its own knockout,
+  // so nesting it inside would clip it against the very thing that was meant to separate it from
+  // the icon. It anchors to the same corner instead, growing around the centre the dot had.
+  if (content.kind === "dot" && content.bucket === "running") {
+    return (
+      <View
+        role="status"
+        accessibilityLabel={STATUS_BUCKET_LABELS[statusBucket]}
+        style={styles.statusRingAnchor}
+        testID="project-status-badge"
+      >
+        <StatusRing backdrop={backdrop} />
+      </View>
+    );
+  }
   return (
     <View
       role="status"
@@ -182,14 +201,14 @@ function ProjectStatusBadge({
   );
 }
 
-function getStatusBadgeBackdropStyle(backdrop: SurfaceBackdrop): ViewStyle {
+function getStatusBadgeBackdropStyle(backdrop: SidebarSurfaceBackdrop): ViewStyle {
   switch (backdrop) {
+    case "surfaceSidebar":
+      return styles.statusBadgeOnSidebar;
     case "surfaceSidebarHover":
       return styles.statusBadgeOnSidebarHover;
     case "surface2":
       return styles.statusBadgeOnSurface2;
-    default:
-      return styles.statusBadgeOnSidebar;
   }
 }
 
@@ -240,8 +259,8 @@ const styles = StyleSheet.create((theme) => {
   // so this badge can't drift from the status dots everywhere else.
   const statusDot = (bucket: ProjectStatusBadgeDotBucket) =>
     ({
-      width: STATUS_BADGE_DOT_SIZE,
-      height: STATUS_BADGE_DOT_SIZE,
+      width: STATUS_INDICATOR_FILLED_DOT_SIZE,
+      height: STATUS_INDICATOR_FILLED_DOT_SIZE,
       borderRadius: theme.borderRadius.full,
       backgroundColor: getStatusDotColor({ theme, bucket }) ?? undefined,
     }) as const;
@@ -282,6 +301,12 @@ const styles = StyleSheet.create((theme) => {
       justifyContent: "center",
       overflow: "hidden",
     },
+    // Same corner as the shell, re-centred for the wider ring.
+    statusRingAnchor: {
+      position: "absolute",
+      right: getStatusRingOffset(STATUS_BADGE_OFFSET, STATUS_BADGE_SIZE),
+      bottom: getStatusRingOffset(STATUS_BADGE_OFFSET, STATUS_BADGE_SIZE),
+    },
     statusBadgeOnSidebar: { backgroundColor: theme.colors.surfaceSidebar },
     statusBadgeOnSidebarHover: { backgroundColor: theme.colors.surfaceSidebarHover },
     statusBadgeOnSurface2: { backgroundColor: theme.colors.surface2 },

packages/app/src/components/sidebar/sidebar-row-backdrop.ts

@@ -1,4 +1,4 @@
-import type { SurfaceBackdrop } from "@/styles/surface-backdrop";
+import type { SidebarSurfaceBackdrop } from "@/styles/surface-backdrop";
 
 /**
  * Which surface a sidebar row is currently painting, so anything knocking out of it — the status
@@ -9,19 +9,19 @@ import type { SurfaceBackdrop } from "@/styles/surface-backdrop";
  * here rather than three ternaries beside three stylesheets: drifting from them is how the badge
  * ends up with a halo, and a halo in one grouping mode but not the other is worse than either.
  *
- * The pressed background is deliberately absent. It lives in a Pressable style callback and lasts
- * as long as a finger is down, which is not long enough to see a mismatched ring.
  */
 export function getSidebarRowBackdrop({
   isDragging = false,
+  isPressed = false,
   selected = false,
   isHovered = false,
 }: {
   isDragging?: boolean;
+  isPressed?: boolean;
   selected?: boolean;
   isHovered?: boolean;
-}): SurfaceBackdrop {
-  if (isDragging) return "surface2";
+}): SidebarSurfaceBackdrop {
+  if (isDragging || isPressed) return "surface2";
   if (selected || isHovered) return "surfaceSidebarHover";
   return "surfaceSidebar";
 }

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

@@ -687,12 +687,15 @@ function StatusWorkspaceRowInner({
   inStatusGroup?: boolean;
 }) {
   const isTouchPlatform = platformIsNative;
+  const [isPressed, setIsPressed] = useState(false);
   const trailing = useSidebarWorkspaceTrailing();
 
   const isDesktop = !isTouchPlatform;
   const serviceSummary = isDesktop ? selectWorkspaceServiceSummary(workspace.scripts) : null;
 
   const accessibilityState = useMemo(() => ({ selected }), [selected]);
+  const handlePressIn = useCallback(() => setIsPressed(true), []);
+  const handlePressOut = useCallback(() => setIsPressed(false), []);
 
   return (
     <SidebarWorkspaceRowFrame workspace={workspace}>
@@ -713,6 +716,7 @@ function StatusWorkspaceRowInner({
           showShortcut,
         });
         const workspaceRowStyle = getStatusWorkspaceRowStyle({
+          isPressed,
           selected,
           isHovered,
           inStatusGroup,
@@ -743,7 +747,9 @@ function StatusWorkspaceRowInner({
               accessibilityRole="button"
               accessibilityState={accessibilityState}
               style={workspaceRowStyle}
-              highlightStyle={styles.workspaceRowHovered}
+              highlightStyle={styles.workspaceRowPressed}
+              onPressIn={handlePressIn}
+              onPressOut={handlePressOut}
               onPress={onPress}
               testID={`sidebar-workspace-row-${workspace.workspaceKey}`}
             >
@@ -753,7 +759,7 @@ function StatusWorkspaceRowInner({
                 leadingProjectName={projectName}
                 leadingProjectIconDataUri={projectIconDataUri}
                 serviceSummary={serviceSummary}
-                backdrop={getSidebarRowBackdrop({ selected, isHovered })}
+                backdrop={getSidebarRowBackdrop({ isPressed, selected, isHovered })}
                 isHovered={isHovered}
                 isLoading={isArchiving}
                 shortcutNumber={shortcutNumber}
@@ -857,10 +863,12 @@ function StatusWorkspaceActionSlot({
 }
 
 function getStatusWorkspaceRowStyle({
+  isPressed,
   selected,
   isHovered,
   inStatusGroup,
 }: {
+  isPressed: boolean;
   selected: boolean;
   isHovered: boolean;
   inStatusGroup: boolean;
@@ -870,6 +878,7 @@ function getStatusWorkspaceRowStyle({
     inStatusGroup && sidebarWorkspaceRowStyles.rowIndented,
     selected && styles.sidebarRowSelected,
     isHovered && styles.workspaceRowHovered,
+    isPressed && styles.workspaceRowPressed,
   ];
 }
 

packages/app/src/components/sidebar/sidebar-workspace-row-content.tsx

@@ -4,7 +4,7 @@ import { StyleSheet, withUnistyles } from "react-native-unistyles";
 import Svg, { Defs, LinearGradient as SvgLinearGradient, Rect, Stop } from "react-native-svg";
 import { CircleAlert, Folder, FolderGit2, Monitor } from "lucide-react-native";
 import { ProjectStatusIndicator } from "@/components/sidebar/project-leading-visual";
-import type { SurfaceBackdrop } from "@/styles/surface-backdrop";
+import type { SidebarSurfaceBackdrop } from "@/styles/surface-backdrop";
 import {
   WorkspaceMetaRow,
   type WorkspaceServiceSummary,
@@ -19,12 +19,14 @@ import {
 import { useAppSettings } from "@/hooks/use-settings";
 import type { Theme } from "@/styles/theme";
 import type { SidebarStateBucket } from "@/utils/sidebar-agent-state";
-import { getStatusDotColor, isEmphasizedStatusDotBucket } from "@/utils/status-dot-color";
+import { getStatusDotColor } from "@/utils/status-dot-color";
 import {
   STATUS_INDICATOR_ALERT_SIZE,
   STATUS_INDICATOR_DOT_SIZE,
+  STATUS_INDICATOR_FILLED_DOT_SIZE,
 } from "@/utils/status-indicator-geometry";
 import { shouldRenderSyncedStatusLoader } from "@/utils/status-loader";
+import { StatusRing } from "@/components/status-ring";
 import { resolveSidebarWorkspacePrimaryLabel } from "@/components/sidebar/sidebar-workspace-title";
 
 // The scrim spans more than the kebab so the fade starts left of the diff stat. Solid from
@@ -32,11 +34,6 @@ import { resolveSidebarWorkspacePrimaryLabel } from "@/components/sidebar/sideba
 const SCRIM_WIDTH = 48;
 const SCRIM_SOLID_OFFSET = "55%";
 
-const DEFAULT_STATUS_DOT_SIZE = 7;
-const EMPHASIZED_STATUS_DOT_SIZE = 9;
-const DEFAULT_STATUS_DOT_OFFSET = 0;
-const EMPHASIZED_STATUS_DOT_OFFSET = -1;
-
 const foregroundMutedColorMapping = (theme: Theme) => ({ color: theme.colors.foregroundMuted });
 const needsInputColorMapping = (theme: Theme) => ({
   color: theme.colors.surface0,
@@ -143,7 +140,7 @@ export const SidebarWorkspaceRowContent = memo(function SidebarWorkspaceRowConte
   leadingProjectIconDataUri?: string | null;
   serviceSummary?: WorkspaceServiceSummary | null;
   /** The row's current background, so the project status badge can knock out of it. */
-  backdrop: SurfaceBackdrop;
+  backdrop: SidebarSurfaceBackdrop;
   isHovered: boolean;
   isLoading: boolean;
   isCreating?: boolean;
@@ -221,14 +218,14 @@ function WorkspaceStatusIndicator({
   loading?: boolean;
   reserveIdleSpace?: boolean;
 }) {
-  // Busy is a dot here for the same reason it is on a project icon: every status in the
-  // sidebar is a dot, and a row with a project icon simply moves that dot onto the icon.
-  // A row starting up and a row working are both busy, so they share the dot and differ only
-  // in testID.
+  // Busy is the only status that moves, and it is the ring rather than a dot for the same
+  // reason it is a dot elsewhere: every status in the sidebar sits in this one slot, so busy
+  // has to fill it without displacing anything. A row starting up and a row working are both
+  // busy, so they share the ring and differ only in testID.
   if (loading) {
     return (
       <View style={styles.workspaceStatusDot} testID="workspace-status-indicator-loading">
-        <View style={styles.standaloneRunningDot} />
+        <StatusRing />
       </View>
     );
   }
@@ -236,7 +233,7 @@ function WorkspaceStatusIndicator({
   if (shouldRenderSyncedStatusLoader({ bucket })) {
     return (
       <View style={styles.workspaceStatusDot} testID="workspace-status-indicator-running">
-        <View style={styles.standaloneRunningDot} />
+        <StatusRing />
       </View>
     );
   }
@@ -275,50 +272,16 @@ function WorkspaceStatusIndicator({
   else KindIcon = ThemedFolder;
 
   const dotColorStyle = getStatusDotColorStyle(bucket);
-  const statusDotSize = isEmphasizedStatusDotBucket(bucket)
-    ? EMPHASIZED_STATUS_DOT_SIZE
-    : DEFAULT_STATUS_DOT_SIZE;
-  const statusDotOffset =
-    statusDotSize === EMPHASIZED_STATUS_DOT_SIZE
-      ? EMPHASIZED_STATUS_DOT_OFFSET
-      : DEFAULT_STATUS_DOT_OFFSET;
   return (
     <View style={styles.workspaceStatusDot} testID={`workspace-status-indicator-${bucket}`}>
       <KindIcon size={14} uniProps={foregroundMutedColorMapping} />
-      {dotColorStyle ? (
-        <StatusDotOverlay
-          dotColorStyle={dotColorStyle}
-          size={statusDotSize}
-          offset={statusDotOffset}
-        />
-      ) : null}
+      {dotColorStyle ? <StatusDotOverlay dotColorStyle={dotColorStyle} /> : null}
     </View>
   );
 }
 
-function StatusDotOverlay({
-  dotColorStyle,
-  size,
-  offset,
-}: {
-  dotColorStyle: ViewStyle;
-  size: number;
-  offset: number;
-}) {
-  const overlayStyle = useMemo(
-    () => [
-      styles.statusDotOverlay,
-      dotColorStyle,
-      {
-        width: size,
-        height: size,
-        right: offset,
-        bottom: offset,
-      },
-    ],
-    [dotColorStyle, offset, size],
-  );
-  return <View style={overlayStyle} />;
+function StatusDotOverlay({ dotColorStyle }: { dotColorStyle: ViewStyle }) {
+  return <View style={[styles.statusDotOverlay, dotColorStyle]} />;
 }
 
 function getStatusDotColorStyle(bucket: SidebarStateBucket) {
@@ -569,24 +532,22 @@ const styles = StyleSheet.create((theme) => ({
   },
   statusDotOverlay: {
     position: "absolute",
+    right: 0,
+    bottom: 0,
+    width: STATUS_INDICATOR_DOT_SIZE,
+    height: STATUS_INDICATOR_DOT_SIZE,
     borderRadius: theme.borderRadius.full,
     borderWidth: 1,
   },
   standaloneStatusDot: {
-    width: STATUS_INDICATOR_DOT_SIZE,
-    height: STATUS_INDICATOR_DOT_SIZE,
+    width: STATUS_INDICATOR_FILLED_DOT_SIZE,
+    height: STATUS_INDICATOR_FILLED_DOT_SIZE,
     borderRadius: theme.borderRadius.full,
     backgroundColor: getStatusDotColor({ theme, bucket: "attention" }) ?? undefined,
   },
-  standaloneRunningDot: {
-    width: STATUS_INDICATOR_DOT_SIZE,
-    height: STATUS_INDICATOR_DOT_SIZE,
-    borderRadius: theme.borderRadius.full,
-    backgroundColor: getStatusDotColor({ theme, bucket: "running" }) ?? undefined,
-  },
   idleStatusDot: {
-    width: 8,
-    height: 8,
+    width: STATUS_INDICATOR_FILLED_DOT_SIZE,
+    height: STATUS_INDICATOR_FILLED_DOT_SIZE,
     borderRadius: theme.borderRadius.full,
     backgroundColor: theme.colors.foregroundExtraMuted,
     opacity: 0.3,

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

@@ -1,6 +1,6 @@
 import { memo, useCallback, useMemo, useState, type Ref } from "react";
 import { useTranslation } from "react-i18next";
-import { View, Text } from "react-native";
+import { View, Text, type GestureResponderEvent } from "react-native";
 import { StyleSheet } from "react-native-unistyles";
 import { useMutation } from "@tanstack/react-query";
 import * as Clipboard from "expo-clipboard";
@@ -264,6 +264,7 @@ function WorkspaceRowBody({
   archiveShortcutKeys,
 }: WorkspaceRowBodyProps) {
   const isTouchPlatform = platformIsNative;
+  const [isPressed, setIsPressed] = useState(false);
   const trailing = useSidebarWorkspaceTrailing();
   const draggable = Boolean(drag);
   const interaction = useLongPressDragInteraction({
@@ -284,6 +285,17 @@ function WorkspaceRowBody({
     }
     onPress();
   }, [interaction.didLongPressRef, onPress]);
+  const handleWorkspacePressIn = useCallback(
+    (event: GestureResponderEvent) => {
+      setIsPressed(true);
+      if (draggable) interaction.handlePressIn(event);
+    },
+    [draggable, interaction],
+  );
+  const handleWorkspacePressOut = useCallback(() => {
+    setIsPressed(false);
+    if (draggable) interaction.handlePressOut();
+  }, [draggable, interaction]);
 
   const accessibilityState = useMemo(() => ({ selected }), [selected]);
 
@@ -292,7 +304,12 @@ function WorkspaceRowBody({
       {({ isHovered, contextMenuOpen, onContextMenuOpenChange, hoverHandlers }) => {
         const isDesktop = !isTouchPlatform;
         const serviceSummary = isDesktop ? selectWorkspaceServiceSummary(workspace.scripts) : null;
-        const workspaceRowStyle = getWorkspaceRowStyle({ isDragging, selected, isHovered });
+        const workspaceRowStyle = getWorkspaceRowStyle({
+          isDragging,
+          isPressed,
+          selected,
+          isHovered,
+        });
         return (
           <View
             {...(draggable ? dragAttributes : {})}
@@ -325,10 +342,10 @@ function WorkspaceRowBody({
               accessibilityRole="button"
               accessibilityState={accessibilityState}
               style={workspaceRowStyle}
-              highlightStyle={styles.workspaceRowHovered}
-              onPressIn={draggable ? interaction.handlePressIn : undefined}
+              highlightStyle={styles.workspaceRowPressed}
+              onPressIn={handleWorkspacePressIn}
               onTouchMove={draggable ? interaction.handleTouchMove : undefined}
-              onPressOut={draggable ? interaction.handlePressOut : undefined}
+              onPressOut={handleWorkspacePressOut}
               onPress={handlePress}
               testID={`sidebar-workspace-row-${workspace.workspaceKey}`}
             >
@@ -336,7 +353,7 @@ function WorkspaceRowBody({
                 workspace={workspace}
                 hostBadge={hostBadge}
                 serviceSummary={serviceSummary}
-                backdrop={getSidebarRowBackdrop({ isDragging, selected, isHovered })}
+                backdrop={getSidebarRowBackdrop({ isDragging, isPressed, selected, isHovered })}
                 isHovered={isHovered}
                 isLoading={isArchiving || isCreating}
                 isCreating={isCreating}
@@ -458,18 +475,21 @@ function WorkspaceRowTrailingActions({
 
 function getWorkspaceRowStyle({
   isDragging,
+  isPressed,
   selected,
   isHovered,
 }: {
   isDragging: boolean;
+  isPressed: boolean;
   selected: boolean;
   isHovered: boolean;
 }) {
   return [
     styles.workspaceRow,
-    isDragging && styles.workspaceRowDragging,
     selected && styles.sidebarRowSelected,
     isHovered && styles.workspaceRowHovered,
+    isDragging && styles.workspaceRowDragging,
+    isPressed && styles.workspaceRowPressed,
   ];
 }
 
@@ -495,6 +515,9 @@ const styles = StyleSheet.create((theme) => ({
   workspaceRowHovered: {
     backgroundColor: theme.colors.surfaceSidebarHover,
   },
+  workspaceRowPressed: {
+    backgroundColor: theme.colors.surface2,
+  },
   workspaceRowDragging: {
     backgroundColor: theme.colors.surface2,
     borderWidth: 1,

packages/app/src/components/split-container.tsx

@@ -710,7 +710,7 @@ function DragOverlayTabChipInner({
 
         return (
           <View style={chipStyle}>
-            <WorkspaceTabIcon presentation={presentation} active size={14} />
+            <WorkspaceTabIcon presentation={presentation} active size={14} backdrop="surface1" />
             <Text numberOfLines={1} style={chipLabelStyle}>
               {label}
             </Text>

packages/app/src/components/status-ring/clock.ts

@@ -0,0 +1,58 @@
+import { useLayoutEffect } from "react";
+import { makeMutable, type SharedValue, useSharedValue } from "react-native-reanimated";
+import { scheduleOnUI } from "react-native-worklets";
+import { getStatusRingRotation } from "@/components/status-ring/geometry";
+
+const sharedRotation = makeMutable(getStatusRingRotation(Date.now()));
+const activeRingCount = makeMutable(0);
+const clockRunning = makeMutable(false);
+
+function advanceSharedRotation(): void {
+  "worklet";
+  if (activeRingCount.value === 0) {
+    clockRunning.value = false;
+    return;
+  }
+
+  sharedRotation.value = getStatusRingRotation(Date.now());
+  requestAnimationFrame(advanceSharedRotation);
+}
+
+function registerStatusRing(registered: SharedValue<boolean>): void {
+  "worklet";
+  if (registered.value) {
+    return;
+  }
+
+  registered.value = true;
+  activeRingCount.value += 1;
+
+  if (!clockRunning.value) {
+    clockRunning.value = true;
+    sharedRotation.value = getStatusRingRotation(Date.now());
+    requestAnimationFrame(advanceSharedRotation);
+  }
+}
+
+function unregisterStatusRing(registered: SharedValue<boolean>): void {
+  "worklet";
+  if (!registered.value) {
+    return;
+  }
+
+  registered.value = false;
+  activeRingCount.value -= 1;
+}
+
+export function useStatusRingRotation(): SharedValue<number> {
+  const registered = useSharedValue(false);
+
+  useLayoutEffect(() => {
+    scheduleOnUI(registerStatusRing, registered);
+    return () => {
+      scheduleOnUI(unregisterStatusRing, registered);
+    };
+  }, [registered]);
+
+  return sharedRotation;
+}

packages/app/src/components/status-ring/clock.web.ts

@@ -0,0 +1,35 @@
+import { useCallback, useLayoutEffect, useRef, type RefCallback } from "react";
+import type { View as NativeView } from "react-native";
+import { STATUS_RING_PERIOD_MS } from "@/components/status-ring/geometry";
+
+const STATUS_RING_KEYFRAMES: PropertyIndexedKeyframes = {
+  transform: ["rotate(0deg)", "rotate(360deg)"],
+};
+const STATUS_RING_TIMING: KeyframeAnimationOptions = {
+  duration: STATUS_RING_PERIOD_MS,
+  easing: "linear",
+  iterations: Number.POSITIVE_INFINITY,
+};
+const STATUS_RING_TIMELINE_START_MS = 0;
+
+export function useStatusRingAnimationRef(): RefCallback<NativeView> {
+  const arcElement = useRef<HTMLElement | null>(null);
+  const setArcElement = useCallback((instance: NativeView | null) => {
+    arcElement.current = instance instanceof HTMLElement ? instance : null;
+  }, []);
+
+  useLayoutEffect(() => {
+    const element = arcElement.current;
+    if (!element) {
+      return;
+    }
+
+    const animation = element.animate(STATUS_RING_KEYFRAMES, STATUS_RING_TIMING);
+    animation.startTime = STATUS_RING_TIMELINE_START_MS;
+    return () => {
+      animation.cancel();
+    };
+  }, []);
+
+  return setArcElement;
+}

packages/app/src/components/status-ring/frame.tsx

@@ -0,0 +1,121 @@
+import type { ReactNode } from "react";
+import { StyleSheet as RNStyleSheet, View } from "react-native";
+import { StyleSheet } from "react-native-unistyles";
+import type { SurfaceBackdrop } from "@/styles/surface-backdrop";
+import { getStatusDotColor } from "@/utils/status-dot-color";
+import {
+  STATUS_RING_FRAME_SIZE,
+  STATUS_RING_HEAD_OPACITY,
+  STATUS_RING_SIZE,
+  STATUS_RING_STROKE,
+  STATUS_RING_TRACK_OPACITY,
+} from "@/components/status-ring/geometry";
+import { STATUS_INDICATOR_FILLED_DOT_SIZE } from "@/utils/status-indicator-geometry";
+
+export interface StatusRingProps {
+  // The surface the ring is drawn on top of, named rather than resolved, because theme colours
+  // are only legible inside `StyleSheet.create` — see docs/unistyles.md. The frame fills itself
+  // with this so the ring reads as a hole punched in whatever it overlaps: the agent icon under a
+  // tab dot, the project tile under a sidebar badge. Leave it out where the ring sits on flat
+  // background and has nothing to knock out.
+  backdrop?: SurfaceBackdrop | null;
+}
+
+/**
+ * The static half of the running indicator: the knockout, the track, and the centre dot. The
+ * platform entry points supply the rotating quarter and own only how it is driven.
+ *
+ * The ring has no colour prop. It only ever means one thing — an agent is running — so it reads
+ * that one colour out of the theme itself. Passing the colour in would materialise it at the call
+ * site, outside anything Unistyles tracks, and leave the mark in the old theme until something
+ * incidental re-rendered the row.
+ */
+export function StatusRingFrame({ backdrop, children }: StatusRingProps & { children: ReactNode }) {
+  return (
+    <View style={[styles.frame, getBackdropStyle(backdrop)]}>
+      <View style={styles.track} />
+      {children}
+      <View style={styles.centerDot} />
+    </View>
+  );
+}
+
+function getBackdropStyle(backdrop: SurfaceBackdrop | null | undefined) {
+  switch (backdrop) {
+    case "surface0":
+      return styles.backdropSurface0;
+    case "surface1":
+      return styles.backdropSurface1;
+    case "surfaceSidebar":
+      return styles.backdropSurfaceSidebar;
+    case "surfaceSidebarHover":
+      return styles.backdropSurfaceSidebarHover;
+    case "surface2":
+      return styles.backdropSurface2;
+    default:
+      return null;
+  }
+}
+
+// The rotating quarter's geometry, deliberately plain React Native rather than Unistyles: on
+// native this style lands on a Reanimated `Animated.View`, and applying a theme-tracked style to
+// one crashes when the theme changes — Unistyles and Reanimated both mutate the same native node.
+// See docs/unistyles.md. The colour it needs lives on `styles.arc`, one level in, on a view
+// Reanimated never touches.
+export const rotatorStyles = RNStyleSheet.create({
+  rotator: {
+    position: "absolute",
+    width: STATUS_RING_SIZE,
+    height: STATUS_RING_SIZE,
+  },
+});
+
+export const styles = StyleSheet.create((theme) => {
+  const circle = {
+    width: STATUS_RING_SIZE,
+    height: STATUS_RING_SIZE,
+    borderRadius: theme.borderRadius.full,
+    borderWidth: STATUS_RING_STROKE,
+  } as const;
+  const runningColor = getStatusDotColor({ theme, bucket: "running" }) ?? undefined;
+
+  return {
+    frame: {
+      width: STATUS_RING_FRAME_SIZE,
+      height: STATUS_RING_FRAME_SIZE,
+      borderRadius: theme.borderRadius.full,
+      alignItems: "center",
+      justifyContent: "center",
+    },
+    backdropSurface0: { backgroundColor: theme.colors.surface0 },
+    backdropSurface1: { backgroundColor: theme.colors.surface1 },
+    backdropSurfaceSidebar: { backgroundColor: theme.colors.surfaceSidebar },
+    backdropSurfaceSidebarHover: { backgroundColor: theme.colors.surfaceSidebarHover },
+    backdropSurface2: { backgroundColor: theme.colors.surface2 },
+
+    // The closed ring the quarter runs on. Same colour rather than a grey so the indicator is one
+    // object at one hue; the opacity is what puts it behind the quarter instead of competing.
+    track: {
+      ...circle,
+      position: "absolute",
+      borderColor: runningColor,
+      opacity: STATUS_RING_TRACK_OPACITY,
+    },
+
+    // The moving quarter. Three sides transparent leaves the top border alone, which on a fully
+    // rounded box is a 90° arc — the edge that makes the rotation legible against the track.
+    arc: {
+      ...circle,
+      borderColor: "transparent",
+      borderTopColor: runningColor,
+      opacity: STATUS_RING_HEAD_OPACITY,
+    },
+
+    centerDot: {
+      width: STATUS_INDICATOR_FILLED_DOT_SIZE,
+      height: STATUS_INDICATOR_FILLED_DOT_SIZE,
+      borderRadius: theme.borderRadius.full,
+      backgroundColor: runningColor,
+    },
+  };
+});

packages/app/src/components/status-ring/geometry.ts

@@ -0,0 +1,49 @@
+import { STATUS_INDICATOR_FILLED_DOT_SIZE } from "@/utils/status-indicator-geometry";
+
+// The running indicator is a status dot with a rotating ring around it, and the whole set of
+// numbers below is a budget rather than four independent choices. The centre matches every other
+// filled status circle; the gap and stroke grow outward from it without changing that shared size.
+export const STATUS_RING_GAP = 1.5;
+export const STATUS_RING_STROKE = 1.5;
+// Derived outward from the dot, which means the dot is not a free variable: shrink it without
+// opening the gap by the same amount and the ring closes in behind it, the whole mark scales
+// down, and nothing about how the centre reads against the ring actually changes.
+export const STATUS_RING_SIZE =
+  STATUS_INDICATOR_FILLED_DOT_SIZE + (STATUS_RING_GAP + STATUS_RING_STROKE) * 2;
+
+// The knockout margin, and the reason the frame is wider than the ring. These indicators sit on
+// the bottom-right corner of an agent or project icon, and a dot only stays readable there
+// because it carries a ring of surface colour separating it from the art underneath. A ring drawn
+// out to the frame's edge has no such separation and collides with the icon, so the frame is the
+// knockout and the ring lives inside it.
+export const STATUS_RING_HALO_INSET = 1;
+export const STATUS_RING_FRAME_SIZE = STATUS_RING_SIZE + STATUS_RING_HALO_INSET * 2;
+
+// The track and the quarter riding it are the same color and differ only here. The track is low
+// enough that the quarter is unmistakably the thing moving, high enough that the ring still reads
+// as a ring when the quarter is on the far side of it. The quarter is held off full so the centre
+// dot stays the solid part of the mark — the ring is what the dot is doing, not a second dot.
+export const STATUS_RING_TRACK_OPACITY = 0.3;
+export const STATUS_RING_HEAD_OPACITY = 0.9;
+
+// One period for every ring in the app. Each platform owns one mount-independent timeline: web
+// animations share an absolute document-timeline start, while native publishes this wall-clock
+// phase from one UI-thread clock. A row that appears mid-flight therefore lands in step with the
+// rings already turning.
+export const STATUS_RING_PERIOD_MS = 900;
+
+export function getStatusRingRotation(nowMs: number): number {
+  "worklet";
+  return ((nowMs % STATUS_RING_PERIOD_MS) / STATUS_RING_PERIOD_MS) * 360;
+}
+
+/**
+ * Re-anchors a corner status dot's offset for the ring that replaces it.
+ *
+ * The dots this replaces are pinned to an icon's bottom-right corner rather than centred in a
+ * slot, so growing them in place would walk the indicator off the corner. Callers keep their
+ * existing dot offset and pass it through here to grow around the same centre point.
+ */
+export function getStatusRingOffset(dotOffset: number, dotSize: number): number {
+  return dotOffset - (STATUS_RING_FRAME_SIZE - dotSize) / 2;
+}

packages/app/src/components/status-ring/index.tsx

@@ -0,0 +1,32 @@
+import { memo } from "react";
+import { View } from "react-native";
+import Animated, { useAnimatedStyle } from "react-native-reanimated";
+import {
+  StatusRingFrame,
+  type StatusRingProps,
+  rotatorStyles,
+  styles,
+} from "@/components/status-ring/frame";
+import { useStatusRingRotation } from "@/components/status-ring/clock";
+
+/**
+ * Native running indicator. The rotation is published by one shared UI-thread clock rather than
+ * per-instance timing, so a ring that mounts mid-flight is already in phase — see `clock.ts`.
+ *
+ * The rotated view carries no theme-tracked style; the coloured arc is nested inside it. Putting
+ * a Unistyles style on a Reanimated view crashes on theme change (docs/unistyles.md).
+ */
+export const StatusRing = memo(function StatusRing({ backdrop }: StatusRingProps) {
+  const rotation = useStatusRingRotation();
+  const rotatorStyle = useAnimatedStyle(() => ({
+    transform: [{ rotate: `${rotation.value}deg` }],
+  }));
+
+  return (
+    <StatusRingFrame backdrop={backdrop}>
+      <Animated.View style={[rotatorStyles.rotator, rotatorStyle]}>
+        <View style={styles.arc} />
+      </Animated.View>
+    </StatusRingFrame>
+  );
+});

packages/app/src/components/status-ring/index.web.tsx

@@ -0,0 +1,26 @@
+import { memo } from "react";
+import { View } from "react-native";
+import {
+  StatusRingFrame,
+  type StatusRingProps,
+  rotatorStyles,
+  styles,
+} from "@/components/status-ring/frame";
+import { useStatusRingAnimationRef } from "@/components/status-ring/clock.web";
+
+/**
+ * Web running indicator. A sidebar full of agents can hold dozens of these at once, so the browser
+ * drives the rotation from one absolute document-timeline epoch rather than from mount time — see
+ * `clock.web.ts`.
+ */
+export const StatusRing = memo(function StatusRing({ backdrop }: StatusRingProps) {
+  const rotatorRef = useStatusRingAnimationRef();
+
+  return (
+    <StatusRingFrame backdrop={backdrop}>
+      <View ref={rotatorRef} style={rotatorStyles.rotator}>
+        <View style={styles.arc} />
+      </View>
+    </StatusRingFrame>
+  );
+});

packages/app/src/components/tool-call-details.tsx

@@ -10,7 +10,6 @@ import { ScrollView as GHScrollView } from "react-native-gesture-handler";
 import { StyleSheet } from "react-native-unistyles";
 import type { TFunction } from "i18next";
 import { useTranslation } from "react-i18next";
-import { AppearanceStyleBoundary } from "@/components/appearance-style-boundary";
 import type { ToolCallDetail } from "@getpaseo/protocol/agent-types";
 import { buildLineDiff, parseUnifiedDiff, type DiffLine } from "@/utils/tool-call-parsers";
 import { highlightDiffLines } from "@/utils/diff-highlight";
@@ -741,15 +740,7 @@ function LoadingSkeleton({ containerStyle }: { containerStyle: StyleProp<ViewSty
   );
 }
 
-export function ToolCallDetailsContent({ ...props }: ToolCallDetailsContentProps) {
-  return (
-    <AppearanceStyleBoundary>
-      <ToolCallDetailsContentInner {...props} />
-    </AppearanceStyleBoundary>
-  );
-}
-
-function ToolCallDetailsContentInner({
+export function ToolCallDetailsContent({
   detail,
   errorText,
   maxHeight,

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

@@ -31,10 +31,11 @@ export function Alert({
 }: AlertProps) {
   const { theme } = useUnistyles();
   const accentColor = resolveAccentColor(variant, theme);
+  const borderColor = variant === "success" ? theme.colors.border : accentColor;
 
   const containerStyle = useMemo(
-    () => [styles.container, accentColor ? { borderColor: accentColor } : null],
-    [accentColor],
+    () => [styles.container, borderColor ? { borderColor } : null],
+    [borderColor],
   );
 
   const titleStyle = useMemo(
@@ -73,7 +74,7 @@ function resolveAccentColor(
   theme: ReturnType<typeof useUnistyles>["theme"],
 ): string | null {
   if (variant === "info") return theme.colors.palette.blue[300];
-  if (variant === "success") return theme.colors.palette.green[400];
+  if (variant === "success") return theme.colors.statusSuccess;
   if (variant === "warning") return theme.colors.palette.amber[500];
   if (variant === "error") return theme.colors.destructive;
   return null;

packages/app/src/components/ui/normalize-display-chord.test.ts

@@ -0,0 +1,34 @@
+import { describe, expect, it } from "vitest";
+import { normalizeDisplayChord } from "./normalize-display-chord";
+
+describe("normalizeDisplayChord", () => {
+  it("returns null when neither keys nor chord is given", () => {
+    expect(normalizeDisplayChord()).toBeNull();
+  });
+
+  it("returns null for an empty keys array", () => {
+    // The trap: [] wraps to [[]], whose first element is truthy.
+    expect(normalizeDisplayChord(undefined, [])).toBeNull();
+  });
+
+  it("returns null for an empty chord", () => {
+    expect(normalizeDisplayChord([])).toBeNull();
+  });
+
+  it("returns null for a chord holding an empty combo", () => {
+    expect(normalizeDisplayChord([[]])).toBeNull();
+    expect(normalizeDisplayChord([["mod", "K"], []])).toBeNull();
+  });
+
+  it("wraps keys into a single-combo chord", () => {
+    expect(normalizeDisplayChord(undefined, ["mod", "K"])).toEqual([["mod", "K"]]);
+  });
+
+  it("passes a multi-step chord through unchanged", () => {
+    expect(normalizeDisplayChord([["mod", "K"], ["S"]])).toEqual([["mod", "K"], ["S"]]);
+  });
+
+  it("prefers chord over keys when both are given", () => {
+    expect(normalizeDisplayChord([["alt", "W"]], ["mod", "K"])).toEqual([["alt", "W"]]);
+  });
+});

packages/app/src/components/ui/normalize-display-chord.ts

@@ -0,0 +1,28 @@
+import type { ShortcutKey } from "@/utils/format-shortcut";
+
+/**
+ * The combos a `Shortcut` should render, or `null` when it should render
+ * nothing at all.
+ *
+ * `keys={[]}` is the trap this exists to close: it wraps to `[[]]`, whose first
+ * element is an empty array — truthy — so a first-element check waves it
+ * through and an empty badge pill renders. A shortcut with no keys, whether the
+ * user unassigned it or it ships without a default combo, has to produce no
+ * element at all.
+ */
+export function normalizeDisplayChord(
+  chord?: ShortcutKey[][],
+  keys?: ShortcutKey[],
+): ShortcutKey[][] | null {
+  const combos = chord ?? (keys ? [keys] : []);
+  if (combos.length === 0) {
+    return null;
+  }
+  // A chord with an empty step cannot be drawn honestly: rendering it would
+  // show a blank pill, and dropping the step would advertise a shorter
+  // sequence than the one that actually fires.
+  if (combos.some((combo) => combo.length === 0)) {
+    return null;
+  }
+  return combos;
+}

packages/app/src/components/ui/scrollable-code-surface.tsx

@@ -9,7 +9,6 @@ import {
 } from "react-native";
 import { StyleSheet } from "react-native-unistyles";
 
-import { AppearanceStyleBoundary } from "@/components/appearance-style-boundary";
 import { isWeb } from "@/constants/platform";
 import { CODE_SURFACE_DATASET } from "@/styles/code-surface";
 import { inlineUnistylesStyle } from "@/styles/unistyles-inline-style";
@@ -56,7 +55,7 @@ export function SurfaceCard({
     [bordered, style, surfaceStyle],
   );
 
-  const surface = (
+  return (
     <View
       style={containerStyle}
       dataSet={codeSurface ? CODE_SURFACE_DATASET : undefined}
@@ -67,7 +66,6 @@ export function SurfaceCard({
       {children}
     </View>
   );
-  return <AppearanceStyleBoundary>{surface}</AppearanceStyleBoundary>;
 }
 
 export function ScrollableCodeSurface({

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

@@ -2,6 +2,7 @@ import React, { useMemo, type ReactElement } from "react";
 import { Text, View, type StyleProp, type TextStyle, type ViewStyle } from "react-native";
 import { StyleSheet } from "react-native-unistyles";
 import { useKeyboardShortcutsAvailable } from "@/keyboard/availability";
+import { normalizeDisplayChord } from "@/components/ui/normalize-display-chord";
 import { formatShortcut, type ShortcutKey } from "@/utils/format-shortcut";
 import { getShortcutOs } from "@/utils/shortcut-platform";
 
@@ -17,9 +18,8 @@ export function Shortcut({
   textStyle?: StyleProp<TextStyle>;
 }): ReactElement | null {
   const shortcutsAvailable = useKeyboardShortcutsAvailable();
-  const displayChord = chord ?? (keys ? [keys] : []);
+  const displayChord = normalizeDisplayChord(chord, keys);
   const shortcutOs = getShortcutOs();
-  const singleCombo = displayChord[0];
 
   const badgeStyle = useMemo(() => [styles.badge, style], [style]);
   const textCombinedStyle = useMemo(() => [styles.text, textStyle], [textStyle]);
@@ -29,8 +29,11 @@ export function Shortcut({
     return null;
   }
 
-  if (!singleCombo) {
-    return <View style={style} />;
+  const singleCombo = displayChord?.[0];
+  // Render nothing, literally — an empty <View> would still consume the
+  // parent's `gap` and leave a phantom slot where the badge used to be.
+  if (!displayChord || !singleCombo) {
+    return null;
   }
 
   if (displayChord.length === 1) {

packages/app/src/components/workspace-setup-dialog.tsx

@@ -1,11 +1,13 @@
 import { useCallback, useEffect, useMemo, useState } from "react";
-import { Image, Text, View } from "react-native";
+import { Text, View } from "react-native";
 import { StyleSheet } from "react-native-unistyles";
 import { useTranslation } from "react-i18next";
 import { createNameId } from "mnemonic-id";
 import { AdaptiveModalSheet, type SheetHeader } from "@/components/adaptive-modal-sheet";
 import { FileDropZone } from "@/components/file-drop/file-drop-zone";
 import { Composer } from "@/composer";
+import { ProjectIconView } from "@/components/project-icon-view";
+import { ICON_SIZE } from "@/styles/theme";
 import { useToast } from "@/contexts/toast-context";
 import { useAgentInputDraft } from "@/composer/draft/input-draft";
 import { useProjectIcon } from "@/projects/icons";
@@ -29,7 +31,6 @@ import { requireWorkspaceDirectory } from "@/utils/workspace-directory";
 import { navigateToAgent } from "@/utils/navigate-to-agent";
 import { navigateToWorkspace } from "@/stores/navigation-active-workspace-store";
 import type { MessagePayload } from "@/composer/types";
-import { projectIconRadius } from "@/components/project-icon-view";
 
 function toProjectIconDataUri(icon: { mimeType: string; data: string } | null): string | null {
   if (!icon) {
@@ -381,7 +382,6 @@ export function WorkspaceSetupDialog() {
   const placeholderLabel = projectIconPlaceholderLabelFromDisplayName(workspaceTitle);
   const placeholderInitial = placeholderLabel.charAt(0).toUpperCase();
 
-  const iconSource = useMemo(() => (iconDataUri ? { uri: iconDataUri } : null), [iconDataUri]);
   const agentControlsWithDisabled = useMemo(
     () =>
       composerState
@@ -396,19 +396,19 @@ export function WorkspaceSetupDialog() {
   const subtitleContent = useMemo(
     () => (
       <View style={styles.subtitleRow}>
-        {iconSource ? (
-          <Image source={iconSource} style={styles.projectIcon} />
-        ) : (
-          <View style={styles.projectIconFallback}>
-            <Text style={styles.projectIconFallbackText}>{placeholderInitial}</Text>
-          </View>
-        )}
+        <ProjectIconView
+          iconDataUri={iconDataUri}
+          initial={placeholderInitial}
+          projectViewKey={sourceDirectory}
+          size={ICON_SIZE.md}
+          textStyle={styles.projectIconFallbackText}
+        />
         <Text style={styles.projectTitle} numberOfLines={1}>
           {workspaceTitle}
         </Text>
       </View>
     ),
-    [iconSource, placeholderInitial, workspaceTitle],
+    [iconDataUri, placeholderInitial, sourceDirectory, workspaceTitle],
   );
 
   const sheetHeader = useMemo<SheetHeader>(
@@ -461,22 +461,7 @@ const styles = StyleSheet.create((theme) => ({
     alignItems: "center",
     gap: theme.spacing[2],
   },
-  // A user's uploaded mark is sized, never clipped — see projectIconRadius.
-  projectIcon: {
-    width: theme.iconSize.md,
-    height: theme.iconSize.md,
-  },
-  projectIconFallback: {
-    width: theme.iconSize.md,
-    height: theme.iconSize.md,
-    borderRadius: projectIconRadius(theme.iconSize.md),
-    borderWidth: 1,
-    borderColor: theme.colors.border,
-    alignItems: "center",
-    justifyContent: "center",
-  },
   projectIconFallbackText: {
-    color: theme.colors.foregroundMuted,
     fontSize: 9,
   },
   projectTitle: {

packages/app/src/desktop/components/desktop-notifications-section.tsx

@@ -0,0 +1,150 @@
+import { useCallback, useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { Text, View } from "react-native";
+import { withUnistyles } from "react-native-unistyles";
+import { RotateCw } from "lucide-react-native";
+import { Alert } from "@/components/ui/alert";
+import { Button } from "@/components/ui/button";
+import { Switch } from "@/components/ui/switch";
+import { DesktopPermissionRow } from "@/desktop/components/desktop-permission-row";
+import { useDesktopPermissions } from "@/desktop/permissions/use-desktop-permissions";
+import { useDesktopSettings } from "@/desktop/settings/desktop-settings";
+import { SettingsSection } from "@/screens/settings/settings-section";
+import { settingsStyles } from "@/styles/settings";
+
+const ThemedRotateCw = withUnistyles(RotateCw, (theme) => ({
+  size: theme.iconSize.md,
+  color: theme.colors.foregroundMuted,
+}));
+
+export function DesktopNotificationsSection() {
+  const { t } = useTranslation();
+  const { settings, isSaving, updateSettings } = useDesktopSettings();
+  const {
+    isDesktopApp,
+    snapshot,
+    isRefreshing,
+    requestingPermission,
+    testNotificationState,
+    refreshPermissions,
+    requestPermission,
+    sendTestNotification,
+  } = useDesktopPermissions();
+
+  const handleRefreshPress = useCallback(() => {
+    void refreshPermissions();
+  }, [refreshPermissions]);
+
+  const handleRequestNotifications = useCallback(() => {
+    void requestPermission("notifications");
+  }, [requestPermission]);
+
+  const handlePlaySoundChange = useCallback(
+    (playSound: boolean) => {
+      void updateSettings({ notifications: { playSound } }).catch(() => {
+        // useDesktopSettings owns the user-visible IPC error.
+      });
+    },
+    [updateSettings],
+  );
+
+  const handleSendTestNotification = useCallback(() => {
+    void sendTestNotification();
+  }, [sendTestNotification]);
+
+  const isPermissionBusy = isRefreshing || requestingPermission !== null;
+  const isSendingTestNotification = testNotificationState.status === "sending";
+  const refreshIcon = useMemo(() => <ThemedRotateCw />, []);
+  const refreshButton = useMemo(
+    () => (
+      <Button
+        variant="ghost"
+        size="sm"
+        leftIcon={refreshIcon}
+        onPress={handleRefreshPress}
+        disabled={isPermissionBusy}
+        accessibilityLabel={t("settings.notifications.refreshAccessibility")}
+      >
+        {isRefreshing ? t("settings.permissions.refreshing") : t("settings.permissions.refresh")}
+      </Button>
+    ),
+    [handleRefreshPress, isPermissionBusy, isRefreshing, refreshIcon, t],
+  );
+  const permissionLabels = useMemo(
+    () => ({
+      granted: t("settings.permissions.actions.granted"),
+      request: t("settings.permissions.actions.request"),
+      requesting: t("settings.permissions.actions.requesting"),
+    }),
+    [t],
+  );
+
+  if (!isDesktopApp) {
+    return null;
+  }
+
+  const notificationsGranted = snapshot?.notifications.state === "granted";
+
+  return (
+    <SettingsSection title={t("settings.notifications.title")} trailing={refreshButton}>
+      <View style={settingsStyles.card}>
+        <DesktopPermissionRow
+          title={t("settings.notifications.permission")}
+          status={snapshot?.notifications ?? null}
+          isRequesting={requestingPermission === "notifications"}
+          onRequest={handleRequestNotifications}
+          labels={permissionLabels}
+        />
+        <View style={[settingsStyles.row, settingsStyles.rowBorder]}>
+          <View style={settingsStyles.rowContent}>
+            <Text style={settingsStyles.rowTitle}>{t("settings.notifications.playSound")}</Text>
+            <Text style={settingsStyles.rowHint}>{t("settings.notifications.playSoundHint")}</Text>
+          </View>
+          <Switch
+            value={settings.notifications.playSound}
+            onValueChange={handlePlaySoundChange}
+            disabled={isSaving}
+            accessibilityLabel={t("settings.notifications.playSound")}
+            testID="desktop-notifications-play-sound-switch"
+          />
+        </View>
+        <View style={[settingsStyles.row, settingsStyles.rowBorder]}>
+          <View style={settingsStyles.rowContent}>
+            <Text style={settingsStyles.rowTitle}>{t("settings.notifications.test")}</Text>
+            <Text style={settingsStyles.rowHint}>
+              {notificationsGranted
+                ? t("settings.notifications.testHint")
+                : t("settings.notifications.permissionRequired")}
+            </Text>
+          </View>
+          <Button
+            variant="outline"
+            size="sm"
+            onPress={handleSendTestNotification}
+            disabled={!notificationsGranted || isPermissionBusy || isSendingTestNotification}
+          >
+            {isSendingTestNotification
+              ? t("settings.notifications.sending")
+              : t("settings.notifications.send")}
+          </Button>
+        </View>
+      </View>
+      {testNotificationState.status === "success" ? (
+        <Alert
+          variant="success"
+          title={t("settings.notifications.sentTitle")}
+          description={t("settings.notifications.sentDescription")}
+          testID="desktop-notifications-test-success"
+        />
+      ) : null}
+      {testNotificationState.status === "error" ? (
+        <Alert
+          variant="error"
+          title={t("settings.notifications.sendFailedTitle")}
+          description={testNotificationState.message}
+          testID="desktop-notifications-test-error"
+        />
+      ) : null}
+    </SettingsSection>
+  );
+}

packages/app/src/desktop/components/desktop-permission-row.tsx

@@ -1,6 +1,6 @@
 import { useMemo } from "react";
 import { View, Text } from "react-native";
-import { StyleSheet, useUnistyles } from "react-native-unistyles";
+import { StyleSheet, withUnistyles } from "react-native-unistyles";
 import { Check } from "lucide-react-native";
 import { Button } from "@/components/ui/button";
 import { settingsStyles } from "@/styles/settings";
@@ -14,16 +14,16 @@ export interface DesktopPermissionRowProps {
     granted: string;
     request: string;
     requesting: string;
-    busyExtraAction: (label: string) => string;
   };
   showBorder?: boolean;
   onRequest: () => void;
-  extraActionLabel?: string;
-  isExtraActionBusy?: boolean;
-  isExtraActionDisabled?: boolean;
-  onExtraAction?: () => void;
 }
 
+const ThemedCheck = withUnistyles(Check, (theme) => ({
+  size: theme.iconSize.sm,
+  color: theme.colors.foregroundMuted,
+}));
+
 export function DesktopPermissionRow({
   title,
   status,
@@ -31,12 +31,7 @@ export function DesktopPermissionRow({
   labels,
   showBorder,
   onRequest,
-  extraActionLabel,
-  isExtraActionBusy = false,
-  isExtraActionDisabled = false,
-  onExtraAction,
 }: DesktopPermissionRowProps) {
-  const { theme } = useUnistyles();
   const state = status?.state ?? "unknown";
   const isGranted = state === "granted";
   const shouldShowDetail =
@@ -58,21 +53,9 @@ export function DesktopPermissionRow({
       </View>
       <View style={styles.permissionRowActions}>
         {isGranted ? (
-          <View style={styles.permissionGrantedActions}>
-            <View style={styles.permissionStatusPill}>
-              <Check size={theme.iconSize.sm} color={theme.colors.foregroundMuted} />
-              <Text style={styles.permissionStatusText}>{labels.granted}</Text>
-            </View>
-            {extraActionLabel && onExtraAction ? (
-              <Button
-                variant="outline"
-                size="sm"
-                onPress={onExtraAction}
-                disabled={isExtraActionDisabled || isExtraActionBusy}
-              >
-                {isExtraActionBusy ? labels.busyExtraAction(extraActionLabel) : extraActionLabel}
-              </Button>
-            ) : null}
+          <View style={styles.permissionStatusPill}>
+            <ThemedCheck />
+            <Text style={styles.permissionStatusText}>{labels.granted}</Text>
           </View>
         ) : (
           <Button variant="outline" size="sm" onPress={onRequest} disabled={isRequesting}>
@@ -92,11 +75,6 @@ const styles = StyleSheet.create((theme) => ({
     alignItems: "flex-end",
     gap: theme.spacing[1],
   },
-  permissionGrantedActions: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: theme.spacing[2],
-  },
   permissionStatusPill: {
     flexDirection: "row",
     alignItems: "center",

packages/app/src/desktop/components/desktop-permissions-section.tsx

@@ -1,7 +1,7 @@
 import { useCallback, useMemo } from "react";
 import { useTranslation } from "react-i18next";
-import { View, Text } from "react-native";
-import { StyleSheet, useUnistyles } from "react-native-unistyles";
+import { View } from "react-native";
+import { withUnistyles } from "react-native-unistyles";
 import { RotateCw } from "lucide-react-native";
 import { Button } from "@/components/ui/button";
 import { DesktopPermissionRow } from "@/desktop/components/desktop-permission-row";
@@ -9,49 +9,33 @@ import { useDesktopPermissions } from "@/desktop/permissions/use-desktop-permiss
 import { settingsStyles } from "@/styles/settings";
 import { SettingsSection } from "@/screens/settings/settings-section";
 
+const ThemedRotateCw = withUnistyles(RotateCw, (theme) => ({
+  size: theme.iconSize.md,
+  color: theme.colors.foregroundMuted,
+}));
+
 export function DesktopPermissionsSection() {
   const { t } = useTranslation();
-  const { theme } = useUnistyles();
   const {
     isDesktopApp,
     snapshot,
     isRefreshing,
     requestingPermission,
-    isSendingTestNotification,
-    testNotificationError,
     refreshPermissions,
     requestPermission,
-    sendTestNotification,
   } = useDesktopPermissions();
 
-  const errorTextStyle = useMemo(
-    () => [styles.errorText, { color: theme.colors.destructive }],
-    [theme.colors.destructive],
-  );
-
   const handleRefreshPress = useCallback(() => {
     void refreshPermissions();
   }, [refreshPermissions]);
 
-  const handleRequestNotifications = useCallback(() => {
-    void requestPermission("notifications");
-  }, [requestPermission]);
-
   const handleRequestMicrophone = useCallback(() => {
     void requestPermission("microphone");
   }, [requestPermission]);
 
-  const handleSendTestNotification = useCallback(() => {
-    void sendTestNotification();
-  }, [sendTestNotification]);
-
   const isBusy = isRefreshing || requestingPermission !== null;
-  const notificationsGranted = snapshot?.notifications.state === "granted";
 
-  const refreshIcon = useMemo(
-    () => <RotateCw size={theme.iconSize.md} color={theme.colors.foregroundMuted} />,
-    [theme.iconSize.md, theme.colors.foregroundMuted],
-  );
+  const refreshIcon = useMemo(() => <ThemedRotateCw />, []);
 
   const refreshButton = useMemo(
     () => (
@@ -74,7 +58,6 @@ export function DesktopPermissionsSection() {
       granted: t("settings.permissions.actions.granted"),
       request: t("settings.permissions.actions.request"),
       requesting: t("settings.permissions.actions.requesting"),
-      busyExtraAction: (label: string) => t("settings.permissions.actions.busySuffix", { label }),
     }),
     [t],
   );
@@ -86,21 +69,8 @@ export function DesktopPermissionsSection() {
   return (
     <SettingsSection title={t("settings.permissions.title")} trailing={refreshButton}>
       <View style={settingsStyles.card}>
-        <DesktopPermissionRow
-          title={t("settings.permissions.notifications")}
-          status={snapshot?.notifications ?? null}
-          isRequesting={requestingPermission === "notifications"}
-          onRequest={handleRequestNotifications}
-          labels={permissionLabels}
-          extraActionLabel={t("settings.permissions.test")}
-          isExtraActionBusy={isSendingTestNotification}
-          isExtraActionDisabled={!notificationsGranted || isBusy}
-          onExtraAction={handleSendTestNotification}
-        />
-        {testNotificationError ? <Text style={errorTextStyle}>{testNotificationError}</Text> : null}
         <DesktopPermissionRow
           title={t("settings.permissions.microphone")}
-          showBorder
           status={snapshot?.microphone ?? null}
           isRequesting={requestingPermission === "microphone"}
           onRequest={handleRequestMicrophone}
@@ -110,11 +80,3 @@ export function DesktopPermissionsSection() {
     </SettingsSection>
   );
 }
-
-const styles = StyleSheet.create((theme) => ({
-  errorText: {
-    fontSize: theme.fontSize.xs,
-    paddingHorizontal: theme.spacing[4],
-    paddingBottom: theme.spacing[2],
-  },
-}));

packages/app/src/desktop/daemon/desktop-daemon-transport.test.ts

@@ -1,8 +1,5 @@
 import { describe, expect, it, vi } from "vitest";
-import {
-  createDesktopLocalDaemonTransportFactory,
-  createDesktopWebSocketTransportFactory,
-} from "./desktop-daemon-transport";
+import { createDesktopLocalDaemonTransportFactory } from "./desktop-daemon-transport";
 import { createFakeLocalDaemonTransportRpc } from "./test-local-daemon-transport-rpc";
 
 const LOCAL_URL = "paseo+local://socket?path=%2Ftmp%2Fpaseo.sock";
@@ -46,25 +43,4 @@ describe("desktop-daemon-transport", () => {
     expect(rpc.closedSessions).toEqual(["local-session-2"]);
     expect(cleanup).toHaveBeenCalledTimes(1);
   });
-
-  it("forwards remote WebSocket headers and protocols through the desktop bridge", () => {
-    const rpc = createFakeLocalDaemonTransportRpc();
-    const transportFactory = createDesktopWebSocketTransportFactory(rpc);
-    expect(transportFactory).not.toBeNull();
-
-    transportFactory!({
-      url: "wss://daemon.example/ws",
-      headers: { "X-Tenant": "acme", Authorization: "Bearer secret" },
-      protocols: ["paseo.bearer.secret"],
-    });
-
-    expect(rpc.openCalls).toEqual([
-      {
-        transportType: "websocket",
-        url: "wss://daemon.example/ws",
-        headers: { "X-Tenant": "acme", Authorization: "Bearer secret" },
-        protocols: ["paseo.bearer.secret"],
-      },
-    ]);
-  });
 });

packages/app/src/desktop/daemon/desktop-daemon-transport.ts

@@ -2,13 +2,11 @@ import type {
   DaemonTransport,
   DaemonTransportFactory,
 } from "@getpaseo/client/internal/daemon-client";
-import type { DesktopDaemonTransportTarget, LocalTransportTarget } from "./desktop-daemon";
+import type { LocalTransportTarget } from "./desktop-daemon";
 import {
   defaultLocalDaemonTransportRpc,
-  defaultWebSocketDaemonTransportRpc,
   type LocalDaemonTransportRpc,
 } from "./local-daemon-transport-rpc";
-import { isElectronRuntime } from "@/desktop/host";
 
 const LOCAL_TRANSPORT_SCHEME = "paseo+local:";
 
@@ -52,12 +50,11 @@ function parseLocalDaemonTransportUrl(url: string): LocalTransportTarget {
   };
 }
 
-function createDesktopDaemonTransportFactory(
-  resolveTarget: (options: Parameters<DaemonTransportFactory>[0]) => DesktopDaemonTransportTarget,
-  rpc: LocalDaemonTransportRpc,
-): DaemonTransportFactory {
-  return (options) => {
-    const target = resolveTarget(options);
+export function createDesktopLocalDaemonTransportFactory(
+  rpc: LocalDaemonTransportRpc = defaultLocalDaemonTransportRpc,
+): DaemonTransportFactory | null {
+  return ({ url }) => {
+    const target = parseLocalDaemonTransportUrl(url);
     let sessionId: string | null = null;
     let unlisten: (() => void) | null = null;
     let disposed = false;
@@ -190,26 +187,3 @@ function createDesktopDaemonTransportFactory(
     return transport;
   };
 }
-
-export function createDesktopLocalDaemonTransportFactory(
-  rpc: LocalDaemonTransportRpc = defaultLocalDaemonTransportRpc,
-): DaemonTransportFactory | null {
-  return createDesktopDaemonTransportFactory(({ url }) => parseLocalDaemonTransportUrl(url), rpc);
-}
-
-export function createDesktopWebSocketTransportFactory(
-  rpc?: LocalDaemonTransportRpc,
-): DaemonTransportFactory | null {
-  if (!rpc && !isElectronRuntime()) {
-    return null;
-  }
-  return createDesktopDaemonTransportFactory(
-    ({ url, headers, protocols }) => ({
-      transportType: "websocket" as const,
-      url,
-      ...(headers && Object.keys(headers).length > 0 ? { headers } : {}),
-      ...(protocols && protocols.length > 0 ? { protocols } : {}),
-    }),
-    rpc ?? defaultWebSocketDaemonTransportRpc,
-  );
-}

packages/app/src/desktop/daemon/desktop-daemon.ts

@@ -46,16 +46,6 @@ export interface LocalTransportTarget {
   transportPath: string;
 }
 
-export interface WebSocketTransportTarget {
-  [key: string]: unknown;
-  transportType: "websocket";
-  url: string;
-  headers?: Record<string, string>;
-  protocols?: string[];
-}
-
-export type DesktopDaemonTransportTarget = LocalTransportTarget | WebSocketTransportTarget;
-
 interface LocalTransportEventPayload {
   sessionId: string;
   kind: "open" | "message" | "close" | "error";
@@ -203,16 +193,6 @@ export async function openLocalTransportSession(target: LocalTransportTarget): P
   return raw;
 }
 
-export async function openWebSocketTransportSession(
-  target: WebSocketTransportTarget,
-): Promise<string> {
-  const raw = await invokeDesktopCommand<unknown>("open_websocket_daemon_transport", target);
-  if (typeof raw !== "string" || raw.trim().length === 0) {
-    throw new Error("Unexpected WebSocket transport session response.");
-  }
-  return raw;
-}
-
 export async function sendLocalTransportMessage(input: {
   sessionId: string;
   text?: string;

packages/app/src/desktop/daemon/local-daemon-transport-rpc.ts

@@ -2,10 +2,8 @@ import {
   closeLocalTransportSession,
   listenToLocalTransportEvents,
   openLocalTransportSession,
-  openWebSocketTransportSession,
   sendLocalTransportMessage,
-  type DesktopDaemonTransportTarget,
-  type WebSocketTransportTarget,
+  type LocalTransportTarget,
 } from "./desktop-daemon";
 
 export interface LocalDaemonTransportEvent {
@@ -19,7 +17,7 @@ export interface LocalDaemonTransportEvent {
 }
 
 export interface LocalDaemonTransportRpc {
-  openSession(target: DesktopDaemonTransportTarget): Promise<string>;
+  openSession(target: LocalTransportTarget): Promise<string>;
   listenToEvents(handler: (event: LocalDaemonTransportEvent) => void): Promise<() => void>;
   sendMessage(input: { sessionId: string; text?: string; binaryBase64?: string }): Promise<void>;
   closeSession(sessionId: string): Promise<void>;
@@ -31,10 +29,3 @@ export const defaultLocalDaemonTransportRpc: LocalDaemonTransportRpc = {
   sendMessage: sendLocalTransportMessage,
   closeSession: closeLocalTransportSession,
 };
-
-export const defaultWebSocketDaemonTransportRpc: LocalDaemonTransportRpc = {
-  openSession: (target) => openWebSocketTransportSession(target as WebSocketTransportTarget),
-  listenToEvents: listenToLocalTransportEvents,
-  sendMessage: sendLocalTransportMessage,
-  closeSession: closeLocalTransportSession,
-};

packages/app/src/desktop/daemon/test-local-daemon-transport-rpc.ts

@@ -1,4 +1,4 @@
-import type { DesktopDaemonTransportTarget } from "./desktop-daemon";
+import type { LocalTransportTarget } from "./desktop-daemon";
 import type {
   LocalDaemonTransportEvent,
   LocalDaemonTransportRpc,
@@ -11,7 +11,7 @@ export interface RecordedSend {
 }
 
 export interface FakeLocalDaemonTransportRpc extends LocalDaemonTransportRpc {
-  readonly openCalls: DesktopDaemonTransportTarget[];
+  readonly openCalls: LocalTransportTarget[];
   readonly recordedSends: RecordedSend[];
   readonly closedSessions: string[];
   resolveOpen(sessionId: string): void;
@@ -22,7 +22,7 @@ export interface FakeLocalDaemonTransportRpc extends LocalDaemonTransportRpc {
 }
 
 export function createFakeLocalDaemonTransportRpc(): FakeLocalDaemonTransportRpc {
-  const openCalls: DesktopDaemonTransportTarget[] = [];
+  const openCalls: LocalTransportTarget[] = [];
   const recordedSends: RecordedSend[] = [];
   const closedSessions: string[] = [];
   let eventHandler: ((event: LocalDaemonTransportEvent) => void) | null = null;

packages/app/src/desktop/permissions/use-desktop-permissions.ts

@@ -14,13 +14,18 @@ export interface UseDesktopPermissionsReturn {
   snapshot: DesktopPermissionSnapshot | null;
   isRefreshing: boolean;
   requestingPermission: DesktopPermissionKind | null;
-  isSendingTestNotification: boolean;
-  testNotificationError: string | null;
+  testNotificationState: TestNotificationState;
   refreshPermissions: () => Promise<void>;
   requestPermission: (kind: DesktopPermissionKind) => Promise<void>;
   sendTestNotification: () => Promise<void>;
 }
 
+export type TestNotificationState =
+  | { status: "idle" }
+  | { status: "sending" }
+  | { status: "success" }
+  | { status: "error"; message: string };
+
 export function useDesktopPermissions(): UseDesktopPermissionsReturn {
   const { t } = useTranslation();
   const isDesktopApp = shouldShowDesktopPermissionSection();
@@ -30,7 +35,9 @@ export function useDesktopPermissions(): UseDesktopPermissionsReturn {
   const [requestingPermission, setRequestingPermission] = useState<DesktopPermissionKind | null>(
     null,
   );
-  const [isSendingTestNotification, setIsSendingTestNotification] = useState(false);
+  const [testNotificationState, setTestNotificationState] = useState<TestNotificationState>({
+    status: "idle",
+  });
 
   useEffect(() => {
     return () => {
@@ -111,28 +118,34 @@ export function useDesktopPermissions(): UseDesktopPermissionsReturn {
     [isDesktopApp, refreshPermissions, t],
   );
 
-  const [testNotificationError, setTestNotificationError] = useState<string | null>(null);
-
   const sendTestNotification = useCallback(async () => {
     if (!isDesktopApp) {
       return;
     }
 
-    setIsSendingTestNotification(true);
-    setTestNotificationError(null);
+    setTestNotificationState({ status: "sending" });
     try {
       const sent = await sendOsNotification({
         title: t("desktop.permissions.testNotification.title"),
         body: t("desktop.permissions.testNotification.body"),
       });
-      if (!sent) {
-        setTestNotificationError(t("desktop.permissions.testNotification.notDelivered"));
+      if (!isMountedRef.current) {
+        return;
       }
+      setTestNotificationState(
+        sent
+          ? { status: "success" }
+          : {
+              status: "error",
+              message: t("desktop.permissions.testNotification.notDelivered"),
+            },
+      );
     } catch {
-      setTestNotificationError(t("desktop.permissions.testNotification.failed"));
-    } finally {
       if (isMountedRef.current) {
-        setIsSendingTestNotification(false);
+        setTestNotificationState({
+          status: "error",
+          message: t("desktop.permissions.testNotification.failed"),
+        });
       }
     }
   }, [isDesktopApp, t]);
@@ -150,8 +163,7 @@ export function useDesktopPermissions(): UseDesktopPermissionsReturn {
     snapshot,
     isRefreshing,
     requestingPermission,
-    isSendingTestNotification,
-    testNotificationError,
+    testNotificationState,
     refreshPermissions,
     requestPermission,
     sendTestNotification,

packages/app/src/desktop/settings/desktop-settings.ts

@@ -13,6 +13,9 @@ const DESKTOP_SETTINGS_QUERY_KEY = ["desktop-settings"] as const;
 
 export interface DesktopSettings {
   releaseChannel: ReleaseChannel;
+  notifications: {
+    playSound: boolean;
+  };
   daemon: {
     manageBuiltInDaemon: boolean;
     keepRunningAfterQuit: boolean;
@@ -21,11 +24,15 @@ export interface DesktopSettings {
 
 export interface DesktopSettingsPatch {
   releaseChannel?: ReleaseChannel;
+  notifications?: Partial<DesktopSettings["notifications"]>;
   daemon?: Partial<DesktopSettings["daemon"]>;
 }
 
 export const DEFAULT_DESKTOP_SETTINGS: DesktopSettings = {
   releaseChannel: "stable",
+  notifications: {
+    playSound: true,
+  },
   daemon: {
     manageBuiltInDaemon: true,
     keepRunningAfterQuit: false,
@@ -144,10 +151,17 @@ export async function migrateLegacyDesktopSettings(input: {
 
 function parseDesktopSettings(raw: unknown): DesktopSettings {
   const record = isRecord(raw) ? raw : {};
+  const notifications = isRecord(record.notifications) ? record.notifications : {};
   const daemon = isRecord(record.daemon) ? record.daemon : {};
 
   return {
     releaseChannel: record.releaseChannel === "beta" ? "beta" : "stable",
+    notifications: {
+      playSound:
+        typeof notifications.playSound === "boolean"
+          ? notifications.playSound
+          : DEFAULT_DESKTOP_SETTINGS.notifications.playSound,
+    },
     daemon: {
       manageBuiltInDaemon:
         typeof daemon.manageBuiltInDaemon === "boolean"
@@ -167,6 +181,10 @@ function mergeDesktopSettings(
 ): DesktopSettings {
   return {
     releaseChannel: updates.releaseChannel ?? current.releaseChannel,
+    notifications: {
+      ...current.notifications,
+      ...updates.notifications,
+    },
     daemon: {
       ...current.daemon,
       ...updates.daemon,
@@ -177,6 +195,7 @@ function mergeDesktopSettings(
 function normalizePatch(updates: DesktopSettingsPatch): Record<string, unknown> {
   return {
     ...(updates.releaseChannel ? { releaseChannel: updates.releaseChannel } : {}),
+    ...(updates.notifications ? { notifications: updates.notifications } : {}),
     ...(updates.daemon ? { daemon: updates.daemon } : {}),
   };
 }

packages/app/src/hooks/use-fine-pointer.ts

@@ -0,0 +1,40 @@
+import { useEffect, useState } from "react";
+import { isWeb } from "@/constants/platform";
+
+// A touch tablet running the desktop layout is still `isWeb === false || true`
+// depending on the build, so neither platform gate answers "can this user
+// hover and point precisely". Only the media query does.
+const FINE_POINTER_QUERY = "(hover: hover) and (pointer: fine)";
+
+function getFinePointerQueryList(): MediaQueryList | null {
+  if (!isWeb || typeof window === "undefined" || typeof window.matchMedia !== "function") {
+    return null;
+  }
+  return window.matchMedia(FINE_POINTER_QUERY);
+}
+
+/** True when a mouse-like pointer drives the UI. Always false on native. */
+export function hasFinePointer(): boolean {
+  return getFinePointerQueryList()?.matches ?? false;
+}
+
+/**
+ * Reactive `hasFinePointer()` — re-renders when the user switches between a
+ * mouse and touch (detachable keyboards, tablet mode).
+ */
+export function useHasFinePointer(): boolean {
+  const [finePointer, setFinePointer] = useState(hasFinePointer);
+
+  useEffect(() => {
+    const mediaQuery = getFinePointerQueryList();
+    if (!mediaQuery) return;
+    const handleChange = () => setFinePointer(mediaQuery.matches);
+    handleChange();
+    mediaQuery.addEventListener?.("change", handleChange);
+    return () => {
+      mediaQuery.removeEventListener?.("change", handleChange);
+    };
+  }, []);
+
+  return finePointer;
+}

packages/app/src/hooks/use-keyboard-shortcut-overrides.ts

@@ -1,16 +1,21 @@
-import { useCallback } from "react";
 import AsyncStorage from "@react-native-async-storage/async-storage";
-import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { type QueryClient, useQuery, useQueryClient } from "@tanstack/react-query";
+import type { ShortcutOverrides } from "@/keyboard/keyboard-shortcuts";
+import {
+  createShortcutOverrideStore,
+  type ShortcutOverrideStore,
+} from "@/keyboard/shortcut-override-store";
 
 const STORAGE_KEY = "@paseo:keyboard-shortcut-overrides";
 const QUERY_KEY = ["keyboard-shortcut-overrides"];
 
-const EMPTY_OVERRIDES: Record<string, string> = {};
+const EMPTY_OVERRIDES: ShortcutOverrides = {};
 
 export interface UseKeyboardShortcutOverridesReturn {
-  overrides: Record<string, string>;
+  overrides: ShortcutOverrides;
   isLoading: boolean;
   setOverride: (bindingId: string, comboString: string) => Promise<void>;
+  clearOverride: (bindingId: string) => Promise<void>;
   removeOverride: (bindingId: string) => Promise<void>;
   resetAll: () => Promise<void>;
   hasOverrides: boolean;
@@ -25,48 +30,55 @@ export function useKeyboardShortcutOverrides(): UseKeyboardShortcutOverridesRetu
     gcTime: Infinity,
   });
 
-  const setOverride = useCallback(
-    async (bindingId: string, comboString: string) => {
-      const prev = queryClient.getQueryData<Record<string, string>>(QUERY_KEY) ?? EMPTY_OVERRIDES;
-      const next = { ...prev, [bindingId]: comboString };
-      queryClient.setQueryData<Record<string, string>>(QUERY_KEY, next);
-      await AsyncStorage.setItem(STORAGE_KEY, JSON.stringify(next));
-    },
-    [queryClient],
-  );
-
-  const removeOverride = useCallback(
-    async (bindingId: string) => {
-      const prev = queryClient.getQueryData<Record<string, string>>(QUERY_KEY) ?? EMPTY_OVERRIDES;
-      const { [bindingId]: _, ...next } = prev;
-      queryClient.setQueryData<Record<string, string>>(QUERY_KEY, next);
-      await AsyncStorage.setItem(STORAGE_KEY, JSON.stringify(next));
-    },
-    [queryClient],
-  );
-
-  const resetAll = useCallback(async () => {
-    queryClient.setQueryData<Record<string, string>>(QUERY_KEY, EMPTY_OVERRIDES);
-    await AsyncStorage.removeItem(STORAGE_KEY);
-  }, [queryClient]);
-
+  const store = getStore(queryClient);
   const overrides = data ?? EMPTY_OVERRIDES;
 
   return {
     overrides,
     isLoading: isPending,
-    setOverride,
-    removeOverride,
-    resetAll,
+    setOverride: store.set,
+    clearOverride: store.clear,
+    removeOverride: store.remove,
+    resetAll: store.resetAll,
     hasOverrides: Object.keys(overrides).length > 0,
   };
 }
 
-async function loadOverridesFromStorage(): Promise<Record<string, string>> {
+/**
+ * One store per query client. Every component that calls the hook has to share
+ * a single write queue -- a store per hook instance would give each its own
+ * queue and reintroduce the interleaving the store exists to prevent.
+ */
+const stores = new WeakMap<QueryClient, ShortcutOverrideStore>();
+
+function getStore(queryClient: QueryClient): ShortcutOverrideStore {
+  const existing = stores.get(queryClient);
+  if (existing) return existing;
+
+  const created = createShortcutOverrideStore({
+    cache: {
+      read: () => queryClient.getQueryData<ShortcutOverrides>(QUERY_KEY) ?? EMPTY_OVERRIDES,
+      write: (next) => {
+        queryClient.setQueryData<ShortcutOverrides>(QUERY_KEY, next);
+      },
+    },
+    storage: {
+      write: (serialized) => AsyncStorage.setItem(STORAGE_KEY, serialized),
+      remove: () => AsyncStorage.removeItem(STORAGE_KEY),
+    },
+    onError: (err) => {
+      console.error("[KeyboardShortcutOverrides] Failed to save overrides:", err);
+    },
+  });
+  stores.set(queryClient, created);
+  return created;
+}
+
+async function loadOverridesFromStorage(): Promise<ShortcutOverrides> {
   try {
     const stored = await AsyncStorage.getItem(STORAGE_KEY);
     if (stored) {
-      return JSON.parse(stored) as Record<string, string>;
+      return JSON.parse(stored) as ShortcutOverrides;
     }
   } catch (err) {
     console.error("[KeyboardShortcutOverrides] Failed to load overrides:", err);

packages/app/src/hooks/use-keyboard-shortcuts.ts

@@ -71,6 +71,7 @@ export function useKeyboardShortcuts({
   const openProjectPickerAction = useOpenAddProject();
   const activeWorkspaceSelection = useActiveWorkspaceSelection();
   const keyboardWorkspaceSelectionRef = useRef<ActiveWorkspaceSelection | null>(null);
+  const badgeModifierKeyRef = useRef<string | null | undefined>(undefined);
 
   const publishBrowserShortcutPolicy = useCallback(
     (chordState?: ChordState) => {
@@ -110,7 +111,13 @@ export function useKeyboardShortcuts({
     // runtime should reveal the sidebar number badges (Alt on web, Cmd on
     // desktop Mac, Ctrl on desktop non-Mac). The store ORs altDown/cmdOrCtrlDown
     // to drive badge visibility, so we set the flag matching this runtime.
-    const badgeModifierKey = getWorkspaceIndexJumpModifierKey({ isMac, isDesktop: isDesktopApp });
+    // Derived from the effective bindings: `null` when the user unassigned or
+    // rebound the jump shortcut, and no `event.key` ever equals null, so the
+    // badges simply never appear.
+    const badgeModifierKey = getWorkspaceIndexJumpModifierKey(
+      { isMac, isDesktop: isDesktopApp },
+      bindings,
+    );
     const setBadgeModifierDown = (down: boolean) => {
       const state = useKeyboardShortcutsStore.getState();
       if (isDesktopApp) {
@@ -120,6 +127,16 @@ export function useKeyboardShortcuts({
       }
     };
 
+    // The keyup listener matches the released key against the modifier derived
+    // when the effect last ran, so a modifier held while the jump binding
+    // changes can never be released -- the badges would stay up until a blur.
+    // Clear on change only: this effect also re-runs on every navigation, and
+    // clearing unconditionally would drop the badges mid Cmd+1, Cmd+2.
+    if (badgeModifierKeyRef.current !== badgeModifierKey) {
+      badgeModifierKeyRef.current = badgeModifierKey;
+      resetModifiers();
+    }
+
     const shouldHandle = () => {
       if (typeof document === "undefined") return false;
       if (document.visibilityState !== "visible") return false;
@@ -184,7 +201,9 @@ export function useKeyboardShortcuts({
               setCommandCenterFocusRestoreElement(browserFocusRestoreElement);
             }
           }
-          useKeyboardShortcutsStore.getState().setCommandCenterOpen(action.nextOpen);
+          useKeyboardShortcutsStore
+            .getState()
+            .setCommandCenterOpen(action.nextOpen, action.scope ?? null);
           return true;
         }
         case "shortcuts-dialog-toggle":

packages/app/src/hooks/use-settings/fakes.ts

@@ -29,6 +29,9 @@ export interface FakeDesktopBridge extends DesktopSettingsBridge {
 
 const DEFAULT_DESKTOP: DesktopSettings = {
   releaseChannel: "stable",
+  notifications: {
+    playSound: true,
+  },
   daemon: {
     manageBuiltInDaemon: true,
     keepRunningAfterQuit: false,

packages/app/src/hooks/use-settings/storage.test.ts

@@ -255,6 +255,7 @@ describe("loadSettingsFromStorage", () => {
       isElectron: true,
       settings: {
         releaseChannel: "beta",
+        notifications: { playSound: true },
         daemon: { manageBuiltInDaemon: false, keepRunningAfterQuit: true },
       },
     });

packages/app/src/i18n/resources.test.ts

@@ -190,7 +190,11 @@ describe("translation resources", () => {
     expect(en.shell.menu.toggleSidebar).toBe("Toggle sidebar");
     expect(en.shell.menu.open).toBe("Open menu");
     expect(en.shell.menu.close).toBe("Close menu");
-    expect(en.shell.commandCenter.placeholder).toBe("Search commands, workspaces, and agents...");
+    expect(en.shell.commandCenter.placeholder).toBe(
+      "Search commands, files, workspaces, and agents...",
+    );
+    expect(en.shell.commandCenter.filePlaceholder).toBe("Search files...");
+    expect(en.shell.commandCenter.files).toBe("Files");
     expect(en.shell.commandCenter.noMatches).toBe("No matches");
     expect(en.shell.commandCenter.actions).toBe("Actions");
     expect(en.shell.commandCenter.workspaces).toBe("Workspaces");
@@ -246,7 +250,9 @@ describe("translation resources", () => {
     expect(en.settings.shortcuts.actions.rebind).toBe("Rebind");
     expect(en.settings.integrations.commandLine.title).toBe("Command line");
     expect(en.settings.integrations.skills.updateAvailable).toBe("Update available");
-    expect(en.settings.permissions.notifications).toBe("Notifications");
+    expect(en.settings.notifications.playSound).toBe("Play sound");
+    expect(en.settings.notifications.permission).toBe("Notification permission");
+    expect(en.settings.notifications.sentTitle).toBe("Test notification sent");
     expect(en.settings.permissions.actions.request).toBe("Request");
   });
 

packages/app/src/i18n/resources/ar.ts

@@ -54,9 +54,12 @@ export const ar: TranslationResources = {
       close: "إغلاق القائمة",
     },
     commandCenter: {
-      placeholder: "ابحث في الأوامر ومساحات العمل والوكلاء...",
+      placeholder: "ابحث في الأوامر والملفات ومساحات العمل والوكلاء...",
+      filePlaceholder: "البحث في الملفات...",
+      searchingFiles: "جارٍ البحث في الملفات...",
       noMatches: "لا توجد مباريات",
       actions: "الإجراءات",
+      files: "الملفات",
       workspaces: "مساحات العمل",
       agents: "الوكلاء",
       newAgent: "وكيل جديد",
@@ -1243,7 +1246,6 @@ export const ar: TranslationResources = {
     },
   },
   rootError: {
-    kicker: "حدث خطأ",
     title: "واجه Paseo مشكلة.",
     body: "جرّب مرة أخرى لإعادة تحميل التطبيق. إذا استمر حدوث ذلك، فأرفق التفاصيل أدناه عند الإبلاغ عنه.",
     details: "التفاصيل",
@@ -1427,19 +1429,6 @@ export const ar: TranslationResources = {
         show: "عرض متقدم",
         hide: "إخفاء المتقدمة",
       },
-      headers: {
-        title: "رؤوس مخصصة",
-        add: "إضافة رأس",
-        name: "الاسم",
-        value: "القيمة",
-        remove: "إزالة الرأس",
-        errors: {
-          missingName: "أدخل اسمًا لكل رأس",
-          invalidName: "{{name}} ليس اسم رأس صالحًا",
-          invalidValue: "يحتوي {{name}} على فاصل أسطر غير صالح",
-          duplicateName: "تم إدخال {{name}} أكثر من مرة",
-        },
-      },
       passwordVisibility: {
         show: "إظهار كلمة المرور",
         hide: "إخفاء كلمة المرور",
@@ -1704,6 +1693,7 @@ export const ar: TranslationResources = {
       editor: "المحرر",
       shortcuts: "الاختصارات",
       integrations: "التكامل",
+      notifications: "الإشعارات",
       permissions: "الأذونات",
       diagnostics: "التشخيص",
       about: "عن",
@@ -1713,6 +1703,21 @@ export const ar: TranslationResources = {
       vimKeybindings: "اختصارات Vim",
       vimHint: "تنطبق على ملفات المصدر في الويب وسطح المكتب.",
     },
+    notifications: {
+      title: "الإشعارات",
+      permission: "إذن الإشعارات",
+      refreshAccessibility: "تحديث إذن الإشعارات",
+      playSound: "تشغيل صوت",
+      playSoundHint: "تشغيل صوت عند وصول إشعار سطح مكتب",
+      test: "اختبار الإشعار",
+      testHint: "إرسال إشعار باستخدام هذه الإعدادات",
+      permissionRequired: "اسمح بالوصول إلى الإشعارات قبل الاختبار",
+      send: "إرسال",
+      sending: "جارٍ الإرسال...",
+      sentTitle: "تم إرسال إشعار الاختبار",
+      sentDescription: "سلّم Paseo الإشعار إلى نظام التشغيل.",
+      sendFailedTitle: "تعذر إرسال إشعار الاختبار",
+    },
     hostSections: {
       projects: "المشاريع",
       connections: "اتصالات",
@@ -1859,6 +1864,7 @@ export const ar: TranslationResources = {
           midnight: "منتصف الليل",
           claude: "كلود",
           ghostty: "شبحي",
+          pureBlack: "أسود خالص",
           auto: "نظام",
         },
       },
@@ -1897,18 +1903,22 @@ export const ar: TranslationResources = {
       searchPlaceholder: "البحث في الاختصارات",
       unavailableOnMobile: "اختصارات لوحة المفاتيح متاحة فقط على سطح المكتب",
       capturePrompt: "اضغط على الاختصار...",
+      unassigned: "غير معين",
       actions: {
+        menu: "إجراءات {{name}}",
         done: "منتهي",
         cancel: "يلغي",
+        bind: "ربط",
         rebind: "إعادة ربط",
-        reset: "إعادة ضبط",
+        clear: "مسح",
+        reset: "إعادة الضبط إلى الافتراضي",
         resetAll: "إعادة ضبط الكل",
       },
       sections: {
-        navigation: "ملاحة",
+        general: "عام",
+        workspaces: "المشاريع ومساحات العمل",
         tabsPanes: "علامات التبويب والأجزاء",
-        projects: "المشاريع",
-        panels: "لوحات",
+        layout: "التخطيط",
         agentInput: "إدخال Agent",
       },
       help: {
@@ -1936,6 +1946,7 @@ export const ar: TranslationResources = {
         moveTabDown: "حرك علامة التبويب لأسفل",
         closePane: "إغلاق الجزء",
         newTerminal: "محطة جديدة",
+        searchFiles: "البحث في الملفات",
         toggleCommandCenter: "تبديل مركز القيادة",
         showKeyboardShortcuts: "إظهار اختصارات لوحة المفاتيح",
         toggleLeftSidebar: "تبديل الشريط الجانبي الأيسر",
@@ -2007,17 +2018,14 @@ export const ar: TranslationResources = {
     },
     permissions: {
       title: "الأذونات",
-      notifications: "إشعارات",
       microphone: "ميكروفون",
       refresh: "ينعش",
       refreshing: "منعش...",
       refreshAccessibility: "تحديث أذونات سطح المكتب",
-      test: "امتحان",
       actions: {
         granted: "ممنوح",
         request: "طلب",
         requesting: "جارٍ الطلب...",
-        busySuffix: "{{label}}...",
       },
     },
     host: {

packages/app/src/i18n/resources/en.ts

@@ -52,9 +52,12 @@ export const en = {
       close: "Close menu",
     },
     commandCenter: {
-      placeholder: "Search commands, workspaces, and agents...",
+      placeholder: "Search commands, files, workspaces, and agents...",
+      filePlaceholder: "Search files...",
+      searchingFiles: "Searching files...",
       noMatches: "No matches",
       actions: "Actions",
+      files: "Files",
       workspaces: "Workspaces",
       agents: "Agents",
       newAgent: "New agent",
@@ -1253,7 +1256,6 @@ export const en = {
     },
   },
   rootError: {
-    kicker: "Something went wrong",
     title: "Paseo ran into a problem.",
     body: "Try again to reload the app. If this keeps happening, include the details below when you report it.",
     details: "Details",
@@ -1438,19 +1440,6 @@ export const en = {
         show: "Show advanced",
         hide: "Hide advanced",
       },
-      headers: {
-        title: "Custom headers",
-        add: "Add header",
-        name: "Name",
-        value: "Value",
-        remove: "Remove header",
-        errors: {
-          missingName: "Enter a name for each header",
-          invalidName: "{{name}} is not a valid header name",
-          invalidValue: "{{name}} contains an invalid line break",
-          duplicateName: "{{name}} is entered more than once",
-        },
-      },
       passwordVisibility: {
         show: "Show password",
         hide: "Hide password",
@@ -1715,6 +1704,7 @@ export const en = {
       editor: "Editor",
       shortcuts: "Shortcuts",
       integrations: "Integrations",
+      notifications: "Notifications",
       permissions: "Permissions",
       diagnostics: "Diagnostics",
       about: "About",
@@ -1724,6 +1714,21 @@ export const en = {
       vimKeybindings: "Vim keybindings",
       vimHint: "Applies to source files on web and desktop.",
     },
+    notifications: {
+      title: "Notifications",
+      permission: "Notification permission",
+      refreshAccessibility: "Refresh notification permission",
+      playSound: "Play sound",
+      playSoundHint: "Play a sound when a desktop notification arrives",
+      test: "Test notification",
+      testHint: "Send a notification using these settings",
+      permissionRequired: "Allow notification access before testing",
+      send: "Send",
+      sending: "Sending...",
+      sentTitle: "Test notification sent",
+      sentDescription: "Paseo handed the notification to the operating system.",
+      sendFailedTitle: "Unable to send test notification",
+    },
     hostSections: {
       projects: "Projects",
       connections: "Connections",
@@ -1869,6 +1874,7 @@ export const en = {
           midnight: "Midnight",
           claude: "Claude",
           ghostty: "Ghostty",
+          pureBlack: "Pure black",
           auto: "System",
         },
       },
@@ -1907,18 +1913,22 @@ export const en = {
       searchPlaceholder: "Search shortcuts",
       unavailableOnMobile: "Keyboard shortcuts are only available on desktop",
       capturePrompt: "Press shortcut...",
+      unassigned: "Not set",
       actions: {
+        menu: "Actions for {{name}}",
         done: "Done",
         cancel: "Cancel",
+        bind: "Bind",
         rebind: "Rebind",
-        reset: "Reset",
+        clear: "Clear",
+        reset: "Reset to default",
         resetAll: "Reset all",
       },
       sections: {
-        navigation: "Navigation",
+        general: "General",
+        workspaces: "Projects & Workspaces",
         tabsPanes: "Tabs & Panes",
-        projects: "Projects",
-        panels: "Panels",
+        layout: "Layout",
         agentInput: "Agent Input",
       },
       help: {
@@ -1946,6 +1956,7 @@ export const en = {
         moveTabDown: "Move tab down",
         closePane: "Close pane",
         newTerminal: "New terminal",
+        searchFiles: "Search files",
         toggleCommandCenter: "Toggle command center",
         showKeyboardShortcuts: "Show keyboard shortcuts",
         toggleLeftSidebar: "Toggle left sidebar",
@@ -2018,17 +2029,14 @@ export const en = {
     },
     permissions: {
       title: "Permissions",
-      notifications: "Notifications",
       microphone: "Microphone",
       refresh: "Refresh",
       refreshing: "Refreshing...",
       refreshAccessibility: "Refresh desktop permissions",
-      test: "Test",
       actions: {
         granted: "Granted",
         request: "Request",
         requesting: "Requesting...",
-        busySuffix: "{{label}}...",
       },
     },
     host: {

packages/app/src/i18n/resources/es.ts

@@ -54,9 +54,12 @@ export const es: TranslationResources = {
       close: "Cerrar menú",
     },
     commandCenter: {
-      placeholder: "Buscar comandos, espacios de trabajo y agentes...",
+      placeholder: "Buscar comandos, archivos, espacios de trabajo y agentes...",
+      filePlaceholder: "Buscar archivos...",
+      searchingFiles: "Buscando archivos...",
       noMatches: "No hay coincidencias",
       actions: "Comportamiento",
+      files: "Archivos",
       workspaces: "Espacios de trabajo",
       agents: "Agentes",
       newAgent: "Nuevo agente",
@@ -1283,7 +1286,6 @@ export const es: TranslationResources = {
     },
   },
   rootError: {
-    kicker: "Algo salió mal",
     title: "Paseo tuvo un problema.",
     body: "Vuelve a intentarlo para recargar la app. Si sigue ocurriendo, incluye los detalles de abajo al reportarlo.",
     details: "Detalles",
@@ -1468,19 +1470,6 @@ export const es: TranslationResources = {
         show: "Mostrar avanzado",
         hide: "Ocultar avanzado",
       },
-      headers: {
-        title: "Encabezados personalizados",
-        add: "Añadir encabezado",
-        name: "Nombre",
-        value: "Valor",
-        remove: "Eliminar encabezado",
-        errors: {
-          missingName: "Introduce un nombre para cada encabezado",
-          invalidName: "{{name}} no es un nombre de encabezado válido",
-          invalidValue: "{{name}} contiene un salto de línea no válido",
-          duplicateName: "{{name}} se ha introducido más de una vez",
-        },
-      },
       passwordVisibility: {
         show: "Mostrar contraseña",
         hide: "Ocultar contraseña",
@@ -1747,6 +1736,7 @@ export const es: TranslationResources = {
       editor: "Editor",
       shortcuts: "Atajos",
       integrations: "Integraciones",
+      notifications: "Notificaciones",
       permissions: "Permisos",
       diagnostics: "Diagnóstico",
       about: "Acerca de",
@@ -1756,6 +1746,21 @@ export const es: TranslationResources = {
       vimKeybindings: "Atajos de Vim",
       vimHint: "Se aplica a archivos fuente en web y escritorio.",
     },
+    notifications: {
+      title: "Notificaciones",
+      permission: "Permiso de notificaciones",
+      refreshAccessibility: "Actualizar permiso de notificaciones",
+      playSound: "Reproducir sonido",
+      playSoundHint: "Reproduce un sonido cuando llega una notificación de escritorio",
+      test: "Probar notificación",
+      testHint: "Envía una notificación con esta configuración",
+      permissionRequired: "Permite el acceso a las notificaciones antes de probar",
+      send: "Enviar",
+      sending: "Enviando...",
+      sentTitle: "Notificación de prueba enviada",
+      sentDescription: "Paseo entregó la notificación al sistema operativo.",
+      sendFailedTitle: "No se pudo enviar la notificación de prueba",
+    },
     hostSections: {
       projects: "Proyectos",
       connections: "Conexiones",
@@ -1906,6 +1911,7 @@ export const es: TranslationResources = {
           midnight: "Medianoche",
           claude: "claudio",
           ghostty: "fantasmal",
+          pureBlack: "Negro puro",
           auto: "Sistema",
         },
       },
@@ -1945,18 +1951,22 @@ export const es: TranslationResources = {
       searchPlaceholder: "Buscar atajos",
       unavailableOnMobile: "Los atajos de teclado solo están disponibles en el escritorio",
       capturePrompt: "Presione el acceso directo...",
+      unassigned: "Sin asignar",
       actions: {
+        menu: "Acciones para {{name}}",
         done: "Hecho",
         cancel: "Cancelar",
+        bind: "Asignar",
         rebind: "Reencuadernar",
-        reset: "Reiniciar",
+        clear: "Borrar",
+        reset: "Restablecer al valor predeterminado",
         resetAll: "Restablecer todo",
       },
       sections: {
-        navigation: "Navegación",
+        general: "General",
+        workspaces: "Proyectos y espacios de trabajo",
         tabsPanes: "Pestañas y paneles",
-        projects: "Proyectos",
-        panels: "Paneles",
+        layout: "Diseño",
         agentInput: "EntradaAgent",
       },
       help: {
@@ -1984,6 +1994,7 @@ export const es: TranslationResources = {
         moveTabDown: "Mover pestaña hacia abajo",
         closePane: "Cerrar panel",
         newTerminal: "Nueva terminal",
+        searchFiles: "Buscar archivos",
         toggleCommandCenter: "Alternar centro de comando",
         showKeyboardShortcuts: "Mostrar atajos de teclado",
         toggleLeftSidebar: "Alternar barra lateral izquierda",
@@ -2057,17 +2068,14 @@ export const es: TranslationResources = {
     },
     permissions: {
       title: "Permisos",
-      notifications: "Notificaciones",
       microphone: "Micrófono",
       refresh: "Refrescar",
       refreshing: "Refrescante...",
       refreshAccessibility: "Actualizar permisos de escritorio",
-      test: "Prueba",
       actions: {
         granted: "Otorgada",
         request: "Pedido",
         requesting: "Solicitando...",
-        busySuffix: "{{label}}...",
       },
     },
     host: {