diff --git a/site/src/pages/AgentsPage/AgentChatPageView.stories.tsx b/site/src/pages/AgentsPage/AgentChatPageView.stories.tsx
index dee306b92e..2b1837bfd3 100644
--- a/site/src/pages/AgentsPage/AgentChatPageView.stories.tsx
+++ b/site/src/pages/AgentsPage/AgentChatPageView.stories.tsx
@@ -474,6 +474,16 @@ const buildStoreWithMessages = (
 	return store;
 };
 
+const gapTestStore = createChatStore();
+gapTestStore.replaceMessages([
+	buildMessage(1, "user", "Explain the layout."),
+	buildMessage(2, "assistant", "Here is the explanation."),
+	buildMessage(3, "user", "Can you elaborate?"),
+]);
+gapTestStore.applyMessageParts([
+	{ type: "text", text: "Certainly, here are more details..." },
+]);
+
 // ---------------------------------------------------------------------------
 // Editing flow stories
 // ---------------------------------------------------------------------------
@@ -521,6 +531,26 @@ export const EditingSaving: Story = {
 	),
 };
 
+export const ConsistentGapBetweenTimelineAndStream: Story = {
+	render: () => <StoryAgentChatPageView store={gapTestStore} />,
+	play: async ({ canvasElement }) => {
+		const wrapper = canvasElement.querySelector(
+			'[data-testid="chat-timeline-wrapper"]',
+		);
+		expect(wrapper).not.toBeNull();
+
+		const outerGap = window.getComputedStyle(wrapper!).rowGap;
+		expect(outerGap).toBe("8px");
+
+		const timeline = wrapper!.querySelector(
+			'[data-testid="conversation-timeline"]',
+		);
+		expect(timeline).not.toBeNull();
+		const innerGap = window.getComputedStyle(timeline!).rowGap;
+		expect(innerGap).toBe("8px");
+	},
+};
+
 // ---------------------------------------------------------------------------
 // AgentChatPageNotFoundView stories
 // ---------------------------------------------------------------------------
diff --git a/site/src/pages/AgentsPage/components/ChatConversation/ConversationTimeline.tsx b/site/src/pages/AgentsPage/components/ChatConversation/ConversationTimeline.tsx
index 98c1367dbd..0db14d35dd 100644
--- a/site/src/pages/AgentsPage/components/ChatConversation/ConversationTimeline.tsx
+++ b/site/src/pages/AgentsPage/components/ChatConversation/ConversationTimeline.tsx
@@ -1041,7 +1041,7 @@ export const ConversationTimeline = memo<ConversationTimelineProps>(
 		}
 
 		return (
-			<div className="flex flex-col gap-2">
+			<div data-testid="conversation-timeline" className="flex flex-col gap-2">
 				{parsedMessages.map(({ message, parsed }, msgIdx) => {
 					if (message.role === "user") {
 						return (
diff --git a/site/src/pages/AgentsPage/components/ChatConversation/LiveStreamTail.tsx b/site/src/pages/AgentsPage/components/ChatConversation/LiveStreamTail.tsx
index b29a4a5f6c..f45a8d15b8 100644
--- a/site/src/pages/AgentsPage/components/ChatConversation/LiveStreamTail.tsx
+++ b/site/src/pages/AgentsPage/components/ChatConversation/LiveStreamTail.tsx
@@ -70,7 +70,7 @@ export const LiveStreamTailContent = ({
 	}
 
 	return (
-		<div className="flex flex-col gap-3">
+		<div className="flex flex-col gap-2">
 			{shouldRenderEmptyState && (
 				<div className="py-12 text-center text-content-secondary">
 					<p className="text-sm">Start a conversation with your agent.</p>
diff --git a/site/src/pages/AgentsPage/components/ChatPageContent.tsx b/site/src/pages/AgentsPage/components/ChatPageContent.tsx
index 760e647c5f..609961eec9 100644
--- a/site/src/pages/AgentsPage/components/ChatPageContent.tsx
+++ b/site/src/pages/AgentsPage/components/ChatPageContent.tsx
@@ -86,7 +86,10 @@ export const ChatPageTimeline: FC<ChatPageTimelineProps> = ({
 
 	return (
 		<Profiler id="AgentChat" onRender={onRenderProfiler}>
-			<div className="mx-auto flex w-full max-w-3xl flex-col gap-3 py-6">
+			<div
+				data-testid="chat-timeline-wrapper"
+				className="mx-auto flex w-full max-w-3xl flex-col gap-2 py-6"
+			>
 				{/* VNC sessions for completed agents may already be
 					   terminated, so inline desktop previews are disabled
 					   via showDesktopPreviews={false} to avoid a perpetual