@import url("fonts.css");

/* Портал показателей. Аналитический минимализм: страница — прибор в покое.
   Палитра — стайлгайд «Супер Силы»: только Red и Charcoal, зелёного нет.
   Красный тратится ровно на одно действие, всю структуру держат волосяные
   линии, а не карточки и тени. */

:root{
  --red:#DB020C; --red-700:#B00008; --red-900:#9A0008; --red-50:#FFF0F0;
  /* Пятна искры — знака помощника. Роли, а не краски: шестнадцатеричный
     цвет мимо токена — это вторая палитра. С 14.09.2026 — фирменные цвета,
     владелец: «белый, серый, графит, красный». Красный — светлая часть
     логотипа, замерена по пикселям: #E1–#ED0000; владелец: «шар посветлее,
     а красный понасыщеннее, не темнее, а как светлая часть нашего лого». */
  --iskra-svet:#FFFFFF;    --iskra-dym:#E2E4EA;
  --iskra-grafit:#4A4D57;  --iskra-krasnaya:#EE0000; --iskra-glub:#D40000;
  --iskra-dyh:rgba(219,2,12,.34);

  --ink:#111318;        /* text: 18,58:1 к белому */
  --ink-2:#565869;      /* textSecondary: 7,01:1 */
  --ink-3:#6D7080;      /* textMuted: 4,91:1. Было #767888 — 4,4:1 */
  --line:#E2E4EA;       /* border: декоративная граница карты */
  --line-2:#C8CAD4;     /* волосяная черта таблиц и сетки прибора */
  /* Край органа отбора — не волосяная черта. Требование контраста
     3:1 относится к тому, что человек нажимает: поле, галочка,
     выпадашка. Сделать таким же весь `--line-2` нельзя — он красит
     столбцы графиков и линии таблиц, и прибор стал бы грязным. */
  --kraj:#888B99;       /* controlBorder: 3,39:1 */
  --pale:#F5F6F8;       /* canvas: фон страницы */
  --field:#FCFCFD;      /* surfaceSubtle */
  /* Зелёного в стайлгайде нет: он заведён только под индикатор
     раздела «Потоки», где смысл именно в паре «успел / не успел».
     В отчётах и цифрах его по-прежнему нет. */
  --zelenyj:#1E7A44;    /* positive: 5,35:1 */
  --vnimanie:#9A5A00;   /* warning: риск и задержка, 5,47:1 */
  --svedenie:#315B8A;   /* info: сведение, 7,01:1 */
  /* Обводка фокуса — своим цветом, а не красным. Красный на портале
     уже значит «главное действие» и «ошибка», и третьим значением
     он перестаёт значить хоть что-то: обведённое поле выглядит
     ошибочным. Роль заведена таблицей ТЗ ровно поэтому. */
  --fokus:#1E5EFF;      /* focus: 5,12:1 */
  /* Подпись в тёмной подсказке графика. Белым с прозрачностью она
     выходила темнее, чем задано таблицей ТЗ, и в подсказке из шести
     строк читалась хуже значений рядом. */
  --podskazka-tiho:#D1D3DB;
  --fokus-fon:rgba(30,94,255,.14);
  --paper:#FFFFFF;      /* surface */
  /* Фон страницы и тень карточки — 14.09.2026, владелец: «фон у портала
     светло-светло серый, а виджеты белые формы с лёгкими тенями». Фон — не
     `--pale`: тем же цветом залиты желоба полос и подложки внутри карточек,
     на фоне страницы они бы пропали. */
  --holst:#F2F3F6;
  --ten-karty:0 1px 2px rgba(17,19,24,.04),0 6px 18px -8px rgba(17,19,24,.12);

  --setka:rgba(17,19,24,.045);   /* линии поля прибора */
  --vydelenie:rgba(219,2,12,.14);
  /* ── разговор ──────────────────────────────────────────────
     Владелец 12.09.2026: «сделай в ночной теме чат таких цветов,
     как у тебя». Днём разговор живёт цветами портала — он часть
     страницы; ночью берёт тёплую палитру помощника: прибор в покое
     ночью синеет, а беседа от этого становится холодной перепиской.
     Отдельные роли заведены затем, чтобы это было одно решение в
     одном месте, а не семь правок по файлу. */
  --chat-fon:var(--paper);
  --chat-vopros:var(--pale);
  --chat-kraj:var(--line);
  --chat-tekst:var(--ink);
  --chat-tiho:var(--ink-3);
  --chat-akcent:var(--red);
  /* Подложка поля ввода. Ночное значение снято по пикселям со снимка
     владельца 12.09.2026 — «цвет как на третьем скрине», #20201F. Днём
     поле без рамки видно только подложкой, поэтому она бледная. */
  --chat-pole:var(--pale);

  /* Радиусы. Задание владельца 12.09.2026: «я хочу цвета, формы
     UX/UI как у макбука, у iOS последней». Взяты оттуда: у виджета
     macOS угол около двадцати, у органа — около десяти, у листа и
     окна — двадцать с небольшим. Прежние двенадцать и восемь —
     значения ТЗ от 11.09.2026; они не были ошибкой, просто
     отставали от системы, на которую равняемся.

     Набор остаётся лесенкой: значок мельче органа, орган мельче
     карточки, карточка мельче окна. Иначе карточка и кнопка внутри
     неё читаются как два разных набора. */
  --r-badge:7px; --r-btn:10px; --r-card:18px; --r-block:22px;
  /* Цвет «всё хорошо» — тот же зелёный, что у положительных чисел.
     Отдельной краски для него не заводим. */
  --horosho:var(--zelenyj);

  /* Высота органов. Было пять: 28, 30, 34, 38 и 40 — и разнобой
     видно даже тому, кто не умеет его назвать. Стало три, и
     основная взята из ТЗ. На касании обе крупнее: палец не мышь. */
  --organ:40px;         /* поле, выпадашка, кнопка отбора */
  --organ-mal:32px;     /* кнопка внутри строки таблицы */
  --organ-kroha:28px;   /* значок в шапке карты */
  /* Разговор. Высота шапки одна на шапку чата, первую строку
     сайдбара и кнопки окна — иначе они стоят вразнобой, и владелец
     12.09.2026 это увидел: «выровняй всё в шапке, кривая сейчас».
     Высота пункта одна на поле поиска и строку чата: «окалибруй высоту
     по полю поиска». Поля реплики — чтобы поле ввода встало ровно под
     текстом, а не под меткой «портал». */
  --shapka-razgovora:48px;
  --punkt-besedy:34px;
  --replika-pole:15px; --replika-metka:54px; --replika-zazor:12px;

  --shag:8px;
  --shrift:"Golos Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --cifry:ui-monospace,SFMono-Regular,Menlo,monospace;
  --plavno:cubic-bezier(.16,1,.3,1);
  /* Пружина для мелких перелётов: выбранное положение, бегунок,
     указатель вкладок. Лёгкий довод в конце — то самое движение, к
     которому приучил iOS; без него переезд читается как подмена. */
  --pruzhina:cubic-bezier(.34,1.4,.64,1);
}

@media (prefers-color-scheme: dark){
  :root:not([data-tema="den"]){
    --ink:#F1F2F6; --ink-2:#A6A9B6; --ink-3:#828593;
    --line:#242832; --line-2:#363B47; --pale:#15181E;
    /* Ночных значений новых ролей в ТЗ нет: он прямо говорит, что
       ночную палитру по дневным макетам объявлять готовой нельзя.
       Взяты так, чтобы держался тот же контраст к тёмному полотну;
       сверить отдельным просмотром. */
    --kraj:#6E7486; --vnimanie:#D9A03A; --svedenie:#7FAEDD;
    --fokus:#6C93FF; --fokus-fon:rgba(108,147,255,.20);
    /* Ночью подсказка светлая: её фон — `--ink`, который ночью
       светлый. Подпись, стало быть, тёмная. */
    --podskazka-tiho:#3A3D47;
    --field:#0F1115; --paper:#15181E; --zelenyj:#3FB964;
    --holst:#0F1115; --ten-karty:none;
    --red:#FF4B52; --red-700:#FF6A70; --red-900:#FF8A8F; --red-50:#2A1416;
    --iskra-svet:#F1F2F6;    --iskra-dym:#C8CAD4;
    --iskra-grafit:#3A3D47;  --iskra-krasnaya:#EE0000; --iskra-glub:#D40000;
    --iskra-dyh:rgba(255,75,82,.40);
    --setka:rgba(241,242,246,.05);
    /* Тёплый графит вместо синего: беседа ночью читается как
       разговор, а не как пульт. Цифры проверены на контраст к фону
       разговора, а не к фону страницы — он у них разный. */
    --chat-fon:#262624; --chat-vopros:#30302E; --chat-kraj:#3D3C39;
    --chat-tekst:#F5F4EF; --chat-tiho:#A9A49B; --chat-akcent:#D97757;
    --chat-pole:#20201F;
    --vydelenie:rgba(255,75,82,.22);
  }
}
:root[data-tema="noch"]{
    --ink:#F1F2F6; --ink-2:#A6A9B6; --ink-3:#828593;
    --line:#242832; --line-2:#363B47; --pale:#15181E;
    /* Ночных значений новых ролей в ТЗ нет: он прямо говорит, что
       ночную палитру по дневным макетам объявлять готовой нельзя.
       Взяты так, чтобы держался тот же контраст к тёмному полотну;
       сверить отдельным просмотром. */
    --kraj:#6E7486; --vnimanie:#D9A03A; --svedenie:#7FAEDD;
    --fokus:#6C93FF; --fokus-fon:rgba(108,147,255,.20);
    /* Ночью подсказка светлая: её фон — `--ink`, который ночью
       светлый. Подпись, стало быть, тёмная. */
    --podskazka-tiho:#3A3D47;
    --field:#0F1115; --paper:#15181E; --zelenyj:#3FB964;
    --holst:#0F1115; --ten-karty:none;
    --red:#FF4B52; --red-700:#FF6A70; --red-900:#FF8A8F; --red-50:#2A1416;
    --iskra-svet:#F1F2F6;    --iskra-dym:#C8CAD4;
    --iskra-grafit:#3A3D47;  --iskra-krasnaya:#EE0000; --iskra-glub:#D40000;
    --iskra-dyh:rgba(255,75,82,.40);
    --setka:rgba(241,242,246,.05);
    /* Тёплый графит вместо синего: беседа ночью читается как
       разговор, а не как пульт. Цифры проверены на контраст к фону
       разговора, а не к фону страницы — он у них разный. */
    --chat-fon:#262624; --chat-vopros:#30302E; --chat-kraj:#3D3C39;
    --chat-tekst:#F5F4EF; --chat-tiho:#A9A49B; --chat-akcent:#D97757;
    --chat-pole:#20201F;
    --vydelenie:rgba(255,75,82,.22);
  }

/* Палец не мышь: на касании органы крупнее. Так требует ТЗ и так
   требует промах — 40 px мышью попадаются, пальцем нет. */
@media (pointer:coarse){
  :root{--organ:44px; --organ-mal:36px; --organ-kroha:32px}
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  min-height:100dvh;
  background:var(--holst);
  color:var(--ink);
  font-family:var(--shrift);
  font-size:15px;
  line-height:1.55;
  font-feature-settings:"ss01","cv01";
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Поверхности, которые рисует браузер, а не я. Они тоже часть облика. */
::selection{background:var(--vydelenie);color:var(--ink)}
:focus-visible{outline:2px solid var(--fokus);outline-offset:3px;border-radius:2px}
:root{scrollbar-color:var(--line-2) transparent;scrollbar-width:thin}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px;
  border:3px solid var(--paper)}
::-webkit-scrollbar-track{background:transparent}

a{color:var(--ink);text-decoration:underline;
  text-decoration-color:var(--line-2);text-underline-offset:2px;
  text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--red);text-decoration-color:var(--red)}
.znak,.menyu a,.metka{text-decoration:none}

/* ── страница входа: прибор в покое ─────────────────────────── */
.vhod{
  min-height:100dvh;
  display:grid;
  background:var(--field);
  position:relative;
  isolation:isolate;
}
/* Поле прибора. Не украшение: разметка измерительного листа, приглушённая
   до предела и растворяющаяся к краям, чтобы нигде не читалась плитка. */
.vhod::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background-image:
    linear-gradient(to right, var(--setka) 1px, transparent 1px),
    linear-gradient(to bottom, var(--setka) 1px, transparent 1px);
  background-size:32px 32px;
  -webkit-mask-image:radial-gradient(120% 90% at 22% 42%, #000 0%, transparent 72%);
  mask-image:radial-gradient(120% 90% at 22% 42%, #000 0%, transparent 72%);
}

.vhod-polotno{
  width:100%;
  max-width:1120px;
  margin:0 auto;
  padding:clamp(32px,7vh,96px) clamp(20px,6vw,72px);
  display:flex;
  align-items:center;
}

.vhod-blok{max-width:33rem}

.vhod-znak{display:block;width:132px;height:auto;margin:0 0 28px}

.vhod h1{
  margin:0;
  font-size:clamp(30px,4.4vw,42px);
  line-height:1.04;
  font-weight:700;
  letter-spacing:-.03em;
  text-wrap:balance;
}

.vhod-cherta{
  width:44px;
  height:2px;
  background:var(--red);
  margin:20px 0 22px;
}

.vhod p{
  margin:0;
  max-width:34ch;
  color:var(--ink-2);
  font-size:16px;
  line-height:1.6;
}
.vhod p + p{margin-top:10px}
.vhod strong{color:var(--ink);font-weight:600}

.vhod-dejstvie{margin:32px 0 0}

.vhod-kuda{
  margin:16px 0 0;
  color:var(--ink-3);
  font-size:13px;
  line-height:1.5;
}
.vhod-kuda b{font-weight:500;color:var(--ink-2)}

/* Один осмысленный момент движения: блок оседает на место. */
@media (prefers-reduced-motion: no-preference){
  .vhod-znak,.vhod h1,.vhod-cherta,.vhod-tekst,.vhod-dejstvie,.vhod-kuda{
    animation:osest .62s var(--plavno) both;
  }
  .vhod h1{animation-delay:.06s}
  .vhod-cherta{animation-delay:.1s}
  .vhod-tekst{animation-delay:.14s}
  .vhod-dejstvie{animation-delay:.2s}
  .vhod-kuda{animation-delay:.26s}
}
@keyframes osest{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}

/* ── кнопка ─────────────────────────────────────────────────── */
.knopka{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  /* Высота, поле по бокам, зазор и нижняя ширина — из таблицы ТЗ.
     Прежние 48 px делали главную кнопку выше всего, что стоит с ней
     в ряд, и ряд приходилось равнять по ней вручную в семи местах. */
  gap:8px;
  min-height:var(--organ);
  min-width:80px;
  padding:0 16px;
  border:0;
  border-radius:var(--r-btn);
  background:var(--red);
  color:#fff;
  font:500 14px/20px var(--shrift);
  letter-spacing:-.01em;
  cursor:pointer;
  /* Кнопка-ссылка — кнопка, а не ссылка: подчёркивания нет и в покое.
     Владелец 13.09.2026 о «Сбросить»: «подчёркивание убери». */
  text-decoration:none;
  transition:background .16s ease, transform .16s var(--plavno),
             box-shadow .16s ease;
  box-shadow:0 1px 2px rgba(17,19,24,.10), 0 6px 18px -8px rgba(219,2,12,.45);
}
.knopka:hover{background:var(--red-700);text-decoration:none;
  box-shadow:0 2px 4px rgba(17,19,24,.12), 0 10px 26px -10px rgba(219,2,12,.55)}
.knopka:active{transform:translateY(1px);
  box-shadow:0 1px 2px rgba(17,19,24,.12)}
.knopka[disabled],.knopka[aria-disabled="true"]{
  background:var(--line);color:var(--ink-3);cursor:not-allowed;box-shadow:none}
.knopka .strelka{transition:transform .18s var(--plavno)}
.knopka:hover .strelka{transform:translateX(3px)}

/* Тихая кнопка: серое действие рядом с красным. Правило одно на весь
   портал. До 11.09.2026 их было три — здесь, в строке правки и в окне
   справки, — и все три спорили о подложке и цвете букв; побеждала
   последняя, а первые две выглядели работающими. */
.knopka.tihaya{
  background:var(--paper);color:var(--ink-2);box-shadow:none;
}
.knopka.tihaya:hover{color:var(--ink);border-color:var(--ink-3)}

.ssylka{background:none;border:0;padding:0;color:var(--red);cursor:pointer;
  font:inherit;text-underline-offset:3px}
.ssylka:hover{color:var(--red);text-decoration-color:var(--red)}
.znak,.menyu a,.metka{text-decoration:none}

/* ── шапка приложения ───────────────────────────────────────── */
.polosa{background:var(--red);color:#fff;padding:9px 20px;font-size:13.5px}
.polosa a{color:#fff;text-decoration:underline}

.shapka{
  display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;
  padding:12px clamp(14px,3vw,28px);
  border-bottom:1px solid var(--line);
  background:var(--paper);
}
.znak{display:inline-flex;align-items:center;gap:10px;color:var(--ink);
  font-weight:400;letter-spacing:-.01em}
/* Название — в две строки и без жирного: владелец 13.09.2026. Ширина по
   самому длинному слову переносит строку на пробеле, текст остаётся целым. */
.znak-slova{display:block;width:min-content;font-size:13.5px;line-height:1.15}
.znak:hover{text-decoration:none}
.znak img{display:block;height:26px;width:auto}
/* Меню живёт под бургером — правила его полотна ниже, в своём разделе. */
/* `min-width:0` обязателен: без него флекс-элемент не сужается ниже
   своего содержимого, и одна широкая панель внутри распирает шапку. */
.kto{margin-left:auto;min-width:0;display:flex;align-items:center;gap:12px;
  font-size:13px;color:var(--ink-3)}

.polotno{max-width:1160px;margin:0 auto;padding:26px clamp(14px,3vw,28px) 72px}
/* Страницы с широкими таблицами занимают экран целиком: семнадцать колонок
   в 1160 px не помещаются, и половина уезжает за правый край незамеченной.
   Ширина не отпущена совсем — на очень широком мониторе строка в две тысячи
   пикселей не читается, глазу негде зацепиться. */
.polotno.shiroko{max-width:min(2200px, 100%);padding-left:clamp(14px,2.2vw,40px);
  padding-right:clamp(14px,2.2vw,40px)}
/* Главная — вровень с шапкой портала: те же поля, что у `.shapka`, и
   без потолка. Владелец 13.09.2026: «ширина поля виджетов меньше ширины
   элементов шапки, выровняй по шапке». */
.polotno.shiroko.po-shapke{max-width:none;padding-left:clamp(14px,3vw,28px);
  padding-right:clamp(14px,3vw,28px)}

h1{font-size:26px;margin:0 0 6px;letter-spacing:-.025em;line-height:1.15}
h2{font-size:19px;margin:30px 0 10px;letter-spacing:-.02em}
p{margin:0 0 12px}
/* Подпись под заголовком — во всю страницу, а не в семьдесят знаков.
   Ограничение ширины бережёт длинный текст, но подпись из полутора строк оно
   ломает пополам посреди экрана, и справа остаётся пустое поле. */
h1+p,h2+p{max-width:none}
.tiho{color:var(--ink-3);font-size:13px}

/* ── плитки показателей ─────────────────────────────────────── */
.plitki{
  display:grid;gap:0;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;
  grid-template-columns:repeat(auto-fit,minmax(158px,1fr));margin:18px 0;
}
.plitka{background:var(--paper);padding:15px 17px;
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  margin:0 -1px -1px 0;
  display:flex;flex-direction:column;gap:4px}
.plitka .l{font:500 10.5px/1.3 var(--cifry);letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3)}
.plitka .v{font-size:25px;font-weight:600;letter-spacing:-.035em;
  font-variant-numeric:tabular-nums;line-height:1.1}
.plitka .s{font-size:12.5px;color:var(--ink-3)}
.plitka.beda .v{color:var(--red)}

/* ── карты и таблицы ────────────────────────────────────────── */
/* ── оболочка карточки ───────────────────────────────────────
   ТЗ, раздел 9.1: общий фон, граница, радиус, шапка, содержимое,
   подвал. Разметку даёт `templates/ui/_obolochka.html` — один каркас
   на восемь блоков главной и на карточки страниц. */
.karta{border:1px solid var(--line);border-radius:var(--r-card);
  background:var(--paper);overflow:hidden;margin:18px 0;box-shadow:var(--ten-karty)}
/* Шапка карточки: слева имя, справа — за что показано. Обе части
   набраны одинаково на всех карточках, и это и есть договор
   (11.09.2026; до него справа стояли и подпись, и действия вперемешку).
   Нижняя высота 40 по ТЗ — та же, что у органа, чтобы кнопка в шапке
   не распирала её и не болталась в ней. */
.karta>h3 .karta-imya{color:var(--ink-2)}
.karta>h3 .karta-period{color:var(--ink-3);text-align:right;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Строка под шапкой: чем и как считано. У каждой карточки на одном
   месте, обычным набором — это пояснение, а не заголовок. */
.karta-podpis{margin:0;padding:9px 15px 0;color:var(--ink-2);
  font-size:12.5px;line-height:1.45}
.karta-podpis:empty{display:none}
/* «И ещё N» под обрезанным списком. Обрезает размер карточки, и
   промолчать об этом нельзя: список читался бы как полный. */
.karta-eshchyo{margin:0;padding:8px 15px 12px;color:var(--ink-3);
  font-size:12.5px}
.karta>h3{margin:0;padding:9px 15px;min-height:var(--organ);
  background:var(--pale);
  border-bottom:1px solid var(--line);
  font:500 10.5px/1.4 var(--cifry);letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);
  display:flex;justify-content:space-between;gap:12px;align-items:center}


/* Строка «ничего не нашлось» в выпадашке: показывается, когда поиск
   спрятал все пункты. Считает скрипт — CSS считать не умеет. */
.vybor-pusto{display:none;padding:10px 12px;font-size:13px}
.vybor-polotno.nichego .vybor-pusto{display:block}
/* Поиск прилипает к верху длинного списка: прокрутив к середине,
   человек всё равно видит, чем он ищет. */
.vybor-polotno .vybor-poisk{position:sticky;top:0;z-index:1}

/* ── Переключатель темы: авто · день · ночь ──────────────────────
   Просьба владельца 12.09.2026 по образцу animated-toggle. Было
   выпадашкой: чтобы попасть из «авто» в «ночь», надо было открыть
   список и выбрать. Стало рядом из трёх — одно нажатие, и видно, где
   стоишь.

   Бегунок ездит средствами стиля: его место задаёт класс на форме,
   который ставит сервер. Скрипт в этом не участвует вовсе. */
.tema-perekl{position:relative;display:inline-flex;align-items:center;
  /* Шаг шире высоты: владелец 13.09.2026 — «сделай чуть шире, сейчас он
     кажется нагромождённым». Три знака в квадратах по 28 px стояли
     вплотную. Бегунок и кнопки берут одну меру. */
  /* И ещё шире, со знаками в рост звезды «Избранного» — владелец 13.09.2026. */
  --tema-shag:46px;
  padding:2px;border:1px solid var(--line);border-radius:var(--r-btn);
  background:var(--pale)}
/* ── Подложка обязана отличаться от того, на чём лежит ──────────
   **В ночной теме `--paper` и `--pale` — один и тот же #15181E.**
   Значит ни один из них не поднимает элемент над другим: подложка,
   залитая `--paper` на `--pale`, в ночи невидима, и наоборот.

   Лежащее сверху заливается `--line`: он отличается от обоих в обеих
   темах. Найдено владельцем на переключателе темы 12.09.2026, а
   проба `test_podlozhka_vidna_v_obeih_temah` тем же вечером нашла
   ещё три случая, два из них давние: наведение на знаки шапки и на
   строки выпадашек в ночи не показывалось вовсе.

/* Цвет бегунка — `--line`, а не `--paper`.

   **В ночной теме `--paper` и `--pale` — один и тот же #15181E.**
   Бегунок на подложке группы был невидим, и в «авто» переключатель
   выглядел тремя знаками без выбранного. Поймал владелец глазами
   12.09.2026; ровно та же ловушка была за час до этого у плитки
   значка размера. Что нельзя класть на что — стережёт проба
   `test_podlozhka_vidna_v_obeih_temah`. */
.tema-begunok{position:absolute;top:2px;left:2px;
  width:var(--tema-shag);height:var(--organ-kroha);
  border-radius:var(--r-badge);background:var(--line);
  box-shadow:0 1px 2px rgba(0,0,0,.18);
  transition:transform .26s var(--pruzhina)}
.tema-den .tema-begunok{transform:translateX(100%)}
.tema-noch .tema-begunok{transform:translateX(200%)}
.tema-knopka{position:relative;z-index:1;display:inline-flex;
  align-items:center;justify-content:center;
  width:var(--tema-shag);height:var(--organ-kroha);
  padding:0;border:0;border-radius:var(--r-badge);background:none;
  color:var(--ink-3);cursor:pointer}
.tema-knopka svg{width:16px;height:16px;display:block}
.tema-vypad{position:relative;display:inline-flex}
.tema-vypad>.tema-perekl{position:absolute;z-index:40;top:calc(100% + 8px);right:50%;
  transform:translateX(50%);box-shadow:0 10px 24px rgba(17,19,24,.18);
  visibility:hidden;opacity:0;transition:opacity .14s ease,visibility 0s linear .14s}
/* Мостик над полем: указатель, идущий вниз, не теряет наведения в зазоре. */
.tema-vypad>.tema-perekl::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.tema-vypad:hover>.tema-perekl,.tema-vypad:focus-within>.tema-perekl{visibility:visible;opacity:1;
  transition:opacity .14s ease}
@media (prefers-reduced-motion:reduce){.tema-vypad>.tema-perekl{transition:none}}
.tema-knopka:hover{color:var(--ink)}
/* Выбранное положение — цветом знака, а не фоном: фон уже занят
   бегунком, и второй фон под ним читался бы как два выбранных. */
.tema-knopka[aria-current]{color:var(--ink)}
.tema-knopka:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
@media (prefers-reduced-motion:reduce){.tema-begunok{transition:none}}


/* ── Движение как у эпла ─────────────────────────────────────────
   Просьба владельца 12.09.2026: «движение форм тоже было как у эпл».

   Два приёма, и оба мелкие. **Нажатие вдавливает**: орган на миг
   становится чуть меньше — палец получает ответ раньше, чем страница
   успевает что-то посчитать. **Выпадающее не возникает, а
   раскрывается** от своего края: короткий наклон и проявление вместо
   мгновенной подмены.

   Оба уходят при запрете движения: там, где движение мешает, ответ
   даёт обводка фокуса, а она никуда не девалась. */
.knopka:active,.znak-knopka:active,.tema-knopka:active,
.knopka-kopii:active,.vybor>summary:active{transform:scale(.97)}
.knopka,.znak-knopka,.tema-knopka,.knopka-kopii,.vybor>summary{
  transition:transform .12s var(--pruzhina),background .12s ease,
    color .12s ease,border-color .12s ease}

.vybor[open]>.vybor-polotno,
.znak-vypad[open]>.znak-polotno,
.menyu-vypad[open]>.menyu-polotno{
  animation:raskrylos .2s var(--pruzhina)}
@keyframes raskrylos{
  from{opacity:0;transform:translateY(-6px) scale(.97)}
  to{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){
  .knopka:active,.znak-knopka:active,.tema-knopka:active,
  .knopka-kopii:active,.vybor>summary:active{transform:none}
  .knopka,.znak-knopka,.tema-knopka,.knopka-kopii,.vybor>summary{
    transition:none}
  .vybor[open]>.vybor-polotno,
  .znak-vypad[open]>.znak-polotno,
  .menyu-vypad[open]>.menyu-polotno{animation:none}
}
/* ── Остров отклонений ───────────────────────────────────────────
   Найдено в SmoothUI (`dynamic-island`), место названо владельцем.

   Взято не целиком. Свести колокол, звезду и часы в один орган —
   ровно то, от чего отказались 11.09.2026: вопроса три, и на каждый
   нужно отвечать быстро. Взято другое, то, ради чего остров и нужен:
   у знака два состояния. Отвечать не на что — знак остаётся знаком;
   появилось непрочитанное — раздаётся и сам говорит, что случилось.

   **Въезда нарочно нет.** Это самый нажимаемый угол портала, и
   движение здесь на каждой загрузке страницы утомляет быстрее, чем
   помогает. Остров показывает состояние, а не играет его. */
.vypad-ostrova{min-width:0}
.kolokol.ostrov{min-width:0;max-width:min(22rem,32vw);gap:7px}
.ostrov-vest{min-width:0;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;font-size:12.5px;color:var(--ink-2);font-weight:400}
.znak-vypad[open]>.kolokol.ostrov .ostrov-vest{color:var(--ink)}
/* Два заслона, и нужны оба.

   **Ширина экрана.** Замерено 12.09.2026: на 1280 px после поиска,
   четырёх знаков, переключателя темы и имени в шапке остаётся сто
   пикселей — двенадцать знаков, «Реестр посещ…». Остров там уводил
   правую часть шапки на вторую строку: 59 px превращались в 101.
   Ниже 1400 px заголовка нет вовсе, и знак остаётся знаком.

   **Сжатие.** Ширины экрана мало: имя в шапке у всех своё, и длинное
   отнимает те же сто пикселей на любом мониторе. Поэтому остров умеет
   сжиматься — `min-width:0` по всей цепочке, — и шапку не разваливает
   даже там, где заслон по ширине его пропустил. */
@media (max-width:1399px){.ostrov-vest{display:none}}

/* ── Поверхность «Спросить» ──────────────────────────────────────
   Найдено в SmoothUI (`morph-surface`), названо владельцем. Смысл не в
   новом помощнике, а в том, чтобы спросить там, где смотришь: вопрос
   рождается на продажах и на плане, а унести его в песочницу вместе с
   тем, что открыто, до 12.09.2026 было нечем.

   Разворачивается из значка, а не всплывает рядом с ним: точка роста —
   правый верхний угол, там же, где значок. Начальный масштаб мельче
   общего, потому что ход длиннее: панель шириной в тридцать строк из
   значка в 28 px.

   Внутри — тот же кусок разговора, что на странице песочницы. Своей
   шапки у него здесь нет: рамка в рамке и два заголовка подряд читаются
   как две разные вещи. */
.poverhnost>.poverhnost-polotno{
  padding-top:0;
  /* Ширина начальная, без потолка: потолок ставит правило
     растягивания ниже. Объявленный здесь, он запирал окно на 30 rem,
     и за угол оно не расширялось. */
  width:var(--poverhnost-shirina,min(30rem,90vw));
  padding-bottom:8px;
  transform-origin:top right}
/* Окно разговора тянется по высоте. Владелец 12.09.2026: «сделай,
   чтобы за угол можно было потянуть и расширить», а следом — «если
   потянуть влево, то форма поедет вправо, и вообще хреново работает».

   **Вбок это окно тянуться и не может.** Оно прижато правым краем к
   кнопке в шапке: ширина растёт влево, а уголок остаётся на месте —
   тянешь вправо, и под указателем ничего не движется. Поэтому
   осталась одна сторона, та, ради которой и тянут: высота разговора.

   `overflow:auto` обязателен — без него `resize` не работает вовсе.
   Выпадающим внутри он не мешает: они `popover` и живут в верхнем
   слое, поверх любого переполнения. */
.poverhnost>.poverhnost-polotno{
  /* Родного растягивания нет: оно тянет только вправо-вниз, а это
     окно растёт влево. Тянем своим уголком, он слева внизу.

     **`position` не трогаем.** Окно прижато правым краем через
     `absolute; right:0`; поставленный сюда `relative` вернул его в
     поток, и оно поехало вправо вместо того, чтобы расти влево.
     Уголку `absolute` подходит не хуже: он тоже позиционированный. */
  overflow:auto;overscroll-behavior:contain;
  /* Открывается под таблицу, а не «раздвиньте сами». Владелец
     12.09.2026: «какого размера открывается по умолчанию — очень
     неудобно, потому что придётся всегда сразу раздвигать». Шесть
     строк ответа с шапкой и итогом просят около 38 rem. */
  height:min(70vh,40rem);min-height:14rem;max-height:88vh;
  /* Потолок ширины — край экрана. Общий для панелей шапки потолок в
     560 px не пускал окно дальше: владелец 12.09.2026 просил «вширь
     буквально до края экрана, больше не надо». */
  max-width:96vw;
  display:flex;flex-direction:column}
/* Растёт лента разговора, а не пустота под полем ввода: без этого
   окно тянулось, а внутри оставался белый низ. */
.poverhnost-polotno>[data-mesto-razgovora]{flex:1 1 auto;min-height:0;
  display:flex;flex-direction:column;justify-content:flex-end}
.poverhnost-polotno .razgovor{flex:1 1 auto;min-height:0;max-height:none;display:flex;flex-direction:column}
.poverhnost-polotno .razgovor-lenta{flex:1 1 auto;min-height:0}

/* Раскрытие на весь экран. Окно перестаёт быть выпадающим и
   становится модальным: середина экрана, поля по краям, тень
   глубже. Уголок растягивания при этом не нужен — некуда. */
/* Пустая шапка окна: в ней остались только кнопки, и полоса под них
   отдельной строкой съедала бы место у разговора. Кнопки висят поверх
   правого верхнего угла, название беседы стоит первой строкой
   разговора. */
/* Двойной класс нарочно: базовое правило .znak-shapka стоит в файле
   ниже и при равном весе перебивало выравнивание — кнопка висела на
   4 px выше названия, замерено браузером. */
.znak-shapka.znak-shapka-pustaya{position:absolute;top:0;right:8px;z-index:3;
  height:var(--shapka-razgovora);display:flex;align-items:center;
  padding:0;margin:0;border:0;background:none;gap:2px;min-height:0}
.okno-shire{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-kroha);height:var(--organ-kroha);margin-left:auto;
  padding:0;border:0;border-radius:var(--r-btn);
  background:none;color:var(--ink-3);cursor:pointer;
  transition:background .14s ease,color .14s ease}
.okno-shire:hover{background:var(--pale);color:var(--ink)}
.okno-shire:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.okno-shire svg{width:14px;height:14px;display:block}
.okno-shire .znak-shire-vnutr{display:none}
.okno-shire[aria-pressed="true"] .znak-shire-naruzhu{display:none}
.okno-shire[aria-pressed="true"] .znak-shire-vnutr{display:block}
/* Булавка рядом с раскрытием — владелец 14.09.2026. Закреплённое окно
   не закрывается ни уходом указателя, ни нажатием мимо. */
.okno-bulavka{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-kroha);height:var(--organ-kroha);
  padding:0;border:0;border-radius:var(--r-btn);
  background:none;color:var(--ink-3);cursor:pointer;
  transition:background .14s ease,color .14s ease}
.okno-bulavka:hover{background:var(--pale);color:var(--ink)}
.okno-bulavka:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.okno-bulavka svg{width:14px;height:14px;display:block}
.okno-bulavka .golovka{fill:none}
.okno-bulavka[aria-pressed="true"]{color:var(--ink);background:var(--pale)}
.okno-bulavka[aria-pressed="true"] .golovka{fill:currentColor}
/* Раскрытое окно перебивает оба объявления ширины — и переменную
   поверхности, и растянутое уголком. Отсюда `.poverhnost>` в
   селекторе: без него правило слабее и не применяется. */
.poverhnost>.poverhnost-polotno.vo-ves-ekran{
  position:fixed;top:3vh;left:50%;right:auto;
  transform:translateX(-50%);
  width:min(76rem,94vw);max-width:94vw;
  height:94vh;max-height:94vh;
  box-shadow:0 28px 72px rgba(17,19,24,.30)}
.poverhnost-polotno.vo-ves-ekran .poverhnost-ugol{display:none}

.poverhnost-ugol{
  position:absolute;left:2px;bottom:2px;z-index:2;
  display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;color:var(--ink-3);
  cursor:nesw-resize;touch-action:none;opacity:.5;
  transition:opacity .14s ease,color .14s ease}
.poverhnost-ugol:hover{opacity:1;color:var(--ink-2)}
.poverhnost-ugol svg{width:11px;height:11px;display:block;
  transform:scaleX(-1)}
.poverhnost.tyanem{user-select:none}

.poverhnost[open]>.poverhnost-polotno{animation:vyroslo .24s var(--pruzhina)}
@keyframes vyroslo{
  from{opacity:0;transform:translateY(-8px) scale(.88)}
  to{opacity:1;transform:none}
}
.poverhnost-polotno .razgovor{border:0;background:none;padding:0;
  max-height:none;margin:0}
/* Шапка разговора видна и в окне: в ней теперь название беседы и
   кнопка списка — владелец 12.09.2026 «вверху вместо шапки и надписи
   песочница показывай его название». Прежде она была спрятана, потому
   что повторяла заголовок окна; заголовка больше нет. */
.poverhnost-polotno .razgovor-shapka{margin-right:0}
/* Потолка у ленты нет: окно тянут по высоте, и расти должна лента,
   а не пустота под полем ввода. Начальная высота окна задана ему
   самому — `min-height`, — а лента занимает в нём всё, что осталось.
   Стоял потолок 300 px, и растянутое окно оставалось наполовину
   белым: владелец 12.09.2026 — «чтобы вниз чат не пустым полем
   расстягивался». */
.poverhnost-polotno{--replika-pole:9px}
/* Снизу поле отступает от края окна столько же, сколько справа, —
   16 px: у полотна своих восемь и рамка, остальное добирает форма.
   Замерено браузером: было 9 снизу при 16 справа. */
.poverhnost-polotno .sprosit{padding-top:8px;padding-bottom:7px}
.poverhnost-polotno .zatravki{padding:2px 9px 4px}
.poverhnost-polotno .replika-otkuda{padding-left:var(--replika-pole);
  padding-right:var(--replika-pole)}
@media (prefers-reduced-motion:reduce){
  .poverhnost[open]>.poverhnost-polotno{animation:none}
}

/* ── Скопировать таблицу ─────────────────────────────────────────
   Найдено в SmoothUI (`button-copy`) и взято своим решением: портал
   открывают, чтобы взять цифру и положить её в переписку или в Excel,
   а взять её сейчас можно только мышью по строкам.

   Кнопка стоит в шапке карточки справа, ростом со значок шапки, и
   молчит, пока на карточку не навели: в шапке уже есть имя и период,
   и третий постоянный знак их теснит. */
.knopka-kopii{display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-kroha);height:var(--organ-kroha);margin-left:auto;
  padding:0;border:1px solid transparent;border-radius:var(--r-badge);
  background:none;color:var(--ink-3);cursor:pointer;
  opacity:0;transition:opacity .12s ease,color .12s ease}
.karta:hover .knopka-kopii,.knopka-kopii:focus-visible{opacity:1}
.knopka-kopii svg{width:16px;height:16px;display:block}
.knopka-kopii:hover{color:var(--ink);border-color:var(--kraj);
  background:var(--line)}
.knopka-kopii:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
/* Скопировалось — знак ненадолго зеленеет. Зелёный на портале заведён
   под пару «успел / не успел», и здесь он ровно об этом. */
.knopka-kopii.skopirovano{color:var(--zelenyj);opacity:1}
@media (prefers-reduced-motion:reduce){.knopka-kopii{transition:none}}
/* Клавиатурой кнопка достижима всегда: спрятанная прозрачностью, она
   остаётся в обходе, и без этого правила её не было бы видно даже
   под фокусом. */

/* Короткое сообщение о сделанном. Своя полоса «сохранено» на портале
   уже есть у отчётов; эта — для того, что делает скрипт и о чём
   сервер не знает. */
.skazano{position:fixed;z-index:60;left:50%;bottom:24px;
  transform:translate(-50%,12px);
  padding:9px 16px;border:1px solid var(--line);border-radius:var(--r-btn);
  background:var(--paper);color:var(--ink);font-size:13.5px;
  box-shadow:0 6px 18px -8px rgba(17,19,24,.4);
  opacity:0;pointer-events:none;
  transition:opacity .16s ease,transform .16s var(--plavno)}
.skazano.vidno{opacity:1;transform:translate(-50%,0)}
@media (prefers-reduced-motion:reduce){.skazano{transition:none}}
.skryto{position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap}
/* ── Хлебные крошки ───────────────────────────────────────────────
   Просьба владельца 12.09.2026: «хлебные крошки я хочу чтобы у нас
   везде были». Стоят в `base.html` один раз, поэтому есть на каждой
   странице.

   Набор тот же, что у шапки карточки: мелкий моноширинный, прописные,
   `--ink-3`. Так они читаются как подпись к странице, а не как ещё
   одно меню — второго меню в шапке и так хватает.

   Разделитель рисуется псевдоэлементом: в разметке его нет, и
   голосовой доступ читает цепочку без «слэш» между словами. */
.kroshki{margin:-12px 0 16px;padding:0}
.kroshki ol{display:flex;flex-wrap:wrap;align-items:center;gap:0;
  margin:0;padding:0;list-style:none}
.kroshki li{display:flex;align-items:center;min-width:0}
.kroshki li+li::before{content:"/";margin:0 8px;color:var(--line-2);
  flex:0 0 auto}
.kroshki a,.kroshki span{font:500 10.5px/1.5 var(--cifry);
  letter-spacing:.1em;text-transform:uppercase;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kroshki a{color:var(--ink-3);text-decoration:none;
  border-bottom:1px solid transparent}
.kroshki a:hover{color:var(--ink);border-bottom-color:var(--line-2)}
.kroshki a:focus-visible{outline:2px solid var(--fokus);outline-offset:2px;
  border-radius:var(--r-badge)}
/* Где человек стоит — виднее остальных: иначе цепочка читается как
   ряд одинаковых ссылок, и последнее звено теряется. */
.kroshki [aria-current="page"]{color:var(--ink-2)}
@media (max-width:700px){
  .kroshki{margin:-16px 0 12px}
  /* На телефоне середина цепочки прячется, концы остаются: «Главная /
     … / Наценка» отвечает на вопрос «где я» так же, а места занимает
     вчетверо меньше. */
  .kroshki li:not(:first-child):not(:last-child) a{max-width:6em}
}
.skroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{text-align:left;padding:9px 15px;border-bottom:1px solid var(--line);
  vertical-align:top}
thead th{font:500 10.5px/1.4 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);white-space:nowrap;
  background:var(--pale)}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--pale)}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
code,.mono{font-family:var(--cifry);font-size:.88em}

.metka{display:inline-block;font:500 10.5px/1.5 var(--cifry);letter-spacing:.05em;
  text-transform:uppercase;padding:2px 7px;border-radius:var(--r-badge);
  border:1px solid var(--line);color:var(--ink-2);background:var(--pale)}
.metka.red{border-color:var(--red);color:var(--red);background:var(--red-50)}
.metka.solid{border-color:var(--ink);background:var(--ink);color:var(--paper)}

.zametka{border:1px solid var(--line);border-radius:var(--r-card);
  padding:13px 16px;margin:18px 0;color:var(--ink-2);font-size:14px;
  background:var(--paper)}
.zametka b{color:var(--ink);font-weight:600}
.zametka.vazhno{border-color:var(--red);background:var(--red-50)}

/* ── хром органа: одно объявление на двадцать правил ─────────
   Край, скругление и подложка у поля, выпадашки, галочки и
   тихой кнопки одни и те же. Пока каждое правило объявляло
   их себе само, расходились они поодиночке и незаметно: край
   волосяной чертой нашёлся в девятнадцати правилах из двадцати
   разом. Что у органа своё — высота, поле внутри, набор — то и
   остаётся при нём. */
select,input[type=text],input[type=date],input.pole-daty,
.otbor select,.otbor input,
.knopka-krivoj,
.vybor>summary,
.vybor-sbros,
.vybor-poisk,
.vybor-esli,
.sohranit-forma input[type=text],.sohranit-forma select,
.vetka-stroka select,
.knopka-derevo,
.modalka-okno input[type=text],.modalka-okno select,
.zavesti input[type=text],.zavesti select,
.sohranit input[type=text],
.polosa-vida input[type=text],
.knopka-menyu,
.zad-forma input[type=number],.zad-forma textarea,
.sprosit textarea,
.zatravka,
.organy-knopka,
.otbor-pole input,.otbor-pole select,
.otbor-galka,
.podval-pole select,
.knopka.tihaya,
a.knopka-shapki,
.delaem-knopka,
.stroka-pravki input,
.chat-pole-imeni,
.period,
.dvojnaya,
a.kuda-ssylka,
.poisk-shapki input{
  border:1px solid var(--kraj);
  border-radius:var(--r-btn);
  background:var(--paper);
}

form.vstroj{display:flex;flex-wrap:wrap;gap:9px;align-items:center;padding:13px 15px}
select,input[type=text],input[type=date],input.pole-daty{
  min-height:var(--organ);padding:7px 11px;color:var(--ink);
  font:inherit;font-size:14px}
select:focus,input:focus{outline:none;border-color:var(--fokus);
  box-shadow:0 0 0 3px var(--fokus-fon)}
input{caret-color:var(--red)}
label.pakety{display:inline-flex;align-items:center;gap:5px;
  font-size:13px;color:var(--ink-2)}

/* ── страница «пусто» и ошибки ──────────────────────────────── */
.centr{max-width:34rem;margin:14vh auto 0;padding:0 20px}
.centr h1{font-size:clamp(24px,3.4vw,32px);letter-spacing:-.03em}
.centr p{color:var(--ink-2);font-size:16px}
.centr .knopka{margin-top:8px}

@media (max-width:720px){
  .shapka{padding:11px 14px}
  /* Правая часть шапки на телефоне переносится, а не выпирает за
     край. Семь органов в строку — 520 px при 336 доступных, и
     последние три уезжали за экран вместе со всей страницей: полотно
     выходило 606 px при 375 на всех тридцати семи страницах.
     Ничего не прячем: поиск встаёт своей строкой, остальное рядом. */
  .kto{margin-left:auto;flex-wrap:wrap;justify-content:flex-end;
       row-gap:8px}
  .poisk-shapki{flex:1 1 100%;order:1}
  .poisk-shapki input{width:100%}
  /* Орган произвольного периода на 320 px не влезает в строку: две
     даты с разделителем шире доступного. Он переносится целиком и
     занимает всю ширину — обрезать дату нельзя, а прокрутка ради
     одного органа читается как поломка. */
  .period.razdvinut{flex-wrap:wrap;height:auto;min-width:0}
  /* Подпись органа на самом узком экране переносится по словам.
     `nowrap` держал строку «Период · текущий месяц» целой, и орган
     не сужался ниже её длины — 313 px при 266 доступных. */
  .period.razdvinut>.vybor>summary{white-space:normal;min-width:0;
    height:auto;min-height:var(--organ)}
  .period.razdvinut .period-polya{flex:1 1 100%;min-width:0;
    padding:0 10px 6px}
  .period.razdvinut .period-polya input{flex:1 1 6rem;min-width:0}
}
/* Самый узкий экран: две даты рядом не помещаются ни при каком
   сужении — у поля даты своя нижняя мера, и браузер её не отдаёт.
   Ставим их друг под друга. «Сходимость» и «Песочница» на 320 px
   уезжали вбок ровно на эту разницу. */
@media (max-width:400px){
  .period.razdvinut .period-polya{flex-wrap:wrap;row-gap:4px}
  .period.razdvinut .period-polya input{flex:1 1 100%}
  .period.razdvinut .period-palka{display:none}
  /* Ряд органов на самом узком экране переносится, и орган периода
     занимает в нём всю строку: рядом с ним ничего не помещается. */
  .grafik-upravlenie .ryad,.otbor-polosa{flex-wrap:wrap;min-width:0}
  .ryad>.period{flex:1 1 100%}
  .vhod-polotno{padding:clamp(30px,7vh,64px) 22px}
  .vhod-znak{width:112px;margin-bottom:22px}
  .vhod p{max-width:none}
  .knopka{width:100%;justify-content:center}
}

/* ── реестры: отбор, длинные таблицы, листание ───────────────── */
.otbor{
  display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end;
  margin:16px 0 0;padding:13px 15px;
  border:1px solid var(--line);border-radius:var(--r-card);background:var(--paper);
}
.otbor label{display:flex;flex-direction:column;gap:5px;
  font:500 10.5px/1.4 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3)}
.otbor select,.otbor input{
  font:400 14px/1.4 var(--shrift);color:var(--ink);
  padding:7px 9px;min-width:15rem;}
.otbor input{min-width:19rem}
.otbor select:focus-visible,.otbor input:focus-visible{
  outline:2px solid var(--fokus);outline-offset:1px;border-color:var(--fokus)}
.knopka.mal{height:var(--organ-mal);padding:0 15px;font-size:13.5px}
.sbros{font-size:13px;color:var(--ink-3);padding-bottom:9px}

/* Реестр — длинная таблица: мельче, плотнее, длинный текст переносится
   внутри колонки, а не растягивает её на весь экран. */
.reestr{font-size:13px}
.reestr th,.reestr td{padding:7px 12px}
.reestr td,.reestr th{white-space:nowrap}
.reestr td.w,.reestr th.w{white-space:normal;min-width:14ch;max-width:34ch;
  overflow-wrap:anywhere}
.reestr tbody tr:nth-child(even){background:var(--field)}
.reestr tbody tr:hover{background:var(--pale)}
.syroj td,.syroj th{font-family:var(--cifry);font-size:12px;white-space:nowrap}
.syroj td{max-width:52ch;overflow:hidden;text-overflow:ellipsis}
.imya-fajla{margin:-6px 0 6px;font-size:13px;color:var(--ink-2);
  overflow-wrap:anywhere}


@media (max-width:720px){
  .otbor select,.otbor input{min-width:0;width:100%}
  .otbor label{width:100%}
}

.ryadom{display:inline-flex;gap:12px;align-items:baseline}
.ssylka.tiho{color:var(--ink-3)}

/* Красный тратится на одно действие страницы. Повторяющаяся построчная
   кнопка — не оно: пять красных «Сохранить» подряд кричат все разом.
   Одета она общим правилом тихой кнопки выше. */

.stroka-pravki{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.stroka-pravki input{font:400 13.5px/1.4 var(--shrift);color:var(--ink);
  padding:6px 9px;min-width:13rem}
.stroka-pravki .uzkoe{min-width:7rem;max-width:9rem}
.stroka-pravki input:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
tr.snyato td{opacity:.55}

.otbor-perioda input[type=date],
.otbor-perioda input.pole-daty{min-width:9rem}
.presety{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;
  margin:10px 0 0;font-size:13.5px}
.dve-kolonki{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
tfoot td{border-top:1px solid var(--line-2);background:var(--pale)}

/* Шапка-сортировка: заголовок остаётся заголовком, а не превращается
   в кнопку. Стрелка появляется только у столбца, по которому сортируем. */
thead a.sort{color:inherit;text-decoration:none;display:inline-flex;gap:5px;
  align-items:baseline;white-space:nowrap}
thead a.sort:hover{color:var(--ink)}
thead a.sort.est{color:var(--ink)}
.strelka{font-size:11px;color:var(--red)}

a.raskryt{color:inherit;text-decoration:none}
a.raskryt:hover{color:var(--red)}
tr.otkryta>td{background:var(--pale)}
tr.raskrytie>td{background:var(--field);padding:12px 15px}
table.vlozhennaya{margin-top:8px;background:var(--paper)}
table.vlozhennaya thead th{background:var(--paper)}

/* Раскрытие: высота едет от нуля к содержимому. Приём с grid-template-rows
   вместо max-height — не надо угадывать предельную высоту, а угаданная
   всегда однажды окажется мала. */
.raskrytie-telo{display:grid;grid-template-rows:1fr;opacity:1;
  transition:grid-template-rows .26s var(--plavno), opacity .2s ease}
.raskrytie-nutro{overflow:hidden;min-height:0}
tr.raskrytie.svyornuto .raskrytie-telo{grid-template-rows:0fr;opacity:0}
tr[hidden]{display:none}
a.raskryt.zhdyom .ugolok{opacity:.4}
a.raskryt{cursor:pointer}

@media (prefers-reduced-motion: reduce){
  .raskrytie-telo{transition:none}
}

/* Кнопка в шапке таблицы: действие, а не заголовок, поэтому обводка,
   а не красная заливка — красный на странице уже занят «Сформировать». */
.v-shapke{display:inline-flex;gap:12px;align-items:center}
a.knopka-shapki{font:500 10.5px/1.5 var(--cifry);letter-spacing:.05em;
  text-transform:uppercase;text-decoration:none;
  padding:3px 9px;color:var(--ink-2);white-space:nowrap;
  /* Скругление своё: это метка в двадцать пикселей высотой, и
     восьмипиксельный радиус кнопки делает из неё таблетку. */
  border-radius:var(--r-badge)}
a.knopka-shapki:hover{border-color:var(--ink);color:var(--ink)}
a.knopka-shapki.vklyuchena{border-color:var(--red);color:var(--red);
  background:var(--red-50)}

tr.zagolovok-gruppy>td{background:var(--pale);border-top:1px solid var(--line-2);
  font-variant-numeric:tabular-nums}
tbody.gruppa:first-of-type tr.zagolovok-gruppy>td{border-top:none}
tbody.gruppa tr:not(.zagolovok-gruppy):not(.raskrytie) td:first-child{padding-left:30px}

#rezultat{transition:opacity .12s ease}
/* Ожидание куска. Просьба владельца 12.09.2026 по образцу
   skeleton-loader: пока сервер считает, по ящику идёт волна — видно,
   что портал работает, а не завис.

   Волна поверх прежнего содержимого, а не вместо него: подменять
   цифры серыми прямоугольниками нельзя — человек на них смотрит, и
   исчезнувшая цифра читается как «данных нет». Прежнее приглушено и
   не нажимается. */
#rezultat.zhdyom,.zhdyom[data-korob-cel]{position:relative;opacity:.55;
  pointer-events:none}
#rezultat.zhdyom::after,.zhdyom[data-korob-cel]::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(100deg,transparent 20%,
    var(--vydelenie) 48%,transparent 76%);
  background-size:220% 100%;
  animation:volna-ozhidaniya 1.1s linear infinite}
@keyframes volna-ozhidaniya{
  from{background-position:120% 0}
  to{background-position:-120% 0}
}
@media (prefers-reduced-motion:reduce){
  #rezultat.zhdyom::after,.zhdyom[data-korob-cel]::after{animation:none;
    background:none}
}

/* Цифра, которая переменилась после смены отбора. Просьба владельца
   12.09.2026 по образцу number-flow, но без перемотки цифр: катить
   их от старого значения к новому значит показывать полсекунды
   число, которого нет. Здесь отмечается только сам факт перемены —
   глаз находит, что сдвинулось, а неверного не показывается никогда. */
.peremenilos{animation:cifra-peremenilas .7s var(--plavno)}
@keyframes cifra-peremenilas{
  from{background:var(--vydelenie)}
  to{background:transparent}
}
@media (prefers-reduced-motion:reduce){.peremenilos{animation:none}}

/* Раскрытие второго уровня: товары чека под строкой визита. */
a.raskryt.chek{display:inline-block;min-width:14px}
tr.vozvrat td{color:var(--red)}
/* Раскрытие — на белом: серая подложка сливалась с самой таблицей, и было
   не видно, где кончается строка и начинается её разбор. Отделяет не цвет,
   а рамка и отступ. */
/* Раскрытие обведено слева и снизу одной рамкой — так линии сходятся в
   угол. Отступы держит она же: будь они на ячейке, рамка не дотянулась бы
   до края, а полоса слева, живи она на ячейке, уходила бы ниже черты.
   Ниже рамки остаётся поле белого до следующей строки, и мягкая тень на
   него — чтобы разбор одного дня отделялся от таблицы объёмом. */
tr.chek-raskrytie>td{background:var(--paper);padding:0 0 16px}
.ramka-raskrytiya{padding:12px 14px 14px;
  border-left:2px solid var(--line-2);border-bottom:2px solid var(--line-2);
  box-shadow:0 6px 8px -7px rgba(17,19,24,.28)}
@media (prefers-color-scheme: dark){html:not([data-tema="den"]) .ramka-raskrytiya{box-shadow:0 6px 8px -7px rgba(0,0,0,.6)}
}
html[data-tema="noch"] .ramka-raskrytiya{box-shadow:0 6px 8px -7px rgba(0,0,0,.6)}

/* Категорийный отчёт: блоки колонок над обычной шапкой. */
tr.bloki th{border-bottom:1px solid var(--line-2);font:500 10px/1.4 var(--cifry);
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);text-align:center}
tr.bloki th.blok{border-left:1px solid var(--line-2)}
td.vnimanie{background:var(--red-50)}
.kategorii td,.kategorii th{padding:6px 10px}

tr.neprodazha td:first-child{color:var(--red)}

/* ── главная: одна крупная цифра и пояснение к ней ───────────── */
.shapka-cifry{display:grid;gap:18px 34px;align-items:end;margin:8px 0 22px;
  grid-template-columns:minmax(220px,auto) minmax(240px,1fr)}
.cifra-podpis{font:500 10.5px/1.4 var(--cifry);letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:4px}
.cifra{font-size:clamp(54px,9vw,86px);font-weight:600;letter-spacing:-.045em;
  line-height:1;font-variant-numeric:tabular-nums}
.cifra .procent{font-size:.42em;font-weight:500;letter-spacing:-.01em}
.dvizhenie{margin-top:8px;font-size:14px;color:var(--ink-2)}
.dvizhenie.vverh{color:var(--ink)}
.dvizhenie.vniz{color:var(--red)}
.cifra-slovami{font-size:16px;line-height:1.55;color:var(--ink-2);
  padding-bottom:6px;max-width:44ch}

/* Полоска вместо графика: её понимает любой, ей не нужна легенда. */
.polosy{padding:6px 15px 12px}
.polosa-stroka{display:grid;gap:12px;align-items:center;padding:6px 0;
  grid-template-columns:minmax(90px,1.4fr) minmax(80px,3fr) 62px 74px}
.polosa-stroka.glavnaya{font-weight:600;border-bottom:1px solid var(--line);
  padding-bottom:10px;margin-bottom:4px}
.polosa-imya{overflow-wrap:anywhere}
.polosa-zhelob{height:9px;background:var(--pale);border-radius:99px;overflow:hidden}
/* Там, где есть тень прошлого периода, жёлобу нужен рост под обе полосы. */
.polosy.s-tenyu .polosa-zhelob{height:13px;background:none}
.polosy.s-tenyu .polosa-zapolnenie{height:9px}

/* Строки виджета прибыли. Имена здесь длинные — сегменты и категории, — и
   колонке под них нужно место, иначе «Аккумуляторы автомобильные» встаёт
   в четыре строки, а «Услуги» в одну, и список читается лесенкой. */
.polosy.pribyl-polosy .polosa-stroka{
  grid-template-columns:minmax(0,1.6fr) minmax(90px,2.4fr) 92px 62px;
  align-items:center;
  min-height:32px;
}
.polosy.pribyl-polosy .polosa-imya{
  overflow-wrap:normal;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@media (max-width:768px){
  .polosy.pribyl-polosy .polosa-stroka{
    grid-template-columns:minmax(0,1.4fr) minmax(40px,1fr) 78px 52px;
    gap:8px;
  }
}
.polosa-zapolnenie{height:100%;background:var(--ink-2);border-radius:99px}
.polosa-stroka.glavnaya .polosa-zapolnenie{background:var(--red)}
/* «244 тыс.» переносилось на две строки и разгоняло свою строку вдвое,
   а соседние оставались низкими — список читался лесенкой. Цифру не
   переносим никогда: ей отдаётся место, а не высота. */
.polosa-cifra{text-align:right;font-variant-numeric:tabular-nums;
  white-space:nowrap}
.polosa-baza{white-space:nowrap}
.polosa-baza{text-align:right;font-size:12.5px}

.vnimanie{display:flex;flex-direction:column}
.vnimanie-stroka{display:block;padding:11px 15px;border-bottom:1px solid var(--line);
  text-decoration:none;color:var(--ink)}
.vnimanie-stroka:last-child{border-bottom:none}
a.vnimanie-stroka:hover{background:var(--pale);color:var(--ink)}
.vnimanie-chto{display:block;font-weight:500}
.vnimanie-stroka.trevoga .vnimanie-chto{color:var(--red)}
.vnimanie-stroka .tiho{display:block;margin-top:2px}

.kuda{display:flex;flex-wrap:wrap;gap:10px 14px;padding:13px 15px}
a.kuda-ssylka{text-decoration:none;padding:8px 13px;font-size:14px;color:var(--ink-2)}
a.kuda-ssylka:hover{border-color:var(--ink);color:var(--ink);background:var(--pale)}

@media (max-width:720px){
  .shapka-cifry{grid-template-columns:1fr}
  .polosa-stroka{grid-template-columns:minmax(70px,1.2fr) minmax(50px,2fr) 54px 60px;
    gap:8px;font-size:13.5px}
}

/* Строка плана на главной: не плитка, а фраза с действием. */
.plan-stroka{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;
  border:1px solid var(--line);border-left:3px solid var(--ink-2);
  border-radius:var(--r-card);background:var(--paper);padding:13px 17px;margin:0 0 18px}
.plan-stroka.trevoga{border-left-color:var(--red)}
.plan-glavnoe{font-size:17px}
.plan-podrobnee{color:var(--ink-2);font-size:14px;line-height:1.5;flex:1 1 20rem}
.plan-stroka .kuda-ssylka{margin-left:auto}

/* ── график трафика и конверсии ─────────────────────────────────
   Прибор, а не иллюстрация. Красный тратится ровно на одно — на линию
   конверсии, ради которой всё и рисуется. Поток держится внизу отдельной
   полосой: две шкалы на одном поле путают, а разнесённые панели читаются
   сразу — «вот процент, вот из скольких людей».
   Геометрию считает сервер, здесь только облик. */
.grafik-karta{margin-top:18px;
  /* `.karta` режет всё, что вылезло за её край, — и срезала выпадающий
     список до одной строки, когда сама карта была короткой. Скругление
     углов переезжает на заголовок: ради него это `overflow` и стоял. */
  overflow:visible}
.grafik-karta>h3{border-radius:calc(var(--r-card) - 1px) calc(var(--r-card) - 1px) 0 0}
.grafik-karta>:last-child{border-radius:0 0 calc(var(--r-card) - 1px) calc(var(--r-card) - 1px)}
.grafik-upravlenie{display:flex;flex-wrap:wrap;gap:10px 16px;
  align-items:center;justify-content:space-between;padding:12px 15px;
  border-bottom:1px solid var(--line);
  /* Одна высота на все органы отбора. Разнобой в 34, 38 и 40 пикселей
     читается как небрежность даже тогда, когда его не умеют назвать. */
  --vysota:var(--organ)}

/* Кнопки кривых. Каждая включается и гаснет сама по себе: обе, одна или
   ни одной. Метка слева от названия — тот же цвет, которым линия нарисована,
   так что кнопка заодно и легенда. */
.krivye{display:inline-flex;gap:8px;flex-wrap:wrap}
.knopka-krivoj{display:inline-flex;align-items:center;gap:8px;
  height:var(--vysota);padding:0 14px;color:var(--ink-3);
  font-size:13.5px;text-decoration:none;white-space:nowrap;
  transition:border-color .14s ease,color .14s ease,background .14s ease}
.knopka-krivoj::before{content:"";display:block;width:15px;height:2.5px;
  border-radius:2px;background:var(--line-2);transition:background .14s ease}
.knopka-krivoj:hover{color:var(--ink);border-color:var(--ink-3);
  text-decoration:none}
.knopka-krivoj.vklyuchena{color:var(--ink);border-color:var(--ink-3);
  background:var(--pale);font-weight:500}
.krivaya-konversiya.vklyuchena::before{background:var(--red)}
.krivaya-trafik.vklyuchena::before{background:var(--ink-2)}

.grafik-otbor{display:flex;gap:9px;align-items:center;margin:0;flex-wrap:wrap}
/* `min-height` у кнопки — 48 px, и без его снятия высота не сходится:
   `height` его не перебивает, а разнобой в десять пикселей виден сразу. */
.grafik-otbor .knopka.mal{height:var(--vysota);min-height:var(--vysota)}

/* Выбор галочками. `details` взят не ради моды: без скрипта он всё равно
   раскрывается и отбор всё равно уходит кнопкой. Скрипт добавляет только
   каскад «подразделение → магазины» и применение при закрытии. */
.vybor{position:relative}
.vybor>summary{display:inline-flex;align-items:center;gap:8px;
  height:var(--vysota);padding:0 12px;cursor:pointer;list-style:none;
  font-size:13.5px;color:var(--ink-3);
  white-space:nowrap;transition:border-color .14s ease}
.vybor>summary::-webkit-details-marker{display:none}
.vybor>summary:hover{border-color:var(--ink-3)}
.vybor[open]>summary{border-color:var(--ink);color:var(--ink)}
.vybor>summary b{color:var(--ink);font-weight:600}
.vybor>summary .ugolok{color:var(--ink-3);font-size:10px;
  transition:transform .16s var(--plavno)}
.vybor[open]>summary .ugolok{transform:rotate(180deg)}

.vybor-polotno{position:absolute;z-index:30;top:calc(100% + 6px);right:0;
  /* Ширина — по самому длинному пункту в пределах (владелец 14.09.2026: «адаптировать
     у всех фильтров ширину до разумных пределов, чтобы „Комментарий продавца“ точно
     помещался»): узкое полотно переносило имя на две строки. */
  width:max-content;min-width:320px;max-width:min(440px,86vw);
  max-height:min(58vh,380px);overflow:auto;padding:6px;
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-card);box-shadow:0 14px 32px rgba(17,19,24,.16);overscroll-behavior:contain
}
@media (prefers-color-scheme: dark){html:not([data-tema="den"]) .vybor-polotno{box-shadow:0 14px 32px rgba(0,0,0,.5)}
}
html[data-tema="noch"] .vybor-polotno{box-shadow:0 14px 32px rgba(0,0,0,.5)}

.vybor-punkt{display:flex;gap:9px;align-items:center;padding:6px 9px;
  border-radius:var(--r-btn);font-size:13.5px;cursor:pointer;line-height:1.35}
.vybor-punkt:hover{background:var(--line)}
.vybor-punkt input{accent-color:var(--red);width:15px;height:15px;margin:0;
  flex:0 0 auto}
.vybor-punkt .kod{font:600 11.5px var(--cifry);color:var(--ink-3);
  flex:0 0 auto;min-width:1.6em}
.vybor-punkt .skolko{margin-left:auto;font:500 11.5px var(--cifry);
  color:var(--ink-3);flex:0 0 auto;font-variant-numeric:tabular-nums}
.vybor-vse{font-weight:600;border-radius:0;margin-bottom:4px;padding-bottom:9px;
  border-bottom:1px solid var(--line)}
.vybor-uzkij{min-width:184px}
.vybor-gruppa{border-top:1px solid var(--line);padding:3px 0}
.vybor-gruppa:first-of-type{border-top:none}
.vybor-glava{font-weight:600}
.vybor-vlozhennyj{padding-left:28px}
.vybor-sbros{display:block;width:100%;margin-top:5px;padding:7px 9px;
  color:var(--ink-2);font:inherit;font-size:13px;
  cursor:pointer}
.vybor-sbros:hover{border-color:var(--ink);color:var(--ink)}

/* Что именно сейчас на экране. Состав потока меняет знаменатель, а значит
   и конверсию: цифра разойдётся со сводкой, и разойдётся незаметно. */
.pokazyvaetsya{padding:10px 15px;border-bottom:1px solid var(--line);
  background:var(--field);font-size:13.5px;color:var(--ink-2);line-height:1.5}
.pokazyvaetsya b{color:var(--ink);font-weight:600}
.pokazyvaetsya .otlichie{color:var(--red)}
.pokazyvaetsya.trevoga{background:var(--red-50);color:var(--ink)}

.grafik-plitki{margin:0;border:none;border-radius:0;
  border-bottom:1px solid var(--line)}
.grafik-plitki .v{font-size:23px}
/* Значение плитки в одну строку. «1023 шт / 10,5 млн» — восемнадцать
   знаков в 189 px: при 23 px оно переносилось, и плитка вырастала
   вдвое против соседних. Подгоняем размером, а не переносом. */
.grafik-plitki .v{white-space:nowrap;
  font-size:clamp(15px, 1.45vw, 23px)}
.grafik-plitki .vverh{color:var(--ink);font-weight:600}
.grafik-plitki .vniz{color:var(--red);font-weight:600}

.grafik-pole{padding:14px 15px 4px}
svg.grafik{display:block;width:100%;height:auto;min-width:640px;
  overflow:visible}

.setka-liniya{stroke:var(--setka);stroke-width:1}
.os-podpis{fill:var(--ink-3);font:500 11px/1 var(--cifry);text-anchor:start}
.os-podpis.os-sleva{text-anchor:end}
.den-podpis{fill:var(--ink-3);font:500 11px/1 var(--cifry);text-anchor:middle}
.polosa-podpis{fill:var(--ink-3);font:500 9.5px/1 var(--cifry);
  letter-spacing:.09em;text-transform:uppercase}

.stop-verh{stop-color:var(--red);stop-opacity:.16}
.stop-niz{stop-color:var(--red);stop-opacity:0}
.stop-verh-t{stop-color:var(--ink-2);stop-opacity:.16}
.stop-niz-t{stop-color:var(--ink-2);stop-opacity:0}
/* Полоса между кривыми. Вид, а не мера: шкалы у кривых разные, и ширина
   полосы ничему в людях не равна — так и написано в легенде. */
.zalivka-mezhdu{fill:var(--ink-3);opacity:.13;stroke:none}
.zalivka{fill:url(#pod-liniej);stroke:none}
.liniya{fill:none;stroke:var(--red);stroke-width:2.4;
  stroke-linejoin:round;stroke-linecap:round}
/* Трафик — вторая кривая. Красный оставлен конверсии: когда на поле две
   линии, цвет и есть подпись, какая из них какая. */
.liniya-t{fill:none;stroke:var(--ink-2);stroke-width:2.2;
  stroke-linejoin:round;stroke-linecap:round}

.trend{fill:none;stroke:var(--red);stroke-width:1.5;stroke-dasharray:7 5;
  opacity:.42;stroke-linecap:round}
.trend.trend-t{stroke:var(--ink-2);opacity:.5}
.prizrak{fill:none;stroke:var(--ink-3);stroke-width:1.4;stroke-dasharray:2 4;
  opacity:.6}
.srednyaya{stroke:var(--line-2);stroke-width:1;stroke-dasharray:1 4}
.srednyaya-podpis{fill:var(--ink-3);font:500 10px/1 var(--cifry)}
.srednyaya-fon{fill:var(--paper);opacity:.82}

.stolb{fill:var(--line-2);opacity:.5}
.stolb.vyhodnoj{opacity:.3}
.stolb-kupili{fill:var(--ink-3);opacity:.62}

/* Подсказка. Ловушка на всю высоту поля, чтобы попадать в неё мышью не
   целясь: столбец в два пикселя иначе не поймать. */
.lovushka{fill:transparent}
.volos{stroke:var(--ink-3);stroke-width:1;stroke-dasharray:2 3;opacity:0}
.krug{fill:var(--paper);stroke:var(--red);stroke-width:2;opacity:0;
  transition:opacity .12s ease}
.krug.krug-t{stroke:var(--ink-2)}
.krug.vidno{opacity:1}
/* Наведение — только там, где оно есть. На касании браузер держит
   `:hover` у последней тронутой точки, и второе касание не убирало бы
   карточку. Там её показывает класс `vybrana`, его ставит скрипт. */
@media (hover:hover){
  .tochka:hover .volos{opacity:.55}
  .tochka:hover .krug{opacity:1;stroke-width:3}
  /* Пока открыта подсказка, соседние точки гаснут. Не украшение: в SVG
     нет слоёв, и кружок следующей засечки рисуется поверх подсказки
     предыдущей — красная клякса поперёк цифры. Заодно взгляд ведётся к
     той точке, о которой речь. */
  svg.grafik:has(.tochka:hover) .tochka:not(:hover) .krug.vidno{opacity:.12}
  .tochka:hover .podskazka{opacity:1}
}
.podskazka{opacity:0;pointer-events:none;transition:opacity .12s ease}
/* Клавиатура и касание — то же, что мышь. Задание «банк диаграмм»,
   этап 3: с клавиатуры точка фокуса не получала, на телефоне карточки не
   было вовсе. */
.tochka:focus-visible .volos,.tochka.vybrana .volos{opacity:.55}
.tochka:focus-visible .krug,.tochka.vybrana .krug{opacity:1;stroke-width:3}
svg:has(.tochka:focus-visible) .tochka:not(:focus-visible) .krug.vidno,
svg:has(.tochka.vybrana) .tochka:not(.vybrana) .krug.vidno{opacity:.12}
.tochka:focus-visible .podskazka,.tochka.vybrana .podskazka{opacity:1}
/* Обводка фокуса — по ловушке. Группе SVG браузеры рисуют обводку
   каждый по-своему, а ловушка — прямоугольник во всю полосу точки. */
.tochka:focus-visible{outline:none}
.tochka:focus-visible .lovushka{stroke:var(--fokus);stroke-width:2}

/* ── Полоса: рейтинг, доля до ста, отклонение от нормы ─────────────
   Банк диаграмм, этап 4. Ширина рисунка — ширина карточки в пикселях,
   и шире своей он не растягивается: буквы в SVG растут вместе с
   рисунком. Общий нижний предел графиков в 640 px полосе не нужен — она
   сама знает свою ширину. */
svg.brus{width:auto;max-width:100%;height:auto;min-width:0;overflow:visible}
.brus-polosa{fill:var(--ink-2)}
.brus-polosa.brus-plyus{fill:var(--zelenyj)}
.brus-polosa.brus-minus{fill:var(--red)}
.brus-zhelob{fill:var(--zhelob)}
.brus-imya{fill:var(--ink-2);font:400 12.5px/1 var(--shrift)}
.brus-znachenie{fill:var(--ink);font:600 12.5px/1 var(--cifry);
  font-variant-numeric:tabular-nums}
svg.brus-vertikal .brus-imya,svg.brus-vertikal .brus-znachenie{text-anchor:middle}
/* Крайние имена под тесными столбцами встают от края рисунка, а не
   серединой: серединой крайнее имя наполовину уехало бы за край. */
svg.brus-vertikal .brus-imya.brus-u-nachala{text-anchor:start}
svg.brus-vertikal .brus-imya.brus-u-konca{text-anchor:end}
.brus-os{stroke:var(--ink-3);stroke-width:1}
.brus-cel{stroke:var(--ink);stroke-width:1.5;stroke-dasharray:4 3;opacity:.7}
.brus-cel-podpis{fill:var(--ink-2);font:500 11px/1 var(--shrift);text-anchor:middle}
svg.brus-vertikal .brus-cel-podpis{text-anchor:end}
.brus-skryto{margin:6px 0 0;font-size:12px}
/* Смотришь на одну полосу — остальные отступают, как точки трафика. */
@media (hover:hover){
  svg.brus:has(.tochka:hover) .tochka:not(:hover) .brus-polosa{opacity:.45}
}
svg.brus:has(.tochka:focus-visible) .tochka:not(:focus-visible) .brus-polosa,
svg.brus:has(.tochka.vybrana) .tochka:not(.vybrana) .brus-polosa{opacity:.45}

/* ── Точки: связаны ли две величины ──────────────────────────────
   Банк диаграмм, этап 5. Шкала от данных и подписана делениями — сетка
   и подписи общие с трафиком; средние пунктиром, выбросы именем. Ширина
   рисунка — ширина карточки, шире своей он не растягивается. */
svg.oblako{width:auto;max-width:100%;height:auto;min-width:0;overflow:visible}
.oblako-krug{fill:var(--ink-2);stroke:var(--paper);stroke-width:1.5}
.oblako-os{fill:var(--ink-2);font:500 11.5px/1 var(--shrift);text-anchor:middle}
.oblako-os.oblako-os-y{text-anchor:start}
.os-podpis.oblako-niz{text-anchor:middle}
.oblako-podpis{fill:var(--ink);font:500 11.5px/1 var(--shrift)}
/* Подписи всех точек отчёта — тише выбросов: их много, и главное в
   рисунке — положение, а не текст. Выноска — волосяной чертой. */
.oblako-podpis.oblako-podpis-vse{fill:var(--ink-2);font-weight:400}
.oblako-vynoska{stroke:var(--line-2);stroke-width:1}
.oblako-svyaz{margin:6px 0 0;font-size:12.5px}
@media (hover:hover){
  .oblako-tochka:hover .oblako-krug{fill:var(--red)}
  svg.oblako:has(.tochka:hover) .tochka:not(:hover) .oblako-krug,
  svg.oblako:has(.tochka:hover) .tochka:not(:hover) .oblako-podpis-vse{opacity:.35}
}
.oblako-tochka:focus-visible .oblako-krug,.oblako-tochka.vybrana .oblako-krug{fill:var(--red)}
svg.oblako:has(.tochka:focus-visible) .tochka:not(:focus-visible) .oblako-krug,
svg.oblako:has(.tochka.vybrana) .tochka:not(.vybrana) .oblako-krug{opacity:.35}

/* ── Матрица: где провал в двух разрезах ─────────────────────────
   Банк диаграмм, этап 6. Пять ступеней замешиваются из роли портала и
   подложки: ночь подменяет роли — подменяются и ступени, второй палитры
   нет. Пустая клетка — пунктирная рамка без заливки: «нет данных» не
   ступень нуля. */
svg.matrica{width:auto;max-width:100%;height:auto;min-width:0;overflow:visible}
.matrica-plohoe .matrica-s0{fill:color-mix(in srgb,var(--red) 10%,var(--paper))}
.matrica-plohoe .matrica-s1{fill:color-mix(in srgb,var(--red) 28%,var(--paper))}
.matrica-plohoe .matrica-s2{fill:color-mix(in srgb,var(--red) 46%,var(--paper))}
.matrica-plohoe .matrica-s3{fill:color-mix(in srgb,var(--red) 66%,var(--paper))}
.matrica-plohoe .matrica-s4{fill:color-mix(in srgb,var(--red) 86%,var(--paper))}
.matrica-nejtral .matrica-s0{fill:color-mix(in srgb,var(--ink-2) 10%,var(--paper))}
.matrica-nejtral .matrica-s1{fill:color-mix(in srgb,var(--ink-2) 28%,var(--paper))}
.matrica-nejtral .matrica-s2{fill:color-mix(in srgb,var(--ink-2) 46%,var(--paper))}
.matrica-nejtral .matrica-s3{fill:color-mix(in srgb,var(--ink-2) 66%,var(--paper))}
.matrica-nejtral .matrica-s4{fill:color-mix(in srgb,var(--ink-2) 86%,var(--paper))}
.matrica-pusto{fill:none;stroke:var(--line-2);stroke-width:1;stroke-dasharray:3 2}
.matrica-stroka{fill:var(--ink-2);font:400 11.5px/1 var(--shrift);text-anchor:end}
.matrica-stolbec{fill:var(--ink-2);font:500 11px/1 var(--shrift);text-anchor:middle}
.matrica-chislo{fill:var(--ink);font:500 10.5px/1 var(--cifry);text-anchor:middle;
  pointer-events:none}
.matrica-chislo.matrica-svetlo{fill:var(--paper)}
.matrica-klyuch{fill:var(--ink-3);font:400 10.5px/1 var(--cifry)}
@media (hover:hover){
  .matrica-kletka:hover rect:not(.lovushka){stroke:var(--ink);stroke-width:1.5}
}
.matrica-kletka:focus-visible rect:not(.lovushka),
.matrica-kletka.vybrana rect:not(.lovushka){stroke:var(--ink);stroke-width:1.5}

/* ── Накопленная доля: какие немногие дают почти всё ──────────────
   Банк диаграмм, этап 7. Столбики на левой оси, кривая доли на правой;
   сетка только у левой, чтобы две шкалы не путались на одних линиях.
   Столбики до порога темнее: это и есть «немногие». Точку кривой у
   столбика показывает общий .krug — тот же, что у трафика. */
svg.nakoplenie{width:auto;max-width:100%;height:auto;min-width:0;overflow:visible}
.nakoplenie-stolb{fill:var(--line-2)}
.nakoplenie-stolb.nakoplenie-nemnogie{fill:var(--ink-2)}
.nakoplenie-krivaya{fill:none;stroke:var(--red);stroke-width:2;stroke-linejoin:round;
  pointer-events:none}
.nakoplenie-porog{stroke:var(--ink-3);stroke-width:1;stroke-dasharray:4 3;pointer-events:none}
.os-podpis.nakoplenie-porog-podpis{fill:var(--ink-2);font-weight:600}
.nakoplenie-imya{fill:var(--ink-3);font:400 11px/1 var(--shrift);text-anchor:middle}
.nakoplenie-vyvod{margin:6px 0 0;font-size:12.5px}
@media (hover:hover){
  svg.nakoplenie:has(.tochka:hover) .tochka:not(:hover) .nakoplenie-stolb{opacity:.45}
}
svg.nakoplenie:has(.tochka:focus-visible) .tochka:not(:focus-visible) .nakoplenie-stolb,
svg.nakoplenie:has(.tochka.vybrana) .tochka:not(.vybrana) .nakoplenie-stolb{opacity:.45}

/* ── Малые кратные: один рисунок на всех сразу ─────────────────────
   Банк диаграмм, этап 8. Зазор — тот же ZAZOR, что в malye.py: ширину
   рисунка считает сервер, и разойтись с сеткой ей нельзя. Число в ряд —
   классом, а не стилем: правило содержимого не пускает style="". */
.malye{display:grid;gap:12px;align-items:start}
.malye-v-ryad-1{grid-template-columns:minmax(0,1fr)}
.malye-v-ryad-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.malye-v-ryad-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.malye-v-ryad-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.malye-v-ryad-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.malye-v-ryad-6{grid-template-columns:repeat(6,minmax(0,1fr))}
.malye-risunok{margin:0;min-width:0}
.malye-imya{margin:0 0 4px;color:var(--ink-2);font:500 12.5px/1.3 var(--shrift);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.malye-pometka{color:var(--ink-3);font-weight:400}
.malye-shkala{margin:0 0 8px;font-size:12.5px}
.malye-pusto{margin:8px 0 0;font-size:12px}
.malye-skryto{margin:6px 0 0;font-size:12px}
.podskazka-fon{fill:var(--ink);stroke:none}
.podskazka-zag{fill:var(--paper);font:600 12.5px/1 var(--shrift)}
.podskazka-imya{fill:var(--podskazka-tiho);font:400 12px/1 var(--shrift)}
.podskazka-znachenie{fill:var(--paper);font:600 12.5px/1 var(--cifry);
  text-anchor:end;font-variant-numeric:tabular-nums}

.grafik-legenda{display:flex;flex-wrap:wrap;gap:5px 18px;align-items:center;
  padding:4px 15px 13px;font-size:12.5px;color:var(--ink-2)}
.klyuch{display:inline-flex;align-items:center;gap:7px}
.klyuch::before{content:"";display:block}
.liniya-klyuch::before{width:17px;height:2.5px;border-radius:2px;
  background:var(--red)}
.liniya-t-klyuch::before{width:17px;height:2.5px;border-radius:2px;
  background:var(--ink-2)}
.trend-klyuch::before{width:17px;border-top:2px dashed var(--red);opacity:.5}
.trend-t-klyuch::before{border-top-color:var(--ink-2)}
.prizrak-klyuch::before{width:17px;border-top:2px dotted var(--ink-3)}
.stolb-klyuch::before{width:9px;height:12px;border-radius:1px;
  background:var(--ink-3);opacity:.62}
.mezhdu-klyuch::before{width:15px;height:11px;border-radius:2px;
  background:var(--ink-3);opacity:.28}
.vyhodnoj-klyuch::before{width:9px;height:12px;border-radius:1px;
  background:var(--line-2);opacity:.45}
.grafik-podval{padding:0 15px 14px}

@media (max-width:700px){
  .grafik-upravlenie{gap:10px;padding:11px 12px}
  /* Пять шагов помещаются в 375 px, если ужать поля: полоса прокрутки под
     переключателем читается как «тут что-то ещё», а там ничего нет. */
  .krivye{width:100%;flex-wrap:nowrap}
  .knopka-krivoj{flex:1 1 0;justify-content:center;padding:0 8px;
    font-size:12.5px;min-width:0}
  /* Обрезка названия до «М.» хуже, чем перенос кнопки на вторую строку:
     сокращённое слово не читается вовсе. Списки идут по своей ширине,
     кнопка переносится. */
  .grafik-otbor{width:100%;flex-wrap:wrap}
  .vybor{flex:0 1 auto;min-width:0}
  .vybor>summary{padding:0 10px;font-size:12.5px;gap:6px}
  .vybor-polotno{right:auto;left:0;min-width:0;width:min(320px,84vw)}
  .vybor:last-of-type .vybor-polotno{right:0;left:auto}
  /* Кнопка рядом с выбором, а не во всю строку: с работающим скриптом она
     не нужна вовсе, и занимать ею экран телефона незачем. */
  .grafik-otbor .knopka{width:auto;flex:0 0 auto;padding:0 12px}
  .pokazyvaetsya{padding:10px 12px}
  .grafik-pole{padding:12px 12px 4px}
  .grafik-legenda{padding:4px 12px 12px;gap:4px 12px;font-size:12px}
}
@media (prefers-reduced-motion: reduce){
  .krug,.podskazka,.perekluchatel a{transition:none}
}

/* ── три строки дня и кружок-подсказка ──────────────────────────
   Прежняя надпись говорила «437 строк остались без отметки». Без единой
   отметки из них было восемь: остальные размечены, просто их отметки в
   формулу 1С не входят. Теперь три числа, а разбивка — в подсказке. */
.tri-stroki{display:grid;gap:15px;max-width:20rem}
/* Линеек здесь нет намеренно: три строки и так читаются, а полосы делали
   из них таблицу и добавляли лишний рубеж перед «трафиком». Разделяет
   ритм и вес, а не черта. */
.stroka-dnya{display:flex;align-items:baseline;gap:14px}
.stroka-dnya .imya{color:var(--ink-3);font-size:14.5px;line-height:1;
  display:inline-flex;align-items:center;gap:7px}
.stroka-dnya .chislo{margin-left:auto;font-size:27px;font-weight:600;
  line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.stroka-dnya.trafik .imya{color:var(--ink-2)}

/* Кружок с палочкой. Раскрывается наведением на большом экране и касанием
   на телефоне: касание даёт фокус, поэтому `:focus-within` тут не украшение,
   а единственный способ открыть его пальцем без скрипта. */
.spravka{position:relative;display:inline-flex;cursor:help;outline:none}
.spravka-znak{display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;border-radius:50%;border:1px solid var(--line-2);
  color:var(--ink-3);font:600 10.5px/1 var(--cifry);
  transition:border-color .14s ease,color .14s ease}
.spravka:hover .spravka-znak,.spravka:focus-visible .spravka-znak{
  border-color:var(--red);color:var(--red)}
.spravka:focus-visible{outline:2px solid var(--fokus);outline-offset:3px;
  border-radius:50%}
.spravka-okno{position:absolute;z-index:40;top:calc(100% + 9px);left:-10px;
  width:max-content;max-width:min(330px,80vw);padding:12px 14px;
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-card);box-shadow:0 14px 32px rgba(17,19,24,.16);
  color:var(--ink-2);font-size:13px;line-height:1.5;font-weight:400;
  letter-spacing:0;opacity:0;visibility:hidden;
  transition:opacity .14s ease,visibility .14s}
@media (prefers-color-scheme: dark){html:not([data-tema="den"]) .spravka-okno{box-shadow:0 14px 32px rgba(0,0,0,.5)}
}
html[data-tema="noch"] .spravka-okno{box-shadow:0 14px 32px rgba(0,0,0,.5)}

.spravka-okno b{color:var(--ink);font-weight:600}
.spravka:hover .spravka-okno,.spravka:focus .spravka-okno,
.spravka:focus-within .spravka-okno{opacity:1;visibility:visible}
.spravka-tablica{display:grid;grid-template-columns:1fr auto;gap:3px 16px;
  margin-top:9px;padding-top:9px;border-top:1px solid var(--line)}
.spravka-imya{color:var(--ink-2)}
.spravka-chislo{color:var(--ink);font-weight:600;
  font-variant-numeric:tabular-nums;text-align:right}

@media (max-width:700px){
  .tri-stroki{max-width:none}
  /* На телефоне окно вешается на строку, а не на значок: значок стоит у
     левого края, и окно шириной в треть экрана уезжало за край на 223 px.
     `position:static` у значка отдаёт роль опоры строке. */
  .stroka-dnya{position:relative}
  .spravka{position:static}
  .spravka-okno{left:0;right:0;width:auto;max-width:none;top:calc(100% + 6px)}
}

/* ── произвольный период ────────────────────────────────────────
   Кнопка раздвигается и держит поля внутри своей рамки: отдельная рамка
   рядом читалась бы как второй орган отбора. Поля без границ и фона —
   разделяет их одна волосяная палочка. */
.period{display:inline-flex;align-items:center;height:var(--vysota);
  transition:border-color .14s ease}
.period:hover{border-color:var(--ink-3)}
.period:focus-within{border-color:var(--ink)}
.period .vybor>summary{border:none;background:transparent;height:100%}
.period .vybor>summary:hover{border-color:transparent}
.period .vybor[open]>summary{border-color:transparent}
.period.razdvinut .vybor>summary b{display:none}

.period-polya{display:inline-flex;align-items:center;height:100%;
  padding-right:10px}
.period-polya input[type=date],
.period-polya input.pole-daty{border:none;background:transparent;
  min-height:0;height:100%;padding:0 9px;font-size:13.5px;color:var(--ink);
  font-variant-numeric:tabular-nums;width:auto;min-width:0}
.period-polya input.pole-daty:focus{outline:none;box-shadow:none;
  border:none;color:var(--red)}
.period-polya input.pole-daty:focus-visible{outline:2px solid var(--fokus);
  outline-offset:-2px;border-radius:3px}
.period-palka{width:1px;height:18px;background:var(--line-2);flex:0 0 auto}

@media (max-width:700px){
  .period{width:100%;justify-content:space-between}
  .period-polya{flex:1 1 auto;justify-content:flex-end}
  .period-polya input[type=date],
  .period-polya input.pole-daty{padding:0 4px;font-size:12.5px}
}

/* ── свой выбор даты ────────────────────────────────────────────
   Браузерный календарь у каждого свой: где-то мелкий и серый, где-то синий
   и чужой порталу. Этот один на всех — воздушный, с месяцами слева и той же
   палитрой, что вся страница. Поле остаётся полем: без скрипта работает
   браузерный выбор, поэтому значок его вызова только гасится, а не убирается. */
input[type=date]{cursor:pointer}
/* После подмены поле — обычный текст только для чтения: браузеру нечего
   открывать, а выглядит оно так же. */
input.pole-daty{cursor:pointer;font-variant-numeric:tabular-nums}
input.pole-daty:read-only{background:inherit}

.kalendar{display:none;position:absolute;z-index:60;
  background:var(--paper);border:1px solid var(--line-2);
  border-radius:var(--r-block);box-shadow:0 18px 44px rgba(17,19,24,.18);
  overflow:hidden}
.kalendar.otkryt{display:flex}
@media (prefers-color-scheme: dark){html:not([data-tema="den"]) .kalendar{box-shadow:0 18px 44px rgba(0,0,0,.55)}
}
html[data-tema="noch"] .kalendar{box-shadow:0 18px 44px rgba(0,0,0,.55)}

/* Месяцы столбиком слева: год виден целиком, и до нужного не надо щёлкать
   стрелкой по разу на месяц. */
.kalendar-mesyacy{display:flex;flex-direction:column;gap:1px;
  padding:12px 8px;background:var(--pale);
  border-right:1px solid var(--line);justify-content:center}
.kalendar-mesyats{border:0;background:none;cursor:pointer;
  padding:5px 12px;border-radius:var(--r-btn);
  font:400 13px/1.2 var(--shrift);color:var(--ink-3);text-align:left;
  transition:background .12s ease,color .12s ease}
.kalendar-mesyats:hover{background:var(--paper);color:var(--ink)}
.kalendar-mesyats.est{background:var(--paper);color:var(--ink);font-weight:600}

.kalendar-pole{padding:14px 16px 16px}
.kalendar-shapka{display:flex;align-items:center;justify-content:space-between;
  gap:10px;margin-bottom:10px}
.kalendar-imya{font-size:15px;font-weight:600;color:var(--ink);
  letter-spacing:-.015em;text-align:center;flex:1 1 auto}
.kalendar-strelka{border:0;background:none;cursor:pointer;
  width:30px;height:30px;border-radius:50%;color:var(--ink-3);
  font:400 19px/1 var(--shrift);transition:background .12s ease,color .12s ease}
.kalendar-strelka:hover{background:var(--pale);color:var(--ink)}

.kalendar-nedelya,.kalendar-dni{display:grid;
  grid-template-columns:repeat(7,38px);gap:2px}
.kalendar-nedelya{margin-bottom:4px}
.kalendar-nedelya span{height:26px;display:flex;align-items:center;
  justify-content:center;font:500 11px/1 var(--cifry);color:var(--ink-3);
  text-transform:uppercase;letter-spacing:.04em}

.kalendar-den{width:38px;height:38px;border:0;background:none;cursor:pointer;
  border-radius:50%;font:400 14px/1 var(--shrift);color:var(--ink);
  font-variant-numeric:tabular-nums;
  transition:background .12s ease,color .12s ease}
.kalendar-den:hover:not(:disabled){background:var(--pale)}
.kalendar-den.chuzhoj{color:var(--line-2)}
.kalendar-den.segodnya{box-shadow:inset 0 0 0 1px var(--line-2)}
.kalendar-den.vybran{background:var(--red);color:#fff;font-weight:600;
  box-shadow:none}
.kalendar-den.vybran:hover{background:var(--red-700)}
.kalendar-den.nedostupen{color:var(--line);cursor:default}
.kalendar-den:focus-visible{outline:2px solid var(--fokus);outline-offset:-2px}

@media (max-width:700px){
  .kalendar-mesyacy{padding:10px 6px}
  .kalendar-mesyats{padding:4px 9px;font-size:12.5px}
  .kalendar-pole{padding:12px 12px 14px}
  .kalendar-nedelya,.kalendar-dni{grid-template-columns:repeat(7,34px)}
  .kalendar-den{width:34px;height:34px}
}

/* Поиск в списке: семьдесят фамилий глазами не пролистываются. */
.vybor-poisk{width:100%;margin-bottom:6px;padding:7px 10px;
  background:var(--field);color:var(--ink);font:inherit;font-size:13.5px}
/* Обводка фокуса — своим цветом: красный на портале значит «ошибка»,
   и поле поиска в нём выглядело бы заполненным неверно. */
.vybor-poisk:focus{outline:none;border-color:var(--fokus);
  box-shadow:0 0 0 3px var(--fokus-fon)}
.vybor-poisk::-webkit-search-cancel-button{cursor:pointer}
.vybor-spisok{display:block}
.vybor-pusto{padding:8px 9px}
.vybor-punkt.spryatan,.vybor-gruppa.spryatan{display:none}

/* Пустой день и подпись доли ─────────────────────────────────────── */
/* Полоса за днём, которого не было: без неё разрыв линии читается как
   поломка графика, а не как «в этот день никто не заходил». */
.pusto-polosa{fill:var(--ink);opacity:.045}
.pusto-klyuch::before{width:9px;height:12px;border-radius:1px;
  background:var(--pale);border:1px solid var(--line-2)}
/* Конверсия дня подписью у точки: своей шкалы у доли на поле людей нет.
   Обводка цветом бумаги — чтобы число читалось поверх заливки и линии. */
.procent-podpis{fill:var(--red-900);font:600 10px/1 var(--cifry);
  text-anchor:middle;paint-order:stroke;stroke:var(--paper);
  stroke-width:3px;stroke-linejoin:round}

/* Песочница ──────────────────────────────────────────────────────── */
/* Устройство взято с блока «Трафик и конверсия»: карта, одна строка
   органов, строка «Показывается», плитки, таблица. Классы те же — иначе
   через месяц две панели отбора разъедутся по мелочам. */
.vybor-zametka{margin:0 0 6px;padding:0 4px;font-size:12px}
/* «Только выбранные» — «Все отборы» (14.09.2026): текстовая кнопка справа от
   заголовка группы или строкой над списком. Прячет стиль, а не `hidden` — тот у поиска. */
.vybor-zagolovok.s-knopkoj{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.vybor-tolko-ryad{display:flex;justify-content:flex-end;gap:2px;padding:2px 4px 6px}
.vybor-tolko{flex:0 0 auto;padding:3px 10px;border:0;border-radius:999px;background:none;cursor:pointer;
  white-space:nowrap;font:500 12px/1.4 var(--shrift);letter-spacing:0;text-transform:none;color:var(--ink-2)}
.vybor-tolko:hover{color:var(--ink)}
.vybor-tolko[aria-pressed="true"]{background:var(--pale);color:var(--ink)}
.vybor-tolko:focus-visible{outline:2px solid var(--fokus);outline-offset:2px;border-radius:4px}
.vybor-tolko:disabled{color:var(--ink-3);opacity:.6;cursor:default}
.tolko-vybrannye .vybor-punkt:not(.vybor-vse):not(:has(input:checked)){display:none}
.tolko-vybrannye .vybor-gruppa:has(input:checked)>.vybor-glava{display:flex}
.tolko-vybrannye .vybor-gruppa:not(:has(input:not([data-vse]):checked)){display:none}
.tolko-vybrannye .vybor-pusto,.tolko-vybrannye .vybor-zametka{display:none}
.vybor-zagolovok{padding:8px 10px 4px;font:600 10px/1.4 var(--cifry);
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}

/* «Конверсия выше на N п.п.» — такой же орган, как выпадающие списки:
   та же высота, та же рамка, внутри одно число. */
.vybor-esli{display:inline-flex;align-items:center;gap:8px;height:var(--organ);
  padding:0 12px;cursor:text}
.vybor-esli input{width:44px;min-width:0;padding:0;border:0;background:none;
  text-align:center;font:600 14px/1 var(--shrift);color:var(--ink);
  font-variant-numeric:tabular-nums}
.vybor-esli input:focus-visible{outline:none}
.vybor-esli input::placeholder{color:var(--line-2);font-weight:400}
@media (max-width:700px){.vybor-esli{flex:1 1 auto;justify-content:space-between}}
.vybor-esli:focus-within{border-color:var(--ink-3)}
.vybor-hvost{color:var(--ink-3);font-size:12.5px}

/* Все органы песочницы — в одной строке, включая кнопки «Сформировать» и
   «Сохранить». Форма отдаёт своих детей родительскому потоку: иначе кнопка
   переносится на свою строку, а сохранение — на следующую, и строка отбора
   рассыпается на три этажа. Сама форма при этом остаётся формой. */
/* Два ряда: сверху то, чем задают отчёт, снизу отбор. Форма пустая, поля
   связаны с ней через `form` — иначе форму сохранения пришлось бы вкладывать
   в форму отбора, чего HTML не разрешает. */
.dva-ryada{flex-direction:column;align-items:stretch;gap:10px}
.dva-ryada .ryad{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:center}
.dva-ryada .ryad-otbora{padding-top:10px;border-top:1px solid var(--line)}
/* Кнопка одной высоты с органами отбора: разнобой в 48 и 38 пикселей
   читается как небрежность даже тем, кто не умеет его назвать. */
.dva-ryada .ryad>.knopka{order:-1;height:var(--organ);
  min-height:var(--organ)}
.vybor-diskety{margin-left:auto}
.mesto-kopii{margin-left:auto;display:inline-flex;align-items:center}
.mesto-kopii:empty{display:none}
.mesto-kopii+.vybor-diskety{margin-left:0}
.vybor-diskety>summary{padding:0 10px;gap:6px}
.disketa{width:17px;height:17px;color:var(--ink-2)}
/* Дискета — без рамки и без красного при наведении (владелец 15.09.2026). */
.vybor-diskety>summary{border-color:transparent;background:none}
.vybor-diskety>summary:hover,.vybor-diskety[open]>summary{background:var(--pale);border-color:transparent}
.vybor-diskety[open]>summary .disketa,.vybor-diskety>summary:hover .disketa{color:var(--ink)}
.vybor-dejstvie{width:100%;text-align:left;background:none;border:0;
  font:400 14px/1.35 var(--shrift);color:var(--ink);cursor:pointer;
  list-style:none}
.vybor-dejstvie::-webkit-details-marker{display:none}
/* Пункт-окно в меню дискеты — строкой во всю ширину меню: `.modalka` строчно-блочная,
   и подсветка «Сохранить» была короче меню (снимок владельца 14.09.2026). */
.vybor-polotno>.modalka{display:block}
.vybor-dejstvie:hover{background:var(--pale)}
.vidimost{display:flex;gap:18px;font-size:14px;color:var(--ink)}
/* Свои правила сильнее общего `label{flex-direction:column}` в окне: иначе
   кружок встаёт над подписью. */
.modalka-okno .vidimost label{display:inline-flex;flex-direction:row;
  align-items:center;gap:7px;text-transform:none;letter-spacing:0;
  font:400 14px/1 var(--shrift)}
/* `hidden` — это всего лишь `display:none` из настроек браузера, и любой наш
   `display` его перебивает. Поля «куда класть» из-за этого показывались оба. */
.modalka-okno [hidden]{display:none}
.modalka-okno p.tiho{margin:0;font-size:13px}

/* Короткое сообщение о сделанном. Внизу по центру, само уходит. */
.skazano{position:fixed;z-index:60;left:50%;bottom:26px;transform:translateX(-50%);
  padding:11px 18px;border-radius:var(--r-btn);background:var(--ink);
  color:var(--paper);font-size:13.5px;box-shadow:0 12px 30px rgba(17,19,24,.24);
  transition:opacity .3s var(--plavno),transform .3s var(--plavno)}
.skazano.uhodit{opacity:0;transform:translate(-50%,8px)}
@media (prefers-reduced-motion:reduce){.skazano{transition:none}}

/* Выбор отчёта и сохранение — такие же органы, как остальные. Полотно шире
   обычного: в нём дерево папок и форма, а не список галочек. */
.vybor-shirokij{width:min(420px,92vw);padding:6px}
/* «Отчёт» стоит первым в строке: полотно, выровненное по правому краю
   кнопки, уезжает за левый край экрана. Ему — левый край. */
.vybor-otchyot .vybor-polotno{left:0;right:auto}
.vybor-ssylka{text-decoration:none;color:var(--ink);
  padding-left:calc(10px + var(--glubina,0) * 14px)}
.vybor-papka{padding:7px 10px 3px;font-size:12px;color:var(--ink-3);
  padding-left:calc(10px + var(--glubina,0) * 14px)}
.vybor-papka::before{content:"▸ "}
/* Сетка, а не флекс, и в этом всё дело. Половинки обязаны быть одного
   размера — «Мои» короче «Для всех», перекошенный переключатель виден
   сразу, — но при `flex:1 1 0` они делят ширину поровну независимо от
   текста, и подпись длиннее половины обрезается краем: 04.09.2026
   «Текущий отчёт» требовал 104 px при выданных 101, и последняя буква
   уходила под чёрную заливку. У сетки `grid-auto-columns:1fr` минимум
   колонки — содержимое самой широкой, поэтому половинки остаются равными,
   а ширина считается сама и не зависит от того, как назвали кнопку. */
/* Двойной переключатель со скользящим указателем. Просьба владельца
   12.09.2026 по образцу animated-tabs: выбранное не перепрыгивает, а
   переезжает — видно, откуда и куда.

   Указатель ставится по тому, у какой ссылки класс `est`, средствами
   `:has()`. Скрипт в этом не участвует: страница приходит с сервера
   уже с нужным классом. Где `:has()` не поддержан — прежняя заливка
   самой ссылки, и переключатель выглядит как раньше. */
.dvojnaya{position:relative;display:inline-grid;grid-auto-flow:column;
  grid-auto-columns:1fr;
  gap:0;margin-left:8px;flex-shrink:0;overflow:hidden;text-transform:none;letter-spacing:0}
.dvojnaya a{position:relative;z-index:1;min-width:5.6em;padding:3px 10px;
  font-size:11.5px;
  color:var(--ink-3);text-decoration:none;background:var(--paper);
  text-align:center;white-space:nowrap}
.dvojnaya a.est{background:var(--ink);color:var(--paper)}
@supports selector(:has(*)){
  .dvojnaya::before{content:"";position:absolute;z-index:0;
    top:0;bottom:0;left:0;width:50%;background:var(--ink);
    transition:transform .26s var(--pruzhina)}
  .dvojnaya:has(a:last-child.est)::before{transform:translateX(100%)}
  .dvojnaya a{background:none}
  .dvojnaya a.est{background:none;color:var(--paper)}
}
@media (prefers-reduced-motion:reduce){.dvojnaya::before{transition:none}}
.sohranit-forma{display:flex;flex-direction:column;gap:7px;padding:8px 10px 12px;
  border-bottom:1px solid var(--line)}
.sohranit-forma:last-child{border-bottom:0}
.sohranit-forma input[type=text],.sohranit-forma select{
  height:var(--organ-mal);padding:0 10px;
  font:400 13.5px/1 var(--shrift);color:var(--ink);width:100%}
.sohranit-forma .vybor-punkt{gap:14px}
.sohranit-forma .vybor-zametka{margin:0}

/* Дерево разделов ────────────────────────────────────────────────── */
.derevo-polotno{padding:6px 15px 14px}
.vetka>summary{display:flex;align-items:center;gap:7px;padding:7px 0;
  cursor:pointer;color:var(--ink-3);font-size:12.5px;list-style:none}
.vetka>summary::-webkit-details-marker{display:none}
.vetka>summary::before{content:"";width:0;height:0;
  border-left:5px solid currentColor;border-top:4px solid transparent;
  border-bottom:4px solid transparent;transition:transform .12s var(--plavno)}
.vetka[open]>summary::before{transform:rotate(90deg)}
.vetka>summary:hover{color:var(--ink)}
.vetka-koren>summary{font:500 10.5px/1.4 var(--cifry);letter-spacing:.09em;
  text-transform:uppercase}
.vetka-nutro{padding-left:16px;border-left:1px solid var(--line);margin-left:4px}
.vetka-stroka{display:flex;align-items:baseline;gap:10px;padding:7px 0;
  border-bottom:1px solid var(--line)}
.vetka-stroka:last-child{border-bottom:0}
.vetka-stroka>:last-child{margin-left:auto}
.vetka-stroka>.tiho:not(:last-child){margin-left:0}
.vetka-stroka select{height:var(--organ-kroha);padding:0 6px;
  color:var(--ink-3);
  font:400 12px/1 var(--shrift)}

/* Квадратные кнопки над деревом: стрелка и три полоски — знак иерархии. */
.derevo-knopki{display:inline-flex;gap:5px}
.knopka-derevo{display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-kroha);height:var(--organ-kroha);padding:0;
  color:var(--ink-3);
  cursor:pointer}
.knopka-derevo:hover{color:var(--ink);border-color:var(--ink-3)}
.knopka-derevo svg{width:16px;height:16px}

/* Карандаш: маленький, серый, проявляется при наведении на строку. Он не
   должен спорить с именем — правят раздел раз в месяц, а читают каждый день. */
.karandash{display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;margin-left:6px;border-radius:4px;cursor:pointer;
  color:var(--ink-3);opacity:0;transition:opacity .12s var(--plavno);
  list-style:none}
.karandash::-webkit-details-marker{display:none}
.karandash svg{width:13px;height:13px}
.vetka>summary:hover .karandash,.vetka-stroka:hover .karandash,
.modalka-karandash[open] .karandash{opacity:1}
.karandash:hover{background:var(--pale);color:var(--ink)}
.modalka-karandash{display:inline-block}
@media (hover:none){.karandash{opacity:.55}}

/* Модальное окно: тем же `details`, что и остальные раскрытия, — работает
   и без скрипта, а выглядит окном. */
.modalka{display:inline-block;position:static}
/* Заголовок карты набран прописными и вразрядку — кнопке внутри него это не
   идёт: она становится вывеской вместо органа. */
/* И высоту, и «не ниже»: у кнопки задано min-height, и одна высота его не
   пересиливает — на этом уже спотыкались с фильтрами графика. */
.karta>h3 .knopka{text-transform:none;letter-spacing:0;
  height:var(--organ-kroha);
  min-height:var(--organ-kroha);padding:0 12px;font-size:13px;
  font-weight:500}
.modalka>summary{list-style:none;cursor:pointer}
.modalka>summary::-webkit-details-marker{display:none}
.modalka-fon{position:fixed;inset:0;background:rgba(17,19,24,.42);z-index:40}
.modalka-okno{position:fixed;z-index:41;top:50%;left:50%;
  transform:translate(-50%,-50%);width:min(420px,92vw);
  display:flex;flex-direction:column;gap:12px;padding:20px;
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-block);box-shadow:0 24px 60px rgba(17,19,24,.28)}
.modalka-okno h4{margin:0;font-size:17px;letter-spacing:-.02em}
.modalka-okno label{display:flex;flex-direction:column;gap:5px;
  font:500 10.5px/1.4 var(--cifry);letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-3)}
.modalka-okno input[type=text],.modalka-okno select{height:var(--organ);
  padding:0 11px;
  font:400 14px/1 var(--shrift);color:var(--ink);
  text-transform:none;letter-spacing:0}
.modalka-nizok{display:flex;justify-content:flex-end;gap:9px}

.zavesti{display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  padding:10px 15px 14px;border-top:1px solid var(--line)}
.zavesti input[type=text],.zavesti select{height:var(--organ-mal);padding:0 10px;
  font:400 13.5px/1 var(--shrift);color:var(--ink)}
.zavesti input[type=text]{width:min(220px,46vw)}

.pesochnica-ogovorki{padding:10px 15px;border-bottom:1px solid var(--line);
  background:var(--red-50);font-size:13px}
.pesochnica-ogovorki p{margin:0 0 4px}
.pesochnica-ogovorki p:last-child{margin:0}

.pesochnica-nizok{display:flex;flex-wrap:wrap;gap:10px 16px;
  align-items:center;justify-content:space-between;padding:11px 15px;
  border-top:1px solid var(--line);background:var(--pale)}
.sohranit{display:flex;gap:8px;align-items:center}
.sohranit input[type=text]{width:min(280px,52vw);height:var(--organ-mal);
  padding:0 10px;
  font:400 13.5px/1 var(--shrift);color:var(--ink)}

.polosa-vida{display:flex;flex-wrap:wrap;gap:9px 14px;align-items:center;
  padding:10px 15px;background:var(--red-50);border-bottom:1px solid var(--line)}
.polosa-vida input[type=text]{height:var(--organ-mal);padding:0 10px;
  width:min(240px,50vw);
  font:400 13.5px/1 var(--shrift);color:var(--ink)}

/* Разговор: реплики, а не чат-пузыри — это рабочий инструмент. Ответ и
   ссылка на отчёт стоят в одной строке: кнопка посреди текста кричит. */
.razgovor{padding-bottom:15px}
.replika{display:flex;gap:var(--replika-zazor);align-items:baseline;
  padding:7px var(--replika-pole);line-height:1.5}
/* min-width:0 — текст реплики флекс-ребёнок, и без него широкая таблица
   распирала реплику вместо своей прокрутки вбок (14.09.2026). Ширина
   101ch — на 15 % шире прежних 88ch, владелец 14.09.2026. */
.replika-tekst{max-width:101ch;min-width:0}
.replika .ssylka{margin-left:8px;white-space:nowrap}
.replika-kto{flex:0 0 var(--replika-metka);font:600 10px/1.6 var(--cifry);
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.replika.otvet{color:var(--ink-2)}
/* Пульсирующая точка у слова «портал» убрана 12.09.2026: ожидание
   теперь называется словом и показывается переливанием, и точка стала
   третьим знаком одного и того же состояния. Кадры `puls` ушли вместе
   с ней — некому их было проигрывать. */
.replika .knopka{margin-left:8px}
.sprosit{display:flex;gap:8px;padding:10px 15px 0}
.sprosit input[type=text]{flex:1}

/* Отклонения ─────────────────────────────────────────────────────── */
/* Колокол в шапке: счётчик, а не лента. Список читается на своей странице. */
.kolokol{display:inline-flex;align-items:center;gap:6px;color:var(--ink-3);
  text-decoration:none;font-size:12.5px}
.kolokol:hover{color:var(--ink)}
.kolokol.est{color:var(--red)}
.kolokol b{display:inline-flex;align-items:center;justify-content:center;
  min-width:17px;height:17px;padding:0 5px;border-radius:9px;
  background:var(--red);color:#fff;font:600 11px/1 var(--cifry)}
.uvedomleniya{margin:0;padding:0 15px 14px;list-style:none}
.uvedomleniya li{padding:11px 0;border-bottom:1px solid var(--line)}
.uvedomleniya li:last-child{border-bottom:0}
.uvedomlenie-shapka{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.uvedomleniya p{margin:5px 0 8px}
@media (max-width:700px){.kolokol-imya{display:none}}

/* На телефоне шапка карты переносится, а не давит то, что в ней стоит.
   04.09.2026: у разговора в шапке подпись и переключатель «Текущий отчёт —
   Весь чат» стояли одной строкой шире экрана, и вторая половина оказывалась
   за краем — не обрезанной, а недостижимой: страница вбок не прокручивается,
   нажать её было нельзя никак. */
@media (max-width:700px){
  .karta>h3{flex-wrap:wrap;row-gap:8px}
  .v-shapke{flex-wrap:wrap;gap:8px}
}

/* На телефоне первый столбец отчёта не должен съедать экран целиком.
   04.09.2026 замерено на 375 px: «Магазин Усть-Лабинск Красная 52 (Центр)»
   занимал 407 px, а первая цифра начиналась на 422-м — за краем. Человек
   видел столбец названий и пустоту, и подсказки, что справа есть числа,
   не было никакой.

   Имя переносится и ограничено по ширине, а сам столбец закреплён: при
   прокрутке вбок видно, к чему относится число. Закрепление даёт свой фон —
   иначе строки просвечивают друг сквозь друга. */
@media (max-width:700px){
  table.reestr th:first-child,
  table.reestr td:first-child{position:sticky;left:0;z-index:1;
    max-width:9.5em;white-space:normal;background:var(--paper)}
  table.reestr thead th:first-child{background:var(--pale)}
  table.reestr tbody tr:nth-child(even) td:first-child{background:var(--pale-2,var(--paper))}
}

/* Меню под бургером ─────────────────────────────────────────────── */
/* Двенадцать разделов строкой занимали всю шапку и оттесняли то, ради чего
   в неё смотрят: отклонения, имя, выход. */
.menyu-vypad{position:relative}
.menyu-vypad>summary{list-style:none;cursor:pointer}
.menyu-vypad>summary::-webkit-details-marker{display:none}
.knopka-menyu{display:inline-flex;align-items:center;gap:9px;
  height:var(--organ-mal);
  padding:0 13px;color:var(--ink);font:500 13.5px/1 var(--shrift)}
.knopka-menyu:hover{border-color:var(--ink-3)}
.menyu-vypad[open]>summary{border-color:var(--ink-3);background:var(--pale)}
.burger{display:block;width:15px;height:11px;position:relative}
.burger::before,.burger::after,.burger{background:none}
.burger::before{content:"";position:absolute;inset:0 0 auto 0;height:1.6px;
  background:currentColor;box-shadow:0 4.7px 0 currentColor,0 9.4px 0 currentColor}
.menyu-polotno{position:absolute;top:calc(100% + 7px);left:0;z-index:30;
  display:flex;flex-direction:column;min-width:240px;padding:6px;
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-card);box-shadow:0 18px 44px rgba(17,19,24,.16)}
.menyu-polotno a{padding:9px 11px;border-radius:var(--r-btn);
  color:var(--ink);font-size:14px;text-decoration:none}
.menyu-polotno a:hover{background:var(--pale)}
@media (max-width:700px){
  .menyu-polotno{position:fixed;left:8px;right:8px;top:auto;min-width:0}
}

/* ── Правки 02.09.2026 ───────────────────────────────────────────────
   Шапка карты: всё в ней одной высоты — квадратные кнопки дерева, значок
   «новый раздел» и «Создать». Разнобой в шесть пикселей виден сразу. */
.v-shapke .knopka.mal{height:var(--organ-kroha);min-height:var(--organ-kroha);
  padding:0 14px;font-size:12.5px}

/* Половинки переключателя одного размера и не впритык к рамке: «Для всех»
   длиннее «Мои», и на десяти пикселях padding текст касался края. */
.dvojnaya a{min-width:6.6em;padding:4px 14px}

/* Урна в карандаше. Спрашивает да/нет прямо в низке окна: отдельное
   подтверждающее окно поверх модального читается как поломка. */
.udalenie{margin-right:auto}
.udalenie[open]{display:inline-flex;align-items:center;gap:2px}
.udalenie>summary{list-style:none;cursor:pointer;display:inline-flex}
.udalenie>summary::-webkit-details-marker{display:none}
.urna{display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:var(--r-btn);color:var(--ink-3);
  transition:background .14s ease,color .14s ease}
.urna:hover{background:var(--red-50);color:var(--red)}
.udalenie[open] .urna{background:var(--red-50);color:var(--red)}
.urna svg{width:15px;height:15px}
.udalenie-vopros{display:inline-flex;align-items:center;gap:7px;
  font-size:13px;color:var(--ink-2)}
.udalenie-vopros .ssylka{font-size:13px}
/* Форма удаления живёт рядом с формой правки — HTML не пускает форму в форму.
   Показывать её нечего: в ней одни скрытые поля. */
.forma-nevidimka{display:none}

/* Разговор не растёт бесконечно: выше трёх четвертей экрана форма вопроса
   уезжает за нижний край, и спросить становится нечем. */
/* ── искра: знак того, что отвечает не человек ──────────────────
   Владелец 12.09.2026 попросил «кругляшок типа Siri». Первый заход
   вышел глянцевым шариком: блик в углу читался как пластик, а не как
   свечение. Здесь бликов нет — четыре мягких пятна с длинным
   затуханием, налезающих друг на друга, и весь круг медленно
   поворачивается. Пятна расходятся и сходятся, и знак кажется живым,
   оставаясь плоским.

   Цвета — свои. У Siri он переливается всеми, у портала их два:
   красный и графит. Тёплое пятно между ними — оттенок красного, а не
   третий цвет.

   Знак ставится стилем, а не разметкой: кусок разговора рисуется в
   двух местах — в песочнице и в поверхности «Спросить», — и второй
   экземпляр разметки разошёлся бы с первым на первой же правке.

   Скрипта здесь нет вовсе: поворот делает CSS, и при запрете движения
   он просто останавливается. */
/* Угол, по которому ходят пятна. Зарегистрирован, чтобы анимироваться
   плавно; без регистрации браузер просто покажет шар стоящим. */
@property --iskra-ugol{syntax:"<angle>";inherits:false;initial-value:0deg}
.iskra,
.razgovor-imya::before{
  content:"";flex:0 0 auto;display:inline-block;vertical-align:-2px;
  width:13px;height:13px;border-radius:50%;
  /* Владелец 14.09.2026: «шар недостаточно многопиксельный, я вижу его
     неоднородность». Прежде вращалась готовая картинка — браузер крутил
     растр в 32 точки, и пятна с резкими краями («0 8%») мелькали
     лесенкой. Теперь сама картинка стоит, а пятна ходят по кругу: шар
     перерисовывается в полном разрешении экрана, края пятен мягкие.
     Порядок важен: светлое сверху, основа — последней. */
  /* Красный — главный, графит — лёгкая тень, серый — отсвет, белый — мягкий
     блик. Подобрано глазами на шаре в 150 точек из четырёх вариантов
     (14.09.2026): графит гуще половины снова темнит шар, а совсем без него
     шар плоский. */
  background:
    radial-gradient(circle at calc(50% + 22% * cos(var(--iskra-ugol,0deg)))
                              calc(50% + 22% * sin(var(--iskra-ugol,0deg))),
      color-mix(in srgb, var(--iskra-svet) 95%, transparent) 0,
      color-mix(in srgb, var(--iskra-svet) 55%, transparent) 15%,
      color-mix(in srgb, var(--iskra-svet) 0%, transparent) 40%),
    radial-gradient(circle at calc(50% + 30% * cos(var(--iskra-ugol,0deg) + 110deg))
                              calc(50% + 30% * sin(var(--iskra-ugol,0deg) + 110deg)),
      color-mix(in srgb, var(--iskra-dym) 80%, transparent) 0,
      color-mix(in srgb, var(--iskra-dym) 0%, transparent) 34%),
    radial-gradient(circle at calc(50% + 28% * cos(var(--iskra-ugol,0deg) + 225deg))
                              calc(50% + 28% * sin(var(--iskra-ugol,0deg) + 225deg)),
      color-mix(in srgb, var(--iskra-grafit) 45%, transparent) 0,
      color-mix(in srgb, var(--iskra-grafit) 0%, transparent) 38%),
    radial-gradient(circle at 42% 36%, var(--iskra-krasnaya) 0,
      var(--iskra-krasnaya) 60%, var(--iskra-glub) 100%);
  /* Тонкий светлый ободок вместо блика: даёт объём и не читается как
     пластик. Внутрь, чтобы не рвать круг по краю. Тень снизу теперь стоит
     на месте — прежде она вращалась вместе с картинкой. */
  box-shadow:inset 0 0 0 .5px rgba(255,255,255,.28),
             inset 0 -1px 2px rgba(17,19,24,.18);
  animation:iskra-krug 9s linear infinite}
@keyframes iskra-krug{to{--iskra-ugol:360deg}}
/* В шапке знак крупнее: там он представляет собеседника, а в реплике
   лишь отмечает, чей это голос. */
/* Размер — как у шара в шапке портала (владелец 13.09.2026: «сделай шары одного размера, по большому»). */
.razgovor-imya::before{width:32px;height:32px;margin-right:8px;
  vertical-align:-3px}
/* Над каждой репликой знака нет: владелец 12.09.2026 — «убери над
   каждой надписью „Портал“ ИИ-круг». Один знак на разговор, и он
   стоит в шапке; повторённый у каждой строки он переставал быть
   знаком и становился маркером списка.

   Пока портал думает, дышит сам знак в шапке — дышит свечением, а не
   размером: `transform` занят поворотом, и второе правило его бы
   перебило, знак замер бы вместо того, чтобы ожить. */
/* Длительность оборота одна — 9 с — во всех правилах. Смена длительности
   переставляет угол скачком: те же секунды от начала — другая доля
   оборота. Быстрее, пока думает, крутит скрипт (`pesochnica.js`,
   `krug_postavit`), меняя скорость без скачка. */
.razgovor:has(.replika.zhdyot) .razgovor-imya::before{
  animation:iskra-krug 9s linear infinite,
            iskra-dyshit 1.7s ease-in-out infinite}
@keyframes iskra-dyshit{
  0%,100%{box-shadow:0 0 0 0 var(--iskra-dyh)}
  50%{box-shadow:0 0 0 4px transparent}
}

/* ── перелёт знака из шапки портала в шапку разговора ───────────
   Поверхность привязана к кнопке: её правый край стоит под кнопкой,
   и смещение между знаком в кнопке и знаком в шапке разговора
   постоянное — значит перелёт считается одной формулой, без скрипта.

   Ширина поверхности объявлена один раз, здесь же: разъехавшись, эти
   два числа увели бы знак мимо кнопки. */
/* Ширина окна объявлена ОДИН раз, здесь. Ею же считается перелёт
   знака, и разойдясь, эти числа увели бы его мимо кнопки. Сорок
   строк — чтобы таблица ответа помещалась сразу: владелец
   12.09.2026 — «придётся всегда сразу раздвигать». */
/* 46 rem — на 15 % шире прежних 40, владелец 14.09.2026: «поле контента
   немного шире и саму форму, не теряя воздуха». */
.poverhnost{--poverhnost-shirina:min(46rem,94vw)}
/* Ширина — начальная, а не потолок: потолок ставит правило
   растягивания ниже. Объявленная здесь `max-width` запирала окно на
   30 rem, и за угол оно не расширялось. */
.poverhnost>.poverhnost-polotno{width:var(--poverhnost-shirina)}
/* Телефон (14.09.2026, владелец: «на телефоне окно помощника уезжает за левый
   край… отремонтируй»). Окно прижато правым краем к шару, а шапка на узком экране
   переносится, шар встаёт посередине — и окно в 94vw уходило влево за экран.
   На телефоне оно листом снизу во всю ширину, как фильтры узких карточек. */
@media (max-width:720px){
  .shapka .poverhnost>.poverhnost-polotno:not(.vo-ves-ekran){
    position:fixed;left:8px;right:8px;bottom:8px;top:auto;
    width:auto;max-width:none;height:min(82vh,40rem);transform-origin:bottom center}
  .shapka .poverhnost-polotno .poverhnost-ugol{display:none}
  /* Панели остальных знаков шапки (остров, избранное, история, профиль)
     прибиты правым краем к своей кнопке, а кнопки на телефоне стоят
     посреди строки — остров уезжал за левый край на 79 px. Тем же листом
     снизу, что и окно помощника: место не зависит от того, где кнопка. */
  .shapka .znak-vypad:not(.poverhnost)>.znak-polotno{
    position:fixed;left:8px;right:8px;bottom:8px;top:auto;
    min-width:0;max-width:none;max-height:min(70vh,32rem)}
}
/* Знак летит в шапку разговора — туда, где стоит название беседы.
   Прежде он летел в заголовок окна, а заголовка больше нет. */
.poverhnost[open] .razgovor-imya::before{
  animation:iskra-krug 9s linear infinite, iskra-letit .34s var(--pruzhina) both}
/* Перелёт — один раз, при открытии. Пока портал думает, разговор каждые
   четыре секунды приходит заново, и знак прилетал из шапки снова и снова —
   владелец 14.09.2026: «шар в шапке формы постоянно дёргается». Подменённый
   разговор скрипт помечает `bez-pereleta`. */
.poverhnost[open] .razgovor.bez-pereleta .razgovor-imya::before{
  animation:iskra-krug 9s linear infinite}
.poverhnost[open] .razgovor.bez-pereleta:has(.replika.zhdyot) .razgovor-imya::before{
  animation:iskra-krug 9s linear infinite, iskra-dyshit 1.7s ease-in-out infinite}
/* Числа не подобраны на глаз, а замерены в браузере: знак в кнопке
   стоит на 565 px правее и на 46 px выше знака в шапке разговора при
   окне в 640 px. Правее — это «ширина окна минус 4,7 rem»: так
   перелёт остаётся верным и на узком экране, где окно у́же. Прежде
   было «минус 2,3 rem», но с 12.09.2026 перед знаком стоит кнопка
   списка бесед, и знак вылетал на 38 px правее кнопки. Размер
   замерен прежде: в шапке знак 17 px, старт — .53 от него. */
@keyframes iskra-letit{
  /* Старт — размер шара в шапке: 26 точек против 17 в шапке разговора. */
  from{translate:calc(var(--poverhnost-shirina) - 4.7rem) -2.9rem;
       scale:1.53}
  to{translate:0 0; scale:1}
}
/* Кнопка отдаёт знак: пока разговор открыт, в шапке портала его нет —
   он там, внизу. Так читается перелёт, а не размножение. */
.poverhnost>.znak-knopka .iskra{transition:opacity .16s ease,scale .2s ease}
.poverhnost[open]>.znak-knopka .iskra{opacity:0;scale:.6}
.znak-iskra{display:inline-flex;align-items:center;justify-content:center}
/* Шар в шапке — вдвое крупнее прежних тринадцати точек. Владелец
   13.09.2026: «шар ИИ помощника сделай больше в два раза». Кнопка при этом
   не растёт в высоту: поля по бокам ужаты, чтобы шапка не поехала. */
.znak-knopka.znak-iskra{padding:0 3px}
/* У шара обводки нет ни в покое, ни под указателем, ни открытым: владелец 13.09.2026. */
.znak-knopka.znak-iskra,.znak-knopka.znak-iskra:hover,.znak-vypad[open]>.znak-knopka.znak-iskra{border-color:transparent;background:none}
/* Шар крупнее всего остального в шапке: владелец 13.09.2026 — «важно, чтобы шар
   был большего размера, чем остальные элементы». Знаки — 16, бегунок темы — 28. */
.znak-iskra .iskra{width:32px;height:32px}
/* Шар — ровно в высоту поля поиска и по его середине: владелец 13.09.2026.
   Обёртка шара была выше кнопки (строчный зазор под `summary`), и шар
   садился выше середины строки. */
.shapka .znak-vypad.poverhnost{display:inline-flex;align-items:center}
.znak-knopka.znak-iskra{height:var(--organ-mal);padding:0}
.shapka .znak-iskra .iskra{width:var(--organ-mal);height:var(--organ-mal)}
/* Профиль значком: фото меньше шара — шар крупнее всего в шапке. */
.profil-knopka{padding:0 4px}
.profil-foto{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:26px;height:26px;
  border-radius:50%;object-fit:cover;background:var(--line);color:var(--ink-2);font:600 11px/1 var(--shrift)}
.profil-foto.krupnoe{width:44px;height:44px;font-size:15px}
.profil-polotno{display:flex;align-items:center;gap:12px;min-width:min(280px,86vw);padding:14px 16px}
.profil-tekst{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0;line-height:1.35}
.profil-vyhod{align-self:flex-end;margin:6px 0 0}
.profil-vyhod .ssylka{font-size:13px}
.profil-tekst b{font-size:14px}
.profil-tekst .tiho{font-size:13px}
@media (prefers-reduced-motion:reduce){
  .poverhnost[open] .razgovor-imya::before{animation:none}
  .poverhnost>.znak-knopka .iskra{transition:none}
}
/* Крупные искры — для образца и заголовков разделов помощника.
   Размер задаётся классом, а не вторым правилом со своим градиентом:
   второй градиент разошёлся бы с первым на первой же правке. */
.iskra-17{width:17px;height:17px}
.iskra-28{width:28px;height:28px}
.iskra-56{width:56px;height:56px}
.iskra-ryad{display:flex;align-items:center;gap:18px;padding:4px 18px 18px}

@media (prefers-reduced-motion:reduce){
  .iskra,
  .razgovor-imya::before,
  .razgovor:has(.replika.zhdyot) .razgovor-imya::before{animation:none}
}

.razgovor{display:flex;flex-direction:column;max-height:75vh}
/* Разговор красится своими ролями, а не общими: одно правило на обе
   его площадки — карту песочницы и окно из шапки. */
.razgovor,.poverhnost-polotno{background:var(--chat-fon);color:var(--chat-tekst)}
.razgovor .replika.otvet,.poverhnost-polotno .replika.otvet{color:var(--chat-tekst)}
.razgovor .replika-kto,.poverhnost-polotno .replika-kto{color:var(--chat-tiho)}
.razgovor .replika.vopros .replika-tekst,
.poverhnost-polotno .replika.vopros .replika-tekst{
  background:var(--chat-vopros);border:1px solid var(--chat-kraj);
  border-radius:var(--r-btn);padding:6px 10px}
.razgovor .tiho,.poverhnost-polotno .tiho{color:var(--chat-tiho)}
.razgovor .chat-tablica th,.poverhnost-polotno .chat-tablica th{color:var(--chat-tiho)}
.razgovor .chat-tablica td,.poverhnost-polotno .chat-tablica td{
  border-bottom-color:var(--chat-kraj)}
/* overflow-anchor:none — низ держит скрипт (`prilipnut`). Родная привязка
   прокрутки к содержимому откатывала ленту вверх при росте ответа: на 63 px
   при росте в 160, замерено браузером 14.09.2026, — и в раскрытом окне
   свежая реплика уходила за нижний край. */
.razgovor-lenta{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  overflow-anchor:none}
/* ── ответ таблицей прямо в разговоре ──────────────────────────
   Владелец 12.09.2026: «сделай возможность и таблицы показывать так
   же, как и в этом чате ты мне можешь её показать». Таблица здесь —
   ответ, а не отчёт: шесть строк и пять столбцов, дальше ссылка.
   Поэтому и вид у неё тише: тонкие линии, мелкая шапка, никаких
   сортировок — сортируют в отчёте. */
/* Справа воздух и у всей таблицы ответа, не только у последней ячейки (владелец 13.09.2026). */
.chat-itog{margin:8px 0 2px;padding-right:16px;overflow-x:auto;overscroll-behavior-x:contain}
/* Таблица не сжимается уже своего содержимого: два текстовых столбца и шесть
   чисел в окне на 40rem давали магазин «1…» и день «0…». Шире окна — уходит
   вбок своей полосой прокрутки, первый столбец закреплён, чтобы при прокрутке
   было видно, чья строка (владелец 14.09.2026). */
/* Ответ из нескольких таблиц (16.09.2026): заголовок части над её таблицей. */
.chat-chast{display:block;margin-top:14px}
.chat-chast-imya{display:block;font-weight:600;margin-bottom:6px}
.chat-tablica-skroll{overflow-x:auto;overscroll-behavior-x:contain;max-width:100%;
  scrollbar-width:thin;padding-bottom:12px}
/* Плавающая полоса мака рисуется поверх низа прокрутки: при 4 px поля она
   ложилась на оговорку под таблицей (снимок владельца 14.09.2026). */
.chat-tablica{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;
  font-size:13px;table-layout:auto}
.chat-tablica th,.chat-tablica td{
  padding:5px 10px 5px 0;text-align:left;vertical-align:baseline}
/* Имя сжимается и обрезается многоточием, число — никогда: обрезанное
   «2 940 3…» не число вовсе. «09 · Магазин Краснодар Тургенева 102
   (Краснодар)» длиннее всего окна, и без этого таблица вылезала за
   край. Полное имя остаётся в подсказке и в отчёте. */
.chat-tablica td:not(.n),.chat-tablica th:not(.n){
  max-width:26ch;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.chat-tablica th:first-child:not(.n),.chat-tablica td:first-child:not(.n){
  position:sticky;left:0;z-index:1;background:var(--chat-fon,var(--paper))}
/* Закреплённой ячейке нужен сплошной фон, иначе столбцы едут под ней насквозь.
   Но сплошной белый выбеливал её там, где строка серая: шапка, «Всего» и
   строка под курсором — владелец 14.09.2026: «первый столбец почему-то не
   выделяется». Фон тот же, что у строки. */
.chat-tablica thead th:first-child:not(.n),
.chat-tablica tfoot td:first-child:not(.n),
.chat-tablica tbody tr:hover td:first-child:not(.n){background:var(--pale)}
/* В окне «ИИ помощник» и в строке песочницы фон — `--paper` (`.znak-polotno` перебивает `--chat-fon`, у истории
   песочницы подложка снята), и закреплённый первый столбец на `--chat-fon` читался ночью светлой полосой
   (владелец 15.09.2026, замерено: 38,38,36 на 21,24,30). */
.poverhnost-polotno .chat-tablica tbody tr:not(:hover) td:first-child:not(.n),
.stroka-pomoshchnika .chat-tablica tbody tr:not(:hover) td:first-child:not(.n){background:var(--paper)}
.chat-tablica td.n,.chat-tablica th.n{white-space:nowrap;width:1%;
  /* Отступ слева, а не только справа: шапки числовых столбцов длиннее
     самих чисел и без него читались одним словом —
     «конверсиявизитовкупили». */
  padding-left:14px}
.chat-tablica th{
  font:500 10px/1.4 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);
  border-bottom:1px solid var(--line);padding-bottom:4px}
.chat-tablica td{border-bottom:1px solid var(--line-2)}
.chat-sort{display:inline-flex;align-items:center;gap:4px;padding:0;border:0;background:none;
  font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;cursor:pointer}
.chat-sort:hover{color:var(--chat-tekst,var(--ink))}
.chat-sort:focus-visible{outline:2px solid var(--fokus);outline-offset:2px}
.chat-sort[data-uroven]{color:var(--chat-tekst,var(--ink))}
.chat-sort{max-width:100%}
.chat-sort-imya{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Метка уровня не обрезается вместе с длинным заголовком. */
.chat-sort[data-uroven]::after{content:attr(data-uroven);flex:0 0 auto;font-variant-numeric:tabular-nums}
.chat-tablica tbody tr:last-child td{border-bottom:0}
/* ── ответ цифрой и столбиками ─────────────────────────────────
   Разреза нет — ответ это одно число, и таблица из одной строки прячет
   его между шапкой и итогом; ход во времени шестью строками не читается.
   Рисуют их общие приёмы: число — плитки страниц, столбики — полоса
   банка через общую развилку. Своих копий у разговора нет с 13.09.2026
   (банк диаграмм, этап 10); здесь только место в ответе и цвета его
   ролей — ночью разговор тёплый, и приборный графит в нём был бы чужим.
   Плитки идут строкой по содержимому, а не сеткой: ответ шириной по
   содержимому, и сетка с `auto-fit` схлопывалась в нём в одну колонку в
   150 px — найдено на образце 13.09.2026. Столбики мягче полной заливки,
   как были: тридцать один сплошной красный столбик кричит. */
.chat-plitki.plitki{display:flex;flex-wrap:wrap;margin:8px 0 2px;
  background:var(--chat-vopros);border-color:var(--chat-kraj)}
.chat-plitki .plitka{flex:1 1 auto;padding:8px 10px;background:var(--chat-vopros);
  border-color:var(--chat-kraj)}
.chat-plitki .plitka .l{color:var(--chat-tiho)}
.chat-plitki .plitka .v{font-size:20px;color:var(--chat-tekst)}
.chat-risunok{margin:8px 0 2px}
.chat-risunok svg.brus .brus-polosa{fill:var(--chat-akcent);opacity:.72}
.chat-risunok svg.brus .brus-imya{fill:var(--chat-tiho)}
.chat-risunok svg.brus .brus-znachenie{fill:var(--chat-tekst)}
/* Сводка: всего, среднее и крайние одной строкой под рисунком. */
.chat-svodka{display:flex;flex-wrap:wrap;gap:4px 14px;margin:6px 0 2px;
  font-size:12px;color:var(--ink-2)}
.chat-svod b{color:var(--ink);font-variant-numeric:tabular-nums}
/* ── колонка разговора ─────────────────────────────────────────
   Раскрытое окно шире строки чтения, и реплики жались к левому краю,
   оставляя половину окна пустой. Владелец 12.09.2026:
   «отцентровывай контент в окне». Колонка ограничена и стоит по
   середине; в узком окне предел больше самого окна, и ничего не
   меняется. */
/* Колонку меряем только у реплик. Поле ввода стоит во всю ширину —
   владелец 12.09.2026: «ширину поля для ввода текста верни на всю
   ширину контента»: в него пишут абзац, а не строку, и суженное поле
   оставляло по бокам пустоту, в которой ничего нет. */
/* Колонка разговора — ровно под текст ответа: он ограничен 101ch, и
   колонка шире него оставляла таблицу у́же поля ввода. Владелец
   12.09.2026: «кнопка добавления файла, поле ввода, кнопка отправления
   НЕ должны быть шире самого контента — как у тебя». */
.razgovor{--kolonka-razgovora:calc(101ch + var(--replika-metka)
  + var(--replika-zazor) + 2 * var(--replika-pole))}
.razgovor-lenta>*{max-width:var(--kolonka-razgovora);margin-left:auto;margin-right:auto}
/* Форма в той же колонке и с отступом ровно на метку «портал»: край
   скрепки встаёт под краем ответа, край кнопки — под правым краем
   таблицы. */
.razgovor .sprosit{box-sizing:border-box;width:100%;
  max-width:var(--kolonka-razgovora);margin-left:auto;margin-right:auto;
  padding-left:calc(var(--replika-pole) + var(--replika-metka) + var(--replika-zazor));
  padding-right:var(--replika-pole)}
/* ── список бесед ──────────────────────────────────────────────
   Владелец 12.09.2026 прислал свой сайдбар: «я не вижу, чтобы ты
   сделал список чатов; учти, что у каждого человека должен быть
   свой». Список стоит колонкой слева и виден всегда — в выпадашке
   его не видно, пока не откроешь.

   Ширину меряем у самого разговора, а не у окна: он живёт и картой
   на странице, и окном из шапки, и раскрытым на весь экран. */
.razgovor{container-type:inline-size}
.razgovor-telo{display:flex;min-height:0;flex:1 1 auto}
/* Правая колонка: лента и поле ввода. Форма, стоявшая сестрой списка,
   занимала всю ширину карточки и уезжала под сайдбар — владелец
   12.09.2026: «сделай вровень с шириной контента». */
.razgovor-pravaya{flex:1 1 auto;min-width:0;min-height:0;
  display:flex;flex-direction:column}
.besedy-spisok{flex:0 0 15rem;min-width:0;display:flex;flex-direction:column;
  gap:4px;padding:0 8px 8px 10px;overflow-y:auto;overscroll-behavior:contain;
  border-right:1px solid var(--chat-kraj)}
/* Пункт, поле поиска и первая строка — одной высоты и одного радиуса:
   владелец 12.09.2026 — «чтобы строка поиска чата и подложка
   выбранного чата были одного размера, окалибруй высоту по полю
   поиска и текст не делай жирным». */
.beseda-punkt,.beseda-novaya{display:flex;gap:8px;align-items:center;
  justify-content:space-between;flex:0 0 auto;min-height:var(--punkt-besedy);
  padding:0 10px;border-radius:var(--r-btn);
  color:var(--chat-tekst);text-decoration:none;font-size:13px;font-weight:400;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Цвет при наведении закреплён: общее `a:hover` весит больше одного
   класса и красило пункт красным. */
.beseda-punkt:hover,.beseda-novaya:hover{background:var(--chat-vopros);
  color:var(--chat-tekst);text-decoration:none}
.beseda-punkt.vybrana{background:var(--chat-vopros);font-weight:400}
/* Первая строка сайдбара стоит на одной линии с названием чата справа:
   та же высота, что у шапки. */
/* Не жирная и без подчёркивания: владелец 12.09.2026 — «убери
   подчёркивание» и «с кнопки новый чат убери жирный». */
.beseda-novaya{color:var(--chat-akcent);font-weight:400;
  min-height:var(--shapka-razgovora);margin:0 0 2px;padding:0 10px;
  border-radius:0}
.beseda-novaya:hover{background:none;color:var(--chat-akcent);
  text-decoration:none;opacity:.8}
.beseda-pusto{padding:0 10px;min-height:var(--punkt-besedy);
  display:flex;align-items:center}
.beseda-punkt .tiho{flex:0 0 auto;font-size:11px}
/* Многоточие ставится только блоку со своим текстом: у пункта текст
   лежал голым узлом рядом с датой, и длинное название обрезалось на
   полуслове, а дата уезжала за край. */
.beseda-imya{flex:1 1 auto;min-width:0;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
/* display:flex у строк списка перебивал атрибут hidden: поиск
   ставил пунктам hidden, а они оставались на месте, и «Ничего не
   нашлось» стояло под списком при пустом поиске. Замерено браузером. */
.beseda-punkt[hidden],.beseda-pusto[hidden]{display:none}
/* ── троеточие у чата и архив (14.09.2026) ─────────────────────── */
.beseda-stroka{position:relative;display:flex;flex:0 0 auto;min-width:0}
.beseda-stroka[hidden]{display:none}
.beseda-stroka .beseda-punkt{flex:1 1 auto;min-width:0;padding-right:34px}
.beseda-menyu{position:absolute;right:4px;top:50%;transform:translateY(-50%)}
.beseda-menyu[hidden]{display:none}
.beseda-troetochie{display:flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:6px;list-style:none;cursor:pointer;
  color:var(--chat-tiho);opacity:0;transition:opacity .12s ease}
.beseda-troetochie::-webkit-details-marker{display:none}
.beseda-troetochie svg{width:14px;height:14px;fill:currentColor}
.beseda-stroka:hover .beseda-troetochie,.beseda-punkt.vybrana + .beseda-menyu .beseda-troetochie,
.beseda-menyu[open] .beseda-troetochie,.beseda-troetochie:focus-visible{opacity:1}
.beseda-troetochie:hover{background:var(--chat-kraj);color:var(--chat-tekst)}
.beseda-troetochie:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
@media (hover:none){.beseda-troetochie{opacity:1}}
.beseda-menyu-polotno{position:absolute;right:0;top:calc(100% + 4px);z-index:30;
  display:flex;flex-direction:column;gap:2px;width:18rem;max-width:calc(100vw - 16px);padding:6px;
  background:var(--chat-fon,var(--paper));border:1px solid var(--chat-kraj);
  border-radius:var(--r-btn);box-shadow:0 8px 24px -10px rgba(17,19,24,.35)}
.beseda-menyu-punkt{display:block;width:100%;box-sizing:border-box;padding:7px 10px;
  font:inherit;font-size:13px;text-align:left;color:var(--chat-tekst);background:none;
  border:0;border-radius:6px;cursor:pointer;list-style:none;white-space:nowrap}
.beseda-menyu-punkt::-webkit-details-marker{display:none}
.beseda-menyu-punkt:hover{background:var(--chat-pole)}
.beseda-menyu-opasno{color:var(--red)}
/* Поиск и кнопка разделов — одной строкой одной высоты; кнопка квадратная и
   белая, как поле (владелец 14.09.2026). */
/* Кнопка разделов вровень с поиском (снимок владельца 14.09.2026): у поиска свой нижний
   отступ, и при выравнивании по центру он поднимал поле на 2 px над кнопкой. */
.besedy-poisk-ryad{display:flex;gap:6px;align-items:stretch;flex:0 0 auto;margin-bottom:4px}
.besedy-poisk-ryad .besedy-poisk{flex:1 1 auto;min-width:0;width:auto;margin:0}
.besedy-razdely{position:relative;flex:0 0 auto}
.besedy-razdely-knopka{display:flex;align-items:center;justify-content:center;box-sizing:border-box;
  width:var(--punkt-besedy);height:var(--punkt-besedy);list-style:none;cursor:pointer;
  background:var(--paper);color:var(--chat-tekst);border:1px solid var(--chat-kraj);
  border-radius:var(--r-btn)}
.besedy-razdely-knopka::-webkit-details-marker{display:none}
.besedy-razdely-knopka svg{width:14px;height:14px;fill:currentColor}
.besedy-razdely-knopka:hover,.besedy-razdely[open] .besedy-razdely-knopka{background:var(--chat-pole)}
.besedy-razdely-knopka:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.besedy-razdely-polotno{position:absolute;left:0;top:calc(100% + 4px);z-index:30;
  display:flex;flex-direction:column;gap:2px;min-width:14rem;width:max-content;padding:6px;
  background:var(--chat-fon,var(--paper));border:1px solid var(--chat-kraj);
  border-radius:var(--r-btn);box-shadow:0 8px 24px -10px rgba(17,19,24,.35)}
.besedy-razdel{display:flex;align-items:center;justify-content:space-between;gap:10px;white-space:nowrap;
  padding:7px 10px;border-radius:6px;font-size:13px;color:var(--chat-tekst);text-decoration:none}
.besedy-razdel:hover{background:var(--chat-pole);color:var(--chat-tekst);text-decoration:none}
.besedy-razdel.vybran{background:var(--chat-vopros)}
/* Имя раздела и срок хранения — одной строкой (владелец 14.09.2026: «в одну строку все надписи»). */
.besedy-razdel-imya{display:flex;flex-direction:row;align-items:baseline;gap:8px}
.besedy-razdel-imya .tiho,.besedy-razdel>.tiho{font-size:11px}
.besedy-razdel-podpis{padding:2px 10px 0;font-size:11px;letter-spacing:.04em;
  text-transform:uppercase;color:var(--chat-tiho)}
/* ── шапка разговора ──────────────────────────────────────────
   Вверху название беседы, слева кнопка списка. «Спросить словами» и
   «песочница →» убраны: человек и так спрашивает словами, а знать ему
   надо, в какой он беседе. */
.razgovor-shapka{display:flex;gap:6px;align-items:center;min-width:0;
  flex:0 0 var(--shapka-razgovora);height:var(--shapka-razgovora);margin:0;
  /* Справа место под кнопки окна: они висят поверх угла, и название
     не должно под них заезжать. */
  padding:0 3.25rem 0 var(--replika-pole);
  border-bottom:1px solid var(--chat-kraj);
  text-transform:none;letter-spacing:0}
.razgovor-imya{flex:1 1 auto;min-width:0;overflow:hidden;
  display:flex;align-items:center;
  text-overflow:ellipsis;white-space:nowrap;
  font:600 13px/1.4 var(--shrift);letter-spacing:0;text-transform:none;
  color:var(--chat-tekst)}
.besedy-knopka{flex:0 0 auto;display:none;align-items:center;
  justify-content:center;width:var(--organ-kroha);height:var(--organ-kroha);
  padding:0;border:0;border-radius:var(--r-btn);background:none;
  color:var(--chat-tiho);cursor:pointer;
  transition:background .14s ease,color .14s ease}
.besedy-knopka:hover{background:var(--chat-vopros);color:var(--chat-tekst)}
.besedy-knopka:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.besedy-knopka svg{width:15px;height:15px;display:block}
/* ── поиск по списку ─────────────────────────────────────────── */
.besedy-poisk{flex:0 0 auto;width:100%;margin:0 0 4px;
  height:var(--punkt-besedy);box-sizing:border-box;
  padding:0 10px;border:1px solid var(--chat-kraj);
  border-radius:var(--r-btn);background:var(--chat-fon);
  color:var(--chat-tekst);font-size:13px}
.besedy-poisk::placeholder{color:var(--chat-tiho)}
.besedy-poisk:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.beseda-nichego{white-space:normal}
/* Узкий разговор: колонки нет — она съела бы треть ленты. Со
   скриптом список прячется под кнопку и выезжает рядом с окном по
   наведению; без скрипта остаётся полосой сверху, иначе сменить
   беседу было бы нечем. */
@container (max-width: 46rem){
  .razgovor-telo{flex-direction:column}
  .besedy-spisok{flex:0 0 auto;flex-direction:row;overflow-x:auto;
    overflow-y:hidden;border-right:0;border-bottom:1px solid var(--chat-kraj);
    padding:6px 10px}
  .beseda-punkt,.beseda-novaya{flex:0 0 auto;max-width:14rem}
  .besedy-poisk{display:none}
  .so-skriptom .razgovor .besedy-knopka{display:inline-flex}
  .so-skriptom .razgovor .besedy-spisok{display:none}
  /* Выехавшая панель: `fixed`, потому что полотно окна
     прокручивается, и панель, положенная рядом обычным
     позиционированием, обрезалась бы его краем. Место ей считает
     скрипт — он один знает, где стоит окно. */
  .so-skriptom .razgovor .besedy-spisok.vyehal{
    display:flex;flex-direction:column;position:fixed;z-index:40;
    /* Сверху без поля: первая строка панели встаёт на одну линию с
       названием чата в окне — у обоих рамка в пиксель и строка ростом
       с шапку. С полем в 8 px «+ Начать новый чат» висел ниже. */
    width:min(16rem,72vw);padding:0 8px 8px;
    border:1px solid var(--chat-kraj);border-radius:var(--r-card);
    background:var(--chat-fon);box-shadow:0 18px 44px rgba(0,0,0,.34);
    overflow-y:auto;overscroll-behavior:contain;
    animation:vyehal-spisok .16s var(--pruzhina)}
  .so-skriptom .razgovor .besedy-spisok.vyehal .besedy-poisk{display:block}
  .so-skriptom .razgovor .besedy-spisok.vyehal .beseda-punkt,
  .so-skriptom .razgovor .besedy-spisok.vyehal .beseda-novaya{max-width:none}
}
@keyframes vyehal-spisok{from{opacity:0;transform:translateX(6px)}
  to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){
  .so-skriptom .razgovor .besedy-spisok.vyehal{animation:none}
}
/* ── доля от наибольшего ───────────────────────────────────────
   Полоса под числом: видно, во сколько раз первый больше шестого, а по
   числам это считают в уме. Полоса та же, что у списков страниц: ширину
   задаёт класс `polosa-N`, потому что правило содержимого не пускает ни
   `style`, ни свой `<style>`. Здесь только место под числом — тонкая и
   без жёлоба, как была. Заливка — строчный `span`, и без `display:block`
   ширина класса к ней не применяется: полосы не было видно вовсе, пробы
   были зелёные, нашёл образец. */
.chat-tablica .chat-dolya{display:block;width:100%;height:3px;margin-top:2px;background:none}
.chat-tablica .chat-dolya .polosa-zapolnenie{display:block;background:var(--chat-akcent);opacity:.35}
.chat-ogovorka{display:block;margin-top:3px}
.chat-tablica .n{text-align:right;font-variant-numeric:tabular-nums;
  padding-right:0}
.chat-tablica tfoot td{
  border-top:1px solid var(--line);border-bottom:0;
  font-weight:600;padding-top:6px}
.chat-skryto{display:block;margin-top:6px;font-size:12px}
/* ── строка помощника в песочнице (14.09.2026) ──────────────────
   Владелец: «сверху свёрнутая форма чата до одной строки ввода (с кнопкой и +),
   а ниже формируется отчёт… волшебное переливающееся действие в форме самого
   отчёта». История — кнопкой рядом с полем, раскрывается вверх; ответы, которые
   отчёт не меняют, — оповещением справа сверху, как у мака, с крестиком. */
/* Подложка во всю ширину, поле посередине (владелец 14.09.2026: «нужно, чтобы
   была форма — подложка, а на ней уже само поле для ввода текста и контент как
   обычно, посередине»). Подложка — как карточка отчёта под ней; поле — обычная
   коробка разговора своей ширины. Вопрос с вариантами встаёт на место поля, а
   страница под ним темнеет — «так же, как у тебя». */
.stroka-pomoshchnika{position:relative;margin:4px 0 14px;padding:14px 16px;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--ten-karty)}
.stroka-pomoshchnika .sprosit{padding:0}
.stroka-pomoshchnika .stroka-forma,.stroka-pomoshchnika .stroka-vopros,
.stroka-pomoshchnika .stroka-istoriya{max-width:52rem;margin-inline:auto}
.stroka-pomoshchnika .stroka-vopros{box-sizing:border-box}
.stroka-vopros[hidden],.stroka-zatemnenie[hidden]{display:none}
.stroka-zatemnenie{position:fixed;inset:0;z-index:55;background:rgba(17,19,24,.42)}
/* Вопрос — своей карточкой сразу под полем, поле остаётся (владелец 14.09.2026: «форма с
   вопросами показывается сразу под формой для ввода текста с небольшим отступом, и уши
   эти убери»): подложка не растягивается под вопрос. */
.stroka-pomoshchnika.s-voprosom{z-index:56}
.stroka-pomoshchnika .stroka-vopros{position:absolute;z-index:57;top:calc(100% - 6px);left:16px;right:16px;
  max-height:min(72vh,44rem);overflow:auto;overscroll-behavior:contain;padding:16px 18px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-card);
  box-shadow:0 18px 44px -12px rgba(17,19,24,.35)}
.stroka-vopros .utochnenie{border:0;padding:0;box-shadow:none;background:none}
.stroka-vopros{transform-origin:top center;animation:stroka-vopros-vhod .22s var(--pruzhina)}
@keyframes stroka-vopros-vhod{from{transform:scaleY(.7);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.stroka-vopros{animation:none}}
.stroka-vopros .utochnenie-shapka [data-utochnenie-svernut]{display:none}
/* Круглая кнопка рядом с полем, ростом с однострочное поле: 8 + 28 + 8 (владелец 14.09.2026). */
.stroka-pomoshchnika .stroka-forma{display:flex;align-items:flex-end;gap:8px}
.stroka-pomoshchnika .stroka-forma>.sprosit-pole{flex:1 1 auto}
.stroka-knopka-istorii{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:calc(var(--organ-kroha) + 16px);height:calc(var(--organ-kroha) + 16px);padding:0;border:0;border-radius:50%;
  background:var(--chat-pole);
  color:var(--chat-tiho);cursor:pointer}
.stroka-knopka-istorii:hover,.stroka-knopka-istorii[aria-expanded="true"]{
  background:var(--chat-vopros);color:var(--chat-tekst)}
.stroka-knopka-istorii:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
/* Чаты песочницы — такой же круглой кнопкой рядом с историей (14.09.2026). */
.stroka-chaty{position:relative;flex:0 0 auto}
.stroka-knopka-chatov{display:inline-flex;align-items:center;justify-content:center;list-style:none;cursor:pointer;
  width:calc(var(--organ-kroha) + 16px);height:calc(var(--organ-kroha) + 16px);border-radius:50%;
  background:var(--chat-pole);color:var(--chat-tiho)}
.stroka-knopka-chatov::-webkit-details-marker{display:none}
.stroka-knopka-chatov:hover,.stroka-chaty[open]>.stroka-knopka-chatov{background:var(--chat-vopros);color:var(--chat-tekst)}
.stroka-knopka-chatov:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.stroka-knopka-chatov svg{width:16px;height:16px}
.stroka-chaty-polotno{position:absolute;z-index:40;top:calc(100% + 6px);left:0;width:min(22rem,86vw);padding:6px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-card);
  box-shadow:0 14px 32px rgba(17,19,24,.16)}
.stroka-chat{display:flex;align-items:baseline;justify-content:space-between;gap:10px;width:100%;
  padding:8px 10px;border:0;border-radius:var(--r-btn);background:none;cursor:pointer;
  font:inherit;font-size:13.5px;color:var(--ink);text-align:left}
.stroka-chat:hover{background:var(--pale)}
.stroka-chat.vybran{background:var(--pale);font-weight:600}
.stroka-chat:focus-visible{outline:2px solid var(--fokus);outline-offset:-2px}
.stroka-chat-imya{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Поиск и десять строк на виду, дальше прокрутка (15.09.2026). Строка чата — 36 px. */
.stroka-chaty-poisk{display:block;width:100%;box-sizing:border-box;height:var(--organ-mal);margin:0 0 6px;padding:0 10px;
  font:inherit;font-size:13.5px;color:var(--ink);background:var(--pale);border:1px solid var(--line);border-radius:var(--r-btn)}
.stroka-chaty-poisk:focus{outline:2px solid var(--fokus);outline-offset:0;border-color:transparent}
.stroka-chaty-spisok{max-height:calc(10 * 36px);overflow-y:auto;overscroll-behavior:contain}
.stroka-chat{min-height:36px;box-sizing:border-box}
.stroka-chat[hidden],.stroka-chaty-pusto[hidden]{display:none}
/* «…» у чата в списке — без обводки, видно при наведении на строку (владелец 15.09.2026). */
.stroka-chat-ryad{position:relative}
.stroka-chat-ryad[hidden]{display:none}
.stroka-chat-ryad .stroka-chat{padding-right:40px}
.stroka-chat-menyu{position:absolute;right:6px;top:5px}
.stroka-chat-menyu[open]{z-index:3}
.stroka-chat-troetochie{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border:0;
  border-radius:6px;list-style:none;cursor:pointer;color:var(--ink-3);background:none;opacity:0;transition:opacity .12s ease}
.stroka-chat-troetochie::-webkit-details-marker{display:none}
.stroka-chat-troetochie svg{width:14px;height:14px;fill:currentColor}
.stroka-chat-ryad:hover .stroka-chat-troetochie,.stroka-chat-menyu[open] .stroka-chat-troetochie,
.stroka-chat-troetochie:focus-visible{opacity:1}
/* Без подложки (владелец 16.09.2026, снимок): при наведении меняется только цвет. */
.stroka-chat-troetochie,.stroka-chat-troetochie:hover,.stroka-chat-menyu[open] .stroka-chat-troetochie{background:none}
.stroka-chat-troetochie:hover{color:var(--ink)}
.stroka-chat-troetochie:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
@media (hover:none){.stroka-chat-troetochie{opacity:1}}
/* Сразу под кнопкой и вправо (владелец 15.09.2026: «открывай сразу под кнопкой и направо уводи»): `fixed`, место
   ставит скрипт от кнопки — внутри прокручиваемого списка правый край обрезал бы меню. */
.stroka-chat-menyu-polotno{position:fixed;left:0;top:0;z-index:60;width:18rem;max-width:calc(100vw - 16px);
  box-sizing:border-box;padding:6px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-btn);box-shadow:0 8px 24px -10px rgba(17,19,24,.35)}
.stroka-chaty-pusto{padding:8px 10px;font-size:13px}
.stroka-knopka-istorii svg{width:16px;height:16px;transition:transform .18s var(--pruzhina)}
.stroka-knopka-istorii[aria-expanded="true"] svg{transform:rotate(180deg)}
@media (prefers-reduced-motion:reduce){.stroka-knopka-istorii svg{transition:none}}
.stroka-istoriya{margin:0 0 8px;padding:6px 12px;max-height:min(55vh,34rem);overflow-y:auto;
  overscroll-behavior:contain;background:var(--chat-fon,var(--paper));
  border:1px solid var(--chat-kraj,var(--line));border-radius:var(--r-card);box-shadow:var(--ten-karty,none)}
.stroka-istoriya[hidden]{display:none}
/* На подложке строки своя рамка и тень у истории — вторая обводка (владелец 14.09.2026). */
.stroka-pomoshchnika .stroka-istoriya{border:0;box-shadow:none;border-radius:0;max-height:65vh;
  /* Поле одного цвета с подложкой: светлого квадрата под репликами нет (владелец 15.09.2026). */
  background:none}
.stroka-istoriya .replika{margin:6px 0}
/* Сборка из нескольких таблиц (владелец 16.09.2026): таблицы друг под другом, список — справа в форме
   помощника, зеркально списку чатов. В отчёте список остаётся для узкого экрана и страницы без скрипта. */
.sborka-karta{margin-top:14px}
.sborka-zhdyot{margin:0;padding:12px 15px}
.karta.grafik-karta + .sborka-karta,.sborka-karta + .karta.grafik-karta{margin-top:14px}
.so-skriptom .sborka-v-otchete{display:none}
@media (max-width:760px){.so-skriptom .sborka-v-otchete{display:block}}
.sborka-v-otchete{margin:10px 0 2px}
.sborka-spisok{max-width:22rem;padding:10px 12px;border:1px solid var(--line);
  border-radius:var(--r-card);background:var(--paper)}
.stroka-tablicy-bok{flex:0 0 15rem;max-width:15rem;position:sticky;top:0;
  padding-left:12px;border-left:1px solid var(--chat-kraj,var(--line))}
.stroka-tablicy-bok[hidden]{display:none}
.stroka-tablicy-bok .sborka-spisok{max-width:none;padding:0;border:0;border-radius:0;background:none}
@media (max-width:760px){.stroka-tablicy-bok{display:none}}
@media (min-width:1400px){
  /* Правое крыло — зеркало левого: от ближайшей кнопки формы до края карточки. */
  .stroka-pomoshchnika .stroka-tablicy-bok{position:absolute;right:16px;top:14px;bottom:14px;z-index:2;
    left:calc(50% + 26rem + 12px);width:auto;max-width:none;box-sizing:border-box;
    padding:10px;background:var(--chat-fon,var(--paper));border:1px solid var(--chat-kraj,var(--line));
    border-radius:var(--r-card);box-shadow:var(--ten-karty,none);overflow-y:auto;overscroll-behavior:contain}
  .stroka-pomoshchnika .stroka-tablicy-bok[hidden]{display:none}
  /* Крыло не выше истории: пустой разговор оставил бы от списка одну строку. */
  .stroka-pomoshchnika .stroka-istoriya:has(> .stroka-tablicy-bok:not([hidden])){min-height:15rem}
}
.sborka-ruchka{display:flex;align-items:center;justify-content:center;flex:0 0 22px;width:22px;height:28px;
  padding:0;border:0;border-radius:6px;background:none;color:var(--ink-3);cursor:grab;touch-action:none}
.sborka-ruchka svg{width:10px;height:16px;fill:currentColor}
.sborka-ruchka:hover{background:var(--pale);color:var(--ink)}
.sborka-ruchka:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.sborka-ryad.tashchim{box-shadow:0 8px 22px -8px rgba(17,19,24,.4);border-radius:var(--r-btn);
  background:var(--paper);position:relative;z-index:2}
/* Без скрипта название сохраняет кнопка; со скриптом — уход с поля (владелец 16.09.2026: «убери кнопку
   „Сохранить название“: изменили в поле название, ушли с него — и готов»). */
.so-skriptom .sborka-sohranit{display:none}
/* Ручка высоты формы помощника — по всей нижней границе, полоска посередине (владелец 16.09.2026: «растягивать
   за нижнюю границу форму ИИ помощника вниз и обратно»). */
.stroka-ruchka-vysoty{display:none;position:absolute;left:16px;right:16px;bottom:-6px;height:12px;z-index:3;
  cursor:ns-resize;touch-action:none}
.so-skriptom .stroka-pomoshchnika:has(> .stroka-istoriya:not([hidden])) > .stroka-ruchka-vysoty{display:block}
.stroka-ruchka-vysoty::after{content:"";position:absolute;left:50%;top:4px;width:40px;height:4px;margin-left:-20px;
  border-radius:2px;background:var(--line-2);transition:background .12s ease}
.stroka-ruchka-vysoty:hover::after,.stroka-ruchka-vysoty.tyanem::after{background:var(--kraj)}
.stroka-ruchka-vysoty:focus-visible{outline:2px solid var(--fokus);outline-offset:0;border-radius:6px}
/* Стрелка в шапке скрывает и раскрывает таблицу (владелец 16.09.2026). Без скрипта её нет — нажимать нечем. */
.sborka-svernut{display:none;align-items:center;justify-content:center;width:24px;height:24px;margin:0 6px 0 -6px;
  padding:0;border:0;border-radius:6px;background:none;color:var(--ink-3);cursor:pointer;flex:none}
.so-skriptom .sborka-svernut{display:inline-flex}
.sborka-svernut svg{width:14px;height:14px;transition:transform .18s var(--pruzhina, ease)}
.sborka-svernut:hover{background:var(--pale);color:var(--ink)}
.sborka-svernut:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.sborka-svernut[aria-expanded="false"] svg{transform:rotate(-90deg)}
@media (prefers-reduced-motion:reduce){.sborka-svernut svg{transition:none}}
.sborka-karta.svernuta>:not(h3),.grafik-karta.svernuta>:not(.sborka-imya){display:none}
.grafik-karta.svernuta>.sborka-imya{border-bottom:0}
.sborka-karta>h3{justify-content:flex-start}
.sborka-imya{padding:9px 15px;min-height:var(--organ);box-sizing:border-box;display:flex;align-items:center;
  font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);border-bottom:1px solid var(--line)}
.sborka-ryad.tashchim .sborka-ruchka{cursor:grabbing}
.sborka-ryad.otkryta input{border-color:var(--kraj);font-weight:600}
.sborka-nazvanie{display:block;margin-bottom:8px}
.sborka-nazvanie-ryad{display:flex;align-items:center;gap:6px;margin-top:4px}
.sborka-disketa{display:flex;align-items:center;justify-content:center;flex:0 0 32px;width:32px;height:var(--organ-mal);
  padding:0;border:0;border-radius:var(--r-btn);background:none;color:var(--ink-3);cursor:pointer}
.sborka-disketa svg{width:16px;height:16px}
.sborka-disketa:hover{background:var(--pale);color:var(--ink)}
.sborka-disketa:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.sborka-glaz{display:flex;align-items:center;justify-content:center;flex:0 0 24px;width:24px;height:24px;padding:0;
  border:0;border-radius:6px;background:none;color:var(--ink-3);cursor:pointer}
.sborka-glaz svg{width:15px;height:15px}
.sborka-glaz .glaz-zakryt,.sborka-glaz[aria-pressed="true"] .glaz-otkryt{display:none}
.sborka-glaz[aria-pressed="true"] .glaz-zakryt{display:block}
.sborka-glaz:hover{background:var(--pale);color:var(--ink)}
.sborka-glaz:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
/* Скрытая со страницы — зачёркнута и бледнее (владелец 16.09.2026). */
.sborka-ryad.skryta input{text-decoration:line-through;color:var(--ink-3)}
/* Окно «да/нет» перед удалением таблицы — родной dialog: встаёт поверх всего и не режется краем крыла. */
.sborka-dialog{max-width:min(24rem,calc(100vw - 32px));padding:18px 20px;border:1px solid var(--line);
  border-radius:var(--r-card);background:var(--paper);color:var(--ink);box-shadow:0 18px 44px -12px rgba(17,19,24,.35)}
.sborka-dialog::backdrop{background:rgba(17,19,24,.35)}
.modalka.vyneseno>summary{display:none}
.sborka-dialog p{margin:0 0 14px;font-size:14px}
.sborka-dialog-knopki{display:flex;gap:8px;justify-content:flex-end}
.sborka-nazvanie-ryad input{flex:1 1 auto;min-width:0}
.sborka-nazvanie input{display:block;width:100%;box-sizing:border-box;height:var(--organ-mal);padding:0 8px;
  border:1px solid var(--line);border-radius:var(--r-btn);background:var(--paper);color:var(--ink);font:inherit;font-size:13px}
.sborka-nazvanie input:focus{outline:2px solid var(--fokus);outline-offset:0}
.sborka-ubrat{display:flex;align-items:center;justify-content:center;flex:0 0 24px;width:24px;height:24px;padding:0;
  border:0;border-radius:6px;background:none;color:var(--ink-3);cursor:pointer}
.sborka-ubrat svg{width:10px;height:10px}
.sborka-ubrat:hover{background:var(--pale);color:var(--red)}
.sborka-ubrat:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.sborka-versiya{font-size:12px;margin-top:4px}
/* Таблица, которую только что поменял помощник, — отметкой на миг, тем же приёмом, что перемена цифры. */
.sborka-otmechena{animation:sborka-otmechena 1.6s ease-out}
@keyframes sborka-otmechena{0%{box-shadow:0 0 0 2px var(--svedenie)}100%{box-shadow:0 0 0 2px transparent}}
@media (prefers-reduced-motion:reduce){.sborka-otmechena{animation:none;outline:2px solid var(--svedenie)}}
.sborka-otmena{display:inline}
.ssylka-knopka{padding:0;border:0;background:none;color:var(--ink-2);font:inherit;text-decoration:underline;
  text-underline-offset:2px;cursor:pointer}
.ssylka-knopka:hover{color:var(--ink)}
.sborka-zagolovok{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3);margin-bottom:6px}
.sborka-ryad{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.sborka-nomer{flex:0 0 1.2rem;color:var(--ink-3);font-size:12px;text-align:right}
.sborka-ryad input{flex:1 1 auto;min-width:0;box-sizing:border-box;height:var(--organ-mal);padding:0 8px;
  border:1px solid var(--line);border-radius:var(--r-btn);background:var(--paper);color:var(--ink);
  font:inherit;font-size:13px}
.sborka-ryad input:focus{outline:2px solid var(--fokus);outline-offset:0}
@media (max-width:760px){.sborka-spisok{max-width:none}}

/* Раскрытая история: чаты — в левом крыле карточки, за полем ввода и кнопками (владелец 16.09.2026:
   «в левом крыле должно быть, за пределом поля для ввода и кнопок»). Разговор и поле стоят колонкой в
   52rem посередине, а по краям карточки пусто — там список и живёт. Крыло узкое (экран меньше 1400) —
   список встаёт слева внутри колонки: за её пределами ему негде стоять. */
.stroka-istoriya{display:flex;gap:14px;align-items:flex-start}
.stroka-istoriya-lenta{flex:1 1 auto;min-width:0}
.stroka-chaty-bok{flex:0 0 15rem;max-width:15rem;position:sticky;top:0;
  padding-right:12px;border-right:1px solid var(--chat-kraj,var(--line))}
.stroka-chaty-bok[hidden]{display:none}
@media (min-width:1400px){
  /* Вид — как у выпадашки (своя рамка, фон и скругление), место — крыло, ширина — до ближайшей кнопки
     формы: колонка формы стоит посередине шириной 52rem, значит правый край списка — 50% + 26rem + зазор
     (владелец 16.09.2026: «соединить первый вариант отображения списка с размещением из второго, только
     ширину его до ближайшей кнопки расширить»). */
  .stroka-pomoshchnika .stroka-chaty-bok{position:absolute;left:16px;top:14px;bottom:14px;z-index:2;
    right:calc(50% + 26rem + 12px);width:auto;max-width:none;
    padding:6px;background:var(--chat-fon,var(--paper));border:1px solid var(--chat-kraj,var(--line));
    border-radius:var(--r-card);box-shadow:var(--ten-karty,none);
    display:flex;flex-direction:column;border-right:1px solid var(--chat-kraj,var(--line))}
  .stroka-pomoshchnika .stroka-chaty-bok[hidden]{display:none}
  /* Прокручивается перечень чатов, а не скруглённая рамка крыла (владелец 16.09.2026, снимок: меню «…» у чата
     обрезалось правым краем крыла). Рамка со скруглением и прокруткой режет и `fixed`-меню внутри себя;
     в выпадашке у кнопки прокрутка стоит на перечне без скругления — там меню и не обрезалось. */
  .stroka-pomoshchnika .stroka-chaty-bok .stroka-chaty-korob{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
  /* Поиск своей высоты: в колонке он сжимался вместе с перечнем (владелец 16.09.2026: «сделай нормальной по
     высоте строку поиска»). */
  .stroka-pomoshchnika .stroka-chaty-bok .stroka-chaty-poisk{flex:none}
  .stroka-pomoshchnika .stroka-chaty-bok .stroka-chaty-spisok{max-height:none;flex:1 1 auto;min-height:0;
    overflow-y:auto;overscroll-behavior:contain}
}
@media (max-width:760px){.stroka-chaty-bok{display:none}}
/* Поле имени чата в «…»: своя строка над действиями. Меню шириной 18rem — имя чата длинное, в 9rem поле
   показывало треть (владелец 16.09.2026: «поле для ввода не достаточно длинное»). */
.beseda-menyu-imya{display:block;padding:4px 6px}
/* Имя чата правится полем прямо в строке списка (16.09.2026). */
.chat-pole-imeni{flex:1 1 auto;min-width:0;width:100%;box-sizing:border-box;height:26px;margin:-3px 0;padding:0 6px;
  border-radius:6px;color:var(--ink);font:inherit;font-size:inherit}
.chat-pole-imeni:focus{outline:2px solid var(--fokus);outline-offset:0}
/* В песочнице кнопка «Переименовать» живёт внутри блока поля: отступ — у поля, а не у блока, иначе она
   стоит правее «Удалить» (владелец 16.09.2026: «удалить не ровно»). */
.stroka-chat-imya-forma{display:block;padding:0}
.stroka-chat-imya-forma input{display:block;margin:4px 0}
.beseda-menyu-imya input,.stroka-chat-imya-forma input{width:100%;box-sizing:border-box;height:var(--organ-mal);
  padding:0 8px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--paper);
  color:var(--ink);font:inherit;font-size:13px}
.beseda-menyu-imya input:focus,.stroka-chat-imya-forma input:focus{outline:2px solid var(--fokus);outline-offset:0}
/* Переливается отчёт, пока помощник думает: цветами знака помощника, поверх
   прежних цифр, не пряча их. Нажимать можно — отчёт живой. */
#rezultat.perelivaetsya>.karta{position:relative;overflow:hidden}
#rezultat.perelivaetsya>.karta::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(110deg,transparent 15%,var(--vydelenie) 38%,
    color-mix(in srgb,var(--iskra-svet) 55%,transparent) 50%,var(--vydelenie) 62%,transparent 85%);
  background-size:250% 100%;animation:perelivy 1.6s ease-in-out infinite}
@keyframes perelivy{from{background-position:130% 0}to{background-position:-130% 0}}
@media (prefers-reduced-motion:reduce){
  #rezultat.perelivaetsya>.karta::after{animation:none;background:var(--vydelenie)}
}
.opoveshcheniya{position:fixed;top:72px;right:16px;z-index:60;display:flex;flex-direction:column;
  gap:10px;width:min(26rem,calc(100vw - 32px));max-height:calc(100vh - 96px);overflow-y:auto;
  overscroll-behavior:contain;pointer-events:none}
.opoveshchenie{position:relative;pointer-events:auto;padding:12px 40px 12px 14px;font-size:14px;
  color:var(--chat-tekst,var(--ink));background:color-mix(in srgb,var(--chat-fon,var(--paper)) 92%,transparent);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border:1px solid var(--chat-kraj,var(--line));border-radius:14px;
  box-shadow:0 12px 32px -12px rgba(17,19,24,.35);animation:opoveshchenie-vhod .22s var(--pruzhina)}
@keyframes opoveshchenie-vhod{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.opoveshchenie{animation:none}}
.opoveshchenie-zakryt{position:absolute;top:8px;right:8px;display:inline-flex;align-items:center;
  justify-content:center;width:24px;height:24px;padding:0;border:0;border-radius:50%;
  background:none;color:var(--chat-tiho);cursor:pointer}
.opoveshchenie-zakryt:hover{background:var(--chat-pole);color:var(--chat-tekst)}
.opoveshchenie-zakryt:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.opoveshchenie-zakryt svg{width:12px;height:12px}
.opoveshchenie .utochnenie{border:0;padding:0;box-shadow:none;background:none}
/* У оповещения свой крестик — второй, от формы, лишний; «Пропустить» внизу остаётся. */
.opoveshchenie .utochnenie-shapka .utochnenie-znak{display:none}
.opoveshchenie .chat-itog{max-width:100%}

/* ── вопрос с вариантами ─────────────────────────────────────────
   По образцу окна вопросов Claude, снимок владельца 14.09.2026: белая
   карточка, вопрос жирным, справа «свернуть» и «пропустить»; варианты —
   серые плашки с именем, пояснением и номером справа; «Свой вариант» с
   полем внутри; внизу «Пропустить» и «Готово», серое, пока ничего не
   выбрано. Цвета — ролями разговора, ночью они тёплые. */
.utochnenie{display:flex;flex-direction:column;gap:10px;margin:2px 0 4px;
  padding:14px 16px 16px;background:var(--chat-fon,var(--paper));
  border:1px solid var(--chat-kraj,var(--line));border-radius:var(--r-card);
  box-shadow:var(--ten-karty,none);max-width:100%;box-sizing:border-box}
.utochnenie-shapka{display:flex;align-items:center;gap:4px}
.utochnenie-vopros{flex:1 1 auto;min-width:0;font-size:15px;font-weight:600;
  line-height:1.35;color:var(--chat-tekst,var(--ink))}
.utochnenie-znak{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-kroha);height:var(--organ-kroha);padding:0;border:0;
  border-radius:var(--r-btn);background:none;color:var(--chat-tiho,var(--ink-3));cursor:pointer}
.utochnenie-znak:hover{background:var(--chat-pole);color:var(--chat-tekst,var(--ink))}
.utochnenie-znak:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.utochnenie-znak svg{width:15px;height:15px;display:block;transition:transform .16s ease}
.utochnenie.svyornuto .utochnenie-znak[data-utochnenie-svernut] svg{transform:rotate(-90deg)}
.utochnenie.svyornuto .utochnenie-telo{display:none}
.utochnenie-telo{display:flex;flex-direction:column;gap:6px}
.utochnenie-variant{display:flex;align-items:center;gap:12px;padding:10px 14px;
  background:var(--chat-pole);border:1px solid transparent;border-radius:var(--r-btn);
  cursor:pointer;transition:background .12s ease,border-color .12s ease}
.utochnenie-variant:hover{border-color:var(--chat-kraj,var(--line-2))}
.utochnenie-variant.vybran{border-color:var(--chat-tekst,var(--ink))}
.utochnenie-variant:focus-within{outline:2px solid var(--fokus);outline-offset:1px}
.utochnenie-slova{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.utochnenie-imya{font-size:14px;color:var(--chat-tekst,var(--ink));line-height:1.35}
.utochnenie-opisanie{font-size:13px;color:var(--chat-tiho,var(--ink-3));line-height:1.4}
.utochnenie-nomer{flex:0 0 auto;min-width:22px;height:22px;box-sizing:border-box;padding:0 6px;
  display:inline-flex;align-items:center;justify-content:center;
  font:500 12px/1 var(--cifry);color:var(--chat-tiho,var(--ink-3));
  border:1px solid var(--chat-kraj,var(--line-2));border-radius:6px;background:none}
/* Галочка вопроса с несколькими ответами: квадрат, выбранный — залит (14.09.2026). */
.utochnenie-galka{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;box-sizing:border-box;border:1.5px solid var(--kraj);
  border-radius:5px;color:var(--chat-fon,var(--paper))}
.utochnenie-galka svg{width:12px;height:12px;display:none}
.utochnenie-variant.vybran .utochnenie-galka{background:var(--chat-tekst,var(--ink));
  border-color:var(--chat-tekst,var(--ink))}
.utochnenie-variant.vybran .utochnenie-galka svg{display:block}
.utochnenie-variant.nedostupen{opacity:.45;cursor:default}
.vybor-punkt.nedostupen{opacity:.45;cursor:default}
.vybor-punkt.nedostupen input{cursor:default}
/* Своё имя, а не `vybor-ssylka`: то занято строками дерева «Вариант», и правило ссылки на
   комментарии легло на всё дерево — сжатые строки и сдвиг (снимок владельца 14.09.2026). */
.ssylka-na-kommentarii{display:block;margin:-2px 0 4px;padding:0 9px 0 33px;font-size:12.5px;
  color:var(--ink-2);text-decoration:none}
.ssylka-na-kommentarii:hover{color:var(--ink)}
.vybor-punkt.nedostupen:hover{background:none}
.utochnenie-variant.nedostupen:hover{border-color:transparent}
.utochnenie-period{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 4px}
.utochnenie-data{flex:1 1 11rem;display:flex;align-items:center;gap:10px;padding:6px 6px 6px 14px;
  background:var(--chat-pole);border-radius:var(--r-btn);font-size:13px;color:var(--chat-tiho,var(--ink-3))}
.utochnenie-data input{flex:1 1 auto;min-width:0;height:var(--organ-mal);box-sizing:border-box;padding:0 10px;
  font:inherit;font-size:14px;color:var(--chat-tekst,var(--ink));background:var(--chat-fon,var(--paper));
  border:1px solid var(--chat-kraj,var(--kraj));border-radius:8px}
.utochnenie-podskazka{font-size:12.5px;color:var(--chat-tiho,var(--ink-3));padding:0 2px 2px}
.utochnenie-svoj{align-items:flex-start}
.utochnenie-svoj .utochnenie-nomer{margin-top:1px}
.utochnenie-pole{margin-top:8px;width:100%;box-sizing:border-box;height:var(--organ-mal);
  padding:0 10px;font:inherit;font-size:14px;color:var(--chat-tekst,var(--ink));
  background:var(--chat-fon,var(--paper));border:1px solid var(--chat-kraj,var(--line-2));
  border-radius:8px}
.utochnenie-pole:focus{outline:2px solid var(--fokus);outline-offset:0;border-color:transparent}
.utochnenie-knopki{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}
.utochnenie-propusk{height:var(--organ-mal);padding:0 14px;font:inherit;font-size:14px;
  color:var(--chat-tekst,var(--ink));background:var(--chat-fon,var(--paper));
  border:1px solid var(--chat-kraj,var(--line-2));border-radius:var(--r-btn);cursor:pointer}
.utochnenie-propusk:hover{background:var(--chat-pole)}
.utochnenie-gotovo{height:var(--organ-mal);min-height:0;padding:0 16px}
.utochnenie-gotovo:disabled{background:var(--line-2);color:var(--paper);cursor:default;transform:none}
.utochnenie.otpravleno{opacity:.6;pointer-events:none}
.utochnenie-itog{display:block;margin-top:2px}
.sprosit{flex:0 0 auto;align-items:flex-end}
/* Поле растёт под вопрос, высоту ему ставит скрипт. `resize:none` —
   ручка размера рядом с кнопкой отправки читается как вторая кнопка.
   `field-sizing:content` умеет не всякий браузер, поэтому высоту
   считаем сами, а не полагаемся на него. */
.sprosit textarea{flex:1;min-height:var(--organ);max-height:168px;
  padding:9px 11px;resize:none;overflow-y:hidden;
  font:400 14px/20px var(--shrift);color:var(--ink)}
.sprosit textarea:focus{outline:none;border-color:var(--fokus);
  box-shadow:0 0 0 3px var(--fokus-fon)}

/* ── Ожидание ответа ──────────────────────────────────
   Стадия названа своим словом, а не одним на обе: очередь и разбор —
   разные вещи. Слово переливается, пока ждём: неподвижная строка через
   минуту неотличима от зависшей.

   Часы молчат первые пятнадцать секунд, их ставит скрипт. Место под них
   держится всегда, иначе строка дёргается, когда они появляются. */
.zhdyom{background:linear-gradient(90deg,
    var(--ink-3) 0%,var(--ink-3) 38%,var(--ink) 50%,
    var(--ink-3) 62%,var(--ink-3) 100%);
  background-size:280% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:pereliv 2.2s linear infinite}
@keyframes pereliv{from{background-position:100% 0}to{background-position:-180% 0}}
.zhdyom-chasy{display:inline-block;min-width:2.8em;margin-left:8px;
  white-space:nowrap;
  font:400 11.5px/1 var(--cifry);color:var(--ink-3);
  font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){
  .zhdyom{animation:none;background:none;-webkit-text-fill-color:currentColor;
    color:var(--ink-2)}
}

/* ── Затравки ───────────────────────────────────────
   Пустой разговор — самое трудное место: не видно, на каком языке
   спрашивать. Примеры стояли прозой и раньше, но их перепечатывали
   руками. Кладутся в поле, а не отправляются: их правят почти всегда. */
.zatravki{display:flex;flex-wrap:wrap;gap:7px;padding:2px 15px 4px 81px}
/* Высота — нижняя граница, а не размер: в узкой колонке затравка
   встаёт в две строки, и жёсткие 32 px обрезали бы вторую. */
.zatravka{display:inline-flex;align-items:center;
  min-height:var(--organ-mal);padding:5px 11px;cursor:pointer;
  font:400 12.5px/1.35 var(--shrift);color:var(--ink-2);text-align:left;
  transition:border-color .14s ease,color .14s ease}
.zatravka:hover{border-color:var(--ink-3);color:var(--ink)}
.zatravka:active{transform:translateY(1px)}
@media (max-width:700px){.zatravki{padding-left:15px}}
@media (prefers-reduced-motion:reduce){.zatravka{transition:none}}

/* Отправка — квадратная кнопка со стрелкой: подпись занимала треть строки. */
.knopka-otpravit{display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 auto;width:var(--organ);height:var(--organ);padding:0;border:0;
  border-radius:11px;
  background:var(--red);color:#fff;cursor:pointer;
  transition:background .14s ease}
.knopka-otpravit:hover{background:var(--red-700)}
.knopka-otpravit:active{transform:translateY(1px)}
.knopka-otpravit svg{width:19px;height:19px}

/* «Весь чат»: откуда реплика — иначе вопросы по трём отчётам читаются как
   один разговор, который сам себе противоречит. */
.replika-otkuda{padding:9px 15px 0 81px;font-size:12px;color:var(--ink-3)}
.replika-otkuda .ssylka{font-size:12px;margin-left:6px;white-space:nowrap}
.razgovor-shapka .dvojnaya{margin-left:0}

/* Скрепка и снимок к вопросу. */
.sprosit{flex-wrap:wrap}
.skrepka{display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 auto;width:var(--organ);height:var(--organ);border-radius:11px;
  cursor:pointer;
  border:1px solid var(--line-2);background:var(--paper);color:var(--ink-3);
  transition:border-color .14s ease,color .14s ease}
.skrepka:hover{border-color:var(--ink-3);color:var(--ink)}
.skrepka svg{width:18px;height:18px}
/* `hidden` — всего лишь `display:none` из настроек браузера, и наш
   `display:flex` его перебивает. На этом уже спотыкались с полями «куда». */
.snimok-prilozhen[hidden]{display:none}
.snimok-prilozhen{flex:1 0 100%;display:flex;align-items:center;gap:9px;
  font-size:12.5px;color:var(--ink-3);padding-top:2px}
.snimok-prilozhen .ssylka{font-size:12.5px}

/* ── Поле ввода: одна коробка, кнопки внутри, всё в одну строку ─────
   Владелец 12.09.2026 прислал снимок чужого поля: «чтобы кнопки были
   прям в поле, и его форма, и рамки её не было, но цвет как на третьем
   скрине», — а увидев коробку в две строки: «сделай всё-таки в одну
   строку и кнопки, и поле ввода». Угол 22 px — это --r-block, при
   строке в 44 px коробка выходит скруглённой целиком. Кнопки 28 px в
   восьми от края; поле растёт под текст, а кнопки остаются внизу
   строки — `align-items:flex-end`. Селекторы на класс длиннее общих
   `.sprosit textarea` и `.knopka-otpravit`: при равном весе решал бы
   порядок в файле, а на нём уже спотыкались. */
.sprosit .sprosit-pole{flex:1 1 100%;min-width:0;box-sizing:border-box;
  display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px;padding:8px;
  border:0;border-radius:var(--r-block);background:var(--chat-pole)}
.sprosit .sprosit-pole textarea{flex:1 1 auto;display:block;width:auto;
  min-width:0;box-sizing:border-box;min-height:var(--organ-kroha);
  padding:4px 2px;border:0;border-radius:0;background:transparent;
  box-shadow:none;color:var(--chat-tekst)}
.sprosit .sprosit-pole textarea:focus{border-color:transparent;box-shadow:none}
.sprosit .sprosit-pole textarea::placeholder{color:var(--chat-tiho)}
/* Снимок к вопросу — своей строкой под полем, во всю ширину коробки. */
.sprosit .sprosit-pole .snimok-prilozhen{flex:1 0 100%;padding:0 6px 2px}
.sprosit-pole .skrepka,.sprosit-pole .knopka-otpravit{
  width:var(--organ-kroha);height:var(--organ-kroha);border-radius:50%}
.sprosit-pole .skrepka{border:0;background:none;color:var(--chat-tiho)}
.sprosit-pole .skrepka:hover{background:var(--chat-vopros);color:var(--chat-tekst)}
.sprosit-pole .skrepka svg,.sprosit-pole .knopka-otpravit svg{width:16px;height:16px}
.replika .snimok{display:block;margin-top:7px}
.replika .snimok img{max-width:min(420px,100%);max-height:260px;
  border:1px solid var(--line);border-radius:var(--r-btn);display:block}

/* Подпись под заголовком страницы. Обычный абзац режется по 70 знакам —
   это правильно для текста, который читают, и неправильно для одной фразы
   под заголовком: на широком экране она вставала в три строки при пустом
   поле справа. */
.podpis{max-width:none}

/* Карта с одними органами отбора: внутри неё нижняя черта органов отделяет
   их от пресетов, и отдельная рамка вокруг формы больше не нужна. */
.otbor-karta{margin-top:16px}
.otbor-karta .presety{margin:0;padding:10px 15px}
/* Кнопка-переключатель без цветной метки: метка — легенда кривой, а здесь
   кривых нет. */
.knopka-krivoj.bez-metki::before{display:none}

/* Куда раскрывается панель выбора. По умолчанию она приколота правым краем —
   так задумано для рядов, где органы стоят справа. В рядах отбора они стоят
   слева, и панель уезжала за левый край страницы: 02.09.2026 на «Сходимости»
   список магазинов открывался наполовину за экраном. Скрипт считает по месту
   и ставит одну из этих меток; без скрипта в рядах отбора берётся «вправо». */
.ryad-otbora .vybor-polotno{left:0;right:auto}
.vybor-polotno.vpravo{left:0;right:auto}
.vybor-polotno.vlevo{left:auto;right:0}

/* Раскрытие дня в сходимости: те же плитки и та же вложенная таблица, что и
   везде, только теснее — внутри строки они не должны спорить с самой
   строкой. Свёртка работает и здесь: правило на `.raskrytie` знало только
   один класс, а раскрытий стало два. */
tr.chek-raskrytie.svyornuto .raskrytie-telo{grid-template-rows:0fr;opacity:0}
/* Свод дня: у каждого поля своя зона одной ширины, посчитанной под шесть
   цифр с копейками — «999 999,00». Рамок нет: зоны держит сетка и общий
   ритм, а не линии. Подписи под числом убраны — они повторяли заголовок.
   Остаётся только разница: она говорит то, чего в числе не видно. */
.svod-dnya{display:flex;flex-wrap:wrap;gap:12px 0;
  padding:0 0 11px;margin-bottom:11px;border-bottom:1px solid var(--line)}
.svod-cifra{display:flex;flex-direction:column;gap:3px;
  flex:0 0 8.6rem;min-width:0;padding-right:14px}
.svod-cifra .l{font:500 10px/1.3 var(--cifry);letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.svod-cifra b{font:600 17px/1.15 var(--shrift);letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.svod-cifra .protiv{color:var(--ink-3);font-weight:500;margin-left:3px}
.svod-cifra .s{font-size:11.5px;color:var(--red);line-height:1.3;
  font-variant-numeric:tabular-nums}
/* Красным — только разница: она про беду. Сумма реализаций просто уточняет
   счётчик, и кричать ей не о чем. */
.svod-cifra .s.spokojno{color:var(--ink-3)}
.svod-cifra.vrozn b{color:var(--red)}
/* Пояснение — своей строкой под числами, со сдвигом на одну зону и вдвое
   короче: во всю ширину оно читалось как заголовок раздела, а не примечание.
   Больше трёх строк не показываем. */
.svod-slova{flex:0 0 100%;max-width:38rem;margin-left:8.6rem;
  font-size:11.5px;color:var(--ink-3);line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
  overflow:hidden}
@media (max-width:900px){
  .svod-slova{margin-left:0;max-width:none}
}

/* Свидетели по одному документу — построчно, столбиком на вопрос: есть ли
   чек, на какую сумму, что это, и в каких файлах день пришёл. «Есть» и
   «сумма» разведены намеренно: один и тот же чек может прийти с разными
   суммами, и в одной клетке это не показать. */
/* Ширины заданы, а не отданы содержимому: последний столбец уезжал за край,
   когда имя ручного файла оказывалось длинным. Длинное обрезается
   многоточием, целиком показывается по наведению (`title`).
   «Чек» и «Сумма» с запасом: сумма бывает шестизначной. */
.svideteli{display:grid;gap:0;padding:2px 0 2px 26px;
  grid-template-columns:minmax(14rem,17rem) 1.4rem 4.2rem minmax(6.5rem,7.5rem)
                        minmax(10rem,1fr) minmax(9rem,15rem) minmax(9rem,15rem)}
.svidetel,.zagolovok-svidetelej{display:contents}
/* `stretch`, а не `center`: при выравнивании по центру каждая клетка
   кончается на своей высоте, и нижняя граница ломается ступеньками —
   полоса шапки шла рваной. Клетка тянется во всю строку, а текст внутри
   центрируется своим флексом. */
.svidetel>span,.zagolovok-svidetelej>span{padding:5px 14px 5px 0;
  border-bottom:1px solid var(--line);align-self:stretch;
  display:flex;align-items:center}
.zagolovok-svidetelej>span{font:500 9.5px/1.3 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);padding-bottom:4px;
  align-items:flex-end;border-bottom:1px solid var(--line-2)}
/* Первая клетка шапки пустая, но полоса под ней должна начинаться там же,
   где имя источника: 2 px черты плюс 11 px отступа. */
.zagolovok-svidetelej>span:first-child{padding-left:13px}
.zagolovok-svidetelej>span.n,.svidetel .summa{justify-content:flex-end}
.svideteli>.svidetel:last-child>span{border-bottom:0}
.svidetel .istochnik{font:500 10px/1.3 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);
  padding-left:11px;border-left:2px solid var(--line-2);white-space:nowrap}
.svidetel .chto{font:600 13px/1.2 var(--shrift);white-space:nowrap}
.svidetel .summa{font:600 14px/1.2 var(--shrift);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.svidetel .pochemu{font-size:11.5px;color:var(--ink-3)}
.svidetel .pochemu,.svidetel .fajl{white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;min-width:0;display:block;line-height:2}
.svidetel .fajl{font:400 11px/2 var(--cifry);color:var(--ink-3)}
/* Значок в цвет полосы слева: на первом взгляде читается он, не слово. */
.svidetel .znak{display:flex;align-items:center;justify-content:center;
  padding-right:6px;color:var(--ink-3)}
.svidetel .znak svg{width:12px;height:12px}
/* Зелёного в палитре нет — только красный и графит. Галочка берётся
   графитом, в цвет своей же полосы. */
.svidetel.est .znak{color:var(--ink-2)}
.svidetel.net .znak{color:var(--red)}
.svidetel.molchit .znak{color:var(--ink-3)}
.svidetel.est .istochnik{border-left-color:var(--ink-2)}
/* Жирным — файл, из которого лежат живые строки: день бывает накрыт и
   регулярной выгрузкой, и ручной, а в счёт идёт одна. */
.svidetel .fajl.zhivoj{color:var(--ink);font-weight:500}
.svidetel.net .istochnik{border-left-color:var(--red)}
.svidetel.net .chto{color:var(--red)}
/* «Не про это»: источник к типу документа не относится или за этот день его
   нет вовсе. Прочерк, а не крестик: красный тут означал бы потерю, которой
   не было — аванс к обычной продаже отношения не имеет. */
.svidetel.ne_pro_eto .istochnik{border-left-style:dashed;
  border-left-color:var(--line-2)}
.svidetel.ne_pro_eto .znak,.svidetel.ne_pro_eto .chto{color:var(--ink-3)}
.svidetel.ne_pro_eto .chto{font-weight:500}
/* «Нет данных за день» — пробел в загрузке, а не устройство дела: источник
   этот день знать должен, просто выгрузка до него не дошла. */
.svidetel.net_dnya .istochnik{border-left-style:dotted;
  border-left-color:var(--ink-3)}
.svidetel.net_dnya .znak,.svidetel.net_dnya .chto{color:var(--ink-3)}
.svidetel.net_dnya .chto{font-weight:500}
.svidetel.molchit .istochnik{border-left-style:dashed}
.svidetel.molchit .chto{color:var(--ink-3);font-weight:500}
@media (max-width:1100px){
  .svideteli{grid-template-columns:1fr}
  .zagolovok-svidetelej{display:none}
  .svidetel>span{padding:2px 0;border-bottom:0}
  .svidetel .summa{justify-content:flex-start}
  .svideteli>.svidetel>.istochnik{padding-top:8px}
}

/* Вложенное раскрытие внутри вложенной таблицы: подложка та же белая. */
table.vlozhennaya tr.chek-raskrytie>td{background:var(--paper);
  box-shadow:none;padding:8px 10px}

/* Вид документа рядом с номером: продажа, возврат, реализация, аванс.
   Тихая метка, а не ярлык: она уточняет строку, а не спорит с ней.
   Красным — только возврат: он единственный меняет знак денег. */
.vid{display:inline-block;margin-left:8px;padding:1px 7px;border-radius:999px;
  font:500 10px/1.5 var(--cifry);letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-3);background:var(--pale);border:1px solid var(--line);
  vertical-align:1px;white-space:nowrap}
.vid-vozvrat{color:var(--red);background:var(--red-50);border-color:var(--red-50)}
.vid-avans{color:var(--ink-2)}
.vid-realizaciya{color:var(--ink-2)}

/* Раздел «Потоки отчётов»: в своде рядом с числами стоят слова — расписание
   и время, — и кегль числа им велик. */
.svod-cifra b.melko{font:600 13px/1.3 var(--shrift);letter-spacing:0;
  white-space:normal}
/* Формула имени файла из 1С длинная и в столбец не влезает: показываем
   начало, целиком — в подсказке и на странице потока. */
td.fajl{max-width:34ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Индикатор срока в разделе «Потоки»: успел файл к своему часу или нет.
   Знак стоит по центру своей колонки и на одной линии с первой строкой
   названия — строки бывают в две строки, и прижимать его к середине ячейки
   значит увести от той строки, к которой он относится. */
/* Имена свои, не `znak`/`est`/`net`: те уже заняты — `znak` логотипом в
   шапке (он inline-flex, и ячейка становилась flex-контейнером), `est` и
   `net` свидетелями «Сходимости», где они блочные. Знак от этого уезжал
   влево от середины колонки. */
.srok-znak{font:600 15px/1.5 var(--shrift);text-align:center}
.srok-znak .uspel{color:var(--zelenyj)}
.srok-znak .ne-uspel{color:var(--red)}
.reestr th.uzkaya, .reestr td.uzkaya{width:34px;text-align:center;
  padding-left:4px;padding-right:4px}

/* Отбор потоков живёт в такой же карточке, как отчёт и песочница, поэтому
   высоту органов задаёт `.grafik-upravlenie`. Своего здесь — только отступ
   таблицы под карточкой. */
.otbor-potokov+.skroll,.grafik-karta+.skroll{margin-top:16px}

/* Поступление: дата и давность двумя дорожками, чтобы «1 дн. назад» встало
   в столбик, а не ехало вслед за датой разной длины. */
td.postuplenie{white-space:nowrap}
td.postuplenie .kogda{display:inline-block;min-width:5.4rem;
  font-variant-numeric:tabular-nums}
td.postuplenie .kogda.red{color:var(--red);font-weight:500}
td.postuplenie .davno{display:inline-block}

/* Страница потока: обещание и факт полями одной ширины, под ними подвал с
   техническим — приёмник и группа. Прежде это был абзац в три строки поверх
   формулы 1С, и читать его было нечем. */
.potok-svod{display:flex;flex-wrap:wrap;gap:14px 0;padding:13px 15px}
.potok-pole{display:flex;flex-direction:column;gap:3px;
  flex:0 0 11rem;min-width:0;padding-right:16px}
.potok-pole-shirokoe{flex:1 1 20rem}
.potok-pole .l{font:500 10px/1.3 var(--cifry);letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3);white-space:nowrap}
.potok-pole b{font:600 15px/1.25 var(--shrift);letter-spacing:-.01em}
.potok-pole b.mono{font:500 12.5px/1.35 var(--cifry);word-break:break-all}
.potok-pole .s{font-size:11.5px;color:var(--ink-3);line-height:1.3}
.potok-pole .s.vrozn{color:var(--red)}
.potok-podval{padding:11px 15px;border-top:1px solid var(--line);
  font-size:12px;color:var(--ink-3);line-height:1.5}
.potok-podval .mono{font-size:11.5px;word-break:break-all}
h2{font:600 17px/1.3 var(--shrift);margin:22px 0 10px}

/* Лист файла на странице партии: строка с замечанием подсвечена, строка
   шапки помечена тише. Замечание стоит на своей строке — читать его отдельной
   таблицей, не видя строки, невозможно. */
tr.stroka-s-zamechaniem>td{background:var(--red-50)}
tr.stroka-s-zamechaniem>td:first-child{box-shadow:inset 2px 0 0 var(--red)}
tr.stroka-shapki>td{background:var(--pale);font-weight:600}
.zamechaniya-fajla{margin:14px 0}
.zamechaniya-fajla div+div{margin-top:5px}
.knopka.tihaya.mal{height:var(--organ-mal);min-height:var(--organ-mal);
  padding:0 12px;font-size:13px}

/* Ширина полосы и глубина ветки — классами, а не атрибутом `style`.
   Иначе в политике содержимого приходится держать `style-src 'unsafe-inline'`,
   а он открывает подстановку любых стилей — последнее послабление CSP.
   Значений здесь конечное число: процент целый (0–100), глубина ограничена
   восемью уровнями плюс запас. */
.polosa-0{width:0%}.polosa-1{width:1%}.polosa-2{width:2%}.polosa-3{width:3%}.polosa-4{width:4%}.polosa-5{width:5%}.polosa-6{width:6%}.polosa-7{width:7%}.polosa-8{width:8%}.polosa-9{width:9%}
.polosa-10{width:10%}.polosa-11{width:11%}.polosa-12{width:12%}.polosa-13{width:13%}.polosa-14{width:14%}.polosa-15{width:15%}.polosa-16{width:16%}.polosa-17{width:17%}.polosa-18{width:18%}.polosa-19{width:19%}
.polosa-20{width:20%}.polosa-21{width:21%}.polosa-22{width:22%}.polosa-23{width:23%}.polosa-24{width:24%}.polosa-25{width:25%}.polosa-26{width:26%}.polosa-27{width:27%}.polosa-28{width:28%}.polosa-29{width:29%}
.polosa-30{width:30%}.polosa-31{width:31%}.polosa-32{width:32%}.polosa-33{width:33%}.polosa-34{width:34%}.polosa-35{width:35%}.polosa-36{width:36%}.polosa-37{width:37%}.polosa-38{width:38%}.polosa-39{width:39%}
.polosa-40{width:40%}.polosa-41{width:41%}.polosa-42{width:42%}.polosa-43{width:43%}.polosa-44{width:44%}.polosa-45{width:45%}.polosa-46{width:46%}.polosa-47{width:47%}.polosa-48{width:48%}.polosa-49{width:49%}
.polosa-50{width:50%}.polosa-51{width:51%}.polosa-52{width:52%}.polosa-53{width:53%}.polosa-54{width:54%}.polosa-55{width:55%}.polosa-56{width:56%}.polosa-57{width:57%}.polosa-58{width:58%}.polosa-59{width:59%}
.polosa-60{width:60%}.polosa-61{width:61%}.polosa-62{width:62%}.polosa-63{width:63%}.polosa-64{width:64%}.polosa-65{width:65%}.polosa-66{width:66%}.polosa-67{width:67%}.polosa-68{width:68%}.polosa-69{width:69%}
.polosa-70{width:70%}.polosa-71{width:71%}.polosa-72{width:72%}.polosa-73{width:73%}.polosa-74{width:74%}.polosa-75{width:75%}.polosa-76{width:76%}.polosa-77{width:77%}.polosa-78{width:78%}.polosa-79{width:79%}
.polosa-80{width:80%}.polosa-81{width:81%}.polosa-82{width:82%}.polosa-83{width:83%}.polosa-84{width:84%}.polosa-85{width:85%}.polosa-86{width:86%}.polosa-87{width:87%}.polosa-88{width:88%}.polosa-89{width:89%}
.polosa-90{width:90%}.polosa-91{width:91%}.polosa-92{width:92%}.polosa-93{width:93%}.polosa-94{width:94%}.polosa-95{width:95%}.polosa-96{width:96%}.polosa-97{width:97%}.polosa-98{width:98%}.polosa-99{width:99%}
.polosa-100{width:100%}
.gl-0{--glubina:0}.gl-1{--glubina:1}.gl-2{--glubina:2}.gl-3{--glubina:3}.gl-4{--glubina:4}.gl-5{--glubina:5}.gl-6{--glubina:6}.gl-7{--glubina:7}.gl-8{--glubina:8}.gl-9{--glubina:9}

/* Крупнее обычного — там, где в плитке стоит не число, а слово. */
.v.krupnee{font-size:16px}
.krupno{font-size:20px}

/* ── Дерево потока и непродаж (ТЗ 01.09.2026) ──────────────────────────
   Отступ уровня рисуется распоркой в первой ячейке, а не отступом самой
   ячейки: так у всех строк одна сетка колонок, как в макете ТЗ, и цифры
   стоят строго друг под другом на любой глубине. */
.derevo td:first-child>span[class^="gl-"]{display:inline-block;
  width:calc(var(--glubina,0) * 18px)}
.derevo a.vetka-ssylka{color:inherit;text-decoration:none}
.derevo a.vetka-ssylka:hover{text-decoration:underline}
.derevo a.vetka-ssylka.zhdyom{opacity:.5}
.derevo .ugolok{display:inline-block;width:14px;color:var(--ink-3);
  font-size:10px}
.derevo tr.ur-magazin>td{font-weight:600}
.derevo tr.ur-sotrudnik>td:first-child{font-weight:500}
.derevo tr.ur-tip>td:first-child{color:var(--ink-2)}
.derevo tr.derevo-zapisi>td{background:var(--pale);padding:8px 10px}
.derevo tr.derevo-zapisi .vlozhennaya{margin-top:4px}
.derevo tr.neprodazha td{color:var(--ink-2)}

/* ── Меню с группами (03.09.2026) ──────────────────────────────────────
   Раньше тринадцать пунктов шли подряд, и восемь из них были хозяйством
   портала. Теперь хозяйство собрано в группу: заголовок группы — не
   ссылка, потому что своей страницы у неё нет. */
.menyu-gruppa{display:flex;flex-direction:column;border-top:1px solid var(--line);
  margin-top:6px;padding-top:6px}
.menyu-zagolovok{font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-3);padding:6px 12px 2px}
.menyu-gruppa a{padding-left:12px}

/* ── «Что делаем»: справка по потоку ───────────────────────────────
   Кнопка в строке потоков и окно, которое она открывает. Окно берёт
   готовые `.modalka-*`, а своего здесь только ширина и раскладка текста:
   у паспорта блоки на несколько абзацев, и им нужна колонка для чтения,
   а не форма на два поля. */
.delaem-knopka{display:inline-block;white-space:nowrap;font-size:12px;
  padding:3px 9px;color:var(--ink-2);text-decoration:none;
  /* Таблетка намеренно: это отметка состояния работы, а не кнопка
     отбора, и круглая она затем, чтобы их не путали. */
  border-radius:999px}
.delaem-knopka:hover{color:var(--ink);border-color:var(--line);
  background:var(--paper-2)}
.delaem-knopka.zhdyom{opacity:.5;pointer-events:none}

.delaem-okno{width:min(720px,calc(100vw - 32px));max-height:calc(100vh - 80px);
  display:flex;flex-direction:column;gap:14px}
/* Своё `display` перебивает `hidden` из стилей браузера, и окно не
   закрывалось вовсе: кнопка срабатывала, а окно оставалось на экране.
   06.09.2026. */
.delaem-okno[hidden],.delaem-fon[hidden]{display:none}
.delaem-telo{overflow:auto;min-height:0;overscroll-behavior:contain}
/* Возврат к потоку липнет к верху окна: документ бывает на десять
   экранов, и подниматься за ним наверх незачем. */
.delaem-nazad{position:sticky;top:0;z-index:1;margin:-2px 0 10px;
  padding:8px 0 8px;background:var(--paper);
  border-bottom:1px solid var(--line-2)}
.delaem-nazad a{text-decoration:none}
.delaem-nazad a:hover{text-decoration:underline}
.delaem h4{margin:0 0 2px}
.delaem .podpis{margin:0 0 14px}
.delaem-chast{margin:0 0 18px}
.delaem-chast h5{margin:0 0 6px;font-size:13px;text-transform:uppercase;
  letter-spacing:.06em;color:var(--ink-2);font-weight:600}
.delaem-chast p{margin:0;max-width:62ch;line-height:1.5}
.delaem-net p{color:var(--ink-2)}
.delaem-blok{border-top:1px solid var(--line-2);padding:8px 0}
.delaem-blok>summary{cursor:pointer;font-weight:600;list-style:none}
.delaem-blok>summary::-webkit-details-marker{display:none}
.delaem-blok>summary::before{content:"▸ ";color:var(--ink-2)}
.delaem-blok[open]>summary::before{content:"▾ "}
.delaem-tekst{padding:6px 0 2px;max-width:62ch;line-height:1.5}
.delaem-tekst p{margin:0 0 9px}

/* Вёрстка паспорта внутри окна. Своя, а не общая: тут читают связный
   текст с таблицами и цитатами, а не смотрят реестр. */
.delaem-tekst h5,.delaem-tekst h6{margin:12px 0 4px;font-size:13px;
  letter-spacing:-.01em}
.delaem-tekst ul,.delaem-tekst ol{margin:4px 0 9px;padding-left:20px}
.delaem-tekst li{margin:2px 0}
.delaem-tekst code{font-size:12px;padding:1px 4px;border-radius:4px;
  background:var(--paper-2);border:1px solid var(--line-2)}
.delaem-tekst pre{margin:6px 0;padding:9px 11px;overflow-x:auto;
  border-radius:8px;background:var(--paper-2);border:1px solid var(--line-2)}
.delaem-tekst pre code{border:0;padding:0;background:none}
.delaem-tekst blockquote{margin:8px 0;padding:2px 0 2px 12px;
  border-left:2px solid var(--line-2);color:var(--ink-2)}
.delaem-tekst blockquote p{margin:0 0 6px}
/* Таблица паспорта шире колонки для чтения — пусть прокручивается сама,
   а не растягивает окно. */
.delaem-tekst table{border-collapse:collapse;margin:8px 0;font-size:13px;
  display:block;max-width:100%;overflow-x:auto;white-space:nowrap}
.delaem-tekst th,.delaem-tekst td{border:1px solid var(--line-2);
  padding:4px 9px;text-align:left;vertical-align:top}
.delaem-tekst th{background:var(--paper-2);font-weight:600}
.delaem-tekst a{color:var(--ink)}
.delaem-zadanie{border-top:1px solid var(--line-2);padding:8px 0;line-height:1.45}
.delaem-zadanie:first-of-type{border-top:0;padding-top:2px}
.delaem-fajly{margin:0;padding-left:18px}
.delaem-fajly li{margin:3px 0;line-height:1.4}
.delaem-fajly .tiho{display:block;font-size:12px}
/* Текст документа длиннее блока паспорта — своя колонка и свой воздух. */
.delaem-dokument{max-width:70ch}
.delaem-dokument p{margin:0 0 10px}

@media (max-width:700px){
  .delaem-okno{width:calc(100vw - 16px);max-height:calc(100vh - 40px)}
  .delaem-knopka{padding:3px 7px;font-size:11px}
}

/* ── «Вы вошли» ────────────────────────────────────────────────────
   Лист тот же, что у входа. Главное здесь — имя: человек отвечает себе
   на вопрос «под кем я зашёл», и оно крупнее служебной надписи. */
.voshli-metka{margin:0 0 2px;font-size:13px;text-transform:uppercase;
  letter-spacing:.08em;color:var(--ink-2)}
.voshli-imya{margin:0;font-size:30px;letter-spacing:-.02em}
.voshli-dolzhnost{margin:4px 0 0;color:var(--ink-2)}
.voshli-ne-ya{margin:12px 0 0}
.voshli-ne-ya .ssylka{font-size:13px;color:var(--ink-2)}
.voshli-ne-ya .ssylka:hover{color:var(--ink)}

/* ── Автоматизации ─────────────────────────────────────────────────
   Список дел, сгруппированный по документу-основанию. Подробности
   раскрываются на месте: `details` работает и без скрипта. */
.avto-gruppa{margin:0 0 26px}
.avto-osnovanie{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;
  margin:0 0 8px;font-size:16px;letter-spacing:-.01em}
.avto-osnovanie .tiho{font-size:12px;font-weight:400}
.avto{border-top:1px solid var(--line-2)}
.avto:last-child{border-bottom:1px solid var(--line-2)}
.avto>summary{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;
  padding:9px 0;cursor:pointer;list-style:none}
.avto>summary::-webkit-details-marker{display:none}
.avto>summary::before{content:"▸";color:var(--ink-2);width:12px}
.avto[open]>summary::before{content:"▾"}
.avto>summary:hover{background:var(--paper-2)}
.avto-kogda{color:var(--ink-2);font-size:13px}
.avto-potoki{display:inline-flex;flex-wrap:wrap;gap:4px}
.avto-telo{padding:2px 0 14px 20px}
.avto-telo p{margin:0 0 10px;line-height:1.5}

@media (max-width:700px){
  .avto>summary{align-items:flex-start}
  .avto-telo{padding-left:0}
}

/* ── задания: шапка раздела и форма создания ────────────────── */
/* Заголовок и кнопка в одном ряду: кнопка — главное действие раздела,
   и искать её ниже таблицы человек не должен. */
.zad-shapka{display:flex;align-items:flex-start;justify-content:space-between;
  gap:20px;flex-wrap:wrap}
.zad-shapka h1{margin-bottom:4px}
.zad-shapka .podpis{margin:0}
.zad-shapka .knopka{flex:none;margin-top:6px}

/* Таблица заданий: первый столбец несёт имя и код. */
.zad-tablica td:first-child{min-width:230px}
.zad-tablica td .mono{font-size:12px}

/* Форма создания. Сами поля уже одеты общим правилом выше — здесь только
   раскладка и то, чего в общем правиле нет: число и многострочное поле. */
.zad-forma input[type=number],.zad-forma textarea{
  min-height:var(--organ);padding:7px 11px;color:var(--ink);
  font:inherit;font-size:14px}
.zad-forma textarea{resize:vertical;line-height:1.5}
.zad-forma label{display:block;padding:13px 15px 0;
  font-size:13px;color:var(--ink-2)}
.zad-forma label>span.tiho{display:block;margin-top:5px;font-size:12px;
  max-width:60ch}
.zad-forma input[type=text],.zad-forma input[type=number],
.zad-forma select,.zad-forma textarea{
  display:block;width:100%;max-width:520px;margin-top:6px}
.zad-forma .karta{padding-bottom:15px}
.zad-forma .ryad-polej{display:flex;flex-wrap:wrap;gap:0 10px}
.zad-forma .ryad-polej label{flex:0 1 180px}
.zad-forma .ryad-polej input{max-width:150px}
/* Галка: подпись рядом, а не под полем. */
.zad-forma label.v-stroku{display:flex;align-items:baseline;gap:8px;
  flex-wrap:wrap;padding:9px 15px 0}
.zad-forma label.v-stroku input{width:auto;max-width:none;margin:0}
.zad-forma fieldset.dni-nedeli{border:0;margin:12px 15px 0;padding:0;
  display:flex;flex-wrap:wrap;gap:0 16px;align-items:baseline}
.zad-forma fieldset.dni-nedeli legend{padding:0;font-size:12px}
.zad-forma fieldset.dni-nedeli label{padding:6px 0 0}
/* Потоков двадцать семь: своя прокрутка, чтобы форма не тянулась на два
   экрана и кнопка «Создать» оставалась в поле зрения. */
.zad-forma .skroll.nevysoko{max-height:230px;overflow-y:auto;padding:4px 0 10px;overscroll-behavior:contain}
.zad-forma .zametka{margin:14px 15px 0}
.zad-forma p.tiho{margin:0;padding:12px 15px 0;font-size:12.5px}
.zad-knopki{display:flex;align-items:center;gap:16px;margin:20px 0}

/* Широкое окно — для формы создания задания: в ней четыре карточки, и в
   узком окне они встают в колонку высотой в два экрана. Прокрутка своя,
   чтобы кнопка «Создать» не уезжала за край. */
.modalka-okno.shirokoe{width:min(720px,92vw);max-height:86vh;overflow-y:auto;overscroll-behavior:contain}
.modalka-okno.shirokoe h2{margin:0 0 4px;font-size:19px;letter-spacing:-.02em}
.modalka-okno.shirokoe .zad-forma .karta{margin:14px 0}

/* Справка об исполнителях: блоки внутри окна плотнее обычных карточек —
   их там три подряд. Кнопка одета общим правилом тихой кнопки. */
.zad-shapka .modalka{flex:none}
.zad-shapka .modalka summary{margin-top:6px}
.spravka-blok{margin:12px 0}
.spravka-blok>h3{display:flex;gap:8px;align-items:baseline}
.spravka-blok>p{margin:0;padding:12px 15px;font-size:13.5px;line-height:1.55}

/* Форма из одной кнопки, стоящая в строке текста. Смена личины и выход из
   режима «глазами» делаются нажатием, а не переходом по адресу, — но
   выглядеть должны как ссылка в предложении, а не как блок. */
form.v-stroku{display:inline;margin:0}
form.v-stroku button{display:inline}

/* ── Дашборд выполнения планов (07.09.2026) ─────────────────────────────
   Мир тот же: волосяные линии, Red и Charcoal, никаких теней и карточек
   ради карточек. Зелёного в стайлгайде нет, поэтому состояний ровно два —
   отстаёт (красным) и идёт ровно (чернилами). Третьего цвета не заводим:
   на странице, где красным помечено только отстающее, глаз находит работу
   за секунду, а на светофоре — не находит вовсе.

   Ширины и положения — классами, а не `style=""`: CSP запрещает
   встроенные стили, и это правило старше дашборда. */

/* Тон жёлоба — отдельным током, а не `--pale`.
   В тёмной теме `--pale` равен `--paper` (оба #15181E), и жёлоб полосы
   сливается с карточкой: полоса висит в пустоте без шкалы, а 17 % и 89 %
   выглядят одинаково убедительно. Замер 07.09.2026 показал ровно это.
   Правило чинит и главную: там те же `.polosa-zhelob`. */
:root{--zhelob:var(--pale)}
@media (prefers-color-scheme:dark){:root:not([data-tema="den"]){--zhelob:#242832}}
:root[data-tema="noch"]{--zhelob:#242832}

.polosa-zhelob,.ryad-zhelob{background:var(--zhelob)}

/* Засечка ровного хода. Пара к готовым `.polosa-0` … `.polosa-100`. */
.zasechka-0{left:0%}.zasechka-1{left:1%}.zasechka-2{left:2%}.zasechka-3{left:3%}
.zasechka-4{left:4%}.zasechka-5{left:5%}.zasechka-6{left:6%}.zasechka-7{left:7%}
.zasechka-8{left:8%}.zasechka-9{left:9%}.zasechka-10{left:10%}.zasechka-11{left:11%}
.zasechka-12{left:12%}.zasechka-13{left:13%}.zasechka-14{left:14%}.zasechka-15{left:15%}
.zasechka-16{left:16%}.zasechka-17{left:17%}.zasechka-18{left:18%}.zasechka-19{left:19%}
.zasechka-20{left:20%}.zasechka-21{left:21%}.zasechka-22{left:22%}.zasechka-23{left:23%}
.zasechka-24{left:24%}.zasechka-25{left:25%}.zasechka-26{left:26%}.zasechka-27{left:27%}
.zasechka-28{left:28%}.zasechka-29{left:29%}.zasechka-30{left:30%}.zasechka-31{left:31%}
.zasechka-32{left:32%}.zasechka-33{left:33%}.zasechka-34{left:34%}.zasechka-35{left:35%}
.zasechka-36{left:36%}.zasechka-37{left:37%}.zasechka-38{left:38%}.zasechka-39{left:39%}
.zasechka-40{left:40%}.zasechka-41{left:41%}.zasechka-42{left:42%}.zasechka-43{left:43%}
.zasechka-44{left:44%}.zasechka-45{left:45%}.zasechka-46{left:46%}.zasechka-47{left:47%}
.zasechka-48{left:48%}.zasechka-49{left:49%}.zasechka-50{left:50%}.zasechka-51{left:51%}
.zasechka-52{left:52%}.zasechka-53{left:53%}.zasechka-54{left:54%}.zasechka-55{left:55%}
.zasechka-56{left:56%}.zasechka-57{left:57%}.zasechka-58{left:58%}.zasechka-59{left:59%}
.zasechka-60{left:60%}.zasechka-61{left:61%}.zasechka-62{left:62%}.zasechka-63{left:63%}
.zasechka-64{left:64%}.zasechka-65{left:65%}.zasechka-66{left:66%}.zasechka-67{left:67%}
.zasechka-68{left:68%}.zasechka-69{left:69%}.zasechka-70{left:70%}.zasechka-71{left:71%}
.zasechka-72{left:72%}.zasechka-73{left:73%}.zasechka-74{left:74%}.zasechka-75{left:75%}
.zasechka-76{left:76%}.zasechka-77{left:77%}.zasechka-78{left:78%}.zasechka-79{left:79%}
.zasechka-80{left:80%}.zasechka-81{left:81%}.zasechka-82{left:82%}.zasechka-83{left:83%}
.zasechka-84{left:84%}.zasechka-85{left:85%}.zasechka-86{left:86%}.zasechka-87{left:87%}
.zasechka-88{left:88%}.zasechka-89{left:89%}.zasechka-90{left:90%}.zasechka-91{left:91%}
.zasechka-92{left:92%}.zasechka-93{left:93%}.zasechka-94{left:94%}.zasechka-95{left:95%}
.zasechka-96{left:96%}.zasechka-97{left:97%}.zasechka-98{left:98%}.zasechka-99{left:99%}
.zasechka-100{left:100%}

/* ── Шкала темпа: точка внимания страницы ────────────────────────────
   Одна широкая полоса вместо восьми мелких. Заполнение — сделано,
   засечка — где месяц должен быть по прошедшим сменам. Расстояние между
   ними и есть ответ, ради которого страницу открыли. */
.karta.tempo{padding:20px 22px 18px}
/* Прежняя шкала на `div` — `tempo-shkala`, `tempo-zhelob`,
   `tempo-zapolnenie`, `tempo-zasechka`, `tempo-prognoz`, `tempo-tochka` —
   ушла в SVG ещё до 12.09.2026, а её правила остались и выглядели
   живыми. Убраны 12.09.2026, задание «банк диаграмм», этап 2; что их
   больше нет, стережёт проба. */
.tempo-podpisi{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:6px 12px;
  margin-top:12px;
}
.tempo-podpisi b{
  font-size:27px;
  font-weight:600;
  letter-spacing:-.035em;
  font-variant-numeric:tabular-nums;
  line-height:1;
}
.tempo-otmetka{
  margin-left:auto;
  font-size:13px;
  font-variant-numeric:tabular-nums;
  color:var(--ink-2);
}
/* ── Шкала плана в SVG ─────────────────────────────────────────────
   Полоса стала рисунком не ради красоты: подсказка при наведении должна
   быть той же карточкой, что в трафике, а она живёт в SVG. Заодно засечка
   снова тонкая — попадать по ней теперь не нужно, попадают в прозрачную
   ловушку вокруг. */
/* Шкала плана — одна полоса, она сужается до любой ширины. Общий
   нижний предел графиков в 640 px ей не нужен и на телефоне тянул
   за собой всю страницу: полотно выходило 677 px при 375. */
/* Именно `svg.shkala-plana`, а не `.shkala-plana`: общий предел
   задан у `svg.grafik`, и голый класс ему проигрывает по весу. */
svg.shkala-plana{display:block;width:100%;height:auto;overflow:visible;
  min-width:0}
/* Карточке подсказки нужно выйти за верх шкалы: держать под неё сто с
   лишним пустых пикселей значит платить местом за то, чего в покое не
   видно. Только у этой разновидности карточки — общее правило скругляет
   углы обрезкой и его трогать нельзя. */
.karta.tempo{overflow:visible}
.shkala-zhelob{fill:var(--zhelob)}
.shkala-fakt{fill:var(--ink-2)}
.shkala-plana.gorit .shkala-fakt{fill:var(--red)}
.shkala-prognoz{fill:var(--ink-2);opacity:.22}
.shkala-zasechka{fill:var(--ink);opacity:.55}
.shkala-plana .krug{fill:var(--paper);stroke:var(--ink-2);stroke-width:2}
.shkala-plana.gorit .krug{stroke:var(--red)}
/* Правило гашения соседей писалось под график трафика; шкала плана —
   такой же SVG с точками, и ей нужно то же самое. */
@media (hover:hover){
  svg:has(.tochka:hover) .tochka:not(:hover) .krug.vidno{opacity:.12}
}

/* Подпись под шкалой — одной строкой. Перенос на второе слово делает из
   короткого пояснения абзац. */
.blok-poyasnenie{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Пояснение и ссылка стояли двумя абзацами впритык и читались как
   слипшийся текст. Ставим их в одну линию: пояснение слева, действие
   справа, — и даём воздух сверху. */
.blok-nizom{display:flex;flex-wrap:wrap;align-items:baseline;
  justify-content:space-between;gap:6px 18px;padding:12px 15px 14px;
  border-top:1px solid var(--line);margin-top:10px}
.blok-nizom .blok-poyasnenie,.blok-nizom .blok-podval{margin:0;padding:0}

.tempo-otmetka.gorit{color:var(--red);font-weight:600}
.karta.tempo .zametka{margin:14px 0 0}

/* ── Полосы в списках: засечка и отставание ──────────────────────── */

/* В половинной карточке имя магазина не помещается: замер 07.09.2026 дал
   152 px под сорок знаков и строку в четыре ряда. Отдаём имени больше, а
   жёлобу — меньше: длина полосы читается и на двухстах пикселях. */
.polosy.shirokie-imena .polosa-stroka{
  grid-template-columns:minmax(0,1.7fr) minmax(80px,1fr) 88px 58px;
  align-items:center;
  /* Одна высота у всех строк: иначе одна цифра длиннее — и список
     читается лесенкой. */
  min-height:30px;
}
.polosy.shirokie-imena .polosa-imya{font-size:14px;line-height:1.35}
.polosy.shirokie-imena .polosa-cifra{font-weight:600;color:var(--red)}
.polosa-zhelob{position:relative;overflow:visible}
.polosa-zapolnenie.gorit{background:var(--red)}
.polosa-zasechka{
  position:absolute;
  top:-3px;
  bottom:-3px;
  width:2px;
  margin-left:-1px;
  background:var(--ink);
  border-radius:2px;
  opacity:.55;
}

/* ── Вертикаль: территория → магазин → человек ───────────────────── */
.vertikal .tempo-stolb{width:132px}
.vertikal td.tempo-stolb{vertical-align:middle}

/* Отступ уровня. Ступень маленькая нарочно: три уровня в таблице шириной
   с экран не должны съедать треть колонки под воздух. */
.otstup-1 .vert-imya{padding-left:0}
.otstup-2 .vert-imya{padding-left:20px}
.otstup-3 .vert-imya{padding-left:40px}

.vert-territoriya{font-weight:600}
.vert-magazin td{color:var(--ink)}
.vert-chelovek td{color:var(--ink-2)}
.vert-chelovek .vert-imya{font-size:14px}
.vert-list{color:inherit}

/* Красным помечается строка, а не вся её ячейка: цвет должен читаться как
   состояние, а не как заливка. */
.vertikal tr.gorit .vert-procent,
.vertikal tr.gorit .vert-otstavanie{color:var(--red);font-weight:600}

.ryad-zhelob{
  position:relative;
  display:block;
  height:7px;
  border-radius:99px;
}
.ryad-zapolnenie{
  display:block;
  height:100%;
  background:var(--ink-3);
  border-radius:99px;
  /* Ставим над призраком: у absolute-элемента слой выше, чем у обычного,
     и без этого прошлый месяц закрыл бы нынешний. */
  position:relative;
  z-index:1;
}

/* Тот же период прошлого месяца. Полупрозрачная и позади: она отвечает на
   вопрос «лучше или хуже, чем тогда», а не спорит с нынешней полосой за
   внимание. Когда сравнивать не с чем, её нет вовсе — ноль здесь читался
   бы как «тогда не зарабатывали», а правда «тогда не работали». */
.ryad-prizrak{
  position:absolute;
  left:0;
  top:0;
  height:100%;
  background:var(--ink-2);
  opacity:.26;
  border-radius:99px;
}
/* Прошлый период лежит ТЕНЬЮ ПОД основной полосой, а не позади неё.
   Позади он спорил с нею за одно и то же место: две полосы одной высоты,
   и какая из них нынешняя — понятно только по цвету. Тень читается сразу:
   основная сверху, прошлое подложкой. Решение владельца 09.09.2026. */
.polosa-prizrak{
  position:absolute;
  left:0;
  top:9px;
  height:4px;
  background:var(--ink-2);
  opacity:.3;
  border-radius:99px;
}
.polosa-zapolnenie{position:relative;z-index:1}
.ryad-zapolnenie.gorit{background:var(--red)}
.ryad-zasechka{
  position:absolute;
  top:-2px;
  bottom:-2px;
  width:2px;
  margin-left:-1px;
  background:var(--ink);
  border-radius:2px;
  opacity:.5;
}

/* Доля в прибыли против доли в выручке — ради этого сравнения страница и
   открывается, и читается оно только шириной. Колонка по содержимому дала
   88 px: заполнение 59 % и засечка 61 % разошлись на два пикселя — закодировано
   верно, прочесть нельзя. Замер 08.09.2026, ширина своя, не общая с
   дашбордом планов: там полоса живёт в другой таблице и в других размерах. */
/* «Заправка автокондицио / нера» — так рвётся слово, когда колонке тесно:
   общий минимум в 14ch на экране 375 px это 110 пикселей, а `overflow-wrap:
   anywhere` рвёт где придётся. Здесь имена — русские слова, им нужен пробел.
   Таблица и так прокручивается вбок, лишние сто пикселей ничего не ломают. */
/* Имя товара красным здесь не помечается, хотя общее правило реестра
   (`.reestr tr.gorit td.w`) велит. Причина в пороге: «тянет вниз» — это
   рентабельность ниже средней, а ниже средней по построению примерно
   половина строк. Половина таблицы красным — шум, а не сигнал; полоса и
   так красная, и она говорит то же самое, но с величиной. */
/* Пояснение к меткам — своей строкой над ссылкой: в одной строке ссылка
   ломается пополам, и «Разобрать по» повисает отдельно от «магазинам». */
.blok-poyasnenie{margin:12px 0 0;font-size:12px}
.blok-poyasnenie+.blok-podval{margin-top:4px}

.pribyl-tablica tr.gorit td.w{color:inherit}

.pribyl-tablica td.w,.pribyl-tablica th.w{min-width:26ch}

/* Органы настройки блока в конструкторе: в столбик, подпись над полем.
   В строку они разгоняют строку таблицы вдвое. */
.blok-organy{white-space:normal}
.organ-blok{display:inline-flex;flex-direction:column;gap:3px;margin:0 10px 0 0}
.organ-blok span{font:500 10.5px/1.3 var(--cifry);letter-spacing:.09em;
  text-transform:uppercase}

.dolya-stolb{width:220px}
td.dolya-stolb{vertical-align:middle}

/* Уголок раскрытия: место под него держится всегда, иначе строки без
   детей и с детьми встают по разным левым краям. */
.vertikal .raskryt{display:inline-flex;align-items:baseline;gap:6px;
  text-decoration:none;color:inherit}
.vertikal .raskryt:hover{color:var(--red)}
.vertikal .ugolok{font-size:10px;color:var(--ink-3);width:9px;
  display:inline-block;transition:transform .18s var(--plavno)}
.vertikal .raskryt.otkryta .ugolok{color:var(--ink-2)}
.vertikal .raskryt.zhdyom{opacity:.55}
.vertikal .vert-list{padding-left:15px}

/* ── Пусто ────────────────────────────────────────────────────────── */
.karta.pustovato{padding:22px 24px}
.karta.pustovato h3{border:none;padding:0 0 6px;margin:0}
.karta.pustovato p{margin:0;color:var(--ink-2)}

@media (max-width:760px){
  .vertikal .tempo-stolb{width:78px}
  .dolya-stolb{width:104px}
  .tempo-podpisi b{font-size:23px}
  .tempo-otmetka{margin-left:0;width:100%}

  /* Имя магазина уходит на свою строку. В четыре колонки на 375 px оно
     разгоняет строку на четыре ряда (замер: 125 px против 35 на широком),
     и список перестаёт читаться списком. Полоса, рубли и процент остаются
     в ряд — они короткие. */
  .polosy.shirokie-imena .polosa-stroka{
    grid-template-columns:minmax(0,1fr) 74px 54px;
    row-gap:4px;
  }
  .polosy.shirokie-imena .polosa-imya{grid-column:1 / -1}
}

@media (prefers-reduced-motion:reduce){
  .vertikal .ugolok{transition:none}
}

/* Подвал карточки: свежесть слева, основное действие справа. На
   узком экране распадается на две строки — бюджет карточки это
   допускает, а обрезать действие нельзя. */
.blok-podval{margin:14px 0 0;display:flex;flex-wrap:wrap;
  justify-content:space-between;align-items:center;gap:6px 12px;
  min-height:var(--organ-kroha)}
.blok-podval a{text-decoration-color:var(--line-2)}

/* Конструктор: узкое поле порядка не должно тянуться во всю ячейку. */
.konstruktor .uzkoe-pole{width:62px;text-align:right}
.konstruktor-nizom{display:flex;align-items:center;gap:16px;padding:14px 0 0}
/* В карточке «Сохранить» стоит в поле карточки, а не на её рамке: владелец
   13.09.2026 — «поправить в районе кнопки сохранить». */
.karta>.konstruktor-nizom{padding:14px 15px 16px;border-top:1px solid var(--line)}

/* ── Права: список магазинов ──────────────────────────────────────────
   Дерево читается отступом, а не рамками: три уровня в рамках на узком
   экране съедают половину ширины под воздух. */
.pravo-uzel{display:flex;align-items:center;gap:8px;padding:5px 0;
  font-size:13.5px;cursor:pointer}
.pravo-uzel input{margin:0}
.pravo-set{font-weight:600;padding-top:10px}
.pravo-territoriya{margin:2px 0 10px 18px;
  border-left:1px solid var(--line);padding-left:14px}
.pravo-territoriya>.pravo-uzel:first-child{font-weight:600}
.pravo-magazin{color:var(--ink-2)}
.podzagolovok{font:500 10.5px/1.3 var(--cifry);letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3);margin:18px 0 6px}
.beda-tekst{color:var(--red)}

/* Минус в колонке. У портала есть `tr.gorit` для строки, но в бартере
   отрицательная прибыль — обычное дело, и её надо видеть в самой цифре. */
.krasnoe{color:var(--red)}
.reestr tr.gorit td.w{color:var(--red)}

/* ── Наценка: полоса отбора, ступени сортировки, листалка ──────────
 *
 * Заведено 10.09.2026. Позиций сто одиннадцать тысяч, и таблица без
 * отбора, страниц и липкой шапки — это не отчёт, а выгрузка.
 */

/* Липкая шапка без окна в окне.
 *
 * Сперва таблица стояла в ящике `max-height:70vh; overflow:auto`, и это
 * оказалось окном внутри страницы: две полосы прокрутки, одна в другой.
 * Владелец 10.09.2026: «не нужно делать это окно, все сто строк должны
 * быть на одной странице».
 *
 * Поэтому прокручивается страница, а шапка липнет к её верху. Условие
 * одно: **между шапкой и окном браузера не должно быть предка с
 * прокруткой** — любой `overflow`, кроме `visible`, забирает липкость
 * себе. Отсюда `overflow:visible` у обёртки на широком экране; на узком
 * она снова возит таблицу вбок, и липкость там уступает место
 * возможности вообще увидеть правые столбцы.
 *
 * Фон у ячеек шапки обязателен — иначе строки просвечивают сквозь. */
/* Карточка с липкой шапкой не имеет права обрезать содержимое:
   `overflow` любого вида, кроме `visible`, забирает липкость себе —
   шапка липнет к неподвижной карточке, то есть не липнет вовсе. Ради
   чего `overflow:hidden` у карточки и стоял — скругление верхних углов
   под полосой заголовка — задаём самой полосе. */
.karta.bez-obreza{overflow:visible}
.karta.bez-obreza>h3{border-radius:calc(var(--r-card) - 1px)
  calc(var(--r-card) - 1px) 0 0}

.skroll-shirokij{overflow-x:auto}
/* Порог измерен, а не выбран. Таблице нужно 1278 px, полотну по бокам
   ещё 72: ровно на 1350 px она впервые помещается целиком. Берём 1360
   с запасом. Ниже порога обёртка возит таблицу вбок — иначе поехала бы
   вся страница, а этого правило не разрешает; при 1330 px правый
   столбец обрезался молча, и страница о том не сообщала. */
@media (min-width:1360px){ .skroll-shirokij{overflow:visible} }
table.lipkaya thead th{position:sticky;top:0;z-index:2;
  background:var(--pale);
  box-shadow:inset 0 -1px 0 var(--line)}
/* Черта под липкой шапкой — одна: тенью, которая едет вместе с шапкой.
   Общая нижняя граница ячейки добавляла вторую — владелец 13.09.2026:
   «какая-то двойная линия — убери». */
table.lipkaya thead th{border-bottom:0}

/* Без заливки: на тёмной теме `--field` темнее полотна карточки, и
   полоса отбора читалась чёрной плитой поперёк страницы. Рамки
   достаточно, чтобы отделить органы от содержимого. */
.otbor-polosa{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end;
  margin:0 0 12px;padding:12px 14px;border:1px solid var(--line);
  border-radius:var(--r-card);background:none}
.otbor-pole{display:flex;flex-direction:column;gap:3px;min-width:11rem}
.otbor-pole > span{font:500 10.5px/1.4 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase}
/* Высота у всех органов одна и берётся из общей переменной. Своей
   высоты тут быть не должно: `input[type=text]` и `select` ловит общее
   правило со строки 289, а `search` и `number` — нет, и без этого ряд
   выходит из трёх разных высот (34, 38 и 23 у списка магазинов). */
.otbor-pole input,.otbor-pole select{font:inherit;font-size:13.5px;
  box-sizing:border-box;height:var(--organ);min-height:var(--organ);
  padding:0 11px;color:var(--ink);min-width:0}
.otbor-polosa .vybor>summary{height:var(--organ)}
.otbor-polosa .knopka{height:var(--organ);min-height:var(--organ)}
/* Ряд органов выравнивается по нижнему краю полей, а не по низу подписей:
   у списка магазинов подписи сверху нет, и по `flex-end` он всплывал. */
.otbor-polosa > .vybor,.otbor-polosa > .knopka,.otbor-polosa > .otbor-sbros{
  margin-top:auto}
.otbor-pole input:focus-visible,.otbor-pole select:focus-visible{
  outline:2px solid var(--red-700);outline-offset:1px}
/* Поиск растягивается последним: основа маленькая, чтобы весь ряд
   уместился в строку, а остаток ширины он забирает себе. */
.otbor-poisk{min-width:10rem;flex:1 1 10rem}
/* Ширина задаётся полю, а не обёртке: у `input` своя, от `size`, и
   `min-width` на обёртке её не режет — числовые поля выходили по 180 px
   под подпись в четыре знака. */
.otbor-uzkoe{min-width:0;flex:0 0 auto}
.otbor-uzkoe input,.otbor-uzkoe select{width:7rem}
.otbor-pole input[list]{width:12rem}
.otbor-polosa .knopka{align-self:flex-end}
.otbor-sbros{align-self:flex-end;padding-bottom:8px;white-space:nowrap}
/* Галочка в ряду отбора — такой же орган, как выпадашка: та же высота,
   та же рамка, слово рядом. `vybor-esli` для этого не годится — он
   рассчитан на число внутри и растягивает поле до сорока четырёх
   пикселей, отчего галочка выглядела пустым ящиком под подписью. */
.otbor-galka{display:inline-flex;flex-direction:row;align-items:center;
  align-self:flex-end;gap:8px;height:var(--organ);padding:0 12px;
  cursor:pointer;font:400 13px/1 var(--shrift);
  color:var(--ink-2);white-space:nowrap}
.otbor-galka input{width:15px;height:15px;margin:0;accent-color:var(--red)}
.otbor-galka:hover{border-color:var(--ink-3)}

/* ── «Наценка»: отбор без рамки и применённое фишками, 13.09.2026 ──── */
.otbor-polosa.bez-ramki{margin:0;padding:16px 15px 8px;border:0;border-radius:0}
.otbor-pole.otbor-vybor{min-width:12rem}
.otbor-pole.otbor-vybor>.vybor>summary{height:var(--organ);min-width:12rem}
.primeneno{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;
  padding:2px 15px 12px;font-size:12.5px}
.fishka{display:inline-flex;align-items:center;gap:6px;min-height:26px;
  padding:0 4px 0 10px;border-radius:999px;background:var(--pale);color:var(--ink)}
.fishka a{color:inherit;text-decoration:none}
.fishka b{font:600 10px/1 var(--cifry);color:var(--ink-3)}
.fishka .strelka{margin-left:3px;color:var(--red)}
.fishka-podpis{color:var(--ink-3)}
/* В песочнице фишки встают на место строки «Показывается» — с её чертой снизу. */
.primeneno.pesochnica-primeneno{padding:10px 15px}
/* Перенос столбцов отчёта (14.09.2026): несомый столбец над соседями, с тенью по бокам;
   текст не выделяется, ссылка сортировки не утаскивается браузером. */
table[data-stolbcy] thead th[data-kod]{cursor:grab}
/* ── Группировка уровнями (14.09.2026) ─────────────────────────────
   Свои имена классов: `gruppa` и `zagolovok-gruppy` заняты таблицей «Конверсии». */
table.reestr thead th.stolbec-urovnej{cursor:context-menu;vertical-align:bottom}
.uroven-shapki{display:block;-webkit-user-select:none;user-select:none}
.uroven-shapki+.uroven-shapki{margin-top:4px}
.uroven-shapki.uroven-2{padding-left:18px}
.uroven-shapki.uroven-3{padding-left:36px}
.uroven-shapki.uroven-4{padding-left:54px}
td.imya-urovnya.uroven-2{padding-left:30px}
td.imya-urovnya.uroven-3{padding-left:48px}
td.imya-urovnya.uroven-4{padding-left:66px}
/* Строка данных в дереве — без кнопки, на ступень глубже, обычным начертанием; у строки нет
   кнопки сворачивания, поэтому отступ добирается шириной кнопки. */
td.imya-urovnya.list{font-weight:400;padding-left:calc(var(--otstup-lista,0px) + 26px)}
td.imya-urovnya.list.uroven-1{--otstup-lista:12px}
td.imya-urovnya.list.uroven-2{--otstup-lista:30px}
td.imya-urovnya.list.uroven-3{--otstup-lista:48px}
td.imya-urovnya.list.uroven-4{--otstup-lista:66px}
td.imya-urovnya.list.w{white-space:normal}
tr.stroka-urovnya>td{background:var(--pale);font-weight:500}
tr.stroka-urovnya.uroven-2>td{background:color-mix(in srgb,var(--pale) 55%,var(--paper))}
tr.stroka-urovnya.uroven-3>td{background:var(--paper)}
/* Строка группы тоже подсвечивается при наведении: у её клеток свой фон, и подсветка строки под ним не видна
   (владелец 15.09.2026: «при наведении на тёмную полосу тоже её подсвечивай»). */
tbody tr.stroka-urovnya:hover>td{background:color-mix(in srgb,var(--line) 70%,var(--pale))}
tbody.blok-urovnya+tbody.blok-urovnya tr.stroka-urovnya.uroven-1>td{border-top:1px solid var(--line-2)}
td.imya-urovnya{white-space:nowrap}
/* Число строк группы — в скобках, мельче и чуть поодаль от имени (владелец 14.09.2026). */
.schet-urovnya{margin-left:10px;font-size:12px}
.knopka-urovnya{display:none;vertical-align:middle;width:22px;height:22px;margin:-3px 4px -3px -4px;padding:0;
  border:0;border-radius:6px;background:none;color:var(--ink-3);cursor:pointer}
.knopka-urovnya svg{width:14px;height:14px;display:block;margin:auto;transition:transform .16s ease}
.knopka-urovnya[aria-expanded="true"] svg{transform:rotate(90deg)}
.knopka-urovnya:hover{background:var(--line);color:var(--ink)}
.knopka-urovnya:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.stolbcy-js .knopka-urovnya{display:inline-block}
tr.skryta-urovnem{display:none}
/* Значки таблицы справа в ряду фишек: «раскрыть/свернуть» и «+» своего столбца (15.09.2026). */
.knopki-tablicy{display:inline-flex;align-items:center;gap:2px;margin-left:auto}
.urovni-knopki{display:none;gap:2px}
.stolbcy-js .urovni-knopki{display:inline-flex}
.knopka-svoj-stolbec{display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-kroha);height:var(--organ-kroha);border:0;background:none;color:var(--ink-3);text-decoration:none}
.knopka-svoj-stolbec:hover{color:var(--ink);text-decoration:none}
.knopka-svoj-stolbec:focus-visible{outline:2px solid var(--fokus);outline-offset:1px;border-radius:6px}
.knopka-svoj-stolbec svg{width:16px;height:16px}

/* Свой столбец — «немного светлее» остальных (владелец 15.09.2026): цифры и имя вторым цветом. */
.reestr th.svoj a.sort,.reestr td.svoj{color:var(--ink-2)}
.reestr td.svoj.oshibka{color:var(--ink-3);font-family:var(--cifry);font-size:12px}
.reestr td.svoj{cursor:cell}
/* Клетка, которую правят, — серой скруглённой рамкой, а не синей (владелец 15.09.2026). */
.reestr td.pravitsya{outline:2px solid var(--line-2);outline-offset:-3px;border-radius:8px}
.reestr th.svoj{position:relative}
.svoj-shapka{display:inline-flex;align-items:center;gap:2px;vertical-align:middle}
.svoj-udalit{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  width:20px;height:20px;padding:0;border:0;border-radius:50%;background:none;
  color:var(--ink-3);cursor:pointer;opacity:0}
.svoj-udalit svg{width:10px;height:10px;display:block}
.svoj-udalit[hidden]{display:none}
.reestr th.svoj:hover .svoj-udalit,.svoj-udalit:focus-visible{opacity:.7}
.svoj-udalit:hover{opacity:1;background:var(--line);color:var(--ink)}
.svoj-udalit:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
@media (hover:none){.svoj-udalit{opacity:.55}}
.reestr th input.pole-imeni{min-height:var(--organ-kroha);height:var(--organ-kroha);width:14ch;padding:3px 8px;
  font-size:13px;letter-spacing:normal;text-transform:none;border:1px solid var(--line-2);border-radius:6px;background:var(--paper);
  -webkit-user-select:text;user-select:text}

/* Поле формулы, имени и помощника — под клеткой, как меню уровней: подложка, тень, скругление. */
.pole-svoe{position:absolute;z-index:70;display:flex;flex-direction:column;gap:6px;
  width:min(26rem,calc(100vw - 32px));padding:8px;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-btn);box-shadow:0 14px 32px rgba(17,19,24,.18)}
.pole-svoe.pole-svoe-malo{width:auto;max-width:min(22rem,calc(100vw - 32px))}
.pole-svoe[hidden]{display:none}
/* Край, скругление и подложка — из общей группы хрома полей: вторая копия разошлась бы с ней. */
.pole-svoe input.pole-svoe-vvod{width:100%;min-height:var(--organ);font-family:var(--cifry);font-size:13px}
.pole-svoe.rezhim-pomoshchnika input.pole-svoe-vvod{font-family:inherit;font-size:14px}
/* Режим сверху: формула руками или просьба помощнику (владелец 15.09.2026). */
.pole-svoe-rezhim,.pole-svoe-kuda{display:flex;gap:4px}
.pole-svoe-kuda-knopka{min-height:var(--organ-kroha);padding:0 10px;border:0;border-radius:var(--r-badge);
  background:none;color:var(--ink-2);font:inherit;font-size:12.5px;cursor:pointer}
.pole-svoe-kuda-knopka[aria-pressed="true"]{background:var(--line);color:var(--ink);font-weight:600}
.pole-svoe-kuda-knopka:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.pole-svoe-oshibka{margin:0;padding:0 2px;color:var(--red);font-size:12.5px}
.pole-svoe-dumayu{margin:0;padding:0 2px;color:var(--ink-3);font-size:12px}
.pole-svoe-oshibka[hidden],.pole-svoe-dumayu[hidden]{display:none}
.pole-svoe-forma{display:flex;align-items:center;gap:6px}
.pole-svoe-knopka{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ);height:var(--organ);padding:0;border:0;border-radius:50%;
  background:var(--ink);color:var(--paper);cursor:pointer}
.pole-svoe-knopka:disabled{opacity:.4;cursor:default}
.pole-svoe-knopka svg{width:16px;height:16px}
.pole-svoe-knopka:focus-visible{outline:2px solid var(--fokus);outline-offset:2px}
.knopka-urovni-vse{display:inline-flex;align-items:center;justify-content:center;width:var(--organ-kroha);height:var(--organ-kroha);padding:0;
  border:0;background:none;color:var(--ink-3);cursor:pointer}
.knopka-urovni-vse:hover{color:var(--ink)}
.knopka-urovni-vse:focus-visible{outline:2px solid var(--fokus);outline-offset:1px;border-radius:6px}
.knopka-urovni-vse svg{width:16px;height:16px}
/* Меню уровней — вёрстка по снимку владельца 14.09.2026: пункты с зазором, подсвечен один
   (наведение или клавиатура, а не программный фокус), вложенность — отступом всего пункта. */
table.reestr thead th[data-urovni-menyu]{-webkit-user-select:none;user-select:none}
.menyu-urovnej{position:fixed;z-index:70;display:flex;flex-direction:column;gap:2px;
  min-width:15rem;max-width:min(22rem,92vw);padding:6px;outline:none;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-card);
  box-shadow:0 14px 32px rgba(17,19,24,.18)}
.menyu-urovnej[hidden]{display:none}
.menyu-urovnej-zagolovok{padding:6px 10px 4px;font:600 10px/1.4 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3)}
.menyu-urovnej-punkt{display:flex;align-items:flex-start;gap:8px;width:100%;padding:8px 12px;border:0;
  border-radius:var(--r-btn);background:none;cursor:pointer;text-align:left;font:inherit;font-size:13.5px;color:var(--ink)}
.menyu-urovnej-punkt:hover,.menyu-urovnej-punkt:focus-visible{background:var(--pale);outline:none}
.menyu-urovnej-punkt[aria-checked="true"]{font-weight:600}
.menyu-urovnej-punkt svg{flex:0 0 auto;width:14px;height:14px;margin-top:3px;color:var(--ink-3)}
.menyu-urovnej-punkt span{min-width:0}
.menyu-urovnej-punkt small{display:block;font-size:12px;color:var(--ink-3);font-weight:400}
.menyu-urovnej-net{padding:7px 10px;font-size:13px;color:var(--ink-3)}
.menyu-urovnej-spisok{display:flex;flex-direction:column;gap:2px}
/* Уровень — имя столбца лесенкой; нажатие раскрывает/сворачивает его группы, строка
   перетаскивается, крестик справа при наведении снимает уровень и все глубже. */
.menyu-uroven{position:relative;display:flex;align-items:center;gap:8px;padding:8px 10px 8px 12px;
  border-radius:var(--r-btn);background:var(--paper);cursor:grab;touch-action:none;
  -webkit-user-select:none;user-select:none;font-size:13.5px;color:var(--ink)}
.menyu-uroven:hover,.menyu-uroven:focus-visible{background:var(--pale);outline:none}
.menyu-uroven.uroven-2{padding-left:30px}
.menyu-uroven.uroven-3{padding-left:48px}
.menyu-uroven.etot .menyu-uroven-imya{font-weight:600}
.menyu-uroven-strelka{flex:0 0 auto;width:14px;height:14px;color:var(--ink-3)}
.menyu-uroven-imya{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menyu-uroven-polozhenie{flex:0 0 auto;width:12px;height:12px;color:var(--ink-3);transition:transform .16s ease}
.menyu-uroven[aria-expanded="true"] .menyu-uroven-polozhenie{transform:rotate(90deg)}
.menyu-uroven-snyat{margin-left:auto;flex:0 0 auto;width:22px;height:22px;padding:0;border:0;border-radius:50%;
  background:none;color:var(--ink-3);font-size:16px;line-height:1;cursor:pointer;opacity:0}
.menyu-uroven:hover .menyu-uroven-snyat,.menyu-uroven:focus-within .menyu-uroven-snyat,
.menyu-uroven-snyat:focus-visible{opacity:1}
.menyu-uroven-snyat:hover{background:var(--line);color:var(--ink)}
@media (hover:none){.menyu-uroven-snyat{opacity:1}}
/* Строка нового уровня — без рамки, приглушённая (владелец 14.09.2026: «убери этот пунктир»). */
.menyu-uroven.novyj{color:var(--ink-3)}
.menyu-uroven.novyj .menyu-uroven-strelka{opacity:.6}
.menyu-uroven.novyj small{margin-left:auto;font-size:12px;color:var(--ink-3)}
.menyu-uroven.letit{z-index:2;cursor:grabbing;box-shadow:0 8px 20px -8px rgba(17,19,24,.35)}
.menyu-urovnej hr{border:0;border-top:1px solid var(--line);margin:4px 6px;width:auto;align-self:stretch}
table[data-stolbcy] thead a.sort{-webkit-user-drag:none}
.stolbcy-tyanem,.stolbcy-tyanem *{cursor:grabbing!important;-webkit-user-select:none;user-select:none}
/* Шапка столбцов липнет к верху экрана при обычной прокрутке страницы (владелец 14.09.2026:
   «прилепить только шапку самой таблицы», без рамки по высоте — фильтры и подвал вместе с
   ней не липнут). Обёртка с прокруткой вбок липкость отпускает, поэтому таблице, которая
   помещается по ширине, скрипт снимает прокрутку (`vlezaet`); широкой остаётся вбок. */
.skroll-pesochnicy{overflow-x:auto;overscroll-behavior-x:contain}
.skroll-pesochnicy.vlezaet{overflow:visible}
/* Липкая шапка поверх строк и несомого столбца; у несомой ячейки шапки место липкое,
   а не относительное — иначе шапка отлипала на время переноса. */
.skroll-pesochnicy table.lipkaya thead th{z-index:4}
/* Модуль таблицы в отчётах (15.09.2026): таблица помещается по ширине — обёртка не прокручивается
   вбок, и шапка держится за страницу; не помещается — едет вбок, шапка остаётся в обёртке. */
.modul-vlezaet{overflow:visible}
table.modul-tablicy thead th[tabindex]:focus-visible{outline:2px solid var(--fokus);outline-offset:-2px}
table[data-stolbcy] td.nesom{position:relative}
table[data-stolbcy] .nesom{z-index:3;background:var(--paper);
  box-shadow:-10px 0 18px -14px rgba(17,19,24,.45),10px 0 18px -14px rgba(17,19,24,.45)}
table[data-stolbcy] thead th.nesom{background:var(--pale)}
@media (prefers-reduced-motion:reduce){table[data-stolbcy] th,table[data-stolbcy] td{transition:none!important}}
.fishka-snyat{display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;border-radius:50%;color:var(--ink-3);opacity:.55;
  font-size:15px;line-height:1;text-decoration:none}
.fishka-sbros{margin-left:4px;color:var(--ink-3);text-decoration:none}
@media (hover:hover){
  .fishka-snyat:hover{opacity:1;background:var(--line);color:var(--ink)}
  .fishka a:hover,.fishka-sbros:hover{text-decoration:none;color:var(--ink)}
}
/* Подсказка «как читать» в шапке раздела. */
.karta>h3 .shapka-podskazka{margin:0 0 0 10px}
.podskazka-razdela{max-width:min(40rem,92vw)}
/* Диаграмма рисуется: окно уже закрыто, а место говорит, что ждать. */
.diagramma-otcheta.zhdyot::after{content:"Рисуется диаграмма…";display:block;
  margin:10px 0 0;padding:16px;border-radius:var(--r-card);color:var(--ink-3);
  font-size:13px;background:linear-gradient(100deg,transparent 20%,var(--vydelenie) 48%,transparent 76%);
  background-size:220% 100%;animation:volna-ozhidaniya 1.1s linear infinite}
@media (prefers-reduced-motion:reduce){.diagramma-otcheta.zhdyot::after{animation:none}}

.stupeni{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:baseline;
  margin:0 0 10px;font-size:12px}
.stupen{display:inline-flex;align-items:baseline;gap:5px;
  padding:2px 8px;border:1px solid var(--line);border-radius:999px;
  background:var(--pale)}
.stupen b{font:600 10px/1 var(--cifry);color:var(--ink-3)}
.stupen-snyat{color:var(--ink-3);font-size:13px;line-height:1}
.stupen-snyat:hover{color:var(--red-700);text-decoration:none}

.sort .mesto{display:inline-block;margin-left:3px;
  font:600 9px/1 var(--cifry);color:var(--ink-3);vertical-align:super}
.sort.glavnaya{color:var(--red-700)}

/* ── Подвал таблицы — одно устройство на все таблицы ────────────────
   Владелец 13.09.2026: «формы номеров страниц и кнопок „показать ещё“,
   как на smoothui… в форме iOS». Приём SmoothUI: номера — кнопки без
   рамки, отмеченная — подложкой, которая переезжает к нажатой пружиной
   (otchet.js). iOS: номера и размеры — сегментами на общей плашке, как
   переключатель темы; «Показать ещё» — серой капсулой. Слева показ,
   справа страницы, сверху граница: без неё кнопки читались ещё одной
   строкой таблицы. Разметка — templates/_podval_tablicy.html. */
.podval-tablicy{display:flex;flex-wrap:wrap;gap:10px 18px;
  align-items:center;justify-content:space-between;
  padding:11px 12px;border-top:1px solid var(--line)}
.podval-levo,.podval-pravo{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
.podval-pole{display:inline-flex;align-items:center;gap:6px;font-size:13px}
.podval-pole > span{font:500 10.5px/1.4 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase}
.podval-pole select{font:inherit;font-size:13.5px;box-sizing:border-box;
  height:var(--organ-mal);min-height:var(--organ-mal);padding:0 9px;color:var(--ink)}
.podval-tablicy .knopka{height:var(--organ);min-height:var(--organ)}
.podval-schet{font:500 12px/1.2 var(--cifry);color:var(--ink-3);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.podval-vsyo{font-size:13px}

/* «Показать ещё» — серая капсула iOS: заливка без рамки, число
   прибавки приглушено. Заливка `--line`, а не `--pale`: в ночной теме
   `--pale` и карточка — один цвет. */
.eshchyo{display:inline-flex;align-items:center;gap:6px;box-sizing:border-box;
  height:var(--organ-mal);padding:0 15px 0 11px;border-radius:999px;
  background:var(--line);color:var(--ink);font:500 13.5px/1 var(--shrift);
  text-decoration:none;white-space:nowrap;
  transition:background .15s ease,transform .15s var(--plavno)}
.eshchyo:hover{background:var(--line-2);text-decoration:none}
.eshchyo:active{transform:scale(.97)}
.eshchyo:focus-visible{outline:2px solid var(--fokus);outline-offset:2px}
.eshchyo svg{width:14px;height:14px;fill:none;stroke:currentColor;
  stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.eshchyo-skolko{font:600 12px/1 var(--cifry);color:var(--ink-2)}

/* Сегменты: плашка `--pale` с краем `--line`, выбранное — плиткой
   `--line` с тенью. Та же пара, что у бегунка темы: она видна в обеих
   темах (проба `test_podlozhka_vidna_v_obeih_temah`). */
.segment-gruppa{position:relative;display:inline-flex;align-items:center;gap:2px;
  padding:2px;border:1px solid var(--line);border-radius:var(--r-btn);
  background:var(--pale)}
.segment-gruppa a,.segment-gruppa .eta,.segment-gruppa .mnogotochie,
.segment-gruppa .listalka-strelka{
  position:relative;z-index:1;display:inline-flex;align-items:center;
  justify-content:center;box-sizing:border-box;min-width:var(--organ-mal);
  height:var(--organ-mal);padding:0 8px;border-radius:var(--r-badge);
  color:var(--ink-2);font:500 13px/1 var(--cifry);text-decoration:none;
  font-variant-numeric:tabular-nums;
  transition:color .15s ease,background .15s ease,transform .15s var(--plavno)}
.segment-gruppa a:hover{color:var(--ink);text-decoration:none;
  background:color-mix(in srgb,var(--line) 55%,transparent)}
.segment-gruppa a:active{transform:scale(.97)}
.segment-gruppa a:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.segment-gruppa .eta{z-index:0;color:var(--ink);font-weight:600;
  background:var(--line);box-shadow:0 1px 2px rgba(0,0,0,.18);transition:none}
.segment-gruppa .mnogotochie{min-width:18px;padding:0 2px;color:var(--ink-3)}
.segment-gruppa .listalka-strelka{padding:0 6px}
.segment-gruppa .listalka-strelka svg{width:16px;height:16px;fill:none;
  stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.segment-gruppa span.listalka-strelka{color:var(--ink-3);opacity:.4}
/* Переезд подложки к нажатой: число на ней гаснет, наведение соседей не
   перекрывает её по дороге. */
.segment-gruppa.edet .eta{color:transparent;transition:transform .25s var(--pruzhina)}
.segment-gruppa.edet a:hover{background:none}
/* Телефон: номера в строку не помещаются — остаются стрелки и текущая,
   счёт «51–75 из 1234» стоит слева. */
@media (max-width:560px){
  .listalka a:not(.listalka-strelka),.listalka .mnogotochie{display:none}
  .podval-tablicy{padding:10px}
}
@media (prefers-reduced-motion:reduce){
  .eshchyo,.segment-gruppa a,.segment-gruppa.edet .eta{transition:none}
}

/* Ширины столбцов позиций наценки. Без них «Категория» с `nowrap`
   забирает 298 px, имени товара остаётся 113, и строки вырастают до
   176 px — замер 10.09.2026. Длинному тексту разрешено переноситься,
   а не растягивать столбец. */
table.nacenka-pozicii td.w,table.nacenka-pozicii th.w{
  min-width:20ch;max-width:38ch}
table.nacenka-pozicii td.kat,table.nacenka-pozicii th.kat{
  white-space:normal;min-width:10ch;max-width:20ch;overflow-wrap:anywhere}
table.nacenka-pozicii td.brend,table.nacenka-pozicii th.brend{
  white-space:normal;max-width:14ch;overflow-wrap:anywhere}
table.nacenka-pozicii td.zona,table.nacenka-pozicii th.zona{
  white-space:normal;max-width:16ch;overflow-wrap:break-word}
/* Текст ячейки не заходит в поле соседней: «Ленинградская» в 12 знаков не
   помещалась и вставала вплотную к категории — владелец 13.09.2026. */
table.nacenka-pozicii td{overflow:hidden}
/* Тринадцать столбцов в 1349 px помещаются только при тесных полях:
   при 12 px по бокам таблица выходила 1485 px и обёртке приходилось
   возить её вбок — а вместе с прокруткой пропадала и липкая шапка. */
table.nacenka-pozicii th,table.nacenka-pozicii td{padding:6px 8px}

/* Пояснение к отчёту — отдельным блоком под карточкой, **во всю ширину
   полотна**. Решение 10.09.2026 «не во весь экран» (было 78 знаков)
   отменено владельцем 13.09.2026: «неоднократно уже говорил, что не нужно
   делать такие формы на две трети экрана, нужно их растягивать на весь
   экран». Блок во всю ширину, а абзацы встают колонками не уже 34 знаков:
   строка при этом остаётся читаемой — ради неё ширину и ужимали. Общее
   правило `p{max-width:70ch}` внутри пояснений и подвалов снято. */
.zametka.poyasnenie{max-width:none;display:grid;gap:8px 32px;
  grid-template-columns:repeat(auto-fit,minmax(min(34ch,100%),1fr))}
.zametka.poyasnenie p{margin:0;max-width:none}
.zametka p,p.zametka,.blok-podval p,p.blok-podval,.grafik-podval{max-width:none}
/* Абзац под таблицей отчёта — не подвал виджета. Правило `.blok-podval`
   раскладывает свежесть и действие флексом, и абзац с `<b>` внутри
   распадался на три куска в ряд, а текст упирался в рамку карточки:
   полей у него не было. Найдено 13.09.2026 на «Дефиците» с телефона. */
p.blok-podval{display:block;margin:0;padding:11px 15px 14px}

/* ── Права: карточка одного человека ──────────────────────────────
 *
 * Заведено 10.09.2026. Было одно окно на всех: выпадашка людей, дерево
 * магазинов на четыре экрана и ряд галочек — кого правишь, видно только
 * по выпадашке. Стало два экрана: таблица людей и карточка одного.
 */
.polnye-prava{padding:12px 15px}
.polnye-prava p{margin:8px 0 0 26px}

.derevo-prav{padding:10px 15px 14px;max-height:none}
.derevo-prav .vybor-gruppa{margin:8px 0 0}

.ryad-galok{display:flex;flex-wrap:wrap;gap:6px 18px;padding:12px 15px}
.ryad-galok .vybor-punkt{padding:2px 0}

.razdely-potokov{padding:8px 15px 14px}
.razdel-potokov{border:1px solid var(--line);border-radius:var(--r-btn);
  margin:0 0 8px;background:var(--paper)}
.razdel-potokov>summary{display:flex;align-items:center;gap:10px;
  padding:9px 12px;cursor:pointer;list-style:none;font-size:14px}
.razdel-potokov>summary::-webkit-details-marker{display:none}
.razdel-potokov>summary:hover{background:var(--pale)}
.razdel-potokov>summary .ugolok{color:var(--ink-3);font-size:11px;
  transition:transform .16s var(--plavno)}
.razdel-potokov[open]>summary .ugolok{transform:rotate(90deg)}
.razdel-potokov>summary .skolko{margin-left:auto;color:var(--ink-3);
  font:500 11px/1 var(--cifry)}
.razdel-nutro{padding:4px 12px 10px 30px;border-top:1px solid var(--line)}
.razdel-nutro .vybor-punkt{padding:3px 0}
.razdel-nutro .mono{margin-left:auto;font-size:11px}

.podval-prav{display:flex;flex-wrap:wrap;gap:14px;align-items:center;
  margin:18px 0}

/* Кнопка в ячейке таблицы: та же высота, что у строки, без растяжки. */
.knopka.mal{height:var(--organ-kroha);min-height:var(--organ-kroha);
  padding:0 12px;font-size:12.5px}

/* Блок продаж: кнопки кривых той же породы, что у трафика. Выручка
   стоит красной и неподвижной — кривая на графике одна и выключать её
   нечем; «Прошлый год» переключается и рисует пунктир. */
.krivaya-prodazhi.vklyuchena::before{background:var(--red)}
.krivaya-prodazhi[aria-disabled="true"]{cursor:default}
.krivaya-proshloe::before{background:none;
  border-top:2px dotted var(--ink-3);height:0}
.krivaya-proshloe.vklyuchena::before{border-top-color:var(--ink-2)}

/* Полные права гасят всё, что ниже: показом, а не `disabled`.
   Отключённые поля браузер не отправляет вовсе, и первое же
   сохранение стёрло бы человеку магазины и потоки. */
.pod-polnymi.pogasheno{opacity:.42;pointer-events:none;
  filter:grayscale(1);transition:opacity .18s var(--plavno)}

/* Галочка в заголовке раскрывающейся группы. Стоит перед именем,
   отделена от уголка, и нажатие по ней группу не раскрывает — это
   делает `otchet.js`. */
.galka-gruppy{display:inline-flex;align-items:center;margin:0 2px 0 0;
  padding:2px;cursor:pointer}
.galka-gruppy input{margin:0}
.razdel-potokov>summary>b{font-weight:600}

/* Администрирование: разделы хозяйства плитками. Заведено 10.09.2026,
   когда двенадцать пунктов ушли из выпадающего меню на свою страницу. */
/* Подсистемы хозяйства. Рамка вокруг всего списка была лишней:
   рубрика уже отделена заголовком, а вторая рамка вокруг рамок плиток
   читается как коробка в коробке. */
.podsistema{margin:0 0 22px}
.podsistema>h2{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;
  margin:0 0 9px;font:500 11px/1.4 var(--cifry);letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3)}
.podsistema>h2 .tiho{font:400 12.5px/1.4 var(--shrift);letter-spacing:0;
  text-transform:none}
/* `auto-fill`, а не `auto-fit`: пустые колонки остаются на месте, и
   рубрика из двух пунктов не растягивает их на пол-экрана каждую.
   Плитки соседних рубрик при этом стоят по одной сетке. */
.razdely-hozyajstva{display:grid;gap:10px;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
@media (max-width:560px){
  .razdely-hozyajstva{grid-template-columns:1fr}}
.razdel-plitka{display:flex;flex-direction:column;gap:4px;
  padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-card);
  background:var(--paper);color:inherit;text-decoration:none;
  transition:border-color .14s ease,background .14s ease}
.razdel-plitka:hover{border-color:var(--ink-3);background:var(--pale);
  text-decoration:none}
.razdel-plitka .imya{font-size:15px;font-weight:600}
.razdel-plitka .tiho{font-size:12.5px;line-height:1.35}

/* Галочка в заголовке группы лежит вне `.vybor-punkt` и потому брала
   цвет браузера — синий. Красим тем же красным, что и остальные. */
.galka-gruppy input{accent-color:var(--red);width:15px;height:15px;margin:0}

/* Между «вся сеть» и первой территорией шли две линии подряд: своя у
   строки сети и своя у рамки свёртки. Оставляем одну — рамку. */
.derevo-prav>.vybor-vse{border-bottom:none;margin-bottom:2px;
  padding-bottom:6px}

/* ── Шапка: поиск, колокол, звезда, часы, тема ────────────────────
 *
 * Заведено 10.09.2026. Четыре знака и три разных вопроса: колокол —
 * что случилось без меня, звезда — куда я хожу постоянно, часы — где я
 * был на прошлой неделе. Тема стоит рядом и переключается по кругу.
 */
/* Поле поиска в шапке — обычное поле портала, а не таблетка: круглая
   рамка была единственной такой на весь портал и читалась как чужая. */
.poisk-shapki input{width:13rem;height:var(--organ-mal);padding:0 11px;
  font:inherit;font-size:13.5px;color:var(--ink)}
.poisk-shapki input::placeholder{color:var(--ink-3);opacity:.7}
/* Поле поиска светится красным — цвет портала, а не синий фокус (владелец 13.09.2026). */
.poisk-shapki input:focus{outline:none;border-color:var(--red);
  box-shadow:0 0 0 3px var(--vydelenie)}

/* Ящик обнимает кнопку: иначе панель считает край не от неё, а от
   растянутого места в шапке, и висит боком. */
.znak-vypad{position:relative;display:inline-block}
.znak-knopka{display:inline-flex;align-items:center;gap:5px;
  height:var(--organ-mal);
  padding:0 9px;border:1px solid transparent;border-radius:var(--r-btn);
  background:none;color:var(--ink-2);cursor:pointer;list-style:none;
  font:inherit;font-size:13px}
.znak-knopka::-webkit-details-marker{display:none}
.znak-knopka:hover{color:var(--ink);border-color:var(--kraj);
  background:var(--line)}
.znak-knopka svg{width:16px;height:16px;flex:0 0 auto}
/* Колокол в рост звезды «Избранного»: рисунок у него на полпикселя выше и ниже,
   и рядом со звездой он читался сдвинутым. Центр у обоих один. */
.kolokol svg{width:14.5px;height:14.5px}
/* Счётчик у знака. Просьба владельца 12.09.2026 по образцу
   notification-badge. Цифры моноширинные и табличные: «1» и «7»
   одинаковой ширины, и значок не дёргается при смене числа.

   Появление отмечается один раз — коротким набуханием. Постоянной
   пульсации нет намеренно: она отвлекает от работы ровно так же, как
   мигающая лампочка, и через день её перестают замечать. */
.znak-knopka b{font:600 10.5px/1 var(--cifry);font-variant-numeric:tabular-nums;
  color:#fff;background:var(--red);
  border-radius:999px;padding:2px 5px;min-width:16px;text-align:center;
  animation:znak-poyavilsya .26s var(--plavno)}
@keyframes znak-poyavilsya{
  from{transform:scale(.4);opacity:0}
  60%{transform:scale(1.12)}
  to{transform:scale(1);opacity:1}
}
@media (prefers-reduced-motion:reduce){.znak-knopka b{animation:none}}
.znak-vypad[open]>.znak-knopka{color:var(--ink);border-color:var(--kraj)}
.kolokol.est{color:var(--red)}

.znak-polotno{position:absolute;z-index:30;top:calc(100% + 6px);right:0;
  min-width:min(300px,86vw);max-width:min(420px,86vw);max-height:min(60vh,420px);
  /* Докрутил панель до конца — дальше едет страница, и человек теряет
     место, на которое смотрел. `contain` останавливает прокрутку на
     краю панели. */
  overflow:auto;overscroll-behavior:contain;padding:6px;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r-card);
  box-shadow:0 14px 32px rgba(17,19,24,.16)}
.znak-shapka{display:flex;justify-content:space-between;align-items:baseline;
  gap:10px;padding:6px 9px 8px;border-bottom:1px solid var(--line);
  margin-bottom:4px;font:500 10.5px/1.4 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3)}
/* Строка панели: слева время или пояснение, справа имя. Столбик
   времени читается сверху вниз, и нужный заход находится глазом; при
   выравнивании по середине оба столбца плывут, и не читается ни один. */
/* Строка панели: слева имя, справа время. Глаз идёт по именам, а время
   стоит сбоку и не мешает читать список. */
.znak-stroka{display:flex;flex-direction:row;align-items:baseline;gap:12px;
  padding:7px 9px;border-radius:var(--r-btn);color:inherit;
  text-decoration:none;font-size:13.5px;text-align:left}
.znak-stroka:hover{background:var(--pale);text-decoration:none}
.znak-stroka .tiho{font-size:12px}
/* Имя не сдавливается: длинное пояснение справа однажды сжало
   «Валовая прибыль» в столбик по букве. Пояснение обрезается, имя —
   нет: имя и есть то, ради чего строка. */
.znak-stroka .imya-sleva{flex:1 1 auto;min-width:9em;overflow-wrap:anywhere}
.znak-stroka .sprava{margin-left:auto;text-align:right;flex:0 1 auto;
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.znak-stroka .kogda{flex:0 0 auto}
.znak-stroka .kogda{font-family:var(--cifry);font-size:11.5px;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.znak-pusto{padding:10px 9px;font-size:13px}

/* Звезда закладки. Незажжённая проступает при наведении на строку —
   так же, как карандаш: девятнадцать пустых звёзд в столбик спорят с
   именами отчётов. Зажжённая видна всегда, иначе избранное не отличить
   от прочего, не водя мышью. */
.zvezda-forma{display:inline-flex;margin:0;flex:0 0 auto}
.zvezda{display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;padding:0;border:none;background:none;
  color:var(--ink-3);cursor:pointer;border-radius:4px;opacity:0;
  transition:opacity .12s var(--plavno),color .14s ease}
.zvezda svg{width:14px;height:14px}
.vetka-stroka:hover .zvezda,.zvezda:focus-visible{opacity:1}
.zvezda.gorit{opacity:1;color:var(--red)}
.zvezda:hover{color:var(--red);background:var(--pale)}
@media (hover:none){.zvezda{opacity:.55}}

/* Тема: солнце днём, луна ночью, оба знака при «авто». */
.tema-forma{display:inline-flex;margin:0}
.tema-podpis{font-size:12.5px}
.tema-den .luna,.tema-noch .luchi,.tema-noch circle{display:none}
.tema-avto .luna{display:none}

/* Поле поиска в панелях шапки. Общее правило рисует его рамкой в полный
   контраст, и в маленькой панели оно спорит с самим списком: глаз
   цепляется за пустое поле, а не за строки. Здесь рамка тише, подсказка
   умереннее. */
.znak-polotno .vybor-poisk{border-color:var(--line);background:var(--pale);
  color:var(--ink-2);font-size:13px;padding:6px 9px}
.znak-polotno .vybor-poisk::placeholder{color:var(--ink-3);opacity:1}
.znak-polotno .vybor-poisk:focus{border-color:var(--fokus);
  box-shadow:none;color:var(--ink);background:var(--paper)}

/* Панель отклонений шире прочих: заголовок отклонения и время должны
   уместиться в строку, иначе каждое переносится и список не читается. */
/* Нижний предел тоже считается от экрана. С голыми 420 px панель
   на телефоне была шире окна и тянула за собой всю страницу: полотно
   выходило 606 px при 375 доступных — и так на всех тридцати семи
   страницах, панель-то общая. */
.znak-shire{min-width:min(420px,86vw);max-width:min(560px,90vw)}

/* Подсказка в поле поиска — самая тихая надпись в панели: она не
   сообщение, а место, куда писать. */
.znak-polotno .vybor-poisk::placeholder{color:var(--ink-3);opacity:.55}

/* Ссылка в шапке панели прописными не пишется: заголовок и ссылка в
   одном регистре читаются как одно слово. */
.znak-shapka .ne-propisnymi{text-transform:none;letter-spacing:0;
  font:inherit;font-size:12.5px;color:var(--ink-3);text-decoration:none}
.znak-shapka .ne-propisnymi:hover{color:var(--ink);text-decoration:none}

/* Выбор темы: три строки одной формы, кнопками. Отмеченная — та, что
   стоит сейчас; без пометки человек нажимает наугад. */
/* Список тем — три коротких слова: широкая панель под ними пустует. */
.znak-uzhe{min-width:0;width:max-content;max-width:min(300px,86vw)}
.temy-spisok{display:block}
.tema-vybor{width:100%;border:none;background:none;font:inherit;
  font-size:13.5px;cursor:pointer;text-align:left}
/* Строка со знаком равняется по середине, а не по базовой линии:
   у картинки базовой линии нет, и знак вставал то выше, то ниже слова. */
.tema-vybor{align-items:center}
.tema-vybor svg{width:15px;height:15px;flex:0 0 auto;color:var(--ink-3)}
.tema-vybor .imya-sleva{min-width:0}
.tema-vybor.eta{background:var(--pale);color:var(--ink);font-weight:600}
.tema-vybor.eta svg{color:var(--red)}

/* Живой поиск в шапке: список под полем, пока человек печатает. */
.poisk-shapki{position:relative;margin-right:16px}
.poisk-vypad{position:absolute;z-index:31;top:calc(100% + 6px);left:0;
  min-width:22rem;max-width:min(30rem,86vw);max-height:min(60vh,380px);
  overflow:auto;overscroll-behavior:contain;padding:6px;
  background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-card);box-shadow:0 14px 32px rgba(17,19,24,.16)}
.poisk-vypad[hidden]{display:none}

/* Подтверждение словами: кнопка раскрывает вопрос и настоящую
   кнопку. Не `confirm()`: политика содержимого запрещает свои скрипты,
   да и вопрос должен называть последствие, а не спрашивать «вы
   уверены». */
.podtverzhdenie{display:inline-block}
.podtverzhdenie>summary{list-style:none;cursor:pointer;display:inline-flex}
.podtverzhdenie>summary::-webkit-details-marker{display:none}
.podtverzhdenie-nutro{margin-top:8px;padding:10px 12px;
  border:1px solid var(--red);border-radius:var(--r-btn);
  background:var(--pale);display:flex;flex-direction:column;gap:8px;
  max-width:34rem}
.podtverzhdenie-nutro p{margin:0;font-size:13.5px}

/* Низ карточки: поля те же, что у шапки, и отбивка сверху, если
   выше стояла таблица. Класса не было, и низ прилипал к последней
   строке — заметно только глазами, разметка при этом законная. */
.karta-nizok{padding:14px 15px;display:flex;flex-direction:column;gap:10px}
.karta-nizok.stroka-pravki{flex-direction:row;flex-wrap:wrap;
  align-items:flex-end;gap:10px 14px}
.skroll + .karta-nizok,.reestr + .karta-nizok{border-top:1px solid var(--line-2)}
.karta-nizok h4{margin:6px 0 0;font-size:14px}
.karta-nizok p{margin:0}

/* ── управление группами ────────────────────────────────────
 *
 * Строка группы — одна форма: имя, место, закрепление, порядок и
 * уборка. Имя набрано полем без рамки: список из тринадцати обведённых
 * полей читается как анкета, а это перечень.
 */
/* Окно лежит в разметке внутри заголовка карты, а тот набран
   прописными вразрядку — и всё окно наследовало это: «ЗАКРЕПЛЁННЫЕ
   ДЕРЖАТСЯ НАВЕРХУ». Сбрасываем у самого окна, подписи полей ниже
   ставят своё сами. */
.modalka-okno{text-transform:none;letter-spacing:normal;font-weight:400;
  font:400 14px/1.5 var(--shrift);text-align:left}
.modalka-okno h4{font-weight:600}
.modalka-okno.shirokoe.okno-grupp{width:min(880px,94vw)}

.gruppy-spisok{display:flex;flex-direction:column;gap:2px;
  max-height:52vh;overflow-y:auto;margin:0 -4px;padding:0 4px;overscroll-behavior:contain
}
.gruppa-stroka{display:flex;flex-wrap:wrap;gap:6px;align-items:center;
  padding:4px 6px;border-radius:var(--r-btn)}
.gruppa-stroka:hover{background:var(--pale)}
.gruppa-stroka.glubina-1{padding-left:22px}
.gruppa-stroka.glubina-2{padding-left:40px}
.gruppa-stroka.glubina-3{padding-left:58px}
.gruppa-stroka.glubina-4{padding-left:76px}

.modalka-okno input.gruppa-imya{flex:1 1 11rem;min-width:8rem;
  height:var(--organ-mal);
  padding:0 7px;border:1px solid transparent;background:transparent;
  font:400 14px/1 var(--shrift);color:var(--ink)}
.modalka-okno input.gruppa-imya:hover{border-color:var(--line-2)}
.modalka-okno input.gruppa-imya:focus{border-color:var(--ink-3);background:var(--paper)}
.gruppa-stroka.zakreplena .gruppa-imya{font-weight:600}
.modalka-okno .gruppa-mesto{flex:0 1 11rem;min-width:7rem;
  height:var(--organ-mal);
  font-size:13px;color:var(--ink-2)}

/* Подписи полей в окне набраны прописными в столбик — этой не надо:
   она стоит рядом с галочкой, строкой. Через имя окна, иначе побеждает
   общее правило для подписей в окне. */
.modalka-okno .gruppa-zakrepit{display:inline-flex;flex-direction:row;align-items:center;
  gap:5px;font:400 12px/1 var(--shrift);letter-spacing:0;text-transform:none;
  color:var(--ink-3);white-space:nowrap;cursor:pointer}
.modalka-okno .gruppa-zakrepit input{accent-color:var(--red);width:14px;height:14px;margin:0}
.modalka-okno .gruppa-stroka.zakreplena .gruppa-zakrepit{color:var(--ink-2)}
.gruppa-schyot{min-width:1.6rem;text-align:right;font:400 12.5px/1 var(--cifry)}
/* Место крестика у непустой группы держится пустым: без него строки
   разъезжаются и столбик кнопок перестаёт быть столбиком. */
.gruppa-nelzya{width:26px;flex:0 0 26px}
.gruppa-stroka .knopka.mal{height:var(--organ-kroha);
  min-height:var(--organ-kroha);padding:0 10px;
  font-size:12.5px}
.gruppa-stroka .knopka-derevo.ubrat:hover{color:var(--red);
  border-color:var(--red)}

/* Заведение стоит отдельной полосой над низом окна: это не строка
   списка, и путать её с ними нельзя. */
.gruppa-novaya{display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  padding-top:12px;border-top:1px solid var(--line-2)}
.modalka-okno .gruppa-novaya .gruppa-imya{border-color:var(--line-2);
  background:var(--paper);height:var(--organ-mal)}
.modalka-okno .gruppa-novaya .gruppa-mesto{height:var(--organ-mal)}
@media (max-width:700px){
  .gruppa-stroka{gap:5px}
  .modalka-okno .gruppa-imya{flex:1 1 100%}
  .modalka-okno .gruppa-mesto{flex:1 1 100%}
}

/* Подсказка под органом: чего не хватает, чтобы он сработал.
   Своим цветом её красить нельзя — это не ошибка ввода, а
   недосказанность, и красное здесь пугало бы зря. */
.organ-podskazka{
  align-self:center;
  color:var(--vnimanie);
  font-size:12px;
  white-space:nowrap;
}

/* ══ рабочий стол виджетов ══════════════════════════════════════
   Задание владельца 12.09.2026: четыре формы на сетке 8 × 4, размер
   тянется за край, карта расположения, мобильная версия по правилам
   iOS. «Изучи бенчмарки» — изучены: это WidgetKit.

   **Клетка квадратная.** Высота ряда равна ширине колонки. Только так
   S выходит квадратом, а M и XL ровно вдвое шире высоты. Ширину
   клетки считает `cqw` от полотна: делить на восемь в четырёх местах
   значит завести четыре правды об одном числе.

   **Потолка у полотна нет с 13.09.2026.** Было 1520 px, и на широком
   экране поле виджетов стояло у́же шапки — владелец: «выровняй по шапке».
   Край полотна теперь там же, где логотип и «выйти».                */
#setka-korob{
  container-type:inline-size;
  container-name:polotno;
}
.setka-glavnoj{
  /* Клетка вдвое мельче и зазор вдвое меньше — владелец 13.09.2026:
     «компактней, меньше места между виджетами, сетку чаще в два раза». */
  --zazor:8px;
  --kolonok:48;
  --kletka:calc((100cqw - (var(--kolonok) - 1) * var(--zazor)) / var(--kolonok));
  /* Призрак растягивания лежит внутри полотна и считает своё
     место от него. Без `relative` он считал от чужого предка и
     уезжал к левому краю страницы — владелец снял это 12.09.2026. */
  position:relative;
  display:grid;
  gap:var(--zazor);
  grid-template-columns:repeat(var(--kolonok),minmax(0,1fr));
  grid-auto-rows:var(--kletka);
  /* **Сетка ничего не двигает сама.** `dense` затягивала мелкие
     карточки в освободившиеся дыры, и стоило уменьшить одну — соседи
     разъезжались. Владелец 12.09.2026: «этого не нужно делать».
     Место у каждой своё, классами `x-N` и `y-N` ниже. */
  grid-auto-flow:row;
  margin:18px 0;
}
.setka-glavnoj>.yachejka{
  min-width:0;min-height:0;
  /* Карточка спрашивает про СЕБЯ, а не про окно. Иначе M на широком
     мониторе и M на планшете вели бы себя одинаково, хотя разница
     между ними вдвое. Владелец 12.09.2026: «меньшая форма не должна
     в два-три уровня фильтры переносить». */
  /* Мерится по обеим сторонам, а не только по ширине: иначе `cqh`
     не работает, и главная цифра не умеет считаться от высоты
     карточки. Высота у ячейки определённая — её задаёт ряд сетки. */
  container-type:size;
  container-name:vidzhet;
}
/* ── место карточки ───────────────────────────────────────────
   Столбец и ряд классами, а не стилем: правило содержимого не пускает
   ни `style=""`, ни свой `<style>`. Классов тридцать два, а не двести:
   восемь столбцов и сорок восемь рядов перемножаются сеткой, а не
   нами. Сорок восемь — это семнадцать карточек по четыре ряда с
   запасом: свободная раскладка растёт вниз, и упереться в
   потолок она не должна. */

.setka-glavnoj>.yachejka>.karta{
  margin:0;height:100%;
  display:flex;flex-direction:column;min-height:0;overflow:hidden;
  /* Тень у виджета мягкая и двуслойная — как в macOS: близкий
     контактный слой отрывает карточку от фона, дальний даёт
     глубину. Одним слоем выходит либо грязно, либо никак. */
  box-shadow:0 1px 2px rgba(17,19,24,.05),
             0 8px 24px -12px rgba(17,19,24,.18);
}
/* В тёмной теме тень не работает — чёрное на чёрном. Отделяет
   граница, и она чуть светлее обычной. Та же ловушка, что с
   `--paper` и `--pale`: они там один цвет. */
@media (prefers-color-scheme:dark){
  :root:not([data-tema="den"]) .setka-glavnoj>.yachejka>.karta{
    box-shadow:none;border-color:var(--line-2)}
}
:root[data-tema="noch"] .setka-glavnoj>.yachejka>.karta{
  box-shadow:none;border-color:var(--line-2)}

/* Четыре формы. Клеток столько, сколько назвал владелец. */
/* Протяжённость задаётся КОНЦОМ: начало приходит классом места
   `x-N`/`y-N`, и `grid-column: span 2` его бы затёрло. */
.yachejka-S{grid-column-end:span 8;grid-row-end:span 5}
.yachejka-M{grid-column-end:span 12;grid-row-end:span 8}
.yachejka-L{grid-column-end:span 24;grid-row-end:span 12}
.yachejka-XL{grid-column-end:span 48;grid-row-end:span 12}
/* Планшет пошире: 32 колонки, XL — во всю. */
@media (max-width:1279px){
  .setka-glavnoj{--kolonok:32}
  .yachejka-XL{grid-column-end:span 32}
}

/* Узкое полотно: колонок четыре, и XL сводится к L. Восьми колонок
   там нет, а растянуть 8 × 4 на четыре значит показать другую форму
   под тем же именем. */
@media (max-width:1023px){
  /* Планшет: шесть колонок, как в портрете у iPad. При четырёх
     квадрат S занимал бы половину экрана — замерено на 900 px:
     423 из 900. XL сводится к четырём: растянуть 8 × 4 на шесть
     значит показать другую форму под тем же именем. */
  .setka-glavnoj{--kolonok:24;--zazor:8px}
  .yachejka-XL{grid-column-end:span 24}
}
@media (max-width:767px){
  /* Телефон: четыре колонки, как в iOS. Два квадрата S в ряд, M и L
     во всю ширину. Прежние две колонки давали «всё во всю ширину», и
     телефон получал ленту одинаковых плит. */
  .setka-glavnoj{--kolonok:12;--zazor:6px;margin:14px 0}
  .yachejka-S{grid-column-end:span 6}
  .yachejka-L,.yachejka-XL{grid-column-end:span 12}
}
/* Режим чтения: при увеличении текста до 200 % и на очень узком
   экране раскладка распрямляется в одну колонку, а высота
   отпускается совсем. Обрезать текст ради геометрии нельзя. */
@media (max-width:359px){
  .setka-glavnoj{--kolonok:6}
  .yachejka-M,.yachejka-L,.yachejka-XL{grid-column-end:span 6}
}

/* ══ устройство виджета ═════════════════════════════════════════
   Шесть мест, и все у всех карточек на одном месте. Задание
   владельца 12.09.2026: «сделай у всех виджитов стандарты, где
   шапки, где фильтры, где сама инфографика».                       */

/* Шапка: имя слева, значок оговорок, срез справа. **Не переносится
   никогда.** Перенос на вторую строку — это и есть то, на что
   владелец показал 12.09.2026: шапки соседних карточек встают на
   разных уровнях. Длинное имя обрезается многоточием: обрезанное имя
   читается, второй этаж — нет. */
.setka-glavnoj .karta>h3{flex:0 0 auto;flex-wrap:nowrap}
.setka-glavnoj .karta>h3 .karta-imya{
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Значок оговорок стоит сразу за именем, а не посередине шапки:
   `space-between` на трёх частях развёл бы их поровну, и значок
   оказался бы сам по себе. Свободное место отдаём после него. */
.karta-spravka{
  display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 auto;
  width:18px;height:18px;margin:0 auto 0 6px;padding:0;
  border:0;border-radius:50%;background:none;color:var(--ink-3);
  cursor:pointer;vertical-align:middle;
  transition:color .14s ease}
.karta-spravka:hover{color:var(--ink)}
.karta-spravka:focus-visible{outline:2px solid var(--fokus);outline-offset:2px}
.karta-spravka svg{width:14px;height:14px;display:block}
/* Окно оговорок — родное `popover`: поверх всего, закрывается Esc и
   нажатием мимо, и всё это без единой строки скрипта. */
.karta-ogovorki{
  max-width:min(30rem,88vw);margin:auto;padding:12px 14px;
  border:1px solid var(--line);border-radius:var(--r-card);
  background:var(--paper);color:var(--ink-2);
  font-size:13px;line-height:1.5;
  box-shadow:0 18px 44px rgba(17,19,24,.22)}
.karta-ogovorki p{margin:0 0 6px}
.karta-ogovorki p:last-child{margin:0}
.karta-ogovorki::backdrop{background:rgba(17,19,24,.28)}

/* Подпись: одна строка, чем считано. */
.setka-glavnoj .karta-podpis{flex:0 0 auto}

/* Органы: ОДНА строка. Не помещается — едет вбок, а не переносится
   на второй этаж. Владелец 12.09.2026 показал ровно это: фильтры в
   три уровня в маленькой форме. */
/* Ряд фильтров НЕ едет вбок. Раньше он прокручивался, и это была
   та же беда, о которой владелец сказал 12.09.2026: «содержимое
   виджета не должно быть шире его границ». Не помещается одной
   строкой — значит его здесь нет вовсе: ниже 34 rem отбор открывается
   листом снизу, и ряд заменён кнопкой. */
.karta-organy{
  flex:0 0 auto;
  margin:0 0 8px;padding:0 15px;
  overflow:hidden;min-width:0;
}
.karta-organy>*{flex-wrap:nowrap;min-width:0}
.karta-organy .grafik-upravlenie,
.karta-organy .grafik-otbor{flex-wrap:nowrap;max-width:100%;min-width:0}

/* ── отбор в узкой карточке: лист снизу ────────────────────────
   Владелец 12.09.2026: «в мобиле… нужно открывать фильтры например
   модалкой». Лист родной — `popover`: сам встаёт поверх всего, сам
   закрывается Esc и нажатием мимо, и всё это без единой строки
   скрипта.

   **Решает ширина карточки, а не окна.** Узкая — кнопка и лист;
   широкая — обычная строка на месте. Одна и та же разметка, два
   правила.                                                        */
/* Край, радиус и подложка приходят общим правилом органа — своим
   набором они однажды разойдутся со всеми остальными. Здесь только
   то, что у этой кнопки своё. */
.organy-knopka{
  display:inline-flex;align-items:center;gap:7px;
  height:var(--organ-mal);padding:0 12px;
  color:var(--ink);cursor:pointer;
  font:400 13px/1 var(--shrift)}
.organy-knopka:hover{border-color:var(--ink-3)}
.organy-knopka svg{width:15px;height:15px}
.organy-list:popover-open{
  position:fixed;inset:auto 0 0 0;margin:0;
  display:flex;flex-direction:column;gap:10px;
  max-height:82vh;overflow-y:auto;
  padding:16px 16px calc(16px + env(safe-area-inset-bottom));
  border:0;border-top:1px solid var(--line);
  border-radius:var(--r-block) var(--r-block) 0 0;
  background:var(--paper);
  box-shadow:0 -18px 44px rgba(17,19,24,.28);overscroll-behavior:contain
}
.organy-list:popover-open::backdrop{background:rgba(17,19,24,.38)}
/* В листе органы стоят столбиком: места хватает, и столбик читается
   сверху вниз — это не строка отбора, а страница отбора. */
.organy-list:popover-open .grafik-upravlenie,
.organy-list:popover-open .grafik-otbor{
  flex-wrap:wrap;width:auto}
.organy-list:popover-open::before{
  content:"";display:block;width:36px;height:4px;margin:-6px auto 2px;
  border-radius:2px;background:var(--line-2)}
/* Широкая карточка: кнопки нет, лист стоит строкой на месте.
   Авторское правило перебивает `display:none` из настроек браузера —
   при равном весе побеждает автор. */
@container vidzhet (min-width:34rem){
  .karta-organy .organy-knopka{display:none}
  .karta-organy .organy-list:not(:popover-open){
    display:flex;position:static;padding:0;border:0;background:none;
    box-shadow:none;max-height:none;overflow:visible}
}

/* Тело: всё остальное место. Список длиннее формы едет прокруткой, а
   не пропадает: счёт «показано N из M» говорит, сколько не влезло. */
.karta-telo{
  flex:1 1 auto;min-height:0;
  overflow:auto;overscroll-behavior:contain;
}
/* В карточке на главной прокрутки нет вовсе. Владелец 12.09.2026:
   «содержимое виджета внутри не должно быть шире его границ, чтобы не
   появлялись прокрутки внутри как минимум». Прокрутка внутри — это
   признак того, что содержимое не подогнали под форму, а спрятали.
   Подгоняется оно правилами ниже: строки делят высоту, а всё, что в
   них стоит, умеет сжиматься. */
.setka-glavnoj .karta-telo{overflow:hidden}
/* Чтобы сжиматься, детям нужно разрешение: у элемента сетки и гибкой
   кладки `min-width`/`min-height` по умолчанию `auto`, и он не станет
   у́же своего содержимого — сколько ни дели высоту. */
.setka-glavnoj .karta-telo *{min-width:0}
.setka-glavnoj .karta-telo>.polosy>.polosa-stroka,
.setka-glavnoj .karta-telo>.vnimanie>.vnimanie-stroka,
.setka-glavnoj .karta-telo .stroka-dnya,
.setka-glavnoj .karta-telo .plitka{
  min-height:0;overflow:hidden}
/* Главная цифра мерится и по высоте карточки, а не только по ширине:
   в низкой карточке 46 px съедали место, которого нет. */
.setka-glavnoj .karta-telo .cifra-glavnaya .cifra{
  font-size:clamp(22px,min(9cqw,20cqh),46px)}
/* Ряд органов и плиток графика не расталкивает карточку вбок. */
.setka-glavnoj .karta-telo .grafik-upravlenie,
.setka-glavnoj .karta-telo .grafik-plitki{flex-wrap:wrap;min-width:0}

/* ── содержимое заполняет карточку ─────────────────────────────
   Высоту карточки задаёт сетка, и содержимое обязано под неё встать:
   не свисать в прокрутку и не висеть в пустоте. Владелец 12.09.2026
   увидел и то и другое — «что с содержанием случилось».

   Правило одно на все списки: строк столько, сколько назначила форма,
   и они делят высоту поровну. Больше форма — строк больше и каждая
   выше; меньше форма — строк меньше и каждая ниже. Это и есть
   «пропорционально меньше и/или их меньше», о чём он просил.

   `minmax(0,1fr)` вместо `auto`: `auto` даёт строке её natural height,
   и шесть строк по 48 px не влезают в тело на 217 px — ровно то, что
   резалось. */
.setka-glavnoj .karta-telo>.polosy,
.setka-glavnoj .karta-telo>.vnimanie,
.setka-glavnoj .karta-telo>.karta-tablica>tbody{
  display:grid;grid-auto-rows:minmax(0,1fr);align-content:stretch}
.setka-glavnoj .karta-telo>.polosy>.polosa-stroka,
.setka-glavnoj .karta-telo>.vnimanie>.vnimanie-stroka{
  align-content:center;overflow:hidden}
/* Тело — колонка: единственный ребёнок занимает всю высоту, а не
   ложится наверх, оставляя пустоту под собой. */
.setka-glavnoj .karta-telo{display:flex;flex-direction:column}
.setka-glavnoj .karta-telo>*{flex:1 1 auto;min-height:0}
/* Плитки: ряды тоже делят высоту. Поле сверху в карточке лишнее —
   его место уже отмерено подписью. */
.setka-glavnoj .karta-telo>.plitki{
  grid-auto-rows:minmax(0,1fr);margin:0 0 12px;align-content:stretch}
.setka-glavnoj .karta-telo>.plitki:last-child{margin-bottom:0}
/* Одинокий блок — план месяца, например — стоит посередине тела.
   Прижатый к верху, он оставлял под собой белое пятно в треть
   карточки, и это читалось как «содержимое пропало». */
.setka-glavnoj .karta-telo>.plan-stroka{
  display:flex;flex-wrap:wrap;align-content:center;align-items:center}

/* Двери и напоминания: свободное место уходит в промежутки, а не
   копится внизу одним белым пятном. */
.setka-glavnoj .karta-telo>.kuda{align-content:space-evenly}
.setka-glavnoj .karta-telo>.krajnie-para,
.setka-glavnoj .karta-telo>.tri-stroki{
  display:flex;flex-direction:column;justify-content:space-evenly}
/* Главная цифра стоит сверху, а не плавает по центру: `space-evenly`
   отбивал её и от шапки, и от списка, и карточка читалась пустой
   сверху донизу. Остаток высоты забирает список под цифрой. */
.setka-glavnoj .karta-telo>.karta-cifra-ryad{
  display:flex;flex-direction:column;justify-content:flex-start}
.setka-glavnoj .karta-telo>.karta-cifra-ryad>.cifra-glavnaya{flex:0 0 auto}
.setka-glavnoj .karta-telo>.karta-cifra-ryad>.tri-stroki{
  flex:1 1 auto;min-height:0;display:grid;
  grid-auto-rows:minmax(0,1fr);align-content:stretch}

/* Трафик — целый кусок отчёта внутри карточки, и в ней он был на
   147 px выше тела: 676 против 529. Лишнее — своя шапка (имя уже
   стоит в шапке карточки) и строка «показывается» (она ушла под
   значок оговорок). Остаток отдаётся графику: он и обязан тянуться. */
.setka-glavnoj .karta-telo>#rezultat{display:flex}
.setka-glavnoj .karta-telo>#rezultat>.grafik-karta{
  flex:1 1 auto;min-height:0;display:flex;flex-direction:column;
  margin:0;border:0;border-radius:0;box-shadow:none;background:none;
  padding:0}
.setka-glavnoj .karta-telo>#rezultat>.grafik-karta>h3,
.setka-glavnoj .karta-telo>#rezultat>.grafik-karta>.pokazyvaetsya{
  display:none}
/* Поле графика — везде, где оно стоит в карточке, а не только в
   трафике: у продаж оно лежит прямо в теле и вылезало на 31 px. */
.setka-glavnoj .karta-telo .grafik-pole{flex:1 1 auto;min-height:0}
.setka-glavnoj .karta-telo .grafik-pole>svg{
  height:100%;width:100%;display:block}

/* ── содержимое по размерам карточки, 13.09.2026 ─────────────────
   Владелец: «сделай чтобы все четко отображалось, может быть нужно сами
   контент зоны в виджетах отладить по размерам». Замер браузером
   семнадцати виджетов в четырёх формах при сетке 1200, 1440 и 1680 px
   нашёл пять бед; правила ниже — по одному на беду. Сколько строк и
   плиток положить, сервер с того же дня считает по ширине настоящей
   сетки, а не по типовой. */

/* Имя в строке — одной строкой с многоточием, целиком — в подсказке.
   Перенос давал строке второй этаж, а высоту строк делит сетка: второй
   этаж наезжал на соседнюю строку. */
.setka-glavnoj .karta-telo .polosa-imya{
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal}

/* Плитки берут свою высоту, а не делят её со списком или рисунком: в
   низкой карточке деление срезало цифру. Цифра сжимается по ширине
   карточки и не переносится; подпись и пояснение — одной строкой. */
.setka-glavnoj .karta-telo>.plitki{flex:0 0 auto;grid-auto-rows:auto}
.setka-glavnoj .karta-telo .plitka{padding:10px 14px;gap:2px}
.setka-glavnoj .karta-telo .plitka .l,
.setka-glavnoj .karta-telo .plitka .s{
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.setka-glavnoj .karta-telo .plitka .v{white-space:nowrap;
  font-size:clamp(16px,3.1cqw,25px)}
/* Двойное значение («1354 шт / 13,8 млн») мельче: иначе оно шире плитки
   и наезжает на соседнюю цифру. */
.setka-glavnoj .karta-telo .plitka .v.dlinnoe{font-size:clamp(13px,1.35cqw,19px)}
/* Низкая карточка: плитки одним рядом и без пояснений — место уходит
   списку и рисунку, ради которых она стоит. */
@container vidzhet (max-height:470px){
  .setka-glavnoj .karta-telo>.plitki{grid-template-columns:none;
    grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
  .setka-glavnoj .karta-telo .plitka{padding:7px 12px}
  .setka-glavnoj .karta-telo .plitka .s{display:none}
}

/* Строки дня — поля как у всех строк, число по высоте карточки. В форме
   M при сетке 1200 px число в 27 px не помещалось в свою строку. */
.setka-glavnoj .karta-telo>.tri-stroki{padding:4px 15px 10px;max-width:none}
.setka-glavnoj .karta-telo .stroka-dnya .chislo{
  font-size:clamp(15px,min(4.2cqw,7cqh),27px)}
/* Строка обрезает переполнение, а межстрочный интервал числа равен его
   кеглю: без полей верх и низ знака срезались на два пикселя. */
.setka-glavnoj .karta-telo .stroka-dnya{padding-block:3px}

/* Шкала плана — полоса, а не заливка тела: растянутая на всё тело, она
   выходила толщиной в палец. Остаток высоты уходит в промежутки. */
.setka-glavnoj .karta-telo>svg.shkala-plana{flex:0 0 auto}
.setka-glavnoj .karta.tempo .karta-telo:has(>svg.shkala-plana){
  justify-content:space-around}

/* Четыре плитки и больше в узкой высокой карточке — два на два, а не три
   и одна сиротой во втором ряду. */
@container vidzhet (min-height:471px) and (max-width:760px){
  .setka-glavnoj .karta-telo>.plitki:has(>.plitka:nth-child(4)){
    grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* Цифра дня с тремя строками под ней: поля как у всех строк, цифра — по
   высоте карточки. В M при 1200 px последняя строка срезалась. */
.setka-glavnoj .karta-telo>.karta-cifra-ryad>.tri-stroki{padding:0 15px 8px;max-width:none}
.setka-glavnoj .karta-telo>.karta-cifra-ryad>.cifra-glavnaya .cifra{
  font-size:clamp(22px,min(9cqw,13cqh),46px)}
@container vidzhet (max-height:330px){
  .setka-glavnoj .karta-telo>.karta-cifra-ryad>.cifra-glavnaya .dvizhenie{font-size:12px}
}
/* План: плитки и шкала — одна группа посередине тела, а не плитки сверху и
   полоса у самого низа с пустым полем между ними. */
.setka-glavnoj .karta.tempo .karta-telo:has(>svg.shkala-plana){
  justify-content:center;gap:clamp(10px,5cqh,36px)}
/* Трафик в узкой карточке. Все органы в одну строку не помещаются, а в
   три этажа их переносить нельзя (владелец 12.09.2026): остаются период,
   магазины и «Показать», кнопки кривых и два отбора живут в отчёте.
   Подпись под легендой — ключ к чтению — стоит под значком оговорок. */
@container vidzhet (max-width:760px){
  .setka-glavnoj .karta-telo .grafik-upravlenie>.krivye,
  .setka-glavnoj .karta-telo .grafik-otbor>details.vybor:nth-of-type(n+2){display:none}
  .setka-glavnoj .karta-telo .grafik-upravlenie{flex-wrap:nowrap}
}
.setka-glavnoj .karta-telo .grafik-legenda>.tiho{display:none}
.setka-glavnoj .karta-telo #rezultat .grafik-plitki{flex:0 0 auto}
@container vidzhet (max-height:620px){
  .setka-glavnoj .karta-telo #rezultat .grafik-plitki{grid-template-columns:none;
    grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
  .setka-glavnoj .karta-telo #rezultat .grafik-plitki .s{display:none}
  .setka-glavnoj .karta-telo .grafik-legenda{display:none}
}

/* Продажи в совсем низкой карточке: одна цифра строкой над графиком —
   иначе графику остаётся полоса в пятьдесят пикселей и он сжимается в
   точку посередине. */
@container vidzhet (max-height:330px){
  .setka-glavnoj .karta-telo>.plitki.grafik-plitki>.plitka:nth-child(n+2){display:none}
  .setka-glavnoj .karta-telo>.plitki.grafik-plitki>.plitka{
    flex-direction:row;align-items:baseline;gap:10px;padding:4px 14px}
}

/* «Выше и ниже» и «Почему не покупают» — таблицы без своих правил: у
   них не было ни полей, ни ширины, и строки жались к левому краю, а
   подпись «выше всех» стояла вплотную к рамке. Теперь поля как у всех
   списков, строка — сеткой во всю ширину, имя — одной строкой. */
.setka-glavnoj .karta-telo>.krajnie-para{padding:2px 15px 8px}
.setka-glavnoj .karta-telo>.karta-tablica{display:block;padding:4px 15px 8px}
.setka-glavnoj .karta-telo .krajnie-stolb{display:flex;flex-direction:column;min-height:0}
.setka-glavnoj .karta-telo .krajnie-stolb>table,
.setka-glavnoj .karta-telo .krajnie-stolb>table>tbody{display:block}
.setka-glavnoj .karta-telo .krajnie-zagolovok{
  font:500 10.5px/1.4 var(--cifry);letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-3);margin:4px 0 2px}
.setka-glavnoj .karta-telo .krajnie-stolb tr,
.setka-glavnoj .karta-telo>.karta-tablica>tbody>tr{
  display:grid;grid-template-columns:minmax(0,1fr) auto 64px;
  align-items:center;column-gap:12px;min-height:0}
.setka-glavnoj .karta-telo .krajnie-stolb td,
.setka-glavnoj .karta-telo>.karta-tablica td{padding:2px 0;min-width:0}
.setka-glavnoj .karta-telo .krajnie-stolb td:first-child,
.setka-glavnoj .karta-telo>.karta-tablica td:first-child{
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Список склада: «нет в 15 маг.» шире общей колонки базы и резалось. */
.setka-glavnoj .karta-telo .polosy-sklad .polosa-stroka{
  grid-template-columns:minmax(0,1.5fr) minmax(40px,1.6fr) 64px 96px}

/* Низок: счёт и ссылка. Прижат к нижнему краю у всех одинаково. */
.setka-glavnoj .karta-nizok{
  flex:0 0 auto;
  /* Направление сбрасывается вслух: у общего низка оно `column`, и
     без сброса счёт и ссылка вставали столбиком, съедая треть
     карточки. Замерено: 97 px вместо 55. */
  display:flex;flex-direction:row;flex-wrap:wrap;
  align-items:baseline;gap:4px 10px;
  margin:0;padding:8px 15px 13px;
  border-top:1px solid var(--line);
  font-size:12.5px;color:var(--ink-3)}
.setka-glavnoj .karta-nizok .kuda-ssylka{margin-left:auto;font-size:12.5px}

/* ── форма S: одна цифра и одно слово ──────────────────────────
   S — квадрат в две клетки: строка списка с именем, полосой и числом
   в него не помещается по ширине. Поэтому S не «короткий список», а
   заголовок. Так же устроен `systemSmall` у Apple. */
.karta-glavnoe{
  flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;
  gap:2px;padding:4px 15px 15px;min-height:0}
/* Плитка-дверь: вся цифра — ссылка. Подчёркивания нет, оно
   перечеркнуло бы число; что это дверь, говорит стрелка и наведение. */
a.karta-glavnoe-dver{color:inherit;text-decoration:none;
  transition:background .14s ease}
a.karta-glavnoe-dver:hover{background:var(--pale);text-decoration:none}
a.karta-glavnoe-dver .karta-slovo::after{content:" →";color:var(--ink-3)}
.karta-chislo{
  font:600 clamp(30px,10cqw,46px)/1 var(--cifry);
  letter-spacing:-.03em;color:var(--ink);
  font-variant-numeric:tabular-nums}
.karta-edinica{font-size:.52em;font-weight:500;margin-left:.12em;
  color:var(--ink-3)}
.karta-slovo{font-size:13px;color:var(--ink-2);line-height:1.35}
.karta-glavnoe.ton-trevoga .karta-chislo{color:var(--red)}
.karta-glavnoe.ton-horosho .karta-chislo{color:var(--horosho,var(--ink))}

/* ── что показывается в какой ширине ───────────────────────────
   Решает ширина самой карточки, а не окна.                         */
@container vidzhet (max-width:23rem){
  /* Узкая: срез в шапке прячется — имени и значка довольно, а
     обрезанный период врёт сильнее, чем его отсутствие. */
  .karta-period{display:none}
  .setka-glavnoj .karta-nizok{padding:6px 12px 11px}
  .karta-organy{padding:0 12px}
  .karta-glavnoe{padding:4px 12px 12px}
}
@container vidzhet (max-width:26rem){
  /* Пояснение в низке — довесок к ссылке, и в узкой карточке оно
     переносит низок на второй и третий этаж, отнимая место у тела.
     Замерено на 390 px: карточка склада вылезала на 19 пикселей, и
     содержимое молча обрезалось. Ссылки остаются — они и есть ответ
     на вопрос «куда дальше». */
  .setka-glavnoj .karta-nizok>.tiho{display:none}
  .setka-glavnoj .karta-nizok{flex-wrap:nowrap;overflow:hidden}
  .setka-glavnoj .karta-nizok .kuda-ssylka{margin-left:0}
  .setka-glavnoj .karta-nizok .kuda-ssylka+.kuda-ssylka{margin-left:auto}
}
@container vidzhet (max-width:17rem){
  /* Совсем узкая: у низка остаётся счёт, ссылка уходит в стрелку. */
  .setka-glavnoj .karta-nizok .kuda-ssylka{font-size:0}
  .setka-glavnoj .karta-nizok .kuda-ssylka::after{content:"→";font-size:14px}
}

/* ══ режим «Настроить» ══════════════════════════════════════════
   Владелец 13.09.2026: «сделай справа две иконки без рамки типа шестеренка
   и карта… при нажатии на настройки только слева и иконками без обводки
   тоже». Одна строка над сеткой, прижатая вправо: шестерёнка крайняя, карта
   рядом, органы режима встают слева от них. Слева же — строка состояния. */
.nastrojka-shapka{display:flex;align-items:center;justify-content:flex-end;
  gap:2px;min-height:var(--organ-mal);margin:0 0 8px}
.nastrojka-shapka .polozhenie{margin-right:auto;min-width:0;padding-right:12px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--ink-3);font-size:12.5px}
/* Панель режима — не коробка, а часть строки: её органы встают в ряд с
   картой и шестерёнкой. Черта отделяет их от постоянных двух. */
.nastrojka-panel{display:contents}
.nastrojka-panel::after{content:"";flex:0 0 auto;width:1px;height:18px;
  margin:0 8px;background:var(--line-2)}
/* Пока настраивают, строка держится у верхнего края: «Готово» нужно и
   тогда, когда долистали до низа главной. */
.nastrojka-shapka.nastraivaem{position:sticky;top:0;z-index:20;
  padding:4px 0;background:var(--paper)}

.znak-rezhima{display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 auto;width:var(--organ-mal);height:var(--organ-mal);padding:0;
  border:0;border-radius:var(--r-btn);background:none;color:var(--ink-2);
  cursor:pointer;text-decoration:none;
  transition:background .14s ease,color .14s ease,transform .14s var(--plavno)}
/* Обводка тоньше — в вес знаков шапки: владелец 13.09.2026, «убери жирную обводку». */
.znak-rezhima svg{width:18px;height:18px;display:block;fill:none;
  stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.znak-rezhima:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.znak-rezhima:active{transform:scale(.94)}
.znak-rezhima:disabled{opacity:.45;cursor:default}
/* Шестерёнка во время настройки — нажатая: подложкой, а не цветом. */
.znak-rezhima.vklyuchen{background:var(--line);color:var(--ink)}
/* «Готово» — главное действие режима, и красный значит ровно это. */
.znak-rezhima.glavnyj{color:var(--red)}
@media (hover:hover){
  .znak-rezhima:hover{background:var(--line);color:var(--ink)}
  .znak-rezhima.glavnyj:hover{color:var(--red-700)}
}
@media (prefers-reduced-motion:reduce){
  .znak-rezhima{transition:none}
  .znak-rezhima:active{transform:none}
}

/* Поле сетки видно только в режиме настройки: нейтральные линии, не
   шахматная заливка. Клетка квадратная — и линии по обеим осям идут
   с одним шагом, иначе поле показывает не те места. */
.setka-glavnoj.nastraivaem{
  border-radius:var(--r-card);
  background-image:linear-gradient(var(--setka) 1px,transparent 1px),
                   linear-gradient(90deg,var(--setka) 1px,transparent 1px);
  background-size:100% calc(var(--kletka) + var(--zazor)),
                  calc((100% + var(--zazor)) / var(--kolonok)) 100%;
}
.setka-glavnoj.nastraivaem>.yachejka{
  position:relative;
  display:grid;
  /* Пульт занимает строку ПОСТОЯННОЙ высоты. Иначе пульт,
     перенёсшийся на вторую строку в узкой карточке, сдвигал бы
     карточку вниз — и шапки соседних карточек вставали бы на разных
     уровнях. Ровно на это владелец и показал 12.09.2026. */
  grid-template-rows:var(--pult-h,34px) minmax(0,1fr);
  gap:6px;
}
/* Пока настраивают, содержимое карточки не отвечает на нажатия —
   но только когда скрипт жив: без него погашенная страница стала бы
   западнёй. */
.setka-glavnoj.nastraivaem.skript-zhiv>.yachejka>.karta{pointer-events:none}
.setka-glavnoj.nastraivaem.skript-zhiv>.yachejka>.yachejka-pult,
.setka-glavnoj.nastraivaem.skript-zhiv>.yachejka>.yachejka-ugol,
.setka-glavnoj.nastraivaem.skript-zhiv>.yachejka>.yachejka-kraj{
  pointer-events:auto}

/* Пульт стоит НАД карточкой, а не поверх неё: плавающий закрывал бы
   правую половину шапки — ровно ту, где стоит срез. */
.yachejka-pult{
  display:none;align-items:center;justify-content:flex-end;gap:4px;
  /* Не переносится никогда. Что не поместилось — прячется правилом
     ширины ниже, а не съезжает на второй этаж. */
  flex-wrap:nowrap;
  height:var(--pult-h,34px);padding:0 4px;
  border:1px solid var(--line);border-radius:var(--r-btn);
  background:var(--paper);
  justify-self:end;max-width:100%;
}
.nastraivaem.skript-zhiv .yachejka-pult{display:flex}

/* Ручка: шесть точек по горизонтали, по центру, без обводки.
   Владелец 12.09.2026: «а ручке не нужна обводка». Она и не орган в
   ряду — она место для хвата. */
.yachejka-ruchka{
  cursor:grab;touch-action:none;
  display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-kroha);height:var(--organ-kroha);
  flex:0 0 auto;padding:0;border:0;background:none;color:var(--ink-3);
  border-radius:var(--r-btn)}
.yachejka-ruchka:hover{color:var(--ink)}
.yachejka-ruchka:active{cursor:grabbing}
.yachejka-ruchka:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
/* `flex:0 0 auto` обязателен: без него соседняя гибкая кладка
   сжимала знак с 16 px до 10, и точки слипались в узкую полоску. */
.tochki-ruchki{width:16px;height:16px;flex:0 0 auto;display:block;
  fill:currentColor}

/* Крестик вместо слова «Убрать»: слово занимало треть узкого пульта,
   а знак понятен без него. Владелец 12.09.2026. */
.yachejka-ubrat{
  display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-kroha);height:var(--organ-kroha);
  flex:0 0 auto;padding:0;border:0;border-radius:var(--r-btn);
  background:none;color:var(--ink-3);cursor:pointer;
  transition:background .14s ease,color .14s ease}
.yachejka-ubrat:hover{background:var(--red-50);color:var(--red)}
.yachejka-ubrat:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.yachejka-ubrat svg{width:15px;height:15px;display:block}

/* ── Вид карточки: окно личного выбора ──────────────────────────────
   Банк диаграмм, этап 9. Кнопка — рядом со значками размера, тем же
   органом, что крестик. Окно — родной popover, как оговорки. Варианты —
   радиокнопки: выбранная плитка обведена и стоит на подложке, фокус —
   своим цветом по плитке, а сама кнопка спрятана, но в обходе. */
.yachejka-vid{
  display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-kroha);height:var(--organ-kroha);
  flex:0 0 auto;padding:0;border:0;border-radius:var(--r-btn);
  background:none;color:var(--ink-3);cursor:pointer;
  transition:background .14s ease,color .14s ease}
.yachejka-vid:hover{background:var(--pale);color:var(--ink)}
.yachejka-vid:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.yachejka-vid svg{width:15px;height:15px;display:block;fill:currentColor}
.vid-okno{
  width:min(64rem,94vw);max-height:88vh;overflow:auto;overscroll-behavior:contain;
  margin:auto;padding:14px 16px;
  border:1px solid var(--line);border-radius:var(--r-card);
  background:var(--paper);color:var(--ink);
  font-size:13px;line-height:1.45;
  box-shadow:0 18px 44px rgba(17,19,24,.22)}
.vid-okno::backdrop{background:rgba(17,19,24,.28)}
.vid-zagolovok{margin:0 0 10px;font-weight:600;font-size:14px}
/* Слева виды, справа — рисунок, который встанет в карточку при отмеченном
   виде: те же строки, ширина и высота этой формы на этом экране. Владелец
   13.09.2026: «такая диаграмма, точно какая выведется в виджет. То есть не
   примеры». Какой рисунок виден, решает отмеченная радиокнопка — скрипт
   для этого не нужен. */
.vid-telo{display:grid;grid-template-columns:minmax(11rem,15rem) minmax(0,1fr);gap:14px;align-items:start}
.vid-plitki,.vid-nastrojka{border:0;margin:0;padding:0;min-width:0}
/* Подпись отстоит от своих органов: при 6 px «Диаграмма», «Разрез» и
   «Строк» липли к плиткам — владелец 13.09.2026. */
.vid-legenda{padding:0;margin:0 0 10px;color:var(--ink-3);font-size:12px}
.vid-plitki{display:flex;flex-direction:column;gap:8px}
.vid-plitka{position:relative;display:flex;flex-direction:column;gap:3px;min-width:0;
  padding:10px;border:1px solid var(--line);border-radius:var(--r-btn);cursor:pointer}
.vid-plitka:hover{border-color:var(--kraj)}
.vid-plitka:has(input:checked){border-color:var(--ink-2);background:var(--pale)}
.vid-plitka:has(input:focus-visible){outline:2px solid var(--fokus);outline-offset:1px}
.vid-plitka input,.vid-variant input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.vid-imya{font-weight:600;color:var(--ink)}
.vid-vopros{color:var(--ink-2);font-size:12px}
.vid-predprosmotry{min-width:0;transition:opacity .14s ease}
.vid-predprosmotry.zhdyom{opacity:.55}
.vid-predprosmotr{display:none;min-width:0;overflow:hidden;
  border:1px solid var(--line);border-radius:var(--r-card);background:var(--paper)}
.vid-predprosmotr>.polosy,.vid-predprosmotr>.krajnie-para{margin:0;padding:12px 15px}
.vid-predprosmotr-odna,
.vid-okno:has([data-vid][value=""]:checked) [data-vid-predprosmotr=""],
.vid-okno:has([data-vid][value="spisok"]:checked) [data-vid-predprosmotr="spisok"],
.vid-okno:has([data-vid][value="stolbcy"]:checked) [data-vid-predprosmotr="stolbcy"],
.vid-okno:has([data-vid][value="rejting"]:checked) [data-vid-predprosmotr="rejting"],
.vid-okno:has([data-vid][value="liniya"]:checked) [data-vid-predprosmotr="liniya"],
.vid-okno:has([data-vid][value="plitka"]:checked) [data-vid-predprosmotr="plitka"],
.vid-okno:has([data-vid][value="dolya"]:checked) [data-vid-predprosmotr="dolya"],
.vid-okno:has([data-vid][value="shkala"]:checked) [data-vid-predprosmotr="shkala"],
.vid-okno:has([data-vid][value="otklonenie"]:checked) [data-vid-predprosmotr="otklonenie"],
.vid-okno:has([data-vid][value="tochki"]:checked) [data-vid-predprosmotr="tochki"],
.vid-okno:has([data-vid][value="matrica"]:checked) [data-vid-predprosmotr="matrica"],
.vid-okno:has([data-vid][value="malye"]:checked) [data-vid-predprosmotr="malye"],
.vid-okno:has([data-vid][value="nakoplenie"]:checked) [data-vid-predprosmotr="nakoplenie"],
.vid-okno:has([data-vid][value="kolco"]:checked) [data-vid-predprosmotr="kolco"],
.vid-okno:has([data-vid][value="duga"]:checked) [data-vid-predprosmotr="duga"],
.vid-okno:has([data-vid][value="sloi"]:checked) [data-vid-predprosmotr="sloi"],
.vid-okno:has([data-vid][value="sto_procentov"]:checked) [data-vid-predprosmotr="sto_procentov"],
.vid-okno:has([data-vid][value="ryadom"]:checked) [data-vid-predprosmotr="ryadom"],
.vid-okno:has([data-vid][value="dve_osi"]:checked) [data-vid-predprosmotr="dve_osi"],
.vid-okno:has([data-vid][value="linii"]:checked) [data-vid-predprosmotr="linii"],
.vid-okno:has([data-vid][value="ploshchadi"]:checked) [data-vid-predprosmotr="ploshchadi"],
.vid-okno:has([data-vid][value="mozaika"]:checked) [data-vid-predprosmotr="mozaika"],
.vid-okno:has([data-vid][value="s_proshlym"]:checked) [data-vid-predprosmotr="s_proshlym"],
.vid-okno:has([data-vid][value="izmenenie"]:checked) [data-vid-predprosmotr="izmenenie"],
.vid-okno:has([data-vid][value="ryad_chisel"]:checked) [data-vid-predprosmotr="ryad_chisel"],
.vid-okno:has([data-vid][value="hod"]:checked) [data-vid-predprosmotr="hod"],
.vid-okno:has([data-vid][value="bylo"]:checked) [data-vid-predprosmotr="bylo"],
.vid-okno:has([data-vid][value="svodka"]:checked) [data-vid-predprosmotr="svodka"],
.vid-okno:has([data-vid][value="k_celi"]:checked) [data-vid-predprosmotr="k_celi"],
.vid-okno:has([data-vid][value="vyvod"]:checked) [data-vid-predprosmotr="vyvod"],
.vid-okno:has([data-vid][value="kaskad"]:checked) [data-vid-predprosmotr="kaskad"],
.vid-okno:has([data-vid][value="nalozhenie"]:checked) [data-vid-predprosmotr="nalozhenie"],
.vid-okno:has([data-vid][value="indikator"]:checked) [data-vid-predprosmotr="indikator"]{display:block}
.vid-zametka{margin:0;padding:0 15px 12px;color:var(--ink-3);font-size:12px}
.vid-predprosmotr-odna .vid-zametka,.vid-zametka-otdelno{padding:12px 15px}
/* ── диаграмма в отчёте — по кнопке ─────────────────────────────
   Владелец 13.09.2026: «в отчёте диаграмма должна выводиться
   опционально, при нажатии на кнопку через выбор варианта». Окно то же,
   что у вида карточки главной; рисунки приходят, когда окно открыли. */
.diagramma-otcheta{margin:18px 0 0}
.diagramma-otcheta>.karta{margin-top:12px}
.diagramma-otcheta>.diagramma-malo{margin:8px 0 0}
.diagramma-knopka{display:inline-flex;align-items:center;gap:6px}
.diagramma-knopka svg{width:15px;height:15px;display:block;fill:currentColor}
/* Рисунок страницы шире рисунка карточки: варианты встают строкой над ним,
   а окно шире — рисунок идёт в свою ширину, а не ужатым. */
.vid-okno-otchet{width:min(76rem,96vw)}
.vid-okno-otchet .vid-telo{grid-template-columns:minmax(0,1fr)}
.vid-okno-otchet .vid-plitki{flex-direction:row;flex-wrap:wrap}
.vid-okno-otchet .vid-plitka{flex:1 1 12rem}
.vid-nastrojka{margin-top:22px;display:flex;flex-wrap:wrap;gap:6px}
.vid-nastrojka>.vid-legenda{flex:0 0 100%;margin:0 0 10px}
.vid-variant{position:relative;display:inline-flex;align-items:center;
  min-height:var(--organ-mal);padding:0 12px;border:1px solid var(--line);
  border-radius:var(--r-btn);cursor:pointer;color:var(--ink-2)}
.vid-variant:has(input:checked){border-color:var(--ink-2);background:var(--pale);color:var(--ink)}
.vid-variant:has(input:focus-visible){outline:2px solid var(--fokus);outline-offset:1px}
.vid-odna-stroka{margin:12px 0 0;color:var(--vnimanie)}
.vid-niz{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:14px}
@media (max-width:48rem){.vid-telo{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.vid-predprosmotry{transition:none}}
.karta-odna-stroka{margin:6px 0 0;font-size:12px}
/* Рисунок выбранного вида в теле карточки — с теми же полями, что у
   списка: без них подписи упирались в рамку карточки. Ширину рисунка
   сервер считает за вычетом этих полей (bloki.POLYA_KARTOCHKI). */
.karta-diagramma{padding:6px 15px 12px}
/* Место рисунка отчёта: сервер рисует в ширину места с шагом 40 px, а
   последние пиксели добирает стиль — растяжение меньше 3,5 %, буквы на
   глаз не меняются. Владелец 13.09.2026: «не на всю ширину экрана». */
.karta-diagramma[data-mesto-risunka] svg{width:100%;max-width:100%;height:auto}

/* В узкой карточке значков размера нет: ручка и крестик — всё, что
   помещается. Форму там меняют растягиванием за уголок и картой
   расположения. */
@container vidzhet (max-width:15rem){
  .yachejka-pult .razmery-vybor{display:none}
}

/* Выбор формы значками, как в iOS. Значок всегда обведён, выбранное
   отмечается плиткой ПОД ним: залитый значок читается как «нажми
   меня» — владелец нажал на уже выбранный и не получил ничего. */
/* Подложка только у выбранного. Владелец 12.09.2026: «подложку
   оставь только у выбранного». Общая подложка под всей группой
   спорила с плиткой под выбранным: два оттенка серого друг на друге
   читались как два состояния у каждого значка. */
.razmery-vybor{position:relative;display:inline-flex;align-items:center;
  gap:2px;padding:2px;margin:0 2px;flex:0 1 auto;min-width:0;
  border-radius:calc(var(--r-btn) + 2px);background:none}
.razmer-znak{position:relative;display:inline-flex;align-items:center;
  justify-content:center;flex:0 0 auto;
  height:calc(var(--organ-kroha) - 2px);
  padding:0 3px;border:0;border-radius:calc(var(--r-btn) - 1px);
  background:none;cursor:pointer;
  transition:background .22s var(--pruzhina)}
.razmer-znak svg{height:13px;width:auto;display:block;overflow:visible}
.razmer-znak .znak-ramka{fill:none;stroke:var(--ink-3);stroke-width:1.5}
.razmer-znak .znak-ugolok,.razmer-znak .znak-polosa{fill:var(--ink-3)}
.razmer-znak:hover .znak-ramka{stroke:var(--ink-2)}
.razmer-znak:hover .znak-ugolok,.razmer-znak:hover .znak-polosa{fill:var(--ink-2)}
/* Плитка под выбранным — единственная подложка в ряду. Цвет
   `--line`, а не `--paper`: в ночной теме `--paper` и фон пульта —
   один и тот же цвет, и плитка была бы невидима. */
.razmer-znak.vybran{background:var(--line);
  box-shadow:0 1px 2px rgba(0,0,0,.18)}
.razmer-znak.vybran .znak-ramka{stroke:var(--ink)}
.razmer-znak.vybran .znak-ugolok,.razmer-znak.vybran .znak-polosa{fill:var(--ink)}
.razmer-znak:active{transform:scale(.94)}
.razmer-znak:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}

/* ── размер тянется за край ────────────────────────────────────
   Уголок снизу справа и два края. Форма встаёт в ближайшую из
   четырёх: свободных размеров в наборе нет.                        */
.yachejka-ugol,.yachejka-kraj{display:none;position:absolute;z-index:4}
.nastraivaem.skript-zhiv .yachejka-ugol,
.nastraivaem.skript-zhiv .yachejka-kraj{display:block}
.yachejka-ugol{
  right:-2px;bottom:-2px;width:22px;height:22px;
  display:none;align-items:flex-end;justify-content:flex-end;
  color:var(--ink-3);cursor:nwse-resize;touch-action:none;
  border-radius:0 0 var(--r-card) 0}
.nastraivaem.skript-zhiv .yachejka-ugol{display:flex}
.yachejka-ugol svg{width:12px;height:12px;margin:0 3px 3px 0}
.yachejka-ugol:hover{color:var(--ink)}
.yachejka-kraj-prav{right:-3px;top:20%;width:8px;height:60%;
  cursor:ew-resize;touch-action:none}
.yachejka-kraj-niz{bottom:-3px;left:20%;height:8px;width:60%;
  cursor:ns-resize;touch-action:none}
.yachejka-kraj::after{content:"";position:absolute;inset:0;margin:auto;
  width:3px;height:100%;border-radius:2px;background:transparent;
  transition:background .14s ease}
.yachejka-kraj-niz::after{width:100%;height:3px}
.yachejka-kraj:hover::after{background:var(--fokus)}
/* Призрак целевой формы: пока тянут, видно, во что она встанет. */
/* Призрак отвечает на вопрос «что будет, если отпустить». Три
   ответа и три вида: встанет — обычный; поменяются — сплошная рамка
   вместо пунктира; нельзя — красный, и карточка вернётся. Без этого
   человек тянет вслепую и узнаёт об отказе, уже отпустив. */
.setka-prizrak{
  position:absolute;z-index:2;pointer-events:none;
  border:2px dashed var(--fokus);border-radius:var(--r-card);
  background:var(--fokus-fon);
  transition:left .12s ease,top .12s ease,width .12s ease,height .12s ease}
.setka-prizrak.prizrak-obmen,.setka-prizrak.prizrak-sdvig{border-style:solid}
.setka-prizrak.prizrak-nelzya{
  border-color:var(--red);background:var(--red-50)}
@media (prefers-reduced-motion:reduce){.setka-prizrak{transition:none}}
.yachejka.tyanem{z-index:5}
.yachejka.tyanem>.karta{box-shadow:0 14px 34px rgba(0,0,0,.28)}

/* ── перелёт карточек при переносе ─────────────────────────────
   Запомнить, где все стояли, переставить, вернуть каждого на кадр
   назад и отпустить — дальше они доезжают сами.                    */
.setka-glavnoj.nastraivaem>.yachejka{
  transition:transform var(--perelyot,.26s) var(--pruzhina)}
/* **Вес селектора здесь решает всё.** Правило ряда выше состоит из
   трёх классов, и короткое `.yachejka.letit` из двух ему проигрывало:
   несомая карточка ехала с переходом, то есть плелась за курсором. */
.setka-glavnoj.nastraivaem>.yachejka.letit{opacity:.92;z-index:6;
  transition:none;
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.35))}
.setka-glavnoj.nastraivaem>.yachejka.saditsya{
  transition:transform var(--perelyot,.26s) var(--pruzhina)}
.yachejka.mesto{outline:2px solid var(--fokus);outline-offset:-2px;
  border-radius:var(--r-card)}
@media (prefers-reduced-motion:reduce){
  .setka-glavnoj.nastraivaem>.yachejka,
  .setka-glavnoj.nastraivaem>.yachejka.saditsya{transition:none}
  .yachejka.letit{transform:none}
  .razmer-znak{transition:none}
  .razmer-znak:active{transform:none}
  .setka-prizrak{transition:none}
}

/* ══ галерея виджетов ═══════════════════════════════════════════
   Устроена как галерея виджетов macOS, снимок которой владелец
   прислал 12.09.2026: слева список источников с поиском, справа
   образцы с выбором формы. Свалка из двух десятков карточек в один
   столбец — это список, а не каталог.                              */
/* ── окно галереи и карты: одна форма, не две ──────────────────
   Владелец 12.09.2026: «получается форма в форме, давай оставим
   только внутреннюю». У окна были своя рамка, своё поле и свой низок
   с «Закрыть», а внутри — рамка галереи. Снаружи остаётся только
   тонкая шапка: имя слева, крестик справа. */
.okno-galerei,.okno-karty{padding:0;gap:0;overflow:hidden}
.okno-shapka{
  display:flex;align-items:center;gap:12px;
  padding:12px 12px 12px 18px;border-bottom:1px solid var(--line)}
.okno-shapka h2{margin:0;font-size:16px;letter-spacing:-.01em;flex:1 1 auto}
.okno-krestik{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-mal);height:var(--organ-mal);
  padding:0;border:0;border-radius:var(--r-btn);
  background:none;color:var(--ink-3);cursor:pointer;
  transition:background .14s ease,color .14s ease}
.okno-krestik:hover{background:var(--pale);color:var(--ink)}
.okno-krestik:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.okno-krestik svg{width:16px;height:16px;display:block}
/* Внутренняя рамка снята: она и была второй формой. */
.okno-galerei .galereya{border:0;border-radius:0}
.okno-karty .karta-mesta-korob{padding:16px 18px 18px}
/* Карта шире: в клетке в восемьдесят точек содержимого не разглядеть.
   Прокручивается тело, а шапка с крестиком остаётся на месте. */
.modalka-okno.shirokoe.okno-karty{width:min(1280px,96vw);
  display:flex;flex-direction:column;overflow:hidden}
.okno-karty [data-karta-telo]{flex:1 1 auto;min-height:0;
  overflow-y:auto;overscroll-behavior:contain}
/* Окно берёт фокус на себя при открытии: обведённой плитки не будет. */
.okno-karty:focus{outline:none}

.galereya{
  display:grid;
  grid-template-columns:minmax(0,13.5rem) minmax(0,1fr);
  gap:0;
  min-height:min(60vh,26rem);
  border:1px solid var(--line);border-radius:var(--r-card);
  overflow:hidden;background:var(--paper);
}
.galereya-bok{
  display:flex;flex-direction:column;gap:4px;
  padding:10px;border-right:1px solid var(--line);
  background:var(--pale);
  max-height:min(62vh,28rem);overflow-y:auto;overscroll-behavior:contain;
}
.galereya-poisk{width:100%;height:var(--organ-mal);padding:0 10px;
  font:400 13px/1 var(--shrift);color:var(--ink);
  border:1px solid var(--line);border-radius:var(--r-btn);
  background:var(--paper)}
.galereya-poisk:focus{outline:none;border-color:var(--fokus);
  box-shadow:0 0 0 3px var(--fokus-fon)}
.galereya-istochnik{
  display:flex;align-items:center;gap:8px;
  padding:7px 9px;border:0;border-radius:var(--r-btn);
  background:none;color:var(--ink-2);cursor:pointer;text-align:left;
  font:400 13.5px/1.3 var(--shrift);width:100%}
.galereya-istochnik:hover{background:var(--line)}
.galereya-istochnik.est{background:var(--line);color:var(--ink);font-weight:600}
.galereya-istochnik .skolko{margin-left:auto;color:var(--ink-3);font-size:12px;
  font-variant-numeric:tabular-nums}
.galereya-istochnik svg{width:16px;height:16px;flex:0 0 auto;
  fill:none;stroke:currentColor;stroke-width:1.4}

.galereya-polotno{
  padding:14px;max-height:min(62vh,28rem);
  overflow-y:auto;overscroll-behavior:contain}
.galereya-gruppa{margin:0 0 18px}
/* В «Все виджеты» группы идут подряд, и заголовок следующей не должен
   прилипать к последнему пункту предыдущей — владелец 13.09.2026. */
.okno-galerei .galereya-gruppa{margin:0 0 48px}
.galereya-gruppa:last-child{margin-bottom:0}
.galereya-zagolovok{
  display:flex;align-items:baseline;gap:10px;
  margin:0 0 10px;padding-bottom:6px;border-bottom:1px solid var(--line);
  font:500 10.5px/1.4 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3)}
.galereya-zagolovok .otkuda{text-transform:none;letter-spacing:0;
  font-family:var(--shrift);font-size:12px}
.galereya-spisok{display:grid;gap:12px;
  grid-template-columns:repeat(auto-fill,minmax(14rem,1fr))}
.galereya-punkt{display:flex;flex-direction:column;gap:7px;
  padding:12px;border:1px solid var(--line);border-radius:var(--r-card);
  background:var(--paper)}
.galereya-punkt b{font-size:14px;line-height:1.3}
.galereya-punkt .vopros{color:var(--ink-2);font-size:12.5px;line-height:1.4}
.galereya-punkt .uzhe{color:var(--ink-3);font-size:12px}
/* Выбор формы прямо в образце: человек ставит карточку сразу такой,
   какой она ему нужна, а не правит её потом на главной. */
.galereya-formy{display:flex;align-items:center;gap:3px;margin-top:auto;
  padding:2px;border-radius:calc(var(--r-btn) + 2px);background:var(--pale);
  width:max-content}
.galereya-pusto{padding:24px 14px;color:var(--ink-3);font-size:13.5px}

/* ── галерея крупнее, образцы — сами карточки, 13.09.2026 ────────
   Владелец: «давай сделаем повыше и пошире… каталог предлагает просто
   текстом виджеты, а они отображаются информацией или диаграммами».
   Окно — 1200 × 900 в пределах экрана, области прокручиваются сами.
   Образец — карточка в стольной сетке (1160 px), уменьшенная скриптом до
   ширины плитки; XL занимает весь ряд, иначе он в четверть масштаба. */
.modalka-okno.shirokoe.okno-galerei{width:min(1680px,96vw);height:min(92vh,1100px);
  max-height:none;display:flex;flex-direction:column;overflow:hidden}
.okno-galerei [data-galereya-telo]{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.okno-galerei .galereya{flex:1 1 auto;min-height:0;grid-template-rows:minmax(0,1fr)}
.okno-galerei .galereya-bok,.okno-galerei .galereya-polotno{max-height:none;min-height:0}
/* ── каталог в масштабе главной ─────────────────────────────────
   Владелец 13.09.2026: «сделай плиточный каталог шириной в самый
   широкий… все должно быть натурально размерам главной но в масштабе»;
   следом — «смотри сколько рамок, сделай чтобы все четко отображалось».

   Пункт во всю ширину каталога, и масштаб один на всех: полотно главной
   ложится в эту ширину, поэтому XL встаёт во весь ряд, а S рядом с ним
   такой же, как на главной. Полотно образца — настоящая ширина сетки на
   этой же странице: карточка встаёт в те же клетки и переносит строки там
   же. Рамка у пункта одна — сама карточка; пункты разделены чертой. */
.okno-galerei .galereya-spisok{grid-template-columns:minmax(0,1fr);gap:0}
.okno-galerei .galereya-punkt{display:grid;
  grid-template-columns:auto minmax(12rem,1fr);grid-template-rows:auto 1fr;
  column-gap:28px;row-gap:10px;align-items:start;
  padding:22px 0;border:0;border-radius:0;background:none}
.okno-galerei .galereya-punkt+.galereya-punkt{border-top:1px solid var(--line)}
.okno-galerei .galereya-punkt>.galereya-obrazec{grid-row:1/span 2}
.okno-galerei .galereya-punkt.forma-XL{grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto}
.okno-galerei .galereya-punkt.forma-XL>.galereya-obrazec{grid-row:auto}
.okno-galerei .galereya-organy{align-self:end}
.galereya-obrazec{position:relative;overflow:hidden;min-height:0;
  border-radius:var(--r-card);background:none;box-shadow:none}
/* Пока рисуется — место под образец по форме, чтобы список не прыгал. */
.galereya-obrazec.zhdyot,.galereya-obrazec.pusto{
  background:color-mix(in srgb,var(--line) 55%,transparent)}
.obrazec-masshtab{width:1520px;container-type:inline-size;container-name:polotno;
  transform-origin:0 0;pointer-events:none}
.obrazec-setka{margin:0}
.obrazec-zhdyot,.obrazec-pusto{margin:0;padding:14px;color:var(--ink-3);font-size:12.5px;max-width:none}
.galereya-obrazec.zhdyot::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,transparent 20%,var(--vydelenie) 48%,transparent 76%);
  background-size:220% 100%;animation:volna-ozhidaniya 1.1s linear infinite}
.galereya-imya{display:flex;flex-direction:column;gap:3px}
.galereya-organy{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:auto}
.galereya-organy .galereya-formy{margin-top:0}
.galereya-stoit{color:var(--ink-3);font-size:12px;margin-left:auto}
.galereya-organy .knopka{margin-left:auto}
.galereya-ubrat{display:inline-flex;align-items:center;justify-content:center;
  width:var(--organ-kroha);height:var(--organ-kroha);padding:0;border:0;
  border-radius:999px;background:var(--line);color:var(--ink-2);cursor:pointer;
  transition:background .14s ease,color .14s ease,transform .14s var(--plavno)}
.galereya-ubrat:hover{background:var(--line-2);color:var(--ink)}
.galereya-ubrat:active{transform:scale(.94)}
.galereya-ubrat:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.galereya-ubrat svg{width:14px;height:14px;display:block}
@media (prefers-reduced-motion:reduce){
  .galereya-obrazec.zhdyot::after{animation:none;background:none}
  .galereya-ubrat{transition:none}
}

@media (max-width:700px){
  /* На телефоне два столбца не помещаются: источники становятся
     рядом таблеток над полотном, как вкладки. */
  .galereya{grid-template-columns:minmax(0,1fr)}
  .galereya-bok{
    flex-direction:row;flex-wrap:nowrap;overflow-x:auto;
    max-height:none;border-right:0;border-bottom:1px solid var(--line)}
  .galereya-istochnik{width:auto;white-space:nowrap}
  .galereya-poisk{min-width:9rem}
  .galereya-spisok{grid-template-columns:minmax(0,1fr)}
  .modalka-okno.shirokoe.okno-galerei{width:100%;height:88vh}
  .okno-galerei .galereya{grid-template-rows:auto minmax(0,1fr)}
  .okno-galerei .galereya-spisok{grid-template-columns:minmax(0,1fr)}
  .okno-galerei .galereya-punkt{grid-template-columns:minmax(0,1fr)}
  .okno-galerei .galereya-punkt>.galereya-obrazec{grid-row:auto}
}

/* ══ фабрика виджетов ════════════════════════════════════════════
   Задание владельца 13.09.2026, пункт 4. Страница виджета показывает
   четыре формы в натуральную величину стольной сетки (клетка 131 px,
   зазор 16): S и M сверху, L и XL снизу. Раскладка шире страницы и
   уменьшается скриптом (`data-masshtab`), чтобы все четыре стояли на
   одном экране; без скрипта прокручивается вбок.                    */
.fabrika-plitki{grid-template-columns:repeat(auto-fit,minmax(12rem,1fr))}
.fabrika-sobrat{display:flex;flex-direction:column;justify-content:center;gap:6px}
.fabrika-chip{display:inline-flex;align-items:center;margin:2px 6px 2px 0;padding:2px 9px;
  border-radius:999px;background:var(--line);color:var(--ink);font-size:12.5px;
  line-height:1.5;text-decoration:none;white-space:nowrap}
a.fabrika-chip:hover{background:var(--line-2);text-decoration:none}
.fabrika-chip.sobran{box-shadow:inset 0 0 0 1px var(--kraj)}
.fabrika-chip.potok{background:var(--pale);box-shadow:inset 0 0 0 1px var(--line)}
.fabrika-cepochka{display:flex;flex-wrap:wrap;align-items:center;gap:2px 4px}
.fabrika-otkuda{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding:8px 15px 0}
/* Сорок потоков с именами и виджетами: строка переносится, а не возит
   таблицу вбок на экране 1440. */
.reestr.fabrika-potoki td{white-space:normal}
.reestr.fabrika-potoki td.uzkaya{white-space:nowrap}
/* Кнопки строки — в своём ящике внутри ячейки: `display:flex` на самой
   ячейке вынимал её из строки таблицы, и столбец ехал отдельной полосой. */
.fabrika-dejstviya{display:flex;gap:6px;align-items:center;white-space:nowrap}
.reestr.fabrika-razdely td{vertical-align:middle}
.fabrika-razdely input[type=text]{width:100%;min-width:10rem}
.fabrika-razdel-vybor{display:flex;align-items:center;gap:8px}
/* ── ИИ помощник фабрики ─────────────────────────────────────────── */
.fabrika-pomoshchnik .karta-imya{display:inline-flex;align-items:center;gap:8px}
.pomoshchnik-forma{display:flex;align-items:flex-end;gap:10px;padding:12px 15px}
.pomoshchnik-forma textarea{flex:1 1 auto;min-height:var(--organ);padding:9px 12px;
  font:400 14px/1.4 var(--shrift);color:var(--ink);resize:vertical;
  border:1px solid var(--kraj-polya,var(--line-2));border-radius:var(--r-btn);background:var(--paper)}
.pomoshchnik-forma textarea:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.pomoshchnik-beda{flex:1 1 100%;margin:0;color:var(--red);font-size:13px}
.pomoshchnik-lenta{list-style:none;margin:0;padding:0 15px 12px;display:grid;gap:12px}
.pomoshchnik-prosba{padding:10px 12px;border-radius:var(--r-card);background:var(--pale)}
.pomoshchnik-vopros{margin:0 0 6px;font-weight:600}
.pomoshchnik-predlozhenie p,.pomoshchnik-otkaz,.pomoshchnik-zhdyom{margin:0 0 6px}
/* Образец — форма M в натуральную величину стольной сетки, как на фабрике. */
.pomoshchnik-obrazec{margin:8px 0;container-type:inline-size;container-name:polotno;width:572px;max-width:100%}
.pomoshchnik-obrazec .setka-glavnoj.fabrika-setka{margin:0;--zazor:8px;--kolonok:12}
.pomoshchnik-obrazec .yachejka-M{grid-column-end:span 12;grid-row-end:span 8}
.pomoshchnik-primenit{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.fabrika-razdel-vybor select{min-width:14rem}
/* Панель разделов окном на странице виджета: та же форма, что на фабрике. */
.fabrika-razdely-okno{width:min(880px,94vw);padding:0}
.fabrika-razdely-okno>.karta{margin:0;border:0}
.fabrika-masshtab{overflow-x:auto;padding:12px 15px 16px}
.fabrika-kompoziciya{display:flex;flex-direction:column;gap:18px;width:max-content;
  transform-origin:0 0}
.fabrika-ryad{display:flex;gap:16px;align-items:flex-start}
.fabrika-forma-imya{margin:0 0 6px;font:500 10.5px/1.4 var(--cifry);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3)}
.fabrika-forma-polotno{container-type:inline-size;container-name:polotno}
.fabrika-forma-S .fabrika-forma-polotno{width:278px}
.fabrika-forma-M .fabrika-forma-polotno,.fabrika-forma-L .fabrika-forma-polotno{width:572px}
.fabrika-forma-XL .fabrika-forma-polotno{width:1160px}
.fabrika-forma .setka-glavnoj.fabrika-setka{margin:0;--zazor:8px}
.fabrika-forma-S .setka-glavnoj.fabrika-setka{--kolonok:8}
.fabrika-forma-M .setka-glavnoj.fabrika-setka{--kolonok:12}
.fabrika-forma-L .setka-glavnoj.fabrika-setka{--kolonok:24}
.fabrika-forma-XL .setka-glavnoj.fabrika-setka{--kolonok:48}
.fabrika-forma .yachejka-S{grid-column-end:span 8;grid-row-end:span 5}
.fabrika-forma .yachejka-M{grid-column-end:span 12;grid-row-end:span 8}
.fabrika-forma .yachejka-L{grid-column-end:span 24;grid-row-end:span 12}
.fabrika-forma .yachejka-XL{grid-column-end:span 48;grid-row-end:span 12}
.fabrika-polya{display:flex;flex-wrap:wrap;gap:10px 14px;padding:12px 15px}
.fabrika-polya .fabrika-dlinnoe{flex:1 1 22rem}
.fabrika-polya input[name=imya]{width:20rem;max-width:100%}
.fabrika-polya .fabrika-dlinnoe input{width:100%}
.fabrika-vidy{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:4px 15px 12px;border:0}
.fabrika-vidy .vid-plitka{flex:1 1 14rem}
.fabrika-galki{display:flex;flex-wrap:wrap;gap:6px 22px;padding:0 15px 12px}
.fabrika-udalit{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 18px}
.fabrika-nabory{display:grid;gap:12px;padding:4px 15px 12px;
  grid-template-columns:repeat(auto-fill,minmax(16rem,1fr))}
.fabrika-nabor{margin:0;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-card)}
.fabrika-nabor.vybran{box-shadow:inset 0 0 0 2px var(--fokus)}
.fabrika-nabor legend{padding:0 6px;font-weight:600;font-size:13.5px}

/* ══ карта расположения ═════════════════════════════════════════
   Вторая кнопка рядом с «Настроить». Главная целиком в уменьшенном
   виде: восемь колонок, каждая карточка — прямоугольник со своим
   именем. Правит тот же черновик, что и сама главная.              */
.karta-mesta-korob{container-type:inline-size;container-name:karta-mest}
/* Число колонок — классом: встроенный стиль правило содержимого не
   пускает, и `--kolonok` до карты не доезжал вовсе — она рисовала
   восемь колонок и на планшете, и на телефоне. */
.karta-mesta.kolonok-12{--kolonok:12}
.karta-mesta.kolonok-24{--kolonok:24}
.karta-mesta.kolonok-32{--kolonok:32}
.karta-mesta.kolonok-48{--kolonok:48}
/* Места на карте — те же классы, что и на главной, но свои: у карты
   своя сетка, и чужое правило её бы не нашло. */

.karta-mesta{
  /* Клетка карты квадратная — как и на самой главной. Иначе S на
     карте лежачий прямоугольник, и карта врёт о форме. */
  --mini-zazor:2px;
  --mini-kletka:calc((100cqw - 20px
                      - (var(--kolonok,48) - 1) * var(--mini-zazor))
                     / var(--kolonok,48));
  display:grid;gap:var(--mini-zazor);
  grid-template-columns:repeat(var(--kolonok,48),minmax(0,1fr));
  grid-auto-rows:var(--mini-kletka);
  /* Самоукладки нет и на карте: карта — уменьшенная главная, и
     двигать на ней то, чего не двигают там, значит врать. */
  grid-auto-flow:row;
  /* Призрак места лежит внутри поля и считает место от него. */
  position:relative;
  padding:10px;border:1px solid var(--line);border-radius:var(--r-card);
  background-image:linear-gradient(var(--setka) 1px,transparent 1px),
                   linear-gradient(90deg,var(--setka) 1px,transparent 1px);
  background-size:100% calc(var(--mini-kletka) + var(--mini-zazor)),
                  calc((100% + var(--mini-zazor)) / var(--kolonok,48)) 100%;
  background-position:10px 10px;
  background-color:var(--pale);
}
/* Протяжённость концом — по той же причине, что и на главной:
   начало приходит классом места. */
.mesta-S{grid-column-end:span 8;grid-row-end:span 5}
.mesta-M{grid-column-end:span 12;grid-row-end:span 8}
.mesta-L{grid-column-end:span 24;grid-row-end:span 12}
.mesta-XL{grid-column-end:span 48;grid-row-end:span 12}
/* Плитка — сама карточка главной в масштабе карты. Владелец 13.09.2026:
   «нет содержания виджетов и двигать их очень неудобно… так же они не
   летают по карте». Переход у плитки не постоянный, а только на время
   перелёта: иначе несомая плелась бы за указателем. */
.mesta-plitka{
  position:relative;display:block;min-width:0;min-height:0;
  border-radius:calc(var(--r-card) * .72);cursor:grab;
  touch-action:none;-webkit-user-select:none;user-select:none}
.mesta-plitka:focus-visible{outline:2px solid var(--fokus);outline-offset:2px}
.mesta-obrazec{position:absolute;inset:0;overflow:hidden;
  border-radius:inherit;pointer-events:none;transition:opacity .16s ease}
.mesta-obrazec .obrazec-masshtab{position:absolute;left:0;top:0}
.mesta-plitka.zhdyot .mesta-obrazec{opacity:.35}
/* Карточке, которой сегодня нечего показать, копировать нечего: плитка
   остаётся рамкой с именем. */
.mesta-plitka:not(.s-obrazcom){border:1px dashed var(--line-2);background:var(--paper)}
.mesta-plitka .mesta-imya{position:absolute;left:10px;right:10px;top:8px;
  font-weight:600;font-size:12px;line-height:1.25;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden}
.mesta-plitka.s-obrazcom .mesta-imya{display:none}
.mesta-formy{position:absolute;left:6px;bottom:6px;z-index:1;
  display:flex;align-items:center;gap:1px;
  padding:2px;border-radius:var(--r-btn);background:var(--paper);
  box-shadow:0 0 0 1px var(--line),0 2px 6px rgba(17,19,24,.16)}
.mesta-formy .razmer-znak{height:22px;padding:0 3px}
/* Значки формы закрывали угол карточки на каждой плитке. Мышью они
   появляются под указателем и при обходе Tab; пальцу — всегда. */
@media (hover:hover){
  .mesta-plitka.s-obrazcom .mesta-formy{opacity:0;transition:opacity .14s ease}
  .mesta-plitka.s-obrazcom:hover .mesta-formy,
  .mesta-plitka.s-obrazcom:focus-within .mesta-formy{opacity:1}
}
.mesta-formy .razmer-znak svg{height:10px}
.mesta-plitka.letit{z-index:6;cursor:grabbing}
.mesta-plitka.letit .mesta-obrazec{box-shadow:0 14px 32px rgba(0,0,0,.3)}
.mesta-plitka.saditsya{z-index:4;
  transition:transform var(--perelyot,.24s) var(--pruzhina)}
/* Сосед того же размера, с которым отпущенная поменяется местами. */
.mesta-plitka.mesta-obmen .mesta-obrazec{opacity:.5}
.mesta-prizrak{border-radius:calc(var(--r-card) * .72)}
.mesta-pusto{grid-column:1/-1;padding:18px;text-align:center;
  color:var(--ink-3);font-size:13px}
.mesta-nizok{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;
  margin-top:12px}
.mesta-nizok .tiho{flex:1 1 12rem;font-size:12.5px}
@media (prefers-reduced-motion:reduce){
  .mesta-plitka.saditsya,.mesta-obrazec,.mesta-formy{transition:none}
}

/* ══ телефон: правила iOS, а не уменьшенный рабочий стол ════════
   Владелец 12.09.2026: «мобильная версия у нас прям вообще не
   удобная, все не по правилам — переделай».

   Что изменилось по сути: сетка стала четырёхколоночной, как на
   домашнем экране iOS (два квадрата S в ряд, M и L во всю ширину),
   фильтры остались одной строкой с боковой прокруткой, а модальные
   окна встают листом снизу — так их открывает всякое приложение на
   телефоне, и палец достаёт до кнопок.                             */
@media (max-width:700px){
  /* Лист снизу вместо окна посередине. Верхний край скруглён,
     нижний прижат к краю экрана, поля учитывают вырез. */
  .modalka-okno{
    top:auto;bottom:0;left:0;
    transform:none;width:100%;max-width:100%;
    max-height:88vh;overflow-y:auto;overscroll-behavior:contain;
    border-radius:var(--r-block) var(--r-block) 0 0;
    border-left:0;border-right:0;border-bottom:0;
    padding:16px 16px calc(16px + env(safe-area-inset-bottom));
  }
  .modalka-okno.shirokoe{width:100%;max-height:88vh}
  /* Ручка листа: серая чёрточка сверху. Она не орган — она говорит,
     что это лист, и что его закрывают вниз. */
  .modalka-okno::before{
    content:"";display:block;width:36px;height:4px;margin:-4px auto 10px;
    border-radius:2px;background:var(--line-2)}
}

@media (max-width:767px){
  /* Поля полотна учитывают вырез и скруглённые углы экрана. */
  #setka-korob{
    padding-left:env(safe-area-inset-left);
    padding-right:env(safe-area-inset-right);
  }
  /* Шесть иконок строки помещаются и на телефоне; состояние ужимается
     многоточием, а не переносит строку на второй этаж. */
  .nastrojka-shapka .polozhenie{font-size:12px;padding-right:6px}
  .nastrojka-panel::after{margin:0 4px}
}

/* Палец — не мышь: цель нажатия не меньше сорока четырёх точек.
   Спрашиваем про указатель, а не про ширину экрана: на планшете с
   мышью мелкие органы удобнее, на телефоне с пером — тоже. */
/* Палец: ручка и крестик — сорок четыре точки, как велит iOS. Это
   отдельно стоящие цели, и меньше им нельзя. Значки формы — не
   отдельные цели, а сегментный переключатель; у Apple он 32 pt, и
   ровнять его по 44 значит выкинуть его из узкой карточки вовсе. */
@media (pointer:coarse){
  .yachejka-pult{--pult-h:44px;height:44px;gap:2px}
  .setka-glavnoj.nastraivaem>.yachejka{grid-template-rows:44px minmax(0,1fr)}
  .yachejka-ruchka,.yachejka-ubrat{width:44px;height:44px}
  .razmer-znak{height:34px;padding:0 5px}
  .yachejka-ugol{width:34px;height:34px}
  .yachejka-ugol svg{width:14px;height:14px}
  .yachejka-kraj-prav{width:14px;right:-5px}
  .yachejka-kraj-niz{height:14px;bottom:-5px}
  .mesta-plitka{min-height:34px}
  .galereya-istochnik{min-height:40px}
}

/* ── мелочи, что видны только рядом ────────────────────────────
   Замерено на живой главной 12.09.2026.

   **`.karta.tempo` съезжала на двадцать пикселей.** У неё своё поле
   сверху, заведённое тогда, когда карточка планов стояла отдельно, а
   не в ряду. В сетке это давало ровно то, на что владелец показал:
   две соседние шапки на разных уровнях. Поле снимается — договор
   шапки один на всех. */
.setka-glavnoj .karta.tempo{padding:0}

/* **Двойное поле у ряда органов.** Своё есть и у `.karta-organy`, и
   у `.grafik-upravlenie` внутри — пятнадцать плюс пятнадцать. Внутри
   карточки поле держит только внешний. */
.karta-organy .grafik-upravlenie{padding-left:0;padding-right:0;
  border-bottom:0}
.karta-organy .grafik-otbor{padding:0}

/* ── Ход строки таблицы: точки с карточками ─────────────────────
   Владелец 13.09.2026 про сегменты планов: «нет точек, на которые я бы
   мог навести и посмотреть детали в форме». Точки те же, что у шкалы
   плана, карточка — разметкой того же вида, что рисованная: тёмная,
   имя слева, число справа. Место точки — класс `zasechka-N`. */
.segmenty-plana .hod-stolb{width:38%;min-width:220px}
.hod{position:relative;display:block;padding:9px 0}
.hod .ryad-zhelob{height:8px}
/* Полоса прогноза — своим именем: `hod-prognoz` носит точка прогноза, и
   общее имя сдвигало точку в начало полосы и гасило её. */
.hod-prognoz-polosa{position:absolute;left:0;top:0;height:100%;border-radius:99px;
  background:var(--ink-2);opacity:.22}
.hod-tochka{position:absolute;top:50%;width:22px;height:22px;margin:-11px 0 0 -11px;
  padding:0;border:0;background:none;cursor:pointer;border-radius:50%}
.hod-tochka::after{content:"";position:absolute;left:6px;top:6px;width:10px;height:10px;
  border-radius:50%;background:var(--paper);box-shadow:inset 0 0 0 2px var(--ink-2);
  transition:transform .12s ease}
.seg-ryad.gorit .hod-tochka::after{box-shadow:inset 0 0 0 2px var(--red)}
.hod-tochka:hover::after,.hod-tochka:focus-visible::after{transform:scale(1.25)}
.hod-tochka:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.hod-karta{display:none;position:absolute;bottom:calc(100% + 8px);left:50%;
  transform:translateX(-50%);z-index:5;min-width:196px;max-width:360px;
  padding:10px 12px 12px;border-radius:12px;background:var(--ink);color:var(--paper);
  text-align:left;white-space:nowrap;pointer-events:none;
  box-shadow:0 10px 30px rgba(17,19,24,.25)}
.hod-tochka:hover .hod-karta,.hod-tochka:focus-visible .hod-karta{display:block}
.hod-karta[popover]{position:fixed;inset:auto;margin:0;transform:none;bottom:auto;
  border:0;overflow:visible}
.hod-karta[popover]:popover-open{display:block}
.hod-karta-zag{display:block;margin:0 0 6px;font:600 12.5px/1.3 var(--shrift)}
.hod-karta-stroka{display:flex;justify-content:space-between;gap:20px;
  font:400 12px/1.5 var(--shrift);color:var(--podskazka-tiho)}
.hod-karta-stroka b{color:var(--paper);font:600 12.5px/1.5 var(--cifry)}
@media (prefers-reduced-motion:reduce){.hod-tochka::after{transition:none}}

/* ── Блокнот (13.09.2026) ─────────────────────────────────────────────
   Форма — «Заметок» macOS по снимку владельца: папки, заметки по месяцам,
   открытая заметка с панелью значков, заголовок и текст без рамок. Цвета —
   портала, не Apple: владелец — «зачем оранжевый сделал? Переделывай под
   наши цветовые решения», и следом — «формы сделай такие же». Выбранная
   папка — красной плашкой, выбранная заметка — серой, кружок «сделано» — красный. */
.bloknot{display:grid;grid-template-columns:minmax(210px,260px) minmax(270px,340px) minmax(0,1fr);
  min-height:min(80vh,880px);margin:0 0 18px;border:1px solid var(--line);border-radius:var(--r-block);
  background:var(--paper);overflow:hidden;box-shadow:0 1px 2px rgba(17,19,24,.05),0 8px 24px -12px rgba(17,19,24,.18)}
.bloknot-papki{display:flex;flex-direction:column;min-width:0;padding:0 10px 14px;background:var(--pale);
  border-right:1px solid var(--line);overflow:auto;overscroll-behavior:contain}
.bloknot-spisok{display:flex;flex-direction:column;min-width:0;min-height:0;border-right:1px solid var(--line)}
.bloknot-redaktor{display:flex;flex-direction:column;min-width:0}
.bloknot-shapka{display:flex;align-items:center;gap:8px;min-height:56px;padding:8px 10px 8px 12px}
.bloknot-papki .bloknot-shapka{padding:8px 0 4px 8px;min-height:48px}
.bloknot-razdel{flex:1 1 auto;font-size:12px;font-weight:600;color:var(--ink-3)}
.bloknot-shapka-imya{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;line-height:1.3}
.bloknot-shapka-imya b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bloknot-shapka-imya span{font-size:12px}
.bloknot-kruglaya{border-radius:50%;border:1px solid var(--line)}
.bloknot-papki-spisok,.bloknot-zametki{list-style:none;margin:0;padding:0}
/* Строки папок не слипаются: выбранная и под указателем — плашками с зазором. */
.bloknot-papki-spisok{display:flex;flex-direction:column;gap:3px}
.bloknot-papka{position:relative;display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--r-btn);
  color:var(--ink);font-size:14px;line-height:1.35}
.bloknot-papka-ssylka{display:flex;align-items:center;gap:9px;flex:1 1 auto;min-width:0;color:inherit;text-decoration:none}
.bloknot-papka-ssylka:hover{text-decoration:none;color:inherit}
/* Вся строка — ссылка на папку; галочка «виджет» стоит поверх неё своей кнопкой. */
.bloknot-papka-ssylka::after{content:"";position:absolute;inset:0;border-radius:inherit}
.bloknot-papka form{position:relative;z-index:1;display:flex}
.bloknot-galka{display:inline-flex;align-items:center;gap:5px;padding:3px 6px;border:0;border-radius:var(--r-badge);
  background:none;color:var(--ink-3);font:inherit;font-size:11.5px;line-height:1;cursor:pointer;opacity:0}
/* Всегда видна только поставленная галочка; остальные — под указателем. */
.bloknot-papka:hover .bloknot-galka,.bloknot-galka.vklyuchena,
.bloknot-galka:focus-visible{opacity:1}
@media (hover:none){.bloknot-galka{opacity:1}}
.bloknot-galka:hover{background:var(--line)}
.bloknot-galka:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.bloknot-galka-kvadrat{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;
  border:1.5px solid currentColor;border-radius:4px}
.bloknot-galka-kvadrat svg{width:10px;height:10px;fill:none;stroke:currentColor;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round;opacity:0}
.bloknot-galka.vklyuchena .bloknot-galka-kvadrat svg{opacity:1}
.bloknot-papka.vybrana .bloknot-galka{color:#fff}
.bloknot-papka.vybrana .bloknot-galka:hover{background:rgba(255,255,255,.2)}
/* «⋯» папки — в её строке, как у «Заметок»: видно под указателем. */
.bloknot-papka-menyu{position:relative;z-index:1;width:24px;height:24px;opacity:0}
.bloknot-papka:hover .bloknot-papka-menyu,.bloknot-papka-menyu:focus-visible{opacity:1}
@media (hover:none){.bloknot-papka-menyu{opacity:1}}
.bloknot-papka.vybrana .bloknot-papka-menyu{color:#fff}
.bloknot-papka.vybrana .bloknot-papka-menyu:hover{background:rgba(255,255,255,.2);color:#fff}
.bloknot-papka:hover{background:var(--line);text-decoration:none}
.bloknot-papka.vybrana,.bloknot-papka.vybrana:hover{background:var(--red);color:#fff}
.bloknot-papka-ssylka:focus-visible,.bloknot-stroka:focus-visible{outline:2px solid var(--fokus);outline-offset:-2px}
.bloknot-znak{flex:0 0 auto;width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.35;
  stroke-linejoin:round;stroke-linecap:round;color:var(--ink-2)}
.bloknot-papka.vybrana .bloknot-znak,.bloknot-papka.vybrana .bloknot-schet,.bloknot-papka.vybrana .bloknot-metka{color:#fff}
.bloknot-papka-imya{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bloknot-schet{flex:0 0 auto;font-variant-numeric:tabular-nums;color:var(--ink-3);font-size:13px}
.bloknot-metka{flex:0 0 auto;font-size:11px;color:var(--ink-3)}
.bloknot-spisok-telo{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 10px 14px}
.bloknot-gruppa{margin:16px 8px 0;padding:0 0 8px;font-size:15px;font-weight:700;color:var(--ink);
  border-bottom:1px solid var(--line)}
.bloknot-stroka{display:flex;flex-direction:column;gap:2px;padding:10px 14px;border-radius:var(--r-btn);
  color:var(--ink);text-decoration:none;position:relative}
.bloknot-zametki li+li .bloknot-stroka::before{content:"";position:absolute;left:14px;right:8px;top:0;
  border-top:1px solid var(--line)}
.bloknot-stroka:hover{background:var(--pale);text-decoration:none}
.bloknot-stroka.vybrana,.bloknot-stroka.vybrana:hover{background:var(--line)}
.bloknot-stroka.vybrana::before,.bloknot-zametki li:has(.vybrana)+li .bloknot-stroka::before{border-color:transparent}
.bloknot-stroka-zagolovok{font-weight:700;font-size:14px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bloknot-stroka-niz,.bloknot-vidzhet-niz{display:flex;gap:8px;min-width:0;font-size:13px;line-height:1.35;color:var(--ink-3)}
.bloknot-stroka-niz time,.bloknot-vidzhet-niz time{flex:0 0 auto;font-variant-numeric:tabular-nums;color:var(--ink-2)}
.bloknot-prevyu{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bloknot-bulavka{width:12px;height:12px;margin-right:4px;vertical-align:-1px;fill:none;stroke:var(--red);
  stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.bloknot-pusto{margin:0;padding:14px 8px}
.bloknot-panel{display:flex;align-items:center;gap:8px;min-height:56px;padding:8px 14px;flex-wrap:wrap}
.bloknot-gruppa-znakov{display:flex;align-items:center;gap:2px;padding:2px 6px;border:1px solid var(--line);border-radius:999px}
.bloknot-panel .znak-rezhima{cursor:pointer}
.bloknot-nazad{display:none}
.bloknot-v-papku select{min-height:var(--organ-mal);height:var(--organ-mal);padding:2px 26px 2px 10px;font-size:13px;border-color:transparent;background-color:transparent}
.bloknot-v-papku select:hover{background-color:var(--pale)}
.bloknot-status{font-size:12px}
.bloknot-poisk{position:relative;margin-left:auto;flex:0 1 240px;min-width:140px}
.bloknot-poisk svg{position:absolute;left:10px;top:50%;width:15px;height:15px;margin-top:-7.5px;fill:none;
  stroke:var(--ink-3);stroke-width:1.5;stroke-linecap:round;pointer-events:none}
.bloknot-poisk input{width:100%;min-height:var(--organ-mal);padding:6px 12px 6px 30px;border:1px solid var(--line);
  border-radius:999px;background:var(--pale);font:inherit;font-size:13.5px;color:var(--ink)}
.bloknot-poisk input:focus{outline:none;border-color:var(--fokus);box-shadow:0 0 0 3px var(--fokus-fon)}
/* Дата — у левого края, над заголовком, а не посередине: посередине она «уезжала» (владелец 13.09.2026). */
.bloknot-data{margin:2px 0 10px;text-align:left;font-size:12.5px}
.bloknot-forma{display:flex;flex-direction:column;gap:4px;width:100%;padding:0 32px 32px}
.bloknot-forma input.bloknot-zagolovok{width:100%;min-height:0;padding:4px 0;border:0;border-radius:0;
  background:none;box-shadow:none;font:700 24px/1.3 var(--shrift);color:var(--ink)}
.bloknot-forma textarea.bloknot-tekst{width:100%;min-height:4.8em;padding:6px 0;border:0;border-radius:0;background:none;
  font:400 15px/1.6 var(--shrift);color:var(--ink);resize:none;overflow:auto;overscroll-behavior:contain;field-sizing:content}
.bloknot-forma input.bloknot-zagolovok:focus,.bloknot-forma textarea.bloknot-tekst:focus{outline:none;box-shadow:none}
.bloknot-forma input.bloknot-zagolovok::placeholder,.bloknot-forma textarea.bloknot-tekst::placeholder{color:var(--ink-3)}
.bloknot-punkty-spisok{list-style:none;margin:4px 0 0;padding:0}
.bloknot-punkt{display:flex;align-items:center;gap:10px;min-height:36px}
.bloknot-krug{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;
  padding:0;border:1.5px solid var(--kraj);border-radius:50%;background:none;color:transparent;cursor:pointer}
.bloknot-krug svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.bloknot-punkt.sdelano .bloknot-krug{background:var(--red);border-color:var(--red);color:#fff}
.bloknot-krug:focus-visible{outline:2px solid var(--fokus);outline-offset:2px}
.bloknot-krug.pustoj{border-style:dashed;border-color:var(--line-2);cursor:default}
.bloknot-forma input.bloknot-punkt-tekst{flex:1 1 auto;min-width:0;min-height:0;padding:7px 0;border:0;border-radius:0;
  background:none;box-shadow:none;font:400 15px/1.4 var(--shrift);color:var(--ink)}
.bloknot-forma input.bloknot-punkt-tekst:focus{outline:none;border:0;box-shadow:inset 0 -1px 0 var(--line-2)}
.bloknot-punkt.sdelano .bloknot-punkt-tekst,.bloknot-punkt.sdelano .bloknot-punkt-slova{color:var(--ink-3);text-decoration:line-through}
.bloknot-punkt-ubrat{opacity:0}
.bloknot-punkt:hover .bloknot-punkt-ubrat,.bloknot-punkt-ubrat:focus-visible{opacity:1}
@media (hover:none){.bloknot-punkt-ubrat{opacity:1}}
.bloknot-sohranit{padding-top:12px}
.bloknot-nichego{margin:auto;padding:40px 16px;text-align:center}
.bloknot-okno{width:min(28rem,92vw)}
.bloknot-okno .otbor-pole,.bloknot-okno input[type=text]{width:100%}
.bloknot-okno-knopki{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 8px}
.bloknot-okno p{margin:0}
@media (max-width:900px){
  .bloknot{grid-template-columns:minmax(0,1fr);min-height:0}
  .bloknot-papki{border-right:0;border-bottom:1px solid var(--line)}
  .bloknot-spisok{border-right:0}
  .bloknot.s-zametkoj .bloknot-papki,.bloknot.s-zametkoj .bloknot-spisok{display:none}
  .bloknot:not(.s-zametkoj) .bloknot-redaktor{display:none}
  .bloknot-nazad{display:inline-flex}
  .bloknot-forma{padding:0 16px 20px}
  .bloknot-poisk{flex-basis:100%;margin-left:0}
}
/* Виджет — обычная карточка главной: шапка общая, строки делят высоту. */
.bloknot-karta .karta-telo{padding:4px 15px 6px}
.bloknot-vidzhet{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:0 18px;min-height:0}
.bloknot-vidzhet-XL{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.bloknot-vidzhet-stroki{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;min-height:0}
.bloknot-vidzhet-stroki>li{flex:1 1 0;min-height:0;max-height:72px;display:flex}
.bloknot-vidzhet-stroka{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;
  color:var(--ink);text-decoration:none;box-shadow:inset 0 -1px 0 var(--line)}
.bloknot-vidzhet-stroki>li:last-child .bloknot-vidzhet-stroka{box-shadow:none}
.bloknot-vidzhet-stroka:hover .bloknot-vidzhet-zagolovok{text-decoration:underline;text-decoration-color:var(--line-2)}
.bloknot-vidzhet-zagolovok{font-size:14px;font-weight:500;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bloknot-vidzhet-otkrytaya{display:flex;flex-direction:column;gap:4px;min-width:0;min-height:0;overflow:hidden;
  padding-left:18px;box-shadow:inset 1px 0 0 var(--line)}
.bloknot-vidzhet-otkrytaya-zagolovok{flex:0 0 auto;font:600 16px/24px var(--shrift);color:var(--ink);text-decoration:none;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bloknot-vidzhet-otkrytaya-data{flex:0 0 auto;margin:0;font-size:12px;line-height:18px}
.bloknot-vidzhet-otkrytaya-tekst{flex:0 0 auto;margin:0 0 4px;font-size:13.5px;line-height:1.5;color:var(--ink-2);
  white-space:pre-line;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.bloknot-vidzhet-punkty .bloknot-punkt{flex:0 0 auto;min-height:34px;padding:0}
.bloknot-vidzhet-punkty form{display:contents}
.bloknot-punkt-slova{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.bloknot-vidzhet-eshchyo{margin:2px 0 0;font-size:12.5px}
.bloknot-malaya{display:flex;flex-direction:column;gap:6px;min-height:0;padding-top:4px;color:var(--ink);text-decoration:none}
.bloknot-malaya-zagolovok{font:600 15px/1.35 var(--shrift);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bloknot-malaya-prevyu{font-size:13.5px;line-height:1.45;color:var(--ink-3);display:-webkit-box;-webkit-line-clamp:4;
  -webkit-box-orient:vertical;overflow:hidden}
.bloknot-malaya-data{margin-top:auto;font-size:12.5px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.bloknot-vidzhet-pusto{margin:auto 0;font-size:14px}

/* Недоступное в пульте карточки — не нарисованный размер и вид без вариантов:
   видно, но не жмётся. Владелец 13.09.2026. */
.razmer-znak:disabled,.yachejka-vid:disabled{opacity:.32;cursor:not-allowed}
.razmer-znak:disabled:hover,.yachejka-vid:disabled:hover{background:none}

/* Под шапкой панели с поиском черты нет: поле поиска само отделяет список.
   Владелец 13.09.2026 про «Избранное» и «Историю». */
.znak-shapka:has(+ .vybor-poisk){border-bottom:0;margin-bottom:0}
/* Избранное: ручка слева, скрепка справа — видны под указателем; скрепка
   закреплённой закладки видна всегда. */
.izbr-stroka{display:flex;align-items:center;gap:2px;border-radius:var(--r-btn)}
.izbr-stroka>.znak-stroka{flex:1 1 auto;min-width:0}
/* Подсветка — у всей строки, а не второй плашкой у ссылки внутри неё. */
.izbr-stroka:hover{background:var(--pale)}
.izbr-stroka>.znak-stroka:hover{background:none}
.izbr-stroka form{display:flex;margin:0}
.izbr-ruchka,.izbr-skrepka{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;padding:0;border:0;border-radius:var(--r-badge);background:none;color:var(--ink-3);opacity:0}
.izbr-ruchka{cursor:grab;touch-action:none}
.izbr-ruchka svg{width:14px;height:14px;fill:currentColor}
.izbr-skrepka{cursor:pointer}
.izbr-skrepka svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
/* Булавка вместо скрепки, та же, что у окна помощника (владелец 14.09.2026); закреплённая — с залитой головкой. */
.izbr-stroka.zakreplena .izbr-skrepka .golovka{fill:currentColor}
.izbr-stroka:hover .izbr-ruchka,.izbr-stroka:hover .izbr-skrepka,.izbr-skrepka:focus-visible,
.izbr-stroka.zakreplena .izbr-skrepka{opacity:1}
@media (hover:none){.izbr-ruchka,.izbr-skrepka{opacity:1}}
.izbr-stroka.zakreplena .izbr-skrepka{color:var(--red)}
.izbr-skrepka:hover,.izbr-ruchka:hover{background:var(--line);color:var(--ink)}
.izbr-stroka.tyanem{position:relative;z-index:2;background:var(--pale);box-shadow:0 6px 18px rgba(17,19,24,.22)}
.izbr-stroka.tyanem .izbr-ruchka{cursor:grabbing}
/* Панель избранного, заменённая после скрепки или перетаскивания, не
   раскрывается заново: анимация появления на новом узле трясла её. */
.znak-vypad[open]>.znak-polotno.bez-poyavleniya{animation:none}
/* «Сохранить» на карте — справа в её низу, и низ прилипает к краю окна: карта
   бывает выше экрана, а кнопка должна быть под рукой. */
.mesta-sohranit{margin-left:auto}
.mesta-nizok{position:sticky;bottom:0;z-index:3;background:var(--paper)}

/* Банк диаграмм в администрировании, 13.09.2026: запись — карточка с рисунком.
   Карточки одного размера (владелец): ряды сетки равны, подпись прижата к низу. */
.bank-poyasnenie{margin:-4px 0 18px}
.bank-diagramm{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,460px),1fr));
  gap:16px}
.bank-zapis{display:flex;flex-direction:column;gap:12px;min-width:0;margin:0;padding:4px 0 18px;
  border-bottom:1px solid var(--line)}
/* Без обрезки: точка на краю шкалы и карточка наведения выходят за блок (владелец 13.09.2026). */
.bank-risunok{min-width:0;overflow:visible;flex:1}
.bank-risunok svg,.bank-risunok .grafik{max-width:100%;min-width:0;height:auto}
.bank-plitki{max-width:260px}
.bank-nuzhno{font-size:12.5px;margin:0;padding:12px 15px 14px}
.bank-voprosy{margin:0;padding:12px 15px 14px 32px;display:grid;gap:6px;font-size:13px}

/* Новые отрисовщики банка, 13.09.2026: кольцо, дуга, ряды, мозаика, полоса с прошлым.
   Цвета рядов — только из палитры портала (владелец: «наши цвета»). */
.seriya-0{--cvet:var(--ink-2)}
.seriya-1{--cvet:var(--red)}
.seriya-2{--cvet:var(--line-2)}
.seriya-3{--cvet:var(--kraj)}
.seriya-4{--cvet:var(--red-900)}
.seriya-5{--cvet:var(--ink)}
.seriya-liniya{--cvet:var(--red)}
svg.kolco,svg.duga,svg.serii,svg.mozaika,svg.pulya{width:auto;max-width:100%;height:auto;min-width:0;overflow:visible}
.serii-kusok{fill:var(--cvet)}
.serii-ploshchad{fill:var(--cvet);stroke:var(--paper);stroke-width:1}
.serii-liniya{fill:none;stroke:var(--cvet);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.serii-krug{fill:var(--paper);stroke:var(--cvet)}
.serii-nol{stroke:var(--ink-3);stroke-width:1}
.serii-nad{fill:var(--ink);font:600 11px/1 var(--cifry);text-anchor:middle}
.serii-dobavka{fill:var(--ink-3);font:500 10.5px/1 var(--cifry);text-anchor:middle}
.serii-dobavka.serii-plyus{fill:var(--zelenyj)}
.serii-dobavka.serii-minus{fill:var(--red)}
.serii-legenda{display:flex;flex-wrap:wrap;gap:4px 14px;margin:0 0 6px;padding:0;list-style:none;
  font-size:12px;color:var(--ink-2)}
.serii-legenda li{display:inline-flex;align-items:center;gap:6px}
.serii-znak{width:10px;height:10px;border-radius:2px;background:var(--cvet)}
.serii-znak.serii-znak-liniya{height:2px;border-radius:1px}
.kolco-sektor{stroke:var(--paper);stroke-width:1.5}
.kolco-imya{fill:var(--ink-2);font:400 12px/1 var(--shrift)}
.kolco-dolya{fill:var(--ink);font:500 11.5px/1 var(--cifry);text-anchor:end}
.kolco-vsego{fill:var(--ink);font:600 15px/1 var(--cifry);text-anchor:middle}
.duga-zhelob{fill:none;stroke:var(--pale)}
.duga-zapolnenie{fill:none;stroke:var(--ink-2)}
.duga-sverh .duga-zapolnenie{stroke:var(--zelenyj)}
.duga-zasechka{stroke:var(--red);stroke-width:2}
.duga-chislo{fill:var(--ink);font:600 30px/1 var(--shrift);text-anchor:middle;letter-spacing:-.03em}
.duga-podpis{fill:var(--ink-3);font:400 12px/1 var(--shrift);text-anchor:middle}
.duga-kraj{text-anchor:middle}
.mozaika-plitka{stroke:none}
.mozaika-imya{fill:var(--paper);font:500 12px/1 var(--shrift);pointer-events:none}
.mozaika-dolya{fill:var(--paper);font:500 11px/1 var(--cifry);opacity:.85;pointer-events:none}
.mozaika-chast.seriya-2 .mozaika-imya,.mozaika-chast.seriya-2 .mozaika-dolya{fill:var(--ink)}
.pulya-imya{fill:var(--ink-2);font:400 12.5px/1 var(--shrift)}
.pulya-polosa{fill:var(--ink-2)}
.pulya-polosa.pulya-upalo{fill:var(--red)}
.pulya-zasechka{stroke:var(--ink);stroke-width:2}
.pulya-chislo{fill:var(--ink);font:500 12px/1 var(--cifry)}
.pulya-raznica{fill:var(--zelenyj);font:500 11.5px/1 var(--cifry);text-anchor:end}
.pulya-raznica.pulya-upalo{fill:var(--red)}
@media (hover:hover){
  svg.kolco:has(.tochka:hover) .tochka:not(:hover) .serii-kusok,
  svg.mozaika:has(.tochka:hover) .tochka:not(:hover) .serii-kusok,
  svg.pulya:has(.tochka:hover) .tochka:not(:hover) .pulya-polosa{opacity:.45}
}
svg.kolco:has(.tochka:focus-visible) .tochka:not(:focus-visible) .serii-kusok,
svg.mozaika:has(.tochka:focus-visible) .tochka:not(:focus-visible) .serii-kusok,
svg.kolco:has(.tochka.vybrana) .tochka:not(.vybrana) .serii-kusok,
svg.mozaika:has(.tochka.vybrana) .tochka:not(.vybrana) .serii-kusok{opacity:.45}

/* Банк диаграмм: разделы и каталог в углу, 13.09.2026. */
.bank-razdely{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 26px}
.bank-razdel-ssylka,.bank-katalog-punkt{display:inline-flex;align-items:center;gap:8px;
  padding:7px 12px;border:1px solid var(--line);border-radius:999px;color:var(--ink-2);
  text-decoration:none;font-size:13px;background:var(--paper)}
.bank-razdel-ssylka:hover,.bank-katalog-punkt:hover{border-color:var(--line-2);color:var(--ink)}
.bank-razdel-ssylka[aria-current],.bank-katalog-punkt[aria-current]{border-color:var(--ink-2);color:var(--ink)}
.bank-razdel-ssylka .tiho,.bank-katalog-punkt .tiho{font:500 11px/1 var(--cifry)}
/* Раздел отделён воздухом сверху, заголовок крупнее (владелец 13.09.2026). */
.bank-razdel{scroll-margin-top:16px;margin:0;padding:40px 0 8px}
.bank-razdel:first-of-type{padding-top:8px}
.bank-razdel-imya{margin:0 0 22px;font-size:24px;font-weight:600;letter-spacing:-.015em}
/* Кнопка «Разделы» — слева вверху (владелец 13.09.2026), список раскрывается вправо. */
.bank-katalog{position:fixed;top:14px;left:clamp(14px,3vw,28px);z-index:40}
.bank-katalog-knopka{box-shadow:0 4px 16px rgba(17,19,24,.12)}
.bank-katalog-spisok{display:none;position:absolute;top:100%;left:0;min-width:220px;width:max-content;padding:8px;
  margin-top:6px;background:var(--paper);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 12px 32px rgba(17,19,24,.16);flex-direction:column;gap:2px}
.bank-katalog-spisok::before{content:"";position:absolute;left:0;right:0;top:-8px;height:8px}
/* Число — сразу за названием, по левому краю; название в одну строку (владелец 13.09.2026). */
.bank-katalog-punkt{border:0;border-radius:9px;justify-content:flex-start;padding:8px 10px;white-space:nowrap}
.bank-katalog-punkt[aria-current]{background:var(--pale)}
.bank-katalog.otkryt .bank-katalog-spisok{display:flex}
@media (hover:hover){.bank-katalog:not(.pogashen):hover .bank-katalog-spisok{display:flex}}
@media (prefers-reduced-motion:no-preference){html:has(.bank-razdely){scroll-behavior:smooth}}

/* Меню перед поиском: полотно открывается влево под кнопкой, 13.09.2026. */
.kto>.menyu-vypad>.menyu-polotno{left:auto;right:0}

/* Банк без рамок: заголовок, светлее — описание, подсказка по наведению, 13.09.2026. */
/* Без рамок ряды равняются по самой высокой карточке ряда, а не страницы: иначе у чисел пустые поля. */
.bank-diagramm{gap:28px 36px;align-items:stretch}
.bank-zapis-shapka{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;position:relative}
.bank-zapis-imya{margin:0;font-size:15px;font-weight:600;color:var(--ink);letter-spacing:-.005em}
.bank-zapis-opisanie{color:var(--ink-3);font-size:13px}
.bank-spravka{position:relative;align-self:center;margin-left:auto}
.bank-spravka .spravka-okno{left:auto;right:-6px;width:min(360px,80vw);display:flex;flex-direction:column;gap:8px}
.bank-podskazka{display:block}

/* Числа — семь оформлений показа числом и словами, 13.09.2026. */
.cifry{display:flex;flex-direction:column;gap:6px;min-width:0}
.cifry-imya{font:500 10.5px/1.3 var(--cifry);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3)}
.cifry-glavnoe{font-size:34px;font-weight:600;letter-spacing:-.035em;line-height:1.1;color:var(--ink);
  font-variant-numeric:tabular-nums}
.cifry-srednee{font-size:22px;font-weight:600;letter-spacing:-.03em;line-height:1.15;color:var(--ink);
  font-variant-numeric:tabular-nums}
.cifry-niz{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.cifry-tiho{color:var(--ink-3);font-size:12.5px;margin:0}
.cifry-sdvig{font:600 12px/1 var(--cifry);padding:3px 7px;border-radius:999px;background:var(--pale);color:var(--ink-2)}
.cifry-sdvig.cifry-plyus{color:var(--zelenyj)}
.cifry-sdvig.cifry-minus{color:var(--red);background:var(--red-50)}
.cifry-sdvig:empty{display:none}
.cifry-ryad{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:0;margin:0 0 14px}
.cifry-ryad-yachejka{display:flex;flex-direction:column;gap:6px;padding:4px 16px}
.cifry-ryad-yachejka:first-child{padding-left:0}
.cifry-ryad-yachejka+.cifry-ryad-yachejka{border-left:1px solid var(--line)}
.cifry-hod-verh{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.cifry .cifry-hod-risunok{width:100%;height:auto;overflow:visible;display:block;margin:6px 0 2px}
.cifry-hod-zalivka{fill:var(--pale)}
.cifry-hod-liniya{fill:none;stroke:var(--ink-2);stroke-width:2;stroke-linejoin:round}
.cifry-hod .cifry-niz{justify-content:space-between}
.cifry-bylo-stroka{display:flex;align-items:flex-end;gap:28px;flex-wrap:wrap}
.cifry-bylo-prezhnee .cifry-srednee{color:var(--ink-3)}
.cifry-svodka-spisok{margin:4px 0 0;display:flex;flex-direction:column}
.cifry-svodka-stroka{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  padding:9px 0;border-bottom:1px solid var(--line)}
.cifry-svodka-stroka:last-child{border-bottom:0}
.cifry-svodka-stroka dt{color:var(--ink-2);font-size:13.5px}
.cifry-svodka-stroka dd{margin:0;display:flex;align-items:baseline;gap:10px}
.cifry-svodka-chislo{font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink)}
.cifry .cifry-cel-risunok{width:100%;height:auto;display:block;margin:10px 0 4px}
.cifry-cel-zhelob{fill:var(--pale)}
.cifry-cel-fakt{fill:var(--ink-2)}
.cifry-otstaet .cifry-cel-fakt{fill:var(--red)}
.cifry-sverh .cifry-cel-fakt{fill:var(--zelenyj)}
.cifry-cel-ozhidanie{fill:var(--ink)}
.cifry-vyvod-glavnoe{margin:4px 0 0;font-size:16px;font-weight:600;color:var(--ink);line-height:1.35;max-width:36ch}

/* Журнал доступа: таблицы сворачиваются, по умолчанию свёрнуты. 13.09.2026. */
.zhurnal-otbor .zhurnal-den{display:inline-flex;align-items:center;gap:8px}
.zhurnal-tablica{margin-top:14px}
.zhurnal-tablica>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;
  padding:9px 15px;min-height:var(--organ)}
.zhurnal-tablica>summary::-webkit-details-marker{display:none}
.zhurnal-tablica>summary h3{margin:0;padding:0;min-height:0;border:0;background:none}
.zhurnal-tablica>summary .ugolok{margin-left:auto;color:var(--ink-3);transition:transform .15s ease}
.zhurnal-tablica[open]>summary{border-bottom:1px solid var(--line)}
.zhurnal-tablica[open]>summary .ugolok{transform:rotate(180deg)}
.zhurnal-tablica>summary:focus-visible{outline:2px solid var(--fokus);outline-offset:-2px}
@media (prefers-reduced-motion:reduce){.zhurnal-tablica>summary .ugolok{transition:none}}

/* Числа над рисунком — компактно: полоса шкалы не теряется под ними (владелец 13.09.2026). */
.cifry-kompaktno{margin:0 0 20px}
.cifry-kompaktno .cifry-srednee{font-size:17px}
.cifry-kompaktno .cifry-tiho{font-size:12px}
.cifry-kompaktno .cifry-ryad-yachejka{gap:4px;padding-top:0;padding-bottom:0}
.cifry-cel-krug{fill:var(--paper);stroke:var(--ink-2);stroke-width:2.5}
.cifry-otstaet .cifry-cel-krug{stroke:var(--red)}
.cifry-sverh .cifry-cel-krug{stroke:var(--zelenyj)}

/* Шапка карточки банка — всегда одна строка: описание уступает место многоточием (владелец 13.09.2026). */
.bank-zapis-shapka{flex-wrap:nowrap;min-width:0}
.bank-zapis-imya{white-space:nowrap;flex:0 0 auto}
.bank-zapis-opisanie{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:0 1 auto}
.bank-spravka{flex:0 0 auto}

/* Точки наведения у дуги и полосы к цели, 13.09.2026. */
.duga-krug{fill:var(--paper);stroke:var(--ink-2);stroke-width:3}
.duga-sverh .duga-krug{stroke:var(--zelenyj)}
.duga-lovushka{stroke:transparent;stroke-width:22}
.duga-lovushka-krug{fill:transparent}
.cifry-cel-risunok.grafik{overflow:visible}
.cifry-cel-risunok .lovushka{fill:transparent}
@media (hover:hover){.duga-tochka:hover .duga-krug{stroke-width:4}.cifry-cel-risunok .tochka:hover .cifry-cel-krug{stroke-width:3.5}}

/* Сравнение с прошлым периодом: каскад и пунктир базы, 13.09.2026. */
svg.kaskad{width:auto;max-width:100%;height:auto;min-width:0;overflow:visible}
.kaskad-stolb.kaskad-itog{fill:var(--ink-2)}
.kaskad-stolb.kaskad-plyus{fill:var(--zelenyj)}
.kaskad-stolb.kaskad-minus{fill:var(--red)}
.kaskad-mostik{stroke:var(--ink-3);stroke-width:1;stroke-dasharray:3 3}
.kaskad-podpis{fill:var(--ink);font:600 11px/1 var(--cifry);text-anchor:middle}
.kaskad-podpis-plyus{fill:var(--zelenyj)}
.kaskad-podpis-minus{fill:var(--red)}
/* Базовый период — серым пунктиром, акцент у текущего. */
.serii-liniya.serii-baza{stroke:var(--kraj);stroke-dasharray:5 4;stroke-width:1.6}
.serii-legenda-baza .serii-znak{background:var(--kraj)}
@media (hover:hover){svg.kaskad:has(.tochka:hover) .tochka:not(:hover) .kaskad-stolb{opacity:.45}}

/* Ряды-периоды: текущий красный, прошлые серые от тёмного к светлому; переключатель периодов в банке. 13.09.2026. */
.seriya-p0{--cvet:var(--red)}
.seriya-p1{--cvet:var(--ink-2)}
.seriya-p2{--cvet:var(--kraj)}
.seriya-p3{--cvet:var(--line-2)}
.bank-variant-vybor{display:inline-flex;gap:4px;margin:0 0 10px;padding:3px;border-radius:999px;background:var(--pale)}
.bank-variant-vybor label{position:relative;cursor:pointer}
.bank-variant-vybor input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.bank-variant-vybor span{display:inline-block;padding:5px 12px;border-radius:999px;font-size:12.5px;color:var(--ink-2)}
.bank-variant-vybor input:checked+span{background:var(--paper);color:var(--ink);box-shadow:0 1px 3px rgba(17,19,24,.12)}
.bank-variant-vybor input:focus-visible+span{outline:2px solid var(--fokus);outline-offset:1px}
.bank-variant{display:none}
.bank-varianty:has(.bank-variant-0:checked) .bank-variant-risunok-0,
.bank-varianty:has(.bank-variant-1:checked) .bank-variant-risunok-1,
.bank-varianty:has(.bank-variant-2:checked) .bank-variant-risunok-2{display:block}

/* Точки дуги и полосы к цели — только при наведении, фокусе и касании (владелец 13.09.2026). */
.duga-krug,.cifry-cel-krug{opacity:0;transition:opacity .12s ease}
.tochka:focus-visible .duga-krug,.tochka.vybrana .duga-krug,
.tochka:focus-visible .cifry-cel-krug,.tochka.vybrana .cifry-cel-krug{opacity:1}
@media (hover:hover){.tochka:hover .duga-krug,.tochka:hover .cifry-cel-krug{opacity:1}}
@media (prefers-reduced-motion:reduce){.duga-krug,.cifry-cel-krug{transition:none}}

/* Метка изменения с карточкой «откуда число», 13.09.2026. */
.cifry-sdvig-spravka{position:relative;display:inline-flex;cursor:help}
.cifry-sdvig-spravka .spravka-okno{left:auto;right:-6px;min-width:220px;text-align:left}
.cifry-sdvig-spravka:focus-visible{outline:2px solid var(--fokus);outline-offset:2px;border-radius:999px}
.cifry-hod-krug{fill:var(--paper);stroke:var(--ink-2);stroke-width:2}

/* Кольцевой индикатор, 13.09.2026. */
svg.indikatory{width:auto;max-width:100%;height:auto;min-width:0;overflow:visible}
.indikator-zhelob{fill:none;stroke:var(--pale)}
.indikator-zapolnenie{fill:none;stroke:var(--ink-2);stroke-linecap:round}
.indikator-sverh .indikator-zapolnenie{stroke:var(--zelenyj)}
.indikator-procent{fill:var(--ink);font:600 19px/1 var(--shrift);text-anchor:middle;letter-spacing:-.02em}
.indikator-imya{fill:var(--ink-2);font:400 12.5px/1 var(--shrift);text-anchor:middle}

/* Сетка вдвое мельче, 13.09.2026: места до 16 колонок и 96 рядов, свободный размер `w-N`/`h-N`.
   Протяжённость растянутой карточки сильнее протяжённости формы: классов у неё два. */

/* ══ Главная в стиле банка диаграмм, 13.09.2026 ═══════════════════
   Владелец: «все эти границы, шапки, подвалы, кнопки у виджетов уберём и
   сделаем по стилю как в банке диаграмм». Карточка — без рамки и тени,
   шапка — жирное имя и светлее срез рядом, подвала с кнопкой нет: дверь в
   отчёт — само имя. Правило только для полотна главной: карточки страниц
   отчётов прежние. */
/* С 14.09.2026 виджет — белая форма с лёгкой тенью на светло-сером фоне
   (владелец). Рамки по-прежнему нет; ночью её место занимает граница: тень
   на тёмном не видна. Поля внутри — в `setka.VYSOTA_OBRAMLENIYA` и
   `bloki.POLYA_KARTOCHKI`. */
.setka-glavnoj>.yachejka>.karta{border:0;border-radius:var(--r-card);box-shadow:var(--ten-karty);
  background:var(--paper);padding:10px 14px}
@media (prefers-color-scheme:dark){
  :root:not([data-tema="den"]) .setka-glavnoj>.yachejka>.karta{box-shadow:none;border:1px solid var(--line)}
}
:root[data-tema="noch"] .setka-glavnoj>.yachejka>.karta{box-shadow:none;border:1px solid var(--line)}
.setka-glavnoj .karta>h3{background:none;border:0;padding:0 0 4px;min-height:0;
  font:600 15px/1.35 var(--shrift);letter-spacing:-.005em;text-transform:none;color:var(--ink);
  justify-content:flex-start;align-items:baseline;gap:10px}
.setka-glavnoj .karta>h3 .karta-imya{color:var(--ink);flex:0 1 auto}
.setka-glavnoj .karta>h3 .karta-imya-dver{min-width:0;flex:0 1 auto;color:inherit;text-decoration:none;overflow:hidden}
.setka-glavnoj .karta>h3 .karta-imya-dver:hover .karta-imya{color:var(--red)}
.setka-glavnoj .karta>h3 .karta-imya-dver:focus-visible{outline:2px solid var(--fokus);outline-offset:2px;border-radius:3px}
.setka-glavnoj .karta>h3 .karta-period{order:1;flex:0 1 auto;text-align:left;
  font:400 13px/1.35 var(--shrift);letter-spacing:0;color:var(--ink-3)}
.setka-glavnoj .karta>h3 .karta-spravka{order:2;margin:0 0 0 auto;align-self:center}
.setka-glavnoj .karta-podpis{padding:0 0 6px;color:var(--ink-3)}
.setka-glavnoj .karta-nizok{display:none}
.setka-glavnoj .karta-telo,.setka-glavnoj .karta-glavnoe,.setka-glavnoj .karta-eshchyo{padding-left:0;padding-right:0}

/* ══ Виджет «Текст» ══ */
.setka-glavnoj>.yachejka>.karta.tekst-vidzhet{display:flex;flex-direction:column;gap:6px;overflow:hidden}
.karta.tekst-vidzhet{margin:0;border:0;background:transparent}
.setka-glavnoj>.yachejka>.karta.tekst-vidzhet:not(.tekst-s-ramkoj),
:root[data-tema="noch"] .setka-glavnoj>.yachejka>.karta.tekst-vidzhet:not(.tekst-s-ramkoj){
  background:transparent;box-shadow:none;border:0;border-radius:0;padding:0}
@media (prefers-color-scheme:dark){
  :root:not([data-tema="den"]) .setka-glavnoj>.yachejka>.karta.tekst-vidzhet:not(.tekst-s-ramkoj){border:0}
}
.karta.tekst-vidzhet.tekst-s-ramkoj,
.setka-glavnoj>.yachejka>.karta.tekst-vidzhet.tekst-s-ramkoj{border:1px solid var(--line);border-radius:var(--r-card);padding:10px 14px}
.tekst-pole{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;color:var(--ink);line-height:1.3;outline:none;word-break:break-word}
.tekst-pole[contenteditable]{border-radius:6px;box-shadow:inset 0 0 0 1px var(--line);padding:4px 6px;cursor:text}
.tekst-pole[contenteditable]:focus{box-shadow:inset 0 0 0 2px var(--fokus)}
.tekst-pole[contenteditable]:empty::before{content:attr(data-pusto);color:var(--ink-3)}
.tekst-shrift-s .tekst-pole{font-size:14px;font-weight:400}
.tekst-shrift-m .tekst-pole{font-size:18px;font-weight:400}
.tekst-shrift-l .tekst-pole{font-size:26px;font-weight:500;letter-spacing:-.015em}
.tekst-shrift-xl .tekst-pole{font-size:36px;font-weight:500;letter-spacing:-.025em;line-height:1.15}
/* Полоса в один ряд: на 1280 ряд 17 px, а строка 23 — поле прокручивалось
   внутри полосы и срезало низ букв. Строка встаёт по середине ряда и
   выходит в зазор, а не в прокрутку (14.09.2026). */
.setka-glavnoj>.yachejka.h-1>.karta.tekst-vidzhet{justify-content:center;overflow:visible}
.setka-glavnoj>.yachejka.h-1 .tekst-pole{flex:0 0 auto;line-height:1.05;overflow:visible}

/* Кнопки и выбор размера — общие органы портала (.knopka.mal и select): хром органа объявлен один раз. */




/* Текст правится прямо в режиме настройки: содержимое прочих карточек в нём
   нажатий не принимает (чтобы не уйти по ссылке, переставляя), а поле и панель
   текста обязаны — иначе в него не встать курсором. Замечено браузером 13.09.2026. */
.setka-glavnoj.nastraivaem.skript-zhiv>.yachejka>.karta.tekst-vidzhet{pointer-events:auto}

/* Таблица ответа в окне помощника: последний столбец не прижат к краю окна —
   числа «как слова» с воздухом справа (владелец 13.09.2026). */
.chat-tablica th:last-child,.chat-tablica td:last-child{padding-right:28px}
.chat-tablica th:first-child,.chat-tablica td:first-child{padding-left:4px}

/* Главная по умолчанию на /nastrojki/glavnaya/, 13.09.2026. */
.nabor-poyasnenie{max-width:none}
.nabor-nastrojki{margin:28px 0 0}
.nabor-nastrojki>summary{cursor:pointer;font-weight:600;color:var(--ink-2)}

/* Полёт кнопок разделов в «Разделы»: летят копии, закреплённые поверх страницы;
   пока летят, свои кнопки в списке не видны — двойников нет. */
.bank-fishka-letit{position:fixed;z-index:41;margin:0;pointer-events:none;box-sizing:border-box;
  will-change:transform,opacity;transform-origin:center}
.bank-razdely.sobran .bank-razdel-ssylka{visibility:hidden}

/* Колонка папок скрывается кнопкой в панели заметки. */
html[data-bloknot-papki="skryty"] .bloknot{grid-template-columns:minmax(270px,340px) minmax(0,1fr)}
html[data-bloknot-papki="skryty"] .bloknot-papki{display:none}
@media (max-width:900px){html[data-bloknot-papki="skryty"] .bloknot{grid-template-columns:minmax(0,1fr)}}

/* Панель текста одной высоты — высотой органа (владелец 13.09.2026). Буквы без рамки,
   размер — выпадашка `.vybor`, рамка — галочка того же вида, что в блокноте. */
.tekst-panel{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;flex:0 0 auto;min-height:var(--organ-mal)}
.tekst-bukva{display:inline-flex;align-items:center;justify-content:center;min-width:var(--organ-mal);height:var(--organ-mal);
  padding:0;border:0;border-radius:var(--r-btn);background:none;color:var(--ink-2);font:500 15px/1 var(--shrift);cursor:pointer}
.tekst-bukva:hover{background:var(--pale);color:var(--ink)}
.tekst-bukva:focus-visible{outline:2px solid var(--fokus);outline-offset:1px}
.tekst-razmery{display:inline-flex;align-items:center;gap:2px;padding:0 2px}
.tekst-razmer{display:inline-flex;align-items:flex-end;justify-content:center;min-width:var(--organ-mal);height:var(--organ-mal);
  padding-bottom:7px;border-radius:var(--r-btn);color:var(--ink-3);font-weight:600;line-height:1;cursor:pointer}
.tekst-razmer:hover{background:var(--pale);color:var(--ink)}
.tekst-razmer:has(input:checked){background:var(--pale);color:var(--ink);box-shadow:inset 0 0 0 1px var(--kraj)}
.tekst-razmer:has(input:focus-visible){outline:2px solid var(--fokus);outline-offset:1px}
.tekst-razmer-s{font-size:11px}.tekst-razmer-m{font-size:14px}.tekst-razmer-l{font-size:17px}.tekst-razmer-xl{font-size:21px}
.tekst-galka{display:inline-flex;align-items:center;gap:7px;height:var(--organ-mal);padding:0 8px;color:var(--ink-2);
  font-size:13.5px;cursor:pointer;border-radius:var(--r-btn)}
.tekst-galka:hover{background:var(--pale)}
.tekst-galka .bloknot-galka-kvadrat{width:16px;height:16px;border-color:var(--kraj)}
.tekst-galka input:checked+.bloknot-galka-kvadrat{background:var(--red);border-color:var(--red);color:#fff}
.tekst-galka input:checked+.bloknot-galka-kvadrat svg{opacity:1}
.tekst-galka input:focus-visible+.bloknot-galka-kvadrat{outline:2px solid var(--fokus);outline-offset:2px}

/* Главная по умолчанию — схемой, как карта (владелец 14.09.2026): полотно
   уже, плитки с именами вместо живых карточек. */
#setka-korob.nabor-shema{max-width:980px}
.setka-glavnoj>.yachejka>.karta.shema-karta{display:flex;flex-direction:column;gap:4px;height:100%;
  padding:12px 14px;border-radius:calc(var(--r-card) * .72);background:var(--pale);overflow:hidden}
.shema-imya{font-weight:600;font-size:13.5px;line-height:1.25;color:var(--ink)}
.shema-vopros{font-size:12px;line-height:1.3;color:var(--ink-3);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.shema-forma{margin-top:auto;font-size:11.5px;color:var(--ink-3);font-variant-numeric:tabular-nums}

/* ── места на сетке 48 (14.09.2026) ─────────────────────────────
   Столбец, ряд и протяжённость — классами: правило содержимого не пускает
   `style=""`. 48 столбцов, 200 рядов, ширина до 48 и высота до 96 клеток —
   одной строкой на группу, чтобы не раздувать файл. */
.setka-glavnoj>.yachejka.x-1{grid-column-start:1}.setka-glavnoj>.yachejka.x-2{grid-column-start:2}.setka-glavnoj>.yachejka.x-3{grid-column-start:3}.setka-glavnoj>.yachejka.x-4{grid-column-start:4}.setka-glavnoj>.yachejka.x-5{grid-column-start:5}.setka-glavnoj>.yachejka.x-6{grid-column-start:6}.setka-glavnoj>.yachejka.x-7{grid-column-start:7}.setka-glavnoj>.yachejka.x-8{grid-column-start:8}.setka-glavnoj>.yachejka.x-9{grid-column-start:9}.setka-glavnoj>.yachejka.x-10{grid-column-start:10}.setka-glavnoj>.yachejka.x-11{grid-column-start:11}.setka-glavnoj>.yachejka.x-12{grid-column-start:12}.setka-glavnoj>.yachejka.x-13{grid-column-start:13}.setka-glavnoj>.yachejka.x-14{grid-column-start:14}.setka-glavnoj>.yachejka.x-15{grid-column-start:15}.setka-glavnoj>.yachejka.x-16{grid-column-start:16}.setka-glavnoj>.yachejka.x-17{grid-column-start:17}.setka-glavnoj>.yachejka.x-18{grid-column-start:18}.setka-glavnoj>.yachejka.x-19{grid-column-start:19}.setka-glavnoj>.yachejka.x-20{grid-column-start:20}.setka-glavnoj>.yachejka.x-21{grid-column-start:21}.setka-glavnoj>.yachejka.x-22{grid-column-start:22}.setka-glavnoj>.yachejka.x-23{grid-column-start:23}.setka-glavnoj>.yachejka.x-24{grid-column-start:24}.setka-glavnoj>.yachejka.x-25{grid-column-start:25}.setka-glavnoj>.yachejka.x-26{grid-column-start:26}.setka-glavnoj>.yachejka.x-27{grid-column-start:27}.setka-glavnoj>.yachejka.x-28{grid-column-start:28}.setka-glavnoj>.yachejka.x-29{grid-column-start:29}.setka-glavnoj>.yachejka.x-30{grid-column-start:30}.setka-glavnoj>.yachejka.x-31{grid-column-start:31}.setka-glavnoj>.yachejka.x-32{grid-column-start:32}.setka-glavnoj>.yachejka.x-33{grid-column-start:33}.setka-glavnoj>.yachejka.x-34{grid-column-start:34}.setka-glavnoj>.yachejka.x-35{grid-column-start:35}.setka-glavnoj>.yachejka.x-36{grid-column-start:36}.setka-glavnoj>.yachejka.x-37{grid-column-start:37}.setka-glavnoj>.yachejka.x-38{grid-column-start:38}.setka-glavnoj>.yachejka.x-39{grid-column-start:39}.setka-glavnoj>.yachejka.x-40{grid-column-start:40}.setka-glavnoj>.yachejka.x-41{grid-column-start:41}.setka-glavnoj>.yachejka.x-42{grid-column-start:42}.setka-glavnoj>.yachejka.x-43{grid-column-start:43}.setka-glavnoj>.yachejka.x-44{grid-column-start:44}.setka-glavnoj>.yachejka.x-45{grid-column-start:45}.setka-glavnoj>.yachejka.x-46{grid-column-start:46}.setka-glavnoj>.yachejka.x-47{grid-column-start:47}.setka-glavnoj>.yachejka.x-48{grid-column-start:48}
.setka-glavnoj>.yachejka.y-1{grid-row-start:1}.setka-glavnoj>.yachejka.y-2{grid-row-start:2}.setka-glavnoj>.yachejka.y-3{grid-row-start:3}.setka-glavnoj>.yachejka.y-4{grid-row-start:4}.setka-glavnoj>.yachejka.y-5{grid-row-start:5}.setka-glavnoj>.yachejka.y-6{grid-row-start:6}.setka-glavnoj>.yachejka.y-7{grid-row-start:7}.setka-glavnoj>.yachejka.y-8{grid-row-start:8}.setka-glavnoj>.yachejka.y-9{grid-row-start:9}.setka-glavnoj>.yachejka.y-10{grid-row-start:10}.setka-glavnoj>.yachejka.y-11{grid-row-start:11}.setka-glavnoj>.yachejka.y-12{grid-row-start:12}.setka-glavnoj>.yachejka.y-13{grid-row-start:13}.setka-glavnoj>.yachejka.y-14{grid-row-start:14}.setka-glavnoj>.yachejka.y-15{grid-row-start:15}.setka-glavnoj>.yachejka.y-16{grid-row-start:16}.setka-glavnoj>.yachejka.y-17{grid-row-start:17}.setka-glavnoj>.yachejka.y-18{grid-row-start:18}.setka-glavnoj>.yachejka.y-19{grid-row-start:19}.setka-glavnoj>.yachejka.y-20{grid-row-start:20}.setka-glavnoj>.yachejka.y-21{grid-row-start:21}.setka-glavnoj>.yachejka.y-22{grid-row-start:22}.setka-glavnoj>.yachejka.y-23{grid-row-start:23}.setka-glavnoj>.yachejka.y-24{grid-row-start:24}.setka-glavnoj>.yachejka.y-25{grid-row-start:25}.setka-glavnoj>.yachejka.y-26{grid-row-start:26}.setka-glavnoj>.yachejka.y-27{grid-row-start:27}.setka-glavnoj>.yachejka.y-28{grid-row-start:28}.setka-glavnoj>.yachejka.y-29{grid-row-start:29}.setka-glavnoj>.yachejka.y-30{grid-row-start:30}.setka-glavnoj>.yachejka.y-31{grid-row-start:31}.setka-glavnoj>.yachejka.y-32{grid-row-start:32}.setka-glavnoj>.yachejka.y-33{grid-row-start:33}.setka-glavnoj>.yachejka.y-34{grid-row-start:34}.setka-glavnoj>.yachejka.y-35{grid-row-start:35}.setka-glavnoj>.yachejka.y-36{grid-row-start:36}.setka-glavnoj>.yachejka.y-37{grid-row-start:37}.setka-glavnoj>.yachejka.y-38{grid-row-start:38}.setka-glavnoj>.yachejka.y-39{grid-row-start:39}.setka-glavnoj>.yachejka.y-40{grid-row-start:40}.setka-glavnoj>.yachejka.y-41{grid-row-start:41}.setka-glavnoj>.yachejka.y-42{grid-row-start:42}.setka-glavnoj>.yachejka.y-43{grid-row-start:43}.setka-glavnoj>.yachejka.y-44{grid-row-start:44}.setka-glavnoj>.yachejka.y-45{grid-row-start:45}.setka-glavnoj>.yachejka.y-46{grid-row-start:46}.setka-glavnoj>.yachejka.y-47{grid-row-start:47}.setka-glavnoj>.yachejka.y-48{grid-row-start:48}.setka-glavnoj>.yachejka.y-49{grid-row-start:49}.setka-glavnoj>.yachejka.y-50{grid-row-start:50}.setka-glavnoj>.yachejka.y-51{grid-row-start:51}.setka-glavnoj>.yachejka.y-52{grid-row-start:52}.setka-glavnoj>.yachejka.y-53{grid-row-start:53}.setka-glavnoj>.yachejka.y-54{grid-row-start:54}.setka-glavnoj>.yachejka.y-55{grid-row-start:55}.setka-glavnoj>.yachejka.y-56{grid-row-start:56}.setka-glavnoj>.yachejka.y-57{grid-row-start:57}.setka-glavnoj>.yachejka.y-58{grid-row-start:58}.setka-glavnoj>.yachejka.y-59{grid-row-start:59}.setka-glavnoj>.yachejka.y-60{grid-row-start:60}.setka-glavnoj>.yachejka.y-61{grid-row-start:61}.setka-glavnoj>.yachejka.y-62{grid-row-start:62}.setka-glavnoj>.yachejka.y-63{grid-row-start:63}.setka-glavnoj>.yachejka.y-64{grid-row-start:64}.setka-glavnoj>.yachejka.y-65{grid-row-start:65}.setka-glavnoj>.yachejka.y-66{grid-row-start:66}.setka-glavnoj>.yachejka.y-67{grid-row-start:67}.setka-glavnoj>.yachejka.y-68{grid-row-start:68}.setka-glavnoj>.yachejka.y-69{grid-row-start:69}.setka-glavnoj>.yachejka.y-70{grid-row-start:70}.setka-glavnoj>.yachejka.y-71{grid-row-start:71}.setka-glavnoj>.yachejka.y-72{grid-row-start:72}.setka-glavnoj>.yachejka.y-73{grid-row-start:73}.setka-glavnoj>.yachejka.y-74{grid-row-start:74}.setka-glavnoj>.yachejka.y-75{grid-row-start:75}.setka-glavnoj>.yachejka.y-76{grid-row-start:76}.setka-glavnoj>.yachejka.y-77{grid-row-start:77}.setka-glavnoj>.yachejka.y-78{grid-row-start:78}.setka-glavnoj>.yachejka.y-79{grid-row-start:79}.setka-glavnoj>.yachejka.y-80{grid-row-start:80}.setka-glavnoj>.yachejka.y-81{grid-row-start:81}.setka-glavnoj>.yachejka.y-82{grid-row-start:82}.setka-glavnoj>.yachejka.y-83{grid-row-start:83}.setka-glavnoj>.yachejka.y-84{grid-row-start:84}.setka-glavnoj>.yachejka.y-85{grid-row-start:85}.setka-glavnoj>.yachejka.y-86{grid-row-start:86}.setka-glavnoj>.yachejka.y-87{grid-row-start:87}.setka-glavnoj>.yachejka.y-88{grid-row-start:88}.setka-glavnoj>.yachejka.y-89{grid-row-start:89}.setka-glavnoj>.yachejka.y-90{grid-row-start:90}.setka-glavnoj>.yachejka.y-91{grid-row-start:91}.setka-glavnoj>.yachejka.y-92{grid-row-start:92}.setka-glavnoj>.yachejka.y-93{grid-row-start:93}.setka-glavnoj>.yachejka.y-94{grid-row-start:94}.setka-glavnoj>.yachejka.y-95{grid-row-start:95}.setka-glavnoj>.yachejka.y-96{grid-row-start:96}.setka-glavnoj>.yachejka.y-97{grid-row-start:97}.setka-glavnoj>.yachejka.y-98{grid-row-start:98}.setka-glavnoj>.yachejka.y-99{grid-row-start:99}.setka-glavnoj>.yachejka.y-100{grid-row-start:100}.setka-glavnoj>.yachejka.y-101{grid-row-start:101}.setka-glavnoj>.yachejka.y-102{grid-row-start:102}.setka-glavnoj>.yachejka.y-103{grid-row-start:103}.setka-glavnoj>.yachejka.y-104{grid-row-start:104}.setka-glavnoj>.yachejka.y-105{grid-row-start:105}.setka-glavnoj>.yachejka.y-106{grid-row-start:106}.setka-glavnoj>.yachejka.y-107{grid-row-start:107}.setka-glavnoj>.yachejka.y-108{grid-row-start:108}.setka-glavnoj>.yachejka.y-109{grid-row-start:109}.setka-glavnoj>.yachejka.y-110{grid-row-start:110}.setka-glavnoj>.yachejka.y-111{grid-row-start:111}.setka-glavnoj>.yachejka.y-112{grid-row-start:112}.setka-glavnoj>.yachejka.y-113{grid-row-start:113}.setka-glavnoj>.yachejka.y-114{grid-row-start:114}.setka-glavnoj>.yachejka.y-115{grid-row-start:115}.setka-glavnoj>.yachejka.y-116{grid-row-start:116}.setka-glavnoj>.yachejka.y-117{grid-row-start:117}.setka-glavnoj>.yachejka.y-118{grid-row-start:118}.setka-glavnoj>.yachejka.y-119{grid-row-start:119}.setka-glavnoj>.yachejka.y-120{grid-row-start:120}.setka-glavnoj>.yachejka.y-121{grid-row-start:121}.setka-glavnoj>.yachejka.y-122{grid-row-start:122}.setka-glavnoj>.yachejka.y-123{grid-row-start:123}.setka-glavnoj>.yachejka.y-124{grid-row-start:124}.setka-glavnoj>.yachejka.y-125{grid-row-start:125}.setka-glavnoj>.yachejka.y-126{grid-row-start:126}.setka-glavnoj>.yachejka.y-127{grid-row-start:127}.setka-glavnoj>.yachejka.y-128{grid-row-start:128}.setka-glavnoj>.yachejka.y-129{grid-row-start:129}.setka-glavnoj>.yachejka.y-130{grid-row-start:130}.setka-glavnoj>.yachejka.y-131{grid-row-start:131}.setka-glavnoj>.yachejka.y-132{grid-row-start:132}.setka-glavnoj>.yachejka.y-133{grid-row-start:133}.setka-glavnoj>.yachejka.y-134{grid-row-start:134}.setka-glavnoj>.yachejka.y-135{grid-row-start:135}.setka-glavnoj>.yachejka.y-136{grid-row-start:136}.setka-glavnoj>.yachejka.y-137{grid-row-start:137}.setka-glavnoj>.yachejka.y-138{grid-row-start:138}.setka-glavnoj>.yachejka.y-139{grid-row-start:139}.setka-glavnoj>.yachejka.y-140{grid-row-start:140}.setka-glavnoj>.yachejka.y-141{grid-row-start:141}.setka-glavnoj>.yachejka.y-142{grid-row-start:142}.setka-glavnoj>.yachejka.y-143{grid-row-start:143}.setka-glavnoj>.yachejka.y-144{grid-row-start:144}.setka-glavnoj>.yachejka.y-145{grid-row-start:145}.setka-glavnoj>.yachejka.y-146{grid-row-start:146}.setka-glavnoj>.yachejka.y-147{grid-row-start:147}.setka-glavnoj>.yachejka.y-148{grid-row-start:148}.setka-glavnoj>.yachejka.y-149{grid-row-start:149}.setka-glavnoj>.yachejka.y-150{grid-row-start:150}.setka-glavnoj>.yachejka.y-151{grid-row-start:151}.setka-glavnoj>.yachejka.y-152{grid-row-start:152}.setka-glavnoj>.yachejka.y-153{grid-row-start:153}.setka-glavnoj>.yachejka.y-154{grid-row-start:154}.setka-glavnoj>.yachejka.y-155{grid-row-start:155}.setka-glavnoj>.yachejka.y-156{grid-row-start:156}.setka-glavnoj>.yachejka.y-157{grid-row-start:157}.setka-glavnoj>.yachejka.y-158{grid-row-start:158}.setka-glavnoj>.yachejka.y-159{grid-row-start:159}.setka-glavnoj>.yachejka.y-160{grid-row-start:160}.setka-glavnoj>.yachejka.y-161{grid-row-start:161}.setka-glavnoj>.yachejka.y-162{grid-row-start:162}.setka-glavnoj>.yachejka.y-163{grid-row-start:163}.setka-glavnoj>.yachejka.y-164{grid-row-start:164}.setka-glavnoj>.yachejka.y-165{grid-row-start:165}.setka-glavnoj>.yachejka.y-166{grid-row-start:166}.setka-glavnoj>.yachejka.y-167{grid-row-start:167}.setka-glavnoj>.yachejka.y-168{grid-row-start:168}.setka-glavnoj>.yachejka.y-169{grid-row-start:169}.setka-glavnoj>.yachejka.y-170{grid-row-start:170}.setka-glavnoj>.yachejka.y-171{grid-row-start:171}.setka-glavnoj>.yachejka.y-172{grid-row-start:172}.setka-glavnoj>.yachejka.y-173{grid-row-start:173}.setka-glavnoj>.yachejka.y-174{grid-row-start:174}.setka-glavnoj>.yachejka.y-175{grid-row-start:175}.setka-glavnoj>.yachejka.y-176{grid-row-start:176}.setka-glavnoj>.yachejka.y-177{grid-row-start:177}.setka-glavnoj>.yachejka.y-178{grid-row-start:178}.setka-glavnoj>.yachejka.y-179{grid-row-start:179}.setka-glavnoj>.yachejka.y-180{grid-row-start:180}.setka-glavnoj>.yachejka.y-181{grid-row-start:181}.setka-glavnoj>.yachejka.y-182{grid-row-start:182}.setka-glavnoj>.yachejka.y-183{grid-row-start:183}.setka-glavnoj>.yachejka.y-184{grid-row-start:184}.setka-glavnoj>.yachejka.y-185{grid-row-start:185}.setka-glavnoj>.yachejka.y-186{grid-row-start:186}.setka-glavnoj>.yachejka.y-187{grid-row-start:187}.setka-glavnoj>.yachejka.y-188{grid-row-start:188}.setka-glavnoj>.yachejka.y-189{grid-row-start:189}.setka-glavnoj>.yachejka.y-190{grid-row-start:190}.setka-glavnoj>.yachejka.y-191{grid-row-start:191}.setka-glavnoj>.yachejka.y-192{grid-row-start:192}.setka-glavnoj>.yachejka.y-193{grid-row-start:193}.setka-glavnoj>.yachejka.y-194{grid-row-start:194}.setka-glavnoj>.yachejka.y-195{grid-row-start:195}.setka-glavnoj>.yachejka.y-196{grid-row-start:196}.setka-glavnoj>.yachejka.y-197{grid-row-start:197}.setka-glavnoj>.yachejka.y-198{grid-row-start:198}.setka-glavnoj>.yachejka.y-199{grid-row-start:199}.setka-glavnoj>.yachejka.y-200{grid-row-start:200}.setka-glavnoj>.yachejka.y-201{grid-row-start:201}.setka-glavnoj>.yachejka.y-202{grid-row-start:202}.setka-glavnoj>.yachejka.y-203{grid-row-start:203}.setka-glavnoj>.yachejka.y-204{grid-row-start:204}.setka-glavnoj>.yachejka.y-205{grid-row-start:205}.setka-glavnoj>.yachejka.y-206{grid-row-start:206}.setka-glavnoj>.yachejka.y-207{grid-row-start:207}.setka-glavnoj>.yachejka.y-208{grid-row-start:208}.setka-glavnoj>.yachejka.y-209{grid-row-start:209}.setka-glavnoj>.yachejka.y-210{grid-row-start:210}.setka-glavnoj>.yachejka.y-211{grid-row-start:211}.setka-glavnoj>.yachejka.y-212{grid-row-start:212}.setka-glavnoj>.yachejka.y-213{grid-row-start:213}.setka-glavnoj>.yachejka.y-214{grid-row-start:214}.setka-glavnoj>.yachejka.y-215{grid-row-start:215}.setka-glavnoj>.yachejka.y-216{grid-row-start:216}.setka-glavnoj>.yachejka.y-217{grid-row-start:217}.setka-glavnoj>.yachejka.y-218{grid-row-start:218}.setka-glavnoj>.yachejka.y-219{grid-row-start:219}.setka-glavnoj>.yachejka.y-220{grid-row-start:220}.setka-glavnoj>.yachejka.y-221{grid-row-start:221}.setka-glavnoj>.yachejka.y-222{grid-row-start:222}.setka-glavnoj>.yachejka.y-223{grid-row-start:223}.setka-glavnoj>.yachejka.y-224{grid-row-start:224}.setka-glavnoj>.yachejka.y-225{grid-row-start:225}.setka-glavnoj>.yachejka.y-226{grid-row-start:226}.setka-glavnoj>.yachejka.y-227{grid-row-start:227}.setka-glavnoj>.yachejka.y-228{grid-row-start:228}.setka-glavnoj>.yachejka.y-229{grid-row-start:229}.setka-glavnoj>.yachejka.y-230{grid-row-start:230}.setka-glavnoj>.yachejka.y-231{grid-row-start:231}.setka-glavnoj>.yachejka.y-232{grid-row-start:232}.setka-glavnoj>.yachejka.y-233{grid-row-start:233}.setka-glavnoj>.yachejka.y-234{grid-row-start:234}.setka-glavnoj>.yachejka.y-235{grid-row-start:235}.setka-glavnoj>.yachejka.y-236{grid-row-start:236}.setka-glavnoj>.yachejka.y-237{grid-row-start:237}.setka-glavnoj>.yachejka.y-238{grid-row-start:238}.setka-glavnoj>.yachejka.y-239{grid-row-start:239}.setka-glavnoj>.yachejka.y-240{grid-row-start:240}.setka-glavnoj>.yachejka.y-241{grid-row-start:241}.setka-glavnoj>.yachejka.y-242{grid-row-start:242}.setka-glavnoj>.yachejka.y-243{grid-row-start:243}.setka-glavnoj>.yachejka.y-244{grid-row-start:244}.setka-glavnoj>.yachejka.y-245{grid-row-start:245}.setka-glavnoj>.yachejka.y-246{grid-row-start:246}.setka-glavnoj>.yachejka.y-247{grid-row-start:247}.setka-glavnoj>.yachejka.y-248{grid-row-start:248}.setka-glavnoj>.yachejka.y-249{grid-row-start:249}.setka-glavnoj>.yachejka.y-250{grid-row-start:250}.setka-glavnoj>.yachejka.y-251{grid-row-start:251}.setka-glavnoj>.yachejka.y-252{grid-row-start:252}.setka-glavnoj>.yachejka.y-253{grid-row-start:253}.setka-glavnoj>.yachejka.y-254{grid-row-start:254}.setka-glavnoj>.yachejka.y-255{grid-row-start:255}.setka-glavnoj>.yachejka.y-256{grid-row-start:256}.setka-glavnoj>.yachejka.y-257{grid-row-start:257}.setka-glavnoj>.yachejka.y-258{grid-row-start:258}.setka-glavnoj>.yachejka.y-259{grid-row-start:259}.setka-glavnoj>.yachejka.y-260{grid-row-start:260}.setka-glavnoj>.yachejka.y-261{grid-row-start:261}.setka-glavnoj>.yachejka.y-262{grid-row-start:262}.setka-glavnoj>.yachejka.y-263{grid-row-start:263}.setka-glavnoj>.yachejka.y-264{grid-row-start:264}.setka-glavnoj>.yachejka.y-265{grid-row-start:265}.setka-glavnoj>.yachejka.y-266{grid-row-start:266}.setka-glavnoj>.yachejka.y-267{grid-row-start:267}.setka-glavnoj>.yachejka.y-268{grid-row-start:268}.setka-glavnoj>.yachejka.y-269{grid-row-start:269}.setka-glavnoj>.yachejka.y-270{grid-row-start:270}.setka-glavnoj>.yachejka.y-271{grid-row-start:271}.setka-glavnoj>.yachejka.y-272{grid-row-start:272}.setka-glavnoj>.yachejka.y-273{grid-row-start:273}.setka-glavnoj>.yachejka.y-274{grid-row-start:274}.setka-glavnoj>.yachejka.y-275{grid-row-start:275}.setka-glavnoj>.yachejka.y-276{grid-row-start:276}.setka-glavnoj>.yachejka.y-277{grid-row-start:277}.setka-glavnoj>.yachejka.y-278{grid-row-start:278}.setka-glavnoj>.yachejka.y-279{grid-row-start:279}.setka-glavnoj>.yachejka.y-280{grid-row-start:280}.setka-glavnoj>.yachejka.y-281{grid-row-start:281}.setka-glavnoj>.yachejka.y-282{grid-row-start:282}.setka-glavnoj>.yachejka.y-283{grid-row-start:283}.setka-glavnoj>.yachejka.y-284{grid-row-start:284}.setka-glavnoj>.yachejka.y-285{grid-row-start:285}.setka-glavnoj>.yachejka.y-286{grid-row-start:286}.setka-glavnoj>.yachejka.y-287{grid-row-start:287}.setka-glavnoj>.yachejka.y-288{grid-row-start:288}.setka-glavnoj>.yachejka.y-289{grid-row-start:289}.setka-glavnoj>.yachejka.y-290{grid-row-start:290}.setka-glavnoj>.yachejka.y-291{grid-row-start:291}.setka-glavnoj>.yachejka.y-292{grid-row-start:292}.setka-glavnoj>.yachejka.y-293{grid-row-start:293}.setka-glavnoj>.yachejka.y-294{grid-row-start:294}.setka-glavnoj>.yachejka.y-295{grid-row-start:295}.setka-glavnoj>.yachejka.y-296{grid-row-start:296}.setka-glavnoj>.yachejka.y-297{grid-row-start:297}.setka-glavnoj>.yachejka.y-298{grid-row-start:298}.setka-glavnoj>.yachejka.y-299{grid-row-start:299}.setka-glavnoj>.yachejka.y-300{grid-row-start:300}.setka-glavnoj>.yachejka.y-301{grid-row-start:301}.setka-glavnoj>.yachejka.y-302{grid-row-start:302}.setka-glavnoj>.yachejka.y-303{grid-row-start:303}.setka-glavnoj>.yachejka.y-304{grid-row-start:304}.setka-glavnoj>.yachejka.y-305{grid-row-start:305}.setka-glavnoj>.yachejka.y-306{grid-row-start:306}.setka-glavnoj>.yachejka.y-307{grid-row-start:307}.setka-glavnoj>.yachejka.y-308{grid-row-start:308}.setka-glavnoj>.yachejka.y-309{grid-row-start:309}.setka-glavnoj>.yachejka.y-310{grid-row-start:310}.setka-glavnoj>.yachejka.y-311{grid-row-start:311}.setka-glavnoj>.yachejka.y-312{grid-row-start:312}.setka-glavnoj>.yachejka.y-313{grid-row-start:313}.setka-glavnoj>.yachejka.y-314{grid-row-start:314}.setka-glavnoj>.yachejka.y-315{grid-row-start:315}.setka-glavnoj>.yachejka.y-316{grid-row-start:316}.setka-glavnoj>.yachejka.y-317{grid-row-start:317}.setka-glavnoj>.yachejka.y-318{grid-row-start:318}.setka-glavnoj>.yachejka.y-319{grid-row-start:319}.setka-glavnoj>.yachejka.y-320{grid-row-start:320}.setka-glavnoj>.yachejka.y-321{grid-row-start:321}.setka-glavnoj>.yachejka.y-322{grid-row-start:322}.setka-glavnoj>.yachejka.y-323{grid-row-start:323}.setka-glavnoj>.yachejka.y-324{grid-row-start:324}.setka-glavnoj>.yachejka.y-325{grid-row-start:325}.setka-glavnoj>.yachejka.y-326{grid-row-start:326}.setka-glavnoj>.yachejka.y-327{grid-row-start:327}.setka-glavnoj>.yachejka.y-328{grid-row-start:328}.setka-glavnoj>.yachejka.y-329{grid-row-start:329}.setka-glavnoj>.yachejka.y-330{grid-row-start:330}.setka-glavnoj>.yachejka.y-331{grid-row-start:331}.setka-glavnoj>.yachejka.y-332{grid-row-start:332}.setka-glavnoj>.yachejka.y-333{grid-row-start:333}.setka-glavnoj>.yachejka.y-334{grid-row-start:334}.setka-glavnoj>.yachejka.y-335{grid-row-start:335}.setka-glavnoj>.yachejka.y-336{grid-row-start:336}.setka-glavnoj>.yachejka.y-337{grid-row-start:337}.setka-glavnoj>.yachejka.y-338{grid-row-start:338}.setka-glavnoj>.yachejka.y-339{grid-row-start:339}.setka-glavnoj>.yachejka.y-340{grid-row-start:340}.setka-glavnoj>.yachejka.y-341{grid-row-start:341}.setka-glavnoj>.yachejka.y-342{grid-row-start:342}.setka-glavnoj>.yachejka.y-343{grid-row-start:343}.setka-glavnoj>.yachejka.y-344{grid-row-start:344}.setka-glavnoj>.yachejka.y-345{grid-row-start:345}.setka-glavnoj>.yachejka.y-346{grid-row-start:346}.setka-glavnoj>.yachejka.y-347{grid-row-start:347}.setka-glavnoj>.yachejka.y-348{grid-row-start:348}.setka-glavnoj>.yachejka.y-349{grid-row-start:349}.setka-glavnoj>.yachejka.y-350{grid-row-start:350}.setka-glavnoj>.yachejka.y-351{grid-row-start:351}.setka-glavnoj>.yachejka.y-352{grid-row-start:352}.setka-glavnoj>.yachejka.y-353{grid-row-start:353}.setka-glavnoj>.yachejka.y-354{grid-row-start:354}.setka-glavnoj>.yachejka.y-355{grid-row-start:355}.setka-glavnoj>.yachejka.y-356{grid-row-start:356}.setka-glavnoj>.yachejka.y-357{grid-row-start:357}.setka-glavnoj>.yachejka.y-358{grid-row-start:358}.setka-glavnoj>.yachejka.y-359{grid-row-start:359}.setka-glavnoj>.yachejka.y-360{grid-row-start:360}.setka-glavnoj>.yachejka.y-361{grid-row-start:361}.setka-glavnoj>.yachejka.y-362{grid-row-start:362}.setka-glavnoj>.yachejka.y-363{grid-row-start:363}.setka-glavnoj>.yachejka.y-364{grid-row-start:364}.setka-glavnoj>.yachejka.y-365{grid-row-start:365}.setka-glavnoj>.yachejka.y-366{grid-row-start:366}.setka-glavnoj>.yachejka.y-367{grid-row-start:367}.setka-glavnoj>.yachejka.y-368{grid-row-start:368}.setka-glavnoj>.yachejka.y-369{grid-row-start:369}.setka-glavnoj>.yachejka.y-370{grid-row-start:370}.setka-glavnoj>.yachejka.y-371{grid-row-start:371}.setka-glavnoj>.yachejka.y-372{grid-row-start:372}.setka-glavnoj>.yachejka.y-373{grid-row-start:373}.setka-glavnoj>.yachejka.y-374{grid-row-start:374}.setka-glavnoj>.yachejka.y-375{grid-row-start:375}.setka-glavnoj>.yachejka.y-376{grid-row-start:376}.setka-glavnoj>.yachejka.y-377{grid-row-start:377}.setka-glavnoj>.yachejka.y-378{grid-row-start:378}.setka-glavnoj>.yachejka.y-379{grid-row-start:379}.setka-glavnoj>.yachejka.y-380{grid-row-start:380}.setka-glavnoj>.yachejka.y-381{grid-row-start:381}.setka-glavnoj>.yachejka.y-382{grid-row-start:382}.setka-glavnoj>.yachejka.y-383{grid-row-start:383}.setka-glavnoj>.yachejka.y-384{grid-row-start:384}.setka-glavnoj>.yachejka.y-385{grid-row-start:385}.setka-glavnoj>.yachejka.y-386{grid-row-start:386}.setka-glavnoj>.yachejka.y-387{grid-row-start:387}.setka-glavnoj>.yachejka.y-388{grid-row-start:388}.setka-glavnoj>.yachejka.y-389{grid-row-start:389}.setka-glavnoj>.yachejka.y-390{grid-row-start:390}.setka-glavnoj>.yachejka.y-391{grid-row-start:391}.setka-glavnoj>.yachejka.y-392{grid-row-start:392}.setka-glavnoj>.yachejka.y-393{grid-row-start:393}.setka-glavnoj>.yachejka.y-394{grid-row-start:394}.setka-glavnoj>.yachejka.y-395{grid-row-start:395}.setka-glavnoj>.yachejka.y-396{grid-row-start:396}.setka-glavnoj>.yachejka.y-397{grid-row-start:397}.setka-glavnoj>.yachejka.y-398{grid-row-start:398}.setka-glavnoj>.yachejka.y-399{grid-row-start:399}.setka-glavnoj>.yachejka.y-400{grid-row-start:400}
.setka-glavnoj>.yachejka.w-1{grid-column-end:span 1}.setka-glavnoj>.yachejka.w-2{grid-column-end:span 2}.setka-glavnoj>.yachejka.w-3{grid-column-end:span 3}.setka-glavnoj>.yachejka.w-4{grid-column-end:span 4}.setka-glavnoj>.yachejka.w-5{grid-column-end:span 5}.setka-glavnoj>.yachejka.w-6{grid-column-end:span 6}.setka-glavnoj>.yachejka.w-7{grid-column-end:span 7}.setka-glavnoj>.yachejka.w-8{grid-column-end:span 8}.setka-glavnoj>.yachejka.w-9{grid-column-end:span 9}.setka-glavnoj>.yachejka.w-10{grid-column-end:span 10}.setka-glavnoj>.yachejka.w-11{grid-column-end:span 11}.setka-glavnoj>.yachejka.w-12{grid-column-end:span 12}.setka-glavnoj>.yachejka.w-13{grid-column-end:span 13}.setka-glavnoj>.yachejka.w-14{grid-column-end:span 14}.setka-glavnoj>.yachejka.w-15{grid-column-end:span 15}.setka-glavnoj>.yachejka.w-16{grid-column-end:span 16}.setka-glavnoj>.yachejka.w-17{grid-column-end:span 17}.setka-glavnoj>.yachejka.w-18{grid-column-end:span 18}.setka-glavnoj>.yachejka.w-19{grid-column-end:span 19}.setka-glavnoj>.yachejka.w-20{grid-column-end:span 20}.setka-glavnoj>.yachejka.w-21{grid-column-end:span 21}.setka-glavnoj>.yachejka.w-22{grid-column-end:span 22}.setka-glavnoj>.yachejka.w-23{grid-column-end:span 23}.setka-glavnoj>.yachejka.w-24{grid-column-end:span 24}.setka-glavnoj>.yachejka.w-25{grid-column-end:span 25}.setka-glavnoj>.yachejka.w-26{grid-column-end:span 26}.setka-glavnoj>.yachejka.w-27{grid-column-end:span 27}.setka-glavnoj>.yachejka.w-28{grid-column-end:span 28}.setka-glavnoj>.yachejka.w-29{grid-column-end:span 29}.setka-glavnoj>.yachejka.w-30{grid-column-end:span 30}.setka-glavnoj>.yachejka.w-31{grid-column-end:span 31}.setka-glavnoj>.yachejka.w-32{grid-column-end:span 32}.setka-glavnoj>.yachejka.w-33{grid-column-end:span 33}.setka-glavnoj>.yachejka.w-34{grid-column-end:span 34}.setka-glavnoj>.yachejka.w-35{grid-column-end:span 35}.setka-glavnoj>.yachejka.w-36{grid-column-end:span 36}.setka-glavnoj>.yachejka.w-37{grid-column-end:span 37}.setka-glavnoj>.yachejka.w-38{grid-column-end:span 38}.setka-glavnoj>.yachejka.w-39{grid-column-end:span 39}.setka-glavnoj>.yachejka.w-40{grid-column-end:span 40}.setka-glavnoj>.yachejka.w-41{grid-column-end:span 41}.setka-glavnoj>.yachejka.w-42{grid-column-end:span 42}.setka-glavnoj>.yachejka.w-43{grid-column-end:span 43}.setka-glavnoj>.yachejka.w-44{grid-column-end:span 44}.setka-glavnoj>.yachejka.w-45{grid-column-end:span 45}.setka-glavnoj>.yachejka.w-46{grid-column-end:span 46}.setka-glavnoj>.yachejka.w-47{grid-column-end:span 47}.setka-glavnoj>.yachejka.w-48{grid-column-end:span 48}
.setka-glavnoj>.yachejka.h-1{grid-row-end:span 1}.setka-glavnoj>.yachejka.h-2{grid-row-end:span 2}.setka-glavnoj>.yachejka.h-3{grid-row-end:span 3}.setka-glavnoj>.yachejka.h-4{grid-row-end:span 4}.setka-glavnoj>.yachejka.h-5{grid-row-end:span 5}.setka-glavnoj>.yachejka.h-6{grid-row-end:span 6}.setka-glavnoj>.yachejka.h-7{grid-row-end:span 7}.setka-glavnoj>.yachejka.h-8{grid-row-end:span 8}.setka-glavnoj>.yachejka.h-9{grid-row-end:span 9}.setka-glavnoj>.yachejka.h-10{grid-row-end:span 10}.setka-glavnoj>.yachejka.h-11{grid-row-end:span 11}.setka-glavnoj>.yachejka.h-12{grid-row-end:span 12}.setka-glavnoj>.yachejka.h-13{grid-row-end:span 13}.setka-glavnoj>.yachejka.h-14{grid-row-end:span 14}.setka-glavnoj>.yachejka.h-15{grid-row-end:span 15}.setka-glavnoj>.yachejka.h-16{grid-row-end:span 16}.setka-glavnoj>.yachejka.h-17{grid-row-end:span 17}.setka-glavnoj>.yachejka.h-18{grid-row-end:span 18}.setka-glavnoj>.yachejka.h-19{grid-row-end:span 19}.setka-glavnoj>.yachejka.h-20{grid-row-end:span 20}.setka-glavnoj>.yachejka.h-21{grid-row-end:span 21}.setka-glavnoj>.yachejka.h-22{grid-row-end:span 22}.setka-glavnoj>.yachejka.h-23{grid-row-end:span 23}.setka-glavnoj>.yachejka.h-24{grid-row-end:span 24}.setka-glavnoj>.yachejka.h-25{grid-row-end:span 25}.setka-glavnoj>.yachejka.h-26{grid-row-end:span 26}.setka-glavnoj>.yachejka.h-27{grid-row-end:span 27}.setka-glavnoj>.yachejka.h-28{grid-row-end:span 28}.setka-glavnoj>.yachejka.h-29{grid-row-end:span 29}.setka-glavnoj>.yachejka.h-30{grid-row-end:span 30}.setka-glavnoj>.yachejka.h-31{grid-row-end:span 31}.setka-glavnoj>.yachejka.h-32{grid-row-end:span 32}.setka-glavnoj>.yachejka.h-33{grid-row-end:span 33}.setka-glavnoj>.yachejka.h-34{grid-row-end:span 34}.setka-glavnoj>.yachejka.h-35{grid-row-end:span 35}.setka-glavnoj>.yachejka.h-36{grid-row-end:span 36}.setka-glavnoj>.yachejka.h-37{grid-row-end:span 37}.setka-glavnoj>.yachejka.h-38{grid-row-end:span 38}.setka-glavnoj>.yachejka.h-39{grid-row-end:span 39}.setka-glavnoj>.yachejka.h-40{grid-row-end:span 40}.setka-glavnoj>.yachejka.h-41{grid-row-end:span 41}.setka-glavnoj>.yachejka.h-42{grid-row-end:span 42}.setka-glavnoj>.yachejka.h-43{grid-row-end:span 43}.setka-glavnoj>.yachejka.h-44{grid-row-end:span 44}.setka-glavnoj>.yachejka.h-45{grid-row-end:span 45}.setka-glavnoj>.yachejka.h-46{grid-row-end:span 46}.setka-glavnoj>.yachejka.h-47{grid-row-end:span 47}.setka-glavnoj>.yachejka.h-48{grid-row-end:span 48}.setka-glavnoj>.yachejka.h-49{grid-row-end:span 49}.setka-glavnoj>.yachejka.h-50{grid-row-end:span 50}.setka-glavnoj>.yachejka.h-51{grid-row-end:span 51}.setka-glavnoj>.yachejka.h-52{grid-row-end:span 52}.setka-glavnoj>.yachejka.h-53{grid-row-end:span 53}.setka-glavnoj>.yachejka.h-54{grid-row-end:span 54}.setka-glavnoj>.yachejka.h-55{grid-row-end:span 55}.setka-glavnoj>.yachejka.h-56{grid-row-end:span 56}.setka-glavnoj>.yachejka.h-57{grid-row-end:span 57}.setka-glavnoj>.yachejka.h-58{grid-row-end:span 58}.setka-glavnoj>.yachejka.h-59{grid-row-end:span 59}.setka-glavnoj>.yachejka.h-60{grid-row-end:span 60}.setka-glavnoj>.yachejka.h-61{grid-row-end:span 61}.setka-glavnoj>.yachejka.h-62{grid-row-end:span 62}.setka-glavnoj>.yachejka.h-63{grid-row-end:span 63}.setka-glavnoj>.yachejka.h-64{grid-row-end:span 64}.setka-glavnoj>.yachejka.h-65{grid-row-end:span 65}.setka-glavnoj>.yachejka.h-66{grid-row-end:span 66}.setka-glavnoj>.yachejka.h-67{grid-row-end:span 67}.setka-glavnoj>.yachejka.h-68{grid-row-end:span 68}.setka-glavnoj>.yachejka.h-69{grid-row-end:span 69}.setka-glavnoj>.yachejka.h-70{grid-row-end:span 70}.setka-glavnoj>.yachejka.h-71{grid-row-end:span 71}.setka-glavnoj>.yachejka.h-72{grid-row-end:span 72}.setka-glavnoj>.yachejka.h-73{grid-row-end:span 73}.setka-glavnoj>.yachejka.h-74{grid-row-end:span 74}.setka-glavnoj>.yachejka.h-75{grid-row-end:span 75}.setka-glavnoj>.yachejka.h-76{grid-row-end:span 76}.setka-glavnoj>.yachejka.h-77{grid-row-end:span 77}.setka-glavnoj>.yachejka.h-78{grid-row-end:span 78}.setka-glavnoj>.yachejka.h-79{grid-row-end:span 79}.setka-glavnoj>.yachejka.h-80{grid-row-end:span 80}.setka-glavnoj>.yachejka.h-81{grid-row-end:span 81}.setka-glavnoj>.yachejka.h-82{grid-row-end:span 82}.setka-glavnoj>.yachejka.h-83{grid-row-end:span 83}.setka-glavnoj>.yachejka.h-84{grid-row-end:span 84}.setka-glavnoj>.yachejka.h-85{grid-row-end:span 85}.setka-glavnoj>.yachejka.h-86{grid-row-end:span 86}.setka-glavnoj>.yachejka.h-87{grid-row-end:span 87}.setka-glavnoj>.yachejka.h-88{grid-row-end:span 88}.setka-glavnoj>.yachejka.h-89{grid-row-end:span 89}.setka-glavnoj>.yachejka.h-90{grid-row-end:span 90}.setka-glavnoj>.yachejka.h-91{grid-row-end:span 91}.setka-glavnoj>.yachejka.h-92{grid-row-end:span 92}.setka-glavnoj>.yachejka.h-93{grid-row-end:span 93}.setka-glavnoj>.yachejka.h-94{grid-row-end:span 94}.setka-glavnoj>.yachejka.h-95{grid-row-end:span 95}.setka-glavnoj>.yachejka.h-96{grid-row-end:span 96}
.karta-mesta>.mesta-plitka.x-1{grid-column-start:1}.karta-mesta>.mesta-plitka.x-2{grid-column-start:2}.karta-mesta>.mesta-plitka.x-3{grid-column-start:3}.karta-mesta>.mesta-plitka.x-4{grid-column-start:4}.karta-mesta>.mesta-plitka.x-5{grid-column-start:5}.karta-mesta>.mesta-plitka.x-6{grid-column-start:6}.karta-mesta>.mesta-plitka.x-7{grid-column-start:7}.karta-mesta>.mesta-plitka.x-8{grid-column-start:8}.karta-mesta>.mesta-plitka.x-9{grid-column-start:9}.karta-mesta>.mesta-plitka.x-10{grid-column-start:10}.karta-mesta>.mesta-plitka.x-11{grid-column-start:11}.karta-mesta>.mesta-plitka.x-12{grid-column-start:12}.karta-mesta>.mesta-plitka.x-13{grid-column-start:13}.karta-mesta>.mesta-plitka.x-14{grid-column-start:14}.karta-mesta>.mesta-plitka.x-15{grid-column-start:15}.karta-mesta>.mesta-plitka.x-16{grid-column-start:16}.karta-mesta>.mesta-plitka.x-17{grid-column-start:17}.karta-mesta>.mesta-plitka.x-18{grid-column-start:18}.karta-mesta>.mesta-plitka.x-19{grid-column-start:19}.karta-mesta>.mesta-plitka.x-20{grid-column-start:20}.karta-mesta>.mesta-plitka.x-21{grid-column-start:21}.karta-mesta>.mesta-plitka.x-22{grid-column-start:22}.karta-mesta>.mesta-plitka.x-23{grid-column-start:23}.karta-mesta>.mesta-plitka.x-24{grid-column-start:24}.karta-mesta>.mesta-plitka.x-25{grid-column-start:25}.karta-mesta>.mesta-plitka.x-26{grid-column-start:26}.karta-mesta>.mesta-plitka.x-27{grid-column-start:27}.karta-mesta>.mesta-plitka.x-28{grid-column-start:28}.karta-mesta>.mesta-plitka.x-29{grid-column-start:29}.karta-mesta>.mesta-plitka.x-30{grid-column-start:30}.karta-mesta>.mesta-plitka.x-31{grid-column-start:31}.karta-mesta>.mesta-plitka.x-32{grid-column-start:32}.karta-mesta>.mesta-plitka.x-33{grid-column-start:33}.karta-mesta>.mesta-plitka.x-34{grid-column-start:34}.karta-mesta>.mesta-plitka.x-35{grid-column-start:35}.karta-mesta>.mesta-plitka.x-36{grid-column-start:36}.karta-mesta>.mesta-plitka.x-37{grid-column-start:37}.karta-mesta>.mesta-plitka.x-38{grid-column-start:38}.karta-mesta>.mesta-plitka.x-39{grid-column-start:39}.karta-mesta>.mesta-plitka.x-40{grid-column-start:40}.karta-mesta>.mesta-plitka.x-41{grid-column-start:41}.karta-mesta>.mesta-plitka.x-42{grid-column-start:42}.karta-mesta>.mesta-plitka.x-43{grid-column-start:43}.karta-mesta>.mesta-plitka.x-44{grid-column-start:44}.karta-mesta>.mesta-plitka.x-45{grid-column-start:45}.karta-mesta>.mesta-plitka.x-46{grid-column-start:46}.karta-mesta>.mesta-plitka.x-47{grid-column-start:47}.karta-mesta>.mesta-plitka.x-48{grid-column-start:48}
.karta-mesta>.mesta-plitka.y-1{grid-row-start:1}.karta-mesta>.mesta-plitka.y-2{grid-row-start:2}.karta-mesta>.mesta-plitka.y-3{grid-row-start:3}.karta-mesta>.mesta-plitka.y-4{grid-row-start:4}.karta-mesta>.mesta-plitka.y-5{grid-row-start:5}.karta-mesta>.mesta-plitka.y-6{grid-row-start:6}.karta-mesta>.mesta-plitka.y-7{grid-row-start:7}.karta-mesta>.mesta-plitka.y-8{grid-row-start:8}.karta-mesta>.mesta-plitka.y-9{grid-row-start:9}.karta-mesta>.mesta-plitka.y-10{grid-row-start:10}.karta-mesta>.mesta-plitka.y-11{grid-row-start:11}.karta-mesta>.mesta-plitka.y-12{grid-row-start:12}.karta-mesta>.mesta-plitka.y-13{grid-row-start:13}.karta-mesta>.mesta-plitka.y-14{grid-row-start:14}.karta-mesta>.mesta-plitka.y-15{grid-row-start:15}.karta-mesta>.mesta-plitka.y-16{grid-row-start:16}.karta-mesta>.mesta-plitka.y-17{grid-row-start:17}.karta-mesta>.mesta-plitka.y-18{grid-row-start:18}.karta-mesta>.mesta-plitka.y-19{grid-row-start:19}.karta-mesta>.mesta-plitka.y-20{grid-row-start:20}.karta-mesta>.mesta-plitka.y-21{grid-row-start:21}.karta-mesta>.mesta-plitka.y-22{grid-row-start:22}.karta-mesta>.mesta-plitka.y-23{grid-row-start:23}.karta-mesta>.mesta-plitka.y-24{grid-row-start:24}.karta-mesta>.mesta-plitka.y-25{grid-row-start:25}.karta-mesta>.mesta-plitka.y-26{grid-row-start:26}.karta-mesta>.mesta-plitka.y-27{grid-row-start:27}.karta-mesta>.mesta-plitka.y-28{grid-row-start:28}.karta-mesta>.mesta-plitka.y-29{grid-row-start:29}.karta-mesta>.mesta-plitka.y-30{grid-row-start:30}.karta-mesta>.mesta-plitka.y-31{grid-row-start:31}.karta-mesta>.mesta-plitka.y-32{grid-row-start:32}.karta-mesta>.mesta-plitka.y-33{grid-row-start:33}.karta-mesta>.mesta-plitka.y-34{grid-row-start:34}.karta-mesta>.mesta-plitka.y-35{grid-row-start:35}.karta-mesta>.mesta-plitka.y-36{grid-row-start:36}.karta-mesta>.mesta-plitka.y-37{grid-row-start:37}.karta-mesta>.mesta-plitka.y-38{grid-row-start:38}.karta-mesta>.mesta-plitka.y-39{grid-row-start:39}.karta-mesta>.mesta-plitka.y-40{grid-row-start:40}.karta-mesta>.mesta-plitka.y-41{grid-row-start:41}.karta-mesta>.mesta-plitka.y-42{grid-row-start:42}.karta-mesta>.mesta-plitka.y-43{grid-row-start:43}.karta-mesta>.mesta-plitka.y-44{grid-row-start:44}.karta-mesta>.mesta-plitka.y-45{grid-row-start:45}.karta-mesta>.mesta-plitka.y-46{grid-row-start:46}.karta-mesta>.mesta-plitka.y-47{grid-row-start:47}.karta-mesta>.mesta-plitka.y-48{grid-row-start:48}.karta-mesta>.mesta-plitka.y-49{grid-row-start:49}.karta-mesta>.mesta-plitka.y-50{grid-row-start:50}.karta-mesta>.mesta-plitka.y-51{grid-row-start:51}.karta-mesta>.mesta-plitka.y-52{grid-row-start:52}.karta-mesta>.mesta-plitka.y-53{grid-row-start:53}.karta-mesta>.mesta-plitka.y-54{grid-row-start:54}.karta-mesta>.mesta-plitka.y-55{grid-row-start:55}.karta-mesta>.mesta-plitka.y-56{grid-row-start:56}.karta-mesta>.mesta-plitka.y-57{grid-row-start:57}.karta-mesta>.mesta-plitka.y-58{grid-row-start:58}.karta-mesta>.mesta-plitka.y-59{grid-row-start:59}.karta-mesta>.mesta-plitka.y-60{grid-row-start:60}.karta-mesta>.mesta-plitka.y-61{grid-row-start:61}.karta-mesta>.mesta-plitka.y-62{grid-row-start:62}.karta-mesta>.mesta-plitka.y-63{grid-row-start:63}.karta-mesta>.mesta-plitka.y-64{grid-row-start:64}.karta-mesta>.mesta-plitka.y-65{grid-row-start:65}.karta-mesta>.mesta-plitka.y-66{grid-row-start:66}.karta-mesta>.mesta-plitka.y-67{grid-row-start:67}.karta-mesta>.mesta-plitka.y-68{grid-row-start:68}.karta-mesta>.mesta-plitka.y-69{grid-row-start:69}.karta-mesta>.mesta-plitka.y-70{grid-row-start:70}.karta-mesta>.mesta-plitka.y-71{grid-row-start:71}.karta-mesta>.mesta-plitka.y-72{grid-row-start:72}.karta-mesta>.mesta-plitka.y-73{grid-row-start:73}.karta-mesta>.mesta-plitka.y-74{grid-row-start:74}.karta-mesta>.mesta-plitka.y-75{grid-row-start:75}.karta-mesta>.mesta-plitka.y-76{grid-row-start:76}.karta-mesta>.mesta-plitka.y-77{grid-row-start:77}.karta-mesta>.mesta-plitka.y-78{grid-row-start:78}.karta-mesta>.mesta-plitka.y-79{grid-row-start:79}.karta-mesta>.mesta-plitka.y-80{grid-row-start:80}.karta-mesta>.mesta-plitka.y-81{grid-row-start:81}.karta-mesta>.mesta-plitka.y-82{grid-row-start:82}.karta-mesta>.mesta-plitka.y-83{grid-row-start:83}.karta-mesta>.mesta-plitka.y-84{grid-row-start:84}.karta-mesta>.mesta-plitka.y-85{grid-row-start:85}.karta-mesta>.mesta-plitka.y-86{grid-row-start:86}.karta-mesta>.mesta-plitka.y-87{grid-row-start:87}.karta-mesta>.mesta-plitka.y-88{grid-row-start:88}.karta-mesta>.mesta-plitka.y-89{grid-row-start:89}.karta-mesta>.mesta-plitka.y-90{grid-row-start:90}.karta-mesta>.mesta-plitka.y-91{grid-row-start:91}.karta-mesta>.mesta-plitka.y-92{grid-row-start:92}.karta-mesta>.mesta-plitka.y-93{grid-row-start:93}.karta-mesta>.mesta-plitka.y-94{grid-row-start:94}.karta-mesta>.mesta-plitka.y-95{grid-row-start:95}.karta-mesta>.mesta-plitka.y-96{grid-row-start:96}.karta-mesta>.mesta-plitka.y-97{grid-row-start:97}.karta-mesta>.mesta-plitka.y-98{grid-row-start:98}.karta-mesta>.mesta-plitka.y-99{grid-row-start:99}.karta-mesta>.mesta-plitka.y-100{grid-row-start:100}.karta-mesta>.mesta-plitka.y-101{grid-row-start:101}.karta-mesta>.mesta-plitka.y-102{grid-row-start:102}.karta-mesta>.mesta-plitka.y-103{grid-row-start:103}.karta-mesta>.mesta-plitka.y-104{grid-row-start:104}.karta-mesta>.mesta-plitka.y-105{grid-row-start:105}.karta-mesta>.mesta-plitka.y-106{grid-row-start:106}.karta-mesta>.mesta-plitka.y-107{grid-row-start:107}.karta-mesta>.mesta-plitka.y-108{grid-row-start:108}.karta-mesta>.mesta-plitka.y-109{grid-row-start:109}.karta-mesta>.mesta-plitka.y-110{grid-row-start:110}.karta-mesta>.mesta-plitka.y-111{grid-row-start:111}.karta-mesta>.mesta-plitka.y-112{grid-row-start:112}.karta-mesta>.mesta-plitka.y-113{grid-row-start:113}.karta-mesta>.mesta-plitka.y-114{grid-row-start:114}.karta-mesta>.mesta-plitka.y-115{grid-row-start:115}.karta-mesta>.mesta-plitka.y-116{grid-row-start:116}.karta-mesta>.mesta-plitka.y-117{grid-row-start:117}.karta-mesta>.mesta-plitka.y-118{grid-row-start:118}.karta-mesta>.mesta-plitka.y-119{grid-row-start:119}.karta-mesta>.mesta-plitka.y-120{grid-row-start:120}.karta-mesta>.mesta-plitka.y-121{grid-row-start:121}.karta-mesta>.mesta-plitka.y-122{grid-row-start:122}.karta-mesta>.mesta-plitka.y-123{grid-row-start:123}.karta-mesta>.mesta-plitka.y-124{grid-row-start:124}.karta-mesta>.mesta-plitka.y-125{grid-row-start:125}.karta-mesta>.mesta-plitka.y-126{grid-row-start:126}.karta-mesta>.mesta-plitka.y-127{grid-row-start:127}.karta-mesta>.mesta-plitka.y-128{grid-row-start:128}.karta-mesta>.mesta-plitka.y-129{grid-row-start:129}.karta-mesta>.mesta-plitka.y-130{grid-row-start:130}.karta-mesta>.mesta-plitka.y-131{grid-row-start:131}.karta-mesta>.mesta-plitka.y-132{grid-row-start:132}.karta-mesta>.mesta-plitka.y-133{grid-row-start:133}.karta-mesta>.mesta-plitka.y-134{grid-row-start:134}.karta-mesta>.mesta-plitka.y-135{grid-row-start:135}.karta-mesta>.mesta-plitka.y-136{grid-row-start:136}.karta-mesta>.mesta-plitka.y-137{grid-row-start:137}.karta-mesta>.mesta-plitka.y-138{grid-row-start:138}.karta-mesta>.mesta-plitka.y-139{grid-row-start:139}.karta-mesta>.mesta-plitka.y-140{grid-row-start:140}.karta-mesta>.mesta-plitka.y-141{grid-row-start:141}.karta-mesta>.mesta-plitka.y-142{grid-row-start:142}.karta-mesta>.mesta-plitka.y-143{grid-row-start:143}.karta-mesta>.mesta-plitka.y-144{grid-row-start:144}.karta-mesta>.mesta-plitka.y-145{grid-row-start:145}.karta-mesta>.mesta-plitka.y-146{grid-row-start:146}.karta-mesta>.mesta-plitka.y-147{grid-row-start:147}.karta-mesta>.mesta-plitka.y-148{grid-row-start:148}.karta-mesta>.mesta-plitka.y-149{grid-row-start:149}.karta-mesta>.mesta-plitka.y-150{grid-row-start:150}.karta-mesta>.mesta-plitka.y-151{grid-row-start:151}.karta-mesta>.mesta-plitka.y-152{grid-row-start:152}.karta-mesta>.mesta-plitka.y-153{grid-row-start:153}.karta-mesta>.mesta-plitka.y-154{grid-row-start:154}.karta-mesta>.mesta-plitka.y-155{grid-row-start:155}.karta-mesta>.mesta-plitka.y-156{grid-row-start:156}.karta-mesta>.mesta-plitka.y-157{grid-row-start:157}.karta-mesta>.mesta-plitka.y-158{grid-row-start:158}.karta-mesta>.mesta-plitka.y-159{grid-row-start:159}.karta-mesta>.mesta-plitka.y-160{grid-row-start:160}.karta-mesta>.mesta-plitka.y-161{grid-row-start:161}.karta-mesta>.mesta-plitka.y-162{grid-row-start:162}.karta-mesta>.mesta-plitka.y-163{grid-row-start:163}.karta-mesta>.mesta-plitka.y-164{grid-row-start:164}.karta-mesta>.mesta-plitka.y-165{grid-row-start:165}.karta-mesta>.mesta-plitka.y-166{grid-row-start:166}.karta-mesta>.mesta-plitka.y-167{grid-row-start:167}.karta-mesta>.mesta-plitka.y-168{grid-row-start:168}.karta-mesta>.mesta-plitka.y-169{grid-row-start:169}.karta-mesta>.mesta-plitka.y-170{grid-row-start:170}.karta-mesta>.mesta-plitka.y-171{grid-row-start:171}.karta-mesta>.mesta-plitka.y-172{grid-row-start:172}.karta-mesta>.mesta-plitka.y-173{grid-row-start:173}.karta-mesta>.mesta-plitka.y-174{grid-row-start:174}.karta-mesta>.mesta-plitka.y-175{grid-row-start:175}.karta-mesta>.mesta-plitka.y-176{grid-row-start:176}.karta-mesta>.mesta-plitka.y-177{grid-row-start:177}.karta-mesta>.mesta-plitka.y-178{grid-row-start:178}.karta-mesta>.mesta-plitka.y-179{grid-row-start:179}.karta-mesta>.mesta-plitka.y-180{grid-row-start:180}.karta-mesta>.mesta-plitka.y-181{grid-row-start:181}.karta-mesta>.mesta-plitka.y-182{grid-row-start:182}.karta-mesta>.mesta-plitka.y-183{grid-row-start:183}.karta-mesta>.mesta-plitka.y-184{grid-row-start:184}.karta-mesta>.mesta-plitka.y-185{grid-row-start:185}.karta-mesta>.mesta-plitka.y-186{grid-row-start:186}.karta-mesta>.mesta-plitka.y-187{grid-row-start:187}.karta-mesta>.mesta-plitka.y-188{grid-row-start:188}.karta-mesta>.mesta-plitka.y-189{grid-row-start:189}.karta-mesta>.mesta-plitka.y-190{grid-row-start:190}.karta-mesta>.mesta-plitka.y-191{grid-row-start:191}.karta-mesta>.mesta-plitka.y-192{grid-row-start:192}.karta-mesta>.mesta-plitka.y-193{grid-row-start:193}.karta-mesta>.mesta-plitka.y-194{grid-row-start:194}.karta-mesta>.mesta-plitka.y-195{grid-row-start:195}.karta-mesta>.mesta-plitka.y-196{grid-row-start:196}.karta-mesta>.mesta-plitka.y-197{grid-row-start:197}.karta-mesta>.mesta-plitka.y-198{grid-row-start:198}.karta-mesta>.mesta-plitka.y-199{grid-row-start:199}.karta-mesta>.mesta-plitka.y-200{grid-row-start:200}.karta-mesta>.mesta-plitka.y-201{grid-row-start:201}.karta-mesta>.mesta-plitka.y-202{grid-row-start:202}.karta-mesta>.mesta-plitka.y-203{grid-row-start:203}.karta-mesta>.mesta-plitka.y-204{grid-row-start:204}.karta-mesta>.mesta-plitka.y-205{grid-row-start:205}.karta-mesta>.mesta-plitka.y-206{grid-row-start:206}.karta-mesta>.mesta-plitka.y-207{grid-row-start:207}.karta-mesta>.mesta-plitka.y-208{grid-row-start:208}.karta-mesta>.mesta-plitka.y-209{grid-row-start:209}.karta-mesta>.mesta-plitka.y-210{grid-row-start:210}.karta-mesta>.mesta-plitka.y-211{grid-row-start:211}.karta-mesta>.mesta-plitka.y-212{grid-row-start:212}.karta-mesta>.mesta-plitka.y-213{grid-row-start:213}.karta-mesta>.mesta-plitka.y-214{grid-row-start:214}.karta-mesta>.mesta-plitka.y-215{grid-row-start:215}.karta-mesta>.mesta-plitka.y-216{grid-row-start:216}.karta-mesta>.mesta-plitka.y-217{grid-row-start:217}.karta-mesta>.mesta-plitka.y-218{grid-row-start:218}.karta-mesta>.mesta-plitka.y-219{grid-row-start:219}.karta-mesta>.mesta-plitka.y-220{grid-row-start:220}.karta-mesta>.mesta-plitka.y-221{grid-row-start:221}.karta-mesta>.mesta-plitka.y-222{grid-row-start:222}.karta-mesta>.mesta-plitka.y-223{grid-row-start:223}.karta-mesta>.mesta-plitka.y-224{grid-row-start:224}.karta-mesta>.mesta-plitka.y-225{grid-row-start:225}.karta-mesta>.mesta-plitka.y-226{grid-row-start:226}.karta-mesta>.mesta-plitka.y-227{grid-row-start:227}.karta-mesta>.mesta-plitka.y-228{grid-row-start:228}.karta-mesta>.mesta-plitka.y-229{grid-row-start:229}.karta-mesta>.mesta-plitka.y-230{grid-row-start:230}.karta-mesta>.mesta-plitka.y-231{grid-row-start:231}.karta-mesta>.mesta-plitka.y-232{grid-row-start:232}.karta-mesta>.mesta-plitka.y-233{grid-row-start:233}.karta-mesta>.mesta-plitka.y-234{grid-row-start:234}.karta-mesta>.mesta-plitka.y-235{grid-row-start:235}.karta-mesta>.mesta-plitka.y-236{grid-row-start:236}.karta-mesta>.mesta-plitka.y-237{grid-row-start:237}.karta-mesta>.mesta-plitka.y-238{grid-row-start:238}.karta-mesta>.mesta-plitka.y-239{grid-row-start:239}.karta-mesta>.mesta-plitka.y-240{grid-row-start:240}.karta-mesta>.mesta-plitka.y-241{grid-row-start:241}.karta-mesta>.mesta-plitka.y-242{grid-row-start:242}.karta-mesta>.mesta-plitka.y-243{grid-row-start:243}.karta-mesta>.mesta-plitka.y-244{grid-row-start:244}.karta-mesta>.mesta-plitka.y-245{grid-row-start:245}.karta-mesta>.mesta-plitka.y-246{grid-row-start:246}.karta-mesta>.mesta-plitka.y-247{grid-row-start:247}.karta-mesta>.mesta-plitka.y-248{grid-row-start:248}.karta-mesta>.mesta-plitka.y-249{grid-row-start:249}.karta-mesta>.mesta-plitka.y-250{grid-row-start:250}.karta-mesta>.mesta-plitka.y-251{grid-row-start:251}.karta-mesta>.mesta-plitka.y-252{grid-row-start:252}.karta-mesta>.mesta-plitka.y-253{grid-row-start:253}.karta-mesta>.mesta-plitka.y-254{grid-row-start:254}.karta-mesta>.mesta-plitka.y-255{grid-row-start:255}.karta-mesta>.mesta-plitka.y-256{grid-row-start:256}.karta-mesta>.mesta-plitka.y-257{grid-row-start:257}.karta-mesta>.mesta-plitka.y-258{grid-row-start:258}.karta-mesta>.mesta-plitka.y-259{grid-row-start:259}.karta-mesta>.mesta-plitka.y-260{grid-row-start:260}.karta-mesta>.mesta-plitka.y-261{grid-row-start:261}.karta-mesta>.mesta-plitka.y-262{grid-row-start:262}.karta-mesta>.mesta-plitka.y-263{grid-row-start:263}.karta-mesta>.mesta-plitka.y-264{grid-row-start:264}.karta-mesta>.mesta-plitka.y-265{grid-row-start:265}.karta-mesta>.mesta-plitka.y-266{grid-row-start:266}.karta-mesta>.mesta-plitka.y-267{grid-row-start:267}.karta-mesta>.mesta-plitka.y-268{grid-row-start:268}.karta-mesta>.mesta-plitka.y-269{grid-row-start:269}.karta-mesta>.mesta-plitka.y-270{grid-row-start:270}.karta-mesta>.mesta-plitka.y-271{grid-row-start:271}.karta-mesta>.mesta-plitka.y-272{grid-row-start:272}.karta-mesta>.mesta-plitka.y-273{grid-row-start:273}.karta-mesta>.mesta-plitka.y-274{grid-row-start:274}.karta-mesta>.mesta-plitka.y-275{grid-row-start:275}.karta-mesta>.mesta-plitka.y-276{grid-row-start:276}.karta-mesta>.mesta-plitka.y-277{grid-row-start:277}.karta-mesta>.mesta-plitka.y-278{grid-row-start:278}.karta-mesta>.mesta-plitka.y-279{grid-row-start:279}.karta-mesta>.mesta-plitka.y-280{grid-row-start:280}.karta-mesta>.mesta-plitka.y-281{grid-row-start:281}.karta-mesta>.mesta-plitka.y-282{grid-row-start:282}.karta-mesta>.mesta-plitka.y-283{grid-row-start:283}.karta-mesta>.mesta-plitka.y-284{grid-row-start:284}.karta-mesta>.mesta-plitka.y-285{grid-row-start:285}.karta-mesta>.mesta-plitka.y-286{grid-row-start:286}.karta-mesta>.mesta-plitka.y-287{grid-row-start:287}.karta-mesta>.mesta-plitka.y-288{grid-row-start:288}.karta-mesta>.mesta-plitka.y-289{grid-row-start:289}.karta-mesta>.mesta-plitka.y-290{grid-row-start:290}.karta-mesta>.mesta-plitka.y-291{grid-row-start:291}.karta-mesta>.mesta-plitka.y-292{grid-row-start:292}.karta-mesta>.mesta-plitka.y-293{grid-row-start:293}.karta-mesta>.mesta-plitka.y-294{grid-row-start:294}.karta-mesta>.mesta-plitka.y-295{grid-row-start:295}.karta-mesta>.mesta-plitka.y-296{grid-row-start:296}.karta-mesta>.mesta-plitka.y-297{grid-row-start:297}.karta-mesta>.mesta-plitka.y-298{grid-row-start:298}.karta-mesta>.mesta-plitka.y-299{grid-row-start:299}.karta-mesta>.mesta-plitka.y-300{grid-row-start:300}.karta-mesta>.mesta-plitka.y-301{grid-row-start:301}.karta-mesta>.mesta-plitka.y-302{grid-row-start:302}.karta-mesta>.mesta-plitka.y-303{grid-row-start:303}.karta-mesta>.mesta-plitka.y-304{grid-row-start:304}.karta-mesta>.mesta-plitka.y-305{grid-row-start:305}.karta-mesta>.mesta-plitka.y-306{grid-row-start:306}.karta-mesta>.mesta-plitka.y-307{grid-row-start:307}.karta-mesta>.mesta-plitka.y-308{grid-row-start:308}.karta-mesta>.mesta-plitka.y-309{grid-row-start:309}.karta-mesta>.mesta-plitka.y-310{grid-row-start:310}.karta-mesta>.mesta-plitka.y-311{grid-row-start:311}.karta-mesta>.mesta-plitka.y-312{grid-row-start:312}.karta-mesta>.mesta-plitka.y-313{grid-row-start:313}.karta-mesta>.mesta-plitka.y-314{grid-row-start:314}.karta-mesta>.mesta-plitka.y-315{grid-row-start:315}.karta-mesta>.mesta-plitka.y-316{grid-row-start:316}.karta-mesta>.mesta-plitka.y-317{grid-row-start:317}.karta-mesta>.mesta-plitka.y-318{grid-row-start:318}.karta-mesta>.mesta-plitka.y-319{grid-row-start:319}.karta-mesta>.mesta-plitka.y-320{grid-row-start:320}.karta-mesta>.mesta-plitka.y-321{grid-row-start:321}.karta-mesta>.mesta-plitka.y-322{grid-row-start:322}.karta-mesta>.mesta-plitka.y-323{grid-row-start:323}.karta-mesta>.mesta-plitka.y-324{grid-row-start:324}.karta-mesta>.mesta-plitka.y-325{grid-row-start:325}.karta-mesta>.mesta-plitka.y-326{grid-row-start:326}.karta-mesta>.mesta-plitka.y-327{grid-row-start:327}.karta-mesta>.mesta-plitka.y-328{grid-row-start:328}.karta-mesta>.mesta-plitka.y-329{grid-row-start:329}.karta-mesta>.mesta-plitka.y-330{grid-row-start:330}.karta-mesta>.mesta-plitka.y-331{grid-row-start:331}.karta-mesta>.mesta-plitka.y-332{grid-row-start:332}.karta-mesta>.mesta-plitka.y-333{grid-row-start:333}.karta-mesta>.mesta-plitka.y-334{grid-row-start:334}.karta-mesta>.mesta-plitka.y-335{grid-row-start:335}.karta-mesta>.mesta-plitka.y-336{grid-row-start:336}.karta-mesta>.mesta-plitka.y-337{grid-row-start:337}.karta-mesta>.mesta-plitka.y-338{grid-row-start:338}.karta-mesta>.mesta-plitka.y-339{grid-row-start:339}.karta-mesta>.mesta-plitka.y-340{grid-row-start:340}.karta-mesta>.mesta-plitka.y-341{grid-row-start:341}.karta-mesta>.mesta-plitka.y-342{grid-row-start:342}.karta-mesta>.mesta-plitka.y-343{grid-row-start:343}.karta-mesta>.mesta-plitka.y-344{grid-row-start:344}.karta-mesta>.mesta-plitka.y-345{grid-row-start:345}.karta-mesta>.mesta-plitka.y-346{grid-row-start:346}.karta-mesta>.mesta-plitka.y-347{grid-row-start:347}.karta-mesta>.mesta-plitka.y-348{grid-row-start:348}.karta-mesta>.mesta-plitka.y-349{grid-row-start:349}.karta-mesta>.mesta-plitka.y-350{grid-row-start:350}.karta-mesta>.mesta-plitka.y-351{grid-row-start:351}.karta-mesta>.mesta-plitka.y-352{grid-row-start:352}.karta-mesta>.mesta-plitka.y-353{grid-row-start:353}.karta-mesta>.mesta-plitka.y-354{grid-row-start:354}.karta-mesta>.mesta-plitka.y-355{grid-row-start:355}.karta-mesta>.mesta-plitka.y-356{grid-row-start:356}.karta-mesta>.mesta-plitka.y-357{grid-row-start:357}.karta-mesta>.mesta-plitka.y-358{grid-row-start:358}.karta-mesta>.mesta-plitka.y-359{grid-row-start:359}.karta-mesta>.mesta-plitka.y-360{grid-row-start:360}.karta-mesta>.mesta-plitka.y-361{grid-row-start:361}.karta-mesta>.mesta-plitka.y-362{grid-row-start:362}.karta-mesta>.mesta-plitka.y-363{grid-row-start:363}.karta-mesta>.mesta-plitka.y-364{grid-row-start:364}.karta-mesta>.mesta-plitka.y-365{grid-row-start:365}.karta-mesta>.mesta-plitka.y-366{grid-row-start:366}.karta-mesta>.mesta-plitka.y-367{grid-row-start:367}.karta-mesta>.mesta-plitka.y-368{grid-row-start:368}.karta-mesta>.mesta-plitka.y-369{grid-row-start:369}.karta-mesta>.mesta-plitka.y-370{grid-row-start:370}.karta-mesta>.mesta-plitka.y-371{grid-row-start:371}.karta-mesta>.mesta-plitka.y-372{grid-row-start:372}.karta-mesta>.mesta-plitka.y-373{grid-row-start:373}.karta-mesta>.mesta-plitka.y-374{grid-row-start:374}.karta-mesta>.mesta-plitka.y-375{grid-row-start:375}.karta-mesta>.mesta-plitka.y-376{grid-row-start:376}.karta-mesta>.mesta-plitka.y-377{grid-row-start:377}.karta-mesta>.mesta-plitka.y-378{grid-row-start:378}.karta-mesta>.mesta-plitka.y-379{grid-row-start:379}.karta-mesta>.mesta-plitka.y-380{grid-row-start:380}.karta-mesta>.mesta-plitka.y-381{grid-row-start:381}.karta-mesta>.mesta-plitka.y-382{grid-row-start:382}.karta-mesta>.mesta-plitka.y-383{grid-row-start:383}.karta-mesta>.mesta-plitka.y-384{grid-row-start:384}.karta-mesta>.mesta-plitka.y-385{grid-row-start:385}.karta-mesta>.mesta-plitka.y-386{grid-row-start:386}.karta-mesta>.mesta-plitka.y-387{grid-row-start:387}.karta-mesta>.mesta-plitka.y-388{grid-row-start:388}.karta-mesta>.mesta-plitka.y-389{grid-row-start:389}.karta-mesta>.mesta-plitka.y-390{grid-row-start:390}.karta-mesta>.mesta-plitka.y-391{grid-row-start:391}.karta-mesta>.mesta-plitka.y-392{grid-row-start:392}.karta-mesta>.mesta-plitka.y-393{grid-row-start:393}.karta-mesta>.mesta-plitka.y-394{grid-row-start:394}.karta-mesta>.mesta-plitka.y-395{grid-row-start:395}.karta-mesta>.mesta-plitka.y-396{grid-row-start:396}.karta-mesta>.mesta-plitka.y-397{grid-row-start:397}.karta-mesta>.mesta-plitka.y-398{grid-row-start:398}.karta-mesta>.mesta-plitka.y-399{grid-row-start:399}.karta-mesta>.mesta-plitka.y-400{grid-row-start:400}
.karta-mesta>.mesta-plitka.w-1{grid-column-end:span 1}.karta-mesta>.mesta-plitka.w-2{grid-column-end:span 2}.karta-mesta>.mesta-plitka.w-3{grid-column-end:span 3}.karta-mesta>.mesta-plitka.w-4{grid-column-end:span 4}.karta-mesta>.mesta-plitka.w-5{grid-column-end:span 5}.karta-mesta>.mesta-plitka.w-6{grid-column-end:span 6}.karta-mesta>.mesta-plitka.w-7{grid-column-end:span 7}.karta-mesta>.mesta-plitka.w-8{grid-column-end:span 8}.karta-mesta>.mesta-plitka.w-9{grid-column-end:span 9}.karta-mesta>.mesta-plitka.w-10{grid-column-end:span 10}.karta-mesta>.mesta-plitka.w-11{grid-column-end:span 11}.karta-mesta>.mesta-plitka.w-12{grid-column-end:span 12}.karta-mesta>.mesta-plitka.w-13{grid-column-end:span 13}.karta-mesta>.mesta-plitka.w-14{grid-column-end:span 14}.karta-mesta>.mesta-plitka.w-15{grid-column-end:span 15}.karta-mesta>.mesta-plitka.w-16{grid-column-end:span 16}.karta-mesta>.mesta-plitka.w-17{grid-column-end:span 17}.karta-mesta>.mesta-plitka.w-18{grid-column-end:span 18}.karta-mesta>.mesta-plitka.w-19{grid-column-end:span 19}.karta-mesta>.mesta-plitka.w-20{grid-column-end:span 20}.karta-mesta>.mesta-plitka.w-21{grid-column-end:span 21}.karta-mesta>.mesta-plitka.w-22{grid-column-end:span 22}.karta-mesta>.mesta-plitka.w-23{grid-column-end:span 23}.karta-mesta>.mesta-plitka.w-24{grid-column-end:span 24}.karta-mesta>.mesta-plitka.w-25{grid-column-end:span 25}.karta-mesta>.mesta-plitka.w-26{grid-column-end:span 26}.karta-mesta>.mesta-plitka.w-27{grid-column-end:span 27}.karta-mesta>.mesta-plitka.w-28{grid-column-end:span 28}.karta-mesta>.mesta-plitka.w-29{grid-column-end:span 29}.karta-mesta>.mesta-plitka.w-30{grid-column-end:span 30}.karta-mesta>.mesta-plitka.w-31{grid-column-end:span 31}.karta-mesta>.mesta-plitka.w-32{grid-column-end:span 32}.karta-mesta>.mesta-plitka.w-33{grid-column-end:span 33}.karta-mesta>.mesta-plitka.w-34{grid-column-end:span 34}.karta-mesta>.mesta-plitka.w-35{grid-column-end:span 35}.karta-mesta>.mesta-plitka.w-36{grid-column-end:span 36}.karta-mesta>.mesta-plitka.w-37{grid-column-end:span 37}.karta-mesta>.mesta-plitka.w-38{grid-column-end:span 38}.karta-mesta>.mesta-plitka.w-39{grid-column-end:span 39}.karta-mesta>.mesta-plitka.w-40{grid-column-end:span 40}.karta-mesta>.mesta-plitka.w-41{grid-column-end:span 41}.karta-mesta>.mesta-plitka.w-42{grid-column-end:span 42}.karta-mesta>.mesta-plitka.w-43{grid-column-end:span 43}.karta-mesta>.mesta-plitka.w-44{grid-column-end:span 44}.karta-mesta>.mesta-plitka.w-45{grid-column-end:span 45}.karta-mesta>.mesta-plitka.w-46{grid-column-end:span 46}.karta-mesta>.mesta-plitka.w-47{grid-column-end:span 47}.karta-mesta>.mesta-plitka.w-48{grid-column-end:span 48}
.karta-mesta>.mesta-plitka.h-1{grid-row-end:span 1}.karta-mesta>.mesta-plitka.h-2{grid-row-end:span 2}.karta-mesta>.mesta-plitka.h-3{grid-row-end:span 3}.karta-mesta>.mesta-plitka.h-4{grid-row-end:span 4}.karta-mesta>.mesta-plitka.h-5{grid-row-end:span 5}.karta-mesta>.mesta-plitka.h-6{grid-row-end:span 6}.karta-mesta>.mesta-plitka.h-7{grid-row-end:span 7}.karta-mesta>.mesta-plitka.h-8{grid-row-end:span 8}.karta-mesta>.mesta-plitka.h-9{grid-row-end:span 9}.karta-mesta>.mesta-plitka.h-10{grid-row-end:span 10}.karta-mesta>.mesta-plitka.h-11{grid-row-end:span 11}.karta-mesta>.mesta-plitka.h-12{grid-row-end:span 12}.karta-mesta>.mesta-plitka.h-13{grid-row-end:span 13}.karta-mesta>.mesta-plitka.h-14{grid-row-end:span 14}.karta-mesta>.mesta-plitka.h-15{grid-row-end:span 15}.karta-mesta>.mesta-plitka.h-16{grid-row-end:span 16}.karta-mesta>.mesta-plitka.h-17{grid-row-end:span 17}.karta-mesta>.mesta-plitka.h-18{grid-row-end:span 18}.karta-mesta>.mesta-plitka.h-19{grid-row-end:span 19}.karta-mesta>.mesta-plitka.h-20{grid-row-end:span 20}.karta-mesta>.mesta-plitka.h-21{grid-row-end:span 21}.karta-mesta>.mesta-plitka.h-22{grid-row-end:span 22}.karta-mesta>.mesta-plitka.h-23{grid-row-end:span 23}.karta-mesta>.mesta-plitka.h-24{grid-row-end:span 24}.karta-mesta>.mesta-plitka.h-25{grid-row-end:span 25}.karta-mesta>.mesta-plitka.h-26{grid-row-end:span 26}.karta-mesta>.mesta-plitka.h-27{grid-row-end:span 27}.karta-mesta>.mesta-plitka.h-28{grid-row-end:span 28}.karta-mesta>.mesta-plitka.h-29{grid-row-end:span 29}.karta-mesta>.mesta-plitka.h-30{grid-row-end:span 30}.karta-mesta>.mesta-plitka.h-31{grid-row-end:span 31}.karta-mesta>.mesta-plitka.h-32{grid-row-end:span 32}.karta-mesta>.mesta-plitka.h-33{grid-row-end:span 33}.karta-mesta>.mesta-plitka.h-34{grid-row-end:span 34}.karta-mesta>.mesta-plitka.h-35{grid-row-end:span 35}.karta-mesta>.mesta-plitka.h-36{grid-row-end:span 36}.karta-mesta>.mesta-plitka.h-37{grid-row-end:span 37}.karta-mesta>.mesta-plitka.h-38{grid-row-end:span 38}.karta-mesta>.mesta-plitka.h-39{grid-row-end:span 39}.karta-mesta>.mesta-plitka.h-40{grid-row-end:span 40}.karta-mesta>.mesta-plitka.h-41{grid-row-end:span 41}.karta-mesta>.mesta-plitka.h-42{grid-row-end:span 42}.karta-mesta>.mesta-plitka.h-43{grid-row-end:span 43}.karta-mesta>.mesta-plitka.h-44{grid-row-end:span 44}.karta-mesta>.mesta-plitka.h-45{grid-row-end:span 45}.karta-mesta>.mesta-plitka.h-46{grid-row-end:span 46}.karta-mesta>.mesta-plitka.h-47{grid-row-end:span 47}.karta-mesta>.mesta-plitka.h-48{grid-row-end:span 48}.karta-mesta>.mesta-plitka.h-49{grid-row-end:span 49}.karta-mesta>.mesta-plitka.h-50{grid-row-end:span 50}.karta-mesta>.mesta-plitka.h-51{grid-row-end:span 51}.karta-mesta>.mesta-plitka.h-52{grid-row-end:span 52}.karta-mesta>.mesta-plitka.h-53{grid-row-end:span 53}.karta-mesta>.mesta-plitka.h-54{grid-row-end:span 54}.karta-mesta>.mesta-plitka.h-55{grid-row-end:span 55}.karta-mesta>.mesta-plitka.h-56{grid-row-end:span 56}.karta-mesta>.mesta-plitka.h-57{grid-row-end:span 57}.karta-mesta>.mesta-plitka.h-58{grid-row-end:span 58}.karta-mesta>.mesta-plitka.h-59{grid-row-end:span 59}.karta-mesta>.mesta-plitka.h-60{grid-row-end:span 60}.karta-mesta>.mesta-plitka.h-61{grid-row-end:span 61}.karta-mesta>.mesta-plitka.h-62{grid-row-end:span 62}.karta-mesta>.mesta-plitka.h-63{grid-row-end:span 63}.karta-mesta>.mesta-plitka.h-64{grid-row-end:span 64}.karta-mesta>.mesta-plitka.h-65{grid-row-end:span 65}.karta-mesta>.mesta-plitka.h-66{grid-row-end:span 66}.karta-mesta>.mesta-plitka.h-67{grid-row-end:span 67}.karta-mesta>.mesta-plitka.h-68{grid-row-end:span 68}.karta-mesta>.mesta-plitka.h-69{grid-row-end:span 69}.karta-mesta>.mesta-plitka.h-70{grid-row-end:span 70}.karta-mesta>.mesta-plitka.h-71{grid-row-end:span 71}.karta-mesta>.mesta-plitka.h-72{grid-row-end:span 72}.karta-mesta>.mesta-plitka.h-73{grid-row-end:span 73}.karta-mesta>.mesta-plitka.h-74{grid-row-end:span 74}.karta-mesta>.mesta-plitka.h-75{grid-row-end:span 75}.karta-mesta>.mesta-plitka.h-76{grid-row-end:span 76}.karta-mesta>.mesta-plitka.h-77{grid-row-end:span 77}.karta-mesta>.mesta-plitka.h-78{grid-row-end:span 78}.karta-mesta>.mesta-plitka.h-79{grid-row-end:span 79}.karta-mesta>.mesta-plitka.h-80{grid-row-end:span 80}.karta-mesta>.mesta-plitka.h-81{grid-row-end:span 81}.karta-mesta>.mesta-plitka.h-82{grid-row-end:span 82}.karta-mesta>.mesta-plitka.h-83{grid-row-end:span 83}.karta-mesta>.mesta-plitka.h-84{grid-row-end:span 84}.karta-mesta>.mesta-plitka.h-85{grid-row-end:span 85}.karta-mesta>.mesta-plitka.h-86{grid-row-end:span 86}.karta-mesta>.mesta-plitka.h-87{grid-row-end:span 87}.karta-mesta>.mesta-plitka.h-88{grid-row-end:span 88}.karta-mesta>.mesta-plitka.h-89{grid-row-end:span 89}.karta-mesta>.mesta-plitka.h-90{grid-row-end:span 90}.karta-mesta>.mesta-plitka.h-91{grid-row-end:span 91}.karta-mesta>.mesta-plitka.h-92{grid-row-end:span 92}.karta-mesta>.mesta-plitka.h-93{grid-row-end:span 93}.karta-mesta>.mesta-plitka.h-94{grid-row-end:span 94}.karta-mesta>.mesta-plitka.h-95{grid-row-end:span 95}.karta-mesta>.mesta-plitka.h-96{grid-row-end:span 96}

/* Полоса текста от одного ряда (владелец 14.09.2026: «полоса текста может быть
   меньше по высоте»). В режиме настройки пульт и панель оформления не занимают
   её высоту, а всплывают над верхним краем, пока полосу наводят или правят:
   строка пульта в 34 px сделала бы полосу в 24 px непригодной. */
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno]{grid-template-rows:minmax(0,1fr);gap:0}
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno]>.yachejka-pult,
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno] .tekst-panel{
  position:absolute;bottom:calc(100% + 4px);z-index:7;
  visibility:hidden;opacity:0;transition:opacity .12s ease,visibility 0s linear .12s}
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno]>.yachejka-pult{right:0}
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno] .tekst-panel{
  left:0;padding:0 4px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-btn);
  box-shadow:0 6px 18px -8px rgba(17,19,24,.25)}
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno]:hover>.yachejka-pult,
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno]:focus-within>.yachejka-pult,
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno]:hover .tekst-panel,
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno]:focus-within .tekst-panel{
  visibility:visible;opacity:1;transition:opacity .12s ease}
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno]:hover,
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno]:focus-within{z-index:8}
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno]>.karta.tekst-vidzhet{overflow:visible;gap:0}
.setka-glavnoj.nastraivaem>.yachejka[data-svobodno] .tekst-pole[contenteditable]{padding:2px 6px}
@media (prefers-reduced-motion:reduce){
  .setka-glavnoj.nastraivaem>.yachejka[data-svobodno]>.yachejka-pult,
  .setka-glavnoj.nastraivaem>.yachejka[data-svobodno] .tekst-panel{transition:none}
}

/* Подписи под заголовком и пояснения в подвале — во всю ширину полотна на всех
   страницах. Владелец 14.09.2026: «все подписи под заголовком и в подвале растяни
   на весь экран». Общий предел абзаца в 70 знаков снят; узкими остаются только
   реплики разговора и тексты заданий, где длинную строку читают целиком. */

/* Узкая карточка сетки 48 (M ≈ 377 px, 14.09.2026). Замер по всем виджетам:
   подписи плиток «ПЛАН МЕС…», имена «03 · Темр…» и «Аккумуля…» резались. Имени
   отдаём место жёлоба и второй цифры (она есть в карточке при наведении и в
   отчёте), подпись плитки переносится на вторую строку, а не режется. */
@container vidzhet (max-width:30rem){
  .setka-glavnoj .karta-telo .polosy{padding-left:12px;padding-right:12px}
  .setka-glavnoj .karta-telo .polosy .polosa-stroka{
    grid-template-columns:minmax(0,1fr) minmax(36px,.5fr) auto;gap:8px}
  .setka-glavnoj .karta-telo .polosy .polosa-baza{display:none}
  .setka-glavnoj .karta-telo .plitka{padding:7px 9px}
  .setka-glavnoj .karta-telo .plitka .l{white-space:normal;letter-spacing:.03em;font-size:9.5px;
    line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
}

/* ══ Товарный капитал и прибыль: отчёты по аудиту и ТЗ товарного запаса, 14.09.2026 ══
   Блок: заголовок, статусы данных, числа, рисунок, что недостаёт. Статус — часть
   показателя (ТЗ п. 13–14), поэтому стоит сразу под заголовком, а не сноской. */
.zapas-oglavlenie{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 14px;font-size:13px}
.zapas-oglavlenie a{color:var(--ink-2);text-decoration:none}
.zapas-oglavlenie a:hover{color:var(--ink);text-decoration:underline}
.zapas-bloki{display:grid;gap:16px;align-items:start;grid-template-columns:repeat(auto-fit,minmax(min(620px,100%),1fr))}
.zapas-blok{margin:0;display:flex;flex-direction:column;min-width:0}
.zapas-statusy{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:0 15px 8px}
.status-dannyh{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:99px;
  font-size:12px;font-weight:500;border:1px solid var(--line);color:var(--ink-2);background:var(--paper)}
.status-dannyh.status-ocenka{border-color:var(--svedenie);color:var(--svedenie)}
.status-dannyh.status-net{border-color:var(--vnimanie);color:var(--vnimanie)}
.status-dannyh.status-nepolno{border-style:dashed;border-color:var(--vnimanie);color:var(--vnimanie)}
.status-dannyh.status-kandidat{border-style:dashed}
.zapas-kod{margin-left:auto;font:500 11px/1 var(--cifry);color:var(--ink-3);letter-spacing:.06em}
.zapas-blok .plitki{margin:0 15px 10px}
.plitka.net-dannyh .v{font-size:16px;color:var(--vnimanie)}
.zapas-risunok{padding:4px 15px 8px;overflow-x:auto}
.zapas-risunok svg{max-width:100%;height:auto}
.zapas-dop{margin:0 15px 8px}
.zapas-dop>summary{cursor:pointer;color:var(--ink-2);font-size:13px}
.zapas-blok .skroll{margin:0 15px 10px}
.zapas-net{margin:auto 15px 12px}
.zapas-net p{font-size:12.5px;color:var(--ink-2)}
.zapas-ssylka{margin:0 15px 8px}
.zapas-svyazannye{margin-top:18px}
svg.sostav{overflow:visible}
.sostav-imya{fill:var(--ink-2);font-size:12px;text-anchor:end}
.sostav-itog{fill:var(--ink);font:600 12px/1 var(--cifry)}
.sostav-zhelob{fill:var(--pale)}
.sostav-0{fill:var(--ink-2);background:var(--ink-2)}
.sostav-1{fill:var(--svedenie);background:var(--svedenie)}
.sostav-2{fill:var(--kraj);background:var(--kraj)}
.sostav-3{fill:var(--ink);background:var(--ink)}
.sostav-4{fill:var(--line-2);background:var(--line-2)}
.sostav-5{fill:var(--ink-3);background:var(--ink-3)}
.sostav-legenda{display:flex;flex-wrap:wrap;gap:4px 14px;list-style:none;margin:4px 0 0;padding:0;font-size:12px;color:var(--ink-2)}
.sostav-legenda li{display:inline-flex;align-items:center;gap:6px}
.sostav-znak{display:inline-block;width:10px;height:10px;border-radius:2px}

/* Полоса текста на карте — подпись в одну строку во всю высоту плитки: формы у неё нет,
   значков формы тоже (14.09.2026). */
.mesta-plitka[data-kod^="tekst_"] .mesta-imya{top:50%;transform:translateY(-50%);-webkit-line-clamp:1;font-size:11px}