/* Дополнения платформы к стилям прототипа: вход, профиль, команда, режим просмотра */

/* экран входа */
body.auth .nav{display:none}
body.auth main{padding:0 16px}
.loginbox{max-width:380px;margin:12vh auto 0;padding:26px 22px 22px}
.loginbox .lbrand{font:600 17px/1.3 var(--f-display);margin:0 0 20px;color:var(--ink)}
.loginbox .primary{width:100%;margin-top:6px}
.loginbox .warn{margin:4px 0 6px}

/* блоки с внутренними отступами и подзаголовки */
.blk.pad{padding:18px 18px 16px}
.bh{margin:0 0 14px;font:500 15px/1.3 var(--f-display);color:var(--ink)}
.formgrid{display:grid;grid-template-columns:1fr;gap:0 16px}
@media (min-width:700px){.formgrid{grid-template-columns:1fr 1fr}}
.okmsg{margin:4px 0 12px;padding:10px 12px;border-radius:10px;background:var(--mint-bg);color:var(--mint-ink);font-weight:500}
.rolehint{margin:0 0 8px;color:var(--muted)}
.rolehint b{color:var(--ink);font-weight:600}

/* список команды */
.teamlist{padding:4px 0}
.member{display:grid;grid-template-columns:1fr;gap:10px;padding:14px 18px;border-top:1px solid var(--line2)}
.member:first-child{border-top:0}
.mname{font-weight:600}
.mact .ghost{margin-top:0}
@media (min-width:760px){
  .member{grid-template-columns:1.4fr 1fr auto;align-items:center}
}

/* пользователь в боковом меню */
.userbox{display:none}
@media (min-width:900px){
  .userbox{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin:18px 0 0;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--ink);text-align:left;cursor:pointer;width:100%}
  .userbox:hover{border-color:var(--mint-line)}
  .userbox .ucomp{font-weight:600;font-size:13.5px}
  .userbox .uname{font-size:12px;color:var(--muted)}
}

/* на телефоне шесть разделов внизу — чуть компактнее подписи */
@media (max-width:899px){
  .nav{padding-left:4px;padding-right:4px}
  .nav-items{min-width:0;gap:2px}
  .nav .tab{flex:1 1 0;min-width:0;font-size:10px;line-height:1.2;padding:8px 1px 7px;overflow-wrap:anywhere;hyphens:auto}
}

/* раздел только для просмотра */
.ronly{margin:0 0 14px;padding:9px 12px;border-radius:10px;background:var(--gold-bg);border:1px solid var(--gold-line);color:var(--gold-ink);font-size:13.5px}

/* ---------- таблицы аналитики и менеджеров: закрепление и компактность ---------- */
/* сетка по ширине своего содержимого — иначе закреплённый столбец «уезжает» при прокрутке вправо */
.sheet .inner.anmatrix{min-width:max-content;width:max-content}
/* таблица прокручивается внутри себя: шапка с датами и столбец названий всегда на месте */
.matrixwrap{overflow-x:auto;overflow-y:hidden}
/* закреплённая шапка большой таблицы (копия, см. pinHeads в app.js) */
.pinhead{position:fixed;top:env(safe-area-inset-top,0px);z-index:30;overflow:hidden;display:none;background:var(--a-bg);box-shadow:0 6px 14px rgba(0,0,0,.45)}
.pinhead .pingrid{display:grid;min-width:max-content;will-change:transform}
.pinhead .mcell.head,.pinhead .mcell.ghead{position:relative;top:auto}
.pinhead .mcell.sticky{position:relative;z-index:9}
.anmatrix .mcell.head{z-index:6}
.anmatrix .mcell.head.name.sticky{z-index:8}

/* сворачивание разделов */
.secfold{flex:0 0 auto;display:inline-grid;place-items:center;width:22px;height:22px;margin-right:10px;padding:0;border:1px solid currentColor;border-radius:999px;background:transparent;color:inherit;font:600 14px/1 var(--f-body);cursor:pointer;opacity:.9}
.secfold:hover{opacity:1}
.anmatrix .mcell.sect.foldable{justify-content:flex-start;cursor:pointer;user-select:none}
.gtitle.foldable{cursor:pointer}
.gtitle.folded,.mgrtitle.folded{opacity:.75;margin-bottom:6px}
.mgrname{display:flex;align-items:center;flex:1;min-width:0}

/* одна строка управления вместо трёх */
.periodbar.toolbar{flex-wrap:wrap;gap:8px;padding:8px 10px;border-radius:22px}
.toolbar .zoomgrp{display:inline-flex;align-items:center;gap:6px}
.legend.inl{display:inline-flex;margin:0 0 0 auto;padding:0 6px}

/* ---------- боковое меню: сворачивание до значков ---------- */
.navtoggle{display:none}
@media (min-width:900px){
  .navtoggle{display:block;margin-top:14px;padding:9px 12px;border:1px dashed var(--line);border-radius:12px;background:transparent;color:var(--muted);font:500 13px var(--f-body);text-align:left;cursor:pointer}
  .navtoggle:hover{color:var(--ink);border-color:var(--mint-line)}
  body.navmini .nav{width:72px;padding-left:10px;padding-right:10px}
  body.navmini .nav .brand,body.navmini .nav .userbox,body.navmini .nav .tlbl,body.navmini .nav .syncTxt{display:none}
  body.navmini .nav .tab{justify-content:center;padding:12px 0}
  body.navmini .navtoggle{text-align:center;padding:9px 0;font-size:16px}
  body.navmini .nav .sync{justify-content:center;padding:18px 0 0}
  body.navmini main{padding-left:calc(72px + 28px)}
}

.sheetpage .periodbar{margin:0 0 6px;padding:4px 6px;gap:4px;border-radius:10px}
.sheetpage .periodbar .per-btn{min-width:30px;width:30px;min-height:30px;height:30px;font-size:16px}
.sheetpage .periodbar .per-edit{min-height:30px;padding:0 10px;font-size:12.5px}
.sheetpage .periodbar .plabel{font-size:14px}
.sheetpage .periodbar .zoomval{font-size:13px}
.sheetpage .legend.inl{font-size:11.5px}
.sheetpage .matrixwrap{margin:0;border-radius:6px}
/* плотные строки, как в таблице */
.anmatrix.dense .mcell{padding:calc(3px * var(--z)) calc(8px * var(--z));font-size:calc(12.5px * var(--z))}
.anmatrix.dense .mcell.head{padding:calc(4px * var(--z)) calc(8px * var(--z));font-size:calc(11.5px * var(--z))}
.anmatrix.dense .mcell.editcell{padding:0}
.anmatrix.dense .mcell.editcell .in{min-height:calc(24px * var(--z));height:100%;width:auto;min-width:100%;padding:calc(2px * var(--z)) calc(8px * var(--z));border:0;border-radius:0;background:transparent;box-shadow:none;font-size:calc(12.5px * var(--z))}
.anmatrix.dense .mcell.editcell .in:focus{outline:2px solid var(--a-blue);outline-offset:-2px;background:rgba(var(--a-accent-rgb),.12)}
.anmatrix.dense .grip{width:calc(18px * var(--z));height:calc(18px * var(--z));margin-right:calc(6px * var(--z))}
.anmatrix.dense .secfold{width:calc(18px * var(--z));height:calc(18px * var(--z));font-size:calc(12px * var(--z));margin-right:calc(8px * var(--z))}
.anmatrix.dense .mcell.sect{padding-top:calc(4px * var(--z));padding-bottom:calc(4px * var(--z))}
.sheetpage .periodbar{flex-wrap:wrap;justify-content:flex-start}
.sheetpage .periodbar>*{flex:0 0 auto}
.sheetpage .legend.inl{display:none}
.anmatrix.dense .mcell.addcell{padding-top:0;padding-bottom:0;min-height:0}
.anmatrix.dense .add.mini{padding:2px 0;font-size:calc(11.5px * var(--z));opacity:.7}
.paytable .mcell.sect .add.mini{margin-left:calc(10px * var(--z));color:var(--mint-ink);text-transform:none;letter-spacing:0;font-weight:600}
.anmatrix.dense .add.mini:hover{opacity:1}

/* аналитика: плотная таблица всегда; ширина — по содержимому, но не уже экрана */
.sheet .inner.anmatrix.dense{min-width:max-content;width:max-content}
.anmatrix.dense .mcell.editcell{justify-content:stretch}
.anmatrix.dense .mcell.editcell .in{text-align:right}
.anmatrix.dense .mcell.head .clabel,.anmatrix.dense .mcell.head .csub{white-space:nowrap}
.densewrap{overscroll-behavior:auto}

/* кварталы — отдельный цвет, чтобы группа месяцев читалась сразу */
.mcell.col-quarter{background:rgba(var(--a-accent-rgb),.16)}
.mcell.head.col-quarter{background:var(--a-accent);color:var(--a-on-accent)}
.mcell.col-quarter.kind-q{color:var(--a-green);font-weight:600}
.mcell.head.col-quarter,.mcell.col-quarter.blockstart{border-left:2px solid rgba(var(--a-accent-rgb),.8)}
.anmatrix.dense .mcell.head .foldbtn{width:calc(18px * var(--z));height:calc(18px * var(--z));font-size:calc(12px * var(--z))}
.anmatrix.dense .mcell.head .hrow{gap:calc(5px * var(--z))}
.live-wrap.anlive{position:static}
.live-wrap.anlive::after{display:none}

/* аналитика: компактная шапка и в обычном режиме */
.sheetpage .subnav{margin-bottom:6px;gap:4px}
.sheetpage .subnav .ftab{min-height:30px;padding:0 12px;font-size:12.5px}
.sheetpage .top{margin-bottom:6px}
.wkstats{padding:0 8px;font-size:12.5px;color:var(--muted);white-space:nowrap}
.wkstats b{color:var(--mint-ink);font-weight:600}
@media (min-width:900px){ .page.sheetpage.wide{max-width:none} main:has(.sheetpage){padding-top:14px} }
.zoombtn{border:0;background:none;color:var(--ink);font:600 13px var(--f-display);cursor:pointer;padding:0 4px}
.sheetpage .wkstats{margin-left:auto}
.sheetpage .periodbar .per-edit{margin-left:0}
/* подписи в цветной шапке — того же тёмного цвета, что и дата под ними (читаются на голубом и золотом) */
.anmatrix .mcell.head.col-month .clabel,.anmatrix .mcell.head.col-weeksum .clabel,.anmatrix .mcell.head.col-quarter .clabel{color:inherit;opacity:1}

/* все вкладки: компактный заголовок (там, где нет вкладок раздела), строка итогов, плотные строки таблиц */
.sheetpage h1.ctitle{margin:0 0 10px;font:700 20px/1.2 var(--f-display);letter-spacing:-.02em}
.sheetpage h1.ctitle::after{display:none}
.statline{margin:0 0 8px}
.statline .wkstats{padding:0}
.sheetpage .sheet .row{padding-top:5px;padding-bottom:5px;font-size:13.5px}
.sheetpage .sheet .row.colhead{padding-top:7px;padding-bottom:6px}
.sheetpage .sheet .row .in{min-height:30px;padding-top:4px;padding-bottom:4px}
.sheetpage .blk,.sheetpage .stage{margin:10px 0}
.sheetpage .gtitle{margin:18px 0 8px}

/* все страницы — от левого края, чтобы строка вкладок не прыгала между разделами */
@media (min-width:900px){ .page, .page.wide{margin-left:0;margin-right:auto} }
.navtoggle.navout{margin-top:6px}

/* ---- Google-таблица: состояние в «Откуда цифры» и статистики по разделам ---- */
.gsbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:0 0 12px;font-size:13px}
.gsbar .per-edit{margin-left:auto}
.gssec{margin:18px 0;padding:14px;border:1px solid var(--a-line);border-left:4px solid var(--sc);border-radius:14px;background:var(--a-card)}
.gssechead{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;margin-bottom:10px}
.gssechead h2{margin:0;font-size:18px;color:var(--sc)}
.gssrcb{font-size:12px;color:var(--a-ink3)}
.gschain{display:flex;align-items:stretch;gap:0;overflow-x:auto;padding-bottom:6px;margin-bottom:8px}
.gscard{flex:0 0 340px;padding:10px 12px;border:1px solid var(--a-line);border-top:2px solid var(--sc);border-radius:12px;background:var(--a-bg)}
.gscard.none{opacity:.5}
.gscard .chname{font-size:13px}
.gscard .chlast{font-size:16px;color:var(--a-ink)}
.gsspark{display:block;width:100%;height:auto;overflow:visible}
.gsspark .grid{stroke:var(--a-line);stroke-width:1}
.gsspark .trend{stroke:var(--a-ink2);stroke-width:1.3;stroke-dasharray:4 3;opacity:.7}
.gsspark .line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.gsval{font-size:8.5px;fill:var(--a-ink2);font-weight:600;paint-order:stroke;stroke:var(--a-bg);stroke-width:2.5px}
.gsaxis{font-size:9px;fill:var(--a-ink3)}
.gsspark .line{stroke:var(--sc)}
.gsspark .dot{fill:var(--sc)}
.gsspark .area{fill:var(--sc);opacity:.12}
.gsnone{padding:24px 0;text-align:center;font-size:12px;color:var(--a-ink3)}
.gslink{flex:0 0 46px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.gsarrow{font-size:20px;color:var(--sc)}
.gsconv{font-size:11.5px;font-weight:600;color:var(--a-ink2)}
.gsconnect .amosteps li{margin-bottom:6px}
.gsempty{margin:4px 0 0;font-size:12px}
.gsval.full{font-size:7px;font-weight:500}
.gscard .chhead{position:relative}
.gshide{margin-left:6px;width:20px;height:20px;border:0;border-radius:50%;background:rgba(255,255,255,.06);color:var(--a-ink3);font-size:13px;line-height:20px;cursor:pointer;flex:0 0 auto}
.gshide:hover{background:rgba(255,255,255,.14);color:var(--a-ink)}
.gsempty .linkbtn{font-size:12px;padding:0;color:var(--a-blue)}
.planinner .in.planbig{min-width:120px;width:100%}
/* «План по доходу»: таблица на всю ширину, ровные столбцы, цифры по правому краю */
.planinner{min-width:740px}
.row.plan{grid-template-columns:minmax(190px,1.7fr) repeat(6, minmax(88px,1fr));align-items:center}
.row.plan .amt{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.row.plan.colhead .amt{white-space:normal;line-height:1.25;font-size:12px}
.row.plan .amt .in{width:100%;min-width:0;text-align:right}
.row.plan .name{min-width:0;overflow-wrap:anywhere}
/* «План по доходу»: компактно, чтобы помещался на одном экране; шапка и итог закреплены */
.planblk .row.plan{padding-top:2px;padding-bottom:2px;gap:6px;font-size:12.5px;min-height:0;line-height:1.3}
.planblk .row.plan .name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.planblk .row.plan .amt{font-size:12.5px;padding-left:8px}
.planblk .row.plan.sect{padding-top:3px;padding-bottom:3px;font-size:12px;letter-spacing:.02em;text-transform:uppercase}
.planblk .row.plan.sect.sub2{text-transform:none;font-size:12px;font-weight:600;color:var(--a-ink2)}
.planblk .row.plan.colhead{padding-top:6px;padding-bottom:6px;font-size:11px}
.planblk .row.plan.colhead .amt{font-size:11px}
.planblk .row.plan.key{padding-top:4px;padding-bottom:4px;font-size:13.5px}
.planblk .row.plan.key .amt{font-size:13.5px;font-weight:700}
.planblk .row.plan .in{min-height:28px;height:28px;padding:2px 8px;font-size:13px}
.planblk .row.plan .devbad{color:#FF453A;font-weight:700}
.planhead{background:var(--a-card)}
@media (min-width:900px){
  .planblk{overflow:visible}
  .planhead{position:sticky;top:0;z-index:6;box-shadow:0 6px 12px -6px rgba(0,0,0,.6)}
}
.planblk .row.plan .amt .in{width:100%!important;max-width:none!important;min-width:0!important;padding:2px 6px;font-size:13px;box-sizing:border-box}
.planblk .row.plan.key .amt{padding-left:3px}
.planblk .row.plan.key .amt .in{padding:2px 4px;font-size:12.5px;letter-spacing:-.01em}
/* «Статистики»: масштаб и скрытые графики */
.stzoom{display:flex;align-items:center;gap:4px;margin-left:auto}
.stzoom .zoomval{min-width:84px;text-align:center;font-size:12.5px;color:var(--a-ink2)}
.stzoom .per-edit.on{background:rgba(var(--a-accent-rgb),.18);color:var(--a-ink);border-color:rgba(var(--a-accent-rgb),.5)}
.gshidden{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px;padding-top:8px;border-top:1px dashed var(--a-line)}
.gshidlab{font-size:12px;color:var(--a-ink3);margin-right:2px}
.gschip{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px 0 6px;border:1px solid var(--a-line);border-radius:13px;background:rgba(255,255,255,.03);color:var(--a-ink2);font:inherit;font-size:12px;cursor:pointer}
.gschip:hover{border-color:var(--sc);color:var(--a-ink);background:rgba(255,255,255,.07)}
.gschip .gsplus{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--sc);color:#000;font-weight:700;font-size:12px;line-height:1}
.gschip[disabled]{cursor:default;opacity:.7}
/* ---- Оргсхема: единица → должность → человек; функции свёрнуты; секции и секторы вложены ---- */
.orgscroll{touch-action:pan-x pan-y}
.orgsheet .editable{cursor:pointer}
.orgsheet .editable:hover{outline:1px solid rgba(var(--a-accent-rgb),.55);outline-offset:-1px}
.orgunith{display:flex;flex-direction:column;gap:calc(2px * var(--z));margin-bottom:calc(8px * var(--z))}
.orgkind{font-size:calc(10.5px * var(--z));text-transform:uppercase;letter-spacing:.06em;color:var(--a-ink3);font-weight:600}
.orgslot{margin:calc(6px * var(--z)) 0;padding:calc(7px * var(--z)) calc(9px * var(--z));border-radius:calc(9px * var(--z));background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.06)}
.orgrole{font-size:calc(10.5px * var(--z));color:var(--a-ink3);margin-bottom:calc(3px * var(--z))}
.orgperson{display:flex;flex-direction:column;gap:calc(3px * var(--z));font-size:calc(13.5px * var(--z));font-weight:650;color:var(--a-ink)}
.orgperson+.orgperson{margin-top:calc(5px * var(--z))}
.orgperson.vac{font-weight:500;color:#FF9F0A;font-size:calc(12.5px * var(--z))}
.orgposts{margin-top:calc(4px * var(--z))}
.orgposts .orgslot{background:rgba(255,255,255,.03)}
.orgfnbox{margin:calc(6px * var(--z)) 0}
.orgfnbtn{border:0;background:none;padding:calc(2px * var(--z)) 0;color:var(--a-ink3);font:inherit;font-size:calc(12px * var(--z));cursor:pointer}
.orgfnbtn:hover{color:var(--a-ink)}
.orgunit{margin-top:calc(8px * var(--z));padding:calc(8px * var(--z));border-radius:calc(10px * var(--z));border:1px dashed rgba(255,255,255,.18);background:rgba(255,255,255,.025)}
.orgunit.sct{border-style:dotted;background:rgba(255,255,255,.04)}
.orgunitn{font-weight:650;font-size:calc(13.5px * var(--z))}
.orgckp.sm{font-size:calc(11.5px * var(--z));padding:calc(6px * var(--z)) calc(8px * var(--z))}
.orgmodal .orgmh{margin:14px 0 6px;font-size:15px}
.orgassign{display:flex;flex-direction:column;gap:6px}
.orgholder{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;border-radius:8px;background:rgba(255,255,255,.05);font-weight:600}
.orgpostedit{padding:10px;border:1px solid var(--a-line);border-radius:10px;margin-bottom:8px}
.orgmodal .frow{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.orgmodal .frow .fin{flex:1 1 200px;min-width:0}
.orgcourse{margin-left:calc(5px * var(--z));text-decoration:none;font-size:calc(12px * var(--z))}
.hatcourse{display:inline-block;margin-top:8px;padding:8px 14px;border-radius:10px;text-decoration:none;text-align:center}
/* ---- Шляпа: подборка материалов, контрольный лист, прохождение ---- */
.hattabs{flex-wrap:wrap;margin-bottom:6px}
.hatrowedit{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:6px 0;border-bottom:1px solid var(--a-line)}
.hatrowedit .fin{flex:1 1 160px;min-width:0}
.hatrowedit select.fin{flex:0 0 190px}
.hatrowedit.sec .fin{font-weight:700;background:rgba(var(--a-accent-rgb),.08)}
.hatlink{color:var(--a-blue);text-decoration:none;font-size:13px}
.hatlink.big{display:block;padding:8px 10px;border-radius:8px;background:rgba(255,255,255,.04);margin:4px 0}
.csheet{display:flex;flex-direction:column;gap:6px}
.csprog{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--a-ink2);margin-bottom:4px}
.csprog .prog{flex:1}
.cssec{margin-top:10px;padding:6px 10px;border-radius:8px;background:rgba(var(--a-accent-rgb),.1);font-weight:700}
.csitem{display:grid;grid-template-columns:26px 1fr;gap:10px;padding:8px 10px;border:1px solid var(--a-line);border-radius:10px}
.csitem.done{opacity:.7}
.csitem.done .csn{text-decoration:line-through}
.csbody{display:flex;flex-direction:column;gap:4px;min-width:0}
.cstype{font-size:12px;color:var(--a-ink3)}
.csn{font-weight:600}
.csok{font-size:12px;color:var(--a-green)}
.cswait{font-size:12px;color:#FF9F0A}
.hatchip{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:8px;background:rgba(255,255,255,.08);font-size:.78em;font-weight:500;color:var(--a-ink2);white-space:nowrap}
.hatchip.ok{background:rgba(48,209,88,.18);color:var(--a-green)}
.hatpack{display:flex;flex-direction:column;gap:2px}
.bulktable{display:flex;flex-direction:column;gap:4px}
.bulkrow{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:8px;align-items:center;padding:6px 8px;border-radius:8px;background:rgba(255,255,255,.04);font-size:13px}
.bulkrow code{font-family:ui-monospace,Menlo,monospace;font-size:13px;user-select:all}
.csd{font-size:12px;color:var(--a-ink3);white-space:pre-wrap;line-height:1.4}
.cspart{margin-top:14px;padding:8px 12px;border-radius:10px;background:rgba(var(--a-accent-rgb),.18);font-weight:800;letter-spacing:.01em}
.cspart.common{background:rgba(48,209,88,.14)}
/* ---- «Шляпы»: поиск и дерево по оргсхеме; 🎩 на схеме; подсветка «на схеме» ---- */
.hatsearch{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.hatgroup{display:flex;justify-content:space-between;align-items:center;width:100%;margin:6px 0 0;padding:10px 14px;border:1px solid var(--a-line);border-radius:12px;background:var(--a-card);color:var(--a-ink);font:inherit;font-weight:700;text-align:left;cursor:pointer}
.hatgroup.open{border-bottom-left-radius:0;border-bottom-right-radius:0}
.hatblk{margin-top:0;border-top-left-radius:0;border-top-right-radius:0;padding:4px 0}
.hatsub{padding:8px 14px 2px;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--a-ink3)}
.hatsub.d2{padding-left:30px}.hatsub.d3{padding-left:46px}
.hatline{display:flex;align-items:center;gap:8px;padding:5px 14px;border-top:1px solid rgba(255,255,255,.04)}
.hatline.d1{padding-left:22px}.hatline.d2{padding-left:38px}.hatline.d3{padding-left:54px}
.hatopen{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;padding:4px 0}
.hatopen:hover .hatn{color:var(--a-blue)}
.hatn{font-weight:600;font-size:14px}
.hatwho{font-size:12.5px;color:var(--a-ink2)}
.hatwho.vac{color:#FF9F0A}
.hatbadge{flex:0 0 auto;font-size:12px;padding:2px 8px;border-radius:9px;background:rgba(var(--a-accent-rgb),.16);color:var(--a-ink)}
.hatbadge.empty{background:rgba(255,255,255,.05);color:var(--a-ink3)}
.hatmap{flex:0 0 auto;border:1px solid var(--a-line);background:none;color:var(--a-ink2);border-radius:8px;padding:3px 8px;font:inherit;font-size:12px;cursor:pointer}
.hatmap:hover{color:var(--a-ink);border-color:var(--a-blue)}
.orghat{margin-left:calc(5px * var(--z));border:0;background:rgba(255,255,255,.08);color:var(--a-ink);border-radius:calc(6px * var(--z));padding:0 calc(5px * var(--z));font:inherit;font-size:calc(11px * var(--z));cursor:pointer}
.orghat:hover{background:rgba(var(--a-accent-rgb),.35)}
.orgfocus{outline:3px solid var(--a-blue)!important;outline-offset:2px;box-shadow:0 0 0 8px rgba(var(--a-accent-rgb),.25)!important;transition:outline-color .3s}
@media (max-width:899px){ .hatline{flex-wrap:wrap} }
/* ---- шляпа по оргполитике: состав а–и, оргсхема подразделения ---- */
.hatcheck{padding:10px 12px;border-radius:10px;background:rgba(var(--a-accent-rgb),.08);display:flex;flex-direction:column;gap:6px}
.hatchecks{display:flex;flex-wrap:wrap;gap:4px 10px}
.hatck{font-size:12px}.hatck.y{color:var(--a-green)}.hatck.n{color:var(--a-ink3)}
.hatpart{border:1px solid var(--a-line);border-radius:10px;padding:8px 10px}
.hatparth{display:flex;justify-content:space-between;gap:8px;font-weight:700;margin-bottom:6px}
.hatok{font-size:12px;font-weight:600}.hatok.y{color:var(--a-green)}.hatok.n{color:#FF9F0A}
.hatpath{font-size:13px;color:var(--a-ink2)}
.unitboard{display:flex;flex-direction:column;gap:2px;font-size:13px}
.ubunit{margin-top:6px;font-weight:700;font-size:12px;color:var(--a-ink3);text-transform:uppercase;letter-spacing:.04em}
.ubline{display:flex;justify-content:space-between;gap:10px;padding:3px 8px;border-radius:6px}
.ubline.me{background:rgba(var(--a-accent-rgb),.2);font-weight:700}
.ubunit.d1,.ubline.d1{margin-left:14px}.ubunit.d2,.ubline.d2{margin-left:28px}
.ubwho{color:var(--a-ink2)}.ubwho.vac{color:#FF9F0A}
.hatstat{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.hatneed ul{margin:6px 0 0;padding-left:18px;font-size:13px;line-height:1.5}
.hatscore{flex:0 0 auto;font-size:11.5px;padding:2px 6px;border-radius:8px;border:1px solid var(--a-line);color:var(--a-ink3)}
.hatscore.full{color:var(--a-green);border-color:rgba(48,209,88,.5)}
