/* Цвета сайта — токены светлой и тёмной темы. Разметка, логика страницы и сцены
   ссылаются на них через var(--…); цвет меняют здесь, а не в коде.
   Тему выбирает js/theme.js до первой отрисовки: атрибут data-theme="light|dark"
   на <html> («авто» — как в системе, prefers-color-scheme).
   Токены двух видов. Оболочка страницы (--shell…) — фон страницы, шапка, текст прямо
   на фоне страницы, кнопки на нём и подвал: в тёмной теме меняются только они.
   Содержимое — цветные блоки, сцены, карточки, клиенты, окно заявки — во всех темах
   одно и то же, ровно как в светлой (tests/theme.mjs, кейс б, сравнивает по пикселям).
   Светлая тема — ровно прежние цвета сайта (tests/shots.mjs сравнивает по пикселям,
   tests/scenes-equal.mjs подставляет значения отсюда в сцены). Пары «текст — фон»
   оболочки считает tests/theme-contrast.py. */
:root{
  color-scheme:light;
  /* оболочка страницы — в тёмной теме своя (блок ниже) */
  --shell:#FBFAF8;            /* фон страницы */
  --shell-rgb:251,250,248;    /* полупрозрачная шапка */
  --shell-ink:#1F1D2B;        /* текст на фоне страницы: шапка, первый экран, заголовки разделов, подвал */
  --shell-ink-rgb:31,29,43;   /* полоса прокрутки страницы */
  --shell-text2:#5E5A6B;      /* вторичный текст на фоне страницы, пункты меню */
  --shell-line:#E7E3DC;       /* линия под шапкой, над контактами и подвалом */
  --shell-hover:#F0ECE6;      /* наведение на тумблер темы */
  --shell-btn:#1F1D2B;        /* кнопки «Обсудить идею» на фоне страницы */
  --shell-btn-hover:#33303F;
  --shell-on-btn:#FBFAF8;     /* текст на них */
  --shell-mark:#CFC4FF;       /* выделение «Включили.» в заголовке первого экрана */
  /* содержимое: одинаково во всех темах */
  --page:#FBFAF8;          /* фон окна заявки, ячеек клиентов, кнопок контактов */
  --surface:#FFFFFF;       /* карточки, поля ввода */
  --paper-rgb:255,255,255; /* полупрозрачные подложки на блоках разделов */
  --ink:#1F1D2B;           /* основной текст, линии, тёмные кнопки */
  --ink-rgb:31,29,43;      /* полупрозрачные линии и рамки */
  --ink-hover:#33303F;     /* наведение на кнопку цвета ink */
  --on-ink:#FBFAF8;        /* текст и значки на кнопке цвета ink */
  --text2:#5E5A6B;         /* вторичный текст */
  --text3:#8A8698;         /* шаги под сценой, ещё не пройденные */
  --line:#E7E3DC;          /* разделители, рамки, выключенная кнопка */
  --line-strong:#B9B2A8;   /* рамка при наведении, пустой флажок */
  --grip:#D8D3CB;          /* ручка шторки на телефоне */
  --hover:#F0ECE6;         /* наведение на кнопку-контур */
  --hover-soft:#F3F0EA;    /* наведение на ячейку «Следующий — ваш проект» */
  --shadow-rgb:31,29,43;   /* тени и затемнение под окном */
  --ok:#1D5E45;            /* подсказка «всё верно» в заявке */
  --err:#85224F;           /* ошибки в заявке */
  --lamp:#FFE38A;          /* горящая лампа: рубильник заявки, лампы в сценах */
  --lever:#FFC9B0;         /* площадка рубильника, когда заявку можно отправить */
  --soft-btn:#E8E3FF;       /* светлая кнопка «Оставить заявку» */
  --soft-btn-hover:#DCD5FF;
  /* сцены (js/scenes/): белые заливки, серый, линии */
  --sc-w:#FFFFFF;
  --sc-m:#5E5A6B;
  --sc-ink:#1F1D2B;
  --sc-off:#F1ECE6;        /* неактивная клетка */
  --sc-gold:#ECD7A9;       /* золото эмблемы */
  /* направления: bg — фон блока, p — второй тон, m — глубокий тон, s — светлая
     подложка сцены, dot — метка в меню и полоса прогресса; ключи — палитры сцен
     (Z в js/scenes/core.js) */
  --int-bg:#FFE6DA;  --int-p:#FFC9B0;  --int-m:#FFAF8C;  --int-s:#FFF4EE;  --int-dot:#FFC9B0;
  --ai-bg:#E8E3FF;   --ai-p:#CFC4FF;   --ai-m:#B6A8FA;   --ai-s:#F4F1FF;  --ai-l:#E8E2FF;  --ai-dot:#CFC4FF;
  --bot-bg:#DDEEFF;  --bot-p:#B9DCFF;  --bot-m:#93C8FB;  --bot-s:#F0F7FF;  --bot-dot:#B9DCFF;
  --fin-bg:#FFF3CC;  --fin-p:#FFE38A;  --fin-m:#F9D35E;  --fin-s:#FFFAE8;  --fin-dot:#FFE38A;
                     --vpn-p:#D9E3A3;  --vpn-m:#C5D27C;  --vpn-s:#F8FAEB;
  --game-bg:#FCE1EC; --game-p:#F7BCD4; --game-m:#F09ABD; --game-s:#FEF1F6;  --game-dot:#F7BCD4;
                     --web-p:#B5E6D2;  --web-m:#8FD7B9;  --web-s:#EFFAF5;
}

/* Тёмная — меняется только оболочка: графит вместо бумаги, светлый текст на нём,
   светлая кнопка с тёмным текстом. Содержимое остаётся светлым, как днём. */
:root[data-theme=dark]{
  color-scheme:dark;
  --shell:#15141B;
  --shell-rgb:21,20,27;
  --shell-ink:#F2EEF7;
  --shell-ink-rgb:242,238,247;
  --shell-text2:#A9A3B8;
  --shell-line:#2E2B38;
  --shell-hover:#282534;
  --shell-btn:#F2EEF7;
  --shell-btn-hover:#D9D3E3;
  --shell-on-btn:#15141B;
  --shell-mark:#4A3F7A;
}
