/* Офертум — дизайн-токены (--of-*).
   Единственный источник цветов/теней/радиусов для кабинета.
   Палитра «Stone» (2026-08): плоская и спокойная — почти белый тёплый фон,
   фирменный оранжевый чуть ярче, тени 1px вместо слоистых. Лендинг остаётся
   на своей палитре --lx-*; общая ДНК — тёплые нейтрали + оранжевый акцент.
   В правилах кабинета допускаются только var(--of-*) и color-mix() — без hex.
   Семантические цвета проверены на контраст AA к своим -soft подложкам. */

:root {
  /* Поверхности */
  --of-bg: #FAFAF9;            /* фон страницы: тёплый почти белый (stone) */
  --of-surface: #FFFFFF;       /* карточки, формы, дропдауны */
  --of-always-white: #FFFFFF;  /* белый и в тёмной теме: подложка чужих светлых виджетов (ЮKassa) и QR */
  --of-surface-2: #F3F3F1;     /* приглушённая поверхность: hover, тихие бейджи */

  /* Текст */
  --of-ink: #1C1B18;           /* основной */
  --of-muted: #5F5C55;         /* вторичный */
  --of-faint: #928E87;         /* подписи, метки */

  /* Линии */
  --of-line: #E7E5E0;          /* базовая рамка */
  --of-line-2: #D6D3CC;        /* усиленная рамка: hover, фокусные контуры */

  /* Акцент (фирменный оранжевый) */
  --of-accent: #EA580C;
  --of-accent-strong: #C2410C;
  --of-accent-soft: #FEF0E7;

  /* Семантика */
  --of-good: #0F7A55;
  --of-good-soft: #E6F6EF;
  --of-danger: #C2261B;
  --of-danger-soft: #FDECEC;

  /* Тени (плоские: тонкая граница света, без слоистых ореолов) */
  --of-shadow-sm: 0 1px 2px rgba(28, 27, 24, 0.05);
  --of-shadow-md: 0 1px 3px rgba(28, 27, 24, 0.06), 0 1px 2px rgba(28, 27, 24, 0.04);
  --of-shadow-lg: 0 4px 12px -2px rgba(28, 27, 24, 0.10), 0 2px 4px rgba(28, 27, 24, 0.05);
  --of-shadow-overlay: 0 12px 32px -8px rgba(28, 27, 24, 0.18), 0 4px 12px rgba(28, 27, 24, 0.06); /* модалки, дропдауны, поповеры */

  /* Радиусы */
  /* Радиусы: минимальные, компактные (пересмотр 2026-09 под Electron-обёртку) */
  --of-radius-sm: 4px;
  --of-radius: 6px;
  --of-radius-lg: 8px;
  --of-radius-xl: 12px;

  /* Тёмные секции (лендинг, инверсные плашки) */
  --of-ink-2: #26241F;                      /* поверхность внутри ink-секции */
  --of-accent-on-dark: #F59E6B;             /* акцентный текст на ink (AA) */
  --of-on-dark-muted: rgba(244, 240, 233, 0.62);
  --of-on-dark-faint: rgba(244, 240, 233, 0.42);

  /* Маркетинговые радиусы (лендинг) */
  --of-radius-2xl: 16px;
  --of-radius-3xl: 24px;

  /* Шкала отступов (база 4) */
  --of-space-1: 4px;  --of-space-2: 8px;  --of-space-3: 12px; --of-space-4: 16px;
  --of-space-5: 20px; --of-space-6: 24px; --of-space-8: 32px; --of-space-10: 40px;
  --of-space-12: 48px; --of-space-16: 64px; --of-space-24: 96px; --of-space-30: 120px;

  /* Типографическая шкала */
  --of-text-display: 72px; --of-text-h1: 44px; --of-text-h2: 28px; --of-text-h3: 20px;
  --of-text-lead: 20px;    --of-text-body: 16px; --of-text-ui: 14px; --of-text-table: 13px;
  --of-text-caption: 12px; --of-text-micro: 11px;

  /* Шрифты: Onest и JetBrains Mono подключаются в layouts/_meta (Google Fonts, swap);
     без сети остаётся системный стек с близкими метриками */
  --of-sans: "Onest", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --of-mono: "JetBrains Mono", ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  /* Серифный дисплей: на лендинге — заголовки, в кабинете — только словесный знак «Офертум».
     Лендинг грузит 4 начертания, кабинет — одно (500) в layouts/cabinet */
  --of-serif: "Playfair Display", Georgia, "Times New Roman", serif;
}

/* Журнальный лендинг: бумага вместо stone, линии темнее, серифный дисплей.
   Кабинет этих переопределений не видит — они живут только под .landing-page. */
.landing-page {
  --of-paper: #F4F0E9;
  --of-paper-2: #ECE6DC;
  --of-rule: var(--of-ink);
  --of-line: #D9D2C7;
  --of-line-2: #C9C1B4;
  --of-accent-soft: #FBE9DC;
  --of-good-soft: #E3F1E9;
  --of-danger-soft: #F9E4E2;
}

/* Тёмная тема: html[data-theme="dark"]. Включает мини-приложение Telegram по теме Telegram
   (miniapp_controller.js — Telegram.WebApp.colorScheme); кабинет data-theme пока не ставит. Тёплая
   графитовая гамма в тон светлой: те же роли токенов, акцент светлее для контраста на тёмном. */
:root[data-theme="dark"] {
  color-scheme: dark;
  --of-bg: #151412;
  --of-surface: #1F1D1A;
  --of-surface-2: #2A2824;
  --of-ink: #F2EFEA;
  --of-ink-2: #E4E0D8;
  --of-muted: #B5AFA5;
  --of-faint: #8A847A;
  --of-line: #34312C;
  --of-line-2: #46423B;
  --of-accent: #F26B1F;
  --of-accent-strong: #F59E6B;
  --of-accent-soft: #3A2417;
  --of-good: #4CC38A;
  --of-good-soft: #17301F;
  --of-danger: #F07167;
  --of-danger-soft: #3A1C1A;
  --of-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --of-shadow-md: 0 1px 3px rgba(0, 0, 0, 0.45), 0 1px 2px rgba(0, 0, 0, 0.3);
  --of-shadow-lg: 0 4px 12px -2px rgba(0, 0, 0, 0.5), 0 2px 4px rgba(0, 0, 0, 0.3);
  --of-shadow-overlay: 0 12px 32px -8px rgba(0, 0, 0, 0.6), 0 4px 12px rgba(0, 0, 0, 0.35);
}