/* Нормоконтролёр — стили общих элементов платформы (агент 2): окно «Идёт обновление сайта», оповещение об обновлении баз,
   колокольчик уведомлений, «Мой доступ», перетаскиваемые тумблеры. Токены — из style.css (цвета, отступы, скругления). */

.perm-hidden { display: none !important; }
html.nk-locked body { overflow: hidden; }

/* ---------- тумблеры: перетаскивание, «нажатый» бегунок, предпросмотр положения ---------- */
.switch .track { touch-action: pan-y; }
.switch .track::after { width: calc(24px + var(--grow, 0px)); transform: translateX(var(--kx, 0px));
  transition: transform .22s var(--spring), box-shadow .2s; }
.switch input:checked + .track::after { transform: translateX(var(--kx, calc(18px - var(--grow, 0px)))); }
.switch.sm .track::after { width: calc(19px + var(--grow, 0px)); }
.switch.sm input:checked + .track::after { transform: translateX(var(--kx, calc(15px - var(--grow, 0px)))); }
/* нажатый бегунок не вытягивается (07.10.2026): только тень чуть глубже */
.switch .track.press::after { box-shadow: 0 3px 10px rgb(0 0 0 / .22), 0 0 0 .5px rgb(0 0 0 / .06); }
.switch .track.dragging, .switch .track.dragging::after { transition: width .22s var(--ease), background-color .22s var(--ease); cursor: grabbing; }
.switch .track.preview-on { background: var(--ok) !important; }
.switch .track.preview-off { background: var(--fill-2) !important; }
.switch:hover .track::after { box-shadow: 0 2px 8px rgb(0 0 0 / .22), 0 0 0 .5px rgb(0 0 0 / .06); }
:root[data-reduce] .switch .track::after { transition: none; }  /* меньше движения: системная настройка или «Анимация интерфейса» в профиле */

/* ---------- окно «Идёт обновление сайта» ---------- */
.nk-maint { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 16px;
  background: color-mix(in srgb, var(--bg) 62%, transparent); -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%);
  opacity: 0; transition: opacity .35s var(--ease); }
.nk-maint.in { opacity: 1; } .nk-maint.out { opacity: 0; }
.nk-maint-card { width: min(460px, 100%); text-align: center; padding: var(--s8) var(--s6) var(--s6); border-radius: var(--r-xl); background: var(--surface);
  border: 1px solid var(--line); box-shadow: var(--shadow-pop); transform: translateY(8px); transition: transform .3s var(--ease); }
.nk-maint.in .nk-maint-card { transform: none; }
.nk-maint-card h2 { font-size: var(--t-xl); margin-top: var(--s4); }
.nk-maint-card p { color: var(--ink-2); margin-top: var(--s2); text-wrap: pretty; }
.nk-maint-card p.small { margin-top: var(--s1); }
.nk-maint-st { display: inline-flex; align-items: center; gap: 8px; justify-content: center; margin-top: var(--s4) !important; }
.nk-maint-st .ic { color: var(--ok); }
@keyframes nk-pulse { 50% { opacity: .25; transform: scale(.7); } }  /* «В реальном времени» в «Системе» */
/* значок программы и тонкая дуга, бегущая по кругу; связь вернулась — дуга смыкается в зелёное кольцо */
.nk-load { position: relative; width: 88px; height: 88px; margin: 0 auto; display: grid; place-items: center; }
.nk-mark { width: 50px; height: 50px; display: block; filter: drop-shadow(0 6px 14px rgb(31 91 214 / .28)); animation: nk-breathe 2.8s ease-in-out infinite; }
.nk-ring { position: absolute; inset: 0; width: 100%; height: 100%; animation: nk-rot 1.6s linear infinite; }
.nk-ring circle { fill: none; stroke-width: 3; stroke-linecap: round; }
.nk-ring .trk { stroke: var(--fill); }
.nk-ring .arc { stroke: var(--accent); stroke-dasharray: 22 78; animation: nk-arc 1.6s ease-in-out infinite; }
@keyframes nk-rot { to { transform: rotate(360deg); } }
@keyframes nk-arc { 0% { stroke-dasharray: 6 94; stroke-dashoffset: 0; } 50% { stroke-dasharray: 44 56; stroke-dashoffset: -18; } 100% { stroke-dasharray: 6 94; stroke-dashoffset: -100; } }
@keyframes nk-breathe { 50% { opacity: .82; } }  /* значок не меняет размер — только чуть гаснет */
.nk-maint.done .nk-ring, .nk-maint.done .nk-mark { animation: none; }
.nk-maint.done .nk-ring .arc { animation: none; stroke: var(--ok); stroke-dasharray: 100 0; transition: stroke-dasharray .6s var(--ease), stroke .3s; }
:root[data-reduce] .nk-ring, :root[data-reduce] .nk-ring .arc, :root[data-reduce] .nk-mark { animation: none; }

/* плашка «включён режим обновления» (администратор) и на экране входа */
.nk-maintbar { position: fixed; z-index: 260; top: calc(10px + env(safe-area-inset-top)); left: 50%; transform: translateX(-50%); width: max-content;
  max-width: calc(100vw - 20px); display: flex; align-items: center; gap: var(--s3); padding: 8px 8px 8px 14px; border-radius: 999px;
  background: var(--major-soft); color: var(--ink); border: 1px solid color-mix(in srgb, var(--major) 35%, transparent); box-shadow: var(--shadow-2);
  font-size: var(--t-sm); }
.nk-maintbar .ic { color: var(--major-t); }
.nk-maintbar span { min-width: 0; }
#nkLoginMaint { padding-right: 16px; border-radius: var(--r-md); }

/* ---------- фоновое обновление баз: карточка в углу ---------- */
.nk-upd { position: fixed; z-index: 250; right: 20px; bottom: calc(20px + env(safe-area-inset-bottom)); width: min(340px, calc(100vw - 24px));
  border-radius: var(--r-lg); padding: var(--s4); opacity: 0; transform: translateY(10px); transition: opacity .26s var(--ease), transform .26s var(--ease), width .3s var(--ease); }
.nk-upd.in { opacity: 1; transform: none; }
.nk-upd .nk-upd-body { display: grid; gap: 8px; }
.nk-upd-row { display: flex; align-items: center; gap: 8px; min-width: 0; }
.nk-upd-row b { font-size: var(--t-sm); }
.nk-upd .progress { height: 5px; }
.nk-upd .spacer { flex: 1; }
.nk-upd .nk-upd-row .btn { margin: -6px -6px -6px 0; }
.nk-upd.finished .nk-upd-row .ic { color: var(--ok); }
.nk-spin { display: inline-grid; color: var(--accent-text); }
.nk-spin .ic { animation: spin 1.6s linear infinite; }
.nk-upd-pill { display: none; }
.nk-upd.mini { width: auto; padding: 0; border-radius: 999px; }
.nk-upd.mini .nk-upd-body { display: none; }
.nk-upd.mini .nk-upd-pill { display: inline-flex; align-items: center; gap: 8px; border: 0; background: transparent; padding: 9px 14px; cursor: pointer;
  font-size: var(--t-sm); color: var(--ink); border-radius: 999px; }
@media (max-width: 700px) {
  .nk-upd { right: 10px; left: 10px; width: auto; top: calc(62px + env(safe-area-inset-top)); bottom: auto; transform: translateY(-10px); }
  .nk-upd.mini { left: auto; }
}
:root[data-reduce] .nk-spin .ic { animation: none; }

/* новая версия сайта */
.nk-card.nk-newver { position: fixed; z-index: 250; left: 50%; top: calc(14px + env(safe-area-inset-top)); transform: translate(-50%, -12px); opacity: 0;
  display: flex; align-items: center; gap: var(--s3); padding: 8px 8px 8px 16px; border-radius: 999px; font-size: var(--t-sm); font-weight: 500;
  transition: opacity .26s var(--ease), transform .26s var(--ease); max-width: calc(100vw - 20px); }
.nk-card.nk-newver.in { opacity: 1; transform: translate(-50%, 0); }
.nk-newver .ic { color: var(--accent-text); }

/* ---------- колокольчик и уведомления ---------- */
.nk-bell { position: relative; display: inline-grid; place-items: center; width: 40px; height: 40px; flex: none; border: 0; border-radius: 50%;
  background: transparent; color: var(--ink-2); cursor: pointer; transition: background-color .18s, color .18s; }
.nk-bell:hover { background: var(--fill); color: var(--ink); }
.nk-badge { position: absolute; top: 3px; right: 1px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--mk-crit-b);
  color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--surface); font-variant-numeric: tabular-nums; }
.nk-bell.ring .ic { animation: nk-ring .7s var(--ease); transform-origin: 50% 12%; }
@keyframes nk-ring { 20% { transform: rotate(10deg); } 45% { transform: rotate(-7deg); } 70% { transform: rotate(3deg); } }
.nk-notes-pop { padding: 0; max-height: min(72vh, 620px); display: flex; flex-direction: column; overflow: hidden; }
.nk-notes { display: flex; flex-direction: column; min-height: 0; }
.nk-notes-h { display: flex; align-items: center; gap: 8px; padding: 12px 12px 10px 16px; border-bottom: 1px solid var(--line); }
.nk-notes-h .spacer { flex: 1; }
.nk-notes-l { overflow: auto; overflow-x: hidden; padding: 6px; display: grid; gap: 2px; align-content: start; }
.nk-note { display: flex; gap: 12px; align-items: flex-start; width: 100%; text-align: left; border: 0; background: transparent; padding: 10px; border-radius: var(--r-sm);
  cursor: pointer; color: var(--ink); }
.nk-note:hover { background: var(--fill); }
.nk-note.new { background: var(--accent-soft); }
.nk-note.new:hover { background: var(--accent-soft-2); }
.nk-note-ic { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--fill); color: var(--ink-2); }
.nk-note-ic.k-access_granted { background: var(--ok-soft); color: var(--ok-t); }
.nk-note-ic.k-access_denied { background: var(--crit-soft); color: var(--crit-t); }
.nk-note-ic.k-access_request, .nk-note-ic.k-idea { background: var(--major-soft); color: var(--major-t); }
.nk-note-t { display: grid; gap: 2px; min-width: 0; font-size: var(--t-sm); }
.nk-note-t span { color: var(--ink-2); overflow-wrap: anywhere; }
.nk-note-t i { font-style: normal; font-size: var(--t-xs); color: var(--ink-3); }
.nk-notes-empty { display: grid; justify-items: center; gap: 8px; padding: 28px 12px; color: var(--ink-3); font-size: var(--t-sm); }

/* ---------- «Мой доступ» ---------- */
.acc-groups { display: grid; gap: var(--s4); margin-top: var(--s4); }
.acc-groups h4 { font-size: var(--t-xs); font-weight: 600; color: var(--ink-3); margin: 0 0 6px; }
.acc-groups section { display: grid; gap: 6px; }
.acc-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 12px; border-radius: var(--r-md);
  border: 1px solid var(--line); background: var(--surface); cursor: pointer; transition: border-color .18s, background-color .18s; }
.acc-item:hover { border-color: var(--line-2); }
.acc-item.s-granted, .acc-item.s-requested { cursor: default; }
.acc-item.s-granted .cb { visibility: hidden; }
.acc-item.s-requested .cb { visibility: hidden; }
.acc-item:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.acc-tx { display: grid; gap: 2px; min-width: 0; } .acc-tx small { color: var(--ink-2); font-size: var(--t-xs); line-height: 1.4; }
.acc-item .chip { white-space: nowrap; }
.acc-hist { margin-top: var(--s4); }
.acc-hist summary { cursor: pointer; }
.acc-h { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--line); }
@media (max-width: 700px) { .acc-item { grid-template-columns: auto minmax(0, 1fr); } .acc-item .chip { grid-column: 2; justify-self: start; } .acc-h { grid-template-columns: auto minmax(0, 1fr); } }

/* ---------- главный экран: колокольчик рядом с пользователем и в верхней панели ---------- */
.foot-row { display: flex; align-items: center; gap: 2px; }
.foot-row .user-btn { flex: 1; min-width: 0; }
.tb-bell { display: none; }
@media (max-width: 1024px) {
  .topbar .tb-bell { display: inline-grid; border-radius: 50%; width: 42px; height: 42px; border: 1px solid var(--glass-line); }
}
.topbar .tb-bell.nk-bell { background: var(--glass); -webkit-backdrop-filter: blur(var(--blur)) saturate(170%); backdrop-filter: blur(var(--blur)) saturate(170%); }

/* ---------- фото профиля ---------- */
.avatar { overflow: hidden; flex: none; }
.avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------- профиль: строгая шапка — фото, имя, должность, контакты ---------- */
.prof-head { display: flex; align-items: center; gap: var(--s5); padding: var(--s5) var(--s6); border-radius: var(--r-xl); background: var(--surface);
  border: 1px solid var(--line); box-shadow: var(--shadow-1); margin-bottom: var(--s4); min-width: 0; }
.prof-ava { position: relative; width: 96px; height: 96px; border-radius: 50%; border: 0; background: var(--accent-fill); color: var(--on-accent);
  display: grid; place-items: center; overflow: hidden; flex: none; padding: 0; cursor: pointer; font: 600 32px/1 var(--font);
  box-shadow: 0 0 0 1px var(--line), 0 0 0 4px var(--surface), 0 0 0 5px var(--line); }
.prof-ava img { width: 100%; height: 100%; object-fit: cover; display: block; }
.prof-ava i { position: absolute; inset: 0; display: grid; place-items: center; background: rgb(0 0 0 / .42); color: #fff; opacity: 0; transition: opacity .2s; }
.prof-ava:hover i, .prof-ava:focus-visible i { opacity: 1; }
.prof-name { min-width: 0; display: grid; gap: 3px; flex: 1; }
.prof-head .prof-more { align-self: flex-start; flex: none; margin: -6px -10px 0 0; }  /* «⋯»: фото, пароль, выход (07.10.2026) */
.prof-name h2 { font-size: var(--t-xl); overflow-wrap: anywhere; }
.prof-facts { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 4px; font-size: var(--t-sm); color: var(--ink-2); }
.prof-facts span { display: inline-flex; align-items: center; gap: 5px; min-width: 0; overflow-wrap: anywhere; }
.prof-facts .ic { color: var(--ink-3); flex: none; }
.prof-acts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.pf-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s4); }
.pf .lbl { display: flex; align-items: center; gap: 6px; } .pf .lbl .ic { color: var(--ink-3); }
@media (max-width: 700px) {
  .prof-head { padding: var(--s4); gap: var(--s4); align-items: flex-start; }
  .prof-ava { width: 72px; height: 72px; font-size: 24px; }
  .pf-grid { grid-template-columns: 1fr; }
}

/* ---------- обрезка фото профиля ---------- */
.crop-stage { position: relative; width: min(320px, 100%); aspect-ratio: 1; margin: var(--s4) auto 0; border-radius: var(--r-lg); overflow: hidden;
  background: repeating-conic-gradient(var(--fill) 0 25%, transparent 0 50%) 0 0 / 16px 16px; touch-action: none; cursor: grab; outline: none; user-select: none; }
.crop-stage:active { cursor: grabbing; }
.crop-stage:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 45%, transparent); }
.crop-stage canvas { width: 100%; height: 100%; display: block; }
.crop-mask { position: absolute; inset: 0; pointer-events: none; border-radius: 50%; box-shadow: 0 0 0 999px rgb(10 14 22 / .55), inset 0 0 0 2px rgb(255 255 255 / .85); }
.crop-ctl { display: flex; align-items: center; gap: 6px; justify-content: center; margin-top: var(--s3); flex-wrap: wrap; }
.crop-ctl input[type=range] { flex: 1 1 140px; max-width: 220px; accent-color: var(--accent); }

/* ---------- администрирование: группы и вкладки подразделов ---------- */
@media (min-width: 1025px) { .adm-side .side-head { display: flex; align-items: center; gap: 10px; } }
.adm-side .side-head b { font-size: var(--t-base); }
.adm-side .side-head .who-line { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }  /* уже — шапка скрыта, колокольчик в подменю */
.nav-badge { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--mk-crit-b); color: #fff; font-size: 11px; font-weight: 700;
  display: inline-grid; place-items: center; line-height: 1; font-variant-numeric: tabular-nums; flex: none; }
.nav.on .nav-badge { box-shadow: 0 0 0 2px var(--surface); }
.subnav { display: flex; align-items: center; gap: var(--s3); margin-bottom: var(--s5); min-width: 0; }
.subnav-tabs { display: flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--fill); overflow-x: auto; scrollbar-width: none; max-width: 100%; }
.subnav-tabs::-webkit-scrollbar { display: none; }
.subnav .sub { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 var(--s4); border: 0; border-radius: 999px; background: transparent;
  color: var(--ink-2); font-size: var(--t-sm); font-weight: 500; white-space: nowrap; cursor: pointer; text-decoration: none; transition: background-color .2s, color .2s, box-shadow .2s; }
.subnav .sub:hover { color: var(--ink); text-decoration: none; }
.subnav .sub.on { background: var(--surface); color: var(--ink); box-shadow: 0 1px 2px rgb(0 0 0 / .1), 0 2px 8px -2px rgb(0 0 0 / .1); }
.subnav-bell { display: none !important; margin-left: auto; }
/* вкладок больше, чем помещается: лента прокручивается, края мягко гаснут */
.subnav-tabs.scroll { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 22px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 22px), transparent); }
.subnav-tabs.scroll.mid { -webkit-mask-image: linear-gradient(90deg, transparent, #000 22px, #000 calc(100% - 22px), transparent); mask-image: linear-gradient(90deg, transparent, #000 22px, #000 calc(100% - 22px), transparent); }
.subnav-tabs.scroll.end { -webkit-mask-image: linear-gradient(90deg, transparent, #000 22px); mask-image: linear-gradient(90deg, transparent, #000 22px); }
@media (pointer: coarse) { .subnav .sub { min-height: 40px; } }
@media (max-width: 1024px) {
  .subnav { margin: 0 0 var(--s4); }
  .subnav-bell { display: inline-grid !important; }
}

/* ---------- администрирование: пользователи и карточка ---------- */
.kpi .v { font-variant-numeric: normal; }
.kpi.tile { display: grid; gap: 2px; align-content: start; }
.kpi.tile .k { order: -1; }
.kpi.tile .v { font-size: calc(30px * var(--fk)); line-height: 1.15; }
.kpi.tile .s { font-size: var(--t-xs); color: var(--ink-3); line-height: 1.4; }
.kpi.tile .s .ic { vertical-align: -2px; }
.kpis.mini { --tile: 120px; }
.kpis.mini .kpi { padding: var(--s3) var(--s4); box-shadow: none; }
.kpis.mini .kpi .v { font-size: var(--t-xl); }
.toolbar, .filters { display: flex; align-items: center; gap: var(--s3); flex-wrap: wrap; margin-bottom: var(--s4); }
.toolbar input[type=search] { flex: 1 1 260px; width: auto; }
table.ppl td { vertical-align: middle; }
@media (max-width: 700px) {
  table.ppl thead { display: none; }
  table.ppl, table.ppl tbody { display: block; }
  table.ppl tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; padding: var(--s4); border-bottom: 1px solid var(--line); }
  table.ppl tr:last-child { border-bottom: 0; }
  table.ppl td { display: grid; grid-template-columns: 9.5em minmax(0, 1fr); gap: 2px 10px; align-items: baseline; padding: 0; border: 0; grid-column: 1 / -1; }
  table.ppl td[data-label]::before { content: attr(data-label); grid-column: 1; grid-row: 1 / span 4; font-size: var(--t-xs); color: var(--ink-3); }
  table.ppl td[data-label] > * { grid-column: 2; }
  table.ppl td:first-child { display: block; grid-column: 1; }
  table.ppl td.act { display: block; grid-column: 2; grid-row: 1; align-self: center; }
  table.ppl td.num { text-align: left; }
  table.ppl td.opt-sm { display: none; }
}
table.ppl tr.off td { opacity: .55; }
.who { display: flex; align-items: center; gap: 10px; border: 0; background: transparent; padding: 2px; margin: -2px; border-radius: var(--r-sm); cursor: pointer;
  color: var(--ink); text-align: left; min-width: 0; font: inherit; }
.who > span:last-child { display: grid; min-width: 0; } .who b { font-weight: 600; font-size: var(--t-sm); }
.who:hover b { color: var(--accent-text); }
.online { display: inline-flex; align-items: center; gap: 6px; font-size: var(--t-sm); white-space: nowrap; }
.online.on { color: var(--ok-t); font-weight: 600; }
.modal .uc { margin: calc(-1 * var(--s6)) calc(-1 * var(--s6)) 0; }
.uc-id { display: flex; align-items: center; gap: var(--s4); padding: var(--s6) var(--s6) 0; position: relative; }
.uc-id .avatar { box-shadow: 0 0 0 1px var(--line), 0 0 0 4px var(--surface), 0 0 0 5px var(--line); }
.uc-id h2 { overflow-wrap: anywhere; }
.uc-id > div { min-width: 0; flex: 1; }
.uc-id > .btn[data-close] { align-self: flex-start; }
.uc-tabs { margin: var(--s5) var(--s6) 0; display: flex; flex-wrap: wrap; border-radius: var(--r-md); }
.uc-body { padding: var(--s5) var(--s6) var(--s4); min-height: 220px; }
.uc-foot { display: flex; align-items: center; gap: var(--s2); flex-wrap: wrap; padding: var(--s4) var(--s6) 0; border-top: 1px solid var(--line); }
.uc-foot .spacer { flex: 1; }
.uc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s4); }
.uc-kv { grid-template-columns: minmax(150px, auto) minmax(0, 1fr); }
.uc-h { font-size: var(--t-sm); font-weight: 600; margin: var(--s5) 0 var(--s2); }
.ev-list { display: grid; gap: 0; }
.ev-row { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: var(--s3); align-items: center; padding: 7px 0; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.ev-row:first-child { border-top: 0; }
a.ev-row:hover { text-decoration: none; background: var(--fill); }
.req .req-cmt { margin-top: 6px; color: var(--ink-2); font-size: var(--t-sm); font-style: italic; }
.req-perms { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s3); }
.req-perms .toggle-chip { display: inline-flex; align-items: center; gap: 8px; }
.choice-list.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.meter { height: 8px; border-radius: 999px; background: var(--accent-soft); overflow: hidden; margin-top: var(--s3); }
.meter i { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.meter i.warn { background: var(--major); } .meter i.crit { background: var(--crit); }
.maint-card.on { border-color: color-mix(in srgb, var(--major) 45%, transparent); background: color-mix(in srgb, var(--major) 7%, var(--surface)); }
pre.code { margin: 0; padding: var(--s3) var(--s4); border-radius: var(--r-md); background: var(--sunken); border: 1px solid var(--line); font: 500 var(--t-sm)/1.6 var(--mono);
  overflow-x: auto; white-space: pre; }
@media (max-width: 700px) {
  .modal .uc { margin: calc(-1 * var(--s5)) calc(-1 * var(--s5)) 0; } .uc-id, .uc-body, .uc-foot { padding-left: var(--s5); padding-right: var(--s5); } .uc-tabs { margin-left: var(--s5); margin-right: var(--s5); }
  .uc-grid, .choice-list.two { grid-template-columns: 1fr; } .ev-row { grid-template-columns: 1fr; gap: 2px; }
}

/* ---------- аналитика: графики (один ряд — один цвет, волосяная сетка, подсказки, вид таблицей) ---------- */
:root { --viz-1: #2a78d6; --viz-1-hl: #1c5cab;
  --heat-0: var(--fill); --heat-1: #cde2fb; --heat-2: #9ec5f4; --heat-3: #6da7ec; --heat-4: #3987e5; --heat-5: #256abf; --heat-6: #184f95; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --viz-1: #3987e5; --viz-1-hl: #6da7ec;
    --heat-1: #104281; --heat-2: #184f95; --heat-3: #1c5cab; --heat-4: #2a78d6; --heat-5: #5598e7; --heat-6: #9ec5f4; }
}
:root[data-theme="dark"] { --viz-1: #3987e5; --viz-1-hl: #6da7ec;
  --heat-1: #104281; --heat-2: #184f95; --heat-3: #1c5cab; --heat-4: #2a78d6; --heat-5: #5598e7; --heat-6: #9ec5f4; }
.an-body { transition: opacity .25s var(--ease); } .an-body.loading { opacity: .5; pointer-events: none; }
.an-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--s4); margin-top: var(--s4); }
.an-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.an-grid > .card { margin: 0; }
.an-grid + .card, .viz + .an-grid, .card + .an-grid { margin-top: var(--s4); }
.viz-h { display: flex; align-items: flex-start; gap: var(--s3); flex-wrap: wrap; margin-bottom: var(--s3); }
.viz-h .spacer { flex: 1; }
.viz-plot { position: relative; min-width: 0; }
.viz-svg { display: block; width: 100%; height: auto; overflow: visible; font-family: var(--font); }
.viz-svg .grid { stroke: var(--line); stroke-width: 1; shape-rendering: crispEdges; }
.viz-svg .base { stroke: var(--line-3); stroke-width: 1; shape-rendering: crispEdges; }
.viz-svg .ax { fill: var(--ink-3); font-size: 11px; font-variant-numeric: tabular-nums; }
.viz-svg .bar { fill: var(--viz-1); transition: fill .15s; }
.viz-svg .bar.hl { fill: var(--viz-1-hl); }
.viz-svg .hit { fill: transparent; cursor: default; outline: none; }
.viz-svg .hit:focus-visible { fill: var(--fill); }
.viz-tip { position: absolute; z-index: 5; pointer-events: none; display: grid; gap: 1px; padding: 6px 10px; border-radius: var(--r-sm); background: var(--surface);
  border: 1px solid var(--line-2); box-shadow: var(--shadow-2); font-size: var(--t-xs); color: var(--ink-2); white-space: nowrap; opacity: 0; transition: opacity .12s; }
.viz-tip.on { opacity: 1; }
.viz-tip b { color: var(--ink); font-size: var(--t-sm); font-weight: 650; }
.viz-note { margin-top: 6px; }
.viz-table { max-height: 340px; overflow: auto; }
.viz-table td.num, .viz-table th.num { text-align: right; font-variant-numeric: tabular-nums; }
.heat { display: grid; gap: var(--s3); }
.heat-grid { display: grid; grid-template-columns: 26px repeat(24, minmax(0, 1fr)); gap: 2px; align-items: center; }
.heat-grid i { display: block; aspect-ratio: 1; border-radius: 3px; background: var(--heat-0); outline-offset: 1px; }
.heat-grid i:hover, .heat-grid i:focus-visible { outline: 2px solid var(--ink-2); }
.heat-d, .heat-h { font-size: 10.5px; color: var(--ink-3); text-align: center; font-variant-numeric: tabular-nums; }
.heat-d { text-align: left; }
.heat i.s0 { background: var(--heat-0); } .heat i.s1 { background: var(--heat-1); } .heat i.s2 { background: var(--heat-2); } .heat i.s3 { background: var(--heat-3); }
.heat i.s4 { background: var(--heat-4); } .heat i.s5 { background: var(--heat-5); } .heat i.s6 { background: var(--heat-6); }
.heat-legend { display: flex; align-items: center; gap: 3px; flex-wrap: wrap; }
.heat-legend i { width: 14px; height: 14px; border-radius: 3px; display: inline-block; }
.heat-legend span { margin: 0 4px; }
.heat-table th, .heat-table td { padding: 4px 6px; font-size: var(--t-xs); }
ol.top { list-style: none; margin: var(--s3) 0 0; padding: 0; display: grid; gap: 0; counter-reset: t; }
ol.top li { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; gap: var(--s2); align-items: center; padding: 7px 0; border-top: 1px solid var(--line); font-size: var(--t-sm); counter-increment: t; }
ol.top li:first-child { border-top: 0; }
ol.top li::before { content: counter(t); color: var(--ink-3); font-size: var(--t-xs); font-variant-numeric: tabular-nums; }
ol.top b { font-variant-numeric: tabular-nums; font-weight: 600; }
.hbars { display: grid; gap: 8px; margin-top: var(--s2); }
.hb { display: grid; grid-template-columns: minmax(110px, 38%) minmax(0, 1fr) auto; gap: var(--s3); align-items: center; font-size: var(--t-sm); }
.hb-t { height: 14px; display: block; }
.hb-t i { display: block; height: 100%; border-radius: 0 4px 4px 0; background: var(--viz-1); min-width: 2px; }
.hb-v { font-variant-numeric: tabular-nums; font-weight: 600; min-width: 2.5em; text-align: right; }
table.an-users td.num, table.an-users th.num, table.ppl .num { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 1024px) { .an-grid, .an-grid.three { grid-template-columns: 1fr; } }

/* ---------- переключатель темы: бегунок переезжает под выбранную кнопку, значки «оживают» ---------- */
[data-theme-seg] { position: relative; isolation: isolate; }
[data-theme-seg] .seg-thumb { position: absolute; z-index: -1; top: 0; left: 0; width: 34px; height: 30px; border-radius: 999px; background: var(--surface);
  box-shadow: 0 1px 2px rgb(0 0 0 / .1), 0 2px 8px -2px rgb(0 0 0 / .1); opacity: 0; pointer-events: none; }
[data-theme-seg].ready .seg-thumb { opacity: 1; transition: transform .24s var(--ease), width .24s var(--ease), background-color .3s; }
[data-theme-seg].ready button.on { background: transparent; box-shadow: none; }
.th-ic { overflow: visible; }
.th-ic .rays, .th-ic .core, .th-ic .moon, .th-ic .half { transform-box: view-box; transform-origin: 12px 12px; }
.th-ic .star { transform-box: fill-box; transform-origin: center; }
.th-light .rays { transform: rotate(-30deg) scale(.8); opacity: .7; transition: transform .3s var(--ease), opacity .3s; }
.th-light .core { transform: scale(.9); transition: transform .3s var(--ease); }
.th-light.on .rays, .th-light.on .core { transform: none; opacity: 1; }
.th-dark .moon { transform: rotate(-16deg) scale(.92); transition: transform .3s var(--ease); }
.th-dark.on .moon { transform: none; }
.th-dark .star { transform: scale(.4); opacity: 0; transition: transform .3s var(--ease), opacity .25s; }
.th-dark.on .star { transform: none; opacity: 1; transition-delay: .06s; }
.th-dark.on .star.s2 { transition-delay: .12s; }
.th-auto .half { transition: transform .4s var(--ease); }
.th-auto.on .half { transform: rotate(180deg); }
[data-theme-seg] button.pop .th-ic { animation: th-pop .24s var(--ease); }
@keyframes th-pop { from { opacity: .4; } }
/* смена темы — короткое перетекание цветов (View Transitions) */
.theme-vt::view-transition-old(root), .theme-vt::view-transition-new(root) { animation-duration: .24s; animation-timing-function: ease-out; }
:root[data-reduce] [data-theme-seg].ready .seg-thumb, :root[data-reduce] .th-ic .rays, :root[data-reduce] .th-ic .core, :root[data-reduce] .th-ic .moon, :root[data-reduce] .th-ic .star, :root[data-reduce] .th-ic .half { transition: none; }
:root[data-reduce] [data-theme-seg] button.pop .th-ic { animation: none; }

/* ---------- уведомления: удалить одно, очистить прочитанные или все ---------- */
.nk-note-row { position: relative; border-radius: var(--r-sm); transition: background-color .15s, opacity .2s, transform .22s var(--ease); }
.nk-note-row:hover { background: var(--fill); }
.nk-note-row.new { background: var(--accent-soft); }
.nk-note-row.new:hover { background: var(--accent-soft-2); }
.nk-note-row .nk-note { padding-right: 40px; background: transparent; }
.nk-note-row .nk-note:hover { background: transparent; }
.nk-note-x { position: absolute; top: 8px; right: 6px; width: 30px; height: 30px; border: 0; border-radius: 50%; background: transparent; color: var(--ink-3);
  display: grid; place-items: center; cursor: pointer; opacity: 0; transition: opacity .15s, background-color .15s, color .15s; }
.nk-note-row:hover .nk-note-x, .nk-note-x:focus-visible { opacity: 1; }
.nk-note-x:hover { background: var(--fill-2); color: var(--ink); }
@media (hover: none) { .nk-note-x { opacity: 1; } }
.nk-note-row.out { opacity: 0; transform: translateX(18px); }
.nk-notes-f { display: flex; align-items: center; gap: 4px; padding: 8px; border-top: 1px solid var(--line); }
.nk-notes-f .spacer { flex: 1; }
.nk-note-ic.k-idea_reply, .nk-note-ic.k-idea_message { background: var(--accent-soft); color: var(--accent-text); }
.nk-note-ic.k-idea_status { background: var(--ok-soft); color: var(--ok-t); }
.nk-note-ic.k-idea_status.s-work { background: var(--major-soft); color: var(--major-t); }
.nk-note-ic.k-idea_status.s-declined { background: var(--crit-soft); color: var(--crit-t); }

/* ---------- предложения: цвет статуса, список, переписка ---------- */
.st-new { --tk: var(--minor); } .st-seen { --tk: var(--info); } .st-work { --tk: var(--major); } .st-done { --tk: var(--ok); } .st-declined { --tk: var(--crit); }
.tk-chip .dot { background: currentColor; }
.tk-list { display: grid; gap: 8px; margin-top: var(--s4); max-height: min(56vh, 520px); overflow: auto; padding: 2px; }
.tk-item { position: relative; display: grid; gap: 8px; width: 100%; text-align: left; padding: 12px 14px 12px 18px; border-radius: var(--r-md);
  border: 1px solid var(--line); background: var(--surface); color: var(--ink); cursor: pointer; overflow: hidden; font: inherit; transition: border-color .18s, background-color .18s; }
.tk-item::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--tk, var(--info)); }
.tk-item:hover { border-color: var(--line-2); background: var(--surface-2); }
.tk-item.unread { border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
.tk-txt { font-size: var(--t-sm); overflow-wrap: anywhere; white-space: pre-line; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.tk-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.tk-chat { margin-top: var(--s4); }
.tk-thread { display: flex; flex-direction: column; gap: 10px; max-height: min(46vh, 440px); min-height: 120px; overflow: auto; padding: 12px; border-radius: var(--r-md);
  background: var(--sunken); border: 1px solid var(--line); }
.tk-msg { display: flex; } .tk-msg.me { justify-content: flex-end; }
.tk-b { max-width: min(80%, 560px); padding: 9px 13px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); font-size: var(--t-sm);
  line-height: 1.45; overflow-wrap: anywhere; }
.tk-text { white-space: pre-wrap; }
.tk-msg.them .tk-b { border-bottom-left-radius: 5px; }
.tk-msg.me .tk-b { background: var(--accent-fill); color: var(--on-accent); border-color: transparent; border-bottom-right-radius: 5px; }
.tk-msg.them.first .tk-b { border-left: 3px solid var(--tk, var(--accent)); }
.tk-who { font-size: 11px; font-weight: 600; opacity: .72; margin-bottom: 3px; white-space: normal; }
.tk-reply { display: flex; gap: 8px; align-items: flex-end; margin-top: 10px; }
.tk-reply textarea { flex: 1; min-height: 46px; resize: vertical; }
.tk-reply .btn { width: 46px; height: 46px; padding: 0; flex: none; }
/* администрирование: фильтр по цвету статуса, группы, обращение */
.tk-filters { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: var(--s4); }
.tk-f { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface);
  color: var(--ink-2); font: 500 var(--t-sm)/1 var(--font); cursor: pointer; transition: border-color .18s, background-color .18s, color .18s; }
.tk-f:hover { color: var(--ink); border-color: var(--line-2); }
.tk-f .dot { background: var(--tk, var(--accent)); }
.tk-f b { font-variant-numeric: tabular-nums; font-weight: 650; color: var(--ink); }
.tk-f.on { background: color-mix(in srgb, var(--tk, var(--accent)) 12%, var(--surface)); border-color: color-mix(in srgb, var(--tk, var(--accent)) 55%, transparent); color: var(--ink); }
.tk-group { margin-top: var(--s5); }
.tk-group:first-child { margin-top: 0; }
.tk-group h3 { display: flex; align-items: center; gap: 8px; font-size: var(--t-sm); margin: 0 0 8px; }
.tk-group h3 .dot { background: var(--tk); width: 10px; height: 10px; }
.tk-group h3 .muted { font-weight: 500; }
.tk-group .tk-list { margin-top: 0; max-height: none; overflow: visible; }
.tk-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; }
.tk-st { display: flex; flex-wrap: wrap; gap: 6px; }
.tk-st button { display: inline-flex; align-items: center; gap: 7px; min-height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--line);
  background: var(--surface); color: var(--ink-2); font: 500 var(--t-sm)/1 var(--font); cursor: pointer; }
.tk-st button .dot { background: var(--tk, var(--info)); }
.tk-st button:hover { color: var(--ink); border-color: var(--line-2); }
.tk-st button[aria-pressed="true"] { background: color-mix(in srgb, var(--tk, var(--info)) 14%, var(--surface)); border-color: color-mix(in srgb, var(--tk, var(--info)) 60%, transparent); color: var(--ink); font-weight: 600; }
.tk-keep { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tk-keep input { width: 90px; }
@media (pointer: coarse) { .tk-f, .tk-st button { min-height: 40px; } .swatch { width: 40px; height: 40px; } }

/* ---------- базы норм: разделы «Норм РФ» ---------- */
.bases-hint { margin: -4px 0 var(--s3); max-width: 760px; text-wrap: pretty; }
.parts-grid { margin-bottom: var(--s6); }
.base.part .bi { transition: background-color .2s, color .2s; }
.base.part[data-part="fire"] .bi { background: var(--crit-soft); color: var(--crit-t); }
.base.part[data-part="access"] .bi { background: var(--ok-soft); color: var(--ok-t); }
.base.part[data-part="laws"] .bi { background: var(--major-soft); color: var(--major-t); }
.base.part.off .bi { background: var(--fill); color: var(--ink-3); }
.base .crit-t { color: var(--crit-t); }
/* узкая карточка: у кнопок «Загрузить» и «Обновить» остаётся только значок */
.base { container-type: inline-size; }
@container (max-width: 17.5em) { .base .foot .opt-t { display: none; } }
tr.moved td { background: var(--ok-soft); transition: background-color .4s; }
select[data-move] { width: 100%; min-width: 150px; max-width: 220px; }
/* выбор баз и разделов для одной проверки */
.part-picks { display: flex; flex-wrap: wrap; gap: 6px; }
.part-picks .toggle-chip .ic { flex: none; }
.part-picks .toggle-chip.fire[aria-pressed="true"] { --tc: var(--crit); }
.picks-h { display: flex; align-items: center; gap: 8px; margin: 14px 0 6px; font-size: var(--t-xs); font-weight: 600; color: var(--ink-3); }
.picks-h .spacer { flex: 1; }
.picks-h .btn { font-weight: 500; }

/* ---------- «Система» в реальном времени: метка, плитки, мини-графики (один ряд — один цвет) ---------- */
.live-badge { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 0 12px; border-radius: 999px; background: var(--ok-soft);
  color: var(--ok-t); font-size: var(--t-sm); font-weight: 600; white-space: nowrap; }
.live-badge i { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); animation: nk-pulse 1.6s ease-in-out infinite; }
.live-badge.off { background: var(--fill); color: var(--ink-2); } .live-badge.off i { background: var(--ink-3); animation: none; }
.live-badge.err { background: var(--crit-soft); color: var(--crit-t); } .live-badge.err i { background: var(--crit); animation: none; }
.page-head .live-badge + .btn { margin-left: 8px; }
.sys-kpis { --tile: 190px; }  /* «157,1 МБ», «4 мин 45 с» — в одну строку */
.sys-kpis .kpi .v { font-variant-numeric: tabular-nums; transition: color .3s; white-space: nowrap; }
.sys-charts { --tile: 240px; display: grid; grid-template-columns: repeat(auto-fit, minmax(var(--tile), 1fr)); gap: var(--s3); margin: var(--s4) 0; }
.sys-charts .card { margin: 0; padding: var(--s4); }
.spark-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 6px; min-width: 0; }
.spark-h b { font-size: var(--t-md); white-space: nowrap; }
.spark { position: relative; height: 70px; }
.spark svg { width: 100%; height: 100%; display: block; overflow: visible; }
.spark .grid { stroke: var(--line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.spark .base { stroke: var(--line-3); stroke-width: 1; vector-effect: non-scaling-stroke; }
.spark-line { fill: none; stroke: var(--viz-1); stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.spark-area { fill: color-mix(in srgb, var(--viz-1) 14%, transparent); stroke: none; }
.spark-dot { fill: var(--viz-1); stroke: var(--surface); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.spark-x { display: flex; justify-content: space-between; margin-top: 4px; }
:root[data-reduce] .live-badge i { animation: none; }

/* ---------- «Нормы и актуальность»: компактная сводка, вкладки, таблица в своём окне ---------- */
.nh { display: flex; gap: var(--s4); align-items: flex-start; padding: var(--s4) var(--s5); }
.nh-main { flex: 1; min-width: 0; display: grid; gap: 8px; }
.nh-stats { display: flex; flex-wrap: wrap; gap: 6px; }
.nh-s { display: inline-flex; align-items: baseline; gap: 5px; min-height: 30px; padding: 4px 11px; border-radius: 999px; border: 1px solid var(--line);
  background: var(--surface); color: var(--ink-2); font: 500 var(--t-sm)/1.2 var(--font); cursor: pointer; transition: border-color .15s, background-color .15s; }
@media (pointer: coarse) { .nh-s { min-height: 40px; align-items: center; } }
.nh-s b { color: var(--ink); font-weight: 700; }
.nh-s:hover { border-color: var(--line-2); background: var(--surface-2); }
.nh-s.ok b { color: var(--ok-t); } .nh-s.old b { color: var(--crit-t); } .nh-s.unk b { color: var(--major-t); } .nh-s.reg b { color: var(--accent-text); }
.nh-s.faint { color: var(--ink-3); }
.nh-run { margin-top: 2px; }
.nh-log summary { cursor: pointer; font-size: var(--t-sm); color: var(--ink-2); display: inline-flex; align-items: center; gap: 4px; }
.nh-log[open] summary .ic { transform: rotate(180deg); }
.nh-log .msglog { margin-top: 6px; max-height: 160px; }
.nh-act { display: flex; gap: 8px; align-items: center; flex: none; }
.nt-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: var(--s4) 0 var(--s3); }
.nt-panel { margin: 0; padding: var(--s3) var(--s4) var(--s3); }
.nt-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.nt-tools input[type=search] { flex: 1 1 220px; width: auto; min-width: 0; }
.nt-scroll { max-height: max(320px, calc(100vh - 360px)); overflow: auto; border: 1px solid var(--line); border-radius: var(--r-md); overscroll-behavior: contain; }
.nt-scroll table { margin: 0; }
.nt-scroll thead th { position: sticky; top: 0; z-index: 1; background: var(--surface); box-shadow: 0 1px 0 var(--line); }
.nt-table td { vertical-align: top; padding-top: 8px; padding-bottom: 8px; }
.nt-table td.num, .nt-table th.num { text-align: right; }
.clamp2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nt-pager { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.nt-pages { display: flex; align-items: center; gap: 2px; }
.nt-pages .btn { min-width: 32px; }
#ntLog .log { max-height: max(320px, calc(100vh - 340px)); overflow: auto; }
.pop-form { display: grid; gap: 12px; padding: 12px; }
@media (max-width: 700px) {
  .nh { flex-direction: column; padding: var(--s4); } .nh-act { width: 100%; } .nh-act .btn.primary { flex: 1; }
  .nt-scroll { max-height: none; } .nt-pager { justify-content: center; }
}

/* ---------- загрузка документов со сверкой ---------- */
.im-run { margin-top: var(--s4); }
.im-report { margin-top: var(--s3); }
.im-sum { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.im-tbl { max-height: min(52vh, 460px); overflow: auto; border: 1px solid var(--line); border-radius: var(--r-md); }
.im-tbl thead th { position: sticky; top: 0; background: var(--surface); box-shadow: 0 1px 0 var(--line); z-index: 1; }
.im-tbl td { vertical-align: top; }
#bfKind.wrap button { min-height: 40px; }

/* ---------- переписка с файлами (сотрудник ↔ руководитель, руководитель ↔ администратор) ---------- */
.tk-att { display: grid; gap: 4px; margin-top: 8px; }
.tk-file { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 6px 10px; border-radius: var(--r-sm); background: var(--fill); color: inherit;
  text-decoration: none; font-size: var(--t-xs); font-weight: 600; white-space: normal; }
.tk-file:hover { background: var(--fill-2); text-decoration: none; }
.tk-file i { font-style: normal; font-weight: 500; opacity: .7; white-space: nowrap; margin-left: auto; padding-left: 6px; }
.tk-msg.me .tk-file { background: rgb(255 255 255 / .18); color: var(--on-accent); }
.tk-msg.me .tk-file:hover { background: rgb(255 255 255 / .28); }
.tk-acts { margin-top: 6px; display: flex; gap: 6px; flex-wrap: wrap; white-space: normal; }
.tk-acts .btn { margin-left: -8px; }
.tk-empty { text-align: center; padding: 18px 8px; }
.tk-reply { flex-wrap: wrap; }
.tk-reply .tk-pending { flex: 1 0 100%; display: flex; flex-wrap: wrap; gap: 6px; }
.tk-reply .tk-pending[hidden] { display: none; }
.tk-pf button { border: 0; background: transparent; color: inherit; padding: 0 0 0 2px; cursor: pointer; display: inline-grid; place-items: center; }
.tk-reply .tk-attach { width: 46px; height: 46px; padding: 0; flex: none; cursor: pointer; }
.tk-ro { display: flex; align-items: center; gap: 6px; margin-top: 10px; }
.team-mgrs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.team-mgr { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px 4px 4px; border-radius: 999px; background: var(--fill); font-size: var(--t-sm); font-weight: 600; }
.team-mgr img, .team-mgr i { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; display: grid; place-items: center; font: 600 11px/1 var(--font);
  font-style: normal; background: var(--accent-fill); color: var(--on-accent); }
.fwd-q { margin: 12px 0 0; padding: 10px 14px; border-left: 3px solid var(--accent); background: var(--fill); border-radius: 0 var(--r-sm) var(--r-sm) 0;
  font-size: var(--t-sm); white-space: pre-wrap; overflow-wrap: anywhere; max-height: 200px; overflow: auto; }

/* ---------- руководитель: сообщения сотрудников (список и разговор) ---------- */
.msg-layout { display: grid; grid-template-columns: minmax(240px, 320px) minmax(0, 1fr); gap: var(--s4); align-items: start; }
.msg-layout > .card { margin: 0; }
.msg-list { padding: var(--s3); display: grid; gap: 8px; max-height: calc(100vh - 230px); min-height: 320px; grid-template-rows: auto minmax(0, 1fr); }
.msg-items { overflow: auto; display: grid; gap: 2px; align-content: start; margin: 0 -4px; padding: 0 4px; }
.msg-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; width: 100%; padding: 8px; border: 0; border-radius: var(--r-sm);
  background: transparent; color: var(--ink); text-align: left; cursor: pointer; font: inherit; }
.msg-item:hover { background: var(--fill); }
.msg-item.on { background: var(--accent-soft); }
.msg-it { display: grid; gap: 2px; min-width: 0; }
.msg-item.unread b { color: var(--accent-text); }
.msg-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); }
.msg-main { padding: var(--s4); min-height: 320px; }
.msg-head { display: flex; align-items: center; gap: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--line); min-width: 0; }
.msg-back { display: none !important; }
.msg-main .tk-thread { max-height: calc(100vh - 380px); min-height: 220px; }
.msg-main, .msg-list, .msg-head > div { min-width: 0; }
@media (max-width: 900px) {
  .msg-layout { grid-template-columns: minmax(0, 1fr); }
  .msg-layout.open .msg-list { display: none; }
  .msg-layout:not(.open) .msg-main { display: none; }
  .msg-back { display: inline-grid !important; }
  .msg-list { max-height: none; }
}

/* ---------- доступные базы норм (руководитель, администратор) ---------- */
.ne-h { font-size: var(--t-xs); font-weight: 600; color: var(--ink-3); margin: 12px 0 6px; }
.ne-h:first-child { margin-top: 0; }
.ne-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px; }
.ne-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--r-md); border: 1px solid var(--line); background: var(--surface); min-width: 0;
  transition: opacity .2s, background-color .2s; }
.ne-item.off { background: var(--fill); }
.ne-item.off .ne-t b { color: var(--ink-3); }
.ne-ic { width: 30px; height: 30px; border-radius: var(--r-sm); display: grid; place-items: center; flex: none; background: var(--accent-soft); color: var(--accent-text); }
.ne-item.off .ne-ic { background: var(--fill-2); color: var(--ink-3); }
.ne-t { flex: 1; min-width: 0; display: grid; gap: 1px; font-size: var(--t-sm); }
.ne-t small { font-size: var(--t-xs); color: var(--ink-3); }

/* ---------- отделы и руководители ---------- */
.dep-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--s3); margin-bottom: var(--s4); }
.dep-card { margin: 0; display: flex; flex-direction: column; }
.dep-card > .row:last-child { margin-top: auto !important; padding-top: 12px; }
.dep-mgrs { display: grid; gap: 6px; }
.dep-pick { border: 1px solid var(--line); border-radius: var(--r-md); padding: 8px; background: var(--surface); }
.dep-pick .dep-q { width: 100%; margin-bottom: 6px; }
.dep-opts { max-height: 300px; overflow: auto; display: grid; gap: 2px; }
.dep-opt { display: flex; align-items: center; gap: 10px; padding: 6px; border-radius: var(--r-sm); cursor: pointer; }
.dep-opt:hover { background: var(--fill); }
.dep-opt:has(input:checked) { background: var(--accent-soft); }
.dep-opt[hidden] { display: none; }
.tq-row { grid-template-columns: 140px minmax(0, 1fr) auto !important; align-items: start !important; }
@media (max-width: 700px) { .tq-row { grid-template-columns: 1fr !important; } }

/* телефон: значения плиток показателей мельче */
@media (max-width: 700px) { .kpi.tile .v { font-size: calc(24px * var(--fk)); } .sys-kpis { --tile: 150px; } }