review fixes: block Codeman's own credential-bearing JSON, make the inside-anchor test bite

Widening the servable extensions to EDITABLE_EXTENSIONS made ~/.codeman
JSON previewable for the first time, and the blocklist named only
state.json. But settings.json holds a credential BY SCHEMA
(voiceSettings.apiKey), push-keys.json holds the VAPID PRIVATE key, and
intents.json is written 0600 precisely because captured prompts can carry
secrets — all three were one authenticated click away once an agent
printed the path. Blocked alongside state.json, whose rule now also
catches state-* siblings.

The never-re-cuts-inside-an-anchor test used an unmatchable URL tail, so
it passed with the guard deleted; the fixture now carries a matchable
/tmp path.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

.changeset/9008093b.md

@@ -1,9 +0,0 @@
----
-"aicodeman": minor
----
-
-Add an optional collapsible left session sidebar as an alternative to the header tab strip.
-
-With many concurrent sessions the horizontal strip wraps into several rows and stops being scannable. The new layout puts the session list in a vertical `<aside>` with a filter box and a live session count, collapsible to a 44px rail that keeps the status dots and task badges visible.
-
-Opt-in via Settings → Layout → Tabs → Session List Layout; the default stays the header strip, so nothing changes unless you switch. Both layouts share one `#sessionTabs` element that is re-parented between mount points, so every existing affordance (status, mode badge, alerts, drag-reorder, keyboard navigation, web tabs, subagent windows) behaves identically in both. Below 1024px the sidebar is an off-canvas drawer that overlays the terminal instead of shrinking it. Collapse state persists per device; `Alt+B` toggles it.

CLAUDE.md

@@ -230,6 +230,8 @@ Codeman is a Claude Code session manager with web interface and autonomous Ralph
 
 **Attachments** (live external document references; all wiring in `file-routes.ts`): a **registry** maps a stable `attachmentId` to a realpath-resolved, extension-allowlisted absolute path, so browser requests never carry arbitrary absolute paths. ⚠️ The **magic-link scanner** (`codeman://attach?...` in terminal output) is **prompt-injectable**, so its scan path is force-confined to the session workspace; a hostile prompt could otherwise exfiltrate arbitrary host files over SSE. The security gate is an extension **allowlist**, not a blocklist. `document-conversion-limiter.ts` caps converter spawns globally: without it, N large docs detected at once fork N multi-minute processes, which is a resource-exhaustion vector. → [architecture-invariants#attachments](docs/architecture-invariants.md#attachments)
 
+**File-path links (terminal + chat)**: a path an agent prints is clickable on BOTH surfaces and opens the file-preview overlay. ⚠️ ONE pattern (`FILE_PATH_LINK_PATTERN` / `absoluteFilePathPattern()` in constants.js) feeds the xterm link provider AND the response viewer's `_linkifyFilePaths()`; a fresh instance per call, since `lastIndex` is per-object state. The chat linkifier walks TEXT NODES with DOM APIs (the source is model output; never rebuild sanitized markup as a string) and skips subtrees already inside an `<a>`. ⚠️ **An out-of-workspace path is served through the ATTACHMENT routes, not the file routes** — `file-content`/`file-raw` are workspace-confined and 404 exactly the paths agents print most (a `/tmp` capture, Claude's scratchpad), so `openFilePreview()` registers such a path via `POST /api/sessions/:id/attachments` with **`notify: false`** (suppresses only the `attachment:detected` broadcast — same guard, same routes; without it every click also popped a card announcing the file already on screen) and renders by id. The click is an explicit action on the explicit, Origin-guarded route, which is what distinguishes it from the force-confined magic-link scanner. ⚠️ **Media extensions are single-sourced** (`VIDEO_ATTACHMENT_EXTENSIONS`/`AUDIO_ATTACHMENT_EXTENSIONS` in `attachment-registry.ts`, imported by `file-content`'s classification) so a clip plays the same in or out of the workspace; a player needs all THREE of allowlist + a real `MIME_TYPES` entry (octet-stream renders a dead player) + the range-aware body. ⚠️ **`TEXT_ATTACHMENT_EXTENSIONS` IS `EDITABLE_EXTENSIONS`** (never a second list): if the viewer would edit it inside the workspace, it can be read outside. Widening READ must never widen RUN, so `html`/`htm` joined `svg` in `serveRawFile`'s download-only branch, other text goes out as inert `text/plain`+`nosniff`, and `~/.codeman*/state.json` joined `isSensitivePath` (it persists `envOverrides`, which can hold `GEMINI_API_KEY`). ⚠️ The terminal sends an **out-of-workspace** path to the preview instead of the log viewer (that one spawns `tail -f` and reaches only workspace + `/var/log` + `~/logs`); in-workspace text keeps the tail viewer and `file-stream-manager`'s allowlist is untouched. The image-watcher keeps its own narrow detection list, so none of this cards every file an agent writes. → [architecture-invariants#file-path-links-terminal--response-viewer](docs/architecture-invariants.md#file-path-links-terminal--response-viewer)
+
 **Filesystem path picker** (Link Existing "Browse" + the mobile keyboard's `📁 Path` key): lazy one-directory browsing via `GET /api/filesystem/browse`, with `GET /api/filesystem/preview` for the tapped file. Inserts the path **without** Enter, so the prompt is never submitted; the sibling `⌫ All` key clears only the unsent prompt and must never send the agent's `/clear`. ⚠️ This is a **second file-serving surface and inherits neither the attachment confinement nor its ownership scoping** — it allowlists Home, `CASES_DIR`, `/mnt/d` and `CODEMAN_FILE_PICKER_ROOTS`, blocks sensitive trees, and rejects symlink escapes **after** `realpath`. ⚠️ The optional `sessionId` is an ownership boundary that must be `canAccessOwned`-checked by hand (it does not go through `findSessionOrFail`), and in multi-user mode a non-admin gets only their own `userSpacePath` as a root: per-user spaces live INSIDE `homedir()`, so a `Home` root exposes every other user's workspace. Previews go through the same global conversion limiter, and Markdown/TXT/JSON are served as inert `text/plain`. → [architecture-invariants#filesystem-path-picker](docs/architecture-invariants.md#filesystem-path-picker)
 
 **File Viewer edit mode** (issue #212): the file-preview overlay edits workspace text files in place — `GET .../file-content?edit=1` + `PUT /api/sessions/:id/file-content`, policy in `src/config/file-editing.ts`. This is a **third file surface and the only one that WRITES**: read-path confinement (realpath + workspace + ownership) plus sensitive/blocked/`.git` denies and an extension **allowlist**; writes are `wx`-temp + rename (no `O_CREAT` anywhere = edit-in-place is structural); optimistic concurrency via sha256 `baseHash` → 409. ⚠️ `edit=1` never truncates and the client must never save a plain-preview buffer (the 500-line truncation would silently delete the rest). ⚠️ CRLF/UTF-8 guards: EOL re-applied server-side, non-UTF-8 refused via round-trip compare. → [architecture-invariants#file-viewer-edit-mode](docs/architecture-invariants.md#file-viewer-edit-mode), `docs/file-viewer-edit-plan.md`
@@ -296,7 +298,7 @@ Frontend JS modules have `@fileoverview` with `@dependency`/`@loadorder` tags. L
 
 **SSE staleness watchdog** (`computeSseStale()` in constants.js, `_checkSseStale()` + a 5s interval in app.js): an `EventSource` that stops delivering does not always error, so `onerror` never fires, the header dot stays green, and every SSE-driven surface (tab status dots, sessions created on another device, renames) freezes until the user reloads. ⚠️ The 15s server keepalive was an SSE **comment** (`:keepalive`), and comments are **invisible to `EventSource` by spec**, so there was nothing a client could observe: it is now the named `sse:heartbeat` event (`cleanupDeadClients()`, sse-stream-manager.ts), which is exactly why the frame had to change type. ⚠️ Staleness is judged **only while the status is `connected`** and the device is online; that guard is the loop breaker, since a forced `connectSSE()` leaves `connected` immediately and cannot re-fire while a reconnect is in flight. ⚠️ The liveness stamp is applied inside `addListener` itself, so every registered handler (the `_SSE_HANDLER_MAP` wrappers AND the directly-registered ones) feeds it from one place; the heartbeat's own listener is a no-op that exists **only** to be registered, since `EventSource` drops named events nobody listens for. ⚠️ The watchdog interval is cleared at the top of `connectSSE()` and nowhere else (its only teardown path); clearing it elsewhere stacks intervals. Recovery needs no new sync path: the reconnect re-runs `handleInit` → `_resetAllAppState()`. The forced reconnect logs one diagnostic line, because a middlebox that strips heartbeats presents as "silently reconnects every 45s".
 
-**Z-index layers**: subagent windows (1000), plan agents (1100), mobile/tablet fixed header (1200, `mobile.css`), modals on ≤768px (1300 — must beat the fixed header or the modal close button is buried), log viewers (2000), connection-loss overlay (2500, above the fixed header and modals), image popups (3000), local echo overlay (7).
+**Z-index layers**: subagent windows (1000), plan agents (1100), mobile/tablet fixed header (1200, `mobile.css`), modals on ≤768px (1300 — must beat the fixed header or the modal close button is buried), log viewers (2000), connection-loss overlay (2500, above the fixed header and modals), image popups (3000), response viewer (5000, backdrop 4999), file-preview overlay (5100 — must outrank the response viewer, which can launch it; at its old 2000 a path clicked in the chat opened BEHIND the chat), toasts/path picker (10000+, deliberately above the preview), local echo overlay (7).
 
 **Respawn presets**: `solo-work` (3s/60min), `subagent-workflow` (45s/240min), `team-lead` (90s/480min), `ralph-todo` (8s/480min), `overnight-autonomous` (10s/480min).
 

README.md

@@ -683,7 +683,6 @@ Single-digit selection (1-9), color-coded status, token counts, auto-refresh. De
 | `Ctrl/Cmd+Tab`                  | Next session                                                  |
 | `Alt/Option+[` / `Alt/Option+]` | Previous / next session                                       |
 | `Alt/Option+1`-`Alt/Option+9`   | Switch to tab N (physical keys, so macOS Option layouts work) |
-| `Alt/Option+B`                  | Collapse / expand the session sidebar (sidebar layout only)   |
 | `Ctrl+Shift+{` / `Ctrl+Shift+}` | Move active tab left / right                                  |
 | `Ctrl/Cmd+C`                    | Copy selection, or interrupt when nothing is selected         |
 | `Ctrl+Shift+C`                  | Copy selection (never interrupts)                             |

docs/architecture-invariants.md

@@ -122,6 +122,24 @@ Implementation detail extracted from `CLAUDE.md` so that file stays small enough
 
 **Attachments** (live external document references; COD-37/#119 core, COD-38/#120 previews, COD-39/#121 history): all wiring in `file-routes.ts`. **Registry** (`attachment-registry.ts`): an **in-memory** map of a stable `attachmentId` → an absolute, `realpath`-resolved, extension-allowlisted file path, so browser requests (`GET /api/sessions/:id/attachments/:attachmentId/raw`) never carry arbitrary absolute paths; `POST /api/sessions/:id/attachments` registers one. **Magic links** (`attachment-magic.ts`): parses `codeman://attach?...` out of terminal output — ⚠️ this scanner is prompt-injectable, so the scan path is **force-confined to the session workspace** (a hostile prompt could otherwise make it read arbitrary host files over SSE); emits the `attachment:detected` SSE event. Security gate is an extension **allowlist** (`isSupportedAttachmentExtension`, in the registry/magic modules), not a blocklist; a separate path layer (`config/attachment-guard.ts`) confines reads to the workspace (`attachmentConfineToWorkspace`) and blocks sensitive trees (`/root`, `/etc`). **Previews + thumbnails** (COD-38): `:attachmentId/preview` + `:attachmentId/thumbnail` (and the workspace-file equivalents `file-preview`/`file-thumbnail`) render Office docs/PDFs via external converters (`pdftoppm` / LibreOffice `soffice` / Word-COM `powershell`); `document-preview-cache.ts` is a shared disk cache (de-dups _identical_ in-flight inputs), `document-thumbnailer.ts` does best-effort first-page images, and `document-conversion-limiter.ts` is a **global converter-spawn concurrency cap** (`runWithConversionLimit`) — without it, N distinct large docs detected at once fork N multi-minute converter processes = a localhost fork-bomb-shaped resource-exhaustion vector. **History drawer** (COD-39): `session-attachment-history.ts` tracks the last `ATTACHMENT_HISTORY_LIMIT` (100) attachments per session (`Session._attachmentHistory`, persisted via `SessionState.attachmentHistory`, replayed so externals re-register on reconnect); `GET /api/sessions/:id/attachments` is the list endpoint. ⚠️ The history drawer's launcher button is desktop-only — hidden on phones (regression-guarded; see `mobile-header-buttons-policy` test). Session-local files keep using the existing workspace-scoped `file-routes` paths; the registry is only for explicit live externals. **Codex generated artifacts** (COD-166/#150, `generated-artifact-attachments.ts`): codex-mode sessions ALSO scan (ANSI-stripped) output for `Saved to: file:///…` lines and surface those files as attachment cards with a relaxed trust policy — the allow decision runs on the **realpath-resolved** path against `os.homedir()`-anchored `~/.codex` marker dirs (symlink escapes fall back to force-confinement); gated to `mode === 'codex'` only (`source` is a REQUIRED param through the listener-deps chain — a dropped arg here silently kills the feature). Image thumbnails pass through jpg/jpeg/gif/webp.
 
+### File-path links (terminal + response viewer)
+
+A file path an agent prints is a link on both surfaces it can appear on, and clicking it opens the file-preview overlay. Three things make that work and each has bitten:
+
+**One pattern, two consumers.** `FILE_PATH_LINK_PATTERN` / `absoluteFilePathPattern()` live in `constants.js`; the xterm link provider (`registerFilePathLinkProvider`, terminal-ui.js) and the response viewer's `_linkifyFilePaths()` (app.js) both build a fresh instance from it. ⚠️ Fresh per call, never one shared object: `lastIndex` is per-object state on a `/g` regex. The pattern is anchored on a known absolute root and terminated by a known extension, so a fraction (`3/4`) or a date can't match and trailing punctuation stays out. Roots include `Users` and `mnt`, without which nothing was clickable on macOS or WSL. The linear-time guard and the "terminal-ui builds from the factory" structural check are in `test/link-provider-regex.test.ts`.
+
+**The chat linkifier walks text nodes.** `_linkifyFilePaths()` builds anchors with `createElement`/`textContent` on the rendered subtree, never by rebuilding sanitized markup as a string — the source is model output. Subtrees already inside an `<a>` are skipped (marked autolinks URLs; a nested anchor would swallow the click), and the anchor's text is the path verbatim so "copy code" still yields what the agent printed. `test/response-viewer-file-links.test.ts` pins both properties.
+
+**Out-of-workspace paths go through the attachment routes, not the file routes.** `file-content`/`file-raw` resolve against `workingDir` and 404 anything that escapes it, which is correct and unchanged — but the paths agents most often print (a `/tmp` capture, Claude's own scratchpad, another checkout) are exactly that, so clicking one used to report "File not found" for a file sitting on disk. `openFilePreview()` now detects the case (`_isExternalPreviewPath`, a string compare for ROUTING only; the real decision stays server-side) and registers the path via `POST /api/sessions/:id/attachments` first, rendering by id. ⚠️ That registration passes `notify: false`, which suppresses ONLY the `attachment:detected` broadcast — the guard, the registry entry and the by-id routes are identical either way. Without it every click also popped an attachment card announcing the file already filling the screen. ⚠️ The click is an explicit user action on the **explicit, Origin-guarded** registration route, which is why it may cross the workspace boundary at all; the passive magic-link scanner stays force-confined. A type outside `SUPPORTED_ATTACHMENT_EXTENSIONS` (`.svg`, `.bmp`) is refused with a message naming what IS previewable, rather than the registry's own policy term.
+
+⚠️ **The terminal routes an out-of-workspace path to the preview, not the log viewer.** The log viewer spawns `tail -f` and allows only the workspace, `/var/log` and `~/logs`, so an external `.log`/`.json`/code path answered `Path must be within working directory or allowed log directories` while the SAME path clicked in the response viewer previewed fine. `activate()` now checks `_isExternalPreviewPath` alongside `previewsInFileViewer`. In-workspace text keeps the tail viewer, which is the point of it (live follow); nothing widened `file-stream-manager`'s allowlist, so no `tail -f` is spawned on an arbitrary host path.
+
+**Text reuses the edit-mode allowlist; markup stays download-only.** `TEXT_ATTACHMENT_EXTENSIONS` IS `EDITABLE_EXTENSIONS` (`config/file-editing.ts`) rather than a second curated list that would drift from it: if the viewer would open a file for editing inside the workspace, the same file outside it can be read. The justification for widening is that the agent in the session can already `cat` any of these and the picker already previews them, so the suffix was never the confidentiality gate; the path guard is (sensitive-file blocklist, `/root` and `/etc` trees, realpath first). ⚠️ Two consequences had to be handled at the same time: `~/.codeman*/state.json` joined `isSensitivePath` (it persists `SessionState.envOverrides`, and the env allowlist admits key-shaped names like `GEMINI_API_KEY`, so it can hold a live credential), and `html`/`htm` joined `svg` in `serveRawFile`'s **download-only** branch so that widening what can be READ never widens what can RUN on our own origin. Text with no dedicated MIME entry goes out as inert `text/plain; charset=utf-8` + `nosniff`, matching the picker. The by-id text preview is bounded like the workspace one: a `Range` request for the first 512KB (a real partial read, not a discarded 50MB download) plus a 500-line cap, with the footer saying so.
+
+**Media is single-sourced across the two preview paths.** `VIDEO_ATTACHMENT_EXTENSIONS` / `AUDIO_ATTACHMENT_EXTENSIONS` live in `attachment-registry.ts` and are imported by `file-content`'s media classification, so a clip plays identically whether it is in the workspace or reached by id from outside it. They diverged first: the workspace path had its own inline sets and the registry allowlist had no media at all, so a video an agent wrote to `/tmp` was refused as an unsupported type while the same file inside the repo played. ⚠️ Three things have to line up for a player rather than a dead frame: the extension in the allowlist, a **real MIME entry** in `MIME_TYPES` (a `<video>` refuses to decode `application/octet-stream`, which presents as a player that renders and then does nothing), and the range-aware body (`serveRawFile` → `sendFileBody`) that makes the scrub bar work. `getAttachmentType()` returns the `video`/`audio` members of `AttachmentDetectedType` for them; the attachment card has no per-type CSS and its thumbnail falls back to the type label, since `generateFirstPageThumbnail` has no media branch and answers 204. ⚠️ The image-watcher keeps its OWN narrow detection list (`png/pdf/docx/pptx`), so this does not start popping cards for every video an agent writes.
+
+⚠️ **The preview overlay must outrank the panel that launched it.** `.file-preview-overlay` sits at `z-index: 5100`, above the response viewer (5000) and its backdrop (4999); at its historical 2000 a path clicked in the chat opened the overlay *behind* the chat, which reads as a dead link. It stays below the toast/picker band (10000+) so a "Saved" toast still lands on top.
+
 ### Filesystem path picker
 
 **Filesystem path picker** (Link Existing "Browse" button + the extended mobile keyboard's `📁 Path` key): a lazy one-directory-at-a-time browser over `GET /api/filesystem/browse`, with `GET /api/filesystem/preview` serving the tapped file. It starts at the active session's working directory (falling back to `/mnt/d`), hides dot entries, and inserts the chosen path **without** Enter so the prompt is not submitted. The companion `⌫ All` key clears only the current unsent prompt buffer and must never emit the agent's `/clear` command.
@@ -287,12 +305,6 @@ Anatomy: `.set-shell` → `.set-shell-head` (title + `.set-head-actions`) + `.se
 ⚠️ **Claude transcripts are grouped at real human-turn boundaries, not per JSONL row.** A Claude transcript is an append-only event log, so one logical exchange spans many rows: tool-result rows, meta/image/skill rows, compact summaries, task/team notifications, sidechains, replayed assistant snapshots, and multi-block assistant output. Rendering a card per row was the bug: it produced duplicate and truncated cards that looked like the viewer had lost the response. The grouping walks to the next genuine user turn and dedups replayed assistant snapshots while preserving the tool/task/skill/compact/team metadata filtering. Related: a recovered `restored-<uuid8>` tmux placeholder carries a **stale cwd**, so transcript lookup by working directory finds nothing; it rebinds to the matching top-level Claude transcript UUID instead when that match is unambiguous. Tests: `test/routes/session-routes-claude-last-response.test.ts`. Purely client-side (no `renderIndexHtml` step): the template ships with `btn-response-viewer-header--hidden` and `applyHeaderVisibilitySettings()` (settings-ui.js) toggles it after settings load. Hiding must go through that marker class — the base rule is `display:inline-flex !important`, so an inline style can't override it. `showResponseViewer` is in the `displayKeys` per-device set (settings-ui.js), so it does NOT sync across devices.
 **File Viewer button** (header, 1.4.1) is **shown by default on desktop** since `211f3c0` (post-1.8.0): toggle under App Settings → Header & Panels → Header buttons → File Viewer (`showFileViewerButton`, in the per-device `displayKeys` set, fallback default `true`). Purely client-side like the response viewer: the template now ships the button VISIBLE (no `--hidden` class) and `applyHeaderVisibilitySettings()` toggles the `btn-file-viewer--hidden` marker class after settings load; phones still hide it via mobile.css. The button toggles the file-browser panel open/closed without opening the settings modal (`panels-ui.js`). The same commit set the **default desktop header** to WS/CPU/MEM + File Viewer + gear: the token-count chip (`showTokenCount`, no settings-UI toggle) and the lifecycle-log button (`showLifecycleLog`) both default **OFF** now (templates ship them hidden; stored prefs still honored). The plan-usage chip default is unchanged (opt-in, see Plan-usage chip). The **Cron toolbar button** joined the same opt-in pattern in 1.6.0: template ships `btn-cron--hidden`, `applyHeaderVisibilitySettings()` toggles it via the per-device `showCronButton` setting (default OFF, App Settings → Header & Panels → Scheduling); cron jobs themselves are unaffected.
 
-### Session list layout (header strip vs. left sidebar)
-
-**The session list can render as the horizontal header strip (default) or as a collapsible left sidebar** — App Settings → Layout → Tabs → **Session List Layout** (`sessionListLayout: 'header' | 'sidebar'`, in the per-device `displayKeys` set, so it never syncs across devices; also in `SettingsUpdateSchema`, which is `.strict()` — without that entry the server 400s the ENTIRE settings PUT and every unrelated setting silently stops persisting). ⚠️ **There is exactly ONE `#sessionTabs` element and `applySessionListLayout()` RE-PARENTS it** between `#sessionTabsHost` (in `<header>`) and `#sessionSidebarList` (in the `<aside>`, a flex sibling of `.terminal-wrap` so the terminal shrinks and `terminal-ui.js`'s `ResizeObserver` refits xterm on its own). It must never be cloned or rebuilt: `app.$(id)` caches elements by id and NEVER invalidates, and `settings-ui.js` / `webview-tabs.js` resolve the same id independently, so a rebuilt container leaves every consumer writing into a detached orphan — silently, with no error. Everything else is CSS keyed off `html[data-session-list]` / `html[data-sidebar]`, both written by a pre-paint script in `<head>` so the loading skeleton already matches. Consequences: the renderers, drag/keyboard handlers, web tabs (`data-webview-id` rows stay in the same list, keeping the shared Alt+N numbering and the single-active-tab invariant) and the generated gesture bundle (`TAB_SELECTOR`/`DOCK_SELECTOR` match on class names that are unchanged) all need **zero** edits.
-
-⚠️ Collapsed means **different things per viewport**: at 1024px and up the sidebar keeps a 44px icon rail so the ambient signal (status dot, task/subagent/ultracode badges) survives — the Alt+N number, the name/folder and the `sh`/`oc`/`cx`/`gm` mode chip do NOT, because 44px minus paddings and borders is ~34px of content box and the chip lives inside `.tab-info`; below 1024px `mobile.css` turns the sidebar into an off-canvas overlay where collapsed == drawer closed (mirrored into an `.open` class plus `inert`/`aria-hidden`, since `translateX(-100%)` alone leaves every row in the Tab order), it defaults to CLOSED when the user has made no choice, and picking a session or web tab dismisses it. ⚠️ **That 1024px breakpoint is the only handheld test the sidebar may use** (`_isSessionSidebarOverlay()`, mirrored in the pre-paint script): `MobileDetection.getDeviceType()` calls everything from 768px up `'desktop'`, so using it gave 768-1023px the overlay CSS with docked-sidebar logic — drawer opening itself on load, immune to selection and Escape. The toggle chord (default Alt+B) also needs its gate in `terminal-ui.js`'s `attachCustomKeyEventHandler`, or `preventDefault()` in the capture handler still lets xterm write ESC b into the live PTY (same trap as COD-153). The sidebar filter only applies while its input is on screen — `applySidebarFilter()` strips the class in the header strip, the collapsed rail and the closed drawer, because a filter with no reachable control hides sessions permanently. Collapse state lives in its OWN `codeman-sidebar-collapsed` key, **not** in the settings blob — `saveAppSettings()` rebuilds that blob from DOM controls, so a key without a control is wiped on every Save. Solo (`/session/:id`) windows never get a sidebar (three guards: `getSessionListLayout()`, the pre-paint script, and `body.solo-mode`), because `#sessionTabs` parked in a `display:none` subtree measures 0/0 for tab overflow and inline rename. The sidebar CSS block sits at the END of `styles.css`, **after** the `html:not([data-skin="og"])` nesting block, and is layout-only — any colour on `.session-tab` there would render correctly on the `og` skin only. Same for the `mobile.css` block: it must stay at the end of the file or the earlier compact-strip rules clip the list to a 36px sliver. Two surfaces DEFER to the sidebar rather than adapt: **lineage arcs are skipped** in sidebar layout (`_appendLineageConnectionLines` early-returns — `computeLineagePath()`'s whole geometry hangs a U-bridge from the horizontal STRIP's bottom edge, so against a vertical list every arc would loop to the foot of the sidebar; a sideways lineage shape needs its own visual tuning, it is not a by-product of re-parenting), and the **desktop home tab rail** (`shouldShowHomeSessions()`) stays hidden while the sidebar is active, because both dock the session list flush left and the rail would render the same list next to it, z-ordered UNDER it. The subagent/ultracode connectors DO adapt (`_tabAnchor()`/`_tabConnectorPath()` in app.js: right-edge anchor, horizontal bezier), and the lineage strip-scroll listener redraws them on the sidebar's vertical scroll. `_scrollActiveTabIntoView()` owns active-row reveal on BOTH axes: sidebar mode branches to `scrollIntoView({block:'nearest'})` because the horizontal `computeTabScrollLeft` math no-ops against a vertical scroller, and `_fullRenderSessionTabs()` restores `scrollTop` alongside the #257 `scrollLeft` restore or ambient rebuilds yank a mid-scroll sidebar back to the top. Tests: `test/session-list-layout.test.ts`.
-
 ### Gesture control: the setting
 
 **Gesture control** (the camera hand-tracking overlay) is **opt-in, default OFF**, under App Settings → Terminal & Input → Scrolling & rendering (`gestureControlEnabled`). `CODEMAN_GESTURE=1` makes the feature _available_ on the instance (CSP widening + `/gesture/` assets) and sets `window.__codemanGestureAvailable` (the Input section only shows when set); the overlay bundle is injected by `renderIndexHtml` **only when the setting is enabled**, so that method is `async` and reads `settings.json` via `readSettings(true)` — the `true` forces a **fresh** read (bypassing the 2s `_settingsCache`), because a post-save reload happens within that TTL and the cached value would otherwise render the pre-toggle state. Toggling the setting reloads the page (the bundle is render-injected).

scripts/verify-session-sidebar.mts

@@ -1,179 +0,0 @@
-/**
- * Manual verification harness for the session-sidebar feature.
- *
- * Renders the real UI in headless Chromium against a testMode WebServer,
- * injects a synthetic 25-session fleet, and screenshots every layout state.
- * Not part of the automated suite — run it by hand:
- *
- *   npx tsx scripts/verify-session-sidebar.mts
- *
- * SAFETY: uses the repo's own test harness (temp HOME, testMode server) on a
- * dedicated port. It never touches a real Codeman instance or tmux socket.
- */
-import { chromium } from 'playwright';
-import { WebServer } from '../src/web/server.js';
-import { mkdirSync } from 'node:fs';
-import { mkdtempSync } from 'node:fs';
-import { tmpdir } from 'node:os';
-import { join } from 'node:path';
-
-// Mirror test/setup.ts: isolate HOME before the app modules touch state.
-process.env.HOME = mkdtempSync(join(tmpdir(), 'codeman-sidebar-verify-'));
-process.env.VITEST = 'true';
-
-const PORT = 3299;
-const OUT = process.env.SIDEBAR_SHOTS_DIR ?? join(tmpdir(), 'codeman-sidebar-shots');
-mkdirSync(OUT, { recursive: true });
-
-// Generic on purpose: these names end up in the harness screenshots, so they
-// should not carry one contributor's project list into everyone else's review.
-// The mix of CLI modes matters (each renders a different badge); the names do not.
-const PROJECTS = [
-  ['api-server', 'claude'],
-  ['web-client', 'claude'],
-  ['mobile-app', 'codex'],
-  ['data-pipeline', 'claude'],
-  ['shared-lib', 'gemini'],
-  ['codeman', 'claude'],
-  ['docs-site', 'claude'],
-  ['batch-jobs', 'opencode'],
-  ['search-index', 'claude'],
-];
-const STATUSES = ['idle', 'busy', 'idle', 'busy', 'error', 'idle'];
-
-function fleet(n: number) {
-  const out: any[] = [];
-  for (let i = 0; i < n; i++) {
-    const [proj, mode] = PROJECTS[i % PROJECTS.length];
-    const status = STATUSES[i % STATUSES.length];
-    out.push({
-      id: `sess-${String(i).padStart(4, '0')}-aaaa-bbbb-cccc-dddddddddddd`,
-      pid: 10000 + i,
-      status,
-      workingDir: `${tmpdir()}/projects/${proj}`,
-      name: `${proj}${i > 8 ? '-' + Math.floor(i / 9) : ''}`,
-      mode,
-      currentTaskId: null,
-      createdAt: Date.now() - i * 60000,
-      lastActivityAt: Date.now() - i * 1000,
-      isWorking: status === 'busy',
-      messageCount: i * 3,
-      totalCost: 0,
-      inputTokens: 0,
-      outputTokens: 0,
-      color: 'default',
-      taskStats: { total: i % 4, running: i % 3 === 0 ? 2 : 0, completed: 0, failed: 0 },
-      taskTree: [],
-      tokens: { input: 0, output: 0, total: 0 },
-      bufferStats: { terminalBufferSize: 0, textOutputSize: 0, messageCount: 0 },
-    });
-  }
-  return out;
-}
-
-const SESSIONS = fleet(25);
-
-async function main() {
-  const server = new WebServer(PORT, false, true);
-  await server.start();
-  const browser = await chromium.launch({ headless: true });
-  const results: string[] = [];
-
-  async function shot(
-    name: string,
-    opts: { layout: 'header' | 'sidebar'; collapsed?: boolean; width: number; height: number; touch?: boolean }
-  ) {
-    const ctx = await browser.newContext({
-      viewport: { width: opts.width, height: opts.height },
-      hasTouch: !!opts.touch,
-      isMobile: !!opts.touch,
-      deviceScaleFactor: 2,
-    });
-    const page = await ctx.newPage();
-    const settings = JSON.stringify({ sessionListLayout: opts.layout });
-    const collapsed = opts.collapsed === undefined ? null : opts.collapsed ? '1' : '0';
-    await page.addInitScript(
-      ([s, c]) => {
-        localStorage.setItem('codeman-app-settings', s as string);
-        localStorage.setItem('codeman-app-settings-mobile', s as string);
-        if (c !== null) localStorage.setItem('codeman-sidebar-collapsed', c as string);
-        else localStorage.removeItem('codeman-sidebar-collapsed');
-      },
-      [settings, collapsed]
-    );
-    await page.goto(`http://localhost:${PORT}`, { waitUntil: 'domcontentloaded' });
-    await page.waitForTimeout(1500);
-
-    await page.evaluate((list) => {
-      const app = (window as any).app;
-      if (!app) throw new Error('no window.app');
-      app.sessions.clear();
-      for (const s of list as any[]) app.sessions.set(s.id, s);
-      // The renderer iterates sessionOrder, not the map.
-      app.sessionOrder = (list as any[]).map((s) => s.id);
-      app.activeSessionId = (list as any[])[3].id;
-      // renderSessionTabs() is debounced; drive the immediate path directly.
-      (app._fullRenderSessionTabs ?? app._renderSessionTabsImmediate)?.call(app);
-      app.applySessionListLayout?.();
-    }, SESSIONS as any);
-    await page.waitForTimeout(600);
-
-    const info = await page.evaluate(() => {
-      const root = document.documentElement;
-      const aside = document.getElementById('sessionSidebar');
-      const tabsEl = document.getElementById('sessionTabs');
-      const asideBox = aside?.getBoundingClientRect();
-      const cs = aside ? getComputedStyle(aside) : null;
-      return {
-        dataSessionList: root.dataset.sessionList ?? null,
-        dataSidebar: root.dataset.sidebar ?? null,
-        rows: document.querySelectorAll('.session-tab').length,
-        tabsParent: tabsEl?.parentElement?.id || tabsEl?.parentElement?.className || null,
-        asideWidth: asideBox ? Math.round(asideBox.width) : null,
-        asideVisible: cs ? cs.display !== 'none' && cs.visibility !== 'hidden' : null,
-        asideInert: aside?.hasAttribute('inert') ?? null,
-        ariaHidden: aside?.getAttribute('aria-hidden') ?? null,
-        toggleAriaExpanded: document.getElementById('sidebarToggleBtn')?.getAttribute('aria-expanded') ?? null,
-        firstRowText:
-          (document.querySelector('.session-tab') as HTMLElement | null)?.innerText
-            ?.trim()
-            .replace(/\s+/g, ' ')
-            .slice(0, 40) ?? null,
-        listScrollable: (() => {
-          const el = document.getElementById('sessionTabs');
-          return el ? el.scrollHeight > el.clientHeight + 2 : null;
-        })(),
-      };
-    });
-
-    await page.waitForTimeout(400);
-    const file = join(OUT, `${name}.png`);
-    await page.screenshot({ path: file });
-    results.push(`${name.padEnd(28)} ${JSON.stringify(info)}`);
-    await ctx.close();
-    return info;
-  }
-
-  await shot('01-header-desktop', { layout: 'header', width: 1600, height: 900 });
-  await shot('02-sidebar-expanded', { layout: 'sidebar', collapsed: false, width: 1600, height: 900 });
-  await shot('03-sidebar-collapsed-rail', { layout: 'sidebar', collapsed: true, width: 1600, height: 900 });
-  await shot('04-sidebar-narrow-1000', { layout: 'sidebar', collapsed: true, width: 1000, height: 800 });
-  await shot('05-sidebar-drawer-open-1000', { layout: 'sidebar', collapsed: false, width: 1000, height: 800 });
-  await shot('06-sidebar-phone-closed', { layout: 'sidebar', collapsed: true, width: 393, height: 852, touch: true });
-  await shot('07-sidebar-phone-open', { layout: 'sidebar', collapsed: false, width: 393, height: 852, touch: true });
-
-  console.log('\n=== RESULTS ===');
-  for (const r of results) console.log(r);
-  console.log(`\nScreenshots in ${OUT}`);
-
-  await browser.close();
-  await server.stop();
-}
-
-main().then(
-  () => process.exit(0),
-  (e) => {
-    console.error(e);
-    process.exit(1);
-  }
-);

src/attachment-registry.ts

@@ -11,9 +11,46 @@ import { realpathSync } from 'node:fs';
 import fs from 'node:fs/promises';
 import { basename, extname, isAbsolute } from 'node:path';
 import { isBlockedAttachmentPath, loadAttachmentGuardConfig } from './config/attachment-guard.js';
+import { EDITABLE_EXTENSIONS } from './config/file-editing.js';
 import { validateSessionFilePath } from './web/route-helpers.js';
 import type { AttachmentDetectedEvent, AttachmentDetectedType } from './types.js';
 
+/**
+ * Playable media extensions, single-sourced here because the WORKSPACE preview
+ * (`file-content`'s media classification) and the out-of-workspace attachment
+ * path must agree on what plays. They diverged once: a video an agent wrote
+ * inside the workspace played with a working scrub bar, while the same file in
+ * `/tmp` was refused as an unsupported type, which reads as a bug rather than a
+ * boundary. Serving is range-aware in both, which is what makes seeking work.
+ */
+export const VIDEO_ATTACHMENT_EXTENSIONS: ReadonlySet<string> = new Set(['mp4', 'webm', 'mov', 'm4v', 'ogv']);
+export const AUDIO_ATTACHMENT_EXTENSIONS: ReadonlySet<string> = new Set([
+  'mp3',
+  'wav',
+  'ogg',
+  'oga',
+  'm4a',
+  'aac',
+  'flac',
+  'opus',
+]);
+
+/**
+ * Plain-text extensions, REUSING the File Viewer's edit-mode allowlist rather
+ * than curating a second list that would drift from it. The rule reads: if the
+ * viewer would open that file for editing inside the workspace, the same file
+ * outside it can be read here. `svg` and `env` are absent from that list by
+ * design and stay absent here.
+ *
+ * Why widen at all: the agent in the session can already `cat` any of these,
+ * and every path-shaped surface (the picker, the workspace viewer) can already
+ * show them. Refusing a `.log` an agent just wrote to `/tmp` bought no
+ * confidentiality, it only made the click fail. The confidentiality gate is the
+ * path guard that still runs on every registration (sensitive-file blocklist,
+ * `/root` and `/etc` trees, realpath before the check), not the file's suffix.
+ */
+export const TEXT_ATTACHMENT_EXTENSIONS: ReadonlySet<string> = EDITABLE_EXTENSIONS;
+
 const SUPPORTED_ATTACHMENT_EXTENSIONS = new Set([
   'png',
   'jpg',
@@ -25,6 +62,9 @@ const SUPPORTED_ATTACHMENT_EXTENSIONS = new Set([
   'pptx',
   'md',
   'txt',
+  ...VIDEO_ATTACHMENT_EXTENSIONS,
+  ...AUDIO_ATTACHMENT_EXTENSIONS,
+  ...TEXT_ATTACHMENT_EXTENSIONS,
 ]);
 
 export type AttachmentSource = 'detected' | 'external';
@@ -108,10 +148,14 @@ export function isSupportedAttachmentExtension(extension: string): boolean {
 export function getAttachmentType(extension: string): AttachmentDetectedType {
   const normalized = extension.toLowerCase().replace(/^\./, '');
   if (['png', 'jpg', 'jpeg', 'gif', 'webp'].includes(normalized)) return 'image';
+  if (VIDEO_ATTACHMENT_EXTENSIONS.has(normalized)) return 'video';
+  if (AUDIO_ATTACHMENT_EXTENSIONS.has(normalized)) return 'audio';
   if (normalized === 'pdf') return 'pdf';
   if (normalized === 'pptx') return 'presentation';
   if (normalized === 'md') return 'markdown';
-  if (normalized === 'txt') return 'text';
+  // Everything else in the text family reads as text, including code and
+  // config: the card and the preview both treat it as a plain-text file.
+  if (normalized === 'txt' || TEXT_ATTACHMENT_EXTENSIONS.has(normalized)) return 'text';
   return 'document';
 }
 

src/types/tools.ts

@@ -63,7 +63,15 @@ export interface ImageDetectedEvent {
   size: number;
 }
 
-export type AttachmentDetectedType = 'image' | 'pdf' | 'document' | 'presentation' | 'markdown' | 'text';
+export type AttachmentDetectedType =
+  | 'image'
+  | 'video'
+  | 'audio'
+  | 'pdf'
+  | 'document'
+  | 'presentation'
+  | 'markdown'
+  | 'text';
 
 /**
  * Event emitted when a new previewable attachment file is detected in a session's

src/web/public/app.js

@@ -428,16 +428,6 @@ const DEFAULT_SHORTCUTS = [
     ],
     action: 'openCommandPalette',
   },
-  {
-    id: 'toggle-session-sidebar',
-    group: 'Session',
-    label: 'Toggle Session Sidebar',
-    // Alt+B, not Ctrl+B: Ctrl+B must reach the terminal (tmux prefix,
-    // readline backward-char). The Alt block below claims only Digit1-9 and
-    // the brackets, and the registry claims Alt for KeyK and Slash only.
-    bindings: [{ modifiers: ['alt'], key: 'b', code: 'KeyB' }],
-    action: 'toggleSessionSidebar',
-  },
   {
     id: 'previous-next-session',
     group: 'Session',
@@ -883,9 +873,7 @@ class CodemanApp {
     this.restorePlanUsageChip();
     this.applySkin();
     this.applyLocalization();
-    // Calls applyTabWrapSettings() itself (it owns tabs-two-rows / tabs-show-folder)
-    // and then applies the sidebar variant on top — do not call both.
-    this.applySessionListLayout();
+    this.applyTabWrapSettings();
     this.applyMonitorVisibility();
     this.applyLineageLineSettings?.();
     this._installLineageStripScrollListener?.();
@@ -952,7 +940,7 @@ class CodemanApp {
       this.applyHeaderVisibilitySettings();
       this.applySkin();
       this.applyLocalization();
-      this.applySessionListLayout();
+      this.applyTabWrapSettings();
       this.applyMonitorVisibility();
       this.applyLineageLineSettings?.();
       // ultracodeFloatingWindows syncs from the server (non-display key), but on a
@@ -1074,7 +1062,6 @@ class CodemanApp {
       toggleVoiceInput: () => VoiceInput.toggle(),
       moveActiveTabLeft: () => this.moveActiveTabLeft(),
       moveActiveTabRight: () => this.moveActiveTabRight(),
-      toggleSessionSidebar: () => this.toggleSessionSidebar(),
     };
 
     // Use capture to handle before terminal
@@ -1096,14 +1083,6 @@ class CodemanApp {
         this.closeSessionManager();
         this.closeCommandPalette?.();
         this.closeShortcutOverlay?.();
-        // Overlay layouts only: below 1024px the sidebar is a modal off-canvas
-        // drawer over the terminal, so Escape must close it. The docked desktop
-        // sidebar is chrome, not a dialog — collapsing it would be a surprise.
-        if (this._isSessionSidebarOverlay() &&
-            this.isSessionSidebarActive() && !this.isSessionSidebarCollapsed()) {
-          this.toggleSessionSidebar();
-          document.getElementById('sidebarToggleBtn')?.focus();
-        }
       }
 
       // Option/Alt session navigation uses physical key CODES, not e.key, so macOS
@@ -2025,6 +2004,17 @@ class CodemanApp {
     if (!body || body.dataset.rvBound === '1') return;
     body.dataset.rvBound = '1';
     body.addEventListener('click', async (ev) => {
+      // File path (_linkifyFilePaths): open it in the preview overlay, which
+      // resolves workspace and out-of-workspace paths alike.
+      const pathLink = ev.target.closest('a.rv-path');
+      if (pathLink) {
+        ev.preventDefault();
+        ev.stopPropagation();
+        const filePath = pathLink.dataset.path;
+        if (filePath) this.openFilePreview(filePath, this.activeSessionId);
+        return;
+      }
+
       // One-click copy: lift the raw source from the sibling <pre><code>.
       const copyBtn = ev.target.closest('.rv-copy-btn');
       if (copyBtn) {
@@ -2095,10 +2085,66 @@ class CodemanApp {
     const renderedText = document.createElement('div');
     renderedText.className = 'rv-text';
     renderedText.innerHTML = this._renderMarkdown(text);
+    this._linkifyFilePaths(renderedText);
     div.appendChild(renderedText);
     return div;
   }
 
+  /**
+   * Make absolute file paths in a rendered message clickable.
+   *
+   * The terminal's link provider never sees these: the response viewer is
+   * markdown, and a path the agent wrote as prose or inline code renders as
+   * inert text — so the file it just produced (a screenshot, a report) was one
+   * copy-paste away from being viewable instead of one click. Same pattern the
+   * terminal uses (constants.js), same destination (the file-preview overlay).
+   *
+   * Walks TEXT NODES and builds anchors with DOM APIs — never innerHTML, and
+   * never a string rebuild of already-sanitized markup: the source is model
+   * output. Subtrees already inside an `<a>` are skipped so an autolinked URL
+   * is never re-cut, and the anchor's textContent is the path verbatim, so
+   * "copy code" still yields exactly what the agent printed.
+   */
+  _linkifyFilePaths(root) {
+    if (!root || typeof document === 'undefined') return;
+    // Guarded: a stale cached constants.js must degrade to plain text, not throw
+    // out of the middle of rendering a message.
+    if (typeof absoluteFilePathPattern !== 'function') return;
+    const pattern = absoluteFilePathPattern();
+
+    // Collect first: replacing a node while the walker is positioned on it
+    // invalidates the traversal.
+    const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT);
+    const targets = [];
+    for (let node = walker.nextNode(); node; node = walker.nextNode()) {
+      if (node.parentElement?.closest('a')) continue;
+      pattern.lastIndex = 0;
+      if (pattern.test(node.nodeValue || '')) targets.push(node);
+    }
+
+    for (const node of targets) {
+      const value = node.nodeValue;
+      const frag = document.createDocumentFragment();
+      let cursor = 0;
+      let match;
+      pattern.lastIndex = 0;
+      while ((match = pattern.exec(value)) !== null) {
+        const path = match[1];
+        if (match.index > cursor) frag.appendChild(document.createTextNode(value.slice(cursor, match.index)));
+        const link = document.createElement('a');
+        link.className = 'rv-path';
+        link.href = '#';
+        link.dataset.path = path;
+        link.title = path;
+        link.textContent = path;
+        frag.appendChild(link);
+        cursor = match.index + path.length;
+      }
+      if (cursor < value.length) frag.appendChild(document.createTextNode(value.slice(cursor)));
+      node.parentNode?.replaceChild(frag, node);
+    }
+  }
+
   _getResponseViewerAgentLabel() {
     const mode = this.sessions.get(this.activeSessionId)?.mode;
     return mode === 'codex'
@@ -3585,262 +3631,6 @@ class CodemanApp {
     }, delayMs);
   }
 
-  // ═══════════════════════════════════════════════════════════════
-  // Session List Layout (header strip ⟷ collapsible left sidebar)
-  // ═══════════════════════════════════════════════════════════════
-
-  /**
-   * 'header' | 'sidebar'. Solo (detached single-session) windows are ALWAYS
-   * 'header': they show exactly one session, so a session list is noise — and
-   * #sessionTabs must never be parked inside the display:none <aside>, where
-   * updateTabOverflowMode() would measure 0/0 and the inline rename input would
-   * get zero geometry.
-   */
-  getSessionListLayout() {
-    if (this.soloSessionId) return 'header';
-    const settings = this.loadAppSettingsFromStorage();
-    const defaults = this.getDefaultSettings();
-    const layout = settings.sessionListLayout ?? defaults.sessionListLayout ?? 'header';
-    return layout === 'sidebar' ? 'sidebar' : 'header';
-  }
-
-  /**
-   * Reads the APPLIED layout off <html>, not the settings blob: this is called
-   * per dragover event and per tab in render loops, and getSessionListLayout()
-   * re-parses localStorage on every call. The attribute is written by the
-   * pre-paint script in index.html and thereafter only by applySessionListLayout(),
-   * so it is authoritative from the very first frame.
-   */
-  isSessionSidebarActive() {
-    return document.documentElement.dataset.sessionList === 'sidebar';
-  }
-
-  /**
-   * True where the sidebar is a MODAL off-canvas drawer over the terminal
-   * instead of a docked column.
-   *
-   * That behaviour is defined purely in mobile.css, which index.html loads with
-   * media="(max-width: 1023px)" — so this must test the SAME breakpoint.
-   * MobileDetection.getDeviceType() is NOT usable here: it calls anything
-   * >= 768px 'desktop', which would leave 768-1023px (iPad portrait, a narrowed
-   * desktop window) with overlay CSS but docked-sidebar logic — drawer opens
-   * itself on load, tapping a session doesn't dismiss it, Escape does nothing.
-   * Mirrored in the pre-paint script in index.html.
-   */
-  _isSessionSidebarOverlay() {
-    return window.innerWidth < 1024;
-  }
-
-  /**
-   * Collapse state is per-device and lives in its OWN localStorage key, not in
-   * the app-settings blob: saveAppSettings() rebuilds that blob from the DOM
-   * controls, so any key without a control is silently wiped on every Save.
-   * Precedent: codeman:skin, codeman-session-order, codeman-active-session.
-   */
-  isSessionSidebarCollapsed() {
-    // In-memory intent wins over storage: where localStorage throws (Safari
-    // private mode, disabled storage, quota) the write in toggleSessionSidebar()
-    // is a no-op, and re-reading here would return the OLD value — the sidebar
-    // would refuse to collapse at all. Persistence degrades, the control does not.
-    if (this._sidebarCollapsedOverride !== undefined) return this._sidebarCollapsedOverride;
-    let raw = null;
-    try {
-      raw = localStorage.getItem('codeman-sidebar-collapsed');
-    } catch {}
-    // Never chosen yet: the docked desktop sidebar starts open, the overlay
-    // drawer starts CLOSED — "expanded" there would mean a drawer covering the
-    // terminal on every cold load.
-    if (raw === null) return this._isSessionSidebarOverlay();
-    return raw === '1';
-  }
-
-  /**
-   * True when this keydown is the sidebar-toggle chord AND toggling would
-   * actually do something. Used by terminal-ui.js's custom key handler to keep
-   * the chord out of the PTY: the document CAPTURE handler has already toggled
-   * the sidebar by the time xterm sees the event, but its preventDefault() does
-   * NOT stop xterm — without this gate Alt+B would ALSO write ESC b into the
-   * live session, which readline/Ink read as backward-word and which walks the
-   * cursor back through whatever the user was typing (same trap as COD-153).
-   *
-   * Deliberately registry-aware and gated on the sidebar being active, so a
-   * rebound/disabled shortcut — and the default header layout, where the toggle
-   * is a no-op — leave Meta-b reaching the terminal exactly as before.
-   */
-  shouldToggleSessionSidebarFromShortcut(e) {
-    if (!e) return false;
-    // Every dispatchable binding requires Ctrl/Cmd/Alt, so plain typing exits
-    // before any registry work — this runs on the xterm keydown hot path.
-    if (!e.ctrlKey && !e.metaKey && !e.altKey) return false;
-    if (!this.isSessionSidebarActive()) return false;
-    if (typeof this.getShortcutRegistry !== 'function' || typeof this.matchesShortcutEvent !== 'function') {
-      return false;
-    }
-    const shortcut = this.getShortcutRegistry().find((s) => s.id === 'toggle-session-sidebar');
-    if (!shortcut || shortcut.disabled) return false;
-    return this.matchesShortcutEvent(e, shortcut);
-  }
-
-  /**
-   * Move the ONE #sessionTabs element between its two hosts and set the layout
-   * attributes that all the sidebar CSS keys off.
-   *
-   * Never clones or recreates the node: this.$('sessionTabs') caches elements by
-   * id and never invalidates, and settings-ui.js / webview-tabs.js resolve the
-   * same id independently. A rebuilt container would leave every consumer
-   * writing into a detached orphan — silently, with no error.
-   */
-  applySessionListLayout() {
-    const mode = this.getSessionListLayout();
-    const collapsed = this.isSessionSidebarCollapsed();
-    const prevMode = document.documentElement.dataset.sessionList;
-    const tabsEl = document.getElementById('sessionTabs');
-    const headerHost = document.getElementById('sessionTabsHost');
-    const sidebarList = document.getElementById('sessionSidebarList');
-    if (!tabsEl || !headerHost || !sidebarList) return;
-
-    const host = mode === 'sidebar' ? sidebarList : headerHost;
-    if (tabsEl.parentElement !== host) host.appendChild(tabsEl);
-
-    document.documentElement.dataset.sessionList = mode;
-    document.documentElement.dataset.sidebar = collapsed ? 'collapsed' : 'expanded';
-    tabsEl.setAttribute('aria-orientation', mode === 'sidebar' ? 'vertical' : 'horizontal');
-
-    const btn = document.getElementById('sidebarToggleBtn');
-    if (btn) {
-      btn.classList.toggle('btn-sidebar-toggle--hidden', mode !== 'sidebar');
-      const label = collapsed ? 'Expand session sidebar' : 'Collapse session sidebar';
-      btn.setAttribute('aria-expanded', collapsed ? 'false' : 'true');
-      btn.setAttribute('aria-label', label);
-      btn.setAttribute('title', label);
-    }
-
-    // Handheld (mobile.css): the sidebar is an off-canvas overlay, and
-    // "collapsed" means the drawer is closed.
-    const aside = document.getElementById('sessionSidebar');
-    if (aside) {
-      aside.classList.toggle('open', mode === 'sidebar' && !collapsed);
-      // A closed overlay drawer is only moved off screen by translateX(-100%);
-      // it keeps display:flex, so without this its filter box and ~4 tab stops
-      // per session stay in the Tab order and in the accessibility tree.
-      // NOT applied to the docked desktop rail — its rows are still clickable.
-      const hiddenDrawer = mode === 'sidebar' && collapsed && this._isSessionSidebarOverlay();
-      aside.toggleAttribute('inert', hiddenDrawer);
-      if (hiddenDrawer) aside.setAttribute('aria-hidden', 'true');
-      else aside.removeAttribute('aria-hidden');
-    }
-
-    // The filter box only exists inside the sidebar; leaving a stale filter
-    // applied when the layout goes back to the header strip would hide sessions
-    // from the tab bar with no reachable control to clear it.
-    if (mode !== 'sidebar') {
-      this._sidebarFilter = '';
-      const filterInput = document.getElementById('sessionSidebarFilter');
-      if (filterInput) filterInput.value = '';
-    }
-
-    // applyTabWrapSettings() (settings-ui.js) is the ONE owner of
-    // tabs-two-rows / tabs-show-folder / _tallTabsEnabled and is itself
-    // sidebar-aware — it reads the data-session-list attribute set just above,
-    // so it must run AFTER it. It re-renders by itself when the folder row
-    // appears or disappears.
-    const prevTall = this._tallTabsEnabled;
-    this.applyTabWrapSettings();
-    // A layout flip alone still needs one render: the rows are rebuilt into the
-    // new host with the drag/keyboard handlers re-bound. Skipped when
-    // applyTabWrapSettings() already rendered for the folder-row change.
-    if (prevMode !== mode && prevTall === this._tallTabsEnabled) {
-      this._fullRenderSessionTabs();
-    }
-    // tabs-auto-wrap is measured, not derived from settings — updateTabOverflowMode()
-    // drops it in sidebar mode, but drop it here too so nothing paints wrapped
-    // for a frame before the next measure.
-    if (mode === 'sidebar') tabsEl.classList.remove('tabs-auto-wrap');
-    // Collapse/expand changes whether the filter is reachable, so re-evaluate it
-    // here too — not only at the render tails.
-    this.applySidebarFilter(this._sidebarFilter);
-    this.updateSidebarCount();
-    this.updateConnectionLines();
-    // The desktop home rail defers to the sidebar (both dock the session list
-    // flush left), so a layout flip while the welcome screen is up has to
-    // re-evaluate it — showHomeSessions() self-gates on shouldShowHomeSessions().
-    if (document.getElementById('welcomeOverlay')?.classList.contains('visible')) {
-      this.showHomeSessions?.();
-    }
-  }
-
-  toggleSessionSidebar() {
-    if (!this.isSessionSidebarActive()) return;
-    const collapsed = !this.isSessionSidebarCollapsed();
-    this._sidebarCollapsedOverride = collapsed;
-    try {
-      localStorage.setItem('codeman-sidebar-collapsed', collapsed ? '1' : '0');
-    } catch {}
-    // Collapsing hides the filter row. If focus is sitting in there it would be
-    // reset to <body>, dropping the user back to the top of the tab order — so
-    // hand it to the toggle, which is the control they just used.
-    if (collapsed && this.$('sessionSidebar')?.contains(document.activeElement)) {
-      document.getElementById('sidebarToggleBtn')?.focus();
-    }
-    this.applySessionListLayout();
-    // Opening the MODAL drawer moves focus into it, as a dialog should. The
-    // docked desktop sidebar is not modal: stealing focus there would pull the
-    // caret out of the terminal mid-prompt, and .session-tab handles only
-    // arrows/Home/End/Enter/Space, so everything typed after would be swallowed.
-    if (!collapsed && this._isSessionSidebarOverlay()) {
-      this.$('sessionTabs')?.querySelector('.session-tab.active')?.focus();
-    }
-  }
-
-  /**
-   * Overlay layouts only: below 1024px the sidebar is a modal drawer on top of
-   * the terminal (mobile.css), so picking a session from it must get it out of
-   * the way again. The docked desktop sidebar stays exactly where the user put
-   * it. No-op unless the drawer is actually open.
-   */
-  closeSessionSidebarOnHandheld() {
-    if (!this._isSessionSidebarOverlay()) return;
-    if (!this.isSessionSidebarActive() || this.isSessionSidebarCollapsed()) return;
-    this.toggleSessionSidebar();
-  }
-
-  updateSidebarCount() {
-    const el = document.getElementById('sessionSidebarCount');
-    if (el) el.textContent = String(this.sessions?.size ?? 0);
-  }
-
-  /**
-   * Sidebar filter box. Pure DOM class toggling — no re-render, no state on the
-   * sessions themselves. Matches the rendered aria-label (session name) and the
-   * title (working directory).
-   *
-   * Re-applied at the tail of both render paths: _fullRenderSessionTabs() rebuilds
-   * innerHTML wholesale, so without that the filtered-out rows flicker back in on
-   * every SSE tick.
-   *
-   * The filter only takes effect while the box that produced it is on screen —
-   * i.e. the expanded sidebar. In the header strip, the collapsed rail or a
-   * closed drawer the classes come off, otherwise sessions would stay hidden
-   * with no visible cause and no reachable control to clear them. The remembered
-   * needle is restored when the box comes back.
-   */
-  applySidebarFilter(query) {
-    this._sidebarFilter = (query ?? '').trim().toLowerCase();
-    const container = this.$('sessionTabs');
-    if (!container) return;
-    const reachable =
-      this.isSessionSidebarActive() && document.documentElement.dataset.sidebar !== 'collapsed';
-    const needle = reachable ? this._sidebarFilter : '';
-    for (const tab of container.querySelectorAll('.session-tab')) {
-      if (!needle) {
-        tab.classList.remove('tab-filtered-out');
-        continue;
-      }
-      const haystack = `${tab.getAttribute('aria-label') || ''} ${tab.getAttribute('title') || ''}`.toLowerCase();
-      tab.classList.toggle('tab-filtered-out', !haystack.includes(needle));
-    }
-  }
-
   // ═══════════════════════════════════════════════════════════════
   // Session Tabs
   // ═══════════════════════════════════════════════════════════════
@@ -3889,16 +3679,6 @@ class CodemanApp {
       container.querySelector('.session-tab.active');
     if (!tab) return;
 
-    // Sidebar layout: the list scrolls VERTICALLY in its own scroller, so the
-    // horizontal computeTabScrollLeft math below would always no-op (scrollLeft
-    // pinned at 0). With 25+ sessions the active row is routinely below the
-    // fold; 'nearest' never scrolls when it is already visible, and only the
-    // list's own scroller moves — the drawer and document stay put.
-    if (this.isSessionSidebarActive()) {
-      tab.scrollIntoView({ block: 'nearest' });
-      return;
-    }
-
     const policy = window.CodemanTabOverflow?.computeTabScrollLeft;
     if (!policy) return;
     const containerRect = container.getBoundingClientRect();
@@ -3923,45 +3703,6 @@ class CodemanApp {
     }
   }
 
-  /**
-   * Where a floating window (subagent / ultracode) attaches to its parent tab.
-   * Header strip: below the tab, connector runs vertically. Sidebar: to the
-   * RIGHT of the tab, connector runs horizontally — otherwise the window spawns
-   * on top of the sidebar and its bezier loops backwards underneath it.
-   */
-  _tabAnchor(rect) {
-    if (this.isSessionSidebarActive()) {
-      return {
-        x: rect.right,
-        y: rect.top + rect.height / 2,
-        spawnLeft: rect.right + 14,
-        spawnTop: rect.top,
-        vertical: false,
-      };
-    }
-    return {
-      x: rect.left + rect.width / 2,
-      y: rect.bottom,
-      spawnLeft: rect.left,
-      spawnTop: rect.bottom,
-      vertical: true,
-    };
-  }
-
-  /** Bezier from a _tabAnchor() to a window rect, curving along the right axis. */
-  _tabConnectorPath(anchor, winRect) {
-    if (anchor.vertical) {
-      const x2 = winRect.left + winRect.width / 2;
-      const y2 = winRect.top;
-      const midY = (anchor.y + y2) / 2;
-      return `M ${anchor.x} ${anchor.y} C ${anchor.x} ${midY}, ${x2} ${midY}, ${x2} ${y2}`;
-    }
-    const x2 = winRect.left;
-    const y2 = winRect.top + winRect.height / 2;
-    const midX = (anchor.x + x2) / 2;
-    return `M ${anchor.x} ${anchor.y} C ${midX} ${anchor.y}, ${midX} ${y2}, ${x2} ${y2}`;
-  }
-
   _setTerminalLoadState(sessionId, selectGen, phase) {
     this.terminalLoadStates.set(sessionId, { generation: selectGen, phase });
     this._updateTerminalLoadTab(sessionId);
@@ -4197,9 +3938,6 @@ class CodemanApp {
     // it, sliding the lineage arcs off their anchors. Only pay for it when there
     // is an arc to keep anchored.
     if (this._lineageEdgeCount > 0) this.updateConnectionLines();
-
-    this.applySidebarFilter(this._sidebarFilter);
-    this.updateSidebarCount();
   }
 
   // Auto-wrap desktop session tabs to a second row when they overflow one row,
@@ -4209,13 +3947,6 @@ class CodemanApp {
     const container = this.$('sessionTabs');
     if (!container) return;
 
-    // The sidebar list is a single vertical column with its own scroller —
-    // there is no row to overflow, and measuring it would fight the CSS.
-    if (this.isSessionSidebarActive()) {
-      container.classList.remove('tabs-auto-wrap');
-      return;
-    }
-
     const deviceType = MobileDetection.getDeviceType();
     const settings = this.loadAppSettingsFromStorage();
     const defaults = this.getDefaultSettings();
@@ -4264,15 +3995,6 @@ class CodemanApp {
     if (this._inlineRenameActive) return;
     const container = this.$('sessionTabs');
 
-    // Sidebar rows are always tall (name + folder) and never wrap. Re-assert it
-    // here so a render triggered straight from applyTabWrapSettings() — which
-    // only knows the header strip — cannot leave the sidebar folderless.
-    if (this.isSessionSidebarActive()) {
-      this._tallTabsEnabled = true;
-      container.classList.add('tabs-show-folder');
-      container.classList.remove('tabs-two-rows', 'tabs-auto-wrap');
-    }
-
     // Clean up any orphaned dropdowns before re-rendering
     document.querySelectorAll('body > .subagent-dropdown').forEach(d => d.remove());
     this.cancelHideSubagentDropdown();
@@ -4283,9 +4005,6 @@ class CodemanApp {
     // right-hand tabs kept getting yanked back to the first one. Remember
     // where the strip was; the browser clamps the restore to the new content.
     const prevScrollLeft = container.scrollLeft;
-    // Sidebar layout scrolls the same container VERTICALLY, so it needs the
-    // same protection on the other axis.
-    const prevScrollTop = container.scrollTop;
     const prevActiveTabId = this._lastRenderedActiveTabId;
     const isFirstRender = !container.querySelector('.session-tab');
 
@@ -4373,7 +4092,6 @@ class CodemanApp {
     // the strip while a background rebuild fires, without the active tab ever
     // being stranded off-screen after a switch.
     container.scrollLeft = prevScrollLeft;
-    container.scrollTop = prevScrollTop;
     this._lastRenderedActiveTabId = this.activeSessionId;
     if (isFirstRender || prevActiveTabId !== this.activeSessionId) {
       this._scrollActiveTabIntoView(this.activeSessionId, isFirstRender ? 'auto' : 'smooth');
@@ -4396,11 +4114,6 @@ class CodemanApp {
     // Newly created tabs animate in; a re-render mid-cascade resumes them rather
     // than restarting, since this rebuild just destroyed the animating elements.
     this._applyTabEntrances?.();
-
-    // innerHTML was rebuilt wholesale, so the sidebar filter classes are gone —
-    // re-apply them or filtered-out sessions flicker back on every SSE tick.
-    this.applySidebarFilter(this._sidebarFilter);
-    this.updateSidebarCount();
   }
 
   // Set up arrow key navigation for session tabs (accessibility)
@@ -4411,13 +4124,9 @@ class CodemanApp {
     }
 
     this._tabKeydownHandler = (e) => {
-      // Up/Down are aliases of Left/Right, not replacements: the strip stays
-      // arrow-key navigable exactly as before, the vertical sidebar just gains
-      // the axis a user reaches for there.
-      if (!['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Home', 'End', 'Enter', ' '].includes(e.key)) return;
+      if (!['ArrowLeft', 'ArrowRight', 'Home', 'End', 'Enter', ' '].includes(e.key)) return;
 
-      // Rows hidden by the sidebar filter must not be steppable.
-      const tabs = [...container.querySelectorAll('.session-tab:not(.tab-filtered-out)')];
+      const tabs = [...container.querySelectorAll('.session-tab')];
       const currentIndex = tabs.indexOf(document.activeElement);
 
       // Enter or Space activates the tab
@@ -4433,11 +4142,9 @@ class CodemanApp {
       let newIndex;
       switch (e.key) {
         case 'ArrowLeft':
-        case 'ArrowUp':
           newIndex = currentIndex > 0 ? currentIndex - 1 : tabs.length - 1;
           break;
         case 'ArrowRight':
-        case 'ArrowDown':
           newIndex = currentIndex < tabs.length - 1 ? currentIndex + 1 : 0;
           break;
         case 'Home':
@@ -4569,19 +4276,14 @@ class CodemanApp {
 
         e.dataTransfer.dropEffect = 'move';
 
-        // Determine drop position based on mouse position. Read the layout here,
-        // inside the handler — these listeners survive a layout flip between
-        // renders, so capturing the axis at bind time would go stale.
-        // drag-over-left/-right keep their names and now read as before/after;
-        // the sidebar CSS just draws them as top/bottom edges.
+        // Determine drop position based on mouse position
         const rect = tab.getBoundingClientRect();
-        const insertBefore = this.isSessionSidebarActive()
-          ? e.clientY < rect.top + rect.height / 2
-          : e.clientX < rect.left + rect.width / 2;
+        const midpoint = rect.left + rect.width / 2;
+        const isLeftHalf = e.clientX < midpoint;
 
         // Update visual indicator
-        tab.classList.toggle('drag-over-left', insertBefore);
-        tab.classList.toggle('drag-over-right', !insertBefore);
+        tab.classList.toggle('drag-over-left', isLeftHalf);
+        tab.classList.toggle('drag-over-right', !isLeftHalf);
       });
 
       tab.addEventListener('dragleave', () => {
@@ -4597,11 +4299,10 @@ class CodemanApp {
         const targetId = tab.dataset.id;
         const draggedId = this.draggedTabId;
 
-        // Determine insertion position (same axis rule as the dragover handler)
+        // Determine insertion position
         const rect = tab.getBoundingClientRect();
-        const insertBefore = this.isSessionSidebarActive()
-          ? e.clientY < rect.top + rect.height / 2
-          : e.clientX < rect.left + rect.width / 2;
+        const midpoint = rect.left + rect.width / 2;
+        const insertBefore = e.clientX < midpoint;
 
         // Reorder sessionOrder array
         const fromIndex = this.sessionOrder.indexOf(draggedId);
@@ -5116,9 +4817,6 @@ class CodemanApp {
     this.clearPendingHooks(sessionId, 'idle_prompt');
     // Instant active-class toggle (no 100ms debounce), then schedule full render for badges/status
     this._updateActiveTabImmediate(sessionId);
-    // Handheld: the session drawer overlays the terminal, so slide it away now
-    // that a session has been picked. No-op on desktop and in header layout.
-    this.closeSessionSidebarOnHandheld();
     this.renderSessionTabs();
     this.updateAttachmentHistoryBadge?.();
     if (this.attachmentHistoryDrawerOpen) {

src/web/public/constants.js

@@ -893,6 +893,45 @@ function computeRewriteScrollLine(input) {
   return Math.max(0, (input?.baseY || 0) - linesFromBottom);
 }
 
+/**
+ * Absolute file paths in agent output, as ONE pattern with two consumers: the
+ * xterm link provider (terminal-ui.js) and the response viewer's markdown
+ * linkifier (app.js). They used to be able to drift, and a path that is
+ * clickable in the terminal but inert in the chat reads as a bug, not a policy.
+ *
+ * Anchored on a known absolute root (so an ordinary fraction or a date can
+ * never match) and terminated by a known extension (so the end of the path is
+ * unambiguous — a trailing `)` or `.` after the extension stays out). Longer
+ * extensions come first in each family (`tsx|ts`), so the trailing `\b` cannot
+ * be satisfied by the shorter branch mid-word.
+ *
+ * ⚠ Consumers must never share one instance: `lastIndex` is per-object state on
+ * a `/g` regex, so {@link absoluteFilePathPattern} mints a fresh one per call.
+ */
+const FILE_PATH_LINK_PATTERN =
+  /(\/(?:home|Users|tmp|var|private|etc|opt|mnt|srv|media|data|workspace)\/[^\s"'<>|;&\n\x00-\x1f]*\.(?:log|txt|json|md|ya?ml|csv|xml|sh|py|tsx|ts|jsx|js|mjs|cjs|css|html|toml|ini|sql|png|jpe?g|gif|webp|bmp|svg|pdf|docx|pptx|mp4|webm|mov|mp3|wav))\b/g;
+
+/** A fresh, zero-state instance of {@link FILE_PATH_LINK_PATTERN}. */
+function absoluteFilePathPattern() {
+  return new RegExp(FILE_PATH_LINK_PATTERN.source, 'g');
+}
+
+/**
+ * Extensions the file-preview overlay renders itself. Everything else a link
+ * points at goes to the tail/log viewer, which is the right home for a growing
+ * text file and the wrong one for bytes (tailing a PNG shows binary noise).
+ */
+const FILE_PREVIEW_EXTENSIONS = new Set(
+  ('png jpg jpeg gif webp bmp svg pdf docx pptx mp4 webm mov mp3 wav').split(' ')
+);
+
+/** Whether a path's extension is one {@link FILE_PREVIEW_EXTENSIONS} covers. */
+function previewsInFileViewer(filePath) {
+  const ext = String(filePath || '').split('.').pop().toLowerCase();
+  return FILE_PREVIEW_EXTENSIONS.has(ext);
+}
+
 if (typeof window !== 'undefined') {
   window.CodemanHistoryFormat = { formatHistoryBytes, computeHistoryTruncationNotice, computeRewriteScrollLine };
+  window.CodemanFilePaths = { absoluteFilePathPattern, previewsInFileViewer, FILE_PREVIEW_EXTENSIONS };
 }

src/web/public/home-sessions.js

@@ -85,10 +85,6 @@ Object.assign(CodemanApp.prototype, {
   shouldShowHomeSessions() {
     if (this.isSoloWindow) return false;
     if (this.shouldUseMobileOverview?.()) return false;
-    // The sidebar layout already docks the full session list flush left at full
-    // height — the rail would render the same list right next to it (and z-wise
-    // UNDER it: sidebar 11, welcome overlay 10, rail inside the overlay).
-    if (this.isSessionSidebarActive?.()) return false;
     return window.innerWidth >= HOME_SESSIONS_MIN_WIDTH;
   },
 

src/web/public/i18n.js

@@ -48,10 +48,6 @@
     'Skip to terminal': '跳转到终端',
     'Go to main page': '返回主页',
     'Session tabs': '会话标签页',
-    /* 'Sessions' (the sidebar heading) is already mapped further down. */
-    'Collapse session sidebar': '收起会话侧边栏',
-    'Expand session sidebar': '展开会话侧边栏',
-    'Filter sessions': '筛选会话',
     'Admin Panel': '管理面板',
     'Open admin panel': '打开管理面板',
     'Re-dock to dashboard (close window)': '重新停靠到主界面（关闭窗口）',
@@ -231,11 +227,6 @@
     'Cron Button': '定时任务按钮',
     'Redraw Terminal Button': '重绘终端按钮',
     'Tab Bar': '标签栏',
-    'Session List Layout': '会话列表布局',
-    'Header tab strip': '顶栏标签条',
-    'Left sidebar': '左侧边栏',
-    'Horizontal strip in the header, or a collapsible left sidebar (Alt+B).':
-      '会话列表显示为顶栏横向标签条，或左侧可折叠侧边栏（Alt+B）。',
     'Tall Tabs (Name + Folder)': '双行标签（名称 + 文件夹）',
     'Pop-out Button on Tabs': '标签页弹出窗口按钮',
     Panels: '面板',

src/web/public/index.html

@@ -51,18 +51,6 @@
        layer loads below; setting lang/dir here prevents an English accessibility
        tree from flashing while the deferred scripts start. -->
   <script>try{var m=window.innerWidth<768||(('ontouchstart' in window||navigator.maxTouchPoints>0)&&window.innerWidth<1024);var k=m?'codeman-app-settings-mobile':'codeman-app-settings';var l=JSON.parse(localStorage.getItem(k)||'{}').language;l=l==='zh-CN'?'zh-CN':'en';document.documentElement.lang=l;window.__codemanLanguage=l;}catch(e){document.documentElement.lang='en';window.__codemanLanguage='en';}</script>
-  <!-- Apply the saved session-list layout (header strip vs. left sidebar) and the
-       sidebar collapse state before first paint, so the loading skeleton and the
-       first frame already match. Same per-device settings key as the language
-       script above. Solo windows (/session/:id) never get a sidebar — mirrors
-       _detectSoloSessionId() in app.js. With no stored collapse choice the
-       docked desktop sidebar starts open and the off-canvas overlay drawer
-       starts closed — the overlay test is `innerWidth < 1024`, matching
-       mobile.css's media attribute below and _isSessionSidebarOverlay() in
-       app.js, NOT the handheld storage-key test `m`. Use a different predicate
-       here and boot will contradict this value, animating the drawer open by
-       itself on every load between 768 and 1023px. -->
-  <script>try{var m=window.innerWidth<768||(('ontouchstart' in window||navigator.maxTouchPoints>0)&&window.innerWidth<1024);var k=m?'codeman-app-settings-mobile':'codeman-app-settings';var L=JSON.parse(localStorage.getItem(k)||'{}').sessionListLayout;var solo=/^\/session\//.test(location.pathname);var C=localStorage.getItem('codeman-sidebar-collapsed');document.documentElement.dataset.sessionList=(L==='sidebar'&&!solo)?'sidebar':'header';document.documentElement.dataset.sidebar=(C===null?window.innerWidth<1024:C==='1')?'collapsed':'expanded';}catch(e){document.documentElement.dataset.sessionList='header';document.documentElement.dataset.sidebar='expanded';}</script>
   <!-- Inline critical CSS for instant skeleton paint (before styles.css loads) -->
   <style>
     .loading-skeleton{display:flex;flex-direction:column;height:100vh;height:100dvh;background:var(--bg-dark,#11151c)}
@@ -70,22 +58,8 @@
     .skeleton-brand{color:var(--accent,#38b6f0);font-size:14px;font-weight:700;font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;opacity:.85}
     .skeleton-tabs{display:flex;gap:4px;margin-left:16px}
     .skeleton-tab{width:80px;height:24px;background:var(--control-bg,rgba(255,255,255,0.04));border-radius:6px}
-    .skeleton-body{flex:1;display:flex;min-height:0}
-    .skeleton-sidebar{display:none;width:44px;flex:0 0 44px;background:var(--glass-bg,rgba(31,38,48,0.85));border-right:1px solid var(--glass-border,rgba(255,255,255,0.08))}
     .skeleton-terminal{flex:1;background:var(--term-bg,#161b23)}
     .skeleton-toolbar{height:42px;background:var(--glass-bg,rgba(31,38,48,0.85));border-top:1px solid var(--glass-border,rgba(255,255,255,0.08))}
-    /* Sidebar layout: the strip skeleton would flash a grey pill where no strip
-       will be, so swap it for a rail matching --sidebar-width-collapsed. */
-    html[data-session-list="sidebar"] .skeleton-tabs{display:none}
-    /* Only >=1024px docks the sidebar and reserves layout width; below that it is
-       an off-canvas overlay, so a rail in the skeleton would be a strip that
-       vanishes. The pre-paint script has already resolved the collapse state, so
-       match the real width and spare the terminal a 216px sideways jump once
-       styles.css lands. */
-    @media (min-width: 1024px) {
-      html[data-session-list="sidebar"] .skeleton-sidebar{display:block}
-      html[data-session-list="sidebar"][data-sidebar="expanded"] .skeleton-sidebar{width:260px;flex:0 0 260px}
-    }
     .app-loaded .loading-skeleton{display:none}
   </style>
 </head>
@@ -96,10 +70,7 @@
       <span class="skeleton-brand">Codeman</span>
       <div class="skeleton-tabs"><div class="skeleton-tab"></div></div>
     </div>
-    <div class="skeleton-body">
-      <div class="skeleton-sidebar"></div>
-      <div class="skeleton-terminal"></div>
-    </div>
+    <div class="skeleton-terminal"></div>
     <div class="skeleton-toolbar"></div>
   </div>
   <!-- Skip link for keyboard users -->
@@ -113,27 +84,10 @@
         <span class="logo" onclick="app.goHome()" title="Go to main page"
           ><span class="logo-text">Codeman</span><span class="logo-compact" aria-hidden="true">C</span></span
         >
-        <!-- Collapse/expand the session sidebar. Lives in .header-brand, NOT in
-             #headerRight: test/mobile-header-buttons-policy.test.ts only enumerates
-             buttons inside .header-right, and on a phone this button is the only
-             way to open the off-canvas session drawer, so it must never be hidden
-             by the phone header policy. Shown only in sidebar layout — visibility
-             via marker class, never inline style. -->
-        <button class="btn-icon-header btn-sidebar-toggle btn-sidebar-toggle--hidden"
-          id="sidebarToggleBtn" onclick="app.toggleSessionSidebar()"
-          title="Collapse session sidebar" aria-label="Collapse session sidebar"
-          aria-expanded="true" aria-controls="sessionSidebar">
-          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M9 3v18"/></svg>
-        </button>
       </div>
 
-      <!-- Session Tabs. In sidebar layout THIS VERY #sessionTabs element is
-           re-parented into #sessionSidebarList by applySessionListLayout() and
-           this host is hidden — it is never cloned or rebuilt, because
-           app.$('sessionTabs') caches it by object identity and never invalidates. -->
-      <div class="session-tabs-host" id="sessionTabsHost">
-        <div class="session-tabs" id="sessionTabs" role="tablist" aria-label="Session tabs" aria-orientation="horizontal">
-        </div>
+      <!-- Session Tabs -->
+      <div class="session-tabs" id="sessionTabs" role="tablist" aria-label="Session tabs">
       </div>
 
       <!-- Detached single-session window title (shown only in solo mode) -->
@@ -355,26 +309,6 @@
 
     <!-- Main Terminal Area -->
     <main class="main">
-      <!-- Collapsible session sidebar (opt-in layout). Deliberately EMPTY in
-           markup: applySessionListLayout() moves #sessionTabs in here, so the
-           vertical list is the exact same DOM node as the header strip and every
-           renderer, drag handler and webview-tabs.js consumer keeps working.
-           Must stay a SIBLING of .terminal-wrap — .main.webview-active hides
-           .terminal-wrap, and the sidebar has to survive that. -->
-      <aside class="session-sidebar" id="sessionSidebar" aria-label="Sessions">
-        <div class="session-sidebar-head">
-          <span class="session-sidebar-title">Sessions</span>
-          <span class="session-sidebar-count" id="sessionSidebarCount" aria-hidden="true"></span>
-        </div>
-        <div class="session-sidebar-filter">
-          <input type="search" id="sessionSidebarFilter" class="session-sidebar-filter-input"
-            placeholder="Filter sessions" aria-label="Filter sessions"
-            autocomplete="off" spellcheck="false"
-            oninput="app.applySidebarFilter(this.value)">
-        </div>
-        <div class="session-sidebar-list" id="sessionSidebarList"></div>
-      </aside>
-
       <div class="terminal-wrap">
         <!-- Partial-history notice (#258). Lives OUTSIDE the terminal on purpose:
              the old notice was a grey line written into the scrollback, so it
@@ -753,7 +687,6 @@
               <div><kbd>Ctrl</kbd>+<kbd>Tab</kbd></div><div>Next Session</div>
               <div><kbd>Alt/Option</kbd>+<kbd>[</kbd> / <kbd>Alt/Option</kbd>+<kbd>]</kbd></div><div>Previous / Next Session</div>
               <div><kbd>Alt/Option</kbd>+<kbd>1-9</kbd></div><div>Switch to Tab N</div>
-              <div><kbd>Alt/Option</kbd>+<kbd>B</kbd></div><div>Toggle Session Sidebar</div>
             </div>
           </section>
           <section class="shortcut-section">
@@ -761,8 +694,8 @@
             <div class="shortcuts-grid">
               <div><kbd>Ctrl</kbd>+<kbd>{</kbd></div><div>Move Active Tab Left</div>
               <div><kbd>Ctrl</kbd>+<kbd>}</kbd></div><div>Move Active Tab Right</div>
-              <div><kbd>ArrowLeft</kbd> / <kbd>ArrowUp</kbd></div><div>Focus Previous Tab</div>
-              <div><kbd>ArrowRight</kbd> / <kbd>ArrowDown</kbd></div><div>Focus Next Tab</div>
+              <div><kbd>ArrowLeft</kbd></div><div>Focus Previous Tab</div>
+              <div><kbd>ArrowRight</kbd></div><div>Focus Next Tab</div>
               <div><kbd>Home</kbd></div><div>Focus First Tab</div>
               <div><kbd>End</kbd></div><div>Focus Last Tab</div>
               <div><kbd>Enter</kbd> / <kbd>Space</kbd></div><div>Activate Focused Tab</div>
@@ -1840,16 +1773,6 @@
               <div class="set-group">
                 <div class="set-group-head"><h4>Tabs</h4><span class="set-scope">device</span></div>
                 <div class="set-group-body">
-                  <div class="set-row has-field" data-search="session list layout sidebar tab strip vertical">
-                    <div class="set-row-text">
-                      <span class="set-row-label">Session List Layout</span>
-                      <span class="set-row-desc">Horizontal strip in the header, or a collapsible left sidebar (Alt+B).</span>
-                    </div>
-                    <select id="appSettingsSessionListLayout" class="set-select">
-                      <option value="header">Header tab strip</option>
-                      <option value="sidebar">Left sidebar</option>
-                    </select>
-                  </div>
                   <div class="set-row" data-search="tall tabs folder name two rows">
                     <div class="set-row-text">
                       <span class="set-row-label">Tall Tabs</span>

src/web/public/mobile-handlers.js

@@ -168,11 +168,6 @@ const MobileDetection = {
       resizeTimeout = setTimeout(() => {
         this.updateBodyClass();
         this.updateAppHeight();
-        // Whether the session sidebar is a docked column or a modal overlay is
-        // decided at 1024px, so crossing that width has to re-sync the drawer
-        // state — otherwise the `inert`/aria-hidden set on a closed overlay
-        // drawer survives into the docked rail and makes it unclickable.
-        if (typeof app !== 'undefined') app.applySessionListLayout?.();
         // Tab auto-wrap is width-driven, so it must re-evaluate on resize — the only
         // other trigger is a tab content render. No-op on mobile/tablet (method bails).
         if (typeof app !== 'undefined') app.updateTabOverflowMode?.();
@@ -657,7 +652,6 @@ const SwipeHandler = {
   _touchStartHandler: null,
   _touchEndHandler: null,
   _element: null,
-  _ignoreGesture: false,
 
   /** Initialize swipe handling */
   init() {
@@ -686,12 +680,6 @@ const SwipeHandler = {
   },
 
   onTouchStart(e) {
-    // The session sidebar is an overlay child of .main, so its touches bubble in
-    // here. Swiping across the open session drawer — the natural "dismiss it"
-    // gesture — would otherwise fire nextSession() and drop the user into a
-    // session they never tapped.
-    this._ignoreGesture = !!e.target?.closest?.('.session-sidebar');
-    if (this._ignoreGesture) return;
     if (!e.touches || e.touches.length !== 1) return;
     this.startX = e.touches[0].clientX;
     this.startY = e.touches[0].clientY;
@@ -699,10 +687,6 @@ const SwipeHandler = {
   },
 
   onTouchEnd(e) {
-    if (this._ignoreGesture) {
-      this._ignoreGesture = false;
-      return;
-    }
     if (!e.changedTouches || e.changedTouches.length !== 1) return;
 
     const endX = e.changedTouches[0].clientX;

src/web/public/mobile.css

@@ -497,20 +497,6 @@ html.mobile-init .file-browser-panel {
     height: 12px;
   }
 
-  /* Exception to the 26px shrink above: in sidebar layout this button is the
-     ONLY way to open the session list — the strip it replaced is gone. A 26px
-     target is below --touch-target-min (44px), which the 430-768px block
-     already enforces for every other header button. */
-  html[data-session-list='sidebar'] #sidebarToggleBtn {
-    width: 44px;
-    height: 44px;
-  }
-
-  html[data-session-list='sidebar'] #sidebarToggleBtn svg {
-    width: 18px;
-    height: 18px;
-  }
-
   /* Hide header settings gear, lifecycle log, away digest, session manager, and
      file viewer on mobile - settings moved to toolbar; the others are secondary /
      desktop-oriented controls that don't belong on the cramped phone header (the
@@ -3618,117 +3604,3 @@ html:is([data-skin="paper-gray"], [data-skin="solarized-light"], [data-skin="cat
     background: rgba(var(--accent-rgb), 0.13);
   }
 }
-
-/* ============================================================================
-   SESSION SIDEBAR — off-canvas drawer (tablet + phone)
-   ============================================================================
-   This whole file is served with media="(max-width: 1023px)", so these
-   top-level rules cover the entire handheld range — deliberately NOT wrapped in
-   a nested @media, because the two compact `.session-tabs` blocks above live in
-   `max-width: 768px` and `max-width: 430px` and would leave 769-1023px
-   unhandled.
-
-   Placement at the END of the file is load-bearing: the compact strip blocks at
-   lines ~117 and ~584 use the deliberate `.session-tabs, .session-tabs.tabs-two-rows`
-   (0,2,0) doubling documented there. The sidebar selectors below are (0,2,1)
-   and up AND come later, so they win on both counts. Move this block and the
-   list collapses to a 36px sliver that looks like an empty list.
-
-   Why an overlay instead of the desktop rail: 44px is 11% of a 393px viewport.
-   Below 1024px the sidebar never occupies layout width — it slides over the
-   terminal, following the .attachment-history-drawer recipe in styles.css.
-   `collapsed` therefore means "drawer closed", and applySessionListLayout()
-   mirrors that into the `.open` class. */
-
-html[data-session-list="sidebar"] .session-sidebar {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  width: min(280px, 80vw);
-  flex: 0 0 auto;
-  transform: translateX(-100%);
-  /* visibility, not just transform: an off-screen drawer keeps display:flex, so
-     without this its filter box and ~4 tab stops per session stay in the Tab
-     order and in the a11y tree. applySessionListLayout() also sets `inert`; this
-     is the CSS half, and the transition keeps it visible for the slide-out. */
-  visibility: hidden;
-  transition: transform var(--sidebar-transition), visibility var(--sidebar-transition);
-  box-shadow: 10px 0 28px rgba(0, 0, 0, 0.36);
-  z-index: 12;
-  padding-left: var(--safe-area-left);
-}
-
-html[data-session-list="sidebar"] .session-sidebar.open {
-  transform: translateX(0);
-  visibility: visible;
-}
-
-/* Collapsed == closed here, so the desktop icon-rail styling must not apply:
-   the drawer keeps its full width and its head/filter/labels while it is off
-   screen, otherwise opening it would animate in a 44px stub. */
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar {
-  flex-basis: auto;
-  width: min(280px, 80vw);
-}
-
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar-head,
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar-filter {
-  display: flex;
-}
-
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .session-tab {
-  justify-content: flex-start;
-  flex-wrap: nowrap;
-  padding: 0.4rem 0.5rem;
-}
-
-/* Undo the rail's content trimming: these rows are full-width drawer rows, just
-   currently off screen. Same specificity as the styles.css rail rules and later
-   in the cascade, which is why this file must stay loaded after styles.css. */
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .tab-info {
-  display: flex;
-}
-
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .tab-number {
-  display: inline-flex;
-}
-
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .tab-subagent-badge {
-  margin-left: 4px;
-}
-
-/* mobile.css:~604 pins .session-tab to max-height:32px for the horizontal strip,
-   which clips the folder row the sidebar always renders. Rows also need the
-   44px touch target the strip cannot afford. */
-html[data-session-list="sidebar"] .session-sidebar .session-tab {
-  min-height: 44px;
-  max-height: none;
-  flex-shrink: 0;
-}
-
-/* Touch has no hover: reveal-on-hover row actions would be unreachable.
-   Matches the (hover: none) block above, but has to be repeated here because
-   the phone block hides them on non-active tabs with (0,2,0). */
-html[data-session-list="sidebar"] .session-sidebar .session-tab .tab-gear,
-html[data-session-list="sidebar"] .session-sidebar .session-tab .tab-close {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  opacity: 1;
-  width: auto;
-  min-width: 28px;
-  height: auto;
-  margin-left: 0;
-  padding: 0.15rem 0.25rem;
-}
-
-/* (.tab-filtered-out is handled in styles.css — its rule is already scoped to
-   html[data-session-list="sidebar"] and carries !important, so it wins here too;
-   no handheld variant needed.) */
-
-@media (prefers-reduced-motion: reduce) {
-  html[data-session-list="sidebar"] .session-sidebar {
-    transition: none;
-  }
-}

src/web/public/panels-ui.js

@@ -15,6 +15,11 @@
 
 const AWAY_DIGEST_LAST_VIEWED_KEY = 'codeman-away-digest-last-viewed';
 const FILE_BROWSER_SHOW_HIDDEN_KEY = 'codeman:fileBrowserShowHidden';
+// Bounds for the by-id text preview, mirroring what the workspace text preview
+// already does server-side (500 lines). The byte cap rides a Range request, so
+// a huge log is a partial read rather than a download the viewer throws away.
+const TEXT_PREVIEW_MAX_BYTES = 512 * 1024;
+const TEXT_PREVIEW_MAX_LINES = 500;
 const AWAY_DIGEST_SECTIONS = [
   ['needsAttention', 'Needs Attention'],
   ['completed', 'Completed'],
@@ -3234,6 +3239,65 @@ Object.assign(CodemanApp.prototype, {
     if (headerBtn) headerBtn.setAttribute('aria-expanded', 'false');
   },
 
+  /**
+   * Whether a path is absolute and provably OUTSIDE this session's workspace.
+   *
+   * `file-content` / `file-raw` resolve every path against `workingDir` and
+   * refuse anything that escapes it, so an absolute path elsewhere on the host
+   * (an agent's `/tmp` scratchpad capture, a screenshot, another checkout) can
+   * only ever 404 there — it has to go through the attachment routes instead.
+   *
+   * A string compare is enough for ROUTING; the real containment decision stays
+   * server-side (realpath + guard) on whichever route the request lands on. An
+   * unknown workingDir answers false, leaving the historical path untouched.
+   */
+  _isExternalPreviewPath(filePath, sessionId) {
+    if (typeof filePath !== 'string' || !filePath.startsWith('/')) return false;
+    const workingDir = this.sessions.get(sessionId)?.workingDir;
+    if (!workingDir) return false;
+    const root = workingDir.endsWith('/') ? workingDir : `${workingDir}/`;
+    return filePath !== workingDir && !filePath.startsWith(root);
+  },
+
+  /**
+   * Register an out-of-workspace path as a live external attachment and return
+   * its id, so the preview can render it through the by-id attachment routes.
+   *
+   * `notify: false` keeps this quiet: the caller is already opening the file in
+   * the overlay, so the usual attachment card + unread badge would be noise on
+   * top of the thing the user just asked to see. The server still enforces the
+   * full attachment guard (blocked secret trees, extension allowlist, symlinks
+   * resolved), so a refusal here is a policy answer worth showing verbatim.
+   *
+   * @returns {Promise<{attachmentId?: string, size?: number, error?: string}>}
+   */
+  async _registerExternalPreview(filePath, sessionId) {
+    try {
+      const res = await fetch(`/api/sessions/${sessionId}/attachments`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ path: filePath, notify: false }),
+      });
+      const result = await res.json().catch(() => null);
+      if (res.ok && result?.success && result.data?.attachmentId) {
+        return { attachmentId: result.data.attachmentId, size: result.data.size || 0 };
+      }
+      const reason = result?.error || `Cannot open this file (HTTP ${res.status})`;
+      // The registry's type answer is a policy term, not an explanation, and the
+      // user just clicked a file they can see on disk. Say what IS previewable
+      // from outside the workspace instead.
+      if (/unsupported/i.test(reason)) {
+        const ext = (filePath.split('.').pop() || '').toLowerCase();
+        return {
+          error: `Cannot preview .${ext} from outside the session workspace (images, video, audio, PDF, Office documents and text files only).`,
+        };
+      }
+      return { error: reason };
+    } catch (err) {
+      return { error: err.message || 'Cannot open this file' };
+    }
+  },
+
   async openFilePreview(filePath, sessionId = this.activeSessionId, attachmentId = null) {
     if (!sessionId || !filePath) return;
 
@@ -3258,25 +3322,70 @@ Object.assign(CodemanApp.prototype, {
 
     const ext = (filePath.split('.').pop() || '').toLowerCase();
 
+    // Out-of-workspace path: mint an attachment id up front. Every branch below
+    // talks to a workspace-confined route, so without this the image/PDF ones
+    // render a broken frame and the text one reports a bare "File not found"
+    // for a file that is sitting right there on disk.
+    let externalError = '';
+    let externalSize = 0;
+    if (!attachmentId && this._isExternalPreviewPath(filePath, sessionId)) {
+      const external = await this._registerExternalPreview(filePath, sessionId);
+      attachmentId = external.attachmentId || null;
+      externalError = external.error || '';
+      externalSize = external.size || 0;
+    }
+    if (!attachmentId && externalError) {
+      footerEl.textContent = '';
+      bodyEl.innerHTML = `<div class="binary-message">${escapeHtml(externalError)}</div>`;
+      return;
+    }
+
     // Registered attachment: render straight from its by-id routes — images and
     // PDFs inline, Office docs via the server-converted PDF preview, text fetched
     // raw. (Workspace-path previews fall through to the file-content endpoint.)
     if (attachmentId) {
       const base = `/api/sessions/${sessionId}/attachments/${encodeURIComponent(attachmentId)}`;
       const IMAGE_EXTS = new Set(['png', 'jpg', 'jpeg', 'gif', 'webp', 'bmp', 'svg']);
-      footerEl.textContent = ext.toUpperCase();
+      const VIDEO_EXTS = new Set(['mp4', 'webm', 'mov', 'm4v', 'ogv']);
+      const AUDIO_EXTS = new Set(['mp3', 'wav', 'ogg', 'oga', 'm4a', 'aac', 'flac', 'opus']);
+      // Size when we just registered the file ourselves, so a path opened from a
+      // link reads like a workspace preview instead of a bare "PNG". History
+      // cards arrive with an id and no size and keep the short form.
+      footerEl.textContent = externalSize ? `${this.formatFileSize(externalSize)} • ${ext}` : ext.toUpperCase();
       if (IMAGE_EXTS.has(ext)) {
         bodyEl.innerHTML = `<img src="${escapeHtml(`${base}/raw`)}" alt="${escapeHtml(filePath)}">`;
+      } else if (VIDEO_EXTS.has(ext)) {
+        // Same markup as the workspace branch below, including playsinline: iOS
+        // otherwise hijacks playback into its own fullscreen player, which
+        // leaves this overlay behind it with no way back but its close button.
+        // The attachment raw route is range-aware, so the scrub bar works.
+        bodyEl.innerHTML = `<video src="${escapeHtml(`${base}/raw`)}" controls autoplay playsinline preload="metadata"></video>`;
+      } else if (AUDIO_EXTS.has(ext)) {
+        bodyEl.innerHTML = `<audio src="${escapeHtml(`${base}/raw`)}" controls autoplay preload="metadata"></audio>`;
       } else if (ext === 'pdf') {
         bodyEl.innerHTML = `<iframe src="${escapeHtml(`${base}/raw`)}" title="${escapeHtml(filePath)}"></iframe>`;
       } else if (ext === 'docx' || ext === 'pptx') {
         bodyEl.innerHTML = `<iframe src="${escapeHtml(`${base}/preview`)}" title="${escapeHtml(filePath)}"></iframe>`;
       } else {
         try {
-          const res = await fetch(`${base}/raw`);
+          // Bounded like the workspace text preview: a Range for the first
+          // chunk (the route is range-aware, so this is a real partial read,
+          // not a 50MB download thrown away) and a line cap on top. An agent's
+          // log can be enormous, and rendering all of it into one <pre> is how
+          // you lock up the tab on the file you wanted to glance at.
+          const res = await fetch(`${base}/raw`, { headers: { Range: `bytes=0-${TEXT_PREVIEW_MAX_BYTES - 1}` } });
           if (!res.ok) throw new Error('Failed to load attachment');
           const text = await res.text();
-          bodyEl.innerHTML = `<pre><code>${escapeHtml(text)}</code></pre>`;
+          const clippedByBytes = res.status === 206 && text.length >= TEXT_PREVIEW_MAX_BYTES;
+          const lines = text.split('\n');
+          const clippedByLines = lines.length > TEXT_PREVIEW_MAX_LINES;
+          const shown = clippedByLines ? lines.slice(0, TEXT_PREVIEW_MAX_LINES).join('\n') : text;
+          bodyEl.innerHTML = `<pre><code>${escapeHtml(shown)}</code></pre>`;
+          this.filePreviewContent = shown;
+          if (clippedByLines || clippedByBytes) {
+            const note = clippedByLines ? `showing first ${TEXT_PREVIEW_MAX_LINES} lines` : 'showing the start of the file';
+            footerEl.textContent = `${footerEl.textContent} (${note})`;
+          }
         } catch (err) {
           bodyEl.innerHTML = `<div class="binary-message">Error: ${escapeHtml(err.message)}</div>`;
         }

src/web/public/session-lineage.js

@@ -130,14 +130,6 @@ Object.assign(CodemanApp.prototype, {
   _appendLineageConnectionLines(svg, rects) {
     this._lineageEdgeCount = 0;
     if (!svg || !this._lineageLinesEnabled()) return;
-    // Sidebar layout: computeLineagePath()'s whole geometry — the U-bridge hung
-    // from the STRIP's bottom edge, the 64px dip corridor — assumes a horizontal
-    // tab row. Against a vertical list the "strip bottom" is the bottom of the
-    // sidebar, so every arc would draw a giant loop to the foot of the list.
-    // Parent/child adjacency reads fine in a vertical list without arcs; a
-    // sideways lineage shape is a follow-up with its own visual tuning, not a
-    // by-product of a layout port.
-    if (this.isSessionSidebarActive?.()) return;
     const compute = window.CodemanLineage && window.CodemanLineage.computePath;
     if (!compute) return;
 
@@ -211,10 +203,7 @@ Object.assign(CodemanApp.prototype, {
     const strip = document.getElementById('sessionTabs');
     if (!strip) return;
     this._lineageScrollHandler = () => {
-      // Sidebar layout scrolls the SAME element vertically, and there the
-      // subagent/ultracode connectors anchor to tab rects too (lineage arcs are
-      // skipped, so _lineageEdgeCount alone would never redraw them).
-      if (this._lineageEdgeCount > 0 || this.isSessionSidebarActive?.()) this.updateConnectionLines();
+      if (this._lineageEdgeCount > 0) this.updateConnectionLines();
     };
     strip.addEventListener('scroll', this._lineageScrollHandler, { passive: true });
   },

src/web/public/session-ui.js

@@ -1814,10 +1814,7 @@ Object.assign(CodemanApp.prototype, {
     input.value = parsed ? parsed.suffix : (session.name || '');
     input.placeholder = parsed ? 'Add description...' : currentName;
     input.className = 'tab-rename-input';
-    // 80px is tuned for the narrow header tab; a full-width sidebar row can and
-    // should give the whole line to the input.
-    const renameWidth = this.isSessionSidebarActive?.() ? '100%' : '80px';
-    input.style.cssText = `width: ${renameWidth}; min-width: 0; font-size: 0.75rem; padding: 2px 4px; background: var(--bg-input); border: 1px solid var(--accent); border-radius: 3px; color: var(--text); outline: none;`;
+    input.style.cssText = 'width: 80px; font-size: 0.75rem; padding: 2px 4px; background: var(--bg-input); border: 1px solid var(--accent); border-radius: 3px; color: var(--text); outline: none;';
 
     tabName.appendChild(input);
     input.focus();

src/web/public/settings-ui.js

@@ -387,8 +387,6 @@ Object.assign(CodemanApp.prototype, {
     document.getElementById('appSettingsExtendedKeyboardBar').checked = settings.extendedKeyboardBar ?? false;
     document.getElementById('appSettingsTabTwoRows').checked = settings.tabTwoRows ?? defaults.tabTwoRows ?? false;
     document.getElementById('appSettingsShowTabDetachButton').checked = settings.showTabDetachButton ?? defaults.showTabDetachButton ?? false;
-    document.getElementById('appSettingsSessionListLayout').value =
-      settings.sessionListLayout ?? defaults.sessionListLayout ?? 'header';
     // Claude CLI settings
     const claudeModeSelect = document.getElementById('appSettingsClaudeMode');
     const allowedToolsRow = document.getElementById('allowedToolsRow');
@@ -2009,7 +2007,6 @@ Object.assign(CodemanApp.prototype, {
       extendedKeyboardBar: document.getElementById('appSettingsExtendedKeyboardBar').checked,
       tabTwoRows: document.getElementById('appSettingsTabTwoRows').checked,
       showTabDetachButton: document.getElementById('appSettingsShowTabDetachButton').checked,
-      sessionListLayout: document.getElementById('appSettingsSessionListLayout').value,
       skin: document.getElementById('appSettingsSkin').value,
       // Claude CLI settings
       claudeMode: document.getElementById('appSettingsClaudeMode').value,
@@ -2154,9 +2151,7 @@ Object.assign(CodemanApp.prototype, {
     this.applyHeaderVisibilitySettings();
     this.applySkin();
     this.applyLocalization();
-    // Re-parents #sessionTabs between header host and sidebar if the layout
-    // changed, then calls applyTabWrapSettings() itself — do not call both.
-    this.applySessionListLayout();
+    this.applyTabWrapSettings();
     this.applyLineageLineSettings?.();
     this._updateTokensImmediate();  // Re-render token display (picks up showCost change)
     this.applyMonitorVisibility();
@@ -2394,7 +2389,6 @@ Object.assign(CodemanApp.prototype, {
         imageWatcherEnabled: false,
         ralphTrackerEnabled: false,
         tabTwoRows: false,
-        sessionListLayout: 'header',
         cjkInputEnabled: false,
         terminalWheelLocalScrollback: false, // mobile scrolls via touch, not wheel
         webglRendererEnabled: false, // mobile always uses the DOM renderer
@@ -2639,27 +2633,19 @@ Object.assign(CodemanApp.prototype, {
     const settings = this.loadAppSettingsFromStorage();
     const defaults = this.getDefaultSettings();
     const deviceType = MobileDetection.getDeviceType();
-    // The left sidebar is one vertical column with its own scroller: there is no
-    // row to wrap into, and its rows are always tall (name + folder) because that
-    // is the cheapest way to tell 25 sessions apart. Header strip keeps the old
-    // rules unchanged. Kept here rather than only in applySessionListLayout() so
-    // that a stray applyTabWrapSettings() call (this one is invoked from
-    // saveAppSettings and from the resize path) cannot leave the sidebar wrapped.
-    const sidebar = this.isSessionSidebarActive?.() === true;
     // Two-row tabs disabled on mobile/tablet — not enough screen space
-    const twoRows = !sidebar && deviceType === 'desktop'
+    const twoRows = deviceType === 'desktop'
       ? (settings.tabTwoRows ?? defaults.tabTwoRows ?? false)
       : false;
-    const showFolder = sidebar || twoRows;
     const prevTallTabs = this._tallTabsEnabled;
-    this._tallTabsEnabled = showFolder;
+    this._tallTabsEnabled = twoRows;
     const tabsEl = document.getElementById('sessionTabs');
     if (tabsEl) {
       tabsEl.classList.toggle('tabs-two-rows', twoRows);
-      tabsEl.classList.toggle('tabs-show-folder', showFolder);
+      tabsEl.classList.toggle('tabs-show-folder', twoRows);
     }
     // Re-render tabs if folder visibility changed (folder spans are generated in JS)
-    if (prevTallTabs !== undefined && prevTallTabs !== showFolder) {
+    if (prevTallTabs !== undefined && prevTallTabs !== twoRows) {
       this._fullRenderSessionTabs();
     }
   },
@@ -2864,7 +2850,7 @@ Object.assign(CodemanApp.prototype, {
           'showFontControls', 'showSystemStats', 'showTokenCount', 'showCost',
           'showLifecycleLog', 'showResponseViewer', 'showRedrawButton',
           'showMonitor', 'showProjectInsights', 'showFileBrowser', 'showSubagents',
-          'subagentActiveTabOnly', 'tabTwoRows', 'sessionListLayout', 'localEchoEnabled', 'cjkInputEnabled', 'extendedKeyboardBar',
+          'subagentActiveTabOnly', 'tabTwoRows', 'localEchoEnabled', 'cjkInputEnabled', 'extendedKeyboardBar',
           'skin', 'showPlanUsageLimits', 'showAttachmentsButton', 'showFileViewerButton', 'webglRendererEnabled',
           'language',
           'terminalWheelLocalScrollback',

src/web/public/styles.css

@@ -49,9 +49,6 @@
   --ring-glow: 0 0 12px -2px rgba(56, 182, 240, 0.55);
   --header-height: 36px;
   --toolbar-height: 42px;
-  --sidebar-width: 260px;
-  --sidebar-width-collapsed: 44px; /* == --touch-target-min */
-  --sidebar-transition: 0.18s ease;
   --glass-bg: rgba(31, 38, 48, 0.85);
   --glass-border: rgba(255, 255, 255, 0.08);
   --control-bg: rgba(255, 255, 255, 0.045);
@@ -2152,9 +2149,6 @@ html:not(.tabs-show-detach) .session-tab:not(.detached):not(.tab-show-detach) .t
 
 /* ===== Solo (detached single-session) window chrome ===================== */
 body.solo-mode .session-tabs,
-body.solo-mode .session-tabs-host,
-body.solo-mode .session-sidebar,
-body.solo-mode .btn-sidebar-toggle,
 body.solo-mode .header-system-stats,
 body.solo-mode .header-tokens,
 body.solo-mode .btn-notifications,
@@ -9861,13 +9855,18 @@ kbd {
 
 /* ========== File Preview Overlay ========== */
 
+/* Above the response viewer (5000) and its backdrop (4999): a file path in the
+   chat opens this overlay, and at the old 2000 it rendered BEHIND the panel it
+   was launched from — the click looked dead. Same relationship the path picker
+   and its preview already have (10020 / 10030). Still below the toast and
+   picker band (10000+), so a "Saved" toast keeps landing on top. */
 .file-preview-overlay {
   position: fixed;
   inset: 0;
   background: var(--modal-backdrop);
   backdrop-filter: blur(6px);
   -webkit-backdrop-filter: blur(6px);
-  z-index: 2000;
+  z-index: 5100;
   display: none;
   align-items: center;
   justify-content: center;
@@ -12419,6 +12418,16 @@ kbd {
   border-bottom-color: var(--accent);
 }
 
+/* File paths linkified out of the message text. Monospace so a path still reads
+   as a path in prose, and break-all because these are long and the viewer is
+   narrow on a phone. Colour/underline come from the .rv-text a rule above. */
+.rv-text a.rv-path {
+  font-family: 'Fira Code', 'JetBrains Mono', 'SF Mono', Menlo, Monaco, monospace;
+  font-size: 0.92em;
+  word-break: break-all;
+  cursor: pointer;
+}
+
 /* Tables — scroll wrapper keeps table proper while allowing horizontal overflow */
 .rv-table-wrap {
   margin: 1em 0;
@@ -16603,244 +16612,3 @@ html[data-skin="daylight-blue"] .welcome-btn-tunnel.active:hover {
   font-size: 0.8rem;
   padding: 4px 9px;
 }
-
-/* ============================================================
-   === Collapsible session sidebar (opt-in layout) ===
-   Appended at top level ON PURPOSE: styles.css:12171-12390 is one
-   html:not([data-skin="og"]) { … } native-nesting block whose bare
-   selectors resolve at (0,2,x) and re-tone .session-tab with
-   !important. Everything below is LAYOUT ONLY (flex/size/overflow/
-   display) and sets no colour on .session-tab, so it composes with
-   every skin instead of fighting it. Keep it that way.
-
-   The list itself is not a second DOM tree: applySessionListLayout()
-   moves the one #sessionTabs element between #sessionTabsHost (header)
-   and #sessionSidebarList (this aside).
-   ============================================================ */
-
-/* Header host — wraps #sessionTabs so the strip can be hidden without
-   touching the element that gets re-parented. */
-.session-tabs-host {
-  display: flex;
-  flex: 1;
-  min-width: 0;
-}
-
-html[data-session-list="sidebar"] .session-tabs-host {
-  display: none;
-}
-
-/* The header only needs flex-start to support the two-row strip; with the
-   strip gone the remaining header chrome should sit centered. */
-html[data-session-list="sidebar"] .header {
-  align-items: center;
-}
-
-.session-sidebar {
-  display: none;
-}
-
-html[data-session-list="sidebar"] .session-sidebar {
-  display: flex;
-  flex-direction: column;
-  flex: 0 0 var(--sidebar-width);
-  width: var(--sidebar-width);
-  min-width: 0;
-  background: var(--bg-card);
-  border-right: 1px solid var(--border);
-  /* Own stacking context ABOVE .welcome-overlay (z-index 10, which is what a
-     user with no open session sees) but BELOW .toolbar (20) — raising it to or
-     past 20 makes the Run menu unclickable again. */
-  position: relative;
-  z-index: 11;
-  transition: flex-basis var(--sidebar-transition), width var(--sidebar-transition);
-  /* Deliberately NO contain:paint — .header has it, which is exactly why app.js
-     re-parents .subagent-dropdown to <body>. Leaving it off keeps per-row
-     dropdowns and the inline rename input paintable in place. */
-}
-
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar {
-  flex-basis: var(--sidebar-width-collapsed);
-  width: var(--sidebar-width-collapsed);
-}
-
-.session-sidebar-head {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 0.5rem;
-  flex-shrink: 0;
-  padding: 0.4rem 0.6rem;
-  border-bottom: 1px solid var(--glass-border);
-  font-size: 0.7rem;
-  text-transform: uppercase;
-  letter-spacing: 0.05em;
-  color: var(--text-muted);
-}
-
-.session-sidebar-count {
-  font-variant-numeric: tabular-nums;
-  color: var(--text-dim);
-}
-
-.session-sidebar-filter {
-  display: flex;
-  flex-shrink: 0;
-  padding: 0.35rem 0.5rem;
-}
-
-.session-sidebar-filter-input {
-  width: 100%;
-  box-sizing: border-box;
-  padding: 0.3rem 0.45rem;
-  background: var(--bg-input);
-  border: 1px solid var(--control-border);
-  border-radius: var(--btn-radius);
-  color: var(--text);
-  font-family: inherit;
-  font-size: 0.75rem;
-  outline: none;
-}
-
-.session-sidebar-filter-input::placeholder {
-  color: var(--text-muted);
-}
-
-.session-sidebar-filter-input:focus-visible {
-  border-color: var(--accent);
-}
-
-/* Host for the relocated #sessionTabs. */
-.session-sidebar-list {
-  display: flex;
-  flex: 1;
-  min-height: 0;
-  overflow: hidden;
-}
-
-/* --- The relocated strip, now vertical --------------------------------- */
-html[data-session-list="sidebar"] .session-sidebar .session-tabs {
-  flex-direction: column;
-  align-items: stretch;
-  flex-wrap: nowrap;
-  gap: 2px;
-  flex: 1;
-  min-height: 0;
-  max-height: none;
-  overflow-x: hidden;
-  overflow-y: auto;
-  padding: 0.25rem;
-}
-
-html[data-session-list="sidebar"] .session-sidebar .session-tab {
-  width: 100%;
-  min-width: 0;
-  box-sizing: border-box;
-  padding: 0.4rem 0.5rem;
-  border-radius: var(--btn-radius);
-}
-
-/* .tab-info is already column/overflow-hidden/min-width:0 — it only has to
-   claim the free width now that rows are full-width. */
-html[data-session-list="sidebar"] .session-sidebar .tab-info {
-  flex: 1;
-  min-width: 0;
-}
-
-html[data-session-list="sidebar"] .session-sidebar .tab-name {
-  max-width: none;
-}
-
-/* Reveal-on-hover reads badly on a 40px-tall full-width row, so keep the row
-   actions permanently visible on the active session — no layout jitter when
-   the pointer crosses the list. */
-html[data-session-list="sidebar"] .session-sidebar .session-tab.active .tab-gear,
-html[data-session-list="sidebar"] .session-sidebar .session-tab.active .tab-detach,
-html[data-session-list="sidebar"] .session-sidebar .session-tab.active .tab-close {
-  opacity: 1;
-  width: auto;
-}
-
-/* Drag-reorder indicators become horizontal edges. The class names stay
-   drag-over-left / drag-over-right (they read as before/after now) so app.js,
-   the base rules above and the generated gesture bundle need no renaming. */
-html[data-session-list="sidebar"] .session-sidebar .session-tab.drag-over-left {
-  box-shadow: 0 -2px 0 0 var(--accent);
-}
-
-html[data-session-list="sidebar"] .session-sidebar .session-tab.drag-over-right {
-  box-shadow: 0 2px 0 0 var(--accent);
-}
-
-/* Sidebar filter box (applySidebarFilter toggles this class post-render).
-   Scoped to the sidebar layout on purpose: applySidebarFilter() already strips
-   the class whenever the filter box is off screen, and this prefix is the
-   second lock — a leaked class must never be able to hide tabs from the header
-   strip, which has no filter control to clear it with. */
-html[data-session-list="sidebar"] .session-tab.tab-filtered-out {
-  display: none !important;
-}
-
-/* --- Collapsed rail ---------------------------------------------------- */
-/* Collapsed is a 44px icon rail, not "hidden": the ambient signal (status dot,
-   task/subagent/ultracode badges) is the whole point of mission control and
-   must survive collapse. The rail is also its own reopen affordance — clicking
-   a row still switches session.
-   NOT surviving: the name, the folder and the `sh`/`oc`/`cx`/`gm` mode chip —
-   the chip is rendered inside .tab-info (app.js row template), which the rail
-   hides. Moving it out of .tab-info just to keep it would change the shared row
-   markup for both layouts; agent type stays a hover/expand affordance. */
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar-head,
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar-filter {
-  display: none;
-}
-
-/* 44px rail minus the list's 0.25rem padding either side minus the row's 1px
-   borders leaves ~34px of content box. Number (16) + gap (5.6) + dot (6) + gap
-   (5.6) + one badge (16) already overflows that, and .tab-number / .tab-status
-   are flex-shrink: 0 — with justify-content: center the excess gets clipped at
-   BOTH ends, so the digit and the badge are cut in half. Two fixes, both
-   needed: drop the Alt+N hint (it is a keyboard affordance that only reads in
-   the expanded list; Alt+N itself keeps working), and let whatever is left wrap
-   instead of clipping, so a row carrying several badges just gets taller. */
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .session-tab {
-  justify-content: center;
-  align-content: center;
-  flex-wrap: wrap;
-  row-gap: 2px;
-  padding: 0.4rem 0;
-}
-
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .tab-info,
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .tab-number,
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .tab-gear,
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .tab-detach,
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .tab-close {
-  display: none;
-}
-
-/* The subagent badge carries a 4px left margin tuned for the horizontal strip;
-   in a centered 34px rail it pushes the row off-centre. */
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .session-sidebar .tab-subagent-badge {
-  margin-left: 0;
-}
-
-/* --- Toggle button ----------------------------------------------------- */
-.btn-sidebar-toggle--hidden {
-  display: none !important;
-}
-
-/* .btn-icon-header:hover rotates 45deg globally — a panel glyph must not spin. */
-.btn-sidebar-toggle:hover {
-  transform: none;
-}
-
-html[data-session-list="sidebar"][data-sidebar="collapsed"] .btn-sidebar-toggle svg {
-  transform: scaleX(-1);
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .session-sidebar {
-    transition: none;
-  }
-}

src/web/public/subagent-windows.js

@@ -401,12 +401,15 @@ Object.assign(CodemanApp.prototype, {
           continue;
         }
 
-        // Draw a curved line from the tab to the window. Header strip: tab
-        // bottom-center → window top-center (vertical). Sidebar: tab right-edge →
-        // window left-edge (horizontal), otherwise the curve loops backwards
-        // underneath the sidebar. _tabAnchor/_tabConnectorPath live in app.js.
-        const anchor = this._tabAnchor(tabRect);
-        const path = this._tabConnectorPath(anchor, winRect);
+        // Draw curved line from TAB bottom-center to window top-center
+        const x1 = tabRect.left + tabRect.width / 2;
+        const y1 = tabRect.bottom;
+        const x2 = winRect.left + winRect.width / 2;
+        const y2 = winRect.top;
+
+        // Bezier curve control points for smooth curve
+        const midY = (y1 + y2) / 2;
+        const path = `M ${x1} ${y1} C ${x1} ${midY}, ${x2} ${midY}, ${x2} ${y2}`;
 
         const line = document.createElementNS('http://www.w3.org/2000/svg', 'path');
         line.setAttribute('d', path);
@@ -746,11 +749,9 @@ Object.assign(CodemanApp.prototype, {
       win.style.top = `${finalY}px`;
       win.style.bottom = 'auto';
     } else if (flyFromTab) {
-      // Spawn at the tab: below it in header layout, to its RIGHT in sidebar
-      // layout — spawning at tabRect.left there would land on top of the sidebar.
-      const anchor = this._tabAnchor(parentTab.getBoundingClientRect());
-      win.style.left = `${anchor.spawnLeft}px`;
-      win.style.top = `${anchor.spawnTop}px`;
+      const tabRect = parentTab.getBoundingClientRect();
+      win.style.left = `${tabRect.left}px`;
+      win.style.top = `${tabRect.bottom}px`;
       win.style.transform = 'scale(0.3)';
       win.style.opacity = '0';
       win.classList.add('spawning');
@@ -1225,19 +1226,6 @@ Object.assign(CodemanApp.prototype, {
     dropdown.style.left = `${rect.left + rect.width / 2}px`;
     dropdown.style.transform = 'translateX(-50%)';
     dropdown.classList.add('open');
-
-    // Keep it on screen. A badge in the left sidebar — and above all one in the
-    // 44px collapsed rail — sits so far left that a centre-anchored dropdown
-    // hangs off the viewport. Measured after .open so it has a box; a no-op
-    // whenever the centred position already fits, so header layout is unchanged.
-    const dropRect = dropdown.getBoundingClientRect();
-    const overflowLeft = 8 - dropRect.left;
-    const overflowRight = dropRect.right - (window.innerWidth - 8);
-    if (overflowLeft > 0) {
-      dropdown.style.transform = `translateX(calc(-50% + ${Math.round(overflowLeft)}px))`;
-    } else if (overflowRight > 0) {
-      dropdown.style.transform = `translateX(calc(-50% - ${Math.round(overflowRight)}px))`;
-    }
   },
 
   // Schedule hide after delay (allows moving mouse to dropdown)

src/web/public/terminal-ui.js

@@ -326,17 +326,6 @@ Object.assign(CodemanApp.prototype, {
         return true;
       }
 
-      // Session-sidebar toggle chord (default Alt+B): same trap as above —
-      // preventDefault() in the capture handler does not stop xterm, so without
-      // this gate every toggle would ALSO send ESC b (readline backward-word)
-      // into the live session and walk the cursor back through the user's
-      // half-typed prompt. Registry-aware and only while the sidebar layout is
-      // active, so a rebind/disable and the default header layout keep plain
-      // Meta-b working in the terminal.
-      if (ev.type === 'keydown' && this.shouldToggleSessionSidebarFromShortcut?.(ev)) {
-        return false;
-      }
-
       // Ctrl+V / Cmd+V: intercept before xterm sends ^V to PTY.
       // Route through our paste trap which handles both images and text.
       if ((ev.ctrlKey || ev.metaKey) && ev.key === 'v' && ev.type === 'keydown') {
@@ -1434,19 +1423,19 @@ Object.assign(CodemanApp.prototype, {
         // the whole tab on hover. Non-empty token + bounded reps is O(n).
         const cmdPattern = /\b(tail|cat|head|less|grep|watch|vim|nano)\s+(?:[^\s\/]+\s+){0,4}(\/[^\s"'<>|;&\n\x00-\x1f]+)/g;
 
-        // Pattern 2: Paths with common extensions.
-        // Image/PDF extensions are included so pasted-attachment paths
-        // (`.claude-images/paste-*.png`) are clickable; they open the file preview
-        // rather than the log viewer (see addLink).
-        const extPattern =
-          /(\/(?:home|tmp|var|etc|opt)[^\s"'<>|;&\n\x00-\x1f]*\.(?:log|txt|json|md|yaml|yml|csv|xml|sh|py|ts|js|png|jpe?g|gif|webp|bmp|svg|pdf))\b/g;
+        // Pattern 2: Paths with common extensions. Image/PDF/media extensions are
+        // included so pasted-attachment paths (`.claude-images/paste-*.png`) and
+        // screenshots an agent just wrote are clickable; those open the file
+        // preview rather than the log viewer (see addLink).
+        //
+        // The literal lives in constants.js because the response viewer linkifies
+        // the SAME paths out of markdown — one definition, two consumers. A fresh
+        // instance per call: `lastIndex` is per-object state.
+        const extPattern = absoluteFilePathPattern();
 
         // Pattern 3: Bash() tool output
         const bashPattern = /Bash\([^)]*?(\/(?:home|tmp|var|etc|opt)[^\s"'<>|;&\)\n\x00-\x1f]+)/g;
 
-        /** Extensions that should open the image/document preview, not the log viewer. */
-        const PREVIEW_EXTS = new Set(['png', 'jpg', 'jpeg', 'gif', 'webp', 'bmp', 'svg', 'pdf']);
-
         const addLink = (filePath, matchIndex) => {
           const startCol = lineText.indexOf(filePath, matchIndex);
           if (startCol === -1) return;
@@ -1465,9 +1454,19 @@ Object.assign(CodemanApp.prototype, {
             },
             activate(event, text) {
               // Tailing a PNG in the log viewer shows binary noise; the file preview
-              // already renders images and PDFs inline.
-              const ext = (text.split('.').pop() || '').toLowerCase();
-              if (PREVIEW_EXTS.has(ext)) {
+              // already renders images, PDFs, documents and media inline — and it
+              // now reaches files outside the workspace too, which is where an
+              // agent's screenshots and scratchpad captures actually land.
+              //
+              // Text goes to the log viewer, which follows a file that is still
+              // being written — but ONLY where it can actually read: it spawns
+              // `tail -f` and allows the workspace, /var/log and ~/logs, so an
+              // out-of-workspace path there answered "Path must be within
+              // working directory or allowed log directories" while the SAME
+              // path clicked in the response viewer previewed fine. The preview
+              // reads those through the guarded attachment routes, so external
+              // paths route there and the two surfaces agree.
+              if (previewsInFileViewer(text) || self._isExternalPreviewPath(text, self.activeSessionId)) {
                 self.openFilePreview(text, self.activeSessionId);
                 return;
               }

src/web/public/ultracode-windows.js

@@ -197,13 +197,10 @@ Object.assign(CodemanApp.prototype, {
     // Position: spawn from the parent tab if we can find it, else cascade.
     const parentTab = parentSessionId ? document.querySelector(`.session-tab[data-id="${parentSessionId}"]`) : null;
     if (parentTab) {
-      // _tabAnchor() puts the spawn point below the tab in header layout and to
-      // the RIGHT of it in sidebar layout, so the window never lands on the
-      // sidebar. The viewport clamp is unchanged.
-      const anchor = this._tabAnchor(parentTab.getBoundingClientRect());
-      const left = Math.max(8, Math.min(anchor.spawnLeft, window.innerWidth - 392));
+      const r = parentTab.getBoundingClientRect();
+      const left = Math.max(8, Math.min(r.left, window.innerWidth - 392));
       win.style.left = `${left}px`;
-      win.style.top = `${anchor.spawnTop + (anchor.vertical ? 14 : 0)}px`;
+      win.style.top = `${r.bottom + 14}px`;
     } else {
       const n = this.ultracodeWindows.size;
       win.style.left = `${24 + n * 26}px`;
@@ -787,12 +784,16 @@ Object.assign(CodemanApp.prototype, {
       winList.push({ runId, parentSessionId, winRect: data.element.getBoundingClientRect() });
     }
 
-    // PHASE 2: writes (curve from the tab anchor to the window — bottom-center to
-    // top-center in header layout, right-edge to left-edge in sidebar layout).
+    // PHASE 2: writes (curve from tab bottom-center to window top-center).
     for (const { runId, parentSessionId, winRect } of winList) {
       const tabRect = rects.get('tab:' + parentSessionId);
       if (!tabRect) continue;
-      const path = this._tabConnectorPath(this._tabAnchor(tabRect), winRect);
+      const x1 = tabRect.left + tabRect.width / 2;
+      const y1 = tabRect.bottom;
+      const x2 = winRect.left + winRect.width / 2;
+      const y2 = winRect.top;
+      const midY = (y1 + y2) / 2;
+      const path = `M ${x1} ${y1} C ${x1} ${midY}, ${x2} ${midY}, ${x2} ${y2}`;
       const line = document.createElementNS('http://www.w3.org/2000/svg', 'path');
       line.setAttribute('d', path);
       line.setAttribute('class', 'connection-line ultracode-connection');
@@ -817,13 +818,12 @@ Object.assign(CodemanApp.prototype, {
       if (!info.element) continue;
       const winRect = info.element.getBoundingClientRect();
       // Anchor: parent run window bottom-center if open, else the run's tab.
-      // A window anchor is always vertical; a tab anchor follows the session-list
-      // layout (_tabAnchor), so the curve leaves a sidebar row sideways.
-      let anchor;
+      let px, py;
       const runWin = info.runId ? this.ultracodeWindows.get(info.runId) : null;
       if (runWin && runWin.element) {
         const pr = runWin.element.getBoundingClientRect();
-        anchor = { x: pr.left + pr.width / 2, y: pr.bottom, vertical: true };
+        px = pr.left + pr.width / 2;
+        py = pr.bottom;
       } else {
         const summary = info.runId && this.workflowRuns ? this.workflowRuns.get(info.runId) : null;
         const parentSessionId = summary ? this._resolveUltracodeParentSession(summary) : null;
@@ -835,9 +835,13 @@ Object.assign(CodemanApp.prototype, {
         }
         const tabRect = rects.get(tabKey);
         if (!tabRect) continue;
-        anchor = this._tabAnchor(tabRect);
+        px = tabRect.left + tabRect.width / 2;
+        py = tabRect.bottom;
       }
-      const path = this._tabConnectorPath(anchor, winRect);
+      const x2 = winRect.left + winRect.width / 2;
+      const y2 = winRect.top;
+      const midY = (py + y2) / 2;
+      const path = `M ${px} ${py} C ${px} ${midY}, ${x2} ${midY}, ${x2} ${y2}`;
       const line = document.createElementNS('http://www.w3.org/2000/svg', 'path');
       line.setAttribute('d', path);
       line.setAttribute('class', 'connection-line ultracode-connection ultracode-agent-connection');

src/web/public/webview-tabs.js

@@ -156,9 +156,6 @@ Object.assign(CodemanApp.prototype, {
     document.querySelector('.main')?.classList.add('webview-active');
     this.renderSessionTabs();
     this._updateActiveWebviewTab();
-    // Web tabs live in the same list as sessions, so picking one from the
-    // handheld session drawer has to dismiss it too (no-op elsewhere).
-    this.closeSessionSidebarOnHandheld?.();
   },
 
   /** Create the frame if absent, then reveal it and hide its siblings. */

src/web/routes/file-routes.ts

@@ -23,12 +23,15 @@ import type {
 import { ApiErrorCode, createErrorResponse, getErrorMessage } from '../../types.js';
 import { fileStreamManager } from '../../file-stream-manager.js';
 import {
+  AUDIO_ATTACHMENT_EXTENSIONS,
   AttachmentRegistrationError,
   attachmentRecordToEvent,
   attachmentRegistry,
   buildFileThumbnailRoute,
   isSupportedAttachmentExtension,
   registerExternalAttachment,
+  TEXT_ATTACHMENT_EXTENSIONS,
+  VIDEO_ATTACHMENT_EXTENSIONS,
   type AttachmentRecord,
 } from '../../attachment-registry.js';
 import { generateFirstPageThumbnail } from '../../document-thumbnailer.js';
@@ -67,6 +70,22 @@ const MIME_TYPES: Record<string, string> = {
   webp: 'image/webp',
   ico: 'image/x-icon',
   bmp: 'image/bmp',
+  // Media needs a real type, not the octet-stream fallback: a <video>/<audio>
+  // element refuses to decode an unknown type, so a missing entry here presents
+  // as a player that renders and then does nothing.
+  mp4: 'video/mp4',
+  webm: 'video/webm',
+  mov: 'video/quicktime',
+  m4v: 'video/x-m4v',
+  ogv: 'video/ogg',
+  mp3: 'audio/mpeg',
+  wav: 'audio/wav',
+  ogg: 'audio/ogg',
+  oga: 'audio/ogg',
+  m4a: 'audio/mp4',
+  aac: 'audio/aac',
+  flac: 'audio/flac',
+  opus: 'audio/opus',
   pdf: 'application/pdf',
   docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
   pptx: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
@@ -175,10 +194,16 @@ async function serveRawFile(
       );
     return;
   }
-  if (download || extension === 'svg') {
+  // Markup is download-only: served with a renderable type on our own origin it
+  // would be stored XSS. SVG was always here; HTML/HTM join it now that the text
+  // family is servable, so widening what can be READ never widened what can RUN.
+  // The preview overlay reads these through `fetch()`, which ignores the
+  // disposition, so a clicked .html still shows its source.
+  const markupOnly = extension === 'svg' || extension === 'html' || extension === 'htm';
+  if (download || markupOnly) {
     reply.header(
       'Content-Type',
-      extension === 'svg' ? 'application/octet-stream' : MIME_TYPES[extension] || 'application/octet-stream'
+      markupOnly ? 'application/octet-stream' : MIME_TYPES[extension] || 'application/octet-stream'
     );
     reply.header('Content-Disposition', buildContentDisposition('attachment', fileName));
     reply.header('X-Content-Type-Options', 'nosniff');
@@ -186,6 +211,17 @@ async function serveRawFile(
     return;
   }
 
+  // Plain text with no dedicated MIME entry (code, config, logs, csv, xml) goes
+  // out as inert text/plain rather than the octet-stream fallback, matching what
+  // the path picker already does. Never a type the browser would execute.
+  if (!MIME_TYPES[extension] && TEXT_ATTACHMENT_EXTENSIONS.has(extension)) {
+    reply.header('Content-Type', 'text/plain; charset=utf-8');
+    reply.header('Content-Disposition', buildContentDisposition('inline', fileName));
+    reply.header('X-Content-Type-Options', 'nosniff');
+    sendFileBody(reply, resolvedPath, stat.size, rangeHeader);
+    return;
+  }
+
   reply.header('Content-Type', MIME_TYPES[extension] || 'application/octet-stream');
   reply.header('Content-Disposition', buildContentDisposition('inline', fileName));
   reply.header('X-Content-Type-Options', 'nosniff');
@@ -1099,8 +1135,10 @@ export function registerFileRoutes(app: FastifyInstance, ctx: SessionPort & Even
       // so the file viewer can open the same files.
       const ext = filePath.split('.').pop()?.toLowerCase() || '';
       const imageExts = new Set(['png', 'jpg', 'jpeg', 'gif', 'webp', 'svg', 'bmp', 'ico']);
-      const videoExts = new Set(['mp4', 'webm', 'mov', 'm4v', 'ogv']);
-      const audioExts = new Set(['mp3', 'wav', 'ogg', 'oga', 'm4a', 'aac', 'flac', 'opus']);
+      // Shared with the attachment registry so a video plays the same whether it
+      // sits in the workspace or is reached by id from outside it.
+      const videoExts = VIDEO_ATTACHMENT_EXTENSIONS;
+      const audioExts = AUDIO_ATTACHMENT_EXTENSIONS;
       const otherBinaryExts = new Set([
         'pdf',
         'zip',
@@ -1449,7 +1487,7 @@ export function registerFileRoutes(app: FastifyInstance, ctx: SessionPort & Even
   app.post('/api/sessions/:id/attachments', async (req, reply) => {
     const { id } = req.params as { id: string };
     const session = findSessionOrFail(ctx, id, req);
-    const body = (req.body || {}) as { path?: string };
+    const body = (req.body || {}) as { path?: string; notify?: boolean };
 
     if (!body.path || typeof body.path !== 'string') {
       reply.code(400).send(createErrorResponse(ApiErrorCode.INVALID_INPUT, 'Missing attachment path'));
@@ -1458,7 +1496,15 @@ export function registerFileRoutes(app: FastifyInstance, ctx: SessionPort & Even
 
     try {
       const event = await registerExternalAttachment(id, body.path, { sessionWorkingDir: session.workingDir });
-      ctx.broadcast(SseEvent.AttachmentDetected, event);
+      // `notify: false` registers QUIETLY. The file-preview overlay uses it to
+      // mint an id for a path the user just clicked (a terminal or response-viewer
+      // link pointing outside the workspace): it is already opening the file, so
+      // the attachment card + unread badge would be noise announcing what is
+      // filling the screen. Default stays true — every other caller (the
+      // `codeman attach` CLI, codeman-publish) wants the card.
+      if (body.notify !== false) {
+        ctx.broadcast(SseEvent.AttachmentDetected, event);
+      }
       return { success: true, data: event };
     } catch (err) {
       if (err instanceof AttachmentRegistrationError) {

src/web/schemas.ts

@@ -945,8 +945,6 @@ export const SettingsUpdateSchema = z
     // CODEMAN_ALLOW_UNAUTHENTICATED_NETWORK env var. Stripped before persisting.
     acknowledgeUnauthTunnel: z.boolean().optional(),
     tabTwoRows: z.boolean().optional(),
-    /** Session list layout: 'header' = horizontal tab strip, 'sidebar' = collapsible left sidebar. Display key (per-device). */
-    sessionListLayout: z.enum(['header', 'sidebar']).optional(),
     agentTeamsEnabled: z.boolean().optional(),
     /** Model for new Claude sessions (e.g. "claude-fable-5[1m]", "opus[1m]"); takes precedence over opusContext1mEnabled */
     claudeModel: z.string().max(50).optional(),

src/web/sensitive-path.ts

@@ -80,6 +80,23 @@ const SENSITIVE_PATTERNS: RegExp[] = [
   /\/\.claude\/\.credentials\.json$/,
   /\/\.codeman[^/]*\/hook-secret$/,
   /\/\.codeman[^/]*\/users\.json$/,
+  // Codeman's own state files. Named once `.json` became previewable outside
+  // the workspace: `SessionState.envOverrides` persists whatever the user set
+  // for a session, and the env allowlist admits key-shaped names
+  // (`GEMINI_API_KEY`, `CLAUDE_CODE_*`), so state can hold a live credential.
+  // `state[^/]*` rather than `state`: siblings like state-inner.json carry the
+  // same payload. Same reasoning as the two entries above, and it leaves the
+  // rest of ~/.codeman attachable.
+  /\/\.codeman[^/]*\/state[^/]*\.json$/,
+  // settings.json holds a credential BY SCHEMA (`voiceSettings.apiKey`, the
+  // Deepgram key); push-keys.json holds the VAPID PRIVATE key (enough to forge
+  // push notifications to every subscribed device); intents.json is written
+  // 0600 precisely because captured prompts can contain secrets, and is
+  // deliberately kept out of /api/search — it must not be readable through a
+  // different route instead.
+  /\/\.codeman[^/]*\/settings\.json$/,
+  /\/\.codeman[^/]*\/push-keys\.json$/,
+  /\/\.codeman[^/]*\/intents\.json$/,
 ];
 
 /**

test/link-provider-regex.test.ts

@@ -18,18 +18,25 @@ import { describe, it, expect } from 'vitest';
 import { readFileSync } from 'fs';
 import { join } from 'path';
 
-const SOURCE = readFileSync(join(__dirname, '..', 'src', 'web', 'public', 'terminal-ui.js'), 'utf-8');
+const publicFile = (name: string) => readFileSync(join(__dirname, '..', 'src', 'web', 'public', name), 'utf-8');
 
-/** Extract `const <name> = /.../g;` from the shipped source and build the RegExp. */
+const SOURCE = publicFile('terminal-ui.js');
+// The file-path pattern lives in constants.js: the response viewer linkifies the
+// same paths out of markdown, and one definition is what keeps a path that is
+// clickable in the terminal from being inert in the chat.
+const CONSTANTS_SOURCE = publicFile('constants.js');
+
+/** Extract `const <name> = /.../g;` from the shipped sources and build the RegExp. */
 function shippedPattern(name: string): RegExp {
-  const m = SOURCE.match(new RegExp(`const ${name} =\\s*\\n?\\s*(/(?:[^/\\\\\\n]|\\\\.)+/[a-z]*)`));
-  if (!m) throw new Error(`pattern ${name} not found in terminal-ui.js`);
+  const literal = new RegExp(`const ${name} =\\s*\\n?\\s*(/(?:[^/\\\\\\n]|\\\\.)+/[a-z]*)`);
+  const m = SOURCE.match(literal) ?? CONSTANTS_SOURCE.match(literal);
+  if (!m) throw new Error(`pattern ${name} not found in terminal-ui.js or constants.js`);
   const lit = m[1];
   const lastSlash = lit.lastIndexOf('/');
   return new RegExp(lit.slice(1, lastSlash), lit.slice(lastSlash + 1));
 }
 
-const PATTERN_NAMES = ['urlPattern', 'cmdPattern', 'extPattern', 'bashPattern'];
+const PATTERN_NAMES = ['urlPattern', 'cmdPattern', 'FILE_PATH_LINK_PATTERN', 'bashPattern'];
 
 /** Lines that made 0.9.10's cmdPattern backtrack exponentially (>2s each). */
 const KILLER_LINES = [
@@ -116,15 +123,24 @@ describe('terminal link-provider regexes (shipped source)', () => {
     }
   });
 
-  it('extPattern links pasted image/PDF attachment paths', () => {
+  it('the file-path pattern links pasted image/PDF/media attachment paths', () => {
     // `.claude-images/paste-*.png` is what Codeman writes for a pasted screenshot;
     // without image extensions the path rendered as plain, unclickable text.
-    const ext = shippedPattern('extPattern');
+    const ext = shippedPattern('FILE_PATH_LINK_PATTERN');
     const cases = [
       '/home/arkon/default/claudeman/.claude-images/paste-1785164958410-d11eb7d0.png',
       '/tmp/shot.jpeg',
       '/opt/app/report.pdf',
       '/home/a/diagram.svg',
+      // An agent's own scratchpad capture — the path shape this whole feature
+      // exists for, and the one that used to open a "File not found" preview.
+      '/tmp/claude-1000/-home-arkon-default-claudeman/7b3fefd2/scratchpad/probe-run-native.png',
+      // macOS and WSL roots: unmatched before, so Mac users had no clickable
+      // paths at all outside /var and /tmp.
+      '/Users/arbbot/codeman-cases/report.docx',
+      '/mnt/d/captures/demo.mp4',
+      // Longer extension of a family must win over its prefix (tsx over ts).
+      '/home/a/src/App.tsx',
     ];
     for (const path of cases) {
       ext.lastIndex = 0;
@@ -134,6 +150,13 @@ describe('terminal link-provider regexes (shipped source)', () => {
     }
   });
 
+  it('terminal-ui builds its path pattern from the shared factory', () => {
+    // Structural guard: a local literal here would drift from the response
+    // viewer's linkifier, which is the divergence the move exists to prevent.
+    expect(SOURCE).toContain('absoluteFilePathPattern()');
+    expect(SOURCE).not.toMatch(/const extPattern =\s*\n?\s*\//);
+  });
+
   it('cmdPattern arg group cannot match empty tokens (the exponential trigger)', () => {
     // structural guard: the dangerous construct is an empty-matchable token
     // inside a repeated group — `[^\s\/]*\s+` repeated. Check the pattern

test/response-viewer-file-links.test.ts

@@ -0,0 +1,140 @@
+/**
+ * @fileoverview Response-viewer file-path linkifier (`CodemanApp._linkifyFilePaths`).
+ *
+ * The viewer renders markdown, so a path an agent wrote — "wrote the chart to
+ * /tmp/.../chart.png" — arrived as inert text: the terminal's link provider
+ * never sees the chat, and the file it just produced was a copy-paste away
+ * instead of a click. The linkifier wraps those paths in an anchor the click
+ * delegate hands to the file-preview overlay.
+ *
+ * Two properties matter more than the linking itself and are pinned here:
+ *
+ *  1. **The text is untouched.** Anchors are built from TEXT NODES with DOM
+ *     APIs, never by rebuilding already-sanitized markup as a string, so the
+ *     message reads identically and "copy code" still yields exactly what the
+ *     agent printed.
+ *  2. **Model output cannot become markup.** The source is model text; a
+ *     path-shaped string carrying HTML must stay text.
+ *
+ * Loaded via `vm` with a jsdom document injected (same technique as
+ * connection-indicator.test.ts — no per-file jsdom environment, which would
+ * externalize node:fs under vite).
+ */
+import { readFileSync } from 'node:fs';
+import { performance } from 'node:perf_hooks';
+import { resolve } from 'node:path';
+import vm from 'node:vm';
+import { JSDOM } from 'jsdom';
+import { describe, expect, it, vi } from 'vitest';
+
+const dom = new JSDOM('<!DOCTYPE html><html><body></body></html>');
+const { document, NodeFilter } = dom.window;
+
+function loadCodemanAppClass() {
+  const constants = readFileSync(resolve(import.meta.dirname, '../src/web/public/constants.js'), 'utf8');
+  const source = readFileSync(resolve(import.meta.dirname, '../src/web/public/app.js'), 'utf8');
+  const context = vm.createContext({
+    console,
+    performance,
+    setInterval: vi.fn(),
+    clearInterval: vi.fn(),
+    setTimeout,
+    clearTimeout,
+    requestAnimationFrame: vi.fn(),
+    HTMLCanvasElement: class HTMLCanvasElement {},
+    fetch: vi.fn(),
+    document,
+    NodeFilter,
+    localStorage: { length: 0, key: vi.fn(), getItem: vi.fn(), setItem: vi.fn(), removeItem: vi.fn() },
+    window: { addEventListener: vi.fn(), removeEventListener: vi.fn() },
+    MobileDetection: {},
+  });
+  vm.runInContext(`${constants}\n${source}\nglobalThis.__CodemanApp = CodemanApp;`, context);
+  return (context as { __CodemanApp: { prototype: { _linkifyFilePaths(root: unknown): void } } }).__CodemanApp;
+}
+
+const CodemanApp = loadCodemanAppClass();
+const APP_SOURCE = readFileSync(resolve(import.meta.dirname, '../src/web/public/app.js'), 'utf8');
+
+/** Render `html` into a detached .rv-text div and run the linkifier over it. */
+function linkify(html: string): HTMLElement {
+  const app = Object.create(CodemanApp.prototype) as { _linkifyFilePaths(root: unknown): void };
+  const root = document.createElement('div');
+  root.className = 'rv-text';
+  root.innerHTML = html;
+  app._linkifyFilePaths(root);
+  return root as unknown as HTMLElement;
+}
+
+const paths = (root: HTMLElement) => Array.from(root.querySelectorAll('a.rv-path'));
+
+describe('response viewer file-path linkifier', () => {
+  it('links an absolute path written as prose', () => {
+    const path = '/tmp/claude-1000/-home-arkon-default-claudeman/7b3fefd2/scratchpad/probe-run-native.png';
+    const root = linkify(`<p>Saved the capture to ${path} — have a look.</p>`);
+
+    const links = paths(root);
+    expect(links).toHaveLength(1);
+    expect(links[0].getAttribute('data-path')).toBe(path);
+    expect(links[0].textContent).toBe(path);
+    expect(root.textContent).toBe(`Saved the capture to ${path} — have a look.`);
+  });
+
+  it('links a path inside inline code, which is how agents usually write one', () => {
+    const root = linkify('<p>See <code>/home/a/out/report.pdf</code> for the numbers.</p>');
+
+    const links = paths(root);
+    expect(links).toHaveLength(1);
+    expect(links[0].getAttribute('data-path')).toBe('/home/a/out/report.pdf');
+    // Still inside the <code> span — the code styling is not lost.
+    expect(links[0].closest('code')).not.toBeNull();
+  });
+
+  it('links every path in one text node and preserves the text between them', () => {
+    const root = linkify('<p>Compare /tmp/before.png with /tmp/after.png please</p>');
+
+    expect(paths(root).map((a) => a.getAttribute('data-path'))).toEqual(['/tmp/before.png', '/tmp/after.png']);
+    expect(root.textContent).toBe('Compare /tmp/before.png with /tmp/after.png please');
+  });
+
+  it('never re-cuts text already inside an anchor', () => {
+    // marked autolinks URLs; a path-looking tail inside one must stay whole, and
+    // a nested <a> is invalid markup that would swallow the outer link's click.
+    // ⚠️ The URL's tail MUST be a string the pattern matches on its own
+    // (`/tmp/...` here): with an unmatchable tail this test passes with the
+    // inside-anchor guard deleted, i.e. it pins nothing.
+    const root = linkify('<p><a href="https://example.com/tmp/shot.png">https://example.com/tmp/shot.png</a></p>');
+
+    expect(paths(root)).toHaveLength(0);
+    expect(root.querySelectorAll('a')).toHaveLength(1);
+    expect(root.querySelector('a')!.getAttribute('href')).toBe('https://example.com/tmp/shot.png');
+  });
+
+  it('leaves text with no path untouched', () => {
+    const root = linkify('<p>Ratio 3/4 on 2026/08/16, see src/app.ts</p>');
+
+    expect(paths(root)).toHaveLength(0);
+    expect(root.textContent).toBe('Ratio 3/4 on 2026/08/16, see src/app.ts');
+  });
+
+  it('cannot turn model text into markup', () => {
+    // The anchor is built with createElement + textContent, so even a
+    // path-shaped payload stays text. (`<` also ends a match, so the linkifier
+    // never spans into it in the first place.)
+    const root = linkify('<p>/tmp/x.png&lt;img src=x onerror=alert(1)&gt;.png</p>');
+
+    expect(root.querySelector('img')).toBeNull();
+    expect(root.textContent).toContain('<img src=x onerror=alert(1)>.png');
+    for (const link of paths(root)) {
+      expect(link.innerHTML).toBe(link.textContent);
+    }
+  });
+
+  it('is wired into message rendering and the click delegate', () => {
+    // The linkifier is only reachable through these two call sites; losing
+    // either leaves inert paths (no linkify) or dead links (no handler).
+    expect(APP_SOURCE).toContain('this._linkifyFilePaths(renderedText)');
+    expect(APP_SOURCE).toMatch(/closest\('a\.rv-path'\)/);
+    expect(APP_SOURCE).toMatch(/openFilePreview\(filePath, this\.activeSessionId\)/);
+  });
+});

test/routes/file-routes-attachment-path-guard.test.ts

@@ -56,6 +56,7 @@ import {
   registerExternalAttachment,
   type AttachmentRecord,
 } from '../../src/attachment-registry.js';
+import { SseEvent } from '../../src/web/sse-events.js';
 
 const mockedStat = vi.mocked(fs.stat);
 const mockedRealpathSync = vi.mocked(realpathSync);
@@ -355,4 +356,250 @@ describe('file-routes attachment path guard (COD-53)', () => {
       attachmentRegistry.clearSession('test-session-mlc');
     });
   });
+
+  // ===== Media (click-to-preview parity with the workspace preview) =====
+  // A video an agent writes inside the workspace plays with a working scrub
+  // bar; the same file in /tmp used to be refused as an unsupported type. Both
+  // now go through the same extension sets, and the raw route has to answer
+  // with a real media Content-Type and a range, or the player renders and then
+  // does nothing.
+  describe('media attachments', () => {
+    it('registers a video and serves it as seekable video/mp4', async () => {
+      const content = Buffer.from('MP4DATA-0123456789');
+      mockedStat.mockResolvedValue({ size: content.length, isFile: () => true, mtimeMs: 5 } as never);
+      mockedCreateReadStream.mockReturnValue(Readable.from([content.subarray(4, 10)]) as never);
+
+      const res = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path: '/tmp/captures/demo.mp4', notify: false },
+      });
+      expect(res.statusCode).toBe(200);
+      const body = JSON.parse(res.body);
+      expect(body.data.attachmentType).toBe('video');
+
+      const rawRes = await harness.app.inject({
+        method: 'GET',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments/${body.data.attachmentId}/raw`,
+        headers: { range: 'bytes=4-9' },
+      });
+      expect(rawRes.statusCode).toBe(206);
+      expect(rawRes.headers['content-type']).toBe('video/mp4');
+      expect(rawRes.headers['content-range']).toBe(`bytes 4-9/${content.length}`);
+      expect(rawRes.headers['accept-ranges']).toBe('bytes');
+    });
+
+    it('registers audio with an audio type and its real MIME', async () => {
+      const content = Buffer.from('ID3AUDIO');
+      mockedStat.mockResolvedValue({ size: content.length, isFile: () => true, mtimeMs: 5 } as never);
+      mockedCreateReadStream.mockReturnValue(Readable.from([content]) as never);
+
+      const res = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path: '/tmp/captures/take.mp3', notify: false },
+      });
+      expect(res.statusCode).toBe(200);
+      const body = JSON.parse(res.body);
+      expect(body.data.attachmentType).toBe('audio');
+
+      const rawRes = await harness.app.inject({
+        method: 'GET',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments/${body.data.attachmentId}/raw`,
+      });
+      expect(rawRes.statusCode).toBe(200);
+      expect(rawRes.headers['content-type']).toBe('audio/mpeg');
+    });
+
+    it('answers no thumbnail for media instead of spawning a converter', async () => {
+      // generateFirstPageThumbnail has no media branch; the card falls back to
+      // its type label. This pins that the route reports that cleanly.
+      const res = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path: '/tmp/captures/clip.webm', notify: false },
+      });
+      const { attachmentId } = JSON.parse(res.body).data;
+
+      const thumbRes = await harness.app.inject({
+        method: 'GET',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments/${attachmentId}/thumbnail`,
+      });
+      expect(thumbRes.statusCode).toBe(204);
+    });
+
+    it('still refuses media in a blocked tree', async () => {
+      const res = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path: '/root/private/recording.mp4', notify: false },
+      });
+      expect(res.statusCode).toBe(403);
+    });
+  });
+
+  // ===== Text family (code, config and logs outside the workspace) =====
+  // The agent in the session can already `cat` these, so refusing the click
+  // bought no confidentiality. The gate that matters is the path guard, which
+  // still runs, and markup must not become executable just because it is now
+  // readable.
+  describe('text attachments', () => {
+    it.each([
+      ['/tmp/run.log', 'log'],
+      ['/tmp/data.json', 'json'],
+      ['/tmp/conf/app.yaml', 'yaml'],
+      ['/tmp/src/index.ts', 'ts'],
+      ['/tmp/export.csv', 'csv'],
+    ])('registers %s as a text attachment', async (path, extension) => {
+      mockedStat.mockResolvedValue({ size: 40, isFile: () => true, mtimeMs: 5 } as never);
+      const res = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path, notify: false },
+      });
+
+      expect(res.statusCode).toBe(200);
+      const body = JSON.parse(res.body);
+      expect(body.data.extension).toBe(extension);
+      expect(body.data.attachmentType).toBe('text');
+    });
+
+    it('serves a text file with no dedicated MIME as inert text/plain', async () => {
+      const content = Buffer.from('boot ok\nstarted\n');
+      mockedStat.mockResolvedValue({ size: content.length, isFile: () => true, mtimeMs: 5 } as never);
+      mockedCreateReadStream.mockReturnValue(Readable.from([content]) as never);
+
+      const reg = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path: '/tmp/run.log', notify: false },
+      });
+      const rawRes = await harness.app.inject({
+        method: 'GET',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments/${JSON.parse(reg.body).data.attachmentId}/raw`,
+      });
+
+      expect(rawRes.statusCode).toBe(200);
+      expect(rawRes.headers['content-type']).toBe('text/plain; charset=utf-8');
+      expect(rawRes.headers['x-content-type-options']).toBe('nosniff');
+    });
+
+    it('keeps HTML download-only so readable never means executable', async () => {
+      // Serving markup with a renderable type on our own origin is stored XSS.
+      // The preview reads it through fetch(), which ignores the disposition, so
+      // a clicked .html still shows its source.
+      const content = Buffer.from('<script>alert(1)</script>');
+      mockedStat.mockResolvedValue({ size: content.length, isFile: () => true, mtimeMs: 5 } as never);
+      mockedCreateReadStream.mockReturnValue(Readable.from([content]) as never);
+
+      const reg = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path: '/tmp/report.html', notify: false },
+      });
+      const rawRes = await harness.app.inject({
+        method: 'GET',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments/${JSON.parse(reg.body).data.attachmentId}/raw`,
+      });
+
+      expect(rawRes.headers['content-type']).toBe('application/octet-stream');
+      expect(String(rawRes.headers['content-disposition'])).toContain('attachment');
+    });
+
+    it('answers a byte range for text so a huge log is a partial read', async () => {
+      const content = Buffer.from('0123456789abcdef');
+      mockedStat.mockResolvedValue({ size: content.length, isFile: () => true, mtimeMs: 5 } as never);
+      mockedCreateReadStream.mockReturnValue(Readable.from([content.subarray(0, 8)]) as never);
+
+      const reg = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path: '/tmp/big.log', notify: false },
+      });
+      const rawRes = await harness.app.inject({
+        method: 'GET',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments/${JSON.parse(reg.body).data.attachmentId}/raw`,
+        headers: { range: 'bytes=0-7' },
+      });
+
+      expect(rawRes.statusCode).toBe(206);
+      expect(rawRes.headers['content-range']).toBe(`bytes 0-7/${content.length}`);
+    });
+
+    it.each([
+      ['/home/someone/.config/gh/hosts.yml', 'forge token'],
+      ['/home/someone/project/.env.json', 'dotenv'],
+      ['/home/someone/.codeman/state.json', 'codeman state (can hold envOverrides secrets)'],
+      ['/home/someone/deploy/credentials.yaml', 'generic credentials'],
+      ['/etc/codeman/dump.log', 'blocked tree'],
+    ])('still refuses %s (%s) now that text is servable', async (path) => {
+      mockedStat.mockResolvedValue({ size: 40, isFile: () => true, mtimeMs: 5 } as never);
+      const res = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path, notify: false },
+      });
+
+      expect(res.statusCode).toBe(403);
+    });
+
+    it('still refuses a type outside the family', async () => {
+      mockedStat.mockResolvedValue({ size: 40, isFile: () => true, mtimeMs: 5 } as never);
+      const res = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path: '/tmp/drawing.svg', notify: false },
+      });
+
+      expect(res.statusCode).toBe(400);
+      expect(JSON.parse(res.body).error).toMatch(/unsupported/i);
+    });
+  });
+
+  // ===== Quiet registration (click-to-preview) =====
+  // The file-preview overlay registers a clicked out-of-workspace path to mint
+  // an id it can render by. It is already putting the file on screen, so the
+  // usual attachment card + unread badge would announce what the user is
+  // looking at. `notify: false` suppresses ONLY the broadcast — the guard, the
+  // registry entry and the by-id routes are identical either way.
+  describe('quiet registration', () => {
+    const outside = '/tmp/claude-1000/scratchpad/probe-run-native.png';
+
+    it('broadcasts by default, so the CLI and publish paths keep their card', async () => {
+      mockedStat.mockResolvedValue({ size: 128, isFile: () => true, mtimeMs: 5 } as never);
+      const res = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path: outside },
+      });
+
+      expect(res.statusCode).toBe(200);
+      expect(harness.ctx.broadcast).toHaveBeenCalledWith(SseEvent.AttachmentDetected, expect.anything());
+    });
+
+    it('registers and serves a clicked path without broadcasting when notify is false', async () => {
+      const content = Buffer.from('PNGDATA');
+      mockedStat.mockResolvedValue({ size: content.length, isFile: () => true, mtimeMs: 5 } as never);
+      mockedCreateReadStream.mockReturnValue(Readable.from([content]) as never);
+
+      const res = await harness.app.inject({
+        method: 'POST',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments`,
+        payload: { path: outside, notify: false },
+      });
+
+      expect(res.statusCode).toBe(200);
+      const body = JSON.parse(res.body);
+      expect(body.data.fileName).toBe('probe-run-native.png');
+      expect(harness.ctx.broadcast).not.toHaveBeenCalled();
+
+      // The preview renders from this route, so the id has to be live.
+      const rawRes = await harness.app.inject({
+        method: 'GET',
+        url: `/api/sessions/${harness.ctx._sessionId}/attachments/${body.data.attachmentId}/raw`,
+      });
+      expect(rawRes.statusCode).toBe(200);
+      expect(rawRes.headers['content-type']).toBe('image/png');
+    });
+  });
 });

test/sensitive-path.test.ts

@@ -73,6 +73,20 @@ describe('isSensitivePath', () => {
       ['codeman hook secret', `${HOME}/.codeman/hook-secret`],
       ['codeman user table', `${HOME}/.codeman/users.json`],
       ['codeman hook secret on a named instance', `${HOME}/.codeman-beta/hook-secret`],
+      // state.json persists SessionState.envOverrides, and the env allowlist
+      // admits key-shaped names (GEMINI_API_KEY, CLAUDE_CODE_*), so it can hold
+      // a live credential. Named once .json became previewable from outside the
+      // workspace.
+      ['codeman state file', `${HOME}/.codeman/state.json`],
+      ['codeman state file on a named instance', `${HOME}/.codeman-beta/state.json`],
+      ['codeman state sibling (same payload)', `${HOME}/.codeman/state-inner.json`],
+      // settings.json holds voiceSettings.apiKey by schema; push-keys.json holds
+      // the VAPID PRIVATE key; intents.json is 0600 because captured prompts can
+      // contain secrets and is deliberately kept out of /api/search.
+      ['codeman settings (Deepgram key)', `${HOME}/.codeman/settings.json`],
+      ['codeman push keys (VAPID private)', `${HOME}/.codeman/push-keys.json`],
+      ['codeman intent profiles', `${HOME}/.codeman/intents.json`],
+      ['codeman intents on a named instance', `${HOME}/.codeman-beta/intents.json`],
     ];
 
     it.each(blocked)('blocks the %s', (_label, path) => {
@@ -88,6 +102,7 @@ describe('isSensitivePath', () => {
       // The publish skill and the review-card loop attach from these trees, so
       // only their named secret members are blocked, never the whole tree.
       ['a codeman screenshot', `${HOME}/.codeman/screenshots/shot.png`],
+      ['a codeman lifecycle log', `${HOME}/.codeman/session-lifecycle.jsonl`],
       ['a claude transcript', `${HOME}/.claude/projects/proj/session.jsonl`],
       ['a claude team inbox', `${HOME}/.claude/teams/alpha/inboxes/bob.json`],
       // isUnderTree-style separator awareness: a sibling name that merely starts

test/session-list-layout.test.ts

@@ -1,503 +0,0 @@
-/**
- * @fileoverview Session list layout: header tab strip ⟷ collapsible left sidebar.
- *
- * The whole design rests on ONE invariant: there is exactly one `#sessionTabs`
- * element and `applySessionListLayout()` RE-PARENTS it between the header host
- * and the sidebar. It must never be cloned or rebuilt — `app.$(id)` caches
- * elements by id and never invalidates, and settings-ui.js / webview-tabs.js
- * resolve the same id independently, so a rebuilt container would leave every
- * consumer writing into a detached orphan, silently and without an error.
- * `keeps the same DOM node across a layout flip` below is therefore the single
- * most important assertion in this file.
- *
- * Builds a JSDOM window in-test under the default node env, same shape as
- * test/webview-menu-rows.test.ts. Do NOT declare a per-file jsdom environment:
- * it externalizes node:fs under vite and the readFileSync calls below stop
- * working. ⚠ Do not name that directive in a comment either, vitest matches the
- * string anywhere in the file.
- */
-
-import { readFileSync } from 'node:fs';
-import { describe, expect, it, vi } from 'vitest';
-import { JSDOM } from 'jsdom';
-
-const CONSTANTS = readFileSync(new URL('../src/web/public/constants.js', import.meta.url), 'utf-8');
-const APP = readFileSync(new URL('../src/web/public/app.js', import.meta.url), 'utf-8');
-const SETTINGS_UI = readFileSync(new URL('../src/web/public/settings-ui.js', import.meta.url), 'utf-8');
-const INDEX_HTML = readFileSync(new URL('../src/web/public/index.html', import.meta.url), 'utf-8');
-const STYLES_CSS = readFileSync(new URL('../src/web/public/styles.css', import.meta.url), 'utf-8');
-const MOBILE_CSS = readFileSync(new URL('../src/web/public/mobile.css', import.meta.url), 'utf-8');
-const I18N = readFileSync(new URL('../src/web/public/i18n.js', import.meta.url), 'utf-8');
-const TERMINAL_UI = readFileSync(new URL('../src/web/public/terminal-ui.js', import.meta.url), 'utf-8');
-const MOBILE_HANDLERS = readFileSync(new URL('../src/web/public/mobile-handlers.js', import.meta.url), 'utf-8');
-const SCHEMAS = readFileSync(new URL('../src/web/schemas.ts', import.meta.url), 'utf-8');
-
-interface LayoutApp {
-  soloSessionId: string | null;
-  sessions: Map<string, unknown>;
-  sessionOrder: string[];
-  _tallTabsEnabled?: boolean;
-  _sidebarFilter?: string;
-  _elemCache: Map<string, unknown>;
-  $(id: string): Element | null;
-  getSessionListLayout(): string;
-  isSessionSidebarActive(): boolean;
-  isSessionSidebarCollapsed(): boolean;
-  applySessionListLayout(): void;
-  toggleSessionSidebar(): void;
-  updateSidebarCount(): void;
-  closeSessionSidebarOnHandheld(): void;
-  _isSessionSidebarOverlay(): boolean;
-  applySidebarFilter(query?: string): void;
-  _fullRenderSessionTabs(): void;
-  updateConnectionLines(): void;
-}
-
-/** The parts of index.html this feature touches, minus everything it does not. */
-const SHELL = `
-  <header class="header">
-    <div class="header-brand">
-      <span class="logo">Codeman</span>
-      <button class="btn-icon-header btn-sidebar-toggle btn-sidebar-toggle--hidden"
-        id="sidebarToggleBtn" aria-expanded="true" aria-controls="sessionSidebar"
-        title="Collapse session sidebar" aria-label="Collapse session sidebar"></button>
-    </div>
-    <div class="session-tabs-host" id="sessionTabsHost">
-      <div class="session-tabs" id="sessionTabs" role="tablist" aria-label="Session tabs" aria-orientation="horizontal"></div>
-    </div>
-  </header>
-  <main class="main">
-    <aside class="session-sidebar" id="sessionSidebar" aria-label="Sessions">
-      <div class="session-sidebar-head">
-        <span class="session-sidebar-title">Sessions</span>
-        <span class="session-sidebar-count" id="sessionSidebarCount"></span>
-      </div>
-      <div class="session-sidebar-filter">
-        <input type="search" id="sessionSidebarFilter" class="session-sidebar-filter-input">
-      </div>
-      <div class="session-sidebar-list" id="sessionSidebarList"></div>
-    </aside>
-    <div class="terminal-wrap"></div>
-  </main>
-`;
-
-function boot(
-  options: {
-    stored?: Record<string, unknown>;
-    solo?: string | null;
-    deviceType?: string;
-    viewportWidth?: number;
-  } = {}
-) {
-  const dom = new JSDOM(`<!doctype html><html><body>${SHELL}</body></html>`, {
-    url: 'http://localhost/',
-    runScripts: 'outside-only',
-  });
-  const win = dom.window as unknown as Window & typeof globalThis & { __CodemanApp: new () => LayoutApp };
-
-  // Whether the sidebar is a docked column or a modal overlay is decided by
-  // WIDTH (< 1024px), not by MobileDetection.getDeviceType() — that one calls
-  // everything from 768px up 'desktop' while mobile.css, which defines the
-  // overlay, is loaded with media="(max-width: 1023px)". jsdom defaults to
-  // exactly 1024, so every handheld case has to say so explicitly.
-  const width = options.viewportWidth ?? ((options.deviceType ?? 'desktop') === 'desktop' ? 1440 : 393);
-  Object.defineProperty(win, 'innerWidth', { value: width, configurable: true, writable: true });
-
-  // Handhelds read a separate settings blob (getSettingsStorageKey), so a
-  // handheld harness must seed the handheld key or the layout silently stays
-  // on the header strip.
-  const settingsKey =
-    (options.deviceType ?? 'desktop') === 'desktop' ? 'codeman-app-settings' : 'codeman-app-settings-mobile';
-  if (options.stored) {
-    win.localStorage.setItem(settingsKey, JSON.stringify(options.stored));
-  }
-
-  // app.js assigns window.MobileDetection at top level from the global that
-  // mobile-handlers.js declares, so it has to exist before the source runs.
-  // One eval, not three: `class CodemanApp` is a lexical binding and would not
-  // survive into a second global eval, and settings-ui.js needs it at load time.
-  (win as unknown as { eval: (s: string) => void }).eval(
-    [
-      `var MobileDetection = {
-         getDeviceType: () => ${JSON.stringify(options.deviceType ?? 'desktop')},
-         isHandheldDevice: () => ${JSON.stringify(options.deviceType ?? 'desktop')} !== 'desktop',
-         isMobile: () => false,
-         isTouchDevice: () => false,
-       };`,
-      CONSTANTS,
-      APP,
-      SETTINGS_UI,
-      'window.__CodemanApp = CodemanApp;',
-    ].join('\n')
-  );
-
-  // Object.create, not `new`: the constructor boots SSE, timers and the whole
-  // terminal stack. Only the layout surface is under test here.
-  const app = Object.create(win.__CodemanApp.prototype) as LayoutApp;
-  app.soloSessionId = options.solo ?? null;
-  app.sessions = new Map();
-  app.sessionOrder = [];
-  app._elemCache = new Map();
-  app._fullRenderSessionTabs = vi.fn();
-  app.updateConnectionLines = vi.fn();
-
-  return { dom, win, app };
-}
-
-const tabsEl = (win: Window) => win.document.getElementById('sessionTabs')!;
-const toggleBtn = (win: Window) => win.document.getElementById('sidebarToggleBtn')!;
-
-describe('session list layout', () => {
-  it('defaults to the header tab strip when nothing is stored', () => {
-    const { win, app } = boot();
-    expect(app.getSessionListLayout()).toBe('header');
-    app.applySessionListLayout();
-    expect(win.document.documentElement.dataset.sessionList).toBe('header');
-    expect(app.isSessionSidebarActive()).toBe(false);
-    expect(tabsEl(win).parentElement?.id).toBe('sessionTabsHost');
-    expect(toggleBtn(win).classList.contains('btn-sidebar-toggle--hidden')).toBe(true);
-  });
-
-  it('re-parents the tab list into the sidebar and flips the a11y state', () => {
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar' } });
-    expect(app.getSessionListLayout()).toBe('sidebar');
-
-    app.applySessionListLayout();
-
-    expect(win.document.documentElement.dataset.sessionList).toBe('sidebar');
-    expect(win.document.documentElement.dataset.sidebar).toBe('expanded');
-    expect(app.isSessionSidebarActive()).toBe(true);
-    expect(tabsEl(win).parentElement?.id).toBe('sessionSidebarList');
-    expect(tabsEl(win).getAttribute('aria-orientation')).toBe('vertical');
-    expect(toggleBtn(win).classList.contains('btn-sidebar-toggle--hidden')).toBe(false);
-    expect(toggleBtn(win).getAttribute('aria-expanded')).toBe('true');
-  });
-
-  it('keeps the same DOM node across a layout flip (the $() element cache never invalidates)', () => {
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar' } });
-    const original = tabsEl(win);
-    // Seed the cache the way any real render would.
-    expect(app.$('sessionTabs')).toBe(original);
-
-    app.applySessionListLayout();
-    expect(tabsEl(win)).toBe(original);
-    expect(app.$('sessionTabs')).toBe(original);
-    expect(original.parentElement?.id).toBe('sessionSidebarList');
-
-    // …and back again.
-    win.localStorage.setItem('codeman-app-settings', JSON.stringify({ sessionListLayout: 'header' }));
-    delete (app as unknown as { _cachedAppSettings?: unknown })._cachedAppSettings;
-    app.applySessionListLayout();
-    expect(tabsEl(win)).toBe(original);
-    expect(app.$('sessionTabs')).toBe(original);
-    expect(original.parentElement?.id).toBe('sessionTabsHost');
-    expect(original.getAttribute('aria-orientation')).toBe('horizontal');
-    expect(toggleBtn(win).classList.contains('btn-sidebar-toggle--hidden')).toBe(true);
-  });
-
-  it('never selects the sidebar in a solo (detached) window', () => {
-    // A solo window shows one session, so the list is noise — and #sessionTabs
-    // parked in the display:none <aside> would measure 0/0 for tab overflow and
-    // the inline rename input.
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar' }, solo: 'sess-1' });
-    expect(app.getSessionListLayout()).toBe('header');
-    app.applySessionListLayout();
-    expect(win.document.documentElement.dataset.sessionList).toBe('header');
-    expect(tabsEl(win).parentElement?.id).toBe('sessionTabsHost');
-  });
-
-  it('round-trips the collapse state through its own storage key', () => {
-    // Deliberately NOT in the app-settings blob: saveAppSettings() rebuilds that
-    // blob from the DOM controls, so a key without a control is wiped on Save.
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar' } });
-    app.applySessionListLayout();
-    const aside = win.document.getElementById('sessionSidebar')!;
-    expect(aside.classList.contains('open')).toBe(true);
-
-    app.toggleSessionSidebar();
-    expect(win.localStorage.getItem('codeman-sidebar-collapsed')).toBe('1');
-    expect(win.document.documentElement.dataset.sidebar).toBe('collapsed');
-    expect(toggleBtn(win).getAttribute('aria-expanded')).toBe('false');
-    expect(toggleBtn(win).getAttribute('aria-label')).toBe('Expand session sidebar');
-    expect(aside.classList.contains('open')).toBe(false);
-
-    app.toggleSessionSidebar();
-    expect(win.localStorage.getItem('codeman-sidebar-collapsed')).toBe('0');
-    expect(win.document.documentElement.dataset.sidebar).toBe('expanded');
-    expect(toggleBtn(win).getAttribute('aria-expanded')).toBe('true');
-    expect(toggleBtn(win).getAttribute('aria-label')).toBe('Collapse session sidebar');
-    expect(aside.classList.contains('open')).toBe(true);
-  });
-
-  it('starts the handheld drawer CLOSED when the user has made no choice yet', () => {
-    // Below 1024px the sidebar is an off-canvas overlay, so "expanded" on a cold
-    // load would mean a drawer sitting on top of the terminal every time.
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar' }, deviceType: 'mobile' });
-    app.applySessionListLayout();
-    expect(app.isSessionSidebarActive()).toBe(true);
-    expect(app.isSessionSidebarCollapsed()).toBe(true);
-    expect(win.document.documentElement.dataset.sidebar).toBe('collapsed');
-    expect(win.document.getElementById('sessionSidebar')?.classList.contains('open')).toBe(false);
-
-    // An explicit choice still wins over the device default.
-    win.localStorage.setItem('codeman-sidebar-collapsed', '0');
-    app.applySessionListLayout();
-    expect(win.document.documentElement.dataset.sidebar).toBe('expanded');
-  });
-
-  it('dismisses the handheld drawer on selection but never the docked desktop sidebar', () => {
-    const handheld = boot({ stored: { sessionListLayout: 'sidebar' }, deviceType: 'mobile' });
-    handheld.win.localStorage.setItem('codeman-sidebar-collapsed', '0');
-    handheld.app.applySessionListLayout();
-    handheld.app.closeSessionSidebarOnHandheld();
-    expect(handheld.win.document.documentElement.dataset.sidebar).toBe('collapsed');
-
-    const desktop = boot({ stored: { sessionListLayout: 'sidebar' } });
-    desktop.app.applySessionListLayout();
-    desktop.app.closeSessionSidebarOnHandheld();
-    expect(desktop.win.document.documentElement.dataset.sidebar).toBe('expanded');
-  });
-
-  it('does nothing on toggle while the header strip is active', () => {
-    const { win, app } = boot();
-    app.applySessionListLayout();
-    app.toggleSessionSidebar();
-    expect(win.localStorage.getItem('codeman-sidebar-collapsed')).toBeNull();
-    expect(win.document.documentElement.dataset.sidebar).toBe('expanded');
-  });
-
-  it('filters rows by rendered name and working directory without re-rendering', () => {
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar' } });
-    app.applySessionListLayout();
-    tabsEl(win).innerHTML = `
-      <div class="session-tab" data-id="a" aria-label="api server" title="/srv/api"></div>
-      <div class="session-tab" data-id="b" aria-label="docs" title="/home/docs"></div>
-      <div class="session-tab session-tab--web" data-webview-id="w" aria-label="Grafana web tab" title="http://x/g"></div>
-    `;
-    const before = tabsEl(win).querySelectorAll('.session-tab');
-
-    app.applySidebarFilter('api');
-    expect(
-      [...tabsEl(win).querySelectorAll('.session-tab')].map((t) => t.classList.contains('tab-filtered-out'))
-    ).toEqual([false, true, true]);
-    // Pure class toggling — no node was replaced.
-    expect(tabsEl(win).querySelectorAll('.session-tab')[0]).toBe(before[0]);
-
-    app.applySidebarFilter('/home');
-    expect(tabsEl(win).querySelectorAll('.session-tab')[1].classList.contains('tab-filtered-out')).toBe(false);
-
-    app.applySidebarFilter('');
-    expect(tabsEl(win).querySelectorAll('.tab-filtered-out')).toHaveLength(0);
-  });
-
-  it('drops the filter when the list moves back to the header strip', () => {
-    // The filter <input> lives inside the sidebar, so a filter surviving a
-    // layout flip would hide sessions from the header tab strip with no
-    // reachable control to clear it — and every SSE-driven re-render re-hides
-    // them, so only a reload recovers.
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar' } });
-    app.applySessionListLayout();
-    tabsEl(win).innerHTML = `
-      <div class="session-tab" data-id="a" aria-label="api server" title="/srv/api"></div>
-      <div class="session-tab" data-id="b" aria-label="docs" title="/home/docs"></div>
-    `;
-    const filterInput = win.document.getElementById('sessionSidebarFilter') as HTMLInputElement;
-    filterInput.value = 'api';
-    app.applySidebarFilter('api');
-    expect(tabsEl(win).querySelectorAll('.tab-filtered-out')).toHaveLength(1);
-
-    win.localStorage.setItem('codeman-app-settings', JSON.stringify({ sessionListLayout: 'header' }));
-    delete (app as unknown as { _cachedAppSettings?: unknown })._cachedAppSettings;
-    app.applySessionListLayout();
-
-    expect(app._sidebarFilter).toBe('');
-    expect(filterInput.value).toBe('');
-    expect(tabsEl(win).querySelectorAll('.tab-filtered-out')).toHaveLength(0);
-  });
-
-  it('suspends the filter while the rail is collapsed and restores it on expand', () => {
-    // Collapsing hides .session-sidebar-filter, so a filter left applied would
-    // show 3 of 25 status dots in the rail with no visible cause.
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar' } });
-    app.applySessionListLayout();
-    tabsEl(win).innerHTML = `
-      <div class="session-tab" data-id="a" aria-label="api server" title="/srv/api"></div>
-      <div class="session-tab" data-id="b" aria-label="docs" title="/home/docs"></div>
-    `;
-    app.applySidebarFilter('api');
-    expect(tabsEl(win).querySelectorAll('.tab-filtered-out')).toHaveLength(1);
-
-    app.toggleSessionSidebar();
-    expect(win.document.documentElement.dataset.sidebar).toBe('collapsed');
-    expect(tabsEl(win).querySelectorAll('.tab-filtered-out')).toHaveLength(0);
-    expect(app._sidebarFilter).toBe('api');
-
-    app.toggleSessionSidebar();
-    expect(tabsEl(win).querySelectorAll('.tab-filtered-out')).toHaveLength(1);
-  });
-
-  it('treats the 768-1023px band as an overlay, matching mobile.css', () => {
-    // getDeviceType() calls 900px 'desktop', but mobile.css — which defines the
-    // off-canvas overlay — is loaded with media="(max-width: 1023px)". Using the
-    // device type here gave that band overlay CSS with docked-sidebar logic: the
-    // drawer opened itself on load and neither selection nor Escape closed it.
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar' }, viewportWidth: 900 });
-    expect(app._isSessionSidebarOverlay()).toBe(true);
-    app.applySessionListLayout();
-    expect(win.document.documentElement.dataset.sidebar).toBe('collapsed');
-
-    win.localStorage.setItem('codeman-sidebar-collapsed', '0');
-    app.applySessionListLayout();
-    expect(win.document.documentElement.dataset.sidebar).toBe('expanded');
-    app.closeSessionSidebarOnHandheld();
-    expect(win.document.documentElement.dataset.sidebar).toBe('collapsed');
-  });
-
-  it('makes a closed overlay drawer inert, but never the docked desktop rail', () => {
-    // translateX(-100%) alone leaves the filter box and ~4 tab stops per session
-    // in the Tab order and in the accessibility tree.
-    const overlay = boot({ stored: { sessionListLayout: 'sidebar' }, viewportWidth: 900 });
-    overlay.app.applySessionListLayout();
-    const drawer = overlay.win.document.getElementById('sessionSidebar')!;
-    expect(drawer.hasAttribute('inert')).toBe(true);
-    expect(drawer.getAttribute('aria-hidden')).toBe('true');
-
-    overlay.app.toggleSessionSidebar();
-    expect(drawer.hasAttribute('inert')).toBe(false);
-    expect(drawer.hasAttribute('aria-hidden')).toBe(false);
-
-    const desktop = boot({ stored: { sessionListLayout: 'sidebar' } });
-    desktop.win.localStorage.setItem('codeman-sidebar-collapsed', '1');
-    desktop.app.applySessionListLayout();
-    const rail = desktop.win.document.getElementById('sessionSidebar')!;
-    expect(desktop.win.document.documentElement.dataset.sidebar).toBe('collapsed');
-    expect(rail.hasAttribute('inert')).toBe(false);
-  });
-
-  it('steals focus only for the modal drawer, never for the docked sidebar', () => {
-    // The docked sidebar is chrome, not a dialog: pulling the caret out of the
-    // terminal mid-prompt swallows everything typed after, because .session-tab
-    // handles only arrows/Home/End/Enter/Space.
-    const rows = `<div class="session-tab active" data-id="a" tabindex="0" aria-label="api"></div>`;
-
-    const desktop = boot({ stored: { sessionListLayout: 'sidebar' } });
-    desktop.win.localStorage.setItem('codeman-sidebar-collapsed', '1');
-    desktop.app.applySessionListLayout();
-    tabsEl(desktop.win).innerHTML = rows;
-    desktop.app.toggleSessionSidebar();
-    expect(desktop.win.document.activeElement).toBe(desktop.win.document.body);
-
-    const drawer = boot({ stored: { sessionListLayout: 'sidebar' }, viewportWidth: 900 });
-    drawer.app.applySessionListLayout();
-    tabsEl(drawer.win).innerHTML = rows;
-    drawer.app.toggleSessionSidebar();
-    expect((drawer.win.document.activeElement as HTMLElement).className).toContain('session-tab');
-  });
-
-  it('shows the live session count in the sidebar header', () => {
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar' } });
-    app.sessions = new Map([
-      ['a', {}],
-      ['b', {}],
-      ['c', {}],
-    ]);
-    app.applySessionListLayout();
-    expect(win.document.getElementById('sessionSidebarCount')?.textContent).toBe('3');
-  });
-
-  it('forces tall rows and no wrapping in the sidebar, and leaves the strip rules alone', () => {
-    const { win, app } = boot({ stored: { sessionListLayout: 'sidebar', tabTwoRows: false } });
-    app.applySessionListLayout();
-    const tabs = tabsEl(win);
-    expect(tabs.classList.contains('tabs-show-folder')).toBe(true);
-    expect(tabs.classList.contains('tabs-two-rows')).toBe(false);
-    expect(tabs.classList.contains('tabs-auto-wrap')).toBe(false);
-    expect(app._tallTabsEnabled).toBe(true);
-  });
-});
-
-describe('session list layout wiring', () => {
-  it('accepts sessionListLayout in the strict settings schema', () => {
-    // SettingsUpdateSchema is .strict() and this key is NOT in the PUT strip-list,
-    // so without the schema entry the server 400s the ENTIRE settings PUT and every
-    // unrelated setting silently stops persisting.
-    expect(SCHEMAS).toContain("sessionListLayout: z.enum(['header', 'sidebar']).optional()");
-  });
-
-  it('plumbs the setting through populate, collect, defaults and the display-key set', () => {
-    expect(INDEX_HTML).toContain('id="appSettingsSessionListLayout"');
-    expect(SETTINGS_UI).toContain("document.getElementById('appSettingsSessionListLayout').value =");
-    expect(SETTINGS_UI).toContain("sessionListLayout: document.getElementById('appSettingsSessionListLayout').value,");
-    expect(SETTINGS_UI).toContain("sessionListLayout: 'header',");
-    expect(SETTINGS_UI).toContain("'sessionListLayout'");
-    // Saving must re-apply the LAYOUT (which calls applyTabWrapSettings itself);
-    // calling only applyTabWrapSettings would leave a layout change unapplied.
-    expect(SETTINGS_UI).toContain('this.applySessionListLayout();');
-  });
-
-  it('keeps the header host, the aside and the toggle out of solo windows', () => {
-    expect(STYLES_CSS).toContain('body.solo-mode .session-tabs-host,');
-    expect(STYLES_CSS).toContain('body.solo-mode .session-sidebar,');
-    expect(STYLES_CSS).toContain('body.solo-mode .btn-sidebar-toggle,');
-  });
-
-  it('puts the sidebar rules after the skin nesting block and adds no colour to .session-tab', () => {
-    // Match the RULE (column 0 + opening brace), not the prose about it in the
-    // sidebar block's own header comment.
-    const skinRule = [...STYLES_CSS.matchAll(/^html:not\(\[data-skin="og"\]\) \{/gm)].pop();
-    expect(skinRule).toBeDefined();
-    const sidebarBlock = STYLES_CSS.indexOf('=== Collapsible session sidebar');
-    expect(sidebarBlock).toBeGreaterThan(skinRule!.index!);
-  });
-
-  it('makes the handheld sidebar an off-canvas overlay from the END of mobile.css', () => {
-    // Placement is load-bearing: the compact `.session-tabs, .session-tabs.tabs-two-rows`
-    // blocks earlier in the file pin max-height 36px/52px. Moving this block up
-    // collapses the list into a sliver that looks like an empty list.
-    const overlay = MOBILE_CSS.indexOf('SESSION SIDEBAR — off-canvas drawer');
-    const compactStrip = [...MOBILE_CSS.matchAll(/^\s*\.session-tabs\.tabs-two-rows \{/gm)].pop();
-    expect(compactStrip).toBeDefined();
-    expect(overlay).toBeGreaterThan(compactStrip!.index!);
-    expect(MOBILE_CSS).toContain('html[data-session-list="sidebar"] .session-sidebar.open');
-    expect(MOBILE_CSS).toContain('transform: translateX(-100%)');
-  });
-
-  it('translates the new sidebar copy for every language the translator supports', () => {
-    for (const key of [
-      'Collapse session sidebar',
-      'Expand session sidebar',
-      'Filter sessions',
-      'Session List Layout',
-      'Header tab strip',
-      'Left sidebar',
-    ]) {
-      expect(I18N).toContain(`'${key}'`);
-    }
-  });
-
-  it('pre-paints the layout before first paint and never in a solo window', () => {
-    expect(INDEX_HTML).toContain('document.documentElement.dataset.sessionList');
-    expect(INDEX_HTML).toContain('/^\\/session\\//.test(location.pathname)');
-  });
-
-  it('pre-paints the collapse default off the SAME 1024px breakpoint as the JS', () => {
-    // The handheld storage-key heuristic `m` is a different predicate; using it
-    // here made boot contradict the pre-paint value between 768 and 1023px, so
-    // the drawer animated itself open over the terminal on every load.
-    expect(INDEX_HTML).toContain("dataset.sidebar=(C===null?window.innerWidth<1024:C==='1')");
-  });
-
-  it('keeps the sidebar toggle chord out of the PTY', () => {
-    // preventDefault() in the document CAPTURE handler does not stop xterm, so
-    // without this gate Alt+B would also write ESC b (readline backward-word)
-    // into the live session on every toggle.
-    expect(TERMINAL_UI).toContain('this.shouldToggleSessionSidebarFromShortcut?.(ev)');
-    expect(APP).toContain('shouldToggleSessionSidebarFromShortcut(e) {');
-  });
-
-  it('keeps the session drawer out of the prev/next swipe zone', () => {
-    // The <aside> is a child of .main, which is where SwipeHandler binds, so a
-    // swipe across the open drawer would otherwise fire nextSession().
-    expect(MOBILE_HANDLERS).toContain("e.target?.closest?.('.session-sidebar')");
-  });
-});