Add mobile bottom-sheet layout

On narrow screens the sidebar collapses to a 48px handle strip at the
bottom of the screen. Tapping the handle slides the panel up to 65vh,
revealing the full stop list and controls. The map takes the full
viewport width when the panel is closed or peek-visible.

The handle label updates dynamically to show the loaded route name.
The panel auto-opens when a route or route_master finishes loading.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

web/templates/index.html

@@ -23,6 +23,15 @@
     <!-- Sidebar -->
     <div class="col-3 border-end" id="sidebar">
 
+      <!-- Mobile bottom-sheet handle (hidden on desktop) -->
+      <div id="sidebar-handle" class="d-flex d-md-none align-items-center gap-2 px-3">
+        <div id="sidebar-handle-pill"></div>
+        <span id="sidebar-handle-label" class="small text-muted">Controls &amp; stops</span>
+      </div>
+
+      <!-- Scrollable content area -->
+      <div id="sidebar-inner">
+
       <!-- Load form -->
       <form method="post" action="{{ url_for('load') }}" class="mb-3">
         <label class="form-label fw-semibold small">Relation ID or OSM URL</label>
@@ -111,6 +120,7 @@
         <div id="stop-list"></div>
       </div>
 
+      </div><!-- /sidebar-inner -->
     </div><!-- /sidebar -->
 
     <!-- Map -->