/**
 * ОБЩИЕ ТОКЕНЫ МИНИ-АППА — единственное место, где живут цвета, радиусы и тени.
 *
 * Зачем файл. Страниц у нас две (`index.html` и `dogovor.html`), и палитру они завели каждая
 * свою: главная была мятной (#F0FDFA + синий акцент), анкета — серо-синей (#f4f5f7 + #31527a).
 * Третьим вариантом оказалось решение владельца от 03.09.2026 — нейтральный фон и бирюза
 * только на действии, — которое не применялось нигде. Теперь значение одно на обе страницы.
 *
 * Это НЕ дизайн-система: ни компонентов, ни документации. Общий словарь, не больше —
 * для двух страниц и одного разработчика система стоила бы дороже, чем экономит.
 *
 * ПРАВИЛО ПАЛИТРЫ (решено 03.09.2026): фон нейтральный, бирюза — только на действии.
 * Мятную заливку фона не возвращать: она глушила акцент и красила интерфейс в «нотариальное».
 *
 * Имена переменных оставлены прежними (`--bg`, `--ink`, `--card`…), чтобы страницы не
 * переписывать целиком: подключение файла меняет значения, а не разметку.
 */

/*
 * Шрифты интерфейса — С НАШЕГО СЕРВЕРА, а не с Google Fonts (решение 14.09.2026): стили Google блокировали
 * первую отрисовку ~0,65 с, файлы шрифтов шли с третьего домена ещё ~0,8 с. Файлы переменные — один на набор
 * символов для всех начертаний; взяты кириллица и латиница. Лицензия SIL OFL 1.1.
 * ⚠️ В Caddy шрифты кэшируются на год (immutable): новая версия шрифта — только под НОВЫМ именем файла.
 */
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("fonts/golos-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("fonts/golos-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Playfair Display"; font-style: normal; font-weight: 600 700; font-display: swap;
  src: url("fonts/playfair-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Playfair Display"; font-style: normal; font-weight: 600 700; font-display: swap;
  src: url("fonts/playfair-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  /* Основа: нейтральный фон, тёмные чернила, спокойные линии. */
  --bg: #F5F6F5;
  --bg2: #EFF1F0;
  --ink: #1C2523;
  --muted: #6B7674;
  /* Заголовки разделов: мелкие и заглавными, поэтому темнее --muted — на фоне тот давал 4,3:1 при норме 4,5:1. */
  --label: #56605E;
  --card: #FFFFFF;
  --card-ink: #1C2523;
  --field: #F0F2F1;
  --line: #E2E5E4;
  /* Кольцо просмотра у карточки статуса: серое = уже открывали. */
  --ring-seen: #D8DEDB;

  /* Действие. Бирюза — только на кнопках, ссылках и выбранном состоянии. */
  --primary: #0F766E;
  --primary-ink: #FFFFFF;
  --accent: #0F766E;
  --accent-ink: #FFFFFF;

  /* Статусы. Приглушённые: в документе крик неуместен. */
  --ok: #0F7A4B;
  --ok-bg: #EDF5F0;
  --warn: #96620C;
  --warn-bg: #FBF3E4;
  --risk: #B42318;
  --risk-bg: #FBEDEC;
  /* Текст на заливке --risk (кнопка удаления). В тёмной теме красный светлеет — текст тёмный, иначе 2,8:1. */
  --risk-ink: #FFFFFF;
  /* `--bad` — то же, что `--risk`: так это называется в анкете договоров. */
  --bad: #B42318;
  --bad-bg: #FBEDEC;

  /* Стекло шапки и нижнего меню. */
  --glass: rgba(255, 255, 255, .78);
  --glass-line: rgba(28, 37, 35, .10);

  --shadow: 0 10px 30px -14px rgba(20, 30, 28, .26);
  --shadow-sm: 0 1px 3px rgba(20, 30, 28, .10);
  --radius: 16px;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
}

/**
 * Тёмная тема. Тёплый нейтральный, а не сине-серый: тот же холод, что и в светлой,
 * иначе при переключении интерфейс «уезжает» в другую гамму. Бирюза светлеет,
 * чтобы остаться читаемой на тёмной подложке.
 */
:root[data-theme="dark"], :root.dark {
  --bg: #171917;
  --bg2: #1D201E;
  --ink: #E8EBE9;
  --muted: #9AA4A1; --label: #AEB7B4;
  --card: #212422;
  --card-ink: #E8EBE9;
  --field: #262A28;
  --line: #303432;
  --ring-seen: #3C413E;

  --primary: #4DB6AB;
  --primary-ink: #0B1918;
  --accent: #4DB6AB;
  --accent-ink: #0B1918;

  --ok: #6FBF8F;
  --ok-bg: #17251C;
  --warn: #D6AB5A;
  --warn-bg: #272013;
  --risk: #E08079;
  --risk-bg: #2A1815;
  --risk-ink: #2A1815;
  --bad: #E08079;
  --bad-bg: #2A1815;

  --glass: rgba(23, 25, 23, .72);
  --glass-line: rgba(232, 235, 233, .12);
  --shadow: 0 12px 34px -16px rgba(0, 0, 0, .7);
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, .4);
}

/* Системная тёмная — если человек не выбрал тему руками. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #171917;
    --bg2: #1D201E;
    --ink: #E8EBE9;
    --muted: #9AA4A1; --label: #AEB7B4;
    --card: #212422;
    --card-ink: #E8EBE9;
    --field: #262A28;
    --line: #303432;
    --ring-seen: #3C413E;

    --primary: #4DB6AB;
    --primary-ink: #0B1918;
    --accent: #4DB6AB;
    --accent-ink: #0B1918;

    --ok: #6FBF8F;
    --ok-bg: #17251C;
    --warn: #D6AB5A;
    --warn-bg: #272013;
    --risk: #E08079;
    --risk-bg: #2A1815;
    --risk-ink: #2A1815;
    --bad: #E08079;
    --bad-bg: #2A1815;

    --glass: rgba(23, 25, 23, .72);
    --glass-line: rgba(232, 235, 233, .12);
    --shadow: 0 12px 34px -16px rgba(0, 0, 0, .7);
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, .4);
  }
}

/**
 * ПЕРЕХОДЫ МЕЖДУ СТРАНИЦАМИ мини-аппа (17.09.2026). Разделы — отдельные страницы (так параллельные сессии
 * не конфликтуют в одном файле), и между ними мелькал пустой экран. Склеивать их обратно дорого, поэтому:
 * — `@view-transition`: браузер держит снимок прежней страницы, пока не нарисована новая, и перетекает в неё
 *   (Chromium 126+ — Android и десктоп, Safari 18.2+); где не поддержано — правило просто игнорируется;
 * — мягкое появление `body` — для остальных: страница не выскакивает, а проявляется за 0,18 с.
 * Правило живёт здесь, потому что ui.css подключают ВСЕ страницы: новая страница получает переход сама.
 * Вторая половина — предзагрузка разделов с главной (`prefetchSections` в index.html).
 */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .18s; }
@keyframes kama-page-in { from { opacity: 0; } to { opacity: 1; } }
body { animation: kama-page-in .18s ease-out both; }
@media (prefers-reduced-motion: reduce) {
  body { animation: none; }
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}

/* ── Рейка разделов для ПК (web/app/pc.js; канвас «Главная на ПК», 22.09.2026). На телефоне спрятана. ── */
.pcrail { display: none; }
@media (min-width: 1000px) {
  body.has-rail { padding-left: 240px; }
  .pcrail { display: flex; position: fixed; left: 0; top: 0; bottom: 0; width: 240px; z-index: 9; background: var(--card); border-right: 1px solid var(--line);
    padding: 12px 10px calc(10px + env(safe-area-inset-bottom, 0px)); display: flex; flex-direction: column; gap: 1px; overflow: hidden; box-sizing: border-box; }
  /* Рейка не прокручивается (просьба владельца 22.09.2026): пункты компактные, чтобы все влезали в окно от ~600 px высотой. */
  .pcrail .brand { font-weight: 700; font-size: 14px; padding: 4px 10px 10px; color: var(--ink); line-height: 1.25; }
  .pcrail .brand small { display: block; font-weight: 400; color: var(--muted); font-size: 12px; }
  .pcrail hr { border: 0; border-top: 1px solid var(--line); margin: 4px 8px; }
  .pcrail a.it { display: flex; align-items: center; gap: 9px; padding: 7px 10px; border-radius: 10px; font-size: 14px; line-height: 1.25; color: var(--ink); text-decoration: none; white-space: nowrap; min-width: 0; }
  .pcrail a.it span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .pcrail a.it:hover { background: var(--field); }
  .pcrail a.it.on { background: color-mix(in srgb, var(--accent) 12%, var(--card)); color: var(--accent); font-weight: 600; }
  .pcrail a.it svg { flex: none; color: var(--muted); } .pcrail a.it.on svg { color: var(--accent); }
  .pcrail a.it .n { flex: none; margin-left: auto; font-size: 11.5px; font-weight: 700; color: var(--accent-ink, #fff); background: var(--accent); border-radius: 999px; padding: 1px 7px; }
  body.has-rail .nav { display: none; }
  .pcrail .ver { margin-top: auto; padding: 8px 10px 0; font-size: 11px; color: var(--muted); line-height: 1.3; cursor: pointer; white-space: nowrap; overflow: hidden; }

  /* Кнопка «свернуть» и свёрнутая рейка: на планшете таблица в полную ширину иначе не влезает (24.09.2026). */
  .pcrail .fold { position: absolute; top: 10px; right: 8px; width: 30px; height: 30px; display: grid; place-items: center;
    border: 0; background: transparent; color: var(--muted); border-radius: 8px; cursor: pointer; }
  .pcrail .fold:hover { background: var(--field); color: var(--ink); }
  .pcrail .brand { padding-right: 36px; }
  body.rail-mini { padding-left: 58px; }
  .pcrail.pcrail-mini { width: 58px; padding-left: 8px; padding-right: 8px; align-items: stretch; }
  .pcrail.pcrail-mini .brand, .pcrail.pcrail-mini .ver, .pcrail.pcrail-mini a.it span { display: none; }
  .pcrail.pcrail-mini .fold { position: static; margin: 0 auto 8px; }
  .pcrail.pcrail-mini a.it { justify-content: center; padding: 9px 0; gap: 0; }
  /* Число (новые за сегодня) в свёрнутом виде — точкой на значке, иначе не помещается. */
  .pcrail.pcrail-mini a.it { position: relative; }
  .pcrail.pcrail-mini a.it .n { position: absolute; top: 4px; right: 8px; min-width: 0; padding: 0; width: 7px; height: 7px; font-size: 0; margin: 0; }
  .pcrail.pcrail-mini hr { margin: 4px 6px; }
}

/* ── ДИАЛОГ ПОДТВЕРЖДЕНИЯ (дизайн-система «ИИ помощник», компонент Dialog; 07.10.2026) ──────────────────────────────
 * Вместо window.confirm / window.prompt: встроенный браузер MAX их глушит (confirm сразу отдаёт «нет», prompt — пусто),
 * и кнопка «Удалить» выглядела нерабочей. Разметку строит dialog.js (uiConfirm / uiShowText). Классы с префиксом ui-,
 * чтобы не задеть стили страниц, у которых свои .btn и .sheet. */
.ui-scrim { position: fixed; inset: 0; z-index: 200; background: rgba(20, 30, 28, .42); display: flex; align-items: center; justify-content: center; padding: 16px; }
:root[data-theme="dark"] .ui-scrim { background: rgba(0, 0, 0, .55); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .ui-scrim { background: rgba(0, 0, 0, .55); } }
.ui-dialog { box-sizing: border-box; width: 100%; max-width: 420px; background: var(--card); color: var(--ink); border-radius: 16px; padding: 20px;
  box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 10px; font-family: "Golos Text", system-ui, sans-serif; }
.ui-dialog h3 { margin: 0; font-size: 17px; line-height: 22px; font-weight: 700; }
.ui-dialog p { margin: 0; font-size: 15px; line-height: 22px; color: var(--muted); }
.ui-dialog input { box-sizing: border-box; width: 100%; min-height: 46px; font: 400 16px/22px "Golos Text", system-ui, sans-serif; color: var(--ink);
  background: var(--field); border: 1.5px solid var(--primary); border-radius: 10px; padding: 11px 12px; }
.ui-dialog .ui-acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 6px; }
.ui-dialog .ui-acts.one { grid-template-columns: minmax(0, 1fr); }
.ui-dbtn { min-height: 52px; border: 0; border-radius: 12px; padding: 14px 12px; font: 600 16px/1.2 "Golos Text", system-ui, sans-serif; cursor: pointer;
  background: var(--primary); color: var(--primary-ink); }
.ui-dbtn.sec { background: var(--card); color: var(--ink); border: 1px solid var(--line); }
.ui-dbtn.danger { background: var(--risk); color: var(--risk-ink); }
.ui-dbtn:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }