/* ── Single source of truth for all design tokens ── */

:root {
  /* Layout */
  --navbar-h: 46px;

  /* Fonts */
  --font-display: 'IBM Plex Mono', monospace;
  --font-body:    'IBM Plex Mono', monospace;

  /* Type scale */
  --text-xs:   11px;
  --text-sm:   13px;
  --text-base: 15px;
  --text-lg:   18px;
  --text-xl:   24px;
  --text-2xl:  36px;
  --text-3xl:  52px;

  /* Spacing (4px base) */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;

  /* Surface */
  --bg:            #181818;
  --bg-card:       #212121;
  --bg-elevated:   #2a2a2a;
  --border:        #363636;
  --border-subtle: #282828;

  /* Text */
  --text-primary:   #f0f0ee;
  --text-secondary: #8a8a8a;
  --text-muted:     #585858;

  /* Time-of-day background shifts */
  --bg-dawn:  #1c1624;   /* 05–08  cool violet */
  --bg-day:   #181818;   /* 08–18  neutral dark */
  --bg-dusk:  #181420;   /* 18–20  cool dusk violet */
  --bg-night: #121520;   /* 20–05  deep cool */
  --bg-current: var(--bg-day);

  /* Radius */
  --radius-sm: 3px;
  --radius-md: 6px;

  /* Transitions */
  --t-fast: 100ms ease;
  --t-base: 180ms ease;

  /* ── Type colors ── */
  --type-normal:   #A8A77A;
  --type-fire:     #EE8130;
  --type-water:    #6390F0;
  --type-electric: #F7D02C;
  --type-grass:    #7AC74C;
  --type-ice:      #96D9D6;
  --type-fighting: #C22E28;
  --type-poison:   #A33EA1;
  --type-ground:   #E2BF65;
  --type-flying:   #A98FF3;
  --type-psychic:  #F95587;
  --type-bug:      #A6B91A;
  --type-rock:     #B6A136;
  --type-ghost:    #735797;
  --type-dragon:   #6F35FC;
  --type-dark:     #705746;
  --type-steel:    #B7B7CE;

  /* ── Version colors ── */
  --version-diamond:  #5a8fd8;
  --version-pearl:    #e898c0;
  --version-platinum: #a8bacf;
  --version-hg:       #d4a840;
  --version-ss:       #a0b8c8;

  /* ── Learn method colors ── */
  --method-level:  #52b87a;
  --method-tm:     #5aabdc;
  --method-egg:    #e8a030;
  --method-tutor:  #78b840;
  --method-event:  #dc5078;
}

/* Time-of-day background */
[data-time="dawn"]  { --bg-current: var(--bg-dawn);  }
[data-time="day"]   { --bg-current: var(--bg-day);   }
[data-time="dusk"]  { --bg-current: var(--bg-dusk);  }
[data-time="night"] { --bg-current: var(--bg-night); }