diff --git a/web/src/lib/components/profile/ProfileActivityChart.svelte b/web/src/lib/components/profile/ProfileActivityChart.svelte
index f529dfa2e..951636948 100644
--- a/web/src/lib/components/profile/ProfileActivityChart.svelte
+++ b/web/src/lib/components/profile/ProfileActivityChart.svelte
@@ -63,7 +63,8 @@
 		) as Record<ActivityMetric, number[]>
 	);
 
-	let availableWidth = $state(988);
+	let availableWidth = $state(982);
+	let measured = $state(false);
 	const layout = $derived(layoutActivityChart(values, availableWidth));
 	const viewport: Action<HTMLDivElement> = (node) => {
 		let followsCurrent = true;
@@ -77,8 +78,9 @@
 		const onScroll = () => {
 			followsCurrent = node.scrollWidth - node.clientWidth - node.scrollLeft <= 1;
 		};
-		const observer = new ResizeObserver(() => {
-			availableWidth = node.clientWidth;
+		const observer = new ResizeObserver(([entry]) => {
+			availableWidth = Math.floor(entry.contentRect.width);
+			measured = true;
 			alignCurrent();
 		});
 		observer.observe(node);
@@ -99,7 +101,12 @@
 	{#if activity.months.length === 0}
 		<EmptyState message="This user does not have any activity yet." />
 	{:else}
-		<div use:viewport class="overflow-x-auto rounded-md border border-border-default">
+		<div
+			use:viewport
+			class="rounded-md border border-border-default {measured
+				? 'overflow-x-auto'
+				: 'overflow-hidden'}"
+		>
 			<div
 				class="relative bg-background-default"
 				style={`width:${layout.width}px;height:${layout.height}px`}
diff --git a/web/src/lib/components/profile/profileActivityChart.test.ts b/web/src/lib/components/profile/profileActivityChart.test.ts
index e984a60c7..0ee8b73ec 100644
--- a/web/src/lib/components/profile/profileActivityChart.test.ts
+++ b/web/src/lib/components/profile/profileActivityChart.test.ts
@@ -35,7 +35,7 @@ describe("layoutActivityChart", () => {
 	it("keeps a scrollable minimum width and omits the first divider", () => {
 		const layout = layoutActivityChart(values, 320);
 
-		expect(layout.width).toBe(988);
+		expect(layout.width).toBe(720);
 		expect(layout.columns[0].divider).toBe(false);
 		expect(layout.columns.slice(1).every((column) => column.divider)).toBe(true);
 	});
diff --git a/web/src/lib/components/profile/profileActivityChart.ts b/web/src/lib/components/profile/profileActivityChart.ts
index bca5df369..3e26c369e 100644
--- a/web/src/lib/components/profile/profileActivityChart.ts
+++ b/web/src/lib/components/profile/profileActivityChart.ts
@@ -27,7 +27,8 @@ export interface ActivityChartLayout {
 	segments: Record<ActivityMetric, ActivityChartSegment[]>;
 }
 
-const MIN_WIDTH = 988;
+const DESIGN_WIDTH = 988;
+const MIN_WIDTH = 720;
 const HEIGHT = 256;
 const PLOT_TOP = 20;
 const PLOT_BOTTOM = 196;
@@ -88,7 +89,7 @@ export const layoutActivityChart = (
 	availableWidth: number
 ): ActivityChartLayout => {
 	const width = Math.max(MIN_WIDTH, availableWidth);
-	const scale = width / MIN_WIDTH;
+	const scale = width / DESIGN_WIDTH;
 	const columns: ActivityChartColumn[] = [];
 	let left = 0;
 	for (const [index, weight] of COLUMN_WEIGHTS.entries()) {