diff --git a/web/src/lib/components/repo/DiffView.stories.svelte b/web/src/lib/components/repo/DiffView.stories.svelte
index e985af8e0..082df582f 100644
--- a/web/src/lib/components/repo/DiffView.stories.svelte
+++ b/web/src/lib/components/repo/DiffView.stories.svelte
@@ -384,6 +384,12 @@ export const formatPercent = (ratio: number): string => {
 
 <Story name="Mixed file kinds" />
 
+<!-- the widest the toolbar gets: the download dropdown only renders with urls -->
+<Story
+	name="With downloads"
+	args={{ downloadUrls: { patch: "/patch", diff: "/diff" } }}
+/>
+
 <Story
 	name="No change between two revisions"
 	args={{ diff: { ...diff, files: [], stat: stat([]) } }}
diff --git a/web/src/lib/components/repo/DiffView.svelte b/web/src/lib/components/repo/DiffView.svelte
index 49017fabb..95cc8258f 100644
--- a/web/src/lib/components/repo/DiffView.svelte
+++ b/web/src/lib/components/repo/DiffView.svelte
@@ -57,7 +57,7 @@
 	}: Props = $props();
 
 	let treeOpen = $state(true);
-	const TREE_WIDTH = 320;
+	const TREE_WIDTH = 250;
 	const TREE_MIN_WIDTH = 200;
 	const TREE_MAX_WIDTH = 560;
 	let treeWidth = $state(TREE_WIDTH);
@@ -175,9 +175,10 @@
 		     toolbar leaves -->
 			<div class="flex min-h-0 min-w-0 flex-1 flex-col">
 				<!-- nowrap: a wrapped toolbar grows past the space the file
-			     headers dock under -->
+			     headers dock under. the button labels drop out below the width
+			     where the full toolbar still fits on that one line -->
 				<div
-					class="flex min-h-14 flex-nowrap items-center justify-between gap-2 bg-background-default py-2"
+					class="@container/toolbar flex min-h-14 flex-nowrap items-center justify-between gap-2 bg-background-default py-2"
 				>
 					<div class="{treeOpen ? 'pl-1' : ''} flex items-center gap-3">
 						{#if !treeOpen}
@@ -202,37 +203,36 @@
 							icon={allOpen ? FoldVertical : UnfoldVertical}
 							title={allOpen ? "Collapse lines" : "Expand lines"}
 							onclick={() => setAllOpen(!allOpen)}
-							variant="ghost">{allOpen ? "Collapse" : "Expand"}</Button
+							variant="ghost"
 						>
+							<span class="hidden @min-[42rem]/toolbar:inline"
+								>{allOpen ? "Collapse" : "Expand"}</span
+							>
+						</Button>
 						{#if downloadUrls}
 							<Dropdown
 								variant="button"
 								buttonVariant="ghost"
 								align="right"
 								label="Download commit"
+								title="Download commit"
 							>
 								{#snippet trigger()}
 									<FileDown />
-									Download commit
+									<span class="hidden @min-[42rem]/toolbar:inline"
+										>Download commit</span
+									>
 								{/snippet}
 								<DropdownItem
 									href={downloadUrls.patch as "/"}
 									data-sveltekit-reload
-									icon={FileCode}
-									aria-label="As a patch file"
-									><span class="hidden sm:inline" aria-hidden="true"
-										>As a patch file</span
-									>
-								</DropdownItem>
+									icon={FileCode}>As a patch file</DropdownItem
+								>
 								<DropdownItem
 									href={downloadUrls.diff as "/"}
 									data-sveltekit-reload
-									icon={FileDiff}
-									aria-label="As a diff file"
-									><span class="hidden sm:inline" aria-hidden="true"
-										>As a diff file</span
-									>
-								</DropdownItem>
+									icon={FileDiff}>As a diff file</DropdownItem
+								>
 							</Dropdown>
 						{/if}
 						<ButtonGroup>
@@ -248,7 +248,9 @@
 									onclick={styleHref ? undefined : () => (localStyle = style)}
 									{...segmentProps(diffStyle === style)}
 								>
-									{style === "split" ? "Split" : "Unified"}
+									<span class="hidden @min-[42rem]/toolbar:inline"
+										>{style === "split" ? "Split" : "Unified"}</span
+									>
 								</Button>
 							{/each}
 						</ButtonGroup>