/* ============================================================
 * LISTEN THEME — the one place Listen's own palette is defined.
 *
 * Light is the stock 29Court DS v2 register (premium beach:
 * warm bone, white surfaces, hairlines, coral). Dark is Melee
 * Night, the deep-sea register anchored on #0A2433 (the same
 * family the 29Court Shell uses for its own dark chrome).
 *
 * Every Listen surface links this file AFTER the design-system
 * tokens.css, so [data-theme="dark"] on <html> (set by the page
 * boot script from the stored Shell choice, else the OS) remaps
 * the whole surface: library, player, episode pages, gates,
 * radio. No surface hardcodes its own dark again.
 * ============================================================ */

:root {
  color-scheme: light;
}

[data-theme="dark"] {
  color-scheme: dark;

  /* surfaces: the Melee Night ladder */
  --29d-bg:      #0A2433;
  --29d-surface: #0F2F42;
  --29d-raised:  #14384F;
  --29d-overlay: #173D56;
  --29d-sunken:  #061A29;

  /* text: warm ivory stepping down into sea mist */
  --29d-text-1: #EFECE0;
  --29d-text-2: #B7C6CB;
  --29d-text-3: #7E97A0;
  --29d-text-4: #55707C;
  --29d-text-5: #33505F;

  /* hairlines in pale sea glass */
  --29d-border:        rgba(176, 213, 224, 0.14);
  --29d-border-strong: rgba(176, 213, 224, 0.30);
  --29d-ring:          rgba(176, 213, 224, 0.12);
  --29d-wash:          rgba(255, 255, 255, 0.05);
  --29d-wash-2:        rgba(255, 255, 255, 0.09);

  /* coral brightens at night and takes dark text (DS dark rule) */
  --29d-coral-500: #FB7E54;
  --29d-coral-600: #FB7E54;
  --29d-coral-700: #FF9E70;
  --29d-coral-100: #2C211A;
  --29d-coral-50:  #1D2A33;
  --29d-on-coral:  #1C1917;

  /* semantics, retinted for the night register */
  --29d-blue-100:  #12293D;  --29d-blue-600:  #6FB3FF;  --29d-blue-700:  #9CC8FF;
  --29d-green-100: #0E2A20;  --29d-green-600: #4CC276;  --29d-green-700: #7BD89B;
  --29d-amber-100: #2E2312;  --29d-amber-600: #EFA93F;  --29d-amber-700: #F5BE6B;
  --29d-red-100:   #38202A;  --29d-red-500:   #F67E7E;  --29d-red-600:   #F67E7E;  --29d-red-700: #FAA3A3;
  --29d-teal-100:  #0C2B2E;  --29d-teal-600:  #3FC1B8;
  --29d-gold-500:  #F2B95C;  --29d-gold-600:  #F2B95C;

  --29d-shadow-pop:
    0 0 0 1px var(--29d-ring),
    0 12px 32px rgba(0, 0, 0, 0.45),
    0 2px 8px rgba(0, 0, 0, 0.35);
  --29d-shadow-modal:
    0 0 0 1px var(--29d-ring),
    0 32px 80px rgba(0, 0, 0, 0.55);

  --29d-focus-halo: 0 0 0 3px color-mix(in srgb, var(--29d-coral-500) 38%, transparent);
}