:root, [data-theme="Light"] {
    --canvas:#e9edf2; --surface:#ffffff; --surface-2:#fbfcfe; --bg-2:#f6f8fb; --bg-3:#f1f5f9; --hover:#faf8ff;
    --border:#e4e8ef; --border-soft:#eef1f6; --border-strong:#cfd7e3; --line:#cbd5e1;
    --text:#111827; --text-2:#273142; --text-3:#475569; --muted:#7a8494; --muted-2:#8a94a6; --muted-3:#a3aebd;
    --accent:#2563eb; --accent-strong:#1d4ed8; --accent-soft:#eff6ff; --accent-line:#bfdbfe; --accent-wash:#f5faff;
    --nav:#07111f; --shadow:31,41,55; --head:#f8fafc; --header-bg:rgba(255,255,255,0.88);
    --card-shadow:0 1px 2px rgba(31,41,55,0.06); --lift-shadow:rgba(15,23,42,0.08);
    --accent-a08:rgba(37,99,235,0.08); --accent-a28:rgba(37,99,235,0.28); --accent-a32:rgba(37,99,235,0.32);
    --nav-active-bg:rgba(14,165,233,0.16); --nav-active:#67e8f9; --nav-active-line:rgba(14,165,233,0.28); --nav-dim:#9fb1c7; --nav-text:#f8fafc;
    --danger:#b91c1c; --danger-2:#7f4040; --danger-bg:#fff5f5; --danger-border:#fecaca;
    --warn:#b45309; --warn-2:#9a3412; --warn-accent:#d89116; --warn-bg:#fff7ed; --warn-border:#fed7aa;
    --good:#166534; --good-2:#16a34a; --good-bg:#e8f7ef; --good-border:#bcebd0;
    --purple:#6d28d9; --purple-bg:#f3e8ff; --purple-border:#ddd6fe;
    --switch-off:#d7dfea; --switch-shadow:0 1px 2px rgba(15,23,42,.25); --menu-shadow:0 20px 50px rgba(15,23,42,.16); --hover-shadow:0 12px 26px rgba(15,23,42,.08);
    --skeleton-start:#eef2f7; --skeleton-end:#e2e8f0; --on-accent:#ffffff; --focus-ring:rgba(37,99,235,.12); --nav-border:rgba(148,163,184,.2); --nav-hover:rgba(148,163,184,.12); --nav-section:#6b7f97;
    --chart-1:#2563eb; --chart-2:#0d9488; --chart-3:#7c3aed; --chart-4:#0ea5e9; --chart-5:#d89116;
  }
  [data-theme="Dark"] {
  --panel: var(--surface); --soft: var(--surface-2); --workspace: var(--surface-2);
  --ink: var(--text); --faint: var(--muted-2);
  --blue: var(--accent); --green: var(--good); --amber: var(--warn); --red: var(--danger); --error: var(--danger);
  --nav-bg: var(--nav); --nav-ink: var(--nav-text); --nav-muted: var(--nav-dim); --nav-line: var(--border); --nav-icon: var(--nav-dim);
  --button-icon: var(--muted); --control-icon: var(--muted);
  --shadow-soft: var(--card-shadow);
    --canvas:#05090f; --surface:#101722; --surface-2:#0c131d; --bg-2:#0d151f; --bg-3:#1a2432; --hover:#182231;
    --border:#232f40; --border-soft:#1b2534; --border-strong:#33415a; --line:#33415a;
    --text:#e9eef6; --text-2:#d2dae6; --text-3:#a9b5c5; --muted:#8a97a9; --muted-2:#7c8899; --muted-3:#6b7889;
    --accent:#5b9cff; --accent-strong:#8ab8ff; --accent-soft:#15243c; --accent-line:#27436e; --accent-wash:#0f1a2b;
    --nav:#080d15; --shadow:0,0,0; --head:#0f1724; --header-bg:rgba(13,21,31,0.92);
    --card-shadow:0 1px 2px rgba(0,0,0,0.45); --lift-shadow:rgba(0,0,0,0.55);
    --accent-a08:rgba(91,156,255,0.10); --accent-a28:rgba(91,156,255,0.34); --accent-a32:rgba(91,156,255,0.40);
    --nav-active-bg:rgba(91,156,255,0.16); --nav-active:#8ab8ff; --nav-active-line:rgba(91,156,255,0.30); --nav-dim:#8695ab; --nav-text:#e9eef6;
    --danger:#f87171; --danger-2:#fca5a5; --danger-bg:rgba(248,113,113,0.12); --danger-border:rgba(248,113,113,0.30);
    --warn:#fbbf24; --warn-2:#fdba74; --warn-accent:#f59e0b; --warn-bg:rgba(251,191,36,0.12); --warn-border:rgba(251,191,36,0.28);
    --good:#4ade80; --good-2:#34d399; --good-bg:rgba(52,211,153,0.12); --good-border:rgba(52,211,153,0.28);
    --purple:#c4b5fd; --purple-bg:rgba(167,139,250,.14); --purple-border:rgba(167,139,250,.32);
    --switch-off:#33415a; --switch-shadow:0 1px 2px rgba(0,0,0,.55); --menu-shadow:0 20px 50px rgba(0,0,0,.55); --hover-shadow:0 12px 26px rgba(0,0,0,.45);
    --skeleton-start:#1b2534; --skeleton-end:#283649; --on-accent:#07111f; --focus-ring:rgba(91,156,255,.30); --nav-border:rgba(134,149,171,.28); --nav-hover:rgba(134,149,171,.16); --nav-section:#8695ab;
    --chart-1:#5b9cff; --chart-2:#2dd4bf; --chart-3:#a78bfa; --chart-4:#38bdf8; --chart-5:#fbbf24;
  }
  [data-theme="Cyberpunk"] {
  --panel: var(--surface); --soft: var(--surface-2); --workspace: var(--surface-2);
  --ink: var(--text); --faint: var(--muted-2);
  --blue: var(--accent); --green: var(--good); --amber: var(--warn); --red: var(--danger); --error: var(--danger);
  --nav-bg: var(--nav); --nav-ink: var(--nav-text); --nav-muted: var(--nav-dim); --nav-line: var(--border); --nav-icon: var(--nav-dim);
  --button-icon: var(--muted); --control-icon: var(--muted);
  --shadow-soft: var(--card-shadow);
    --canvas:radial-gradient(120% 80% at 50% 0%, #0a2019 0%, #04100c 60%); --surface:#08150f; --surface-2:#06110c; --bg-2:#05100b; --bg-3:#0f2a20; --hover:#123326;
    --border:#1b3d2e; --border-soft:#143024; --border-strong:#2a6549; --line:#2a6549;
    --text:#eafff3; --text-2:#cdf4e0; --text-3:#a3d6bd; --muted:#7fb39a; --muted-2:#6fa28c; --muted-3:#5f917c;
    --accent:#ff2e88; --accent-strong:#ffd166; --accent-soft:#2a0a1b; --accent-line:#7a1442; --accent-wash:#1a0611;
    --nav:linear-gradient(180deg, #0a2519 0%, #030c08 100%); --shadow:0,0,0; --head:#0b1d15; --header-bg:rgba(5,16,11,0.93);
    --card-shadow:0 0 0 1px rgba(255,46,136,0.07), 0 10px 30px rgba(0,0,0,0.75);
    --lift-shadow:rgba(255,46,136,0.24);
    --accent-a08:rgba(255,46,136,0.10); --accent-a28:rgba(255,46,136,0.42); --accent-a32:rgba(255,209,102,0.55);
    --nav-active-bg:rgba(255,46,136,0.16); --nav-active:#ff6fa9; --nav-active-line:rgba(255,46,136,0.42); --nav-dim:#7fb39a; --nav-text:#eafff3;
    --danger:#ff5c7a; --danger-2:#ff90a6; --danger-bg:rgba(255,92,122,0.12); --danger-border:rgba(255,92,122,0.32);
    --warn:#ffd166; --warn-2:#ffb457; --warn-accent:#ffd166; --warn-bg:rgba(255,209,102,0.12); --warn-border:rgba(255,209,102,0.30);
    --good:#35f0b0; --good-2:#5cffc6; --good-bg:rgba(53,240,176,0.12); --good-border:rgba(53,240,176,0.30);
    --purple:#d1b3ff; --purple-bg:rgba(179,136,255,.16); --purple-border:rgba(179,136,255,.42);
    --switch-off:#2a6549; --switch-shadow:0 1px 2px rgba(0,0,0,.65); --menu-shadow:0 20px 50px rgba(0,0,0,.75); --hover-shadow:0 12px 26px rgba(255,46,136,.18);
    --skeleton-start:#143024; --skeleton-end:#1b3d2e; --on-accent:#08150f; --focus-ring:rgba(255,46,136,.32); --nav-border:rgba(127,179,154,.28); --nav-hover:rgba(127,179,154,.16); --nav-section:#7fb39a;
    --chart-1:#ff2e88; --chart-2:#35f0b0; --chart-3:#b388ff; --chart-4:#3ddbff; --chart-5:#ffd166;
  }
  [data-theme="Neon Noir"] {
  --panel: var(--surface); --soft: var(--surface-2); --workspace: var(--surface-2);
  --ink: var(--text); --faint: var(--muted-2);
  --blue: var(--accent); --green: var(--good); --amber: var(--warn); --red: var(--danger); --error: var(--danger);
  --nav-bg: var(--nav); --nav-ink: var(--nav-text); --nav-muted: var(--nav-dim); --nav-line: var(--border); --nav-icon: var(--nav-dim);
  --button-icon: var(--muted); --control-icon: var(--muted);
  --shadow-soft: var(--card-shadow);
    --canvas:radial-gradient(120% 80% at 50% 0%, #0b1a1e 0%, #050a0c 60%); --surface:#0b1417; --surface-2:#081012; --bg-2:#070f11; --bg-3:#12232a; --hover:#152b33;
    --border:#1d383f; --border-soft:#152a30; --border-strong:#2c5a66; --line:#2c5a66;
    --text:#eafcff; --text-2:#cdeef4; --text-3:#a3ccd6; --muted:#7fa8b3; --muted-2:#6f97a2; --muted-3:#5f8691;
    --accent:#ff2e88; --accent-strong:#ffd166; --accent-soft:#2a0a1b; --accent-line:#7a1442; --accent-wash:#1a0611;
    --nav:linear-gradient(180deg, #0a1f26 0%, #04090b 100%); --shadow:0,0,0; --head:#0d1a1e; --header-bg:rgba(7,15,17,0.93);
    --card-shadow:0 0 0 1px rgba(255,46,136,0.07), 0 10px 30px rgba(0,0,0,0.75);
    --lift-shadow:rgba(255,46,136,0.24);
    --accent-a08:rgba(255,46,136,0.10); --accent-a28:rgba(255,46,136,0.42); --accent-a32:rgba(255,209,102,0.55);
    --nav-active-bg:rgba(255,46,136,0.16); --nav-active:#ff6fa9; --nav-active-line:rgba(255,46,136,0.42); --nav-dim:#7fa8b3; --nav-text:#eafcff;
    --danger:#ff5c7a; --danger-2:#ff90a6; --danger-bg:rgba(255,92,122,0.12); --danger-border:rgba(255,92,122,0.32);
    --warn:#ffd166; --warn-2:#ffb457; --warn-accent:#ffd166; --warn-bg:rgba(255,209,102,0.12); --warn-border:rgba(255,209,102,0.30);
    --good:#2ee6c5; --good-2:#5cffe0; --good-bg:rgba(46,230,197,0.12); --good-border:rgba(46,230,197,0.30);
    --purple:#d1b3ff; --purple-bg:rgba(179,136,255,.16); --purple-border:rgba(179,136,255,.42);
    --switch-off:#2c5a66; --switch-shadow:0 1px 2px rgba(0,0,0,.65); --menu-shadow:0 20px 50px rgba(0,0,0,.75); --hover-shadow:0 12px 26px rgba(255,46,136,.18);
    --skeleton-start:#152a30; --skeleton-end:#1d383f; --on-accent:#0b1417; --focus-ring:rgba(255,46,136,.32); --nav-border:rgba(127,168,179,.28); --nav-hover:rgba(127,168,179,.16); --nav-section:#7fa8b3;
    --chart-1:#ff2e88; --chart-2:#2ee6c5; --chart-3:#b388ff; --chart-4:#3ddbff; --chart-5:#ffd166;
  }

:root, [data-theme="Light"], [data-theme="Dark"], [data-theme="Cyberpunk"], [data-theme="Neon Noir"] {
  --c-app-bg: var(--canvas);
  --c-surface: var(--surface);
  --c-surface-sunk: var(--surface-2);
  --c-surface-head: var(--head);
  --c-nav-bg: var(--nav);
  --c-nav-fg: var(--nav-text);
  --c-nav-fg-dim: var(--nav-dim);
  --c-line: var(--border);
  --c-line-soft: var(--border-soft);
  --c-line-strong: var(--border-strong);
  --c-text: var(--text);
  --c-text-body: var(--text-2);
  --c-text-muted: var(--muted);
  --c-text-faint: var(--muted-2);
  --c-accent: var(--accent);
  --c-accent-hover: var(--accent-strong);
  --c-accent-soft: var(--accent-soft);
  --c-accent-line: var(--accent-line);
  --c-accent-nav: var(--nav-active);
  --c-green: var(--good);
  --c-green-bg: var(--good-bg);
  --c-green-border: var(--good-border);
  --c-amber: var(--warn);
  --c-amber-strong: var(--warn-2);
  --c-amber-bg: var(--warn-bg);
  --c-amber-border: var(--warn-border);
  --c-red: var(--danger);
  --c-red-bg: var(--danger-bg);
  --c-red-border: var(--danger-border);
  --c-purple: var(--purple);
  --c-purple-bg: var(--purple-bg);
  --c-purple-border: var(--purple-border);
  --c-row-hover: var(--hover);
  --c-badge-bg: var(--bg-3);
  --c-text-label: var(--text-3);
  --c-placeholder: var(--muted-3);
  --c-on-accent: var(--on-accent);
  --c-focus-ring: var(--focus-ring);
  --c-nav-border: var(--nav-border);
  --c-nav-hover: var(--nav-hover);
  --c-nav-active-bg: var(--nav-active-bg);
  --c-nav-active-line: var(--nav-active-line);
  --c-nav-section: var(--nav-section);
  --c-switch-off: var(--switch-off);
  --c-switch-shadow: var(--switch-shadow);
  --c-shadow-card: var(--card-shadow);
  --c-shadow-menu: var(--menu-shadow);
  --c-shadow-hover: var(--hover-shadow);
  --c-skeleton-start: var(--skeleton-start);
  --c-skeleton-end: var(--skeleton-end);
  --c-drawer-backdrop: color-mix(in srgb, var(--nav) 55%, transparent);
  --c-theme-light-a: #ffffff;
  --c-theme-light-b: #e9edf2;
  --c-theme-dark-a: #101722;
  --c-theme-dark-b: #5b9cff;
  --c-theme-cyberpunk-a: #08150f;
  --c-theme-cyberpunk-b: #ff2e88;
  --c-theme-neon-a: #0b1417;
  --c-theme-neon-b: #2ee6c5;
}

:root { scrollbar-color: var(--border-strong) var(--surface-2); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 8px; border: 2px solid var(--surface-2); }
::-webkit-scrollbar-track { background: var(--surface-2); }
::-webkit-scrollbar-corner { background: var(--surface-2); }