Add region filter bar and navigation buttons for video clips

templates/index.html

@@ -29,6 +29,12 @@
 
     <!-- Main Layout: single column, centered -->
     <div class="layout">
+      <!-- Region filter bar -->
+      <nav class="region-bar" id="regionBar">
+        <span class="region-label">Region:</span>
+        <button class="region-btn active" data-region="">All</button>
+      </nav>
+
       <!-- Video Player -->
       <section class="player-panel">
         <div class="video-stage">
@@ -60,6 +66,21 @@
         </div>
         {% set phidden = 'hidden' if not default_url else '' %}
         <div class="now-playing" id="nowPlaying" {{phidden}}>
+          <button
+            class="nav-btn"
+            id="prevBtn"
+            title="Previous clip (←)"
+            aria-label="Previous clip"
+          >
+            <svg
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+            >
+              <polyline points="15 18 9 12 15 6" />
+            </svg>
+          </button>
           <span
             >Now Playing:
             <strong id="npName"
@@ -68,6 +89,22 @@
             ></span
           >
           <span class="ts" id="npTime">—</span>
+          <span class="loc" id="npLocation"></span>
+          <button
+            class="nav-btn"
+            id="nextBtn"
+            title="Next clip (→)"
+            aria-label="Next clip"
+          >
+            <svg
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+            >
+              <polyline points="9 18 15 12 9 6" />
+            </svg>
+          </button>
         </div>
       </section>