/* ═══════════════ ОСТАЛЬНЫЕ ЭКРАНЫ ═══════════════
   Зона: портфель («Мой день», «Ждут вашего решения», .hcard, .smix, .panel,
   полоса команды), штаб (.hq-…), аналитика (.an-…), люди (.people-…, .prow),
   документы (.doc-…, .dq-…), поиск (.searchres, .sr-…), подключение таблицы,
   использование (.ut-…), вход (.login-…, .guard) и шапка «кто вошёл».
   ПРАВИЛО РАЗРЕЗА: этот файл правит ОДИН агент за раз и только свою зону.
   Подключается ПОСЛЕДНИМ — перебивает всё выше. */

/* ═════════════ «МОЙ ДЕНЬ» (пульт задач) ═════════════ */
.myday{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:20px}
@media(min-width:640px){.myday{grid-template-columns:repeat(3,1fr)}}
@media(min-width:980px){.myday{grid-template-columns:repeat(6,1fr)}}
.md-tile.wait .md-ic{background:var(--accent-soft);color:var(--accent)}
.md-tile.wait .md-tx b{color:var(--accent)}
.md-tile{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:14px;box-shadow:var(--sh-1);
  padding:14px 16px;text-align:left;transition:transform .16s var(--ease),box-shadow .2s}
.md-tile:hover{transform:translateY(-2px);box-shadow:var(--sh-2)}
.md-tile .md-ic{width:36px;height:36px;border-radius:10px;background:var(--accent-soft);color:var(--accent);
  display:grid;place-items:center;flex:none}
.md-tile .md-ic svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.md-tile.fire .md-ic{background:var(--st-fire-bg);color:var(--st-fire)}
.md-tile .md-tx{display:flex;flex-direction:column;gap:1px;min-width:0}
.md-tile .md-tx b{font-size:21px;line-height:1}
.md-tile.fire .md-tx b{color:var(--st-fire)}
.md-tile .md-tx span{font-size:12px;font-weight:500;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ═════════════ «ЖДУТ ВАШЕГО РЕШЕНИЯ» (сданная работа на первом экране) ═════════════ */
.awaitbox{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--sh-2);
  border-left:4px solid var(--st-review);margin-bottom:20px;overflow:hidden}
.aw-head{width:100%;min-height:64px;display:flex;align-items:center;gap:13px;padding:13px 18px;text-align:left}
.aw-head .aw-ic{width:38px;height:38px;border-radius:11px;background:var(--st-review-bg);color:var(--st-review);
  display:grid;place-items:center;flex:none}
.aw-head .aw-ic svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.aw-head .aw-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.aw-head .aw-tx b{font-size:16px;font-weight:700;color:var(--ink)}
.aw-head .aw-tx b .tnum{color:var(--st-review)}
.aw-head .aw-tx span{font-size:12px;font-weight:500;color:var(--ink-2)}
.aw-head .aw-chev{margin-left:auto;color:var(--ink-2);flex:none;transition:transform .2s var(--ease)}
.aw-head .aw-chev svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.awaitbox.open .aw-head .aw-chev{transform:rotate(180deg)}
.aw-list{border-top:1px solid var(--line);display:flex;flex-direction:column}
.aw-row{padding:12px 18px 14px;display:flex;flex-direction:column;gap:9px}
.aw-row + .aw-row{border-top:1px solid var(--line)}
.aw-row .aw-t{min-height:44px;display:flex;flex-direction:column;gap:3px;text-align:left;width:100%}
.aw-row .aw-t .nm{font-size:14.5px;font-weight:600;line-height:1.3;color:var(--ink)}
.aw-row .aw-t .sub{font-size:11.5px;font-weight:500;color:var(--ink-2)}
.aw-row .aw-t .rep{font-size:12px;color:var(--ink-2);line-height:1.4;border-left:2px solid var(--st-review);padding-left:8px;margin-top:3px}
.aw-acts{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
@media(max-width:520px){.aw-acts .tc3-main,.aw-acts .tc3-second{flex:1 1 100%;justify-content:center}}

/* КарточкаСуровнемЗдоровья */
.hcard{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--sh-2);padding:18px;
  display:flex;gap:16px;align-items:flex-start;cursor:pointer;position:relative;
  transition:transform .18s var(--ease),box-shadow .2s;text-align:left;width:100%}
.hcard:hover{transform:translateY(-2px);box-shadow:var(--sh-3)}
.hcard:active{transform:translateY(0)}
.hcard .ring{flex:none}
.hcard .body{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}
.hcard .body h3{font-size:16.5px;font-weight:600;margin:0;line-height:1.25;overflow:hidden;text-overflow:ellipsis}
.hcard .meta{font-size:12.5px;font-weight:500;color:var(--ink-2);display:flex;flex-wrap:wrap;gap:4px 10px}
.hcard .foot{display:flex;align-items:center;gap:14px;margin-top:2px;font-size:12.5px;font-weight:500}
.health{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2)}
.health .dot{width:8px;height:8px;border-radius:50%;flex:none}
.cnt{display:inline-flex;align-items:center;gap:5px;color:var(--ink-2)}
.cnt.fire{color:var(--st-fire)}
.cnt.prog{color:var(--st-prog)}
.cnt.done{color:var(--st-done)}
.cnt.todo{color:var(--ink-2)}
.cnt b{font-variant-numeric:tabular-nums}
/* разбивка задач ПО СТАТУСАМ — ровно три сегмента, всегда в одном порядке
   (Надо → В работе → Готово), даже при нуле: позиция читается без подписей.
   Просрочка НЕ сегмент, а чип «из них» за разделителем — она вложена в статусы,
   а не стоит с ними в одном ряду. См. РЕШЕНИЯ_ЭКРАНЫ.md §1.3 */
.smix{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.smix .lg{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:600;color:var(--ink-2);font-variant-numeric:tabular-nums}
.smix .lg b{color:var(--ink);font-weight:700}
.smix .lg i{width:7px;height:7px;border-radius:50%;flex:none}
.smix .lg.new i{background:var(--st-new)}
.smix .lg.prog i{background:var(--st-prog)}
.smix .lg.review i{background:var(--st-review)}
.smix .lg.done i{background:var(--st-done)}
.smix .sep{width:1px;align-self:stretch;min-height:12px;background:var(--line);flex:none}
.smix .od{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;
          padding:1px 8px;border-radius:999px;background:var(--alarm-bg);color:var(--alarm);
          font-variant-numeric:tabular-nums}

/* блок-карточка (дашборд-панель) */
.panel{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--sh-2);padding:18px;min-width:0}
.panel h4{margin:0 0 12px;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--ink);display:flex;align-items:center;gap:8px}
.panel h4 svg,.section-t svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.panel h4 .n{margin-left:auto;font-size:12px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.plist{display:flex;flex-direction:column;gap:2px}
.prow{display:flex;align-items:center;gap:10px;padding:9px 8px;border-radius:9px;cursor:pointer;transition:background .14s}
.prow:hover{background:var(--surface-2)}
.prow .edge{width:3px;align-self:stretch;border-radius:3px;flex:none}
.prow .t{flex:1;min-width:0;font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prow .m{font-size:12px;color:var(--ink-2);white-space:nowrap;font-weight:500}
.prow .m.fire{color:var(--st-fire)}

/* ═════════════ ШТАБ: горящие задачи, сгруппированные по вилле ═════════════
   Было — плоский список из 96 одинаковых строк без виллы (жалоба владельца
   вживую). Стало — группа на виллу, кольцо прогресса виллы, топ-4 задачи
   видны сразу, остальное — счётчиком «ещё N». */
.hq-groups{display:flex;flex-direction:column;gap:10px}
.hq-group{background:var(--surface-2);border-radius:12px;overflow:hidden}
.hq-group-h{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:9px 10px;
  border-radius:12px;transition:background .14s}
.hq-group-h:hover{background:var(--line)}
.hq-group-h .ring{width:34px;height:34px;flex:none}
.hq-group-h .ring .pct{font-size:9.5px}
.hq-group-h .nm{flex:1;min-width:0;font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hq-group-h .cnt.fire{font-size:12px;font-weight:700;color:var(--st-fire);white-space:nowrap}
.hq-group-h .chev{flex:none;width:14px;height:14px;color:var(--ink-2)}
.hq-group-h .chev svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.hq-group-tasks{padding:0 6px 6px}
.hq-group-tasks .prow{padding:7px 8px}
.hq-more{padding:4px 8px 2px;font-size:11.5px;color:var(--ink-2)}
.hq-showall{width:100%;margin-top:10px;padding:10px;border-radius:10px;background:var(--surface-2);
  color:var(--accent);font-size:12.5px;font-weight:700;text-align:center}
.hq-showall:hover{background:var(--accent-soft)}

/* ═════════════ ГЛОБАЛЬНЫЙ ПОИСК (шаг D импорта навигации v2) ═════════════ */
.searchres{display:flex;flex-direction:column;gap:6px}
.sr-group{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);
  margin:16px 2px 6px;display:flex;align-items:center;gap:6px}
.sr-group:first-child{margin-top:2px}
.sr-group .n{background:var(--surface-2);border-radius:999px;padding:1px 8px;font-size:10.5px}
.sr-row{display:flex;align-items:center;gap:11px;background:var(--surface);border-radius:12px;padding:11px 13px;
  box-shadow:var(--sh-1);text-align:left;width:100%;transition:box-shadow .16s,transform .16s var(--ease)}
.sr-row:hover{box-shadow:var(--sh-2);transform:translateY(-1px)}
.sr-row svg{width:17px;height:17px;stroke:var(--accent);fill:none;stroke-width:2;flex:none}
.sr-row .sub{font-size:11.5px;color:var(--ink-2);margin-top:2px}
/* поле поиска на экране — тач-цель 44px (у общего .dq-search input было 39px) */
#srchQ{min-height:44px;font-size:15px}
/* строка состояния поиска: локальный отклик уже на экране, сервер ещё думает */
.sr-note{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-2);padding:2px 2px 8px}
.sr-note.warn{color:var(--st-fire)}
.sr-note svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;flex:none}

/* ═══ ЧИПОВ ПОДКЛЮЧЕНИЙ (.conns/.conn) ЗДЕСЬ БОЛЬШЕ НЕТ ═══
   Владелец 31.08, дословно: «Телеграм Джарвис удали полностью эту хуйню
   отсюда». Плашка была <span> без onclick и без курсора: не нажималась,
   ничего не сообщала и занимала место в полосе управления доски. Обёртка
   .conns снесена вместе с ней — пустой div с margin-left:auto остался бы
   flex-элементом и продолжил рвать ряд.
   ⚠️ .conn-status / .conn-res / .conn-id ниже — ДРУГИЕ классы и другой экран
   (proekty.vid.js, лист подключения Google Sheets). Их не трогать. */

.people-list{display:flex;flex-direction:column;gap:8px}
.people-row{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:var(--r-card,14px);padding:12px 14px;box-shadow:var(--sh-1)}
.people-row .avatar{width:36px;height:36px;font-size:13px}
.people-row .body{flex:1;min-width:0}
.people-row .nm{font-weight:600;font-size:14px}
.people-row .role{font-size:12px;color:var(--ink-2)}
.people-row .role .muted{color:var(--ink-2)}
.people-row .cnt{font-weight:700;font-size:13px;color:var(--ink-2);flex:none}
.people-row .cnt.fire{color:var(--st-fire)}
/* панель людей: имя редактируется по нажатию, роль — выпадающим списком */
.prow{display:flex;align-items:center;gap:11px;background:var(--surface);border-radius:14px;
  padding:10px 12px;box-shadow:var(--sh-1);min-height:60px}
.prow.arch{opacity:.62}
.prow.ghost{background:var(--surface-2);box-shadow:none;border:1px dashed var(--line)}
.prow .avatar{width:34px;height:34px;font-size:12.5px}
.pmain{flex:1;min-width:0}
.pname{display:inline-flex;align-items:center;gap:7px;font-size:14.5px;font-weight:600;color:var(--ink);
  background:none;padding:3px 6px;border-radius:8px;margin-left:-6px;max-width:100%;cursor:pointer}
.pname:hover{background:var(--accent-soft);color:var(--accent)}
.pname svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;opacity:.5;flex:none}
.pname:hover svg{opacity:1}
.pname-hint{font-size:11px;font-weight:600;color:var(--accent);background:var(--accent-soft);
  border-radius:6px;padding:2px 7px}
.pname-plain{font-size:14.5px;font-weight:600}
.pname-inp{width:100%;max-width:280px;font:inherit;font-size:14.5px;font-weight:600;padding:7px 10px;
  border:1.5px solid var(--accent);border-radius:9px;background:var(--surface);color:var(--ink);min-height:40px}
.pmeta{display:flex;gap:9px;flex-wrap:wrap;margin-top:2px;font-size:11.5px;color:var(--ink-2)}
.pnick{font-weight:600}
.pnick.off{opacity:.6}
.pwarn{color:var(--st-fire);font-weight:600}
.pcnt{flex:none;display:flex;flex-direction:column;align-items:center;gap:1px;min-width:62px;min-height:44px;
  border-radius:10px;background:var(--surface-2);color:var(--ink-2);font-size:10.5px;padding:5px 8px;cursor:pointer}
.pcnt b{font-size:15px;color:var(--ink);font-weight:700}
.pcnt.on b{color:var(--st-fire)}
.pcnt:hover{background:var(--accent-soft);color:var(--accent)}
.prole{flex:none;font:inherit;font-size:12px;font-weight:600;color:var(--ink-2);background:var(--surface-2);
  border:0;border-radius:9px;padding:0 8px;min-height:44px;cursor:pointer}
.pact{flex:none;width:40px;height:40px;border-radius:10px;background:transparent;color:var(--ink-2);
  display:grid;place-items:center;cursor:pointer}
.pact:hover{background:var(--surface-2);color:var(--ink)}
.pact.del:hover{background:color-mix(in srgb,var(--danger) 12%,transparent);color:var(--danger)}
.pact.ok{background:var(--accent);color:var(--on-accent)}
.pact svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ghostnote{font-size:12.5px;color:var(--ink-2);margin:-4px 0 10px;line-height:1.5}
@media(max-width:560px){
  .prole{display:none}
  .prow{flex-wrap:wrap}
  .pmain{flex:1 1 100%;order:1}
  .prow .avatar{order:0}
  .pcnt{order:2}
  .pact{order:3;margin-left:auto}
}
/* полоса команды на первом экране: сетка, не колонка во весь экран и не лента
   шире экрана. Была горизонтальная лента — владелец 15.08: «строка шире
   экрана, ползунок двигать — глупо. Не информативно»; чинили в один столбик
   (tasks/portfel-lyudi-vertikalno.md), но владелец 16.08 — «список занимает
   весь экран и внимание, а информации в нём на треть строки, левая часть
   пустая»: карточка человека короткая, во всю ширину ей не быть тоже
   (tasks/portfel-lyudi-setkoy-a-ne-stolbikom.md). Сетка — приём уже в файле
   (.myday выше, .an-grid ниже): число колонок под ширину карточки человека,
   не под число людей. Прокрутки внутри блока нет ни на какой ширине. */
.teamstrip{margin:14px 0 4px}
.ts-h{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-2);margin-bottom:9px}
.ts-h svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2;flex:none}
.ts-all{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--accent);background:none;
  text-transform:none;letter-spacing:0;padding:6px 8px;border-radius:8px;min-height:44px}
.ts-all:hover{background:var(--accent-soft)}
/* Люди в портфеле: сетка, а не столбик во весь экран. Владелец 16.08:
   «список занимает весь экран и внимание, а информации там нет столько».
   Точки перелома те же, что у .myday выше — на телефоне одна колонка,
   дальше карточка человека (аватар + имя + «N на руках») держит ~240 px. */
.ts-row{display:grid;grid-template-columns:1fr;gap:8px}
@media(min-width:640px){.ts-row{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.ts-row{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1180px){.ts-row{grid-template-columns:repeat(4,1fr)}}
.tm-p{width:100%;display:flex;align-items:center;gap:10px;background:var(--surface);border-radius:13px;
  padding:10px 13px 10px 10px;box-shadow:var(--sh-1);min-height:56px;cursor:pointer;text-align:left;
  transition:box-shadow .15s,transform .1s}
.tm-p:hover{box-shadow:var(--sh-2,0 2px 10px rgba(60,60,50,.10))}
.tm-p:active{transform:scale(.99)}
.tm-p:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tm-av{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:var(--accent-soft);color:var(--accent);font-size:12.5px;font-weight:700}
.tm-p.free .tm-av{background:var(--surface-2);color:var(--ink-2)}
.tm-b{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.tm-nm{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-m{font-size:11.5px;color:var(--ink-2);white-space:nowrap}
.tm-m i{font-style:normal;font-weight:700}
.tm-m i.fire{color:var(--st-fire)}
.tm-m i.rev{color:var(--accent)}
/* строка человека — вход на его доску: тач-цель 56px, «стрелка вперёд» справа */
.people-row{cursor:pointer;min-height:56px;transition:box-shadow .15s,transform .1s}
.people-row:hover{box-shadow:var(--sh-2,0 2px 10px rgba(60,60,50,.10))}
.people-row:active{transform:scale(.995)}
.people-row:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.people-row .people-go{flex:none;display:inline-flex;color:var(--ink-2)}
.people-row .people-go svg{width:16px;height:16px}
.people-row:hover .people-go{color:var(--accent)}

/* ═════════════ РАЗДЕЛ «АНАЛИТИКА» ═════════════ */
.an-grid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:760px){.an-grid{grid-template-columns:repeat(2,1fr)}}
.an-list{display:flex;flex-direction:column;gap:11px}
.an-bar{display:grid;grid-template-columns:118px 1fr 54px;align-items:center;gap:11px}
.an-bar .an-lb{font-size:12.5px;font-weight:500;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.an-bar .an-track{height:9px;border-radius:6px;background:var(--surface-2);overflow:hidden}
.an-bar .an-track i{display:block;height:100%;border-radius:6px;background:var(--accent);transition:width .55s var(--ease)}
.an-bar .an-val{font-size:12.5px;color:var(--ink);text-align:right}

/* ═════════════ ПАНЕЛЬ «КОМАНДА» (P6) ═════════════
   Компактная мобильная таблица: карточка-строка на человека, ячейки-показатели
   тапабельны (≥44px), раскрыв со списком карточек встаёт под строкой. */
.tm-panel{margin-bottom:16px}
.tm-days{margin:2px 0 14px}
.tm-days button{min-height:44px;min-width:44px}
.tm-row{border-top:1px solid var(--line);padding:10px 0 12px}
.tm-row:first-of-type{border-top:none}
.tm-head{display:flex;align-items:baseline;gap:9px;margin-bottom:9px}
.tm-head b{font-size:14.5px}
.tm-rol{font-size:12px;color:var(--ink-2)}
.tm-cells{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:6px}
.tm-cell{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:44px;
  padding:7px 10px;border:0;border-radius:var(--r2);background:var(--surface);
  font:inherit;text-align:left;cursor:pointer;box-shadow:var(--sh-1);
  transition:background .15s,box-shadow .15s}
.tm-cell.on{background:var(--accent-soft)}
.tm-cell.dead{cursor:default;box-shadow:none;background:var(--surface-2)}
.tm-cell .tm-l{font-size:11.5px;font-weight:500;color:var(--ink-2);white-space:nowrap}
.tm-cell .tm-v{font-size:14.5px;font-weight:600;color:var(--ink)}
.tm-cell .tm-v i{font-style:normal;font-size:12px;font-weight:500;color:var(--ink-2)}
.tm-cell .tm-s{font-size:11.5px;color:var(--ink-2)}
.tm-ar{margin-left:4px;font-size:12px;color:var(--ink-2)}
.tm-open{margin-top:9px;background:var(--surface-2);border-radius:var(--r3);padding:6px 8px}
.tm-item{display:flex;align-items:center;gap:10px;min-height:44px;padding:5px 8px;
  border-radius:var(--r1);text-decoration:none;color:var(--ink)}
.tm-item:hover{background:var(--card)}
.tm-item .tm-it{flex:1;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-item .tm-in{flex:none;font-size:12px;color:var(--ink-2)}
.tm-esche,.tm-podpis{font-size:12px;color:var(--ink-2);padding:7px 8px}
.tm-prich{display:flex;flex-direction:column;gap:4px;padding:7px 8px;font-size:12.5px;color:var(--ink-2)}
.tm-empty{font-size:13px;color:var(--ink-2);padding:9px 0}
.tm-snoska{margin-top:11px;font-size:11.5px;color:var(--ink-2)}

/* ═════════════ ПОДКЛЮЧЕНИЕ ТАБЛИЦЫ ═════════════ */
.conn-status{display:flex;align-items:center;gap:9px;flex-wrap:wrap;background:var(--surface-2);border-radius:11px;
  padding:10px 13px;margin-bottom:16px;font-size:13.5px;font-weight:600}
.conn-status .cdot{width:9px;height:9px;border-radius:50%;background:var(--st-done);flex:none}
.conn-status .cdot.off{background:var(--st-new)}
.conn-status .cs-sync{margin-left:auto;font-size:12px;font-weight:500;color:var(--ink-2)}
.conn-id{font-size:12.5px;color:var(--ink-2);margin:-6px 0 14px}
.conn-id b{color:var(--ink);font-weight:600;word-break:break-all}
.hintbox{background:var(--accent-soft);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.hintbox .hb-t{font-size:12.5px;color:var(--ink);line-height:1.45;display:flex;gap:7px;margin-bottom:9px}
.hintbox .hb-t svg{width:15px;height:15px;stroke:var(--accent);fill:none;stroke-width:2;flex:none;margin-top:1px}
.robot{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.robot code{flex:1;min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:7px 10px;
  font-size:12px;font-family:"SFMono-Regular",Consolas,monospace;color:var(--ink);word-break:break-all}
.rb-copy{display:inline-flex;align-items:center;gap:5px;background:var(--accent);color:var(--on-accent);border-radius:8px;
  padding:7px 11px;font-size:12px;font-weight:600;box-shadow:var(--sh-1);flex:none}
.rb-copy svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.conn-res{background:var(--surface-2);border-radius:12px;padding:12px 14px;margin-top:6px}
.conn-res.err{background:var(--st-fire-bg)}
.conn-res .cr-nums{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--ink-2)}
.conn-res .cr-nums b{color:var(--ink);font-size:16px;margin-right:4px}
.conn-res .cr-nums .fail b{color:var(--st-fire)}
.conn-res .cr-deg{margin-top:9px;font-size:12px;color:var(--st-fire);display:flex;gap:6px;line-height:1.4}
.conn-res .cr-deg svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;flex:none;margin-top:1px}
.conn-res .cr-err{font-size:13px;color:var(--st-fire);display:flex;gap:7px;line-height:1.45}
.conn-res .cr-err svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;flex:none;margin-top:1px}
.botnav button .over-b{right:calc(50% - 20px)}
/* Нижняя навигация на телефоне: у Создателя пунктов 11, а 44-пиксельных кнопок в
   390px влезает восемь — «Сводка» и «Корзина» просто ТОРЧАЛИ за экраном (замерено:
   правый край 484px при окне 390; было ещё до «Сделано», с ним стало хуже).
   Полоса прокручивается ВНУТРИ себя: страница не растёт (гор. скролла нет, §10),
   кнопки не сжимаются мельче тач-цели и не режутся. */
@media(max-width:759px){
  .botnav{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .botnav::-webkit-scrollbar{display:none}
  .botnav button{flex:1 0 auto;min-width:62px;padding:0 6px}
  /* УКАЗАТЕЛЬ ПРОДОЛЖЕНИЯ. Классы kray-l/kray-r ставит botnavKrai() по замеру
     scrollWidth — значит край виден ровно тогда, когда за ним правда есть кнопки.
     position:fixed внутри .botnav ведёт себя как absolute (у полосы стоит
     transform:translateZ(0) — она сама себе система координат), поэтому край
     стоит на месте и НЕ едет вместе с кнопками. Из потока такой узел выпадает,
     и flex-раскладку полосы не трогает. Ни стрелок, ни движения. */
  .botnav.kray-r::after,.botnav.kray-l::before{content:"";position:fixed;top:0;bottom:0;
    width:26px;pointer-events:none;z-index:1}
  .botnav.kray-r::after{right:0;background:linear-gradient(to left,var(--bg),transparent)}
  .botnav.kray-l::before{left:0;background:linear-gradient(to right,var(--bg),transparent)}
}


/* ═════════════ «СДЕЛАНО ЗА ПЕРИОД» (Волна 5, ТЗ 7.3) ═════════════
   Таблица подтверждённых работ. На компьютере — сетка в четыре колонки, на
   телефоне строки складываются в карточку (заголовок+дата / где / кто) — без
   горизонтальной прокрутки страницы (закон §10). */
.rep-filters{display:flex;gap:10px 14px;flex-wrap:wrap;align-items:flex-end;margin:0 0 14px}
.rep-sel{display:flex;flex-direction:column;gap:4px;font-size:10.5px;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.rep-sel select,.rep-sel input{min-height:44px;border:1px solid var(--line);border-radius:10px;
  background:var(--surface);color:var(--ink);font:inherit;font-size:13.5px;padding:0 10px;min-width:150px;max-width:100%}
.rep-sel select:focus,.rep-sel input:focus{outline:none;border-color:var(--accent)}
.rep-head{font-size:13px;color:var(--ink-2);font-weight:500;margin:0 0 12px}
.rep-table{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--sh-2);overflow:hidden}
.rep-row{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1.8fr) minmax(0,1.5fr) 62px;
  gap:4px 14px;align-items:center;min-height:48px;padding:11px 16px;border-top:1px solid var(--line);
  cursor:pointer;transition:background .14s;width:100%;text-align:left}
.rep-row:first-child{border-top:none}
.rep-row:hover{background:var(--surface-2)}
.rep-hrow,.rep-hrow:hover{background:var(--surface-2);cursor:default;min-height:0;padding:9px 16px 8px}
.rep-hrow span{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.rep-t{font-size:13.5px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rep-w,.rep-who{font-size:12px;color:var(--ink-2);font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rep-who i{font-style:normal;color:var(--ink-3,var(--ink-2))}
.rep-d{font-size:12px;color:var(--ink-2);font-weight:600;text-align:right;white-space:nowrap}
.rep-cut{font-size:12px;color:var(--ink-2);margin-top:8px;text-align:center}
@media(max-width:759px){
  .rep-hrow{display:none}
  .rep-row{grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"t d" "w w" "who who";gap:3px 10px;padding:12px 14px}
  .rep-t{grid-area:t;white-space:normal}
  .rep-d{grid-area:d;align-self:start}
  .rep-w{grid-area:w;white-space:normal}
  .rep-who{grid-area:who;white-space:normal}
}


/* ═════════════ АРХИВ ВНУТРИ «СДЕЛАНО» ═════════════
   Экран результатов: строка сводки, три среза (объекты · люди · этапы),
   свёрнутые группы и панель процессных мер. Отдельного дома у Архива нет — он
   живёт ВНУТРИ «Сделано» (поправка владельца 12 августа), поэтому и стили
   стоят сразу за блоком «Сделано за период», а не отдельным файлом.
   ТАЧ-ЦЕЛИ. Базовый .seg — 34 px, регламент §3 требует 44. На этом экране
   сегментов два (период и срез), и оба подняты до 44: замер сторожа вёрстки
   до правки давал ровно три мелкие цели, и все три были кнопками .seg. */
.arh-seg button{height:44px}

/* ПРОЕКТ — ПЕРВЫЙ ШАГ (карточка «архив-разобрать», 16.08). Плитки, не столбик
   во всю ширину — тот же приём сетки, что у .ts-row (portfel-lyudi-setkoy):
   390 px — одна колонка, 640 — две, 980 — три. У архивной плитки контента
   больше, чем у чипа человека (имя проекта + число + период), поэтому потолок
   у неё три колонки, а не четыре. */
.arh-projs{display:grid;grid-template-columns:1fr;gap:10px;margin:0 0 6px}
@media(min-width:640px){.arh-projs{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.arh-projs{grid-template-columns:repeat(3,1fr)}}
.arh-proj{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--sh-2);
  padding:16px;text-align:left;display:flex;flex-direction:column;gap:2px;min-height:44px;
  transition:transform .16s var(--ease),box-shadow .16s var(--ease)}
.arh-proj:hover{transform:translateY(-2px);box-shadow:var(--sh-3)}
.arh-proj:active{transform:translateY(0)}
.arh-proj .ap-t{font-size:14.5px;font-weight:600;color:var(--ink);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.arh-proj .ap-n{font-size:24px;font-weight:600;line-height:1.25;color:var(--ink);margin-top:6px;
  font-variant-numeric:tabular-nums}
.arh-proj .ap-l{font-size:12px;color:var(--ink-2)}
.arh-proj .ap-p{font-size:11.5px;color:var(--ink-2);margin-top:6px}

.arh-svodka{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 14px}
.arh-num{display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  min-height:64px;padding:9px 15px;border-radius:var(--r2);background:var(--surface);
  box-shadow:var(--sh-1);border-bottom:2px solid transparent;text-align:left;
  transition:background .16s var(--ease)}
.arh-num:hover{background:var(--surface-2)}
/* нажатая цифра различается ДВУМЯ признаками сразу — заливкой и подчёркиванием
   акцентом, плюс жирная подпись: одним лишь цветом признак различать нельзя */
.arh-num.on{background:var(--accent-soft);border-bottom-color:var(--accent)}
.arh-num.on .l{font-weight:700}
.arh-num .v{font-size:21px;line-height:1.15;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.arh-num .l{font-size:13px;font-weight:600;color:var(--ink)}
.arh-num .s{font-size:11px;color:var(--ink-2)}

.arh-srez{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 12px}
.arh-fokus{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;
  background:var(--accent-soft);border-radius:var(--r2);padding:8px 14px;margin:0 0 12px;
  font-size:13px;font-weight:600;color:var(--ink)}

.arh-grupp{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--sh-2);
  overflow:hidden;margin-bottom:10px}
.arh-gh{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;
  padding:9px 16px;text-align:left;transition:background .16s var(--ease)}
.arh-gh:hover{background:var(--surface-2)}
.arh-gh .g-ch{flex:none;display:inline-flex;color:var(--ink-2)}
.arh-gh .g-ch svg{width:16px;height:16px;stroke:currentColor;fill:none;
  stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.arh-gh .g-tt{flex:1;min-width:0}
.arh-gh .g-t{display:block;font-size:14.5px;font-weight:600;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arh-gh .g-p{display:block;font-size:11.5px;font-weight:500;color:var(--ink-2);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arh-gh .g-m{flex:none;font-size:12px;font-weight:600;color:var(--ink-2);
  text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.arh-body{border-top:1px solid var(--line);background:var(--card)}

.arh-panel{margin-top:16px}
.arh-met{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;
  padding:6px 0;text-align:left;border-top:1px solid var(--line-2);transition:color .16s var(--ease)}
.arh-panel .arh-met:first-of-type{border-top:none}
.arh-met:hover .m-l{color:var(--accent)}
.arh-met .m-l{flex:1;min-width:0;font-size:13.5px;color:var(--ink)}
.arh-met .m-v{font-size:16px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.arh-met .m-o{font-size:11.5px;color:var(--ink-2);white-space:nowrap;min-width:54px;text-align:right}

.arh-note{font-size:11.5px;line-height:1.5;color:var(--ink-2);margin:6px 0 0}
/* возврат и самоприёмка различаются СЛОВОМ и начертанием, а не только оттенком */
.arh-vz{font-weight:700;color:var(--alarm)}
.arh-sam{font-weight:700;color:var(--ink);border-bottom:1.5px dotted var(--ink-2)}
/* поднятая из архива строка — серая метка вместо исчезновения (§8, «архив-разобрать» п.3) */
.arh-podn{font-weight:700;color:var(--ink-2)}

/* ряд выхода: кнопки стоят с зазором и не слипаются в одну (замер сторожа) */
.arh-vyhod{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:12px}
/* ⚠️ ОТСТУП ПОД КРУГЛУЮ КНОПКУ. На 390 px #fab накрывал последнюю серую строку
   экрана на 27×15 px. Сторож этого не ловит — кнопка в другом слое наложения. */
.arh-podval{height:96px}
@media(max-width:759px){
  .arh-num{flex:1 1 43%;min-width:0}
  .arh-gh{gap:10px;padding:9px 13px}
  .arh-gh .g-m{font-size:11.5px}
}

/* ═══ «Сделано»: найти работу и увидеть, как её сдавали (владелец 02.09) ═══
   Разница между «приняли» и «закрыли без приёмки» — СЛОВОМ в строке, а не
   оттенком: цветом один признак различать нельзя (регламент, тач и контраст). */
.arh-bez{font-weight:700;color:var(--ink-2);border-bottom:1.5px dotted var(--ink-2)}
/* «Всего» — подпись масштаба над двумя числами, а не четвёртая плитка */
.arh-vsego{font-size:12px;color:var(--ink-2);font-weight:500;margin:0 0 8px}
.arh-vsego b{font-size:15px;color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
/* подсказка «по всему архиву» — только там, где она бесплатна: на телефоне она
   уводила первую работу под сгиб, а после поиска то же самое говорит экран находок */
@media(max-width:759px){ .arh-vezde{display:none} }
.arh-otkr{font-weight:700;color:var(--ink-2)}
/* подпись у поля поиска: где ищем. Серая строка, не кнопка — она ничего не делает */
.arh-vezde{align-self:flex-end;margin:0 0 12px}

/* ТРИ ВЕДРА СРОКА. Не плитки сводки: у них своя панель, чтобы после карточки
   «Сроки и история» поменялось только число в охвате, а не место блока. */
.arh-srok{margin-top:16px}
.arh-vedra{display:flex;flex-wrap:wrap;gap:10px;margin:2px 0 0}
.arh-vedro{display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  flex:1 1 30%;min-width:0;min-height:64px;padding:9px 14px;border-radius:var(--r2);
  background:var(--surface-2);border-bottom:2px solid transparent;text-align:left;
  transition:background .16s var(--ease)}
.arh-vedro:hover{background:var(--surface)}
.arh-vedro.on{background:var(--accent-soft);border-bottom-color:var(--accent)}
.arh-vedro.on .l{font-weight:700}
.arh-vedro .v{font-size:19px;line-height:1.15;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.arh-vedro .l{font-size:12.5px;font-weight:600;color:var(--ink)}
.arh-vedro .s{font-size:11px;color:var(--ink-2)}
/* разбивка «сравнимо»: раньше · день в день · опоздание — числами, без процента */
.arh-vnutri{display:flex;flex-wrap:wrap;gap:6px 16px;margin:10px 0 0;
  font-size:12px;color:var(--ink-2)}
.arh-vnutri b{color:var(--ink);font-weight:600}

/* ЛЕНТА ПО ДНЯМ. Тот же дом, что у группы среза (.arh-grupp), но заголовок дня
   не кнопка: раскрывать нечего — день уже раскрыт. Строки остаются плотными
   (--h-data), поднимать их до 44 запрещено (СТИЛЬ_ПРОРАБА §3). */
.arh-den{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--sh-2);
  overflow:hidden;margin:0 0 10px}
.arh-dh{display:flex;align-items:center;gap:12px;min-height:40px;padding:8px 16px}
.arh-dh .d-t{flex:1;min-width:0;font-size:13.5px;font-weight:600;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arh-dh .d-m{flex:none;font-size:12px;font-weight:600;color:var(--ink-2);
  font-variant-numeric:tabular-nums}

/* ═════════════ ВХОД (экран логина, /api/auth) + шапка: кто вошёл ═════════════ */
body.authlock .hdr,body.authlock .botnav,body.authlock .fab,body.authlock .side,body.authlock .scrim2{display:none}
body.authlock{padding-bottom:0}
.login-wrap{min-height:calc(100dvh - 60px);display:grid;place-items:center;padding:24px 10px}
/* ⚠️ ШИРИНА ОТ КОНТЕЙНЕРА, А НЕ ОТ ЭКРАНА. Было 94vw — а vw это ВЕСЬ экран, тогда
   как карточка входа стоит внутри оболочки платформы, у которой свои 16 px полей
   с каждой стороны. На 390 px выходило 366.6 в контейнере 358: правый край уезжал
   на 392.6, и сторож вёрстки давал горизонтальную прокрутку — запрет показа
   владельцу (закон §10). 100% меряется от того, куда карточку и правда положили. */
.login-card{width:min(420px,100%);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--sh-2);padding:26px 24px}
.login-card .lg-logo{width:44px;height:44px;border-radius:12px;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;font-weight:700;font-size:20px;margin-bottom:14px}
.login-card h1{font-size:21px;margin:0 0 4px;font-weight:600}
.login-card .lg-sub{font-size:13px;color:var(--ink-2);margin-bottom:18px}
.login-card .lg-field{margin-bottom:12px}
.login-card .lg-field label{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin-bottom:5px}
.login-card .lg-field input{width:100%;height:44px;border:1px solid var(--line);border-radius:10px;background:var(--bg);padding:0 13px;font-size:15px;box-sizing:border-box}
.login-card .lg-field input:focus{border-color:var(--accent);outline:none}
.lg-err{display:none;background:var(--st-fire-bg);color:var(--st-fire);border-radius:10px;padding:9px 12px;font-size:13px;margin-bottom:12px}
.lg-err.show{display:block}
.lg-btn{width:100%;justify-content:center}
.lg-hint{margin-top:16px;background:var(--accent-soft);border-radius:12px;padding:11px 13px;font-size:12.5px;line-height:1.5;color:var(--ink)}
.lg-hint b{font-weight:700}
.lg-hint .idv{display:block;margin-top:6px;color:var(--ink-2)}
/* ВТОРОЙ ЯЗЫК НА ЭКРАНЕ ВХОДА. Заголовок и подпись — строкой ниже, подпись поля —
   в той же строке (иначе поле уезжает вниз и на 390px кнопка «Войти» падает за
   сгиб). Цвет приглушённый: это перевод, а не второй заголовок. */
.login-card h1 .idv{display:block;font-size:14px;font-weight:500;color:var(--ink-2);margin-top:2px}
.login-card .lg-sub .idv{display:block;margin-top:2px;opacity:.8}
.login-card .lg-field label .idv{font-weight:600;opacity:.72;letter-spacing:.04em}
/* ── ГОЛОВА-СТРАЖ экрана входа (прораб-домовой: следит, жмурится на пароле,
      хмурится на ошибке, открывает дверь-рот на входе) ── */
.guard-wrap{display:flex;flex-direction:column;align-items:center;margin-bottom:-26px;z-index:1;position:relative}
.guard{width:190px;height:170px;position:relative;filter:drop-shadow(0 10px 24px rgba(30,26,20,.18))}
.guard svg{width:100%;height:100%}
.guard .g-face{fill:var(--surface-2)}
.guard .g-stroke{stroke:var(--ink-2);stroke-width:3;fill:none;stroke-linecap:round}
.guard .g-helmet{fill:var(--accent)}
.guard .g-helmet-band{fill:color-mix(in srgb, var(--accent) 70%, #000 10%)}
.guard .g-eye{fill:var(--ink);transition:transform .12s ease-out}
.guard .g-lid{fill:var(--surface-2);transform:translateY(-16px);transition:transform .18s var(--ease)}
.guard.squint .g-lid{transform:translateY(-5px)}          /* зажмурился на пароле */
.guard .g-brow{transition:transform .25s var(--ease)}
.guard.angry .g-brow-l{transform:rotate(14deg) translateY(3px)}
.guard.angry .g-brow-r{transform:rotate(-14deg) translateY(3px)}
.guard .g-mouth{transition:transform .5s var(--ease);transform-origin:95px 128px}
.guard.open .g-mouth{transform:scaleY(2.6)}               /* дверь-рот открывается */
.guard-hint{font-size:11.5px;color:var(--ink-2);margin-top:2px;letter-spacing:.04em;
  text-transform:uppercase;font-weight:600;opacity:.8;text-align:center;padding:0 10px}
@keyframes guardBlink{0%,94%,100%{transform:translateY(-16px)}96%,98%{transform:translateY(-2px)}}
.guard:not(.squint) .g-lid{animation:guardBlink 5.5s infinite}
.login-wrap.entering .login-card{transform:translateY(-8px) scale(.97);opacity:0;transition:all .5s var(--ease)}
.hdr-user{margin-left:auto;display:flex;align-items:center;gap:8px;min-width:0}
.hdr-user .hu-name{font-size:13px;font-weight:600;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hdr-user .hu-role{font-size:10.5px;font-weight:600;color:var(--accent);background:var(--accent-soft);padding:2px 8px;border-radius:999px;white-space:nowrap}
.hdr-user .hu-out{height:44px;padding:0 10px;border-radius:9px;background:var(--surface);box-shadow:var(--sh-1);font-size:12px;font-weight:600;color:var(--ink-2);flex:none}
.hdr-user .hu-out:hover{color:var(--st-fire)}
@media(max-width:640px){.hdr-user .hu-role{display:none}.hdr-user .hu-name{max-width:90px}}

/* ═════════════ РАЗДЕЛ «ИСПОЛЬЗОВАНИЕ» (только админ, аддитивно) ═════════════ */
.ut-days{display:inline-flex;gap:3px;background:var(--surface-2);border-radius:10px;padding:3px}
.ut-days button{border:0;background:transparent;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink-2);padding:7px 13px;border-radius:8px;cursor:pointer;transition:background .15s}
.ut-days button.on{background:var(--surface);color:var(--ink);box-shadow:var(--sh-1)}
.ut-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:10px;margin-bottom:18px}
.ut-tile{background:var(--surface);border-radius:14px;box-shadow:var(--sh-1);padding:12px 15px;min-width:0}
.ut-tile .l{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);margin-bottom:5px}
.ut-tile .v{font-size:17px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ut-grid{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:760px){.ut-grid{grid-template-columns:repeat(2,1fr)}}
.ut-users{display:grid;gap:10px;grid-template-columns:1fr;margin-bottom:16px}
@media(min-width:760px){.ut-users{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}
.ut-user{background:var(--surface);border-radius:14px;box-shadow:var(--sh-1);padding:13px 15px;min-width:0}
.ut-user.idle{opacity:.62}
.ut-u-head{display:flex;align-items:center;gap:10px;min-width:0}
.ut-ava{width:34px;height:34px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-size:12.5px;font-weight:700;display:grid;place-items:center;flex:none}
.ut-u-nm{min-width:0;flex:1}
.ut-u-nm b{display:block;font-size:14px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ut-u-nm span{font-size:11.5px;color:var(--ink-2)}
.ut-u-min{font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap}
.ut-u-meta{font-size:12px;color:var(--ink-2);margin-top:8px;line-height:1.45}
.ut-u-meta b{color:var(--ink)}
.ut-u-meta b.ut-bad{color:var(--danger)}
.ut-u-scr{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.ut-chip{font-size:11.5px;font-weight:500;color:var(--ink-2);background:var(--surface-2);border-radius:999px;padding:3px 9px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.ut-idle-h{font-size:12px;font-weight:600;color:var(--ink-2);margin:4px 0 8px}
.ut-errs{display:flex;flex-direction:column;gap:9px;max-height:420px;overflow:auto}
.ut-err{background:var(--surface-2);border-left:3px solid var(--danger);border-radius:9px;padding:9px 11px;min-width:0}
.ut-err-top{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--ink-2)}
.ut-err-top b{color:var(--ink);font-size:12.5px}
.ut-err-at{margin-left:auto;white-space:nowrap}
.ut-err-txt{font-size:12.5px;color:var(--ink);margin-top:4px;line-height:1.4;word-break:break-word}
.ut-ok{padding:22px 8px;text-align:center;color:var(--ink-2);font-size:13.5px}
/* ═════════════ ДОКУМЕНТЫ: вложения в карточке задачи + админ-раздел (аддитивно) ═════════════ */
.doclist{display:flex;flex-direction:column;gap:8px;margin-top:2px}
/* Строка документа в карточке — целиком ссылка: цель на всю ширину, высота 60 px
   (44 миниатюра + 8+8 отступы), по центру. Раньше строка была прижата вверх, потому
   что под именем печаталась ИИ-подпись в несколько строк; подписи больше нет. */
.doc-row{display:flex;gap:9px;align-items:center;background:var(--surface-2);border-radius:11px;
  padding:8px 10px;min-width:0;text-decoration:none;color:var(--ink);transition:background .18s var(--ease)}
a.doc-row:hover{background:var(--accent-soft)}
a.doc-row:hover .doc-name{color:var(--accent)}
/* МИНИАТЮРА в списке документов — 44 px. Плитка вложения в чате ровно вдвое
   меньше (22 px, .cmt-file .cf-th в card.css); это соотношение просил владелец. */
.doc-th{flex:none;position:relative;width:44px;height:44px;border-radius:9px;overflow:hidden;
  background:var(--surface);color:var(--accent)}
/* ЗНАЧОК ТИПА ЛЕЖИТ ПОД КАРТИНКОЙ ВСЕГДА, а не вместо неё (перебиваем .pfig .pf-ic
   из card.css тремя классами). Это плата за loading="lazy": пока свёрнутый блок не
   раскрыли, картинки нет — и в квадрате виден значок, а не пустота. Загрузилась —
   накрыла собой; фон у картинки непрозрачный, чтобы значок не просвечивал сквозь
   png с прозрачностью. */
.doc-row .doc-th .pf-ic{display:grid;position:absolute;inset:0;width:44px;height:44px;place-items:center}
.doc-th img{position:relative;z-index:1;width:44px;height:44px;object-fit:cover;display:block;background:var(--surface)}
.doc-th .pf-ic svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
.doc-when{font-size:11px;color:var(--ink-2);margin-top:2px}
.doc-pf{flex:none;display:grid;place-items:center;width:22px;height:22px;color:var(--accent)}
.doc-pf svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
/* ⚠️ svg только с ЯВНЫМ размером (и в атрибутах, и тут) — иначе «иконки-кляксы» */
.doc-ic{flex:none;width:28px;height:28px;border-radius:8px;background:var(--surface);display:grid;place-items:center;color:var(--accent)}
.doc-ic svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
.doc-main{flex:1;min-width:0}
.doc-name{font-size:13px;font-weight:600;color:var(--ink);text-decoration:none;word-break:break-word}
.doc-name:hover{color:var(--accent);text-decoration:underline}
.doc-ai{font-size:12px;color:var(--ink-2);margin-top:2px;line-height:1.4;word-break:break-word}
.doc-meta{font-size:11px;color:var(--ink-2);margin-top:3px;display:flex;flex-wrap:wrap;gap:2px 10px}
.doc-cat{flex:none;display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:var(--ink-2);background:var(--surface);border-radius:999px;padding:3px 9px;white-space:nowrap}
.doc-cat i{width:7px;height:7px;border-radius:50%;flex:none;font-style:normal}
.doc-upl-row{display:flex;align-items:center;gap:10px;margin-top:9px}
.doc-upl-row .btn input{display:none}
.doc-upl-st{font-size:12px;color:var(--ink-2)}
/* админ-раздел «Документы» */
.dq-head{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.dq-search{flex:1;min-width:220px}
.dq-search input{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:9px 12px;font:inherit;font-size:13.5px;color:var(--ink)}
.dq-search input:focus{outline:none;border-color:var(--accent)}
.dq-list{display:flex;flex-direction:column;gap:9px}
.dq-row{display:flex;gap:11px;align-items:flex-start;background:var(--surface);border-radius:13px;box-shadow:var(--sh-1);padding:11px 13px;min-width:0}
.dq-side{display:flex;flex-direction:column;gap:6px;align-items:flex-end;flex:none;max-width:240px}
.dq-task{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--accent);background:var(--accent-soft);border:0;border-radius:999px;padding:4px 10px;cursor:pointer;font-family:inherit;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dq-task svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
.dq-tg{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--ink-2);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:4px 10px;cursor:pointer;font-family:inherit;white-space:nowrap}
.dq-tg:hover{color:var(--accent);border-color:var(--accent)}
.dq-tg svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;flex:none}

/* документы: уровень 1 — плитки проектов (та же сетка, что у архива, ap→dp:
   390 — одна колонка, 640 — две, 980 — три; в столбик во всю ширину не
   выкладывать, эту ошибку уже делали) */
.doc-projs{display:grid;grid-template-columns:1fr;gap:10px;margin:0 0 6px}
@media(min-width:640px){.doc-projs{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.doc-projs{grid-template-columns:repeat(3,1fr)}}
.doc-proj{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--sh-2);
  padding:16px;text-align:left;display:flex;flex-direction:column;gap:2px;min-height:44px;
  transition:transform .16s var(--ease),box-shadow .16s var(--ease)}
.doc-proj:hover{transform:translateY(-2px);box-shadow:var(--sh-3)}
.doc-proj:active{transform:translateY(0)}
.doc-proj .dp-t{font-size:14.5px;font-weight:600;color:var(--ink);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.doc-proj .dp-n{font-size:24px;font-weight:600;line-height:1.25;color:var(--ink);margin-top:6px;
  font-variant-numeric:tabular-nums}
.doc-proj .dp-l{font-size:12px;color:var(--ink-2)}
.doc-proj .dp-s{font-size:11.5px;color:var(--ink-2);margin-top:6px}
.doc-mat-note{font-size:12px;color:var(--ink-2);margin:10px 2px 0}

/* документы: уровень 2 — чипы вида внутри проекта, тач-цель 44px по высоте кнопки */
.dq-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.dq-chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;
  color:var(--ink-2);background:var(--surface);border:0;border-radius:999px;padding:9px 14px;
  min-height:44px;cursor:pointer;font-family:inherit;box-shadow:var(--sh-1);
  transition:background .16s var(--ease),color .16s var(--ease)}
.dq-chip i{width:8px;height:8px;border-radius:50%;flex:none;font-style:normal}
.dq-chip.on{background:var(--accent-soft);color:var(--ink)}
.dq-found{font-size:12px;color:var(--ink-2);margin:0 0 10px}

/* ═══ Документы: файловая система (проект ▸ вид ▸ файлы) ═══
   Одна строка на папку и на файл — иконка · имя · мета: глаз не переучивается
   на каждом уровне, а разница читается иконкой и весом имени. Тач-цель 48px,
   действия иконками справа (подписи в title/aria-label — три подписи словами
   в строке это уже панель инструментов, а не минимализм). */
.fs-kroshki{display:flex;flex-wrap:wrap;align-items:center;gap:1px;margin:0 0 12px}
.fs-kr{border:0;background:none;font:inherit;font-family:inherit;font-size:13px;color:var(--ink-2);cursor:pointer;padding:6px 8px;border-radius:8px}
.fs-kr:hover{color:var(--accent);background:var(--accent-soft)}
.fs-kr.here{color:var(--ink);font-weight:600;cursor:default}
.fs-kr.here:hover{background:none;color:var(--ink)}
.fs-kr-sep{display:inline-flex;align-items:center;color:var(--ink-2);opacity:.5}
.fs-kr-sep svg{stroke:currentColor;fill:none;stroke-width:2}

.fs-panel{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 14px}
.fs-up{flex:none;width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line);background:var(--surface);border-radius:10px;cursor:pointer;color:var(--ink-2)}
.fs-up:hover{color:var(--accent);border-color:var(--accent)}
.fs-up svg{stroke:currentColor;fill:none;stroke-width:2}
.fs-search{flex:1;min-width:190px}
.fs-search input{width:100%;height:44px;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:0 12px;font:inherit;font-size:13.5px;color:var(--ink)}
.fs-search input:focus{outline:none;border-color:var(--accent)}
.fs-sort{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface);flex:none}
.fs-sort button{border:0;background:none;font:inherit;font-family:inherit;font-size:12.5px;color:var(--ink-2);padding:0 12px;height:44px;cursor:pointer}
.fs-sort button+button{border-left:1px solid var(--line)}
.fs-sort button.on{background:var(--accent-soft);color:var(--ink);font-weight:600}

/* Папки — плиткой, не строкой (задание, п.1): та же пара «значок · имя»,
   но в сетке auto-fill, поэтому число колонок не фиксировано числом, а
   считается шириной экрана — на 390px выходит два столбца. */
.fs-papki{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:0 0 6px}
.fs-tile{display:flex;flex-direction:column;align-items:center;gap:5px;width:100%;min-height:88px;padding:14px 8px;background:var(--surface);border:0;border-radius:11px;box-shadow:var(--sh-1);text-align:center;font:inherit;font-family:inherit;color:var(--ink);cursor:pointer;transition:background .12s}
.fs-tile:hover{background:var(--accent-soft)}
.fs-tile:hover .fs-tile-name{color:var(--accent)}
.fs-tile-ic{color:var(--accent);display:inline-flex}
.fs-tile-ic svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.6}
.fs-tile-name{max-width:100%;font-size:12.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-tile-meta{font-size:10.5px;color:var(--ink-2)}

/* Переключатель «список ⇄ значки» + ступени размера — только на дне */
.fs-vidpanel{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 14px}
.fs-vid-sw,.fs-rz-sw{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface);flex:none}
.fs-vid-sw button,.fs-rz-sw button{border:0;background:none;font:inherit;font-family:inherit;font-size:12.5px;color:var(--ink-2);padding:0 14px;height:44px;cursor:pointer}
.fs-vid-sw button+button,.fs-rz-sw button+button{border-left:1px solid var(--line)}
.fs-vid-sw button.on,.fs-rz-sw button.on{background:var(--accent-soft);color:var(--ink);font-weight:600}

/* Значки файлов — три ступени (rz-s/rz-m/rz-l) меняют и сетку, и иконку.
   Предпросмотр картинкой — только rz-l (img тогда лежит внутри .fs-zn-ic),
   на s/m всегда минималистичный значок из docIconSvg. */
.fs-znachki{display:grid;gap:8px;margin:0 0 6px}
.fs-znachki.rz-s{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}
.fs-znachki.rz-m{grid-template-columns:repeat(auto-fill,minmax(118px,1fr))}
.fs-znachki.rz-l{grid-template-columns:repeat(auto-fill,minmax(168px,1fr))}
.fs-zn{display:flex;flex-direction:column}
.fs-zn-tile{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;min-height:44px;padding:10px 6px;background:var(--surface);border:0;border-radius:11px;box-shadow:var(--sh-1);font:inherit;font-family:inherit;color:var(--ink);cursor:pointer}
.fs-zn.on .fs-zn-tile{box-shadow:var(--sh-2);border-bottom-left-radius:0;border-bottom-right-radius:0}
.fs-zn-ic{display:flex;align-items:center;justify-content:center;width:100%;color:var(--ink-2);overflow:hidden;border-radius:8px}
.fs-zn-ic svg{stroke:currentColor;fill:none;stroke-width:1.6;flex:none}
.fs-znachki.rz-s .fs-zn-ic svg{width:20px;height:20px}
.fs-znachki.rz-m .fs-zn-ic svg{width:28px;height:28px}
.fs-znachki.rz-l .fs-zn-ic svg{width:38px;height:38px}
.fs-znachki.rz-l .fs-zn-ic{aspect-ratio:1}
.fs-znachki.rz-l .fs-zn-ic img{width:100%;height:100%;object-fit:cover;border-radius:8px}
.fs-zn-name{max-width:100%;font-size:11.5px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-zn-act{display:flex;flex-wrap:wrap;align-items:center;gap:2px;background:var(--surface);border-radius:0 0 11px 11px;box-shadow:var(--sh-2);padding:4px 6px 6px;margin:-6px 0 0}

.fs-list{display:flex;flex-direction:column;gap:6px}
.fs-row{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:8px 12px;background:var(--surface);border:0;border-radius:11px;box-shadow:var(--sh-1);text-align:left;font:inherit;font-family:inherit;color:var(--ink);min-width:0}
.fs-papka{cursor:pointer;transition:background .12s}
.fs-papka:hover{background:var(--accent-soft)}
.fs-papka:hover .fs-name{color:var(--accent)}
.fs-ic{flex:none;display:inline-flex;color:var(--ink-2)}
.fs-ic svg{stroke:currentColor;fill:none;stroke-width:1.8}
.fs-papka .fs-ic{color:var(--accent)}
.fs-open{display:flex;align-items:center;gap:10px;flex:1;min-width:0;text-decoration:none;color:inherit}
.fs-open:hover .fs-name{color:var(--accent)}
.fs-name{flex:1;min-width:0;font-size:14px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-papka .fs-name{font-weight:600}
.fs-meta{flex:none;font-size:11.5px;color:var(--ink-2);white-space:nowrap}
.fs-go{flex:none;display:inline-flex;align-items:center;color:var(--ink-2);opacity:.6}
.fs-go svg{stroke:currentColor;fill:none;stroke-width:2}
.fs-tag{flex:none;display:inline-flex;align-items:center;gap:5px;max-width:150px;font-size:11.5px;font-weight:600;font-family:inherit;color:var(--accent);background:var(--accent-soft);border:0;border-radius:999px;padding:4px 9px;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-tag svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
/* действия видны всегда, а не по наведению: на телефоне наведения нет */
.fs-act{flex:none;display:flex;align-items:center;gap:2px}
.fs-b{width:36px;height:36px;display:grid;place-items:center;border:0;background:none;border-radius:9px;color:var(--ink-2);cursor:pointer;text-decoration:none}
.fs-b:hover{color:var(--accent);background:var(--accent-soft)}
.fs-b svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.fs-fayl.on{box-shadow:var(--sh-2);border-bottom-left-radius:0;border-bottom-right-radius:0}

/* полка выбора карточки — под самим файлом, не модалкой поверх списка:
   на 390px модалка теряет контекст «какой файл кладу» */
.fs-pick{background:var(--surface);border-radius:0 0 11px 11px;box-shadow:var(--sh-2);padding:10px 12px 12px;margin:-6px 0 0}
.fs-pick-q{width:100%;height:40px;border:1px solid var(--line);border-radius:9px;background:var(--card);padding:0 11px;font:inherit;font-size:13px;color:var(--ink)}
.fs-pick-q:focus{outline:none;border-color:var(--accent)}
.fs-pick-l{display:flex;flex-direction:column;gap:2px;margin-top:8px}
.fs-pick-r{display:flex;align-items:center;gap:8px;min-height:40px;padding:6px 9px;border:0;background:none;border-radius:8px;font:inherit;font-family:inherit;font-size:13px;color:var(--ink);text-align:left;cursor:pointer}
.fs-pick-r:hover{background:var(--accent-soft);color:var(--accent)}
.fs-pick-r svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;flex:none;color:var(--ink-2)}
.fs-pick-r span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-pick-net{font-size:12.5px;color:var(--ink-2);margin:8px 2px 2px}

/* находка поиска несёт свой путь: «нашлось 12» без места лежания бесполезно */
.fs-nayd{display:flex;flex-direction:column;gap:2px}
.fs-put{font-size:11px;color:var(--ink-2);padding:0 4px}
@media(max-width:520px){
  .fs-meta{display:none}
  .fs-tag{max-width:92px}
}

/* ─────────── ОТКУДА ОТКРЫЛ КАРТОЧКУ (владелец 10.08) ───────────
   «Задача, которую открываем, должна как-то выделяться — чтобы, когда закрыл,
   взгляд возвращался, а не искал снова, где ты остановился. Везде так должно
   быть». Метка ставится на сам якорь data-tanchor в render(), поэтому работает
   на ВСЕХ экранах сразу (правила живут в конце каскада — иначе их перебивают стили ленты и доски): доска, лента «Моё», списки, штаб, поиск, таймлайн.
   Два состояния: открыта сейчас (ярко) и «только что смотрел» (тише, но видно).
   Канал не спорит со статусом: статус — заливка карточки, это — корешок слева
   и подложка, поверх (§1 «терракота/акцент добавляется, а не заменяет»). */
[data-tanchor].tanchor-open.tanchor-open,
[data-tanchor].tanchor-was.tanchor-was,
[data-tanchor].tanchor-open.tanchor-open:hover,
[data-tanchor].tanchor-was.tanchor-was:hover{
  /* Владелец 10.08: «если выбрал какую-то задачу — она обводится жёлтым, как
     сейчас сделано когда вернули на доработку». Значит выбранная = ЖЁЛТАЯ
     ОБВОДКА по кругу (а не корешок сбоку: корешок отдан возврату, терракотой,
     см. board.css .tcard.returned). Одна метка на два состояния: карточка
     открыта и карточка закрыта, но всё ещё выбрана — держится до выбора другой.
     :hover в том же правиле — иначе наведение перебивало метку своей тенью. */
  position:relative;
  box-shadow:0 0 0 2px var(--st-review) inset, var(--sh-2);
  border-radius:var(--r2)}

/* ═════════════════ СОБРАНИЕ · дом frontend/js2/razdely/sobranie ═════════════════
   ТЗ §2.3, макет frontend/mockups/sobranie.html. Правила стоят В КОНЦЕ файла
   намеренно: screens.css грузится последним, и здешние правила перебивают чужие
   — в частности одну строку липкой полосы «Моего» (кнопка входа .mfsobrb).
   Ни одного хекса: тёмная тема перекрашивает переменные (СТИЛЬ §1).
   Размеры svg заданы и в атрибутах разметки, и здесь — без этого Safari
   растягивает значок на весь экран (СТИЛЬ §4, ломалось дважды). */

/* вход из «Моего»: кнопка живёт в липкой полосе рядом с «Записками».
   margin-left:auto отдан ПЕРВОЙ из пары, иначе браузер делит свободное место
   между обеими и они расползаются по полосе. */
.moyo .mfsobrb{margin-left:auto}
.moyo .mfsobrb + .mfnotesb{margin-left:0}

/* ДВИЖЕНИЕ ПО СОБРАНИЮ, а не готовность работ: пункт N из M. Процента
   готовности на экране нет и быть не может — его нельзя проверить. */
.sbr-prog{height:3px;background:var(--line-2);border-radius:2px;margin:0 0 14px;overflow:hidden}
.sbr-prog i{display:block;height:3px;background:var(--accent);border-radius:2px;
  transition:width .35s var(--ease)}

/* Раскладка: повестка слева, пункт справа. Ниже 1100 повестка прячется и
   раскрывается кнопкой — двумя колонками на телефоне читать нечего. */
.sbr-shell{display:grid;grid-template-columns:1fr;gap:16px;min-width:0}
.sbr-stage{min-width:0}
.sbr-rail{display:none;min-width:0}
.sbr-rail.open{display:block}
@media(min-width:1100px){
  .sbr-shell{grid-template-columns:300px minmax(0,1fr);gap:22px}
  .sbr-rail{display:block;align-self:start}
  /* повестка стоит слева целиком — кнопка, открывающая её, лишняя */
  .sbr-railbtn{display:none}
}

/* ═══ ПОВЕСТКА ═══ раскрыт только текущий проект: тридцать строк сразу — стена,
   а собрание ведут глазами, а не поиском по списку. */
.sbr-grp{margin-bottom:14px;min-width:0}
.sbr-grph{padding:6px 10px 8px;min-width:0}
.sbr-grph b{display:block;font-size:13px;font-weight:600;letter-spacing:.02em;overflow-wrap:anywhere}
.sbr-grph span{display:block;font-size:11.5px;color:var(--ink-3);margin-top:1px;overflow-wrap:anywhere}
.sbr-grph-sub{padding-top:12px}
.sbr-item{display:flex;align-items:flex-start;gap:9px;width:100%;min-height:44px;padding:9px 10px;
  border-radius:var(--r2);text-align:left;min-width:0;transition:background .18s var(--ease)}
button.sbr-item:hover{background:var(--accent-ghost)}
.sbr-mark{flex:none;width:22px;height:22px;margin-top:1px;border-radius:50%;display:flex;
  align-items:center;justify-content:center;background:var(--surface-2);color:var(--ink-2)}
.sbr-mark svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round;flex:none}
.sbr-itx{flex:1;min-width:0}
.sbr-it{display:block;font-size:13.5px;overflow-wrap:anywhere}
.sbr-in{display:block;font-size:11.5px;color:var(--ink-2);margin-top:2px;overflow-wrap:anywhere}
.sbr-item.on{background:var(--accent-soft)}
.sbr-item.on .sbr-it{font-weight:600;color:var(--accent)}
.sbr-item.on .sbr-mark{background:var(--accent);color:var(--on-accent)}
.sbr-skip{cursor:default}
.sbr-skip .sbr-it{color:var(--ink-2)}
/* заливка отметки = что решили; цвет считает платформа, человек его не ставит */
.sbr-item.reshil .sbr-mark{background:var(--st-done-bg);color:var(--st-done)}
.sbr-item.poruchil .sbr-mark{background:var(--st-prog-bg);color:var(--st-prog)}
.sbr-item.pozzhe .sbr-mark{background:var(--st-review-bg);color:var(--st-review)}
.sbr-foot{margin:8px 10px 0;padding:12px;background:var(--surface);border-radius:var(--r3);
  font-size:12px;color:var(--ink-2);overflow-wrap:anywhere}

/* ═══ ПУНКТ ПОВЕСТКИ — крупная карточка, один пункт на экране ═══ */
.sbr-card{background:var(--card);border-radius:var(--r-card);box-shadow:var(--sh-2);
  padding:18px 16px;max-width:820px;min-width:0}
@media(min-width:760px){.sbr-card{padding:26px 28px}}
.sbr-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.sbr-proj{font-size:12.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ink-2);overflow-wrap:anywhere;min-width:0}
.sbr-pos{font-size:12px;color:var(--ink-3);margin-left:auto;flex:none}
.sbr-head{display:flex;align-items:flex-start;gap:12px;margin-top:14px;min-width:0}
.sbr-ci{flex:none;width:38px;height:38px;border-radius:var(--r2);display:flex;align-items:center;
  justify-content:center;background:var(--surface);color:var(--ink-2)}
.sbr-ci svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round;flex:none}
.sbr-ci.alarm{background:var(--alarm-bg);color:var(--alarm)}
.sbr-ci.wait{background:var(--st-review-bg);color:var(--st-review)}
.sbr-ci.stop{background:var(--st-new-bg);color:var(--st-new)}
.sbr-ci.who{background:var(--accent-soft);color:var(--accent)}
.sbr-ttl{margin:0;font-size:21px;font-weight:600;letter-spacing:-.02em;line-height:1.22;
  min-width:0;overflow-wrap:anywhere}
@media(min-width:760px){.sbr-ttl{font-size:27px}}
/* вопрос — целое предложение, ему хватает меньшего кегля, чем заголовку в два слова */
.sbr-ttl.vopros{font-size:18px;line-height:1.3}
@media(min-width:760px){.sbr-ttl.vopros{font-size:22px}}
.sbr-sub{margin:12px 0 0;font-size:15px;color:var(--ink-2);max-width:62ch;overflow-wrap:anywhere}
.sbr-gap{margin:16px 0 0;padding:0 2px 4px;font-size:11.5px;font-weight:600;color:var(--ink-2);
  letter-spacing:.04em;text-transform:uppercase;overflow-wrap:anywhere}

/* строка задачи внутри пункта: фамилия и дата обязательны */
.sbr-lines{margin-top:14px;display:flex;flex-direction:column;gap:2px;min-width:0}
.sbr-line{display:flex;align-items:flex-start;gap:11px;width:100%;min-height:52px;padding:10px;
  border-radius:var(--r2);text-align:left;min-width:0;transition:background .18s var(--ease)}
button.sbr-line:hover{background:var(--accent-ghost)}
.sbr-line + .sbr-line{box-shadow:inset 0 1px 0 var(--line-2)}
.sbr-line-flat{cursor:default}
.sbr-lm{flex:none;color:var(--ink-2);margin-top:3px}
.sbr-lm svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round;flex:none}
.sbr-lm.alarm{color:var(--alarm)}
.sbr-lm.wait{color:var(--st-review)}
.sbr-lt{flex:1;min-width:0}
.sbr-lt b{display:block;font-size:15px;font-weight:500;line-height:1.3;overflow-wrap:anywhere}
.sbr-lt > span{display:block;font-size:12.5px;color:var(--ink-2);margin-top:3px;overflow-wrap:anywhere}
/* фамилия — ЧАСТЬ строки, а не своя строка: правило выше делает блочным ЛЮБОЙ
   span внутри .sbr-lt, и имя уезжало бы под текст. Возвращаем в поток. */
.sbr-lt > span .sbr-nm,.sbr-lt > span .sbr-no{display:inline;font-weight:600;margin-top:0}
.sbr-nm{color:var(--ink)}
.sbr-no{color:var(--alarm)}
.sbr-ld{flex:none;font-size:12.5px;color:var(--ink-2);font-variant-numeric:tabular-nums;padding-top:4px}
.sbr-ld.hot{color:var(--alarm);font-weight:600}
.sbr-lc{flex:none;color:var(--accent);opacity:.5;margin-top:4px}
.sbr-lc svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round;flex:none}
button.sbr-line:hover .sbr-lc{opacity:1}
.sbr-more{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 10px;font-size:13.5px;
  font-weight:600;color:var(--accent);border-radius:var(--r2);text-align:left}
.sbr-more:hover{background:var(--accent-ghost)}
.sbr-more svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round;flex:none}

/* число-отклонение: крупная цифра, которая ОТКРЫВАЕТ свой список (ТЗ §2.2) */
.sbr-nums{margin-top:14px;display:flex;flex-wrap:wrap;gap:10px}
.sbr-num{display:flex;align-items:center;gap:11px;min-height:60px;padding:10px 14px;flex:1 1 200px;
  min-width:0;background:var(--surface);border-radius:var(--r2);box-shadow:var(--sh-1);text-align:left;
  transition:background .2s var(--ease),box-shadow .2s var(--ease)}
.sbr-num:hover{background:var(--accent-ghost);box-shadow:var(--sh-2)}
.sbr-num b{font-size:26px;font-weight:600;line-height:1;flex:none}
.sbr-num.hot b{color:var(--alarm)}
.sbr-num span{font-size:12.5px;color:var(--ink-2);flex:1;min-width:0;overflow-wrap:anywhere}
.sbr-num svg{width:16px;height:16px;flex:none;color:var(--accent);opacity:.6;stroke:currentColor;
  fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* честная оговорка — платформа говорит, чего она НЕ знает */
.sbr-note{margin-top:14px;display:flex;gap:10px;align-items:flex-start;padding:12px 13px;
  background:var(--surface);border-radius:var(--r2);font-size:13.5px;color:var(--ink-2);min-width:0}
.sbr-note svg{width:16px;height:16px;flex:none;color:var(--ink-2);margin-top:2px;stroke:currentColor;
  fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sbr-note > div{min-width:0;overflow-wrap:anywhere}
.sbr-note b{color:var(--ink);font-weight:600}

/* назначение управляющего прямо в пункте (ТЗ §3.1: заводит команда с экрана) */
.sbr-assign{margin-top:14px;padding:14px;background:var(--surface);border-radius:var(--r3);min-width:0}
.sbr-al{font-size:13px;font-weight:600;margin-bottom:10px;overflow-wrap:anywhere}
.sbr-assign .field{margin-bottom:10px}
.sbr-aline{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.sbr-why{margin:10px 0 0;font-size:12.5px;color:var(--ink-2);overflow-wrap:anywhere}
.sbr-answer{margin-top:14px;min-width:0}
.sbr-answer textarea{min-height:70px}

/* три действия. Ряд кнопок берётся из библиотеки кусков (uiRyadKnopok) и
   приходит в обёртке .df — у неё рамка и отступы окна, внутри карточки лишние. */
.sbr-acts{margin-top:20px}
.sbr-card .df{padding:0;border-top:0}
.sbr-acts .btn{flex:1 1 165px;min-width:0}
/* ⚠️ ТАЧ-ЦЕЛЬ 44 (СТИЛЬ §3). Базовая .btn платформы ростом 42 px, и сторож
   вёрстки честно ловит её как мелкую цель. Правим у себя, а не в общей кнопке:
   смена высоты всех кнопок платформы — отдельная работа со своей приёмкой. */
.sbr-acts .btn,.sbr-aline .btn,.sbr-nav .btn,.sbr-res .btn,.sbr-card .empty .btn{
  min-height:44px;height:auto}

/* уже записанное решение по пункту — всегда с отменой (СТИЛЬ §7) */
.sbr-res{margin-top:14px;display:flex;align-items:flex-start;gap:10px;padding:12px 13px;
  border-radius:var(--r2);background:var(--st-done-bg);color:var(--ink);font-size:13.5px;min-width:0}
.sbr-res.poruchil{background:var(--st-prog-bg)}
.sbr-res.pozzhe{background:var(--st-review-bg)}
.sbr-res svg{width:17px;height:17px;flex:none;margin-top:2px;stroke:currentColor;fill:none;
  stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sbr-res > div{min-width:0;overflow-wrap:anywhere}
.sbr-res .btn{margin-top:8px}

/* нижняя строка перехода */
.sbr-nav{margin-top:16px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;max-width:820px}
.sbr-hint{font-size:12px;color:var(--ink-2);margin-left:auto;min-width:0;overflow-wrap:anywhere}
/* подсказка про стрелки — только там, где есть клавиатура */
@media(max-width:1023px){.sbr-hint{display:none}}

/* ═══ ИТОГ СОБРАНИЯ ═══ */
.sbr-tally{margin-top:16px;display:flex;flex-wrap:wrap;gap:10px}
.sbr-t{flex:1 1 140px;min-width:0;padding:14px;border-radius:var(--r2);background:var(--surface)}
.sbr-t b{display:block;font-size:28px;font-weight:600;line-height:1}
.sbr-t span{display:block;font-size:12.5px;color:var(--ink-2);margin-top:6px;overflow-wrap:anywhere}
.sbr-t.done b{color:var(--st-done)}
.sbr-t.given b{color:var(--st-prog)}
.sbr-t.later b{color:var(--st-review)}
.sbr-none{margin-top:14px;padding:16px;background:var(--surface);border-radius:var(--r3);
  font-size:14px;color:var(--ink-2);overflow-wrap:anywhere}

/* кнопка «Повторить» в пустом состоянии — по центру, как у emptyState платформы */
.sbr-center{margin:0 auto}

/* ═══ P5 Meeting Assistant: повестка из фактов, снимок, разбор итогов ═══ */
/* колонка карточек экрана: разделы повестки идут одна под другой */
.sbr-odno{display:flex;flex-direction:column;gap:14px;max-width:820px;min-width:0}
/* выбор проекта + кнопки повестки в одной карточке */
.sbr-vybor{display:flex;flex-direction:column;gap:10px;min-width:0}
.sbr-vybor .field{margin:0}
/* строка-галочка предложения из разбора. По умолчанию ВСЕ выключены — выбор
   человека, не платформы. Вся строка — тач-цель ≥44 (СТИЛЬ §3). */
.sbr-chk{display:flex;align-items:flex-start;gap:11px;width:100%;min-height:52px;
  padding:10px;border-radius:var(--r2);cursor:pointer;min-width:0;
  transition:background .18s var(--ease)}
.sbr-chk:hover{background:var(--accent-ghost)}
.sbr-chk.on{background:var(--accent-soft)}
.sbr-chk + .sbr-chk{box-shadow:inset 0 1px 0 var(--line-2)}
.sbr-chk input{flex:none;width:20px;height:20px;margin-top:2px;accent-color:var(--accent)}
/* список участников в шторке — те же строки-галочки, своя прокрутка */
.sbr-uch{display:flex;flex-direction:column;gap:2px;min-width:0}
.sbr-uch .sbr-chk{flex:none}


/* ═══════════════════════════════════════════════════════════════════════════
   ЭКРАН «КОНТРОЛЬ» — дом frontend/js2/razdely/kontrol (ТЗ 2.2)
   Управление по отклонениям: четыре вопроса, под каждым одно крупное число.
   Раскладка взята из принятого макета frontend/mockups/kontrol_v.html — там она
   замерена сторожем вёрстки (0 наложений, 0 обрезок, нет горизонтальной
   прокрутки на 390 и 1440, обе темы) и даёт весь экран в 1137 px на 1440.
   Цвета — только переменные: тёмная тема перекрашивает их, хекс её ломает (§1).
   ═══════════════════════════════════════════════════════════════════════════ */
.kn{min-width:0}
.kn-snap{font-size:12px;color:var(--ink-2);margin:-8px 0 10px}
.kn-lead{font-size:14px;color:var(--ink-2);max-width:64ch;margin:0}
.kn-hint{margin:8px 0 0;font-size:12.5px;color:var(--ink-2);display:flex;align-items:center;gap:7px}
.kn-hint .kn-chev{flex:none;color:var(--accent);opacity:1}

.kn-cards{display:grid;gap:14px;grid-template-columns:1fr;margin-top:18px}
@media(min-width:720px){.kn-cards{grid-template-columns:1fr 1fr}}
@media(min-width:1180px){.kn-cards{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* НА ТЕЛЕФОНЕ «ГДЕ НЕТ ХОЗЯИНА» ИДЁТ ПЕРВЫМ. Экран сам говорит: без хозяина
   остальные три вопроса некому задать, — а на 390 до него докручивались через
   три экрана. Порядок вопроса и порядок чтения обязаны совпадать. */
@media(max-width:719px){.kn-q-hozyain{order:-1}}

.kn-q{background:var(--card);border-radius:var(--r-card);box-shadow:var(--sh-2);
  padding:16px;display:flex;flex-direction:column;gap:11px;min-width:0}
.kn-qhead{display:flex;align-items:center;gap:9px;min-width:0}
.kn-dot{width:9px;height:9px;border-radius:50%;flex:none}
.kn-d-gorit{background:var(--alarm)}
.kn-d-stoit{background:var(--st-new)}
.kn-d-priemka{background:var(--st-review)}
.kn-d-hozyain{background:var(--accent)}
.kn-q h2{font-size:16px;font-weight:600;letter-spacing:-.01em;min-width:0;overflow-wrap:anywhere;margin:0}

/* крупное число читается как кнопка — оно и есть переход в список */
.kn-big{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:11px 13px;
  background:var(--surface);border-radius:var(--r2);box-shadow:var(--sh-1);text-align:left;
  border:none;font-family:inherit;color:inherit;cursor:pointer;
  transition:background .2s var(--ease),box-shadow .2s var(--ease)}
.kn-big:hover,.kn-big:focus-visible{background:var(--accent-ghost);box-shadow:var(--sh-2);outline:none}
.kn-big:focus-visible{box-shadow:var(--sh-2),0 0 0 2px var(--accent)}
.kn-num{font-size:32px;font-weight:600;line-height:1.05;flex:none;font-variant-numeric:tabular-nums}
.kn-big.fire .kn-num{color:var(--alarm)}
.kn-unit{font-size:12.5px;color:var(--ink-2);flex:1;min-width:0;overflow-wrap:anywhere}
.kn-arw{flex:none;color:var(--accent)}

.kn-verdict{font-size:13px;color:var(--ink-2);overflow-wrap:anywhere;margin:0}
.kn-verdict b{font-weight:600;color:var(--ink)}
.kn-rows{display:flex;flex-direction:column;gap:2px;margin:-2px 0 0;padding:0;list-style:none}
.kn-row{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:7px 9px;
  border-radius:var(--r2);text-align:left;background:none;border:none;font-family:inherit;
  color:inherit;cursor:pointer;transition:background .18s var(--ease)}
.kn-row:hover,.kn-row:focus-visible{background:var(--accent-ghost);outline:none}
.kn-row:focus-visible{box-shadow:0 0 0 2px var(--accent)}
.kn-l{flex:1;min-width:0}
.kn-who{font-size:14px;font-weight:500;display:block;overflow-wrap:anywhere}
.kn-meta{font-size:11.5px;color:var(--ink-2);display:block;overflow-wrap:anywhere}
.kn-cnt{font-size:15px;font-weight:600;flex:none;font-variant-numeric:tabular-nums;color:var(--ink)}
.kn-row.warn .kn-cnt{color:var(--alarm)}
.kn-chev{flex:none;color:var(--accent);opacity:.55}
.kn-row:hover .kn-chev{opacity:1}
.kn-sep{height:1px;background:var(--line-2);margin:2px 0}
.kn-more{font-size:12.5px;color:var(--ink-2);padding:0 9px;margin:0}
/* ТИШИНА С ПРИЧИНОЙ (§6): пустой вопрос обязан объяснить, почему он пуст */
.kn-calm{font-size:12.5px;color:var(--ink-2);background:var(--surface);border-radius:var(--r2);
  padding:10px 11px;overflow-wrap:anywhere;margin:0}
.kn-wide{width:100%}

/* «ждёт дольше двух суток» — обводка = срок (канал Б), заливка статуса не трогается */
.kn-longwait{display:flex;gap:9px;align-items:flex-start;width:100%;text-align:left;padding:10px 11px;
  min-height:48px;border-radius:var(--r2);background:var(--alarm-bg);border:none;cursor:pointer;
  font-family:inherit;color:inherit;box-shadow:inset 0 0 0 1px var(--alarm-line);
  transition:box-shadow .18s var(--ease)}
.kn-longwait:hover{box-shadow:inset 0 0 0 1px var(--alarm)}
.kn-longwait .kn-ico{flex:none;color:var(--alarm);margin-top:1px}
.kn-txt{display:block;font-size:12.5px;color:var(--ink);min-width:0;overflow-wrap:anywhere}
.kn-txt b{display:block;font-weight:600;margin-bottom:2px}
.kn-txt span{display:block;color:var(--ink-2)}

/* ── список под числом и панель назначения ── */
.kn-list,.kn-naznach{margin-top:18px;background:var(--card);border-radius:var(--r-card);
  box-shadow:var(--sh-2);padding:14px 12px 16px;min-width:0}
.kn-lhead{display:flex;align-items:flex-start;gap:12px;padding:2px 6px 10px;
  border-bottom:1px solid var(--line-2);flex-wrap:wrap}
.kn-lt{flex:1;min-width:180px}
.kn-lt h3{font-size:16px;font-weight:600;margin:0;overflow-wrap:anywhere}
.kn-lt p{font-size:12.5px;color:var(--ink-2);margin:4px 0 0;overflow-wrap:anywhere}
.kn-lnum{font-size:22px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink);flex:none}
.kn-note{font-size:12px;color:var(--ink-2);padding:9px 6px 0;margin:0;overflow-wrap:anywhere}
.kn-empty{font-size:13px;color:var(--ink-2);padding:16px 6px;margin:0}
.kn-item{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;padding:10px 8px;
  min-height:48px;border-radius:var(--r2);background:none;border:none;font-family:inherit;
  color:inherit;cursor:pointer;transition:background .18s var(--ease)}
.kn-item:hover{background:var(--accent-ghost)}
.kn-item + .kn-item{box-shadow:inset 0 1px 0 var(--line-2)}
.kn-il{flex:1;min-width:0}
.kn-it{display:block;font-size:13.5px;line-height:1.35;overflow-wrap:anywhere}
.kn-im{display:block;font-size:11.5px;color:var(--ink-2);margin-top:3px;overflow-wrap:anywhere}
.kn-im .nm{color:var(--ink-2);font-weight:600}
.kn-im .no{color:var(--alarm);font-weight:600}
.kn-id{flex:none;font-size:11.5px;color:var(--ink-2);font-variant-numeric:tabular-nums;padding-top:2px}
.kn-id.hot{color:var(--alarm);font-weight:600}

/* назначение управляющего — выбор человека ОДНИМ нажатием, без выпадающих списков */
.kn-assign{padding:10px 4px}
.kn-assign + .kn-assign{box-shadow:inset 0 1px 0 var(--line-2)}
.kn-arow{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:6px;
  border-radius:var(--r2);text-align:left;background:none;border:none;font-family:inherit;
  color:inherit;cursor:pointer;transition:background .18s var(--ease)}
.kn-arow:hover{background:var(--accent-ghost)}
.kn-chev-w{flex:none;display:inline-flex;color:var(--accent);transition:transform .2s var(--ease)}
.kn-plabel{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-2);padding:10px 6px 6px}
.kn-pick{display:flex;gap:8px;flex-wrap:wrap;padding:0 4px}
.kn-pick .kn-chip{min-height:44px;padding:0 13px;font-size:13.5px}
.kn-pick .kn-chip.on{background:var(--accent-soft);color:var(--accent);
  box-shadow:inset 0 0 0 1px var(--accent)}

/* честная оговорка: чего платформа не считает и почему */
.kn-honest{margin-top:20px;background:var(--surface);border-radius:var(--r3);padding:16px 17px}
.kn-honest h3{font-size:14px;font-weight:600;margin:0 0 10px}
.kn-honest ul{list-style:none;padding:0;margin:0}
.kn-honest li{display:flex;gap:9px;font-size:13px;color:var(--ink-2);padding:5px 0;overflow-wrap:anywhere}
.kn-honest li span.k{flex:none;color:var(--ink-2)}
.kn-honest li b{color:var(--ink);font-weight:600}
/* строчное действие — текстовая ссылка акцентом, без рамки и заливки (§2 регламента) */
.kn-ssylka{color:var(--accent);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.kn-ssylka:hover{color:var(--accent-hover)}

/* ═════════════════ ПОДРЯДЧИКИ · дом frontend/js2/razdely/podryadchiki (P7) ═════════════════
   Справочник вендоров: список карточек-строк с раскрывом. Правила стоят В КОНЦЕ
   файла и никуда не тянутся; цвета — только var(--…), тач-цели ≥44px. */
.pod-tools{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0 0 14px}
.pod-search{flex:1 1 220px;min-width:0}
.pod-chips{display:flex;gap:8px;flex-wrap:wrap}
.pod-list{display:flex;flex-direction:column;gap:8px}
.pod-row{background:var(--card);border-radius:var(--r-card);box-shadow:var(--sh-1)}
.pod-row.open{box-shadow:var(--sh-2)}
.pod-head{display:flex;align-items:center;gap:11px;width:100%;min-height:56px;padding:8px 12px;
  background:none;border:none;font-family:inherit;color:inherit;text-align:left;cursor:pointer;
  border-radius:var(--r-card)}
.pod-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.pod-name{font-size:14.5px;font-weight:600;color:var(--ink);display:flex;align-items:center;
  gap:8px;flex-wrap:wrap;overflow-wrap:anywhere}
.pod-meta{font-size:12.5px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pod-cnt{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-width:52px;min-height:44px;border-radius:var(--r2);color:var(--ink-2);font-size:10.5px}
.pod-cnt b{font-size:15px;color:var(--ink-2)}
.pod-cnt.on,.pod-cnt.on b{color:var(--accent)}
.pod-st{flex:none;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px}
.pod-st-rabotaet{background:var(--st-done-bg);color:var(--st-done)}
.pod-st-pauza{background:var(--st-review-bg);color:var(--st-review)}
.pod-st-chernyy{background:var(--st-new-bg);color:var(--ink-2);text-decoration:line-through}
.pod-body{padding:2px 14px 14px}
.pod-kontakty{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 10px}
.pod-lnk{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 13px;
  border-radius:var(--r2);background:var(--surface);color:var(--accent);font-size:13px;
  font-weight:600;text-decoration:none;box-shadow:var(--sh-1)}
.pod-lnk.plain{color:var(--ink-2);box-shadow:none;font-weight:500}
.pod-zametki{white-space:pre-wrap;overflow-wrap:anywhere}
.pod-tasks{display:flex;flex-direction:column;gap:4px}
.pod-task{display:flex;align-items:center;gap:9px;width:100%;min-height:44px;padding:4px 8px;
  background:none;border:none;border-radius:var(--r2);font-family:inherit;color:inherit;
  text-align:left;cursor:pointer;font-size:13.5px}
.pod-task:hover{background:var(--accent-ghost)}
.pod-task-st{flex:none;width:9px;height:9px;border-radius:50%;background:var(--st-new)}
.pod-task-st.st-in_progress{background:var(--st-prog)}
.pod-task-st.st-on_review{background:var(--st-review)}
.pod-task-st.st-done{background:var(--st-done)}
.pod-task-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pod-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.pod-form{display:flex;flex-direction:column;gap:9px;padding-top:12px}
.pod-f{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--ink-2)}
.pod-f>span{font-weight:600;letter-spacing:.04em}
.pod-inp{min-height:44px;padding:8px 12px;border:1px solid var(--line-2);border-radius:var(--r2);
  background:var(--card);color:var(--ink);font-family:inherit;font-size:14px}
.pod-inp:focus{outline:none;border-color:var(--accent)}
textarea.pod-inp{min-height:76px;resize:vertical}

/* ── ДОСЬЕ ПОДРЯДЧИКА (карточка «Справочник подрядчиков — досье», 03.09) ──
   Правила дописаны В ХВОСТ блока .pod-*, выше не тронуто ничего.
   Ширины нигде не заданы в пикселях: всё тянется и переносится, чтобы на 390
   не появилось горизонтальной прокрутки. */
.pod-blok{margin-top:14px}
.pod-gruzim{color:var(--ink-2);font-size:13px;padding:10px 2px}
/* пусто говорит причину и действие (§6 «Стиля Прораба») */
.pod-pusto{padding:10px 12px;margin-top:4px;border-radius:var(--r2);
  background:var(--accent-ghost);color:var(--ink-2);font-size:12.5px;line-height:1.45;
  overflow-wrap:anywhere}
.pod-objem{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.pod-cif{flex:1 1 84px;min-width:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:2px;min-height:56px;padding:6px 8px;border-radius:var(--r2);
  background:var(--surface-2);text-align:center}
.pod-cif b{font-size:19px;color:var(--ink)}
.pod-cif span{font-size:11.5px;color:var(--ink-2);overflow-wrap:anywhere}
.pod-doki{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.pod-dok{display:flex;align-items:center;gap:8px;min-height:44px;padding:4px 8px;
  border-radius:var(--r2);background:var(--surface-2);font-size:13px;color:var(--ink)}
.pod-dok-n{min-width:0;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pod-dok-k{flex:none;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;
  background:var(--card);color:var(--ink-2)}
.pod-ist{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.pod-ist-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:44px;
  padding:4px 8px;border-radius:var(--r2);background:var(--surface-2);font-size:13px}
.pod-ist-c{flex:none;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px}
.pod-ist-postavlen{background:var(--st-done-bg);color:var(--st-done)}
.pod-ist-snyat{background:var(--st-new-bg);color:var(--ink-2)}
.pod-ist-t{min-width:0;flex:1 1 140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--ink)}
.pod-ist-d{flex:none;font-size:11.5px;color:var(--ink-2)}
/* карточки нет на доске — строка без кнопки, курсор не обещает нажатия */
.pod-task.plain{cursor:default;color:var(--ink-2)}
.pod-task.plain:hover{background:transparent}

/* ── «ЛЮДИ»: должность и граница «здесь только свои» ──
   Кладём сюда же, в хвост: выше по файлу чужие блоки. */
.lyudi-svoi{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;
  padding:10px 12px;border-radius:var(--r2);background:var(--accent-ghost);
  font-size:12.5px;color:var(--ink-2);line-height:1.45}
.lyudi-svoi>span{min-width:0;flex:1 1 220px;overflow-wrap:anywhere}
.ppos{flex:none;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;
  background:var(--accent-ghost);color:var(--accent);max-width:100%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* поле должности — НОВЫЙ орган управления, значит 44 (WCAG 2.2 SC 2.5.8 и §3
   «Стиля Прораба»). Соседнее .pname-inp живёт на 40 с прошлых волн — оно выше по
   файлу и не наше, трогать его этой карточкой нельзя; сказано в «Сдаче». */
.ppos-inp{margin-top:6px;min-height:44px}

/* ═════════════ § СВОДКА: ГДЕ НУЖЕН ДИРЕКТОР (.hq-…) ═════════════
   Кладём в хвост файла: выше по нему чужие зоны.
   ТРЕВОЖНЫЙ ЦВЕТ ЖИВЁТ РОВНО ЗДЕСЬ — у строк головы сводки. Их сервер отдаёт не
   больше десяти. Ниже по экрану (состояния, стройки, люди) цвета тревоги нет ни
   одного: залей их терракотой, и красное снова перестанет значить «займись
   сегодня» (EEMUA 191, ANSI/ISA-18.2). Слово состояния стоит рядом с цветом
   всегда — цвет не бывает единственным носителем смысла (WCAG 2.2, SC 1.4.1). */
.hq-need-row .edge{background:var(--alarm)}
.hq-need-row .hq-sost{flex:none;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;
  background:var(--alarm-bg);color:var(--alarm);max-width:46%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hq-need-row .m{overflow:hidden;text-overflow:ellipsis;min-width:0}
/* причина блока — ДОСЛОВНО из базы, своей строкой: в одну строку с названием она
   обрезалась бы многоточием ровно там, где начинается смысл */
.hq-prichina{padding:0 8px 8px 21px;font-size:12px;color:var(--ink-2);line-height:1.4;
  overflow-wrap:anywhere}
/* пустое место говорит причину и действие (§6 «Стиля Прораба») */
.hq-pusto{display:flex;flex-direction:column;gap:3px;padding:14px 8px;line-height:1.45}
.hq-pusto b{font-size:13.5px;font-weight:600;color:var(--ink)}
.hq-pusto span{font-size:12.5px;color:var(--ink-2)}
.hq-sost-list{display:flex;flex-direction:column;gap:2px}
.hq-sost-row{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:9px}
.hq-sost-row .nm{flex:1;min-width:0;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hq-sost-row .n{flex:none;font-size:13.5px;font-weight:700;color:var(--ink)}
.hq-stroyka{padding:8px;border-radius:10px;background:var(--surface-2)}
.hq-stroyka-h{display:flex;align-items:center;gap:10px}
.hq-stroyka-h .nm{flex:1;min-width:0;font-size:13.5px;font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hq-stroyka-h .n{flex:none;font-size:13px;font-weight:700}
.hq-stroyka-m{margin-top:3px;font-size:12px;color:var(--ink-2);line-height:1.45;overflow-wrap:anywhere}
.hq-net-list{display:flex;flex-direction:column;gap:6px}
.hq-net{font-size:12.5px;color:var(--ink-2);line-height:1.45;overflow-wrap:anywhere}
.hq-chel{cursor:default}
.hq-chel:hover{background:transparent}
/* открыть свёрнутый список — ОРГАН управления, значит 44 (WCAG 2.2, SC 2.5.8) */
.hq-showall{min-height:44px}

/* ═══════════════════ § ПРОБЛЕМЫ (префикс .pb-) ═══════════════════
   Карточка «Проблемы перестают быть отдельным островом и живут карточкой задачи».
   Своих цветов нет ни одного: только переменные темы (§1 «Стиля Прораба»).
   ДВЕ ВЫСОТЫ, А НЕ ОДНА (§3): .pb-row — СТРОКА ДАННЫХ и держится плотной,
   норму касания 44 держат кнопки раздела (.pb-btn). Раздувать строки ради
   нормы касания — прямой запрет: экран растёт, а информации на нём меньше. */
.pb-chipy{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
/* чип — ЧИСЛО, А НЕ ОРГАН: он ничего не делает по нажатию, поэтому 44 к нему
   не относится и место он занимает по содержимому */
.pb-chip{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;
  background:var(--surface);color:var(--ink-2);font-size:12.5px;white-space:nowrap}
.pb-chip i{font-style:normal}
.pb-chip b{color:var(--ink);font-weight:700;font-size:13px}
.pb-list{display:flex;flex-direction:column;gap:6px}
.pb-row{padding:8px 10px;border-radius:var(--r2);background:var(--card);
  box-shadow:var(--sh-1);line-height:1.45;min-width:0}
.pb-row[onclick]{cursor:pointer}
.pb-row[onclick]:hover{background:var(--surface)}
/* «ждёт решения» отмечено И полосой, И словом рядом с названием: цвет не бывает
   единственным носителем смысла (WCAG 2.2, SC 1.4.1 «Use of Color») */
.pb-zhdet{box-shadow:var(--sh-1),inset 3px 0 0 var(--accent)}
/* ⚠️ ИМЯ .pb-h ЗАНЯТО: под ним живёт шапка коробки доказательства сдачи
   (.proofbox .pb-h в card.css, разметка в card.dokumenty.vid.js). Карточка
   просила префикс .pb-, и он остался, но шапка строки зовётся .pb-shapka —
   иначе моё безусловное flex-wrap приезжало бы в чужую коробку (БАЗА_ЗНАНИЙ,
   «Двойные имена»). */
.pb-shapka{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0}
.pb-nm{flex:1;min-width:0;font-size:13.5px;font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.pb-sost{flex:none;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;
  background:var(--surface);color:var(--ink-2);white-space:nowrap}
.pb-sost-zhdet{background:var(--accent);color:var(--on-accent)}
.pb-sost-prosr{background:var(--alarm-bg);color:var(--alarm)}
.pb-ist{flex:none;font-size:11px;color:var(--ink-2);white-space:nowrap}
.pb-pr{margin-top:2px;font-size:12px;color:var(--ink-2);overflow-wrap:anywhere}
/* поля строки: перечисление, а не таблица — поля, которого в данных нет, тут
   просто НЕТ, и колонка под него не резервируется (ISO 9241-110) */
.pb-meta{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:4px;
  font-size:12px;color:var(--ink-2);min-width:0}
.pb-p{overflow-wrap:anywhere}
.pb-p i{font-style:normal;opacity:.72}
.pb-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
/* ОРГАН УПРАВЛЕНИЯ — 44 (§3, WCAG 2.2 SC 2.5.5) */
.pb-btn{min-height:44px}
/* пустое место говорит ПРИЧИНУ и ДЕЙСТВИЕ (§6 «Стиля Прораба») */
.pb-pusto{display:flex;flex-direction:column;gap:3px;padding:14px 8px;line-height:1.45}
.pb-pusto b{font-size:13.5px;font-weight:600;color:var(--ink)}
.pb-pusto span{font-size:12.5px;color:var(--ink-2)}


/* ═════════════ СТРАНИЦА ЧЕЛОВЕКА: ШЕСТЬ ЧИСЕЛ (.chm-*) ═════════════
   Карточка «Страница человека в Аналитике: честные метрики, по которым можно
   платить». Хвостовой блок: своё имя у каждого правила, чужих не трогаем.
   § 3 «Стиля Прораба» и WCAG 2.2 SC 2.5.8 — у каждого органа 44 px.
   Объяснение под числом НЕ обрезается ни clamp-ом, ни ellipsis-ом: спрятанный
   по вертикали текст сторож §10 считает обрезкой, и правильно делает — «след
   того, как получено число» обязан быть виден целиком. */
.chm-imya{min-height:44px;padding:0 4px 0 0;border:0;background:none;font:inherit;
  font-size:14.5px;font-weight:700;color:var(--ink);text-align:left;cursor:pointer}
.chm-imya:hover{color:var(--accent)}
.chm-imya:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.chm-metr{min-height:44px;min-width:44px}
.chm-days{margin:2px 0 14px}
.chm-days button{min-height:44px;min-width:44px}
/* плитки: одна колонка на 390 — это норма, не дефект (БАЗА_ЗНАНИЙ, «сетку
   проверяли чтением CSS»); на широком экране раскладываются сами */
.chm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:8px}
.chm-plitka{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;
  min-height:44px;padding:11px 12px;border:0;border-radius:var(--r2);background:var(--surface);
  font:inherit;color:var(--ink);text-align:left;cursor:pointer;box-shadow:var(--sh-1);
  transition:background .15s,box-shadow .15s}
.chm-plitka.on{background:var(--accent-soft)}
.chm-plitka:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.chm-plitka .chm-l{font-size:11.5px;font-weight:600;color:var(--ink-2)}
.chm-chislo{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px}
.chm-v{font-size:22px;font-weight:700;line-height:1.15;color:var(--ink)}
.chm-iz{font-size:12px;color:var(--ink-2)}
.chm-pc{font-size:12.5px;font-weight:700;color:var(--accent)}
/* «без процента» — не ошибка и не пустое место, а честная оговорка: серым и
   без жира, чтобы её не читали как показатель */
.chm-pc.off{font-weight:500;color:var(--ink-2)}
.chm-plitka .chm-s{font-size:11.5px;color:var(--ink-2)}
.chm-slovo{font-size:11.5px;line-height:1.45;color:var(--ink-2);white-space:normal;
  overflow-wrap:anywhere}
.chm-open{margin-top:10px;background:var(--surface-2);border-radius:var(--r3);padding:6px 8px}
.chm-open .chm-slovo{padding:6px 8px 2px}
.chm-item{display:flex;align-items:center;gap:10px;min-height:44px;padding:5px 8px;
  border-radius:var(--r1);text-decoration:none;color:var(--ink)}
.chm-item:hover{background:var(--card)}
.chm-item .chm-it{flex:1;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chm-item .chm-in{flex:none;font-size:12px;color:var(--ink-2)}
.chm-podpis,.chm-esche{font-size:12px;color:var(--ink-2);padding:7px 8px}
.chm-pusto{font-size:13px;color:var(--ink-2);padding:9px 0}
.chm-niz{display:flex;flex-direction:column;gap:5px;margin-top:14px}
.chm-proba{font-size:12.5px;font-weight:600;color:var(--ink)}
.chm-ogovorka,.chm-std{font-size:11.5px;line-height:1.45;color:var(--ink-2)}
/* строка входа в «Моём»: одна кнопка, не панель (решение карточки) */
.chm-vhod{margin:0 0 10px}
.chm-vhod-btn{min-height:44px}
/* крошка-дверь страницы человека: слово бывает коротким («МОЁ»), а кнопка
   остаётся органом — 44 по обеим сторонам (§3, WCAG 2.2 SC 2.5.8) */
.chm-krumb{min-width:44px;min-height:44px;justify-content:center}

/* ═════════════ РАСЧЁТ ЗАРПЛАТЫ: МЕСЯЦ И СТРАНИЦА СОТРУДНИКА (.zp-*) ═════════════
   Карточка «Раздел „Расчёт зарплаты“: месяц, сотрудники, страница сотрудника с
   пересмотром и согласованием». Хвостовой блок: своё имя у каждого правила,
   чужих не трогаем. Итог рисуется ЧУЖИМИ классами .chm-plitka/.chm-grid — два
   экрана про одного человека обязаны выглядеть одинаково, а копия правил
   разъехалась бы с оригиналом на первой же правке.
   § 3 «Стиля Прораба»: ОРГАН (кнопка, поле, выбор) — 44 px; СТРОКА ДАННЫХ
   таблицы работ плотная, --h-data, и растёт только там, где в неё встал орган
   пересмотра. WCAG 2.2 SC 2.5.8. */
.zp-vkladki{margin:0 0 14px}
.zp-vkladki button{min-height:44px;min-width:44px}
/* выбор месяца: две стрелки-органа и название словом между ними */
.zp-mes{display:inline-flex;align-items:center;gap:2px;background:var(--surface-2);
  border-radius:10px;padding:3px;margin:0 0 14px}
/* в шапке списка месяца отступ снизу лишний: там его держит сама .screen-head */
.screen-head .act .zp-mes{margin:0}
.zp-mes button{min-height:44px;min-width:44px;border:0;background:transparent;font:inherit;
  font-size:15px;font-weight:700;color:var(--ink-2);border-radius:8px;cursor:pointer}
.zp-mes button:hover:not(:disabled){background:var(--surface);color:var(--ink)}
.zp-mes button:disabled{opacity:.35;cursor:default}
.zp-mes button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.zp-mes-v{min-width:126px;padding:0 10px;text-align:center;font-size:13.5px;font-weight:700;
  color:var(--ink);font-variant-numeric:tabular-nums}
/* список месяца: строка человека — ОРГАН (вход на его страницу), 44 px */
.zp-lyudi{display:flex;flex-direction:column}
.zp-chel{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;width:100%;min-height:44px;
  padding:9px 8px;border:0;border-top:1px solid var(--line);background:none;font:inherit;
  color:var(--ink);text-align:left;cursor:pointer}
.zp-lyudi .zp-chel:first-child{border-top:none}
.zp-chel:hover{background:var(--surface-2)}
.zp-chel:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.zp-chel-imya{flex:1 1 150px;min-width:0;font-size:14.5px;font-weight:700}
.zp-chel-rol{font-size:12px;font-weight:500;color:var(--ink-2)}
.zp-k{display:flex;align-items:baseline;gap:5px;font-size:12.5px;color:var(--ink-2);
  white-space:nowrap}
.zp-k b{font-size:14.5px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.zp-k.off b{font-weight:500;color:var(--ink-2)}
/* пометка «согласован» — приглушённая, не акцент: это состояние, а не действие.

   ⚠️ NOWRAP ЗДЕСЬ БЫЛ БРАКОМ (возврат судьи, третий круг). Короткие пометки
   («Согласован», «действует») от него не зависели — это одно слово, — а длинная
   пометка низа «Согласовано · дата · кто · версия N · правок больше нет» им
   растягивала ВЕСЬ ДОКУМЕНТ: на 390 содержимое 390 px в коробке 358, документ
   406 px, `hscroll: true`, и от растянутой страницы проседала нижняя навигация —
   одиннадцать кнопок по 28 px вместо 44. Ломалось на любой версии ≥ 2 и на
   полном имени («Nicky Falentino Siahaya» — 422 px) даже при версии 1.
   Перенос по словам, обрезки нет: спрятанный текст сторож §10 считает обрезкой,
   и правильно делает. */
.zp-flag{font-size:11.5px;font-weight:600;color:var(--ink-2);background:var(--surface-2);
  border-radius:var(--r1);padding:3px 8px;white-space:normal;overflow-wrap:anywhere;
  line-height:1.45}
/* ДЛИННАЯ ПОМЕТКА НИЗА собрана из кусков, и перенос идёт МЕЖДУ ними: дата и имя
   не рвутся посередине, а целиком уезжают на свою строку. Точка-разделитель
   приклеена к своему куску (::before), поэтому не остаётся сиротой в конце
   строки. Имя переносится и внутри себя: длинные имена бывают в одно слово. */
.zp-sogl{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 7px}
.zp-sogl .zp-kus{white-space:nowrap}
.zp-sogl .zp-kus.imya{white-space:normal;overflow-wrap:anywhere;min-width:0}
.zp-sogl .zp-kus:not(:first-child)::before{content:"· ";color:var(--ink-2)}
/* таблица работ: шапка и строки данных плотные */
.zp-tab{margin-top:12px}
.zp-shapka{display:flex;align-items:center;gap:8px;min-height:var(--h-data);padding:0 8px;
  font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.zp-r{border-top:1px solid var(--line);padding:5px 8px}
.zp-r:first-of-type{border-top:none}
.zp-r-verh{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;min-height:var(--h-data)}
.zp-r-t{flex:1 1 190px;min-width:0;font-size:13.5px;line-height:1.35;color:var(--ink);
  overflow-wrap:anywhere}
.zp-r-n{font-size:11.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.zp-c{font-size:12px;color:var(--ink-2);white-space:nowrap}
.zp-c b{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
/* ОБВОДКА И ЦВЕТ СРОКА — терракота (§1, канал «срок»), заливку статуса не трогаем */
.zp-c.late{color:var(--alarm);font-weight:600}
.zp-c.ok{color:var(--ink-2)}
.zp-c.vina{color:var(--ink);background:var(--surface-2);border-radius:var(--r1);padding:2px 7px}
.zp-c.snyata{color:var(--ink-2);background:var(--surface-2);border-radius:var(--r1);padding:2px 7px;
  text-decoration:line-through}
/* орган пересмотра внутри плотной строки: строка растёт ровно под него */
.zp-obs{flex:none;min-height:44px;min-width:44px;padding:0 12px;border:0;border-radius:var(--r2);
  background:var(--surface);box-shadow:var(--sh-1);font:inherit;font-size:12.5px;font-weight:600;
  color:var(--ink);cursor:pointer}
.zp-obs:hover{background:var(--surface-2)}
.zp-obs.on{background:var(--accent-soft)}
.zp-obs:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* пометка руководителя живёт рядом с расчётом навсегда — отдельной строкой,
   с автором и временем: «защищённая от манипуляций» держится на этой строке */
.zp-pom{display:flex;flex-wrap:wrap;gap:3px 8px;margin-top:4px;font-size:11.5px;
  line-height:1.45;color:var(--ink-2);overflow-wrap:anywhere}
.zp-pom b{font-weight:600;color:var(--ink)}
/* раскрыв «Обстоятельство»: три выбора одним словом и обязательное объяснение */
.zp-forma{margin-top:8px;background:var(--surface-2);border-radius:var(--r3);padding:9px 10px;
  display:flex;flex-direction:column;gap:8px}
.zp-vybor{display:flex;flex-wrap:wrap;gap:6px}
.zp-vybor button{min-height:44px;min-width:44px;padding:0 14px;border:0;border-radius:var(--r2);
  background:var(--card);box-shadow:var(--sh-1);font:inherit;font-size:13px;font-weight:600;
  color:var(--ink);cursor:pointer}
.zp-vybor button.on{background:var(--accent);color:var(--on-accent);box-shadow:var(--sh-2)}
.zp-vybor button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.zp-forma textarea{width:100%;min-height:66px;box-sizing:border-box;padding:10px 11px;border:0;
  border-radius:var(--r2);background:var(--card);box-shadow:var(--sh-1);font:inherit;
  font-size:13.5px;color:var(--ink);resize:vertical}
.zp-forma textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.zp-niz-f{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.zp-pochemu{font-size:11.5px;color:var(--ink-2)}
/* история начислений: строки ДАННЫХ (нажимать не на что) — плотные, --h-data */
.zp-versii{margin-top:4px;background:var(--surface-2);border-radius:var(--r3);padding:7px 9px}
.zp-versii-z{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ink-2);padding:2px 0 5px}
.zp-versiya{display:flex;flex-wrap:wrap;align-items:center;gap:3px 10px;
  min-height:var(--h-data);padding:3px 0;border-top:1px solid var(--line)}
/* ⚠️ ПРИЧИНА ПЕРЕОТКРЫТИЯ — ЖИВОЙ ТЕКСТ ЧЕЛОВЕКА, И ОН ПЕРЕНОСИТСЯ. Общий
   .zp-c держит nowrap (он для коротких чипов «вес 4», «в срок»), и строка
   «открыт · дата · кто · причина» вылезла за экран на 61 px при ширине 390 —
   горизонтальная прокрутка, стоп-кран §10. Здесь nowrap снимаем. */
.zp-versiya .zp-c{white-space:normal;overflow-wrap:anywhere;min-width:0}
.zp-versii .zp-versiya:first-of-type{border-top:none}
/* низ страницы: согласование и оговорки сервера */
.zp-niz{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.zp-niz-knopki{display:flex;flex-wrap:wrap;gap:8px}
.zp-niz-knopki .btn{min-height:44px}
.zp-ogovorka{font-size:11.5px;line-height:1.45;color:var(--ink-2)}
.zp-pusto{font-size:13px;color:var(--ink-2);padding:11px 0}
/* ПЛИТКА ИТОГА — НЕ КНОПКА: раскрыва у неё нет, значит и руки-курсора быть не
   должно (§7: орган без действия — брак). Всё остальное — правила .chm-plitka. */
.zp-plitka{cursor:default}
/* две двери «Моего» в одну линию. Отступ .chm-vhod снимается ТОЛЬКО внутри
   этого контейнера: правило соседней принятой карточки не трогаем. */
.zp-vhody{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.zp-vhody .chm-vhod,.zp-vhody .zp-vhod{margin:0 0 10px}
.zp-vhod{margin:0 0 10px}
.zp-vhod-btn{min-height:44px}