/* ==========================================================================
   Duskwyn.dev — dark-theme.css
   Design tokens taken from the userscript's own house theme ("Duskwyn"):
   dusk violet over deep indigo, an ember-amber horizon, neon magenta/cyan sparks.
   Accent palettes mirror the script's Duskwyn.dev theme collection and are
   switched by theme.js via [data-accent] on <html>.
   ========================================================================== */

:root {
  color-scheme: dark;

  /* Base surfaces: AMOLED black page, deep-indigo panels (script: DUSK.bg / surface / line) */
  --bg-0: #000000;
  --bg-1: #05040c;
  --bg-2: #0a0816;            /* DUSK.bg */
  --bg-3: #120f24;            /* DUSK.surface */
  --line: rgba(155, 123, 255, 0.14);
  --line-strong: rgba(155, 123, 255, 0.26);

  /* Text (DUSK.text / muted) */
  --text-0: #eeeaff;
  --text-1: #cdc7ec;
  --text-2: #9a93c4;
  --text-3: #8780b3;          /* raised from #6c6596 to meet WCAG AA (4.5:1) on the dark surfaces */

  /* Accents — default "Duskwyn": violet + ember, magenta + cyan sparks */
  --accent: #9b7bff;          /* DUSK.violet */
  --accent-2: #ffb86b;        /* DUSK.ember */
  --accent-3: #ff5fd2;        /* DUSK.magenta */
  --accent-4: #5ee6ff;        /* DUSK.cyan */
  --accent-rgb: 155, 123, 255;
  --accent-2-rgb: 255, 184, 107;
  --on-accent: #0a0816;

  /* Status (house theme done / soon / over) */
  --ok: #5eead4;
  --warn: #ffd27a;
  --danger: #ff6b8b;

  /* Glass */
  --glass-bg: rgba(18, 15, 36, 0.52);
  --glass-bg-strong: rgba(10, 8, 22, 0.78);
  --glass-border: rgba(190, 170, 255, 0.14);
  --glass-blur: 18px;

  /* Glow */
  --glow-sm: 0 0 12px rgba(var(--accent-rgb), 0.4);
  --glow-md: 0 0 24px rgba(var(--accent-rgb), 0.38), 0 0 60px rgba(var(--accent-2-rgb), 0.16);
  --glow-lg: 0 0 40px rgba(var(--accent-rgb), 0.5), 0 0 120px rgba(var(--accent-2-rgb), 0.22);

  /* Gradients */
  --grad-accent: linear-gradient(120deg, var(--accent) 0%, var(--accent-3) 55%, var(--accent-2) 100%);
  --grad-surface: linear-gradient(160deg, rgba(var(--accent-rgb), 0.09), rgba(var(--accent-2-rgb), 0.035) 45%, transparent 72%);

  /* Shape & rhythm (house theme radius 18) */
  --radius-sm: 8px;
  --radius: 14px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --shadow: 0 24px 50px -28px rgba(4, 2, 16, 0.9), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --container: 1200px;
  --gutter: clamp(16px, 4vw, 32px);
  --header-h: 68px;

  /* Type (house theme uses Outfit) */
  --font-sans: "Outfit", "Inter", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-display: "Outfit", "Space Grotesk", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "Cascadia Code", "Consolas", ui-monospace, monospace;

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 160ms;
  --dur: 280ms;
  --dur-slow: 600ms;
}

/* --- Accent palettes: the script's Duskwyn.dev collection --------------- */
:root[data-accent="neon"] {          /* Duskwyn Neon: magenta + cyan */
  --accent: #ff5fd2;
  --accent-2: #5ee6ff;
  --accent-3: #9b7bff;
  --accent-rgb: 255, 95, 210;
  --accent-2-rgb: 94, 230, 255;
  --on-accent: #14021a;
}

:root[data-accent="aurora"] {        /* Duskwyn Aurora: cyan + violet */
  --accent: #5ee6ff;
  --accent-2: #9b7bff;
  --accent-3: #5eead4;
  --accent-rgb: 94, 230, 255;
  --accent-2-rgb: 155, 123, 255;
  --on-accent: #02121a;
}

:root[data-accent="ember"] {         /* Duskwyn Ember: ember + magenta */
  --accent: #ffb86b;
  --accent-2: #ff5fd2;
  --accent-3: #ffd27a;
  --accent-rgb: 255, 184, 107;
  --accent-2-rgb: 255, 95, 210;
  --on-accent: #1a0c02;
}

:root[data-accent="hud"] {           /* Duskwyn HUD: cyan + amber */
  --accent: #5ee6ff;
  --accent-2: #ffb86b;
  --accent-3: #9b7bff;
  --accent-rgb: 94, 230, 255;
  --accent-2-rgb: 255, 184, 107;
  --on-accent: #02121a;
}

/* Browsers without backdrop-filter get a solid surface instead of glass. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root {
    --glass-bg: rgba(14, 11, 30, 0.94);
    --glass-bg-strong: rgba(10, 8, 22, 0.97);
  }
}