/*
 * Токены сайта knowrianism.org (design/SITE-EMBED.adoc, «Одна палитра с кабинетом»).
 * Все цвета сайта живут здесь; styles.css берёт их только через var().
 *
 * Общие токены — те же имена и значения, что в src/styles/tokens.css кабинета: человек видит
 * одну палитру на сайте и после входа. qa/check-site.cjs сверяет их с кабинетом посимвольно.
 *
 * Свои токены сайта — имена из варианта design/site-v2, значения подстроены под бренд кабинета:
 *   --art-*        — подложка иллюстрации и витрины (декор);
 *   --clay         — карточка ERP;  --closing — финальный блок;
 *   --deep*        — тёмная полоса (шаги, обогащение) — одинаковая в обеих темах;
 *   --preview-*    — тёмная плашка; служебная полоса прототипа не переехала, токены оставлены
 *                    ради пар контраста в проверке (PAIRS в qa/check-site.cjs);
 *   --image-bg     — фон под снимками интерфейса (снимки светлые, тема их не меняет);
 *   --backdrop     — затемнение под просмотром снимка;
 *   --shadow*      — тени.
 *
 * Тема — системная, только CSS, как в кабинете: светлая на :root, тёмная под
 * @media (prefers-color-scheme: dark) с охраной :root:not([data-theme="light"]) и такой же блок
 * :root[data-theme="dark"]. Оба тёмных блока обязаны совпадать — проверка сверяет их.
 */

:root {
  color-scheme: light;

  /* Нейтральные — как в кабинете */
  --bg: #faf7f2;
  --bg-subtle: #f3ede4;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --border: #e8e0d4;
  --border-strong: #d6cab9;
  --text: #221c16;
  --text-muted: #6f655a;
  --text-faint: #9a8f82; /* только декор — НЕ для смыслового текста */

  /* Бренд — как в кабинете */
  --brand: #b5571c;
  --brand-hover: #9c4a17;
  --brand-soft: #f8e9dc;
  --brand-contrast: #ffffff;
  --focus: #d4691f;

  /* Смысловые — как в кабинете */
  --ok: #2b7350;
  --ok-soft: #e5f2ea;
  --warn: #9a5f0c;
  --warn-soft: #fbf0da;
  --danger: #b3261e;
  --danger-soft: #fbe6e4;
  --info: #2f5f8a;
  --info-soft: #e6eef7;

  /* Обложки продуктов — токены витрины кабинета */
  --cover-pim-from: #ffd08a;
  --cover-pim-to: #f39a3d;
  --cover-pim-ink: #3d2210;
  --cover-erp-from: #f0b48e;
  --cover-erp-to: #b9582c;
  --cover-erp-ink: #fff7ef;

  /* Свои токены сайта */
  --art-from: #f6e3cf;
  --art-to: #eccaa6;
  --art-line: #c28b5c;
  --clay: #f1e6da;
  --closing: #f6e8da;
  --deep: #221c16;
  --deep-text: #f2ece5;
  --deep-muted: #a99f93;
  --deep-accent: #f59d5c;
  --deep-line: #3d342b;
  --deep-surface: #2d241b;
  --preview-bg: #221c16;
  --preview-text: #c9beb1;
  --preview-active: #faf7f2;
  --preview-line: #463e35;
  --image-bg: #ffffff;
  --backdrop: rgb(20 18 16 / 0.88);
  --shadow-small: 0 1px 2px rgb(34 28 22 / 0.05);
  --shadow: 0 1px 2px rgb(34 28 22 / 0.05), 0 12px 32px rgb(34 28 22 / 0.08);
  --shadow-window: 0 24px 64px rgb(34 28 22 / 0.14), 0 2px 4px rgb(34 28 22 / 0.06);

  /* Шрифты — свои woff2 сайта (assets/fonts/) */
  --font-sans: 'Onest', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  /* Размеры и движение */
  --max: 1280px;
  --speed: 160ms;
  --ease: cubic-bezier(0.2, 0.7, 0.3, 1);
}

/* «Как в системе»: тёмная, если система тёмная и тема не закреплена светлой */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;

    --bg: #141210;
    --bg-subtle: #1a1714;
    --surface: #1d1a16;
    --surface-raised: #25211c;
    --border: #332d27;
    --border-strong: #463e35;
    --text: #f2ece5;
    --text-muted: #a99f93;
    --text-faint: #7d746a;

    --brand: #ee8b45;
    --brand-hover: #f59d5c;
    --brand-soft: #3a2716;
    --brand-contrast: #1a0f06;
    --focus: #f59d5c;

    --ok: #5cc28d;
    --ok-soft: #17291f;
    --warn: #f0b45a;
    --warn-soft: #33260f;
    --danger: #f2877f;
    --danger-soft: #3a1a17;
    --info: #82b0dc;
    --info-soft: #172331;

    --cover-pim-from: #6b4318;
    --cover-pim-to: #a85f1c;
    --cover-pim-ink: #ffe3bf;
    --cover-erp-from: #5c2f1c;
    --cover-erp-to: #8f4024;
    --cover-erp-ink: #ffe6d6;

    --art-from: #2f251c;
    --art-to: #4d3424;
    --art-line: #8a5c36;
    --clay: #2a231d;
    --closing: #2d2219;
    --shadow-small: 0 1px 2px rgb(0 0 0 / 0.20);
    --shadow: 0 1px 2px rgb(0 0 0 / 0.20), 0 12px 32px rgb(0 0 0 / 0.16);
    --shadow-window: 0 24px 64px rgb(0 0 0 / 0.40), 0 2px 4px rgb(0 0 0 / 0.20);
  }
}

/* Закреплённая тёмная — для проверок; значения те же, что выше */
:root[data-theme="dark"] {
  color-scheme: dark;

  --bg: #141210;
  --bg-subtle: #1a1714;
  --surface: #1d1a16;
  --surface-raised: #25211c;
  --border: #332d27;
  --border-strong: #463e35;
  --text: #f2ece5;
  --text-muted: #a99f93;
  --text-faint: #7d746a;

  --brand: #ee8b45;
  --brand-hover: #f59d5c;
  --brand-soft: #3a2716;
  --brand-contrast: #1a0f06;
  --focus: #f59d5c;

  --ok: #5cc28d;
  --ok-soft: #17291f;
  --warn: #f0b45a;
  --warn-soft: #33260f;
  --danger: #f2877f;
  --danger-soft: #3a1a17;
  --info: #82b0dc;
  --info-soft: #172331;

  --cover-pim-from: #6b4318;
  --cover-pim-to: #a85f1c;
  --cover-pim-ink: #ffe3bf;
  --cover-erp-from: #5c2f1c;
  --cover-erp-to: #8f4024;
  --cover-erp-ink: #ffe6d6;

  --art-from: #2f251c;
  --art-to: #4d3424;
  --art-line: #8a5c36;
  --clay: #2a231d;
  --closing: #2d2219;
  --shadow-small: 0 1px 2px rgb(0 0 0 / 0.20);
  --shadow: 0 1px 2px rgb(0 0 0 / 0.20), 0 12px 32px rgb(0 0 0 / 0.16);
  --shadow-window: 0 24px 64px rgb(0 0 0 / 0.40), 0 2px 4px rgb(0 0 0 / 0.20);
}
