/* ============================================================
   DE SCÈNE — Color tokens
   Dark, editorial, nocturnal. Black base · warm cream type ·
   deep-red accent · graphite layers · silver detail.
   ============================================================ */
:root {
  /* — Base / night — */
  --ink-900: #050505;   /* pure night — outermost background */
  --ink-800: #0C0B0A;   /* app background */
  --ink-700: #141210;   /* raised surface / card */
  --ink-600: #1D1A17;   /* card hover / inset */
  --ink-500: #262220;   /* borders on dark, elevated chips */
  --ink-400: #35302B;   /* hairline / divider on dark */

  /* — Cream (the signature warm off-white) — */
  --cream-100: #FBF4E6; /* brightest — display glyphs */
  --cream-200: #F3D5AB; /* brand cream — logo, headlines */
  --cream-300: #E7D8BC; /* body text on dark */
  --cream-400: #C9B89A; /* muted cream / secondary text */
  --cream-500: #9A8E77; /* captions, meta on dark */

  /* — Silver / graphite detail — */
  --silver-300: #B6B0A6;
  --silver-500: #7C766C;
  --silver-700: #4A453E;

  /* — Accent (paars/blauw — the club-lighting accent) — */
  --red-700: #2A1C74;   /* deepest violet — pressed / big fills */
  --red-600: #3B2AA6;   /* deep indigo */
  --red-500: #5A3FE0;   /* primary — blue-violet */
  --red-400: #8064F2;   /* hover / bright */
  --red-100: #15112E;   /* violet-tinted surface wash */

  /* — Blue partner (for two-tone club gradients / detail) — */
  --blue-500: #2F6BF0;  /* electric blue */
  --blue-400: #5A8CF5;  /* bright blue */

  /* — Paper (rare light-mode inversion: quote cards, print) — */
  --paper-100: #F3ECDD; /* crème paper */
  --paper-200: #E7DCC6;
  --paper-ink: #141210; /* text on paper */

  /* ---------- Semantic aliases ---------- */
  --bg-page: var(--ink-800);
  --bg-deep: var(--ink-900);
  --surface-card: var(--ink-700);
  --surface-raised: var(--ink-600);
  --surface-chip: var(--ink-500);
  --surface-inverse: var(--paper-100);

  --text-display: var(--cream-200);
  --text-heading: var(--cream-100);
  --text-body: var(--cream-300);
  --text-muted: var(--cream-400);
  --text-meta: var(--cream-500);
  --text-inverse: var(--paper-ink);

  /* — Named accent aliases (physical ramp above; use these going forward) — */
  --violet-700: var(--red-700);
  --violet-600: var(--red-600);
  --violet-500: var(--red-500);
  --violet-400: var(--red-400);
  --violet-wash: var(--red-100);

  --accent: var(--red-500);
  --accent-hover: var(--red-400);
  --accent-press: var(--red-700);
  --accent-wash: var(--red-100);

  --border-hairline: var(--ink-400);
  --border-strong: var(--ink-500);
  --border-cream: rgba(243, 213, 171, 0.18);
  --border-accent: var(--red-500);

  --focus-ring: var(--red-400);
}
