/* Общие стили юридических страниц: /privacy, /consent, /offer.
   СВЕТЛАЯ ТЕМА + «ПРЕМИАЛЬНЫЙ БЛАНК» (03.09.2026, две правки владельца за
   вечер). Значения - светлая палитра свода (04_Цветовая_система.md, раздел 2).

   УСТРОЙСТВО ЛИСТА. Разметка страниц не менялась, обёртки в HTML нет - поэтому
   полем служит <html>, а листом сам <body>: белый, со скруглением и мягкой
   тенью, по центру серо-голубого паспарту. На узких экранах паспарту исчезает
   (лист от края до края) - поля ради полей на телефоне не нужны.

   УРОК ПЕРВОЙ СВЕТЛОЙ ВЕРСИИ: sunken #F0F2F5 на поле #EEF2F7 неразличим -
   врезка «note» пропала, поймал владелец по скриншоту. В тёмной теме
   поверхности расходились сильнее. Правило на будущее: sunken работает
   ТОЛЬКО на белой карточке, класть его на поле страницы нельзя.

   Имена переменных прежние. Меняешь этот файл - меняй метку ?v= в трёх
   страницах, иначе из-за кэша (час) правка доедет до людей вразнобой. */
:root{
  color-scheme: light;
  --surface-page:#EEF2F7; --surface-card:#FFFFFF; --surface-sunken:#F0F2F5;
  --text-primary:#22262E; --text-secondary:#696E76; --text-muted:#6E747E;
  --border:#E3E6EB; --border-strong:#D8DDE5;
  /* Акцент по правилу «заливка и текст»: --accent - только заливка,
     строкой текста - --accent-text (accent-ink Школы, 4,7:1). */
  --accent:#4067F8; --accent-bg:#E7ECFE; --accent-text:#3A5CEB;

  /* ЗНАК УСПЕХА И БЕДЫ (18.09.2026). Страницы документов их УЖЕ звали -
     метка «Цена запуска» на оплате, зеленый знак «Оплачено», красный знак
     отмены, - а объявления не было ни одного: браузер на неизвестный токен
     не ругается, он просто не применяет свойство. Метка выходила без фона,
     знак итога без цвета. Ровно так же 18.09 пропала красная кнопка окна
     отвязки карты: тогда цвет вписали числом в одном месте, а четыре соседних
     токена остались ненайденными. Значения - светлая палитра свода
     (04_Цветовая_система.md, раздел 2), те же, что у приложения в светлой теме.
     Сторожит tests/tokeny-obyavleny.test.mjs. */
  --success:var(--accent-text); --success-bg:var(--accent-bg); --success-text:var(--accent-text);
  --warning:var(--text-secondary); --warning-bg:var(--surface-sunken); --warning-text:var(--text-primary);
  --danger:#C43D30;  --danger-bg:#FBE9E7;  --danger-text:#8E2A21;
  --success-fill:var(--accent); --warning-fill:var(--text-secondary); --danger-fill:#C43D30;

  /* ШКАЛА КЕГЛЕЙ - те же шесть ступеней, что в shared/theme.css. Документы
     звали --fs-title и --fs-sub из разметки и не получали ничего. Значения
     сверяются с источником тем же сторожем. */
  --fs-display:26px; --fs-title:20px; --fs-body:17px;
  --fs-sub:15px;     --fs-cap:13px;   --fs-micro:11px;
}
*{box-sizing:border-box}

/* УСТРОЙСТВО ЛИСТА - С ТРЕТЬЕЙ ПОПЫТКИ, и почему именно так (03.09.2026).
   Попытка 1: body как белая карточка с радиусом и тенью. Попытка 2: то же
   без радиуса и тени. Обе ломались одинаково: у центрированного body
   (margin+max-width) браузер отключает «пропагацию» фона на вьюпорт и
   рисует body обычным элементом - а элемент высотой 14 000+ px на ретине
   не влезает в предел текстуры (16384) и НЕ РИСУЕТСЯ ВОВСЕ: при прокрутке
   вглубь страница становилась сплошным полем. Диагноз ставился цветовым
   опытом: html красный, body жёлтый - кадр целиком красный.
   Поэтому лист - НЕ элемент контента, а фиксированный столб html::before
   размером с ЭКРАН: пределов текстуры для него не существует, контент
   прокручивается поверх. Лист получается «рулонным» - без верхней и нижней
   кромки; для бумаги это честно. */
html{background:var(--surface-page); margin:0; padding:0}
html::before{content:''; position:fixed; top:0; bottom:0; left:50%;
  transform:translateX(-50%); width:min(720px, 100vw);
  background:var(--surface-card);
  border-left:0.5px solid var(--border-strong);
  border-right:0.5px solid var(--border-strong)}
body{
  position:relative;                 /* контент поверх столба-листа */
  margin:0 auto; max-width:720px; background:transparent;
  color:var(--text-primary);
  line-height:1.6; font-size:var(--fs-sub);
  font-family:var(--font-text, -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif);
  -webkit-font-smoothing:antialiased;
  padding:36px 44px 40px;
}

/* шапка бланка: бренд заголовочным шрифтом, редакция - капсулой справа.
   18 px у бренда - это знак, а не текст шкалы: ступени к нему не относятся. */
.top{display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding-bottom:20px; border-bottom:0.5px solid var(--border)}
.top a.brand{color:var(--text-primary); text-decoration:none; font-weight:700;
  font-size:18px; letter-spacing:.06em; font-family:var(--font-head)}
/* Знак приложения «Три и искра» перед словом (2026-09-24). На юрдокументах слова без знака:
   их HTML – архивная редакция, и правка разметки переписала бы запись о принятом тексте. */
.top a.brand{display:inline-flex; align-items:center; gap:8px}
.top a.brand img{width:24px; height:24px; flex:none}
.top a.brand:has(img){letter-spacing:-.2px}
.top .rev{font-size:var(--fs-cap); line-height:1.35; color:var(--text-secondary);
  text-align:right; white-space:nowrap;
  background:var(--surface-sunken); border:0.5px solid var(--border);
  border-radius:12px; padding:6px 12px}

/* ТРИ СТУПЕНИ ШКАЛЫ НА ЭКРАН: 20 / 15 / 13 (разбор дизайном 24.09.2026,
   КОД_ДИЗАЙНА §3). До него здесь жило девять кеглей мимо шкалы (12.5, 14.5,
   15.5, 16, 19, 24, 28...). Заголовок страницы - Title, разделы - тем же
   кеглем, что текст, но заголовочной гарнитурой и весом: различие весом,
   а не размером. Служебное - Caption. H1 - один на страницу. */
h1{font-size:var(--fs-title); font-weight:700; letter-spacing:-.4px; line-height:1.25; margin:28px 0 8px}
h2{font-size:var(--fs-sub); font-weight:700; letter-spacing:-.1px; line-height:1.4; margin:36px 0 12px; scroll-margin-top:16px}
h3{font-size:var(--fs-sub); font-weight:600; margin:24px 0 8px}
.lead{font-size:var(--fs-sub); color:var(--text-secondary); margin:0 0 4px}

p{margin:0 0 12px}
ul,ol{margin:0 0 12px; padding-left:20px}
li{margin-bottom:8px}
li::marker{color:var(--text-muted)}
strong{font-weight:600}
a{color:var(--accent-text); text-underline-offset:2px}
hr{border:none; border-top:0.5px solid var(--border); margin:32px 0}

/* врезка «коротко о главном»: на белом листе - утопленная панель.
   (Раньше была белой карточкой и спорила с самим документом за главность.) */
.tldr{background:var(--surface-sunken); border:0.5px solid var(--border);
  border-radius:16px; padding:16px 20px 8px; margin:24px 0 8px}
.tldr h2{margin:0 0 12px}
.tldr ul{padding-left:20px}
.tldr li{font-size:var(--fs-sub); color:var(--text-secondary)}
.tldr li strong{color:var(--text-primary)}

/* заметка/предупреждение: утопленная, с чёткой рамкой - «слившийся note»
   больше не повторяем (см. шапку файла) */
.note{background:var(--surface-sunken); border:0.5px solid var(--border);
  border-radius:16px; padding:12px 16px; margin:16px 0;
  font-size:var(--fs-sub); color:var(--text-secondary)}
.note strong{color:var(--text-primary)}

/* таблицы: шапка подложкой, рамка тонкая - как ведомость на бланке */
.tw{overflow-x:auto; -webkit-overflow-scrolling:touch; margin:0 0 16px;
  border:0.5px solid var(--border); border-radius:12px}
table{border-collapse:collapse; width:100%; min-width:420px; font-size:var(--fs-cap)}
th,td{text-align:left; vertical-align:top; padding:12px 16px;
  border-bottom:0.5px solid var(--border)}
/* Шапка таблицы - 13/600 строчными, как подпись группы во всех модулях:
   капс вразрядку снят (КОД_ДИЗАЙНА §9.3). */
th{font-size:var(--fs-cap);
  color:var(--text-secondary); font-weight:600; white-space:nowrap;
  background:var(--surface-sunken)}
tr:last-child td{border-bottom:none}
td:first-child{color:var(--text-primary)}
td{color:var(--text-secondary)}

/* реквизиты внизу: утопленная панель, как печатный блок реквизитов */
.req{background:var(--surface-sunken); border:0.5px solid var(--border);
  border-radius:16px; padding:16px 20px; margin-top:20px;
  font-size:var(--fs-sub); line-height:1.65; color:var(--text-secondary)}
.req b{color:var(--text-primary); font-weight:600}

.foot{margin-top:36px; padding-top:20px; border-top:0.5px solid var(--border);
  font-size:var(--fs-cap); color:var(--text-muted)}
.foot a{color:inherit}
/* Ссылки шапки и подвала рисуются строкой 17 px, а нажимаются целью 44 px:
   поле добирается отступом и гасится отрицательным, строка остается на месте
   (КОД_ДИЗАЙНА, «Значок рисуется маленьким, а нажимается большим»). Ссылки
   внутри текста документа не трогаем: там цель - слово в строке. */
.top a, .foot a{display:inline-block; padding:14px 0; margin:-14px 0}
.top a.brand{padding:8px 0; margin:-8px 0}

/* Узкий экран: паспарту убираем, лист во всю ширину - поля ради полей
   на телефоне съедали бы строку. */
@media (max-width:560px){
  /* Телефон: паспарту нет, лист во всю ширину. Столб не нужен, а фон
     возвращается на body БЕЗ margin/max-width - тогда работает штатная
     пропагация фона на вьюпорт, и предел текстуры не грозит. */
  html::before{display:none}
  html{background:var(--surface-card)}
  body{margin:0; max-width:none; background:var(--surface-card);
    padding:calc(20px + env(safe-area-inset-top)) 20px calc(40px + env(safe-area-inset-bottom))}
  .top .rev{background:transparent; border:none; padding:0}
}

/* Заголовки - Unbounded, текст - Onest (shared/fonts.css).
   Ниже уровня заголовка не ставится: рисунок характерный
   и в длинном тексте начинает спорить с чтением. */
h1, h2{ font-family:var(--font-head) }
