/* Palette tokens. This is the only file allowed to hold colour literals.
   Literals are exact pixels sampled from brand/:
   --black #000000  from LOGO VOLATILIZER PNG.png (3655973 px, background)
   --cyan  #03ebfc  from LOGO VOLATILIZER PNG...png (27091 px, outer bars)
   --light #e8ecf1  from LOGO VOLATILIZER PNG...png (32922 px, centre bar)
   Every other value below is mixed from these three. */
:root {
  color-scheme: dark;

  --black: #000000;
  --cyan: #03ebfc;
  --light: #e8ecf1;

  --n-0: var(--black);
  --n-1: color-mix(in oklab, var(--light) 3%, var(--black));
  --n-2: color-mix(in oklab, var(--light) 6%, var(--black));
  --n-3: color-mix(in oklab, var(--light) 10%, var(--black));
  --n-4: color-mix(in oklab, var(--light) 18%, var(--black));
  --n-5: color-mix(in oklab, var(--light) 40%, var(--black));
  --n-6: color-mix(in oklab, var(--light) 62%, var(--black));
  --n-7: color-mix(in oklab, var(--light) 82%, var(--black));
  --n-8: var(--light);
  --n-9: var(--light);

  --n-9-a06: color-mix(in oklab, var(--light) 6%, transparent);
  --n-9-a10: color-mix(in oklab, var(--light) 10%, transparent);
  --n-9-a16: color-mix(in oklab, var(--light) 16%, transparent);
  --n-9-a24: color-mix(in oklab, var(--light) 24%, transparent);
  --cyan-a12: color-mix(in oklab, var(--cyan) 12%, transparent);
  --cyan-a24: color-mix(in oklab, var(--cyan) 24%, transparent);
  --cyan-a40: color-mix(in oklab, var(--cyan) 40%, transparent);
  --n-0-a60: color-mix(in oklab, var(--black) 60%, transparent);

  --background: var(--black);
  --foreground: var(--light);
  --card: var(--n-2);
  --secondary: var(--n-3);
  --muted-foreground: var(--n-6);
  --border: var(--n-4);
  --primary: var(--cyan);
  --primary-foreground: var(--black);
  --accent: var(--cyan);
  --snow: var(--light);
  --ring: var(--cyan);

  --flash-up: var(--cyan-a40);
  --flash-down: var(--n-0-a60);
  --spot: var(--cyan-a12);
  --skeleton-a: var(--n-3);
  --skeleton-b: var(--n-4);
}