diff --git a/src/lib/components/chat/Overview/View.svelte b/src/lib/components/chat/Overview/View.svelte
index ddfb884056..edd0f48571 100644
--- a/src/lib/components/chat/Overview/View.svelte
+++ b/src/lib/components/chat/Overview/View.svelte
@@ -65,8 +65,11 @@
 	const drawFlow = async (direction: LayoutDirection) => {
 		const nodeList: Node[] = [];
 		const edgeList: Edge[] = [];
-		const levelOffset = direction === 'vertical' ? 150 : 300;
-		const siblingOffset = direction === 'vertical' ? 250 : 150;
+		const rootFontSize = parseFloat(getComputedStyle(document.documentElement).fontSize) || 16;
+		const nodeWidth = 15 * rootFontSize;
+		const nodeHeight = 5 * rootFontSize;
+		const levelOffset = direction === 'vertical' ? nodeHeight + 70 : nodeWidth + 60;
+		const siblingOffset = direction === 'vertical' ? nodeWidth + 60 : nodeHeight + 70;
 
 		// Map to keep track of node positions at each level
 		let positionMap = new Map<string, PositionMapEntry>();