Frontend polish: loading states, CSS variables, focus indicators, scroll lock

- Add tab refresh loading bar animation for all 4 tab loaders
- Add profiles loading guard to prevent concurrent fetches
- Centralize theme colors into CSS variables (--text-secondary, --text-muted,
  --bg-secondary, --success-color, --shadow-color) for both dark/light themes
- Replace hardcoded gray values across 10 CSS files with variables
- Fix duplicate .btn-sm definition in modal.css
- Fix z-index: toast 2001→2500 to safely clear modals at 2000
- Add :focus-visible keyboard navigation indicators for all interactive elements
- Add responsive breakpoints for tab bar and header on narrow screens
- Prevent background page scroll when command palette is open

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

server/src/wled_controller/static/css/components.css

@@ -36,7 +36,7 @@
 }
 
 .info-label {
-    color: #999;
+    color: var(--text-secondary);
 }
 
 .info-value {
@@ -155,7 +155,7 @@
 label {
     display: block;
     margin-bottom: 5px;
-    color: #999;
+    color: var(--text-secondary);
     font-weight: 500;
 }
 
@@ -211,7 +211,7 @@ input:-webkit-autofill:focus {
 .loading {
     text-align: center;
     padding: 40px;
-    color: #999;
+    color: var(--text-secondary);
 }
 
 .loading-spinner {
@@ -325,8 +325,8 @@ input:-webkit-autofill:focus {
     font-size: 15px;
     opacity: 0;
     transition: opacity 0.3s, transform 0.3s;
-    z-index: 2001;
-    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
+    z-index: 2500;
+    box-shadow: 0 4px 20px var(--shadow-color);
     min-width: 300px;
     text-align: center;
 }
@@ -354,3 +354,35 @@ input:-webkit-autofill:focus {
 .toast.info {
     background: var(--info-color);
 }
+
+/* ── Focus-visible indicators for keyboard navigation ── */
+
+.btn:focus-visible,
+.btn-icon:focus-visible,
+.card-remove-btn:focus-visible,
+.card-autostart-btn:focus-visible,
+.card-power-btn:focus-visible,
+.card-tutorial-btn:focus-visible,
+.hint-toggle:focus-visible,
+.modal-close-btn:focus-visible,
+.modal-header-btn:focus-visible,
+.tab-btn:focus-visible,
+.stream-tab-btn:focus-visible,
+.search-toggle:focus-visible,
+.theme-toggle:focus-visible,
+.tutorial-trigger-btn:focus-visible,
+.tutorial-close-btn:focus-visible,
+.btn-expand-collapse:focus-visible,
+.btn-filter-action:focus-visible,
+.settings-toggle:focus-visible {
+    outline: 2px solid var(--primary-color);
+    outline-offset: 2px;
+}
+
+input:focus-visible,
+select:focus-visible,
+textarea:focus-visible {
+    outline: none;
+    border-color: var(--primary-color);
+    box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.2);
+}