/*!
 * SONIC SNOWFLAKE RECORDS — Design Tokens
 * ------------------------------------------------------------
 * This is the single source of truth for the label's shared
 * visual language: void/panel surfaces, the violet "neon" brand
 * hue, chrome text treatment, prestige gold, and the type/motion
 * scale used by shell chrome (nav, player, footer, buttons).
 *
 * Each artist keeps their own accent palette scoped inside their
 * view's own stylesheet (view-king-ping.css, view-waddle-wave.css,
 * view-from-ice-to-igloo.css, view-johann-sebastian-squawk.css) —
 * that's deliberate: a label roster should feel like distinct
 * signed acts under one shared roof, not one reskinned template.
 * ------------------------------------------------------------ */

:root {
  /* ============ SURFACE ============ */
  --void: #060309;
  --void-deep: #020103;
  --panel: #0F0A1A;
  --panel-2: #170F29;
  --panel-3: #1F1533;
  --line: rgba(214, 187, 255, 0.14);
  --line-soft: rgba(214, 187, 255, 0.08);

  /* ============ LABEL NEON — violet ============ */
  --neon: #B583FF;
  --neon-bright: #D6BBFF;
  --neon-deep: #6D28D9;
  --neon-ice: #E7E1FF;

  /* ============ CHROME — the metallic wordmark treatment ============ */
  --chrome-1: #F6F4FB;
  --chrome-2: #C7C0DA;
  --chrome-3: #837AA0;
  --chrome-4: #4A4460;

  /* ============ PRESTIGE GOLD — accent for CTAs & certifications ============ */
  --gold: #E8B24C;
  --gold-bright: #F5D488;
  --gold-deep: #A87420;

  /* ============ TEXT ============ */
  --pearl: #F6F4FB;
  --mist: #ABA2C4;
  --mist-dim: #6B6484;

  /* ============ GLOWS ============ */
  --glow-neon: 0 0 24px rgba(181, 131, 255, .5), 0 0 58px rgba(181, 131, 255, .22);
  --glow-neon-soft: 0 0 14px rgba(181, 131, 255, .32);
  --glow-neon-lg: 0 0 60px rgba(181, 131, 255, .35), 0 0 140px rgba(181, 131, 255, .18);
  --glow-gold: 0 0 20px rgba(232, 178, 76, .42);
  --glow-ice: 0 0 16px rgba(231, 225, 255, .45);

  /* ============ TYPE ============ */
  --font-display: 'Unbounded', sans-serif;
  --font-body: 'Instrument Sans', -apple-system, "Segoe UI", sans-serif;
  --font-mono: 'IBM Plex Mono', "SFMono-Regular", Consolas, monospace;

  --fs-hero: clamp(2.9rem, 8.4vw, 7.4rem);
  --fs-h2: clamp(2.1rem, 5vw, 3.9rem);
  --fs-h3: clamp(1.32rem, 2.6vw, 1.9rem);
  --fs-lead: clamp(1.05rem, 1.6vw, 1.3rem);
  --fs-body: clamp(1rem, 1.05vw, 1.125rem);
  --fs-small: 0.92rem;
  --fs-eyebrow: 0.76rem;

  /* ============ LAYOUT ============ */
  --container: 1240px;
  --container-wide: 1440px;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);
  --radius-lg: 26px;
  --radius-md: 16px;
  --radius-sm: 10px;
  --nav-h: 84px;
  --nav-h-solid: 68px;
  --player-h: 88px;
  --player-h-mobile: 132px;

  /* ============ MOTION ============ */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --ease-soft: cubic-bezier(.4, 0, .2, 1);
  --dur-fast: .2s;
  --dur-med: .45s;
  --dur-slow: .9s;

  /* ============ Z-INDEX SCALE ============ */
  --z-bg: 0;
  --z-content: 10;
  --z-nav: 500;
  --z-player: 600;
  --z-toast: 700;
  --z-overlay: 800;
  --z-modal: 900;
  --z-progress: 950;
}

/* Reduced motion: collapse the whole motion system to near-nothing */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: .001ms;
    --dur-med: .001ms;
    --dur-slow: .001ms;
  }
}