/* Токены: все цвета, шрифты и шкалы страницы — только здесь. */
:root {
  --color-paper: oklch(14% 0.012 160);
  --color-paper-2: oklch(18% 0.014 160);
  --color-paper-3: oklch(11% 0.01 160);
  /* фоны подарков: настоящий цвет приглушаем к бумаге — центр светлее, края уходят в тёмное (как в Telegram) */
  --backdrop-center: 80%;
  --backdrop-edge: 28%;
  --backdrop-swatch: 82%;
  --color-ink: oklch(95% 0.02 140);
  --color-ink-2: oklch(84% 0.03 140);
  --color-muted: oklch(70% 0.03 150);
  --color-rule: oklch(28% 0.03 155);
  --color-rule-2: oklch(40% 0.05 150);
  --color-accent: oklch(89% 0.21 128);
  --color-accent-ink: oklch(18% 0.05 130);
  --color-accent-soft: oklch(28% 0.07 130);
  --color-cool: oklch(80% 0.12 215);
  --color-cool-soft: oklch(27% 0.05 215);
  --color-bark: oklch(56% 0.025 70);
  --color-craft: oklch(72% 0.19 345);
  /* Спектр коллекций на графе: от жёлто-лаймового к небесному. */
  --color-g1: oklch(91% 0.19 108);
  --color-g2: oklch(88% 0.21 130);
  --color-g3: oklch(80% 0.19 152);
  --color-g4: oklch(81% 0.14 178);
  --color-g5: oklch(79% 0.12 205);
  --color-g6: oklch(74% 0.14 238);
  --color-bad: oklch(70% 0.17 25);
  /* Редкость модели — классическая игровая шкала: серый, синий, фиолетовый, золотой */
  --tier-common: oklch(76% 0.015 150);
  --tier-rare: oklch(72% 0.15 250);
  --tier-epic: oklch(70% 0.2 305);
  --tier-legendary: oklch(82% 0.16 75);
  --color-focus: oklch(89% 0.21 128);
  /* Полупрозрачные панели: сквозь них видны сетка и фоновые глаза */
  --color-glass: color-mix(in oklab, var(--color-paper-3) 66%, transparent);
  --color-glass-2: color-mix(in oklab, var(--color-paper-2) 66%, transparent);
  --color-grid: oklch(22% 0.025 155 / 0.55);

  --font-display: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --font-body: var(--font-display);
  --font-mono: "JetBrains Mono", ui-monospace, "Cascadia Mono", monospace;

  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-base: 1.0625rem;
  --text-lg: 1.25rem;
  --text-xl: clamp(1.75rem, 1.2rem + 2vw, 2.75rem);
  --text-display: clamp(2.5rem, 1.6rem + 3.4vw, 4.5rem);

  --space-xs: 0.375rem;
  --space-sm: 0.75rem;
  --space-md: 1.25rem;
  --space-lg: 2rem;
  --space-xl: 3.5rem;
  --space-2xl: clamp(4.5rem, 3rem + 6vw, 8rem);

  --radius-card: 4px;
  --radius-pill: 2px;
  --rule-hair: 1px;
  --container: 1200px;

  --dur-short: 160ms;
  --dur-med: 420ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
}