/* ==========================================================================
   ТОКЕНЫ ДИЗАЙН-СИСТЕМЫ
   Источник — design/mockup.html (версия 2.1, утверждена заказчиком).
   Дизайн-спецификация 03-design-spec.md и стайлгайд отстают от макета:
   при расхождении верен макет.

   Р-60: один шрифт, четыре размера, минимум цвета. Цветом обозначаются
   только убыток и критичное; идентичность категорий несёт подпись, а не тон.

   Светлая тема — умолчание. Тёмная объявлена дважды: настройка ОС и
   переключатель пользователя. Переключатель выигрывает.
   ========================================================================== */
:root{
  color-scheme:light;
  --canvas:#fafaf9; --panel:#fff; --layer-2:#f4f4f2; --layer-3:#ececea;
  --overlay:#fff; --scrim:rgba(20,20,19,.40);
  --ink:#141413; --ink-2:#5f5e5a; --ink-3:#8a8983; --ink-inv:#fff;
  --line:rgba(20,20,19,.09); --line-2:rgba(20,20,19,.18);
  --accent:#1f57c0; --accent-2:#17459a; --accent-bg:#eaf0fd;
  --neg:#c0322f; --neg-bg:#fbeceb;
  --d-income:#5d8ce5; --d-expense:#8f8e88; --d-profit:#1f57c0; --d-loss:#c0322f;
  --seq-1:#dbe7fb; --seq-2:#adc7f5; --seq-3:#7098e9; --seq-4:#2f66d4;
  --track:#ececea;
  --font:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --fs-1:13px; --fs-2:14px; --fs-3:20px; --fs-4:32px;
  --fw:400; --fw-med:500;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px;
  --sidebar:232px; --row-h:44px;
  --r-1:4px; --r-2:6px; --r-3:10px;
  --shadow:0 8px 28px rgba(20,20,19,.14),0 0 0 1px rgba(20,20,19,.06);
  --dur:140ms; --ease:cubic-bezier(.2,0,.2,1);
}
@media (prefers-color-scheme:dark){
  :root:where(:not([data-theme="light"])){
    color-scheme:dark;
    --canvas:#101010; --panel:#171716; --layer-2:#201f1e; --layer-3:#2a2926;
    --overlay:#201f1e; --scrim:rgba(0,0,0,.60);
    --ink:#f4f4f2; --ink-2:#a5a49e; --ink-3:#75746f; --ink-inv:#101010;
    --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.18);
    --accent:#8bb2f8; --accent-2:#b0cbfb; --accent-bg:#17253d;
    --neg:#ef7a76; --neg-bg:#2e1817;
    --d-income:#3f74c9; --d-expense:#6e6d67; --d-profit:#8bb2f8; --d-loss:#ef7a76;
    --seq-1:#1b2f56; --seq-2:#264781; --seq-3:#3163b6; --seq-4:#4a86e8;
    --track:#2a2926;
    --shadow:0 8px 28px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.08);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --canvas:#101010; --panel:#171716; --layer-2:#201f1e; --layer-3:#2a2926;
  --overlay:#201f1e; --scrim:rgba(0,0,0,.60);
  --ink:#f4f4f2; --ink-2:#a5a49e; --ink-3:#75746f; --ink-inv:#101010;
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.18);
  --accent:#8bb2f8; --accent-2:#b0cbfb; --accent-bg:#17253d;
  --neg:#ef7a76; --neg-bg:#2e1817;
  --d-income:#3f74c9; --d-expense:#6e6d67; --d-profit:#8bb2f8; --d-loss:#ef7a76;
  --seq-1:#1b2f56; --seq-2:#264781; --seq-3:#3163b6; --seq-4:#4a86e8;
  --track:#2a2926;
  --shadow:0 8px 28px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.08);
}