diff --git a/site/src/components/ActivityMap.svelte b/site/src/components/ActivityMap.svelte
index 1131959..d094210 100644
--- a/site/src/components/ActivityMap.svelte
+++ b/site/src/components/ActivityMap.svelte
@@ -72,12 +72,17 @@
     });
   });
 
-  // Fit to bbox when detail JSON loads (bbox is null at map init)
+  // Fit to bbox when detail JSON loads (bbox is null at map init).
+  // Always resize first so MapLibre knows the real container dimensions,
+  // and defer with rAF so the browser has finished laying out the container.
   $: if (map && bbox) {
-    const fit = () => map.fitBounds(
-      [[bbox![0], bbox![1]], [bbox![2], bbox![3]]],
-      { padding: 40, animate: true },
-    );
+    const fit = () => requestAnimationFrame(() => {
+      map.resize();
+      map.fitBounds(
+        [[bbox![0], bbox![1]], [bbox![2], bbox![3]]],
+        { padding: 40, animate: false },
+      );
+    });
     map.loaded() ? fit() : map.once('load', fit);
   }