feat: UI/UX overhaul — CSS cleanup, accessibility, error handling, inline style extraction

Phase 0 — CSS-only fixes:
- Fix --font-mono to use real monospace stack (JetBrains Mono, Fira Code, etc.)
- Replace hardcoded hex colors with CSS variables across 16+ files
- Merge global-nav.css (507 lines) into layout.css, delete original
- Reduce !important in responsive.css from 71 to 8 via .app-shell specificity
- Standardize breakpoints to 480/768/1024/1280px

Phase 1 — Loading states & SSE connection feedback:
- Add centralized SSEManager (sse-manager.js) with exponential backoff
- Add SSE status indicator dot in nav bar
- Add withLoadingButton() + .btn-loading CSS spinner
- Add mode section crossfade transitions

Phase 2 — Accessibility:
- Add aria-labels to icon-only buttons across mode partials
- Add for/id associations to 42 form labels in 5 mode partials
- Add aria-live on toast stack, enableListKeyNav() utility

Phase 3 — Destructive action guards & list overflow:
- Add confirmAction() styled modal, replace all 25 native confirm() calls
- Add toast cap at 5 simultaneous toasts
- Add list overflow indicator CSS

Phase 4 — Inline style extraction:
- Refactor switchMode() in app.js and index.html to use classList.toggle()
- Add CSS toggle rules for all switchMode-controlled elements
- Remove inline style="display:none" from 7+ HTML elements
- Add utility classes (.hidden, .d-flex, .d-grid, etc.)

Phase 5 — Mobile UX polish:
- pre/code overflow handling already in place
- Touch target sizing via --touch-min variable

Phase 6 — Error handling consistency:
- Add reportActionableError() to user-facing catch blocks in 5 mode JS files
- 28 error toast additions alongside existing console.error calls

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

static/js/core/agents.js

@@ -485,7 +485,7 @@ async function syncLocalModeStates() {
  */
 function showAgentModeWarnings(runningModes, modesDetail = {}) {
     // SDR modes that can't run simultaneously on same device
-    const sdrModes = ['sensor', 'pager', 'adsb', 'ais', 'acars', 'vdl2', 'aprs', 'rtlamr', 'listening_post', 'tscm', 'dsc'];
+    const sdrModes = ['sensor', 'pager', 'adsb', 'ais', 'acars', 'vdl2', 'aprs', 'rtlamr', 'listening_post', 'tscm', 'dsc'];
     const runningSdrModes = runningModes.filter(m => sdrModes.includes(m));
 
     let warning = document.getElementById('agentModeWarning');
@@ -613,7 +613,7 @@ function checkAgentAudioMode(modeToStart) {
  * @param {string} modeToStart - Mode to start
  * @param {number} deviceToUse - Device index to use (optional, for smarter conflict detection)
  */
-function checkAgentModeConflict(modeToStart, deviceToUse = null) {
+async function checkAgentModeConflict(modeToStart, deviceToUse = null) {
     if (currentAgent === 'local') return true;  // No conflict checking for local
 
     // First check if this is an audio mode
@@ -621,7 +621,7 @@ function checkAgentModeConflict(modeToStart, deviceToUse = null) {
         return false;
     }
 
-    const sdrModes = ['sensor', 'pager', 'adsb', 'ais', 'acars', 'vdl2', 'aprs', 'rtlamr', 'listening_post', 'tscm', 'dsc'];
+    const sdrModes = ['sensor', 'pager', 'adsb', 'ais', 'acars', 'vdl2', 'aprs', 'rtlamr', 'listening_post', 'tscm', 'dsc'];
 
     // If we're trying to start an SDR mode
     if (sdrModes.includes(modeToStart)) {
@@ -648,11 +648,12 @@ function checkAgentModeConflict(modeToStart, deviceToUse = null) {
                 return detail ? `${m} (SDR ${detail.device})` : m;
             }).join(', ');
 
-            const proceed = confirm(
-                `The agent's SDR device is currently running: ${modeList}\n\n` +
-                `Starting ${modeToStart} on the same device will fail.\n\n` +
-                `Do you want to stop the conflicting mode(s) first?`
-            );
+            const proceed = await AppFeedback.confirmAction({
+                title: 'SDR Device Conflict',
+                message: `The agent's SDR device is currently running: ${modeList}. Starting ${modeToStart} on the same device will fail. Do you want to stop the conflicting mode(s) first?`,
+                confirmLabel: 'Stop & Continue',
+                confirmClass: 'btn-danger'
+            });
 
             if (proceed) {
                 // Stop conflicting modes