/* ZRDK — сгенерировано из tokens.json.
 * Руками не править: правьте tokens.json и пересоберите (tools/tokens-to-css.py). */

:root {
  /* color */
  --brand-plate: #0e0f13;
  --brand-deep: #0145d9;
  --brand-blue: #0199fe;
  --brand-sky: #01b4fe;
  --brand-cyan: #01e4fe;
  --brand-mint: #80fae6;
  --brand-coral: #ff6b6b;
  --brand-charcoal: #1a1a2e;
  --accent-50: #eaf7ff;
  --accent-100: #d1eeff;
  --accent-200: #a8dffe;
  --accent-300: #6ccbfd;
  --accent-400: #01b4fe;
  --accent-500: #0199fe;
  --accent-600: #016de4;
  --accent-700: #0145d9;
  --accent-800: #0636a8;
  --accent-900: #0b2a6e;
  --accent-950: #0a1d3b;
  --neutral-50: #f7f7fa;
  --neutral-100: #f0f0f5;
  --neutral-200: #e6e7ef;
  --neutral-300: #dcdee8;
  --neutral-400: #9aa3bf;
  --neutral-500: #7c8299;
  --neutral-600: #5f6680;
  --neutral-700: #3d4560;
  --neutral-800: #26355a;
  --neutral-900: #1e2a4a;
  --neutral-950: #16213e;
  --bg: var(--neutral-100);
  --surface: #ffffff;
  --surface-2: var(--neutral-50);
  --surface-3: var(--neutral-200);
  --line: var(--neutral-300);
  --line-strong: var(--neutral-500);
  --ink: var(--brand-charcoal);
  --ink-2: var(--neutral-700);
  --ink-3: var(--neutral-600);
  --decor: #c5cbe0;
  --scrim: rgba(26, 26, 46, 0.48);
  --accent: var(--accent-600);
  --accent-hover: var(--accent-700);
  --on-accent: #ffffff;
  --accent-soft: var(--accent-50);
  --accent-ink: var(--accent-700);
  --focus: var(--accent-600);
  --focus-inner: #ffffff;
  --focus-outer: var(--focus);
  --selection: var(--accent-100);
  --success: #13865a;
  --success-soft: #e7f3ee;
  --success-ink: #0f6e4a;
  --warning: #a86200;
  --warning-soft: #f6efe6;
  --warning-ink: #8a5200;
  --danger: #c83e3e;
  --danger-soft: #faecec;
  --danger-ink: #b23535;
  --info: #0278a8;
  --info-soft: #e6f2f6;
  --info-ink: #01628c;
  --on-status: #ffffff;
  --zone-0: #666d7d;
  --zone-1: #4a6b8a;
  --zone-2: #1e63d6;
  --zone-3: #17804a;
  --zone-4: #a35f00;
  --zone-5: #c62f2f;
  --on-zone: #ffffff;
  --axis-health: #0e8f7e;
  --axis-mind: #0284c7;
  --axis-discipline: var(--brand-deep);
  --axis-beauty: #d6455a;
  --chart-1: #016de4;
  --chart-2: #0e8f7e;
  --chart-3: #d6455a;
  --chart-4: #b26a00;
  --chart-5: #5f6680;
  --chart-6: #b5487f;
  --chart-grid: var(--decor);
  --heat-1: #e3f1fd;
  --heat-2: #a8dffe;
  --heat-3: #4faef5;
  --heat-4: #016de4;
  --heat-5: #0145d9;
  --medal-gold: #f5c542;
  --medal-silver: #c0c7d4;
  --medal-bronze: #cd8a4e;
  --on-medal: var(--brand-charcoal);
  /* spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-32: 128px;
  /* radius */
  --radius-xs: 8px;
  --radius-sm: 16px;
  --radius-md: 32px;
  --radius-lg: 48px;
  --radius-pill: 999px;
  /* shadow */
  --focus-ring: 0 0 0 2px var(--focus-inner), 0 0 0 4px var(--focus-outer);
  --shadow-1: 0 2px 12px rgba(26, 26, 46, 0.06);
  --shadow-2: 0 8px 24px rgba(1, 69, 217, 0.16);
  --shadow-3: 0 24px 64px rgba(26, 26, 46, 0.22);
  /* size */
  --control-sm: 32px;
  --control-md: 40px;
  --control-lg: 48px;
  --container: 1280px;
  /* duration */
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-page: 300ms;
  --duration-enter: 540ms;
  --duration-celebrate: 1200ms;
  --stagger: 120ms;
  /* easing */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  /* zIndex */
  --z-base: 0;
  --z-sticky: 100;
  --z-overlay: 200;
  --z-modal: 300;
  --z-toast: 500;
  /* breakpoint */
  --bp-360: 360px;
  --bp-390: 390px;
  --bp-768: 768px;
  --bp-1024: 1024px;
  --bp-1280: 1280px;
  --bp-1440: 1440px;
  --bp-1920: 1920px;
  --bp-3840: 3840px;
  /* type */
  --font-sans: Inter, "Noto Sans Arabic", "Noto Sans SC", system-ui, sans-serif;
  --font-accent: "Space Grotesk", Inter, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --type-display: 700 64px/1.05 var(--font-sans);
  --type-display-tracking: -0.02em;
  --type-h1: 700 36px/1.15 var(--font-sans);
  --type-h1-tracking: -0.01em;
  --type-h2: 700 24px/1.3 var(--font-sans);
  --type-h3: 600 20px/1.35 var(--font-sans);
  --type-body: 400 16px/1.6 var(--font-sans);
  --type-body-sm: 400 14px/1.5 var(--font-sans);
  --type-label: 500 14px/1.3 var(--font-sans);
  --type-label-tracking: 0.01em;
  --type-caption: 400 12px/1.4 var(--font-sans);
  --type-caption-tracking: 0.01em;
  --type-display-number: 700 96px/1 var(--font-sans);
  --type-display-number-tracking: -0.03em;
  --type-number: 700 32px/1.1 var(--font-sans);
  --type-mono: 400 14px/1.5 var(--font-mono);
  --type-eyebrow: 500 14px/1.3 var(--font-accent);
  --type-eyebrow-tracking: 0.08em;
}

[data-theme="dark"] {
  --bg: var(--brand-charcoal);
  --surface: var(--neutral-950);
  --surface-2: var(--neutral-900);
  --surface-3: var(--neutral-800);
  --line: #2e3b5e;
  --line-strong: #6a7ba3;
  --ink: #ffffff;
  --ink-2: #c5cbe0;
  --ink-3: var(--neutral-400);
  --decor: #3a4770;
  --scrim: rgba(5, 8, 20, 0.72);
  --accent: var(--accent-400);
  --accent-hover: var(--accent-300);
  --on-accent: var(--brand-charcoal);
  --accent-soft: #123b61;
  --accent-ink: var(--brand-cyan);
  --focus: var(--brand-cyan);
  --focus-inner: var(--brand-charcoal);
  --selection: #115077;
  --success: #3dd68c;
  --success-soft: #1c3e4a;
  --success-ink: #6be3a8;
  --warning: #ffc24b;
  --warning-soft: #3b3b40;
  --warning-ink: #ffd27a;
  --danger: var(--brand-coral);
  --danger-soft: #3b2d45;
  --danger-ink: #ff8f8f;
  --info: #48dffc;
  --info-soft: #1e3f5c;
  --info-ink: #7ae8fd;
  --on-status: var(--brand-charcoal);
  --axis-health: var(--brand-mint);
  --axis-mind: var(--brand-cyan);
  --axis-discipline: var(--brand-blue);
  --axis-beauty: var(--brand-coral);
  --chart-1: #01b4fe;
  --chart-2: #80fae6;
  --chart-3: #ff6b6b;
  --chart-4: #ffc24b;
  --chart-5: #9aa3bf;
  --chart-6: #f49ac1;
  --heat-1: #1e2a4a;
  --heat-2: #0d4e8a;
  --heat-3: #016de4;
  --heat-4: #01b4fe;
  --heat-5: #80fae6;
  --shadow-1: 0 2px 12px rgba(5, 8, 20, 0.40);
  --shadow-2: 0 8px 24px rgba(5, 8, 20, 0.55);
  --shadow-3: 0 24px 64px rgba(5, 8, 20, 0.70);
}
