/* ARENA by Rank — Color tokens */
:root {
  /* Primary colors — core brand palette */
  --color-black: #000000;
  --color-white: #ffffff;
  --color-gray-light: #d9d9d9;
  --color-gray-medium: #e2e2e2;
  
  /* Brand accent colors — high energy */
  --color-red: #e73229;
  --color-red-dark: #b70900;
  --color-cyan: #1bf2b6;
  --color-blue: #0c2fe7;
  --color-blue-medium: #2a6dff;
  --color-blue-light: #0050e5;
  --color-magenta: #e858eb;
  --color-magenta-light: #df31eb;
  --color-purple: #513dc4;
  --color-purple-dark: #020d3a;
  
  /* Extended accent palette */
  --color-teal: #06b6d4;
  --color-teal-bright: #00ffb8;
  --color-teal-dark: #00bc87;
  --color-green: #b0ff8c;
  --color-lime: #ceef01;
  --color-pink: #ff1b54;
  --color-orange: #ff5b22;
  --color-yellow: #fff345;
  --color-violet: #e78dfa;
  --color-blue-navy: #133d6e;
  --color-blue-sky: #2f7ebf;
  --color-blue-cobalt: #1d7dff;
  
  /* Semantic — unified palette, not product-segmented */
  --color-fg-primary: var(--color-white);
  --color-fg-secondary: var(--color-gray-light);
  --color-bg-dark: var(--color-black);
  --color-bg-light: var(--color-white);
  --color-accent-primary: var(--color-red);
  --color-accent-secondary: var(--color-cyan);
  --color-accent-tertiary: var(--color-blue);
  --color-accent-quaternary: var(--color-magenta);
}