[feat](trx-frontend-http): mobile UI improvements

- Fix 5-tab bottom nav (grid was repeat(4) with 5 tabs; About overflowed)
- Add SVG icons to each tab; show icon+label on mobile bottom nav
- Swipe left/right to switch tabs (excludes jog wheel, spectrum canvas,
  map, scrollable containers and form inputs to avoid conflicts)
- Extract navigateToTab() helper used by both click and swipe handlers
- Collapse header subtitles at ≤640px to reclaim vertical space
- Bookmark table → 2-column card layout at ≤640px with ::before labels
- Audio volume labels switch to horizontal row layout at ≤520px;
  squelch slider now also spans full width
- Controls tray uses overflow-x: auto (not visible) at ≤760px so
  content wider than viewport scrolls rather than overflowing layout

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Signed-off-by: Stan Grams <sjg@haxx.space>

src/trx-client/trx-frontend/trx-frontend-http/assets/web/index.html

@@ -30,11 +30,26 @@
           </div>
         </div>
         <div class="tab-bar-nav">
-          <button class="tab active" data-tab="main">Main</button>
-          <button class="tab" data-tab="bookmarks">Bookmarks</button>
-          <button class="tab" data-tab="decoders">Decoders</button>
-          <button class="tab" data-tab="map">Map</button>
-          <button class="tab" data-tab="about">About</button>
+          <button class="tab active" data-tab="main">
+            <svg class="tab-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" aria-hidden="true"><path d="M8 14v-4"/><path d="M5 11a4 4 0 0 1 6 0"/><path d="M2.5 8.5a8 8 0 0 1 11 0"/></svg>
+            <span class="tab-label">Main</span>
+          </button>
+          <button class="tab" data-tab="bookmarks">
+            <svg class="tab-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 2h8v12l-4-2.5L4 14V2z"/></svg>
+            <span class="tab-label">Bookmarks</span>
+          </button>
+          <button class="tab" data-tab="decoders">
+            <svg class="tab-icon" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><rect x="1" y="11" width="2.5" height="4" rx="0.5"/><rect x="4.75" y="8" width="2.5" height="7" rx="0.5"/><rect x="8.5" y="5" width="2.5" height="10" rx="0.5"/><rect x="12.25" y="2" width="2.5" height="13" rx="0.5"/></svg>
+            <span class="tab-label">Decoders</span>
+          </button>
+          <button class="tab" data-tab="map">
+            <svg class="tab-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M8 2a4 4 0 0 1 4 4c0 3-4 8-4 8S4 9 4 6a4 4 0 0 1 4-4z"/><circle cx="8" cy="6" r="1.2" fill="currentColor" stroke="none"/></svg>
+            <span class="tab-label">Map</span>
+          </button>
+          <button class="tab" data-tab="about">
+            <svg class="tab-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" aria-hidden="true"><circle cx="8" cy="8" r="6"/><path d="M8 7v5"/><circle cx="8" cy="5" r="0.5" fill="currentColor" stroke="none"/></svg>
+            <span class="tab-label">About</span>
+          </button>
         </div>
       </div>
       <div class="top-bar-actions">