/* Дом №1793 «Кому отдать» — руководители сверху, команды свёрнуты, одна сетка строк (вариант А, макет ⚡-🔩-BOLT-DESIGN
   дом7я-кому-руководители). Только токены tokens.css. Окно — #bdlg (класс vk-dlg даёт ширину 560 и шторку снизу на телефоне). */

/* окно — колонка: шапка, вкладки и низ не сжимаются, список прокручивается; на ПК не выше 720 px */
/* ширина своя: #bdlg — dialog.b-dlg (board.css, 480 px) перебивал vk-dlg из app.css */
dialog.km-dlg[open]{display:flex;flex-direction:column;width:min(560px,94vw);max-height:min(720px,92vh);overflow:hidden}
@media (max-width:1023px){ dialog.km-dlg[open]{width:100vw;max-width:100vw;max-height:92vh;margin:auto 0 0;border-radius:var(--r-xl) var(--r-xl) 0 0} }
.in.km-sheet{display:flex;flex-direction:column;min-height:0;flex:1 1 auto;padding:0}
.km-sheet > *{flex:none}
.km-sheet > .km-list{flex:1 1 auto}
.km-grab{align-self:center;width:40px;height:4px;border-radius:2px;background:var(--line-2);margin-top:8px}
@media (min-width:1024px){ .km-grab{display:none} }
.km-hd{display:grid;grid-template-columns:var(--tap) 1fr var(--tap);align-items:center;padding:6px 12px 4px}
.km-hd h2{margin:0;text-align:center;font:700 17px/1.2 var(--font-body)}
.km-hd .ib{width:var(--tap);height:var(--tap);display:grid;place-items:center}

/* вкладки «В очередь / В фокус» */
.km-how{padding:6px 16px 10px;display:grid;gap:6px}
.km-tabs{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;border-radius:var(--r-pill);background:var(--sunk)}
.km-tabs button{min-height:40px;border:0;border-radius:var(--r-pill);background:none;font:600 14px var(--font-body);color:var(--fg-2);
  display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}
.km-tabs button svg{width:18px;height:18px}
.km-tabs button[aria-pressed="true"]{background:var(--surface);color:var(--fg);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.km-hint{margin:0;text-align:center;font-size:12.5px;color:var(--fg-3);min-height:18px;text-wrap:balance}

/* список: отступ 3 px — рамку выбора не срежет прокрутка; ряды не сжимаются */
.km-list{overflow-y:auto;min-height:0;padding:3px 13px 12px;display:grid;grid-auto-rows:max-content;gap:8px;align-content:start}
.km-cap{font:600 11px var(--font-body);letter-spacing:.07em;text-transform:uppercase;color:var(--fg-3);padding:8px 4px 0}

/* одна сетка для всех: [значок 40] [имя + роль] [состояние 92] [отметка 24] */
.km-lead{border:1.5px solid var(--line);border-radius:var(--r-l);background:var(--surface);overflow:hidden}
.km-lead.sel{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.km-p{width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) 92px 24px;align-items:center;gap:10px;min-height:60px;padding:8px 12px;
  border:0;background:none;color:var(--fg);text-align:left;font:inherit;cursor:pointer}
.km-lead > .km-p{min-height:68px}
.km-av{width:40px;height:40px;border-radius:var(--r-m);display:grid;place-items:center;background:var(--sunk);color:var(--fg-2);position:relative}
.km-av svg{width:20px;height:20px}
.km-lead > .km-p .km-av::after{content:"";position:absolute;right:-2px;bottom:-2px;width:12px;height:12px;border-radius:50%;background:var(--pc,var(--line-2));border:2px solid var(--surface)}
.km-nm{display:grid;gap:1px;min-width:0}
.km-nm .dir{font:700 10.5px var(--font-body);letter-spacing:.07em;text-transform:uppercase;color:var(--fg-3)}
.km-nm b{font-size:15px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.km-nm small{font-size:12.5px;color:var(--fg-3);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.km-st{justify-self:stretch;text-align:center;font:600 12px var(--font-body);padding:3px 0;border-radius:var(--r-pill);background:var(--sunk);color:var(--fg-2);white-space:nowrap}
.km-st.st-free{background:var(--ok-bg);color:var(--ok)} .km-st.st-busy,.km-st.st-perm,.km-st.st-bg{background:var(--warn-bg);color:var(--warn)}
.km-nm .sd{font-style:normal;font-weight:600} .km-nm .sd.st-free{color:var(--ok)} .km-nm .sd.st-busy,.km-nm .sd.st-perm,.km-nm .sd.st-bg{color:var(--warn)}
.km-nm .sd,.km-nm .dt{display:none}
.km-p .rd{width:20px;height:20px;box-sizing:border-box;border-radius:50%;border:2px solid var(--line-2);justify-self:center}
.km-p.sel .rd{border:6px solid var(--ink)}
.km-p.off{opacity:.5;cursor:not-allowed}
/* телефон: колонки состояния нет — оно первым словом в строке роли, полное имя влезает */
@media (max-width:430px){
  .km-p{grid-template-columns:40px minmax(0,1fr) 24px}
  .km-p > .km-st{display:none}
  .km-nm .sd,.km-nm .dt{display:inline}
}

/* «Команда · на месте N из M» — свёрнута, раскрывается */
.km-tt{width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:10px;align-items:center;min-height:var(--tap);padding:0 12px;
  border:0;border-top:1px solid var(--line);background:var(--surface-2);text-align:left;font:600 13.5px var(--font-body);color:var(--fg-2);cursor:pointer}
.km-tt.none{cursor:default}
.km-tt .ch{display:grid;place-items:center;transition:transform .2s ease}
.km-tt .ch svg{width:18px;height:18px}
.km-tt[aria-expanded="true"] .ch{transform:rotate(180deg)}
.km-tt .nb{color:var(--fg-3);font-weight:500}
.km-tt em{font:600 11.5px var(--font-mono);font-style:normal;padding:1px 7px;border-radius:9px;background:var(--sunk);color:var(--fg-3)}
.km-team{display:grid;background:var(--surface-2);padding:0 0 6px}
.km-team[hidden]{display:none}
.km-team .km-p{min-height:56px;border-top:1px solid var(--line)}
.km-team .km-p:first-child{border-top:0}
.km-team .km-p.sel{box-shadow:inset 0 0 0 2px var(--ink);border-radius:var(--r-m)}
.km-team .km-av{width:32px;height:32px;justify-self:center}
.km-team .km-av svg{width:16px;height:16px}
.km-team .km-nm b{font-size:14px}

/* «Или без исполнителя» */
.km-alt{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width:430px){ .km-alt{grid-template-columns:1fr} }
.km-ac{display:grid;grid-template-columns:32px minmax(0,1fr);gap:8px;align-items:center;min-height:60px;padding:8px 12px;border-radius:var(--r-l);
  border:1.5px solid var(--line);background:var(--surface);color:var(--fg);text-align:left;font:inherit;cursor:pointer}
.km-ac .km-av{width:32px;height:32px}
.km-ac .km-av svg{width:18px;height:18px}
.km-ac b{font-size:14px;line-height:1.25}
.km-ac small{display:block;font-size:12px;color:var(--fg-3);line-height:1.3}
.km-ac.km-think{border-style:dashed;border-color:var(--think-line)} .km-ac.km-think .km-av{color:var(--think);background:var(--think-bg)}
.km-ac[aria-pressed="true"]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}

.km-act{padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);display:grid;gap:6px}
.km-go{min-height:48px;border-radius:var(--r-pill);font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.km-go:disabled{background:var(--sunk);border-color:var(--sunk);color:var(--fg-3);cursor:default}
.km-note{text-align:center;color:var(--fg-3);font-size:12px}
@media (prefers-reduced-motion:reduce){ .km-tt .ch{transition:none} }