/* Aimify — дизайн-токены. Сгенерировано вручную 19.09.2026 по docs/DESIGN.md.
   Имена совпадают с переменными Figma (коллекции «Тема», «Размеры», «Примитивы»).
   Тёмная тема — основа (без атрибута), светлая — [data-theme="light"].
   Контраст всех текстовых токенов проверен ≥ 4.5:1 поверх стекла над самым светлым
   участком фона (страница + амбиент-пятна) — см. DESIGN.md §4. Не менять на глаз. */

/* ---------- Размеры и ритм (одинаковы в обеих темах) ---------- */
:root {
  --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;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 999px;

  --touch-min: 44px;           /* минимальная цель касания */
  --icon-sm: 16px;
  --icon-md: 20px;
  --icon-lg: 24px;
  --icon-stroke: 1.5px;

  --content-max: 1200px;       /* ширина контента на 1440 */
  --gutter: 16px;              /* боковой отступ на 390 */
  --gutter-lg: 32px;

  /* Типографика: Inter (вариативный, кириллица, табличные цифры). */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif;
  --font-features-numeric: "tnum" 1, "lnum" 1;

  --text-xs: 12px;   --leading-xs: 16px;    /* подписи осей, отметки времени */
  --text-sm: 14px;   --leading-sm: 20px;    /* вторичный текст, таблицы */
  --text-md: 16px;   --leading-md: 24px;    /* основной текст */
  --text-lg: 18px;   --leading-lg: 26px;    /* заголовок карточки */
  --text-xl: 22px;   --leading-xl: 28px;    /* заголовок раздела */
  --text-2xl: 28px;  --leading-2xl: 34px;   /* заголовок экрана */
  --text-num: 28px;  --leading-num: 32px;   /* число на плитке */
  --text-num-lg: 34px; --leading-num-lg: 40px; /* главное число */

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --tracking-tight: -0.01em;   /* заголовки ≥ 22px */
  --tracking-normal: 0;

  /* Стекло */
  --glass-blur: 20px;
  --glass-blur-strong: 28px;
  --glass-saturate: 140%;

  /* Движение */
  --motion-fast: 120ms;        /* нажатие, переключатель */
  --motion-base: 200ms;        /* наведение, появление подсказки */
  --motion-slow: 320ms;        /* шторка, модальное окно, появление карточки */
  --motion-exit: 0.7;          /* выход = 70 % от входа */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-spring: cubic-bezier(0.34, 1.3, 0.64, 1);

  --z-nav: 30;
  --z-sheet: 40;
  --z-modal: 50;
  --z-toast: 60;
}

/* ---------- Тёмная тема (основа) ---------- */
:root,
:root[data-theme="dark"] {
  color-scheme: dark;

  --bg-page: #0B1020;
  --bg-ambient-1: rgba(37, 99, 235, 0.20);   /* синее пятно */
  --bg-ambient-2: rgba(124, 58, 237, 0.14);  /* фиолетовое пятно */
  --bg-scrim: rgba(3, 6, 18, 0.60);          /* под модальными окнами */

  --surface-glass: rgba(255, 255, 255, 0.06);
  --surface-glass-hover: rgba(255, 255, 255, 0.09);
  --surface-glass-strong: rgba(17, 24, 39, 0.80);  /* навигация, шторки, модальные */
  --surface-solid: #141A2C;                        /* фолбэк без backdrop-filter */
  --surface-inset: rgba(0, 0, 0, 0.22);            /* поля ввода, полоса прогресса */
  --surface-highlight: rgba(255, 255, 255, 0.10);  /* блик по верхней кромке стекла */

  --border-glass: rgba(255, 255, 255, 0.12);
  --border-strong: rgba(255, 255, 255, 0.20);
  --border-focus: #8FBCFF;

  --text-primary: #F5F7FA;     /* ≥ 11:1 везде */
  --text-secondary: #B8C1CE;   /* ≥ 6.5:1 */
  --text-muted: #9AA4B5;       /* ≥ 4.7:1 — подписи осей, отметки времени */
  --text-on-accent: #FFFFFF;
  --text-on-status: #0B1020;   /* текст на статусной заливке в тёмной теме — тёмный */
  --text-link: #8FBCFF;

  --accent: #2F6FE4;           /* заливка кнопки; белый текст 4.65:1 */
  --accent-hover: #3B7BF0;
  --accent-pressed: #2760C9;
  --accent-text: #8FBCFF;      /* акцент как текст/иконка */
  --accent-soft: rgba(96, 165, 250, 0.16);

  --status-green: #4ADE80;     /* текст и точки */
  --status-yellow: #FACC15;
  --status-red: #FCA5A5;
  --status-green-fill: #22C55E;   /* заливки пилюль, квадратов полоски; текст на них — --text-on-status */
  --status-yellow-fill: #EAB308;
  --status-red-fill: #EF4444;
  --status-green-soft: rgba(34, 197, 94, 0.14);
  --status-yellow-soft: rgba(234, 179, 8, 0.14);
  --status-red-soft: rgba(239, 68, 68, 0.16);
  --status-none: rgba(255, 255, 255, 0.22);      /* нет отчёта */

  --chart-data: #60A5FA;                 /* единственный цвет данных, ≥ 4.7:1 к стеклу */
  --chart-data-soft: rgba(96, 165, 250, 0.18);
  --chart-plan: #94A3B8;                 /* серый пунктир плана */
  --chart-forecast: #94A3B8;             /* серый пунктир с точками */
  --chart-grid: rgba(255, 255, 255, 0.08);
  --chart-axis: #9AA4B5;
  --chart-note: #F5F7FA;                 /* маркер комментария: кольцо */
  --chart-future: rgba(255, 255, 255, 0.06);

  --shadow-glass: 0 8px 32px rgba(0, 0, 0, 0.35), inset 0 1px 0 var(--surface-highlight);
  --shadow-sheet: 0 -8px 40px rgba(0, 0, 0, 0.45);
  --shadow-focus: 0 0 0 2px var(--bg-page), 0 0 0 4px var(--border-focus);
}

/* ---------- Светлая тема ---------- */
:root[data-theme="light"] {
  color-scheme: light;

  --bg-page: #EEF1F6;
  --bg-ambient-1: rgba(37, 99, 235, 0.12);
  --bg-ambient-2: rgba(124, 58, 237, 0.08);
  --bg-scrim: rgba(15, 23, 42, 0.40);

  --surface-glass: rgba(255, 255, 255, 0.72);
  --surface-glass-hover: rgba(255, 255, 255, 0.84);
  --surface-glass-strong: rgba(255, 255, 255, 0.88);
  --surface-solid: #FFFFFF;
  --surface-inset: rgba(15, 23, 42, 0.05);
  --surface-highlight: rgba(255, 255, 255, 0.90);

  --border-glass: rgba(15, 23, 42, 0.14);
  --border-strong: rgba(15, 23, 42, 0.24);
  --border-focus: #1D4ED8;

  --text-primary: #0F172A;
  --text-secondary: #475569;   /* ≥ 6.8:1 */
  --text-muted: #5B6B82;       /* ≥ 4.9:1 */
  --text-on-accent: #FFFFFF;
  --text-on-status: #FFFFFF;   /* в светлой теме заливки тёмные — текст белый */
  --text-link: #1D4ED8;

  --accent: #2563EB;           /* белый текст 5.17:1 */
  --accent-hover: #1D4ED8;
  --accent-pressed: #1E40AF;
  --accent-text: #1D4ED8;
  --accent-soft: rgba(37, 99, 235, 0.10);

  --status-green: #166534;
  --status-yellow: #854D0E;
  --status-red: #B91C1C;
  --status-green-fill: #15803D;   /* белый текст 5.0:1 */
  --status-yellow-fill: #B45309;  /* белый текст ≥ 4.5:1 */
  --status-red-fill: #DC2626;     /* белый текст 4.8:1 */
  --status-green-soft: rgba(21, 128, 61, 0.10);
  --status-yellow-soft: rgba(180, 83, 9, 0.10);
  --status-red-soft: rgba(220, 38, 38, 0.10);
  --status-none: rgba(15, 23, 42, 0.18);

  --chart-data: #2563EB;                 /* ≥ 4.7:1 к стеклу */
  --chart-data-soft: rgba(37, 99, 235, 0.14);
  --chart-plan: #64748B;
  --chart-forecast: #64748B;
  --chart-grid: rgba(15, 23, 42, 0.07);
  --chart-axis: #5B6B82;
  --chart-note: #0F172A;
  --chart-future: rgba(15, 23, 42, 0.04);

  --shadow-glass: 0 8px 32px rgba(15, 23, 42, 0.08), inset 0 1px 0 var(--surface-highlight);
  --shadow-sheet: 0 -8px 40px rgba(15, 23, 42, 0.16);
  --shadow-focus: 0 0 0 2px var(--bg-page), 0 0 0 4px var(--border-focus);
}

/* ---------- Фолбэки ---------- */
/* Нет backdrop-filter или пользователь просит меньше прозрачности — стекло становится непрозрачным. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root, :root[data-theme="light"] {
    --surface-glass: var(--surface-solid);
    --surface-glass-hover: var(--surface-solid);
    --surface-glass-strong: var(--surface-solid);
  }
}
@media (prefers-reduced-transparency: reduce) {
  :root, :root[data-theme="light"] {
    --surface-glass: var(--surface-solid);
    --surface-glass-hover: var(--surface-solid);
    --surface-glass-strong: var(--surface-solid);
    --glass-blur: 0px;
    --glass-blur-strong: 0px;
  }
}
/* Меньше движения: длительности в ноль, пружина — линейная. Графики рисуются сразу. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-fast: 0ms;
    --motion-base: 0ms;
    --motion-slow: 0ms;
    --ease-spring: linear;
  }
}