diff --git a/web/src/lib/components/repo/pierre.ts b/web/src/lib/components/repo/pierre.ts
index 15d919331..e0d9093f3 100644
--- a/web/src/lib/components/repo/pierre.ts
+++ b/web/src/lib/components/repo/pierre.ts
@@ -7,6 +7,7 @@ import {
 	type FileOptions
 } from "@pierre/diffs";
 import { browser } from "$app/environment";
+import diffShadowCSS from "./pierreDiff.css?raw";
 
 // pierre's two diff layouts, threaded from the ?diff= url param down to the
 // FileDiff instances
@@ -41,31 +42,6 @@ registerCustomCSSVariableTheme(PIERRE_THEME_NAME, {
 // lockfiles however do not care...
 export const PIERRE_TOKENIZE_MAX_LINE_LENGTH = 5000;
 
-// "line-info" separators carry pierre's "N unmodified lines" text, bare
-// "simple" ones get a "···"
-export const PIERRE_SEPARATOR_CSS =
-	// flush against our own file header, pierre's is disabled
-	":host{--diffs-gap-block:0}" +
-	// overflow auto so the bottom scrollbar only exists when a line overflows
-	":host{--diffs-overflow-override:auto}" +
-	"[data-separator]{block-size:21px;font-size:14px;line-height:21px;" +
-	"color:var(--diffs-fg-number-override,#9ca3af)}" +
-	// kill pierre's block gap, padding and rounded chip, the separator reads
-	// as one full-width row
-	'[data-separator="line-info"]{margin-block:0}' +
-	'[data-unified] [data-separator="line-info"] [data-separator-wrapper]{padding-inline:0}' +
-	'[data-gutter] [data-separator="line-info"] [data-separator-wrapper]{padding-left:0}' +
-	// pierre full-widths the unified separator and the split additions bar but
-	// not the split deletions one, that one carries the count text and clips in
-	// the 44px gutter
-	'[data-deletions] [data-gutter] [data-separator="line-info"] [data-separator-wrapper]{width:100cqi}' +
-	'[data-separator="line-info"] [data-separator-content]{border-radius:0}' +
-	'[data-separator="line-info"] [data-expand-button]{border-radius:0}' +
-	'[data-additions] [data-gutter] [data-separator="line-info"] [data-separator-wrapper]{border-radius:0}' +
-	"[data-separator-content]{justify-content:center}" +
-	'[data-separator="simple"]{display:flex;align-items:center;justify-content:center}' +
-	'[data-separator="simple"]::after{content:"···"}';
-
 export const PIERRE_BASE_OPTIONS = {
 	theme: PIERRE_THEME_NAME,
 	themeType: "system",
@@ -85,7 +61,7 @@ export const pierreDiffOptions = (style: DiffStyle): FileDiffOptions<undefined>
 	hunkSeparators: "line-info",
 	disableFileHeader: true,
 	overflow: "scroll",
-	unsafeCSS: PIERRE_SEPARATOR_CSS
+	unsafeCSS: diffShadowCSS
 });
 
 // pierre's core stylesheet reaches a container two ways: the `diffs-container`
diff --git a/web/src/lib/components/repo/pierreDiff.css b/web/src/lib/components/repo/pierreDiff.css
new file mode 100644
index 000000000..713f731aa
--- /dev/null
+++ b/web/src/lib/components/repo/pierreDiff.css
@@ -0,0 +1,79 @@
+/* injected into pierre's shadow dom through FileDiff's unsafeCSS option, which
+   lands in its last cascade layer. pierre guarantees nothing about this markup
+   between releases, patch ones included: https://diffs.com/docs#styling */
+
+:host {
+	/* we render our own file header, pierre's is disabled */
+	--diffs-gap-block: 0;
+	--diffs-overflow-override: auto;
+}
+
+[data-separator] {
+	block-size: 21px;
+	font-size: 14px;
+	line-height: 21px;
+	color: var(--diffs-fg-number-override, #9ca3af);
+}
+
+[data-separator="line-info"] {
+	margin-block: 0;
+}
+
+[data-unified] [data-separator="line-info"] [data-separator-wrapper] {
+	padding-inline: 0;
+}
+
+[data-gutter] [data-separator="line-info"] [data-separator-wrapper] {
+	padding-left: 0;
+}
+
+/* pierre full-widths the unified separator and the split additions bar but not
+   the split deletions one, and that is the one carrying the count text */
+[data-deletions] [data-gutter] [data-separator="line-info"] [data-separator-wrapper] {
+	width: 100cqi;
+}
+
+[data-separator="line-info"] [data-separator-content],
+[data-separator="line-info"] [data-expand-button],
+[data-additions] [data-gutter] [data-separator="line-info"] [data-separator-wrapper] {
+	border-radius: 0;
+}
+
+[data-separator-content] {
+	justify-content: center;
+}
+
+[data-separator="simple"] {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+
+[data-separator="simple"]::after {
+	content: "···";
+}
+
+[data-column-number],
+[data-gutter-buffer],
+[data-expand-button] {
+	border-right: 0;
+}
+
+/* pierre pads every line with a trailing 1ch, and the content column sizes to
+   max-content, so that pad rides into the scroll width: a file whose longest
+   line stops within 1ch of the edge scrolls sideways over nothing. wrap mode
+   keeps it, there the pad is the right inset of the text block */
+[data-overflow="scroll"] [data-line],
+[data-overflow="scroll"] [data-no-newline] {
+	padding-inline-end: 0;
+}
+
+/* firefox reserves an inline-end gutter for a vertical scrollbar that
+   overflow-y:hidden can never show, so the scrollport ends up ~11px narrower
+   than the box — but 100cqi, which pierre uses to full-width the separator
+   bars, still measures the full box. those 11px are a sideways scroll over
+   nothing. chromium never saw it: pierre zeroes its webkit scrollbar, so its
+   reserved gutter is already 0 */
+[data-code] {
+	scrollbar-gutter: auto;
+}
diff --git a/web/src/lib/components/repo/pulls/PullDiffFileCard.svelte b/web/src/lib/components/repo/pulls/PullDiffFileCard.svelte
index 39194771b..1ad9023e1 100644
--- a/web/src/lib/components/repo/pulls/PullDiffFileCard.svelte
+++ b/web/src/lib/components/repo/pulls/PullDiffFileCard.svelte
@@ -79,7 +79,7 @@
 	});
 </script>
 
-<div use:observe data-diff-key={file.key} class="overflow-clip rounded-sm drop-shadow-xs">
+<div use:observe data-diff-key={file.key} class="overflow-clip rounded-sm">
 	<details id="file-{file.name}" {open} class="group w-full">
 		<summary
 			class={[