diff --git a/docs/chat-console/chat-console.md b/docs/chat-console/chat-console.md
index 29e2f4a..cd336a5 100644
--- a/docs/chat-console/chat-console.md
+++ b/docs/chat-console/chat-console.md
@@ -93,7 +93,14 @@ appears the way you left it straight away, instead of starting as the strip and
 jumping open a moment later. Your saved preference still has the last word: if you folded
 the rail on another device, it folds here too as soon as the preference loads.
 
-On a tablet, the rail button in the chat's header expands or folds the rail.
+On a tablet, the rail button in the chat's header expands or folds the rail. Its name
+changes to say which it will do next ("Expand chat rail" or "Collapse chat rail"), and
+screen readers are told whether the rail is open.
+
+When you expand or fold the rail from the keyboard, focus stays in the rail. The button you
+pressed is replaced, so focus moves to the one that took its place: the tab you asked for,
+the collapse button, or the strip's expand button. Opening a file from Files puts focus on
+the Preview tab, and closing the preview puts it back on the rail.
 
 ### On a phone
 
@@ -121,6 +128,13 @@ The most recently changed file is at the top. Edits made while a reply is still
 appear as they happen. An edit that failed or was refused is not listed, and neither is a
 write that left the file exactly as it was. Edits made inside a sub-agent are not listed.
 
+A file the agent **created** is always listed and marked **new**, with every line it wrote
+counted as added — even an empty file, which is still a change. Its card in the thread
+shows what was written, as added lines, instead of saying nothing changed. A very large
+new file shows only its beginning on the card, with a note that the rest was cut. In chats
+from before this was fixed, a created file is still listed as new, but without a line
+count, and its card asks you to open the file to see it.
+
 ### Where everything else went
 
 The rail used to have four tabs and a stats strip. Issue #14 removed what was empty most of
@@ -130,7 +144,7 @@ the time or repeated what is shown elsewhere:
 | --- | --- |
 | **Research** tab (research runs started from this chat) | The research run's own page. Its Back button and breadcrumb lead to the chat it came from. |
 | **Activity** tab (tool calls in this turn and earlier ones) | The run's own page, `/runs/<id>`, which has every tool call and event. Open it from **Run → Timeline** in a reply's stats popover, or by clicking the **running** chip at the top of the chat while a turn runs. |
-| Stats strip: context and cost | The chat's header on every screen size: the context ring (hover for the breakdown and a Compact button) and the metered cost, when there is any. |
+| Stats strip: context and cost | The top of the chat on every screen size: the context ring (hover for the breakdown and a Compact button) and the metered cost, when there is any. On a desktop both sit in the bar above the thread. On a tablet or phone the ring is in the chat's header, and the cost is beside it on a tablet and in the row of chips under the header on a phone. |
 | Stats strip: tokens and latency | Per reply, in the reply's stats popover. |
 | Files placeholder ("main · clean", Switch, Pull) | The real Files tab above. |
 
diff --git a/docs/research/research.md b/docs/research/research.md
index 211c0a6..be0e7ed 100644
--- a/docs/research/research.md
+++ b/docs/research/research.md
@@ -84,9 +84,8 @@ The Research agent isn't only an initiator. Once a report or earlier findings ar
 
 1. `/research/{id}` shows the run's status, sub-questions, sources and live trace. It refreshes every few seconds while the run is going and stops once it has ended.
 2. The page has a **Cancel** button. Cancelling marks the run canceled and cancels its background job. The run stops at its next safe point and stays canceled.
-3. In a chat linked to runs (for example the automation's conversation), the right-hand console's **Research** tab lists the chat's five most recent runs with their status and progress.
-4. `/research` lists recent runs alongside generated images.
-5. When a run fails, its error shows on its page and its job shows as failed in the review inbox. No notification is sent.
+3. `/research` lists recent runs alongside generated images.
+4. When a run fails, its error shows on its page and its job shows as failed in the review inbox. No notification is sent.
 
 ## Roles and permissions
 
diff --git a/docs/structure/claude-desktop-parity.md b/docs/structure/claude-desktop-parity.md
index 3658b0b..38875be 100644
--- a/docs/structure/claude-desktop-parity.md
+++ b/docs/structure/claude-desktop-parity.md
@@ -84,7 +84,7 @@ This is the Cowork comparison, and it is the one I got wrong in the first draft:
 | Connectors (Slack, M365, Salesforce…) | **absent** | — | write-capable connectors, Claude Tag for Slack |
 | Computer use | **far behind** | `browser_screenshot` only | screen access, click, navigate (research preview) |
 | Artifacts / side-panel documents | **n/a** | removed in #13 — files on disk and git instead | versioned, publishable, in-place draft editing |
-| Preview a file or a website in a side panel | **even** (#29, #14) | right rail, folded to a strip until something is opened (remembered per user): Preview tab renders markdown, highlighted code, images, PDFs, directory listing, sandboxed URL iframe, selection persists per conversation; Files tab lists every file the agent changed in the chat with +/- counts and opens it in Preview. Run activity is on `/runs/<id>`, linked from each reply | artifact + document preview |
+| Preview a file or a website in a side panel | **even** (#29, #14) | right rail, folded to a strip until something is opened (remembered per user): Preview tab renders markdown, highlighted code, images, PDFs, directory listing, sandboxed URL iframe, selection persists per conversation; Files tab lists every file the agent created or edited in the chat, with +/- counts and a "new" badge for created files, and opens it in Preview. Run activity is on `/runs/<id>`, linked from each reply | artifact + document preview |
 | Inline charts and visualizations | **absent** | markdown only | interactive charts, diagrams, Claude Design |
 | Conversation rename | **even** (#18) | Rename in each sidebar row's menu. Until #18 `updateConversationMeta` existed with no UI calling it, so this row's earlier "even" was wrong | same |
 | Pin / archive / folders | **behind** (#18) | pin to a Pinned group on top; archive (the default way to tidy, one click on the row) hides a chat and keeps everything, with an Archived view to restore it; replying in an archived chat brings it back; delete is last in the menu, behind a confirmation. No folders | full |
diff --git a/src/lib/chat-console/ChatConsoleRail.svelte b/src/lib/chat-console/ChatConsoleRail.svelte
index f79dd1c..1e99a41 100644
--- a/src/lib/chat-console/ChatConsoleRail.svelte
+++ b/src/lib/chat-console/ChatConsoleRail.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { onMount, untrack } from 'svelte';
+	import { onMount, tick, untrack } from 'svelte';
 	import Icon from './Icon.svelte';
 	import PreviewPane from './PreviewPane.svelte';
 	import { consoleState } from './console-state.svelte';
@@ -12,7 +12,7 @@
 		previewState,
 		setRailTab,
 	} from './preview-state.svelte';
-	import { RAIL_TABS } from './preview-kinds';
+	import { RAIL_TABS, type RailTab } from './preview-kinds';
 
 	/*
 	 * #14 — two tabs, folded away until there is something to show.
@@ -44,11 +44,63 @@
 	});
 
 	onMount(() => void hydrateRailOpen());
+
+	/*
+	 * Folding and expanding swap the strip for the full rail, which removes the button that
+	 * was just pressed and would drop keyboard focus to the page. After each of the rail's
+	 * own controls, focus moves to the control that now stands where it was: expanding lands
+	 * on the tab that was asked for (or the collapse button), folding lands on the expand
+	 * button. The same goes for the Files list and the preview bar, which a click in them
+	 * removes. Nothing moves when focus is still somewhere, such as on a button that stayed.
+	 */
+	let expandButton = $state<HTMLButtonElement | null>(null);
+	let collapseButton = $state<HTMLButtonElement | null>(null);
+	const tabButtons = $state<Partial<Record<RailTab, HTMLButtonElement | null>>>({});
+
+	async function refocus(target: () => HTMLElement | null | undefined) {
+		await tick();
+		const active = document.activeElement;
+		if (active && active !== document.body) return;
+		target()?.focus();
+	}
+
+	function expandFromStrip() {
+		expandRail();
+		void refocus(() => collapseButton);
+	}
+
+	function showTabFromStrip(tab: RailTab) {
+		setRailTab(tab);
+		void refocus(() => tabButtons[tab] ?? collapseButton);
+	}
+
+	function collapseFromTabs() {
+		collapseRail();
+		void refocus(() => expandButton);
+	}
+
+	/** Opening a file from Files switches to Preview, which removes the Files list. */
+	function openFromFiles(path: string) {
+		openFilePreview(path);
+		void refocus(() => tabButtons.Preview);
+	}
+
+	/** Closing the preview removes its bar, and on the column folds the rail too. */
+	function afterPreviewClosed() {
+		void refocus(() => (collapsed ? expandButton : tabButtons.Preview));
+	}
 </script>
 
 {#if collapsed}
 	<aside class="console-rail is-collapsed" aria-label="Chat rail">
-		<button type="button" class="console-rail__strip-btn" title="Expand rail" aria-label="Expand rail" onclick={expandRail}>
+		<button
+			type="button"
+			class="console-rail__strip-btn"
+			title="Expand rail"
+			aria-label="Expand rail"
+			bind:this={expandButton}
+			onclick={expandFromStrip}
+		>
 			<Icon name="panel" size={15} />
 		</button>
 		<button
@@ -56,7 +108,7 @@
 			class="console-rail__strip-btn"
 			title={hasPreview ? 'Preview — something is open' : 'Preview'}
 			aria-label="Show Preview"
-			onclick={() => setRailTab('Preview')}
+			onclick={() => showTabFromStrip('Preview')}
 		>
 			<Icon name="search" size={15} />
 			{#if hasPreview}<span class="console-rail__strip-dot" aria-hidden="true"></span>{/if}
@@ -66,7 +118,7 @@
 			class="console-rail__strip-btn"
 			title={changedFiles.length > 0 ? `Files — ${changedFiles.length} changed in this chat` : 'Files'}
 			aria-label="Show Files"
-			onclick={() => setRailTab('Files')}
+			onclick={() => showTabFromStrip('Files')}
 		>
 			<Icon name="file" size={15} />
 			{#if changedFiles.length > 0}
@@ -84,6 +136,7 @@
 						role="tab"
 						aria-selected={activeTab === tab}
 						class="console-rail__tab {activeTab === tab ? 'active' : ''}"
+						bind:this={tabButtons[tab]}
 						onclick={() => setRailTab(tab)}
 					>
 						{tab}
@@ -94,7 +147,14 @@
 				{/each}
 			</div>
 			{#if variant === 'column'}
-				<button type="button" class="console-rail__collapse" title="Collapse rail" aria-label="Collapse rail" onclick={collapseRail}>
+				<button
+					type="button"
+					class="console-rail__collapse"
+					title="Collapse rail"
+					aria-label="Collapse rail"
+					bind:this={collapseButton}
+					onclick={collapseFromTabs}
+				>
 					<Icon name="panel" size={14} />
 				</button>
 			{/if}
@@ -102,7 +162,7 @@
 
 		<div class="console-rail__body {activeTab === 'Preview' ? 'is-preview' : ''}">
 			{#if activeTab === 'Preview'}
-				<PreviewPane {conversationId} />
+				<PreviewPane {conversationId} onClosed={afterPreviewClosed} />
 			{:else}
 				<div class="console-rail__sec">
 					<div class="lbl">
@@ -116,7 +176,7 @@
 					<ul class="console-files">
 						{#each changedFiles as file (file.path)}
 							<li>
-								<button type="button" class="console-files__row" title={`Preview ${file.path}`} onclick={() => openFilePreview(file.path)}>
+								<button type="button" class="console-files__row" title={`Preview ${file.path}`} onclick={() => openFromFiles(file.path)}>
 									<Icon name="file" size={12} />
 									<span class="console-files__path">
 										<span class="console-files__name">{file.name}</span>
diff --git a/src/lib/chat-console/PreviewPane.svelte b/src/lib/chat-console/PreviewPane.svelte
index b43a65d..51475bb 100644
--- a/src/lib/chat-console/PreviewPane.svelte
+++ b/src/lib/chat-console/PreviewPane.svelte
@@ -13,7 +13,14 @@
 		previewState,
 	} from './preview-state.svelte';
 
-	let { conversationId }: { conversationId: string | null } = $props();
+	let {
+		conversationId,
+		onClosed,
+	}: {
+		conversationId: string | null;
+		/** After "Close preview" — which removes that button, and may fold the rail (#14). */
+		onClosed?: () => void;
+	} = $props();
 
 	let address = $state('');
 	let addressError = $state<string | null>(null);
@@ -172,7 +179,15 @@
 						<Icon name="external" size={12} />
 					</a>
 				{/if}
-				<button type="button" title="Close preview" aria-label="Close preview" onclick={clearPreview}>
+				<button
+					type="button"
+					title="Close preview"
+					aria-label="Close preview"
+					onclick={() => {
+						clearPreview();
+						onClosed?.();
+					}}
+				>
 					<Icon name="x" size={12} />
 				</button>
 			</div>
diff --git a/src/lib/chat-console/RailHeaderButton.svelte b/src/lib/chat-console/RailHeaderButton.svelte
new file mode 100644
index 0000000..1003cf5
--- /dev/null
+++ b/src/lib/chat-console/RailHeaderButton.svelte
@@ -0,0 +1,35 @@
+<script lang="ts">
+	import { MediaQuery } from 'svelte/reactivity';
+	import { mobileDrawerState } from './mobile-drawer-state.svelte';
+	import { previewState, toggleRailFromHeader } from './preview-state.svelte';
+
+	/*
+	 * #14 — the chat header's rail button, shown below the desktop breakpoint.
+	 *
+	 * It does two different things, and its name and `aria-expanded` follow whichever it does
+	 * at the current width: on a phone it opens the rail's drawer; on a tablet, where the rail
+	 * is a column beside the thread, it expands or folds that column. Same query as
+	 * `isDrawerViewport` in preview-state, so the label never disagrees with the action.
+	 */
+	const drawerViewport = new MediaQuery('(max-width: 47.99rem)');
+
+	const expanded = $derived(drawerViewport.current ? mobileDrawerState.right : previewState.open);
+	const label = $derived(
+		drawerViewport.current ? 'Open chat rail' : previewState.open ? 'Collapse chat rail' : 'Expand chat rail'
+	);
+</script>
+
+<button
+	type="button"
+	onclick={toggleRailFromHeader}
+	class="console-iconbtn"
+	aria-label={label}
+	aria-expanded={expanded}
+	title={label}
+	style="width:32px;height:32px;border:1px solid var(--color-base-300);"
+>
+	<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+		<rect x="3" y="4" width="18" height="16" rx="2" />
+		<line x1="15" y1="4" x2="15" y2="20" />
+	</svg>
+</button>
diff --git a/src/lib/chat-console/changed-files.ts b/src/lib/chat-console/changed-files.ts
index 2e41f8a..7e3bca2 100644
--- a/src/lib/chat-console/changed-files.ts
+++ b/src/lib/chat-console/changed-files.ts
@@ -75,7 +75,9 @@ function splitPath(path: string): { name: string; dir: string } {
  * - Lists are read in order, oldest first: saved messages by sequence, then the live turn.
  * - A block with an `id` is counted once even when two lists hold it.
  * - Only successful `file_edit` blocks count; a write that changed nothing
- *   (`unavailable: 'no_change'`) is not a change.
+ *   (`unavailable: 'no_change'`) is not a change. A created file always is: replies saved
+ *   before `tool-result-details` learned to diff a new file stored every `Write` create as
+ *   `no_change`, and those files belong on the list too.
  * - Counts add up across edits, and a file created at any point stays `create`.
  */
 export function collectChangedFiles(blockLists: Iterable<BlockList | null | undefined>): ChangedFile[] {
@@ -93,7 +95,7 @@ export function collectChangedFiles(blockLists: Iterable<BlockList | null | unde
 			}
 			if (failed(block) || !isFileEdit(block.details)) continue
 			const details = block.details
-			if (details.unavailable === 'no_change') continue
+			if (details.unavailable === 'no_change' && details.changeType !== 'create') continue
 
 			order += 1
 			const path = details.path.trim()
diff --git a/src/lib/chat-console/preview-state.svelte.ts b/src/lib/chat-console/preview-state.svelte.ts
index 7978af6..85da403 100644
--- a/src/lib/chat-console/preview-state.svelte.ts
+++ b/src/lib/chat-console/preview-state.svelte.ts
@@ -164,6 +164,12 @@ export async function hydratePreviewState(conversationId: string | null) {
 let openLoaded = false;
 /** Set once anything changes `open`; a stored value arriving later must not undo it. */
 let openTouched = false;
+/**
+ * What the database holds, as far as this page knows: null until it has been read or
+ * written. While it is unknown, `open` may be this browser's copy rather than the stored
+ * value, so a choice that matches it must still be saved.
+ */
+let savedOpen: boolean | null = null;
 let openSaveTimer: ReturnType<typeof setTimeout> | null = null;
 
 /** Load the viewer's remembered fold once per page load. Later chats reuse it from memory. */
@@ -172,6 +178,7 @@ export async function hydrateRailOpen() {
 	openLoaded = true;
 	try {
 		const stored = await getRailOpen();
+		savedOpen ??= stored; // a save that landed first knows better
 		if (!openTouched) {
 			previewState.open = stored;
 			writeRailOpenMirror(stored);
@@ -193,15 +200,20 @@ export async function hydrateRailOpen() {
 function setOpen(open: boolean) {
 	if (isDrawerViewport()) return;
 	openTouched = true;
-	if (previewState.open === open) return;
+	if (previewState.open === open && (savedOpen === open || openSaveTimer)) return;
 	previewState.open = open;
 	writeRailOpenMirror(open);
 	if (openSaveTimer) clearTimeout(openSaveTimer);
 	openSaveTimer = setTimeout(() => {
 		openSaveTimer = null;
-		void setRailOpen(previewState.open).catch(() => {
-			// Same as the selection: the fold still holds for this session.
-		});
+		const next = previewState.open;
+		void setRailOpen(next)
+			.then(() => {
+				savedOpen = next;
+			})
+			.catch(() => {
+				// Same as the selection: the fold still holds for this session.
+			});
 	}, 400);
 }
 
diff --git a/src/lib/chat/FileEditCard.svelte b/src/lib/chat/FileEditCard.svelte
index 9760058..e59a5fd 100644
--- a/src/lib/chat/FileEditCard.svelte
+++ b/src/lib/chat/FileEditCard.svelte
@@ -40,12 +40,18 @@
 		details.changeType === 'create' ? 'Created' : details.tool === 'Write' ? 'Rewrote' : 'Edited'
 	);
 
+	// A created file's diff is its contents, so it has no lines only when it is empty — or
+	// when it was saved before new files were diffed, as "no change". It is never "no change".
 	const emptyReason = $derived(
-		details.unavailable === 'no_change'
-			? 'No changes — the file already matched what was written.'
-			: details.unavailable === 'diff_missing'
-				? 'The diff is unavailable for this edit (the previous contents were too large to diff).'
-				: ''
+		details.changeType === 'create'
+			? details.unavailable === 'none' && details.additions === 0
+				? 'An empty new file.'
+				: 'A new file — open it to see its contents.'
+			: details.unavailable === 'no_change'
+				? 'No changes — the file already matched what was written.'
+				: details.unavailable === 'diff_missing'
+					? 'The diff is unavailable for this edit (the previous contents were too large to diff).'
+					: ''
 	);
 
 	type NumberedLine = { text: string; cls: string; no: number | null };
diff --git a/src/lib/engine/tool-result-details.ts b/src/lib/engine/tool-result-details.ts
index 0d865a8..184f6c6 100644
--- a/src/lib/engine/tool-result-details.ts
+++ b/src/lib/engine/tool-result-details.ts
@@ -32,6 +32,13 @@
 /** Total diff lines kept across all hunks of one edit. Beyond this the edit is truncated. */
 export const MAX_DIFF_LINES = 400
 
+/**
+ * Characters of a new file's contents kept as its diff (its lines also count against
+ * `MAX_DIFF_LINES`). A created file's "diff" is the file itself, and one long minified line
+ * would otherwise carry all of it into the database.
+ */
+export const MAX_CREATED_FILE_CHARS = 32_000
+
 /** Characters kept per output stream. The tail is kept — a failing command explains itself at the end. */
 export const MAX_STREAM_CHARS = 16_000
 
@@ -70,10 +77,13 @@ export type FileEditDetails = {
 	 * Set when `hunks` is empty and that is not a bug: `no_change` for a write that changed
 	 * nothing, `diff_missing` when the SDK could not produce one (it documents an empty
 	 * patch for a diff that timed out, and a null `originalFile` when the previous contents
-	 * were too large to include).
+	 * were too large to include). Never set on a created file: its diff is its contents.
 	 */
 	unavailable: DiffUnavailable
-	/** True when hunks were dropped to stay inside `MAX_DIFF_LINES`. */
+	/**
+	 * True when hunks were dropped to stay inside `MAX_DIFF_LINES`, or a created file's
+	 * contents were cut to fit `MAX_DIFF_LINES` / `MAX_CREATED_FILE_CHARS`.
+	 */
 	truncated: boolean
 }
 
@@ -342,6 +352,35 @@ function countChanges(hunks: DiffHunk[]): { additions: number; deletions: number
 	return { additions, deletions }
 }
 
+/**
+ * A new file as the diff that created it: one hunk, every line added.
+ *
+ * The SDK's `Write` reports a new file with an empty `structuredPatch` and
+ * `originalFile: null` — there is no "before" to diff against — so without this a created
+ * file read as a write that changed nothing. Its `content` is the whole change. The hunk is
+ * kept inside the same budgets as any other diff; `lineCount` counts the whole file.
+ */
+function createdFileHunk(content: string): { hunks: DiffHunk[]; truncated: boolean; lineCount: number } {
+	const lines = content.split('\n')
+	// A trailing newline ends the last line; it does not start another.
+	if (lines.at(-1) === '') lines.pop()
+	const lineCount = lines.length
+
+	const kept: string[] = []
+	let budget = MAX_CREATED_FILE_CHARS
+	for (const raw of lines) {
+		if (kept.length >= MAX_DIFF_LINES || budget <= 0) break
+		const line = raw.endsWith('\r') ? raw.slice(0, -1) : raw
+		kept.push(`+${line.slice(0, budget)}`)
+		budget -= line.length
+	}
+
+	const truncated = kept.length < lineCount || budget < 0
+	const hunks =
+		kept.length > 0 ? [{ oldStart: 0, oldLines: 0, newStart: 1, newLines: kept.length, lines: kept }] : []
+	return { hunks, truncated, lineCount }
+}
+
 function fileEditDetails(
 	toolName: string,
 	result: Record<string, unknown>,
@@ -351,24 +390,32 @@ function fileEditDetails(
 	if (!path) return null
 
 	const all = readHunks(result.structuredPatch)
-	const { hunks, truncated } = capHunks(all)
+	let { hunks, truncated } = capHunks(all)
 
 	// `type` is FileWriteOutput's own field; Edit has no equivalent, and an edit by
 	// definition changes a file that already existed.
 	const changeType = str(result.type) === 'create' ? 'create' : 'update'
 
+	let counted = countChanges(hunks)
+	if (changeType === 'create' && all.length === 0 && typeof result.content === 'string') {
+		const created = createdFileHunk(result.content)
+		hunks = created.hunks
+		truncated = created.truncated
+		counted = { additions: created.lineCount, deletions: 0 }
+	}
+
 	const gitDiff = asRecord(result.gitDiff)
-	const counted = countChanges(hunks)
 	// Prefer git's counts: they describe the whole change even when hunks were dropped.
 	const additions = num(gitDiff?.additions) ?? counted.additions
 	const deletions = num(gitDiff?.deletions) ?? counted.deletions
 
+	// A created file changed something even when it is empty: it did not exist before.
 	let unavailable: DiffUnavailable = 'none'
-	if (all.length === 0) {
+	if (all.length === 0 && changeType === 'update') {
 		// An empty patch with the original contents in hand means nothing actually changed.
-		// An empty patch with `originalFile: null` on an update means the SDK could not
-		// produce one — a diff that timed out, or previous contents too large to include.
-		unavailable = changeType === 'update' && result.originalFile === null ? 'diff_missing' : 'no_change'
+		// An empty patch with `originalFile: null` means the SDK could not produce one — a
+		// diff that timed out, or previous contents too large to include.
+		unavailable = result.originalFile === null ? 'diff_missing' : 'no_change'
 	}
 
 	return {
diff --git a/src/routes/chat/[id]/+page.svelte b/src/routes/chat/[id]/+page.svelte
index a4e7ef6..ca2c179 100644
--- a/src/routes/chat/[id]/+page.svelte
+++ b/src/routes/chat/[id]/+page.svelte
@@ -25,7 +25,7 @@
 	import { consoleState, resetConsoleState, setChangedFiles } from '$lib/chat-console/console-state.svelte';
 	import { changedFilesInThread } from '$lib/chat-console/changed-files';
 	import { openLeft } from '$lib/chat-console/mobile-drawer-state.svelte';
-	import { toggleRailFromHeader } from '$lib/chat-console/preview-state.svelte';
+	import RailHeaderButton from '$lib/chat-console/RailHeaderButton.svelte';
 	import Icon from '$lib/chat-console/Icon.svelte';
 	import PinnedTodoPanel from '$lib/chat/PinnedTodoPanel.svelte';
 	import type { TodoItem } from '$lib/engine/tool-result-details';
@@ -1521,6 +1521,12 @@
 						</span>
 					{/if}
 				</div>
+				{#if conversationData.conversation.totalCost && Number.parseFloat(String(conversationData.conversation.totalCost)) > 0}
+					<!-- #14: the cost at tablet widths, which get neither the desktop topbar nor the phone's chips row. -->
+					<span class="hidden shrink-0 tablet:inline-flex">
+						<span class="console-chip" title="Metered spend for this conversation">${Number.parseFloat(String(conversationData.conversation.totalCost)).toFixed(4)}</span>
+					</span>
+				{/if}
 				<ContextWindow
 					used={contextMetrics.used}
 					total={contextMetrics.total}
@@ -1529,12 +1535,7 @@
 					reservedTargetPct={reservedResponsePct}
 					onCompact={compactContext}
 				/>
-				<button type="button" onclick={toggleRailFromHeader} class="console-iconbtn" aria-label="Open chat rail" title="Open rail" style="width:32px;height:32px;border:1px solid var(--color-base-300);">
-					<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
-						<rect x="3" y="4" width="18" height="16" rx="2" />
-						<line x1="15" y1="4" x2="15" y2="20" />
-					</svg>
-				</button>
+				<RailHeaderButton />
 			</div>
 
 			<!-- Mobile chips row: permission mode, running, pending, context, cost -->
diff --git a/tests/chat-console.changed-files.spec.ts b/tests/chat-console.changed-files.spec.ts
index ad47e70..5a84e87 100644
--- a/tests/chat-console.changed-files.spec.ts
+++ b/tests/chat-console.changed-files.spec.ts
@@ -1,5 +1,6 @@
 import { expect, test } from '@playwright/test'
 import { changedFilesInThread, collectChangedFiles, sameChangedFiles } from '../src/lib/chat-console/changed-files'
+import { toolResultDetails } from '../src/lib/engine/tool-result-details'
 
 /**
  * #14 — the rail's Files tab: "changed in this chat".
@@ -8,9 +9,16 @@ import { changedFilesInThread, collectChangedFiles, sameChangedFiles } from '../
  * import), so this runs without Postgres or a dev server, like
  * `engine.tool-result-details.spec.ts`.
  *
+ * The edits are not hand-written `file_edit` objects: each one is what the engine's own
+ * `toolResultDetails` makes of the payload the Agent SDK returns for that tool, so these
+ * rows are the shape production stores. (A hand-written create once hid the fact that every
+ * file the agent created with `Write` was missing from the tab.)
+ *
  * What is pinned here:
  *   - one row per file, with the +/- counts of every edit to it added up
- *   - a file created at any point in the chat stays "new"
+ *   - a file created with `Write` is listed, marked new, with every line counted, and it
+ *     stays new whatever edits follow — including a create saved before new files were
+ *     diffed, which was stored as "no change"
  *   - newest first, by the most recent edit
  *   - a block the live stream and a saved list both hold is counted once
  *   - only successful `file_edit` blocks count: other tools, failed or denied calls,
@@ -19,23 +27,37 @@ import { changedFilesInThread, collectChangedFiles, sameChangedFiles } from '../
  *   - `sameChangedFiles`, which spares the rail a redraw on every streamed token
  */
 
-function edit(
-	path: string,
-	additions: number,
-	deletions: number,
-	extra: { changeType?: 'create' | 'update'; unavailable?: 'none' | 'no_change' | 'diff_missing'; tool?: string } = {},
-) {
-	return {
-		kind: 'file_edit' as const,
-		tool: extra.tool ?? 'Edit',
-		path,
-		changeType: extra.changeType ?? 'update',
-		hunks: [],
-		additions,
-		deletions,
-		unavailable: extra.unavailable ?? 'none',
-		truncated: false,
-	}
+/** An `Edit` as the SDK answers one: a patch of `deletions` removed and `additions` added lines. */
+function edit(path: string, additions: number, deletions: number) {
+	const lines = [
+		...Array.from({ length: deletions }, (_, i) => `-old ${i}`),
+		...Array.from({ length: additions }, (_, i) => `+new ${i}`),
+	]
+	return toolResultDetails('Edit', {
+		filePath: path,
+		oldString: 'old',
+		newString: 'new',
+		originalFile: 'old\n',
+		structuredPatch: [{ oldStart: 1, oldLines: deletions, newStart: 1, newLines: additions, lines }],
+		userModified: false,
+		replaceAll: false,
+	})
+}
+
+/** A `Write` that created a file, as the SDK answers one: no patch and no original. */
+function create(path: string, content: string) {
+	return toolResultDetails('Write', { type: 'create', filePath: path, content, structuredPatch: [], originalFile: null })
+}
+
+/** A `Write` that left an existing file exactly as it was. */
+function unchangedWrite(path: string) {
+	return toolResultDetails('Write', {
+		type: 'update',
+		filePath: path,
+		content: 'same\n',
+		structuredPatch: [],
+		originalFile: 'same\n',
+	})
 }
 
 /** A saved tool block: no id, `success` rather than a status. */
@@ -59,13 +81,37 @@ test.describe('collectChangedFiles', () => {
 		expect(app).toMatchObject({ name: 'app.ts', dir: '/w/src/', additions: 7, deletions: 3, edits: 2, changeType: 'update' })
 	})
 
+	test('a file the agent created with Write is listed, marked new, with every line counted', () => {
+		expect(collectChangedFiles([[saved(create('/w/new.ts', 'a\nb\nc\n'))]])).toEqual([
+			{ path: '/w/new.ts', name: 'new.ts', dir: '/w/', changeType: 'create', additions: 3, deletions: 0, edits: 1 },
+		])
+		// An empty new file is still a new file.
+		expect(collectChangedFiles([[saved(create('/w/.keep', ''))]])).toMatchObject([{ path: '/w/.keep', changeType: 'create' }])
+	})
+
 	test('a file created anywhere in the chat stays new', () => {
 		const [file] = collectChangedFiles([
-			[saved(edit('/w/new.ts', 10, 0, { changeType: 'create', tool: 'Write' }))],
+			[saved(create('/w/new.ts', 'one\ntwo\n'))],
 			[saved(edit('/w/new.ts', 1, 1))],
 		])
-		expect(file.changeType).toBe('create')
-		expect(file.edits).toBe(2)
+		expect(file).toMatchObject({ changeType: 'create', edits: 2, additions: 3, deletions: 1 })
+	})
+
+	test('a create saved before new files were diffed is still listed as new', () => {
+		// What the engine stored for every Write create until the fix: an empty patch, read as
+		// "nothing changed". Those replies are still in people's chats.
+		const legacy = {
+			kind: 'file_edit',
+			tool: 'Write',
+			path: '/w/old-new.ts',
+			changeType: 'create',
+			hunks: [],
+			additions: 0,
+			deletions: 0,
+			unavailable: 'no_change',
+			truncated: false,
+		}
+		expect(collectChangedFiles([[saved(legacy)]])).toMatchObject([{ path: '/w/old-new.ts', changeType: 'create', edits: 1 }])
 	})
 
 	test('orders files by their most recent edit, newest first', () => {
@@ -95,7 +141,7 @@ test.describe('collectChangedFiles', () => {
 				saved({ kind: 'file_edit', path: '   ' }),
 				saved(null),
 				saved('not an object'),
-				saved(edit('/w/same.ts', 0, 0, { tool: 'Write', unavailable: 'no_change' })),
+				saved(unchangedWrite('/w/same.ts')),
 				null,
 				undefined,
 				saved(edit('/w/kept.ts', 1, 0)),
@@ -107,7 +153,7 @@ test.describe('collectChangedFiles', () => {
 	})
 
 	test('treats a missing or nonsense count as zero', () => {
-		const [file] = collectChangedFiles([[saved({ ...edit('/w/a.ts', 0, 0), additions: 'many', deletions: -4 })]])
+		const [file] = collectChangedFiles([[saved({ ...edit('/w/a.ts', 1, 0), additions: 'many', deletions: -4 })]])
 		expect(file).toMatchObject({ additions: 0, deletions: 0 })
 	})
 
diff --git a/tests/chat.rail.spec.ts b/tests/chat.rail.spec.ts
index d4a4341..b27b543 100644
--- a/tests/chat.rail.spec.ts
+++ b/tests/chat.rail.spec.ts
@@ -1,4 +1,5 @@
 import { expect, test, type Page } from '@playwright/test'
+import { toolResultDetails } from '../src/lib/engine/tool-result-details'
 import {
 	acquireGlobalStateLock,
 	authenticateContext,
@@ -13,8 +14,10 @@ import {
  * #14 — the chat's right rail: Preview + Files, folded to a strip until it is needed.
  *
  * Seeds a conversation whose saved assistant reply carries `Edit` / `Write` blocks with
- * `file_edit` details — the shape the engine persists on `messages.metadata.blocks` — so
- * the Files tab has something real to list without a model round-trip.
+ * `file_edit` details, so the Files tab has something real to list without a model
+ * round-trip. The details are made by the engine's own `toolResultDetails` from the payload
+ * the Agent SDK returns for each tool — for the created file, no patch and no original — so
+ * they are exactly what `messages.metadata.blocks` holds in production.
  *
  * Whether the rail is expanded is a per-user preference (`chat_workbench_preferences.
  * panel_layout.railOpen`), shared by every test that signs in as the test user. So every
@@ -41,29 +44,50 @@ async function seedChatWithEdits(prefix: string, extra?: { runId?: string }) {
 		values (${conversation.id}, 'user', ${`${prefix} prompt`}, 'anthropic/claude-sonnet-4', '{}'::jsonb, '[]'::jsonb, 1)
 		returning id
 	`
-	const fileEdit = (path: string, additions: number, deletions: number, changeType: 'create' | 'update', tool: string) => ({
+	const toolBlock = (tool: string, path: string, sdkResult: Record<string, unknown>) => ({
 		kind: 'tool',
 		name: tool,
 		arguments: { file_path: path },
 		result: 'ok',
 		success: true,
 		executionMs: 0,
-		details: {
-			kind: 'file_edit',
-			tool,
-			path,
-			changeType,
-			hunks: [],
-			additions,
-			deletions,
-			unavailable: 'none',
-			truncated: false,
-		},
+		details: toolResultDetails(tool, sdkResult, { file_path: path }),
 	})
+	/** An `Edit` as the SDK answers one: a patch of `deletions` removed and `additions` added lines. */
+	const edit = (path: string, additions: number, deletions: number) =>
+		toolBlock('Edit', path, {
+			filePath: path,
+			oldString: 'old',
+			newString: 'new',
+			originalFile: 'old\n',
+			structuredPatch: [
+				{
+					oldStart: 1,
+					oldLines: deletions,
+					newStart: 1,
+					newLines: additions,
+					lines: [
+						...Array.from({ length: deletions }, (_, i) => `-old ${i}`),
+						...Array.from({ length: additions }, (_, i) => `+new ${i}`),
+					],
+				},
+			],
+			userModified: false,
+			replaceAll: false,
+		})
+	/** A `Write` that created a file, as the SDK answers one: no patch and no original. */
+	const create = (path: string, lineCount: number) =>
+		toolBlock('Write', path, {
+			type: 'create',
+			filePath: path,
+			content: Array.from({ length: lineCount }, (_, i) => `line ${i + 1}\n`).join(''),
+			structuredPatch: [],
+			originalFile: null,
+		})
 	const blocks = [
-		fileEdit('src/lib/rail-demo/widget.ts', 5, 2, 'update', 'Edit'),
-		fileEdit('notes/rail-plan.md', 12, 0, 'create', 'Write'),
-		fileEdit('src/lib/rail-demo/widget.ts', 3, 1, 'update', 'Edit'),
+		edit('src/lib/rail-demo/widget.ts', 5, 2),
+		create('notes/rail-plan.md', 12),
+		edit('src/lib/rail-demo/widget.ts', 3, 1),
 		{ kind: 'text', content: `${prefix} done` },
 	]
 	const metadata = { blocks, ...(extra?.runId ? { runId: extra.runId } : {}) }
@@ -108,11 +132,28 @@ async function holdRailOpenPref(): Promise<() => Promise<void>> {
 		return async () => {
 			try {
 				const userId = await getActiveUserId()
-				await getSql()`
-					update chat_workbench_preferences
-					set panel_layout = ${original.panelLayout === null ? null : getSql().json(original.panelLayout as never)}
-					where user_id = ${userId}
-				`
+				if (!original.exists) {
+					// The user had no preferences row, so this test made it. Take the key back out,
+					// and drop the row only if nothing else has been saved on it since.
+					await getSql()`
+						update chat_workbench_preferences
+						set panel_layout = panel_layout - 'railOpen'
+						where user_id = ${userId}
+					`
+					await getSql()`
+						delete from chat_workbench_preferences
+						where user_id = ${userId}
+							and default_agent_id is null
+							and show_right_panel = true
+							and coalesce(panel_layout, '{}'::jsonb) = '{}'::jsonb
+					`
+				} else {
+					await getSql()`
+						update chat_workbench_preferences
+						set panel_layout = ${original.panelLayout === null ? null : getSql().json(original.panelLayout as never)}
+						where user_id = ${userId}
+					`
+				}
 			} finally {
 				await release()
 			}
@@ -214,6 +255,12 @@ test.describe('chat rail — desktop column', () => {
 		await expect(plan.locator('.console-files__stat.is-add')).toHaveText('+12')
 		await expect(plan.locator('.console-files__stat.is-del')).toHaveCount(0)
 
+		// The thread's card for the new file shows what was written, not "No changes".
+		const card = page.locator('.console-diff').filter({ hasText: 'rail-plan.md' })
+		await expect(card.locator('.console-diff__verb')).toHaveText('Created')
+		await expect(card.locator('.console-diff__line.is-add')).toHaveCount(12)
+		await expect(card).not.toContainText('No changes')
+
 		await plan.click()
 		await expect(rail.getByRole('tab', { name: 'Preview' })).toHaveAttribute('aria-selected', 'true')
 		await expect(rail.locator('.console-prev__bar')).toContainText('notes/rail-plan.md')
@@ -318,18 +365,62 @@ test.describe('chat rail — desktop column', () => {
 		await waitForRailOpenPref(false)
 	})
 
-	test('on a tablet-width window the header button expands and folds the column', async ({ page }) => {
+	test('on a tablet-width window the header button expands and folds the column, and says which', async ({ page }) => {
 		await page.setViewportSize({ width: 1024, height: 800 })
 		await openChat(page, conversationId, prefix)
 		const rail = columnRail(page)
 		await expect(rail).toHaveClass(/is-collapsed/)
 
-		const headerButton = page.getByRole('button', { name: 'Open chat rail' }).filter({ visible: true })
-		await headerButton.click()
+		// This width has neither the desktop topbar nor the phone's chips row, so the header
+		// carries the metered cost itself, once.
+		await expect(page.getByText('$0.0123').filter({ visible: true })).toHaveCount(1)
+
+		const expand = page.getByRole('button', { name: 'Expand chat rail' }).filter({ visible: true })
+		await expect(expand).toHaveAttribute('aria-expanded', 'false')
+		await expand.click()
 		await expect(rail).not.toHaveClass(/is-collapsed/)
 		await waitForRailOpenPref(true)
-		await headerButton.click()
+
+		// The same button, now named for what it will do next.
+		const collapse = page.getByRole('button', { name: 'Collapse chat rail' }).filter({ visible: true })
+		await expect(collapse).toHaveAttribute('aria-expanded', 'true')
+		await expect(collapse).toBeFocused()
+		await collapse.click()
+		await expect(rail).toHaveClass(/is-collapsed/)
+		await expect(expand).toHaveAttribute('aria-expanded', 'false')
+		await waitForRailOpenPref(false)
+	})
+
+	test('keyboard focus follows the rail as it expands and folds', async ({ page }) => {
+		await openChat(page, conversationId, prefix)
+		const rail = columnRail(page)
+		const expand = rail.getByRole('button', { name: 'Expand rail' })
+		const collapse = rail.getByRole('button', { name: 'Collapse rail' })
+
+		// Each of these buttons is replaced by the other when pressed; focus goes with it
+		// rather than dropping to the page.
+		await expand.focus()
+		await page.keyboard.press('Enter')
+		await expect(collapse).toBeFocused()
+		await page.keyboard.press('Enter')
+		await expect(expand).toBeFocused()
+
+		// A strip button lands on the tab it asked for.
+		await rail.getByRole('button', { name: 'Show Files' }).focus()
+		await page.keyboard.press('Enter')
+		await expect(rail.getByRole('tab', { name: /Files/ })).toBeFocused()
+
+		// Opening a file replaces the Files list with the preview: focus lands on its tab.
+		await rail.locator('.console-files__row').first().focus()
+		await page.keyboard.press('Enter')
+		await expect(rail.getByRole('tab', { name: 'Preview' })).toBeFocused()
+		await expect(rail.locator('.console-prev__bar')).toBeVisible()
+
+		// Closing the preview folds the rail: focus lands on the strip's expand button.
+		await rail.getByRole('button', { name: 'Close preview' }).focus()
+		await page.keyboard.press('Enter')
 		await expect(rail).toHaveClass(/is-collapsed/)
+		await expect(expand).toBeFocused()
 		await waitForRailOpenPref(false)
 	})
 
@@ -361,7 +452,12 @@ test.describe('chat rail — phone drawer', () => {
 			// The desktop column is hidden at this width.
 			await expect(columnRail(page)).toBeHidden()
 
-			await page.getByRole('button', { name: 'Open chat rail' }).filter({ visible: true }).click()
+			// The cost shows once, in the chips row under the header.
+			await expect(page.getByText('$0.0123').filter({ visible: true })).toHaveCount(1)
+
+			const railButton = page.getByRole('button', { name: 'Open chat rail' }).filter({ visible: true })
+			await expect(railButton).toHaveAttribute('aria-expanded', 'false')
+			await railButton.click()
 			const drawer = page.getByRole('dialog', { name: 'Chat rail drawer' })
 			// This drawer used to open empty: the rule hiding the column hid it too.
 			await expect(drawer.getByLabel('Open a file path or URL in the preview')).toBeVisible()
diff --git a/tests/engine.tool-result-details.spec.ts b/tests/engine.tool-result-details.spec.ts
index 40f76f4..f302f64 100644
--- a/tests/engine.tool-result-details.spec.ts
+++ b/tests/engine.tool-result-details.spec.ts
@@ -1,5 +1,6 @@
 import { expect, test } from '@playwright/test'
 import {
+	MAX_CREATED_FILE_CHARS,
 	MAX_DIFF_LINES,
 	MAX_STREAM_CHARS,
 	MAX_TODO_ITEMS,
@@ -23,6 +24,8 @@ import {
  *     than throwing — this runs inside the stream loop, where an exception kills the turn
  *   - the difference between "nothing changed" and "we could not produce a diff", which
  *     the card renders as two different sentences
+ *   - a created file, which the SDK reports with no patch at all, is neither: it is its
+ *     own contents, added, inside the same caps
  */
 
 /** A `structuredPatch` hunk in the SDK's shape. */
@@ -81,6 +84,89 @@ test.describe('file edits', () => {
 		expect(details?.kind === 'file_edit' && details.unavailable).toBe('none')
 	})
 
+	test('a new file, as the SDK reports it, is its contents added — not "nothing changed"', () => {
+		// What the bundled CLI returns for a Write that creates a file: no patch (there is no
+		// "before" to diff) and no original. This used to read as `no_change`, which hid every
+		// created file from the rail's Files tab and labelled its card "No changes".
+		const details = toolResultDetails('Write', {
+			type: 'create',
+			filePath: '/w/new.ts',
+			content: 'a\nb\r\nc\n',
+			structuredPatch: [],
+			originalFile: null,
+		})
+
+		expect(details?.kind).toBe('file_edit')
+		if (details?.kind !== 'file_edit') return
+		expect(details.changeType).toBe('create')
+		expect(details.unavailable).toBe('none')
+		expect(details.additions).toBe(3)
+		expect(details.deletions).toBe(0)
+		expect(details.truncated).toBe(false)
+		// Numbered from line 1 of the new file; a Windows line ending is not part of the text.
+		expect(details.hunks).toEqual([{ oldStart: 0, oldLines: 0, newStart: 1, newLines: 3, lines: ['+a', '+b', '+c'] }])
+	})
+
+	test('a new file prefers git’s counts, and an empty one is still a change', () => {
+		const counted = toolResultDetails('Write', {
+			type: 'create',
+			filePath: '/w/new.ts',
+			content: 'a\n',
+			structuredPatch: [],
+			originalFile: null,
+			gitDiff: { filename: 'new.ts', status: 'added', additions: 7, deletions: 0, changes: 7, patch: '' },
+		})
+		expect(counted?.kind === 'file_edit' && counted.additions).toBe(7)
+
+		const empty = toolResultDetails('Write', {
+			type: 'create',
+			filePath: '/w/empty.ts',
+			content: '',
+			structuredPatch: [],
+			originalFile: null,
+		})
+		expect(empty?.kind).toBe('file_edit')
+		if (empty?.kind !== 'file_edit') return
+		expect(empty.unavailable).toBe('none')
+		expect(empty.hunks).toEqual([])
+		expect(empty.additions).toBe(0)
+	})
+
+	test('a large new file keeps its first lines, counts all of them, and is flagged', () => {
+		const lines = Array.from({ length: MAX_DIFF_LINES + 25 }, (_, i) => `line ${i}`)
+		const details = toolResultDetails('Write', {
+			type: 'create',
+			filePath: '/w/big.ts',
+			content: `${lines.join('\n')}\n`,
+			structuredPatch: [],
+			originalFile: null,
+		})
+
+		expect(details?.kind).toBe('file_edit')
+		if (details?.kind !== 'file_edit') return
+		expect(details.additions).toBe(MAX_DIFF_LINES + 25)
+		expect(details.truncated).toBe(true)
+		expect(details.hunks[0].lines).toHaveLength(MAX_DIFF_LINES)
+		expect(details.hunks[0].lines[0]).toBe('+line 0')
+	})
+
+	test('a new file of one enormous line is cut to the character budget', () => {
+		const details = toolResultDetails('Write', {
+			type: 'create',
+			filePath: '/w/bundle.min.js',
+			content: 'x'.repeat(MAX_CREATED_FILE_CHARS * 3),
+			structuredPatch: [],
+			originalFile: null,
+		})
+
+		expect(details?.kind).toBe('file_edit')
+		if (details?.kind !== 'file_edit') return
+		expect(details.additions).toBe(1)
+		expect(details.truncated).toBe(true)
+		// The kept text plus the `+` marker; the rest of the file never reaches the database.
+		expect(details.hunks[0].lines[0]).toHaveLength(MAX_CREATED_FILE_CHARS + 1)
+	})
+
 	test('an empty patch means "nothing changed" when the original is in hand', () => {
 		const details = toolResultDetails('Write', {
 			type: 'update',