/* Токены дизайн-системы «Ситисканнер», тема light. Сгенерировано tools/make_tokens_css.py — не править руками. */

:root {
  --brand-ultramarine: #3040e0;
  --brand-night: #0e1236;
  --brand-lime: #c8f169;
  --brand-fog: #eef0ff;
  --brand-white: #ffffff;
  --logo-ring: #3040e0;
  --logo-accent: #3040e0;
  --logo-ink: #0e1236;
  --surface: #ffffff;
  --surface-subtle: #f3f4f9;
  --surface-raised: #ffffff;
  --surface-tint: #eef0ff;
  --surface-brand: #3040e0;
  --surface-night: #0e1236;
  --on-brand: #ffffff;
  --on-brand-muted: #e0e5fe;
  --on-brand-accent: #c8f169;
  --ink: #0e1236;
  --ink-muted: #5d637d;
  --ink-disabled: #989eb2;
  --line: #d9dce7;
  --line-strong: #797f96;
  --accent: #3040e0;
  --accent-hover: #2633b8;
  --accent-pressed: #1e298e;
  --accent-soft: #e0e5fe;
  --on-accent: #ffffff;
  --link: #3040e0;
  --link-hover: #2633b8;
  --highlight: #c8f169;
  --on-highlight: #0e1236;
  --focus: #3040e0;
  --success: #03734a;
  --success-soft: #dff8e6;
  --warning: #995b03;
  --warning-soft: #ffeed2;
  --danger: #be222d;
  --danger-soft: #fee9e8;
  --info: #3040e0;
  --info-soft: #eef0ff;
  --ultramarine-50: #eef0ff;
  --ultramarine-100: #e0e5fe;
  --ultramarine-200: #c7d2ff;
  --ultramarine-300: #a3b7fe;
  --ultramarine-400: #7693fe;
  --ultramarine-500: #4c67fe;
  --ultramarine-600: #3040e0;
  --ultramarine-700: #2633b8;
  --ultramarine-800: #1e298e;
  --ultramarine-900: #161e66;
  --night-25: #f9fafd;
  --night-50: #f3f4f9;
  --night-100: #e9ebf3;
  --night-200: #d9dce7;
  --night-300: #bfc3d3;
  --night-400: #989eb2;
  --night-500: #797f96;
  --night-600: #5d637d;
  --night-700: #434a66;
  --night-800: #2c3352;
  --night-900: #1b2142;
  --night-950: #0e1236;
  --lime-50: #f2fbe2;
  --lime-100: #e6f9c5;
  --lime-200: #d7f69b;
  --lime-300: #c8f169;
  --lime-400: #b5e347;
  --lime-500: #9cca31;
  --lime-600: #7ca621;
  --lime-700: #5e8218;
  --lime-800: #456313;
  --lime-900: #334b0f;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;
  --shadow-sm: 0 1px 2px #0e12360f, 0 1px 3px #0e12361a;
  --shadow-md: 0 4px 12px #0e123614, 0 2px 4px #0e12360f;
  --shadow-lg: 0 16px 40px #0e12361f, 0 4px 12px #0e123614;
  --focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px #3040e0;
  --control-sm: 32px;
  --control-md: 40px;
  --control-lg: 48px;
  --icon-sm: 16px;
  --icon-md: 20px;
  --icon-lg: 24px;
  --header-height: 72px;
  --container: 1200px;
  --container-text: 720px;
  --grid-columns: 12;
  --grid-gutter: 24px;
  --breakpoint-sm: 640px;
  --breakpoint-md: 960px;
  --breakpoint-lg: 1280px;
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 320ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --font-display: "Geologica Sharp", "Geologica", system-ui, sans-serif;
  --font-sans: "Geologica", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

@font-face {
  font-family: "Geologica";
  src: url("../fonts/Geologica-VF.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Geologica Sharp";
  src: url("../fonts/GeologicaSharp-VF.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

.display-xl { font-family: var(--font-display); font-size: 72px; line-height: 76px; font-weight: 700; letter-spacing: -0.025em; }
.display { font-family: var(--font-display); font-size: 56px; line-height: 60px; font-weight: 700; letter-spacing: -0.02em; }
.heading-1 { font-family: var(--font-display); font-size: 40px; line-height: 48px; font-weight: 700; letter-spacing: -0.015em; }
.heading-2 { font-family: var(--font-display); font-size: 32px; line-height: 40px; font-weight: 600; letter-spacing: -0.01em; }
.heading-3 { font-family: var(--font-display); font-size: 24px; line-height: 32px; font-weight: 600; letter-spacing: -0.005em; }
.heading-4 { font-family: var(--font-display); font-size: 20px; line-height: 28px; font-weight: 600; }
.metric { font-family: var(--font-display); font-size: 44px; line-height: 48px; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.lead { font-family: var(--font-sans); font-size: 20px; line-height: 30px; font-weight: 400; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; }
.body-sm { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }
.label { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 500; }
.caption { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 400; }
.overline { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.data { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; font-variant-numeric: tabular-nums; }
.data-strong { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 600; font-variant-numeric: tabular-nums; }
@media (max-width: 640px) {
  .display-xl { font-size: 40px; line-height: 44px; }
  .display { font-size: 36px; line-height: 40px; }
  .heading-1 { font-size: 32px; line-height: 40px; }
}