/* Гарнитура интерфейса. Один файл, переменная ось веса 400–700, латиница +
   кириллица + пунктуация. Строгий CSP (`font-src 'self'`) запрещает внешние
   origin, поэтому шрифт отдаётся из статики приложения; происхождение,
   лицензия и параметры сборки подмножества — app/static/fonts/README.md.
   `font-display: swap` — текст читается сразу системным стеком и заменяется
   без блокировки рендера; `<link rel="preload">` в base.html сокращает окно
   подмены. Имя семейства совпадает с первым шрифтом `--font-sans`, поэтому
   при недоступности файла работает тот же системный fallback, что и раньше. */
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/inter-var.woff2") format("woff2");
}

:root {
  color-scheme: light;
  --color-bg: #eef3f8;
  --color-ink: #090b12;
  --color-surface: #ffffff;
  --color-surface-soft: #f8fbff;
  --color-surface-muted: #edf3fa;
  --color-text: #111827;
  --color-text-muted: #5b6577;
  --color-meta: #2563eb;
  --color-border: #d9e2ec;
  --color-border-strong: #bdcad8;
  --color-accent: #60a5fa;
  --color-accent-on: #06101d;
  --color-accent-hover: #4d97ef;
  /* Акцент как заливка кнопки читается на тёмном тексте, но как ЦВЕТ ТЕКСТА
     на белом даёт 2.5:1 — ниже WCAG AA. Ссылки и телефоны используют этот
     отдельный токен (6.7:1 на белом). */
  --color-link: #1d4ed8;
  --color-success: #22c55e;
  --color-warn: #f59e0b;
  --color-danger: #e11d48;
  --shadow-soft: 0 18px 60px rgb(9 11 18 / 0.08);
  --shadow-panel: 0 24px 72px rgb(9 11 18 / 0.10);
  --focus-ring: 0 0 0 4px rgb(96 165 250 / 0.28);
  /* Единственная длительность микропереходов состояний (hover, focus-visible,
     active у кнопок, ссылок и полей). Кривая — `ease`, без отскока; при
     prefers-reduced-motion переходы отключаются целиком (конец app.css). */
  --motion-duration: 150ms;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 9999px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "SF Mono", ui-monospace, Menlo, Consolas, monospace;
  --text-xs: 12px;
  --text-sm: 14px;
  --text-base: 16px;
  --text-lg: 18px;
  --text-xl: 24px;
  --text-2xl: 36px;
  /* Весовая шкала: роли, а не числа. Ровно четыре ступени — иерархия делается
     весом и цветом, не размером.
       body    400  тело: текст, значения полей, ячейки таблиц, подсказки;
       strong  500  усиленный текст: значения карточек (dd), выделенные строки;
       accent  600  акцент: метки категорий, кнопки, вкладки, ссылки в таблицах;
       heading 700  заголовки секций и категорий.
     Значения выбраны так, чтобы иерархия сохранялась и без Inter: системный
     стек сводит 400/500 к обычному начертанию, а 600/700 — к полужирному,
     поэтому заголовок остаётся заметно тяжелее тела в любом случае. */
  --weight-body: 400;
  --weight-strong: 500;
  --weight-accent: 600;
  --weight-heading: 700;
  --leading-body: 1.5;
  --leading-tight: 1.08;
  --container-max: 2320px;
  /* Брейкпоинты: единственный источник значений. Четыре именованные точки
     несут общее поведение оболочки и списков:
       phone   520  телефон: компактная обвязка, тач-минимумы, 16px в полях;
       mobile  768  крупный телефон/планшет: фильтры перестают быть колонкой;
       shell   920  граница оболочки: слева от неё мобильный shell (drawer,
                    скрытые section-tabs), справа — десктопная навигация;
       dense  1280  плотный десктоп: таблицы вместо карточек, двухколоночные
                    карточки-детали.
     Правило записи: «ниже точки» — `max-width: <N - 0.02>px`, «от точки и
     выше» — `min-width: <N>px`; пара покрывает ось без зазора. CSS не
     подставляет var() внутрь условия @media, поэтому в `app.css` значения
     повторены литералами, и каждый @media подписан именем точки.

     Сверх шкалы в `app.css` осталось ровно три порога, привязанных не к классу
     устройства, а к ширине конкретного контента. Свести их к шкале нельзя без
     потери плотности на реальных ширинах, поэтому они помечены как исключения
     и объяснены по месту:
       tablet    1024  правая колонка карточки маршрута/курьера и однострочная
                       панель фильтров маршрутов;
       laptop    1180  однострочная панель фильтров заявок и финансов,
                       четыре коротких поля реквизитов в ряд;
       ultrawide 2200  четвёртая колонка сводных плиток внутри --container-max.
     Новые пороги вне этого списка не заводятся: сначала шкала. */
  --bp-phone: 520px;
  --bp-mobile: 768px;
  --bp-shell: 920px;
  --bp-dense: 1280px;
}
