add responsive breakpoints: sidebar collapse, status bar compact, matchMedia listeners (#audit-P2)

src/App.jsx

@@ -7,6 +7,7 @@ import ModelBrowser from "./ModelBrowser.jsx";
 import MainMenu from "./MainMenu.jsx";
 import GlobalSettings from "./GlobalSettings.jsx";
 import GlobalEQ from "./GlobalEQ.jsx";
+import { T } from "./theme.js";
 
 // ── API Layer ──────────────────────────────────────────────────────
 const API_BASE = "";
@@ -44,23 +45,6 @@ const API = {
   tunerToggle:   (enabled)                       => api("POST", "/api/tuner", { enabled }),
 };
 
-// ── Design tokens ──────────────────────────────────────────────
-const T = {
-  bg: "#0A0A0C",
-  panel: "#141418",
-  surface: "#1C1C22",
-  border: "#2A2A32",
-  amber: "#E8A030",
-  amberDim: "#7A5218",
-  blue: "#4A8BC8",
-  blueDim: "#1E4060",
-  green: "#3AB87A",
-  red: "#E06060",
-  textPrimary: "#F0EDE6",
-  textSec: "#A0A0BC",
-  textDim: "#7878A0",
-};
-
 // ── Block parameter definitions ─────────────────────────────────
 const SPLIT_TYPES = [
   { value:'y', label:'Y — Split evenly', pan:true },