/* ПАЛИТРА СВЕДЕНА К КАНОНУ 20.09.2026. Канон светлой темы — css/maket.css
   (единственный файл, где записан замер контраста). До сведения 32 токена
   цвета имели по 2–5 значений в разных файлах, и кто победит на экране,
   решала точность селектора, а не порядок подключения. Любая правка
   значения здесь без сведения давала видимость работы.
   Сторож: scripts/test_odna_palitra.cjs. */
/* ═══════════════════════════════════════════════════════════════════════
   ЕДИНЫЙ СЛОВАРЬ РАЗМЕТКИ ЭКРАНОВ — приставка `ek-` (экран).
   Сведены три словаря, заведённые волнами 1, 3 и 4 порознь:
   volna1-2026.css + vlna3-ui.css + volna4-ui.css → этот файл.

   ПОЧЕМУ `ek-`. Приставка нейтральна (ничьей волны), свободна (0 вхождений
   в дереве до слияния) и стоит в паре с `kp-` — слоем командной полосы,
   который живёт отдельно и здесь не участвует.

   ИМЕНА взяты у волны 4: она выразительнее прочих (полосы долей, охват,
   модификаторы тона). Имена волн 1 и 3 переведены на них.

   ЗАЧЕМ СКИНЫ `ek-s1` / `ek-s3` / `ek-s4`. Три волны звали одно и то же
   разными именами, но и РИСОВАЛИ по-разному: у чипа волны 1 скругление 7px,
   высота 23px, кегль 11.5px, у волн 3 и 4 — «таблетка» 999px и кегль 12px;
   сверка свойств дала 18 расхождений и НИ ОДНОГО совпадения. Поэтому слить
   имена — не то же, что слить вид: слияние одних имён перекрасило бы
   85 экранов. Имя теперь одно, а правила разошлись по трём меткам-скинам.
   Метка стоит НА САМОМ элементе, не на корне экрана: фрагменты волны 1
   (`volna1_vid.js`) рисуются внутри корней волны 3 на 20 экранах, поэтому
   отбор по предку перекрасил бы чужое.

   КАК ЭТО КОНЧИТЬ. Чтобы вид стал единым, владелец выбирает один скин и
   удаляет два блока правил — разметку трогать больше не нужно: имена уже
   общие. Пока скины на месте, вид ровно такой же, каким был до слияния.

   ГРАНИЦЫ. Приставка `kp-` (командная полоса) и общий класс таблиц `dt`
   не тронуты. `!important` в файле нет — как не было ни в одном из трёх.
   ═══════════════════════════════════════════════════════════════════════ */



/* ═══ СКИН ek-s1 ═══ строение 29 экранов волны 1 */

/* ── ШАПКА ЭКРАНА: ОДНА СТРОКА ────────────────────────────────────────
   Замер до правки хранится в комментариях самих экранов. Общее правило:
   до первой строки данных допускается один ряд шапки и один ряд чипов. */

.ek-hd.ek-s1 {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin: 0 0 6px;
  padding: 0 0 4px;
  border-bottom: 1px solid var(--co-green-line, rgba(14, 128, 103, .26));
}
.ek-hd-t.ek-s1,
.ek-hd.ek-s1 > h2,
.ek-hd.ek-s1 > h3,
.ek-hd.ek-s1 > h4 {
  margin: 0;
  font-size: 14px;
  line-height: 1.3;
  font-weight: 650;
  color: var(--text);
}
.ek-hd-n.ek-s1 {
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  font-weight: 650;
  color: var(--co-green-ink, #0b6952);
  padding: 1px 7px;
  border-radius: 6px;
  background: var(--co-green-soft, #eaf5f1);
}
/* Подзаголовок раздела несёт СОСТАВ числа: что вошло, что исключено, почему
   расчёт заблокирован. Одной строкой он обрывался — замер: на `#/debts` 19
   обрезанных узлов, из них четыре подзаголовка («живой долг и старые хвосты…»
   832 px при 363, «без регламентных реализаций и без документов старше 180…»
   701 при 348); на `#/money` — «выручка не подтверждена: принятого среза 1С
   нет, и резул…» 533 при 363. Две строки покрывают почти все замеренные
   случаи, остальное открывается по наведению и по фокусу. Ширина не меняется,
   прибавка по высоте — одна строка 11,5 px и только у длинных подписей. */
.ek-hd-s.ek-s1 {
  font-size: 11.5px;
  line-height: 1.4;
  color: var(--muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  max-width: 62ch;
}
.ek-hd.ek-s1:hover > .ek-hd-s.ek-s1,
.ek-hd.ek-s1:focus-within > .ek-hd-s.ek-s1,
.ek-hd-s.ek-s1:hover,
.ek-hd-s.ek-s1:focus { -webkit-line-clamp: unset; }
.ek-hd-gap.ek-s1 { flex: 1 1 auto; min-width: 0; }
.ek-hd.is-bad.ek-s1 { border-bottom-color: var(--bad-line, rgba(185, 28, 28, .22)); }
.ek-hd.is-warn.ek-s1 { border-bottom-color: var(--warn-line, rgba(180, 83, 9, .22)); }

/* ── ПОЛОСА ЧИПОВ ВМЕСТО СЕТКИ ПЛИТОК ────────────────────────────────
   Было: `grid-template-columns: repeat(auto-fit,
minmax(220px,
1fr))` и
   карточка высотой 84 px — шесть показателей занимали две трети первого
   экрана. Стало: ряд высотой 24 px,
переносится сам. Показателей столько
   же: ни один не убран. */

.ek-chips.ek-s1 {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 6px;
  margin: 0 0 7px;
}
.ek-chip.ek-s1 {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  min-height: 23px;
  padding: 2px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface, #fff);
  font-size: 11.5px;
  line-height: 1.35;
  color: var(--soft);
  text-decoration: none;
  white-space: nowrap;
}
.ek-chip-k.ek-s1 { color: var(--muted); }
.ek-chip-v.ek-s1 { font-variant-numeric: tabular-nums; font-size: 12.5px; font-weight: 700; color: var(--text); }
.ek-chip-s.ek-s1 { color: var(--muted); font-size: 10.5px; }
a.ek-chip.ek-s1,
button.ek-chip.ek-s1 { cursor: pointer; }
a.ek-chip.ek-s1:hover,
button.ek-chip.ek-s1:hover,
a.ek-chip.ek-s1:focus-visible,
button.ek-chip.ek-s1:focus-visible {
  border-color: var(--co-green-line, rgba(14, 128, 103, .26));
  background: var(--co-green-soft, #eaf5f1);
  color: var(--co-green-ink, #0b6952);
}
.ek-chip.is-drill.ek-s1 .ek-chip-k.ek-s1::after {
  content: "›";
  margin-left: 3px;
  opacity: .5;
}
.ek-chip.is-good.ek-s1 { border-color: var(--good-line); background: var(--good-soft); }
.ek-chip.is-good.ek-s1 .ek-chip-v.ek-s1 { color: var(--good); }
.ek-chip.is-warn.ek-s1 { border-color: var(--warn-line); background: var(--warn-soft); }
.ek-chip.is-warn.ek-s1 .ek-chip-v.ek-s1 { color: var(--warn); }
.ek-chip.is-bad.ek-s1 { border-color: var(--bad-line); background: var(--bad-soft); }
.ek-chip.is-bad.ek-s1 .ek-chip-v.ek-s1 { color: var(--bad); }
.ek-chip.is-net.ek-s1 .ek-chip-v.ek-s1 { color: var(--muted); font-weight: 600; }

/* ── ТАБЛИЦА — ЦЕНТР ЭКРАНА ──────────────────────────────────────────
   Оформление колонок таблица получает от общего слоя через
   `data-kp-vsegda`; здесь только то,
что слой не даёт: плотность строки и
   поведение обёртки при узком экране. */

.ek-dt-wrap.ek-s1 { overflow-x: auto; }
table.dt.ek-dt.ek-s1 { width: 100%; border-collapse: separate; border-spacing: 0; }
table.dt.ek-dt.ek-s1 tbody td { vertical-align: middle; }
table.dt.ek-dt.ek-s1 tbody td.n { font-variant-numeric: tabular-nums; text-align: right; }
table.dt.ek-dt.ek-s1 thead th.n { text-align: right; }
table.dt.ek-dt.ek-s1 tbody tr.is-bad > td { background: var(--bad-soft); }
table.dt.ek-dt.ek-s1 tbody tr.is-warn > td { background: var(--warn-soft); }
table.dt.ek-dt.ek-s1 tfoot td,
table.dt.ek-dt.ek-s1 tfoot th {
  padding: 5px 9px;
  border-top: 2px solid var(--co-green-line, rgba(14, 128, 103, .26));
  font-weight: 700;
  font-size: 12.5px;
}
table.dt.ek-dt.ek-s1 tfoot td.n { font-variant-numeric: tabular-nums; text-align: right; }

/* Ячейка «число + полоска доли» — доля видна,
а не читается устно. */
.ek-mera.ek-s1 { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.ek-mera-track.ek-s1 {
  position: relative;
  flex: 0 0 46px;
  height: 7px;
  border-radius: 4px;
  background: var(--surface-3);
  overflow: hidden;
}
.ek-mera-fill.ek-s1 { position: absolute; inset: 0 auto 0 0; border-radius: 4px; background: var(--co-green-bar, rgba(14, 128, 103, .82)); }
.ek-mera-fill.is-bad.ek-s1 { background: var(--bad); }
.ek-mera-fill.is-warn.ek-s1 { background: var(--warn); }

/* ── РАЗНИЦА С ПРОШЛЫМ ПЕРИОДОМ ──────────────────────────────────────
   Нулевой базы не бывает «ростом на 100 %»: без базы стоит прочерк. */

.ek-delta.ek-s1 { font-variant-numeric: tabular-nums; font-weight: 600; }
.ek-delta.ek-s1 small { font-weight: 500; opacity: .75; }
.ek-delta.is-good.ek-s1 { color: var(--good); }
.ek-delta.is-bad.ek-s1 { color: var(--bad); }
.ek-delta.is-net.ek-s1 { color: var(--muted); font-weight: 500; }

/* ── РАСПРЕДЕЛЕНИЕ ОДНОЙ ПОЛОСКОЙ ────────────────────────────────────── */

.ek-raspr.ek-s1 { margin: 0 0 7px; }
.ek-raspr-linija.ek-s1 {
  display: flex;
  height: 10px;
  border-radius: 5px;
  overflow: hidden;
  background: var(--surface-3);
}
.ek-raspr-dolja.ek-s1 { display: block; height: 100%; background: var(--co-green-bar, rgba(14, 128, 103, .82)); }
.ek-raspr-dolja.is-bad.ek-s1 { background: var(--bad); }
.ek-raspr-dolja.is-warn.ek-s1 { background: var(--warn); }
.ek-raspr-dolja.is-net.ek-s1 { background: var(--line-3); }
.ek-raspr-legenda.ek-s1 {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 12px;
  margin-top: 4px;
  font-size: 11.5px;
  color: var(--muted);
}
.ek-raspr-metka.ek-s1 b { font-variant-numeric: tabular-nums; color: var(--text); }
.ek-raspr-metka.ek-s1 small { font-variant-numeric: tabular-nums; }
.ek-raspr-metka.is-bad.ek-s1 b { color: var(--bad); }
.ek-raspr-metka.is-warn.ek-s1 b { color: var(--warn); }
.ek-raspr-vsego.ek-s1 { margin-left: auto; }

/* ── СВЁРНУТОЕ ПОЯСНЕНИЕ ─────────────────────────────────────────────
   То,
что раньше стояло абзацами в шапке. Данных столько же; в свёрнутом
   виде они занимают одну строку. */

.ek-note.ek-s1 { margin: 7px 0 0; border: 1px solid var(--line); border-radius: 8px; background: var(--surface, #fff); }
.ek-note.ek-s1 > summary {
  padding: 4px 10px;
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--soft);
  cursor: pointer;
  list-style-position: inside;
}
.ek-note.ek-s1 > summary:hover { color: var(--co-green-ink, #0b6952); }
.ek-note-n.ek-s1 {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--co-green-ink, #0b6952);
}
.ek-note-body.ek-s1 { padding: 2px 10px 8px; font-size: 12px; line-height: 1.5; }
.ek-note-body.ek-s1 p { margin: 4px 0; }

/* ── ПОДПИСЬ ОХВАТА ──────────────────────────────────────────────────
   Когда показано не всё — разница названа. Итог по показанным строкам,
подписанный как общий,
— самая дорогая ошибка этих экранов. */

.ek-scope.ek-s1 { margin: 5px 0; font-size: 11.5px; line-height: 1.45; color: var(--muted); }
.ek-scope.ek-s1 b { font-variant-numeric: tabular-nums; color: var(--soft); }
.ek-scope.is-rez.ek-s1 {
  padding: 4px 9px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--warn, #b45309);
  border-radius: 7px;
  background: var(--surface, #fff);
}

/* ── ОТБОРЫ: ОДИН РЯД ────────────────────────────────────────────────── */

.ek-otbor.ek-s1 { display: flex; flex-wrap: wrap; align-items: end; gap: 5px 8px; margin: 0 0 7px; }
.ek-otbor.ek-s1 > label { display: block; margin: 0; min-width: 0; }
.ek-otbor.ek-s1 > label > span {
  display: block;
  font-size: 10px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--muted);
  line-height: 1.5;
}
.ek-otbor.ek-s1 input,
.ek-otbor.ek-s1 select { height: 27px; padding: 2px 8px; font-size: 12.5px; }

/* ── МОДАЛКА ПОДРОБНОСТЕЙ ────────────────────────────────────────────
   Детали строки открываются здесь,
а не разворачиваются под таблицей:
   развёрнутая строка сдвигает соседние и теряет место в списке. */

.ek-modalka.ek-s1 { border: none; padding: 0; border-radius: 12px; max-width: min(960px, 94vw); background: var(--surface, #fff); color: var(--text); }
.ek-modalka.ek-s1::backdrop { background: rgba(12, 18, 16, .42); }
.ek-modalka-hd.ek-s1 {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 9px 14px;
  border-bottom: 1px solid var(--co-green-line, rgba(14, 128, 103, .26));
}
.ek-modalka-hd.ek-s1 h4 { margin: 0; font-size: 14px; }
.ek-modalka-body.ek-s1 { padding: 10px 14px 14px; max-height: min(70vh, 640px); overflow: auto; font-size: 12.5px; line-height: 1.5; }
.ek-modalka-close.ek-s1 { margin-left: auto; }

/* ── ПАРЫ «ПОКАЗАТЕЛЬ — ЗНАЧЕНИЕ» ВНУТРИ МОДАЛКИ ─────────────────────── */

.ek-pary.ek-s1 { display: grid; grid-template-columns: minmax(140px, 32%) 1fr; gap: 2px 12px; margin: 0; }
.ek-pary.ek-s1 > dt { color: var(--muted); font-size: 11.5px; }
.ek-pary.ek-s1 > dd { margin: 0; font-variant-numeric: tabular-nums; }

/* ── УЗКИЙ ЭКРАН ─────────────────────────────────────────────────────── */

@media (max-width: 720px) {
  .ek-hd-s.ek-s1 { max-width: 100%; white-space: normal; }
  .ek-pary.ek-s1 { grid-template-columns: 1fr; }
  .ek-pary.ek-s1 > dd { margin-bottom: 5px; }
}

/* Первая строка группы в таблице,
где несколько строк относятся к одной
   группе (дубли по ИНН). Раньше группы стояли отдельными карточками — здесь
   граница группы осталась видимой,
но экран не рассыпается на карточки. */
table.dt.ek-dt.ek-s1 tbody tr.ek-grp-first.ek-s1 > td { border-top: 2px solid var(--co-green-line, rgba(14, 128, 103, .26)); }
table.dt.ek-dt.ek-s1 tbody tr.ek-grp-first.ek-s1:first-child > td { border-top: none; }

/* ВОЛНА 2026-09-15 · КАРТОЧКИ СУЩНОСТЕЙ */
/* Плитка,
ставшая чипом там,
где разметка плитки закреплена договором
   (<small>подпись</small><b>число</b>): оформление чипа без переименования
   тегов. Свой класс,
чужих правил не уточняет. */
.ek-chip-plit.ek-s1 > small { color: var(--muted); }
.ek-chip-plit.ek-s1 > b {
  font-variant-numeric: tabular-nums;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--text);
}
.ek-chip-plit.is-bad.ek-s1 > b { color: var(--bad); }
.ek-chip-plit.is-warn.ek-s1 > b { color: var(--warn); }
.ek-chip-plit.is-good.ek-s1 > b { color: var(--good); }

/* Кольцо здоровья,
вставшее в однострочную шапку: 62 px превращали «одну
   строку» в блок высотой с три. Геометрия кольца задана viewBox,
поэтому
   уменьшение svg её не ломает. */
.ek-hd.ek-s1 .health-ring { width: 34px; gap: 0; }
.ek-hd.ek-s1 .health-ring svg { width: 34px; height: 34px; }
.ek-hd.ek-s1 .health-ring b { height: 34px; font-size: 11.5px; }
.ek-hd.ek-s1 .health-ring small { font-size: 8.5px; letter-spacing: .03em; }

/* Ряд чипов,
стоящий на месте прежней сетки плиток карточки сущности. */
.entity-command-metrics.ek-chips.ek-s1 { display: flex; }

/* ВОЛНА 2026-09-15 · СДЕЛКИ И ОТЧЁТЫ */
/* Классы старых героев остаются в разметке (на них держатся договоры
   проверок и якоря анимации),
но раскладку задаёт полоса чипов и
   однострочная шапка. Своя специфичность выше за счёт двух классов —
   `!important` не нужен нигде. */
.signals.ek-chips.ek-s1 { display: flex; grid-template-columns: none; }
.deal-head.ek-hd.ek-s1 { display: flex; flex-wrap: wrap; align-items: baseline; }
.deal-head.ek-hd.ek-s1 .deal-amt { margin-left: 0; }
.deal-head.ek-hd.ek-s1 .deal-amt .v { font-size: 15px; }
.deal-head.ek-hd.ek-s1 .deal-h1 { margin: 0; font-size: 14px; line-height: 1.3; font-weight: 650; }
.exec-hero.ek-hd.ek-s1,
.hero.ek-hd.ek-s1 { display: flex; flex-wrap: wrap; align-items: baseline; }

/* ВОЛНА 2026-09-15 · ПЛИТКИ,
КОТОРЫЕ РИСУЕТ ЧУЖОЙ КОНТРОЛЛЕР */
/* Сетку плиток `.kpi-grid` наполняет контроллер соседней волны — его файл
   не трогаю. Полосой чипов эту сетку делает второй класс на контейнере:
   специфичность выше исходного правила,
`!important` не нужен. */
.kpi-grid.ek-chips.ek-s1 { display: flex; flex-wrap: wrap; gap: 5px 6px; grid-template-columns: none; }
.ek-chips.ek-s1 .kpi-card {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  min-height: 0;
  padding: 3px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface, #fff);
  box-shadow: none;
  text-align: left;
}
.ek-chips.ek-s1 .kpi-card small { color: var(--muted); font-size: 11px; }
.ek-chips.ek-s1 .kpi-card b { font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--text); }
.ek-chips.ek-s1 .kpi-card .lbl { color: var(--muted); font-size: 11px; }
.ek-chips.ek-s1 .kpi-card .big { font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ek-chips.ek-s1 .kpi-card .sub { color: var(--muted); font-size: 10.5px; }

/* ВОЛНА 2026-09-15 · ПЛИТКИ .kpi-tile В ПОЛОСЕ ЧИПОВ */
/* Класс `.kpi-tile card-hover` закреплён проверкой договора (по нему
   сверяют,
что у показателя есть переход),
поэтому имя остаётся,
а видом
   управляет контейнер: полоса чипов вместо ряда плиток. */
.kpi-row.ek-chips.ek-s1 { display: flex; flex-wrap: wrap; gap: 5px 6px; grid-template-columns: none; }
.ek-chips.ek-s1 .kpi-tile {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  min-height: 0;
  padding: 3px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface, #fff);
  box-shadow: none;
  text-align: left;
}
.ek-chips.ek-s1 .kpi-tile small { color: var(--muted); font-size: 11px; }
.ek-chips.ek-s1 .kpi-tile b { font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--text); }
.ek-chips.ek-s1 .kpi-tile .sub { color: var(--muted); font-size: 10.5px; }
.ek-chips.ek-s1 .kpi-tile.is-warn { border-color: var(--warn-line); background: var(--warn-soft); }
.ek-chips.ek-s1 .kpi-tile.is-warn b { color: var(--warn); }
.ek-chips.ek-s1 .kpi-tile.is-bad { border-color: var(--bad-line); background: var(--bad-soft); }
.ek-chips.ek-s1 .kpi-tile.is-bad b { color: var(--bad); }


/* ═══ СКИН ek-s3 ═══ таблица — центр экрана, волна 3 */

.ek-s3 {
  --ek-z: #0e8067;
  --ek-z-tih: rgba(14, 128, 103, 0.10);
  --ek-z-kraj: rgba(15,122,100,.28);
  --ek-linija: var(--line, #d8e2de);
  --ek-plastina: var(--surface, #fff);
  --ek-tusk: var(--muted, #5d6b66);
  --ek-bad-c: #b4342a;
  --ek-warn-c: #8b6209;
}

/* ── ШАПКА: ОДНА СТРОКА ───────────────────────────────────────────── */
.ek-hd.ek-s3 {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin: 0 0 6px;
  padding: 2px 0 6px;
  border-bottom: 1px solid var(--ek-linija);
}
.ek-hd.ek-s3 > h2 {
  margin: 0;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -0.015em;
  line-height: 1.2;
}
.ek-hd.ek-s3 > .ek-hd-s.ek-s3 {
  font-size: 12px;
  line-height: 1.4;
  color: var(--ek-tusk);
}
.ek-hd.ek-s3 > .ek-hd-s.ek-s3 b {
  color: var(--ek-z);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}
.ek-hd.ek-s3 > .ek-hd-act.ek-s3 {
  margin-left: auto;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
}

/* ── ЧИПЫ ПОКАЗАТЕЛЕЙ: ПОЛОСА ВМЕСТО КОВРА ПЛИТОК ─────────────────── */
.ek-chips.ek-s3 {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 6px;
  margin: 0 0 7px;
  padding: 0;
  list-style: none;
}
.ek-chip.ek-s3 {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  max-width: 100%;
  padding: 3px 10px;
  border: 1px solid var(--ek-linija);
  border-radius: 999px;
  background: var(--ek-plastina);
  color: inherit;
  font: inherit;
  font-size: 12px;
  line-height: 1.5;
  text-decoration: none;
  white-space: nowrap;
}
.ek-chip.ek-s3 > .ek-chip-k.ek-s3 {
  color: var(--ek-tusk);
  overflow: hidden;
  text-overflow: ellipsis;
}
.ek-chip.ek-s3 > .ek-chip-v.ek-s3 {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--ek-z);
}
.ek-chip.ek-s3 > .ek-chip-s.ek-s3 {
  color: var(--ek-tusk);
  font-size: 11px;
}
.ek-chip.ek--net.ek-s3 > .ek-chip-v.ek-s3 { color: var(--ek-tusk); font-weight: 500 }
.ek-chip.ek--bad.ek-s3 > .ek-chip-v.ek-s3 { color: var(--ek-bad-c) }
.ek-chip.ek--wait.ek-s3 > .ek-chip-v.ek-s3 { color: var(--ek-warn-c) }
.ek-chip.ek--bad.ek-s3 { border-color: rgba(180, 52, 42, 0.35) }
.ek-chip.ek--wait.ek-s3 { border-color: rgba(154, 106, 17, 0.35) }
a.ek-chip.ek-s3,
button.ek-chip.ek-s3 { cursor: pointer }
a.ek-chip.ek-s3:hover,
button.ek-chip.ek-s3:hover,
a.ek-chip.ek-s3:focus-visible,
button.ek-chip.ek-s3:focus-visible {
  border-color: var(--ek-z-kraj);
  background: var(--ek-z-tih);
}
.ek-chip.ek-s3[aria-pressed="true"] {
  border-color: var(--ek-z-kraj);
  background: var(--ek-z-tih);
}

/* ── ОБЪЯСНЕНИЕ МЕТОДА: ПОД ТАБЛИЦЕЙ,
СВЁРНУТО ────────────────────── */
.ek-note.ek-s3 {
  margin: 10px 0 0;
  border-top: 1px solid var(--ek-linija);
  padding-top: 6px;
}
.ek-note.ek-s3 > summary {
  cursor: pointer;
  font-size: 12px;
  line-height: 1.5;
  color: var(--ek-tusk);
  list-style-position: outside;
}
.ek-note.ek-s3 > summary::marker { color: var(--ek-z) }
.ek-note.ek-s3 > div,
.ek-note.ek-s3 > p {
  margin: 6px 0 0;
  font-size: 12.5px;
  line-height: 1.55;
}
.ek-note.ek-s3 code { font-size: 11.5px }

/* ── ПОДПИСЬ ОХВАТА НАД ТАБЛИЦЕЙ ──────────────────────────────────
   Сколько строк показано и сколько их всего. Отрезанное называется вслух:
   «40 из 217» — это разные множества,
и разница должна быть видна. */
.ek-scope.ek-s3 {
  margin: 0 0 6px;
  padding: 4px 9px;
  border: 1px solid var(--ek-linija);
  border-left: 3px solid var(--ek-z);
  border-radius: 7px;
  background: var(--ek-plastina);
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--ek-tusk);
}
.ek-scope.ek-s3 b { color: var(--ek-z); font-variant-numeric: tabular-nums }
.ek-scope.ek--bad.ek-s3 { border-left-color: var(--ek-bad-c) }
.ek-scope.ek--bad.ek-s3 b { color: var(--ek-bad-c) }

/* ── ПОЛОСА ВКЛАДОК ЭКРАНА ────────────────────────────────────────── */
.ek-tabs.ek-s3 {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0 0 7px;
}

/* ── СЕТКА ТАБЛИЦ,
КОГДА ИХ НЕСКОЛЬКО ─────────────────────────────── */
.ek-stack.ek-s3 { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr) }
/* Дорожка сетки по умолчанию — auto, и она растёт до min-content самого широкого
   ребёнка: на «Метриках» таблица в 1 550 px растянула всю колонку до 1 554 при
   рабочей зоне 1 016, и плитки с рельсой ушли за правый край (аудит 16.09).
   minmax(0,1fr) и min-width:0 возвращают прокрутку внутрь обёртки таблицы. */
.ek-stack.ek-s3 > * { min-width: 0 }
.ek-stack.ek-s3 > section > h3 {
  margin: 0 0 5px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.01em;
}
.ek-stack.ek-s3 > section > h3 > small {
  margin-left: 7px;
  font-weight: 400;
  font-size: 11.5px;
  color: var(--ek-tusk);
}

/* ── ЯЧЕЙКА «НЕТ ЗНАЧЕНИЯ» ────────────────────────────────────────
   Отсутствие не печатается нулём: пустое место читается как «—». */
.ek-s3 .ek-nv.ek-s3 { color: var(--ek-tusk) }

@media (max-width: 760px) {
  .ek-hd.ek-s3 > .ek-hd-act.ek-s3 { margin-left: 0; width: 100% }
  .ek-chip.ek-s3 { white-space: normal }
}


/* ═══ СКИН ek-s4 ═══ экраны перестроены, волна 4 */

.ek-s4 {
  --ek-z: #0e8067;
  --ek-z-tih: rgba(14, 128, 103, 0.10);
  --ek-z-kraj: rgba(15,122,100,.28);
  --ek-linija: var(--line, #d8e2de);
  --ek-plastina: var(--surface, #fff);
  --ek-plastina-2: var(--surface-2, #f6f8f7);
  --ek-tusk: var(--muted, #5d6b66);
  --ek-bad-c: var(--bad, #b3261e);
  --ek-warn-c: #8b6209;
}

/* ── ШАПКА ЭКРАНА: одна строка ──────────────────────────────────────
   Было: заголовок 30 px + описание в три строки + отдельная карточка.
   Стало: имя,
подпись и действия в один ряд высотой 11+19+11. */
.ek-s4 > .ek-hd.ek-s4,
.ek-hd.ek-s4 {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin: 0 0 8px;
  padding: 9px 14px;
  border: 1px solid var(--ek-linija);
  border-left: 3px solid var(--ek-z);
  border-radius: 10px;
  background: var(--ek-plastina);
}
.ek-hd.ek-s4 > .ek-hd-t.ek-s4 {
  margin: 0;
  font-size: 19px;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.ek-hd.ek-s4 > .ek-hd-s.ek-s4 {
  margin: 0;
  flex: 1 1 260px;
  min-width: 0;
  font-size: 12px;
  line-height: 1.35;
  color: var(--ek-tusk);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ek-hd.ek-s4 > .ek-hd-act.ek-s4 {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-left: auto;
}
/* слой помечает шапку своим классом и переносит её в общую рамку —
   внутри рамки собственный край шапке не нужен,
он там общий */
.kp-maket > .ek-hd.ek-s4 { border: 0; border-radius: 0; margin: 0 }

/* ── ПОЛОСА ЧИПОВ вместо ковра плиток ───────────────────────────────
   Плитка несла три строки и занимала 95 px в высоту. Чип несёт те же три
   поля в одну строку: метка · значение · пояснение. Пояснение остаётся
   ВИДИМЫМ — в этом вся разница с переносом плиток слоем. */
.ek-chips.ek-s4 {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 6px;
  margin: 0 0 8px;
  padding: 6px 8px;
  border: 1px solid var(--ek-linija);
  border-radius: 10px;
  background: var(--ek-plastina-2);
}
.kp-maket > .ek-chips.ek-s4 { border: 0; border-radius: 0; margin: 0 }

.ek-chip.ek-s4 {
  display: inline-flex;
  align-items: baseline;
  gap: 7px;
  margin: 0;
  padding: 3px 10px;
  border: 1px solid var(--ek-linija);
  border-radius: 999px;
  background: var(--ek-plastina);
  color: inherit;
  font: inherit;
  font-size: 12px;
  line-height: 1.5;
  text-align: left;
  text-decoration: none;
  min-height: 0;
  height: auto;
  box-shadow: none;
}
.ek-chip.ek-s4 > .ek-chip-k.ek-s4 {
  color: var(--ek-tusk);
  white-space: nowrap;
  font-size: 11.5px;
}
.ek-chip.ek-s4 > .ek-chip-v.ek-s4 {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  font-size: 13.5px;
  white-space: nowrap;
}
.ek-chip.ek-s4 > .ek-chip-s.ek-s4 {
  color: var(--ek-tusk);
  font-size: 11px;
  line-height: 1.45;
  max-width: 34ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
a.ek-chip.ek-s4,
button.ek-chip.ek-s4 { cursor: pointer; transition: background .13s, border-color .13s }
a.ek-chip.ek-s4:hover,
button.ek-chip.ek-s4:hover { background: var(--ek-z-tih); border-color: var(--ek-z-kraj) }
a.ek-chip.ek-s4::after,
button.ek-chip.ek-s4::after { content: "↗"; font-size: 10px; color: var(--ek-tusk) }

.ek--good.ek-s4 > .ek-chip-v.ek-s4 { color: var(--ek-z) }
.ek--warn.ek-s4 { border-color: rgba(168, 107, 18, .35) }
.ek--warn.ek-s4 > .ek-chip-v.ek-s4 { color: var(--ek-warn-c) }
.ek--bad.ek-s4 { border-color: rgba(179, 38, 30, .35) }
.ek--bad.ek-s4 > .ek-chip-v.ek-s4 { color: var(--ek-bad-c) }
.ek--flag.ek-s4 { border-style: dashed }

/* ── ОБЪЯСНЕНИЕ,
СВЁРНУТОЕ В СТРОКУ ─────────────────────────────────
   Текст никуда не делся: он под чертой одного клика,
а не поперёк экрана. */
.ek-s4 .ek-note.ek-s4 {
  margin: 0 0 8px;
  padding: 0;
  border: 1px solid var(--ek-linija);
  border-radius: 10px;
  background: var(--ek-plastina);
  font-size: 12px;
  line-height: 1.5;
}
.ek-note.ek-s4 > summary {
  padding: 5px 12px;
  cursor: pointer;
  color: var(--ek-z);
  font-size: 12px;
  line-height: 1.5;
  list-style: none;
}
.ek-note.ek-s4 > summary::-webkit-details-marker { display: none }
.ek-note.ek-s4 > summary::before { content: "▸ "; color: var(--ek-tusk) }
.ek-note.ek-s4[open] > summary::before { content: "▾ " }
.ek-note.ek-s4 > :not(summary) {
  margin: 0;
  padding: 0 12px 8px;
  color: var(--ek-tusk);
}
.ek-note.ek-s4 > :not(summary) b { color: inherit }

/* ── ЧЕСТНАЯ ПОДПИСЬ ОХВАТА ─────────────────────────────────────────
   Список срезан — разница названа. Пустая подпись не рисуется вовсе. */
.ek-s4 .ek-scope.ek-s4 {
  margin: 0 0 8px;
  padding: 5px 11px;
  border: 1px solid var(--ek-linija);
  border-left: 3px solid var(--ek-z);
  border-radius: 8px;
  background: var(--ek-plastina);
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--ek-tusk);
}
.ek-scope.ek-s4 b { color: var(--ink, #10231d); font-variant-numeric: tabular-nums }
.ek--warn.ek-s4 { border-left-color: var(--ek-warn-c) }

/* ── РАСПРЕДЕЛЕНИЕ ПРЯМО НА ЭКРАНЕ ──────────────────────────────────
   ABC по деньгам,
разброс скидок,
кто держит просрочку: доля читается
   длиной полосы,
число стоит рядом цифрой. */
.ek-s4 .ek-bars.ek-s4 {
  margin: 0 0 8px;
  padding: 7px 12px;
  border: 1px solid var(--ek-linija);
  border-radius: 10px;
  background: var(--ek-plastina);
}
.ek-bars.ek-s4 > .ek-bars-t.ek-s4 {
  margin: 0 0 5px;
  font-size: 11px;
  letter-spacing: .045em;
  text-transform: uppercase;
  color: var(--ek-z);
}
.ek-bar-row.ek-s4 {
  display: grid;
  grid-template-columns: minmax(84px, 22ch) 1fr minmax(64px, auto);
  align-items: center;
  gap: 8px;
  padding: 1px 0;
  font-size: 11.5px;
}
.ek-bar-k.ek-s4 {
  color: var(--ek-tusk);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ek-bar-t.ek-s4 {
  height: 9px;
  border-radius: 999px;
  background: var(--ek-z-tih);
  overflow: hidden;
}
.ek-bar-t.ek-s4 > i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--ek-z);
}
.ek-bar-t.ek-s4 > i.warn { background: var(--ek-warn-c) }
.ek-bar-t.ek-s4 > i.bad { background: var(--ek-bad-c) }
.ek-bar-n.ek-s4 {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
a.ek-bar-row.ek-s4 { color: inherit; text-decoration: none }
a.ek-bar-row.ek-s4:hover .ek-bar-k.ek-s4 { color: var(--ek-z) }

/* ── ТАБЛИЦА — ЦЕНТР ЭКРАНА ─────────────────────────────────────────
   Пометка data-kp-vsegda просит у общей полосы управление колонками
   (спрятать · показать · растянуть); оформление строк держит uchjot-ui.css
   по той же пометке — здесь только то,
чего там нет. */
table.dt.ek-dt.ek-s4 { width: 100% }
table.dt.ek-dt.ek-s4 tbody td.ek-td-imja.ek-s4 { max-width: 42ch }
table.dt.ek-dt.ek-s4 tbody td.ek-td-imja.ek-s4 > b { display: block; font-weight: 600 }
table.dt.ek-dt.ek-s4 tbody td.ek-td-imja.ek-s4 > small { display: block; color: var(--ek-tusk); font-size: 11px }
table.dt.ek-dt.ek-s4 tbody td.ek-nv.ek-s4 { color: var(--ek-tusk) }
table.dt.ek-dt.ek-s4 tfoot td,
table.dt.ek-dt.ek-s4 tfoot th {
  padding: 5px 9px;
  border-top: 2px solid var(--ek-z-kraj);
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
table.dt.ek-dt.ek-s4 tfoot td.n { text-align: right }

/* мини-полоса внутри ячейки: доля видна,
не занимая колонки */
table.dt.ek-dt.ek-s4 .ek-cell-bar.ek-s4 {
  display: block;
  height: 4px;
  margin-top: 2px;
  border-radius: 999px;
  background: var(--ek-z-tih);
}
table.dt.ek-dt.ek-s4 .ek-cell-bar.ek-s4 > i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--ek-z);
}

/* класс ABC/XYZ и прочие метки строк */
.ek-s4 .ek-mark.ek-s4 {
  display: inline-block;
  padding: 0 6px;
  border: 1px solid var(--ek-z-kraj);
  border-radius: 999px;
  background: var(--ek-z-tih);
  color: var(--ek-z);
  font-size: 11px;
  line-height: 1.6;
  white-space: nowrap;
}
.ek-mark--b.ek-s4 { border-color: var(--ek-linija); background: var(--ek-plastina-2); color: var(--ek-tusk) }
.ek-mark--c.ek-s4 { border-color: rgba(179, 38, 30, .3); background: rgba(179, 38, 30, .07); color: var(--ek-bad-c) }

/* ── УЗКИЙ ЭКРАН ────────────────────────────────────────────────── */
@media (max-width: 720px) {
  .ek-hd.ek-s4 { align-items: flex-start; flex-direction: column; gap: 4px }
  .ek-hd.ek-s4 > .ek-hd-s.ek-s4 { white-space: normal; max-width: none }
  .ek-hd.ek-s4 > .ek-hd-act.ek-s4 { margin-left: 0 }
  .ek-bar-row.ek-s4 { grid-template-columns: minmax(70px, 16ch) 1fr auto }
  .ek-chip.ek-s4 > .ek-chip-s.ek-s4 { max-width: 22ch }
}


/* ── ВОЛНА: СПРАВКА, АКАДЕМИЯ, СЛУЖЕБНЫЕ МЕСТА ───────────────────
   Новые узлы, которые заводят сами контроллеры (живой охват после
   отбора, разбор в окне решения, охват предпросмотра карточки).
   Класс без правила выглядит как «стиль не доехал», поэтому каждый
   заведённый здесь класс получает своё правило — пусть и одно.  */
.help-live-scope,
.operation-help-ohvat,
.entity-rel-scope,
.workflow-record-scope,
.cleanup-decision-mesto {
  display: block;
  margin: 8px 0;
}
.cleanup-decision-mesto { margin-top: 10px }

/* Доля записи и её тип в строке дрилдауна: приписка к сумме, а не
   вторая сумма — поэтому мельче и приглушённее. */
.dd-share {
  font-size: 11.5px;
  color: var(--muted, #6b7280);
  font-variant-numeric: tabular-nums;
  margin-left: 6px;
  white-space: nowrap;
}
.dd-tip {
  display: block;
  font-size: 11px;
  color: var(--muted, #6b7280);
}


/* ── РЯД ПОКАЗАТЕЛЕЙ МАКЕТА: .ek-chips.ek-plitki ──────────────────────────
   Плитка = подпись капителью, моно-число 17px, короткая подпись под ним;
   между плитками тонкий разделитель; ссылка-разбор подсвечивается фоном. */
.ek-chips.ek-plitki.ek-s1 { gap: 0; padding: 10px 6px; background: var(--surface-2); border-bottom: 1px solid var(--line-soft, var(--line)); }
.ek-chips.ek-plitki.ek-s1 > .ek-chip.ek-s1 {
  display: inline-flex; flex-direction: column; align-items: flex-start; gap: 2px; position: relative;
  padding: 4px 16px; border: 0; border-radius: 8px; background: none; box-shadow: none; min-width: 0; max-width: 30ch;
}
.ek-chips.ek-plitki.ek-s1 > .ek-chip.ek-s1 + .ek-chip.ek-s1::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 26px; background: var(--line); }
.ek-chips.ek-plitki.ek-s1 .ek-chip-k.ek-s1 { font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: 500; }
.ek-chips.ek-plitki.ek-s1 .ek-chip-v.ek-s1, .ek-chips.ek-plitki.ek-s1 .ek-chip.ek-s1 > b { font-family: var(--mono); font-size: 17px; font-weight: 600; line-height: 1.15; color: var(--text); }
.ek-chips.ek-plitki.ek-s1 .ek-chip.is-good.ek-s1 .ek-chip-v.ek-s1, .ek-chips.ek-plitki.ek-s1 .ek-chip.is-good.ek-s1 > b { color: var(--good); }
.ek-chips.ek-plitki.ek-s1 .ek-chip.is-bad.ek-s1 .ek-chip-v.ek-s1, .ek-chips.ek-plitki.ek-s1 .ek-chip.is-bad.ek-s1 > b { color: var(--bad); }
.ek-chips.ek-plitki.ek-s1 .ek-chip.is-warn.ek-s1 .ek-chip-v.ek-s1, .ek-chips.ek-plitki.ek-s1 .ek-chip.is-warn.ek-s1 > b { color: var(--warn); }
/* Подпись под числом плитки несёт ПРИЧИНУ, по которой числа нет:
   «не ноль: финансовый итог неизвестен», «не считается без accepted snapshot»,
   «нет подтверждённого ряда для прогноза». В одну строку по 180 px она не
   помещалась — замер на #/money: нужно 196–277 px, видно 180, а title на узле
   чужой (он принадлежит плитке целиком). То есть честный прочерк объяснялся
   текстом, которого не прочитать ни мышью, ни с клавиатуры.
   Две строки вместо одной вмещают все замеренные случаи (максимум 330 px),
   ширина плитки не меняется, прибавка по высоте — одна строка 11 px и только
   там, где подпись длинная. Полный текст — по наведению и по фокусу, тем же
   приёмом, что у плиток командной полосы (komandnaja-polosa.css). */
.ek-chips.ek-plitki.ek-s1 .ek-chip-s.ek-s1 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 11px; line-height: 1.3; color: var(--muted); max-width: 26ch; white-space: normal; overflow-wrap: anywhere; overflow: hidden; }
.ek-chips.ek-plitki.ek-s1 .ek-chip.ek-s1:hover .ek-chip-s.ek-s1,
.ek-chips.ek-plitki.ek-s1 .ek-chip.ek-s1:focus-within .ek-chip-s.ek-s1 { -webkit-line-clamp: unset; }
/* Вторая подпись пряталась насовсем. У плиток командной полосы она
   показывается по наведению — здесь теперь так же, текст не теряется. */
.ek-chips.ek-plitki.ek-s1 .ek-chip-s.ek-s1 + .ek-chip-s.ek-s1 { display: none; }
.ek-chips.ek-plitki.ek-s1 .ek-chip.ek-s1:hover .ek-chip-s.ek-s1 + .ek-chip-s.ek-s1,
.ek-chips.ek-plitki.ek-s1 .ek-chip.ek-s1:focus-within .ek-chip-s.ek-s1 + .ek-chip-s.ek-s1 { display: -webkit-box; }
.ek-chips.ek-plitki.ek-s1 .ek-chip.is-drill.ek-s1:hover { background: color-mix(in srgb, var(--accent) 8%, transparent); }
.ek-chips.ek-plitki.ek-s1 .ek-chip.is-drill.ek-s1 .ek-chip-k.ek-s1::after { content: none; }
/* число во фразе, за которым стоит разбор строками */
.ek-drill-num { padding: 0 2px; border: 0; border-bottom: 1px dashed currentColor; background: none; cursor: pointer; font: inherit; font-variant-numeric: tabular-nums; color: inherit; }
.ek-drill-num:hover { background: var(--accent-soft); color: var(--accent); }

/* ── ШАПКА ЭКРАНА ПО МАКЕТУ (16.09.2026) ─────────────────────────────────
   Заголовок 19px, пояснение под ним второй строкой, действия и пилюля
   источника — справа на первой строке и не переносятся. Раньше при длинном
   пояснении пилюля падала под заголовок. */
.ek-hd.ek-s1 { flex-wrap: nowrap; align-items: center; row-gap: 0; }
.ek-hd.ek-s1 > .ek-hd-t.ek-s1 { font-size: 19px; font-weight: 600; letter-spacing: -.02em; line-height: 1.15; }
.ek-hd.ek-s1 > .ek-hd-s.ek-s1 { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ek-hd.ek-s1 > .ek-hd-act.ek-s1, .ek-hd.ek-s1 > .ek-hd-act.ek-s1 > .pill { flex: none; white-space: nowrap; margin-left: auto; }
.ek-hd.ek-s1 > .ek-hd-act.ek-s1 > .pill { max-width: 46ch; overflow: hidden; text-overflow: ellipsis; display: inline-block; vertical-align: middle; }
@media (max-width: 900px) { .ek-hd.ek-s1 { flex-wrap: wrap; } .ek-hd.ek-s1 > .ek-hd-s.ek-s1 { flex-basis: 100%; white-space: normal; } }

/* ── КАРТОЧКА ЭКРАНА ПО МАКЕТУ ────────────────────────────────────────────
   Экран на словаре целиком лежит в одной белой карточке со скруглением 16px,
   как в референсе; внутренние разделы разделены только линиями шапок. */
#body > .view.ek-s1, #body > section.ek-s1, #body > .view > .ek-s1:only-child {
  background: var(--surface); border: 1px solid var(--line); border-radius: 16px;
  padding: 6px 18px 14px; box-shadow: 0 1px 2px rgba(23, 35, 31, .04);
}
#body > .view.ek-s1 > .ek-hd.ek-s1:first-child, #body > section.ek-s1 > .ek-hd.ek-s1:first-child { padding-top: 8px; }
#body > .view.ek-s1 > .kp-maket, #body > section.ek-s1 > .kp-maket { margin-left: -18px; margin-right: -18px; border-left: 0; border-right: 0; border-radius: 0; }

/* полоса доверия экрана цен — мелким текстом перед пилюлей источника */
.ek-hd.ek-s1 > .ek-hd-act.ek-s1 > .pricing-doverie { font-size: 11px; color: var(--muted); margin-right: 10px; white-space: nowrap; }
@media (max-width: 1100px) { .ek-hd.ek-s1 > .ek-hd-act.ek-s1 > .pricing-doverie { display: none; } }
/* баннер режима источника под шапкой — как в макете: тёплая полоса одной строкой */
/* предупреждение о режиме источника под шапкой — тёплая полоса во всю ширину, как в макете */
.ek-preduprezhdenie.ek-s1 { margin: 8px 0 4px; padding: 8px 12px; border-radius: 8px; background: var(--warn-soft, #fbf3e2); color: var(--warn-ink, #7a5407); font-size: 12.5px; line-height: 1.4; border-left: 3px solid var(--warn, #a8760f); }
.ek-preduprezhdenie.ek-s1 b { font-weight: 650; }
/* Заголовок экрана обрывался и НЕ имел подсказки: на `#/debts` «Финансы · ДК / КК
   — долг по правилу контура» требовал 407 px при 371 и читался как «…по правилу к…».
   Название экрана — единственное, чего нельзя терять молча. Перенос вместо обрыва;
   `flex: none` оставлен, чтобы заголовок не сжимался соседями. */
.ek-hd.ek-s1 > .ek-hd-t.ek-s1 { white-space: normal; flex: none; }
/* локальная карточка слоя внутри карточки экрана — без своей рамки и радиуса */
#body > .view.ek-s1 > .kp-maket, #body > section.ek-s1 > .kp-maket { margin: 6px -18px 0; border-left: 0; border-right: 0; border-radius: 0; }
#body > .view.ek-s1 > .kp-maket:last-child, #body > section.ek-s1 > .kp-maket:last-child { margin-bottom: -14px; border-bottom: 0; border-bottom-left-radius: 16px; border-bottom-right-radius: 16px; }

/* ── ПУСТОЕ СОСТОЯНИЕ И СПИСОК СТРОК — перенос из макета «Система» 1:1
   (.pusto → .ek-pusto, .spisok-stroka → .ek-spisok-stroka, .znachok → .ek-znachok) ── */
.ek-pusto.ek-s1 { display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 42px 20px; text-align: center; }
.ek-pusto.ek-s1 > svg { color: var(--line); }
.ek-pusto.ek-s1 > b { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.ek-pusto.ek-s1 > span { font-size: 12.5px; color: var(--muted); max-width: 40ch; }
.ek-pusto-kn.ek-s1 { margin-top: 4px; font: inherit; font-size: 12.5px; padding: 7px 15px; border-radius: 8px; border: 1px solid var(--line); background: var(--surface, #fff); color: var(--soft); cursor: pointer; text-decoration: none; transition: border-color .15s, background .15s; }
.ek-pusto-kn.ek-s1:hover { border-color: var(--accent); background: var(--accent-soft); color: var(--kp-accent-ink, var(--accent)); }
tr.ek-dt-pusto.ek-s1 > td { padding: 22px 12px; text-align: center; color: var(--muted); font-size: 12.5px; }
.ek-spisok.ek-s1 { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--surface, #fff); }
.ek-spisok-stroka.ek-s1 { display: flex; align-items: center; gap: 13px; padding: 9px 16px; border-bottom: 1px solid var(--line); color: inherit; text-decoration: none; transition: background .13s; }
.ek-spisok-stroka.ek-s1:last-child { border-bottom: 0; }
a.ek-spisok-stroka.ek-s1, .ek-spisok-stroka.ek-s1[data-route], .ek-spisok-stroka.ek-s1[data-drill-route], .ek-spisok-stroka.ek-s1[role="button"] { cursor: pointer; }
.ek-spisok-stroka.ek-s1:hover { background: var(--surface-2); }
.ek-kto.ek-s1 { font-weight: 500; font-size: 13px; flex: 1 1 190px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ek-chto.ek-s1 { font-size: 12px; color: var(--muted); flex: 2 1 250px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ek-kogda.ek-s1 { font-family: var(--ff-mono, var(--mono, ui-monospace, monospace)); font-size: 11px; color: var(--faint); flex: 0 0 auto; font-variant-numeric: tabular-nums; }
.ek-znachok.ek-s1 { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border-radius: 999px; font-size: 10.5px; font-weight: 500; border: 1px solid var(--line); background: var(--surface-2); color: var(--muted); white-space: nowrap; letter-spacing: .01em; }
.ek-znachok.ek-s1 > i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.ek-znachok.is-ok.ek-s1 { border-color: color-mix(in srgb, var(--accent) 32%, var(--line)); background: var(--accent-soft); color: var(--kp-accent-ink, var(--accent)); }
.ek-znachok.is-ploho.ek-s1 { border-color: color-mix(in srgb, var(--bad) 32%, var(--line)); background: var(--bad-soft); color: var(--bad); }
.ek-znachok.is-vnim.ek-s1 { border-color: color-mix(in srgb, var(--warn) 32%, var(--line)); background: var(--warn-soft); color: var(--warn-ink, var(--warn)); }
/* вторая строка в ячейке: пояснение мелким под именем, одной строкой */
table.dt.ek-dt.ek-s1 td .ek-pod.ek-s1 { display: block; font-size: 11.5px; color: var(--muted); max-width: 52ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* раздел внутри карточки экрана: отступ и шов между разделами */
.ek-razdel.ek-s1 { margin-top: 18px; padding-top: 10px; border-top: 1px solid var(--line); }
.ek-razdel.ek-s1 > .ek-hd.ek-s1 { margin-top: 0; }
.ek-razdel.ek-s1 .ek-hd.ek-s1 > .ek-hd-act.ek-s1 { display: inline-flex; gap: 6px; }
#body > .view.ek-s1 > .ek-razdel.ek-s1 > .kp-maket { margin: 6px -18px 0; border-left: 0; border-right: 0; border-radius: 0; }
/* Шапка одной строкой: распорка не растёт (пояснение и так занимает остаток),
   иначе на длинном заголовке пояснение сжималось до «Комди…»; длинный
   заголовок не сжимается никогда — сжимается пояснение (полный текст в title). */
.ek-hd.ek-s1 > .ek-hd-gap.ek-s1 { flex: 0 0 0; min-width: 0; }
.ek-hd.ek-s1 > .ek-hd-t.ek-s1 { flex: none; }
.kp-maket.kp-malaja .kp-relsa-verh .kp-perekljuchatel { display: none; }

/* 16.09.2026 · вставка «Цены конкурентов» и её разделы на экранах цен.
   Правила заведены, чтобы класс не оставался меткой без правила. */
.rynok-vstavka { display: block; margin: 8px 0; }
.rynok-vstavka > [data-rynok-panel] { margin-top: 8px; }
.pricing-drawer-rynok, .quote-rynok { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--line, #e7eaef); }
.pricing-drawer-rynok h4, .quote-rynok h4 { margin: 0 0 6px; font-size: 13px; }