/* Palette pulled from a W204 cluster lit at night: housing black, brushed chrome
   bezel, cool phosphor LCD, one red needle. Nothing here is decorative. */

:root {
  /* surfaces */
  --void:        #07080a;
  --ink:         #0b0d10;
  --ink-2:       #101317;
  --dial:        #131519;
  --dial-edge:   #1c2026;

  /* brushed chrome ramp — used for bezels, rings, rules */
  --chrome-1:    #f2f4f5;
  --chrome-2:    #b9bfc4;
  --chrome-3:    #7c8288;
  --chrome-4:    #43484e;
  --chrome-5:    #22262b;

  /* phosphor LCD */
  --lcd:         #d3e3da;
  --lcd-mid:     #7d908a;
  --lcd-dim:     #39443f;
  --lcd-bg:      #080b0a;
  --lcd-glow:    rgba(190, 226, 208, 0.32);

  /* signal */
  --needle:      #e01b2e;
  --needle-hot:  #ff4152;
  --sport:       #ff6a2c;
  --alarm:       #ff2e3f;
  --ok:          #4fe08a;

  /* payoff palette — only appears at the reveal */
  --steam-deep:  #12212f;
  --steam-mid:   #1b2838;
  --steam-lit:   #66c0f4;

  /* text */
  --fg:          #eef1f3;
  --fg-2:        rgba(238, 241, 243, 0.66);
  --fg-3:        rgba(238, 241, 243, 0.40);

  /* type */
  --face-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --face-body:    'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --face-lcd:     'Doto', 'Courier New', monospace;

  /* Archivo is variable on the width axis — the whole type system is one family
     stretched and squeezed, so headline and caption stay related. */
  --wide:   'wdth' 118;
  --normal: 'wdth' 100;
  --narrow: 'wdth' 82;

  /* scale */
  --t-xs:   0.72rem;
  --t-sm:   0.84rem;
  --t-base: 1rem;
  --t-md:   1.125rem;
  --t-lg:   clamp(1.35rem, 1rem + 1.6vw, 2rem);
  --t-xl:   clamp(2rem, 1.2rem + 3.6vw, 3.4rem);
  --t-hero: clamp(3.2rem, 1rem + 13vw, 11rem);

  /* rhythm — 4pt base */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 72px;
  --s-9: 112px;

  --wrap: 1120px;

  /* motion */
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:   cubic-bezier(0.7, 0, 0.84, 0);
  --ease-mech: cubic-bezier(0.34, 1.4, 0.64, 1);
  --d-fast: 160ms;
  --d-mid:  260ms;
  --d-slow: 420ms;

  /* layers */
  --z-page: 1;
  --z-lock: 60;
  --z-flash: 90;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --d-fast: 1ms;
    --d-mid: 1ms;
    --d-slow: 1ms;
  }
}