/* Shared brand, layout, and component tokens. */
:root {
  --bg:          #101916;
  --bg2:         #17231f;
  --surface:     rgba(235,244,235,.045);
  --surface-md:  rgba(235,244,235,.08);
  --border:      rgba(221,235,225,.12);
  --border-md:   rgba(221,235,225,.24);

  --violet:      #8bd9b3;
  --violet-dim:  #549b78;
  --blue:        #f28162;
  --blue-dim:    #c86147;
  --indigo:      #8bd9b3;
  --cyan:        #f2c879;
  --green:       #8bd9b3;
  --discord:     #5865f2;
  --discord-dim: #4752c4;
  --game-from:   #8bd9b3;
  --game-to:     #f28162;
  --soft-from:   #8bd9b3;
  --soft-to:     #f2c879;
  --twin-from:   #f2c879;
  --twin-to:     #f28162;

  --line:        #8bd9b3;
  --line-dim:    #549b78;
  --paper:       #e8eee4;
  --redline:     #f28162;
  --redline-dim: #c86147;
  --data:        #f2c879;

  --text:        #f0f2e9;
  --text-muted:  #aab8ae;
  --text-dim:    #73837a;

  --font-head:   'Space Grotesk', sans-serif;
  --font-body:   'IBM Plex Sans', sans-serif;
  --font-mono:   'IBM Plex Mono', monospace;

  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   14px;
  --radius-xl:   12px;

  --dur:         0.3s;
  --ease:        cubic-bezier(0.4, 0, 0.2, 1);
}

:root {
  color-scheme: dark;
  --content-width: 1180px;
  --surface-raised: rgba(235, 244, 235, .075);
  --focus-ring: #f2c879;
}