@layer reset, base, components, utilities, retro;

:root {
  --font-retro: "Comic Sans MS", "Comic Sans", "Chalkboard SE", cursive;
  --font-mono: "Courier New", Courier, monospace;

  --lch-deep-blue: 15% 0.08 260;
  --lch-hot-pink: 65% 0.3 350;
  --lch-electric-blue: 62% 0.25 255;
  --lch-lime: 85% 0.3 135;
  --lch-yellow: 90% 0.2 95;
  --lch-cyan: 78% 0.15 200;
  --lch-white: 98% 0.005 260;
  --lch-red: 63% 0.27 29;

  --color-bg: oklch(var(--lch-deep-blue));
  --color-text: oklch(var(--lch-yellow));
  --color-accent: oklch(var(--lch-hot-pink));
  --color-link: oklch(var(--lch-cyan));
  --color-positive: oklch(var(--lch-lime));
  --color-panel: oklch(22% 0.04 260);
  --color-panel-border: oklch(var(--lch-hot-pink));
  --color-input-bg: oklch(95% 0 0);
  --color-input-text: oklch(10% 0 0);

  --block-space: 1rem;
  --inline-space: 1ch;
}