diff --git a/web/static/app.js b/web/static/app.js
index 3953af5..7a53230 100644
--- a/web/static/app.js
+++ b/web/static/app.js
@@ -34,6 +34,14 @@ let selectedTo = null;       // stop name string or null
 
 function isMobile() { return window.innerWidth < 768; }
 
+/** fitBounds padding that accounts for the open panel covering the bottom of the map. */
+function fitPadding() {
+  if (!isMobile()) return { padding: [20, 20] };
+  // Panel is 65vh; leave 20px margin above it and normal padding elsewhere.
+  const panelH = Math.round(window.innerHeight * 0.65);
+  return { paddingTopLeft: [20, 20], paddingBottomRight: [20, panelH + 20] };
+}
+
 function openPanel() {
   document.getElementById('sidebar').classList.add('panel-open');
   const fab = document.getElementById('panel-fab');
@@ -397,7 +405,7 @@ async function loadRoute(relationId) {
       filter: f => f.geometry.type === 'LineString',
     }).addTo(map);
 
-    map.fitBounds(fullRouteLayer.getBounds(), { padding: [20, 20] });
+    map.fitBounds(fullRouteLayer.getBounds(), fitPadding());
 
     renderStopList();
     updateMarkers();
@@ -516,7 +524,7 @@ async function loadRouteMaster(relationId) {
     if (routeMasterLayers.length > 0) {
       let bounds = routeMasterLayers[0].getBounds();
       for (const l of routeMasterLayers.slice(1)) bounds = bounds.extend(l.getBounds());
-      map.fitBounds(bounds, { padding: [20, 20] });
+      map.fitBounds(bounds, fitPadding());
     }
   } catch (e) {
     showError('Network error loading route master.');