/* Дашборд дочери — токены дизайна. Сгенерировано _tmp/tokens_gen.py.
 * Версия 1.0, 2026-10-20. Только системные шрифты (C3, внешние запрещены).
 * Светлая — по умолчанию; тёмная — по настройке ОС или атрибутом data-tema.
 * Контраст проверен числом: tokens.json -> contrast (0 провалов из 54 пар).
 */

:root {
  /* --- типографика: шкала --- */
  --text-caption: 12px;
  --text-caption-line: 16px;
  --text-caption-weight: 500;
  --text-caption-track: 0.04em;
  --text-small: 14px;
  --text-small-line: 20px;
  --text-small-weight: 400;
  --text-body: 16px;
  --text-body-line: 24px;
  --text-body-weight: 400;
  --text-body-strong: 16px;
  --text-body-strong-line: 24px;
  --text-body-strong-weight: 600;
  --text-title: 20px;
  --text-title-line: 26px;
  --text-title-weight: 600;
  --text-h2: 26px;
  --text-h2-line: 32px;
  --text-h2-weight: 700;
  --text-money: 34px;
  --text-money-line: 40px;
  --text-money-weight: 700;
  --text-money-track: -0.01em;
  --text-money-lg: 44px;
  --text-money-lg-line: 48px;
  --text-money-lg-weight: 700;
  --text-money-lg-track: -0.02em;

  /* --- отступы: шаг 4 --- */
  --space-0: 2px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 48px;
  --space-10: 64px;

  /* --- радиусы --- */
  --radius-chip: 999px;
  --radius-input: 10px;
  --radius-card: 14px;
  --radius-sheet: 20px;
  --radius-hero: 24px;

  /* --- шрифты: только системные --- */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "Cascadia Mono", "Segoe UI Mono", Consolas, "Liberation Mono", monospace;

  /* --- тени: иерархия поверхностями, тень только у панелей --- */
  --shadow-sheet: 0 -8px 32px rgba(0, 0, 0, .18);
  --shadow-toast: 0 8px 24px rgba(0, 0, 0, .18);
  --duration-fast: 120ms;
  --duration: 180ms;
  --ease: cubic-bezier(.2, .7, .3, 1);
  --focus-width: 2px;
  --focus-offset: 2px;
  --touch-min: 44px;
  --control-height: 48px;

  /* --- цвет: СВЕТЛАЯ тема (по умолчанию) --- */
  --bg: #F4F6FA;
  --surface: #FFFFFF;
  --surface-2: #EDF1F7;
  --surface-3: #E2E9F3;
  --border: #D3DCE9;
  --border-strong: #6E7D93;
  --text: #101823;
  --text-2: #44526A;
  --text-3: #5C6A7E;
  --accent: #1E56C8;
  --accent-press: #17439E;
  --on-accent: #FFFFFF;
  --accent-soft: #E7EEFC;
  --on-accent-soft: #163C8C;
  --pos: #0A6B3D;
  --pos-soft: #E2F4EA;
  --on-pos-soft: #085932;
  --neg: #A6241B;
  --neg-soft: #FCEAE8;
  --on-neg-soft: #8C1D15;
  --warn: #7A4B00;
  --warn-soft: #FFF1D4;
  --on-warn-soft: #6B4200;
  --info: #34526F;
  --info-soft: #EAF0F6;
  --focus: #1E56C8;
  --focus-halo: #FFFFFF;
}

/* Тёмная — если ОС/браузер просит тёмную (Android: системная тема) */
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="svetlaya"]) {
  --bg: #0D1015;
  --surface: #161A21;
  --surface-2: #1E242D;
  --surface-3: #273039;
  --border: #313A47;
  --border-strong: #66748A;
  --text: #F2F5F9;
  --text-2: #BAC4D2;
  --text-3: #919CAC;
  --accent: #7BA6FF;
  --accent-press: #9BBCFF;
  --on-accent: #0A1019;
  --accent-soft: #1B2740;
  --on-accent-soft: #A9C4FF;
  --pos: #4FDD9C;
  --pos-soft: #12291F;
  --on-pos-soft: #7BE8B7;
  --neg: #FF9182;
  --neg-soft: #2C1714;
  --on-neg-soft: #FFB4A9;
  --warn: #FFC65C;
  --warn-soft: #2B2312;
  --on-warn-soft: #FFD98C;
  --info: #A9C4E0;
  --info-soft: #18242F;
  --focus: #9BBCFF;
  --focus-halo: #0D1015;
  }
}

/* Ручной переключатель темы: атрибут сильнее системной настройки.
   Работает и на <html>, и на отдельном блоке (нужно для макетов
   «светлая рядом с тёмной»). */
[data-tema="temnaya"] {
  --bg: #0D1015;
  --surface: #161A21;
  --surface-2: #1E242D;
  --surface-3: #273039;
  --border: #313A47;
  --border-strong: #66748A;
  --text: #F2F5F9;
  --text-2: #BAC4D2;
  --text-3: #919CAC;
  --accent: #7BA6FF;
  --accent-press: #9BBCFF;
  --on-accent: #0A1019;
  --accent-soft: #1B2740;
  --on-accent-soft: #A9C4FF;
  --pos: #4FDD9C;
  --pos-soft: #12291F;
  --on-pos-soft: #7BE8B7;
  --neg: #FF9182;
  --neg-soft: #2C1714;
  --on-neg-soft: #FFB4A9;
  --warn: #FFC65C;
  --warn-soft: #2B2312;
  --on-warn-soft: #FFD98C;
  --info: #A9C4E0;
  --info-soft: #18242F;
  --focus: #9BBCFF;
  --focus-halo: #0D1015;
}

/* Явно светлая на тёмной системе (сравнение тем в макетах) */
[data-tema="svetlaya"] {
  --bg: #F4F6FA;
  --surface: #FFFFFF;
  --surface-2: #EDF1F7;
  --surface-3: #E2E9F3;
  --border: #D3DCE9;
  --border-strong: #6E7D93;
  --text: #101823;
  --text-2: #44526A;
  --text-3: #5C6A7E;
  --accent: #1E56C8;
  --accent-press: #17439E;
  --on-accent: #FFFFFF;
  --accent-soft: #E7EEFC;
  --on-accent-soft: #163C8C;
  --pos: #0A6B3D;
  --pos-soft: #E2F4EA;
  --on-pos-soft: #085932;
  --neg: #A6241B;
  --neg-soft: #FCEAE8;
  --on-neg-soft: #8C1D15;
  --warn: #7A4B00;
  --warn-soft: #FFF1D4;
  --on-warn-soft: #6B4200;
  --info: #34526F;
  --info-soft: #EAF0F6;
  --focus: #1E56C8;
  --focus-halo: #FFFFFF;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration: 0ms;
  }
}

/* База доступности: фокус и тач-размер — не опция оформления */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: var(--focus-width) solid var(--focus);
  outline-offset: var(--focus-offset);
  border-radius: inherit;
}
button, [role="button"], input[type="submit"] {
  min-height: var(--touch-min);
}
.tabular { font-variant-numeric: tabular-nums; }