/**
 * ============================================================
 * COMMISSARYOS THEME ENGINE — TOKEN PALETTE (css/theme.css)
 * ============================================================
 * Bootstrap/WordPress-style theming: every component references these semantic
 * tokens instead of hard-coded hex. Change a token (or switch html[data-theme])
 * and the entire platform re-skins. Active theme is applied by js/theme-engine.js.
 *
 * Presets:
 *   dark_slate     (default dark SaaS)
 *   clean_light    (light kitchen line)
 *   high_contrast  (outdoor sunlight / accessibility)
 * ============================================================
 */
:root,
html[data-theme="dark_slate"] {
    /* surfaces */
    --bg-base: #090d16;
    --bg-deep: #060913;
    --bg-card: #0f172a;
    --bg-panel: #1e293b;
    --bg-input: #0f172a;
    --bg-inset: #020617;
    /* borders */
    --border: #334155;
    --border-strong: #475569;
    /* text */
    --text-main: #f8fafc;
    --text-subtle: #cbd5e1;
    --text-muted: #94a3b8;
    --text-faint: #64748b;
    /* accents */
    --accent: #38bdf8;
    --accent-2: #6366f1;
    --accent-indigo: #818cf8;
    --accent-blue: #0284c7;
    --accent-teal: #0d9488;
    --accent-emerald: #34d399;
    --accent-purple: #a78bfa;
    --accent-violet: #a855f7;
    /* semantic */
    --success: #22c55e;
    --success-light: #4ade80;
    --danger: #ef4444;
    --danger-light: #f87171;
    --warning: #f59e0b;
    --warning-light: #fbbf24;
    /* ---- status surfaces (badges / banners / alerts) ---- */
    --danger-bg: #7f1d1d;
    --danger-bg-strong: #991b1b;
    --danger-bg-deep: #450a0a;
    --danger-fg: #fca5a5;
    --danger-fg-soft: #fecaca;
    --success-bg: #064e3b;
    --success-bg-strong: #065f46;
    --success-fg: #a7f3d0;
    --success-fg-soft: #86efac;
    --success-accent: #10b981;
    --warning-bg: #78350f;
    --warning-bg-deep: #451a03;
    --warning-fg: #fde68a;
    --warning-fg-strong: #fde047;
    --warning-fg-soft: #fef3c7;
    --warning-accent: #eab308;
    --info-bg: #0c4a6e;
    --info-bg-strong: #1e3a8a;
    --info-fg: #7dd3fc;
    --info-fg-soft: #e0f2fe;
    --info-accent: #2563eb;
    --info-accent-light: #3b82f6;
    --info-accent-deep: #1d4ed8;
    --text-on-accent: #ffffff;
    /* Text on a BRIGHT fill (amber/green/lime controls): stays dark ink in every preset,
       because those accent fills are bright in every preset. */
    --text-on-bright: #04121f;
    /* ---- extended accents ---- */
    --accent-cyan: #06b6d4;
    --accent-teal-light: #2dd4bf;
    --accent-indigo-light: #a5b4fc;
    --accent-purple-light: #c084fc;
    --accent-rose: #e11d48;
    /* ---- neutral surfaces ---- */
    --bg-elevated: #111827;
    --bg-sunken: #060910;
    --border-subtle: #374151;
    --text-dim: #9ca3af;
    /* ---- rgb triplets: rgba() tints/shadows that MUST follow the theme ---- */
    --rgb-black: 0 0 0;
    --rgb-white: 255 255 255;
    --rgb-base: 9 13 22;
    --rgb-deep: 6 9 19;
    --rgb-inset: 2 6 23;
    --rgb-card: 15 23 42;
    --rgb-panel: 30 41 59;
    --rgb-border: 51 65 85;
    --rgb-accent: 56 189 248;
    --rgb-accent-2: 99 102 241;
    --rgb-accent-blue: 2 132 199;
    --rgb-accent-teal: 13 148 136;
    --rgb-accent-purple: 167 139 250;
    --rgb-accent-violet: 168 85 247;
    --rgb-success: 34 197 94;
    --rgb-success-accent: 16 185 129;
    --rgb-danger: 239 68 68;
    --rgb-danger-light: 248 113 113;
    --rgb-warning: 245 158 11;
    --rgb-warning-light: 251 191 36;
    --rgb-info-accent: 37 99 235;
    --rgb-text-muted: 148 163 184;
    --rgb-border-strong: 71 85 105;
    --rgb-accent-cyan: 6 182 212;
    --bg-hover: #243247;
    --bg-hover-strong: #2d3d54;
}

html[data-theme="clean_light"] {
    --bg-base: #f1f5f9;
    --bg-deep: #e2e8f0;
    --bg-card: #ffffff;
    --bg-panel: #f8fafc;
    --bg-input: #ffffff;
    --bg-inset: #f8fafc;
    --border: #e2e8f0;
    --border-strong: #cbd5e1;
    --text-main: #0f172a;
    --text-subtle: #334155;
    --text-muted: #475569;
    --text-faint: #64748b;
    --accent: #0284c7;
    --accent-2: #4f46e5;
    --accent-indigo: #6366f1;
    --accent-blue: #0369a1;
    --accent-teal: #0f766e;
    --accent-emerald: #059669;
    --accent-purple: #7c3aed;
    --accent-violet: #9333ea;
    --success: #16a34a;
    --success-light: #22c55e;
    --danger: #dc2626;
    --danger-light: #ef4444;
    --warning: #b45309;
    --warning-light: #b45309;
    /* status surfaces — light equivalents (light tint bg + saturated text) */
    --danger-bg: #fee2e2;  --danger-bg-strong: #fecaca;  --danger-bg-deep: #fef2f2;
    --danger-fg: #b91c1c;  --danger-fg-soft: #991b1b;
    --success-bg: #dcfce7; --success-bg-strong: #bbf7d0; --success-fg: #15803d; --success-fg-soft: #166534;
    --success-accent: #059669;
    --warning-bg: #fef3c7; --warning-bg-deep: #fffbeb;  --warning-fg: #92400e; --warning-fg-strong: #78350f; --warning-fg-soft: #a16207;
    --warning-accent: #b45309;
    --info-bg: #e0f2fe;    --info-bg-strong: #dbeafe;   --info-fg: #0369a1; --info-fg-soft: #075985;
    --info-accent: #2563eb; --info-accent-light: #3b82f6; --info-accent-deep: #1d4ed8;
    --text-on-accent: #ffffff; --text-on-bright: #04121f;
    --accent-cyan: #0891b2; --accent-teal-light: #0d9488; --accent-indigo-light: #6366f1;
    --accent-purple-light: #7c3aed; --accent-rose: #be123c;
    --bg-elevated: #ffffff; --bg-sunken: #e2e8f0; --border-subtle: #e2e8f0; --text-dim: #6b7280;
    /* rgb triplets — surfaces flip, and "white" becomes INK so white tints/text read correctly */
    --rgb-black: 0 0 0;
    --rgb-white: 15 23 42;
    --rgb-base: 241 245 249;
    --rgb-deep: 226 232 240;
    --rgb-inset: 248 250 252;
    --rgb-card: 255 255 255;
    --rgb-panel: 241 245 249;
    --rgb-border: 203 213 225;
    --rgb-accent: 2 132 199;
    --rgb-accent-2: 79 70 229;
    --rgb-accent-blue: 3 105 161;
    --rgb-accent-teal: 15 118 110;
    --rgb-accent-purple: 124 58 237;
    --rgb-accent-violet: 147 51 234;
    --rgb-success: 22 163 74;
    --rgb-success-accent: 5 150 105;
    --rgb-danger: 220 38 38;
    --rgb-danger-light: 239 68 68;
    --rgb-warning: 180 83 9;
    --rgb-warning-light: 180 83 9;
    --rgb-info-accent: 37 99 235;
    --rgb-text-muted: 100 116 139;
    --rgb-border-strong: 203 213 225;
    --rgb-accent-cyan: 8 145 178;
    --bg-hover: #e2e8f0;
    --bg-hover-strong: #cbd5e1;
}

html[data-theme="high_contrast"] {
    --bg-base: #000000;
    --bg-deep: #000000;
    --bg-card: #101010;
    --bg-panel: #181818;
    --bg-input: #101010;
    --bg-inset: #000000;
    --border: #ffffff;
    --border-strong: #ffffff;
    --text-main: #ffffff;
    --text-subtle: #ffffff;
    --text-muted: #e5e5e5;
    --text-faint: #cccccc;
    --accent: #ffff00;
    --accent-2: #00ffff;
    --accent-indigo: #00ffff;
    --accent-blue: #00ffff;
    --accent-teal: #00ff88;
    --accent-emerald: #55ff55;
    --accent-purple: #ff88ff;
    --accent-violet: #ff88ff;
    --success: #55ff55;
    --success-light: #88ff88;
    --danger: #ff5555;
    --danger-light: #ff8888;
    --warning: #ffaa00;
    --warning-light: #ffcc00;
    /* status surfaces — high contrast (black fill + bright text) */
    --danger-bg: #000000;  --danger-bg-strong: #000000;  --danger-bg-deep: #000000;
    --danger-fg: #ff8888;  --danger-fg-soft: #ff5555;
    --success-bg: #000000; --success-bg-strong: #000000; --success-fg: #88ff88; --success-fg-soft: #55ff55;
    --success-accent: #55ff55;
    --warning-bg: #000000; --warning-bg-deep: #000000;  --warning-fg: #ffcc00; --warning-fg-strong: #ffff00; --warning-fg-soft: #ffaa00;
    --warning-accent: #ffcc00;
    --info-bg: #000000;    --info-bg-strong: #000000;   --info-fg: #00ffff; --info-fg-soft: #00ffff;
    --info-accent: #00ffff; --info-accent-light: #00ffff; --info-accent-deep: #00ffff;
    --text-on-accent: #000000; --text-on-bright: #000000;
    --accent-cyan: #00ffff; --accent-teal-light: #00ff88; --accent-indigo-light: #00ffff;
    --accent-purple-light: #ff88ff; --accent-rose: #ff5555;
    --bg-elevated: #181818; --bg-sunken: #000000; --border-subtle: #ffffff; --text-dim: #e5e5e5;
    /* rgb triplets — high contrast */
    --rgb-black: 0 0 0;
    --rgb-white: 255 255 255;
    --rgb-base: 0 0 0;
    --rgb-deep: 0 0 0;
    --rgb-inset: 0 0 0;
    --rgb-card: 16 16 16;
    --rgb-panel: 24 24 24;
    --rgb-border: 255 255 255;
    --rgb-accent: 255 255 0;
    --rgb-accent-2: 0 255 255;
    --rgb-accent-blue: 0 255 255;
    --rgb-accent-teal: 0 255 136;
    --rgb-accent-purple: 255 136 255;
    --rgb-accent-violet: 255 136 255;
    --rgb-success: 85 255 85;
    --rgb-success-accent: 85 255 85;
    --rgb-danger: 255 85 85;
    --rgb-danger-light: 255 136 136;
    --rgb-warning: 255 170 0;
    --rgb-warning-light: 255 204 0;
    --rgb-info-accent: 0 255 255;
    --rgb-text-muted: 229 229 229;
    --rgb-border-strong: 255 255 255;
    --rgb-accent-cyan: 0 255 255;
    --bg-hover: #333333;
    --bg-hover-strong: #444444;
}

/* ============================================================
   AMBER SMOKEHOUSE — warm rustic BBQ pit / woodsmoke aesthetic
   (Phase 6.3 preset #4)
   ============================================================ */
html[data-theme="amber_smokehouse"] {
    /* surfaces */
    --bg-base: #140d09;
    --bg-deep: #0d0806;
    --bg-card: #1f1510;
    --bg-panel: #2b1d15;
    --bg-input: #1f1510;
    --bg-inset: #120b08;
    --bg-elevated: #241811;
    --bg-sunken: #0d0806;
    /* borders */
    --border: #4a3324;
    --border-strong: #6b4a33;
    --border-subtle: #3a281c;
    /* text */
    --text-main: #fdf6ee;
    --text-subtle: #e7d5c3;
    --text-muted: #c4a68d;
    --text-faint: #9c7d63;
    --text-dim: #b3987d;
    /* accents */
    --accent: #f59e0b;
    --accent-2: #ea580c;
    --accent-indigo: #fb923c;
    --accent-blue: #c2410c;
    --accent-teal: #0d9488;
    --accent-emerald: #84cc16;
    --accent-purple: #d8b4fe;
    --accent-violet: #c084fc;
    --accent-cyan: #22d3ee;
    --accent-teal-light: #2dd4bf;
    --accent-indigo-light: #fdba74;
    --accent-purple-light: #e9d5ff;
    --accent-rose: #fb7185;
    /* semantic */
    --success: #22c55e;
    --success-light: #4ade80;
    --danger: #ef4444;
    --danger-light: #f87171;
    --warning: #f59e0b;
    --warning-light: #fbbf24;
    /* status surfaces */
    --danger-bg: #7f1d1d;   --danger-bg-strong: #991b1b;  --danger-bg-deep: #450a0a;
    --danger-fg: #fca5a5;   --danger-fg-soft: #fecaca;
    --success-bg: #064e3b;  --success-bg-strong: #065f46; --success-fg: #a7f3d0; --success-fg-soft: #86efac;
    --success-accent: #10b981;
    --warning-bg: #78350f;  --warning-bg-deep: #451a03;   --warning-fg: #fde68a;  --warning-fg-strong: #fde047; --warning-fg-soft: #fcd34d;
    --warning-accent: #f59e0b;
    --info-bg: #0c4a6e;     --info-bg-strong: #075985;    --info-fg: #7dd3fc;     --info-fg-soft: #bae6fd;
    --info-accent: #ea580c; --info-accent-light: #fb923c; --info-accent-deep: #c2410c;
    --text-on-accent: #ffffff;
    --text-on-bright: #04121f;
    --bg-hover: #3a281c;
    --bg-hover-strong: #4a3324;
    /* rgb triplets: rgba() tints must follow the theme */
    --rgb-black: 0 0 0;
    --rgb-white: 255 255 255;
    --rgb-base: 20 13 9;
    --rgb-deep: 13 8 6;
    --rgb-inset: 18 11 8;
    --rgb-card: 31 21 16;
    --rgb-panel: 43 29 21;
    --rgb-border: 74 51 36;
    --rgb-accent: 245 158 11;
    --rgb-accent-2: 234 88 12;
    --rgb-accent-blue: 194 65 12;
    --rgb-accent-teal: 13 148 136;
    --rgb-accent-purple: 216 180 254;
    --rgb-accent-violet: 192 132 252;
    --rgb-accent-cyan: 34 211 238;
    --rgb-success: 34 197 94;
    --rgb-success-accent: 16 185 129;
    --rgb-danger: 239 68 68;
    --rgb-danger-light: 248 113 113;
    --rgb-warning: 245 158 11;
    --rgb-warning-light: 251 191 36;
    --rgb-info-accent: 234 88 12;
    --rgb-text-muted: 196 166 141;
    --rgb-border-strong: 107 74 51;
}

/* ============================================================
   EMERALD COMMISSARY — fresh organic green commercial palette
   (Phase 6.3 preset #5)
   ============================================================ */
html[data-theme="emerald_commissary"] {
    /* surfaces */
    --bg-base: #f2f7f4;
    --bg-deep: #e3ece7;
    --bg-card: #ffffff;
    --bg-panel: #f4faf6;
    --bg-input: #ffffff;
    --bg-inset: #f7fbf9;
    --bg-elevated: #ffffff;
    --bg-sunken: #e3ece7;
    /* borders */
    --border: #c8ded2;
    --border-strong: #a7c9b5;
    --border-subtle: #dfeee6;
    /* text */
    --text-main: #0d2b1c;
    --text-subtle: #24402f;
    --text-muted: #4a6355;
    --text-faint: #6b8274;
    --text-dim: #40584a;
    /* accents */
    --accent: #059669;
    --accent-2: #0f766e;
    --accent-indigo: #14b8a6;
    --accent-blue: #047857;
    --accent-teal: #0f766e;
    --accent-emerald: #059669;
    --accent-purple: #7c3aed;
    --accent-violet: #9333ea;
    --accent-cyan: #0891b2;
    --accent-teal-light: #0d9488;
    --accent-indigo-light: #14b8a6;
    --accent-purple-light: #7c3aed;
    --accent-rose: #be123c;
    /* semantic */
    --success: #16a34a;
    --success-light: #22c55e;
    --danger: #dc2626;
    --danger-light: #ef4444;
    --warning: #b45309;
    --warning-light: #b45309;
    /* status surfaces */
    --danger-bg: #fee2e2;   --danger-bg-strong: #fecaca;  --danger-bg-deep: #fef2f2;
    --danger-fg: #b91c1c;   --danger-fg-soft: #991b1b;
    --success-bg: #dcfce7;  --success-bg-strong: #bbf7d0; --success-fg: #15803d; --success-fg-soft: #166534;
    --success-accent: #059669;
    --warning-bg: #fef3c7;  --warning-bg-deep: #fffbeb;   --warning-fg: #92400e;  --warning-fg-strong: #78350f; --warning-fg-soft: #a16207;
    --warning-accent: #b45309;
    --info-bg: #cffafe;     --info-bg-strong: #a5f3fc;    --info-fg: #0e7490;     --info-fg-soft: #155e75;
    --info-accent: #0891b2; --info-accent-light: #06b6d4; --info-accent-deep: #0e7490;
    --text-on-accent: #ffffff;
    --text-on-bright: #04121f;
    --bg-hover: #dfeee6;
    --bg-hover-strong: #c8ded2;
    /* rgb triplets: rgba() tints must follow the theme */
    --rgb-black: 0 0 0;
    --rgb-white: 13 43 28;
    --rgb-base: 242 247 244;
    --rgb-deep: 227 236 231;
    --rgb-inset: 247 251 249;
    --rgb-card: 255 255 255;
    --rgb-panel: 244 250 246;
    --rgb-border: 200 222 210;
    --rgb-accent: 5 150 105;
    --rgb-accent-2: 15 118 110;
    --rgb-accent-blue: 4 120 87;
    --rgb-accent-teal: 15 118 110;
    --rgb-accent-purple: 124 58 237;
    --rgb-accent-violet: 147 51 234;
    --rgb-accent-cyan: 8 145 178;
    --rgb-success: 22 163 74;
    --rgb-success-accent: 5 150 105;
    --rgb-danger: 220 38 38;
    --rgb-danger-light: 239 68 68;
    --rgb-warning: 180 83 9;
    --rgb-warning-light: 180 83 9;
    --rgb-info-accent: 8 145 178;
    --rgb-text-muted: 74 99 85;
    --rgb-border-strong: 167 201 181;
}

/* ==========================================================================
   PRESET: wok_dark — "Wok Dark (P.F. Chang's)"      reference: plan §2
   Sampled from examples/3d9980f1-…jpg (photo-derived; see plan §1.4 / §8.1).
   NOTE: --rgb-* triplets MUST move with their colour (rgba() tints rely on them).
   ========================================================================== */
html[data-theme="wok_dark"] {
    /* surfaces — near-black and NEUTRAL (not charcoal) */
    --bg-base: #0a0a0a;
    --bg-deep: #050505;
    --bg-card: #121212;
    --bg-panel: #1a1a1a;
    --bg-input: #121212;
    --bg-inset: #000000;
    --bg-elevated: #141414;
    --bg-sunken: #050505;
    --bg-hover: #202020;
    --bg-hover-strong: #2a2a2a;
    /* borders */
    --border: #2b2b2b;
    --border-subtle: #232323;
    --border-strong: #3a3a3a;
    /* text */
    --text-main: #ffffff;
    --text-subtle: #d6d6d6;
    --text-muted: #9aa0a6;
    --text-dim: #7d838a;
    --text-faint: #5f656b;
    /* accents */
    --accent: #8f1f33;
    --accent-2: #b01f3d;
    --accent-indigo: #4f46e5;
    --accent-blue: #2f6fd0;
    --accent-teal: #0f766e;
    --accent-emerald: #34d399;
    --accent-purple: #7c3aed;
    --accent-violet: #5b31c9;
    --accent-cyan: #21b6d4;
    --accent-teal-light: #2dd4bf;
    --accent-indigo-light: #a5b4fc;
    --accent-purple-light: #b39dff;
    --accent-rose: #e6007e;
    /* semantic */
    --success: #22c55e;
    --success-light: #4ade80;
    --danger: #b3122e;
    --danger-light: #e03553;
    --warning: #f5a623;
    --warning-light: #ffd479;
    /* status surfaces */
    --danger-bg: #7d1024;
    --danger-bg-strong: #961630;
    --danger-bg-deep: #3d0713;
    --danger-fg: #ffd7dd;
    --danger-fg-soft: #ffb3bf;
    --success-bg: #064e3b;
    --success-bg-strong: #065f46;
    --success-fg: #a7f3d0;
    --success-fg-soft: #86efac;
    --success-accent: #10b981;
    --warning-bg: #4a2c05;
    --warning-bg-deep: #2b1a02;
    --warning-fg: #ffd479;
    --warning-fg-strong: #ffe08a;
    --warning-fg-soft: #ffeda8;
    --warning-accent: #f5a623;
    --info-bg: #062b36;
    --info-bg-strong: #0a4054;
    --info-fg: #7de3f2;
    --info-fg-soft: #d0f6fc;
    --info-accent: #21b6d4;
    --info-accent-light: #21b6d4;
    --info-accent-deep: #178aa3;
    --text-on-accent: #ffffff;
    --text-on-bright: #06121f;
    /* rgb triplets — must follow the colours above */
    --rgb-black: 0 0 0;
    --rgb-white: 255 255 255;
    --rgb-base: 10 10 10;
    --rgb-deep: 5 5 5;
    --rgb-inset: 0 0 0;
    --rgb-card: 18 18 18;
    --rgb-panel: 26 26 26;
    --rgb-border: 43 43 43;
    --rgb-accent: 143 31 51;
    --rgb-accent-2: 176 31 61;
    --rgb-accent-blue: 47 111 208;
    --rgb-accent-teal: 15 118 110;
    --rgb-accent-purple: 124 58 237;
    --rgb-accent-violet: 91 49 201;
    --rgb-accent-cyan: 33 182 212;
    --rgb-success: 34 197 94;
    --rgb-success-accent: 16 185 129;
    --rgb-danger: 179 18 46;
    --rgb-danger-light: 224 53 83;
    --rgb-warning: 245 166 35;
    --rgb-warning-light: 255 212 121;
    --rgb-info-accent: 33 182 212;
    --rgb-text-muted: 154 160 166;
    --rgb-border-strong: 58 58 58;
}

/* ==========================================================================
   PRESET: roadhouse_bright — "Roadhouse Bright (Texas Roadhouse)"  plan §3
   Sampled from examples/572b335d-…jpg + 51f46c9d-…jpg (see plan §1.4 / §8.1).
   LIGHT preset: bright fills pair with DARK ink (--text-on-bright), never white.
   ========================================================================== */
html[data-theme="roadhouse_bright"] {
    /* surfaces — icy blue backdrop, bright "paper" cards */
    --bg-base: #bcd7f2;
    --bg-deep: #b9d3ef;
    --bg-card: #e2edfa;
    --bg-panel: #cfe0f5;
    --bg-input: #eef4fc;
    --bg-inset: #a9c7e8;
    --bg-elevated: #eef4fc;
    --bg-sunken: #a9c7e8;
    --bg-hover: #d6e5f7;
    --bg-hover-strong: #c2d8f0;
    /* borders */
    --border: #6f9ed0;
    --border-subtle: #a9c7e8;
    --border-strong: #4a7ab5;
    /* text — dark navy ink */
    --text-main: #0d1b2e;
    --text-subtle: #1c3350;
    --text-muted: #3f5b80;
    --text-dim: #5b7799;
    --text-faint: #7f97b5;
    /* accents */
    --accent: #1522e0;
    --accent-2: #7a3fd4;
    --accent-indigo: #3b5bdb;
    --accent-blue: #1522e0;
    --accent-teal: #0f766e;
    --accent-emerald: #059669;
    --accent-purple: #7a3fd4;
    --accent-violet: #7a3fd4;
    --accent-cyan: #0891b2;
    --accent-teal-light: #14b8a6;
    --accent-indigo-light: #748ffc;
    --accent-purple-light: #b197fc;
    --accent-rose: #e01b24;
    /* semantic */
    --success: #1f9d3f;
    --success-light: #22c55e;
    --danger: #e01b24;
    --danger-light: #f0525a;
    --warning: #855700;
    --warning-light: #855700;
    /* status surfaces — light tints with dark ink */
    --danger-bg: #fddfe1;
    --danger-bg-strong: #fbc9cd;
    --danger-bg-deep: #fff1f2;
    --danger-fg: #a1121a;
    --danger-fg-soft: #7a0d13;
    --success-bg: #dcfce7;
    --success-bg-strong: #bbf7d0;
    --success-fg: #15803d;
    --success-fg-soft: #166534;
    --success-accent: #1f9d3f;
    --warning-bg: #fff6c9;
    --warning-bg-deep: #fffbeb;
    --warning-fg: #5a4600;
    --warning-fg-strong: #3f3300;
    --warning-fg-soft: #6b5600;
    --warning-accent: #855700;
    --info-bg: #dbeafe;
    --info-bg-strong: #c7dcfd;
    --info-fg: #10265f;
    --info-fg-soft: #1e3a8a;
    --info-accent: #1522e0;
    --info-accent-light: #3b5bdb;
    --info-accent-deep: #0f1a9e;
    --text-on-accent: #ffffff;
    --text-on-bright: #06121f;
    /* rgb triplets — must follow the colours above */
    --rgb-black: 0 0 0;
    --rgb-white: 13 27 46;
    --rgb-base: 188 215 242;
    --rgb-deep: 185 211 239;
    --rgb-inset: 169 199 232;
    --rgb-card: 226 237 250;
    --rgb-panel: 207 224 245;
    --rgb-border: 111 158 208;
    --rgb-accent: 21 34 224;
    --rgb-accent-2: 122 63 212;
    --rgb-accent-blue: 21 34 224;
    --rgb-accent-teal: 15 118 110;
    --rgb-accent-purple: 122 63 212;
    --rgb-accent-violet: 122 63 212;
    --rgb-accent-cyan: 8 145 178;
    --rgb-success: 31 157 63;
    --rgb-success-accent: 31 157 63;
    --rgb-danger: 224 27 36;
    --rgb-danger-light: 240 82 90;
    --rgb-warning: 133 87 0;
    --rgb-warning-light: 133 87 0;
    --rgb-info-accent: 21 34 224;
    --rgb-text-muted: 63 91 128;
    --rgb-border-strong: 74 122 181;
}

html[data-theme="dreamspos_light"] {
    --bg-base: #f8fafc;
    --bg-deep: #f1f5f9;
    --bg-card: #ffffff;
    --bg-panel: #ffffff;
    --bg-input: #ffffff;
    --bg-inset: #f1f5f9;
    --border: #e2e8f0;
    --border-strong: #cbd5e1;
    --text-main: #1f2937;
    --text-subtle: #4b5563;
    --text-muted: #6b7280;
    --text-faint: #9ca3af;
    --accent: #fe9f43;
    --accent-2: #fe9f43;
    --accent-indigo: #6366f1;
    --accent-blue: #fe9f43;
    --accent-teal: #009688;
    --accent-emerald: #00b894;
    --accent-purple: #6c5ce7;
    --accent-violet: #a855f7;
    --success: #10b981;
    --success-light: #34d399;
    --danger: #ef4444;
    --danger-light: #f87171;
    --warning: #b45309;
    --warning-light: #b45309;
    --danger-bg: #fee2e2;  --danger-bg-strong: #fecaca;  --danger-bg-deep: #fef2f2;
    --danger-fg: #b91c1c;  --danger-fg-soft: #991b1b;
    --success-bg: #dcfce7; --success-bg-strong: #bbf7d0; --success-fg: #15803d; --success-fg-soft: #166534;
    --success-accent: #10b981;
    --warning-bg: #fef3c7; --warning-bg-deep: #fffbeb;  --warning-fg: #92400e; --warning-fg-strong: #78350f; --warning-fg-soft: #a16207;
    --warning-accent: #b45309;
    --info-bg: #e0f2fe;    --info-bg-strong: #dbeafe;   --info-fg: #0369a1; --info-fg-soft: #075985;
    --info-accent: #fe9f43; --info-accent-light: #fe9f43; --info-accent-deep: #e8862a;
    --text-on-accent: #1a1207; --text-on-bright: #04121f;
    --accent-cyan: #06b6d4; --accent-teal-light: #2dd4bf; --accent-indigo-light: #a5b4fc;
    --accent-purple-light: #c084fc; --accent-rose: #e11d48;
    --bg-elevated: #ffffff; --bg-sunken: #f1f5f9; --border-subtle: #f1f5f9; --text-dim: #9ca3af;
    --rgb-black: 0 0 0;
    --rgb-white: 31 41 55;
    --rgb-base: 248 250 252;
    --rgb-deep: 241 245 249;
    --rgb-inset: 241 245 249;
    --rgb-card: 255 255 255;
    --rgb-panel: 255 255 255;
    --rgb-border: 226 232 240;
    --rgb-accent: 254 159 67;
    --rgb-accent-2: 254 159 67;
    --rgb-accent-blue: 254 159 67;
    --rgb-accent-teal: 0 150 136;
    --rgb-accent-purple: 108 92 231;
    --rgb-accent-violet: 168 85 247;
    --rgb-success: 16 185 129;
    --rgb-success-accent: 16 185 129;
    --rgb-danger: 239 68 68;
    --rgb-danger-light: 248 113 113;
    --rgb-warning: 180 83 9;
    --rgb-warning-light: 180 83 9;
    --rgb-info-accent: 254 159 67;
    --rgb-text-muted: 107 114 128;
    --rgb-border-strong: 203 213 225;
    --rgb-accent-cyan: 6 182 212;
    --bg-hover: #f1f5f9;
    --bg-hover-strong: #e2e8f0;
}

html[data-theme="dreamspos_dark"] {
    --bg-base: #121212;
    --bg-deep: #0a0a0a;
    --bg-card: #1e1e1e;
    --bg-panel: #242424;
    --bg-input: #1e1e1e;
    --bg-inset: #0d0d0d;
    --border: #333333;
    --border-strong: #444444;
    --text-main: #f8fafc;
    --text-subtle: #cbd5e1;
    --text-muted: #94a3b8;
    --text-faint: #64748b;
    --accent: #fe9f43;
    --accent-2: #fe9f43;
    --accent-indigo: #818cf8;
    --accent-blue: #fe9f43;
    --accent-teal: #009688;
    --accent-emerald: #00b894;
    --accent-purple: #6c5ce7;
    --accent-violet: #a855f7;
    --success: #10b981;
    --success-light: #34d399;
    --danger: #ef4444;
    --danger-light: #f87171;
    --warning: #f59e0b;
    --warning-light: #fbbf24;
    --danger-bg: #7f1d1d;  --danger-bg-strong: #991b1b;  --danger-bg-deep: #450a0a;
    --danger-fg: #fca5a5;  --danger-fg-soft: #fecaca;
    --success-bg: #064e3b; --success-bg-strong: #065f46; --success-fg: #a7f3d0; --success-fg-soft: #86efac;
    --success-accent: #10b981;
    --warning-bg: #78350f; --warning-bg-deep: #451a03;  --warning-fg: #fde68a; --warning-fg-strong: #fde047; --warning-fg-soft: #fef3c7;
    --warning-accent: #eab308;
    --info-bg: #0c4a6e;    --info-bg-strong: #1e3a8a;   --info-fg: #7dd3fc; --info-fg-soft: #e0f2fe;
    --info-accent: #fe9f43; --info-accent-light: #fe9f43; --info-accent-deep: #e8862a;
    --text-on-accent: #1a1207; --text-on-bright: #04121f;
    --accent-cyan: #06b6d4; --accent-teal-light: #2dd4bf; --accent-indigo-light: #a5b4fc;
    --accent-purple-light: #c084fc; --accent-rose: #e11d48;
    --bg-elevated: #282828; --bg-sunken: #0a0a0a; --border-subtle: #262626; --text-dim: #9ca3af;
    --rgb-black: 0 0 0;
    --rgb-white: 255 255 255;
    --rgb-base: 18 18 18;
    --rgb-deep: 10 10 10;
    --rgb-inset: 13 13 13;
    --rgb-card: 30 30 30;
    --rgb-panel: 36 36 36;
    --rgb-border: 51 51 51;
    --rgb-accent: 254 159 67;
    --rgb-accent-2: 254 159 67;
    --rgb-accent-blue: 254 159 67;
    --rgb-accent-teal: 0 150 136;
    --rgb-accent-purple: 108 92 231;
    --rgb-accent-violet: 168 85 247;
    --rgb-success: 16 185 129;
    --rgb-success-accent: 16 185 129;
    --rgb-danger: 239 68 68;
    --rgb-danger-light: 248 113 113;
    --rgb-warning: 245 158 11;
    --rgb-warning-light: 251 191 36;
    --rgb-info-accent: 254 159 67;
    --rgb-text-muted: 148 163 184;
    --rgb-border-strong: 68 68 68;
    --rgb-accent-cyan: 6 182 212;
    --bg-hover: #2a2a2a;
    --bg-hover-strong: #333333;
}

/* ── Brand Logo Theme Adapters ── */
.batchcraft-station-logo {
    filter: invert(1) brightness(1.2);
    transition: filter 0.2s ease;
}
html[data-theme="clean_light"] .batchcraft-station-logo,
html[data-theme="emerald_commissary"] .batchcraft-station-logo,
html[data-theme="roadhouse_bright"] .batchcraft-station-logo,
html[data-theme="dreamspos_light"] .batchcraft-station-logo {
    filter: none;
}



/* ── White-label device / page background ────────────────────── */
/* Only emitted when themeBootAttrs() resolved an effective image. The tint keeps
   panels and text readable over photography while the image remains visible. */
html[data-app-background="1"] body {
    background-image:
        linear-gradient(
            rgb(var(--rgb-base, 9 13 22) / var(--app-background-overlay-alpha, 0.76)),
            rgb(var(--rgb-base, 9 13 22) / var(--app-background-overlay-alpha, 0.76))
        ),
        var(--app-brand-background) !important;
    background-size: cover, cover !important;
    background-position: center, center !important;
    background-repeat: no-repeat, no-repeat !important;
    background-attachment: fixed, fixed !important;
}