/* price-radar · токены системы v2 (docs/design-system-v2.md §2)
   Палитра B «холодный индиго» (A «тёплый графит» снята 03.09 04:09 по слову Дениса: «почему цвет опять коричневый») — значения из docs/references/elements/color-typography.md, контраст посчитан по WCAG 2.1.
   Один файл, обе темы. Ничего мимо этих переменных в system.css не пишется (scripts/lint_tokens.py). */

:root {
  /* поверхности и линии — светлая, холодная бумага (палитра B, docs/references/elements/color-typography.md) */
  --ground: #F1F2F7;
  --card: #FFFFFF;
  --card-2: #F7F8FC;
  --card-3: #E9EBF3;
  --line-soft: #E7E9F1;
  --line: #D8DBE6;
  --line-strong: #8E93A9;
  /* текст */
  --ink: #15161D;
  --ink-2: #4E5262;
  --ink-3: #6E7385;
  /* действие — барвинковый акцент */
  --accent: #3B4CC7;
  --accent-ink: #FFFFFF;
  --select-bar: #3B4CC7;
  /* цвет несёт только цену */
  --amber: #8A5A08;
  --red: #C0372B;
  --amber-soft: rgba(138, 90, 8, .10);
  --red-soft: rgba(192, 55, 43, .10);
  --scrim: rgba(21, 22, 29, .32);
  --dot: #D8DBE6;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --ground: #111219;
  --card: #191B24;
  --card-2: #20232E;
  --card-3: #282C38;
  --line-soft: #22242F;
  --line: #2E3240;
  --line-strong: #606780;
  --ink: #E9EAF2;
  --ink-2: #AAADBE;
  --ink-3: #868AA0;
  --accent: #8B9BFF;
  --accent-ink: #0E1020;
  --select-bar: #8B9BFF;
  --amber: #FFC24D;
  --red: #FF7A66;
  --amber-soft: rgba(255, 194, 77, .12);
  --red-soft: rgba(255, 122, 102, .12);
  --scrim: rgba(17, 18, 25, .55);
  --dot: #2E3240;
  color-scheme: dark;
}

:root {
  /* шрифт: два веса, засечки с 28 px */
  --font-sans: "Onest", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-serif: "Literata", Georgia, "Times New Roman", serif;
  --w-regular: 400;
  --w-medium: 500;
  --t-xs: 12px;
  --t-sm: 13px;
  --t-md: 14px;
  --t-lg: 16px;
  --t-xl: 20px;
  --t-2xl: 28px;
  --t-3xl: 36px;
  --t-kpi: 40px;
  --lh-text: 1.45;
  --lh-num: 1.1;
  --track-caps: .06em;

  /* воздух */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;

  /* форма */
  --r-0: 0;
  --r-1: 4px;
  --r-pill: 999px;

  /* оболочка */
  --rail-w: 64px;
  --top-h: 56px;
  --panel-w: 480px;
  --panel-w-wide: 720px;
  --list-min: 560px;
  --grip-w: 6px;

  /* движение */
  --d-fast: 120ms;
  --d-base: 180ms;
  --d-panel: 220ms;
  --d-close: 160ms;
  --d-num: 400ms;
  --ease: cubic-bezier(.2, .8, .2, 1);
  --ease-out: cubic-bezier(.33, 1, .68, 1);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --d-fast: 0ms;
    --d-base: 0ms;
    --d-panel: 0ms;
    --d-close: 0ms;
    --d-num: 0ms;
  }
}

:root {
  /* производные размеры: всё, что в system.css стоит в px, живёт здесь */
  --hair: 1px;
  --bar: 2px;
  --bar-3: 3px;
  --t-2xs: 11px;
  --t-3xs: 10px;
  --track-tight: -.01em;
  --track-tighter: -.02em;
  --h-btn: 36px;
  --h-btn-sm: 30px;
  --h-btn-xs: 26px;
  --h-ctl: 34px;
  --h-chip: 20px;
  --h-kbd: 18px;
  --h-crit: 40px;
  --w-logo: 36px;
  --w-rail-item: 40px;
  --w-icon-btn: 32px;
  --w-avatar: 28px;
  --w-find: 560px;
  --w-dialog: 440px;
  --w-groups: 240px;
  --w-queue: 320px;
  --w-unitpanel: 360px;
  --w-bar: 160px;
  --w-bar-sm: 120px;
  --w-key: 140px;
  --w-name: 240px;
  --w-name-sm: 200px;
  --w-toast: 360px;
  --chart-h: 96px;
  --dot-size: 6px;
  --grip-nudge: -3px;
  --icon-nudge: -3px;
  --t-ext: .85em;
  --bp-narrow: 1100px; /* @media ниже перечислено числом: var() в media не работает */
  --bp-phone: 640px;   /* то же: телефонный блок в system.css написан числом */
}