:root{
  --font-display:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;
  --font-body:"Inter","Segoe UI",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;

  /* light palette — Snap Lab brand (orange / deep blue / pale gray / white) */
  --bg:#eef6f5;
  --surface:#ffffff;
  --surface-2:#e4f4f3;
  --surface-3:#d7ebe9;
  --border:#cee2e0;
  --border-strong:#b4d2ce;
  --text:#011d2b;
  --text-2:#37535c;
  --muted:#6a848a;
  --accent:#ff5d00;
  --accent-fg:#ffffff;
  --accent-soft:#ffe6d6;
  --ok:#1a7f37;
  --ok-soft:#daf0e0;
  --warn:#9a7400;
  --warn-soft:#f6edcf;
  --crit:#c92a2a;
  --crit-soft:#fadedd;
  --dept-pp:#2f6b7d;
  --dept-mont:#7a6a5a;
  --dept-ai:#6d5f86;
  --shadow:0 1px 2px rgba(1,29,43,.06),0 10px 26px -14px rgba(1,29,43,.20);
  --scrim:rgba(3,20,29,.4);
  --radius:10px;
  --field:#f5f9f9;
  --field-border:#c6dcd9;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#01141d;
    --surface:#04202e;
    --surface-2:#082a3a;
    --surface-3:#0e3446;
    --border:#1a4356;
    --border-strong:#2c5c72;
    --text:#eef6f5;
    --text-2:#a7c1c7;
    --muted:#75939b;
    --accent:#ff5d00;
    --accent-fg:#ffffff;
    --accent-soft:#3a1c0b;
    --ok:#46c76a;
    --ok-soft:#0f2c1b;
    --warn:#e0a83a;
    --warn-soft:#33280f;
    --crit:#ff6b6b;
    --crit-soft:#3a1719;
    --dept-pp:#6fb7c9;
    --dept-mont:#c6ac8b;
    --dept-ai:#b6a0d6;
    --shadow:0 1px 2px rgba(0,0,0,.5),0 14px 36px -18px rgba(0,0,0,.7);
    --scrim:rgba(0,0,0,.56);
    --field:#0a2836;
    --field-border:#2b5468;
  }
}
:root[data-theme="dark"]{
  --bg:#01141d;
  --surface:#04202e;
  --surface-2:#082a3a;
  --surface-3:#0e3446;
  --border:#1a4356;
  --border-strong:#2c5c72;
  --text:#eef6f5;
  --text-2:#a7c1c7;
  --muted:#75939b;
  --accent:#ff5d00;
  --accent-fg:#ffffff;
  --accent-soft:#3a1c0b;
  --ok:#46c76a;
  --ok-soft:#0f2c1b;
  --warn:#e0a83a;
  --warn-soft:#33280f;
  --crit:#ff6b6b;
  --crit-soft:#3a1719;
  --dept-pp:#6fb7c9;
  --dept-mont:#c6ac8b;
  --dept-ai:#b6a0d6;
  --shadow:0 1px 2px rgba(0,0,0,.5),0 14px 36px -18px rgba(0,0,0,.7);
  --scrim:rgba(0,0,0,.56);
  --field:#0a2836;
  --field-border:#2b5468;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
/* убираем pinch-zoom / двойной тап на телефоне (viewport meta уже это делает в большинстве браузеров, это — подстраховка) */
html,body{touch-action:manipulation}

/* ---------- unified custom scrollbars (both themes, everywhere) ---------- */
*{scrollbar-width:thin;scrollbar-color:var(--muted) transparent}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--muted);border-radius:8px;border:3px solid transparent;background-clip:padding-box;min-height:36px}
::-webkit-scrollbar-thumb:hover,::-webkit-scrollbar-thumb:active{background:var(--text-2);background-clip:padding-box}
::-webkit-scrollbar-corner{background:transparent}
body{
  margin:0;background:var(--surface);color:var(--text);
  font-family:var(--font-body);font-size:14px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;margin:0;line-height:1.2;text-wrap:balance;letter-spacing:-.01em}
a{color:inherit;text-decoration:none}
button{font-family:inherit;font-size:inherit;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}

/* ---------- theme switch: circular reveal (View Transitions) ---------- */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:0}
::view-transition-new(root){z-index:1;animation:vt-reveal .45s cubic-bezier(.4,0,.2,1) forwards}
@keyframes vt-reveal{
  from{clip-path:circle(0% at var(--vt-x,50%) var(--vt-y,50%))}
  to{clip-path:circle(150% at var(--vt-x,50%) var(--vt-y,50%))}
}
@keyframes theme-ico{from{transform:rotate(-45deg) scale(.6);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){::view-transition-new(root){animation:none}}

/* ---------- shell ---------- */
/* grid-template-columns is animated imperatively in toggleMenu() — a stylesheet
   transition on this property freezes in Chrome, so it must NOT be declared here */
.app{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh;background:var(--surface)}
.app.nav-closed{grid-template-columns:0px minmax(0,1fr)}
.sidebar{
  background:var(--surface);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:hidden;
  transition:transform .28s cubic-bezier(.4,0,.2,1)
}
.app.nav-closed .sidebar{transform:translateX(-100%)}
@media (prefers-reduced-motion:reduce){.sidebar{transition:none}}
.brand{flex:none;display:flex;align-items:center;padding:18px 18px 14px}
.brand-logo{display:block;width:86px;height:auto}
.brand-logo--dark{display:none}
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .brand-logo--light{display:none}
  :root:not([data-theme="light"]) .brand-logo--dark{display:block}
}
:root[data-theme="dark"] .brand-logo--light{display:none}
:root[data-theme="dark"] .brand-logo--dark{display:block}
.nav{padding:6px 10px 18px;display:flex;flex-direction:column;gap:2px;flex:1 1 auto;overflow-y:auto;min-height:0}
.nav-label{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);padding:14px 10px 6px}
.nav-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:var(--text-2);font-weight:500;border:1px solid transparent}
.nav-item:hover{background:var(--surface-2);color:var(--text)}
.nav-item.active{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.nav-item .ico{color:var(--muted);flex:none}
.nav-item.active .ico{color:var(--accent-fg)}
.nav-item .count{margin-left:auto;font-size:11px;font-weight:700;background:var(--surface-2);color:var(--text);padding:1px 7px;border-radius:999px}
.nav-item.active .count{background:var(--accent-fg);color:var(--accent)}
.sidebar-foot{margin-top:auto;padding:12px;display:flex;flex-direction:column;gap:8px}
/* .viewas-trig — <button>, а не <div>: без явного border:0;background:none тут «прорывался»
   нативный фон кнопки браузера (в тёмной теме — чисто белый, в светлой — просто выглядел как
   готовый серый и потому казался «нормальным»). Плашки в покое быть не должно вообще —
   фон только при наведении, тем же surface-3, что и везде в приложении. */
.viewas-trig{cursor:pointer;border:0;width:100%;text-align:left;background:none;border-radius:10px;padding:4px 8px 4px 10px;transition:background .12s}
.viewas-trig:hover{background:var(--surface-3)}
/* модалка «Смотреть как» — простой кликабельный список, сгруппированный как на «Команде».
   Раньше шапка была на голом .modal-head (крестик — обычная плоская iconbtn, не наш круглый
   .wm-x), а верхняя строка «Я» — с квадратными углами и линией-разделителем на всю ширину,
   единственное такое место в приложении (везде либо карточка, либо круглая пилюля, границ
   между блоками нет). Приводим к общему языку: круглый крестик как у карточек, все строки
   списка — одинаковые скруглённые пилюли без исключений. */
.viewas-modal{max-width:400px}
.viewas-modal .modal-head{padding:18px 20px 12px;border-bottom:0}
.viewas-modal .modal-head h3{font-size:17px}
.viewas-modal .modal-head .iconbtn{width:34px;height:34px;border-radius:999px;background:var(--surface-2);color:var(--text-2);transition:background .15s,color .15s,transform .2s}
.viewas-modal .modal-head .iconbtn:hover{background:var(--surface-3);color:var(--text);transform:rotate(90deg)}
.viewas-modal .modal-body{padding:6px 12px 16px;max-height:70vh;overflow-y:auto}
.viewas-row{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:0;background:none;border-radius:12px;cursor:pointer;text-align:left;font:inherit;color:inherit;transition:background .12s}
.viewas-row:hover{background:var(--surface-3)}
.viewas-row.on{background:var(--accent-soft)}
.viewas-row.viewas-self{margin-bottom:6px}
.viewas-row .avatar{flex:none}
.viewas-i{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.viewas-i .n{font-size:13.5px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.viewas-i .r{font-size:12px;color:var(--muted)}
.viewas-ck{color:var(--accent);flex:none;width:18px;height:18px}
.viewas-sec .viewas-h{font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.02em;padding:10px 10px 6px}

/* «Жалобы» — кнопка на странице команды: всегда «тревожная» красная плашка, не просто
   btn--edit-призрак — чтобы не терялась рядом с оранжевой «Добавить сотрудника» */
.tm-complaints-btn{position:relative;background:var(--crit-soft)!important;color:var(--crit)!important;border-color:transparent!important;box-shadow:none;transition:background .15s,color .15s,box-shadow .2s}
.tm-complaints-btn:hover{background:linear-gradient(180deg,color-mix(in srgb,var(--crit) 80%,#fff),var(--crit))!important;color:#fff!important;box-shadow:0 10px 20px -10px rgba(255,80,80,.85),inset 0 1px 0 rgba(255,255,255,.25)}
/* .btn--edit .ico задаёт серый цвет по умолчанию — перебиваем, иконка должна быть красной сразу */
.tm-complaints-btn .ico{color:var(--crit)!important}
.tm-complaints-btn:hover .ico{color:#fff!important}
.tm-complaints-btn .badge{margin-left:2px!important;padding:0 6px!important;height:18px!important;background:#fff!important;color:var(--crit)!important}

/* модалка — в стиле остальных карточных диалогов (cf-modal: иконка+заголовок), но с
   ФИКСИРОВАННОЙ высотой (не «по контенту»): .cpl-modal сам — flex-колонка (cf-h сверху,
   не двигается), а .modal-body делится на две колонки-секции, каждая — СВОЯ шапка (не
   скроллится) + СВОЙ скролл только для списка карточек. На телефоне колонки идут одна над
   другой и делят высоту .modal-body поровну (тоже каждая со своим скроллом), на широком
   экране — встают рядом (рассмотренные слева). */
/* min-width:0 по всей цепочке flex-контейнеров ниже — иначе классический баг «flex-item не
   сжимается уже своего min-content» толкает всю модалку шире экрана на телефоне вместо того,
   чтобы строка фильтров просто перенеслась (flex-wrap сам по себе это не чинит). */
.cpl-modal{max-width:600px!important;min-width:0;height:min(680px,80vh);display:flex;flex-direction:column;overflow:hidden}
.cpl-modal .cf-h{flex:none}
.cpl-modal .cpl-empty{flex:1}
.cpl-modal .modal-body{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;gap:14px;padding:0!important;overflow:hidden}
/* телефон: колонки друг над другом делили бы высоту пополам — списку оставалось бы всего
   ~230px, едва одна карточка видна. Вместо этого — таб-переключатель, показываем только
   активную секцию, ей достаётся вся высота модалки. Шапка колонки (.cpl-h) в этом режиме
   не нужна — её роль играют сами табы. */
.cpl-tabs{flex:none;display:flex;gap:4px;padding:4px;margin-bottom:10px;border-radius:14px;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border)}
.cpl-tab{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:5px;height:36px;border:0;border-radius:999px;background:transparent;color:var(--muted);font:inherit;font-size:12.5px;font-weight:700;white-space:nowrap;padding:0 4px;cursor:pointer;transition:background .15s,color .15s}
.cpl-tab .count{flex:none;background:var(--surface-3);color:var(--text-2);font-size:11px;font-weight:700;padding:1px 6px;border-radius:999px}
.cpl-tab.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)}
.cpl-tab.on .count{background:rgba(255,255,255,.25);color:#fff}
.cpl-modal--tabs .cpl-col-head .cpl-h{display:none}
.cpl-modal--tabs .cpl-col-head .cpl-filters{padding-top:2px}
/* телефон: «На рассмотрении» в табе переносилось на 2 строки, «Отправитель»+«Дата» в
   «Рассмотренные» не помещались рядом — тесновато с полями модалки (24/26/22 от .cf-modal)
   и с внутренними отступами самих плашек-фильтров. Ужимаем и то, и другое. */
@media(max-width:640px){
  .cpl-modal{padding:20px 14px 14px!important}
  .cpl-filters .dd-trigger{height:34px!important;padding:0 8px 0 10px!important;gap:4px;font-size:11.5px}
  .cpl-filters-row{gap:6px}
  .cpl-filters-row .dd{width:auto!important;min-width:0}
}
@media(min-width:900px){
  .cpl-modal{max-width:min(1220px,calc(100vw - 48px))!important}
  .cpl-modal .modal-body{flex-direction:row;gap:0 24px}
  .cpl-col--open{order:2}
  .cpl-col--closed{order:1}
}
.cpl-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:30px 10px}
.cpl-empty svg{width:28px;height:28px;color:var(--crit);opacity:.7}
.cpl-empty p{margin:0;font-size:14px;font-weight:600;color:var(--text)}
.cpl-empty span{font-size:12.5px;color:var(--muted);max-width:280px}
/* колонка: шапка фиксирована (flex:none), список карточек — единственное, что скроллится */
.cpl-col{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.cpl-col-head{flex:none;min-width:0}
.cpl-col-body{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding-bottom:2px}
.cpl-h{font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.02em;padding:10px 2px 8px;display:flex;align-items:center;gap:6px}
.cpl-h .count{background:var(--surface-3);color:var(--text-2);font-size:11px;font-weight:700;padding:1px 7px;border-radius:999px}
/* фильтры относятся только к «Рассмотренные» — чтобы не засорять историю, очередь на
   рассмотрении всегда показывается целиком без фильтра. Отправитель+дата в одном ряду,
   департамент — отдельным рядом под ними. Круглые плашки — тот же стиль/анимация (glow при
   открытии), что у «Ведомость» на Зарплатах: .rc-trig и .pay-md .dd-trigger. */
.cpl-filters{display:flex;flex-direction:column;gap:8px;padding:0 2px 10px;min-width:0}
.cpl-filters-row{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
/* .dd-trigger:not(.tm-kb) в базовых стилях (:root ...) специфичнее обычного 2-классового
   селектора (:not() считает специфичность своего аргумента) — без !important не перебить */
.cpl-filters .dd-trigger{height:36px!important;border-radius:999px!important;padding:0 12px 0 16px!important;gap:8px;font-size:12.5px;font-weight:700;background:var(--field)!important;border:1px solid var(--field-border)!important;color:var(--text);box-shadow:none;transition:background .15s,border-color .15s,box-shadow .2s}
.cpl-filters .dd.open .dd-trigger{background:var(--surface)!important;border-color:var(--accent)!important;box-shadow:0 0 0 4px var(--accent-soft)!important}
.cpl-nomatch{margin:0;padding:22px 10px;text-align:center;color:var(--muted);font-size:13px}
/* карточка жалобы — высота по контенту (не фиксированная: текста бывает то много, то мало,
   обрезать многоточием не нужно — пусть просто растёт под текст) */
.cpl-row{flex:none;padding:13px;border-radius:14px;background:var(--surface-3)}
:root[data-theme="light"] .cpl-row{background:#f1f1f1}
.cpl-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.cpl-reporter{display:flex;align-items:center;gap:10px;min-width:0}
.cpl-date{font-size:12px;color:var(--muted);flex:none}
.cpl-text{margin:8px 0;font-size:13.5px;color:var(--text);line-height:1.45}
.cpl-row .kb-file{margin:0 0 8px}
.cpl-foot{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.cpl-acts{display:flex;gap:8px}
.cpl-fine{background:var(--crit-soft)!important;border-color:transparent!important;color:var(--crit)!important}
.cpl-fine:hover{background:linear-gradient(180deg,color-mix(in srgb,var(--crit) 80%,#fff),var(--crit))!important;color:#fff!important}

/* крестик закрытия в иконных модалках (cf-h) — раньше «оживлённое» вращение при наведении
   было только у modal-head, а .cf-modal явно исключался (:not(.cf-modal)) — теперь и здесь
   такое же поведение, как в модалках Зарплаты/Расходы */
.cf-h .iconbtn{width:34px;height:34px;border-radius:50%;background:var(--surface-2);color:var(--text-2);transition:background .15s,color .15s,transform .2s}
.cf-h .iconbtn:hover{background:var(--surface-3);color:var(--text);transform:rotate(90deg)}
:root[data-theme="light"] .cf-h .iconbtn{background:#f1f1f1}

.topbar{
  position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;
  padding:calc(12px + var(--tg-safe-top,0px)) 26px 12px;background:var(--bg);border-bottom:1px solid var(--border);
  border-radius:12px 12px 0 0
}
.topbar h1{font-size:17px}
.topbar .crumb{color:var(--muted);font-family:var(--font-body);font-weight:500;font-size:12.5px}
.topbar-sep{flex:none;width:1px;height:20px;background:var(--border-strong);margin:0 -2px}
.search{display:flex;align-items:center;gap:8px;margin-left:6px;height:33px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:0 13px;color:var(--muted);min-width:210px;transition:box-shadow .12s ease,border-color .12s ease}
.topbar .dd--auto{margin-left:auto}
.search input{border:0;background:transparent;color:var(--text);outline:0;width:100%;font-size:12.5px;font-weight:600}
.search .ico{transition:color .12s ease}
.search input::placeholder{color:var(--muted);font-weight:600;transition:color .12s ease}
.search:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.06)}
.search:hover,.search:focus-within{border-color:var(--border-strong);color:var(--text)}
.search:hover input::placeholder{color:var(--text)}
@media (prefers-reduced-motion:reduce){.search,.search .ico,.search input::placeholder{transition:none}}
.iconbtn{width:33px;height:33px;display:grid;place-items:center;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text-2);position:relative}
.iconbtn:hover{color:var(--text);border-color:var(--border-strong)}
.iconbtn .dot{position:absolute;top:6px;right:6px;width:7px;height:7px;border-radius:999px;background:var(--crit);border:2px solid var(--surface)}
.topbar .iconbtn{color:var(--text);transition:box-shadow .12s ease,border-color .12s ease}
.topbar .iconbtn:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.06)}
.topbar .iconbtn:active{box-shadow:inset 0 0 0 999px rgba(0,0,0,.12)}
.topbar .menu-toggle{border:0;background:none;margin-left:-8px}
.topbar .menu-toggle:hover{background:var(--surface-2)}
@media (prefers-reduced-motion:reduce){.topbar .iconbtn{transition:none}}
.dd--auto{flex:none}
.dd--auto .dd-trigger{width:auto;height:33px;padding:0 11px 0 13px;gap:7px;background:var(--surface);border-color:var(--border);font-size:12.5px;font-weight:600}
.dd--auto .dd-trigger:hover{background:var(--surface-2);border-color:var(--border)}
.dd--auto .dd-menu{left:0;right:auto;min-width:100%;width:max-content;transform-origin:top left}
.dd--auto .dd-opt{white-space:nowrap;gap:20px}
/* фильтр категорий на «Подрядчиках» — тот же внешний вид/анимация, что у «Вид: Директор» в хедере */
#actorCatFilter .dd-trigger{width:auto;height:33px;padding:0 11px 0 13px;gap:7px;background:var(--surface);border-color:var(--border);font-size:12.5px;font-weight:600}
#actorCatFilter:not(.open) .dd-trigger:hover{background:var(--surface-2);border-color:var(--border)}
#actorCatFilter .dd-menu{left:0;right:auto;min-width:100%;width:max-content}
#actorCatFilter .dd-val,#actorCatFilter .dd-trigger .chev{color:var(--text)}

.main{display:flex;flex-direction:column;min-width:0;margin:8px 8px 0;background:var(--bg);border-radius:12px 12px 0 0}
.page{padding:26px;max-width:1220px;width:100%;margin:0 auto;display:flex;flex-direction:column;gap:20px}
.page-head{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}
.page-head h1{font-size:33px!important;letter-spacing:-.02em}
.page-head p{margin:6px 0 0;color:var(--muted);font-size:16px}
.page-head .actions{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* ---------- primitives ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.card.pad{padding:18px}
.card-head{display:flex;align-items:center;gap:10px;padding:15px 18px;border-bottom:1px solid var(--border)}
.card-head h3{font-size:14px}
.card-head .link{margin-left:auto;font-size:12px;color:var(--accent);font-weight:600}
.card-body{padding:18px}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1080px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.g2,.g3,.g4{grid-template-columns:1fr}}

.kpi{padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.kpi .label{font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.kpi .val{font-family:var(--font-display);font-size:27px;font-weight:600;letter-spacing:-.02em}
.kpi .sub{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:5px}
.trend-up{color:var(--ok);font-weight:600}
.trend-down{color:var(--crit);font-weight:600}

.badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--surface-3);color:var(--text-2);white-space:nowrap}
.badge.cat{background:var(--accent-soft);color:var(--accent)}
.badge.dot::before{content:"";width:6px;height:6px;border-radius:999px;background:currentColor}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px}
.pill--ok{background:var(--ok-soft);color:var(--ok)}
.pill--warn{background:var(--warn-soft);color:var(--warn)}
.pill--crit{background:var(--crit-soft);color:var(--crit)}
.pill--neutral{background:var(--surface-3);color:var(--text-2)}
.pill--accent{background:var(--accent-soft);color:var(--accent)}

.progress{height:7px;border-radius:999px;background:var(--surface-3);overflow:hidden;flex:1;min-width:0}
.progress > i{display:block;height:100%;border-radius:999px;background:var(--accent)}
.progress.ok > i{background:var(--ok)}
.progress.warn > i{background:var(--warn)}
.progress.crit > i{background:var(--crit)}

.avatar{width:30px;height:30px;border-radius:999px;background:var(--surface-3);color:var(--text-2);display:grid;place-items:center;font-weight:700;font-size:11px;flex:none;border:1px solid var(--border);overflow:hidden}
/* «Актёры и модели» — карточка-профиль по референсу пользователя: крупное фото
   сверху, кебаб поверх, имя + описание, три равных стата, тёмная кнопка снизу. */
.act-card{transition:box-shadow .14s ease,transform .14s ease}
.act-card:hover{box-shadow:0 10px 24px -12px rgba(0,0,0,.28);transform:translateY(-2px)}
@media(prefers-reduced-motion:reduce){.act-card{transition:none}.act-card:hover{transform:none}}
.act-card-body{padding:16px;display:flex;flex-direction:column;gap:10px}
.act-card-top{display:flex;align-items:center;gap:11px}
.act-card-top .avatar{flex:none;width:56px;height:56px;font-size:18px}
.act-card-name{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.act-card-name .n{font-family:var(--font-display);font-size:15px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.act-card-name .age{font-size:12px;color:var(--muted)}
.act-card-top .tm-kebab{flex:none;margin-right:-7px}
.act-card-desc{display:flex;flex-direction:column;gap:6px}
.act-card-sub{margin:0;font-size:12.5px;color:var(--text-2);line-height:1.4}
.act-card-sub::first-letter{text-transform:uppercase}
.act-card-tags{display:flex;flex-wrap:wrap;align-content:flex-start;gap:5px}
.act-card-stats{display:flex;padding-top:2px}
.act-card-stat{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left}
.act-card-stat .v{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:18px;line-height:22px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.act-card-stat .v *{line-height:22px;vertical-align:bottom;font-size:19px}
.act-card-stat .l{font-size:12.5px;color:var(--muted)}
.act-card-stat .v.crit{color:var(--crit)}
.act-card-stat .v.ok{color:var(--ok)}
.act-card-foot{margin-top:2px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.act-card-dates{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden}
.act-card-dates span{display:flex;flex-direction:column;align-items:center;line-height:1.1;flex:none}
.act-card-dates span+span{padding-left:8px;border-left:1px solid var(--border)}
.act-card-dates span b{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:13px;font-weight:700;color:var(--text)}
.act-card-dates span i{font-style:normal;font-size:9.5px;font-weight:600;color:var(--muted);text-transform:lowercase}
.act-card-dates span.none{font-family:var(--font-body);font-size:11.5px;font-weight:500;color:var(--muted);flex-direction:row}
.act-card-dates span.none{font-family:var(--font-body);font-weight:500;color:var(--muted)}
.act-card-btn{flex:none;height:32px;padding:0 14px;border-radius:8px;border:0;background:var(--accent);color:var(--accent-fg);font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:box-shadow .12s ease;white-space:nowrap}
.act-card-btn:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.1)}
.act-card-btn .ico{width:13px;height:13px}
/* «Актёры и модели» — контакты и проекты в модалке бронирования */
.act-profile-name-plain{font-family:var(--font-display);font-size:17px;font-weight:700;color:var(--text)}
.act-profile-sec{display:flex;flex-direction:column;gap:8px}
.act-profile-sec-title{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.act-profile-contacts{display:flex;flex-direction:column;gap:6px}
.act-profile-contacts-row{display:flex;gap:6px}
.act-profile-contacts-row .act-profile-contact{flex:1;min-width:0}
.act-proj-rating{flex:none;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:700;font-size:13px;color:var(--text)}
.act-profile-contact{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:9px;background:var(--surface-2);color:var(--text);font-size:12.5px;font-weight:600;transition:box-shadow .12s ease}
.act-profile-contact:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.05)}
.act-profile-contact .ico{width:15px;height:15px;color:var(--muted);flex:none}
.act-profile-contact span{flex:1;min-width:0;font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
button.act-profile-contact{border:0;width:100%;font:inherit;text-align:left}
button.act-profile-contact span{color:var(--muted);font-family:var(--font-body);font-weight:600;letter-spacing:normal}
.act-profile-contact em{flex:none;font-style:normal;color:var(--accent);font-weight:700;font-size:11.5px}
.avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.avatar.lg{width:44px;height:44px;font-size:14px}
.avatar.sm{width:24px;height:24px;font-size:9.5px}
.stack{display:flex}
.stack .avatar{margin-left:-8px;box-shadow:0 0 0 2px var(--surface)}
.stack .avatar:first-child{margin-left:0}

.btn{display:inline-flex;align-items:center;gap:7px;height:33px;padding:0 13px;border-radius:8px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font-weight:600;font-size:12.5px;transition:box-shadow .12s ease,border-color .12s ease,background .12s ease}
.btn:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.12)}
.btn:active{box-shadow:inset 0 0 0 999px rgba(0,0,0,.2)}
.btn--primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.btn--primary:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.1)}
.btn--ghost{border-color:var(--surface-2);background:var(--surface-2);color:var(--text-2)}
.btn--ghost:hover{box-shadow:none;background:var(--surface-3);border-color:var(--surface-3);color:var(--text)}
.btn--sm{padding:0 11px;font-size:12.5px}
.btn--crit{color:var(--accent-fg);background:var(--crit);border-color:var(--crit)}
.btn--dcrit{color:var(--crit);background:transparent;border-color:var(--border-strong)}
.btn--dcrit:hover{box-shadow:none;border-color:var(--crit);background:var(--crit-soft)}
.btn--crit:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.1)}
@media (prefers-reduced-motion:reduce){.btn{transition:none}}

.table{width:100%;border-collapse:collapse;font-size:13px}
.table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;padding:10px 14px;border-bottom:1px solid var(--border)}
.table td{padding:11px 14px;border-bottom:1px solid var(--border);color:var(--text-2)}
.table tr:last-child td{border-bottom:0}
.table tr:hover td{background:var(--surface-2)}
.table .strong{color:var(--text);font-weight:600}
.tablewrap{overflow-x:auto}
.pay-sh-sum + .tablewrap{margin-top:24px}

.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);padding:0 2px}
.tab{padding:9px 13px;font-weight:600;font-size:13px;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}
.tab:hover{color:var(--text)}
.tab.active{color:var(--text);border-color:var(--accent)}

.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:5px 10px;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--text-2)}
.chip.on{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.chip.on .badge{color:var(--accent-fg)!important}

.list{display:flex;flex-direction:column}
.row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}
.row:last-child{border-bottom:0}
.row .grow{flex:1;min-width:0}
.row .t{font-weight:600;color:var(--text);font-size:13px}
.row .m{font-size:12px;color:var(--muted)}
.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.deptbar{width:3px;align-self:stretch;border-radius:999px;flex:none}
.dept-pp{background:var(--dept-pp)}
.dept-mont{background:var(--dept-mont)}
.dept-ai{background:var(--dept-ai)}
.dept-text-pp{color:var(--dept-pp)}
.dept-text-mont{color:var(--dept-mont)}
.dept-text-ai{color:var(--dept-ai)}

.empty{padding:40px;text-align:center;color:var(--muted);font-size:13px}
.kv{display:grid;grid-template-columns:130px 1fr;gap:8px 14px;font-size:13px}
.kv dt{color:var(--muted)}
.kv dd{margin:0;color:var(--text);font-weight:500}

.overdue{color:var(--crit);font-weight:700}
.hint{font-size:12px;color:var(--muted)}

/* ===== new-project wizard ===== */
/* редизайн по референсу дашборда (белые карточки, круглый гейдж-прогресс, жирный чёрный
   типограф, один акцентный оранжевый) — эта карточка нарочно светлая «остров» на тёмной
   странице, как и раньше был белый трек, только теперь оформлена полноценно, а не голым
   треком. Круглый гейдж — conic-gradient «пончик» с процентом внутри; подпись рядом — не
   имя шага (это уже видно на самих таблетках ниже, дублировать нельзя), а факт «N из 8». */
.wz-steps-card{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:22px 24px;margin-bottom:4px;box-shadow:0 1px 3px rgba(0,0,0,.08),0 10px 26px -14px rgba(0,0,0,.35)}
.wz-gauge-row{display:flex;align-items:center;gap:16px;margin-bottom:18px}
@property --p{syntax:'<number>';inherits:true;initial-value:0}
.wz-ring{position:relative;width:64px;height:64px;border-radius:999px;flex:none;display:grid;place-items:center;background:conic-gradient(var(--accent) calc(var(--p)*3.6deg), var(--surface-3) 0);transition:--p .8s cubic-bezier(.22,1,.36,1)}
@media(prefers-reduced-motion:reduce){.wz-ring{transition:none}}
.wz-ring::after{content:'';position:absolute;inset:7px;background:var(--surface);border-radius:999px}
.wz-ring b{position:relative;z-index:1;font-family:var(--font-display);font-weight:800;font-size:13.5px;color:var(--text);letter-spacing:-.02em}
.wz-gauge-tx .n{font-family:var(--font-display);font-weight:800;font-size:22px;color:var(--text);letter-spacing:-.01em;line-height:1.15}
.wz-gauge-tx .l{font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-top:2px}
.wz-steps{display:flex;gap:6px}
.wz-steps .st{flex:1;min-width:0;border:0;border-radius:10px;background:var(--surface-2);color:var(--muted);padding:10px 6px;font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .18s ease,color .18s ease,box-shadow .18s ease,transform .15s ease}
.wz-steps .st:hover:not(.on){background:var(--surface-3);color:var(--text-2)}
.wz-steps .st.ok{background:var(--accent-soft);color:var(--accent)}
.wz-steps .st.ok .ck{color:var(--accent);margin-right:3px;display:inline-flex;vertical-align:-2px}
.wz-steps .st.ok .ck .ico{width:12px;height:12px;stroke-width:2.4}
.wz-steps .st.on{background:var(--accent);color:#fff;box-shadow:0 4px 12px -3px color-mix(in srgb, var(--accent) 55%, transparent);transform:translateY(-1px)}
@media(prefers-reduced-motion:reduce){.wz-steps .st{transition:none}}
.wz-shell{display:flex;flex-direction:column;box-shadow:0 1px 3px rgba(0,0,0,.08),0 10px 26px -14px rgba(0,0,0,.35)}
.wz-shell-body{padding:24px 26px}
.wz-grid{display:grid;grid-template-columns:200px 1fr;gap:26px;align-items:start}
@media(max-width:900px){.wz-grid{grid-template-columns:1fr}.wz-secnav{display:none}}
.wz-secnav{position:sticky;top:14px;display:flex;flex-direction:column;gap:1px}
.wz-secnav .lbl{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:12px 0 3px 9px}
.wz-secnav a{font-size:12.5px;color:var(--muted);text-decoration:none;padding:6px 9px;border-radius:7px;border-left:2px solid transparent}
.wz-secnav a:hover{background:var(--surface-2);color:var(--text)}
.fld{display:grid;grid-template-columns:190px 1fr;gap:10px 14px;align-items:start;margin-bottom:11px}
.fld>label{font-weight:600;font-size:13px;padding-top:8px}
.fld.req>label::after{content:" *";color:var(--accent)}
@media(max-width:720px){.fld{grid-template-columns:1fr}}
.in{width:100%;height:33px;padding:0 13px;border:1px solid var(--border-strong);border-radius:8px;background:var(--surface-2);color:var(--text);font:inherit;font-size:12.5px;font-weight:600;transition:box-shadow .12s ease}
.in:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.04)}
.in:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
@media(prefers-reduced-motion:reduce){.in{transition:none}}
textarea.in{height:auto;min-height:58px;padding:8px 13px;resize:vertical}
select.in{padding-right:8px}
.in.bad{border-color:var(--crit);background:var(--crit-soft)}
.inline-wrap{display:flex;flex-wrap:wrap;gap:9px 14px;align-items:center}
.ck{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;cursor:pointer}
.ck input{accent-color:var(--accent);width:15px;height:15px}
.subcard{border:1px solid var(--border);border-radius:9px;padding:13px 14px;margin-bottom:10px;background:var(--surface-2)}
.subcard h4{margin:0 0 9px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--accent);display:flex;justify-content:space-between;align-items:center}
.xbtn{border:0;background:var(--crit-soft);color:var(--crit);border-radius:6px;width:24px;height:24px;font-size:12px;cursor:pointer}
.add-btn{margin-top:6px;background:var(--accent-soft);color:var(--accent);border:1px dashed var(--accent);border-radius:8px;padding:7px 13px;font-size:12.5px;font-weight:700;cursor:pointer}
.rule-txt{font-size:12.5px;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:11px 13px;margin-bottom:8px}
.rule-txt b{color:var(--text)}
.gate{border-radius:10px;padding:13px 15px;margin-bottom:16px;font-size:13px;background:var(--warn-soft);border:1px solid var(--warn)}
.gate.pass{background:var(--ok-soft);border-color:var(--ok)}
.gate b{display:block;margin-bottom:3px}
.gate ul{margin:6px 0 0;padding-left:18px;color:var(--text-2)}
.wz-shell .btn--primary{box-shadow:0 4px 12px -3px color-mix(in srgb, var(--accent) 55%, transparent)}
.wz-shell .btn--primary:hover:not(:disabled){box-shadow:inset 0 0 0 999px rgba(0,0,0,.1),0 4px 12px -3px color-mix(in srgb, var(--accent) 55%, transparent)}
.wz-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 26px;background:var(--surface);border-top:1px solid var(--border);border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}
.wz-draft{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:var(--muted)}
.wz-draft .ico{width:13px;height:13px;color:var(--ok)}
.wz-dd{position:relative;max-width:440px}
.wz-dd>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;height:33px;padding:0 11px 0 13px;border:1px solid var(--field-border);border-radius:8px;background:var(--field);font-size:12.5px;font-weight:600;color:var(--text);transition:border-color .12s,box-shadow .12s,background .12s}
.wz-dd>summary:hover{border-color:var(--border-strong)}
.wz-dd>summary::-webkit-details-marker{display:none}
.wz-dd[open]>summary{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--surface)}
.wz-dd>summary .cv{color:var(--muted);transition:transform .2s cubic-bezier(.4,0,.2,1)}
.wz-dd[open]>summary .cv{transform:rotate(180deg)}
/* клиентский пикер на шаге 1 — настоящий .dd/.dd--auto, как «Вид: Директор» в хедере
   (те же цвета, наведение, рамка+кольцо при открытии, чеврон, анимация меню); «Новый клиент»
   и сфера в пункте — единственные отличия */
.wz-client-dd{margin-bottom:16px;width:max-content;min-width:240px;max-width:100%}
.wz-client-dd .dd-trigger{width:100%}
.wz-cl{display:block}
.wz-cl.has-info{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 12px;align-items:stretch}
.wz-cl.has-info .wz-cl-l,.wz-cl.has-info .wz-cl-r{display:flex;flex-direction:column;min-width:0}
.wz-cl.has-info .wz-cl-l .dd{flex:none}
.wz-cl.has-info .wz-ci-contact,.wz-cl.has-info .wz-ci-projs{flex:1 1 auto;justify-content:flex-start}
.wz-cl-r{padding-top:0}
.wz-ci-stats{display:flex;gap:32px;padding:0 14px;margin-bottom:16px;height:33px;flex:none;align-items:flex-start}
.wz-ci-stat{display:flex;flex-direction:column;gap:3px}
.wz-ci-stat .l{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.wz-ci-stat .v{font-size:20px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;line-height:1.2}
.wz-ci-h{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:4px}
.wz-ci-contact,.wz-ci-projs{min-width:0}
@media(max-width:700px){.wz-cl.has-info{grid-template-columns:1fr;gap:16px}}
.wz-ci-proj{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:6px 0}
.wz-ci-pmain{display:flex;flex-direction:column;gap:2px;min-width:0}
.wz-ci-pn{font-size:13px;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wz-ci-pm{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wz-ci-proj .pill{flex:none}
.wz-ci-who{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 8px;padding:3px 0;font-size:13px}
.wz-ci-who b{font-weight:600;color:var(--text)}
.wz-ci-who span{color:var(--muted);font-weight:600}
.wz-ci-line{padding:3px 0;font-size:13px;font-weight:600;color:var(--text)}
.wz-ci-line a{color:inherit}
.wz-client-dd .dd-opt{gap:12px}
.wz-client-dd .dd-opt .ck{display:none}
.wz-client-dd .dd-opt .sph{margin-left:auto;font-size:11.5px;font-weight:500;color:var(--muted)}
.wz-dd-menu{position:absolute;z-index:20;left:0;right:0;margin-top:5px;background:var(--surface);border:1px solid var(--border-strong);border-radius:10px;box-shadow:var(--shadow);padding:5px;max-height:280px;overflow:auto}
.wz-dd-menu button{display:flex;width:100%;text-align:left;gap:9px;align-items:center;padding:8px 10px;border:0;background:none;color:var(--text);font:inherit;font-size:12.5px;border-radius:7px;cursor:pointer}
.wz-dd-menu button:hover{background:var(--surface-2)}
.wz-dd-menu .sph{margin-left:auto;font-size:11.5px;color:var(--muted)}
.wz-dd-menu .new{color:var(--accent);font-weight:700;border-top:1px solid var(--border);margin-top:4px;padding-top:10px;border-radius:0 0 6px 6px}
/* шаг 1 («Клиент») — редизайн: мелкий жирный киккер-заголовок секции вместо голого
   старта с поля, и «Реквизиты ТЗ» вместо серого dt/dd-блока — три лёгких чипа-карточки,
   без рамки/фона-плашки под всем сразу, в духе плиток на карточке степпера сверху. */
.wz-s1-lbl{font-size:14px;font-weight:600;color:var(--text);margin-bottom:12px}
.wz-meta-row{display:flex;gap:10px;flex-wrap:wrap}
.wz-meta-chip{flex:1 1 200px;background:var(--surface-2);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:4px}
.wz-meta-chip .l{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.wz-meta-chip .v{font-size:13.5px;font-weight:700;color:var(--text);display:flex;align-items:center;min-height:33px}
.wz-meta-chip .v em{font-style:normal;font-weight:500;color:var(--muted);font-size:11px;margin-left:6px}
.wz-meta-chip .in{max-width:220px;background:var(--field);border-color:var(--field-border);transition:border-color .12s,box-shadow .12s,background .12s}
.wz-meta-chip .in::placeholder{font-weight:600;color:var(--muted)}
.wz-meta-chip .in:hover{box-shadow:none;background:var(--surface);border-color:var(--border-strong)}
.wz-meta-chip .in:focus{outline:0;background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.wz-meta-chip .in.bad{border-color:var(--crit);background:var(--crit-soft)}
.wz-nc{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:12px;align-items:stretch}
.wz-nc .wz-meta-chip{gap:10px;min-width:0}
.wz-nc .in{max-width:none}
.wz-nc-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 12px}
.wz-f{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:600;color:var(--text-2)}
.wz-f em{font-style:normal;font-weight:400;color:var(--muted)}
@media(max-width:700px){.wz-nc,.wz-nc-g{grid-template-columns:1fr}}
.wz-rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.wz-rule{background:var(--surface-2);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.wz-rule .n{font-size:10.5px;font-weight:700;letter-spacing:.04em;color:var(--muted);font-variant-numeric:tabular-nums}
.wz-rule b{font-size:13.5px;font-weight:600;color:var(--text);line-height:1.35}
.wz-rule p{margin:0;font-size:12.5px;line-height:1.55;color:var(--text-2)}
.wz-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.wz-two .wz-meta-chip{min-width:0}
.wz-two .in{max-width:none}
.wz-meta-chip .l .wz-opt{font-style:normal;font-weight:400;text-transform:none;letter-spacing:0}
@media(max-width:800px){.wz-rules,.wz-two{grid-template-columns:1fr}}
.wz-ck{position:relative;display:flex;align-items:center;gap:10px;margin-top:4px;cursor:pointer;font-size:13.5px;font-weight:600;color:var(--text);user-select:none}
.wz-ck input{position:absolute;opacity:0;width:0;height:0}
.wz-ck .box{flex:none;width:20px;height:20px;border-radius:6px;border:1.5px solid var(--border-strong);background:var(--field);display:grid;place-items:center;transition:background .16s,border-color .16s,box-shadow .16s,transform .12s}
.wz-ck:hover .box{border-color:var(--accent)}
.wz-ck:active .box{transform:scale(.9)}
.wz-ck .box svg{width:14px;height:14px;fill:none;stroke:var(--accent-fg);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:22;stroke-dashoffset:22;transition:stroke-dashoffset .24s cubic-bezier(.4,0,.2,1) .06s}
.wz-ck input:checked + .box{background:var(--accent);border-color:var(--accent);animation:wz-ck-pop .3s cubic-bezier(.34,1.56,.64,1)}
.wz-ck input:checked + .box svg{stroke-dashoffset:0}
.wz-ck input:focus-visible + .box{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
@keyframes wz-ck-pop{0%{transform:scale(.8)}100%{transform:scale(1)}}
.wz-ck-date{margin:0 0 0 30px;max-height:0;overflow:hidden;opacity:0;transform:translateY(-4px);font-size:12.5px;font-weight:500;color:var(--muted);transition:opacity .22s ease,transform .22s ease,max-height .22s ease,margin .22s ease}
.wz-ck-date.on{max-height:24px;opacity:1;transform:none;margin-top:8px}
@media(prefers-reduced-motion:reduce){.wz-ck .box,.wz-ck .box svg,.wz-ck-date{transition:none}.wz-ck input:checked + .box{animation:none}}
textarea.wz-ta{flex:1 1 auto;min-height:76px;padding:10px 13px;resize:none;line-height:1.5;overflow:hidden;transition:border-color .16s,box-shadow .16s,background .16s}
.wz-pf-other{display:grid;grid-template-rows:0fr;opacity:0;pointer-events:none;transition:grid-template-rows .5s cubic-bezier(.22,1,.36,1),opacity .4s ease,margin-top .5s cubic-bezier(.22,1,.36,1)}
.wz-pf-other>div{overflow:hidden;min-height:0;padding:4px;margin:-4px}
.wz-two .wz-pf-other .in{max-width:260px}
.wz-pf-other.on{grid-template-rows:1fr;opacity:1;pointer-events:auto;margin-top:12px}
@media(prefers-reduced-motion:reduce){.wz-pf-other{transition:none}}
.wz-tip{position:fixed;z-index:80;display:none;width:310px;max-height:calc(100vh - 24px);overflow:auto;padding:14px 16px 8px;background:var(--surface);border:1px solid var(--border-strong);border-radius:14px;box-shadow:0 18px 40px -12px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.2);pointer-events:none;font-size:12px;color:var(--text-2)}
.wz-tip-h{display:flex;align-items:baseline;gap:8px;padding-bottom:10px}
.wz-tip-h b{font-size:15px;font-weight:600;color:var(--text)}
.wz-tip-h span{font-size:12px;color:var(--muted);text-transform:capitalize}
.wz-tip-h em{margin-left:auto;font-style:normal;font-size:11.5px;font-weight:600;color:var(--accent);background:var(--accent-soft);padding:2px 9px;border-radius:999px}
.wz-tip-p{margin:0 -16px;padding:10px 16px 12px;border-top:1px solid var(--border)}
.wz-tip-p .n{display:flex;align-items:baseline;gap:7px;margin-bottom:6px}
.wz-tip-p .n b{font-size:13px;font-weight:600;color:var(--text)}
.wz-tip-p .n span{font-size:11px;color:var(--muted)}
.wz-tip-p .r{display:flex;align-items:center;gap:10px;padding:2px 0}
.wz-tip-p .t{flex:none;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--accent);background:var(--accent-soft);padding:3px 9px;border-radius:6px}
.wz-tip-p .t.f{background:none;padding:3px 0;color:var(--text);font-weight:600}
.wz-tip-p .p{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-2)}
.wz-sp2{display:grid;grid-template-columns:340px minmax(0,1fr);gap:12px;align-items:start}
.wz-sp2 .wz-meta-chip{min-width:0;padding:16px;gap:0}
.wz-cal-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.wz-cal-hd b{font-size:14px;font-weight:600;text-transform:capitalize;color:var(--text)}
.wz-cal-hd button{width:33px;height:33px;display:grid;place-items:center;border:1px solid var(--field-border);border-radius:8px;background:var(--field);color:var(--text);cursor:pointer;transition:border-color .12s,background .12s}
.wz-cal-hd button:hover{border-color:var(--border-strong);background:var(--surface)}
.wz-cal-hd .prev{transform:rotate(90deg)}
.wz-cal-hd .next{transform:rotate(-90deg)}
.wz-cal-g2{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.wz-cal-g2 .wd{font-size:10.5px;font-weight:700;text-transform:uppercase;color:var(--muted);text-align:center;padding:2px 0 5px}
.wz-cd2{position:relative;height:40px;border:0;border-radius:9px;background:var(--surface);color:var(--text);font:inherit;padding:6px 7px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;cursor:pointer;transition:background .18s ease,box-shadow .18s ease}
.wz-cd2 .n{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1}
.wz-cd2 .c{align-self:flex-end;font-size:10.5px;font-weight:700;color:var(--text);opacity:.85;font-variant-numeric:tabular-nums;line-height:1}
.wz-cd2 .cam{position:absolute;bottom:5px;left:6px;width:12px;height:12px;color:var(--text)}
.wz-cd2.lv1{background:#ffe0cb}
.wz-cd2.lv2{background:#ffc199}
.wz-cd2.lv1 .n,.wz-cd2.lv2 .n,.wz-cd2.lv3 .n,.wz-cd2.lv1 .c,.wz-cd2.lv2 .c,.wz-cd2.lv3 .c,.wz-cd2.lv1 .cam,.wz-cd2.lv2 .cam,.wz-cd2.lv3 .cam{color:#2a1200}
.wz-cd2.lv3{background:#ffa36b}
.wz-cd2:hover:not(:disabled){box-shadow:inset 0 0 0 1.5px var(--border-strong)}
.wz-cd2.we .n{color:var(--muted)}
.wz-cd2.today .n{color:var(--accent)}
.wz-cd2.past{opacity:.3;cursor:default}
.wz-cd2.focus,.wz-cd2.focus:hover{box-shadow:inset 0 0 0 2.5px var(--accent)}
.wz-df-pm{margin:2px 0 14px}
.wz-rng-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.wz-rng-h b{font-size:17px;font-weight:700;letter-spacing:-.01em;color:var(--text);font-variant-numeric:tabular-nums}
.wz-rng-h span{font-size:19px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.wz-rng{position:relative;margin:10px 10px 0;padding:14px 0 24px;touch-action:none;cursor:pointer}
.wz-rng .tr{position:relative;height:6px;border-radius:3px;background:var(--surface-3)}
.wz-rng .bz{position:absolute;top:0;bottom:0;background:color-mix(in srgb,var(--text) 26%,transparent);border-radius:3px}
.wz-rng .fl{position:absolute;top:0;bottom:0;background:var(--accent);border-radius:3px;transition:left .22s cubic-bezier(.22,1,.36,1),width .22s cubic-bezier(.22,1,.36,1)}
.wz-rng .h{position:absolute;top:7px;width:20px;height:20px;padding:0;border:0;border-radius:999px;background:#fff;box-shadow:0 0 0 3px var(--accent),0 2px 8px rgba(0,0,0,.4);transform:translateX(-50%);cursor:grab;transition:left .22s cubic-bezier(.22,1,.36,1),transform .16s ease,box-shadow .16s ease}
.wz-rng .h:hover{transform:translateX(-50%) scale(1.12)}
.wz-rng .h:focus-visible{outline:0;box-shadow:0 0 0 3px var(--accent),0 0 0 7px var(--accent-soft),0 2px 8px rgba(0,0,0,.4)}
.wz-rng.drag,.wz-rng.drag .h{cursor:grabbing}
.wz-rng.drag .h,.wz-rng.drag .fl{transition:none}
.wz-rng.drag .h{transform:translateX(-50%) scale(1.18)}
.wz-rng .tk{position:absolute;left:-6px;right:-6px;bottom:0;display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted);font-variant-numeric:tabular-nums;pointer-events:none}
.wz-df-vid{display:flex;align-items:flex-end;gap:14px;margin-top:18px}
.wz-df-vid .wz-f{gap:3px;width:112px;flex:none}
.wz-df-vid .wz-f>span{font-size:11.5px;font-weight:600;color:var(--muted)}
.wz-df-vid .wz-stepper{width:100%}
.wz-df-vid .wz-stepper button{width:28px;flex:none}
.wz-df-vid .wz-stepper .val{flex:1;min-width:0;padding:0}
.wz-df-vid .hint{margin:0 0 8px}
@media(prefers-reduced-motion:reduce){.wz-rng .fl,.wz-rng .h{transition:none}}
.wz-ops-l{margin-top:18px;margin-bottom:3px}
.wz-ops-l>span{font-size:11.5px;font-weight:600;color:var(--muted)}
.wz-oc-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.wz-oc{position:relative;display:flex;flex-direction:column;gap:2px;align-items:flex-start;padding:9px 11px;border:1px solid var(--field-border);border-radius:9px;background:var(--field);color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:background .18s,border-color .18s,box-shadow .18s}
.wz-oc b{font-size:13px;font-weight:600;line-height:1.2}
.wz-oc span{font-size:11.5px;color:var(--muted);line-height:1.2;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wz-oc i{position:absolute;top:8px;right:8px;width:16px;height:16px;border-radius:999px;display:grid;place-items:center;background:var(--accent);color:var(--accent-fg);opacity:0;transform:scale(.5);transition:opacity .18s,transform .22s cubic-bezier(.34,1.56,.64,1)}
.wz-oc i .ico{width:10px;height:10px;stroke-width:3.2}
.wz-oc:hover:not(:disabled){border-color:var(--border-strong)}
.wz-oc.on{border-color:var(--accent);background:var(--accent-soft)}
.wz-oc.on i{opacity:1;transform:scale(1)}
.wz-oc.bad span{color:var(--crit)}
.wz-oc:disabled{opacity:.5;cursor:not-allowed}
.wz-sd-act{justify-content:space-between !important}
.wz-sd-empty{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:8px 0;color:var(--muted)}
.wz-sd-empty b{font-size:14px;font-weight:600;color:var(--text)}
.wz-sd-empty span{font-size:12.5px;line-height:1.5}
.wz-df-h{display:flex;align-items:baseline;gap:8px}
.wz-df-h b{font-size:16px;font-weight:600;color:var(--text)}
.wz-df-h span{font-size:12.5px;color:var(--muted);text-transform:capitalize}
.wz-sd-tag{margin-left:auto;font-style:normal;font-size:11px;font-weight:600;padding:2px 9px;border-radius:999px;background:var(--surface-3);color:var(--text-2)}
.wz-df-pm{margin:4px 0 14px;font-size:13px;font-weight:600;color:var(--text-2)}
.wz-df-pm.crit{color:var(--crit)}
.wz-df-row{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.wz-df-row .k,.wz-df-ops .k{width:64px;flex:none;font-size:12.5px;font-weight:600;color:var(--text-2)}
.wz-df-row .dash{color:var(--muted)}
.wz-df-row .hrs{font-size:13px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;margin-left:4px}
.wz-time{width:66px !important;max-width:66px !important;text-align:center;font-variant-numeric:tabular-nums;padding:0 8px !important}
.wz-df-ops{display:flex;flex-direction:column;gap:0;margin-top:4px}
.wz-df-ops .k{margin-bottom:4px}
.wz-op{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 0;min-height:34px}
.wz-op .st{font-size:12px;color:var(--muted);white-space:nowrap}
.wz-op .st.crit{color:var(--crit)}
.wz-df-ops .linkbtn{align-self:flex-start;margin-top:6px}
.wz-ck--nopop input:checked + .box{animation:none}
.wz-ck input:disabled + .box{opacity:.4}
.wz-ck input:disabled ~ span{opacity:.5}
.wz-sd-warn{margin:8px 0 0;font-size:12px;line-height:1.5;color:var(--crit)}
.wz-sd-act{padding-top:14px;display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px}
.wz-sd-act .btn:disabled{opacity:.45;cursor:not-allowed}
.wz-pl2{margin-top:16px;display:flex;flex-direction:column;gap:8px}
.wz-pl2-hd{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0 2px 2px}
.wz-pl2-hd b{font-size:14px;font-weight:600;color:var(--text)}
.wz-pd{padding:14px 16px 16px;border-radius:12px;background:var(--surface-2);cursor:pointer}
.wz-pd .h{display:flex;align-items:baseline;gap:8px;margin-bottom:12px}
.wz-pd .h b{font-size:15px;font-weight:600;color:var(--text)}
.wz-pd .h span{font-size:12.5px;color:var(--muted);text-transform:capitalize}
.wz-pd .g{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,.6fr) minmax(0,1.5fr);gap:12px 18px}
.wz-pd .g>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.wz-pd .l{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.wz-pd .g b{font-size:14px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:800px){.wz-sp2{grid-template-columns:1fr}.wz-pd .g{grid-template-columns:1fr 1fr}}
.wz-dl{min-width:0}
.wz-exp{margin-top:4px;font-size:14px !important}
.wz-dl .att-cal{margin-left:0;width:100%}
.wz-dl .att-cal-trig{width:216px;max-width:100%;justify-content:flex-start;margin-top:4px}
.wz-dl .att-cal-trig span{flex:1;text-align:left}
.wz-dl .att-cal-trig.set{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.wz-dl .att-cal-trig.set:hover{background:var(--accent);box-shadow:inset 0 0 0 999px rgba(0,0,0,.1)}
.wz-dl .att-cal-trig.set svg{color:var(--accent-fg)}
.wz-dl .att-cal-pop{left:0;right:auto;top:auto;bottom:calc(100% + 6px)}
@keyframes wz-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes wz-fade{from{opacity:0}to{opacity:1}}
@keyframes wz-tip-in{from{opacity:0;transform:translateY(5px) scale(.98)}to{opacity:1;transform:none}}
.wz-rise{animation:wz-rise .36s cubic-bezier(.22,1,.36,1) both}
.wz-fade{animation:wz-fade .3s ease both}
.wz-tip{animation:wz-tip-in .18s cubic-bezier(.22,1,.36,1)}
.wz-sd-warn,.wz-df-pm.crit{animation:wz-fade .25s ease both}
.wz-pd.leaving{opacity:0;transform:translateX(14px) scale(.985);pointer-events:none;transition:opacity .22s ease,transform .24s cubic-bezier(.4,0,.2,1)}
@media(prefers-reduced-motion:reduce){.wz-rise,.wz-fade,.wz-tip,.wz-sd-warn,.wz-df-pm.crit{animation:none}.wz-pd.leaving{transition:none}}
.wz-meta-chip,.wz-rule{box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.wz-pd{box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35);transition:opacity .2s ease}
.wz-stepper{box-shadow:0 1px 2px rgba(0,0,0,.14)}
.wz-oc.on{box-shadow:0 5px 14px -6px color-mix(in srgb,var(--accent) 60%,transparent)}
.wz-steps .st.ok{box-shadow:0 3px 8px -4px color-mix(in srgb,var(--accent) 45%,transparent)}
.wz-shell .btn--primary:disabled{box-shadow:none}
.wz-dl .att-cal-trig.set{box-shadow:0 4px 12px -3px color-mix(in srgb,var(--accent) 55%,transparent)}
.wz-meta-chip.bad{box-shadow:inset 0 0 0 1.5px var(--crit),0 8px 18px -12px rgba(0,0,0,.35)}
.wz-meta-chip.bad>.l{color:var(--crit)}
.wz-client-dd .dd-trigger.bad{border-color:var(--crit);background:var(--crit-soft)}
.wz-notice{max-width:420px}
.wz-nt-h{display:flex;align-items:center;gap:12px;padding:18px 20px 6px}
.wz-nt-h .ic{flex:none;width:34px;height:34px;border-radius:999px;display:grid;place-items:center;background:var(--crit-soft);color:var(--crit);font-size:17px;font-weight:800}
.wz-nt-h b{display:block;font-size:15px;font-weight:600;color:var(--text)}
.wz-nt-h span:not(.ic){font-size:12.5px;color:var(--muted)}
.wz-nt-l{list-style:none;margin:8px 0 0;padding:0 20px;display:flex;flex-direction:column;gap:2px;max-height:min(46vh,320px);overflow:auto}
.wz-nt-l li{position:relative;padding:8px 0 8px 18px;font-size:13px;line-height:1.45;color:var(--text);border-bottom:1px solid var(--border)}
.wz-nt-l li:last-child{border-bottom:0}
.wz-nt-l li::before{content:'';position:absolute;left:2px;top:14px;width:7px;height:7px;border-radius:999px;background:var(--crit)}
.wz-nt-l li.more{color:var(--muted);padding-left:18px}
.wz-nt-l li.more::before{background:var(--border-strong)}
.wz-nt-f{display:flex;justify-content:flex-end;padding:14px 20px 18px}
.wz-vcs{display:flex;flex-direction:column;gap:12px}
.wz-vc{background:var(--surface-2);border-radius:12px;padding:16px 18px 18px;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35);transition:opacity .22s ease,transform .24s cubic-bezier(.4,0,.2,1)}
.wz-vc.leaving{opacity:0;transform:translateX(14px) scale(.985);pointer-events:none}
.wz-vc-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.wz-vc-h b{font-size:15px;font-weight:600;color:var(--text)}
.wz-vc-g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px 14px}
.wz-vc-g .c2{grid-column:span 2}.wz-vc-g .c3{grid-column:span 3}.wz-vc-g .c4{grid-column:span 4}.wz-vc-g .c5{grid-column:span 5}.wz-vc-g .c6{grid-column:span 6}.wz-vc-g .c7{grid-column:span 7}.wz-vc-g .c8{grid-column:span 8}.wz-vc-g .c12{grid-column:1/-1}
.wz-vc .wz-f{gap:5px;min-width:0}
.wz-vc .wz-f>span{font-size:11.5px;font-weight:600;color:var(--muted)}
.wz-vc .in{background:var(--field);border-color:var(--field-border);transition:border-color .12s,box-shadow .12s,background .12s}
.wz-vc .in::placeholder{font-weight:600;color:var(--muted)}
.wz-vc .in:hover{border-color:var(--border-strong);background:var(--surface);box-shadow:none}
.wz-vc .in:focus{outline:0;background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.wz-vc .in.bad,.wz-vc .dd-trigger.bad{border-color:var(--crit);background:var(--crit-soft)}
.wz-vc .dd-trigger{background:var(--field);border-color:var(--field-border)}
.wz-vc .dd:not(.open) .dd-trigger:hover{background:var(--surface);border-color:var(--border-strong)}
.wz-vc .dd-trigger .dd-val{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wz-vc .dd-menu{min-width:100%}
.wz-vc .btn--ghost,.wz-vc label.btn{width:100%;justify-content:center}
.wz-ro{display:flex;align-items:center;gap:8px;height:33px;padding:0 13px;border-radius:8px;border:1px solid var(--field-border);background:var(--field);font-size:12.5px;font-weight:600;color:var(--text-2)}
.wz-ro .ico{width:15px;height:15px;color:var(--muted);flex:none}
@media(max-width:820px){.wz-vc-g .c7,.wz-vc-g .c2,.wz-vc-g .c3,.wz-vc-g .c4,.wz-vc-g .c5,.wz-vc-g .c6,.wz-vc-g .c8{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){.wz-vc{transition:none}}
.wz-vc .wz-ai{height:33px}
.wz-pkc{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.wz-pkc.bad .wz-oc:not(.on){border-color:var(--crit);background:var(--crit-soft)}
.wz-vc .wz-oc{background:var(--field)}
.wz-vc .wz-oc.on{background:var(--accent-soft)}
.wz-vc .wz-oc.bad:not(.on) span{color:var(--muted)}
.wz-stepper--in .val{border:0;background:transparent;color:var(--text);font:inherit;font-size:14px;font-weight:700;text-align:center;outline:0;padding:0;width:100%;min-width:0;font-variant-numeric:tabular-nums;user-select:text}
.wz-stepper--sm .val{width:40px;flex:none}
.wz-stepper--in .val::placeholder{color:var(--muted);font-weight:600}
.wz-stepper--in:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.wz-stepper--in.bad{border-color:var(--crit);background:var(--crit-soft)}
.wz-pkc2{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}
.wz-pc{position:relative;display:flex;flex-direction:column;gap:12px;padding:12px 13px;border:1px solid var(--field-border);border-radius:10px;background:var(--field);color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease}
.wz-pc:hover{border-color:var(--border-strong);background:var(--surface)}
.wz-pc .t{display:flex;align-items:center;gap:9px;min-width:0;padding-right:22px}
.wz-pc .t .avatar{width:28px;height:28px;font-size:10.5px;flex:none}
.wz-pc .t b{font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wz-pc .m{display:flex;align-items:flex-end;justify-content:space-between;gap:8px}
.wz-pc .n{font-size:22px;font-weight:700;line-height:1;letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--text)}
.wz-pc .n small{font-size:12px;font-weight:600;color:var(--muted);margin-left:5px;letter-spacing:0}
.wz-lv{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap}
.wz-lv.lv0{background:var(--surface-3);color:var(--text-2)}
.wz-lv.lv1{background:var(--accent-soft);color:var(--accent)}
.wz-lv.lv2{background:var(--accent);color:var(--accent-fg)}
.wz-pc .ck{position:absolute;top:10px;right:10px;width:16px;height:16px;border-radius:999px;display:grid;place-items:center;background:var(--accent);color:var(--accent-fg);opacity:0;transform:scale(.5);transition:opacity .18s,transform .22s cubic-bezier(.34,1.56,.64,1)}
.wz-pc .ck .ico{width:10px;height:10px;stroke-width:3.2}
.wz-pc.on{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 5px 14px -6px color-mix(in srgb,var(--accent) 60%,transparent)}
.wz-pc.on .ck{opacity:1;transform:scale(1)}
.wz-pkc2.bad .wz-pc:not(.on){border-color:var(--crit);background:var(--crit-soft)}
.wz-pills{display:flex;flex-wrap:wrap;gap:8px}
.wz-pill{height:33px;padding:0 14px;border:1px solid var(--field-border);border-radius:8px;background:var(--field);color:var(--text-2);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease}
.wz-pill:hover:not(.on){border-color:var(--border-strong);background:var(--surface);color:var(--text)}
.wz-pill.on{background:var(--accent);border-color:var(--accent);color:var(--accent-fg);box-shadow:0 4px 12px -3px color-mix(in srgb,var(--accent) 55%,transparent)}
.wz-pills.bad .wz-pill:not(.on){border-color:var(--crit);background:var(--crit-soft)}
.wz-meta-chip .wz-pills{margin-top:6px}
.wz-two > .wz-meta-chip{min-width:0}
.wz-two{margin-top:0}
.wz-two + .wz-two{margin-top:12px}
.wz-two--w{grid-template-columns:minmax(0,7fr) minmax(0,3fr)}
.wz-gearc{margin-top:8px}
/* карточки реквизита/техники в мастере — 1:1 дизайн со страницы «Инвентарь» (.pj-card.gr-card), только кликабельные */
.wz-grc-grid{margin-top:8px;gap:10px}
.wz-grc{cursor:default;transition:box-shadow .15s}
.wz-grc.on{box-shadow:0 0 0 1.5px var(--accent)}
.wz-grc-days{display:flex;flex-direction:column;gap:6px;padding-top:14px;border-top:1px solid var(--border)}
.wz-grc-days .hint{padding:0}
.wz-grc-day{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12.5px}
.wz-grc-day b{font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wz-grc-day span{font-weight:600;color:var(--ok);flex:none}
.wz-grc-day.busy span{color:var(--crit)}
.wz-grc-vids{margin-top:2px;padding-top:14px;border-top:1px solid var(--border)}
.wz-grc-vids .l{font-size:11.5px;font-weight:600;color:var(--muted);display:block;margin-bottom:8px}
@media(max-width:700px){.wz-grc-grid{grid-template-columns:minmax(0,1fr)}}
.wz-oc--gear{flex-direction:row;align-items:center;gap:10px;padding-right:26px}
.wz-oc-ic{width:32px;height:32px;flex:none;border-radius:9px;background:color-mix(in srgb,var(--text) 8%,transparent);display:grid;place-items:center;color:var(--text-2)}
.wz-oc-ic .ico{width:15px;height:15px}
.wz-oc--gear.on .wz-oc-ic{background:rgba(255,255,255,.22);color:#fff}
.wz-oc-i{display:flex;flex-direction:column;gap:1px;min-width:0}
.wz-oc-i b{font-size:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wz-oc-i span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.wz-maprow{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:0}
.wz-maprow.bad .btn,.wz-maprow.bad .wz-ck .box{border-color:var(--crit);background:var(--crit-soft)}
.wz-maprow .wz-ck{margin:0 0 0 4px}
.wz-mapv{display:flex;align-items:center;gap:10px;min-height:33px}
.wz-mapv .pin{width:33px;height:33px;flex:none;border-radius:8px;display:grid;place-items:center;background:var(--accent);color:var(--accent-fg)}
.wz-mapv .pin .ico{width:16px;height:16px}
.wz-mapv .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.wz-mapv .tx b{font-size:13px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}
.wz-mapv .tx span{font-size:11.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wz-mapm{max-width:720px}
.wz-mapbox{height:380px}
.wz-map-info{display:flex;flex-direction:column;gap:2px;min-height:34px}
.wz-map-info b{font-size:13.5px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}
.wz-map-info span{font-size:12px;color:var(--muted)}
.wz-map-act{display:flex;align-items:center;gap:8px}
.wz-sumv{padding:6px 16px 8px}
.wz-sumv .r{display:grid;grid-template-columns:28px minmax(0,1.6fr) 60px minmax(0,1.3fr) minmax(0,1.2fr) minmax(0,1.2fr);gap:12px;align-items:center;padding:9px 0;border-top:1px solid var(--border);font-size:13px;color:var(--text-2)}
.wz-sumv .r:first-child{border-top:0}
.wz-sumv .r.h{padding:8px 0 6px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.wz-sumv .r b{color:var(--text);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wz-sumv .r span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wz-sumv .r .n{color:var(--muted);font-variant-numeric:tabular-nums}
.wz-refs2{margin-top:12px}
.wz-rtags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.wz-rtag{padding:5px 10px;border-radius:7px;background:var(--surface-3);font-size:12px;font-weight:500;color:var(--text-2)}
.wz-own{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin-top:12px;align-items:center}
.wz-own .in{max-width:none}
.wz-sub{margin-top:0}
.wz-cnt{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.wz-cnt em{font-style:normal;font-size:11.5px;font-weight:600;color:var(--muted)}
.wz-pads{display:flex;flex-wrap:wrap;gap:18px;margin-top:14px}
.wz-padw{display:flex;flex-direction:column;gap:7px;align-items:flex-start}
.wz-pad-row{display:flex;align-items:center;gap:14px}
.wz-logopos-row{display:flex;gap:28px;flex-wrap:wrap;align-items:flex-start;margin-top:8px}
.wz-ai-vidnm{font-size:11.5px;font-weight:600;color:var(--muted)}
.wz-clientcard-nm{font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:-.01em;color:var(--text)}
.wz-clientcard-cn{margin-top:4px;font-size:13px;color:var(--text-2)}
.wz-padw .t{font-size:11.5px;font-weight:600;color:var(--muted)}
.wz-pad{display:grid;grid-template-columns:repeat(3,34px);grid-template-rows:repeat(3,22px);gap:4px;padding:6px;border:1px solid var(--field-border);border-radius:9px;background:var(--field)}
.wz-pad button{border:0;border-radius:5px;background:var(--surface-3);cursor:pointer;transition:background .16s ease,transform .14s ease}
.wz-pad button:hover:not(.on){background:var(--border-strong)}
.wz-pad button.on{background:var(--accent);box-shadow:0 3px 8px -3px color-mix(in srgb,var(--accent) 60%,transparent)}
.wz-padl{font-size:12px;font-weight:600;color:var(--text-2)}
.wz-meta-chip .btn--ghost,.wz-meta-chip label.btn{width:fit-content}
.wz-meta-chip label.btn.btn--ghost,.wz-vc label.btn.btn--ghost{background:var(--field);border-color:var(--field-border);color:var(--text-2)}
.wz-meta-chip label.btn.btn--ghost:hover,.wz-vc label.btn.btn--ghost:hover{background:var(--surface);border-color:var(--border-strong);color:var(--text)}
@media(max-width:820px){.wz-sumv .r{grid-template-columns:24px 1fr 50px;gap:8px}.wz-sumv .r span:nth-child(n+4){display:none}}
.wz-tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.wz-tri > .wz-meta-chip{min-width:0}
.wz-two--top{align-items:start}
/* шаг «Монтаж»: часть плашек в паре раскрывается доп.содержимым (файл, язык и т.д.) — без выравнивания
   по высоте соседняя плашка остаётся короткой и под ней/рядом виснет пустота, ряд выглядит «вразброс» */
#tz-4 .wz-two--top{align-items:stretch}
#tz-4 .wz-two--top > .wz-meta-chip{display:flex;flex-direction:column}
.wz-vcs > .wz-meta-chip{flex:none}
.wz-inrow{display:flex;align-items:center;gap:8px;margin-top:6px}
.wz-inrow .in{max-width:none;flex:1 1 100px;min-width:80px}
.wz-inrow .wz-filectl{max-width:60%}
.wz-fic{width:33px;min-width:33px;padding:0 !important;justify-content:center;flex:none}
#tz-3 .wz-meta-chip .in,#tz-4 .wz-meta-chip .in{max-width:none}
.wz-fic .ico{width:15px;height:15px}
.wz-fic.has{border-color:var(--accent) !important;color:var(--accent) !important}
.wz-pills .wz-fic{margin-left:2px}
.wz-subg{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.wz-subg .l{display:block;margin-bottom:6px}
.wz-fmts{display:flex;flex-wrap:wrap;gap:26px;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.wz-fmtb{display:flex;flex-direction:column;gap:10px}
.wz-fmtb .t{font-size:12.5px;font-weight:600;color:var(--text)}
.wz-fmtb-r{display:flex;flex-wrap:wrap;align-items:flex-start;gap:16px 22px}
.wz-fmtb .wz-cnt{margin-top:0}
.wz-fmtb .wz-pads{margin-top:0}
@media(max-width:700px){.wz-tri{grid-template-columns:1fr}}
.wz-dl .att-cal.wz-scd .att-cal-pop{top:calc(100% + 6px);bottom:auto}
.wz-vc label.btn.wz-fic{width:33px;min-width:33px}
#tz-5 .wz-vc-h{margin-bottom:0}
#tz-5 .wz-vc-h + .wz-vc-g{margin-top:14px}
#tz-5 .wz-vc .in{max-width:none}
#tz-5 .wz-dl .att-cal-trig{width:100%;margin-top:0}
.wz-gate{display:flex;flex-direction:column;gap:12px;padding:14px 16px;border-radius:12px;background:var(--surface-2);box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.wz-gate.ok{flex-direction:row;align-items:center;gap:12px}
.wz-gate .hd{display:flex;align-items:center;gap:12px}
.wz-gate .ic{flex:none;width:34px;height:34px;border-radius:999px;display:grid;place-items:center;background:var(--crit-soft);color:var(--crit);font-size:17px;font-weight:800}
.wz-gate.ok .ic{background:var(--accent);color:var(--accent-fg)}
.wz-gate .ic .ico{width:17px;height:17px;stroke-width:3}
.wz-gate b{display:block;font-size:14px;font-weight:600;color:var(--text)}
.wz-gate span:not(.ic){font-size:12.5px;color:var(--muted)}
.wz-gate ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 24px}
.wz-gate li{position:relative;padding:6px 0 6px 16px;font-size:13px;color:var(--text)}
.wz-gate li::before{content:'';position:absolute;left:1px;top:12px;width:6px;height:6px;border-radius:999px;background:var(--crit)}
.wz-gate li.more{color:var(--muted)}
.wz-gate li.more::before{background:var(--border-strong)}
.wz-cnt-b{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;padding:0 7px;margin-left:6px;border-radius:999px;background:var(--surface-3);color:var(--text-2);font-size:11.5px;font-weight:700;vertical-align:1px}
.wz-tks{display:flex;flex-direction:column;gap:2px;margin-top:6px}
.wz-tk{display:flex;flex-direction:column;gap:1px;padding:7px 0;border-top:1px solid var(--border)}
.wz-tk:first-child{border-top:0}
.wz-tkcol{display:flex;flex-direction:column;gap:12px}
.wz-tk-d{display:grid;grid-template-columns:130px 1fr;gap:10px;font-size:12px;line-height:1.45;margin-top:3px}
.wz-tk-d i{font-style:normal;color:var(--muted)}
.wz-tk-d em{font-style:normal;color:var(--text);white-space:pre-line;overflow-wrap:anywhere}
.wz-tk > span{margin-top:5px}
.wz-tk-d + span{padding-top:6px}
.wz-tk b{font-size:13px;font-weight:600;color:var(--text)}
.wz-tk span{font-size:12px;color:var(--muted)}
.wz-legal p{margin:0;font-size:13px;line-height:1.6;color:var(--text-2)}
#tz-6 .wz-dl .att-cal-trig{width:100%;margin-top:0}
#tz-6 .wz-dl .att-cal-pop{top:calc(100% + 6px);bottom:auto}
#tz-6 .wz-meta-chip .in{max-width:none}
@media(max-width:700px){.wz-gate ul{grid-template-columns:1fr}}

/* ——— страница «Проекты» v3 ——— */
.pj-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.pj-kpi{background:var(--surface);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:3px;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35);min-width:0}
.pj-kpi .l{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.pj-kpi .v{font-family:var(--font-display);font-size:28px;font-weight:800;line-height:1.15;color:var(--text);font-variant-numeric:tabular-nums}
.pj-kpi .v.crit{color:var(--crit)}
.pj-kpi .s{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-sec{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:6px}
.pj-sec-r{display:flex;gap:8px}
.proj-page .cal-strip-wrap{border-radius:16px;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.proj-board{gap:14px;align-items:stretch}
.proj-col{flex:1 1 260px;min-width:260px;background:var(--surface-2);border-radius:18px;padding:12px;gap:12px;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.proj-col-h{padding:2px 4px 0}
.proj-col-h .t{font-size:11.5px;font-weight:800;color:var(--text-2)}
.proj-col--at_risk .proj-col-h .n{background:var(--crit);color:#fff}
.proj-card2{background:var(--surface);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:12px;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.18),0 6px 14px -10px rgba(0,0,0,.45);transition:transform .16s,box-shadow .16s,background .16s}
.proj-card2:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(0,0,0,.2),0 14px 24px -12px rgba(0,0,0,.55)}
.proj-card2:active{transform:translateY(0)}
.proj-card2-hero{display:flex;align-items:baseline;gap:7px}
.proj-card2-hero .n{font-family:var(--font-display);font-size:30px;font-weight:800;line-height:1;color:var(--text);font-variant-numeric:tabular-nums}
.proj-card2-hero .u{font-size:11.5px;font-weight:600;color:var(--muted)}
.proj-card2.late .proj-card2-hero .n{color:var(--crit)}
.proj-card2-bar{height:6px}
.proj-card2-foot .pm{display:flex;align-items:center;gap:7px;min-width:0}
.proj-card2-foot .pm .avatar{width:22px;height:22px;font-size:9px;flex:none}
.proj-card2-foot .pm span{font-size:12px;font-weight:600;color:var(--text-2)}
@media(max-width:900px){.pj-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}

.wz-two--pf{grid-template-columns:minmax(0,3fr) minmax(0,7fr)}
.wz-ck--sm{margin-top:0;font-size:13px}
.wz-pf{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:4px}
.wz-two .wz-pf .in{max-width:200px}
.wz-meta-chip .wz-stepper{margin-top:4px}
@media(max-width:600px){.wz-meta-chip{min-width:100%}}
.wz-datebtn{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface-2);color:var(--text);font-weight:600;font-size:13px;cursor:pointer}
.wz-datebtn:hover{border-color:var(--accent)}
.wz-datebtn.empty{color:var(--muted)}
.wz-datebtn.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.wz-datebtn.bad{border-color:var(--crit);background:var(--crit-soft)}
.wz-cal{background:var(--surface);border:1px solid var(--border-strong);border-radius:12px;padding:13px;max-width:326px;margin:10px 0 4px;box-shadow:var(--shadow)}
.wz-cal-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.wz-cal-hd b{font-family:var(--font-display);font-size:13.5px;text-transform:capitalize}
.wz-cal-nav{width:28px;height:28px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer;font-size:14px;line-height:1}
.wz-cal-nav:hover{border-color:var(--accent);color:var(--accent)}
.wz-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.wz-cal-grid .wd{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);text-align:center;padding:3px 0}
.wz-day{position:relative;aspect-ratio:1;border:1.5px solid transparent;border-radius:9px;background:var(--surface-2);color:var(--text);font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums}
.wz-day:hover{border-color:var(--accent)}
.wz-day.out{color:var(--muted);background:transparent;opacity:.4;cursor:default}
.wz-day.out:hover{border-color:transparent}
.wz-day.today{box-shadow:inset 0 0 0 1.5px var(--border-strong)}
.wz-day.sel{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.wz-day.used{border-color:var(--warn)}
.wz-day .av{position:absolute;bottom:3px;left:50%;transform:translateX(-50%);width:5px;height:5px;border-radius:999px}
.wz-day .av.ok{background:var(--ok)}
.wz-day .av.mid{background:var(--warn)}
.wz-day .av.no{background:var(--crit)}
.wz-day.sel .av,.wz-day.out .av{display:none}
.wz-day .cnt{position:absolute;top:2px;right:3px;font-size:8.5px;font-weight:800;color:var(--accent);background:var(--surface);border-radius:999px;min-width:12px;height:12px;line-height:12px;text-align:center;padding:0 2px}
.wz-day.sel .cnt{color:var(--accent-fg);background:transparent}
.wz-day.pmbusy{box-shadow:inset 0 0 0 1.5px var(--crit)}
.wz-day.pmbusy.sel{box-shadow:none}
.wz-cal-legend{display:flex;flex-wrap:wrap;gap:8px 12px;margin-top:9px;font-size:9.5px;color:var(--muted)}
.wz-cal-legend .cntkey{color:var(--accent)}
.wz-cal-day{margin-top:11px;border-top:1px solid var(--border);padding-top:10px;font-size:12px}
.wz-cal-day > b{font-size:12.5px;display:block}
.wz-cal-day-title::first-letter{text-transform:uppercase}
.wz-cal-day-sec{margin-top:9px}
.wz-cal-day-sec .k{display:block;font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:4px}
.wz-cal-day-sec .row{display:flex;justify-content:space-between;gap:8px;padding:3px 0;border-bottom:1px solid var(--border)}
.wz-cal-day-sec .row:last-child{border-bottom:0}
.wz-cal-day-sec .tm{font-family:var(--font-mono);color:var(--text-2);flex:none}
.wz-cal-day-sec .busy{color:var(--warn);font-weight:600;flex:none}
.wz-cal-day-sec .freeok{color:var(--ok);font-weight:600;flex:none}
.wz-cal-day-sec .ext{color:var(--muted);font-size:10px;flex:none}
.wz-stepper{display:inline-flex;align-items:center;height:33px;border:1px solid var(--field-border);border-radius:8px;overflow:hidden;background:var(--field);width:fit-content;transition:border-color .12s,box-shadow .12s}
.wz-stepper:hover{border-color:var(--border-strong)}
.wz-stepper button{width:34px;height:31px;display:grid;place-items:center;border:0;background:transparent;color:var(--text-2);cursor:pointer;transition:background .22s ease,color .22s ease}
.wz-stepper button .ico{width:14px;height:14px;stroke-width:2.2;transition:transform .22s cubic-bezier(.22,1,.36,1)}
.wz-stepper button:hover{background:var(--accent-soft);color:var(--accent)}
.wz-stepper button:active .ico{transform:scale(.72)}
.wz-stepper button:disabled{opacity:.3;cursor:not-allowed;background:transparent;color:var(--text-2)}
.wz-stepper button:disabled .ico{transform:none}
.wz-stepper button:focus-visible{outline:0;background:var(--accent-soft);color:var(--accent)}
.wz-stepper .val{min-width:44px;padding:0 4px;text-align:center;color:var(--text);font-weight:700;font-size:14px;font-variant-numeric:tabular-nums;display:inline-block;user-select:none}
.wz-stepper .val.up{animation:wz-val-up .42s cubic-bezier(.22,1,.36,1)}
.wz-stepper .val.down{animation:wz-val-down .42s cubic-bezier(.22,1,.36,1)}
@keyframes wz-val-up{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes wz-val-down{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.wz-stepper .val.up,.wz-stepper .val.down{animation:none}.wz-stepper button,.wz-stepper button .ico{transition:none}}
.wz-warn{margin:7px 0 2px;font-size:11.5px;line-height:1.45;color:var(--crit);background:var(--crit-soft);border-radius:8px;padding:8px 10px}
.wz-warn .linkbtn{color:var(--crit)}
.wz-plan-hd{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.wz-ed-lbl{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:6px;display:block}
.linkbtn{background:none;border:0;color:var(--accent);font-weight:600;font-size:12px;cursor:pointer;padding:0}
.pdot{width:7px;height:7px;border-radius:999px;display:inline-block;flex:none;background:var(--muted)}
.pdot.ok{background:var(--ok)} .pdot.warn{background:var(--warn)} .pdot.crit{background:var(--crit)}
.wz-stat{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:var(--text-2);margin-left:auto;white-space:nowrap}
/* day cards */
.wz-daycards{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:12px}
.wz-daycard{background:var(--surface-2);border-radius:12px;padding:14px 16px;transition:box-shadow .16s}
.wz-daycard.crit{box-shadow:inset 0 0 0 1px var(--crit)}
.wz-daycard.warn{}
.wz-dc-hd{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:11px}
.wz-dc-hd b{font-size:13.5px;font-weight:600;color:var(--text)}
.wz-dc-pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:999px;white-space:nowrap}
.wz-dc-pill .ico{width:12px;height:12px}
.wz-dc-pill.ok{background:var(--surface-3);color:var(--text-2)}
.wz-dc-pill.warn{background:var(--surface-3);color:var(--text-2)}
.wz-dc-pill.crit{background:var(--crit-soft);color:var(--crit)}
.wz-dc-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;margin-bottom:9px}
.wz-dc-row .rl{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted);width:62px;flex:none}
.wz-dc-row .ic{flex:none;display:inline-flex;color:var(--muted)}
.wz-dc-row .ic .ico{width:16px;height:16px}
.wz-dc-row .nm{font-weight:600;font-size:12.5px}
.wz-dc-time{display:inline-flex;align-items:center;gap:5px;font-size:12px}
.wz-dc-time input{width:92px;height:33px;padding:0 10px;border:1px solid var(--field-border);border-radius:8px;background:var(--field);color:var(--text);font:inherit;font-size:12.5px;font-weight:600;transition:border-color .12s,box-shadow .12s,background .12s}
.wz-dc-time input:hover{border-color:var(--border-strong)}
.wz-dc-time input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--surface)}
.wz-dc-time b{font-family:var(--font-display);font-variant-numeric:tabular-nums;color:var(--text);margin-left:4px;font-size:13px}
.wz-dc-foot{margin-top:6px;padding-top:9px;border-top:1px solid var(--border)}
/* date popover */
.wz-datepick{position:relative}
.wz-datebtn{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:33px;padding:0 13px;border:1px solid var(--field-border);border-radius:8px;background:var(--field);color:var(--text);font-weight:600;font-size:12.5px;transition:border-color .12s,box-shadow .12s,background .12s}
.wz-datebtn:hover{border-color:var(--border-strong)}
.wz-datebtn::-webkit-details-marker{display:none}
.wz-datebtn.empty{color:var(--muted)}
.wz-datepick[open] .wz-datebtn{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--surface)}
.wz-datepick-body{position:absolute;left:0;top:calc(100% + 6px);z-index:40}
/* mini calendar */
.wz-mc{background:var(--surface);border:1px solid var(--border-strong);border-radius:11px;box-shadow:var(--shadow);padding:11px;width:280px}
.wz-mc-hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.wz-mc-hd b{font-family:var(--font-display);font-size:12.5px;text-transform:capitalize}
.wz-mc-hd button{width:26px;height:26px;border-radius:7px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer}
.wz-mc-hd button:hover{border-color:var(--accent);color:var(--accent)}
.wz-mc-g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.wz-mc-g .wd{font-size:8.5px;font-weight:700;text-transform:uppercase;color:var(--muted);text-align:center;padding:2px 0}
.wz-mc-d{position:relative;aspect-ratio:1.15;border:1.5px solid transparent;border-radius:7px;background:var(--surface-2);color:var(--text);font-size:11.5px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums}
.wz-mc-d:hover{border-color:var(--accent)}
.wz-mc-d.out{opacity:.35;background:transparent;cursor:default}
.wz-mc-d.out:hover{border-color:transparent}
.wz-mc-d.today{box-shadow:inset 0 0 0 1.5px var(--border-strong)}
.wz-mc-d.sel{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.wz-mc-d.used{border-color:var(--warn)}
.wz-mc-d.pmb{border-color:var(--crit)}
.wz-mc-d.sel.pmb,.wz-mc-d.sel.used{box-shadow:none}
.wz-mc-d .d{position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:999px}
.wz-mc-d .d.ok{background:var(--ok)} .wz-mc-d .d.mid{background:var(--warn)} .wz-mc-d .d.no{background:var(--crit)}
.wz-mc-d.sel .d,.wz-mc-d.out .d{display:none}
.wz-mc-lg{font-size:9px;color:var(--muted);margin-top:7px;line-height:1.4}
/* availability line */
.wz-avail{font-size:11.5px;line-height:1.5;margin:2px 0 4px}
.wz-avail .t{font-weight:800;text-transform:uppercase;font-size:9px;letter-spacing:.04em;margin-right:5px}
.wz-avail .t.ok{color:var(--text-2)}
.wz-avail .t.bs{color:var(--text-2)}
/* operator shutter */
.wz-dd-grp{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:7px 10px 3px}
.wz-dd-menu button[disabled]{opacity:.45;cursor:not-allowed}
.wz-dd-menu button .pdot{margin-right:2px}
/* person (editor/AI) workload picker */
.wz-ppick .wz-dd-menu{min-width:340px}
.wz-prow{display:flex!important;flex-direction:column;gap:5px;align-items:stretch!important;text-align:left;padding:9px 11px!important;border-radius:8px}
.wz-prow:hover{background:var(--surface-2)}
.wz-prow.dis{opacity:.5;cursor:not-allowed}
.wz-prow .hd{display:flex;align-items:center;gap:7px;font-size:12.5px}
.wz-prow .hd b{font-weight:700}
.wz-prow .hd .st{margin-left:auto;font-size:10.5px;font-weight:600;color:var(--muted);text-align:right}
.wz-lstrip{display:flex;gap:2px}
.wz-lstrip .d{flex:1;height:8px;border-radius:2px;background:var(--surface-3)}
.wz-lstrip .d.req{background:var(--accent-soft)}
.wz-lstrip .d.b{background:var(--warn)}
.wz-prow .tls{display:flex;flex-direction:column;gap:1px}
.wz-prow .tl{font-size:10.5px;color:var(--text-2)}
.wz-prow .tl.ov{color:var(--warn);font-weight:600}
.wz-actsum{display:flex;gap:10px;align-items:flex-start;background:var(--surface-2);border:1px solid var(--border);border-radius:9px;padding:9px 11px;margin:8px 0 2px;font-size:12px}
.wz-actsum .avatar{width:36px;height:36px;font-size:12px;flex:none}
.wz-actsum .m{color:var(--muted);font-size:11px;margin-top:2px}
.wz-gearsel{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.wz-gearsel .badge{gap:6px}
.wz-gearsel .badge button{border:0;background:none;color:var(--crit);cursor:pointer;font-weight:700;padding:0;display:inline-flex;align-items:center}
.wz-gearsel .badge button .ico{width:12px;height:12px}
.wz-prow .hd input[type=checkbox]{width:14px;height:14px;accent-color:var(--accent)}
.wz-style-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px}
.wz-style-opt{border:1px solid var(--border-strong);border-radius:9px;padding:9px 11px;background:var(--surface-2)}
.wz-style-opt.on{border-color:var(--accent);background:var(--accent-soft)}
.wz-style-opt .ck b{font-weight:700;font-size:13px}
.wz-refs{margin-top:5px}
.wz-refs>summary{list-style:none;cursor:pointer;font-size:10.5px;font-weight:700;color:var(--accent)}
.wz-refs>summary::-webkit-details-marker{display:none}
.wz-refs-body{display:flex;flex-direction:column;gap:2px;margin-top:4px}
.wz-refs-body .rf{font-size:11px;color:var(--text-2)}
.wz-airow{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;padding:6px 0;border-bottom:1px solid var(--border)}
.wz-airow:last-child{border-bottom:0}
.wz-airow .nm{font-weight:600;font-size:12.5px;min-width:120px}
.wz-err{color:var(--crit);font-size:11px;font-weight:600;margin:3px 0 0}
/* ——— settings page · shadcn form pattern ——— */
.sf-page{max-width:none;padding:22px 24px}
.sf-wrap{max-width:none;display:flex;flex-direction:column;gap:18px}
.sf-wrap .page-head{margin-bottom:2px}
.sf-row2{display:grid;grid-template-columns:1fr;gap:18px;align-items:stretch}
.sf-row2 > .sf-card{display:flex;flex-direction:column}
.sf-row2 .sf-grid,.sf-row2 .sf-grid.c3{grid-template-columns:1fr}
.sf-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px 0 18px;box-shadow:var(--shadow)}
.sf-head{margin:0 18px;padding:0}
.sf-head h3{font-size:16px;font-weight:600;line-height:1.25;letter-spacing:-.01em}
.sf-head p{font-size:13.5px;color:var(--muted);margin:6px 0 0;line-height:1.5}
.sf-body{padding:20px 18px 0;display:flex;flex-direction:column;gap:22px}
.sf-group{display:flex;flex-direction:column;gap:14px}
.sf-group--gap{margin-top:14px}
.sf-mult-row{display:flex;flex-wrap:wrap;gap:16px}
.sf-mult-row .sf-item{flex:0 0 auto;max-width:100%}
.sf-mult-row .dd-trigger{min-width:104px}
.sf-group--split{flex-direction:row;align-items:flex-start;justify-content:flex-start;gap:40px;flex-wrap:wrap}
.sf-group--split > div:first-child{flex:0 1 auto;min-width:0}
.sf-group--split .sf-gd{max-width:44ch}
.sf-group--split .sf-mult-row{flex:0 0 auto}
@media(max-width:760px){.sf-group--split{flex-direction:column;gap:14px}}
@media(max-width:680px){.sf-mult-row{flex-direction:column}.sf-mult-row .sf-item{width:100%}}
.sf-gh{font-size:13.5px;font-weight:600;color:var(--text)}
.sf-gd{margin:4px 0 0;font-size:13.5px;color:var(--muted);line-height:1.5;max-width:76ch}
.sf-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.sf-grid.c3{grid-template-columns:1fr 1fr 1fr}
.sf-grid.c4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){.sf-grid.c4{grid-template-columns:1fr 1fr}}
.sf-grid .s2{grid-column:1 / -1}
.sf-item{display:flex;flex-direction:column;gap:8px;min-width:0}
.sf-item > label{font-size:13.5px;font-weight:600;color:var(--text);line-height:1;display:flex;align-items:center}
.off-tag{display:none;margin-left:8px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted);background:var(--surface-3);padding:2px 6px;border-radius:5px;line-height:1}
.sf-item.off > label{color:var(--muted)}
.sf-item.off .off-tag{display:inline-block}
.sf-item.off .sf-ctl{opacity:.5}
.sf-item.off .sf-ctl:focus-within{opacity:1}
.sf-ctl{position:relative;display:flex;align-items:center;gap:4px;height:33px;padding:0 13px;cursor:text;
  border:1px solid var(--field-border);border-radius:8px;background:var(--field);transition:box-shadow .12s ease,border-color .12s ease}
.sf-ctl:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.06);border-color:var(--border-strong)}
.sf-ctl:hover .u,.sf-ctl:focus-within .u{color:var(--text)}
.sf-ctl:focus-within{border-color:var(--border-strong)}
.sf-ctl > input{flex:1;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;color:var(--text);font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:12.5px;font-weight:600;appearance:none}
.sf-ctl > input::placeholder{color:var(--muted)}
.sf-ctl.unit > input{flex:0 1 auto;field-sizing:content;min-width:1.5ch;max-width:100%}
.sf-ctl > .u{flex:none;font-family:var(--font-body);font-size:12.5px;font-weight:600;color:var(--muted);pointer-events:none;transition:color .12s ease}
.sf-item .dd-val,.sf-item .dd-opt{font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.sf-item .dd:not(.open) .dd-trigger:hover{background:var(--surface-2);border-color:var(--border-strong)}
.sf-hint{font-size:12px;color:var(--muted);line-height:1.4;margin-top:-4px}

/* ——— settings · shadcn form: label above input, 2-up grid, scale tables ——— */
.sf-form{display:flex;flex-direction:column;gap:16px}
.sf-fgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:640px){.sf-fgrid{grid-template-columns:1fr}}
.sf-f{display:flex;flex-direction:column;gap:6px;min-width:0}
.sf-fl{font-size:12.5px;font-weight:600;color:var(--text);line-height:1.25}
.sf-fw{position:relative;display:block}
.sf-fw .in{width:100%;font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.sf-fw.has-u .in{padding-right:46px}
.sf-fw .sf-fu{position:absolute;top:0;right:12px;height:100%;display:flex;align-items:center;
  font-family:var(--font-body);font-size:11.5px;font-weight:600;color:var(--muted);pointer-events:none}
/* scale table */
.sf-tbl{width:100%;border-collapse:collapse}
.sf-tbl th{text-align:left;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:0 0 10px}
.sf-tbl td{padding:6px 0;border-top:1px solid var(--border);vertical-align:middle}
.sf-tbl tr:first-child td{border-top:0}
.sf-tbl td:first-child{font-size:13px;font-weight:500;color:var(--text);padding-right:16px}
.sf-tbl td:last-child{width:190px}
.sf-tbl .sf-fw .in,.sf-tbl select.in{height:32px}
.sf-sub{margin:22px 0 12px;font-size:13px;font-weight:600;color:var(--text)}

/* bordered key-value grid — full-width rule under the header, centre divider, rule under every row */
.sf-card--grid{padding-bottom:0}
.sf-card--grid .sf-head{margin:0 18px 15px}
.sf-card--grid .sf-body{padding:0;border-top:1px solid var(--border);display:block}
/* drop the divider under the very last row of the card */
.sf-card--grid .sf-body > .sfg--1:last-child .sfg-cell:last-child,
.sf-card--grid .sf-body > .sfg--3:last-child .sfg-cell,
.sf-card--grid .sf-body > .sfg:not(.sfg--1):not(.sfg--3):last-child .sfg-cell:nth-last-child(-n+2){border-bottom:0}
.sfg{display:grid;grid-template-columns:1fr 1fr;position:relative}
.sfg::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--border)}
.sfg-cell{display:flex;align-items:center;justify-content:space-between;gap:16px;min-width:0;
  padding:11px 18px;border-bottom:1px solid var(--border)}
.sfg-name{font-size:13px;font-weight:500;color:var(--text);line-height:1.35;min-width:0}
.sfg-val{flex:none;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.sfg-num{font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:16px;font-weight:600;color:var(--text);line-height:1}
.sfg-u{font-size:12.5px;font-weight:600;color:var(--text)}
.sfg-edit{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-left:1px;flex:none;
  border:0;background:none;border-radius:6px;color:var(--text);cursor:pointer;transition:background .12s ease}
.sfg-edit svg{width:14px;height:14px}
.sfg-edit:hover{background:var(--surface-3)}
.sfg-in{width:96px;height:28px;padding:0 8px;text-align:right;border:1px solid var(--border-strong);border-radius:6px;
  background:var(--field);color:var(--text);font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:13px;font-weight:600;outline:0}
.sfg-sel{height:30px;padding:0 6px;border:1px solid var(--border-strong);border-radius:6px;
  background:var(--field);color:var(--text);font-family:var(--font-display);letter-spacing:-.01em;font-size:13px;font-weight:600;outline:0;cursor:pointer}
.sfg--1{grid-template-columns:1fr}
.sfg--1::after{display:none}
.sfg--3{grid-template-columns:repeat(3,1fr);border-top:1px solid var(--border)}
.sfg--3::after{display:none}
.sf-card--grid .sf-body > .sfg--3:first-child{border-top:0}
.sfg--3 .sfg-cell:has(.dd-trigger){padding-top:9px;padding-bottom:9px}
.sfg--3 .sfg-cell:not(:nth-child(3n)){border-right:1px solid var(--border)}
.sfg--3 .dd--auto{flex:none}
.sfg--3 .dd-trigger{height:29px}
.sf-card--grid .sf-sub{margin:0;padding:22px 18px 10px;font-size:16px;font-weight:600;color:var(--text);letter-spacing:-.01em}
@media(max-width:640px){.sfg,.sfg--3{grid-template-columns:1fr}.sfg::after{display:none}.sfg--3 .sfg-cell:not(:nth-child(3n)){border-right:0}.sfg-cell:empty{display:none}}

/* custom dropdown — shadcn Select style */
.dd{position:relative}
.dd-trigger{width:100%;height:33px;display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:0 11px 0 13px;border:1px solid var(--field-border);border-radius:8px;background:var(--field);
  color:var(--text);font:inherit;font-size:12.5px;font-weight:600;text-align:left;
  transition:border-color .12s,box-shadow .12s,background .12s}
.dd-trigger:hover{border-color:var(--border-strong)}
.dd-trigger:focus-visible,.dd.open .dd-trigger{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--surface)}
.dd-trigger .chev{width:15px;height:15px;color:var(--muted);flex:none;transition:transform .2s cubic-bezier(.4,0,.2,1)}
.dd.open .dd-trigger .chev{transform:rotate(180deg)}
.dd-menu{position:absolute;z-index:45;top:calc(100% + 6px);left:0;right:0;
  background:var(--surface);border:1px solid var(--border-strong);border-radius:10px;box-shadow:var(--shadow);
  padding:5px;display:none;transform-origin:top center;max-height:min(340px,60vh);overflow-y:auto;overscroll-behavior:contain}
.dd.dd--up .dd-menu{top:auto;bottom:calc(100% + 6px);transform-origin:bottom center}
.dd.open .dd-menu{display:block;animation:dd-in .1s cubic-bezier(.16,1,.3,1)}
.dd.open.closing .dd-menu{animation:dd-out .08s ease forwards}
@keyframes dd-in{from{opacity:0;transform:translateY(-6px) scale(.97)}to{opacity:1;transform:none}}
@keyframes dd-out{to{opacity:0;transform:translateY(-4px) scale(.97)}}
.dd.dd--up .dd-menu{animation-name:dd-in-up}
.dd.dd--up.open.closing .dd-menu{animation-name:dd-out-up}
@keyframes dd-in-up{from{opacity:0;transform:translateY(6px) scale(.97)}to{opacity:1;transform:none}}
@keyframes dd-out-up{to{opacity:0;transform:translateY(4px) scale(.97)}}
.dd-opt{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:8px 9px 8px 10px;border:0;background:none;color:var(--text);font:inherit;font-size:12.5px;
  border-radius:7px;cursor:pointer;text-align:left;transition:none}
.dd-opt:hover,.dd-opt:focus-visible{background:var(--surface-2);outline:0}
.dd-opt .ck{width:15px;height:15px;color:var(--accent);flex:none;opacity:0;transition:opacity .1s}
.dd-opt.on{font-weight:600}
.dd-opt.on .ck{opacity:1}
@media (prefers-reduced-motion:reduce){.dd .dd-menu,.dd-trigger .chev{animation:none!important;transition:none!important}}

/* notifications popover */
.notif{position:relative}
.notif-pop{position:absolute;top:calc(100% + 9px);right:0;width:340px;max-height:min(72vh,460px);
  display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border-strong);
  border-radius:12px;box-shadow:var(--shadow);z-index:60;overflow:hidden;transform-origin:top right;
  animation:dd-in .16s cubic-bezier(.16,1,.3,1)}
.notif-pop[hidden]{display:none}
.notif-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid var(--border)}
.notif-hd > span{font-family:var(--font-display);font-size:14px;font-weight:600}
.notif-clear{border:0;background:none;color:var(--accent);font:inherit;font-size:12px;font-weight:600;cursor:pointer;padding:2px 2px;white-space:nowrap}
.notif-list{overflow-y:auto;padding:5px}
.notif-row{display:flex;gap:11px;padding:11px 10px;border-radius:8px}
.notif-row + .notif-row{border-top:1px solid var(--border)}
.notif-row:hover{background:var(--surface-2)}
.notif-ic{width:30px;height:30px;flex:none;border-radius:999px;display:grid;place-items:center}
.notif-tx{font-size:12.5px;line-height:1.4;color:var(--text)}
.notif-mt{font-size:11px;color:var(--muted);margin-top:3px}
.notif-empty{padding:28px 14px;text-align:center;font-size:12.5px;color:var(--muted)}
@media(max-width:640px){.notif-pop{position:fixed;top:54px;right:8px;left:8px;width:auto}}

/* office geo map (Leaflet) */
.sf-lmap{height:240px;border:1px solid var(--border-strong);border-radius:10px;overflow:hidden;position:relative;z-index:0;background:var(--surface-2)}
.sf-lmap .leaflet-container{height:100%;width:100%;font:inherit;background:var(--surface-2)}
.sf-lmap--dark .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.95)}
.sf-lmap .leaflet-bar a{background:var(--surface);color:var(--text);border-color:var(--border)}
.sf-lmap .leaflet-bar a:hover{background:var(--surface-2)}
/* narrow left column (address + fields), WIDE map on the right */
.sf-card--geo{padding:0}
.sf-card--geo .sf-body{padding:18px}
.sf-geo{--geo-map-h:250px;display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.sf-geo-side{display:flex;flex-direction:column;justify-content:flex-start;gap:12px;min-width:0;min-height:var(--geo-map-h)}
.sf-geo .sf-head{margin:0}
.sf-geo .sf-lmap{width:100%;height:var(--geo-map-h)}
.sf-geo .sfg{grid-template-columns:1fr;border-top:1px solid var(--border);margin-top:2px;margin-left:-18px;margin-right:-28px}
.sf-geo .sfg::after{display:none}
.sf-geo .sfg-cell{padding:12px 28px 12px 18px}
@media(max-width:820px){.sf-geo{grid-template-columns:1fr}.sf-geo-side{min-height:0}.sf-geo .sf-lmap{height:220px}
  .sf-geo .sfg{margin-right:-18px}.sf-geo .sfg-cell{padding-right:18px}}
.sf-geocap{margin-top:0;font-size:13.5px;color:var(--muted);line-height:1.4}
.sf-geocap b,.sf-geocap span{display:block}
.sf-geocap b{color:var(--text-2);font-weight:600}
.sf-geocap #geoCoord{margin-top:2px;font-size:12.5px;font-variant-numeric:tabular-nums}

.set-bar[hidden]{display:none}
.set-bar{position:sticky;bottom:18px;display:flex;justify-content:space-between;align-items:center;gap:14px;
  background:var(--surface);border:1px solid var(--border-strong);border-radius:12px;padding:10px 10px 10px 16px;box-shadow:var(--shadow);
  animation:setbar-in .2s cubic-bezier(.2,.8,.2,1)}
.set-bar > span{font-size:12.5px;font-weight:600;display:flex;align-items:center}
.set-bar > div{display:flex;gap:8px}
@keyframes setbar-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
/* tablet: `position:sticky` breaks (ancestor overflow) — pin it; left edge follows the sidebar, right stops at the panel edge */
@media(min-width:641px) and (max-width:960px){
  .set-bar{position:fixed;bottom:16px;left:264px;right:20px;z-index:55}
  .app.nav-closed .set-bar{left:16px}
}
/* phone: floating bar with edge margins, text + buttons centred */
@media(max-width:640px){
  .set-bar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:55;border-radius:14px;
    flex-wrap:wrap;justify-content:center;gap:10px 12px;padding:13px 14px}
  .set-bar > span{width:100%;justify-content:center;text-align:center}
  .set-bar > div{width:100%;justify-content:center}
}
@media(max-width:680px){.sf-grid,.sf-grid.c3,.sf-grid.c4{grid-template-columns:1fr}}
.segm{display:inline-flex;border:1px solid var(--border-strong);border-radius:8px;overflow:hidden}
.segm button{border:0;background:var(--surface);color:var(--text-2);font:inherit;font-size:12px;font-weight:600;padding:7px 12px;cursor:pointer}
.segm button.on{background:var(--accent);color:var(--accent-fg)}
/* «Проекты» — второй заход (2026-09-18→19): канбан-доска вместо сгруппированной сетки —
   статус читается по КОЛОНКЕ, а не по подписи-заголовку над блоком карточек. Карточка сама
   уже не «мини-таблица» (3 подписанных стата в ряд убраны) — один прогресс-бар + низ со
   сроком/числом задач. Детали проекта в модалке теперь по вкладкам, а не всё стопкой сразу. */
.proj-board{display:flex;gap:14px;align-items:flex-start;overflow-x:auto;padding-bottom:6px;margin:0 -2px;padding:2px 2px 10px}
.proj-col{flex:0 0 288px;display:flex;flex-direction:column;gap:10px}
.proj-col-h{display:flex;align-items:center;gap:8px;padding:2px 2px 0}
.proj-col-h .dot{width:7px;height:7px;border-radius:999px;flex:none}
.proj-col-h .t{font-size:12px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:var(--text-2)}
.proj-col-h .n{margin-left:auto;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:11.5px;font-weight:700;color:var(--muted);background:var(--surface-3);padding:1px 8px;border-radius:999px}
.proj-col-body{display:flex;flex-direction:column;gap:10px}
.proj-col-empty{font-size:12px;color:var(--muted);padding:8px 4px}
.proj-card2{display:flex;flex-direction:column;gap:11px;cursor:pointer;padding:14px}
.proj-card2-kind{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.proj-card2-name{font-weight:700;font-size:14.5px;letter-spacing:-.005em;line-height:1.32;margin-top:3px}
.proj-card2-pm{display:flex;align-items:center;gap:7px}
.proj-card2-pm .avatar{width:22px;height:22px;font-size:9px;flex:none}
.proj-card2-pm span{font-size:12px;font-weight:600;color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.proj-card2-bar{height:5px;border-radius:999px;background:var(--surface-3);overflow:hidden}
.proj-card2-bar i{display:block;height:100%;background:var(--accent);border-radius:999px}
.proj-card2-bar.crit i{background:var(--crit)}
.proj-card2-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11.5px;font-weight:600;color:var(--muted)}
.proj-card2-foot b{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:700;color:var(--text)}
.proj-card2-foot .crit{color:var(--crit)}
.proj-card2-foot .crit b{color:var(--crit)}
.proj-tabs{display:flex;gap:20px;border-bottom:1px solid var(--border);margin:18px 0 16px}
.proj-tab{border:0;background:none;padding:0 0 10px;font:inherit;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .12s ease}
.proj-tab:hover{color:var(--text-2)}
.proj-tab.on{color:var(--text);border-bottom-color:var(--accent)}
/* «Обзор» — верх модалки: люди, геройская цифра срочности, компактная строка метаданных
   (не грид из подписанных ячеек, как было — просто текст через отступы) и сегментный бар. */
.proj-ov{display:flex;flex-direction:column;gap:16px}
.proj-ov-top{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.proj-ov-pm{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:600;color:var(--text)}
.proj-ov-pm .avatar{width:30px;height:30px;font-size:11.5px}
.proj-ov-hero{display:flex;align-items:baseline;gap:8px}
.proj-ov-hero-n{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:800;font-size:32px;letter-spacing:-.02em;color:var(--text)}
.proj-ov-hero-n.crit{color:var(--crit)}
.proj-ov-hero-u{font-size:13px;font-weight:600;color:var(--text-2)}
.proj-ov-meta{display:flex;gap:20px;flex-wrap:wrap;font-size:12.5px;color:var(--text-2)}
.proj-ov-meta b{color:var(--text);font-weight:700;font-family:var(--font-display);font-variant-numeric:tabular-nums;margin-right:4px}
.proj-tbar{display:flex;gap:3px}
.proj-tseg{flex:1;height:8px;border-radius:4px;background:var(--surface-3)}
.proj-tseg.done{background:var(--accent)}
.proj-tseg.prog{background:color-mix(in srgb, var(--accent) 38%, var(--surface-3))}
.proj-tseg.late{box-shadow:inset 0 0 0 2px var(--crit)}
.proj-detail{display:flex;flex-direction:column;gap:12px;cursor:default}
.proj-detail-h{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:8px}
.proj-dsec{background:var(--surface-3);border-radius:9px;padding:12px 14px}
.proj-dsec .row{border-bottom:0;padding:8px 0}
.proj-dsec .row+.row{border-top:1px solid var(--border)}
.proj-dsec .row .t{font-size:13.5px}
.proj-dsec .row .m{color:var(--text-2);font-size:12.5px}
.proj-dsec .row .nowr{color:var(--text-2);font-weight:600;font-size:12.5px}
.proj-crew{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;align-items:start}
.proj-tgroup{background:var(--surface-3);border-radius:9px;padding:12px 14px;display:flex;flex-direction:column}
.proj-tgroup .tm-card-top{padding-bottom:8px}
.proj-tgroup .tm-card-name .n{font-size:14px}
.proj-tgroup .badge{background:var(--surface-2);color:var(--text);font-weight:700;font-size:12px;padding:3px 9px}
.proj-tgroup .row{border-bottom:0;padding:8px 0}
.proj-tgroup .row+.row{border-top:1px solid var(--border)}
.proj-tgroup .row .t{font-size:13.5px}
.proj-tgroup .row .m{color:var(--text-2);font-size:12.5px}
.proj-tgroup .row .m.overdue{color:var(--crit)}
@media(max-width:720px){.proj-detail .grid.g2,.proj-crew{grid-template-columns:1fr}}
.wz-tg{margin-top:12px}
.wz-tg-h{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);display:flex;align-items:center;gap:8px;margin-bottom:5px}
.wz-trow{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:7px 0;border-bottom:1px solid var(--border);font-size:12px}
.wz-trow:last-child{border-bottom:0}
.wz-trow .nm{font-weight:600}
.wz-trow .dl{font-family:var(--font-mono);color:var(--accent);font-size:11px;white-space:nowrap;text-align:right}
.wz-trow .src{grid-column:1/-1;font-size:10.5px;color:var(--muted)}
.wz-trow .note{grid-column:1/-1;font-size:10.5px;color:var(--warn);font-weight:600}
.wz-addchip{border:1px dashed var(--accent);background:var(--accent-soft);color:var(--accent);border-radius:10px;padding:10px 16px;font-size:12.5px;font-weight:700;cursor:pointer}

/* calendar */
.cal{display:grid;grid-template-columns:repeat(7,1fr);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--surface)}
.cal .hd{padding:9px 10px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);border-bottom:1px solid var(--border);background:var(--surface-2)}
.cal .cell{min-height:150px;max-height:340px;overflow-y:auto;border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:8px;display:flex;flex-direction:column;gap:5px}
.cal .cell:nth-child(7n)  {border-right:0}
.cal .daynum{font-size:12px;font-weight:700;color:var(--text-2)}
.cal .cell.today .daynum{background:var(--accent);color:var(--accent-fg);width:22px;height:22px;display:grid;place-items:center;border-radius:999px}
.cal .cell.dim{background:var(--surface-2)}
.ev{font-size:11px;font-weight:600;padding:4px 6px;border-radius:6px;background:var(--surface-2);color:var(--text);border-left:3px solid var(--muted);line-height:1.25;cursor:pointer}
.ev:hover{filter:brightness(0.97)}
.ev.pp{border-left-color:var(--dept-pp)}
.ev.mont{border-left-color:var(--dept-mont)}
.ev.ai{border-left-color:var(--dept-ai)}
.ev.shoot{border-style:double;border-left-width:4px;font-weight:700}
.ev .evm{font-weight:500;color:var(--muted)}
.cal--compact .cell{min-height:96px}
/* календарная полоса — та же форма (колонки дней + список событий со скроллом), но легче:
   события больше не залитые «коробки в коробке», а тонкая цветная полоска слева (акцент
   time-anchored съёмки в accent, обычная задача — нейтральная), без фона до наведения. */
.cal-strip-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:14px;background:var(--surface)}
.cal-strip{display:flex;min-width:max-content;align-items:stretch}
.cal-strip-col{width:190px;flex:none;padding:14px 14px 12px;display:flex;flex-direction:column;border-right:1px solid var(--border)}
.cal-strip-col:last-child{border-right:0}
.cal-strip-col.today{background:var(--accent-soft)}
.cal-strip-col.dim{background:var(--surface-2)}
.cal-strip-hd{display:flex;align-items:baseline;gap:6px;padding-bottom:12px;margin-bottom:8px}
.cal-strip-hd .wd{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.cal-strip-hd .daynum{font-size:14px;font-weight:800;color:var(--text);font-family:var(--font-body)}
.cal-strip-col.today .cal-strip-hd .daynum{color:var(--accent)}
/* тело дня со своим скроллом — плотный день не растягивает всю полосу и не ломает
   выравнивание с соседями; события отсортированы по факт. времени (сначала съёмки по
   t.shoot.from, потом задачи без точного времени), а не в порядке TASKS.forEach */
.cal-strip-evs{display:flex;flex-direction:column;gap:1px;max-height:280px;overflow-y:auto}
.cal-ev{border-left:2px solid var(--border-strong);padding:9px 4px 9px 12px;cursor:pointer;display:flex;flex-direction:column;gap:3px;flex:none;border-radius:0 8px 8px 0;transition:background .12s ease}
.cal-ev:hover{background:var(--surface-2)}
.cal-ev--shoot{border-left-color:var(--accent)}
.cal-ev-time{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:12px;font-weight:800;color:var(--accent);letter-spacing:-.01em}
.cal-ev-top{display:flex;align-items:center;gap:6px}
.cal-ev-top .ico{width:13px;height:13px;color:var(--muted);flex:none}
.cal-ev-t{font-size:11.5px;font-weight:600;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-ev-m{font-size:12.5px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-ev--off{border-left-color:var(--border-strong);flex-direction:row;align-items:center;gap:7px;cursor:default;color:var(--text-2);font-size:11.5px;font-weight:700;padding:9px 4px 9px 12px;border-radius:0 8px 8px 0}
.cal-ev--off .ico{width:14px;height:14px;flex:none}
.cal-ev-empty{font-size:11px;color:var(--muted);padding:4px 0 4px 12px}
/* --- «Проекты и задачи» целиком: крупнее, круглее, увереннее — тот же язык, что на карточке --- */
.proj-page .avatar{border-width:2px}
.proj-cal-head{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:10px}
.proj-page .chip{border-radius:999px;height:33px;padding:0 15px;font-weight:700}
.proj-page .segm{border-radius:999px;overflow:hidden;border-color:var(--border-strong)}
.proj-page .segm button{padding:8px 16px;font-weight:700}
.cal--compact .ev{font-size:10px;padding:3px 5px}
@media(max-width:900px){.cal{grid-template-columns:repeat(2,1fr)}.cal .hd{display:none}.cal .cell{min-height:auto}.cal--compact .cell{min-height:auto}}

/* workload heat */
.heat{display:grid;grid-template-columns:150px repeat(7,1fr);gap:4px;font-size:11px}
.heat .hcell{height:30px;border-radius:5px;display:grid;place-items:center;font-weight:700;color:var(--text)}
.heat .name{height:30px;display:flex;align-items:center;color:var(--text-2);font-weight:600}
.heat .hhd{color:var(--muted);text-align:center;font-weight:700;text-transform:uppercase;letter-spacing:.04em}

/* status flow */
.flow{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.flow .st{font-size:11px;font-weight:700;padding:4px 9px;border-radius:999px;background:var(--surface-3);color:var(--muted)}
.flow .st.done{background:var(--ok-soft);color:var(--ok)}
.flow .st.cur{background:var(--accent);color:var(--accent-fg)}
.flow .st.warn{background:var(--warn-soft);color:var(--warn)}
.flow .sep{color:var(--muted)}

.gm-level{display:flex;align-items:center;gap:14px;padding:18px;border-radius:var(--radius);background:var(--accent-soft)}
.gm-ring{width:60px;height:60px;flex:none;border-radius:999px;display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:18px;background:conic-gradient(var(--accent) var(--p,60%),var(--surface-3) 0);position:relative}
.gm-ring::after{content:"";position:absolute;inset:6px;border-radius:999px;background:var(--surface)}
.gm-ring span{position:relative;z-index:1}

.modal-bg{position:fixed;inset:0;background:var(--scrim);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:grid;place-items:center;padding:24px;z-index:60;
  /* на iOS overflow:hidden на .main само по себе не всегда останавливает «резиновый» скролл страницы
     под модалкой — блокируем тач-жесты на самом бэкдропе, а скролл внутри модалки возвращаем отдельно */
  touch-action:none}
.modal-bg .modal{touch-action:pan-y}
/* min-width:0 — .modal-bg это display:grid;place-items:center без явных grid-template-columns,
   неявная колонка по умолчанию растягивается под max-content самого широкого потомка модалки
   (например, <input> со стандартной шириной ~20 символов), а не сжимается под ширину экрана —
   без этого на телефоне модалка может вылезти шире вьюпорта, хотя max-width/width:100% заданы */
.modal{background:var(--surface);border:1px solid var(--border-strong);border-radius:14px;max-width:560px;width:100%;min-width:0;box-shadow:var(--shadow);max-height:88vh;overflow-y:auto}
.modal-head{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--border)}
.modal-head h3{font-size:15px}
.modal-body{padding:18px;display:flex;flex-direction:column;gap:15px}

/* knowledge base */
.kb-grid{display:grid;grid-template-columns:210px minmax(0,1fr);gap:16px;align-items:start}
@media(max-width:820px){.kb-grid{grid-template-columns:minmax(0,1fr)}}
@media(min-width:641px) and (max-width:820px){.app.nav-closed .kb-grid{grid-template-columns:200px minmax(0,1fr)}}
.kb-side .card-body{display:flex;flex-direction:column;gap:3px;padding:12px}
.kb-search{display:flex;align-items:center;gap:8px;border:1px solid var(--field-border);border-radius:8px;background:var(--field);padding:0 13px;margin-bottom:8px;transition:box-shadow .12s ease,border-color .12s ease}
.kb-search .ico{color:var(--muted);flex:none;transition:color .12s ease}
.kb-search input{border:0;outline:0;background:transparent;color:var(--text);font:inherit;font-size:12.5px;font-weight:600;height:31px;width:100%;min-width:0}
.kb-search input::placeholder{color:var(--muted);transition:color .12s ease}
.kb-search:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.06);border-color:var(--border-strong)}
.kb-search:hover .ico{color:var(--text)}
.kb-search:hover input::placeholder{color:var(--text)}
.kb-search:focus-within{border-color:var(--border-strong)}
.kb-search:focus-within .ico{color:var(--text)}
@media (prefers-reduced-motion:reduce){.kb-search,.kb-search .ico,.kb-search input::placeholder,.sf-ctl,.sf-ctl > .u{transition:none}}
.kb-cat-h{font-size:16px;font-weight:600;color:var(--text);letter-spacing:-.01em;padding:2px 4px 9px}
.kb-cat{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;border:0;background:none;padding:8px 10px;border-radius:8px;font:inherit;font-size:13.5px;font-weight:500;color:var(--text);cursor:pointer;text-align:left}
.kb-cat:hover{background:var(--surface-2)}
.kb-cat.on{background:var(--surface-2);color:var(--text);font-weight:600}
.kb-cat .badge{background:var(--surface-2);color:var(--text)}
.kb-cat.on .badge{background:var(--bg)}
.kb-main .card-head h3{font-size:16px;font-weight:600;letter-spacing:-.01em}
.kb-main .card-head{border-bottom:0;padding-bottom:6px}
.kb-main .card-head .badge{color:var(--text)}
.kb-main .card-body{padding-top:10px}
.kb-acc{border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--surface);transition:border-color .2s}
.kb-acc[hidden]{display:none}
.kb-acc.open{border-color:var(--border-strong)}
.kb-acc-hd{display:flex;align-items:center;gap:11px;padding:12px 14px;cursor:pointer}
.kb-acc-hd .kb-chev{color:var(--text);flex:none;margin-left:auto;transition:transform .22s cubic-bezier(.4,0,.2,1)}
.kb-acc.open .kb-acc-hd .kb-chev{transform:rotate(180deg)}
.kb-acc-hd .grow{flex:0 1 auto;min-width:0}
.kb-acc-hd .grow .t{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kb-acc-hd .badge{flex:none;padding:3px 8px;border-radius:6px;font-size:12px;font-weight:600;line-height:1.35;color:var(--text);background:transparent;border:1px solid var(--border-strong)}
.kb-acc-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .26s cubic-bezier(.4,0,.2,1)}
.kb-acc.open .kb-acc-body{grid-template-rows:1fr}
.kb-acc-inner{overflow:hidden;min-height:0}
.kb-acc-pad{padding:4px 14px 14px;background:var(--surface);display:flex;flex-direction:column;gap:12px}
.kb-meta{font-size:12px;color:var(--text-2);line-height:1.4}
.kb-text{font-size:13px;line-height:1.6;color:var(--text-2);margin:0;white-space:pre-wrap}
.kb-file{align-self:flex-start;max-width:100%}
.kb-file > span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kb-file i{font-style:normal;font-size:11px;color:var(--muted);font-weight:500;flex:none}
.kb-foot{display:flex;align-items:flex-end;gap:14px;margin-top:4px}
.kb-foot .kb-meta{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kb-acts{display:flex;gap:8px;margin-left:auto;flex:none}
@media(max-width:520px){
  .kb-foot{flex-wrap:wrap}
  .kb-foot .kb-meta{white-space:normal;flex-basis:100%}
  .kb-acts{margin-left:auto}
}
.kb-empty{padding:30px 14px;text-align:center;color:var(--muted);font-size:13px}
.kb-f{display:flex;flex-direction:column;gap:8px;font-size:12.5px;font-weight:600;color:var(--text-2)}
.kb-f em{font-style:normal;font-weight:400;color:var(--muted)}
.kb-f .in{font-weight:600;background:var(--field);border-color:var(--field-border);transition:border-color .12s,box-shadow .12s,background .12s}
.kb-f .in:hover{border-color:var(--border-strong)}
.kb-f .in:focus{outline:0;background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.kb-dd .dd-trigger{font-weight:600}
.kb-dd:not(.open) .dd-trigger:hover{background:var(--surface-2);border-color:var(--border-strong)}
.kb-dd .dd-menu{min-width:0}
.kb-upl{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;border:1px dashed var(--border-strong);background:var(--field);
  border-radius:8px;padding:9px 14px;font:inherit;font-size:12.5px;font-weight:600;color:var(--text-2);cursor:pointer;transition:border-color .12s,color .12s,background .12s}
.kb-upl:hover{border-color:var(--accent);color:var(--accent)}
.kb-fname{display:flex;align-items:center;gap:8px;margin-top:8px;border:1px solid var(--border-strong);background:var(--surface);border-radius:8px;padding:7px 8px 7px 11px;font-size:12px;font-weight:600;color:var(--text)}
.kb-fname[hidden]{display:none}
.kb-fname > span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kb-fname > button{flex:none;display:grid;place-items:center;width:24px;height:24px;border:0;background:none;color:var(--muted);cursor:pointer;border-radius:6px}
.kb-fname > button:hover{background:var(--surface-2);color:var(--text)}
.modal--wide{max-width:900px;height:82vh;display:flex;flex-direction:column;overflow:hidden}
.modal--wide .modal-head a{white-space:nowrap}
.kb-frame{flex:1;width:100%;border:0;background:#fff}
.kb-noprev{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:30px;text-align:center;background:var(--surface-2)}
.kb-noprev-ic{width:52px;height:52px;border-radius:12px;display:grid;place-items:center;background:var(--surface);border:1px solid var(--border);color:var(--muted)}
.kb-noprev-t{font-size:14px;font-weight:600}
.kb-noprev p{font-size:12.5px;color:var(--muted);margin:0 0 4px}

/* team — карточки сотрудников, сгруппированные по департаментам */
.tm-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px 16px;border-bottom:1px solid var(--border)}
.tm-toolbar-bare{border-bottom:0;padding:0}
.tm-user{display:flex;align-items:center;gap:11px;min-width:0}
.tm-uinfo{min-width:0;display:flex;flex-direction:column;gap:1px}
.tm-uinfo .strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-uc{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.tm-user .avatar{width:32px;height:32px;font-size:11.5px}
.tm-ib{width:30px;height:30px;border:0;background:none;color:var(--muted)}
.tm-ib:hover{background:var(--surface-3);color:var(--text)}
.tm-kebab{position:relative;width:auto}
.tm-kb{width:32px;height:32px;padding:0;display:inline-flex;align-items:center;justify-content:center;
  border:0;border-radius:8px;background:none;color:var(--text);cursor:pointer;transition:none}
.tm-kb svg{display:block}
.tm-kb:hover,.dd.open .tm-kb{background:var(--surface-3);color:var(--text)}
.tm-kebab .dd-menu{left:auto;right:0;min-width:200px;width:max-content}
.tm-kebab .dd-opt{justify-content:flex-start;gap:9px;white-space:nowrap;font-weight:500}
.tm-kebab .dd-opt.del{color:var(--crit)}
.tm-kebab .dd-opt svg{width:15px;height:15px;flex:none;opacity:.7}
.tm-kebab .dd-opt .ck{display:none}
.tm-dept-h{display:flex;align-items:center;gap:8px;padding:2px 0 10px;font-size:16px;font-weight:600;color:var(--text)}
.tm-dept-h .count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 4px;box-sizing:border-box;font-size:11px;font-weight:700;background:var(--surface);color:var(--text);border-radius:999px;border:1px solid var(--border-strong)}
.tm-dept-sec + .tm-dept-sec{margin-top:14px}
/* ——— карточка сотрудника: шапка сверху, затем статистика (слева) + контакты (справа) под одной разделительной линией во всю ширину карточки ——— */
.card.pad.tm-card{padding:14px 18px}
.tm-card{gap:0}
.tm-card-top{display:flex;align-items:center;gap:11px}
.tm-card-top .tm-kebab,.tm-card-top .tm-ib{margin-right:-7px}
.tm-card-top .avatar{width:32px;height:32px;font-size:11.5px}
.tm-card-top .tm-kb,.tm-card-top .tm-ib{width:30px;height:30px}
.tm-card-name{min-width:0;flex:1;display:flex;flex-direction:column;gap:0}
.tm-card-name .n{font-size:13.5px;font-weight:600;line-height:1.25;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-card-name .r{font-size:12px;line-height:1.25;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-card-body{display:grid;grid-template-columns:76px 1fr;gap:10px;margin:14px -18px 0;padding:13px 18px 0;border-top:1px solid var(--border)}
.tm-card-body .tm-card-contacts{text-align:right;align-items:flex-end}
.tm-card-stats{display:flex;flex-direction:column;gap:6px;min-width:0}
.tm-card-xp{font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:12px;font-weight:600;color:var(--text);flex:none;white-space:nowrap}
.tm-card-stat{display:flex;align-items:baseline;gap:6px;min-width:0}
.tm-card-stat.stacked{flex-direction:column;gap:0;margin-top:3px}
.tm-card-stat .l{font-size:11px;color:var(--muted);white-space:nowrap;line-height:1.15}
.tm-card-stat.stacked .l{color:var(--text);font-weight:600}
.tm-card-stat .v{font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:16px;font-weight:600;color:var(--text);line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-card-stat .v.accent{color:var(--accent)}
.tm-card-stat.stacked .v{color:var(--accent)}
.tm-card-contacts{display:flex;flex-direction:column;gap:1px;min-width:0}
.tm-card-c{font-size:13px;color:var(--text);font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-card-c.phone{font-size:15px;font-weight:600}

/* «Реквизит и техника» — построено по проверенной структуре .tm-card («Команда»):
   верхняя строка (фото+имя+кебаб), один разделитель, статы + брони, кнопка снизу. */
.card.pad.gear-tk{padding:14px 18px}
.gear-tk{gap:0}
.gear-tk-top{display:flex;align-items:center;gap:11px}
.gear-tk-media{flex:none;width:40px;height:40px;border-radius:10px;overflow:hidden;background:var(--surface-3)}
.gear-tk-media img{width:100%;height:100%;object-fit:cover;display:block}
.gear-tk-id{min-width:0;flex:1;display:flex;flex-direction:column;gap:1px}
.gear-tk-id .n{font-size:13.5px;font-weight:600;color:var(--text);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gear-tk-id .r{font-size:12px;line-height:1.25;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gear-tk-id .r .cat.tech{color:var(--dept-pp)}
.gear-tk-id .r .cat.prop{color:var(--dept-mont)}
.gear-tk-id .r .status.ok{color:var(--ok)}
.gear-tk-id .r .status.crit{color:var(--crit)}
.gear-tk-top .tm-kebab,.gear-tk-top .tm-ib{margin-right:-7px}
.gear-tk-body{display:grid;grid-template-columns:auto 1fr;gap:18px;margin:14px -18px 0;padding:13px 18px 0;border-top:1px solid var(--border)}
.gear-tk-stats{display:flex;flex-direction:column;gap:6px;min-width:0}
.gear-tk-stat{display:flex;align-items:baseline;gap:6px;min-width:0}
.gear-tk-stat .l{font-size:11px;color:var(--muted);white-space:nowrap;line-height:1.15}
.gear-tk-stat .v{font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:16px;font-weight:600;color:var(--text);line-height:1.15;white-space:nowrap}
.gear-tk-stat .v.ok{color:var(--ok)}
.gear-tk-stat .v.warn{color:var(--warn)}
.gear-tk-stat .v.crit{color:var(--crit)}
.gear-tk-books{display:flex;flex-direction:column;gap:5px;min-width:0}
.gear-tk-book{font-size:13px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gear-tk-book b{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:600}
.gear-tk-book.none{color:var(--muted)}
.gear-tk-foot{margin:14px -18px 0;padding:12px 18px 0;border-top:1px solid var(--border)}
.gear-tk-foot button{width:100%;height:32px;border-radius:8px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font-size:12.5px;font-weight:600;cursor:pointer;transition:background .12s ease}
.gear-tk-foot button:hover{background:var(--surface-2)}
.tm-toolbar .dd-trigger{border-color:var(--border-strong);background:var(--surface)}
.tm-toolbar .dd:not(.open) .dd-trigger:hover{background:var(--surface-2);border-color:var(--border-strong)}
.tm-toolbar .kb-search{border-color:var(--border-strong);background:var(--surface)}
#teamDeptFilter .dd-trigger{background:var(--surface);border-color:var(--border)}
#teamDeptFilter:not(.open) .dd-trigger:hover{background:var(--surface-2)}
#teamDeptFilter .dd-val{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#teamDeptFilter .dd-trigger .chev{color:var(--text)}
.tm-page .page-head .actions{gap:14px}
@media(max-width:480px){
  .tm-page .page-head .actions{flex-wrap:nowrap;gap:8px}
  .tm-page .page-head .actions .btn--primary{padding:0 10px}
  #teamDeptFilter{width:150px!important}
  .tm-page .grid.g3{gap:10px}
}
.tm-form-modal .kb-f{color:var(--text)}
.tmf-photo-row{display:flex;align-items:center;gap:14px}
.tmf-photo-av{width:56px;height:56px;font-size:18px}
.tmf-photo-actions{display:flex;gap:8px;flex-wrap:wrap}
/* ——— топ-3 по очкам: настоящий подиум — фото/имя/очки над призовым блоком, место внутри градиентного блока ——— */
.tm-top3-h{padding:15px 18px 12px}
.tm-top3-h h3{font-size:16px;font-weight:600;letter-spacing:-.01em;color:var(--text);margin:0}
.tm-podium{display:flex;align-items:flex-end;justify-content:center;gap:14px;padding:44px 18px 20px}
.tm-podium-col{display:flex;flex-direction:column;align-items:center;gap:10px;flex:0 1 190px}
.tm-podium-col.empty{visibility:hidden}
.tm-podium-person{display:flex;flex-direction:column;align-items:center;gap:4px}
.tm-podium-av-wrap{position:relative;display:inline-flex}
.tm-podium-crown{position:absolute;z-index:1;top:-34px;left:50%;transform:translateX(-50%);width:40px;height:40px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.4))}
.tm-podium-av{width:72px;height:72px;font-size:22px;margin-bottom:2px}
.tm-podium-name{font-size:14px;font-weight:600;color:var(--text);max-width:160px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-podium-xp{font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:15px;font-weight:700;color:var(--accent)}
.tm-podium-block{position:relative;overflow:hidden;width:100%;display:flex;align-items:center;justify-content:center;padding:10px;border-radius:14px 14px 6px 6px;box-shadow:0 10px 24px -12px rgba(0,0,0,.35)}
.tm-podium-block::before{content:'';position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.35) 0%,rgba(255,255,255,0) 35%,rgba(255,255,255,0) 65%,rgba(255,255,255,.18) 100%)}
.tm-podium-rank{position:relative;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:26px;font-weight:800;line-height:1;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.35)}
.tm-podium-col.p1 .tm-podium-block{min-height:110px;background:linear-gradient(180deg,#ff8a3d 0%,#ff5d00 55%,#e6540a 100%)}
.tm-podium-col.p2 .tm-podium-block{min-height:84px;background:linear-gradient(180deg,#ffab6b 0%,#ff7a2e 55%,#e86a1f 100%)}
.tm-podium-col.p3 .tm-podium-block{min-height:68px;background:linear-gradient(180deg,#ffc190 0%,#ff9a5c 55%,#e88a45 100%)}
@media(max-width:480px){
  .tm-podium{gap:6px;padding:36px 8px 20px}
  .tm-podium-col{flex:0 1 130px}
  .tm-podium-av{width:58px;height:58px;font-size:18px}
  .tm-podium-crown{width:32px;height:32px;top:-28px}
  .tm-podium-name{font-size:12.5px;max-width:120px}
  .tm-podium-rank{font-size:22px}
  .tm-podium-col.p1 .tm-podium-block{min-height:92px}
  .tm-podium-col.p2 .tm-podium-block{min-height:70px}
  .tm-podium-col.p3 .tm-podium-block{min-height:58px}
}
/* десктоп/планшет при свёрнутом сайдбаре — больше свободной ширины, плашки и цифры чуть крупнее; с открытым сайдбаром и на телефоне — без изменений */
@media(min-width:481px){
  .app.nav-closed .tm-podium-col{flex:0 1 220px}
  .app.nav-closed .tm-podium-xp{font-size:17px}
  .app.nav-closed .tm-podium-rank{font-size:30px}
}

/* ============ payroll ============ */
.pay-card{overflow:hidden}

/* сводка сметы — внутри карточки «Ведомость» */
.pay-sheet-card .card-head{padding-top:16px;padding-bottom:12px;border-bottom:0}
.pay-sheet-card .card-head h3{font-size:16px}
.pay-sheet-card .pay-sh-toolbar{padding-top:24px}
.pay-sh-acts{margin-left:auto;display:flex;align-items:center}
.pay-sh-sum{display:grid;grid-template-columns:repeat(3,1fr);padding:2px 0}
.pay-sh-sum--4{grid-template-columns:repeat(4,1fr)}
.pay-sh-sum-col{display:flex;flex-direction:column;gap:20px;padding:0 24px}
.pay-sh-sum-i{display:flex;flex-direction:column;gap:1px;min-width:0}
.pay-sh-sum-i .l{font-size:13.5px;font-weight:500;color:var(--muted)}
.pay-sh-sum-i .v{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:24px;font-weight:600;letter-spacing:-.02em;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pay-sh-sum-i .v.accent{color:var(--accent)}
@media(max-width:620px){
  .pay-sh-sum{grid-template-columns:1fr;padding:4px 0 10px}
  .pay-sh-sum-col{flex-direction:row;padding:10px 18px}
  .pay-sh-sum-col .pay-sh-sum-i{flex:1}
  .pay-sh-sum.pay-sh-sum--4{grid-template-columns:repeat(2,1fr);padding:4px 0 10px;gap:0 0}
  .pay-sh-sum--4 .pay-sh-sum-col{padding:10px 18px}
}

.page-head .actions .btn{text-decoration:none}

/* «Требует выплаты» */
.pay-todo .card-head{padding-top:16px;padding-bottom:16px}
.pay-todo .card-head h3{font-size:16px}
.pay-todo .card-head .pay-todo-tot{margin-left:auto;font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--text)}
.pay-todo-list{display:flex;flex-direction:column}
.pay-todo-row{display:flex;align-items:center;gap:12px;padding:14px 16px;border-top:1px solid var(--border)}
.pay-todo-row:first-child{border-top:0}
.pay-todo-ic{flex:none;width:32px;height:32px;display:grid;place-items:center;color:var(--muted)}
.pay-todo-ic svg{width:26px;height:26px}
.pay-todo-row.warn .pay-todo-ic{color:var(--warn)}
.pay-todo-row > .avatar{flex:none;width:32px;height:32px;font-size:11.5px}
.pay-todo-m{flex:1;min-width:0}
.pay-todo-m .t{font-size:13.5px;font-weight:600;color:var(--text);line-height:1.2}
.pay-todo-m .m{font-size:12px;color:var(--muted);margin-top:0;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pay-todo-v{flex:none;text-align:right}
.pay-todo-v .mono{font-family:var(--font-display);font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--text);line-height:1.2}
.pay-todo-age{font-size:12px;color:var(--muted);margin-top:0;line-height:1.2}
.pay-todo-row.warn .pay-todo-age{color:var(--warn)}
.pay-todo-row .btn{flex:none}
.pay-todo-ok{display:flex;align-items:center;gap:9px;padding:16px;font-size:12.5px;color:var(--muted)}
.pay-todo-ok svg{width:16px;height:16px;color:var(--ok)}

/* ведомость — список сотрудников по столбцам */
.pay-sheet-card{overflow:visible}
.pay-sh-toolbar{gap:9px}
.pay-sh-fseg{flex:none}
.pay-sh-fseg button{padding:7px 11px;font-size:12px}
.pay-sheet{display:flex;flex-direction:column}
.pay-sh-row{display:grid;grid-template-columns:minmax(0,1fr) 100px 92px 92px 100px 116px 34px;gap:16px;align-items:center;padding:11px 16px;border-top:1px solid var(--border)}
.pay-sh-row:first-child{border-top:0}
.pay-sh-head{padding:10px 16px;font-size:12px;font-weight:600;color:var(--muted)}
.pay-sh-head span:nth-child(n+2){text-align:right}
.pay-sh-u{display:flex;align-items:center;gap:11px;min-width:0}
.pay-sh-u .avatar{flex:none;width:32px;height:32px;font-size:11.5px}
.pay-sh-uinfo{min-width:0}
.pay-sh-uinfo .n{font-size:13.5px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pay-sh-uinfo .r{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.pay-sh-debt{color:var(--crit);font-weight:600}
.pay-sh-v{text-align:right;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:13px;font-weight:500;letter-spacing:-.01em;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pay-sh-v.z{color:var(--text);font-weight:400}
.pay-sh-v.pos{color:var(--ok)} .pay-sh-v.neg{color:var(--crit)}
.pay-sh-v.strong{font-size:14px;font-weight:700}
.pay-sh-act{display:flex;justify-content:flex-end}
.pay-sh-act .tm-kb{width:30px;height:30px;color:var(--text)}
.pay-sh-empty{padding:32px 16px;text-align:center;color:var(--muted);font-size:13px}
/* история операций — список в стиле ведомости */
.pay-hist-card .card-head{padding-top:16px;padding-bottom:14px;border-bottom:0}
.pay-hist-card .card-head h3{font-size:16px}
.pay-hist-card .pay-hist-toolbar{padding-top:0}
.pay-hist-period{margin-left:auto}
.pay-hist{display:flex;flex-direction:column}
.pay-hist-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.75fr) 60px 88px 70px 34px;column-gap:16px;align-items:center;padding:8px 16px;border-top:1px solid var(--border);font-size:12.5px}
.pay-hist-row > *:nth-child(1),.pay-hist-row > *:nth-child(2){margin-right:10px}
.pay-hist-row:first-child{border-top:0}
.pay-hist-head{padding:10px 16px;font-size:12px;font-weight:600;color:var(--muted)}
.pay-hist-head > span:nth-child(5){text-align:right}
.pay-hist-u{display:flex;align-items:center;gap:10px;min-width:0}
.pay-hist-u .avatar{flex:none;width:32px;height:32px;font-size:11.5px}
.pay-hist-uinfo{min-width:0}
.pay-hist-uinfo .n{font-size:13.5px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pay-hist-uinfo .r{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.pay-hist-o{min-width:0;font-size:12px;color:var(--text);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pay-hist-d{font-size:12px;color:var(--text);white-space:nowrap}
.pay-hist-ty{justify-self:start;margin-left:-8px;padding:3px 8px;border-radius:6px;font-size:12px;font-weight:600;line-height:1.35;white-space:nowrap}
.ty-prem{color:var(--ok);background:color-mix(in srgb,var(--ok) 14%,transparent)}
.ty-pen{color:var(--crit);background:color-mix(in srgb,var(--crit) 14%,transparent)}
.ty-pay{color:var(--text);background:color-mix(in srgb,var(--text) 9%,transparent)}
.pay-hist-a{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;text-align:right}
.pay-hist-a.pos{color:var(--ok)} .pay-hist-a.neg{color:var(--crit)}
.pay-hist-canc{display:block;margin-top:3px;font-size:11px;line-height:1.3;color:var(--muted);white-space:normal}
.pay-hist-canc b{font-weight:600;color:var(--text-2)}
.pay-hist-row--canc .pay-hist-o{display:block;-webkit-line-clamp:unset;overflow:visible;color:var(--muted)}
.pay-hist-row--canc .pay-hist-a{text-decoration:line-through;color:var(--muted)}
.pay-hist-row--canc .pay-hist-ty{opacity:.45}
.pay-hist-row--canc .pay-hist-uinfo .n{color:var(--muted)}
.pay-cancconf{display:flex;flex-direction:column;gap:7px;padding:11px 14px;background:var(--surface-2);border-radius:9px;font-size:13px}
.pay-cancconf > div{display:flex;justify-content:space-between;gap:12px}
.pay-cancconf span{color:var(--muted)}
.pay-hist-x{width:30px;height:30px;justify-self:end;display:inline-flex;align-items:center;justify-content:center;border:0;background:none;border-radius:8px;color:var(--text);cursor:pointer;transition:background .12s ease}
.pay-hist-x svg{width:17px;height:17px;display:block}
.pay-hist-x:hover,.dd.open .pay-hist-x{background:var(--surface-3);color:var(--text)}
.pay-hist-foot{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:0;margin-top:-4px;font-size:12.5px;color:var(--muted)}
.pay-hist-foot-l{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.pay-hist-per{display:flex;align-items:center;gap:8px}
.pay-hist-per > span{font-weight:700;color:var(--text);font-size:13px}
.pay-hist-pg{display:flex;align-items:center;gap:8px;margin-left:auto}
.pay-hist-pg-t{color:var(--text)}
.pay-hist-pg-t b{font-weight:700}
.pay-hist-pgb{height:33px;padding:0 13px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border-strong);border-radius:8px;background:var(--surface);color:var(--text);font-weight:600;font-size:12.5px;cursor:pointer;transition:box-shadow .12s ease}
.pay-hist-pgb:disabled{opacity:.4;cursor:default}
.pay-hist-pgb:not(:disabled):hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.12)}
.pay-hist-pgb:not(:disabled):active{box-shadow:inset 0 0 0 999px rgba(0,0,0,.2)}
/* unify every payroll control (Ведомость + История: dropdowns, search, per-page, pager) to the .btn spec from «Требует выплаты» */
.pay-sh-acts .dd-trigger,
.pay-sh-toolbar .dd-trigger,
.pay-hist-toolbar .dd-trigger,
.pay-hist-per .dd-trigger{height:33px;padding:0 11px 0 13px;font-size:12.5px;font-weight:600;border-color:var(--border-strong);background:var(--surface)}
.pay-sh-acts .dd:not(.open) .dd-trigger:hover,
.pay-sh-toolbar .dd:not(.open) .dd-trigger:hover,
.pay-hist-toolbar .dd:not(.open) .dd-trigger:hover,
.pay-hist-per .dd:not(.open) .dd-trigger:hover{background:var(--surface-2);border-color:var(--border-strong)}
.pay-sh-toolbar .kb-search{height:33px;padding:0 12px;margin:0;border-color:var(--border-strong);background:var(--surface)}
.pay-sh-toolbar .kb-search input{height:31px;font-size:12.5px;font-weight:600}
.pay-sh-toolbar .kb-search input::placeholder{font-weight:600}
.tm-toolbar .segm-c{margin-left:6px;font-size:10.5px;opacity:.7}

/* На десктопе (>1100px) таблицы «Ведомость»/«История» помещаются целиком, горизонтального скролла НЕТ.
   Ниже — все колонки остаются (не режутся), контейнер (.pay-sheet/.pay-hist) прокручивается по горизонтали;
   имя фиксированной ширины → предсказуемая ширина таблицы под скролл, колонки выровнены. */
@media(max-width:1100px){
  .pay-sheet,.pay-hist{overflow-x:auto;overscroll-behavior-x:contain}
  .pay-sh-row{grid-template-columns:206px 100px 92px 92px 100px 116px 34px;min-width:max-content}
  .pay-hist-row{grid-template-columns:206px 260px 60px 88px 70px 34px;min-width:max-content}
  /* имя/фамилия и должность в таблицах на узких экранах не обрезаются */
  .pay-sh-uinfo .n,.pay-sh-uinfo .r,.pay-hist-uinfo .n,.pay-hist-uinfo .r{overflow:visible;text-overflow:clip;white-space:normal}
  .pay-hist-period{margin-left:0}
}
/* планшеты и уже: описание/причина в «Требует выплаты» переносится на 2-ю строку (как заголовок) */
@media(max-width:1024px){
  .pay-todo-m .m{white-space:normal;overflow:visible;text-overflow:clip}
}
/* планшет + ЗАКРЫТЫЙ сайдбар: контент во всю ширину → таблицы помещаются без горизонтального скролла
   (ужимаем отступы; в Истории — уже колонка «Основание», раньше переносится на 2-ю строку) */
@media(min-width:641px) and (max-width:1100px){
  .app.nav-closed .pay-sheet,.app.nav-closed .pay-hist{overflow-x:visible}
  .app.nav-closed .pay-sh-row{grid-template-columns:minmax(0,1fr) 82px 74px 74px 82px 94px 34px;gap:10px;min-width:0}
  .app.nav-closed .pay-hist-row{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) 54px 80px 64px 34px;column-gap:10px;min-width:0}
}
@media(max-width:640px){
  .pay-todo-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto;
    grid-template-areas:"ic m m" "v v btn";column-gap:12px;row-gap:10px;align-items:start}
  .pay-todo-ic,.pay-todo-row > .avatar{grid-area:ic}
  .pay-todo-m{grid-area:m;min-width:0}
  .pay-todo-m .m{white-space:normal}
  /* строка 2: сумма+дата слева (по левому краю, как иконка), кнопка в правом нижнем углу */
  .pay-todo-v{grid-area:v;align-self:end;text-align:left;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
  .pay-todo-age{margin-top:0}
  .pay-todo-row .btn{grid-area:btn;align-self:end;justify-self:end}
}
/* компактный футер пагинации Истории («На странице [n]» + Предыдущая/Следующая в один ряд,
   без счётчика «из» и «Страница X из Y») — на телефоне всегда, на планшете при РАСКРЫТОМ сайдбаре */
@media(max-width:640px){
  .pay-hist-count,.pay-hist-pg-t{display:none}
  .pay-hist-foot{gap:7px;flex-wrap:nowrap}
  .pay-hist-per{gap:5px;flex:none}
  .pay-hist-per > span{font-size:11.5px;white-space:nowrap}
  .pay-hist-foot #histPer{width:78px!important}
  .pay-hist-pg{gap:5px}
  .pay-hist-pgb{padding:0 9px;font-size:11.5px;white-space:nowrap}
}
@media(min-width:641px) and (max-width:900px){
  .app:not(.nav-closed) .pay-hist-count,.app:not(.nav-closed) .pay-hist-pg-t{display:none}
  .app:not(.nav-closed) .pay-hist-foot{gap:7px;flex-wrap:nowrap}
  .app:not(.nav-closed) .pay-hist-per{gap:5px;flex:none}
  .app:not(.nav-closed) .pay-hist-per > span{font-size:11.5px;white-space:nowrap}
  .app:not(.nav-closed) .pay-hist-foot #histPer{width:78px!important}
  .app:not(.nav-closed) .pay-hist-pg{gap:5px}
  .app:not(.nav-closed) .pay-hist-pgb{padding:0 9px;font-size:11.5px;white-space:nowrap}
}

/* payroll modals */
.pay-note{font-size:11.5px;color:var(--muted);line-height:1.5;margin:0}
.pay-modal-foot{display:flex;gap:8px;justify-content:flex-end;align-items:center;margin-top:4px}
.pay-modal-foot .btn--crit,.pay-modal-foot .btn--dcrit{margin-right:auto}
/* .pay-md (обычная — не cf-modal — ветка PayModal-хелпера wrap(), её делят ~20 режимов модалок:
   gearForm/gearBook/gearRetire/actorForm/actorBook/actorRetire и другие) — шапка и .modal-body
   уже зафиксированы/скроллятся общим правилом выше (:root .modal:not(.cf-modal)). Подвал с
   кнопками — просто последний ребёнок modal-body у всех этих режимов (разметку не переписывали),
   поэтому его отдельно приклеиваем к низу СКРОЛЛЯЩЕГОСЯ .modal-body через sticky.
   Отступы «-18px» тут были подобраны на глаз и не совпадали с реальным паддингом .modal-body
   (14px 26px 24px, см. правило `:not(.wm):not(.cf-modal) .modal-body` ниже) — из-за этого подвал
   не докатывался до самого низа/краёв модалки на ~6-8px (это и был баг «не приклеен, съезжает
   при скролле» на телефоне: там эта нестыковка куда заметнее из-за узкой модалки). Значения
   margin/bottom/padding ниже должны зеркалить паддинг .modal-body ровно 1:1. */
.modal.pay-md:not(.cf-modal) .pay-modal-foot{position:sticky;bottom:-24px;margin:8px -26px -24px;padding:12px 26px 24px;background:var(--surface);border-top:1px solid var(--border);transform:translateZ(0)}
.pay-exhead{padding-bottom:12px;border-bottom:1px solid var(--border)}
.pay-extotal{display:flex;justify-content:space-between;align-items:center;padding:2px 2px;font-size:13px}
.pay-calc{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);font-size:12.5px}
.pay-calc > div{display:flex;justify-content:space-between;padding:9px 13px;border-top:1px solid var(--border)}
.pay-calc > div:first-child{border-top:0}
.pay-calc > div span{color:var(--muted)}
.pay-calc-tot{background:var(--surface-3)}
.pay-calc-tot span,.pay-calc-tot b{color:var(--text)!important}
/* карта для перевода — блок в модалке запроса */
.pay-cardline{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 13px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.pay-cardline-l{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);flex:none}
.pay-cardline-l svg{width:15px;height:15px}
.pay-cardline-n{font-family:var(--font-mono);font-size:13px;color:var(--text);font-weight:600;letter-spacing:.02em;text-align:right}
/* payout run modal — переводы по одному */
.modal.modal--flex{display:flex;flex-direction:column;overflow:hidden;padding:0}
.modal--flex .modal-head{flex:none}
.pay-run{display:flex;flex-direction:column;min-height:0;flex:1}
.pay-run-top{flex:none;padding:14px 18px 13px;display:flex;flex-direction:column;gap:12px;border-bottom:1px solid var(--border)}
.pay-segm{display:flex;width:100%}
.pay-segm button{flex:1;padding:8px 6px;font-size:12px}
.pay-run-prog{display:flex;flex-direction:column;gap:7px}
.pay-run-prog-bar{height:6px;border-radius:999px;background:var(--surface-3);overflow:hidden}
.pay-run-prog-bar span{display:block;height:100%;background:var(--ok);border-radius:999px;transition:width .3s ease}
.pay-run-prog-txt{font-size:12px;color:var(--muted)}
.pay-run-prog-txt b{color:var(--text);font-weight:600}
.pay-run-hide{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-2);cursor:pointer;user-select:none}
.pay-run-hide input{width:15px;height:15px;accent-color:var(--accent)}
.pay-run-list{flex:1;min-height:0;overflow-y:auto;padding:2px 18px 4px}
.pay-run-empty{display:flex;align-items:center;justify-content:center;gap:9px;padding:34px 12px;font-size:13px;color:var(--muted)}
.pay-run-empty svg{width:17px;height:17px;color:var(--ok)}
.pay-run-foot{flex:none;padding:13px 18px 16px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:11px}
.pay-runrow{display:flex;flex-direction:column;gap:9px;padding:13px 0;border-top:1px solid var(--border)}
.pay-runrow:first-child{border-top:0}
.pay-runrow-top{display:flex;align-items:center;gap:9px}
.pay-runrow-name{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.pay-runrow-card{font-family:var(--font-mono);font-size:11.5px;color:var(--muted);white-space:nowrap;flex:none}
.pay-runrow-part{font-size:11px;color:var(--warn);margin-top:-2px}
.pay-runrow-bot{display:flex;align-items:center;gap:9px}
.pay-runinp{flex:1;height:34px;text-align:right;font-family:var(--font-mono);font-size:13px;padding:0 10px}
.pay-runinp.bad{border-color:var(--crit)}
.pay-runrow-bot .btn{flex:none}
.pay-runrow-paid{flex:1;display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ok);font-weight:600}
.pay-runrow-paid svg{width:15px;height:15px;flex:none}
.pay-runrow.done{opacity:.65}
.pay-runrow.done .pay-runrow-card{color:var(--muted)}

/* ═══════════════════════════ Расходы — с нуля, рев. 2 ═══════════════════════════
   Один типографический масштаб на всю страницу, взятый из уже утверждённых экранов
   (имя 13.5/600 как .pay-hist-uinfo .n, крупная сумма 24/600 tabular как .pay-sh-sum-i .v,
   второстепенный текст 11.5–12px muted) — никаких отдельно изобретённых размеров. */
.dd--ph .dd-val{color:var(--muted)}
.segm-c{font-size:10px;font-weight:700;padding:1px 5px;border-radius:999px;background:var(--surface-3);color:var(--text-2)}
.segm button.on .segm-c{background:rgba(255,255,255,.25);color:var(--accent-fg)}

/* сводка вверху «Расходов» — одна карточка с тремя сегментами, без разделителей между ними,
   а не три отдельные плитки .kpi каждая со своей рамкой/тенью (тот компонент используется
   на других страницах, трогать его нельзя — здесь свой, локальный для этой страницы) */
.exq-statbar{display:flex;padding:0}
.exq-stat{flex:1;padding:14px 18px;display:flex;flex-direction:column;gap:2px}
.exq-stat .label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;letter-spacing:.01em;color:var(--muted)}
/* та же плашка-счётчик, что у пунктов меню в сайдбаре (.nav-item .count) — крупнее и
   контрастнее локального .badge (тот приглушённый, здесь число должно быть заметным) */
.exq-stat .label .badge{font-size:11px;font-weight:700;background:var(--surface-2);color:var(--text);padding:1px 7px;border-radius:999px}
.exq-stat .val{font-family:var(--font-display);font-size:24px;font-weight:700;letter-spacing:-.02em}
@media(max-width:640px){
  .exq-statbar{display:grid;grid-template-columns:1fr 1fr}
  .exq-stat:last-child{grid-column:1/-1}
}

/* ——— «Расходы»: очередь — master-detail, не лента карточек. Слева компактный
   список всех заявок на решение (для быстрого сканирования), справа — полная
   разбивка выбранной: позиции, реквизиты получателя, кнопки. Выбор — это и есть
   структура страницы, а не ещё один вариант оформления одной большой карточки. */
.exq-md{display:grid;grid-template-columns:320px 1fr;gap:16px;align-items:start}
.exq-mdlist{padding:6px;display:flex;flex-direction:column}
/* исчезновение из очереди — лоток, который только что подтвердили/отклонили, гаснет
   (строка в списке слева и панель деталей справа — один и тот же момент решения
   показан в обоих местах), а уже потом реально пропадает из данных; пустая очередь
   появляется тем же мягким проявлением, а не рывком. Анимируются только opacity/transform
   (композитные, без пересчёта раскладки на каждом кадре) — от этого и зависит плавность;
   схлопывание высоты строки не анимируется, оно уже невидимо к этому моменту. Кривая
   та же, что и у остальных transition/анимаций в этом файле (cubic-bezier(.4,0,.2,1)). */
@keyframes exq-row-out{to{opacity:0;transform:scale(.97) translateX(4px)}}
@keyframes exq-fade-out{to{opacity:0;transform:scale(.98)}}
@keyframes exq-fade-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.exq-mdrow.leaving{animation:exq-row-out .2s cubic-bezier(.4,0,.2,1) forwards;pointer-events:none}
.exq-detail.leaving{animation:exq-fade-out .2s cubic-bezier(.4,0,.2,1) forwards;pointer-events:none}
.exq-detail-empty{animation:exq-fade-in .3s cubic-bezier(.4,0,.2,1)}
@media(prefers-reduced-motion:reduce){
  .exq-mdrow.leaving,.exq-detail.leaving,.exq-detail-empty{animation:none}
}
.exq-mdrow{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;cursor:pointer;transition:background .12s ease;text-align:left;width:100%;background:none;border:0;font:inherit;color:inherit}
.exq-mdrow:hover{background:var(--surface-2)}
.exq-mdrow.active{background:var(--accent)}
.exq-mdrow.active .exq-mdrow-n,.exq-mdrow.active .exq-mdrow-p,.exq-mdrow.active .exq-mdrow-sum,.exq-mdrow.active .exq-mdrow-age{color:var(--accent-fg)}
.exq-mdrow.active .exq-mdrow-age.warn{color:var(--accent-fg)}
.exq-mdrow-i{flex:1;min-width:0}
.exq-mdrow-n{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.exq-mdrow-p{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.exq-mdrow-r{flex:none;text-align:right}
.exq-mdrow-sum{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:13px;font-weight:700;color:var(--text)}
.exq-mdrow-age{font-size:11px;color:var(--muted);margin-top:1px}
.exq-mdrow-age.warn{color:var(--warn)}

.exq-detail{padding:22px}
.exq-detail-head{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:4px 14px;margin-bottom:6px}
.exq-detail-who{display:flex;align-items:center;gap:12px;min-width:0}
/* аватарка в панели деталей увеличена в той же пропорции, в которой ФИО (15px) крупнее
   ФИО в списке очереди (13px) — 30px × 15/13 ≈ 35px, а не наугад */
.exq-detail-av{width:35px;height:35px;font-size:13px}
.exq-detail-name{font-size:15px;font-weight:700;color:var(--text);letter-spacing:-.005em}
.exq-detail-role{font-size:12.5px;color:var(--muted);margin-top:1px}
/* дата ожидания — справа от имени, на одном уровне (как в компактной строке очереди);
   проект — под всей шапкой, во всю ширину, чтобы не зависеть от длины его названия */
.exq-detail-age{flex:none;text-align:right;margin-left:auto;font-size:12px;color:var(--muted)}
.exq-detail-age.warn{color:var(--warn)}
.exq-detail-proj{font-size:12.5px;color:var(--text-2);margin-bottom:12px}
.exq-detail-proj a{color:inherit}
.exq-detail-items{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}
.exq-detail-item{display:flex;align-items:center;justify-content:space-between;gap:14px}
.exq-detail-item-n{font-size:13.5px;color:var(--text)}
.exq-detail-item-t{font-size:11.5px;color:var(--muted);margin-top:1px}
.exq-detail-item-a{flex:none;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:600;font-size:15px;color:var(--text);margin-left:auto}
/* «чек» — настоящее фото загруженной квитанции, не текстовая кнопка: маленькая карточка-превью
   с реальным снимком внутри, рамка+тень читаются как физическая фотография, а не UI-элемент */
.exq-detail-rcpt{flex:none;margin-left:10px;display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 13px;font-size:11.5px;font-weight:600;color:var(--accent-fg);background:var(--accent);border:1px solid var(--accent);border-radius:8px;cursor:pointer;transition:box-shadow .12s ease}
.exq-detail-rcpt svg{width:13px;height:13px;flex:none}
.exq-detail-rcpt:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.1)}
.exq-detail-pay{background:var(--surface-2);border-radius:12px;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.exq-detail-pay-name{font-size:13px;font-weight:600;color:var(--text)}
.exq-detail-pay-num{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:13.5px;color:var(--text);margin-top:1px}
.exq-detail-pay-sum{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:24px;font-weight:800;color:var(--accent)}
.exq-detail-act{display:flex;gap:10px}
/* на широком экране кнопки называют, что именно подтверждают/отклоняют («…заявку»),
   на телефоне — короче, как и было, там это и так очевидно из контекста экрана */
.exq-detail-act .exq-lbl-n{display:none}
@media(max-width:640px){
  .exq-detail-act .exq-lbl-w{display:none}
  .exq-detail-act .exq-lbl-n{display:inline}
}
.exq-detail-act .btn{flex:1}
.exq-detail-empty{padding:40px 20px;text-align:center;color:var(--muted);font-size:13px}
@media(max-width:1000px){
  .exq-md{grid-template-columns:1fr}
}

/* ——— «Расходы»: История — в стиле «История операций» на странице зарплаты
   (плотная таблица-грид с шапкой колонок), только строка кликабельна и раскрывает
   разбивку по позициям/картам, т.к. одна заявка на расходы, в отличие от начисления
   зарплаты, может нести несколько позиций и несколько получателей. ——— */
/* низ последней строки истории может быть подсвеченным фоном (раскрытая заявка) и должен
   повторять скругление самой карточки — без overflow:hidden на карточке, иначе обрежет
   выпадающие списки фильтров, которые открываются за её пределы. */
.exq-hist-list > .exq-hist:last-child .exq-hist-row:last-child,
.exq-hist-list > .exq-hist:last-child .exq-hist-body:last-child{border-radius:0 0 var(--radius) var(--radius)}
.exq-hist-card .card-head{padding-top:16px;padding-bottom:14px;border-bottom:0}
.exq-hist-card .card-head h3{font-size:16px}
.exq-hist-card .pay-hist-toolbar{padding-top:0}
/* раскрывающиеся списки тулбара — чуть ярче, чем стандартный приглушённый треугольник/подпись */
.exq-hist-card .dd-trigger .chev{color:var(--text)}
.exq-hist-card .dd-val{color:var(--text)}
.exq-hist-tot{margin-left:auto;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--text)}
.exq-hist-list{display:flex;flex-direction:column}
.exq-hist-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) 84px 104px 90px 64px;column-gap:16px;align-items:center;width:100%;padding:10px 16px;border-top:1px solid var(--border);font-size:12.5px;background:none;border-left:0;border-right:0;border-bottom:0;text-align:left;cursor:pointer;font-family:inherit;color:inherit;transition:background .12s ease}
.exq-hist-row:hover{background:var(--surface-2)}
.exq-hist-head{padding:10px 16px;font-size:12px;font-weight:600;color:var(--muted);border-top:0;cursor:default}
.exq-hist-head:hover{background:none}
.exq-hist-head>span:nth-child(5){text-align:right}
.exq-hist-u{display:flex;align-items:center;gap:10px;min-width:0}
.exq-hist-u .avatar{flex:none;width:32px;height:32px;font-size:11.5px}
.exq-hist-uinfo{min-width:0}
.exq-hist-n{font-size:13.5px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.exq-hist-r{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.exq-hist-p{min-width:0;font-size:12px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.exq-hist-d{font-size:12px;color:var(--text);white-space:nowrap}
.exq-hist-status{justify-self:start;padding:3px 8px;border-radius:6px;font-size:12px;font-weight:600;line-height:1.35;white-space:nowrap}
.exq-hist-status.ok{color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent)}
.exq-hist-status.crit{color:var(--crit);background:color-mix(in srgb,var(--crit) 14%,transparent)}
.exq-hist-status.warn{color:var(--warn);background:color-mix(in srgb,var(--warn) 14%,transparent)}
.exq-hist-sum{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;text-align:right}
.exq-hist-actions{flex:none;display:flex;align-items:center;justify-content:flex-end;gap:10px}
.exq-hist-chev{flex:none;display:flex;color:var(--text);transition:transform .15s cubic-bezier(.4,0,.2,1)}
.exq-hist-chev svg{width:16px;height:16px}
.exq-hist.open .exq-hist-chev{transform:rotate(180deg)}
@keyframes exq-hist-body-out{to{opacity:0;transform:translateY(-4px)}}
.exq-hist-body.closing{animation:exq-hist-body-out .15s cubic-bezier(.4,0,.2,1) forwards;pointer-events:none}
@media(prefers-reduced-motion:reduce){.exq-hist-body.closing{animation:none}}
/* раскрытая строка держит фон «как при наведении» весь период, пока открыта — так
   раскрытая заявка и её содержимое читаются как один цельный подсвеченный блок. */
.exq-hist.open .exq-hist-row{background:var(--surface-2)}
/* содержимое — две колонки без лишнего воздуха: слева компактной мини-таблицей позиции
   (название · цена · чек почти впритык друг к другу, не растянуты на всю ширину), справа
   получатель и действие — так высота раскрытого блока определяется только числом позиций. */
.exq-hist-body{background:var(--surface-2);border-top:1px solid var(--border);display:flex;align-items:stretch;gap:6px;padding:4px 16px 6px;animation:exq-fade-in .2s cubic-bezier(.4,0,.2,1)}
.exq-hist-ileft{flex:1 1 56%;max-width:60%;min-width:0;display:flex;flex-direction:column;justify-content:center}
.exq-hist-iline{display:flex;align-items:center;gap:14px;padding:5px 8px 5px 0}
.exq-hist-iline+.exq-hist-iline{border-top:1px solid var(--border)}
.exq-hist-iline-n{flex:1 1 auto;min-width:60px;font-size:12.5px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.exq-hist-iline-a{flex:none;width:72px;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:12.5px;font-weight:600;color:var(--text);text-align:right}
.exq-hist-iright{flex:1;min-width:220px;display:flex;align-items:center;justify-content:space-between;gap:14px;margin:-4px 0 -6px;padding:4px 0 6px 20px;border-left:1px solid var(--border)}
.exq-hist-recip-to{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px}
.exq-hist-recip-name,.exq-hist-recip-card{font-size:12.5px;color:var(--text);white-space:nowrap}
@media(min-width:641px) and (max-width:900px){
  .exq-hist-row{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) 64px 92px 84px 64px;column-gap:10px}
  .exq-hist-uinfo,.exq-hist-p{min-width:0}
  .exq-hist-p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media(max-width:640px){
  /* было: узкая таблица со скроллом вбок — на экране помещалась только колонка сотрудника,
     остальное (проект/дата/статус/сумма) уезжало за край, а залипающая справа колонка действий
     наезжала на сдвинутый текст. Вместо таблицы — карточка в 3 строки: сотрудник+сумма сверху,
     проект отдельной строкой (может быть длинным), статус+дата+действия снизу. */
  .exq-hist-list{overflow-x:visible}
  .exq-hist-row{
    display:grid;
    grid-template-columns:auto 1fr auto;
    grid-template-areas:"u u sum" "p p p" "status d act";
    row-gap:6px;column-gap:10px;
    min-width:0;padding:12px 14px}
  .exq-hist-u{grid-area:u;min-width:0}
  .exq-hist-sum{grid-area:sum;font-size:15px}
  .exq-hist-p{grid-area:p}
  .exq-hist-status{grid-area:status;justify-self:start}
  .exq-hist-d{grid-area:d;justify-self:start;color:var(--muted)}
  .exq-hist-actions{grid-area:act;justify-self:end;position:static;background:none;box-shadow:none}
  .exq-hist.open .exq-hist-actions{background:none}
  /* раскрытое содержимое — позиции и получатель друг под другом на всю ширину карточки,
     а не в две узкие колонки, как на широком экране */
  .exq-hist-body{min-width:0;flex-wrap:wrap}
  .exq-hist-ileft{max-width:none;flex-basis:100%}
  .exq-hist-iright{border-left:0;padding-left:0;margin:0;flex-basis:100%}
}
@media(min-width:641px) and (max-width:900px){.exq-hist-body{min-width:0;flex-wrap:wrap}.exq-hist-ileft{max-width:none;flex-basis:100%}.exq-hist-iright{border-left:0;padding-left:0;margin:0}}
@media(prefers-reduced-motion:reduce){.exq-hist-chev{transition:none}.exq-hist-body{animation:none}}

/* ——— модалка «Добавить расход» ——— */
.exq-newmodal .dd:not(.open) .dd-trigger:hover{background:var(--surface-2);border-color:var(--border-strong)}
.exq-newmodal .dd-trigger .chev{color:var(--text)}
.exq-newmodal .dd-val{color:var(--text)}
.exq-itemsgrp{display:flex;flex-direction:column;gap:10px}
.exq-newitems{display:flex;flex-direction:column;gap:10px}
@keyframes exq-item-in{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
@keyframes exq-item-out{to{opacity:0;transform:scale(.96)}}
.exq-newitem{animation:exq-item-in .2s cubic-bezier(.4,0,.2,1)}
.exq-newitem.leaving{animation:exq-item-out .16s cubic-bezier(.4,0,.2,1) forwards;pointer-events:none}
@media(prefers-reduced-motion:reduce){.exq-newitem{animation:none}.exq-newitem.leaving{animation:none}}
.exq-newitem-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.exq-newitems.solo .exq-itemx{visibility:hidden}
.exq-itemx{flex:none;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border:0;border-radius:7px;background:var(--crit);color:#fff;cursor:pointer;transition:box-shadow .12s ease,transform .12s ease}
.exq-itemx svg{width:13px;height:13px}
.exq-itemx:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.15);transform:scale(1.06)}
.exq-additem-row{display:flex;gap:8px;flex-wrap:wrap}
.exq-additem{background:var(--accent);color:var(--accent-fg);border:1px solid var(--accent);border-radius:8px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:box-shadow .12s ease}
.exq-additem svg{width:14px;height:14px}
.exq-additem:hover{box-shadow:inset 0 0 0 999px rgba(0,0,0,.1)}
.exq-cardhead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.exq-seg{display:inline-flex;flex:none;border:1px solid var(--border-strong);border-radius:9px;padding:2px;gap:2px;background:var(--surface-2)}
.exq-seg-opt{border:0;background:none;color:var(--text-2);font:inherit;font-size:11.5px;font-weight:700;padding:6px 12px;border-radius:7px;cursor:pointer;transition:background .12s ease,color .12s ease}
.exq-seg-opt.on{background:var(--accent);color:var(--accent-fg)}
.exq-seg-opt:not(.on):hover{background:var(--surface-3)}
.exq-newrcpt{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px}
.exq-newrcpt-thumb{width:32px;height:32px;object-fit:cover;border-radius:6px;border:1px solid var(--border)}
@media(max-width:420px){
  .exq-cardhead{flex-wrap:wrap}
  .exq-seg{flex:none}
}

/* ——— посещаемость — с нуля: очередь запросов-исключений = .pay-todo-row (готовый компонент),
   журнал/лог = карточка со встроенной сводкой (.pay-sh-sum) + произвольной датой из календаря,
   таблицы в стиле команды/зарплаты ——— */
.att-todo-act{display:flex;gap:8px;flex:none}
@media(max-width:640px){ .att-todo-act{grid-area:btn} }
.att-sum-of{font-size:14px;font-weight:600;color:var(--text)}
.att-card .card-head{border-bottom:0;padding-top:16px;padding-bottom:12px;flex-wrap:wrap}
/* на телефоне заголовок занимает свою строку, а переключатель офис/съёмки и календарь-фильтр —
   общую строку ниже (тот же ряд) */
@media(max-width:640px){
  .att-card .card-head h3{order:1;flex:1 1 100%}
  .att-card .card-head #attViewDD{order:2}
  .att-card .card-head .att-cal{order:3;margin-left:auto}
  /* .att-heat (мини-календарь месяца) — тоже .att-card, но у него в шапке только заголовок +
     стрелки листания месяца (как .pjh-nav на странице проекта) — им ни к чему общее правило
     выше (оно для другой шапки: заголовок/переключатель/фильтр-календарь на «Моей посещаемости»),
     оно роняло заголовок на всю строку и уводило стрелки выше него */
  .att-card .card-head.att-heat-hd h3{order:0!important;flex:0 1 auto!important}
  .att-card .card-head .att-heat-nav{order:0!important}
}
.att-card .card-head h3{font-size:16px}
.att-table{table-layout:fixed;width:100%;min-width:756px}
.att-table.att-table--wide{min-width:960px}
.att-table col.c-sotr{width:190px}
.att-table col.c-sch,.att-table col.c-arr,.att-table col.c-late{width:96px}
.att-table col.c-shoot{width:130px}
.att-table col.c-proj{width:170px}
.att-table col.c-zone{width:118px}
.att-table col.c-pen{width:160px}
.att-table th{padding-top:10px;padding-bottom:10px;font-size:12px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--muted)}
.att-table td{padding-top:10px;padding-bottom:10px;font-size:12.5px;color:var(--text-2);vertical-align:middle}
.att-table tbody tr:hover td{background:transparent}
.att-user{display:flex;align-items:center;gap:10px;min-width:0}
.att-user .avatar{flex:none;width:32px;height:32px;font-size:11.5px}
.att-user-i{min-width:0;display:flex;flex-direction:column;gap:1px}
.att-user .n{font-size:13.5px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-user .r{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-mono{font-family:var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:var(--text);font-size:12.5px;font-weight:600}
.att-proj{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.att-mono.warn{color:var(--warn)}
.att-mono.crit{color:var(--crit)}
.att-mono.muted{color:var(--muted);font-weight:400}
.att-zone{display:inline-flex;padding:3px 8px;border-radius:6px;font-size:12px;font-weight:600;line-height:1.35;white-space:nowrap}
.att-zone.ok{color:var(--ok);background:color-mix(in srgb,var(--ok) 14%,transparent)}
.att-zone.out{color:var(--text-2);background:color-mix(in srgb,var(--text) 9%,transparent)}
.pay-sh-sum-i .v.warn{color:var(--warn)}
.pay-sh-sum-i .v.crit{color:var(--crit)}
/* узкие экраны — таблица держит минимальную читабельную ширину (min-width на .att-table выше)
   и скроллится в .tablewrap горизонтально (та же логика, что у «Команды»/«Зарплат»), вместо
   того чтобы сжиматься до нечитаемого через прогрессивное скрытие колонок */

/* card-head trailing count (Запросы-исключения) */
.att-card-count{margin-left:auto;font-size:12.5px;font-weight:600;color:var(--text)}

/* штраф cell — сумма + действие «отменить» */
.att-pen-cell{display:flex;align-items:center;gap:2px}
.att-pen-cell .tm-kebab{margin-left:auto}
.att-pen-cell .tm-kb{width:30px;height:30px;color:var(--text)}

/* флаг подозрительной GPS-отметки (см. ТЗ п.7 — защита от накруток) */
.att-flag{display:inline-flex;margin-left:6px;color:var(--warn);cursor:help;vertical-align:middle}
.att-flag svg{width:14px;height:14px;display:block}
.att-pen-amt{font-size:13px}
.att-flag--req{margin-left:0}

.att-zone.late{color:var(--warn);background:color-mix(in srgb,var(--warn) 14%,transparent)}
.att-zone.pending{color:var(--warn);background:color-mix(in srgb,var(--warn) 14%,transparent)}

/* строки с нарушением — лёгкая подсветка, чтобы проблемы считывались первыми; фон не должен
   меняться при наведении (как и у обычных строк) */
.att-table tbody tr.sev-crit td,.att-table tbody tr.sev-crit:hover td{background:color-mix(in srgb,var(--crit) 6%,transparent)}
.att-table tbody tr.sev-warn td,.att-table tbody tr.sev-warn:hover td{background:color-mix(in srgb,var(--warn) 6%,transparent)}

/* месячная тепловая карта — личный кабинет сотрудника */
.att-heat-wd{display:grid;grid-template-columns:repeat(7,1fr);padding:14px 16px 4px;gap:4px}
.att-heat-wd span{font-size:10.5px;font-weight:600;color:var(--muted);text-align:center}
.att-heat-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:0 16px}
.att-heat-d{aspect-ratio:1;border-radius:7px;display:grid;place-items:center;font-size:11.5px;font-weight:600;color:var(--text-2);background:var(--surface-2)}
.att-heat-d.empty{background:none}
.att-heat-d.off{background:none;color:var(--border-strong)}
.att-heat-d.ok{background:color-mix(in srgb,var(--ok) 20%,transparent);color:var(--ok)}
.att-heat-d.warn{background:color-mix(in srgb,var(--warn) 24%,transparent);color:var(--warn)}
.att-heat-d.crit{background:color-mix(in srgb,var(--crit) 24%,transparent);color:var(--crit)}
.att-heat-d.exc{background:var(--surface-3);color:var(--text-2)}
.att-heat-legend{display:flex;flex-wrap:wrap;gap:14px;padding:12px 16px 16px;font-size:11.5px;color:var(--muted)}
.att-heat-legend span{display:inline-flex;align-items:center;gap:6px}
.att-heat-legend .d{width:9px;height:9px;border-radius:3px;display:inline-block}
.att-heat-legend .d.ok{background:var(--ok)}
.att-heat-legend .d.warn{background:var(--warn)}
.att-heat-legend .d.crit{background:var(--crit)}
.att-heat-legend .d.exc{background:var(--surface-3);border:1px solid var(--border-strong)}

/* переключатель «приход в офис / съёмки» и фильтры по отделу/проекту — тот же hover/press,
   что у кнопки календаря рядом (background var(--surface)→var(--surface-2), .12s) */
#attViewDD .dd-trigger,#attDeptFilter .dd-trigger,#attProjFilter .dd-trigger{background:var(--surface);border-color:var(--border-strong)}
#attViewDD:not(.open) .dd-trigger:hover,#attDeptFilter:not(.open) .dd-trigger:hover,#attProjFilter:not(.open) .dd-trigger:hover{background:var(--surface-2)}
#attViewDD .dd-val,#attDeptFilter .dd-val,#attProjFilter .dd-val{color:var(--text)}
.att-filter-row{padding:24px 16px 14px}

/* кастомный календарь-пикер даты в шапке «Журнала прихода» */
.att-cal{position:relative;margin-left:auto}
.att-cal-trig{display:inline-flex;align-items:center;gap:7px;height:33px;padding:0 12px;border:1px solid var(--border-strong);border-radius:8px;background:var(--surface);color:var(--text);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .12s ease}
.att-cal-trig:hover{background:var(--surface-2)}
.att-cal-trig.bad{border-color:var(--crit);background:var(--crit-soft)}
.att-cal-trig svg{width:15px;height:15px;color:var(--muted);flex:none}
.att-cal-trig .chev{transition:transform .2s cubic-bezier(.4,0,.2,1)}
.att-cal.open .att-cal-trig .chev{transform:rotate(180deg)}
.att-cal-pop{position:absolute;z-index:45;top:calc(100% + 6px);right:0;width:246px;background:var(--surface);border:1px solid var(--border-strong);border-radius:12px;box-shadow:var(--shadow);padding:12px;animation:dd-in .1s cubic-bezier(.16,1,.3,1)}
.att-cal-hd{display:flex;align-items:center;justify-content:space-between;padding:0 2px 10px}
.att-cal-mo{font-size:13px;font-weight:600;color:var(--text);text-transform:capitalize}
.att-cal-nav{width:26px;height:26px;border:0;border-radius:6px;background:none;color:var(--text-2);cursor:pointer;font-size:16px;line-height:1;display:grid;place-items:center}
.att-cal-nav:hover{background:var(--surface-2);color:var(--text)}
.att-cal-wd{display:grid;grid-template-columns:repeat(7,1fr);padding:0 2px 4px}
.att-cal-wd span{font-size:10.5px;font-weight:600;color:var(--muted);text-align:center}
.att-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;justify-items:center}
.att-cal-d{width:30px;height:30px;border:0;border-radius:7px;background:none;color:var(--text);font:inherit;font-size:12px;font-weight:500;cursor:pointer;display:grid;place-items:center}
.att-cal-grid .att-cal-d.empty{padding:0;cursor:default}
.att-cal-d:not(.empty):not(:disabled):hover{background:var(--surface-2)}
.att-cal-d.today{color:var(--accent);font-weight:700}
.att-cal-d.sel{background:var(--accent);color:var(--accent-fg);font-weight:700}
.att-cal-d:disabled{color:var(--border-strong);cursor:not-allowed}
.att-cal-today{width:100%;margin-top:8px;height:29px;border:1px solid var(--border-strong);border-radius:7px;background:none;color:var(--text-2);font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.att-cal-today:hover{background:var(--surface-2);color:var(--text)}
/* та же плавающая мини-календарь — переиспользуется в модалке бронирования актёра вместо
   нативного input[type=date], растянута на всю ширину поля вместо margin-left:auto хедера */
.abk-cal{width:100%}
.abk-cal .att-cal-trig{width:100%;justify-content:flex-start}
/* поле даты сидит у самого низа модалки (перед футером), поэтому в отличие от «Посещаемости»
   попап открывается вверх, иначе он вылезает за пределы модалки/экрана */
.abk-cal .att-cal-pop{left:0;right:auto;top:auto;bottom:calc(100% + 6px)}

/* team person modal */
.tmm-lvl{font-size:12.5px;color:var(--text-2)}
.tmm-lvl b{color:var(--text)}
.tmm-lvl .progress{margin-top:8px}
.tmm-block{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}
.tmm-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 13px;font-size:12.5px;border-top:1px solid var(--border)}
.tmm-row:first-child{border-top:0}
.tmm-row > span:first-child{color:var(--muted)}
.tmm-row a{color:var(--accent);font-weight:600}
.tmm-row b{font-weight:700}
.tmm-row b.bad{color:var(--crit)}
/* team add/edit form */
.kb-grid2{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.kb-sect{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding-top:6px;border-top:1px solid var(--border);margin-top:2px}
.tm-combo{position:relative}
.tm-combo .dd-menu{max-height:230px;overflow-y:auto}
.tm-combo .dd[hidden]{display:none}
.tm-addinp[hidden]{display:none}
.tm-addinp{margin:0}
.dd-opt.dd-add{border-top:1px solid var(--border);color:var(--accent);font-weight:600;justify-content:flex-start;gap:7px}
.dd-opt.dd-add .ck{display:none}
@media(max-width:520px){.kb-grid2{grid-template-columns:1fr}}

/* ——— дашборд — типографика/плотность по референсу (shadcn admin dashboard) ——— */
.db-page .card-head h3{font-size:16px;font-weight:600;letter-spacing:-.01em}
.db-kpi{padding:18px 20px;display:flex;flex-direction:column;gap:11px}
.db-kpi-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.db-kpi-label{font-size:12.5px;font-weight:600;color:var(--text-2)}
.db-kpi-badge{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:999px;border:1px solid var(--border-strong);color:var(--text-2);white-space:nowrap;flex:none}
.db-kpi-badge svg{width:12px;height:12px}
.db-kpi-badge.up{color:var(--ok)}
.db-kpi-badge.down{color:var(--crit)}
.db-kpi-val{font-family:var(--font-display);font-size:28px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text)}
.db-kpi-val.crit{color:var(--crit)}
.db-kpi-foot{font-size:12.5px;color:var(--text-2);line-height:1.4}
.db-page .row .t{font-size:13.5px}
.db-page .row .m{color:var(--text-2)}
.db-page .kv dt{color:var(--text-2)}
.db-page p.hint{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:12px 14px;font-size:12.5px;line-height:1.6;color:var(--text-2)}
.db-page p.hint .strong{font-weight:600;color:var(--text)}

.modal-bg{animation:mbg-in .16s ease}
/* на дашборде под модалкой тяжёлый слой (календарь, градиенты) — размытие фона его перерисовывает на каждом кадре и даёт лаг */
:root:has(.main[data-view="dashboard"]) .modal-bg{-webkit-backdrop-filter:none;backdrop-filter:none}
.modal-bg .modal{animation:mdl-in .2s cubic-bezier(.16,1,.3,1)}
.modal-bg.closing{animation:mbg-out .15s ease forwards}
.modal-bg.closing .modal{animation:mdl-out .15s ease forwards}
@keyframes mbg-in{from{opacity:0}to{opacity:1}}
@keyframes mbg-out{to{opacity:0}}
@keyframes mdl-in{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
@keyframes mdl-out{to{opacity:0;transform:translateY(6px) scale(.98)}}

/* toast */
.toast-host{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{background:var(--text);color:var(--bg);font-size:12.5px;font-weight:600;padding:11px 18px;border-radius:10px;box-shadow:var(--shadow);
  opacity:0;transform:translateY(12px) scale(.96);transition:opacity .24s cubic-bezier(.16,1,.3,1),transform .24s cubic-bezier(.16,1,.3,1);max-width:82vw;text-align:center}
.toast.in{opacity:1;transform:none}
.toast--err{background:var(--crit);color:#fff}
.toast--ok{background:var(--ok);color:#fff}

@media(prefers-reduced-motion:reduce){.kb-acc-body{transition:none}.kb-acc-hd .kb-chev{transition:none}.modal-bg,.modal-bg .modal{animation:none}.toast{transition:none}}

/* phone only — sidebar becomes a slide-in overlay */
@media(max-width:640px){
  .app{grid-template-columns:1fr}
  .sidebar{position:fixed;left:0;top:0;width:248px;z-index:50;transform:translateX(-100%);transition:transform .2s;padding-top:var(--tg-safe-top,0px)}
  .app .sidebar.open{transform:none}
  .main{overflow-x:hidden;margin:0;border-radius:0}
  .topbar{border-radius:0}
}
/* tablet & small — tighter content, sidebar still docked like desktop */
@media(max-width:960px){
  .main{overflow-x:hidden}          /* топбар/контент не выталкивают страницу вбок (внутренние скроллы таблиц работают) */
  .search{min-width:0;flex:0 1 210px}
}
@media(max-width:860px){
  .grid.g2,.grid.g3,.grid.g4{grid-template-columns:1fr!important}
  .topbar{padding-left:16px;padding-right:16px}
  .page{padding:16px}
  .sf-page{padding:16px}
  .sf-card{padding:14px 0 16px}
  .sf-head{margin:0 16px}
  .sf-body{padding:18px 16px 0}
  .page-head h1{font-size:25px!important}
  .page-head .actions{margin-left:0}
}
.menu-toggle{display:grid}
.scrim{display:none}
.scrim.open{display:block;position:fixed;inset:0;background:var(--scrim);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:40}
/* календарь недели v3: лента по дням */
.wk{padding:0;overflow:hidden;border-radius:16px;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.wk-row{display:flex;align-items:flex-start;gap:18px;padding:12px 18px;border-top:1px solid var(--border)}
.wk-row:first-child{border-top:0}
.wk-row.today{box-shadow:inset 3px 0 0 var(--accent)}
.wk-row.dim{opacity:.7}
.wk-date{flex:none;width:150px;display:flex;align-items:center;gap:12px;min-height:34px}
.wk-date b{font-family:var(--font-display);font-size:22px;font-weight:800;width:30px;text-align:right;color:var(--text)}
.wk-date span{display:flex;flex-direction:column;font-size:12.5px;font-weight:700;text-transform:capitalize;color:var(--text-2);line-height:1.2}
.wk-date em{font-style:normal;font-weight:500;font-size:11px;color:var(--muted);text-transform:none}
.wk-row.today .wk-date b{color:var(--accent)}
.wk-evs{flex:1;display:flex;flex-wrap:wrap;gap:8px;min-width:0;align-items:center;min-height:34px}
.wk-ev{display:inline-flex;align-items:center;gap:8px;max-width:100%;border:0;font:inherit;background:var(--surface-2);color:var(--text);border-radius:999px;padding:6px 14px 6px 6px;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.18);transition:transform .14s,box-shadow .14s}
.wk-ev:hover{transform:translateY(-1px);box-shadow:0 6px 14px -8px rgba(0,0,0,.55)}
.wk-ev b{background:var(--accent);color:var(--accent-fg);font-family:var(--font-display);font-size:11.5px;font-weight:800;padding:3px 10px;border-radius:999px;font-variant-numeric:tabular-nums;white-space:nowrap}
.wk-ev .ic{width:24px;height:24px;border-radius:999px;background:var(--surface-3);display:inline-flex;align-items:center;justify-content:center;color:var(--muted)}
.wk-ev .ic .ico{width:13px;height:13px}
.wk-ev .t{font-size:12.5px;font-weight:700;white-space:nowrap}
.wk-ev .m{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
.wk-off{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:var(--text-2)}
.wk-off .ico{width:14px;height:14px}
.wk-none{font-size:12px;color:var(--muted)}

/* проекты v4: группы + широкие карточки */
.pj-groups{display:flex;flex-direction:column;gap:22px}
.pj-grp-h{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.pj-grp-h .t{font-size:14px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--text)}
.pj-grp-h .n{font-family:var(--font-display);font-size:11.5px;font-weight:700;color:var(--muted);background:var(--surface-3);padding:1px 8px;border-radius:999px}
.pj-grp--at_risk .pj-grp-h .n{background:var(--crit);color:#fff}
.pj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px}
.pj-card{background:var(--surface-2);border-radius:18px;padding:18px 20px;display:flex;flex-direction:column;gap:18px;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35);transition:transform .16s,box-shadow .16s}
.pj-card:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(0,0,0,.2),0 16px 28px -14px rgba(0,0,0,.6)}
.pj-card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.pj-card-tt{min-width:0}
.pj-card-tt .k{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.pj-card-tt .nm{font-size:16px;font-weight:700;line-height:1.3;margin-top:4px}
.pj-card-hero{display:flex;flex-direction:column;align-items:flex-end;flex:none}
.pj-card-hero .n{font-family:var(--font-display);font-size:36px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;color:var(--text)}
.pj-card-hero .u{font-size:11px;font-weight:600;color:var(--muted);margin-top:4px;white-space:nowrap}
.pj-card.late .pj-card-hero .n{color:var(--crit)}
.pj-card-prog .bar{height:8px;border-radius:999px;background:var(--surface-3);overflow:hidden}
.pj-card-prog .bar i{display:block;height:100%;background:var(--accent);border-radius:999px}
.pj-card-prog .bar.crit i{background:var(--crit)}
.pj-card-prog .cap{display:flex;justify-content:space-between;font-size:11.5px;font-weight:600;color:var(--muted);margin-top:7px}
.pj-card-prog .cap b{color:var(--text);font-family:var(--font-display)}
.pj-card-foot{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pj-card-foot .pm{display:flex;align-items:center;gap:8px;min-width:0}
.pj-card-foot .pm span{font-size:12.5px;font-weight:600;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root[data-theme="light"] .pj-card{background:#fff;color:#111}
:root[data-theme="light"] .pj-card-tt .k,:root[data-theme="light"] .pj-card-hero .u,:root[data-theme="light"] .pj-card-prog .cap{color:#7a7a7a}
:root[data-theme="light"] .pj-card-hero .n,:root[data-theme="light"] .pj-card-prog .cap b{color:#111}
:root[data-theme="light"] .pj-card.late .pj-card-hero .n{color:var(--crit)}
:root[data-theme="light"] .pj-card-prog .bar{background:#ececec}
:root[data-theme="light"] .pj-card-foot .pm span{color:#444}
:root[data-theme="light"] .pj-card .avatar{border-color:#fff}
:root[data-theme="light"] .pj-kpi{background:#fff}
:root[data-theme="light"] .pj-kpi .l,:root[data-theme="light"] .pj-kpi .s{color:#7a7a7a}
:root[data-theme="light"] .pj-kpi .v{color:#111}
.pj-kpi .v.crit{color:var(--crit)}
.pj-kpi .v .mo{font-weight:500}
.pj-kpi{gap:1px}
.pj-kpi .l{font-size:13.5px;font-weight:500;text-transform:none;letter-spacing:0}
.pj-kpi .v{font-size:24px;font-weight:600;letter-spacing:-.02em;line-height:1.5}
.pj-kpi .v .mo{font-weight:500}
.pj-sec{align-items:flex-end}
.pj-sec + .wk{margin-top:-10px}

/* единая модалка проект/задача */
.modal.wm{max-width:860px;border-radius:20px;border:0;box-shadow:0 30px 70px -20px rgba(0,0,0,.6),0 0 0 1px var(--border)}
.wm-head{display:flex;align-items:flex-start;gap:14px;padding:22px 26px 6px}
.wm-hd-t{min-width:0;flex:1}
.wm-hd-t h3{font-size:22px;font-weight:700;line-height:1.25;letter-spacing:-.01em;margin-top:4px}
.wm-sub{font-size:13px;color:var(--muted);margin-top:3px}
.wm-crumb{display:inline-flex;align-items:center;border:0;background:none;padding:0;font:inherit;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;transition:color .12s}
button.wm-crumb:hover{color:var(--accent)}
.wm-crumb--static{cursor:default;text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:700}
.wm-x{border:0;flex:none;background:var(--surface-2);border-radius:999px;width:34px;height:34px}
.wm-body{padding:14px 26px 26px;display:flex;flex-direction:column;gap:14px}
.wm-plates{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.wm-plates--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.wm-plate{background:var(--surface-2);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:1px;min-width:0;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.wm-plate .l{font-size:13px;font-weight:500;color:var(--muted)}
.wm-plate .v{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:22px;font-weight:600;letter-spacing:-.02em;color:var(--text);line-height:1.4}
.wm-plate .v.crit{color:var(--crit)}
.wm-plate .s{font-size:12px;color:var(--muted)}
.wm-plate .v.wm-who{font-family:var(--font-body);font-size:14px;font-weight:600;letter-spacing:0;display:flex;align-items:center;gap:8px;min-height:31px}
.wm-plate .avatar{flex:none}
.wm-alert{background:var(--crit-soft);border-radius:14px;padding:12px 16px;display:flex;flex-direction:column;gap:2px;box-shadow:inset 0 0 0 1.5px var(--crit)}
.wm-alert .l{font-size:13px;font-weight:600;color:var(--crit)}
.wm-alert .v{font-family:var(--font-display);font-size:26px;font-weight:700;color:var(--text)}
.wm-alert .s{font-size:12.5px;color:var(--text-2)}
.wm-flow{display:flex;gap:6px;flex-wrap:wrap}
.wm-flow .st{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;padding:7px 14px;border-radius:999px;background:var(--surface-2);color:var(--muted);transition:background .2s,color .2s}
.wm-flow .st .ico{width:12px;height:12px;stroke-width:2.6}
.wm-flow .st.done{background:var(--accent-soft);color:var(--accent)}
.wm-flow .st.cur{background:var(--accent);color:var(--accent-fg);box-shadow:0 8px 18px -8px rgba(255,93,0,.6)}
.wm-flow .st.warn{background:var(--accent);color:var(--accent-fg)}
.wm-flow .st.bad{background:var(--crit-soft);color:var(--crit)}
.wm-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.wm .proj-tabs{display:inline-flex;align-self:flex-start;gap:4px;border:0;margin:6px 0 0;padding:4px;background:var(--surface-2);border-radius:999px}
.wm .proj-tab{padding:7px 16px;border:0;margin:0;border-radius:999px;font-size:12.5px;transition:background .15s,color .15s}
.wm .proj-tab.on{background:var(--accent);color:var(--accent-fg);box-shadow:0 6px 14px -8px rgba(255,93,0,.7)}
.wm .proj-tgroup{background:var(--surface-2);border-radius:14px;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.wm .proj-tgroup .row{border-radius:8px;transition:background .12s}
.wm .proj-tgroup .row:hover{background:var(--surface-3)}
.wm .proj-dsec{background:var(--surface-2);border-radius:14px;padding:14px 16px}
@media(max-width:640px){.wm-plates,.wm-plates--3{grid-template-columns:repeat(2,minmax(0,1fr))}.wm-head{padding:18px 18px 4px}.wm-body{padding:12px 18px 20px}}

/* модалки-карточки (сотрудник/клиент/превью проекта — все три .tp-modal): шапка была одной
   flex-строкой без переноса — аватар + имя + «Редактировать» + крестик пытались влезть в одну
   линию на телефоне и залезали друг на друга (имя пряталось под кнопкой). Раскладываем в 2 строки:
   аватар+имя+крестик сверху, «Редактировать» (если есть) — отдельной строкой на всю ширину снизу.
   Работает независимо от того, есть аватар/кнопка редактирования у конкретной модалки или нет —
   .wm-x всегда уезжает вправо за счёт flex:1 у .wm-hd-t, а не через жёсткий порядок колонок. */
@media(max-width:640px){
  .tp-modal .wm-head{flex-wrap:wrap;row-gap:12px}
  .tp-modal .wm-head .avatar{width:52px;height:52px;font-size:18px}
  .tp-modal .wm-head .wm-x{order:1}
  .tp-modal .wm-head > .btn{order:2;flex:1 1 100%;justify-content:center}
  /* 3 плашки (NPS/Проектов/В работе и т.п.) — общее правило чуть выше сводит их в 2+1 с пустым
     хвостом справа от одинокой третьей; тут явно просили в ряд, как на Инвентаре/Подрядчиках */
  .tp-modal .wm-plates--3{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .tp-modal .wm-plate{padding:10px 8px}
  .tp-modal .wm-plate .v{font-size:19px}
  .tp-modal .wm-plate .v.tp-vtext{font-size:15px;font-weight:600}
  /* подписи плашек (Оклад/Начислено/Опоздания и т.п.) — в одну строку всегда: чуть мельче +
     nowrap/ellipsis как страховка, если конкретная подпись всё равно не влезет в узкую колонку */
  .tp-modal .wm-plate .l{font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* вкладки профиля (Обзор/Зарплата/Посещаемость/…) заворачивались в 3 строки внутри своей же
     пилюли — выглядело грузно. Пилюля со скроллом по горизонтали, как рейка шагов в мастере
     нового проекта (тот же приём:flex-wrap:nowrap + overflow-x:auto). */
  .tp-tabs{flex-wrap:nowrap!important;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;max-width:100%}
  .tp-tabs::-webkit-scrollbar{display:none}
  .tp-tabs .proj-tab{flex:none;white-space:nowrap}
}

/* тёмная тема: страница «Проекты» и единая модалка — было :not([data-theme="light"]), что
   ловило и НЕ выставленную тему тоже (до первого переключения темы data-theme вообще не
   стоит — см. переключатель ниже по файлу), а по факту это светлый рендер (--surface белый
   по умолчанию) — плашки .pj-kpi красились в surface-2 (мятный) там, где должны быть белыми.
   [data-theme="dark"] — только реально включённая тёмная тема. */
:root[data-theme="dark"] .pj-kpi,:root[data-theme="dark"] .pj-card{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border),0 10px 24px -14px rgba(0,0,0,.7)}
:root[data-theme="dark"] .pj-card:hover{box-shadow:inset 0 0 0 1px var(--accent),0 16px 30px -14px rgba(0,0,0,.8)}
:root:not([data-theme="light"]) .pj-card-prog .bar{background:var(--surface-3)}
:root:not([data-theme="light"]) .pj-kpi .v.crit{color:#ff6b6b}
:root:not([data-theme="light"]) .wk{box-shadow:inset 0 0 0 1px var(--border)}
:root:not([data-theme="light"]) .wk-ev{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border)}
:root:not([data-theme="light"]) .wk-row.today{background:linear-gradient(90deg,rgba(255,93,0,.10),transparent 55%)}
:root:not([data-theme="light"]) .wm-plate{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border)}
:root:not([data-theme="light"]) .modal.wm{background:var(--surface);box-shadow:0 40px 90px -20px rgba(0,0,0,.85),0 0 0 1px var(--border-strong)}
:root:not([data-theme="light"]) .wm-x{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border)}
:root:not([data-theme="light"]) .wm .proj-tabs{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border)}
:root:not([data-theme="light"]) .wm-flow .st{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border)}
:root:not([data-theme="light"]) .wm-flow .st.done{background:rgba(255,93,0,.16);box-shadow:none}
:root:not([data-theme="light"]) .wm-flow .st.cur,:root:not([data-theme="light"]) .wm-flow .st.warn{box-shadow:0 8px 18px -8px rgba(255,93,0,.6)}
:root:not([data-theme="light"]) .wm .proj-tgroup,:root:not([data-theme="light"]) .wm .proj-dsec{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border)}
:root:not([data-theme="light"]) .wm-alert{background:rgba(255,80,80,.10)}
.wm .proj-tgroup .row{border-radius:0;margin:0 -14px;padding:8px 14px}
.wm .proj-tgroup .row:last-child{margin-bottom:-12px;padding-bottom:14px;border-radius:0 0 14px 14px}
.wm .proj-dsec .row{border-radius:0;margin:0 -16px;padding:8px 16px;transition:background .12s}
.wm .proj-dsec .row:hover{background:var(--surface-3)}
.wm .proj-dsec .row:last-child{margin-bottom:-14px;padding-bottom:14px;border-radius:0 0 14px 14px}
/* единые тени карточек */
.main[data-view="actors"] .card,
.main[data-view="actors"] .subcard,
.main[data-view="actors"] .act-card,
.main[data-view="actors"] .tm-card,
.main[data-view="actors"] .pay-card,
.main[data-view="actors"] .sf-card,
.main[data-view="actors"] .kb-acc,
.main[data-view="actors"] .pay-calc,
.main[data-view="actors"] .tmm-block,
.main[data-view="attendance"] .card,
.main[data-view="attendance"] .subcard,
.main[data-view="attendance"] .act-card,
.main[data-view="attendance"] .tm-card,
.main[data-view="attendance"] .pay-card,
.main[data-view="attendance"] .sf-card,
.main[data-view="attendance"] .kb-acc,
.main[data-view="attendance"] .pay-calc,
.main[data-view="attendance"] .tmm-block,
.main[data-view="payroll"] .card,
.main[data-view="payroll"] .subcard,
.main[data-view="payroll"] .act-card,
.main[data-view="payroll"] .tm-card,
.main[data-view="payroll"] .pay-card,
.main[data-view="payroll"] .sf-card,
.main[data-view="payroll"] .kb-acc,
.main[data-view="payroll"] .pay-calc,
.main[data-view="payroll"] .tmm-block,
.main[data-view="expenses"] .card,
.main[data-view="expenses"] .subcard,
.main[data-view="expenses"] .act-card,
.main[data-view="expenses"] .tm-card,
.main[data-view="expenses"] .pay-card,
.main[data-view="expenses"] .sf-card,
.main[data-view="expenses"] .kb-acc,
.main[data-view="expenses"] .pay-calc,
.main[data-view="expenses"] .tmm-block,
.main[data-view="team"] .card,
.main[data-view="team"] .subcard,
.main[data-view="team"] .act-card,
.main[data-view="team"] .tm-card,
.main[data-view="team"] .pay-card,
.main[data-view="team"] .sf-card,
.main[data-view="team"] .kb-acc,
.main[data-view="team"] .pay-calc,
.main[data-view="team"] .tmm-block,
.main[data-view="knowledge"] .card,
.main[data-view="knowledge"] .subcard,
.main[data-view="knowledge"] .act-card,
.main[data-view="knowledge"] .tm-card,
.main[data-view="knowledge"] .pay-card,
.main[data-view="knowledge"] .sf-card,
.main[data-view="knowledge"] .kb-acc,
.main[data-view="knowledge"] .pay-calc,
.main[data-view="knowledge"] .tmm-block,
.main[data-view="settings"] .card,
.main[data-view="settings"] .subcard,
.main[data-view="settings"] .act-card,
.main[data-view="settings"] .tm-card,
.main[data-view="settings"] .pay-card,
.main[data-view="settings"] .sf-card,
.main[data-view="settings"] .kb-acc,
.main[data-view="settings"] .pay-calc,
.main[data-view="settings"] .tmm-block{box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.main[data-view="actors"] .act-card,
.main[data-view="actors"] .tm-card,
.main[data-view="attendance"] .act-card,
.main[data-view="attendance"] .tm-card,
.main[data-view="payroll"] .act-card,
.main[data-view="payroll"] .tm-card,
.main[data-view="expenses"] .act-card,
.main[data-view="expenses"] .tm-card,
.main[data-view="team"] .act-card,
.main[data-view="team"] .tm-card,
.main[data-view="knowledge"] .act-card,
.main[data-view="knowledge"] .tm-card,
.main[data-view="settings"] .act-card,
.main[data-view="settings"] .tm-card{transition:transform .16s,box-shadow .16s}
.main[data-view="actors"] .act-card:hover,
.main[data-view="actors"] .tm-card:hover,
.main[data-view="attendance"] .act-card:hover,
.main[data-view="attendance"] .tm-card:hover,
.main[data-view="payroll"] .act-card:hover,
.main[data-view="payroll"] .tm-card:hover,
.main[data-view="expenses"] .act-card:hover,
.main[data-view="expenses"] .tm-card:hover,
.main[data-view="team"] .act-card:hover,
.main[data-view="team"] .tm-card:hover,
.main[data-view="knowledge"] .act-card:hover,
.main[data-view="knowledge"] .tm-card:hover,
.main[data-view="settings"] .act-card:hover,
.main[data-view="settings"] .tm-card:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(0,0,0,.2),0 16px 28px -14px rgba(0,0,0,.55)}

/* клиенты */
.cl-id{display:flex;align-items:center;gap:12px;min-width:0}
.cl-id .avatar{width:40px;height:40px;font-size:14px;flex:none}
.cl-sph{font-size:12.5px;color:var(--muted);margin-top:2px}
.cl-stats{display:flex;gap:26px}
.cl-stats div{display:flex;flex-direction:column}
.cl-stats b{font-family:var(--font-display);font-size:20px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.cl-stats span{font-size:12px;color:var(--muted)}
.cl-contact{display:flex;flex-direction:column;min-width:0;flex:1}
.cl-contact .nmx{font-size:12.5px;font-weight:600;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-contact .ph{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.cl-card .pj-card-hero .n.crit{color:var(--crit)}
:root[data-theme="light"] .cl-card .cl-stats b{color:#111}
:root[data-theme="light"] .cl-card .cl-contact .nmx{color:#444}
.pj-sec .kb-search{flex:none}
.cl-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.cl-name{font-size:16px;font-weight:700;line-height:1.3;min-width:0}
.cl-form .wz-nc{grid-template-columns:minmax(0,1fr)}
.cl-form .wz-nc .in{width:100%}
.cl-card .pj-card-foot{align-items:flex-end}
.cl-card .cl-stats{gap:18px;flex:none}
.cl-card .pj-card-hero{flex-direction:row;align-items:baseline;gap:8px}
.cl-card .pj-card-hero .u{margin-top:0}
.cl-top{align-items:center}
.wm-plate a.wm-lnk,.wm-plate .wm-txt{font-family:var(--font-body);font-size:14px;font-weight:600;letter-spacing:0;line-height:1.6;color:var(--text);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wm-plate a.wm-lnk:hover{color:var(--accent)}
.wm-plate .cl-nil{color:var(--muted)}
.wm-list{background:var(--surface-2);border-radius:14px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.wm-li{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer;transition:background .12s}
.wm-li+.wm-li{border-top:1px solid var(--border)}
.wm-li:hover{background:var(--surface-3)}
.wm-li .t{font-size:13.5px;font-weight:600}
.wm-li .m{font-size:12.5px;color:var(--muted);margin-top:1px}
:root:not([data-theme="light"]) .wm-list{box-shadow:inset 0 0 0 1px var(--border)}
.wm-plates--2{grid-template-columns:repeat(2,minmax(0,1fr))}
/* инвентарь */
.gr-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.gr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:700px){.gr-grid{grid-template-columns:minmax(0,1fr)}}
.gr-card{cursor:default;gap:16px}
.gr-top{display:flex;align-items:center;gap:14px}
.gr-media{flex:none;width:60px;height:60px;border-radius:14px;overflow:hidden;background:var(--surface-3)}
.gr-media img{width:100%;height:100%;object-fit:cover;display:block}
.gr-id{min-width:0;flex:1}
.gr-id .k{font-size:12.5px;color:var(--muted)}
.gr-id .nm{font-size:16px;font-weight:700;line-height:1.3;margin-top:2px}
.gr-hero{display:flex;align-items:baseline;gap:8px}
.gr-hero .n{font-family:var(--font-display);font-size:21px;font-weight:600;line-height:1.2;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
.gr-hero .n.ok{color:var(--ok)}.gr-hero .n.warn{color:var(--warn)}.gr-hero .n.crit{color:var(--crit)}
.gr-hero .u{font-size:12px;font-weight:600;color:var(--muted)}
.gr-row{display:flex;gap:30px}
.gr-row div{display:flex;flex-direction:column}
.gr-row b{font-family:var(--font-display);font-size:18px;font-weight:600;letter-spacing:-.01em}
.gr-row b.crit{color:var(--crit)}
.gr-row span{font-size:12px;color:var(--muted)}
.gr-books{display:flex;flex-wrap:wrap;gap:6px}
.gr-bk{font-size:12.5px;color:var(--text-2);background:var(--surface-3);padding:5px 11px;border-radius:999px}
.gr-bk b{font-family:var(--font-display);font-weight:700;color:var(--text)}
.gr-bk.none{color:var(--muted);background:none;padding-left:0}
.gr-book{width:100%;justify-content:center}
:root[data-theme="light"] .gr-hero .n:not(.ok):not(.warn):not(.crit){color:#111}
:root[data-theme="light"] .gr-id .nm,:root[data-theme="light"] .gr-row b:not(.crit),:root[data-theme="light"] .gr-bk b{color:#111}
:root[data-theme="light"] .gr-bk{background:#f1f1f1;color:#555}
:root[data-theme="light"] .gr-book{background:#fff}
.main[data-view="gear"] .pj-card .tm-kebab,.main[data-view="gear"] .pj-card .tm-ib{margin-right:-6px}
:root[data-theme="light"] .gr-bk.none{background:none;color:#888}
.gr-row b{white-space:nowrap}
.gr-row b.ok{color:var(--ok)}.gr-row b.warn{color:var(--warn)}.gr-row b.crit{color:var(--crit)}
.gr-row{gap:26px;flex-wrap:wrap}
.gr-row{gap:20px;flex-wrap:nowrap;justify-content:space-between}
.gr-row b{font-size:16px}
.pj-kpis--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){.pj-kpis--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
.wm-gl{display:flex;flex-direction:column;margin:4px -14px 0}
.wm-gi{display:flex;align-items:center;gap:10px;padding:8px 14px;transition:background .12s}
.wm-gi:hover{background:var(--surface-3)}
.wm-gi .t{font-size:13.5px;font-weight:600;color:var(--text)}
.wm-gi .m{font-size:12.5px;color:var(--muted)}
.wm-gx{border:0;background:none;color:var(--muted);cursor:pointer;width:26px;height:26px;border-radius:8px;display:grid;place-items:center}
.wm-gx:hover{background:var(--surface-2);color:var(--crit)}
.wm-gx .ico{width:13px;height:13px}
.gb-days{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.gb-day{background:var(--surface-2);border-radius:12px;padding:11px 13px;box-shadow:0 1px 2px rgba(0,0,0,.14)}
.gb-day-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.gb-day-h b{font-size:13.5px;font-weight:700}
.gb-day-h span{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.gb-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
:root .dd:not(.wz-dd--white) .dd-val,:root .dd--ph:not(.wz-dd--white) .dd-val{color:var(--text)}
:root .dd:not(.wz-dd--white) .dd-trigger .chev{color:var(--text)}

/* финансы */
.fin-st{font-size:12.5px;color:var(--muted);align-self:center;display:inline-flex;align-items:center;gap:6px}
.fin-st.live{color:var(--text-2)}
/* живой индикатор автообновления — тихо пульсирует, пока страница реально подключена к таблицам
   (не показываем на demo-данных, чтобы не создавать ложное ощущение «идёт обновление») */
.fin-dot{width:6px;height:6px;border-radius:50%;background:var(--ok);flex:none;animation:fin-pulse 2s ease-in-out infinite}
@keyframes fin-pulse{0%,100%{opacity:1;box-shadow:0 0 0 0 color-mix(in srgb,var(--ok) 55%,transparent)}50%{opacity:.55;box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 0%,transparent)}}
/* модалка подключения — адрес сервисного аккаунта, на который нужно расшарить таблицы */
.fin-svc{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:12px;background:var(--surface-2);margin-bottom:4px}
.fin-svc-t{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:var(--text-2);line-height:1.45}
.fin-svc-t svg{flex:none;width:15px;height:15px;margin-top:1px;color:var(--accent)}
.fin-svc-em{display:flex;align-items:center;justify-content:space-between;gap:8px;border:0;background:var(--surface);border-radius:9px;padding:8px 10px;font:inherit;font-size:12.5px;font-weight:600;font-family:var(--font-mono,monospace);color:var(--text);cursor:pointer;transition:background .15s;text-align:left}
.fin-svc-em:hover{background:var(--surface-3)}
.fin-svc-em svg{width:14px;height:14px;flex:none;color:var(--muted)}
.fin-tabs{display:inline-flex;align-self:flex-start;gap:4px;padding:4px;background:var(--surface-2);border-radius:999px}
.fin-tabs button{border:0;background:none;font:inherit;font-size:12.5px;font-weight:700;color:var(--muted);padding:7px 16px;border-radius:999px;cursor:pointer;transition:background .15s,color .15s}
.fin-tabs button:hover{color:var(--text)}
.fin-tabs button.on{background:var(--accent);color:var(--accent-fg);box-shadow:0 6px 14px -8px rgba(255,93,0,.7)}
.fin-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media(max-width:900px){.fin-two{grid-template-columns:minmax(0,1fr)}}
.fin-card{cursor:default;gap:14px}
.fin-card:hover{transform:none}
.fin-h{font-size:14px;font-weight:600}
.fin-h em{font-style:normal;font-weight:400;font-size:12px;color:var(--muted);margin-left:6px}
.fin-rows{display:flex;flex-direction:column;margin:0 -20px}
.fin-rows>div{display:flex;justify-content:space-between;gap:16px;padding:9px 20px;font-size:13px}
.fin-rows>div+div{border-top:1px solid var(--border)}
.fin-rows span{color:var(--muted)}
.fin-rows b{font-family:var(--font-display);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.fin-rows b.neg,.fin-op .a.neg{color:var(--crit)}
.fin-vb{display:flex;align-items:flex-end;gap:18px;height:170px;padding-top:6px}
.fin-vb-c{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;height:100%;min-width:0}
.fin-vb-c .bars{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:6px}
.fin-vb-c .bars i{display:block;width:26px;max-width:40%;border-radius:6px 6px 2px 2px;min-height:3px;transition:height .4s}
.fin-vb-c .bars i.in,.fin-leg i.in{background:var(--accent)}
.fin-vb-c .bars i.out,.fin-leg i.out{background:color-mix(in srgb,var(--text) 28%,transparent)}
.fin-vb-c span{font-size:12.5px;font-weight:600;text-transform:capitalize}
.fin-vb-c small{font-size:11.5px;color:var(--muted)}
.fin-leg{display:flex;gap:16px;font-size:12px;color:var(--muted)}
.fin-leg i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:6px}
.fin-hb{display:flex;flex-direction:column;gap:9px}
.fin-hb-r{display:grid;grid-template-columns:minmax(0,200px) 1fr 72px;gap:12px;align-items:center;font-size:12.5px}
.fin-hb-r .n{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-2)}
.fin-hb-r .b{height:8px;border-radius:999px;background:var(--surface-3);overflow:hidden}
.fin-hb-r .b i{display:block;height:100%;background:var(--accent);border-radius:999px}
.fin-hb-r .v{text-align:right;font-family:var(--font-display);font-weight:600;font-variant-numeric:tabular-nums}
.fin-list{display:flex;flex-direction:column}
.fin-op{display:grid;grid-template-columns:52px minmax(0,1fr) 170px 150px;gap:14px;align-items:center;padding:11px 18px;transition:background .12s}
.fin-op+.fin-op,.fin-pr+.fin-pr{border-top:1px solid var(--border)}
.fin-op:hover,.fin-pr:hover{background:var(--surface-3)}
.fin-op .d{display:flex;flex-direction:column;line-height:1.2}
.fin-op .d b{font-family:var(--font-display);font-size:15px;font-weight:600}
.fin-op .d span{font-size:11.5px;color:var(--muted)}
.fin-op .t,.fin-pr .t{font-size:13.5px;font-weight:600}
.fin-op .s,.fin-pr .s{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fin-op .m{min-width:0}
.fin-op .w{font-size:12.5px;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fin-op .a{text-align:right;font-family:var(--font-display);font-size:14.5px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.fin-pr{display:grid;grid-template-columns:minmax(0,1fr) 130px 130px 140px;gap:14px;align-items:center;padding:11px 18px;transition:background .12s;font-variant-numeric:tabular-nums;font-size:13.5px}
.fin-pr>span,.fin-pr>b{text-align:right}
.fin-pr b{font-family:var(--font-display);font-weight:600}
.fin-pr--h{font-size:12px;color:var(--muted);font-weight:600}
.fin-pr--h:hover{background:none}
@media(max-width:760px){.fin-op{grid-template-columns:48px minmax(0,1fr) 110px}.fin-op .w{display:none}.fin-pr{grid-template-columns:minmax(0,1fr) 100px 110px}.fin-pr>span:nth-of-type(1){display:none}}
:root[data-theme="light"] .fin-card .fin-h,:root[data-theme="light"] .fin-rows b,:root[data-theme="light"] .fin-hb-r .v{color:#111}
.fin-pr--h>span:first-child{text-align:left}

/* финансы v2 */
.fin-hero{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:14px}
@media(max-width:900px){.fin-hero{grid-template-columns:minmax(0,1fr)}}
.fin-big{gap:6px}
.fin-big .top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.fin-big .k{font-size:13.5px;color:var(--muted)}
.fin-big .n{font-family:var(--font-display);font-size:46px;font-weight:800;letter-spacing:-.03em;line-height:1.1;margin-top:2px}
.fin-big .n small{font-size:15px;font-weight:500;color:var(--muted);margin-left:8px;letter-spacing:0}
.fin-area{width:100%;height:210px;display:block;margin-top:6px;overflow:visible}
.fin-area .g{stroke:var(--border);stroke-width:1}
.fin-area .in{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke}
.fin-area .ex{fill:none;stroke:color-mix(in srgb,var(--text) 35%,transparent);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1 7;vector-effect:non-scaling-stroke}
.fin-area .dot{fill:var(--accent);stroke:var(--surface-2);stroke-width:2.5;vector-effect:non-scaling-stroke}
.fin-area text{font-size:12px;fill:var(--muted);text-transform:capitalize;font-family:var(--font-body)}
.fin-rings .rw{display:flex;justify-content:space-around;align-items:center;flex:1}
.fin-ringc{display:flex;flex-direction:column;align-items:center;gap:10px}
.fin-ringc span{font-size:13px;color:var(--muted)}
.fin-ring{--p:0;position:relative;width:104px;height:104px;display:grid;place-items:center}
.fin-ring::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--accent) calc(var(--p)*3.6deg),var(--surface-3) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 11px),#000 calc(100% - 10px));mask:radial-gradient(farthest-side,transparent calc(100% - 11px),#000 calc(100% - 10px))}
.fin-ring b{font-family:var(--font-display);font-size:19px;font-weight:700;color:var(--text)}
.fin-dn{display:flex;align-items:center;gap:22px}
.fin-donut{position:relative;width:150px;height:150px;flex:none}
.fin-donut svg{width:100%;height:100%}
.fin-donut .c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.fin-donut .c b{font-family:var(--font-display);font-size:17px;font-weight:700}
.fin-donut .c span{font-size:11.5px;color:var(--muted)}
.fin-dl{flex:1;min-width:0;display:flex;flex-direction:column;gap:9px}
.fin-dl div{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:10px;align-items:center;font-size:12.5px}
.fin-dl i{width:10px;height:10px;border-radius:3px;background:var(--accent)}
.fin-dl span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-2)}
.fin-dl b{font-family:var(--font-display);font-weight:600}
:root[data-theme="light"] .fin-big .n,:root[data-theme="light"] .fin-ring b,:root[data-theme="light"] .fin-donut .c b,:root[data-theme="light"] .fin-dl b{color:#111}
:root[data-theme="light"] .fin-area .dot{stroke:#fff}

/* дашборд v2 */
.db-h{display:flex;justify-content:space-between;align-items:center}
.db-h .link{font-size:12.5px;font-weight:600;color:var(--muted)}
.db-h .link:hover{color:var(--accent)}
.db-list{margin:0 -20px;background:none;box-shadow:none!important;border-radius:0}
.db-list .wm-li{padding:12px 20px}
.db-days{display:flex;flex-direction:column;align-items:flex-end;flex:none;line-height:1.2}
.db-days b{font-family:var(--font-display);font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
.db-days span{font-size:12px;color:var(--muted)}
.db-days.late b,.db-days.late span{color:var(--crit)}
.db-ok{display:flex;align-items:center;gap:8px;padding:16px 20px;color:var(--muted);font-size:13px}
.db-ok .ico{width:16px;height:16px}
.db-fin{cursor:pointer;gap:6px}
.db-fin:hover{transform:none}
.db-fin .top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.db-fin .k{font-size:13.5px;color:var(--muted)}
.db-fin .n{font-family:var(--font-display);font-size:38px;font-weight:800;letter-spacing:-.03em;line-height:1.1}
.db-fin .n small{font-size:14px;font-weight:500;color:var(--muted);margin-left:8px;letter-spacing:0}
.db-fs{display:flex;gap:24px}
.db-fs div{display:flex;flex-direction:column;align-items:flex-end}
.db-fs b{font-family:var(--font-display);font-size:18px;font-weight:600}
.db-fs span{font-size:12px;color:var(--muted)}
.db-fin .fin-area{height:150px}
.main[data-view="dashboard"] .card{box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
:root[data-theme="light"] .db-days:not(.late) b,:root[data-theme="light"] .db-fin .n,:root[data-theme="light"] .db-fs b{color:#111}
:root[data-theme="light"] .db-list .wm-li .t{color:#111}

/* дашборд v3 */
.db-cols{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:14px;align-items:start}
@media(max-width:900px){.db-cols{grid-template-columns:minmax(0,1fr)}}
.db-cnt{font-family:var(--font-display);font-size:12px;font-weight:700;background:var(--accent);color:var(--accent-fg);padding:2px 9px;border-radius:999px}
.db-qs{display:flex;flex-direction:column;margin:0 -20px}
.db-q{display:flex;align-items:center;gap:12px;padding:12px 20px;transition:background .12s}
.db-q+.db-q{border-top:1px solid var(--border)}
.db-q:hover{background:var(--surface-3)}
.db-q .t{font-size:13.5px;font-weight:600}
.db-q .m{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.db-q .grow{min-width:0}
.db-q-acts{display:flex;gap:6px;flex:none}
.db-q-late{font-size:12px;font-weight:700;color:var(--crit);font-variant-numeric:tabular-nums;flex:none}
.db-today{display:flex;gap:34px}
.db-today div{display:flex;flex-direction:column}
.db-today b{font-family:var(--font-display);font-size:28px;font-weight:700;line-height:1.15;font-variant-numeric:tabular-nums}
.db-today b em{font-style:normal;font-size:16px;font-weight:500;color:var(--muted)}
.db-today b.neg{color:var(--crit)}
.db-today span{font-size:12.5px;color:var(--muted)}
.db-time{font-family:var(--font-display);font-size:13px;font-weight:700;background:var(--accent);color:var(--accent-fg);padding:3px 10px;border-radius:999px;white-space:nowrap}
.db-all{font-size:12.5px;font-weight:600;color:var(--muted)}
.db-all:hover{color:var(--accent)}
.db-pcs{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){.db-pcs{grid-template-columns:minmax(0,1fr)}}
.db-pc{gap:14px}
.db-pc .nm{font-size:15px;font-weight:700;line-height:1.3}
.db-pc.late .pj-card-hero .n{color:var(--crit)}
:root[data-theme="light"] .db-q .t,:root[data-theme="light"] .db-today b:not(.neg),:root[data-theme="light"] .db-pc .nm{color:#111}

/* дашборд v4 */
.db-g1{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:14px;align-items:stretch}
.db-g2{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:14px;align-items:start}
@media(max-width:900px){.db-g1,.db-g2{grid-template-columns:minmax(0,1fr)}}
.db-bigs{display:flex;gap:34px;flex-wrap:wrap}
.db-big{display:flex;flex-direction:column}
.db-big b{font-family:var(--font-display);font-size:44px;font-weight:800;letter-spacing:-.03em;line-height:1.05;font-variant-numeric:tabular-nums}
.db-big b em{font-style:normal;font-size:22px;font-weight:500;color:var(--muted);letter-spacing:0}
.db-big b.neg{color:var(--crit)}
.db-big span{font-size:12.5px;color:var(--muted);margin-top:3px}
.db-bigs--2 .db-big b{font-size:38px}
.db-bar{height:6px;border-radius:999px;background:var(--surface-3);overflow:hidden;margin-top:8px;max-width:340px}
.db-bar i{display:block;height:100%;background:var(--accent);border-radius:999px}
.db-bar.crit i{background:var(--crit)}
.db-hero{display:flex;flex-direction:column}
.db-hero span{font-size:13.5px;color:var(--muted)}
.db-hero b{font-family:var(--font-display);font-size:40px;font-weight:800;letter-spacing:-.03em;line-height:1.1}
.db-hero b small{font-size:14px;font-weight:500;color:var(--muted);margin-left:8px;letter-spacing:0}
.db-c2{cursor:pointer}
.db-c2:hover{transform:none}
.db-c2 .fin-area{height:110px;margin:0}
.db-sub{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-top:4px}
.db-line{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;font-size:13px;padding:2px 0}
.db-line span{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:8px}
.db-line em{font-style:normal;color:var(--muted);font-size:12.5px}
.db-line-av{display:contents}
.db-none{font-size:13px;color:var(--muted)}
:root[data-theme="light"] .db-big b:not(.neg),:root[data-theme="light"] .db-hero b,:root[data-theme="light"] .db-line span{color:#111}
.db-list .wm-li .grow,.db-q .grow{flex:1 1 0;min-width:0}
.db-days{margin-left:auto;min-width:104px;align-items:flex-end;text-align:right}
.db-days b,.db-days span{display:block;width:100%;text-align:right}
.db-q-acts{margin-left:auto;justify-content:flex-end;min-width:150px}
.db-q{justify-content:space-between}
.db-list .wm-li{justify-content:space-between}

/* дашборд v5: день по часам */
.db-g2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.db-sum{font-size:14px;color:var(--muted);margin-top:4px}
.db-sum b{font-family:var(--font-display);font-weight:700;color:var(--text);font-size:16px}
.db-sum b.neg{color:var(--crit)}
.db-meta{font-size:12.5px;font-weight:500;color:var(--muted)}
.db-day{gap:12px}
.db-axis,.db-shoot{display:grid;grid-template-columns:190px minmax(0,1fr);gap:16px;align-items:center}
.db-shoot{cursor:pointer;padding:4px 0;border-radius:10px;transition:background .12s}
.db-shoot:hover{background:var(--surface-3)}
.db-shoot .t{font-size:13.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.db-shoot .m{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:7px}
.db-shoot .m .avatar{width:20px;height:20px;font-size:8.5px}
.db-track{position:relative;height:38px;background:repeating-linear-gradient(90deg,var(--border) 0 1px,transparent 1px calc(100%/6));border-radius:8px}
.db-track--h{height:18px;background:none}
.db-track--h span{position:absolute;transform:translateX(-50%);font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.db-track--h span:first-child{transform:none}
.db-track .bar{position:absolute;top:4px;height:30px;background:var(--accent);border-radius:9px;display:flex;align-items:center;padding:0 10px;box-shadow:0 8px 16px -8px rgba(255,93,0,.65);overflow:hidden}
.db-track .bar b{font-family:var(--font-display);font-size:12px;font-weight:700;color:var(--accent-fg);white-space:nowrap}
.db-track .gear{position:absolute;top:100%;margin-top:-2px;font-style:normal;font-size:11px;color:var(--muted);white-space:nowrap;display:none}
.db-shoot:hover .gear{display:block}
.db-track .now{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--text);opacity:.55;border-radius:2px;text-decoration:none}
.db-none--big{font-size:14px;padding:6px 0}
.db-wk{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.db-wd{background:var(--surface-2);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:2px;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.db-wd.today{box-shadow:inset 0 0 0 1.5px var(--accent),0 8px 18px -10px rgba(255,93,0,.4)}
.db-wd.off{opacity:.6}
.db-wd .w{font-size:12px;color:var(--muted);text-transform:capitalize}
.db-wd b{font-family:var(--font-display);font-size:26px;font-weight:800;line-height:1.1}
.db-wd .c{display:flex;gap:10px;margin-top:6px;min-height:20px}
.db-wd .c span{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:700}
.db-wd .c .ico{width:13px;height:13px;color:var(--accent)}
.db-wd .c .none{color:var(--muted);font-weight:400}
@media(max-width:900px){.db-wk{grid-template-columns:repeat(4,minmax(0,1fr))}.db-axis,.db-shoot{grid-template-columns:110px minmax(0,1fr)}}
:root[data-theme="light"] .db-wd{background:#fff}
:root[data-theme="light"] .db-wd b,:root[data-theme="light"] .db-sum b:not(.neg),:root[data-theme="light"] .db-shoot .t{color:#111}

/* дашборд v6: сборка */
.db-bigs{display:flex;gap:30px;flex-wrap:wrap}
.db-big{display:flex;flex-direction:column}
.db-big b{font-family:var(--font-display);font-size:38px;font-weight:800;letter-spacing:-.03em;line-height:1.05;font-variant-numeric:tabular-nums}
.db-big b em{font-style:normal;font-size:20px;font-weight:500;color:var(--muted);letter-spacing:0}
.db-big b.neg{color:var(--crit)}
.db-big span{font-size:12.5px;color:var(--muted);margin-top:3px}
.db-bigs--2 .db-big b{font-size:34px}
.db-sub{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-top:4px}
.db-line{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;padding:2px 0}
.db-line span{display:flex;align-items:center;gap:9px;font-weight:600}
.db-line em{font-style:normal;color:var(--muted);font-size:12.5px;font-variant-numeric:tabular-nums}
.db-hero{display:flex;flex-direction:column}
.db-hero span{font-size:13.5px;color:var(--muted)}
.db-hero b{font-family:var(--font-display);font-size:40px;font-weight:800;letter-spacing:-.03em;line-height:1.1}
.db-hero b small{font-size:14px;font-weight:500;color:var(--muted);margin-left:8px;letter-spacing:0}
.db-money{cursor:pointer}
.db-money:hover{transform:none}
:root[data-theme="light"] .db-big b:not(.neg),:root[data-theme="light"] .db-hero b,:root[data-theme="light"] .db-line span{color:#111}
.db-bigs{gap:24px}
.db-page .db-g2 .db-big b{font-size:34px}

/* дашборд v7: сводка плитками */
.db-grp{display:flex;flex-direction:column}
.db-grp .wz-s1-lbl{margin-bottom:10px}
.db-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.db-t{background:var(--surface-2);border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:2px;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35);transition:transform .16s,box-shadow .16s;min-width:0}
.db-t:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(0,0,0,.2),0 16px 28px -14px rgba(0,0,0,.55)}
.db-t .h{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted)}
.db-t .h .ico{width:15px;height:15px;flex:none}
.db-t .h span{flex:1}
.db-t .h .go{opacity:0;transition:opacity .15s,transform .15s}
.db-t:hover .h .go{opacity:1;transform:translateX(2px);color:var(--accent)}
.db-t b{font-family:var(--font-display);font-size:34px;font-weight:800;letter-spacing:-.03em;line-height:1.15;font-variant-numeric:tabular-nums;margin-top:6px}
.db-t b i{font-style:normal;font-size:18px;font-weight:500;color:var(--muted);letter-spacing:0}
.db-t b.neg{color:var(--crit)}
.db-t .s{font-size:12.5px;color:var(--muted);line-height:1.4}
.db-t .s em{font-style:normal;color:var(--crit);font-weight:600}
:root:not([data-theme="light"]) .db-t{box-shadow:inset 0 0 0 1px var(--border),0 10px 24px -14px rgba(0,0,0,.7)}
:root[data-theme="light"] .db-t{background:#fff}
:root[data-theme="light"] .db-t b:not(.neg){color:#111}
.db-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
.db-tiles--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){.db-tiles,.db-tiles--3{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* дашборд v8: digital */
@property --p{syntax:'<number>';inherits:false;initial-value:0}
.db-heroc{position:relative;overflow:hidden;border-radius:26px;padding:34px 36px;display:flex;align-items:flex-end;justify-content:space-between;gap:20px;background:linear-gradient(135deg,#0d3a52 0%,#082a3a 55%,#061f2c 100%);box-shadow:0 24px 50px -24px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.06);isolation:isolate}
.db-orb{position:absolute;border-radius:50%;filter:blur(60px);z-index:-1;animation:dbfloat 9s ease-in-out infinite}
.db-orb.o1{width:340px;height:340px;right:-60px;top:-140px;background:rgba(255,93,0,.55)}
.db-orb.o2{width:260px;height:260px;left:32%;bottom:-160px;background:rgba(255,140,60,.28);animation-delay:-4s}
@keyframes dbfloat{0%,100%{transform:translate(0,0)}50%{transform:translate(-24px,18px)}}
.db-hero-t .d{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.db-hero-t h1{font-size:46px;font-weight:800;letter-spacing:-.03em;line-height:1.1;margin:8px 0 18px;color:#fff}
.db-chips{display:flex;flex-wrap:wrap;gap:8px}
.db-chips .c{display:inline-flex;align-items:baseline;gap:8px;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.09);backdrop-filter:blur(8px);font-size:13px;color:rgba(255,255,255,.75);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.db-chips .c b{font-family:var(--font-display);font-size:20px;font-weight:800;color:#fff}
.db-chips .c.neg b{color:#ff8a8a}
.db-new{flex:none;height:42px;padding:0 20px;font-size:14px;box-shadow:0 14px 30px -10px rgba(255,93,0,.75)}
:root[data-theme="light"] .db-heroc{background:linear-gradient(135deg,#fff 0%,#fff3ea 100%);box-shadow:0 24px 50px -28px rgba(255,93,0,.4),inset 0 0 0 1px rgba(0,0,0,.05)}
:root[data-theme="light"] .db-hero-t h1{color:#111}
:root[data-theme="light"] .db-hero-t .d{color:#777}
:root[data-theme="light"] .db-chips .c{background:rgba(0,0,0,.05);color:#555;box-shadow:none}
:root[data-theme="light"] .db-chips .c b{color:#111}
:root[data-theme="light"] .db-chips .c.neg b{color:var(--crit)}
.db-t{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015)),var(--surface-2);animation:dbrise .5s cubic-bezier(.16,1,.3,1) both}
.db-tiles .db-t:nth-child(2){animation-delay:.05s}.db-tiles .db-t:nth-child(3){animation-delay:.1s}.db-tiles .db-t:nth-child(4){animation-delay:.15s}
@keyframes dbrise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.db-t::after{content:"";position:absolute;inset:0;background:radial-gradient(240px circle at var(--mx,50%) var(--my,0%),rgba(255,93,0,.16),transparent 60%);opacity:0;transition:opacity .25s;pointer-events:none}
.db-t:hover::after{opacity:1}
.db-t .m{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-top:8px}
.db-t .m>div:first-child{min-width:0;display:flex;flex-direction:column}
.db-t b{margin-top:0;font-size:38px}
.db-t .v{flex:none;display:flex;align-items:center}
:root[data-theme="light"] .db-t{background:#fff}
.db-ring{--p:0;position:relative;width:62px;height:62px;border-radius:50%;background:conic-gradient(var(--accent) calc(var(--p)*3.6deg),color-mix(in srgb,var(--text) 12%,transparent) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 8px),#000 calc(100% - 7px));mask:radial-gradient(farthest-side,transparent calc(100% - 8px),#000 calc(100% - 7px));animation:dbring 1s cubic-bezier(.16,1,.3,1) both}
.db-ring.crit{background:conic-gradient(var(--crit) calc(var(--p)*3.6deg),color-mix(in srgb,var(--text) 12%,transparent) 0)}
@keyframes dbring{from{--p:0}}
.db-dots{display:grid;grid-template-columns:repeat(4,9px);gap:5px}
.db-dots i{width:9px;height:9px;border-radius:50%;background:color-mix(in srgb,var(--text) 14%,transparent)}
.db-dots.sq i{border-radius:3px}
.db-dots i.on{background:var(--accent);box-shadow:0 0 8px rgba(255,93,0,.7)}
.db-mini{display:flex;align-items:flex-end;gap:4px;height:46px}
.db-mini i{display:block;width:8px;border-radius:3px;background:color-mix(in srgb,var(--text) 22%,transparent);animation:dbgrow .7s cubic-bezier(.16,1,.3,1) both;transform-origin:bottom}
.db-mini i.t{background:var(--accent);box-shadow:0 0 10px rgba(255,93,0,.6)}
@keyframes dbgrow{from{transform:scaleY(.1)}}
.db-split{display:flex;gap:3px;width:78px;height:10px}
.db-split i{display:block;border-radius:999px;background:var(--accent)}
.db-split i.b{background:color-mix(in srgb,var(--text) 22%,transparent)}
.db-stack{display:flex}
.db-stack .avatar{width:26px;height:26px;font-size:9.5px;margin-left:-8px;border:2px solid var(--surface-2)}
.db-stack .avatar:first-child{margin-left:0}
.db-spark{width:110px;height:46px}
.db-grp .wz-s1-lbl{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.db-track .bar{background:linear-gradient(180deg,#ff7a2e,#ff5d00);animation:dbslide .7s cubic-bezier(.16,1,.3,1) both;transform-origin:left}
@keyframes dbslide{from{transform:scaleX(.05);opacity:.3}}
@media(max-width:900px){.db-heroc{flex-direction:column;align-items:flex-start;padding:24px}.db-hero-t h1{font-size:34px}}
@media(prefers-reduced-motion:reduce){.db-t,.db-orb,.db-ring,.db-mini i,.db-track .bar{animation:none!important}}
.db-t b{font-size:34px;white-space:nowrap}
.db-spark{width:84px}

.db-sumcard{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015)),var(--surface-2);box-shadow:inset 0 0 0 1px var(--border),0 18px 40px -26px rgba(0,0,0,.7);overflow:hidden}
.db-col{padding:20px 0 10px;display:flex;flex-direction:column}
.db-col+.db-col{border-left:1px solid var(--border)}
.db-col .k{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:0 24px 8px}
.db-r{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 24px;cursor:pointer;transition:background .15s;position:relative}
.db-r::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--accent);opacity:0;transition:opacity .15s}
.db-r:hover{background:rgba(255,93,0,.07)}
.db-r:hover::before{opacity:1}
.db-r .l{display:flex;flex-direction:column;min-width:0}
.db-r .l span{font-size:13.5px;font-weight:600}
.db-r .l em{font-style:normal;font-size:12px;color:var(--muted);line-height:1.4}
.db-r .l em i{font-style:normal;color:var(--crit);font-weight:600}
.db-r b{font-family:var(--font-display);font-size:26px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.db-r b i{font-style:normal;font-size:15px;font-weight:500;color:var(--muted)}
.db-r b.neg{color:var(--crit)}
:root[data-theme="light"] .db-sumcard{background:#fff}
:root[data-theme="light"] .db-r b:not(.neg),:root[data-theme="light"] .db-r .l span{color:#111}
@media(max-width:900px){.db-sumcard{grid-template-columns:minmax(0,1fr)}.db-col+.db-col{border-left:0;border-top:1px solid var(--border)}}

/* сегодня по часам v2 */
.db-day{gap:6px}
.db-axis{margin-bottom:2px}
.db-shoot{padding:10px 8px;margin:0 -8px;border-radius:12px}
.db-shoot+.db-shoot{border-top:1px solid color-mix(in srgb,var(--text) 7%,transparent)}
.db-track{height:34px;background:none}
.db-track:not(.db-track--h)::before{content:"";position:absolute;inset:-10px 0;background:repeating-linear-gradient(90deg,color-mix(in srgb,var(--text) 9%,transparent) 0 1px,transparent 1px calc(100%/6));pointer-events:none}
.db-track .bar{top:2px;height:30px;font-style:normal;gap:10px;justify-content:space-between;background:linear-gradient(180deg,#ff7a2e,#ff5d00);border-radius:10px;box-shadow:0 10px 20px -10px rgba(255,93,0,.7)}
.db-track .bar b{font-style:normal}
.db-track .bar span{font-size:11.5px;font-weight:700;color:rgba(255,255,255,.8);white-space:nowrap}
.db-track .now{display:none}
.db-track--h .nowl{position:absolute;top:-3px;transform:translateX(-50%);font-style:normal;text-decoration:none;font-size:11px;font-weight:700;color:var(--accent-fg);background:var(--text);color:var(--surface);padding:2px 8px;border-radius:999px;font-variant-numeric:tabular-nums;z-index:2}
.db-day{position:relative}
.db-day::after{content:"";position:absolute;top:70px;bottom:22px;left:calc(20px + 206px + var(--nowx,0px));width:0}
.db-track--h{height:30px}
.db-track--h span{top:auto;bottom:0}
.db-track--h .nowl{top:0;background:var(--accent);color:var(--accent-fg)}
.db-track .now{display:block;top:-10px;bottom:-10px;width:2px;background:var(--accent);opacity:.75;z-index:0;border-radius:2px}
.db-track .bar{z-index:1}

/* подрядчики */
.ac-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.ac-card{cursor:default;gap:16px}
.ac-card:hover{transform:translateY(-2px)}
.ac-top{display:flex;align-items:flex-start;gap:14px}
.ac-ph{flex:none;width:72px;height:72px;border-radius:18px;overflow:hidden;background:var(--surface-3)}
.ac-ph img{width:100%;height:100%;object-fit:cover;display:block}
.ac-id{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ac-id .nm{font-size:16px;font-weight:700;line-height:1.3}
.ac-id .k{font-size:12.5px;color:var(--muted)}
.ac-st{font-size:12.5px;font-weight:600;color:var(--text-2);margin-top:4px}
.ac-st.busy{color:var(--crit)}
.ac-row{display:flex;gap:30px}
.ac-row div{display:flex;flex-direction:column}
.ac-row b{font-family:var(--font-display);font-size:22px;font-weight:700;letter-spacing:-.01em}
.ac-row span{font-size:12px;color:var(--muted)}
/* телефон: панель сохранения настроек поднимаем над нижним меню (.bnav: 66px + отступы), а внизу
   страницы оставляем место, чтобы последние поля не оказывались под панелью */
@media(max-width:640px){
  :root .set-bar{bottom:calc(86px + env(safe-area-inset-bottom,0px))}
  .main[data-view="settings"] .sf-page{padding-bottom:calc(210px + env(safe-area-inset-bottom,0px))}
}
/* Telegram Desktop, полный экран: свои кнопки Telegram держит в правом/левом верхнем углу */
html.tg-desk .topbar{padding-left:64px;padding-right:110px}
/* дашборд директора (ПК): приветствие и сводка — одна плашка, без вложенных панелей и разделителей;
   число стоит вплотную слева от подписи, группы разделены только воздухом и заголовком */
.db-heroc.db-merged{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:14px 4px 4px;overflow:visible;isolation:auto}
/* без плашки: только цифры и светящийся градиент, который перетекает в фон страницы (края у свечения не режутся) */
:root .db-heroc.db-merged,:root[data-theme] .db-heroc.db-merged{background:none;box-shadow:none;border-radius:0}
.db-merged .db-orb{z-index:0}
.db-merged .db-orb.o1{right:-24px;top:-80px}
.db-merged .db-orb.o2{bottom:-90px}
:root[data-theme="light"] .db-merged .db-orb{opacity:.55}
.db-merged > *:not(.db-orb){position:relative;z-index:1}
.db-merged ~ *{position:relative}
.db-merged .db-mh{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:0 0 26px}
.db-merged .db-hero-t h1{margin:8px 0 0}
.db-merged .db-new{margin-bottom:4px}
.db-merged .db-sumin{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.db-merged .db-r{flex-direction:column-reverse;align-items:flex-start;justify-content:flex-end;gap:8px;padding:6px 0;cursor:default;transition:none;background:none}
.db-merged .db-r::before{display:none}
.db-merged .db-r:hover{background:none}
.db-merged .db-r b{text-align:left;font-size:46px;line-height:1}
.db-merged .db-r .l span{font-size:14px;font-weight:600;color:rgba(255,255,255,.72)}
:root[data-theme="light"] .db-merged .db-r .l span{color:#555}
@media(max-width:900px){
  .db-heroc.db-merged{padding:10px 2px 2px}
  .db-merged .db-mh{flex-direction:column;align-items:flex-start;gap:16px;padding:0 0 18px}
  .db-merged .db-new{margin-bottom:0}
  .db-merged .db-sumin{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:10px}
  .db-merged .db-r b{font-size:40px}
}
.db-sub{display:flex;align-items:center;gap:8px;margin:16px 0 2px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.db-sub em{font-style:normal;padding:1px 8px;border-radius:99px;background:var(--surface-3);font-size:11px;letter-spacing:0;color:var(--text-2)}
.db-legend{display:flex;flex-wrap:wrap;gap:6px 16px}
.db-legend .lg{display:inline-flex;align-items:baseline;gap:6px;font-size:12.5px;color:var(--muted)}
.db-legend .lg b{font-family:var(--font-display);font-size:14px;font-weight:700;color:var(--text)}
.db-legend .lg.crit b{color:var(--crit)}
.db-legend .lg.ok b{color:var(--ok)}
.db-shoot.db-tm{padding:5px 8px}
.db-tm .db-track{height:28px}
.db-tm .db-track .bar{top:3px;height:22px;box-shadow:none;border-radius:8px;padding:0 9px}
.db-tm .db-track .bar b{font-size:11.5px}
.db-tm .db-track .bar span{font-size:11px}
.db-tm .db-lab .t{font-size:13px}
.db-lab .st{font-size:12px;font-weight:600}
.db-lab .st--ok{color:var(--ok)}.db-lab .st--crit{color:var(--crit)}.db-lab .st--warn{color:var(--warn)}.db-lab .st--muted{color:var(--muted)}
.db-track .bar.tb--ok{background:linear-gradient(180deg,color-mix(in srgb,var(--ok) 92%,#fff),var(--ok))}
.db-track .bar.tb--late{background:linear-gradient(180deg,color-mix(in srgb,var(--crit) 92%,#fff),var(--crit))}
.db-track .bar.tb--miss,.db-track .bar.tb--wait,.db-track .bar.tb--exc{background:transparent;box-shadow:none;border:1.5px dashed currentColor}
.db-track .bar.tb--miss{color:var(--crit)}.db-track .bar.tb--wait{color:var(--muted)}.db-track .bar.tb--exc{color:var(--warn)}
.db-track .bar.tb--miss b,.db-track .bar.tb--wait b,.db-track .bar.tb--exc b{color:inherit}
.db-track .bar.tb--miss span,.db-track .bar.tb--wait span,.db-track .bar.tb--exc span{color:inherit;opacity:.75}
.db-track .dl{position:absolute;top:3px;height:22px;transform:translateX(-50%);display:flex;align-items:center;padding:0 10px;border-radius:999px;font-style:normal;background:color-mix(in srgb,var(--warn) 18%,transparent);box-shadow:inset 0 0 0 1px var(--warn);z-index:1}
.db-track .dl b{font-family:var(--font-display);font-size:11.5px;font-weight:700;color:var(--warn)}
.dv{gap:0;padding:22px 0 0;border-radius:24px;overflow:hidden}
/* сам блок — не кнопка: без подъёма и оранжевой обводки при наведении */
.dv{cursor:default}
:root .dv:hover,:root:not([data-theme="light"]) .dv:hover{transform:none;box-shadow:inset 0 0 0 1px var(--border),0 10px 24px -14px rgba(0,0,0,.7)}
:root[data-theme="light"] .dv:hover{transform:none;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.dv-head{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap;padding:0 24px}
.dv-title b{font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:-.015em}
.dv-title b i{font-style:normal;font-weight:800}
.dv-head{align-items:center}
.dv .proj-tabs{position:relative;display:inline-flex;align-self:center;gap:4px;border:0;margin:0 0 0 auto;padding:4px;background:var(--surface-3);border-radius:999px;flex-wrap:nowrap}
:root:not([data-theme="light"]) .dv .proj-tabs{background:var(--surface-3);box-shadow:none}
.dv .proj-tab{position:relative;z-index:1;padding:7px 16px;border:0;margin:0;border-radius:999px;font-size:12.5px;font-weight:700;color:var(--muted);transition:color .2s}
.dv .proj-tab:hover{color:var(--text)}
.dv .proj-tab.on,:root .dv .tp-tabs .proj-tab.on{background:transparent;box-shadow:none;color:#fff}
.dw{position:relative;width:100%;min-width:0;align-self:stretch;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-top:16px;cursor:grab;user-select:none;-webkit-user-select:none;border-top:1px solid var(--border)}
.dw::-webkit-scrollbar{display:none}
.dw.drag{cursor:grabbing;scroll-snap-type:none}
.dw-col{flex:0 0 calc(100%/4*var(--n,1));width:calc(100%/4*var(--n,1));min-width:0;overflow:hidden;scroll-snap-align:start;display:flex;flex-direction:column;gap:10px;padding:14px 8px 12px;min-height:210px;border-right:1px solid var(--border);box-sizing:border-box}
.dw-h{display:flex;align-items:center;height:26px;gap:7px;padding:0 4px}
.dw-h span{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.dw-h b{font-family:var(--font-display);font-size:19px;font-weight:700;line-height:1}
.dw-h em{font-style:normal;font-size:11px;color:var(--muted);text-transform:uppercase}
.dw-col.off:not(.today){background:rgba(150,150,150,.11)}
:root[data-theme="light"] .dw-col.off:not(.today){background:rgba(0,0,0,.045)}
.dw-col.today{background:color-mix(in srgb,var(--accent) 6%,transparent)}
.dw-col.today .dw-h b{color:var(--accent-fg);background:var(--accent);min-width:26px;height:26px;padding:0 4px;border-radius:99px;display:inline-grid;place-items:center;font-size:15px}
.dw-col.today .dw-h span{color:var(--accent)}
.dw-col.past .dw-b{opacity:.6}
.dw-b{position:relative;display:flex;flex-direction:column;gap:8px;min-width:0}
.dw-g{display:grid;grid-auto-flow:column;grid-template-rows:repeat(3,var(--evh,132px));grid-auto-columns:minmax(0,1fr);gap:8px;align-items:stretch}
.dw-ev{height:var(--evh,132px);box-sizing:border-box;overflow:hidden;padding:11px 13px 12px;border-radius:13px;background:var(--surface-3);display:flex;flex-direction:column;gap:3px;cursor:pointer;min-width:0;transition:background .12s,transform .12s}
.dw-ev:hover{background:color-mix(in srgb,var(--text) 9%,var(--surface-3));transform:translateY(-1px)}
.dw-ev b{font-size:14px;font-weight:600;line-height:1.3;color:var(--text);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.dw-ev > span{font-size:12.5px;color:var(--text-2);line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.dw-ev--shoot{background:linear-gradient(180deg,#ff7a2e,#ff5d00);box-shadow:0 8px 16px -10px rgba(255,93,0,.8)}
.dw-ev--shoot:hover{background:linear-gradient(180deg,#ff8840,#ff6a14)}
.dw-ev--shoot b,.dw-ev--shoot > span{color:#fff}
.dw-ev--shoot > span{opacity:.9}
.dw-ev--late > span{color:var(--crit);font-weight:600}
.dw-ev > span:not(.dw-vid){-webkit-line-clamp:1}
.dw-ev > .dw-vid{font-weight:600;color:var(--text);-webkit-line-clamp:1}
.dw-ev--shoot > .dw-vid{color:#fff}
.dw-ev .dw-who{display:flex;align-items:center;gap:7px;margin-top:0;padding-top:8px;font-style:normal}
.dw-ev .dw-who .avatar{width:24px;height:24px;font-size:9px;flex:none;background:var(--surface-2);color:var(--text)}
.dw-ev .dw-who i{font-style:normal;font-size:12.5px;font-weight:600;color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dw-ev--shoot .dw-who i{color:#fff}
.dvm-who{display:flex;align-items:center;gap:8px}
.dvm-who .avatar{width:26px;height:26px;font-size:9.5px;background:var(--surface-2);color:var(--text)}
.dvm-who i{font-style:normal;font-size:12.5px;font-weight:600;color:var(--text-2)}
.dvm-r--shoot .dvm-who i{color:#fff}
.dw-ev--done{opacity:.55}
.dw-ev--done > span:last-of-type::before{content:"✓ "}
.dw-ev--off{background:transparent;box-shadow:inset 0 0 0 1.5px var(--border-strong)}
.dw-ev--off > span{color:var(--muted)}
.dw-ev .dw-stack{display:inline-flex;flex:none}
.dw-ev .dw-stack .avatar{margin-left:-7px;box-shadow:0 0 0 2px var(--surface-3)}
.dw-ev .dw-stack .avatar:first-child{margin-left:0}
.dw-ev--shoot .dw-stack .avatar{box-shadow:0 0 0 2px #ff6a14}
.dv-add{display:flex;gap:8px;justify-self:end}
#dvLayerTabs{justify-self:center}
.dv > .dv-head:has(#dvLayerTabs){display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center}
.dv-add .btn{white-space:nowrap}
@media(max-width:1180px){.dv > .dv-head:has(#dvLayerTabs){display:flex;flex-wrap:wrap}.dv-add{margin-left:auto}}
.dv .proj-tabs{margin-left:0!important}
.dw-more{align-self:flex-start;border:0;background:none;color:var(--muted);font:inherit;font-size:12px;font-weight:600;padding:2px 4px;cursor:pointer}
.dw-more:hover{color:var(--accent)}
.dvm-list{display:flex;flex-direction:column;gap:8px;padding:4px 0 6px}
.dvm-r{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:12px;align-items:center;text-align:left;padding:12px 14px;border:0;border-radius:13px;background:var(--surface-3);color:var(--text);font:inherit;cursor:pointer;transition:background .12s}
.dvm-r:hover{background:color-mix(in srgb,var(--text) 9%,var(--surface-3))}
.dvm-r .t{font-family:var(--font-display);font-size:13px;font-weight:700;color:var(--muted)}
.dvm-r b{display:block;font-size:14.5px;font-weight:600}
.dvm-r div span{font-size:13px;color:var(--muted)}
.dvm-r--shoot{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}
.dvm-r--shoot:hover{background:linear-gradient(180deg,#ff8840,#ff6a14)}
.dvm-r--shoot .t,.dvm-r--shoot b,.dvm-r--shoot div span{color:#fff}
.dvm-r--late .t,.dvm-r--late div span{color:var(--crit)}
.dvm-r--done{opacity:.6}
.dw-free{position:absolute;left:0;top:0;font-size:12px;color:var(--muted);padding:2px 4px}
:root[data-theme="light"] .dv-title b{color:#111}
@media(max-width:640px){
  .dv{padding:16px 0 0;border-radius:22px}
  .dv-head{padding:0 16px;gap:8px 14px}
  .dv-title b{font-size:18px}
  .dv > .dv-head:has(#dvLayerTabs){display:flex;flex-wrap:wrap}
  .dv-add{margin-left:0;width:100%;order:3}
  .dv-add .btn{flex:1;justify-content:center}
  .dv .proj-tabs{margin-left:0;width:100%}
  .dv .proj-tab{flex:1;padding:7px 4px}
  .dw-col{flex-basis:calc(100%/1.9*var(--n,1));width:calc(100%/1.9*var(--n,1));padding:12px 6px 14px}
}
.wr{padding-bottom:0}
.wr-r:last-child .wr-row{padding-bottom:12px}
:root .pj-card.dv,:root:not([data-theme="light"]) .pj-card.dv,.pj-card#dbAttn{background:var(--surface)}
:root .pj-card#dbAttn:hover,:root:not([data-theme="light"]) .pj-card#dbAttn:hover{transform:none;box-shadow:inset 0 0 0 1px var(--border),0 10px 24px -14px rgba(0,0,0,.7)}
:root[data-theme="light"] .pj-card#dbAttn:hover{transform:none;box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
.wr .dv-head{padding:0 20px}
/* одна сетка на весь список: колонки по содержимому, а промежутки между ними — равные 1fr, поэтому отступы между столбцами и стрелкой везде одинаковые; по краям 16px */
.wr-list{display:grid;grid-template-columns:20px fit-content(220px) minmax(16px,1fr) fit-content(300px) minmax(16px,1fr) 150px minmax(16px,1fr) fit-content(140px) minmax(16px,1fr) fit-content(130px) minmax(16px,1fr) 18px 20px;padding:14px 0 0}
.wr-head,.wr-r,.wr-row{grid-column:1/-1;display:grid;grid-template-columns:subgrid;align-items:center}
.wr-c-p,.wr-head > span:nth-child(1){grid-column:2}
.wr-c-v,.wr-head > span:nth-child(2){grid-column:4}
.wr-c-g,.wr-head > span:nth-child(3){grid-column:6}
.wr-c-d,.wr-head > span:nth-child(4){grid-column:8}
.wr-c-m,.wr-head > span:nth-child(5){grid-column:10}
.wr-chev{grid-column:12}
.wr-x{grid-column:1/-1}
.wr-head{padding-bottom:10px;font-size:11.5px;font-weight:600;color:var(--muted);border-bottom:1px solid var(--border)}
.wr-r + .wr-r{border-top:1px solid var(--border)}
.wr-row{padding-top:16px;padding-bottom:16px;cursor:pointer;transition:background .18s}
.wr-r > .wr-row,.wr-r > .wr-x{grid-column:1/-1}
#dbAttn .fin-h{font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:-.01em}
.wr-row:hover{background:color-mix(in srgb,var(--text) 5%,transparent)}
.wr-c{min-width:0;display:flex;flex-direction:column;gap:3px}
.wr-c b em{font-style:normal;color:var(--accent)}
.wr-c b{font-size:14px;font-weight:600;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wr-c > span{font-size:12.25px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wr-c-p b{font-size:14.5px;font-weight:700}
.wr-row:hover .wr-c-p b{color:var(--accent)}
.wr-c-g{gap:8px}
.wr-c-p,.wr-c-v,.wr-c-d{white-space:nowrap}
.wr-c-g > span{font-size:12.25px;color:var(--muted)}
.wr-c-g > span b{display:inline;font-family:var(--font-display);font-size:13.25px;color:var(--text)}
.wr-seg{display:flex;gap:3px}
.wr-seg i{flex:1;min-width:2px;height:6px;border-radius:3px;background:color-mix(in srgb,var(--text) 13%,transparent)}
.wr-seg i.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}
.wr-c-d.late b,.wr-c-d.late > span{color:var(--crit)}
.wr-c-d.late > span{font-weight:600}
.wr-c-d.done b{color:var(--muted)}
.wr-c-d.plan > span,.wr-c-d.done > span{color:var(--muted)}
.wr-pm{display:inline-flex;align-items:center;gap:9px}
.wr-pm b{font-size:14px;font-weight:600}
.wr-pm .avatar{width:26px;height:26px;font-size:10px;flex:none}
.wr-chev{font-size:22px;line-height:1;color:var(--muted);transition:transform .25s cubic-bezier(.16,1,.3,1),color .2s}
.wr-row:hover .wr-chev{color:var(--accent)}
.wr-r.open .wr-chev{transform:rotate(90deg);color:var(--accent)}
.wr-x{display:none}
.wr-r.open .wr-x{display:block}
.wr-panel{padding:4px 0 22px}
.wr-ph{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 20px 12px}
.wr-ph span{font-size:12.25px;font-weight:600;color:var(--muted)}
.wr-ph span b{color:var(--text)}
.wr-open{display:inline-flex;align-items:center;gap:6px;border:0;background:none;color:var(--accent);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;padding:2px 0}
.wr-open .ico{width:14px;height:14px}
/* сетка = колонки календаря: 4 в ряд, те же отступы и высота карточки */
.wr-tg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:0 8px 8px}
/* 4 в ряд на всю ширину блока, зазор 8px — как между карточками одного дня в календаре */
.wr-cell{min-width:0}
.wr-tg .dw-ev{height:var(--evh,132px)}
.wr-none{grid-column:1/-1;padding:18px 12px;font-size:13.5px;color:var(--muted);white-space:nowrap}
.wr-more{margin:0 0 8px 20px;border:0;background:none;color:var(--muted);font:inherit;font-size:13px;font-weight:600;cursor:pointer;padding:8px 0}
.wr-more:hover{color:var(--accent)}
:root[data-theme="light"] .wr-c b,:root[data-theme="light"] .wr-tn,:root[data-theme="light"] .wr-pm b{color:#111}
@media(max-width:900px){
  .wr-list{display:block}
  .wr-head{display:none}
  .wr-r{display:block}
  .wr-row{display:grid;grid-template-columns:minmax(0,1fr) auto 18px;row-gap:10px;padding-left:16px;padding-right:16px}
  .wr-c-p{grid-column:1;grid-row:1}
  .wr-c-v{grid-column:1;grid-row:2}
  .wr-c-g{grid-column:1 / 3;grid-row:3}
  .wr-c-m{display:none}
  .wr-c-d{grid-column:2;grid-row:1;text-align:right;align-items:flex-end}
  .wr-chev{grid-column:3;grid-row:1}
}
@media(max-width:640px){
  .wr .dv-head{padding:0 16px}
  .wr-list{padding:8px 0 0}
  .wr-panel{padding:4px 0 18px}
  .wr-ph{padding:0 16px 12px}
  .wr-tg{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* строка «Проекты» на телефоне: было тесно — статус/срок голым текстом прижаты к самому краю
     вплотную к заголовку, весь ряд читался как ужатая десктопная таблица, а не карточка.
     Добавил воздуха (padding/row-gap), увеличил заголовок, а статус/срок сдвинул отдельной
     плашкой под заголовок (не в ту же строку) — так он не конкурирует за место с длинным
     названием проекта и не подходит вплотную к правому краю. */
  .wr-row{grid-template-columns:1fr auto;row-gap:6px;padding:16px}
  .wr-c-p{grid-column:1/-1;grid-row:1}
  .wr-c-p b{font-size:16px}
  .wr-c-d{grid-column:1/-1;grid-row:2;display:flex;flex-direction:row;align-items:center;gap:6px;text-align:left;background:var(--surface-3);align-self:start;padding:4px 10px;border-radius:999px;width:fit-content}
  .wr-c-d b{font-size:12px;font-weight:700}
  .wr-c-d span{font-size:12px;font-weight:600;color:var(--text-2)}
  .wr-c-d.late{background:var(--crit-soft)}
  .wr-c-v{grid-column:1/-1;grid-row:3;margin-top:2px}
  .wr-c-g{grid-column:1/-1;grid-row:4}
  .wr-chev{display:none}
}

.wz-scbox{}
.wz-scbox textarea.wz-ta{width:100%;min-height:118px;box-sizing:border-box}
.wz-scup-row{margin-top:8px}
.wz-scfile-chip{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;background:var(--surface-3)}
.wz-scfile-chip .ico{width:16px;height:16px;color:var(--accent);flex:none}
.wz-scfile-chip b{font-size:14px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wz-scfile-chip i{font-style:normal;font-size:12.5px;color:var(--muted);flex:none}
.wz-scfile-x{margin-left:auto;width:26px;height:26px;border:0;border-radius:99px;background:none;color:var(--muted);display:grid;place-items:center;cursor:pointer;flex:none}
.wz-scfile-x:hover{background:var(--surface-2);color:var(--crit)}
.wz-scfile-x .ico{width:14px;height:14px;color:inherit}
.gs{position:relative;display:flex}
.topbar .gs + .theme-btn{margin-left:auto}
@media(max-width:900px){.topbar .gs{flex:1;min-width:0}.topbar .gs .search{flex:1}}
.gs-pop{position:absolute;top:calc(100% + 8px);left:0;width:max(100%,380px);max-width:calc(100vw - 24px);max-height:min(62vh,440px);overflow-y:auto;padding:6px;background:var(--surface);border:1px solid var(--border-strong);border-radius:14px;box-shadow:0 18px 40px -12px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.2);z-index:70}
.gs-pop[hidden]{display:none}
.gs-h{padding:8px 10px 4px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.gs-r{display:flex;flex-direction:column;align-items:flex-start;gap:1px;width:100%;padding:8px 10px;border:0;border-radius:9px;background:none;color:var(--text);text-align:left;cursor:pointer;font:inherit}
.gs-r:hover,.gs-r:focus-visible{background:var(--surface-3)}
.gs-t{font-size:13.5px;font-weight:600;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gs-m{font-size:12px;color:var(--muted);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gs-empty{padding:14px 12px;font-size:13px;color:var(--muted)}
/* телефон: поле поиска занимает всю шапку слева от кнопок темы и уведомлений; выпадашка — на всю ширину экрана */
@media(max-width:640px){
  .topbar .gs{position:static;flex:1;min-width:0}
  .topbar .gs .search{flex:1;width:auto;min-width:0;margin:0}
  .topbar .search kbd{display:none}
  .gs-pop{left:12px;right:12px;width:auto;max-width:none}
}
.pe{display:flex;flex-direction:column;gap:14px}
.pe .wm-plates{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:640px){.pe .wm-plates{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pe-bar{display:flex;height:8px;border-radius:99px;overflow:hidden;background:var(--surface-3)}
.pe-bar i{display:block;height:100%}
.pe-bar .paid,.pe-leg .paid{background:var(--accent)}
.pe-bar .pend,.pe-leg .pend{background:var(--warn)}
.pe-leg{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:-6px}
.pe-leg span{display:inline-flex;align-items:center;gap:6px}
.pe-leg i{width:8px;height:8px;border-radius:99px;display:inline-block}
.pe-pct{margin-left:auto}
.pe-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:4px}
.pe-head .proj-detail-h{margin:0}
.pe-r{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:none}
.pe-r b{font-family:var(--font-display);font-size:14px;font-weight:700;white-space:nowrap}
.pe-types{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.pe-type{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:12px;background:var(--surface-2)}
.pe-type span{font-size:12px;color:var(--muted)}
.pe-type b{font-size:14px;font-weight:700}
.pe-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:12px;border-top:1px solid var(--border)}
.pe-total span{font-size:12.5px;color:var(--muted)}
.pe-total b{font-family:var(--font-display);font-size:16px;font-weight:700}
:root[data-theme="light"] .pe-r b,:root[data-theme="light"] .pe-total b{color:#111}
.loc-card{padding:0;gap:0;overflow:hidden;justify-content:flex-start}
.loc-gal{position:relative;aspect-ratio:16/10;background:var(--surface-3);overflow:hidden;touch-action:pan-y}
/* трек из всех фото карточки в ряд — .loc-track сдвигается на -100%×индекс, свайп (см. JS в конце
   файла, делегированный обработчик на .loc-gal) тянет его за пальцем через translateX в реальном
   времени; .dragging снимает transition на время самого жеста, чтобы не было запаздывания за пальцем */
.loc-track{display:flex;width:100%;height:100%;transform:translateX(0);transition:transform .32s cubic-bezier(.16,1,.3,1)}
.loc-track.dragging{transition:none}
.loc-slide{flex:0 0 100%;width:100%;height:100%}
.loc-gal img{width:100%;height:100%;object-fit:cover;display:block;user-select:none}
.loc-nav{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:999px;border:0;background:rgba(0,0,0,.5);color:#fff;font-size:22px;line-height:1;display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .15s,background .15s;padding:0 0 3px}
.loc-nav:hover{background:rgba(0,0,0,.72)}
.loc-nav.prev{left:10px}.loc-nav.next{right:10px}
.loc-gal:hover .loc-nav{opacity:1}
@media (hover:none){.loc-nav{opacity:.9}}
.loc-cnt{position:absolute;top:10px;right:10px;font-size:12px;font-weight:700;color:#fff;background:rgba(0,0,0,.5);padding:3px 10px;border-radius:999px}
.loc-dots{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:5px;pointer-events:none}
.loc-dots i{width:6px;height:6px;border-radius:99px;background:rgba(255,255,255,.55);transition:width .15s,background .15s}
.loc-dots i.on{width:16px;background:#fff}
.loc-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:12px}
.loc-h{display:flex;align-items:flex-start;gap:10px}
.loc-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.loc-nm{font-size:16px;font-weight:700;line-height:1.3}
.loc-addr,.loc-ct{display:flex;align-items:flex-start;gap:6px;font-size:12.5px;color:var(--muted);line-height:1.4}
.loc-addr .ico,.loc-ct .ico{width:14px;height:14px;flex:none;margin-top:1px}
.loc-desc{margin:0;font-size:13px;line-height:1.45;color:var(--text-2)}
:root[data-theme="light"] .loc-nm{color:#111}
.lf-ph{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
.lf-tile{position:relative;aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:var(--surface-3)}
.lf-tile img{width:100%;height:100%;object-fit:cover;display:block}
.lf-x{position:absolute;top:5px;right:5px;width:24px;height:24px;border-radius:999px;border:0;background:rgba(0,0,0,.6);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
.lf-x .ico{width:12px;height:12px}
.lf-main{position:absolute;left:5px;bottom:5px;font-size:10.5px;font-weight:700;color:#fff;background:rgba(0,0,0,.6);padding:2px 7px;border-radius:999px}
.lf-add{aspect-ratio:4/3;border-radius:12px;border:1.5px dashed var(--border-strong);background:transparent;color:var(--text-2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-size:12px;font-weight:600;cursor:pointer}
.lf-add:hover:not(:disabled){border-color:var(--accent);color:var(--text)}
.lf-add:disabled{opacity:.6;cursor:progress}
.lf-add .ico{width:18px;height:18px}
.ac-rate{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding-top:12px;border-top:1px solid var(--border)}
.ac-rate span{font-size:12px;color:var(--muted)}
.ac-rate b{font-family:var(--font-display);font-size:15px;font-weight:700}
:root[data-theme="light"] .ac-rate b{color:#111}
.ac-book{width:100%;justify-content:center}
:root[data-theme="light"] .ac-id .nm,:root[data-theme="light"] .ac-row b{color:#111}
:root[data-theme="light"] .ac-st{color:#555}
:root[data-theme="light"] .ac-st.busy{color:var(--crit)}
:root[data-theme="light"] .ac-book{background:#fff}
.ac-card{justify-content:space-between}
.ac-row{gap:24px}
.ac-book{margin-top:auto}

/* посещаемость v2 */
.att-req{margin-bottom:0}
.att-kpis{padding:0 20px 4px;margin-top:4px}
.att-kpis--6{grid-template-columns:repeat(6,minmax(0,1fr))}
.att-kpis .pj-kpi{box-shadow:inset 0 0 0 1px var(--border)}
.att-kpis .pj-kpi .v{font-size:22px}
.att-sum-of{font-size:14px;font-weight:500;color:var(--muted)}
@media(max-width:1100px){.att-kpis--6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.att-kpis,.att-kpis--6{grid-template-columns:repeat(2,minmax(0,1fr))}}
.main[data-view="attendance"] .att-zone.ok{background:var(--surface-3);color:var(--text-2)}
.main[data-view="attendance"] .att-mono.warn{color:var(--accent)}
.main[data-view="attendance"] .att-table tr.sev-warn>td{background:none}
.main[data-view="attendance"] .att-table tbody tr{transition:background .12s}
.main[data-view="attendance"] .att-table tbody tr:hover>td{background:var(--surface-3)}
:root[data-theme="light"] .att-kpis .pj-kpi{background:#fff;box-shadow:inset 0 0 0 1px #ececec}
.main[data-view="attendance"] .att-zone.pending{background:var(--accent-soft);color:var(--accent)}
.main[data-view="attendance"] .pay-sh-sum-i .v{font-size:30px}
.main[data-view="attendance"] .pay-sh-sum-i .l{font-size:14px}
.main[data-view="attendance"] .att-req .db-q:hover{background:none}
.main[data-view="attendance"] .att-req .db-q{transition:none}
.main[data-view="payroll"]{--warn:var(--accent);--warn-soft:var(--accent-soft)}
.main[data-view="payroll"] .pay-sheet .pay-sh-row:not(.pay-sh-head){transition:background .12s}
.main[data-view="payroll"] .pay-sheet .pay-sh-row:not(.pay-sh-head):hover{background:var(--surface-3)}
.main[data-view="payroll"] .pay-hist-row:not(.pay-hist-head){transition:background .12s}
.main[data-view="payroll"] .pay-hist-row:not(.pay-hist-head):hover{background:var(--surface-3)}
.main[data-view="expenses"]{--warn:var(--accent);--warn-soft:var(--accent-soft)}
.main[data-view="expenses"] .exq-mdrow{transition:background .12s}
.main[data-view="expenses"] .exq-stat .val{font-size:30px}
.main[data-view="expenses"] .exq-stat .label{font-size:14px}

/* команда v2 */
.tm2-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.tm2-card{gap:16px}
.tm2-top{display:flex;align-items:center;gap:12px}
.tm2-top .avatar{width:44px;height:44px;font-size:15px;flex:none}
.tm2-id{flex:1;min-width:0}
.tm2-id .nm{font-size:15px;font-weight:700;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm2-id .k{font-size:12.5px;color:var(--muted)}
.tm2-row{display:flex;gap:28px}
.tm2-row div{display:flex;flex-direction:column}
.tm2-row b{font-family:var(--font-display);font-size:22px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.tm2-row span{font-size:12px;color:var(--muted)}
.tm2-ct{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--text-2);font-variant-numeric:tabular-nums}
.tm2-ct em{font-style:normal;color:var(--muted)}
.tm-dept-h.wz-s1-lbl{display:flex;align-items:center;gap:8px;margin-bottom:10px}
:root[data-theme="light"] .tm2-id .nm,:root[data-theme="light"] .tm2-row b{color:#111}
.ac-ph{width:56px;height:56px;border-radius:16px}
.ac-desc{margin:0;font-size:12.5px;line-height:1.45;color:var(--text-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ac-tags{display:flex;flex-wrap:wrap;gap:5px}
.ac-star{color:var(--accent)}
.ac-row{align-items:flex-end}
.ac-dts{margin-left:auto;flex-direction:row!important;gap:5px;align-items:center}
.ac-dt{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;min-width:34px;padding:3px 6px;border-radius:8px;background:var(--surface-3);font-size:10.5px;color:var(--muted);line-height:1.1}
.ac-dt b{font-family:var(--font-display);font-size:14px;color:var(--text)}
.ac-none{font-size:12px;color:var(--muted)}
.ac-card{gap:12px}
:root[data-theme="light"] .ac-desc{color:#555}
:root[data-theme="light"] .ac-dt{background:#f1f1f1}
:root[data-theme="light"] .ac-dt b{color:#111}
.ac-card .ac-row{margin-top:auto}
.ac-card .ac-book{margin-top:0}
.ac-card .ac-top{align-items:center}
.ac-card .ac-st{margin:0;font-weight:600}
.ac-card .ac-desc{margin-top:-2px}
.ac-card{gap:10px}
.ac-card .ac-row{gap:22px;flex-wrap:nowrap;align-items:flex-end}
.ac-card .ac-row>div{gap:0;flex:none}
.ac-card .ac-row b{white-space:nowrap;line-height:1.15;display:flex;align-items:center;gap:5px}
.ac-card .ac-row span{line-height:1.2;margin-top:1px}
.ac-card .ac-star{font-size:20px;line-height:1;color:var(--accent)!important;display:inline-block}
.ac-card .ac-dts{margin-left:auto;gap:4px;flex-wrap:nowrap}
.ac-card .ac-dt{min-width:30px;padding:3px 5px}
.ac-card .ac-dts{gap:8px}
.ac-card .ac-dt{flex:none;min-width:36px;padding:4px 7px}
.ac-card .ac-row{gap:18px}
.ac-card .ac-row>.ac-dts{gap:8px}

/* база знаний v2 */
.main[data-view="knowledge"] .kb-side,.main[data-view="knowledge"] .kb-main{border:0;border-radius:18px;background:var(--surface-2)}
:root[data-theme="light"] .main[data-view="knowledge"] .kb-side,:root[data-theme="light"] .main[data-view="knowledge"] .kb-main{background:#fff}
.main[data-view="knowledge"] .kb-acc{border:0;border-radius:14px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--border);transition:box-shadow .16s,transform .16s}
:root[data-theme="light"] .main[data-view="knowledge"] .kb-acc{background:#f6f6f6;box-shadow:none}
.main[data-view="knowledge"] .kb-acc:hover{transform:translateY(-1px);box-shadow:inset 0 0 0 1px var(--border-strong),0 10px 20px -14px rgba(0,0,0,.6)}
.main[data-view="knowledge"] .kb-acc.open{box-shadow:inset 0 0 0 1.5px var(--accent),0 12px 24px -16px rgba(255,93,0,.5)}
.main[data-view="knowledge"] .kb-acc-hd{padding:14px 18px}
.main[data-view="knowledge"] .kb-acc-hd .t{font-size:14.5px}
.main[data-view="knowledge"] .kb-cat{border-radius:10px;transition:background .15s}
.main[data-view="knowledge"] .kb-cat.on{background:var(--accent);color:var(--accent-fg)}
.main[data-view="knowledge"] .kb-cat.on .badge{background:rgba(255,255,255,.25);color:var(--accent-fg)}
.main[data-view="knowledge"] .kb-cat:not(.on):hover{background:var(--surface-3)}
.main[data-view="knowledge"] .kb-acc-pad,.main[data-view="knowledge"] .kb-acc-body,.main[data-view="knowledge"] .kb-acc-inner{background:transparent!important}
.main[data-view="knowledge"] .kb-acc.open{background:var(--surface)}
:root[data-theme="light"] .main[data-view="knowledge"] .kb-acc.open{background:#f6f6f6}



/* настройки правил v2 */
.main[data-view="settings"] .sf-card{border:0;border-radius:18px;background:var(--surface-2);padding:20px 0 12px}
:root[data-theme="light"] .main[data-view="settings"] .sf-card{background:#fff}
.main[data-view="settings"] .sf-head h3{font-size:17px;font-weight:700}
.main[data-view="settings"] .sfg-cell{transition:background .14s}
.main[data-view="settings"] .sfg-cell:hover{background:var(--surface-3)}
.main[data-view="settings"] .sfg-num{font-size:18px;font-weight:700}
.main[data-view="settings"] .sfg-edit{color:var(--muted);transition:background .14s,color .14s}
.main[data-view="settings"] .sfg-cell:hover .sfg-edit{color:var(--accent)}
.main[data-view="settings"] .sfg::after{background:color-mix(in srgb,var(--text) 8%,transparent)}
:root[data-theme="light"] .main[data-view="settings"] .sfg-num,:root[data-theme="light"] .main[data-view="settings"] .sf-head h3{color:#111}

/* настройки правил v3: правила плашками */
.main[data-view="settings"] .sfg,.main[data-view="settings"] .sfg--1,.main[data-view="settings"] .sfg--3{grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:10px;padding:14px 20px 6px;border:0}
.main[data-view="settings"] .sfg::after{display:none}
.main[data-view="settings"] .sfg-cell{position:relative;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:8px;padding:14px 16px 14px;border:0;border-radius:14px;background:var(--surface);box-shadow:none;transition:transform .16s,box-shadow .16s,background .16s}
:root[data-theme="light"] .main[data-view="settings"] .sfg-cell{background:#f6f6f6}
.main[data-view="settings"] .sfg-cell:hover{background:var(--surface);transform:translateY(-2px);box-shadow:0 12px 22px -14px rgba(0,0,0,.6)}
:root[data-theme="light"] .main[data-view="settings"] .sfg-cell:hover{background:#fff;box-shadow:0 12px 22px -14px rgba(0,0,0,.25)}
.main[data-view="settings"] .sfg-cell:empty{display:none}
.main[data-view="settings"] .sfg-name{font-size:13px;color:var(--muted);font-weight:500;padding-right:26px}
.main[data-view="settings"] .sfg-val{display:flex;align-items:baseline;gap:6px}
.main[data-view="settings"] .sfg-num{font-size:26px;font-weight:800;letter-spacing:-.02em}
.main[data-view="settings"] .sfg-u{font-size:12.5px;color:var(--muted);font-weight:600}
.main[data-view="settings"] .sfg-edit{position:absolute;top:10px;right:10px;margin:0;opacity:.55}
.main[data-view="settings"] .sfg-cell:hover .sfg-edit{opacity:1}
.main[data-view="settings"] .sf-head{margin:0 20px}
.main[data-view="settings"] .sf-card--geo .sf-body,.main[data-view="settings"] .sf-card--geo{padding-bottom:14px}
.main[data-view="settings"] .sf-body,.main[data-view="settings"] .sf-head,.main[data-view="settings"] .sfg,.main[data-view="settings"] .sf-group{border-top:0!important;border-bottom:0!important}
.main[data-view="settings"] .sfg-cell:hover{background:var(--surface)!important}
:root[data-theme="light"] .main[data-view="settings"] .sfg-cell:hover{background:#f6f6f6!important}
.main[data-view="settings"] .sfg-cell:hover{transform:translateY(-3px);box-shadow:0 18px 30px -12px rgba(0,0,0,.85),0 6px 12px -6px rgba(0,0,0,.5)!important}
:root[data-theme="light"] .main[data-view="settings"] .sfg-cell:hover{box-shadow:0 18px 30px -12px rgba(0,0,0,.35),0 6px 12px -6px rgba(0,0,0,.18)!important}
.main[data-view="settings"] .sf-wrap > section.sf-card--grid:nth-of-type(1) .sfg{grid-template-columns:repeat(3,minmax(0,1fr))}
/* «Премии» и «Норматив часов» теперь друг под другом на всю ширину — тоже по 3 плашки в ряд, как «Штрафы» */
.main[data-view="settings"] .sf-row2 .sfg{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:640px){.main[data-view="settings"] .sf-row2 .sfg{grid-template-columns:1fr}}
/* ширина плашек «Радиус»/«Опоздание без штрафа» — та же, что у плашек «Штрафы за нарушения»: тот же
   3-колоночный делитель ширины карточки, просто сайдбар занимает 1 колонку из 3, а карта — 2.
   Только на широких экранах — на ≤820px карта и так уходит под сайдбар (см. @media(max-width:820px) выше),
   это правило не должно было туда лезть и раньше вылезало за счёт большей специфичности. */
@media(min-width:821px){
  .main[data-view="settings"] .sf-card--geo .sf-geo{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;--geo-map-h:280px}
  .main[data-view="settings"] .sf-card--geo .sf-geo-side{grid-column:span 1;justify-content:space-between}
  .main[data-view="settings"] .sf-card--geo .sf-lmap{grid-column:span 2}
}
.main[data-view="settings"] .sf-card--geo .sf-body{padding:18px 20px 4px}
/* на планшете/телефоне карточка складывается в 1 колонку — боковой отступ должен совпадать с плашками
   «Штрафы за нарушения» (14px), а не с десктопным 20px, иначе плашки геозоны уже остальных */
@media(max-width:820px){.main[data-view="settings"] .sf-card--geo .sf-body{padding-left:10px;padding-right:10px}}
.main[data-view="settings"] .sf-card--geo .sf-geo-side .sfg-cell{padding:14px 16px}
.main[data-view="settings"] .sf-card--geo .sf-geo-side .sfg{margin:0;padding:0;grid-template-columns:1fr}
.main[data-view="settings"] .sf-head h3,.main[data-view="settings"] .sf-gh{font-size:14px!important;font-weight:600!important;letter-spacing:0!important;line-height:1.3}
.main[data-view="settings"] .sf-sub{font-size:14px!important;font-weight:600!important;letter-spacing:0!important;line-height:1.3}
.main[data-view="settings"] .sf-head h3,.main[data-view="settings"] .sf-sub,.main[data-view="settings"] .sf-gh{font-family:var(--font-body)!important;font-size:15.5px!important;font-weight:600!important;letter-spacing:0!important;line-height:1.3!important;color:var(--text)!important}
.main[data-view="settings"] .sf-card--geo .sf-geo-side .sfg{margin-left:0;margin-right:0}
.main[data-view="settings"] .sf-card--geo .sf-geo-side .sfg{padding-top:0}
.main[data-view="settings"] .sf-sub + .sfg{padding-top:8px}

/* ===== единый вид полей ввода: .in, textarea, поиск, выпадающие списки, календарь-триггеры, sf-ctl =====
   размер 33px · 12.5px/600 · радиус 8 · фон --field · рамка --field-border
   hover: фон --surface + рамка --border-strong · focus: оранжевая рамка + кольцо · ошибка: красная */
:root .in,:root .kb-search,:root .dd-trigger:not(.tm-kb),:root .att-cal-trig,:root .sf-ctl{
  background:var(--field);border:1px solid var(--field-border);border-radius:8px;color:var(--text);
  font-size:12.5px;font-weight:600;box-shadow:none;outline:0;
  transition:border-color .12s ease,background .12s ease,box-shadow .12s ease}
:root input.in,:root .kb-search,:root .dd-trigger:not(.tm-kb),:root .att-cal-trig,:root .sf-ctl{height:33px;box-sizing:border-box}
:root .kb-search input{height:31px;font-size:12.5px;font-weight:600}
:root .in:hover,:root .kb-search:hover,:root .dd:not(.open) .dd-trigger:not(.tm-kb):hover,:root .att-cal-trig:hover,:root .sf-ctl:hover{
  background:var(--surface);border-color:var(--border-strong);box-shadow:none}
:root .in:focus,:root .kb-search:focus-within,:root .dd.open .dd-trigger:not(.tm-kb),:root .dd-trigger:not(.tm-kb):focus-visible,:root .att-cal.open .att-cal-trig,:root .att-cal-trig:focus-visible,:root .sf-ctl:focus-within{
  background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:0}
:root .in.bad,:root .att-cal-trig.bad,:root .dd-trigger.bad{border-color:var(--crit);background:var(--crit-soft);box-shadow:none}
:root .in:disabled,:root .dd-trigger:disabled{opacity:.55;cursor:not-allowed}
:root .in::placeholder,:root .kb-search input::placeholder,:root .sf-ctl input::placeholder{color:var(--muted);font-weight:600}
:root #actorCatFilter .dd-trigger,:root #teamDeptFilter .dd-trigger,:root #attViewDD .dd-trigger,:root #attDeptFilter .dd-trigger,:root #attProjFilter .dd-trigger{background:var(--field);border-color:var(--field-border);height:33px}
:root #actorCatFilter:not(.open) .dd-trigger:hover,:root #teamDeptFilter:not(.open) .dd-trigger:hover,:root #attViewDD:not(.open) .dd-trigger:hover,:root #attDeptFilter:not(.open) .dd-trigger:hover,:root #attProjFilter:not(.open) .dd-trigger:hover{background:var(--surface);border-color:var(--border-strong)}

/* настройки: правка кликом по всей плашке */
.main[data-view="settings"] .sfg-cell--edit{cursor:pointer}
.main[data-view="settings"] .sfg-cell.editing{cursor:text;background:var(--surface)!important;transform:none!important;box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)!important}
.main[data-view="settings"] .sfg-cell.editing .sfg-edit{display:none}
.main[data-view="settings"] .sfg-in{width:auto;min-width:2ch;flex:0 1 auto;field-sizing:content;height:auto;padding:0;margin:0;border:0!important;border-radius:0;background:transparent!important;box-shadow:none;outline:0;
  font-family:var(--font-display);font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1.15;text-align:left;color:var(--text)}

/* множитель: крупное значение, открывается кликом по плашке */
:root .main[data-view="settings"] .sfg--3 .sfg-cell .dd{width:100%}
:root .main[data-view="settings"] .sfg--3 .sfg-cell .dd-trigger{height:auto;padding:0;border:0!important;background:transparent!important;box-shadow:none!important;width:auto;gap:8px;font-family:var(--font-display);font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1.15;color:var(--text)}
:root .main[data-view="settings"] .sfg--3 .sfg-cell .dd-val{font-size:26px;font-weight:800;color:var(--text)}
:root .main[data-view="settings"] .sfg--3 .sfg-cell .dd-trigger .chev{width:16px;height:16px;color:var(--muted)}
.main[data-view="settings"] .sfg-cell:has(.dd.open){cursor:default;background:var(--surface)!important;transform:none!important;box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)!important;z-index:5}

/* множитель: значения кнопками внутри плашки */
.main[data-view="settings"] .sfg-cell--mult{cursor:default}
.mult-pills{display:flex;flex-wrap:wrap;gap:6px}
.mult-pill{border:0;font:inherit;font-size:12.5px;font-weight:700;padding:6px 11px;border-radius:999px;cursor:pointer;background:var(--surface-3);color:var(--text-2);transition:background .14s,color .14s,transform .14s}
.mult-pill:hover{color:var(--text);transform:translateY(-1px)}
.mult-pill.on{background:var(--accent);color:var(--accent-fg);box-shadow:0 6px 14px -8px rgba(255,93,0,.7)}
:root[data-theme="light"] .mult-pill:not(.on){background:#ececec}
.mult-pills{gap:4px;flex-wrap:nowrap}
.mult-pill{padding:6px 8px;font-size:12px;flex:1 1 0;min-width:0;text-align:center;white-space:nowrap}
.mult-pills{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.mult-pill{padding:6px 8px;font-size:12.5px}

/* виджет несохранённых изменений: плавающая пилюля */
.set-bar{width:max-content;max-width:calc(100% - 24px);margin:0 auto;gap:22px;padding:8px 8px 8px 20px;border:0;border-radius:999px;
  background:color-mix(in srgb,var(--surface) 78%,transparent);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);
  box-shadow:0 0 0 1px var(--border-strong),0 22px 44px -14px rgba(0,0,0,.75),0 0 30px -6px rgba(255,93,0,.35);
  animation:setbar-in .45s cubic-bezier(.16,1.2,.3,1)}
@keyframes setbar-in{from{opacity:0;transform:translateY(24px) scale(.92)}to{opacity:1;transform:none}}
.set-bar > span{font-size:13.5px;font-weight:600;gap:10px;color:var(--text)}
.set-dot{width:9px;height:9px;border-radius:50%;background:var(--accent);position:relative;flex:none;box-shadow:0 0 10px rgba(255,93,0,.9)}
.set-dot::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--accent);opacity:0;animation:setpulse 1.8s ease-out infinite}
@keyframes setpulse{0%{transform:scale(.5);opacity:.8}100%{transform:scale(1.5);opacity:0}}
.set-bar .btn{height:36px;border-radius:999px;padding:0 18px;font-size:13px}
.set-bar .set-cancel{background:transparent;border-color:transparent;color:var(--text-2)}
.set-bar .set-cancel:hover{background:var(--surface-3);color:var(--text)}
.set-bar .set-save{box-shadow:0 10px 20px -8px rgba(255,93,0,.8)}
:root[data-theme="light"] .set-bar{background:rgba(255,255,255,.82);box-shadow:0 0 0 1px #e6e6e6,0 22px 44px -16px rgba(0,0,0,.3),0 0 30px -8px rgba(255,93,0,.3)}
@media(max-width:640px){.set-bar{width:auto;border-radius:22px;margin:0}}
@media(prefers-reduced-motion:reduce){.set-bar,.set-dot::after{animation:none!important}}

/* поиск в шапке */
.topbar .search{height:36px;min-width:260px;width:280px;border-radius:999px;padding:0 8px 0 14px;gap:10px;background:var(--field);border:1px solid var(--field-border);
  transition:width .3s cubic-bezier(.16,1,.3,1),border-color .15s,background .15s,box-shadow .2s}
.topbar .search .ico{width:16px;height:16px}
.topbar .search kbd{flex:none;font:inherit;font-size:11px;font-weight:700;line-height:1;color:var(--muted);padding:4px 8px;border-radius:999px;background:var(--surface-3);transition:opacity .15s,transform .15s}
.topbar .search:hover{background:var(--surface);border-color:var(--border-strong);box-shadow:none}
.topbar .search:focus-within{width:420px;background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft),0 14px 28px -14px rgba(0,0,0,.6)}
.topbar .search:focus-within .ico{color:var(--accent)}
.topbar .search:focus-within kbd{opacity:0;transform:scale(.8)}
@media(max-width:900px){.topbar .search{min-width:0;width:100%;flex:1}.topbar .search:focus-within{width:100%}.topbar .search kbd{display:none}}

/* шапка: кнопки вида, темы и уведомлений в одном стиле с поиском */
:root .topbar .dd-trigger,:root .topbar .iconbtn:not(.menu-toggle){height:36px;background:var(--field);border:1px solid var(--field-border);color:var(--text);box-shadow:none;
  transition:background .15s,border-color .15s,box-shadow .2s,transform .2s cubic-bezier(.16,1,.3,1),color .15s}
:root .topbar .dd-trigger{border-radius:999px;padding:0 12px 0 16px;gap:8px;font-size:12.5px;font-weight:700}
:root .topbar .iconbtn:not(.menu-toggle){width:36px;border-radius:50%}
:root .topbar .dd-trigger:hover,:root .topbar .iconbtn:not(.menu-toggle):hover{background:var(--surface);border-color:var(--border-strong);box-shadow:none}
:root .topbar .iconbtn:not(.menu-toggle):hover{transform:translateY(-1px)}
:root .topbar .iconbtn:not(.menu-toggle):active{transform:scale(.94)}
:root .topbar .dd.open .dd-trigger{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.topbar .theme-btn .ico{transition:transform .5s cubic-bezier(.16,1,.3,1),color .15s}
.topbar .theme-btn:hover .ico{transform:rotate(40deg);color:var(--accent)}
.topbar .notif .iconbtn:hover .ico{color:var(--accent);animation:bellring .6s ease-in-out}
@keyframes bellring{0%,100%{transform:rotate(0)}20%{transform:rotate(16deg)}40%{transform:rotate(-14deg)}60%{transform:rotate(9deg)}80%{transform:rotate(-5deg)}}
.topbar .iconbtn .dot{top:7px;right:8px;width:9px;height:9px;background:var(--accent);border:2px solid var(--field);box-shadow:0 0 8px rgba(255,93,0,.8)}
.topbar .iconbtn .dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--accent);opacity:0;animation:setpulse 2s ease-out infinite}
@media(prefers-reduced-motion:reduce){.topbar .iconbtn .dot::after,.topbar .notif .iconbtn:hover .ico{animation:none!important}}

/* база знаний: поиск как в шапке */
:root .main[data-view="knowledge"] .kb-search{height:36px;border-radius:999px;padding:0 14px;gap:10px;background:var(--field);border:1px solid var(--field-border);
  transition:border-color .15s,background .15s,box-shadow .2s}
:root .main[data-view="knowledge"] .kb-search .ico{width:16px;height:16px}
:root .main[data-view="knowledge"] .kb-search:hover{background:var(--surface);border-color:var(--border-strong);box-shadow:none}
:root .main[data-view="knowledge"] .kb-search:focus-within{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft),0 14px 28px -14px rgba(0,0,0,.6)}
:root .main[data-view="knowledge"] .kb-search:focus-within .ico{color:var(--accent)}
:root .main[data-view="knowledge"] .kb-search input{height:34px}

/* ===== единый вид бейджей =====
   тег/статус: 22px · 12px/600 · пилюля · тон по смыслу; счётчик: 20px · 11.5px/700 · пилюля */
:root .badge,:root .pill,:root .att-zone,:root .pay-hist-ty{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:22px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:600;line-height:1;letter-spacing:0;white-space:nowrap;border:0;box-sizing:border-box;transition:background .15s,color .15s}
:root .badge{background:var(--surface-3);color:var(--text-2)}
:root .badge.cat,:root .pill--accent,:root .pill--warn,:root .att-zone.pending{background:var(--accent-soft);color:var(--accent)}
:root .pill--ok{background:var(--ok-soft);color:var(--ok)}
:root .pill--crit{background:var(--crit-soft);color:var(--crit)}
:root .pill--neutral,:root .att-zone.ok,:root .att-zone.out{background:var(--surface-3);color:var(--text-2)}
:root .count,:root .db-cnt,:root .att-card-count,:root .wz-cnt-b,:root .kb-cat .badge,:root .kb-main .card-head .badge,:root .exq-stat .label .badge,:root .tm-dept-h .count,:root .segm-c{
  display:inline-flex;align-items:center;justify-content:center;height:20px;min-width:20px;padding:0 7px;border-radius:999px;font-size:11.5px;font-weight:700;line-height:1;border:0;box-sizing:border-box}
:root[data-theme="light"] .pill--neutral,:root[data-theme="light"] .badge,:root[data-theme="light"] .att-zone.ok,:root[data-theme="light"] .att-zone.out{background:#ececec;color:#555}
:root[data-theme="light"] .badge.cat{background:var(--accent-soft);color:var(--accent)}

/* кнопки «Редактировать» и «Удалить» */
:root .btn--edit{background:var(--surface-3);border-color:transparent;color:var(--text);box-shadow:none;transition:background .15s,color .15s,transform .15s}
:root .btn--edit .ico{color:var(--muted);transition:color .15s,transform .2s}
:root .btn--edit:hover{background:var(--accent-soft);color:var(--accent);box-shadow:none}
:root .btn--edit:hover .ico{color:var(--accent);transform:rotate(-12deg)}
:root .btn--edit:active{transform:scale(.97)}
:root .kb-acts .btn--crit,:root .btn--sm.btn--crit,:root .tm-form-modal .btn--sm.btn--crit{background:var(--crit-soft);border-color:transparent;color:var(--crit);box-shadow:none;transition:background .15s,color .15s,transform .15s,box-shadow .2s}
:root .kb-acts .btn--crit:hover,:root .btn--sm.btn--crit:hover{background:var(--crit);color:#fff;box-shadow:0 10px 20px -10px rgba(255,80,80,.8)}
:root .kb-acts .btn--crit .ico,:root .btn--sm.btn--crit .ico{transition:transform .2s}
:root .kb-acts .btn--crit:hover .ico,:root .btn--sm.btn--crit:hover .ico{transform:scale(1.1)}
:root .kb-acts .btn--crit:active,:root .btn--sm.btn--crit:active{transform:scale(.97)}
:root[data-theme="light"] .btn--edit{background:#ececec}
:root .btn--edit:hover{background:var(--accent);color:var(--accent-fg);box-shadow:0 10px 20px -10px rgba(255,93,0,.8)}
:root .btn--edit:hover .ico{color:var(--accent-fg);transform:rotate(-12deg)}

/* кнопка «Добавить документ» */
:root .kb-add{position:relative;overflow:hidden;height:36px;padding:0 18px 0 14px;border-radius:999px;border:0;font-size:13px;font-weight:700;gap:8px;
  background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 12px 24px -10px rgba(255,93,0,.75),inset 0 1px 0 rgba(255,255,255,.25);
  transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}
:root .kb-add .ico{width:16px;height:16px;stroke-width:2.5;transition:transform .3s cubic-bezier(.16,1,.3,1)}
:root .kb-add::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .6s cubic-bezier(.16,1,.3,1)}
:root .kb-add:hover{transform:translateY(-2px);box-shadow:0 18px 30px -10px rgba(255,93,0,.9),inset 0 1px 0 rgba(255,255,255,.3)}
:root .kb-add:hover .ico{transform:rotate(90deg)}
:root .kb-add:hover::after{left:120%}
:root .kb-add:active{transform:translateY(0) scale(.97)}
@media(prefers-reduced-motion:reduce){:root .kb-add,:root .kb-add .ico,:root .kb-add::after{transition:none!important}}
:root .kb-add{border-radius:8px;height:33px;padding:0 15px 0 13px}

/* оранжевый градиент: наведение «Редактировать», активные пункты меню и категорий */
:root .btn--edit:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
:root .nav-item.active,:root .main[data-view="knowledge"] .kb-cat.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00);border-color:transparent;box-shadow:0 10px 22px -10px rgba(255,93,0,.75),inset 0 1px 0 rgba(255,255,255,.25)}

/* «Удалить»: красный градиент при наведении */
:root .kb-acts .btn--crit:hover,:root .btn--sm.btn--crit:hover{background:linear-gradient(180deg,color-mix(in srgb,var(--crit) 80%,#fff),var(--crit));color:#fff;box-shadow:0 10px 20px -10px rgba(255,80,80,.85),inset 0 1px 0 rgba(255,255,255,.25)}

/* модалка подтверждения удаления */
.modal.cf-modal{max-width:380px;padding:30px 28px 24px;border-radius:24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:0;overflow:visible}
.cf-ico{position:relative;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--crit-soft);color:var(--crit);margin-bottom:18px;animation:cfpop .5s cubic-bezier(.16,1.4,.3,1) both}
.cf-ico .ico{width:28px;height:28px;stroke-width:2}
.cf-ico::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid var(--crit);opacity:0;animation:cfring 1.8s ease-out .35s infinite}
@keyframes cfpop{from{transform:scale(.4) rotate(-20deg);opacity:0}to{transform:none;opacity:1}}
@keyframes cfring{0%{transform:scale(.8);opacity:.5}100%{transform:scale(1.25);opacity:0}}
.cf-modal h3{font-size:19px;font-weight:700;letter-spacing:-.01em;margin:0 0 8px}
.cf-modal p{margin:0 0 24px;font-size:13.5px;line-height:1.55;color:var(--muted);max-width:32ch}
.cf-acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
.cf-acts .btn{height:42px;justify-content:center;border-radius:12px;font-size:13.5px;font-weight:700}
.cf-acts .btn:not(.cf-del){background:var(--surface-3);border-color:transparent}
.cf-acts .btn:not(.cf-del):hover{background:var(--surface-2)}
.cf-del{background:linear-gradient(180deg,color-mix(in srgb,var(--crit) 80%,#fff),var(--crit))!important;border-color:transparent!important;color:#fff!important;box-shadow:0 12px 24px -10px rgba(255,80,80,.8),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .18s,box-shadow .2s}
.cf-del:hover{transform:translateY(-2px);box-shadow:0 18px 30px -10px rgba(255,80,80,.9),inset 0 1px 0 rgba(255,255,255,.3)}
.cf-del:active{transform:scale(.97)}
.cf-del .ico{width:16px;height:16px}
:root[data-theme="light"] .cf-acts .btn:not(.cf-del){background:#ececec}
@media(prefers-reduced-motion:reduce){.cf-ico,.cf-ico::after{animation:none!important}}

/* модалка удаления v2: шире, текст слева, маленькая иконка у заголовка, кнопки как в остальном приложении */
.modal.cf-modal{max-width:460px;padding:24px 26px 22px;border-radius:20px;text-align:left;align-items:stretch;overflow:visible}
.cf-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.cf-ico{width:auto;height:auto;margin:0;background:none;border-radius:0;animation:none!important;display:inline-flex;color:var(--crit);flex:none}
.cf-ico::after{display:none!important}
.cf-ico .ico{width:20px;height:20px;stroke-width:2.2}
.cf-modal h3{font-size:17px;font-weight:700;margin:0}
.cf-modal p{margin:0 0 22px;max-width:none;font-size:13.5px;line-height:1.55;color:var(--muted);text-align:left}
.cf-acts{display:flex;justify-content:flex-end;gap:8px;width:auto}
.cf-acts .btn{height:33px;padding:0 15px;border-radius:8px;font-size:12.5px;font-weight:600;justify-content:center}
.cf-acts .btn:not(.cf-del):not(.btn--edit){background:var(--surface-3)}
:root .cf-acts .cf-del{background:var(--crit-soft)!important;border-color:transparent!important;color:var(--crit)!important;box-shadow:none;transition:background .15s,color .15s,transform .15s,box-shadow .2s}
:root .cf-acts .cf-del:hover{background:linear-gradient(180deg,color-mix(in srgb,var(--crit) 80%,#fff),var(--crit))!important;color:#fff!important;transform:none;box-shadow:0 10px 20px -10px rgba(255,80,80,.85),inset 0 1px 0 rgba(255,255,255,.25)}
:root .cf-acts .cf-del .ico{width:15px;height:15px;transition:transform .2s}
:root .cf-acts .cf-del:hover .ico{transform:scale(1.1)}
:root .cf-acts .cf-del:active{transform:scale(.97)}
:root .cf-acts .cf-cancel:hover{color:var(--accent-fg)}
:root .cf-acts .cf-cancel:hover{background:var(--surface-2);color:var(--text);box-shadow:none}
:root .cf-acts .cf-cancel:hover .ico{color:var(--muted);transform:none}
:root[data-theme="light"] .cf-acts .cf-cancel:hover{background:#e0e0e0}
:root .cf-acts .cf-cancel{background:var(--surface-3);border-color:transparent;color:var(--text)}
:root .cf-acts .cf-cancel:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:var(--accent-fg);box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
:root .cf-acts .cf-cancel:active{transform:scale(.97)}
:root[data-theme="light"] .cf-acts .cf-cancel{background:#ececec}
/* нейтральные (не опасные) подтверждения в cf-модалках — тот же приём, что cf-del, но акцентным
   цветом вместо красного (иначе .btn--primary тут перебивается общим .cf-acts .btn:not(...) выше) */
:root .cf-acts .btn--primary{background:var(--accent-soft)!important;border-color:transparent!important;color:var(--accent)!important;box-shadow:none;transition:background .15s,color .15s,transform .15s,box-shadow .2s}
:root .cf-acts .btn--primary:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none;box-shadow:0 10px 20px -10px rgba(255,93,0,.85),inset 0 1px 0 rgba(255,255,255,.25)}
:root .cf-acts .btn--primary .ico{width:15px;height:15px;transition:transform .2s}
:root .cf-acts .btn--primary:hover .ico{transform:scale(1.1)}
:root .cf-acts .btn--primary:active{transform:scale(.97)}
:root[data-theme="light"] .cf-acts .cf-cancel:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}

/* ===== модалки добавления / редактирования: единая оболочка ===== */
:root .modal:not(.wm):not(.cf-modal){border:0;border-radius:22px;box-shadow:0 40px 90px -24px rgba(0,0,0,.8),0 0 0 1px var(--border-strong)}
:root .modal:not(.wm):not(.cf-modal) .modal-head{padding:22px 26px 6px;border-bottom:0;gap:12px}
:root .modal:not(.wm):not(.cf-modal) .modal-head h3{font-size:19px;font-weight:700;letter-spacing:-.01em}
:root .modal:not(.wm):not(.cf-modal) .modal-head .m{font-size:12.5px;color:var(--muted)}
:root .modal:not(.wm):not(.cf-modal) .modal-head .iconbtn{width:34px;height:34px;border-radius:50%;border:0!important;background:var(--surface-2);color:var(--text-2);transition:background .15s,color .15s,transform .2s}
:root .modal:not(.wm):not(.cf-modal) .modal-head .iconbtn:hover{background:var(--surface-3);color:var(--text);transform:rotate(90deg)}
:root .modal:not(.wm):not(.cf-modal) .modal-body{padding:14px 26px 24px;gap:16px}
:root .modal:not(.wm):not(.cf-modal) .kb-f,:root .modal:not(.wm):not(.cf-modal) .wz-f{gap:7px;font-size:12.5px;font-weight:600;color:var(--text-2)}
:root .modal:not(.wm):not(.cf-modal) .kb-grid2{gap:14px}
/* низ: отмена как «Редактировать», основное действие — оранжевый градиент.
   Раньше тут же обнулялись padding-top/border у .pay-modal-foot (margin-top:8px;padding-top:0;
   border:0) — это осталось от ДО-sticky версии подвала (просто следующий элемент в потоке,
   без разделителя). Когда подвал стал sticky (см. `.modal.pay-md:not(.cf-modal) .pay-modal-foot`
   выше, там уже задан padding-top:12px и border-top), это старое правило оказалось СПЕЦИФИЧНЕЕ
   (:not(.wm):not(.cf-modal) даёт больше веса, чем .pay-md:not(.cf-modal)) и тихо перебивало его
   обратно в padding-top:0/border:0 — плавающий подвал становился без верхнего отступа и без
   разделительной линии, визуально «слипался» с контентом (жаловались на телефоне: подвал
   выглядит слишком тонким/маленьким и будто «съезжает» при скролле — на самом деле не съезжал
   {проверено}, просто не было чёткой границы, чтобы это увидеть). Убрал обнуление — теперь
   ничего не перебивает sticky-версию. */
:root .modal:not(.wm):not(.cf-modal) .pay-modal-foot .btn:not(.btn--primary):not(.btn--crit):not(.btn--dcrit),
:root .modal:not(.wm):not(.cf-modal) .modal-body > div[style*="justify-content"] .btn:not(.btn--primary):not(.btn--crit):not(.btn--sm){background:var(--surface-3);border-color:transparent;color:var(--text);box-shadow:none;transition:background .15s,color .15s,box-shadow .2s,transform .15s}
:root .modal:not(.wm):not(.cf-modal) .pay-modal-foot .btn:not(.btn--primary):not(.btn--crit):not(.btn--dcrit):hover,
:root .modal:not(.wm):not(.cf-modal) .modal-body > div[style*="justify-content"] .btn:not(.btn--primary):not(.btn--crit):not(.btn--sm):hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:var(--accent-fg);box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
:root .modal:not(.wm):not(.cf-modal) .btn--primary{background:linear-gradient(180deg,#ff7a2e,#ff5d00);border-color:transparent;color:#fff;box-shadow:0 12px 24px -10px rgba(255,93,0,.75),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .18s cubic-bezier(.16,1,.3,1),box-shadow .2s}
:root .modal:not(.wm):not(.cf-modal) .btn--primary:hover{transform:translateY(-1px);box-shadow:0 16px 28px -10px rgba(255,93,0,.9),inset 0 1px 0 rgba(255,255,255,.3)}
:root .modal:not(.wm):not(.cf-modal) .btn--primary:active{transform:scale(.97)}
:root[data-theme="light"] .modal:not(.wm):not(.cf-modal){box-shadow:0 40px 90px -30px rgba(0,0,0,.35),0 0 0 1px #e6e6e6}
:root[data-theme="light"] .modal:not(.wm):not(.cf-modal) .modal-head .iconbtn{background:#f1f1f1}
:root[data-theme="light"] .modal:not(.wm):not(.cf-modal) .pay-modal-foot .btn:not(.btn--primary):not(.btn--crit):not(.btn--dcrit){background:#ececec}

/* скроллбар: тонкий, полупрозрачный, оранжевый при использовании */
*{scrollbar-width:auto;scrollbar-color:auto}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text) 16%,transparent);border-radius:999px;border:4px solid transparent;background-clip:padding-box;min-height:44px;transition:background .15s}
:hover::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text) 24%,transparent);background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--text) 42%,transparent);background-clip:padding-box;border-width:3px}
::-webkit-scrollbar-thumb:active{background:var(--accent);background-clip:padding-box;border-width:3px}
::-webkit-scrollbar-corner{background:transparent}
.sidebar .nav::-webkit-scrollbar{width:10px}
.modal::-webkit-scrollbar,.dd-menu::-webkit-scrollbar{width:10px}

/* скролл внутри модалки: только тело (шапка/подвал зафиксированы), не заходит на скругления.
   Раньше сразу следом шёл блок, откатывающий это обратно на «скроллится вся модалка целиком»
   (видимо, недокоммиченный эксперимент из прошлой сессии) — из-за него шапки/кнопки везде
   уезжали при скролле. Убрал откат — теперь это работает так же, как в модалках Зарплаты/
   Расходы/Команды, во всех модалках сайта разом (Инвентарь/Локации/Подрядчики включая). */
:root .modal:not(.cf-modal){overflow:hidden;display:flex;flex-direction:column}
:root .modal:not(.cf-modal) > .modal-head,:root .modal:not(.cf-modal) > .wm-head{flex:none}
:root .modal:not(.cf-modal) > .modal-body,:root .modal:not(.cf-modal) > .wm-body{overflow-y:auto;min-height:0;flex:1 1 auto;scrollbar-gutter:stable;overscroll-behavior-y:contain}
/* .wm-body сама тоже flex-column (карточка сотрудника/клиента/проекта: вкладки .tp-tabs +
   контент .tp-body внутри неё) — без этого её дети .tp-tabs/.tp-body по умолчанию
   flex-shrink:1 и СЖИМАЛИСЬ, когда контент вкладки не помещался в отведённую высоту, а
   .tp-phl{overflow:hidden} тихо обрезал «сжатые» строки таблицы — они были в DOM, но не
   видны ни на десктопе, ни тем более на телефоне. Запрещаем сжатие — скроллится только
   сама .wm-body (см. правило выше), вкладки внутри всегда рисуются в полный рост. */
:root .wm-body > .tp-tabs,:root .wm-body > .tp-body{flex:none}
.modal-body::-webkit-scrollbar-track,.wm-body::-webkit-scrollbar-track{margin:6px 0 16px}
.modal-body::-webkit-scrollbar,.wm-body::-webkit-scrollbar{width:12px}

/* закругления как у кнопки «Добавить документ» */
:root .topbar .search,:root .main[data-view="knowledge"] .kb-search{border-radius:8px}
:root .topbar .dd-trigger,:root .topbar .iconbtn:not(.menu-toggle){border-radius:8px}
:root .set-bar .btn{border-radius:8px}
:root .set-bar{border-radius:18px;padding:10px 10px 10px 22px}
@media(max-width:640px){:root .set-bar{border-radius:18px}}
:root .topbar .search,:root .main[data-view="knowledge"] .kb-search{border-radius:999px}

/* уведомления v2: стеклянная карточка сверху, плавное появление и уход */
.toast-host{top:78px;bottom:auto;left:50%;transform:translateX(-50%);gap:10px;align-items:center}
.toast{position:relative;overflow:hidden;display:flex;align-items:center;gap:12px;min-width:250px;max-width:min(440px,90vw);padding:11px 20px 11px 12px;border-radius:14px;text-align:left;
  background:color-mix(in srgb,var(--surface) 86%,transparent);color:var(--text);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);
  box-shadow:0 0 0 1px var(--border-strong),0 22px 44px -16px rgba(0,0,0,.75);font-size:13.5px;font-weight:600;
  opacity:0;transform:translateY(-18px) scale(.94);transition:opacity .35s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1.2,.3,1)}
.toast.in{opacity:1;transform:none}
.toast.out{opacity:0;transform:translateY(-12px) scale(.96);transition:opacity .3s ease,transform .35s cubic-bezier(.4,0,1,1)}
.toast-ic{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}
.toast-ic .ico{width:16px;height:16px;stroke-width:2.4}
.toast--ok .toast-ic{background:var(--accent);color:var(--accent-fg);box-shadow:0 8px 16px -8px rgba(255,93,0,.8)}
.toast--err .toast-ic{background:var(--crit-soft);color:var(--crit)}
.toast--info .toast-ic{background:var(--surface-3);color:var(--text-2)}
.toast-bar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--accent);opacity:.8;transform-origin:left;transform:scaleX(1)}
.toast.in .toast-bar{animation:toastbar 3.2s linear forwards}
.toast--err .toast-bar{background:var(--crit)}
.toast--info .toast-bar{background:var(--muted)}
@keyframes toastbar{to{transform:scaleX(0)}}
:root[data-theme="light"] .toast{background:rgba(255,255,255,.9);box-shadow:0 0 0 1px #e6e6e6,0 22px 44px -18px rgba(0,0,0,.3)}
:root[data-theme="light"] .toast--info .toast-ic{background:#ececec}
@media(prefers-reduced-motion:reduce){.toast,.toast.in .toast-bar{transition:none!important;animation:none!important}}
/* виджет сохранения: кнопки и точка */
.set-bar > span{gap:16px}
.set-dot{margin-right:2px}
:root .set-bar .set-cancel{background:var(--surface-3);border-color:transparent;color:var(--text);transition:background .15s,color .15s,box-shadow .2s,transform .15s}
:root .set-bar .set-cancel:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:var(--accent-fg);box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
:root .set-bar .set-cancel:active{transform:scale(.96)}
:root .set-bar .set-save{background:linear-gradient(180deg,#ff7a2e,#ff5d00);border-color:transparent;color:#fff;box-shadow:0 12px 24px -10px rgba(255,93,0,.75),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .18s cubic-bezier(.16,1,.3,1),box-shadow .2s}
:root .set-bar .set-save:hover{transform:translateY(-2px);box-shadow:0 18px 30px -10px rgba(255,93,0,.9),inset 0 1px 0 rgba(255,255,255,.3)}
:root .set-bar .set-save:active{transform:scale(.96)}
:root .set-bar .set-save .ico{transition:transform .25s cubic-bezier(.16,1.4,.3,1)}
:root .set-bar .set-save:hover .ico{transform:scale(1.2) rotate(-8deg)}
:root[data-theme="light"] .set-bar .set-cancel{background:#ececec}
.toast-host{top:auto;bottom:88px}
.toast{transform:translateY(18px) scale(.94)}
.toast.out{transform:translateY(12px) scale(.96)}
.toast.in{transform:none}

/* уведомления v3: как виджет сохранения, на его месте внизу */
.toast-host{top:auto;bottom:18px;gap:8px}
.toast{min-width:0;gap:12px;padding:13px 22px 13px 18px;border-radius:18px;background:color-mix(in srgb,var(--surface) 82%,transparent);
  box-shadow:0 0 0 1px var(--border-strong),0 22px 44px -14px rgba(0,0,0,.75),0 0 30px -8px rgba(255,93,0,.3);
  transform:translateY(24px) scale(.92);transition:opacity .4s cubic-bezier(.16,1,.3,1),transform .5s cubic-bezier(.16,1.2,.3,1)}
.toast.in{transform:none}
.toast.out{transform:translateY(14px) scale(.96);transition:opacity .28s ease,transform .32s ease}
.toast-ic{width:auto;height:auto;background:none!important;box-shadow:none!important;border-radius:0;display:inline-flex;color:var(--accent)}
.toast--err .toast-ic{color:var(--crit)}
.toast--info .toast-ic{color:var(--muted)}
.toast--ok .toast-ic{color:var(--accent)}
.toast-ic .ico{width:18px;height:18px;stroke-width:2.6}
.toast-bar{display:none}
.toast--err{box-shadow:0 0 0 1px var(--border-strong),0 22px 44px -14px rgba(0,0,0,.75),0 0 30px -8px rgba(255,80,80,.35)}
.toast--info{box-shadow:0 0 0 1px var(--border-strong),0 22px 44px -14px rgba(0,0,0,.75)}
:root[data-theme="light"] .toast{background:rgba(255,255,255,.9)}
/* светлая тема: «Отменить» в виджете тоже оранжевая при наведении */
:root[data-theme="light"] .set-bar .set-cancel:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
@media(max-width:640px){
  /* виджет «Несохранённые изменения» — меньше воздуха между текстом и кнопками */
  .set-bar{gap:10px}
  .set-bar > span{gap:10px}
  /* тосты «Настройки сохранены» / «Изменения отменены» — не переносить текст на вторую строку */
  .toast-tx{white-space:nowrap}
}

/* шапка v3: закругления вернул, кнопки как «Отменить», список вида переделан */
:root .topbar .dd-trigger{border-radius:999px}
:root .topbar .iconbtn:not(.menu-toggle){border-radius:50%;background:var(--surface-3);border-color:transparent;color:var(--text)}
:root .topbar .iconbtn:not(.menu-toggle):hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);border-color:transparent;color:#fff;box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25);transform:translateY(-1px)}
:root .topbar .iconbtn:not(.menu-toggle):active{transform:scale(.94)}
:root .topbar .iconbtn:not(.menu-toggle):hover .ico{color:#fff!important}
:root .topbar .iconbtn .dot{border-color:var(--surface-3)}
:root .topbar .iconbtn:not(.menu-toggle):hover .dot{background:#fff;border-color:transparent;box-shadow:none}
:root[data-theme="light"] .topbar .iconbtn:not(.menu-toggle){background:#ececec}
:root[data-theme="light"] .topbar .iconbtn:not(.menu-toggle):hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}
/* список выбора вида */
.topbar .dd-menu{min-width:210px;padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 90%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.topbar .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.topbar .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
.topbar .dd-opt.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)}
.topbar .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .topbar .dd-menu{background:rgba(255,255,255,.95);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .topbar .dd-opt:hover{background:#f1f1f1}

/* тема и уведомления: в покое белый фон и обводка */
:root .topbar .iconbtn:not(.menu-toggle){background:var(--surface-3);border:1px solid transparent;color:var(--text)}
:root .topbar .iconbtn:not(.menu-toggle) .ico{color:var(--text)}
:root .topbar .iconbtn .dot{border-color:var(--surface-3)}
:root[data-theme="light"] .topbar .iconbtn:not(.menu-toggle) .ico{color:#111}
:root[data-theme="light"] .topbar .iconbtn .dot{border-color:#fff}
:root .topbar .iconbtn:not(.menu-toggle):hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);border-color:transparent}
:root .topbar .iconbtn:not(.menu-toggle):hover .ico{color:#fff!important}
:root .topbar .iconbtn:not(.menu-toggle):hover .dot{background:#fff;border-color:transparent}
:root[data-theme="light"] .topbar .iconbtn:not(.menu-toggle){background:#fff;border-color:var(--field-border);color:#111}
:root[data-theme="light"] .topbar .iconbtn:not(.menu-toggle):hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);border-color:transparent}

/* список вида: зазоры между пунктами, у активного нет реакции на наведение */
.topbar .dd-opt.on,.topbar .dd-opt.on:hover{transform:none;background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)}
.topbar .dd-opt + .dd-opt{margin-top:4px}
.topbar .dd-opt + .dd-opt{margin-top:1px}
:root .topbar .dd-menu .dd-opt.on,:root .topbar .dd-menu .dd-opt.on:hover,:root .topbar .dd-menu .dd-opt.on:focus{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.topbar .dd-opt + .dd-opt{margin-top:2px}

/* модалка документа: поля и кнопки */
.kb-title{height:40px;font-size:14px;font-weight:700}
.kb-cats{display:flex;flex-wrap:wrap;gap:8px}
.kb-catp{border:0;font:inherit;font-size:12.5px;font-weight:600;padding:8px 14px;border-radius:8px;cursor:pointer;background:var(--surface-3);color:var(--text-2);transition:background .15s,color .15s,transform .15s,box-shadow .2s}
.kb-catp:hover{color:var(--text);transform:translateY(-1px)}
.kb-catp.on,.kb-catp.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:none;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
.kb-body{min-height:110px;padding:11px 13px;line-height:1.5;resize:vertical;height:auto}
:root .kb-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:100%;padding:18px 16px;border:1.5px dashed var(--field-border);border-radius:12px;background:var(--field);color:var(--text);cursor:pointer;height:auto;text-align:center;transition:border-color .15s,background .15s,transform .15s}
:root .kb-drop .ico{width:20px;height:20px;color:var(--accent);margin-bottom:2px}
:root .kb-drop b{font-size:13px;font-weight:700}
:root .kb-drop em{font-style:normal;font-size:12px;font-weight:500;color:var(--muted)}
:root .kb-drop:hover,:root .kb-drop.drag{border-color:var(--accent);background:var(--accent-soft)}
:root .kb-drop:active{transform:scale(.99)}
.kb-mfoot{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}
:root .kb-fname{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:var(--surface-3);border:0;margin-top:2px}
:root[data-theme="light"] .kb-catp:not(.on){background:#ececec}
:root .kb-fname[hidden]{display:none}

/* Название и Описание: мягкие заливные поля без рамки */
.kb-title,.kb-body{width:100%;border:0;border-radius:12px;background:var(--surface-3);color:var(--text);font:inherit;outline:0;box-shadow:inset 0 0 0 1.5px transparent;transition:box-shadow .18s,background .18s}
.kb-title{height:46px;padding:0 16px;font-size:15px;font-weight:700}
.kb-body{min-height:120px;padding:13px 16px;font-size:13.5px;font-weight:500;line-height:1.55;resize:vertical}
.kb-title::placeholder,.kb-body::placeholder{color:var(--muted);font-weight:500}
.kb-title:hover,.kb-body:hover{background:var(--surface-2)}
.kb-title:focus,.kb-body:focus{background:var(--surface);box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)}
.kb-title.bad{box-shadow:inset 0 0 0 1.5px var(--crit);background:var(--crit-soft)}
:root[data-theme="light"] .kb-title,:root[data-theme="light"] .kb-body{background:#f1f1f1}
:root[data-theme="light"] .kb-title:focus,:root[data-theme="light"] .kb-body:focus{background:#fff}

/* модалка «Новый документ»/«Редактировать документ» — плотнее по вертикали, чтобы помещалась
   на экран без внутреннего скролла на обычных ноутбучных высотах окна (~650–700px).
   Специфичность как у :root .modal:not(.wm):not(.cf-modal) — иначе те правила выше по каскаду. */
:root .modal.kb-doc-modal:not(.wm):not(.cf-modal) .modal-head{padding:14px 20px 6px}
:root .modal.kb-doc-modal:not(.wm):not(.cf-modal) .modal-body{padding:10px 20px 16px;gap:10px}
:root .modal.kb-doc-modal:not(.wm):not(.cf-modal) .kb-f{gap:5px}
.kb-doc-modal .kb-title{height:38px}
.kb-doc-modal .kb-body{min-height:0;padding:9px 12px}
:root .kb-doc-modal .kb-drop{padding:10px 14px}
.kb-doc-modal .kb-mfoot{margin-top:0}
/* добавление категории */
.kb-catadd{background:transparent!important;box-shadow:inset 0 0 0 1.5px var(--field-border)!important;color:var(--muted);display:inline-flex;align-items:center;gap:6px}
.kb-catadd .ico{width:14px;height:14px}
.kb-catadd:hover{color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent)!important;transform:none}
.kb-catnew{height:34px;padding:0 14px;border:0;border-radius:8px;background:var(--surface);color:var(--text);font:inherit;font-size:12.5px;font-weight:600;outline:0;width:170px;box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft);animation:catin .25s cubic-bezier(.16,1,.3,1)}
@keyframes catin{from{width:60px;opacity:.4}to{width:170px;opacity:1}}

.kb-catbox{display:inline-flex;align-items:center;gap:6px;animation:catin .25s cubic-bezier(.16,1,.3,1)}
.kb-catbox .kb-catnew{animation:none}
.kb-catok{width:34px;height:34px;border:0;border-radius:8px;display:grid;place-items:center;cursor:pointer;background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7);transition:transform .15s}
.kb-catok:hover{transform:translateY(-1px)}
.kb-catok:active{transform:scale(.94)}
.kb-catok .ico{width:16px;height:16px;stroke-width:2.6}

.kb-catbox{animation:none!important}
.kb-catbox .kb-catnew{animation:none!important;width:170px}
.kb-catnewchip{animation:catpop .32s cubic-bezier(.16,1.3,.3,1)}
@keyframes catpop{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}

/* команда: пьедестал */
.tm-podium{position:relative;padding:52px 18px 24px;isolation:isolate}
.tm-podium::before{content:"";position:absolute;left:50%;top:30px;width:520px;height:260px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(255,93,0,.28),transparent);filter:blur(30px);z-index:-1;pointer-events:none}
.tm-podium-col{animation:podrise .7s cubic-bezier(.16,1.1,.3,1) both}
.tm-podium-col.p1{animation-delay:.12s}.tm-podium-col.p2{animation-delay:.02s}.tm-podium-col.p3{animation-delay:.22s}
@keyframes podrise{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
.tm-podium-av{box-shadow:0 0 0 3px var(--surface),0 0 0 5px color-mix(in srgb,var(--text) 22%,transparent)}
.tm-podium-col.p1 .tm-podium-av{box-shadow:0 0 0 3px var(--surface),0 0 0 5px var(--accent),0 14px 30px -8px rgba(255,93,0,.7)}
.tm-podium-xp{background:var(--accent-soft);padding:3px 11px;border-radius:999px;font-size:13px}
.tm-podium-name{font-size:14.5px;font-weight:700}
.tm-podium-block{border-radius:16px 16px 8px 8px;box-shadow:0 18px 30px -14px rgba(255,93,0,.55),inset 0 1px 0 rgba(255,255,255,.35)}
.tm-podium-col.p1 .tm-podium-block{min-height:124px}
.tm-podium-col.p2 .tm-podium-block{min-height:92px}
.tm-podium-col.p3 .tm-podium-block{min-height:72px}
.tm-podium-rank{font-size:30px}
@media(prefers-reduced-motion:reduce){.tm-podium-col{animation:none}}
/* заголовки департаментов */
.tm-dept-h.wz-s1-lbl{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);gap:10px;padding-bottom:2px}
.tm-podium-crown{top:-42px}

/* команда: панель как в шапке и «Базе знаний» */
:root .main[data-view="team"] .kb-search{height:36px;border-radius:999px;padding:0 14px;gap:10px;background:var(--field);border:1px solid var(--field-border);transition:border-color .15s,background .15s,box-shadow .2s}
:root .main[data-view="team"] .kb-search .ico{width:16px;height:16px}
:root .main[data-view="team"] .kb-search:hover{background:var(--surface);border-color:var(--border-strong);box-shadow:none}
:root .main[data-view="team"] .kb-search:focus-within{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft),0 14px 28px -14px rgba(0,0,0,.6)}
:root .main[data-view="team"] .kb-search:focus-within .ico{color:var(--accent)}
:root .main[data-view="team"] .kb-search input{height:34px}
:root .main[data-view="team"] #teamDeptFilter .dd-trigger{height:36px;border-radius:999px;padding:0 12px 0 16px;gap:8px;font-weight:700}
:root .main[data-view="team"] #teamDeptFilter.open .dd-trigger{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.main[data-view="team"] .dd-menu{min-width:220px;padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 90%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.main[data-view="team"] .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.main[data-view="team"] .dd-opt + .dd-opt{margin-top:2px}
.main[data-view="team"] .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .main[data-view="team"] .dd-menu .dd-opt.on,:root .main[data-view="team"] .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.main[data-view="team"] .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .main[data-view="team"] .dd-menu{background:rgba(255,255,255,.95);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .main[data-view="team"] .dd-opt:hover{background:#f1f1f1}
:root .main[data-view="team"] .tm-dept-h.wz-s1-lbl{font-family:var(--font-display);font-size:16px;font-weight:600;letter-spacing:-.01em;text-transform:none;line-height:1.2;color:var(--text)}

/* форма сотрудника: в стиле формы документа */
:root .tm-form-modal input.in,:root .tm-form-modal .dd-trigger,:root .tm-form-modal .tm-combo input{height:42px;border:0!important;border-radius:12px;background:var(--surface-3)!important;color:var(--text);font-size:13.5px;font-weight:600;padding:0 16px;box-shadow:inset 0 0 0 1.5px transparent;transition:box-shadow .18s,background .18s}
:root .tm-form-modal .dd-trigger{padding:0 14px 0 16px}
:root .tm-form-modal input.in::placeholder{color:var(--muted);font-weight:500}
:root .tm-form-modal input.in:hover,:root .tm-form-modal .dd:not(.open) .dd-trigger:hover{background:var(--surface-2)!important;box-shadow:inset 0 0 0 1.5px transparent}
:root .tm-form-modal input.in:focus,:root .tm-form-modal .dd.open .dd-trigger{background:var(--surface)!important;box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)}
:root .tm-form-modal input.in.bad{box-shadow:inset 0 0 0 1.5px var(--crit);background:var(--crit-soft)!important}
:root[data-theme="light"] .tm-form-modal input.in,:root[data-theme="light"] .tm-form-modal .dd-trigger{background:#f1f1f1!important}
:root[data-theme="light"] .tm-form-modal input.in:focus,:root[data-theme="light"] .tm-form-modal .dd.open .dd-trigger{background:#fff!important}
.tmf-sec{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:6px 0 -6px}
:root .tm-form-modal .tmf-photo-row{display:flex;align-items:center;gap:16px;padding:12px 14px;border-radius:14px;background:var(--surface-3)}
:root .tm-form-modal .tmf-photo-av{width:56px;height:56px;border-radius:16px;flex:none}
:root[data-theme="light"] .tm-form-modal .tmf-photo-row{background:#f1f1f1}
:root .tm-form-modal .tmf-photo-row .btn--edit{background:var(--surface-2)}
:root[data-theme="light"] .tm-form-modal .tmf-photo-row .btn--edit{background:#e4e4e4}
:root .tm-form-modal .tmf-photo-row .btn--edit:hover,:root[data-theme="light"] .tm-form-modal .tmf-photo-row .btn--edit:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:var(--accent-fg);box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}

/* кебабы (меню «⋮») */
:root .tm-kb{width:32px;height:32px;border-radius:8px;border:0!important;background:transparent;color:var(--text-2);transition:background .15s,color .15s,transform .15s,box-shadow .2s}
:root .tm-kb .ico{transition:transform .25s cubic-bezier(.16,1,.3,1)}
:root .dd:not(.open) .tm-kb:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
:root .dd:not(.open) .tm-kb:hover .ico{transform:scale(1.1)}
:root .tm-kb:active{transform:scale(.92)}
:root .dd.open .tm-kb{background:var(--accent-soft);color:var(--accent);box-shadow:none}
.tm-kebab .dd-menu{min-width:210px;padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.tm-kebab .dd-opt{height:38px;border-radius:10px;padding:0 12px;gap:10px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s,box-shadow .2s}
.tm-kebab .dd-opt + .dd-opt{margin-top:2px}
.tm-kebab .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
.tm-kebab .dd-opt svg{opacity:.85;transition:transform .2s,color .15s}
.tm-kebab .dd-opt:hover svg{color:var(--accent);transform:scale(1.1)}
.tm-kebab .dd-opt.del{color:var(--crit)}
.tm-kebab .dd-opt.del:hover{background:linear-gradient(180deg,color-mix(in srgb,var(--crit) 80%,#fff),var(--crit));color:#fff;box-shadow:0 8px 16px -8px rgba(255,80,80,.8)}
.tm-kebab .dd-opt.del:hover svg{color:#fff}
:root[data-theme="light"] .tm-kebab .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .tm-kebab .dd-opt:hover{background:#f1f1f1}
:root[data-theme="light"] .tm-kebab .dd-opt.del:hover{background:linear-gradient(180deg,color-mix(in srgb,var(--crit) 80%,#fff),var(--crit))}

/* открытое меню кебаба перекрывает соседние карточки и не просвечивает */
:has(> .tm-kebab .dd-menu),.tm-card:has(.dd.open),.pj-card:has(.dd.open),.card:has(.dd.open),.act-card:has(.dd.open),.pay-sh-row:has(.dd.open),.att-table tr:has(.dd.open){position:relative}
.tm-card:has(.dd.open),.pj-card:has(.dd.open),.card:has(.dd.open),.act-card:has(.dd.open),.gr-card:has(.dd.open),.cl-card:has(.dd.open){z-index:60}
.tm-kebab.open,.tm-kebab .dd.open{z-index:70}
.tm-kebab .dd-menu{background:var(--surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;z-index:80}
:root[data-theme="light"] .tm-kebab .dd-menu{background:#fff!important}

/* карточка сотрудника/клиента/проекта (.tp-modal): размер модалки должен быть ОДИНАКОВЫМ
   на всех вкладках (раньше .modal был просто overflow-y:auto без фиксированной высоты —
   высота росла/падала под контент конкретной вкладки, модалка «прыгала» при переключении).
   Делаем .modal.tp-modal flex-колонкой с фиксированной высотой и overflow:hidden — шапка
   (.wm-head) и вкладки (.tp-tabs) не сжимаются (flex:none, см. правило для > .wm-head выше
   по файлу), а скроллится только .wm-body (flex:1 1 auto;min-height:0;overflow-y:auto —
   то же самое общее правило). */
.modal.tp-modal{max-width:920px;display:flex;flex-direction:column;height:min(640px,86vh);overflow:hidden}
.tp-modal .wm-head{align-items:center;gap:16px}
.tp-modal .wm-head .avatar{width:64px;height:64px;font-size:22px;flex:none}
.tp-tabs{flex-wrap:wrap;border-radius:14px;padding:4px}
.tp-tabs .proj-tab{padding:7px 14px}
.tp-body{display:flex;flex-direction:column;gap:18px;min-height:260px}
/* карточка сотрудника/клиента (.tp-modal): раньше все плашки — цифры KPI, «Контакты», «Работа» —
   были залиты одним и тем же surface-2, модалка читалась одним плоским пятном без иерархии,
   не так, как остальное приложение (там у KPI-цифр вообще нет фона — просто крупное число, как
   на Финансах/Инвентаре; у списков полей — простые строки с разделителем, как в ТЗ проекта).
   Цифры KPI — убираем плашку, делаем крупным числом без рамки. Разделы «Контакты»/«Работа» —
   тоже без заливки-контейнера; строки внутри (.tmm-row) уже были с тонкой границей сверху,
   этого достаточно для списка, обёртка не нужна. */
.tp-modal .wm-plates > .wm-plate{background:none;box-shadow:none;padding:0}
.tp-modal .wm-plates > .wm-plate .l{font-size:12.5px;font-weight:600;color:var(--muted)}
.tp-modal .wm-plates > .wm-plate .v{font-size:26px;font-weight:800;letter-spacing:-.02em}
.tp-modal .tp-two > .wm-plate{background:none;box-shadow:none;padding:0}
.tp-modal .tp-two > .wm-plate > .l{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);margin-bottom:2px}
.tp-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media(max-width:700px){.tp-two{grid-template-columns:minmax(0,1fr)}}
.tp-kv{border:0!important;padding:0!important;margin-top:8px;background:none!important}
.tp-list .wm-li{gap:14px}
.tp-r{text-align:right;flex:none;font-variant-numeric:tabular-nums}
.tp-r b{font-family:var(--font-display);font-size:14px}
.tp-off{color:var(--muted)!important;text-decoration:line-through}
.tp-neg{color:var(--crit)}
.tp-diff{display:flex;gap:34px;margin-top:8px}
.tp-diff div{display:flex;flex-direction:column}
.tp-diff b{font-family:var(--font-display);font-size:26px;font-weight:700;line-height:1.1}
.tp-diff span{font-size:12px;color:var(--muted)}
.tp-list .wm-li .m{font-size:12.5px}
:root[data-theme="light"] .tp-diff b{color:#111}

/* один шрифт везде: поля ввода, кнопки и элементы карты не используют системный Arial / Lucida */
:where(input,textarea,select,button,optgroup){font-family:inherit}
.leaflet-container,.leaflet-container a,.leaflet-control-zoom a,.leaflet-bar a{font-family:var(--font-body)!important}
.mono,.att-mono,.phone,.tp-kv .mono{font-family:var(--font-body)!important;font-variant-numeric:tabular-nums;letter-spacing:0}

.tp-namerow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.tp-namerow h3{margin:0!important}
.tp-xp{font-family:var(--font-display);font-size:15px;font-weight:800;color:var(--accent);background:var(--accent-soft);padding:3px 12px;border-radius:999px;letter-spacing:-.01em}
.tp-modal .wm-sub{margin-top:4px;font-size:13.5px}
.tp-unit{font-family:var(--font-display);font-size:14px;font-weight:700;color:var(--accent);letter-spacing:0;margin-left:2px}

/* карточка сотрудника: цифры крупнее, строки контактов от края до края */
.tp-modal .wm-plate .v{font-size:28px;font-weight:700}
/* .tp-vtext — плашка со статусом-словом («нет отметки», «вне зоны»), а не числом: тот же
   крупный жирный размер, что у чисел, на коротких словах читался слишком тяжело */
.tp-modal .wm-plate .v.tp-vtext{font-size:18px;font-weight:600}
.tp-modal .tp-unit{font-size:17px;margin-left:4px}
.tp-modal .tp-kv{margin:10px -14px -12px!important;border-radius:0!important}
.tp-modal .tp-kv .tmm-row{padding:11px 14px;font-size:13px;border-top:1px solid var(--border)}
.tp-modal .tp-kv .tmm-row:first-child{border-top:1px solid var(--border)}
.tp-modal .tp-kv .tmm-row b,.tp-modal .tp-kv .tmm-row .mono,.tp-modal .tp-kv .tmm-row a{font-size:13px}
/* .tp-two — две колонки «Контакты/Работа» (сотрудник) и «Контактное лицо/Контакты» (клиент) —
   каждая карточка широкая, а .tmm-row по умолчанию justify-content:space-between: короткие
   подпись+значение («Имя» / «Камола Юсупова») разъезжались на разные края строки с гигантским
   пустым разрывом посередине, и этот разрыв «прыгал» от строки к строке в зависимости от длины
   значения — выглядело хаотично. Подпись — фиксированная колонка слева, значение сразу за ней. */
.tp-modal .tp-two .tmm-row{justify-content:flex-start}
.tp-modal .tp-two .tmm-row > span:first-child{flex:0 0 128px}

/* карточка сотрудника → Зарплата: запросы и история выплат */
.tp-sec{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 0;min-height:33px}
.tp-sec .wz-s1-lbl{margin:0!important;display:inline-flex;align-items:center;gap:8px}
.tp-phl{padding:0!important;overflow:hidden}
.tp-ph{display:grid;grid-template-columns:minmax(0,1fr) 84px 104px 116px 34px;column-gap:14px;align-items:center;padding:10px 16px;font-size:12.5px;border-top:1px solid var(--border)}
.tp-ph:first-child{border-top:0}
.tp-ph--req{grid-template-columns:minmax(0,1fr) 84px 116px 120px}
.tp-ph--head{padding:9px 16px;font-size:12px;font-weight:600;color:var(--muted)}
.tp-ph .o{min-width:0;display:flex;flex-direction:column;gap:2px}
.tp-ph .o b{font-weight:600;font-size:13px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tp-ph .o span{font-size:12px;color:var(--muted)}
.tp-ph .d{color:var(--text);white-space:nowrap}
.tp-ph .a{text-align:right;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:600;font-size:13px;color:var(--text);white-space:nowrap}
.tp-ph .tp-ty{justify-self:start;margin-left:0}
.tp-ph--canc .a{text-decoration:line-through;color:var(--muted)}
.tp-ph--canc .o b,.tp-ph--canc .d{color:var(--muted)}
.tp-ph--canc .tp-ty{opacity:.45}
.tp-ph .pay-hist-x{justify-self:end}
.tp-ph-btn{justify-self:end}
@media(max-width:640px){.tp-ph{grid-template-columns:minmax(0,1fr) 96px 30px}.tp-ph .d,.tp-ph .tp-ty{display:none}.tp-ph--req{grid-template-columns:minmax(0,1fr) auto}.tp-ph--req .d,.tp-ph--req .a{display:none}}

/* модалки: без повторной анимации нижней модалки при стеке/закрытии верхней */
.modal-bg:has(~ .modal-bg),.modal-bg:has(~ .modal-bg) .modal,.mdl-still .modal-bg,.mdl-still .modal-bg .modal{animation:none!important}
/* внеплановая выплата */
.pf-plates{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pf-plates .wm-plate{padding:12px 14px;min-width:0}
.pf-plates .wm-plate .v{font-size:22px;font-weight:700;white-space:nowrap}
.pf-plates .wm-plate .v.pf-card{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:16px;font-weight:700;letter-spacing:0;padding-top:3px}
/* min-width:0 нужен на каждом уровне вложенности flex, не только на самом <input> — иначе
   на телефоне это поле раздувало всю модалку куда шире экрана (см. подробный комментарий
   у .cf-modal .modal-body ниже) */
.pf-amt{position:relative;display:flex;align-items:center;height:54px;min-width:0;border-radius:12px;background:var(--surface-3);box-shadow:inset 0 0 0 1.5px transparent;transition:box-shadow .18s,background .18s}
/* .cf-modal сам flex-column (см. первое правило .modal.cf-modal выше), а .modal-bg —
   display:grid;place-items:center БЕЗ явного grid-template-columns: неявная колонка по
   умолчанию растягивается под max-content самого широкого потомка, а не сжимается под
   экран. min-width:0 у every что flex-column должен явно «прокинуть» сжимаемость вниз —
   без него на телефоне widget вроде <input> (со своей стандартной шириной ~20 символов)
   раздувает всю цепочку родителей и модалку целиком шире вьюпорта. */
:root .cf-modal .modal-body{min-width:0}
:root .cf-modal .kb-f{min-width:0}
.pf-amt:hover{background:var(--surface-2)}
.pf-amt:focus-within{background:var(--surface);box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)}
.pf-amt input{flex:1;min-width:0;height:100%;border:0;background:transparent;outline:0;padding:0 8px 0 16px;font:inherit;font-size:24px;font-weight:700;letter-spacing:-.01em;color:var(--text);font-variant-numeric:tabular-nums}
.pf-amt input::placeholder{color:var(--muted);font-weight:600}
.pf-amt input.bad{color:var(--crit)}
.pf-amt:has(input.bad){box-shadow:inset 0 0 0 1.5px var(--crit);background:var(--crit-soft)}
.pf-amt em{font-style:normal;font-size:13px;font-weight:600;color:var(--muted);padding-right:16px}
.pf-chips{display:flex;gap:8px;margin-top:2px}
.pf-chips button{border:0;font:inherit;font-size:12.5px;font-weight:600;padding:6px 14px;border-radius:8px;cursor:pointer;background:var(--surface-3);color:var(--text);transition:background .15s,color .15s,box-shadow .2s,transform .15s}
.pf-chips button:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
.pf-chips button:active{transform:scale(.96)}
:root[data-theme="light"] .pf-amt,:root[data-theme="light"] .pf-chips button{background:#f1f1f1}
:root[data-theme="light"] .pf-amt:focus-within{background:#fff}
:root[data-theme="light"] .pf-chips button:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}

.pf-cardp{position:relative;cursor:pointer;transition:background .15s,box-shadow .2s,transform .15s}
.pf-cardp.off{cursor:default}
.pf-cardp:not(.off):hover{background:var(--surface-3);box-shadow:0 0 0 1.5px var(--accent)}
.pf-cardp:not(.off):active{transform:scale(.985)}
.pf-cp{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:26px;height:26px;border-radius:8px;color:var(--muted);transition:background .15s,color .15s}
.pf-cp .ico{width:15px;height:15px}
.pf-cardp:hover .pf-cp{color:var(--accent);background:var(--accent-soft)}
.pf-cardp.copied .pf-cp{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
/* выпадающие списки в модалках выплат — как в шапке и на «Команде» */
:root .pay-md .dd-trigger{height:36px;border-radius:999px;padding:0 12px 0 16px;gap:8px;font-size:12.5px;font-weight:700;background:var(--field);border:1px solid var(--field-border);color:var(--text);box-shadow:none}
:root .pay-md .dd-trigger:hover{background:var(--surface);border-color:var(--border-strong)}
:root .pay-md .dd.open .dd-trigger{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.pay-md .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.pay-md .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.pay-md .dd-opt + .dd-opt{margin-top:2px}
.pay-md .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .pay-md .dd-menu .dd-opt.on,:root .pay-md .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.pay-md .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .pay-md .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .pay-md .dd-opt:hover{background:#f1f1f1}

/* комментарий и поля модалок выплат — как в форме сотрудника */
:root .pay-md input.in{height:42px;border:0!important;border-radius:12px;background:var(--surface-3)!important;color:var(--text);font-size:13.5px;font-weight:600;padding:0 16px;box-shadow:inset 0 0 0 1.5px transparent;outline:0;transition:box-shadow .18s,background .18s}
:root .pay-md input.in::placeholder{color:var(--muted);font-weight:500}
:root .pay-md input.in:hover{background:var(--surface-2)!important}
:root .pay-md input.in:focus{background:var(--surface)!important;box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)}
:root .pay-md input.in.bad{box-shadow:inset 0 0 0 1.5px var(--crit);background:var(--crit-soft)!important}
:root[data-theme="light"] .pay-md input.in{background:#f1f1f1!important}
:root[data-theme="light"] .pay-md input.in:focus{background:#fff!important}
.pf-cp{top:8px;right:12px}

:root .pay-md .dd-trigger{height:42px;border:0!important;border-radius:12px;background:var(--surface-3)!important;color:var(--text);font-size:13.5px;font-weight:600;padding:0 16px;box-shadow:inset 0 0 0 1.5px transparent;transition:box-shadow .18s,background .18s}
:root .pay-md .dd:not(.open) .dd-trigger:hover{background:var(--surface-2)!important;border:0}
:root .pay-md .dd.open .dd-trigger{background:var(--surface)!important;box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)}
:root[data-theme="light"] .pay-md .dd-trigger{background:#f1f1f1!important}
:root[data-theme="light"] .pay-md .dd.open .dd-trigger{background:#fff!important}

/* «Отмена» / «Назад» / «Закрыть» в модалках выплат: при наведении оранжевые */
:root .pay-md .pay-modal-foot .btn:not(.btn--primary):not(.btn--crit):not(.btn--dcrit):hover,
:root[data-theme="light"] .pay-md .pay-modal-foot .btn:not(.btn--primary):not(.btn--crit):not(.btn--dcrit):hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)!important;border-color:transparent!important}

/* закрытие в карточке сотрудника — как в модалке добавления */
:root .wm-head .wm-x{width:34px;height:34px;border-radius:50%;border:0!important;box-shadow:none;background:var(--surface-2);color:var(--text-2);transition:background .15s,color .15s,transform .2s}
:root .wm-head .wm-x:hover{background:var(--surface-3);color:var(--text);transform:rotate(90deg)}
:root[data-theme="light"] .wm-head .wm-x{background:#f1f1f1}
:root[data-theme="light"] .wm-head .wm-x:hover{background:#e4e4e4}

/* вкладки карточки сотрудника: «плывущая» оранжевая плашка как в навбаре */
.tp-tabs{position:relative}
.tp-tabs .proj-tab{position:relative;z-index:1;transition:color .2s}
:root .tp-tabs .proj-tab.on{background:transparent;box-shadow:none;color:#fff}
.tp-pill{position:absolute;left:0;top:0;z-index:0;border-radius:999px;background:linear-gradient(180deg,#ff7a2e,#ff5d00);box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25);pointer-events:none;transition:transform .25s cubic-bezier(.4,0,.2,1),width .25s cubic-bezier(.4,0,.2,1),height .25s}
@media(prefers-reduced-motion:reduce){.tp-pill{transition:none}}

/* крестик отмены в истории выплат карточки сотрудника — анимация и цвет как у «Добавить сотрудника» */
:root .tp-ph .pay-hist-x{position:relative;overflow:hidden;width:30px;height:30px;border-radius:8px;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s,background .15s,color .15s}
:root .tp-ph .pay-hist-x svg{transition:transform .3s cubic-bezier(.16,1,.3,1)}
:root .tp-ph .pay-hist-x:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px -10px rgba(255,93,0,.9),inset 0 1px 0 rgba(255,255,255,.3)}
:root .tp-ph .pay-hist-x:hover svg{transform:rotate(90deg)}
:root .tp-ph .pay-hist-x:active{transform:translateY(0) scale(.94)}

.modal-bg[data-still]:not(.closing),.modal-bg[data-still]:not(.closing) .modal{animation:none!important}

/* входные анимации страницы (диаграммы, подиум) — только при переходе на страницу, не при открытии модалок и фильтрах */
.main[data-still] :is(.db-t,.db-ring,.db-mini i,.db-track .bar,.tm-podium-col,.wz-rise,.wz-fade){animation:none!important}

.pf-who{display:flex;align-items:center;justify-content:space-between;gap:12px}
/* значок справа (должность/тип) — white-space:nowrap, и при длинном тексте (например
   «Проджект-менеджер») не давал строке сжаться — это раздувало неявную grid-колонку
   .modal-bg (display:grid;place-items:center) шире экрана на телефоне. На узком экране
   переносим значок под имя вместо того, чтобы держать его в одну строку любой ценой. */
@media(max-width:480px){:root .pf-who{flex-wrap:wrap;row-gap:4px}:root .pf-who .badge{margin-left:auto}}
.pf-meta{margin:-6px 0 0}
/* «Запрос выплаты» теперь внутри .cf-modal — там у любого <p> низовой отступ 22px (для
   абзаца в диалогах подтверждения), а .pf-meta это короткая строка-подпись, не абзац —
   перебиваем тем же -6px/0, что и обычно, но с чуть большей специфичностью */
:root .cf-modal p.pf-meta{margin:-6px 0 0}
.pf-wide{grid-column:1/-1}
.pf-plates .wm-plate .s{white-space:normal}
.pf-amt input:disabled{opacity:.6}

.tp-ph--att{grid-template-columns:minmax(0,1fr) 90px 100px 110px 34px}
.tp-ph .tp-acts{display:flex;gap:8px;justify-content:flex-end}
.tp-ph .tp-warn{color:var(--warn)}
.tp-ph--req:has(.tp-acts){grid-template-columns:minmax(0,1fr) 84px auto}
/* на телефоне «Принять/Отклонить» (.tp-acts, запрос исключения по посещаемости) в одну
   колонку с причиной не помещались — кнопки наезжали на текст; на узком экране строка
   в один столбец, кнопки на отдельной строке под текстом */
@media(max-width:640px){.tp-ph--req:has(.tp-acts){grid-template-columns:1fr;row-gap:6px}.tp-ph--req .tp-acts{justify-content:flex-start}}
@media(max-width:640px){.tp-ph--att{grid-template-columns:minmax(0,1fr) auto 30px}.tp-ph--att > span:nth-child(2),.tp-ph--att > span:nth-child(3){display:none}}
.tp-ph .tp-none{color:var(--muted);text-decoration:none}

.tp-ph--bp{grid-template-columns:minmax(0,1fr) 84px 116px 34px}
/* на телефоне 84+116+34px фиксированных колонок почти не оставляли места под «Основание» —
   первая (1fr) колонка схлопывалась в 0 (было видно на карточке сотрудника, вкладка
   «Штрафы и бонусы»); прячем дату, оставляя только причину/сумму/крестик */
@media(max-width:640px){.tp-ph--bp{grid-template-columns:minmax(0,1fr) auto 30px}.tp-ph--bp > span:nth-child(2){display:none}}
.tp-ph .o .cl{font-size:12px;color:var(--muted);white-space:normal}

.tp-ph--exp{grid-template-columns:minmax(0,1fr) 78px 116px 104px 190px}
.tp-ph--exp .tp-ex-act{display:flex;justify-content:flex-end}
@media(max-width:760px){.tp-ph--exp{grid-template-columns:minmax(0,1fr) 96px}.tp-ph--exp > span:nth-child(2),.tp-ph--exp > span:nth-child(3){display:none}.tp-ph--exp .tp-ex-act{grid-column:1/-1;justify-content:flex-start}}

/* карточка клиента → «Проекты» (та же строка-компонент, что и в карточке сотрудника) */
.tp-ph--cvpj{grid-template-columns:minmax(0,1fr) 100px 110px 96px;cursor:pointer;transition:background .14s}
.tp-ph--cvpj.tp-ph--head{cursor:default}
.tp-ph--cvpj:not(.tp-ph--head):hover{background:var(--surface-3)}
.tp-ph--cvpj .tp-ex-act{display:flex;justify-content:flex-end}
@media(max-width:760px){.tp-ph--cvpj{grid-template-columns:minmax(0,1fr) 96px}.tp-ph--cvpj > span:nth-child(2),.tp-ph--cvpj > span:nth-child(3){display:none}.tp-ph--cvpj .tp-ex-act{grid-column:1/-1;justify-content:flex-start}}

/* «Добавить расход»: позиции без бирюзовой плашки */
:root .exq-newmodal .subcard.exq-newitem{background:none;border:0;box-shadow:none;padding:0;border-radius:0}
:root .exq-newmodal .exq-newitems{gap:16px}
:root .exq-newmodal .exq-newitem + .exq-newitem{padding-top:16px;border-top:1px solid var(--border)}
:root .exq-newmodal .exq-newitems.solo .exq-newitem-head{display:none}
:root .exq-newmodal .exq-newitem-head{margin-bottom:12px}
:root .exq-newmodal .exq-newitem .kb-f{gap:7px}

/* «Добавить расход» */
:root .exq-newmodal .exq-newitems{counter-reset:exq-it}
:root .exq-newmodal .exq-newitem{counter-increment:exq-it}
:root .exq-newmodal .exq-num::before{content:"Позиция " counter(exq-it);font-size:13px;font-weight:700;color:var(--text)}
:root .exq-newmodal .exq-newitems:not(.solo) .exq-newitem{padding-bottom:4px}
:root .exq-newmodal .exq-newitem + .exq-newitem{padding-top:18px;margin-top:2px;border-top:1px dashed var(--border-strong)}
:root .exq-newmodal .exq-itemx{width:30px;height:30px;border-radius:8px;background:var(--surface-3);color:var(--text);transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s,background .15s,color .15s}
:root .exq-newmodal .exq-itemx:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px -10px rgba(255,93,0,.9),inset 0 1px 0 rgba(255,255,255,.3)}
:root .exq-newmodal .exq-itemx svg{width:15px;height:15px;transition:transform .3s cubic-bezier(.16,1,.3,1)}
:root .exq-newmodal .exq-itemx:hover svg{transform:rotate(90deg)}
:root .exq-newmodal .exq-newrcpt{align-items:stretch}
:root .kb-drop--sm{flex:1;flex-direction:row;justify-content:flex-start;text-align:left;gap:12px;padding:10px 14px}
:root .kb-drop--sm .ico{margin:0;flex:none}
:root .kb-drop--sm span{display:flex;flex-direction:column;gap:1px}
:root .exq-newmodal .exq-newrcpt .btn{align-self:center}
:root .exq-newmodal .exq-newrcpt-thumb{width:44px;height:44px;border-radius:10px;align-self:center}
:root .exq-newmodal .exq-additem-row{margin-top:2px}
/* переключатель карты — как вкладки в карточке сотрудника */
:root .exq-seg{position:relative;padding:4px;gap:4px;border:0;border-radius:14px;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border)}
:root .exq-seg .exq-seg-opt{position:relative;z-index:1;padding:7px 14px;border-radius:999px;font-size:12.5px;font-weight:700;color:var(--muted);background:transparent;transition:color .2s}
:root .exq-seg .exq-seg-opt:not(.on):hover{background:transparent;color:var(--text)}
:root .exq-seg .exq-seg-opt.on,:root .exq-seg .exq-seg-opt.on:hover{background:transparent;color:#fff}
:root .exq-newmodal .pf-plates{margin-top:0}
:root .exq-newmodal .pf-plates .wm-plate .v.pf-card{font-size:15px}

/* компактнее по вертикали, чтобы «Добавить расход» помещалась на десктопном экране без скролла
   (специфичность как у :root .modal:not(.wm):not(.cf-modal) — иначе те правила выше по каскаду) */
:root .modal.exq-newmodal:not(.wm):not(.cf-modal) .modal-head{padding:14px 20px 6px}
:root .modal.exq-newmodal:not(.wm):not(.cf-modal) .modal-body{padding:10px 20px 16px;gap:10px}
:root .modal.exq-newmodal:not(.wm):not(.cf-modal) .kb-f{gap:5px}
:root .exq-newmodal .exq-cardhead{margin-bottom:0}
/* шапка (заголовок+крестик) и футер (сумма+кнопки) закреплены и не уезжают при скролле
   содержимого — тот же приём, что в модалке «Аванс/Остаток» (.pr-modal): сам .modal — flex-
   колонка со своим overflow:hidden, скроллится только .modal-body, шапка и футер — соседние
   несжимаемые flex-элементы. Одинаково и на телефоне, и на десктопе. */
:root .modal.exq-newmodal{display:flex;flex-direction:column;overflow:hidden}
:root .modal.exq-newmodal .modal-head{flex:none}
:root .modal.exq-newmodal .modal-body{flex:1;min-height:0;overflow-y:auto}
:root .modal.exq-newmodal .exq-newmodal-foot{flex:none;padding:12px 20px 16px;display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--border);background:var(--surface)}
:root .exq-newmodal #exNewCardBox{margin-top:6px}
:root .exq-newmodal .pf-plates .wm-plate{padding:8px 12px}
:root .exq-newmodal input.in{height:30px}
:root .exq-newmodal .kb-drop--sm{padding:8px 14px}

/* выпадающие списки в модалках сотрудника и расхода — как фильтр департамента и кебаб */
:is(.tm-form-modal,.exq-newmodal) .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
:is(.tm-form-modal,.exq-newmodal) .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
:is(.tm-form-modal,.exq-newmodal) .dd-opt + .dd-opt{margin-top:2px}
:is(.tm-form-modal,.exq-newmodal) .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root :is(.tm-form-modal,.exq-newmodal) .dd-menu .dd-opt.on,:root :is(.tm-form-modal,.exq-newmodal) .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
:is(.tm-form-modal,.exq-newmodal) .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] :is(.tm-form-modal,.exq-newmodal) .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] :is(.tm-form-modal,.exq-newmodal) .dd-opt:hover{background:#f1f1f1}

:root .exq-seg{border-radius:999px;box-shadow:inset 0 0 0 1px var(--border)}

.tp-ph--tk{grid-template-columns:minmax(0,1fr) 96px 116px 190px;cursor:pointer;transition:background .14s}
.tp-ph--tk.tp-ph--head{cursor:default}
.tp-ph--tk:not(.tp-ph--head):hover{background:var(--surface-3)}
.pf-chips button.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
@media(max-width:760px){.tp-ph--tk{grid-template-columns:minmax(0,1fr) 96px}.tp-ph--tk > span:nth-child(2){display:none}.tp-ph--tk .tp-ex-act{grid-column:1/-1;justify-content:flex-start}}

:root .pf-chips button.on,:root[data-theme="light"] .pf-chips button.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}

.tp-ph--pj{grid-template-columns:minmax(0,1fr) 84px 110px 104px 96px;cursor:pointer;transition:background .14s}
.tp-ph--pj.tp-ph--head{cursor:default}
.tp-ph--pj:not(.tp-ph--head):hover{background:var(--surface-3)}
@media(max-width:760px){.tp-ph--pj{grid-template-columns:minmax(0,1fr) 96px}.tp-ph--pj > span:nth-child(2),.tp-ph--pj > span:nth-child(3),.tp-ph--pj > span:nth-child(5){display:none}}

/* Расходы: карта получателя копируется, кнопки и списки в общем стиле */
:root .exq-detail-pay{position:relative;cursor:pointer;transition:background .15s,box-shadow .2s,transform .15s}
:root .exq-detail-pay:hover{box-shadow:0 0 0 1.5px var(--accent)}
:root .exq-detail-pay:active{transform:scale(.99)}
:root .exq-detail-pay .pf-cp{top:8px;right:10px}
:root .exq-detail-pay-num,:root .exq-detail-pay-name{font-family:var(--font-display);font-variant-numeric:tabular-nums}
:root .exq-detail-rcpt.btn{height:28px;padding:0 10px;font-size:12px;gap:6px}
:root .exq-detail-rcpt.btn .ico{width:14px;height:14px}
:root .main[data-view="expenses"] .dd-trigger:not(.tm-kb){height:36px;border-radius:999px;padding:0 12px 0 16px;gap:8px;font-size:12.5px;font-weight:700;background:var(--field);border:1px solid var(--field-border);color:var(--text);box-shadow:none}
:root .main[data-view="expenses"] .dd:not(.open) .dd-trigger:not(.tm-kb):hover{background:var(--surface);border-color:var(--border-strong)}
:root .main[data-view="expenses"] .dd.open .dd-trigger:not(.tm-kb){background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.main[data-view="expenses"] .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.main[data-view="expenses"] .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.main[data-view="expenses"] .dd-opt + .dd-opt{margin-top:2px}
.main[data-view="expenses"] .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .main[data-view="expenses"] .dd-menu .dd-opt.on,:root .main[data-view="expenses"] .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.main[data-view="expenses"] .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .main[data-view="expenses"] .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
/* в Telegram-вебвью классический скроллбар не рисуется, но место под него всё равно резервировалось —
   убираем зарезервированную ширину у этого списка, скролл колесом/тачем всё равно работает */
.main[data-view="expenses"] .dd-menu{scrollbar-width:none}
.main[data-view="expenses"] .dd-menu::-webkit-scrollbar{width:0;height:0}
:root[data-theme="light"] .main[data-view="expenses"] .dd-opt:hover{background:#f1f1f1}

/* модалка «Чек» — просто фото на весь размер плашки, без заголовка и белого фона; крестик — кружок
   поверх фотографии в правом верхнем углу */
:root .modal.exq-rcpt-modal:not(.wm):not(.cf-modal){max-width:min(480px,90vw);max-height:88vh;padding:0;margin:0;border:0;border-radius:16px;background:transparent;box-shadow:none;overflow:visible;position:relative;display:block}
.exq-rcpt-zoom{overflow:hidden;border-radius:16px;touch-action:none;cursor:zoom-in}
.exq-rcpt-zoom.zoomed{cursor:grab}
.exq-rcpt-zoom.dragging{cursor:grabbing}
.exq-rcpt-modal img{display:block;width:100%;max-height:88vh;object-fit:contain;border-radius:16px;transform-origin:center center;user-select:none;-webkit-user-drag:none}
.exq-rcpt-zoom.animate img{transition:transform .18s cubic-bezier(.16,1,.3,1)}
.exq-rcpt-x{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:50%;border:0!important;background:#fff;color:#111;box-shadow:0 8px 20px -6px rgba(0,0,0,.6);transition:background .15s,transform .2s}
.exq-rcpt-x:hover{background:#fff;transform:rotate(90deg)}

:root .exq-mdrow.active,:root .exq-mdrow.active:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
:root .exq-mdrow.active .exq-mdrow-n,:root .exq-mdrow.active .exq-mdrow-p,:root .exq-mdrow.active .exq-mdrow-sum,:root .exq-mdrow.active .exq-mdrow-age,:root .exq-mdrow.active .exq-mdrow-age.warn{color:#fff}

:root .exq-detail-pay-name{display:flex;align-items:center;gap:8px}
:root .pf-cp.pf-cp--in{position:static;width:22px;height:22px;border-radius:7px;flex:none}
:root .pf-cp.pf-cp--in .ico{width:13px;height:13px}
:root .exq-detail-pay.copied .pf-cp{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}

/* календарь-диапазон */
.rc{position:relative}
:root .rc-trig{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px 0 14px;border-radius:999px;border:1px solid var(--field-border);background:var(--field);color:var(--text);font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .2s}
:root .rc-trig:hover{background:var(--surface);border-color:var(--border-strong)}
:root .rc.open .rc-trig{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.rc-trig .ico{width:15px;height:15px;color:var(--muted)}
.rc-trig .chev{transition:transform .2s cubic-bezier(.4,0,.2,1)}
.rc.open .rc-trig .chev{transform:rotate(180deg)}
.rc.up .rc-pop{top:auto;bottom:calc(100% + 8px)}
.rc-pop{position:absolute;z-index:60;right:0;top:calc(100% + 8px);display:flex;gap:6px;padding:8px;border-radius:20px;background:color-mix(in srgb,var(--surface) 94%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 28px 60px -20px rgba(0,0,0,.85);animation:dd-in .16s cubic-bezier(.16,1,.3,1)}
.rc-pre{display:flex;flex-direction:column;gap:2px;padding:6px;min-width:128px;border-right:1px solid var(--border)}
.rc-p{border:0;background:none;text-align:left;font:inherit;font-size:13px;font-weight:600;color:var(--text);padding:9px 12px;border-radius:10px;cursor:pointer;transition:background .14s,transform .14s}
.rc-p:hover{background:var(--surface-3);transform:translateX(2px)}
.rc-cal{width:288px;padding:6px 8px 4px}
.rc-hd{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:2px 0 10px}
.rc-title{display:inline-flex;align-items:center;gap:6px;border:0;background:none;font:inherit;font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:-.01em;color:var(--text);padding:6px 10px;border-radius:10px;cursor:pointer;transition:background .14s}
.rc-title:hover{background:var(--surface-3)}
.rc-title .chev{width:13px;height:13px;color:var(--muted)}
.rc-nav{width:32px;height:32px;border:0;border-radius:50%;background:var(--surface-3);color:var(--text);font-size:17px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:background .15s,color .15s,transform .2s}
.rc-nav:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:scale(1.06)}
.rc-wd{display:grid;grid-template-columns:repeat(7,1fr);padding-bottom:4px}
.rc-wd span{font-size:11px;font-weight:600;color:var(--muted);text-align:center}
.rc-grid{display:grid;grid-template-columns:repeat(7,1fr);row-gap:2px}
.rc-c{position:relative;height:36px;display:grid;place-items:center}
.rc-c.r-in::before{content:"";position:absolute;inset:2px 0;background:var(--accent-soft)}
.rc-c.r-in.r-st::before{left:2px;border-radius:999px 0 0 999px}
.rc-c.r-in.r-en::before{right:2px;border-radius:0 999px 999px 0}
.rc-c.r-in.r-st.r-en::before{border-radius:999px}
.rc-d{position:relative;width:34px;height:34px;border:0;border-radius:50%;background:none;color:var(--text);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .12s,transform .15s}
.rc-d:not(:disabled):not(.sel):hover{background:var(--surface-3)}
.rc-d.today{color:var(--accent);font-weight:800}
.rc-d.sel,.rc-mb.sel{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;font-weight:700;box-shadow:0 6px 14px -6px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
.rc-d:disabled,.rc-mb:disabled{color:var(--border-strong);cursor:not-allowed}
.rc-months{display:grid;grid-template-columns:repeat(3,1fr);row-gap:6px;padding:4px 0 6px}
.rc-m{position:relative;height:44px;display:grid;place-items:center}
.rc-m.r-in::before{content:"";position:absolute;inset:4px 0;background:var(--accent-soft)}
.rc-m.r-in.r-st::before{left:4px;border-radius:999px 0 0 999px}
.rc-m.r-in.r-en::before{right:4px;border-radius:0 999px 999px 0}
.rc-m.r-in.r-st.r-en::before{border-radius:999px}
.rc-mb{position:relative;width:76px;height:36px;border:0;border-radius:999px;background:none;color:var(--text);font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:background .12s}
.rc-mb:not(:disabled):not(.sel):hover{background:var(--surface-3)}
.rc-mb.today{color:var(--accent);font-weight:800}
.rc-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding-top:10px;border-top:1px solid var(--border)}
.rc-sum{font-size:12.5px;font-weight:700;color:var(--text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rc-foot .btn:disabled{opacity:.45;pointer-events:none}
:root[data-theme="light"] .rc-pop{background:rgba(255,255,255,.97);box-shadow:0 0 0 1px #e6e6e6,0 28px 60px -24px rgba(0,0,0,.32)}
:root[data-theme="light"] .rc-nav{background:#f1f1f1}
:root[data-theme="light"] .rc-nav:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}
:root[data-theme="light"] .rc-p:hover,:root[data-theme="light"] .rc-title:hover,:root[data-theme="light"] .rc-d:not(:disabled):not(.sel):hover,:root[data-theme="light"] .rc-mb:not(:disabled):not(.sel):hover{background:#f1f1f1}
@media(max-width:640px){.rc-pop{flex-direction:column;right:auto;left:0;max-width:calc(100vw - 32px)}.rc-pre{flex-direction:row;flex-wrap:wrap;border-right:0;border-bottom:1px solid var(--border);min-width:0}.rc-cal{width:100%}}

.rc-c.r-in.r-st.r-en::before,.rc-m.r-in.r-st.r-en::before{display:none}
.rc-d:disabled,.rc-mb:disabled{color:color-mix(in srgb,var(--text) 32%,transparent)}
.rc-pre{min-width:150px}
.rc-p{white-space:nowrap}

/* Зарплаты: выпадающие списки, кебаб и календарь в общем стиле */
.rc-title--static{cursor:default;pointer-events:none}
.rc-pop--m .rc-cal{width:264px}
:root .main[data-view="payroll"] .dd-trigger:not(.tm-kb){height:36px;border-radius:999px;padding:0 12px 0 16px;gap:8px;font-size:12.5px;font-weight:700;background:var(--field);border:1px solid var(--field-border);color:var(--text);box-shadow:none}
:root .main[data-view="payroll"] .dd:not(.open) .dd-trigger:not(.tm-kb):hover{background:var(--surface);border-color:var(--border-strong)}
:root .main[data-view="payroll"] .dd.open .dd-trigger:not(.tm-kb){background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.main[data-view="payroll"] .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.main[data-view="payroll"] .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.main[data-view="payroll"] .dd-opt + .dd-opt{margin-top:2px}
.main[data-view="payroll"] .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .main[data-view="payroll"] .dd-menu .dd-opt.on,:root .main[data-view="payroll"] .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.main[data-view="payroll"] .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .main[data-view="payroll"] .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .main[data-view="payroll"] .dd-opt:hover{background:#f1f1f1}

/* выбранные даты и месяцы календаря — всегда белый текст */
:root .rc-d.sel,:root .rc-mb.sel,:root .rc-d.sel.today,:root .rc-mb.sel.today{color:#fff}
/* поиск сотрудника на «Зарплатах» — как на «Базе знаний» и «Команде» */
:root .main[data-view="payroll"] .kb-search{height:36px;border-radius:999px;padding:0 14px;gap:10px;background:var(--field);border:1px solid var(--field-border);transition:border-color .15s,background .15s,box-shadow .2s}
:root .main[data-view="payroll"] .kb-search .ico{width:16px;height:16px}
:root .main[data-view="payroll"] .kb-search:hover{background:var(--surface);border-color:var(--border-strong);box-shadow:none}
:root .main[data-view="payroll"] .kb-search:focus-within{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft),0 14px 28px -14px rgba(0,0,0,.6)}
:root .main[data-view="payroll"] .kb-search:focus-within .ico{color:var(--accent)}
:root .main[data-view="payroll"] .kb-search input{height:34px}
/* модалка выплаты: аванс / остаток / внеплановая */
/* список сотрудников не растягивается через flex:1 на всю модалку (когда сотрудников мало,
   это оставляло пустую дыру между последней строкой и кнопкой «Готово», будто часть
   пропала) — вместо этого у списка своя предельная высота: пока сотрудников немного,
   модалка просто короче и складывается по контенту; когда не помещается — скроллится
   только сам список, а шапка/прогресс-бар/кнопка «Готово» остаются на месте */
:root .pr-modal{display:flex;flex-direction:column;max-height:80vh}
:root .pr-body{gap:14px;min-height:0;display:flex;flex-direction:column}
/* нижний паддинг с запасом — иначе overflow-y:auto обрезает тень кнопки «Перевести» у
   последней (или единственной) строки прямо по границе списка; лево-право компенсируем
   отрицательным margin, чтобы строки остались вровень с шапкой/прогресс-баром */
:root .pr-list{max-height:min(48vh,460px);overflow-y:auto;margin:0 -14px;padding:4px 14px 26px}
:root .pr-seg{align-self:flex-start}
/* на узком экране имя+карта в одну строку сжимали имя до «Дилно…» — переносим номер карты
   на свою строку, с отступом под аватар, вместо того чтобы теснить имя */
@media(max-width:480px){
  :root .pr-top{flex-wrap:wrap;row-gap:4px}
  :root .pr-top .pr-card{flex-basis:100%;margin-left:41px;justify-content:flex-start}
}
.pr-prog{display:flex;flex-direction:column;gap:8px}
.pr-bar{height:8px;border-radius:999px;background:var(--surface-3);overflow:hidden}
.pr-bar span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#ff7a2e,#ff5d00);box-shadow:0 0 14px rgba(255,93,0,.55);transition:width .4s cubic-bezier(.16,1,.3,1)}
.pr-prog-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pr-pt{font-size:12.5px;color:var(--text-2)}
.pr-pt b{color:var(--text);font-weight:700}
.pr-hide{border:0;font:inherit;font-size:12px;font-weight:600;padding:5px 12px;border-radius:8px;cursor:pointer;background:var(--surface-3);color:var(--text);transition:background .15s,color .15s,box-shadow .2s}
.pr-hide:hover,.pr-hide.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
.pr-list{display:flex;flex-direction:column;gap:10px}
.pr-row{display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:14px;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border);transition:opacity .2s}
.pr-row.done{opacity:.72}
.pr-top{display:flex;align-items:center;gap:10px;min-width:0}
.pr-name{font-size:13.5px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr-card{margin-left:auto;display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:3px 4px 3px 8px;border-radius:8px;font:inherit;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:12.5px;font-weight:600;color:var(--text-2);cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.pr-card.off{cursor:default;color:var(--muted)}
.pr-card:not(.off):hover{background:var(--surface-3);color:var(--text)}
.pr-card:not(.off):hover .pf-cp{color:var(--accent);background:var(--accent-soft)}
.pr-part{font-size:12px;color:var(--muted)}
.pr-bot{display:flex;align-items:center;gap:10px}
.pr-bot .pay-runinp{flex:1;min-width:0;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:15px;font-weight:700}
.pr-paid{flex:1;display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--ok)}
.pr-paid .ico{width:16px;height:16px}

:root .pr-bot .pay-runinp{text-align:left}

:root .pr-row{background:none;box-shadow:none;border-radius:0;padding:0}
:root .pr-list{gap:0}
:root .pr-row + .pr-row{margin-top:16px;padding-top:16px;border-top:1px dashed var(--border-strong)}

/* пагинация истории операций — в общем стиле кнопок */
:root .pay-hist-pgb{height:33px;padding:0 15px;border:0;border-radius:8px;background:var(--surface-3);color:var(--text);font-size:12.5px;font-weight:600;box-shadow:none;transition:background .15s,color .15s,box-shadow .2s,transform .15s}
:root .pay-hist-pgb:not(:disabled):hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25);transform:translateY(-1px)}
:root .pay-hist-pgb:not(:disabled):active{transform:scale(.96);box-shadow:none}
:root .pay-hist-pgb:disabled{opacity:.4;cursor:default}
:root[data-theme="light"] .pay-hist-pgb{background:#ececec}
:root[data-theme="light"] .pay-hist-pgb:not(:disabled):hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
.pay-hist-pg-t{font-size:12.5px;font-weight:600;color:var(--text-2)}
.pay-hist-pg-t b{color:var(--text)}

/* Посещаемость: списки, календарь дня и кнопки в общем стиле */
:root .main[data-view="attendance"] .dd-trigger:not(.tm-kb){height:36px;border-radius:999px;padding:0 12px 0 16px;gap:8px;font-size:12.5px;font-weight:700;background:var(--field);border:1px solid var(--field-border);color:var(--text);box-shadow:none}
:root .main[data-view="attendance"] .dd:not(.open) .dd-trigger:not(.tm-kb):hover{background:var(--surface);border-color:var(--border-strong)}
:root .main[data-view="attendance"] .dd.open .dd-trigger:not(.tm-kb){background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.main[data-view="attendance"] .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.main[data-view="attendance"] .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.main[data-view="attendance"] .dd-opt + .dd-opt{margin-top:2px}
.main[data-view="attendance"] .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .main[data-view="attendance"] .dd-menu .dd-opt.on,:root .main[data-view="attendance"] .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.main[data-view="attendance"] .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .main[data-view="attendance"] .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .main[data-view="attendance"] .dd-opt:hover{background:#f1f1f1}
/* календарь одного дня */
:root .main[data-view="attendance"] .att-cal-trig{height:36px;padding:0 12px 0 14px;border-radius:999px;gap:8px;font-size:12.5px;font-weight:700;background:var(--field);border:1px solid var(--field-border);color:var(--text);transition:background .15s,border-color .15s,box-shadow .2s}
:root .main[data-view="attendance"] .att-cal-trig:hover{background:var(--surface);border-color:var(--border-strong)}
:root .main[data-view="attendance"] .att-cal.open .att-cal-trig{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
#attJournalCal.up .att-cal-pop{top:auto;bottom:calc(100% + 6px)}
:root .att-cal-pop{width:288px;padding:12px 14px 10px;border:0;border-radius:20px;background:color-mix(in srgb,var(--surface) 94%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 28px 60px -20px rgba(0,0,0,.85);animation:dd-in .16s cubic-bezier(.16,1,.3,1)}
:root .att-cal-hd{padding:0 0 10px;gap:6px}
:root .att-cal-mo{font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:-.01em}
:root .att-cal-nav{width:32px;height:32px;border-radius:50%;background:var(--surface-3);color:var(--text);font-size:17px;transition:background .15s,color .15s,transform .2s}
:root .att-cal-nav:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:scale(1.06)}
:root .att-cal-wd span{font-size:11px}
:root .att-cal-grid{row-gap:2px}
:root .att-cal-d{width:34px;height:34px;border-radius:50%;font-size:12.5px;font-weight:600}
:root .att-cal-d:not(.empty):not(:disabled):hover{background:var(--surface-3)}
:root .att-cal-d.sel,:root .att-cal-d.sel.today{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;font-weight:700;box-shadow:0 6px 14px -6px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
:root .att-cal-d:disabled{color:color-mix(in srgb,var(--text) 32%,transparent)}
:root .att-cal-today{height:33px;margin-top:10px;border:0;border-radius:8px;background:var(--surface-3);color:var(--text);font-weight:600;transition:background .15s,color .15s,box-shadow .2s}
:root .att-cal-today:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 10px 20px -10px rgba(255,93,0,.8)}
:root[data-theme="light"] .att-cal-pop{background:rgba(255,255,255,.97);box-shadow:0 0 0 1px #e6e6e6,0 28px 60px -24px rgba(0,0,0,.32)}
:root[data-theme="light"] .att-cal-nav,:root[data-theme="light"] .att-cal-today{background:#f1f1f1}

/* Запросы-исключения — как «Требует выплаты» на зарплатах */
.att-req.card{margin-bottom:0;transition:none}
.att-req.card:hover{transform:none}
.att-req .card-head .att-req-n{margin-left:auto}
.att-req .tp-acts{display:flex;gap:8px;margin-left:auto}

/* крестик отмены в «Истории операций» — как в карточке сотрудника */
:root .pay-hist-row .pay-hist-x{position:relative;overflow:hidden;width:30px;height:30px;border-radius:8px;color:var(--text);transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s,background .15s,color .15s}
:root .pay-hist-row .pay-hist-x svg{transition:transform .3s cubic-bezier(.16,1,.3,1)}
:root .pay-hist-row .pay-hist-x:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px -10px rgba(255,93,0,.9),inset 0 1px 0 rgba(255,255,255,.3)}
:root .pay-hist-row .pay-hist-x:hover svg{transform:rotate(90deg)}
:root .pay-hist-row .pay-hist-x:active{transform:translateY(0) scale(.94)}

/* Инвентарь: поиск, список категорий и кнопки в общем стиле */
:root .main[data-view="gear"] .kb-search{height:36px;border-radius:999px;padding:0 14px;gap:10px;background:var(--field);border:1px solid var(--field-border);transition:border-color .15s,background .15s,box-shadow .2s}
:root .main[data-view="gear"] .kb-search .ico{width:16px;height:16px}
:root .main[data-view="gear"] .kb-search:hover{background:var(--surface);border-color:var(--border-strong);box-shadow:none}
:root .main[data-view="gear"] .kb-search:focus-within{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft),0 14px 28px -14px rgba(0,0,0,.6)}
:root .main[data-view="gear"] .kb-search:focus-within .ico{color:var(--accent)}
:root .main[data-view="gear"] .kb-search input{height:34px}
:root .main[data-view="gear"] .dd-trigger:not(.tm-kb){height:36px;border-radius:999px;padding:0 12px 0 16px;gap:8px;font-size:12.5px;font-weight:700;background:var(--field);border:1px solid var(--field-border);color:var(--text);box-shadow:none}
:root .main[data-view="gear"] .dd:not(.open) .dd-trigger:not(.tm-kb):hover{background:var(--surface);border-color:var(--border-strong)}
:root .main[data-view="gear"] .dd.open .dd-trigger:not(.tm-kb){background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.main[data-view="gear"] .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.main[data-view="gear"] .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.main[data-view="gear"] .dd-opt + .dd-opt{margin-top:2px}
.main[data-view="gear"] .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .main[data-view="gear"] .dd-menu .dd-opt.on,:root .main[data-view="gear"] .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.main[data-view="gear"] .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .main[data-view="gear"] .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .main[data-view="gear"] .dd-opt:hover{background:#f1f1f1}

:root .main[data-view="gear"] .pj-kpi .v{font-size:32px;line-height:1.25}

/* изменить / добавить позицию — как «Сотрудник» */
:root .gf-modal .att-cal-trig{width:100%;height:42px;padding:0 16px;border:0;border-radius:12px;background:var(--surface-3);color:var(--text);font-size:13.5px;font-weight:600;justify-content:flex-start;gap:10px;box-shadow:inset 0 0 0 1.5px transparent;transition:box-shadow .18s,background .18s}
:root .gf-modal .att-cal-trig span{flex:1;text-align:left}
:root .gf-modal .att-cal-trig:hover{background:var(--surface-2)}
:root .gf-modal .att-cal.open .att-cal-trig{background:var(--surface);box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)}
:root[data-theme="light"] .gf-modal .att-cal-trig{background:#f1f1f1}
:root .gf-modal .pay-modal-foot .btn--crit{margin-right:auto}

/* номер карты всегда помещается в плашке */
:root .pf-plates{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
:root .pf-plates .wm-plate .v.pf-card{font-size:clamp(12.5px,3.4vw,15px);white-space:nowrap;letter-spacing:0}
:root .exq-newmodal .pf-plates{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
:root .pf-plates .wm-plate{padding:12px}
@media(max-width:480px){
  :root .pf-plates{grid-template-columns:minmax(0,1fr)}
  /* «Добавить расход»: у неё свой 1.2fr/1fr оверрайд (десктопный) с более высокой
     специфичностью, чем это правило — перебивает его и не давал сложить плашки в столбик,
     номер карты обрезался */
  :root .exq-newmodal .pf-plates{grid-template-columns:minmax(0,1fr)}
  /* «Запрос выплаты»: «Запрошено» и «Доступно сейчас» — в один ряд даже на телефоне,
     карта для перевода — отдельной строкой под ними, как и раньше */
  :root .pf-plates--req{grid-template-columns:1fr 1fr}
  :root .pf-plates--req .pf-wide{grid-column:1/-1}
}

/* календарь раскрывается внутри модалки, а не обрезается её краем */
:root .gf-modal .att-cal{position:static}
:root .gf-modal .att-cal-pop{position:static;width:100%;max-width:340px;margin:8px 0 0;box-shadow:0 0 0 1px var(--border-strong);animation:none}

:root .gf-modal .att-cal{display:flex;flex-direction:column-reverse}
:root .gf-modal .att-cal-pop{margin:0 0 8px}

/* календарь позиции: поверх полей, вверх от даты */
:root .gf-modal .att-cal{position:relative;display:block}
:root .gf-modal .att-cal-pop{position:absolute;left:0;right:auto;top:auto;bottom:calc(100% + 8px);width:100%;max-width:340px;margin:0;z-index:70;box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.85)}

/* красное наведение у «Списать» / «Удалить» в кебабе на всех страницах */
:root .tm-kebab .dd-menu .dd-opt.del:hover,:root[data-theme="light"] .tm-kebab .dd-menu .dd-opt.del:hover{background:linear-gradient(180deg,color-mix(in srgb,var(--crit) 80%,#fff),var(--crit))!important;color:#fff!important;box-shadow:0 8px 16px -8px rgba(255,80,80,.8)!important}
:root .tm-kebab .dd-menu .dd-opt.del:hover svg{color:#fff}
/* модалка списания позиции */
.gr-ret{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:14px;background:var(--surface-3)}
.gr-ret-ph{width:52px;height:52px;border-radius:14px;flex:none;display:grid;place-items:center;overflow:hidden}
.gr-ret-ph img{width:100%;height:100%;object-fit:cover}
.gr-ret-i{min-width:0}
.gr-ret-n{font-size:14.5px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gr-ret-m{font-size:12.5px;color:var(--muted);margin-top:2px}
.gr-ret-warn{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:var(--crit-soft);color:var(--crit);font-size:12.5px;font-weight:600}
.gr-ret-warn .ico{width:16px;height:16px;flex:none}
:root .pay-md .gr-del{margin-right:0;background:linear-gradient(180deg,color-mix(in srgb,var(--crit) 80%,#fff),var(--crit));border-color:transparent;color:#fff;box-shadow:0 12px 24px -10px rgba(255,80,80,.8),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .18s cubic-bezier(.16,1,.3,1),box-shadow .2s}
:root .pay-md .gr-del:hover{transform:translateY(-2px);box-shadow:0 18px 30px -10px rgba(255,80,80,.9),inset 0 1px 0 rgba(255,255,255,.3)}
:root .pay-md .gr-del:active{transform:scale(.97)}
:root[data-theme="light"] .gr-ret{background:#f1f1f1}

:root .gr-ret{background:none;padding:0}
:root[data-theme="light"] .gr-ret{background:none}

:root .gr-card .gr-top .tm-kebab{align-self:flex-start;margin:-6px -6px 0 0}

/* бронирование инвентаря */
.gb-sec{display:flex;align-items:center;justify-content:space-between;margin:2px 0 -4px}
.gb-sec .wz-s1-lbl{display:inline-flex;align-items:center;gap:8px;margin:0!important}
.gb-list{display:flex;flex-direction:column}
.gb-row{display:flex;align-items:center;gap:14px;padding:10px 0}
.gb-row + .gb-row{border-top:1px dashed var(--border-strong)}
.gb-d{width:64px;flex:none;font-size:13.5px;font-weight:700;color:var(--text);white-space:nowrap}
.gb-i{flex:1;min-width:0}
.gb-p{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gb-m{font-size:12px;color:var(--muted);margin-top:2px}
.gb-none{font-size:12.5px;color:var(--muted);padding:2px 0 6px}
:root .gb-modal .pay-hist-x{position:relative;overflow:hidden;width:30px;height:30px;border-radius:8px;flex:none;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s,background .15s,color .15s}
:root .gb-modal .pay-hist-x svg{transition:transform .3s cubic-bezier(.16,1,.3,1)}
:root .gb-modal .pay-hist-x:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px -10px rgba(255,93,0,.9),inset 0 1px 0 rgba(255,255,255,.3)}
:root .gb-modal .pay-hist-x:hover svg{transform:rotate(90deg)}
:root .gb-modal .gb-day{background:none;border:0;box-shadow:none;padding:0}
:root .gb-modal .gb-days{gap:0}
:root .gb-modal .gb-day + .gb-day{margin-top:14px;padding-top:14px;border-top:1px dashed var(--border-strong)}
:root .gb-modal .gb-day-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
:root .gb-modal .gb-day-h b{font-size:13.5px;font-weight:700}
:root .gb-modal .gb-day-h span{font-size:12px;color:var(--muted)}
:root .gb-modal .gb-pills{display:flex;flex-wrap:wrap;gap:8px}
:root .gb-modal .wz-pill{border:0;font:inherit;font-size:12.5px;font-weight:600;padding:7px 14px;border-radius:8px;cursor:pointer;background:var(--surface-3);color:var(--text);box-shadow:none;transition:background .15s,color .15s,box-shadow .2s,transform .15s}
:root .gb-modal .wz-pill:hover{background:var(--surface-2)}
:root .gb-modal .wz-pill.on,:root .gb-modal .wz-pill.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
:root[data-theme="light"] .gb-modal .wz-pill:not(.on){background:#ececec}

/* Подрядчики: поиск, список категорий и кнопки в общем стиле */
:root .main[data-view="actors"] .kb-search{height:36px;border-radius:999px;padding:0 14px;gap:10px;background:var(--field);border:1px solid var(--field-border);transition:border-color .15s,background .15s,box-shadow .2s}
:root .main[data-view="actors"] .kb-search .ico{width:16px;height:16px}
:root .main[data-view="actors"] .kb-search:hover{background:var(--surface);border-color:var(--border-strong);box-shadow:none}
:root .main[data-view="actors"] .kb-search:focus-within{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft),0 14px 28px -14px rgba(0,0,0,.6)}
:root .main[data-view="actors"] .kb-search:focus-within .ico{color:var(--accent)}
:root .main[data-view="actors"] .kb-search input{height:34px}
:root .main[data-view="actors"] .dd-trigger:not(.tm-kb){height:36px;border-radius:999px;padding:0 12px 0 16px;gap:8px;font-size:12.5px;font-weight:700;background:var(--field);border:1px solid var(--field-border);color:var(--text);box-shadow:none}
:root .main[data-view="actors"] .dd:not(.open) .dd-trigger:not(.tm-kb):hover{background:var(--surface);border-color:var(--border-strong)}
:root .main[data-view="actors"] .dd.open .dd-trigger:not(.tm-kb){background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.main[data-view="actors"] .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.main[data-view="actors"] .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.main[data-view="actors"] .dd-opt + .dd-opt{margin-top:2px}
.main[data-view="actors"] .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .main[data-view="actors"] .dd-menu .dd-opt.on,:root .main[data-view="actors"] .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.main[data-view="actors"] .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .main[data-view="actors"] .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .main[data-view="actors"] .dd-opt:hover{background:#f1f1f1}


:root .main[data-view="actors"] .pj-kpi .v{font-size:32px;line-height:1.25}
:root .ac-card .ac-top .tm-kebab{align-self:flex-start;margin:-6px -6px 0 0}

:root .main[data-view="actors"] .gr-tools .dd .dd-trigger:not(.tm-kb){width:100%}

:root #actorCatFilter .dd-trigger{width:100%}

/* «Локации» — тот же поиск/фильтр, что на Инвентаре и Подрядчиках (был не оформлен вовсе —
   обычные квадратные .kb-search/.dd-trigger вместо круглых плашек с тем же наведением/фокусом) */
:root .main[data-view="locations"] .kb-search{height:36px;border-radius:999px;padding:0 14px;gap:10px;background:var(--field);border:1px solid var(--field-border);transition:border-color .15s,background .15s,box-shadow .2s}
:root .main[data-view="locations"] .kb-search .ico{width:16px;height:16px}
:root .main[data-view="locations"] .kb-search:hover{background:var(--surface);border-color:var(--border-strong);box-shadow:none}
:root .main[data-view="locations"] .kb-search:focus-within{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft),0 14px 28px -14px rgba(0,0,0,.6)}
:root .main[data-view="locations"] .kb-search:focus-within .ico{color:var(--accent)}
:root .main[data-view="locations"] .kb-search input{height:34px}
:root .main[data-view="locations"] .dd-trigger:not(.tm-kb){height:36px;border-radius:999px;padding:0 12px 0 16px;gap:8px;font-size:12.5px;font-weight:700;background:var(--field);border:1px solid var(--field-border);color:var(--text);box-shadow:none}
:root .main[data-view="locations"] .dd:not(.open) .dd-trigger:not(.tm-kb):hover{background:var(--surface);border-color:var(--border-strong)}
:root .main[data-view="locations"] .dd.open .dd-trigger:not(.tm-kb){background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.main[data-view="locations"] .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.main[data-view="locations"] .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.main[data-view="locations"] .dd-opt + .dd-opt{margin-top:2px}
.main[data-view="locations"] .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .main[data-view="locations"] .dd-menu .dd-opt.on,:root .main[data-view="locations"] .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.main[data-view="locations"] .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .main[data-view="locations"] .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .main[data-view="locations"] .dd-opt:hover{background:#f1f1f1}
:root .main[data-view="locations"] .gr-tools .dd .dd-trigger:not(.tm-kb){width:100%}
:root #locKindFilter .dd-trigger{width:100%}

:root #actorCatFilter .dd-trigger{height:36px;padding:0 12px 0 16px;gap:8px;font-weight:700}

/* добавить / изменить в составе — как позиция инвентаря */
:root .gf-modal textarea.in{border:0!important;border-radius:12px;background:var(--surface-3)!important;color:var(--text);font-size:13.5px;font-weight:600;padding:12px 16px;line-height:1.5;resize:vertical;box-shadow:inset 0 0 0 1.5px transparent;outline:0;transition:box-shadow .18s,background .18s}
:root .gf-modal textarea.in::placeholder{color:var(--muted);font-weight:500}
:root .gf-modal textarea.in:hover{background:var(--surface-2)!important}
:root .gf-modal textarea.in:focus{background:var(--surface)!important;box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)}
:root[data-theme="light"] .gf-modal textarea.in{background:#f1f1f1!important}

/* теги и категории подрядчика */
.ap-chips{display:flex;flex-wrap:wrap;gap:8px}
.ap-chip{display:inline-flex;align-items:center;gap:6px;border:0;font:inherit;font-size:12.5px;font-weight:600;padding:8px 14px;border-radius:8px;cursor:pointer;background:var(--surface-3);color:var(--text-2);transition:background .18s,color .18s,transform .18s,box-shadow .25s}
.ap-chip:hover{color:var(--text);background:var(--surface-2);transform:translateY(-1px)}
.ap-chip:active{transform:scale(.96)}
.ap-chip.on,.ap-chip.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:none;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
.ap-chip.on:active{transform:scale(.96)}
.ap-add{background:transparent!important;box-shadow:inset 0 0 0 1.5px var(--field-border)!important;color:var(--muted)}
.ap-add .ico{width:14px;height:14px}
.ap-add:hover{color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent)!important;transform:none}
.ap-pop{animation:catpop .32s cubic-bezier(.16,1.3,.3,1)}
.ap-new{height:34px;width:170px;padding:0 14px;border:0;border-radius:8px;background:var(--surface);color:var(--text);font:inherit;font-size:12.5px;font-weight:600;outline:0;box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft);animation:catin .25s cubic-bezier(.16,1,.3,1)}
:root[data-theme="light"] .ap-chip:not(.on){background:#ececec}
@media(prefers-reduced-motion:reduce){.ap-chip,.ap-pop,.ap-new{transition:none;animation:none}}

/* бронирование подрядчика */
:root .ab-modal .att-cal-pop{width:288px;max-width:none}
.ab-contacts{display:flex;flex-direction:column}
:root .ab-contacts .act-profile-contact,:root .ab-contacts #acProjectsBox .act-profile-contact{display:flex;align-items:center;gap:12px;width:100%;padding:10px 0;border:0;border-radius:0;background:none;color:var(--text);font:inherit;font-size:13.5px;font-weight:600;text-decoration:none;cursor:pointer}
:root .ab-contacts > * + *,:root .ab-contacts > .act-profile-contact + .act-profile-contact{border-top:1px dashed var(--border-strong)}
:root .ab-contacts .act-profile-contact .ico{width:17px;height:17px;color:var(--muted);flex:none}
:root .ab-contacts .act-profile-contact span{flex:1;text-align:left}
:root .ab-contacts .act-profile-contact em{font-style:normal;font-size:12px;font-weight:600;padding:5px 12px;border-radius:8px;background:var(--surface-3);color:var(--text);transition:background .15s,color .15s,box-shadow .2s}
:root .ab-contacts .act-profile-contact:hover em{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)}
:root .ab-contacts a.act-profile-contact:hover{color:var(--accent)}
:root .ab-contacts .act-profile-sec{padding:10px 0}
:root .ab-contacts .act-profile-sec-title{font-size:13px;font-weight:700}
:root[data-theme="light"] .ab-contacts .act-profile-contact em{background:#ececec}

/* «Показать» — обычная кнопка в общем стиле, строки без анимации */
:root .ab-contacts .act-profile-contact.ab-row{cursor:default}
:root .ab-contacts .act-profile-contact.ab-row:hover{color:var(--text)}
:root .ab-contacts .act-profile-contact .btn{height:30px;padding:0 14px;font-size:12px;flex:none}
/* брони: плитка с датой */
.gb-tile{width:46px;height:46px;flex:none;border-radius:12px;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;background:var(--accent-soft);color:var(--accent);line-height:1}
.gb-tile b{font-family:var(--font-display);font-size:17px;font-weight:800;letter-spacing:-.01em}
.gb-tile i{font-style:normal;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-top:3px}
:root .gb-modal .gb-row{gap:14px;padding:12px 0}
:root .gb-modal .gb-p{font-size:13.5px;font-weight:700}
:root .gb-modal .gb-m{font-size:12.5px}

/* контакты брони: отдельные серые плашки, без разделителей и без смены фона при наведении */
:root .ab-contacts{gap:8px}
:root .ab-contacts > * + *,:root .ab-contacts > .act-profile-contact + .act-profile-contact{border-top:0}
:root .ab-contacts .act-profile-contact,:root .ab-contacts .act-profile-sec{padding:8px 8px 8px 14px;border-radius:12px;background:var(--surface-3);transition:none}
:root .ab-contacts .act-profile-contact:hover,:root .ab-contacts a.act-profile-contact:hover,:root .ab-contacts .act-profile-sec:hover{background:var(--surface-3);color:var(--text)}
:root .ab-contacts .act-profile-sec{padding:12px 14px}
:root .ab-contacts .act-profile-contact .btn{background:var(--surface-2)}
:root .ab-contacts .act-profile-contact .btn:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
:root[data-theme="light"] .ab-contacts .act-profile-contact,:root[data-theme="light"] .ab-contacts .act-profile-sec{background:#f1f1f1}
:root[data-theme="light"] .ab-contacts .act-profile-contact:hover{background:#f1f1f1}

:root .ab-contacts .act-profile-contact,:root .ab-contacts #acProjectsBox .act-profile-contact{min-height:48px;padding:8px 9px 8px 14px;border-radius:12px;background:var(--surface-3);box-sizing:border-box}
:root .ab-contacts #acProjectsBox .act-profile-contact:hover{background:var(--surface-3)}
:root .ab-contacts #acProjectsBox .act-profile-sec{padding:12px 14px;border-radius:12px;background:var(--surface-3)}
:root[data-theme="light"] .ab-contacts #acProjectsBox .act-profile-contact,:root[data-theme="light"] .ab-contacts #acProjectsBox .act-profile-sec{background:#f1f1f1}

/* брони и контакты подрядчика: единые заголовки, плоские строки, проекты открываются */
:root .gb-modal .gb-sec .wz-s1-lbl,:root .gb-modal .act-profile-sec-title{font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:-.01em;text-transform:none;color:var(--text)}
:root .gb-modal .gb-sec{margin:6px 0 0}
:root .ab-contacts{gap:0}
:root .ab-contacts .act-profile-contact,:root .ab-contacts #acProjectsBox .act-profile-contact{min-height:44px;padding:6px 0;border-radius:0;background:none}
:root .ab-contacts .act-profile-contact:hover,:root .ab-contacts a.act-profile-contact:hover,:root .ab-contacts #acProjectsBox .act-profile-contact:hover{background:none;color:var(--text)}
:root .ab-contacts .act-profile-contact .btn{background:var(--surface-3)}
:root .ab-contacts .act-profile-contact .btn:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
:root .ab-contacts .act-profile-sec,:root .ab-contacts #acProjectsBox .act-profile-sec{padding:6px 0 0;background:none;border-radius:0}
:root[data-theme="light"] .ab-contacts .act-profile-contact,:root[data-theme="light"] .ab-contacts .act-profile-sec,:root[data-theme="light"] .ab-contacts #acProjectsBox .act-profile-sec{background:none}
.gb-plink{border:0;background:none;padding:0;font:inherit;font-weight:700;color:var(--text);cursor:pointer;text-align:left;transition:color .15s}
.gb-plink:hover{color:var(--accent)}
.ab-proj{width:100%;border:0;background:none;font:inherit;text-align:left;cursor:pointer;color:var(--text);transition:color .15s}
.ab-proj:hover .gb-p{color:var(--accent)}
.gb-modal .gb-list .gb-row:first-child{padding-top:6px}

/* брони и проекты — отдельные серые плашки */
:root .gb-modal .gb-list{gap:8px}
:root .gb-modal .gb-row,:root .gb-modal .gb-row + .gb-row{padding:12px 12px 12px 16px;border:0;border-radius:12px;background:var(--surface-3)}
:root .gb-modal .gb-list .gb-row:first-child{padding-top:12px}
:root .gb-modal .ab-proj:hover{background:var(--surface-3)}
:root[data-theme="light"] .gb-modal .gb-row{background:#f1f1f1}
:root .gb-modal .gb-row .pay-hist-x{background:var(--surface-2)}

:root .ab-contacts .act-profile-contact,:root .ab-contacts .act-profile-contact:hover,:root .ab-contacts #acProjectsBox .act-profile-contact:hover{box-shadow:none;transition:none}
/* снять бронь — оранжевое наведение (перекрывает серый фон плашки) */
:root .gb-modal .gb-row .pay-hist-x:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px -10px rgba(255,93,0,.9),inset 0 1px 0 rgba(255,255,255,.3)}

.gb-item .gb-edit{margin-left:auto;flex:none}

.ab-cnt{display:inline-flex;align-items:center;gap:8px}

:root .ab-contacts .act-profile-contact .badge{flex:none;text-align:center}

:root[data-theme="light"] .ab-contacts .act-profile-contact:hover,:root[data-theme="light"] .ab-contacts a.act-profile-contact:hover,:root[data-theme="light"] .ab-contacts #acProjectsBox .act-profile-contact:hover{background:none;box-shadow:none}

:root[data-theme="light"] .ab-contacts #acProjectsBox .act-profile-contact,:root[data-theme="light"] .ab-contacts .act-profile-contact{background:none}

:root .ab-contacts .ab-cnt .badge{padding:0 8px;min-width:0;width:auto}

:root .ab-contacts .ab-cnt .badge{font-variant-numeric:normal;padding:0 11px}

/* Клиенты: поиск, список категорий и кнопки в общем стиле */
:root .main[data-view="clients"] .kb-search{height:36px;border-radius:999px;padding:0 14px;gap:10px;background:var(--field);border:1px solid var(--field-border);transition:border-color .15s,background .15s,box-shadow .2s}
:root .main[data-view="clients"] .kb-search .ico{width:16px;height:16px}
:root .main[data-view="clients"] .kb-search:hover{background:var(--surface);border-color:var(--border-strong);box-shadow:none}
:root .main[data-view="clients"] .kb-search:focus-within{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft),0 14px 28px -14px rgba(0,0,0,.6)}
:root .main[data-view="clients"] .kb-search:focus-within .ico{color:var(--accent)}
:root .main[data-view="clients"] .kb-search input{height:34px}
:root .main[data-view="clients"] .dd-trigger:not(.tm-kb){height:36px;border-radius:999px;padding:0 12px 0 16px;gap:8px;font-size:12.5px;font-weight:700;background:var(--field);border:1px solid var(--field-border);color:var(--text);box-shadow:none}
:root .main[data-view="clients"] .dd:not(.open) .dd-trigger:not(.tm-kb):hover{background:var(--surface);border-color:var(--border-strong)}
:root .main[data-view="clients"] .dd.open .dd-trigger:not(.tm-kb){background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.main[data-view="clients"] .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.main[data-view="clients"] .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.main[data-view="clients"] .dd-opt + .dd-opt{margin-top:2px}
.main[data-view="clients"] .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .main[data-view="clients"] .dd-menu .dd-opt.on,:root .main[data-view="clients"] .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.main[data-view="clients"] .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .main[data-view="clients"] .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .main[data-view="clients"] .dd-opt:hover{background:#f1f1f1}

:root .main[data-view="clients"] .pj-kpi .v{font-size:32px;line-height:1.25}

:root .cl-card{gap:12px}
:root .cl-card .pj-card-hero .u{font-size:14px;font-weight:600}

:root .cl-contact .nmx,:root[data-theme="light"] .cl-card .cl-contact .nmx{color:var(--text);font-size:14px;font-weight:600}
:root .cl-contact .ph,:root[data-theme="light"] .cl-card .cl-contact .ph{color:var(--text);font-size:13.5px;font-weight:500}

:root .cl-card .cl-stats b{font-size:26px;font-weight:700;line-height:1.15}
:root .cl-card .cl-stats span{font-size:13.5px}

/* карточка клиента — редизайн: контакты/проекты переехали на компоненты карточки сотрудника
   (.tmm-row/.tp-kv, .tp-ph), поэтому весь старый набор .cv-c/.cv-pj/.cv-grid/.tp-ph--cv отсюда
   убран как мёртвый CSS (см. ClientModal) — .wm-head/.wm-plate у cv-modal больше НЕ переопределяем,
   пусть выглядят как у .tp-modal вообще (то есть как на карточке сотрудника). */
.cv-modal .wm-head{align-items:center;gap:14px}

/* модалка проекта: серые плашки, вкладки с плывущей плашкой, плоские группы задач */
.pj-modal .wm-hd-t .tp-namerow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pj-modal .wm-hd-t .pill{flex:none}
:root .pj-modal .proj-tgroup{background:none;border:0;box-shadow:none;padding:0;border-radius:0}
:root .pj-modal .proj-tgroup + .proj-tgroup{margin-top:18px}
:root .pj-modal .proj-tgroup .list{display:flex;flex-direction:column;gap:8px;margin-top:10px;border:0;background:none}
:root .pj-modal .proj-tgroup .row,:root .pj-modal .proj-dsec .row{background:var(--surface-3);border:0;border-radius:12px;padding:12px 14px;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}
:root .pj-modal .proj-tgroup .row[role="button"]{cursor:pointer}
:root .pj-modal .proj-tgroup .row[role="button"]:hover{transform:translateY(-2px);box-shadow:0 14px 26px -14px rgba(0,0,0,.7);background:var(--surface-3)}
:root .pj-modal .proj-tgroup .row[role="button"]:hover .t{color:var(--accent)}
:root .pj-modal .proj-dsec{background:none;border:0;padding:0}
:root .pj-modal .proj-dsec .list{display:flex;flex-direction:column;gap:8px;border:0;background:none;margin-top:10px}
:root .pj-modal .proj-detail-h{font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:-.01em;text-transform:none;color:var(--text)}
:root[data-theme="light"] .pj-modal .proj-tgroup .row,:root[data-theme="light"] .pj-modal .proj-dsec .row{background:#f1f1f1}

:root:not([data-theme="light"]) .pj-modal .proj-tgroup,:root:not([data-theme="light"]) .pj-modal .proj-dsec,:root[data-theme="light"] .pj-modal .proj-tgroup,:root[data-theme="light"] .pj-modal .proj-dsec{background:none;box-shadow:none;border-radius:0}
:root .pj-modal .proj-crew{grid-template-columns:minmax(0,1fr);gap:0}
:root .pj-modal .proj-tgroup .row,:root .pj-modal .proj-tgroup .row:last-child,:root .pj-modal .proj-tgroup .row + .row{margin:0;padding:12px 14px;border:0;border-radius:12px}
:root .pj-modal .proj-tgroup .tm-card-top{padding-bottom:0}
:root .pj-modal .wm-who{font-size:15px;font-weight:700;letter-spacing:0;gap:10px}
:root .pj-modal .wm-who .avatar{flex:none}
:root .pj-modal .wm-plate .stack{margin-top:6px}

/* задачи проекта: исполнитель внутри плашки вместе с его задачами */
:root:not([data-theme="light"]) .pj-modal .proj-tgroup,:root[data-theme="light"] .pj-modal .proj-tgroup{background:var(--surface-3);border-radius:14px;padding:14px 16px 6px;box-shadow:none}
:root[data-theme="light"] .pj-modal .proj-tgroup{background:#f1f1f1}
:root .pj-modal .proj-crew{gap:10px}
:root .pj-modal .proj-tgroup + .proj-tgroup{margin-top:0}
:root .pj-modal .proj-tgroup .tm-card-top{padding-bottom:10px;border-bottom:1px dashed var(--border-strong)}
:root .pj-modal .proj-tgroup .badge{background:var(--surface-2)}
:root .pj-modal .proj-tgroup .list{gap:0;margin-top:0}
:root .pj-modal .proj-tgroup .row,:root .pj-modal .proj-tgroup .row:last-child,:root .pj-modal .proj-tgroup .row + .row{background:none;border-radius:0;padding:12px 0;margin:0;box-shadow:none;transform:none}
:root .pj-modal .proj-tgroup .row + .row{border-top:1px dashed var(--border-strong)}
:root .pj-modal .proj-tgroup .row[role="button"]:hover{background:none;box-shadow:none;transform:none}

/* задача раскрывается прямо в плашке проекта */
.pj-task .row{cursor:pointer}
:root .pj-modal .proj-tgroup .row[role="button"]:hover .t{color:var(--accent)}
.pj-task-chev{flex:none;display:grid;place-items:center;width:24px;height:24px;color:var(--muted);transition:transform .25s cubic-bezier(.16,1,.3,1),color .15s}
.pj-task-chev .ico{width:16px;height:16px}
.pj-task.open .pj-task-chev{transform:rotate(180deg);color:var(--accent)}
.pj-task-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.16,1,.3,1)}
.pj-task.open .pj-task-body{grid-template-rows:1fr}
.pj-task-in{overflow:hidden;min-height:0;display:flex;flex-direction:column;gap:12px}
.pj-task.open .pj-task-in{padding:2px 0 14px}
.pjt-flow{display:flex;flex-wrap:wrap;gap:6px}
.pjt-flow .st{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:5px 12px;border-radius:999px;background:var(--surface-2);color:var(--muted)}
.pjt-flow .st .ico{width:13px;height:13px}
.pjt-flow .st.done{color:var(--text)}
.pjt-flow .st.cur,.pjt-flow .st.warn{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
.pjt-flow .st.bad{background:var(--crit-soft);color:var(--crit)}
.pjt-alert{display:flex;flex-direction:column;gap:2px;padding:10px 14px;border-radius:12px;background:var(--crit-soft);color:var(--crit);font-size:12.5px}
.pjt-alert b{font-size:13px}
.pjt-alert span{color:var(--text-2)}
.pjt-alert--n{background:var(--surface-2);color:var(--text)}
.pjt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px 18px}
.pjt-kv{display:flex;flex-direction:column;gap:2px}
.pjt-kv span{font-size:12px;color:var(--muted)}
.pjt-kv b{font-size:14px;font-weight:700;color:var(--text)}
.pjt-kv.crit b{color:var(--crit)}
.pjt-h{font-size:12px;color:var(--muted);margin-bottom:6px}
.pjt-gear{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.pjt-gi{display:flex;align-items:center;gap:10px;width:100%}
.pjt-gi .t{font-size:13px;font-weight:600}
.pjt-gi .m{font-size:12px;color:var(--muted)}
.pjt-acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
:root .pj-modal .pj-task .pay-hist-x{position:relative;overflow:hidden;width:28px;height:28px;border-radius:8px;flex:none}
@media(prefers-reduced-motion:reduce){.pj-task-body,.pj-task-chev{transition:none}}

/* карточки задач в модалке проекта */
.pj-cards{display:flex;flex-direction:column;gap:10px}
:root .pj-modal .pj-task{background:var(--surface-3);border-radius:14px;padding:0 16px;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}
:root .pj-modal .pj-task:not(.open):hover{transform:translateY(-2px);box-shadow:0 14px 26px -14px rgba(0,0,0,.7)}
:root[data-theme="light"] .pj-modal .pj-task{background:#f1f1f1}
.pj-tc{display:flex;align-items:center;gap:12px;padding:14px 0;cursor:pointer}
.pj-tc .avatar{flex:none}
.pj-tc-i{flex:1;min-width:0}
.pj-tc-t{font-size:14.5px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .15s}
.pj-tc:hover .pj-tc-t{color:var(--accent)}
.pj-tc-m{font-size:12.5px;color:var(--muted);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-tc-r{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.pj-tc-d{font-size:12.5px;color:var(--text-2)}
.pj-tc-d.overdue{color:var(--crit);font-weight:700}
.pj-task.open .pj-task-in{border-top:1px dashed var(--border-strong);padding-top:14px}
@media(max-width:560px){.pj-tc-m{white-space:normal}.pj-tc{flex-wrap:wrap}}

:root .pj-modal .pj-task .btn--edit{background:var(--surface-2)}
:root .pj-modal .pj-task .btn--edit:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
:root[data-theme="light"] .pj-modal .pj-task .btn--edit{background:#e4e4e4}
:root[data-theme="light"] .pj-modal .pj-task .btn--edit:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}

/* ——— задачи проекта v3: один список, строки с линиями, раскрытие с шагами ——— */
:root .pj-modal .pj-cards{gap:0;background:var(--surface-3);border-radius:14px;padding:0 6px;overflow:hidden}
:root[data-theme="light"] .pj-modal .pj-cards{background:#f1f1f1}
:root .pj-modal .pj-task,:root .pj-modal .pj-task:not(.open):hover{background:none;border-radius:0;padding:0 12px;transform:none;box-shadow:none}
:root .pj-modal .pj-task + .pj-task{border-top:1px solid var(--border)}
.pj-tc{gap:14px;padding:14px 0}
.pj-tc-t{font-size:14.5px;font-weight:700}
.pj-tc-m{font-size:12.5px;margin-top:2px}
.pj-tc-r{align-items:flex-end;gap:3px}
.pj-tc-s{font-size:12.5px;font-weight:700;color:var(--text)}
.pj-tc-s.progress{color:var(--accent)}
.pj-tc-s.review{color:var(--warn)}
.pj-tc-s.accepted{color:var(--ok)}
.pj-tc-s.late,.pj-tc-s.returned{color:var(--crit)}
.pj-tc-s.new,.pj-tc-s.waiting{color:var(--text-2)}
.pj-tc-d{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
:root .pj-modal .pj-task.open .pj-task-in{border-top:0;padding:0 0 16px 50px;gap:14px}
.pjt-steps{display:flex;align-items:flex-start}
.pjt-step{position:relative;flex:1;display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:600;color:var(--muted)}
.pjt-step i{position:relative;display:block;width:12px;height:12px;border-radius:50%;background:var(--surface-2);box-shadow:inset 0 0 0 2px var(--border-strong);z-index:1}
.pjt-step::before{content:"";position:absolute;top:5px;left:12px;right:-0;height:2px;background:var(--border-strong)}
.pjt-step:last-child::before{display:none}
.pjt-step.done i{background:var(--accent);box-shadow:none}
.pjt-step.done::before{background:var(--accent)}
.pjt-step.done{color:var(--text-2)}
.pjt-step.cur i{background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.pjt-step.cur{color:var(--text)}
.pjt-note{padding:9px 12px;border-radius:10px;background:var(--surface-2);font-size:12.5px;color:var(--text-2);line-height:1.45}
.pjt-note b{color:var(--text)}
.pjt-note--bad{background:var(--crit-soft)}
.pjt-note--bad b{color:var(--crit)}
.pjt-kvs{display:flex;flex-wrap:wrap;gap:10px 28px}
.pjt-kv{display:flex;flex-direction:column;gap:2px}
.pjt-kv span{font-size:12px;color:var(--muted)}
.pjt-kv b{font-size:14px;font-weight:700}
.pjt-gear{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.pjt-h{font-size:12px;color:var(--muted)}
.pjt-gi{display:flex;align-items:center;gap:10px;width:100%}
.pjt-gi .t{font-size:13px;font-weight:600}
.pjt-gi .m{flex:1;font-size:12px;color:var(--muted)}
.pjt-add{border:0;background:none;padding:0;font:inherit;font-size:12.5px;font-weight:700;color:var(--accent);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.pjt-add .ico{width:14px;height:14px}
.pjt-add:hover{text-decoration:underline}
.pjt-acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start}
.pjt-done{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--ok)}
.pjt-done .ico{width:15px;height:15px}
:root .pj-modal .pj-task .btn--edit{background:var(--surface-2)}
@media(max-width:560px){:root .pj-modal .pj-task.open .pj-task-in{padding-left:0}}

/* задачи проекта: отдельные плашки с зазором */
:root .pj-modal .pj-cards{gap:12px;background:none;padding:0;border-radius:0;overflow:visible}
:root[data-theme="light"] .pj-modal .pj-cards{background:none}
:root .pj-modal .pj-task,:root .pj-modal .pj-task + .pj-task{background:var(--surface-3);border-radius:14px;border:0;padding:2px 16px;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}
:root .pj-modal .pj-task:not(.open):hover{transform:translateY(-2px);box-shadow:0 14px 26px -14px rgba(0,0,0,.7)}
:root[data-theme="light"] .pj-modal .pj-task,:root[data-theme="light"] .pj-modal .pj-task + .pj-task{background:#f1f1f1}
:root .pj-modal .pj-task.open .pj-task-in{padding:0 0 16px 50px}

/* ——— карточки задач v4: сетка, цифры и сегментная шкала статуса ——— */
:root .pj-modal .pjc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;background:none;padding:0}
:root .pj-modal .pjc.pj-task,:root .pj-modal .pjc.pj-task + .pj-task{position:relative;padding:0;border:0;border-radius:18px;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015)),var(--surface-3);box-shadow:inset 0 0 0 1px var(--border);transition:transform .22s cubic-bezier(.16,1,.3,1),box-shadow .22s}
:root[data-theme="light"] .pj-modal .pjc.pj-task{background:#f1f1f1;box-shadow:none}
:root .pj-modal .pjc.pj-task:not(.open):hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px var(--accent),0 18px 30px -16px rgba(0,0,0,.75)}
:root .pj-modal .pjc.open{grid-column:1/-1}
.pjc-head{display:flex;flex-direction:column;gap:10px;padding:16px 18px 0;cursor:pointer}
.pjc-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pjc-d{font-size:12.5px;font-weight:600;color:var(--text-2);font-variant-numeric:tabular-nums}
.pjc-d.overdue{color:var(--crit);font-weight:700}
.pjc-t{font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:-.015em;line-height:1.2;color:var(--text);transition:color .15s}
.pjc-head:hover .pjc-t{color:var(--accent)}
.pjc-foot{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pjc-who{display:inline-flex;align-items:center;gap:8px;min-width:0;font-size:13px;font-weight:600;color:var(--text-2)}
.pjc-who span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pjc-h{font-family:var(--font-display);font-size:13.5px;font-weight:700;color:var(--text)}
.pjc-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:2px -18px 0;padding:0 18px 16px}
.pjc-bar .seg{position:relative;display:block;height:5px;border-radius:999px;background:var(--surface-2)}
.pjc-bar .seg.done{background:var(--accent);opacity:.55}
.pjc-bar .seg.cur{background:linear-gradient(90deg,#ff7a2e,#ff5d00);box-shadow:0 0 12px rgba(255,93,0,.6)}
.pjc-bar.late .seg.cur{background:var(--crit);box-shadow:0 0 12px rgba(255,80,80,.55)}
.pjc-bar .seg em{position:absolute;top:11px;left:0;font-style:normal;font-size:11.5px;font-weight:600;color:var(--muted);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s}
.pjc.open .pjc-bar{padding-bottom:32px}
.pjc.open .pjc-bar .seg em{opacity:1}
.pjc.open .pjc-bar .seg.cur em{color:var(--text)}
:root .pj-modal .pjc.pj-task.open .pj-task-in{padding:14px 18px 18px;border-top:1px dashed var(--border-strong);gap:14px}
.pjc .pj-task-chev{display:none}
@media(max-width:640px){:root .pj-modal .pjc-grid{grid-template-columns:minmax(0,1fr)}}

/* карточка задачи: без смены цвета названия, крупнее значения, аккуратный блок инвентаря */
:root .pj-modal .pjc-head:hover .pjc-t{color:var(--text)}
:root .pj-modal .pjc .pj-task-in{gap:18px}
:root .pj-modal .pjc .pjt-kvs{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px 28px}
:root .pj-modal .pjc .pjt-kv{gap:6px}
:root .pj-modal .pjc .pjt-kv span{font-size:14px;font-weight:500}
:root .pj-modal .pjc .pjt-kv b{font-size:18px;font-weight:700;letter-spacing:-.01em;font-family:var(--font-display)}
:root .pj-modal .pjc .pjt-gear{gap:10px;align-items:stretch}
:root .pj-modal .pjc .pjt-h{font-size:14px;font-weight:500;color:var(--muted)}
:root .pj-modal .pjc .pjt-gi{gap:12px;padding:12px 0;border-top:1px dashed var(--border-strong)}
:root .pj-modal .pjc .pjt-gi .t{font-size:15px;font-weight:700}
:root .pj-modal .pjc .pjt-gi .m{font-size:13.5px}
:root .pj-modal .pjc .pjt-add{align-self:flex-start;height:36px;padding:0 16px;border-radius:8px;background:transparent;box-shadow:inset 0 0 0 1.5px var(--field-border);color:var(--muted);font-size:13px;font-weight:600;text-decoration:none;transition:color .15s,box-shadow .2s,transform .15s}
:root .pj-modal .pjc .pjt-add:hover{color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent);text-decoration:none}
:root .pj-modal .pjc .pjt-add:active{transform:scale(.97)}
:root .pj-modal .pjc .pjt-note{font-size:13.5px;padding:12px 14px}

:root .pj-modal .pjc .pjt-add{height:33px;padding:0 15px;background:var(--surface-2);box-shadow:none;color:var(--text);font-size:12.5px;font-weight:600;text-decoration:none}
:root .pj-modal .pjc .pjt-add:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25);text-decoration:none}
.pjt-files{display:flex;flex-direction:column;gap:10px}
.pjt-fl{display:flex;flex-wrap:wrap;gap:8px}
.pjt-none{font-size:14px;color:var(--text-2)}
:root .pj-modal .pjc .pjt-file{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;max-width:100%;background:var(--surface-2)}
.pjt-file span{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pjt-file i{font-style:normal;font-size:12px;color:var(--muted);transition:color .15s}
.pjt-file:hover i{color:rgba(255,255,255,.85)}
:root .pj-modal .pjc .pjt-file .ico{width:15px;height:15px}

/* карточка задачи: без линии под шкалой, без оранжевой рамки, углы скруглены и при наведении */
:root .pj-modal .pjc.pj-task.open .pj-task-in{border-top:0;padding-top:4px}
:root .pj-modal .pjc.pj-task:not(.open):hover,:root .pj-modal .pjc.pj-task:hover{border-radius:18px;padding:0;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015)),var(--surface-3);transform:translateY(-3px);box-shadow:inset 0 0 0 1px var(--border),0 18px 30px -16px rgba(0,0,0,.75)}
:root[data-theme="light"] .pj-modal .pjc.pj-task:hover{background:#f1f1f1;box-shadow:0 18px 30px -16px rgba(0,0,0,.25)}
:root .pj-modal .pjc.pj-task.open:hover{transform:none}

:root .pj-modal .pjc-grid{grid-auto-flow:row dense}

/* состав и техника: ровные плашки, отступы между блоками и по краям */
:root .pj-modal .proj-detail .grid.g2,:root .pj-modal #projTabBody .grid.g2{display:flex;flex-direction:column;gap:24px}
:root .pj-modal .proj-dsec{display:flex;flex-direction:column;gap:12px;margin:0}
:root .pj-modal .proj-dsec .proj-detail-h{margin:0}
:root .pj-modal .proj-dsec .list{display:flex;flex-direction:column;gap:8px;margin:0;padding:0}
:root .pj-modal .proj-dsec .row,:root .pj-modal .proj-dsec .row:last-child,:root .pj-modal .proj-dsec .row + .row{margin:0;padding:12px 16px;border:0;border-radius:12px;background:var(--surface-3);box-shadow:none;gap:12px}
:root .pj-modal .proj-dsec .row .avatar{flex:none;width:40px;height:40px}
:root .pj-modal .proj-dsec .row .t{font-size:14px;font-weight:700}
:root .pj-modal .proj-dsec .row .m{font-size:12.5px;color:var(--muted)}
:root .pj-modal .proj-dsec .empty{padding:2px 0!important;font-size:13px;color:var(--muted)}
:root[data-theme="light"] .pj-modal .proj-dsec .row{background:#f1f1f1}

:root .pj-modal .proj-detail .grid.g2,:root .pj-modal #projTabBody .grid.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
@media(max-width:640px){:root .pj-modal .proj-detail .grid.g2,:root .pj-modal #projTabBody .grid.g2{grid-template-columns:minmax(0,1fr);gap:24px}}

/* вкладка «ТЗ» */
.tz{display:flex;flex-direction:column;gap:26px}
.tz-sec{display:flex;flex-direction:column;gap:14px}
.tz-h{font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:-.01em;color:var(--text)}
.tz-kvs{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px 28px}
.tz-kv{display:flex;flex-direction:column;gap:5px}
.tz-kv span{font-size:13.5px;color:var(--muted)}
.tz-kv b{font-size:16px;font-weight:700;color:var(--text)}
.tz-vids{display:flex;flex-wrap:wrap;gap:8px}
/* .tz-vid — не только внутри .tz-vids (flex, там всё ок), но и в «Ролики — сценарии и параметры»
   несколько штук просто через пробел в одной строке текста (см. scBody в projBriefExtra). Там
   это были обычные inline-спаны: длинный текст (цель ролика, имя сценариста и т.п.) переносился
   ВНУТРИ такого спана на 2-ю строку, а фон/скругление красились только у первой строки-фрагмента
   (так работает background у inline-элементов) — плашки визуально расползались и наезжали друг
   на друга. inline-block решает: это уже цельный блок, перенос остаётся, а фон покрывает его
   целиком одним прямоугольником. */
.tz-vid{display:inline-block;max-width:100%;margin:0 4px 6px 0;padding:7px 14px;border-radius:8px;background:var(--surface-3);font-size:12.5px;font-weight:600;color:var(--text);vertical-align:top}
.tz-legal{margin:0;padding:2px 0 2px 16px;border-left:3px solid var(--accent);font-size:14px;line-height:1.7;color:var(--text-2)}
.tz-parties{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tz-party{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border-radius:14px;background:var(--surface-3)}
.tz-pt{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;color:var(--muted);margin-bottom:6px}
.tz-st{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;color:var(--muted)}
.tz-st .ico{width:14px;height:14px}
.tz-party.ok .tz-st{color:var(--ok)}
.tz-pn{font-size:16px;font-weight:700;color:var(--text)}
.tz-pm{font-size:13.5px;color:var(--text-2)}
.tz-pd{font-size:13px;color:var(--muted);margin-top:4px}
.tz-final{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:600;color:var(--muted)}
.tz-fi{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--border-strong);flex:none}
.tz-fi .ico{width:14px;height:14px}
.tz-final.ok{color:var(--text)}
.tz-final.ok .tz-fi{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:none}
:root[data-theme="light"] .tz-party,:root[data-theme="light"] .tz-vid{background:#f1f1f1}
@media(max-width:640px){.tz-parties{grid-template-columns:minmax(0,1fr)}}

/* тень карточек задач — как у карточек проектов */
:root .pj-modal .pjc.pj-task{box-shadow:inset 0 0 0 1px var(--border),0 10px 24px -14px rgba(0,0,0,.7)}
:root .pj-modal .pjc.pj-task:not(.open):hover,:root .pj-modal .pjc.pj-task:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--border),0 16px 30px -14px rgba(0,0,0,.8)}
:root .pj-modal .pjc.pj-task.open:hover{transform:none;box-shadow:inset 0 0 0 1px var(--border),0 10px 24px -14px rgba(0,0,0,.7)}
:root[data-theme="light"] .pj-modal .pjc.pj-task{box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}
:root[data-theme="light"] .pj-modal .pjc.pj-task:hover{box-shadow:0 2px 4px rgba(0,0,0,.2),0 16px 28px -14px rgba(0,0,0,.6)}
:root[data-theme="light"] .pj-modal .pjc.pj-task.open:hover{box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}

/* Проекты и задачи: цифры плашек крупнее */
:root .main[data-view="projects"] .pj-kpi .v{font-size:32px;line-height:1.25}

:root .kb-f .exq-seg{align-self:flex-start}

/* выходные и новая задача: всплывающие списки и календарь не выходят за модалку */
:root .dq-modal .att-cal{position:static;display:block}
:root .dq-modal .att-cal-pop{position:static;width:100%;max-width:340px;margin:8px 0 0;box-shadow:0 0 0 1px var(--border-strong);animation:none}
:root .dq-modal .dd-menu{max-height:210px;overflow-y:auto}
button.wk-off{border:0;font:inherit;cursor:pointer;text-align:left;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}
button.wk-off:hover{transform:translateY(-2px);box-shadow:0 12px 22px -12px rgba(0,0,0,.6)}

:root .dq-modal .dd .dd-menu{max-height:200px!important;overflow-y:auto!important}

:root .do-modal .dd .dd-menu{top:auto!important;bottom:calc(100% + 6px)!important}

/* бронирование (инвентарь/подрядчики) на телефоне: список проектов открывался вниз и раздвигал
   модалку/подсказки под собой — просили открывать вверх, поверх остального, без нового места */
@media(max-width:640px){
  #gbProject .dd-menu,#abProject .dd-menu{top:auto!important;bottom:calc(100% + 6px)!important;transform-origin:bottom center}
}

/* выходные в календаре недели: без фона и приподнимания, при наведении оранжевый текст и иконка */
button.wk-off{background:none;padding:0;transition:color .15s}
button.wk-off:hover,button.wk-off:hover .ico{transform:none;box-shadow:none;background:none;color:var(--accent)}
.cell .ev[onclick="addDayOff()"]{transition:color .15s}
.cell .ev[onclick="addDayOff()"]:hover{background:none;color:var(--accent)}

/* плашка времени съёмки в календаре недели — градиент как у «Новый проект» */
:root .wk-ev b{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 6px 12px -6px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}

button.wk-off{transition:color .15s,transform .2s cubic-bezier(.16,1,.3,1)}
button.wk-off:hover{transform:translateY(-2px);color:var(--accent)}
button.wk-off:hover .ico{color:var(--accent)}
.cell .ev[onclick="addDayOff()"]{transition:color .15s,transform .2s cubic-bezier(.16,1,.3,1)}
.cell .ev[onclick="addDayOff()"]:hover{transform:translateY(-2px);color:var(--accent)}

/* Новый проект: поля, списки, плашки и рейка шагов в общем стиле */
:root .main[data-view="newproject"] .page input.in,:root .main[data-view="newproject"] .page textarea.in,:root .main[data-view="newproject"] .page .dd-trigger:not(.tm-kb),:root .main[data-view="newproject"] .page .att-cal-trig{border:0!important;border-radius:12px;background:var(--surface-3)!important;color:var(--text);font-size:13.5px;font-weight:600;box-shadow:inset 0 0 0 1.5px transparent;transition:box-shadow .18s,background .18s}
:root .main[data-view="newproject"] .page input.in,:root .main[data-view="newproject"] .page .dd-trigger:not(.tm-kb),:root .main[data-view="newproject"] .page .att-cal-trig{height:42px;padding:0 16px}
:root .main[data-view="newproject"] .page textarea.in{padding:12px 16px;line-height:1.5}
:root .main[data-view="newproject"] .page .dd-trigger:not(.tm-kb){padding:0 14px 0 16px}
:root .main[data-view="newproject"] .page input.in::placeholder,:root .main[data-view="newproject"] .page textarea.in::placeholder{color:var(--muted);font-weight:500}
:root .main[data-view="newproject"] .page input.in:hover,:root .main[data-view="newproject"] .page textarea.in:hover,:root .main[data-view="newproject"] .page .dd:not(.open) .dd-trigger:not(.tm-kb):hover,:root .main[data-view="newproject"] .page .att-cal-trig:hover{background:var(--surface-2)!important}
:root .main[data-view="newproject"] .page input.in:focus,:root .main[data-view="newproject"] .page textarea.in:focus,:root .main[data-view="newproject"] .page .dd.open .dd-trigger:not(.tm-kb),:root .main[data-view="newproject"] .page .att-cal.open .att-cal-trig{background:var(--surface)!important;box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)!important}
:root .main[data-view="newproject"] .page input.in.bad,:root .main[data-view="newproject"] .page .dd-trigger.bad,:root .main[data-view="newproject"] .page .att-cal-trig.bad{box-shadow:inset 0 0 0 1.5px var(--crit)!important;background:var(--crit-soft)!important}
:root[data-theme="light"] .main[data-view="newproject"] .page input.in,:root[data-theme="light"] .main[data-view="newproject"] .page textarea.in,:root[data-theme="light"] .main[data-view="newproject"] .page .dd-trigger:not(.tm-kb),:root[data-theme="light"] .main[data-view="newproject"] .page .att-cal-trig{background:#f1f1f1!important}
:root[data-theme="light"] .main[data-view="newproject"] .page input.in:focus,:root[data-theme="light"] .main[data-view="newproject"] .page .dd.open .dd-trigger:not(.tm-kb){background:#fff!important}
/* стеклянные меню */
.main[data-view="newproject"] .page .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.main[data-view="newproject"] .page .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.main[data-view="newproject"] .page .dd-opt + .dd-opt{margin-top:2px}
.main[data-view="newproject"] .page .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .main[data-view="newproject"] .page .dd-menu .dd-opt.on,:root .main[data-view="newproject"] .page .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.main[data-view="newproject"] .page .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .main[data-view="newproject"] .page .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .main[data-view="newproject"] .page .dd-opt:hover{background:#f1f1f1}
/* плашки-реквизиты: серые, подписи без капса */
:root .main[data-view="newproject"] .page .wz-meta-chip{background:var(--surface-3);box-shadow:none;border:0;border-radius:14px}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-meta-chip{background:#f1f1f1}
:root .main[data-view="newproject"] .page .wz-meta-chip .l{font-size:13.5px;font-weight:500;text-transform:none;letter-spacing:0;color:var(--muted)}

:root .main[data-view="newproject"] .page .wz-meta-chip input.in,:root .main[data-view="newproject"] .page .wz-meta-chip textarea.in{background:var(--surface-2)!important}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-meta-chip input.in{background:#e6e6e6!important}

:root .main[data-view="newproject"] .page .wz-meta-chip textarea.in.wz-ta{min-height:42px;padding:10px 16px;line-height:1.5;resize:none;overflow:hidden;font-size:13.5px;font-weight:600;margin-top:2px}

:root[data-theme="light"] .main[data-view="newproject"] .page .wz-meta-chip input.in,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-meta-chip textarea.in{background:#e6e6e6!important}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-meta-chip input.in:focus,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-meta-chip textarea.in:focus,:root .main[data-view="newproject"] .page .wz-meta-chip textarea.in:focus,:root .main[data-view="newproject"] .page .wz-meta-chip input.in:focus{background:var(--surface)!important}

/* Новый проект · шаг «Проект»: календарь съёмок и счётчик в общем стиле */
:root .main[data-view="newproject"] .page .wz-cal-hd b{font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:-.01em}
:root .main[data-view="newproject"] .page .wz-cal-hd button{width:32px;height:32px;border:0;border-radius:50%;background:var(--surface-2);color:var(--text);transition:background .15s,color .15s}
:root .main[data-view="newproject"] .page .wz-cal-hd button:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;border:0}
:root .main[data-view="newproject"] .page .wz-cal-g2{gap:5px}
:root .main[data-view="newproject"] .page .wz-cd2{height:44px;border-radius:12px;background:var(--surface-2);padding:7px 9px;transition:background .15s,box-shadow .15s,transform .15s}
:root .main[data-view="newproject"] .page .wz-cd2:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 18px -12px rgba(0,0,0,.7)}
:root .main[data-view="newproject"] .page .wz-cd2.lv1{background:rgba(255,93,0,.16)}
:root .main[data-view="newproject"] .page .wz-cd2.lv2{background:rgba(255,93,0,.38)}
:root .main[data-view="newproject"] .page .wz-cd2.lv3{background:linear-gradient(180deg,#ff7a2e,#ff5d00);box-shadow:0 8px 16px -10px rgba(255,93,0,.8)}
:root .main[data-view="newproject"] .page .wz-cd2.lv1 .n,:root .main[data-view="newproject"] .page .wz-cd2.lv1 .c,:root .main[data-view="newproject"] .page .wz-cd2.lv1 .cam{color:var(--accent)}
:root .main[data-view="newproject"] .page .wz-cd2.lv2 .n,:root .main[data-view="newproject"] .page .wz-cd2.lv2 .c,:root .main[data-view="newproject"] .page .wz-cd2.lv2 .cam{color:var(--text)}
:root .main[data-view="newproject"] .page .wz-cd2.lv3 .n,:root .main[data-view="newproject"] .page .wz-cd2.lv3 .c,:root .main[data-view="newproject"] .page .wz-cd2.lv3 .cam{color:#fff}
:root .main[data-view="newproject"] .page .wz-cd2.focus,:root .main[data-view="newproject"] .page .wz-cd2.focus:hover{box-shadow:inset 0 0 0 2px var(--accent),0 0 0 3px var(--accent-soft)}
:root .main[data-view="newproject"] .page .wz-cd2.today .n{color:var(--accent);font-weight:800}
:root .main[data-view="newproject"] .page .wz-stepper{height:42px;border:0;border-radius:999px;background:var(--surface-2);box-shadow:none;padding:0 4px;gap:2px}
:root .main[data-view="newproject"] .page .wz-stepper button{width:34px;height:34px;border-radius:50%;background:transparent;color:var(--text)}
:root .main[data-view="newproject"] .page .wz-stepper button:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
:root .main[data-view="newproject"] .page .wz-stepper:hover{border:0}
:root .main[data-view="newproject"] .page .wz-stepper .val{min-width:52px;font-family:var(--font-display);font-size:16px;font-weight:700}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-cd2{background:#e9e9e9}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-cd2.lv1{background:rgba(255,93,0,.16)}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-cd2.lv2{background:rgba(255,93,0,.38)}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-stepper{background:#e6e6e6}

/* Новый проект · форма дня, операторы, план и срок сдачи */
:root .main[data-view="newproject"] .page .wz-df-vid .wz-stepper{width:auto;min-width:150px;overflow:visible}
:root .main[data-view="newproject"] .page .wz-df-vid .wz-stepper button{width:34px;flex:none}
:root .main[data-view="newproject"] .page .wz-cd2.focus,:root .main[data-view="newproject"] .page .wz-cd2.focus:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);box-shadow:0 8px 16px -8px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25);transform:none}
:root .main[data-view="newproject"] .page .wz-cd2.focus .n,:root .main[data-view="newproject"] .page .wz-cd2.focus .c,:root .main[data-view="newproject"] .page .wz-cd2.focus .cam{color:#fff}
:root .main[data-view="newproject"] .page .wz-oc{border:0;border-radius:12px;background:var(--surface-2);padding:11px 14px;gap:3px;transition:background .18s,color .18s,transform .18s,box-shadow .25s}
:root .main[data-view="newproject"] .page .wz-oc b{font-size:13.5px;font-weight:700}
:root .main[data-view="newproject"] .page .wz-oc span{font-size:12px}
:root .main[data-view="newproject"] .page .wz-oc:hover:not(:disabled):not(.on){background:var(--surface);transform:translateY(-2px)}
:root .main[data-view="newproject"] .page .wz-oc:active:not(:disabled){transform:scale(.97)}
:root .main[data-view="newproject"] .page .wz-oc.on,:root .main[data-view="newproject"] .page .wz-oc.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:none;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
:root .main[data-view="newproject"] .page .wz-oc.on b,:root .main[data-view="newproject"] .page .wz-oc.on span{color:#fff}
:root .main[data-view="newproject"] .page .wz-oc.on span{opacity:.85}
:root .main[data-view="newproject"] .page .wz-oc i{background:#fff;color:#ff5d00;top:10px;right:10px}
:root .main[data-view="newproject"] .page .wz-pl2{background:var(--surface-3);border:0;border-radius:14px;box-shadow:none}
:root .main[data-view="newproject"] .page .wz-pd{background:var(--surface-2);border:0;box-shadow:none}
:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig,:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig.set,:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig.bad{width:100%;max-width:280px;height:44px;padding:0 14px 0 8px;gap:12px;border:0;border-radius:12px;background:var(--surface-2)!important;color:var(--text);font-size:14px;font-weight:700;box-shadow:none}
:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig:hover{background:var(--surface)!important}
:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig.bad{box-shadow:inset 0 0 0 1.5px var(--crit)!important}
:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig > svg:first-child,:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig.set > svg:first-child{width:30px;height:30px;padding:7px;box-sizing:border-box;border-radius:50%;background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 6px 12px -6px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25);flex:none}
:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig .chev{color:var(--muted)}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-oc{background:#e6e6e6}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-pl2{background:#f1f1f1}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-pd,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-dl .att-cal-trig{background:#e6e6e6!important}

:root .main[data-view="newproject"] .page .wz-df-vid{align-items:center;gap:16px}
:root .main[data-view="newproject"] .page .wz-df-vid .wz-f{width:auto;flex:none;gap:6px}
:root .main[data-view="newproject"] .page .wz-df-vid .wz-f>span{font-size:13.5px;font-weight:500}
:root .main[data-view="newproject"] .page .wz-df-vid .hint{margin:22px 0 0}

:root .main[data-view="newproject"] .page .wz-pl2{padding:16px 16px 8px}
:root .main[data-view="newproject"] .page .wz-pl2-hd{margin-bottom:12px}
:root .main[data-view="newproject"] .page .wz-sd-act .btn--edit{background:var(--surface-2)}
:root .main[data-view="newproject"] .page .wz-sd-act .btn--edit:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}

/* иконка календаря в сроке сдачи — просто оранжевая, без плашки */
:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig > svg:first-child,:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig.set > svg:first-child{width:20px;height:20px;padding:0;border-radius:0;background:none;box-shadow:none;color:var(--accent)}
:root .main[data-view="newproject"] .page .wz-dl .att-cal-trig{padding:0 14px 0 14px;gap:10px}

/* светлая тема: выбранные операторы и дни остаются оранжевыми */
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-oc.on,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-oc.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-cd2.lv3,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-cd2.focus,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-cd2.focus:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}

/* Новый проект · шаг «Ролики» */
:root .main[data-view="newproject"] .page .wz-vc .wz-stepper{background:var(--surface-3)}
:root .main[data-view="newproject"] .page .wz-vc .wz-stepper--in .val{color:var(--text);font-family:var(--font-display);font-size:16px;font-weight:700}
:root .main[data-view="newproject"] .page .wz-stepper--in:focus-within{box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft);border:0}
:root .main[data-view="newproject"] .page .wz-stepper--in.bad{box-shadow:inset 0 0 0 1.5px var(--crit);background:var(--crit-soft)}
:root .main[data-view="newproject"] .page .wz-ro{height:42px;padding:0 16px;border:0;border-radius:12px;background:var(--surface-3);font-size:13.5px;font-weight:600;color:var(--muted)}
:root .main[data-view="newproject"] .page .wz-pc{border:0;border-radius:12px;background:var(--surface-3);padding:13px 14px;transition:background .18s,color .18s,transform .18s,box-shadow .25s}
/* карточки сотрудников (.wz-pc) вне .wz-vc — например AI-специалист в блоке ИИ-интеграция — сидят прямо
   в .wz-meta-chip, у которой тот же фон --surface-3, что и у самой карточки: без переопределения фон «пропадает» */
:root .main[data-view="newproject"] .page .wz-meta-chip .wz-pc:not(.on){background:var(--surface-2)}
:root .main[data-view="newproject"] .page .wz-meta-chip .wz-pc:not(.on):hover{background:var(--surface)}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-meta-chip .wz-pc:not(.on){background:#e6e6e6}
:root .main[data-view="newproject"] .page .wz-pc:hover:not(.on){background:var(--surface);transform:translateY(-2px)}
:root .main[data-view="newproject"] .page .wz-pc:active{transform:scale(.98)}
:root .main[data-view="newproject"] .page .wz-pc.on,:root .main[data-view="newproject"] .page .wz-pc.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:none;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
:root .main[data-view="newproject"] .page .wz-pc.on .t b,:root .main[data-view="newproject"] .page .wz-pc.on .n,:root .main[data-view="newproject"] .page .wz-pc.on .n small{color:#fff}
:root .main[data-view="newproject"] .page .wz-pc.on .wz-lv{background:rgba(255,255,255,.22);color:#fff}
:root .main[data-view="newproject"] .page .wz-pc .ck{background:#fff;color:#ff5d00}
:root .main[data-view="newproject"] .page .wz-pkc2.bad .wz-pc:not(.on){background:var(--crit-soft);box-shadow:inset 0 0 0 1.5px var(--crit)}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-vc .wz-stepper,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-ro,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-pc:not(.on){background:#e6e6e6}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-pc.on,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-pc.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}

/* «Прикрепить файл» в мастере — как «Редактировать» */
:root .main[data-view="newproject"] .page label.btn--ghost,:root .main[data-view="newproject"] .page .btn--ghost{border:0;border-radius:8px;background:var(--surface-3);color:var(--text);box-shadow:none;transition:background .15s,color .15s,box-shadow .2s,transform .15s}
:root .main[data-view="newproject"] .page label.btn--ghost:hover,:root .main[data-view="newproject"] .page .btn--ghost:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
:root .main[data-view="newproject"] .page .wz-vc label.btn--ghost,:root .main[data-view="newproject"] .page .wz-vc .btn--ghost{background:var(--surface-3)}
:root[data-theme="light"] .main[data-view="newproject"] .page label.btn--ghost,:root[data-theme="light"] .main[data-view="newproject"] .page .btn--ghost{background:#e6e6e6}
:root[data-theme="light"] .main[data-view="newproject"] .page label.btn--ghost:hover,:root[data-theme="light"] .main[data-view="newproject"] .page .btn--ghost:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}

/* карточки роликов и правил — серые; поля внутри чуть темнее */
:root .main[data-view="newproject"] .page .wz-stepper button{flex:none;min-width:34px}
:root .main[data-view="newproject"] .page .wz-vc,:root .main[data-view="newproject"] .page .wz-rule{background:var(--surface-3);border:0;box-shadow:none}
:root .main[data-view="newproject"] .page .wz-vc input.in,:root .main[data-view="newproject"] .page .wz-vc textarea.in,:root .main[data-view="newproject"] .page .wz-vc .dd-trigger:not(.tm-kb),:root .main[data-view="newproject"] .page .wz-vc .att-cal-trig,:root .main[data-view="newproject"] .page .wz-vc .wz-stepper,:root .main[data-view="newproject"] .page .wz-vc .wz-ro,:root .main[data-view="newproject"] .page .wz-vc .wz-pc:not(.on){background:var(--surface-2)!important}
:root .main[data-view="newproject"] .page .wz-vc input.in:hover,:root .main[data-view="newproject"] .page .wz-vc .dd:not(.open) .dd-trigger:not(.tm-kb):hover,:root .main[data-view="newproject"] .page .wz-vc .wz-pc:not(.on):hover{background:var(--surface)!important}
:root .main[data-view="newproject"] .page .wz-vc input.in:focus,:root .main[data-view="newproject"] .page .wz-vc .dd.open .dd-trigger:not(.tm-kb){background:var(--surface)!important}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-vc,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-rule{background:#f1f1f1}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-vc input.in,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-vc .dd-trigger:not(.tm-kb),:root[data-theme="light"] .main[data-view="newproject"] .page .wz-vc .wz-stepper,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-vc .wz-ro,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-vc .wz-pc:not(.on){background:#e6e6e6!important}

/* Новый проект · шаги «Съёмка»–«Сценарии»: кнопки и переключатели */
:root .main[data-view="newproject"] .page .wz-shell-body .btn:not(.btn--primary):not(.btn--ghost):not(.kb-add){border:0;border-radius:8px;background:var(--surface-2);color:var(--text);box-shadow:none;transition:background .15s,color .15s,box-shadow .2s,transform .15s}
:root .main[data-view="newproject"] .page .wz-shell-body .btn:not(.btn--primary):not(.btn--ghost):not(.kb-add):hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
:root .main[data-view="newproject"] .page .wz-shell-body .btn .ico{transition:transform .25s}
:root .main[data-view="newproject"] .page .wz-pill{border:0;background:var(--surface-2);color:var(--text);transition:background .18s,color .18s,transform .18s,box-shadow .25s}
:root .main[data-view="newproject"] .page .wz-pill:hover:not(.on){background:var(--surface);transform:translateY(-1px)}
:root .main[data-view="newproject"] .page .wz-pill:active{transform:scale(.97)}
:root .main[data-view="newproject"] .page .wz-pill.on,:root .main[data-view="newproject"] .page .wz-pill.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:none;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
:root .main[data-view="newproject"] .page .wz-pills.bad .wz-pill:not(.on){background:var(--crit-soft);box-shadow:inset 0 0 0 1.5px var(--crit)}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-shell-body .btn:not(.btn--primary):not(.btn--ghost):not(.kb-add),:root[data-theme="light"] .main[data-view="newproject"] .page .wz-pill:not(.on){background:#e6e6e6}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-shell-body .btn:not(.btn--primary):not(.btn--ghost):not(.kb-add):hover,:root[data-theme="light"] .main[data-view="newproject"] .page .wz-pill.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}

:root .main[data-view="newproject"] .page .wz-shell-body label.btn--ghost,:root .main[data-view="newproject"] .page .wz-shell-body .btn--ghost{background:var(--surface-2)}
:root .main[data-view="newproject"] .page .wz-shell-body label.btn--ghost:hover,:root .main[data-view="newproject"] .page .wz-shell-body .btn--ghost:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-shell-body label.btn--ghost{background:#e6e6e6}

/* Новый проект · шаг «Утверждение» */
:root .main[data-view="newproject"] .page .wz-meta-chip .wz-f>span{font-size:13.5px;font-weight:500;color:var(--muted)}
:root .main[data-view="newproject"] .page .wz-legal{background:none;padding:2px 0 2px 16px;border-radius:0;border-left:3px solid var(--accent);box-shadow:none}
:root .main[data-view="newproject"] .page .wz-legal p{margin:0;font-size:14px;line-height:1.7;color:var(--text-2)}

/* Новый проект · шаг «Утверждение»: задачи проекта */
.tkp{display:flex;flex-direction:column;gap:22px;margin-top:6px}
.tkp-g{display:flex;flex-direction:column;gap:12px}
.tkp-h{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:-.01em;color:var(--text)}
.tkp-list{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:stretch}
.tkp-c{display:flex;flex-direction:column;gap:10px;padding:16px 18px;border-radius:16px;background:var(--surface-3)}
.tkp-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.tkp-t{font-family:var(--font-display);font-size:16px;font-weight:700;letter-spacing:-.01em;line-height:1.25;color:var(--text)}
.tkp-d{flex:none;max-width:45%;font-size:12.5px;font-weight:600;color:var(--accent);text-align:right;line-height:1.3}
.tkp-who{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--text-2)}
.tkp-who b{font-weight:600;color:var(--text)}
.tkp-who span{font-size:12px;color:var(--muted)}
.tkp-av{width:34px;height:34px;font-size:12.5px;flex:none}
.tkp-kv{display:flex;flex-direction:column;gap:8px;margin-top:2px}
.tkp-r{display:grid;grid-template-columns:minmax(120px,200px) minmax(0,1fr);gap:12px;font-size:13.5px}
.tkp-filebtn{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:8px;background:var(--surface-2);color:var(--accent);font-size:12.5px;font-weight:600;text-decoration:none;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:fit-content}
.tkp-filebtn:hover{background:var(--accent-soft)}
.tkp-filebtn .ico{width:12px;height:12px;flex:none}
.tkp-r span{color:var(--muted)}
.tkp-r b{font-weight:600;color:var(--text);word-break:break-word}
:root[data-theme="light"] .tkp-c{background:#f1f1f1}
@media(max-width:820px){.tkp-list{grid-template-columns:minmax(0,1fr)}}
/* «Утверждение»: без серых плашек вокруг блоков подписей */
:root .main[data-view="newproject"] .page #tz-6 .wz-meta-chip{background:none;padding:0;border-radius:0}
:root .main[data-view="newproject"] .page #tz-6 .wz-meta-chip > .l{font-family:var(--font-display);font-size:15px;font-weight:600;color:var(--text);margin-bottom:6px}
:root .main[data-view="newproject"] .page #tz-6 .wz-legal{padding:2px 0 2px 16px}

:root .main[data-view="newproject"] .page #tz-6 .wz-f>span,:root .main[data-view="newproject"] .page #tz-6 .wz-vc-g .wz-f>span{font-size:13.5px;font-weight:500;color:var(--muted)}
:root .main[data-view="newproject"] .page #tz-6 .wz-two--top{margin-top:24px!important;gap:22px}

:root .main[data-view="newproject"] .page #tz-6 .wz-two--top{margin-top:40px!important;gap:40px}
:root .main[data-view="newproject"] .page #tz-6 .wz-meta-chip > .l{margin-bottom:12px}

/* календарь даты в «Клиент» и «Команда (PM)» открывается вверх */
:root .wz-apd .att-cal-pop,:root #tz-6 .att-cal-pop{top:auto!important;bottom:calc(100% + 8px)!important;left:0;right:auto}

/* рейка шагов мастера — стиль вкладок, как в модалке проекта */
:root .wz-steps{display:inline-flex;max-width:100%;gap:4px;padding:4px;border-radius:999px;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border);overflow-x:auto;scrollbar-width:none}
:root .wz-steps::-webkit-scrollbar{display:none}
:root .wz-steps .st{flex:none;min-width:0;padding:8px 16px;border-radius:999px;background:transparent;color:var(--muted);font-size:12.5px;font-weight:700;overflow:visible;text-overflow:clip;box-shadow:none;transform:none;transition:color .2s,background .2s}
:root .wz-steps .st:hover:not(.on){background:transparent;color:var(--text)}
:root .wz-steps .st.ok{background:transparent;color:var(--text-2);box-shadow:none}
:root .wz-steps .st.ok .ck{color:var(--accent);margin-right:5px}
:root .wz-steps .st.on,:root .wz-steps .st.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
:root[data-theme="light"] .wz-steps{background:#ececec;box-shadow:none}

/* рейка шагов мастера v3: пронумерованные шаги, соединённые линией */
:root .wz-steps{display:flex;align-items:center;gap:0;max-width:100%;padding:4px 2px 2px;border-radius:0;background:none;box-shadow:none;overflow-x:auto;counter-reset:wzs}
:root[data-theme="light"] .wz-steps{background:none;box-shadow:none}
:root .wz-steps .st{position:relative;display:flex;align-items:center;gap:10px;flex:1 0 auto;padding:0;border-radius:0;background:none;color:var(--muted);font-size:13px;font-weight:600;white-space:nowrap;box-shadow:none;transform:none;overflow:visible;text-overflow:clip;counter-increment:wzs}
:root .wz-steps .st:last-child{flex:0 0 auto}
:root .wz-steps .st::before{content:counter(wzs);flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--surface-2);box-shadow:inset 0 0 0 1.5px var(--border-strong);color:var(--muted);font-family:var(--font-display);font-size:13px;font-weight:700;transition:background .2s,color .2s,box-shadow .2s}
:root .wz-steps .st:not(:last-child)::after{content:"";flex:1;min-width:18px;height:2px;margin:0 12px;border-radius:2px;background:var(--border-strong);transition:background .25s}
:root .wz-steps .st .ck{display:none}
:root .wz-steps .st:hover:not(.on){background:none;color:var(--text)}
:root .wz-steps .st:hover:not(.on):not(.ok)::before{box-shadow:inset 0 0 0 1.5px var(--accent);color:var(--accent)}
:root .wz-steps .st.ok{background:none;color:var(--text-2)}
:root .wz-steps .st.ok::before{content:"✓";background:linear-gradient(180deg,#ff7a2e,#ff5d00);box-shadow:none;color:#fff;font-size:14px}
:root .wz-steps .st.ok::after{background:var(--accent)}
:root .wz-steps .st.on,:root .wz-steps .st.on:hover{background:none;color:var(--text);box-shadow:none;font-weight:700}
:root .wz-steps .st.on::before{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 0 0 4px var(--accent-soft),0 8px 16px -6px rgba(255,93,0,.7)}

/* рейка шагов мастера v4: ровно такие же вкладки, как в модалке проекта и карточке сотрудника */
:root .wz-steps{display:flex;flex-wrap:wrap;align-self:flex-start;gap:4px;width:fit-content;max-width:100%;padding:4px;border-radius:18px;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border);overflow:visible;counter-reset:none}
:root[data-theme="light"] .wz-steps{background:var(--surface-2);box-shadow:none}
:root .wz-steps .st{flex:none;display:inline-flex;align-items:center;gap:0;padding:7px 16px;border-radius:999px;background:transparent;color:var(--muted);font-size:12.5px;font-weight:700;white-space:nowrap;box-shadow:none;transform:none;counter-increment:none;transition:color .2s}
:root .wz-steps .st::before,:root .wz-steps .st::after,:root .wz-steps .st:not(:last-child)::after,:root .wz-steps .st.ok::before,:root .wz-steps .st.ok::after,:root .wz-steps .st.on::before{content:none;display:none}
:root .wz-steps .st:last-child{flex:none}
:root .wz-steps .st .ck{display:none}
:root .wz-steps .st:hover:not(.on){background:transparent;color:var(--text)}
:root .wz-steps .st.ok{background:transparent;color:var(--text-2)}
:root .wz-steps .st.on,:root .wz-steps .st.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;font-weight:700;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}

/* Финансы: вкладки и кнопки в общем стиле */
:root .fin-tabs{border-radius:18px;box-shadow:inset 0 0 0 1px var(--border)}
:root[data-theme="light"] .fin-tabs{box-shadow:none}
:root .fin-tabs button.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
:root .main[data-view="finance"] .btn--edit:disabled{opacity:.45;pointer-events:none}

/* Финансы: поиск, список категорий и кнопки в общем стиле */
:root .main[data-view="finance"] .kb-search{height:36px;border-radius:999px;padding:0 14px;gap:10px;background:var(--field);border:1px solid var(--field-border);transition:border-color .15s,background .15s,box-shadow .2s}
:root .main[data-view="finance"] .kb-search .ico{width:16px;height:16px}
:root .main[data-view="finance"] .kb-search:hover{background:var(--surface);border-color:var(--border-strong);box-shadow:none}
:root .main[data-view="finance"] .kb-search:focus-within{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft),0 14px 28px -14px rgba(0,0,0,.6)}
:root .main[data-view="finance"] .kb-search:focus-within .ico{color:var(--accent)}
:root .main[data-view="finance"] .kb-search input{height:34px}
:root .main[data-view="finance"] .dd-trigger:not(.tm-kb){height:36px;border-radius:999px;padding:0 12px 0 16px;gap:8px;font-size:12.5px;font-weight:700;background:var(--field);border:1px solid var(--field-border);color:var(--text);box-shadow:none}
:root .main[data-view="finance"] .dd:not(.open) .dd-trigger:not(.tm-kb):hover{background:var(--surface);border-color:var(--border-strong)}
:root .main[data-view="finance"] .dd.open .dd-trigger:not(.tm-kb){background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.main[data-view="finance"] .dd-menu{padding:6px;border-radius:16px;border:0;background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--border-strong),0 24px 48px -16px rgba(0,0,0,.8)}
.main[data-view="finance"] .dd-opt{height:38px;border-radius:10px;padding:0 12px;font-size:13px;font-weight:600;color:var(--text);transition:background .14s,color .14s,transform .14s}
.main[data-view="finance"] .dd-opt + .dd-opt{margin-top:2px}
.main[data-view="finance"] .dd-opt:hover{background:var(--surface-3);transform:translateX(2px)}
:root .main[data-view="finance"] .dd-menu .dd-opt.on,:root .main[data-view="finance"] .dd-menu .dd-opt.on:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)!important;color:#fff!important;transform:none!important;cursor:default;box-shadow:0 8px 16px -8px rgba(255,93,0,.7)!important}
.main[data-view="finance"] .dd-opt.on .ck{color:#fff}
:root[data-theme="light"] .main[data-view="finance"] .dd-menu{background:rgba(255,255,255,.96);box-shadow:0 0 0 1px #e6e6e6,0 24px 48px -20px rgba(0,0,0,.3)}
:root[data-theme="light"] .main[data-view="finance"] .dd-opt:hover{background:#f1f1f1}


:root .main[data-view="finance"] .pj-kpi .v,:root .main[data-view="finance"] .fin-kpi .v{font-size:32px;line-height:1.25}
:root .main[data-view="finance"] .pj-kpi .s{display:none}

/* модалка подключения таблиц */
.fin-modal .fin-sec{display:flex;flex-direction:column;gap:14px}
.fin-modal .fin-sec + .fin-sec{padding-top:20px;border-top:1px dashed var(--border-strong)}

:root .db-new.kb-add{height:42px;padding:0 20px;font-size:14px}

/* Уведомления: стеклянная панель, серые плашки */
:root .notif-pop{width:380px;max-height:min(76vh,520px);border:0;border-radius:20px;background:color-mix(in srgb,var(--surface) 94%,transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 0 0 1px var(--border-strong),0 28px 56px -18px rgba(0,0,0,.85)}
:root .notif-hd{padding:16px 16px 12px;border:0}
:root .notif-hd > span{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:700;letter-spacing:-.01em}
:root .notif-n{min-width:22px;height:22px;padding:0 7px;border-radius:999px;display:inline-grid;place-items:center;font-size:12px;font-weight:700;color:#fff;background:linear-gradient(180deg,#ff7a2e,#ff5d00)}
:root .notif-clear{height:34px;padding:0 14px;font-size:13px;color:var(--text)}
:root .notif-list{display:flex;flex-direction:column;gap:8px;padding:0 12px 12px}
:root .notif-row{align-items:center;gap:12px;padding:12px 12px 12px 14px;border-radius:14px;background:var(--surface-3);border:0;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}
:root .notif-row + .notif-row{border:0}
:root .notif-row:hover{background:var(--surface-3);transform:translateY(-2px);box-shadow:0 12px 22px -12px rgba(0,0,0,.7)}
:root .notif-ic{width:34px;height:34px;color:var(--accent)!important;background:var(--surface-2)!important}
:root .notif-ic svg{width:17px;height:17px}
:root .notif-b{flex:1;min-width:0}
:root .notif-tx{font-size:13.5px;font-weight:600;line-height:1.35}
:root .notif-mt{font-size:12px;margin-top:4px}
:root .notif-row .pay-hist-x{flex:none;position:relative;overflow:hidden;width:30px;height:30px;border-radius:8px;background:var(--surface-2);color:var(--text);transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s,background .15s,color .15s}
:root .notif-row .pay-hist-x svg{transition:transform .3s cubic-bezier(.16,1,.3,1)}
:root .notif-row .pay-hist-x:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px -10px rgba(255,93,0,.9),inset 0 1px 0 rgba(255,255,255,.3)}
:root .notif-row .pay-hist-x:hover svg{transform:rotate(90deg)}
:root .notif-row .pay-hist-x:active{transform:translateY(0) scale(.94)}
:root[data-theme="light"] :root .notif-row .pay-hist-x{background:#fff}
:root[data-theme="light"] :root .notif-row .pay-hist-x:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}
:root .notif-empty{padding:34px 14px;font-size:14px}
:root[data-theme="light"] .notif-pop{background:rgba(255,255,255,.97);box-shadow:0 0 0 1px #e6e6e6,0 28px 56px -22px rgba(0,0,0,.3)}
:root[data-theme="light"] .notif-row,:root[data-theme="light"] .notif-row:hover{background:#f1f1f1}
:root[data-theme="light"] .notif-ic{background:#fff!important}
@media(max-width:640px){:root .notif-pop{width:auto}}

/* Моя посещаемость: календарь месяца в общем стиле */
:root .att-heat-wd{padding:6px 24px 8px;gap:8px}
:root .att-heat-wd span{font-size:12.5px;font-weight:600}
:root .att-heat-grid{gap:8px;padding:0 24px}
:root .att-heat-d{aspect-ratio:auto;height:46px;border-radius:12px;font-size:14px;font-weight:700;background:var(--surface-3);color:var(--text)}
:root .att-heat-d.empty{background:none}
:root .att-heat-d.off{background:none;color:var(--muted);opacity:.55}
:root .att-heat-d.ok{background:var(--surface-3);color:var(--text)}
:root .att-heat-d.warn{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 16px -8px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.25)}
:root .att-heat-d.crit{background:var(--crit-soft);color:var(--crit)}
:root .att-heat-d.exc{background:var(--surface-3);color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent)}
:root .att-heat-legend{gap:18px;padding:16px 24px 22px;font-size:13px}
:root .att-heat-legend .d{width:12px;height:12px;border-radius:4px}
:root .att-heat-legend .d.ok{background:var(--surface-3);box-shadow:inset 0 0 0 1px var(--border-strong)}
:root .att-heat-legend .d.warn{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}
:root .att-heat-legend .d.crit{background:var(--crit)}
:root .att-heat-legend .d.exc{background:none;border:0;box-shadow:inset 0 0 0 1.5px var(--accent)}
:root[data-theme="light"] .att-heat-d,:root[data-theme="light"] .att-heat-d.ok{background:#f1f1f1;color:#111}
:root[data-theme="light"] .att-heat-d.empty,:root[data-theme="light"] .att-heat-d.off{background:none;color:#9a9a9a}
:root[data-theme="light"] .att-heat-d.warn{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
:root[data-theme="light"] .att-heat-d.crit{background:var(--crit-soft);color:var(--crit)}
:root[data-theme="light"] .att-heat-d.exc{background:#f1f1f1;color:var(--accent)}

/* Моя посещаемость: цифры плашками, календарь компактный рядом с таблицей */
:root .main[data-view="attendance"] .pj-kpi .v{font-size:32px;line-height:1.25}
:root .main[data-view="attendance"] .pj-kpi .v.warn{color:var(--accent)}
.att-me{display:grid;grid-template-columns:minmax(300px,360px) minmax(0,1fr);gap:16px;align-items:start}
@media(max-width:1000px){.att-me{grid-template-columns:minmax(0,1fr)}}
:root .att-heat-wd{padding:4px 20px 6px;gap:4px}
:root .att-heat-wd span{font-size:11.5px}
:root .att-heat-grid{gap:4px;padding:0 20px}
:root .att-heat-d{height:36px;border-radius:10px;font-size:13px}
:root .att-heat-legend{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;padding:16px 20px 20px;font-size:12.5px}

:root .att-heat-d.empty{height:36px;min-height:0;padding:0;aspect-ratio:auto}
:root .att-table--me col.c-sotr{width:110px}
:root .att-table--me col.c-arr,:root .att-table--me col.c-late{width:90px}
:root .att-table--me col.c-zone{width:100px}
:root .att-table--me col.c-pen{width:auto}

:root .att-table.att-table--me{min-width:0;width:100%}
:root .att-table--me col.c-sotr,:root .att-table--me col.c-arr,:root .att-table--me col.c-late,:root .att-table--me col.c-zone,:root .att-table--me col.c-pen{width:20%}
:root .att-table--me th,:root .att-table--me td{padding-left:14px;padding-right:14px;white-space:nowrap}
:root .att-table--me th:first-child,:root .att-table--me td:first-child{padding-left:24px}

/* Моя посещаемость: одинаковая фиксированная высота, листание месяцев и страниц */
:root .att-me > .card{height:auto;display:flex;flex-direction:column;margin:0}
:root .att-me > .att-heat{overflow:hidden}
:root .att-heat-hd{display:flex;align-items:center;justify-content:space-between}
:root .att-heat-mo{text-transform:capitalize}
:root .att-heat-nav{display:flex;gap:6px}
:root .att-heat-nav .att-cal-nav:disabled{opacity:.35;pointer-events:none}
:root .att-heat-legend{margin-top:auto}
:root .att-me > .card > .tablewrap{flex:1;min-height:0;overflow:hidden}
:root .att-me-foot{margin-top:auto;padding:12px 24px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--border)}
@media(max-width:1000px){:root .att-me > .card{height:auto;min-height:0}}

:root .att-heat-nav .att-cal-nav{position:relative;border:0;cursor:pointer;transition:background .15s,color .15s,transform .2s,box-shadow .2s}
:root .att-heat-nav .att-cal-nav:hover:not(:disabled),:root[data-theme="light"] .att-heat-nav .att-cal-nav:hover:not(:disabled){background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:translateY(-1px) scale(1.06);box-shadow:0 8px 16px -8px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
:root .att-heat-nav .att-cal-nav:active:not(:disabled){transform:scale(.94)}

:root .att-me .att-heat-d,:root .att-me .att-heat-d.empty{height:32px;border-radius:9px;font-size:12.5px}
:root .att-me .att-heat-legend{padding:10px 20px 14px;gap:8px 14px}
:root .att-table--me td,:root .att-table--me th{padding-top:8px;padding-bottom:8px}
:root .att-me-foot{padding:10px 24px 14px}

:root .att-me{align-items:stretch}
:root .att-me .att-heat-legend{margin-top:0}



/* Мои финансы: шапка-сводка, запросы и история */
.mf-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px;align-items:center;padding:26px 28px;border-radius:24px;background:linear-gradient(135deg,var(--surface-3),var(--surface));box-shadow:inset 0 0 0 1px var(--border)}
.mf-orb{position:absolute;right:-60px;top:-90px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(255,93,0,.42),rgba(255,93,0,0) 68%);pointer-events:none}
.mf-hl,.mf-hr{position:relative;display:flex;flex-direction:column;gap:14px;min-width:0}
.mf-hl .k{font-size:14px;font-weight:600;color:var(--text-2)}
.mf-hl .big{font-family:var(--font-display);font-size:48px;line-height:1.05;font-weight:700;letter-spacing:-.03em;color:var(--text);font-variant-numeric:tabular-nums}
.mf-hl .big i{font-style:normal;font-size:18px;font-weight:600;color:var(--muted);margin-left:8px;letter-spacing:0}
.mf-chips{display:flex;flex-wrap:wrap;gap:8px}
.mf-chips .c{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);font-size:13px;color:var(--text-2)}
.mf-chips .c b{font-weight:700;color:var(--text)}
.mf-chips .c b.ok{color:var(--ok)}
.mf-chips .c b.neg{color:var(--crit)}
.mf-prog .t{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13.5px;color:var(--text-2);margin-bottom:10px}
.mf-prog .t b{font-family:var(--font-display);font-size:18px;font-weight:700;color:var(--text)}
.mf-prog .t em{font-style:normal;font-size:13px;font-weight:500;color:var(--muted)}
.mf-prog .bar{height:12px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden}
.mf-prog .bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff7a2e,#ff5d00);box-shadow:0 0 14px rgba(255,93,0,.6)}
.mf-next{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mf-next > div{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.mf-next span{font-size:12.5px;color:var(--muted)}
.mf-next b{font-family:var(--font-display);font-size:18px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.mf-sec .card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px 12px}
.mf-sec .card-head h3{font-size:16px;font-weight:700}
.mf-reqs{display:flex;flex-direction:column;padding:0 8px 8px}
.mf-q{display:grid;grid-template-columns:36px minmax(0,1fr) 70px auto;column-gap:14px;align-items:center;padding:12px;border-radius:14px;transition:background .12s}
.mf-q + .mf-q{border-top:1px solid var(--border)}
.mf-q:hover{background:var(--surface-3)}
.mf-q .ic{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--surface-3);color:var(--accent)}
.mf-q .o{display:flex;flex-direction:column;gap:2px;min-width:0}
.mf-q .o b{font-size:14px;font-weight:600;color:var(--text)}
.mf-q .o span{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mf-q .d{font-size:12.5px;color:var(--muted)}
.mf-list{display:flex;flex-direction:column;padding:0 0 8px}
.mf-r{display:grid;grid-template-columns:minmax(0,1fr) 84px 96px 130px 34px;column-gap:16px;align-items:center;padding:10px 20px;border-top:1px solid var(--border);font-size:13px;transition:background .12s}
.mf-r:not(.mf-r--h):hover{background:var(--surface-3)}
.mf-r--h{border-top:0;padding-top:4px;padding-bottom:8px;font-size:12px;font-weight:600;color:var(--muted)}
.mf-r .o{display:flex;flex-direction:column;gap:2px;min-width:0}
.mf-r .o b{font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mf-r .o span{font-size:12px;color:var(--muted)}
.mf-r .d{color:var(--text-2);white-space:nowrap}
.mf-r .a{text-align:right;font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:600;color:var(--text);white-space:nowrap}
.mf-r .mf-ty{margin-left:0}
.mf-r.canc .a{text-decoration:line-through;color:var(--muted)}
.mf-r.canc .o b{color:var(--muted)}
.mf-r.canc .mf-ty{opacity:.45}
.mf-r .pay-hist-x{position:relative;overflow:hidden;width:30px;height:30px;border-radius:8px;justify-self:end;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s,background .15s,color .15s}
.mf-r .pay-hist-x svg{transition:transform .3s cubic-bezier(.16,1,.3,1)}
.mf-r .pay-hist-x:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:translateY(-2px);box-shadow:0 12px 22px -10px rgba(255,93,0,.9),inset 0 1px 0 rgba(255,255,255,.3)}
.mf-r .pay-hist-x:hover svg{transform:rotate(90deg)}
.mf-empty{padding:26px 20px;text-align:center;font-size:13.5px;color:var(--muted)}
.mf-tabs{margin:0}
:root[data-theme="light"] .mf-hero{background:linear-gradient(135deg,#fff,#f4f4f4);box-shadow:inset 0 0 0 1px #ececec}
:root[data-theme="light"] .mf-chips .c,:root[data-theme="light"] .mf-next > div{background:#f1f1f1;box-shadow:none}
:root[data-theme="light"] .mf-prog .bar{background:#e6e6e6}
:root[data-theme="light"] .mf-q .ic{background:#f1f1f1}
@media(max-width:1000px){.mf-hero{grid-template-columns:minmax(0,1fr)}.mf-hl .big{font-size:38px}}
@media(max-width:640px){.mf-r{grid-template-columns:minmax(0,1fr) 110px 30px}.mf-r .d,.mf-r .mf-ty{display:none}.mf-q{grid-template-columns:36px minmax(0,1fr) auto}.mf-q .d{display:none}}

/* переключатель истории — как вкладки в модалке сотрудника */
.mf-tabs.proj-tabs{display:inline-flex;align-self:center;gap:4px;border:0;margin:0;padding:4px;background:var(--surface-2);border-radius:999px;flex-wrap:nowrap}
.mf-tabs .proj-tab{padding:7px 16px;border:0;margin:0;border-radius:999px;font-size:12.5px;transition:background .15s,color .15s}
:root:not([data-theme="light"]) .mf-tabs.proj-tabs{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border)}

/* Дашборд проджект-менеджера */
.pm-db{display:flex;flex-direction:column;gap:16px}
.pm-more{padding:12px 20px;font-size:12.5px;color:var(--muted);border-top:1px solid var(--border);margin-top:auto}

/* Дашборд проджект-менеджера v3 */
.pmx-a,.pmx-b{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:16px;align-items:stretch}
.pmx-hero{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:20px;padding:28px 30px}
.pmx-ht{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.pmx-hero .db-hero-t h1{font-size:38px;margin:6px 0 16px}
.pmx-board{display:flex;flex-direction:column;gap:6px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}
.pmx-bl{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:4px}
.pmx-hero .db-axis,.pmx-hero .db-shoot{grid-template-columns:140px minmax(0,1fr)}
.pmx-hero .db-shoot .t{color:#fff}
.pmx-hero .db-none{color:rgba(255,255,255,.7)}
:root[data-theme="light"] .pmx-bl{color:#888}
:root[data-theme="light"] .pmx-board{border-top-color:rgba(0,0,0,.08)}
:root[data-theme="light"] .pmx-hero .db-shoot .t{color:#111}
:root[data-theme="light"] .pmx-hero .db-none{color:#666}
.pmx-me{display:flex;flex-direction:column;align-items:center;gap:14px;padding:22px 20px;cursor:pointer;text-align:center;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}
.pmx-me:hover{transform:translateY(-2px)}
.pmx-me .who{display:flex;align-items:center;gap:12px;align-self:stretch;text-align:left}
.pmx-me .who b{display:block;font-size:15px;font-weight:700}
.pmx-me .who span{font-size:12.5px;color:var(--muted)}
.pmx-me .ring{position:relative;width:150px;height:150px;flex:none}
.pmx-me .rg{position:absolute;inset:0;border-radius:50%;background:conic-gradient(#ff7a2e calc(var(--p)*3.6deg),color-mix(in srgb,var(--text) 12%,transparent) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 13px),#000 calc(100% - 12px));mask:radial-gradient(farthest-side,transparent calc(100% - 13px),#000 calc(100% - 12px));filter:drop-shadow(0 0 10px rgba(255,93,0,.45))}
.pmx-me .tx{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.pmx-me .tx b{font-family:var(--font-display);font-size:34px;font-weight:800;letter-spacing:-.03em;line-height:1}
.pmx-me .tx span{font-size:12px;font-weight:600;color:var(--muted);margin-top:4px}
.pmx-me .lv{display:flex;flex-direction:column;gap:2px}
.pmx-me .lv b{font-size:15px;font-weight:700;color:var(--accent)}
.pmx-me .lv span{font-size:12.5px;color:var(--muted)}
.pmx-me .st{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-self:stretch}
.pmx-me .st > div{display:flex;flex-direction:column;gap:2px;padding:10px 6px;border-radius:12px;background:var(--surface-3)}
.pmx-me .st b{font-family:var(--font-display);font-size:18px;font-weight:700}
.pmx-me .st span{font-size:11.5px;color:var(--muted)}
.pmx-me .at{display:flex;align-items:center;gap:12px;align-self:stretch;padding-top:12px;border-top:1px solid var(--border);font-size:12.5px;color:var(--text-2);text-align:left}
.pmx-me .at .db-dots{grid-template-columns:repeat(8,8px);gap:4px;flex:none}
.pmx-me .at .db-dots i{width:8px;height:8px}
.pmx-attn,.pmx-fin{display:flex;flex-direction:column;min-height:0}
.pmx-attn .db-ok{flex:1;justify-content:center;padding:28px 20px}
.pmx-fb{display:flex;flex-direction:column;gap:10px;padding:2px 20px 16px}
.pmx-fb .k{font-size:13px;color:var(--muted)}
.pmx-fb .big{font-family:var(--font-display);font-size:34px;font-weight:800;letter-spacing:-.03em;line-height:1.1;font-variant-numeric:tabular-nums}
.pmx-fb .big i{font-style:normal;font-size:14px;font-weight:600;color:var(--muted);margin-left:6px;letter-spacing:0}
.pmx-fb .bar{height:10px;border-radius:999px;background:color-mix(in srgb,var(--text) 12%,transparent);overflow:hidden}
.pmx-fb .bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff7a2e,#ff5d00);box-shadow:0 0 12px rgba(255,93,0,.55)}
.pmx-fb .sub{display:flex;justify-content:space-between;font-size:12.5px;color:var(--muted)}
.pmx-fr{flex:1;display:flex;flex-direction:column;border-top:1px solid var(--border)}
.pmx-fr .mf-q{grid-template-columns:32px minmax(0,1fr) auto;padding:10px 20px}
.pmx-fr .mf-q .ic{width:32px;height:32px}
.pmx-fr .db-ok{flex:1;justify-content:center}
.pmx-fa{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 20px 18px;border-top:1px solid var(--border)}
.pmx-fa .btn{justify-content:center}
.pmx-crew{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.pmx-tm{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:16px;background:var(--surface-2);cursor:pointer;box-shadow:inset 0 0 0 1px var(--border),0 10px 24px -14px rgba(0,0,0,.7);transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}
.pmx-tm:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--border),0 16px 30px -14px rgba(0,0,0,.8)}
.pmx-tm .top{display:flex;align-items:center;gap:10px;min-width:0}
.pmx-tm .who{display:flex;flex-direction:column;min-width:0}
.pmx-tm .who b{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pmx-tm .who span{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pmx-tm .num{display:flex;align-items:baseline;gap:8px}
.pmx-tm .num b{font-family:var(--font-display);font-size:28px;font-weight:800;line-height:1}
.pmx-tm .num span{font-size:12.5px;color:var(--muted)}
.pmx-tm .bar{height:8px;border-radius:999px;background:color-mix(in srgb,var(--text) 12%,transparent);overflow:hidden}
.pmx-tm .bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff7a2e,#ff5d00)}
.pmx-tm .bar.late i{background:linear-gradient(90deg,#ff8a8a,var(--crit))}
.pmx-tm .foot{font-size:12px;color:var(--muted)}
.pmx-tm .foot em{font-style:normal;color:var(--crit);font-weight:600}
:root[data-theme="light"] .pmx-tm{background:#fff;box-shadow:inset 0 0 0 1px #ececec}
:root[data-theme="light"] .pmx-me .st > div{background:#f1f1f1}
@media(max-width:1000px){.pmx-a,.pmx-b{grid-template-columns:minmax(0,1fr)}.pmx-crew{grid-template-columns:repeat(2,minmax(0,1fr))}.pmx-ht{flex-direction:column;align-items:flex-start}
  /* .pmx-ht в колонку — у .db-hero-t (дата+заголовок+чипсы) нет min-width:0/width:100% как
     у флекс-айтема с align-items:flex-start, поэтому он не сжимался под контент (чипсы —
     .db-chips) — весь ряд чипсов вылезал за карточку вместо переноса строк */
  .pmx-ht > .db-hero-t{width:100%;min-width:0}
}
.db-h button.link{background:none;border:0;cursor:pointer;padding:0;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--muted)}
.db-h button.link:hover{color:var(--accent)}

/* дашборд ПМ: приветствие на всю ширину, ниже три колонки */
.pmx-a{grid-template-columns:minmax(0,1fr)}
.pmx-b{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr)}
.pmx-hero .db-hero-t h1{white-space:nowrap}
@media(max-width:1100px){.pmx-b{grid-template-columns:minmax(0,1fr)}.pmx-hero .db-hero-t h1{white-space:normal}}

.pmx-me .xpn{display:flex;align-items:baseline;justify-content:center;gap:8px;padding:10px 0 4px}
.pmx-me .xpn b{font-family:var(--font-display);font-size:64px;font-weight:800;letter-spacing:-.04em;line-height:1}
.pmx-me .xpn span{font-size:16px;font-weight:700;color:var(--muted)}

/* дашборд ПМ: профиль и «Требует внимания» в два ряда, финансы ниже на всю ширину */
.pmx-b{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}
.pmx-b > .pmx-fin{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) auto;grid-template-rows:auto 1fr;align-items:stretch}
.pmx-fin > .fin-h{grid-column:1 / -1}
.pmx-fin .pmx-fb{justify-content:center;padding:8px 24px 22px}
.pmx-fin .pmx-fr{border-top:0;border-left:1px solid var(--border);justify-content:center}
.pmx-fin .pmx-fa{grid-template-columns:1fr;align-content:center;border-top:0;border-left:1px solid var(--border);padding:14px 24px 18px;min-width:190px}
@media(max-width:1100px){.pmx-b{grid-template-columns:minmax(0,1fr)}.pmx-b > .pmx-fin{grid-template-columns:minmax(0,1fr)}.pmx-fin .pmx-fr,.pmx-fin .pmx-fa{border-left:0;border-top:1px solid var(--border)}}

/* «Требует внимания»: отступы у позиций и листание по 3 */
.pmx-attn .pmx-list{display:flex;flex-direction:column;padding:0 6px}
.pmx-attn .db-q{position:relative;padding:16px 14px;border-radius:14px}
.pmx-attn .db-q + .db-q{border-top:0}
.pmx-attn .db-q + .db-q::before{content:"";position:absolute;left:14px;right:14px;top:0;height:1px;background:var(--border)}
.pmx-attn .db-q:hover{background:var(--surface-3)}
.pmx-attn .db-q:hover::before,.pmx-attn .db-q:hover + .db-q::before{opacity:0}
.pmx-pg{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding:12px 20px 16px;font-size:12.5px;color:var(--muted)}
.pmx-pg > div{display:flex;gap:6px}
.pmx-pg .att-cal-nav{position:relative;border:0;cursor:pointer;transition:background .15s,color .15s,transform .2s,box-shadow .2s}
.pmx-pg .att-cal-nav:hover:not(:disabled),:root[data-theme="light"] .pmx-pg .att-cal-nav:hover:not(:disabled){background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;transform:translateY(-1px) scale(1.06);box-shadow:0 8px 16px -8px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
.pmx-pg .att-cal-nav:disabled{opacity:.35;pointer-events:none}
.pmx-attn .db-q:first-child{padding-top:6px}
.pmx-attn .db-q:last-child{padding-bottom:6px}
.pmx-attn .db-q + .db-q::before{left:14px;right:14px}
.pmx-attn .pmx-list{padding:0;margin:0 -14px}
.pmx-attn .pmx-list{padding:0;margin:0}

/* дашборд ПМ: карточки профиля и «Требует внимания» ниже */
.pmx-me{padding:16px 18px;gap:8px}
.pmx-me .xpn{padding:2px 0 0}
.pmx-me .xpn b{font-size:52px}
.pmx-me .st > div{padding:8px 6px}
.pmx-me .at{padding-top:8px}
.pmx-attn .db-q{padding:11px 14px;min-height:0}
.pmx-attn .db-q:first-child{padding-top:4px}
.pmx-attn .db-q:last-child{padding-bottom:4px}
.pmx-pg{padding:8px 20px 12px}

.pmx-attn{padding:14px 20px;gap:4px}
.pmx-attn .db-q{padding:9px 14px}
.pmx-attn .db-q:first-child{padding-top:4px}
.pmx-attn .db-q:last-child{padding-bottom:4px}
.pmx-attn .pmx-pg{padding:4px 0 0}

/* Финансы на дашборде ПМ: без вертикальных линий, запросы серыми плашками */
.pmx-b > .pmx-fin{padding:18px 20px;column-gap:28px;row-gap:14px;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) 190px;align-items:center}
.pmx-fin .pmx-fb{padding:0;justify-content:center}
.pmx-fin .pmx-fr{border:0;padding:0;gap:8px;justify-content:center;align-self:stretch}
.pmx-fin .pmx-fr .mf-q,.pmx-fin .pmx-fr .mf-q:hover{padding:10px 14px;background:var(--surface-3);border-radius:14px;border:0;transition:none;transform:none;box-shadow:none}
.pmx-fin .pmx-fr .mf-q + .mf-q{border:0}
.pmx-fin .pmx-fr .mf-q .ic{background:var(--surface-2)}
.pmx-fin .pmx-fr .db-ok{flex:0 0 auto;padding:12px 14px;border-radius:14px;background:var(--surface-3);justify-content:center}
.pmx-fin .pmx-fa{border:0;padding:0;min-width:0;align-content:center;gap:10px}
:root[data-theme="light"] .pmx-fin .pmx-fr .mf-q,:root[data-theme="light"] .pmx-fin .pmx-fr .mf-q:hover,:root[data-theme="light"] .pmx-fin .pmx-fr .db-ok{background:#f1f1f1}
:root[data-theme="light"] .pmx-fin .pmx-fr .mf-q .ic{background:#fff}
@media(max-width:1100px){.pmx-b > .pmx-fin{grid-template-columns:minmax(0,1fr)}}

.pmx-b > .pmx-fin{align-items:start}
.pmx-fin .pmx-fr{justify-content:flex-start;align-self:start;gap:8px}
.pmx-fin .pmx-fr .k{font-size:13px;color:var(--muted);line-height:1.3}
.pmx-fin .pmx-fr .mf-q .o b{font-size:13.5px}
.pmx-fin .pmx-fa{align-content:start;padding-top:23px}

/* Неделя вперёд и команда — дашборд ПМ */
.pmx-sec{gap:16px;padding:18px 20px 20px}
.pmx-wk{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.pmx-wd{display:flex;flex-direction:column;gap:2px;padding:14px 14px 16px;border-radius:16px;background:var(--surface-3);min-height:132px}
.pmx-wd .w{font-size:12.5px;font-weight:600;color:var(--muted);text-transform:capitalize}
.pmx-wd b{font-family:var(--font-display);font-size:32px;font-weight:800;line-height:1.15;letter-spacing:-.02em}
.pmx-wd .ev{display:flex;flex-direction:column;gap:6px;margin-top:auto;align-items:flex-start}
.pmx-wd .ev i{font-style:normal;font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--surface-2);color:var(--text)}
.pmx-wd .ev i.off{color:var(--muted);font-weight:600}
.pmx-wd .none{font-size:12.5px;color:var(--muted)}
.pmx-wd.today{background:linear-gradient(180deg,#ff7a2e,#ff5d00);box-shadow:0 12px 24px -12px rgba(255,93,0,.75),inset 0 1px 0 rgba(255,255,255,.25)}
.pmx-wd.today .w,.pmx-wd.today b,.pmx-wd.today .none{color:#fff}
.pmx-wd.today .w,.pmx-wd.today .none{opacity:.85}
.pmx-wd.today .ev i{background:rgba(255,255,255,.22);color:#fff}
.pmx-team{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pmx-tp{display:grid;grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"av who num" "bar bar st";column-gap:14px;row-gap:10px;align-items:center;padding:14px 16px;border-radius:16px;background:var(--surface-3);cursor:pointer;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}
.pmx-tp:hover{transform:translateY(-2px);box-shadow:0 12px 22px -12px rgba(0,0,0,.7)}
.pmx-tp > .avatar{grid-area:av;width:40px;height:40px}
.pmx-tp .who{grid-area:who;display:flex;flex-direction:column;min-width:0}
.pmx-tp .who b{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pmx-tp .who span{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pmx-tp .num{grid-area:num;display:flex;flex-direction:column;align-items:flex-end;line-height:1.2}
.pmx-tp .num b{font-family:var(--font-display);font-size:20px;font-weight:700}
.pmx-tp .num span{font-size:12px;color:var(--muted)}
.pmx-tp .bar{grid-area:bar;height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden}
.pmx-tp .bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff7a2e,#ff5d00)}
.pmx-tp .bar.late i{background:linear-gradient(90deg,#ff8a8a,var(--crit))}
.pmx-tp .st{grid-area:st;font-size:12px;font-weight:600;color:var(--muted);justify-self:end}
.pmx-tp .st.late{color:var(--crit)}
:root[data-theme="light"] .pmx-wd,:root[data-theme="light"] .pmx-tp{background:#f1f1f1}
:root[data-theme="light"] .pmx-wd .ev i,:root[data-theme="light"] .pmx-tp .bar{background:#fff}
:root[data-theme="light"] .pmx-wd.today{background:linear-gradient(180deg,#ff7a2e,#ff5d00)}
@media(max-width:1000px){.pmx-wk{grid-template-columns:repeat(4,minmax(0,1fr))}.pmx-team{grid-template-columns:minmax(0,1fr)}}

/* Неделя вперёд: чипы, клик, без наследования календарных .ev/.off */
.pmx-wd{cursor:pointer;transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}
.pmx-wd:hover{transform:translateY(-2px);box-shadow:0 12px 22px -12px rgba(0,0,0,.7)}
.pmx-wd.today:hover{box-shadow:0 16px 28px -12px rgba(255,93,0,.85),inset 0 1px 0 rgba(255,255,255,.25)}
.pmx-wd .pmx-evs{display:flex;flex-direction:column;gap:6px;margin-top:auto;align-items:flex-start;border:0;background:none;padding:0}
.pmx-wd .pmx-evs i{font-style:normal;font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;border:0;background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 6px 12px -6px rgba(255,93,0,.7)}
.pmx-wd .pmx-evs i.hol{background:var(--surface-2);color:var(--text-2);box-shadow:none;font-weight:600}
.pmx-wd.today .pmx-evs i,.pmx-wd.today .pmx-evs i.hol{background:var(--surface-3);color:var(--text);box-shadow:none}
.pmx-wd.dayoff{opacity:1}
:root[data-theme="light"] .pmx-wd .pmx-evs i{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
:root[data-theme="light"] .pmx-wd .pmx-evs i.hol{background:#fff;color:#555}
:root[data-theme="light"] .pmx-wd.today .pmx-evs i,:root[data-theme="light"] .pmx-wd.today .pmx-evs i.hol{background:#f1f1f1;color:#111}

/* статичные блоки дашборда ПМ: без анимации при наведении */
:root .pj-card.pmx-sec,:root .pj-card.pmx-sec:hover,:root .pj-card.pmx-attn,:root .pj-card.pmx-attn:hover,:root .pj-card.pmx-fin,:root .pj-card.pmx-fin:hover{transform:none;transition:none;cursor:default}
:root:not([data-theme="light"]) .pj-card.pmx-sec:hover,:root:not([data-theme="light"]) .pj-card.pmx-attn:hover,:root:not([data-theme="light"]) .pj-card.pmx-fin:hover{box-shadow:inset 0 0 0 1px var(--border),0 10px 24px -14px rgba(0,0,0,.7)}
:root[data-theme="light"] .pj-card.pmx-sec:hover,:root[data-theme="light"] .pj-card.pmx-attn:hover,:root[data-theme="light"] .pj-card.pmx-fin:hover{box-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 18px -12px rgba(0,0,0,.35)}

.db-q-av.emp-ic{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--surface-3);color:var(--accent);flex:none}
.pmx-attn .db-q .db-days{min-width:84px}
.pmx-attn .db-q-acts{min-width:0;margin-left:8px}

/* ——— телефон: нижнее меню и шторка «Ещё» ———
   Живут в #bnHost (вне #root) и не пересоздаются при render(). Тёмная стеклянная капсула в
   фирменном синем, общая для обеих тем; активный пункт — оранжевая капля, которая идёт за пальцем.
   Капля двигается только transform (композитор) — без лагов при перерисовке страницы. */
.bnav,.msheet{display:none}
body.kb-open .bnav,body.kb-open .set-bar{display:none!important}
@media(max-width:640px){
  .bnav{--bn-ink:rgba(226,238,240,.6);display:block;position:fixed;left:14px;right:14px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:80;
    padding:6px;border-radius:28px;background:rgba(3,24,35,.86);-webkit-backdrop-filter:blur(26px) saturate(1.8);backdrop-filter:blur(26px) saturate(1.8);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),inset 0 1px 0 rgba(255,255,255,.08),0 22px 44px -16px rgba(1,20,29,.65),0 6px 14px -6px rgba(1,20,29,.35);
    touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;animation:bnIn .5s cubic-bezier(.16,1,.3,1) both}
  :root[data-theme="light"] .bnav{background:rgba(1,29,43,.9);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 18px 40px -14px rgba(1,29,43,.45),0 4px 12px -4px rgba(1,29,43,.25)}
  @keyframes bnIn{from{transform:translateY(24px);opacity:0}}
  .bn-track{position:relative;display:flex;height:58px}
  .bn-pill,.ms-pill{position:absolute;left:0;top:0;border-radius:22px;pointer-events:none;z-index:0;opacity:0;will-change:transform;
    background:radial-gradient(120% 90% at 50% 0%,#ff8a3d 0%,#ff6a12 45%,#ff5d00 100%);
    box-shadow:0 10px 22px -8px rgba(255,93,0,.75),inset 0 0 0 1px rgba(255,255,255,.12),inset 0 1px 0 rgba(255,255,255,.35);
    transition:transform .5s cubic-bezier(.3,1.4,.5,1),opacity .2s}
  .bn-pill{bottom:0}
  .bn-pill--hold{transition:transform .28s cubic-bezier(.3,1.4,.5,1),opacity .2s}
  .bn-pill--drag{transition:opacity .2s}
  .bn-item,.ms-item{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    color:var(--bn-ink,rgba(226,238,240,.6));text-decoration:none;-webkit-tap-highlight-color:transparent;cursor:pointer;transition:color .22s}
  .bn-item{flex:1 1 0;min-width:0}
  .bn-ic,.ms-ic{position:relative;display:grid;place-items:center;transition:transform .35s cubic-bezier(.34,1.5,.5,1)}
  .bn-item .ico,.ms-item .ico{width:22px;height:22px;stroke-width:1.9}
  .bn-l,.ms-t{font-size:10.5px;font-weight:600;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;padding:0 2px}
  .bn-item.lit,.ms-item.lit{color:#fff}
  .bn-item.lit .bn-ic,.ms-item.lit .ms-ic{transform:translateY(-1px) scale(1.08)}
  .bn-cw{display:contents}
  .bn-c{position:absolute;top:-6px;left:calc(100% - 7px);min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#ff5d00;color:#fff;
    font-style:normal;font-size:10px;font-weight:700;line-height:17px;text-align:center;box-shadow:0 0 0 2px #03202e;box-sizing:border-box}
  .lit .bn-c{background:#fff;color:#ff5d00;box-shadow:0 0 0 2px #ff6a12}
  .main{padding-bottom:calc(100px + env(safe-area-inset-bottom,0px))}
  .menu-toggle,.topbar-sep{display:none!important}

  .msheet{display:block;position:fixed;inset:0;z-index:85;pointer-events:none}
  .ms-scrim{position:absolute;inset:0;background:rgba(1,20,29,.45);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;transition:opacity .3s}
  .ms-card{position:absolute;left:14px;right:14px;bottom:calc(92px + env(safe-area-inset-bottom,0px));padding:8px 8px 10px;border-radius:28px;
    background:rgba(3,24,35,.92);-webkit-backdrop-filter:blur(28px) saturate(1.8);backdrop-filter:blur(28px) saturate(1.8);color:#eef6f5;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),0 30px 60px -18px rgba(1,20,29,.8);touch-action:none;user-select:none;-webkit-user-select:none;
    transform:translate3d(0,calc(100% + 110px),0);transition:transform .45s cubic-bezier(.3,1.25,.5,1)}
  .msheet.open{pointer-events:auto}
  .msheet.open .ms-scrim{opacity:1}
  .msheet.open .ms-card{transform:none}
  .ms-grab{width:38px;height:4px;border-radius:999px;background:rgba(255,255,255,.25);margin:2px auto 8px}
  .ms-me{display:flex;align-items:center;gap:12px;padding:4px 10px 12px;margin-bottom:6px;border-bottom:1px solid rgba(255,255,255,.08)}
  .ms-me .grow{min-width:0}
  .ms-me b{display:block;font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ms-me span{display:block;font-size:12px;color:rgba(226,238,240,.6)}
  .ms-me .avatar{width:42px;height:42px;display:grid;place-items:center;padding:0;line-height:1;font-size:14px;letter-spacing:0;text-indent:0;
    background:linear-gradient(135deg,#ff8a3d,#ff5d00);color:#fff;border:0}
  .ms-grid{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px}
  .ms-item{height:72px;padding:0 2px}
  .ms-t{font-size:11px;white-space:normal;text-align:center;line-height:1.2}
  .ms-pill{border-radius:20px}
  .ms-item.active,.ms-item.lit{color:#fff}
  .ms-item .bn-c{top:-7px}
}
@media(max-width:640px) and (prefers-reduced-motion:reduce){
  .bnav,.bn-pill,.ms-pill,.ms-card{animation:none;transition:none!important}
}
html.ms-lock,html.ms-lock body{overflow:hidden;overscroll-behavior:none}
@media(max-width:640px){ .bnav{z-index:86} }

/* телефон: дашборд / «Мой день» */
@media(max-width:640px){
  .page.pm-db{padding:14px 12px calc(96px + env(safe-area-inset-bottom,0px));gap:12px}
  .pmx-hero{padding:22px 20px;gap:16px}
  .pmx-hero .db-hero-t h1{font-size:32px;margin:6px 0 14px}
  .pmx-hero .db-axis,.pmx-hero .db-shoot{grid-template-columns:96px minmax(0,1fr);gap:10px}
  .pmx-ht{gap:14px}
  .pmx-attn .db-q{display:grid;grid-template-columns:36px minmax(0,1fr) auto;grid-template-areas:"ic t d" "act act act";column-gap:12px;row-gap:10px;align-items:center;padding:12px 12px}
  .pmx-attn .db-q .db-q-av{grid-area:ic}
  .pmx-attn .db-q .grow{grid-area:t}
  .pmx-attn .db-q .db-days{grid-area:d;min-width:0;margin:0}
  .pmx-attn .db-q .db-q-acts{grid-area:act;margin:0;min-width:0;width:100%}
  .pmx-attn .db-q .db-q-acts .btn{width:100%;justify-content:center}
  .pmx-attn .db-q:first-child{padding-top:12px}
  .pmx-attn .db-q:last-child{padding-bottom:12px}
  .pmx-b > .pmx-fin{padding:16px;row-gap:16px}
  .pmx-fin .pmx-fa{grid-template-columns:1fr 1fr;padding-top:0}
  .pmx-wk{grid-template-columns:minmax(0,1fr);gap:8px}
  .pmx-wd .pmx-evs{flex-direction:row;flex-wrap:wrap;justify-content:flex-end;align-items:center}
  .pmx-wd .pmx-evs i,.pmx-wd .none{white-space:nowrap}
  .pmx-wd{min-height:0;flex-direction:row;align-items:center;gap:14px;padding:12px 14px}
  .pmx-wd b{font-size:28px;min-width:38px}
  .pmx-wd .w{min-width:26px}
  .pmx-wd .pmx-evs{margin:0 0 0 auto;align-items:flex-end}
  .pmx-sec{padding:16px}
  .pmx-team{grid-template-columns:minmax(0,1fr)}
}

/* телефон: недельный календарь на «Проектах» — день плашкой, события карточками */
@media(max-width:640px){
  :root .wk,:root:not([data-theme="light"]) .wk,:root[data-theme="light"] .wk{background:none!important;border:0!important;box-shadow:none!important;overflow:visible;display:flex;flex-direction:column;gap:10px;border-radius:0}
  .pj-sec + .wk{margin-top:0}
  :root .wk-row{flex-direction:column;align-items:stretch;gap:10px;padding:14px;border:0;border-radius:18px;background:var(--surface-3);box-shadow:none}
  :root .wk-row.today,:root:not([data-theme="light"]) .wk-row.today{background:var(--surface-3);box-shadow:inset 0 0 0 1.5px var(--accent),0 10px 20px -12px rgba(255,93,0,.5)}
  .wk-date{width:auto;min-height:0;gap:12px}
  .wk-date b{width:auto;text-align:left;font-size:26px}
  .wk-date span{flex-direction:row;align-items:baseline;gap:8px;font-size:14px}
  .wk-evs{flex-direction:column;align-items:stretch;gap:8px;min-height:0}
  :root .wk-ev,:root:not([data-theme="light"]) .wk-ev{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"b t" "b m";column-gap:12px;row-gap:1px;align-items:center;width:100%;max-width:none;text-align:left;border-radius:16px;padding:10px 14px 10px 10px;background:var(--surface-2);box-shadow:none}
  .wk-ev b,.wk-ev .ic{grid-area:b}
  .wk-ev .ic{width:32px;height:32px}
  .wk-ev .t{grid-area:t;white-space:normal;font-size:14px}
  .wk-ev .m{grid-area:m;max-width:none;font-size:12.5px}
  .wk-ev b{font-size:12px;padding:5px 10px}
  .wk-off{font-size:13px;padding:2px 0}
  :root[data-theme="light"] .wk-row{background:#f1f1f1}
  :root[data-theme="light"] .wk-ev{background:#fff}
}

/* телефон: «Моя посещаемость» */
@media(max-width:640px){
  .main[data-view="attendance"] .pj-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  :root .main[data-view="attendance"] .pj-kpi{padding:10px 12px}
  :root .main[data-view="attendance"] .pj-kpi .l{font-size:11.5px;line-height:1.25}
  :root .main[data-view="attendance"] .pj-kpi .v{font-size:22px;line-height:1.3}
  .att-me{gap:12px}
  .att-heat-wd{padding:2px 14px 4px;gap:3px}
  .att-heat-grid{padding:0 14px;gap:3px}
  :root .att-heat-d,:root .att-heat-d.empty,:root .att-me .att-heat-d,:root .att-me .att-heat-d.empty{height:30px;border-radius:8px;font-size:12px}
  .att-heat-d.empty:nth-child(n+8){display:none}
  :root .att-me .att-heat-legend{padding:10px 14px 14px;gap:6px 10px;font-size:12px}
  .att-heat .card-head{padding:14px 14px 8px}
  /* последние отметки — строки-карточки без таблицы */
  :root .att-table--me{display:block;min-width:0;width:100%}
  .att-table--me thead,.att-table--me colgroup{display:none}
  .att-table--me tbody{display:flex;flex-direction:column;gap:8px;padding:0 12px 12px}
  :root .att-table--me tr{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"d d pen" "arr late zone";column-gap:14px;row-gap:6px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--surface-3)}
  :root .att-table--me td,:root .att-table--me td:first-child{padding:0!important;border:0;background:none;white-space:nowrap}
  :root .att-table--me td:nth-child(1){grid-area:d}
  :root .att-table--me td:nth-child(2){grid-area:arr}
  :root .att-table--me td:nth-child(3){grid-area:late}
  :root .att-table--me td:nth-child(4){grid-area:zone;justify-self:end}
  :root .att-table--me td:nth-child(5){grid-area:pen;justify-self:end}
  :root .att-table--me td:nth-child(1) .n{font-size:14px;font-weight:700;color:var(--text)}
  :root .att-table--me tbody tr:hover>td{background:none}
  .att-me .tablewrap{overflow:visible}
  :root[data-theme="light"] .att-table--me tr{background:#f1f1f1}
}

/* списки в модалках раскрываются внутри модалки, а не поверх — модалка не обрезает и не
   требует лишней прокрутки. Было только для телефона, но на десктопе то же самое: короткая
   модалка (например «Запрос исключения») + список дат прямо под первым полем — плавающий
   .dd-menu норовил вылезти ниже .modal (у неё overflow:hidden под фиксированную шапку/скролл
   тела), и обрезался. В потоке — раздвигает модалку/её скролл, но никогда не обрезается. */
:root .dq-modal .dd-menu,:root .tm-form-modal .dd-menu{position:static!important;inset:auto!important;transform:none!important;width:100%!important;min-width:0!important;margin-top:6px;max-height:210px;overflow-y:auto}

/* телефон: «Мои финансы» */
@media(max-width:640px){
  .mf-page .page-head{flex-direction:column;align-items:stretch;gap:12px}
  .mf-page .page-head .actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
  .mf-page .page-head .actions .btn{justify-content:center;padding-left:6px;padding-right:6px;gap:5px;white-space:nowrap;font-size:13px}
  .mf-page .page-head .actions .btn .ico{width:15px;height:15px}
  /* хиро «Мои финансы» на телефоне — как хиро дашборда на телефоне (.db-merged): без карточки,
     фон/тень/скругление убраны, цифры лежат прямо на градиентном пятне страницы, а не в пилюлях —
     .mf-orb уже даёт тёплое пятно у /для карты, просто делаем его заметнее (дашборд использует
     два пятна побольше — здесь обошлись одним увеличенным, тот же эффект, без правки разметки) */
  .mf-hero{background:none!important;box-shadow:none!important;border-radius:0;padding:6px 2px 22px;gap:22px;overflow:visible;margin-bottom:-10px}
  .mf-orb{width:300px;height:300px;right:-70px;top:-70px;filter:blur(46px);background:radial-gradient(circle,rgba(255,93,0,.5),rgba(255,93,0,0) 68%)}
  .mf-hl .big{font-size:34px}
  .mf-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px}
  /* !important — в светлой теме есть более специфичное :root[data-theme="light"] .mf-chips .c
     (возвращает серый фон плашки), а мы тут сознательно фон убираем и паддинг тоже — без
     !important в светлой теме оставался фон впритык к цифре без отступов */
  .mf-chips .c{background:none!important;box-shadow:none!important;height:auto;padding:0;display:flex;flex-direction:column-reverse;align-items:flex-start;gap:2px}
  .mf-chips .c b{font-family:var(--font-display);font-size:26px;font-weight:800;letter-spacing:-.02em}
  /* Оклад — один в своём ряду, Премии и Штрафы — вдвоём в ряду под ним (оба и так уже без фона,
     см. правило .mf-chips .c выше — просто переставляем порядок строк) */
  .mf-chips .c:nth-child(1){grid-column:1/-1}
  .mf-chips .c:nth-child(2){order:2}
  .mf-chips .c:nth-child(3){order:3}
  /* «Выплачено»/«Аванс»/«Остаток» — в отличие от Оклад/Премии/Штрафы (те остаются прямо на
     градиенте, как цифры дашборда) эти просили оставить в белой карточке, не растворять в фоне */
  .mf-hr{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 16px;gap:18px}
  .mf-hr .mf-prog .bar{background:var(--surface-3)}
  .mf-prog .t{flex-direction:column-reverse;align-items:flex-start;gap:2px}
  .mf-prog .t b{font-family:var(--font-display);font-size:26px;font-weight:800;letter-spacing:-.02em}
  .mf-next{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px}
  .mf-next > div{background:none!important;box-shadow:none!important;padding:0;flex-direction:column-reverse;gap:2px}
  .mf-next b{font-size:26px;font-weight:800;letter-spacing:-.02em}
  .mf-sec .card-head{flex-wrap:wrap;padding:14px 14px 10px}
  .mf-sec .card-head .mf-tabs{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .mf-sec .card-head .mf-tabs::-webkit-scrollbar{display:none}
  .mf-tabs .proj-tab{white-space:nowrap;padding:7px 13px}
  .mf-reqs{padding:0 8px 8px}
  .mf-list{padding:12px 12px 12px;gap:8px}
  :root .mf-r,:root .mf-r:not(.mf-r--h):hover{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"o o a" "d ty x";column-gap:12px;row-gap:8px;align-items:center;padding:12px 14px;border:0;border-radius:14px;background:var(--surface-3)}
  :root .mf-r.mf-r--h{display:none}
  .mf-r .o{grid-area:o}
  .mf-r .a{grid-area:a;font-size:14px}
  .mf-r .d,.mf-r .mf-ty{display:inline-flex}
  .mf-r .d{grid-area:d;font-size:12.5px}
  .mf-r .mf-ty{grid-area:ty;justify-self:start}
  .mf-r .pay-hist-x{grid-area:x;align-self:center}
  .mf-r .o b{white-space:normal}
  :root[data-theme="light"] .mf-r{background:#f1f1f1}
}

/* телефон: «Правила» — строки «название · значение» в один столбец, плотно, во всю ширину экрана */
@media(max-width:640px){
  /* карточки — во всю ширину экрана, без скругления и без бокового отступа страницы */
  :root .main[data-view="settings"] .sf-page{padding-left:0;padding-right:0}
  :root .main[data-view="settings"] .sf-wrap{gap:10px}
  :root .main[data-view="settings"] .sf-card{border-radius:0;padding-top:12px;padding-bottom:8px}
  :root .main[data-view="settings"] .sf-card--grid .sf-head{margin:0 10px 6px}
  :root .main[data-view="settings"] .sfg,:root .main[data-view="settings"] .sfg--3,:root .main[data-view="settings"] .sfg--1{display:flex;flex-direction:column;gap:3px;grid-template-columns:none;padding-top:4px}
  :root .main[data-view="settings"] .sfg-cell{width:100%;min-height:0;flex-direction:row;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;border-radius:10px}
  /* множитель — свои более компактные плашки, высоту не трогаем */
  :root .main[data-view="settings"] .sfg-cell--mult{padding-top:9px;padding-bottom:9px}
  :root .main[data-view="settings"] .sfg-cell:empty{display:none}
  :root .main[data-view="settings"] .sfg-name{flex:1;min-width:0;font-size:14px;padding-right:0}
  :root .main[data-view="settings"] .sfg-val{flex:none;white-space:nowrap;text-align:right;align-items:center}
  :root .main[data-view="settings"] .sfg-num{font-size:20px}
  /* карандаш правки — обратно в поток рядом со значением, а не поверх него (был position:absolute с десктопа) */
  :root .main[data-view="settings"] .sfg-edit{position:static;opacity:1;margin-left:2px;width:20px;height:20px}
  :root .main[data-view="settings"] .sf-card{padding-left:0;padding-right:0}
  :root .main[data-view="settings"] .sf-head{margin-left:10px;margin-right:10px}
  :root .main[data-view="settings"] .sf-sub{padding-left:10px;padding-right:10px}
  :root .main[data-view="settings"] .sfg,:root .main[data-view="settings"] .sfg--3,:root .main[data-view="settings"] .sfg--1{padding-left:10px;padding-right:10px}
  :root .main[data-view="settings"] .sf-card--geo .sf-body{padding-top:12px}
  /* геозона: отступ между подписью координат и картой ниже — было 28px (grid-gap десктопной раскладки) */
  :root .main[data-view="settings"] .sf-geo{gap:10px}
  /* «Премии» и «Норматив часов» друг под другом — тот же зазор, что между остальными блоками */
  :root .main[data-view="settings"] .sf-row2{gap:10px}
  /* заголовок страницы — свой отступ слева, т.к. у страницы теперь нет бокового паддинга */
  :root .main[data-view="settings"] .page-head{padding-left:10px;padding-right:10px}
  /* внизу страницы было зарезервировано место под плавающую плашку «Сохранить» с запасом — многовато,
     когда её нет на экране; нижнему меню достаточно и меньшего отступа */
  /* .main уже резервирует 96px под нижнее меню (см. общее правило .main{padding-bottom:...}) —
     здесь добавляем только небольшую доп. надбавку, чтобы плавающая плашка «Сохранить» (когда видна)
     тоже не перекрывала последнюю плашку, а не второй такой же отступ поверх него */
  :root .main[data-view="settings"] .sf-page{padding-bottom:calc(40px + env(safe-area-inset-bottom,0px))}
  /* светлая тема: карточка-блок сливается со страницей (без белой заливки и тени), а сами плашки —
     наоборот, белые, вместо серых на белом */
  :root[data-theme="light"] .main[data-view="settings"] .sf-card{background:transparent;box-shadow:none}
  /* тень такая же по форме, как у активной карточки расхода в «Расходах» — 0 8px 16px -8px,
     нейтрального цвета — у .sfg-cell своей рамки нет */
  :root[data-theme="light"] .main[data-view="settings"] .sfg-cell{background:#fff;box-shadow:0 8px 16px -8px rgba(0,0,0,.35)}
  :root[data-theme="light"] .main[data-view="settings"] .sfg-cell:hover{background:#fff!important}
  /* тёмная тема — та же логика: блок сливается со страницей, а плашки берут себе прежний цвет блока */
  :root:not([data-theme="light"]) .main[data-view="settings"] .sf-card{background:transparent;box-shadow:none}
  :root:not([data-theme="light"]) .main[data-view="settings"] .sfg-cell{background:var(--surface-2)}
  :root:not([data-theme="light"]) .main[data-view="settings"] .sfg-cell:hover{background:var(--surface-2)!important}
}

/* телефон: «Расходы» — те же отступы от края экрана, что на «Базе знаний»/«Настройках правил» (10px
   вместо общих 16px у .sf-page) — карточки и плашки становятся немного шире */
@media(max-width:640px){
  :root .main[data-view="expenses"] .sf-page{padding-left:10px;padding-right:10px}
  /* отступы между заголовком/плашками/блоком ниже — как на дашборде, а не общие 18px у .sf-wrap */
  :root .main[data-view="expenses"] .sf-wrap{gap:10px}
  /* сводка на телефоне без карточки (на десктопе плашка-карточка нужна и остаётся) —
     свой внутренний паддинг плашек больше не выровнен с остальным текстом страницы,
     подгоняем крайние отступы под те же 10px */
  :root .main[data-view="expenses"] .exq-statbar{background:transparent;border:0;box-shadow:none}
  :root .main[data-view="expenses"] .exq-stat:nth-child(1){padding-left:0}
  :root .main[data-view="expenses"] .exq-stat:nth-child(2){padding-right:0}
  :root .main[data-view="expenses"] .exq-stat:last-child{padding-left:0;padding-right:0}
  /* плашка количества рядом с «Ожидают/Оплачено/Отклонено» — на телефоне белая с чёрными цифрами */
  :root[data-theme="light"] .main[data-view="expenses"] .exq-stat .label .badge{background:#fff;color:#000}

  /* та же логика, что на «Базе знаний»/«Настройках правил»: блок сливается со страницей (без
     фона и тени), а отдельные плашки внутри берут себе прежний цвет блока */
  :root .main[data-view="expenses"] .exq-mdlist{background:transparent;border:0;box-shadow:none;padding:0;gap:6px}
  /* тень такая же по форме, как у активной (оранжевой) карточки очереди — 0 8px 16px -8px,
     только нейтрального цвета, а не акцентного — у плашек своей рамки нет */
  :root[data-theme="light"] .main[data-view="expenses"] .exq-mdrow:not(.active){background:#fff;box-shadow:0 8px 16px -8px rgba(0,0,0,.35)}
  :root:not([data-theme="light"]) .main[data-view="expenses"] .exq-mdrow:not(.active){background:var(--surface-2)}
  :root .main[data-view="expenses"] .exq-mdrow:hover:not(.active){background:var(--surface-3)}

  /* «Детали заявки» — уже сама по себе одна плашка (не список, как «Категории» на базе знаний),
     рамку убираем, тень усиливаем до той же формы, что у активной карточки очереди */
  :root .main[data-view="expenses"] .exq-detail{border:0}
  :root[data-theme="light"] .main[data-view="expenses"] .exq-detail{box-shadow:0 8px 16px -8px rgba(0,0,0,.35)}

  :root .main[data-view="expenses"] .exq-hist-card{background:transparent;border:0;box-shadow:none;padding:0}
  :root .main[data-view="expenses"] .exq-hist-card .card-head{padding-left:0;padding-right:0}
  /* Тип+Сотрудник в одной строке (Сотрудник шире, чем базовая половина), Проект+Дата — рядом
     в следующей строке, та же сетка колонок */
  :root .main[data-view="expenses"] .exq-hist-card .pay-hist-toolbar{padding-left:0;padding-right:0;border-bottom:0;display:grid;grid-template-columns:1fr 180px;gap:8px}
  :root .main[data-view="expenses"] .exq-hist-card .pay-hist-toolbar .dd{width:100%!important}
  /* сам триггер компактный (под сетку), а раскрытое меню — по содержимому, иначе длинные
     названия проектов переносятся и налезают друг на друга в сжатом до триггера меню */
  :root .main[data-view="expenses"] .exq-hist-card .pay-hist-toolbar .dd-menu{width:max-content;max-width:min(280px,calc(100vw - 40px))}
  :root .main[data-view="expenses"] .exq-hist-card .pay-hist-toolbar .dd:nth-child(1) .dd-menu,
  :root .main[data-view="expenses"] .exq-hist-card .pay-hist-toolbar .dd:nth-child(3) .dd-menu{left:0;right:auto}
  :root .main[data-view="expenses"] .exq-hist-card .pay-hist-toolbar .dd:nth-child(2) .dd-menu{left:auto;right:0}
  /* «Проект» — длинные названия, раскрытому списку нужно больше места, чем остальным трём */
  :root .main[data-view="expenses"] .exq-hist-card .pay-hist-toolbar .dd:nth-child(3) .dd-menu{max-width:min(340px,calc(100vw - 20px))}
  :root .main[data-view="expenses"] .exq-hist-card .pay-hist-toolbar .pay-hist-period{margin-left:0;width:100%}
  :root .main[data-view="expenses"] .exq-hist-card .pay-hist-toolbar .pay-hist-period .att-cal-trig{width:100%;justify-content:flex-start}
  /* попап календаря на телефоне: остаётся у самого фильтра (сверху или снизу — как раньше),
     но шире самого триггера (тот всего 180px) — растягиваем влево от правого края карточки,
     без внутреннего скролла (высота свободная, под весь контент) */
  :root .main[data-view="expenses"] .exq-hist-card .pay-hist-period .rc-pop{
    left:auto;right:0;width:min(340px,calc(100vw - 20px));max-width:none;max-height:none;overflow:visible}
  :root .main[data-view="expenses"] .exq-hist-list{gap:6px}
  :root .main[data-view="expenses"] .exq-hist-head{display:none}
  :root .main[data-view="expenses"] .exq-hist{border-radius:14px;overflow:hidden}
  /* кебаб в свёрнутой карточке (мало высоты) часто открывается вверх — меню обрезалось
     overflow:hidden самой карточки. Снимаем обрезку только пока меню открыто и поднимаем
     карточку над соседними, чтобы меню не пряталось под следующей плашкой */
  :root .main[data-view="expenses"] .exq-hist:has(.dd.open){overflow:visible;position:relative;z-index:5}
  :root .main[data-view="expenses"] .exq-hist-row{border-top:0}
  :root[data-theme="light"] .main[data-view="expenses"] .exq-hist{background:#fff;box-shadow:0 8px 16px -8px rgba(0,0,0,.35)}
  :root:not([data-theme="light"]) .main[data-view="expenses"] .exq-hist{background:var(--surface-2)}
  :root[data-theme="light"] .main[data-view="expenses"] .exq-hist.open .exq-hist-row,
  :root[data-theme="light"] .main[data-view="expenses"] .exq-hist-body{background:#fff}
  :root:not([data-theme="light"]) .main[data-view="expenses"] .exq-hist.open .exq-hist-row,
  :root:not([data-theme="light"]) .main[data-view="expenses"] .exq-hist-body{background:var(--surface-2)}
}

/* телефон: создание проекта (8 шагов) */
@media(max-width:640px){
  :root .main[data-view="newproject"] .page{padding:14px 12px calc(96px + env(safe-area-inset-bottom,0px))}
  :root .main[data-view="newproject"] .page-head{flex-direction:row;align-items:center;justify-content:space-between;gap:10px}
  :root .main[data-view="newproject"] .page-head h1{font-size:24px}
  .wz-steps-card{padding:14px}
  .wz-gauge-row{gap:12px}
  /* «Дополнительные условия» (шаг «Правила») — 42px хватало ровно на 1 строку; на телефоне поле
     уже, длинный текст из демо-данных заворачивается на 2-ю строку и обрезался (высота меняется
     на 2 строки только при вводе, см. oninput в разметке — при первой отрисовке не пересчитывалась) */
  :root .main[data-view="newproject"] .page .wz-meta-chip textarea.in.wz-ta{min-height:84px}
  /* эта рейка шагов пережила 4 редизайна подряд (см. комментарии «v3»/«v4» выше по файлу) — три
     старых блока `:root .wz-steps{...}` остались в файле мёртвым кодом, и последний из них (v4)
     задаёт overflow:visible. Он той же специфичности, что и вот это мобильное правило ниже, и стоит
     ПОСЛЕ него в файле — поэтому overflow-x:auto тут молча проигрывал (flex-wrap:nowrap выше
     выигрывал только потому, что был !important), рейка не скроллилась, а всей ширины не хватало —
     шаги после 3-4-го были просто недоступны на телефоне. Добавил !important туда же. */
  .wz-steps{flex-wrap:nowrap!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;scrollbar-width:none;justify-content:flex-start}
  .wz-steps::-webkit-scrollbar{display:none}
  .wz-steps .st{flex:none!important;white-space:nowrap}
  :root .main[data-view="newproject"] .wz-shell{padding:0}
  .wz-shell-body{padding:16px 14px}
  :root .main[data-view="newproject"] .wz-foot{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 14px 14px}
  .wz-foot .wz-draft{display:none}
  .wz-foot .btn{justify-content:center;width:100%}
  :root .main[data-view="newproject"] .page .dd,:root .main[data-view="newproject"] .page .dd-trigger:not(.tm-kb){width:100%}
  :root .main[data-view="newproject"] .page input.in,:root .main[data-view="newproject"] .page textarea.in{width:100%;max-width:100%}
}

@media(max-width:640px){
  .wz-steps{position:relative}
  .wz-two,.wz-two--pf{grid-template-columns:minmax(0,1fr)!important}
  .wz-vc-h{flex-wrap:wrap;gap:8px}
  .wz-vc-h > :first-child{flex-basis:100%}
  .wz-pf-other{max-width:100%}
}

@media(max-width:640px){
  .tkp-r{grid-template-columns:minmax(0,1fr) auto;gap:14px}
  .tkp-r b{text-align:right}
  .tkp-top{flex-direction:column;gap:6px}
  .tkp-d{max-width:none;text-align:left}
  .wz-legal{hyphens:none;-webkit-hyphens:none;overflow-wrap:normal;word-break:normal}
}

/* телефон: зарплаты — ведомость и история карточками вместо широких таблиц */
@media(max-width:640px){
  .pay-sheet,.pay-hist{overflow:visible!important}
  :root .pay-sh-head,:root .pay-hist-head{display:none!important}
  .pay-sh-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"u u act" "ok pr pe" "pd rem rem";gap:10px 12px;align-items:start;margin:0 12px 8px;padding:14px;border:0!important;border-radius:16px;background:var(--surface-3);min-width:0!important}
  .pay-sh-row > .pay-sh-u{grid-area:u;min-width:0}
  .pay-sh-row > .pay-sh-act{grid-area:act;justify-self:end}
  .pay-sh-row > .s-ok{grid-area:ok}.pay-sh-row > .s-pr{grid-area:pr}.pay-sh-row > .s-pe{grid-area:pe}.pay-sh-row > .s-pd{grid-area:pd}.pay-sh-row > .strong{grid-area:rem;text-align:right}
  .pay-sh-row > .pay-sh-v{display:flex;flex-direction:column;gap:2px;text-align:left;font-size:14px;white-space:nowrap}
  .pay-sh-row > .pay-sh-v::before{font-size:11.5px;font-weight:500;color:var(--muted)}
  .pay-sh-row > .s-ok::before{content:"Оклад"}.pay-sh-row > .s-pr::before{content:"Премии"}.pay-sh-row > .s-pe::before{content:"Штрафы"}.pay-sh-row > .s-pd::before{content:"Выплачено"}.pay-sh-row > .strong::before{content:"К выплате"}
  .pay-sh-row > .strong{align-items:flex-end;font-size:16px}
  /* колонки minmax(0,auto), а не голый auto — иначе «o» (основание+строка отмены), которая
     растягивается на все 3 колонки, могла раздуть auto-колонки под свой max-content и вылезти
     за край экрана у длинных текстов (например, отменённый штраф с причиной отмены) */
  .pay-hist-row{display:grid!important;grid-template-columns:minmax(0,auto) minmax(0,1fr) minmax(0,auto);grid-template-areas:"u u a" "o o o" "d ty x";gap:8px 12px;align-items:center;margin:0 12px 8px;padding:14px;border:0!important;border-radius:16px;background:var(--surface-3);min-width:0!important}
  .pay-hist-row > .pay-hist-u{grid-area:u;min-width:0}
  .pay-hist-row > .pay-hist-o{grid-area:o;margin:0!important;display:block;-webkit-line-clamp:unset;overflow:visible}
  .pay-hist-row > .pay-hist-d{grid-area:d}.pay-hist-row > .pay-hist-ty{grid-area:ty;margin-left:0;justify-self:start}
  .pay-hist-row > .pay-hist-a{grid-area:a;justify-self:end;font-size:15px}
  .pay-hist-row > .pay-hist-x{grid-area:x;justify-self:end}
  .pay-hist-foot{flex-wrap:wrap;gap:10px;padding:12px 14px}
  .pay-hist-foot-l,.pay-hist-pg{flex-wrap:wrap;gap:8px}
  /* та же тень, что у карточек на «Базе знаний»/«Настройках»/«Расходах» (0 8px 16px -8px) —
     плашки здесь были плоские, без неё */
  :root[data-theme="light"] .pay-sh-row,:root[data-theme="light"] .pay-hist-row{background:#f1f1f1;box-shadow:0 8px 16px -8px rgba(0,0,0,.35)}
}

/* телефон: «Зарплаты» — та же схема, что на «Базе знаний»/«Настройках»/«Расходах»: страница
   с отступом 10px по краям, карточки-обёртки сливаются со страницей (без фона/тени), а их
   содержимое — сводка, тулбары, строки списков — берёт то, что раньше было цветом карточки. */
@media(max-width:640px){
  :root .main[data-view="payroll"] .sf-page{padding-left:10px;padding-right:10px}
  :root .main[data-view="payroll"] .sf-wrap{gap:10px}

  /* «Требует выплаты» — список строк-действий, как «Очередь» на Расходах */
  :root .main[data-view="payroll"] .pay-todo{background:transparent;border:0;box-shadow:none}
  :root .main[data-view="payroll"] .pay-todo .card-head{padding-left:0;padding-right:0;padding-top:12px;padding-bottom:8px;border-bottom:0;align-items:flex-start}
  :root .main[data-view="payroll"] .pay-todo-list{gap:6px}
  :root .main[data-view="payroll"] .pay-todo-row{border-top:0;border-radius:14px}
  :root[data-theme="light"] .main[data-view="payroll"] .pay-todo-row{background:#fff;box-shadow:0 8px 16px -8px rgba(0,0,0,.35)}
  :root:not([data-theme="light"]) .main[data-view="payroll"] .pay-todo-row{background:var(--surface-2)}
  /* отступ под блоком — свой, больше общего зазора между карточками (margin поверх
     gap:10px у .sf-wrap, только под этим блоком) */
  :root .main[data-view="payroll"] .pay-todo{margin-bottom:4px}
  /* сумма в «Требует выплаты» была жирнее (700) и без учёта общего масштаба текста —
     тот же размер/начертание, что у суммы в «Истории» на Расходах */
  :root .main[data-view="payroll"] .pay-todo-v .mono{font-size:15px;font-weight:600}

  /* на телефоне история без пагинации — сразу все карточки, футер «На странице/Пред/След» не нужен */
  :root .main[data-view="payroll"] .pay-hist-foot{display:none}
  /* «Ведомость» и «История операций» — обёртки прозрачные, сводка/тулбар/строки вровень с полями страницы */
  :root .main[data-view="payroll"] .pay-sheet-card,:root .main[data-view="payroll"] .pay-hist-card{background:transparent;border:0;box-shadow:none}
  :root .main[data-view="payroll"] .pay-sheet-card .card-head,:root .main[data-view="payroll"] .pay-hist-card .card-head{padding-left:0;padding-right:0}
  :root .main[data-view="payroll"] .pay-sheet-card .card-head{padding-bottom:0}
  :root .main[data-view="payroll"] .pay-sh-toolbar,:root .main[data-view="payroll"] .pay-hist-toolbar{padding-left:0;padding-right:0;border-bottom:0}
  :root .main[data-view="payroll"] .pay-sh-toolbar{padding-top:4px}
  :root .main[data-view="payroll"] .pay-sh-sum-col{padding-left:0;padding-right:0}
  :root .main[data-view="payroll"] .pay-hist-foot{padding-left:0;padding-right:0}
  /* размер цифр/подписей сводки — как в сводке «Ожидают/Оплачено/Отклонено» на Расходах */
  :root .main[data-view="payroll"] .pay-sh-sum-i .v{font-size:30px}
  :root .main[data-view="payroll"] .pay-sh-sum-i .l{font-size:14px}
  :root .main[data-view="payroll"] .pay-sh-sum-i{gap:2px}

  /* фильтры «Ведомости» и «Истории операций» — та же сетка 2 колонки, что в «Истории» на
     Расходах: поиск на всю ширину сверху, Отдел+Сортировка рядом снизу */
  :root .main[data-view="payroll"] .pay-sh-toolbar{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  :root .main[data-view="payroll"] .pay-sh-toolbar .kb-search{grid-column:1/-1;max-width:none;width:100%;margin:0}
  :root .main[data-view="payroll"] .pay-sh-toolbar .dd{width:100%!important}
  :root .main[data-view="payroll"] .pay-sh-toolbar .dd-menu{width:max-content;max-width:min(280px,calc(100vw - 40px))}
  :root .main[data-view="payroll"] .pay-sh-toolbar .dd:nth-child(2) .dd-menu{left:0;right:auto}
  :root .main[data-view="payroll"] .pay-sh-toolbar .dd:nth-child(3) .dd-menu{left:auto;right:0}

  /* Категория+Сотрудник в одной строке (Сотрудник — колонка пошире под фикс. ширину, как
     «Дата» в Расходах), Отдел+Дата — рядом в следующей, та же сетка колонок */
  :root .main[data-view="payroll"] .pay-hist-toolbar{display:grid;grid-template-columns:1fr 180px;gap:8px}
  :root .main[data-view="payroll"] .pay-hist-toolbar .dd{width:100%!important}
  :root .main[data-view="payroll"] .pay-hist-toolbar .dd-menu{width:max-content;max-width:min(280px,calc(100vw - 40px))}
  :root .main[data-view="payroll"] .pay-hist-toolbar .dd:nth-child(1) .dd-menu,
  :root .main[data-view="payroll"] .pay-hist-toolbar .dd:nth-child(3) .dd-menu{left:0;right:auto}
  /* «Сотрудник» — как «Проект» в Расходах: имена длиннее остальных, раскрытому списку нужно больше места */
  :root .main[data-view="payroll"] .pay-hist-toolbar .dd:nth-child(2) .dd-menu{left:auto;right:0;max-width:min(300px,calc(100vw - 20px))}
  :root .main[data-view="payroll"] .pay-hist-toolbar .pay-hist-period{margin-left:0;width:100%}
  :root .main[data-view="payroll"] .pay-hist-toolbar .pay-hist-period .att-cal-trig{width:100%;justify-content:flex-start}
  :root .main[data-view="payroll"] .pay-hist-card .pay-hist-period .rc-pop{
    left:auto;right:0;width:min(340px,calc(100vw - 20px));max-width:none;max-height:none;overflow:visible}

  /* «Ведомость» — календарь месяца справа в шапке карточки; общее мобильное правило
     анкерит попап от левого края триггера (расчёт на триггер слева), а этот — справа,
     из-за чего попап уезжал за правый край экрана */
  :root .main[data-view="payroll"] .pay-sh-acts .rc-pop{left:auto;right:0;width:min(300px,calc(100vw - 20px));max-width:none}
  /* строки списков — свой цвет плашки, ровно на 10px странице (было margin:0 12px под старую
     раскладку со сплошным белым фоном карточки вокруг) */
  :root .main[data-view="payroll"] .pay-sh-row:not(.pay-sh-head),
  :root .main[data-view="payroll"] .pay-hist-row:not(.pay-hist-head){margin-left:0;margin-right:0}
  :root[data-theme="light"] .main[data-view="payroll"] .pay-sh-row:not(.pay-sh-head),
  :root[data-theme="light"] .main[data-view="payroll"] .pay-hist-row:not(.pay-hist-head){background:#fff}
  /* «К выплате» в «Ведомости» была крупнее и жирнее (16/700) остальных сумм в приложении —
     тот же размер/начертание, что у суммы в «Истории» на Расходах */
  :root .main[data-view="payroll"] .pay-sh-row > .strong{font-size:15px;font-weight:600}
}
/* телефон: «Посещаемость» — та же схема, что на «Зарплатах»/«Расходах»/«Базе знаний»/«Настройках»:
   отступ 10px по краям страницы, карточки-обёртки сливаются со страницей, а их содержимое —
   списки запросов, сводка, строки таблиц — берёт цвет и тень бывшей карточки. */
@media(max-width:640px){
  :root .main[data-view="attendance"] .sf-page{padding-left:10px;padding-right:10px}
  :root .main[data-view="attendance"] .sf-wrap{gap:10px}

  /* «Мои запросы» / «Запросы-исключения» — тот же компонент, что «Требует выплаты» на Зарплатах */
  :root .main[data-view="attendance"] .pay-todo{background:transparent;border:0;box-shadow:none}
  :root .main[data-view="attendance"] .pay-todo .card-head{padding-left:0;padding-right:0;border-bottom:0}
  :root .main[data-view="attendance"] .pay-todo-list{gap:6px}
  :root .main[data-view="attendance"] .pay-todo-row{border-top:0;border-radius:14px}
  :root[data-theme="light"] .main[data-view="attendance"] .pay-todo-row{background:#fff;box-shadow:0 8px 16px -8px rgba(0,0,0,.35)}
  :root:not([data-theme="light"]) .main[data-view="attendance"] .pay-todo-row{background:var(--surface-2)}

  /* «Журнал прихода» / «Последние отметки» — обёртка прозрачная, шапка/фильтр/строки вровень со страницей */
  :root .main[data-view="attendance"] .att-card{background:transparent;border:0;box-shadow:none}
  :root .main[data-view="attendance"] .att-card .card-head{padding-left:0;padding-right:0;flex-wrap:wrap;row-gap:8px}
  :root .main[data-view="attendance"] .pay-sh-sum-col{padding-left:0;padding-right:0}
  :root .main[data-view="attendance"] .att-filter-row{padding-left:0;padding-right:0;padding-top:8px}
  :root .main[data-view="attendance"] .att-me-foot{padding-left:0;padding-right:0}
  :root .main[data-view="attendance"] .att-table:not(.att-table--me) tbody,
  :root .main[data-view="attendance"] .att-table--me tbody{padding:0}
  /* та же тень, что у плашек на Зарплатах/Расходах/Базе знаний/Настройках */
  :root[data-theme="light"] .main[data-view="attendance"] .att-table:not(.att-table--me) tr,
  :root[data-theme="light"] .main[data-view="attendance"] .att-table--me tr{background:#fff;box-shadow:0 8px 16px -8px rgba(0,0,0,.35)}
}

/* телефон: посещаемость директора — строки карточками, ГРИД (не flex-wrap): раньше короткие/
   пустые значения («—», «нет отметки») занимали разное место в зависимости от того, что рядом
   успело влезть на строку, да ещё и без подписи было не понять, что есть что. Теперь у каждого
   поля своя постоянная ячейка + мелкая подпись сверху — одинаково на любой карточке. */
@media(max-width:640px){
  :root .att-table:not(.att-table--me){display:block;min-width:0!important;width:100%}
  .att-table:not(.att-table--me) thead,.att-table:not(.att-table--me) colgroup{display:none}
  .att-table:not(.att-table--me) tbody{display:flex;flex-direction:column;gap:8px;padding:0 12px 12px}
  :root .att-table:not(.att-table--me) tr{position:relative;display:grid;grid-template-columns:1fr 1fr;column-gap:12px;row-gap:10px;align-items:start;padding:12px 14px 10px;border-radius:14px;background:var(--surface-3)}
  :root .att-table:not(.att-table--me) td{padding:0!important;border:0;background:none;min-width:0}
  :root .att-table:not(.att-table--me) tbody tr:hover>td{background:none}
  .att-card .tablewrap{overflow:visible}
  :root[data-theme="light"] .att-table:not(.att-table--me) tr{background:#f1f1f1}
  /* кебаб живёт в разметке внутри последней ячейки (Штраф), но визуально должен быть в правом
     верхнем углу карточки, рядом со строкой сотрудника — вынимаем его из потока абсолютным
     позиционированием (.dd-меню у него своё, позиционируется от самого .tm-kebab, а не от tr,
     так что с переносом ничего не ломается) */
  :root .att-table:not(.att-table--me) .att-pen-cell{position:static!important}
  :root .att-table:not(.att-table--me) .att-pen-cell .tm-kebab{position:absolute;top:12px;right:14px;margin-left:0}

  /* подписанные поля: подпись сверху мелким, значение снизу — везде в одном и том же месте карточки */
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(2),
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(3),
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(4),
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(5),
  :root .att-table.att-table--wide td:nth-child(2),
  :root .att-table.att-table--wide td:nth-child(3),
  :root .att-table.att-table--wide td:nth-child(4),
  :root .att-table.att-table--wide td:nth-child(5),
  :root .att-table.att-table--wide td:nth-child(6){display:flex;flex-direction:column;align-items:flex-start;gap:3px}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(2)::before,
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(3)::before,
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(4)::before,
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(5)::before,
  :root .att-table.att-table--wide td:nth-child(2)::before,
  :root .att-table.att-table--wide td:nth-child(3)::before,
  :root .att-table.att-table--wide td:nth-child(4)::before,
  :root .att-table.att-table--wide td:nth-child(5)::before,
  :root .att-table.att-table--wide td:nth-child(6)::before{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.02em}
  :root .att-table:not(.att-table--me) td:last-child{display:flex;flex-direction:column;gap:5px;grid-column:1/-1;padding-top:8px!important;margin-top:2px;border-top:1px solid color-mix(in srgb,var(--text) 10%,transparent)}
  :root .att-table:not(.att-table--me) td:last-child::before{content:'Штраф';font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.02em}

  /* офис — 6 колонок: сотрудник / график / приход / опоздание / зона / штраф */
  :root .att-table:not(.att-table--wide):not(.att-table--me) tr{grid-template-areas:"user user" "sch arr" "late zone" "pen pen"}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(1){grid-area:user}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(2){grid-area:sch}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(3){grid-area:arr}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(4){grid-area:late}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(5){grid-area:zone}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(6){grid-area:pen}
  /* .att-zone — пилюля с padding:3px 8px, поэтому текст в ней начинается на 8px правее подписи
     над ней — оттягиваем пилюлю назад, чтобы её текст встал вровень с «ЗОНА» */
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(5) .att-zone,
  :root .att-table.att-table--wide td:nth-child(6) .att-zone{margin-left:-8px}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(2)::before{content:'График'}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(3)::before{content:'Приход'}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(4)::before{content:'Опоздание'}
  :root .att-table:not(.att-table--wide):not(.att-table--me) td:nth-child(5)::before{content:'Зона'}

  /* съёмки — 7 колонок: + проект своей строкой */
  :root .att-table.att-table--wide tr{grid-template-areas:"user user" "proj proj" "sch arr" "late zone" "pen pen"}
  :root .att-table.att-table--wide td:nth-child(1){grid-area:user}
  :root .att-table.att-table--wide td:nth-child(2){grid-area:proj}
  :root .att-table.att-table--wide td:nth-child(3){grid-area:sch}
  :root .att-table.att-table--wide td:nth-child(4){grid-area:arr}
  :root .att-table.att-table--wide td:nth-child(5){grid-area:late}
  :root .att-table.att-table--wide td:nth-child(6){grid-area:zone}
  :root .att-table.att-table--wide td:nth-child(7){grid-area:pen}
  :root .att-table.att-table--wide td:nth-child(2)::before{content:'Проект'}
  :root .att-table.att-table--wide td:nth-child(3)::before{content:'График'}
  :root .att-table.att-table--wide td:nth-child(4)::before{content:'Приход'}
  :root .att-table.att-table--wide td:nth-child(5)::before{content:'Опоздание'}
  :root .att-table.att-table--wide td:nth-child(6)::before{content:'Зона'}

  /* инвентарь и подрядчики: KPI в 2 колонки */
  .pj-kpis--3{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .pj-kpis--3 .pj-kpi:last-child:nth-child(odd){grid-column:1 / -1}
}

/* телефон: дашборд директора — «Сегодня по часам» */
@media(max-width:640px){
  .db-day .db-h{flex-wrap:wrap;gap:6px}
  .db-day .db-meta{flex-basis:100%;text-align:left}
  .db-axis,.db-shoot{grid-template-columns:96px minmax(0,1fr)!important;gap:10px!important}
  .db-page{padding:14px 12px calc(96px + env(safe-area-inset-bottom,0px))}
  .db-q{flex-wrap:wrap}
  /* страница проекта — тот же .db-page, что у дашборда, но внизу там ещё был текст-версия
     (убрали отдельно) и снизу оставался явно больше воздуха, чем нужно нижней навигации
     (66px высотой) — снизили запас, дашборд не трогаем (там своя структура последнего блока). */
  :root .main[data-view="projects"] .db-page{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}
}

/* телефон: подиум команды помещается в ширину. overflow:hidden раньше резало декоративное
   оранжевое свечение (.tm-podium::before, 520×260px) точно по краю контейнера — слева/справа
   жёсткой стеной, снизу тоже (бокс свечения выше, чем реальная высота подиума на телефоне).
   .main{overflow-x:hidden} на телефоне уже не даёт странице уехать вбок, так что здесь можно
   спокойно снять обрезку — свечение само мягко гаснет (radial-gradient + blur) у собственных
   краёв, если их не обрезать раньше времени. */
@media(max-width:640px){
  :root .tm-top3{max-width:100%;overflow:visible}
  :root .tm-podium{gap:8px;padding:40px 10px 16px;width:100%;box-sizing:border-box}
  :root .tm-podium-col{flex:1 1 0;min-width:0}
  .tm-podium-person{min-width:0;max-width:100%}
  .tm-podium-name{font-size:12px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .tm-podium-xp{font-size:11.5px}
  .tm-card-top{min-width:0}
}

/* телефон: страница «Команда» — те же поля по краям, что на Зарплатах/Расходах/Базе знаний/
   Настройках (16px базовых → 10px), тот же отступ под заголовком, фильтр-департамент шире
   (раньше уже раскрытого меню — «Все департаменты» переносилось на 2 строки) */
@media(max-width:640px){
  :root .main[data-view="team"] .sf-page{padding-left:10px;padding-right:10px}
  :root .main[data-view="team"] .pj-sec{margin-top:-8px}
  :root .main[data-view="team"] #teamDeptFilter{width:220px}
  :root .main[data-view="team"] #teamDeptFilter .dd-trigger{width:220px}
}

/* телефон: цифры в плашках KPI не вылезают за край */
@media(max-width:640px){
  :root .main[data-view] .pj-kpi .v{font-size:24px!important;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pj-kpi{min-width:0}
}

/* телефон: Инвентарь/Подрядчики/Локации/Клиенты — те же поля по краям и отступ под заголовком,
   что на Команде/Зарплатах/Расходах/Базе знаний/Настройках (эти страницы вообще не получали
   мобильной доводки раньше — используют .page, не .sf-page, поэтому и селекторы другие) */
@media(max-width:640px){
  :root .main[data-view="gear"] .page,
  :root .main[data-view="actors"] .page,
  :root .main[data-view="locations"] .page,
  :root .main[data-view="clients"] .page{padding-left:10px;padding-right:10px;gap:14px}
  :root .main[data-view="gear"] .pj-sec,
  :root .main[data-view="actors"] .pj-sec,
  :root .main[data-view="locations"] .pj-sec,
  :root .main[data-view="clients"] .pj-sec{margin-top:-6px}
}

/* телефон: Инвентарь/Подрядчики/Локации/Клиенты — кнопка «Добавить» переезжает из тулбара с
   фильтрами в шапку страницы, рядом с названием (как «Добавить расход»/«Добавить документ» на
   Расходах/Базе знаний). Разметка одна и та же на всех ширинах — рендерим кнопку дважды (десктопная
   версия внутри .pj-sec-r как была, мобильная — новая, в .page-head) и просто переключаем
   видимость по ширине, а не двигаем один и тот же узел через CSS-позиционирование. */
.pj-mobadd{display:none}
@media(max-width:640px){
  :root .main[data-view="gear"] .pj-mobadd,
  :root .main[data-view="actors"] .pj-mobadd,
  :root .main[data-view="locations"] .pj-mobadd,
  :root .main[data-view="clients"] .pj-mobadd{display:flex;margin-left:auto}
  :root .main[data-view="gear"] .pj-sec-r,
  :root .main[data-view="actors"] .pj-sec-r,
  :root .main[data-view="locations"] .pj-sec-r,
  :root .main[data-view="clients"] .pj-sec-r{display:none}
}

/* телефон: те же три страницы — цифры сводки вверху (Позиций/Стоимость/…) без карточки-плашки,
   крупное число без рамки/фона, обычная (не капсом) подпись сверху — по образцу сводки на
   Расходах/Зарплатах (.exq-stat). В 3 колонки в ряд (не 2+перенос третьей на всю ширину, как
   у общего мобильного правила `.pj-kpis--3` чуть выше — тут явно просили именно 3 в ряд), поэтому
   размер числа меньше, чем при 2 колонках (иначे не помещается) — взял тот же 22px, что и на
   Посещаемости у неё тоже 3 KPI в ряд на телефоне. */
@media(max-width:640px){
  :root .main[data-view="actors"] .pj-kpis--3,
  :root .main[data-view="locations"] .pj-kpis--3{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px}
  :root .main[data-view="actors"] .pj-kpis--3 .pj-kpi:last-child:nth-child(odd),
  :root .main[data-view="locations"] .pj-kpis--3 .pj-kpi:last-child:nth-child(odd){grid-column:auto}
  /* Инвентарь: «Позиций» и «Занято сегодня» в один ряд, «Стоимость» — отдельной строкой под
     ними (просили только для телефона, на десктопе все три остаются в ряд как были) — порядок
     в разметке не трогаем (там Позиций/Стоимость/Занято сегодня), просто визуально переставляем */
  :root .main[data-view="gear"] .pj-kpis--3{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px}
  :root .main[data-view="gear"] .pj-kpi:nth-child(2){order:3;grid-column:1/-1}
  /* «Занято сегодня» тут физически последний ребёнок (3-й), поэтому его же ловит общее
     правило .pj-kpi:last-child:nth-child(odd){grid-column:1/-1} чуть выше — сбрасываем
     обратно на auto, иначе оба «раздвинутых» блока (этот и «Стоимость») не давали
     «Позиций»/«Занято сегодня» встать в один ряд, и всё расползалось в 3 строки */
  :root .main[data-view="gear"] .pj-kpi:nth-child(3){order:2;grid-column:auto}
  :root .main[data-view="gear"] .pj-kpi,
  :root .main[data-view="actors"] .pj-kpi,
  :root .main[data-view="locations"] .pj-kpi,
  :root .main[data-view="attendance"] .pj-kpi{background:transparent!important;box-shadow:none!important;padding:0 0 2px;min-width:0}
  :root .main[data-view="gear"] .pj-kpi .l,
  :root .main[data-view="actors"] .pj-kpi .l,
  :root .main[data-view="locations"] .pj-kpi .l,
  :root .main[data-view="attendance"] .pj-kpi .l{font-size:12px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--muted)}
  :root .main[data-view="gear"] .pj-kpi .v,
  :root .main[data-view="actors"] .pj-kpi .v,
  :root .main[data-view="locations"] .pj-kpi .v,
  :root .main[data-view="attendance"] .pj-kpi .v{font-size:22px!important;font-weight:700;line-height:1.3;white-space:normal;overflow:visible;text-overflow:clip}
}

/* телефон: Клиенты — тот же принцип (цифры сводки без плашки-карточки), но тут 4 KPI, не 3 —
   сетка уже даёт 2×2 общим правилом `.pj-kpis{grid-template-columns:repeat(2,...)}` при
   max-width:900px, колонка шире, чем при 3-в-ряд у Инвентаря/Подрядчиков/Локаций, поэтому число
   можно чуть крупнее; значения тут всегда короткие (NPS/счётчики), в перенос не упираются. */
@media(max-width:640px){
  :root .main[data-view="clients"] .pj-kpi{background:transparent!important;box-shadow:none!important;padding:0 0 2px;min-width:0}
  :root .main[data-view="clients"] .pj-kpi .l{font-size:12px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--muted)}
  :root .main[data-view="clients"] .pj-kpi .v{font-size:26px!important;font-weight:700;line-height:1.3;white-space:normal;overflow:visible;text-overflow:clip}
}

/* эти же три страницы (десктоп и телефон) — карточки позиций/подрядчиков/локаций в тёмной теме
   не должны получать акцентную рамку-обводку при наведении/тапе (общее правило чуть ниже даёт её
   всем .pj-card в тёмной теме, включая карточки клиентов — там оставляем как есть, тут явно
   попросили убрать только для этих трёх). Подсветка при наведении остаётся, но той же, что и в
   светлой теме (просто тень, без обводки) — карточка всё ещё «приподнимается» (transform у
   .pj-card:hover не трогаем). */
:root:not([data-theme="light"]) .main[data-view="gear"] .pj-card:hover,
:root:not([data-theme="light"]) .main[data-view="actors"] .pj-card:hover,
:root:not([data-theme="light"]) .main[data-view="locations"] .pj-card:hover{box-shadow:0 2px 4px rgba(0,0,0,.2),0 16px 28px -14px rgba(0,0,0,.6)}

/* телефон: Финансы — страница вообще не получала мобильной доводки. Шапка: статус+«Обновить»
   в одну строку (они короткие, помещаются), «Подключить таблицы» — во всю ширину отдельной
   строкой (было 3 строки вподряд — статус, потом каждая кнопка отдельно). Геройская сумма
   («861,5 млн») на 46px не помещалась в одну строку на узкой карточке и «млн» перескакивало
   само по себе на вторую строку — уменьшил размер под мобильный. */
@media(max-width:640px){
  :root .main[data-view="finance"] .page{padding-left:10px;padding-right:10px}
  :root .main[data-view="finance"] .page-head{flex-direction:column;align-items:stretch;gap:10px}
  :root .main[data-view="finance"] .page-head .actions{margin-left:0;width:100%;flex-wrap:wrap;gap:8px 10px}
  :root .main[data-view="finance"] .page-head .actions .fin-st{flex:1 1 auto;order:1;min-width:0}
  :root .main[data-view="finance"] .page-head .actions .btn--edit{order:2;flex:none}
  :root .main[data-view="finance"] .page-head .actions .kb-add{order:3;width:100%;justify-content:center}
  :root .main[data-view="finance"] .fin-big .n{font-size:32px}
  :root .main[data-view="finance"] .fin-big .n small{margin-left:6px}
  /* .top — flex space-between с меткой+суммой слева и легендой «Доходы/Расходы» справа; на
     десктопе места хватало обеим, на телефоне легенда поджимала блок с суммой настолько, что
     «861,5 млн» переносилось само на 2 строки даже при уменьшенном шрифте — просто роняем
     легенду под сумму вместо того чтобы делить с ней одну строку */
  :root .main[data-view="finance"] .fin-big .top{flex-direction:column;align-items:flex-start;gap:8px}
}

/* телефон: база знаний — название целиком, метка категории под ним */
@media(max-width:640px){
  .kb-acc-hd{display:grid!important;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t chev" "b b";gap:6px 10px;align-items:center}
  .kb-acc-hd > .grow{grid-area:t;min-width:0}
  .kb-acc-hd .t{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.3}
  .kb-acc-hd > .badge{grid-area:b;justify-self:start}
  .kb-acc-hd > svg{grid-area:chev}
}

/* база знаний: .kb-side/.kb-main складываются в 1 колонку начиная с 820px (см. .kb-grid выше) —
   плашки и отступы блоков нужно уравнивать от той же ширины, а не только на «телефонных» 640px,
   иначе на промежуточных ширинах (641–820px) кусок правил не применялся и плашка документа
   опять оказывалась уже плашки категории. */
@media(max-width:820px){
  /* блок «Документы» сливается со страницей, а плашки документов берут себе прежний цвет блока —
     та же логика, что на «Настройках правил» */
  .main[data-view="knowledge"] .kb-main{box-shadow:none}
  :root[data-theme="light"] .main[data-view="knowledge"] .kb-main{background:transparent}
  :root:not([data-theme="light"]) .main[data-view="knowledge"] .kb-main{background:transparent}
  /* тень такая же по форме, как у активной карточки расхода в «Расходах» — 0 8px 16px -8px,
     нейтрального цвета — у самой .kb-acc рамки больше нет, без тени плашка выглядит плоской */
  :root[data-theme="light"] .main[data-view="knowledge"] .kb-acc{background:#fff;box-shadow:0 8px 16px -8px rgba(0,0,0,.35)}
  :root:not([data-theme="light"]) .main[data-view="knowledge"] .kb-acc{background:var(--surface-2)}
  /* при раскрытии документа плашка не должна возвращаться к старому серому/surface — тот же цвет, что закрытая;
     тень не трогаем — у .open уже своя акцентная обводка (см. .kb-acc.open выше по файлу) */
  :root[data-theme="light"] .main[data-view="knowledge"] .kb-acc.open{background:#fff}
  :root:not([data-theme="light"]) .main[data-view="knowledge"] .kb-acc.open{background:var(--surface-2)}
  /* .kb-side — видимая рамка карточки (фон есть), поэтому её card-body:12px — это отступ ВНУТРИ
     видимой рамки, и рамка сама стоит вплотную к странице. У .kb-main рамки больше нет (прозрачная) —
     значит и card-body/card-head паддинг слева-справа тоже убираем, иначе это пустой зазор без
     всякой рамки, которой он мог бы принадлежать. Сами плашки .kb-acc должны стоять вплотную
     к краю страницы, вровень с рамкой «Категорий» и с заголовком «База знаний». */
  .main[data-view="knowledge"] .sf-page{padding-left:10px;padding-right:10px}
  .main[data-view="knowledge"] .kb-main .card-body{padding-left:0;padding-right:0}
  .main[data-view="knowledge"] .kb-main .card-head{padding-left:0;padding-right:0}
  /* текст названия документа внутри плашки — тот же левый отступ, что у текста категории (10px) */
  .main[data-view="knowledge"] .kb-acc-hd{padding-left:10px}
}

@media(max-width:640px){
  :root .main[data-view="settings"] .sfg-cell--mult{flex-direction:column;align-items:stretch;gap:10px}
  :root .main[data-view="settings"] .sfg-cell--mult .sfg-val{text-align:left}
  /* сетка 3×2 вместо flex-wrap — иначе плашки сжимались (min-width:0) и цифры вылезали за край */
  :root .main[data-view="settings"] .mult-pills{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  :root .main[data-view="settings"] .mult-pill{padding:7px 4px;font-size:12px;flex:none;min-width:0}
}

/* телефон: модалки поверх нижней панели, тост над панелью */
@media(max-width:640px){
  /* .modal-bg — display:grid;place-items:center — при высоком контенте (много полей) вертикальное
     центрирование поднимало модалку выше шапки (топбар с поиском), она наезжала на неё.
     Резервируем отступы под шапку и под нижнее меню (padding — уменьшает content-box грида),
     а align-items:center центрирует модалку УЖЕ внутри этой урезанной зоны, а не всего экрана —
     короткие модалки не липнут к самому верху, а высокие всё так же ограничены max-height и не
     вылезают ни под шапку, ни под нижнее меню (оно fixed поверх контента). */
  .modal-bg{
    z-index:120;padding:12px;align-items:center;height:var(--vvh,100vh);
    --mtop:calc(60px + var(--tg-safe-top,0px) + 6px);
    --mbot:calc(92px + env(safe-area-inset-bottom,0px));
    padding-top:var(--mtop);padding-bottom:var(--mbot)
  }
  /* var(--vvh) — высота экрана ДО клавиатуры (см. IIFE с setVvh) — при открытой клавиатуре
     не пересчитывается, поэтому модалка и её плашки не ужимаются вслед за вьюпортом */
  .modal-bg .modal{max-height:calc(var(--vvh,100vh) - var(--mtop) - var(--mbot))}
  /* .tp-modal (карточка сотрудника/клиента/проекта) — height, а не max-height: размер
     фиксирован и не «прыгает» между короткой и длинной вкладкой (см. правило для
     .modal.tp-modal выше по файлу — на мобильном это та же логика, только высота берётся
     из доступной под модалку зоны экрана, а не из фиксированных 720px). */
  .modal-bg .modal.tp-modal{height:calc(var(--vvh,100vh) - var(--mtop) - var(--mbot))}
  /* сдвиг модалки, чтобы сфокусированное поле не пряталось за клавиатурой (см. nudgeModal) */
  .modal-bg .modal{transition:transform .16s cubic-bezier(.4,0,.2,1)}
  .toast-host{bottom:calc(92px + env(safe-area-inset-bottom,0px))}
}

/* задачи проекта: слева сетка карточек как в календаре, справа панель выбранной задачи */
.pjx-setbudget{border:0;background:none;padding:0;font:inherit;font-size:20px;font-weight:700;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.pjx-setbudget:hover{color:var(--accent)}
.pjx-setbudget .ico{width:16px;height:16px}
.pjx-setbudget--set{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:24px;letter-spacing:-.02em;color:var(--text)}
.pjx-setbudget--set .ico{width:14px;height:14px;color:var(--muted);opacity:0;transition:opacity .15s}
.pjx-setbudget--set:hover{color:var(--text)}
.pjx-setbudget--set:hover .ico{opacity:1;color:var(--accent)}
/* ===== страница проекта: шапка и блоки — как на дашборде ===== */
.pjp2 .db-hero-t h1{font-size:40px}
.pjh-meta{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:10px;font-size:14px;font-weight:600;color:var(--text-2)}
.pjh-meta .neg{color:var(--crit)}
.pjh-meta .ok{color:var(--ok)}
.pjh-acts{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.pjh-back .ico{transform:scaleX(-1)}
.pjh-nav{display:inline-flex;align-items:center;gap:6px}
.pjh-step:first-child .ico{transform:scaleX(-1)}
.pjh-step{width:36px;padding:0;justify-content:center}
.pjh-step .ico{width:16px;height:16px}
.pjh-count{min-width:54px;text-align:center;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.pjh-count b{color:var(--text);font-weight:700}
.db-merged .db-r b em{font-style:normal;font-size:24px;font-weight:500;color:var(--muted);letter-spacing:0;margin-left:2px}
.pjx-dv{container-type:inline-size;padding-bottom:6px}
/* .dv по умолчанию overflow:hidden — это нужно календарю (скругление углов колонок), а тут из-за него
   обрезалось раскрытое меню кебаба в «Расходах»; блокам на странице проекта скругление резать нечего */
.dv.pjx-dv{overflow:visible}
.pjx-dv .dv-head{margin-bottom:0}
.pjx-body{padding:10px 0 12px}
.pjx-body--tasks{padding:16px 0 18px}
.pjx-stt{font-size:12.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.pjx-stt--paid{color:var(--ok)}
.pjx-stt--rejected{color:var(--crit)}
.pjx-u{display:flex;align-items:center;gap:10px;min-width:0}
.pjx-u .avatar{flex:none}

/* «Состав и техника», «ТЗ», «Расходы», «История расходов»: строки на всю ширину блока, как в таблице проектов */
.pjx-body .grid.g2{display:block}
.pjx-body .proj-dsec{background:none;box-shadow:none;padding:0;border-radius:0;display:block}
.pjx-body .proj-detail-h,.pjx-body .tz-h{font-family:var(--font-body);font-size:12px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted);margin:0;padding:12px 20px 8px}
.pjx-body .proj-dsec + .proj-dsec{margin-top:8px}
.pjx-body .list{display:flex;flex-direction:column}
.pjx-body .row,.pjx-body .proj-dsec .row,.pjx-body .proj-dsec .row+.row{display:flex;align-items:center;gap:14px;margin:0;padding:13px 20px;border:0;border-top:1px solid var(--border);border-radius:0;background:none;box-shadow:none;transition:background .18s}
.pjx-body .row:hover{background:color-mix(in srgb,var(--text) 5%,transparent)}
.pjx-body .row .avatar{width:32px;height:32px;flex:none}
.pjx-body .row .t{font-size:14px;font-weight:600}
.pjx-body .row .m{font-size:12.25px;color:var(--muted)}
.pjx-body .row .nowr{font-size:13px;font-weight:600;color:var(--text-2)}
.pjx-body .empty{padding:14px 20px 18px;text-align:left;font-size:13.5px;color:var(--muted);border-top:1px solid var(--border)}
.pjx-body .cat{display:inline;padding:0;background:none;color:var(--muted);font-size:12.25px;font-weight:400}
.pjx-body .pe{gap:0}
.pjx-body .pe > *{margin:0}
/* без «Итого выплачено» после таблицы оставался пустой хвост (отступ блока + отступ последней строки) — срезаем его */
.pjx-body:has(.pjx-hist,.exq-hist-list,.empty){padding-bottom:0}
.pjx-dv:has(.pjx-hist,.exq-hist-list,.empty){padding-bottom:0}
.pjx-body .empty{padding-bottom:14px}
.pjx-body .pjx-sum{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:8px 20px 16px}
.pjx-body .pjx-sum .pay-sh-sum-col{padding:0}
.pjx-body .pjx-sum .l{font-size:12.5px;font-weight:500;color:var(--muted)}
.pjx-body .pjx-sum .v{font-size:26px;font-weight:700;letter-spacing:-.02em}
.pjx-body .pe-bar{margin:0 20px 8px;background:color-mix(in srgb,var(--text) 8%,transparent)}
.pjx-body .pe-leg{margin:0 20px 6px}
.pjx-body .pe-head{padding:14px 20px 8px;margin:0;border-top:1px solid var(--border)}
.pjx-body .pe-head .proj-detail-h{padding:0}
.pjx-body .pe .proj-detail-h{padding:12px 20px 8px}
.pjx-body .pe-head .proj-detail-h{padding:0}
.pjx-body .pe .row .pe-r b{font-size:14px}
.pjx-body .pe-types{display:flex;flex-wrap:wrap;gap:0;padding:0 20px 12px}
.pjx-body .pe-type{background:none;padding:0 32px 0 0;box-shadow:none;gap:1px}
.pjx-body .pe-type span{font-size:12.25px}
.pjx-body .pe-type b{font-size:14px}
.pjx-hist .pay-hist-row{grid-template-columns:minmax(0,1.2fr) minmax(0,1.6fr) 110px 90px 100px 130px;padding:13px 20px;font-size:13px}
.pjx-hist .pay-hist-head{padding:12px 20px 8px;font-size:12px;font-weight:600;color:var(--muted)}
.pjx-hist .pay-hist-head > span:nth-child(5){text-align:left}
.pjx-hist .pay-hist-head > span:nth-child(6){text-align:right}
.pjx-hist .pay-hist-row:not(.pay-hist-head):hover{background:color-mix(in srgb,var(--text) 5%,transparent)}
.pjx-body .pe-total{padding:14px 20px 4px;border-top:1px solid var(--border)}
.pjx-body .tz{gap:0}
.pjx-body .tz-sec{gap:0;padding:0 0 10px}
.pjx-body .tz-sec + .tz-sec{border-top:1px solid var(--border);margin-top:6px}
.pjx-body .tz-kvs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 24px;padding:6px 20px 8px}
.pjx-body .tz-kv{padding:0;background:none;gap:2px}
.pjx-body .tz-kv span{font-size:12.25px;font-weight:400;color:var(--muted)}
.pjx-body .tz-kv b{font-size:14px;font-weight:600}
.pjx-body .tz-vids{padding:4px 20px 8px}
.pjx-body .tz-vid{background:none;box-shadow:inset 0 0 0 1px var(--border-strong);padding:4px 11px;font-size:12.5px}
.pjx-body .tz-legal{margin:4px 20px 12px;font-size:13px;line-height:1.6}
.pjx-body .tz-parties{padding:0 20px 12px;gap:10px}
.pjx-body .tz-party{padding:14px 16px;border-radius:14px;background:none;box-shadow:inset 0 0 0 1px var(--border)}
:root[data-theme="light"] .pjx-body .tz-party,:root[data-theme="light"] .pjx-body .tz-vid{background:none}
.pjx-body .tz-pn{font-size:15px}
.pjx-body .tz-final{padding:2px 20px 10px}

/* задачи: доска по статусам; размер карточки — как в блоке «Проекты» (4 в ряд, отступы 8px) и не зависит от панели */
.pjb{--cw:calc((100cqw - 16px - 24px)/4);display:grid;grid-template-columns:repeat(4,var(--cw));gap:8px;align-items:start;padding:0 8px}
.pjb-col{display:flex;flex-direction:column;gap:8px;min-width:0}
.pjb-h{display:flex;align-items:center;gap:8px;padding:0 2px 2px;font-size:12px;font-weight:600;color:var(--muted)}
.pjb-h em{font-style:normal;font-weight:600;color:var(--text-2)}
.pjb-empty{display:grid;place-items:center;height:var(--evh,140px);border-radius:13px;box-shadow:inset 0 0 0 1.5px var(--border-strong);font-size:12.5px;color:var(--muted)}
.pjk{min-width:0}
.pjk .dw-ev{height:var(--evh,140px);cursor:pointer}
.pjk.sel .dw-ev{box-shadow:inset 0 0 0 1.5px var(--accent)}
.pjk.sel .dw-ev--shoot{box-shadow:0 0 0 2px var(--text),0 8px 16px -10px rgba(255,93,0,.8)}

/* шторка с деталями задачи */
.pjs-panel{position:fixed;top:0;right:0;bottom:0;width:440px;max-width:100vw;z-index:130;display:flex;flex-direction:column;gap:14px;padding:22px 22px calc(22px + env(safe-area-inset-bottom));background:var(--surface);box-shadow:-1px 0 0 var(--border-strong),-24px 0 60px rgba(0,0,0,.25);overflow:auto;--pjx-tile:color-mix(in srgb,var(--text) 5.5%,transparent)}
.pjs-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.pjs-ttl{display:flex;flex-direction:column;gap:3px;min-width:0}
.pjs-ttl span{font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:-.015em;line-height:1.2}
.pjs-ttl em{font-style:normal;font-size:13px;color:var(--muted)}
.pjs-x{border:0;flex:none}
.pjs-tags{display:flex;gap:6px;flex-wrap:wrap}
.pjs-bad{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:11px;background:var(--crit-soft);font-size:12.5px;line-height:1.4;color:var(--text-2)}
.pjs-bad b{color:var(--crit);font-size:13px}
.pjs-note{padding:10px 12px;border-radius:11px;background:var(--pjx-tile);font-size:12.5px;color:var(--text-2)}
.pjs-kvs{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px 16px}
.pjs-kv{display:flex;flex-direction:column;gap:2px}
.pjs-kv span{font-size:12px;color:var(--muted)}
.pjs-kv b{font-size:15px;font-weight:700}
.pjs-kv.crit b{color:var(--crit)}
.pjs-sec{display:flex;flex-direction:column;gap:8px}
.pjs-h{font-size:12px;color:var(--muted)}
.pjs-files{display:flex;flex-wrap:wrap;gap:6px}
.pjs-file{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:6px 10px;border:0;border-radius:9px;background:var(--pjx-tile);color:var(--text);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.pjs-file:hover{background:color-mix(in srgb,var(--text) 10%,transparent)}
.pjs-file .ico{width:14px;height:14px;flex:none}
.pjs-file span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pjs-file i{font-style:normal;font-weight:400;color:var(--muted)}
.pjs-gear{display:flex;flex-direction:column}
.pjs-gi{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--border)}
.pjs-gi .t{flex:1;font-size:13px;font-weight:600}
.pjs-gi .m{font-size:12px;color:var(--muted)}
.pjs-add{align-self:flex-start;border:0;background:none;padding:0;font:inherit;font-size:12.5px;font-weight:700;color:var(--accent);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.pjs-add .ico{width:14px;height:14px}
.pjs-acts{display:flex;flex-wrap:wrap;gap:8px;padding-top:4px}
.pjs-done{font-size:13px;font-weight:600;color:var(--ok);display:inline-flex;align-items:center;gap:6px}

@media(max-width:900px){
  .pjx-body .tz-kvs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pjx-body .pjx-sum{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 0}
  .pjp2 .db-hero-t h1{font-size:32px}
  .pjp2 .db-mh{gap:14px}
  .pjh-acts{flex-wrap:wrap}
}
@media(max-width:640px){
  .pjp2 .db-hero-t h1{font-size:26px}
  .pjx-dv .dv-head{padding:0 16px}
  .pjx-body .row,.pjx-body .proj-detail-h,.pjx-body .empty,.pjx-body .tz-h{padding-left:16px;padding-right:16px}
  .pjb{grid-template-columns:minmax(0,1fr);padding:0 8px}
  .pjb-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .pjb-h,.pjb-empty{grid-column:1/-1}
  .pjs-panel{top:auto;left:0;width:auto;max-height:82vh;border-radius:18px 18px 0 0;box-shadow:0 -24px 60px rgba(0,0,0,.4)}
  .pjx-hist .pay-hist-row{grid-template-columns:minmax(0,1fr) auto;padding-left:16px;padding-right:16px}
  .pjx-hist .pay-hist-row > span:nth-child(2),.pjx-hist .pay-hist-row > span:nth-child(3),.pjx-hist .pay-hist-row > span:nth-child(4),.pjx-hist .pay-hist-row > span:nth-child(5){display:none}
  .pjx-body .tz-kvs,.pjx-body .tz-vids,.pjx-body .tz-parties,.pjx-body .tz-legal,.pjx-body .tz-final,.pjx-body .pjx-sum,.pjx-body .pe-types,.pjx-body .pe-head,.pjx-body .pe-total{padding-left:16px;padding-right:16px}
}

/* ===== страница проекта: всё на одной странице (детали как в «Расходах», «Клиентах», «Команде») ===== */
.pjx-flip .ico{transform:scaleX(-1)}
.pjx-pg{margin-left:0}
.pjp3 .page-head p .crit{color:var(--crit);font-weight:600}
.pjp3 .page-head p .ok{color:var(--ok);font-weight:600}
.pjp3 .page-head .actions{gap:14px}
.pjp3 .exq-stat .val{font-size:28px}
.pjp3 .exq-stat .val.crit{color:var(--crit)}
.pj3-h{display:flex;align-items:center;gap:10px;margin:14px 0 -6px;font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:-.015em}
.pj3-h em{font-style:normal;font-family:var(--font-body);font-size:11px;font-weight:700;padding:2px 8px;border-radius:99px;background:var(--surface-3);color:var(--text)}
.pj3-board{container-type:inline-size;padding:16px 0 18px}
.pj3-empty{padding:26px;text-align:center;color:var(--muted);font-size:13.5px}
.pjb{--cw:calc((100cqw - 16px - 24px)/4);display:grid;grid-template-columns:repeat(4,var(--cw));gap:8px;align-items:start;padding:0 8px}
.pjb-col{display:flex;flex-direction:column;gap:8px;min-width:0}
.pjb-h{display:flex;align-items:center;gap:8px;padding:0 2px 2px;font-size:12px;font-weight:600;color:var(--muted)}
.pjb-h em{font-style:normal;font-weight:600;color:var(--text-2)}
.pjb-empty{display:grid;place-items:center;height:var(--evh,140px);border-radius:13px;box-shadow:inset 0 0 0 1.5px var(--border-strong);font-size:12.5px;color:var(--muted)}
.pjk{min-width:0}
.pjk .dw-ev{height:var(--evh,140px);cursor:pointer}
.pj3-modal{max-width:560px;width:100%;padding:24px}
.pj3-modal .exq-detail-head{align-items:center;margin-bottom:0}
.pj3-x{border:0;flex:none;margin-left:6px}
.pj3-dt{font-family:var(--font-display);font-size:24px;font-weight:700;letter-spacing:-.02em;line-height:1.2;margin:10px 0 16px}
.pj3-detail .exq-detail-item-a.crit{color:var(--crit)}
.pj3-detail .exq-detail-items{margin-bottom:16px}
.pj3-pay{cursor:default!important}
.pj3-pay:hover{box-shadow:none!important}
.pj3-pay .exq-detail-pay-sum.crit{color:var(--crit)}
.pj3-sec{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.pj3-sh{font-size:12.5px;font-weight:600;color:var(--muted)}
.pj3-files{display:flex;flex-wrap:wrap;gap:8px}
.pj3-files .btn i{font-style:normal;font-weight:400;color:var(--muted);margin-left:2px}
.pj3-addg{align-self:flex-start}
.pj3-done{font-size:13.5px;font-weight:600;color:var(--ok);display:inline-flex;align-items:center;gap:6px}
.pj3-detail .exq-detail-act{margin-top:auto}
@media(max-width:640px){.pjb{grid-template-columns:minmax(0,1fr);padding:0 8px}.pjb-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.pjb-h,.pjb-empty{grid-column:1/-1}.pj3-modal{padding:18px}}
@media(max-width:640px){.pjp3 .page-head .actions{width:100%}.pj3-dt{font-size:21px}}

/* ===== страница проекта: мини-дашборд (шапка и блоки как на дашборде, всё на одной странице) ===== */
.pjx-cnt{font-style:normal;margin-left:10px;padding:2px 9px;border-radius:99px;background:var(--surface-3);font-family:var(--font-body);font-size:12px;font-weight:700;color:var(--text-2);vertical-align:3px}
.pjx-dv .dv-head{padding-bottom:4px}
.pj3-tasks{padding:14px 0 18px}
.pj3-empty{padding:16px 24px;font-size:13.5px;color:var(--muted)}
.pj3-ver{text-align:center;font-size:11px;color:var(--muted);opacity:.6;padding:6px 0 2px}

/* ===== «Требует внимания»: блок как «Проекты», строки таблицей ===== */
.atn .dv-head{padding-bottom:4px}
.atn .proj-tab i{font-style:normal;margin-left:6px;font-weight:600;color:var(--muted)}
.atn .proj-tab.on i{color:inherit;opacity:.8}
.atn-list{padding:8px 0 8px}
.atn-r{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;align-items:center;column-gap:16px;padding:13px 20px;border-top:1px solid var(--border);transition:background .18s}
.atn-r:first-child{border-top:0}
.atn-r[role="button"]{cursor:pointer}
.atn-r:hover{background:color-mix(in srgb,var(--text) 5%,transparent)}
.atn-av .avatar{width:34px;height:34px;font-size:12px}
.atn-t{min-width:0;display:flex;flex-direction:column;gap:2px}
.atn-t b{font-size:14px;font-weight:600;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.atn-t span{font-size:12.25px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.atn-meta{font-size:13px;font-weight:600;white-space:nowrap;text-align:right}
.atn-late{color:var(--crit)}
.atn-late b{font-family:var(--font-display);font-size:15px;font-weight:700}
.atn-acts{display:flex;gap:8px;justify-content:flex-end}
.atn-acts .btn{height:auto;padding:6px 12px;font-size:12.5px}
#dbAttn[data-f="q"] .atn-r[data-k="h"],#dbAttn[data-f="h"] .atn-r[data-k="q"]{display:none}
#dbAttn .db-ok{padding:18px 24px}
@media(max-width:640px){
  .atn-r{grid-template-columns:34px minmax(0,1fr);row-gap:8px;padding:12px 16px}
  .atn-meta{grid-column:2;text-align:left}
  .atn-acts{grid-column:1/-1;justify-content:flex-start;flex-wrap:wrap}
}

/* ===== модалка задачи ===== */
.tkm{position:relative;max-width:620px;width:100%;padding:28px 30px 26px;display:flex;flex-direction:column;gap:0}
.tkm-x{position:absolute;top:18px;right:18px;border:0}
.tkm-proj{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--muted);text-decoration:none;padding-right:40px}
.tkm-proj .ico{width:13px;height:13px}
.tkm-proj:hover{color:var(--accent)}
.tkm-title{font-family:var(--font-display);font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1.1;margin:8px 0 14px}
.tkm-who{display:flex;align-items:center;gap:12px}
.tkm-who > div{display:flex;flex-direction:column;gap:1px;min-width:0}
.tkm-who b{font-size:14px;font-weight:600}
.tkm-who div span{font-size:12.5px;color:var(--muted)}
.tkm-st{margin-left:auto;font-size:12.5px;font-weight:600;color:var(--text-2);padding:5px 12px;border-radius:99px;background:color-mix(in srgb,var(--text) 7%,transparent);white-space:nowrap}
.tkm-st.crit{background:var(--crit-soft);color:var(--crit)}
.tkm-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:24px 0 4px;padding:18px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.tkm-n{display:flex;flex-direction:column;gap:2px;min-width:0}
.tkm-n span{font-size:12px;color:var(--muted)}
.tkm-n b{font-family:var(--font-display);font-size:26px;font-weight:800;letter-spacing:-.03em;line-height:1.15;white-space:nowrap}
.tkm-n b small{font-size:16px;font-weight:500;color:var(--muted);letter-spacing:0}
.tkm-n b.crit{color:var(--crit)}
.tkm-n em{font-style:normal;font-size:12.5px;color:var(--muted)}
.tkm-pen{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;padding:14px 16px;border-radius:14px;background:var(--crit-soft)}
.tkm-pen div{display:flex;flex-direction:column;gap:2px}
.tkm-pen b{font-size:13.5px;color:var(--text)}
.tkm-pen span{font-size:12.5px;color:var(--text-2)}
.tkm-pen strong{font-family:var(--font-display);font-size:22px;font-weight:800;letter-spacing:-.02em;color:var(--crit);white-space:nowrap}
.tkm-sec{display:flex;flex-direction:column;gap:8px;margin-top:18px}
.tkm-h{font-size:12.5px;font-weight:600;color:var(--muted)}
.tkm-files{display:flex;flex-wrap:wrap;gap:8px}
.tkm-gi{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--border)}
.tkm-gi div{display:flex;flex-direction:column;gap:1px}
.tkm-gi b{font-size:13.5px;font-weight:600}
.tkm-gi span{font-size:12px;color:var(--muted)}
.tkm-addg{align-self:flex-start}
.tkm-acts{display:flex;gap:10px;margin-top:22px}
.tkm-acts .btn{flex:1}
.tkm-done{font-size:13.5px;font-weight:600;color:var(--ok);display:inline-flex;align-items:center;gap:6px}
@media(max-width:640px){
  .tkm{padding:22px 18px 20px}
  .tkm-title{font-size:24px}
  .tkm-nums{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 14px}
  .tkm-acts{flex-direction:column}
}


/* ===== кебаб на карточке задачи ===== */
.dw-ev{position:relative}
.dw-ev--tk{cursor:default}
.dw-ev--tk > b:first-child{padding-right:24px}
.dw-k{position:absolute;top:6px;right:6px;width:26px;height:26px;border:0;border-radius:8px;background:transparent;color:var(--text-2);display:grid;place-items:center;padding:0;cursor:pointer;opacity:.7;transition:background .14s,opacity .14s}
.dw-k .ico{width:16px;height:16px}
.dw-ev:hover .dw-k,.dw-k:focus-visible{opacity:1}
.dw-k:hover{background:color-mix(in srgb,var(--text) 12%,transparent)}
.dw-ev--shoot .dw-k{color:#fff}
.dw-ev--shoot .dw-k:hover{background:rgba(255,255,255,.22)}
.tk-float{position:static;width:0;height:0}
.tk-float .dd-menu{z-index:200;opacity:1;visibility:visible;transform:none;pointer-events:auto}

/* ===== «Состав и техника» на странице проекта: карточки как на страницах «Подрядчики»/«Инвентарь» ===== */
.pjg-sec{padding:0 20px}
.pjg-sec + .pjg-sec{margin-top:18px}
.pjg-sec > .pj3-empty{padding:14px 0}
.pjg-h{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:600;color:var(--muted);padding:0 0 8px}
.pjg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.pjg-c{position:relative;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:var(--surface-3);cursor:pointer;text-align:left;border:0;font:inherit;color:inherit;width:100%;transition:background .15s}
.pjg-c:hover{background:color-mix(in srgb,var(--text) 8%,var(--surface-3))}
:root[data-theme="light"] .pjg-c{background:#f1f1f1}
.pjg-av{width:40px;height:40px;flex:none}
.pjg-ic{width:40px;height:40px;flex:none;border-radius:11px;background:color-mix(in srgb,var(--text) 8%,transparent);display:grid;place-items:center;color:var(--text-2)}
.pjg-ic .ico{width:19px;height:19px}
.pjg-i{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pjg-i b{font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pjg-cat{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pjg-vid{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pjg-vid .ico{width:11px;height:11px;flex:none}
.pjg-d{flex:none;text-align:right;font-size:12px;font-weight:600;color:var(--text-2);display:flex;flex-direction:column;gap:1px}
.pjg-d em{font-style:normal;font-weight:400;color:var(--muted)}

@media(max-width:640px){.pjg-sec{padding:0 16px}}

/* ===== единая кнопка «прикрепить файл» во всём мастере — та же высота/цвет поля, что и у остальных полей шага ===== */
.wz-filectl{display:inline-flex;align-items:center;gap:8px;cursor:pointer;width:fit-content;max-width:100%;min-width:0;flex-shrink:1;padding:0 16px;height:42px;border-radius:12px;border:0;background:var(--surface-2);color:var(--text-2);font-size:13.5px;font-weight:600;transition:background .15s,color .15s,box-shadow .2s;position:relative;box-sizing:border-box;overflow:hidden}
.wz-inrow .wz-filectl{flex:0 1 auto}
.wz-filectl .ico{width:16px;height:16px;flex:none;color:var(--muted);transition:color .15s}
.wz-filectl span,.wz-filectl b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.wz-filectl i{font-style:normal;font-size:11.5px;color:var(--muted);flex:none;margin-left:2px}
:root[data-theme="light"] .wz-filectl:not(.has){background:#e6e6e6}
.wz-filectl:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 10px 20px -10px rgba(255,93,0,.8),inset 0 1px 0 rgba(255,255,255,.25)}
:root[data-theme="light"] .wz-filectl:hover{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff}
.wz-filectl:hover .ico,.wz-filectl:hover i{color:#fff}
.wz-filectl.has{background:var(--accent-soft);color:var(--accent)}
.wz-filectl.has .ico{color:var(--accent)}
.wz-filectl-x{margin-left:auto;flex:none;width:24px;height:24px;border:0;border-radius:99px;background:transparent;color:inherit;display:grid;place-items:center;padding:0;cursor:pointer}
.wz-filectl-x:hover{background:rgba(0,0,0,.18);color:#fff}
.wz-filectl.has .wz-filectl-x:hover{background:color-mix(in srgb,var(--crit) 18%,transparent);color:var(--crit)}
.wz-filectl-x .ico{width:13px;height:13px;color:inherit}
.wz-filectl.compact{width:42px;min-width:42px;padding:0;justify-content:center;flex:none}
.wz-filectl.compact span{display:none}
.wz-filectl.compact.has{width:auto;max-width:170px;padding:0 12px;justify-content:flex-start}
.wz-filectl.compact.has b{font-size:11.5px}
.wz-filectl.compact .wz-filectl-x{width:18px;height:18px}
.wz-pills .wz-filectl.compact{margin-left:2px}
.wz-vc .wz-filectl{width:100%;justify-content:center}
.wz-vc .wz-filectl.has{justify-content:flex-start}
.wz-vc .wz-filectl.compact{width:42px}
.wz-vc .wz-filectl.compact.has{width:auto}
.wz-scup-row .wz-filectl{width:100%;justify-content:center}
/* сценарий: то же поле, что и остальные текстовые поля мастера (не «голубое») */
:root .main[data-view="newproject"] .page .wz-scbox textarea.in{background:var(--surface-2)!important}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-scbox textarea.in{background:#e6e6e6!important}
:root[data-theme="light"] .main[data-view="newproject"] .page .wz-scbox textarea.in:focus,:root .main[data-view="newproject"] .page .wz-scbox textarea.in:focus{background:var(--surface)!important}

/* экран входа / загрузки / ошибки (js/app/boot.js) */
.snap-login{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);padding:calc(24px + var(--tg-safe-top,0px)) 24px 24px}
.snap-login-card{width:100%;max-width:320px;text-align:center}
.snap-login-card .brand-logo{width:96px;height:auto;margin:0 auto 26px}
.snap-login-card h1{font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:-.01em;color:var(--text);margin:0 0 8px}
.snap-login-card p{font-size:13.5px;color:var(--muted);margin:0 0 22px;line-height:1.5}
.snap-login-card .snap-login-wait{margin:0}
#tgLoginWidget{display:flex;justify-content:center}

/* выход — низ сайдбара */
.sb-out{display:flex;align-items:center;gap:10px;height:36px;padding:0 10px;border:0;border-radius:10px;background:none;color:var(--muted);font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:background .2s,color .2s}
.sb-out:hover{background:var(--surface-2);color:var(--crit)}
.sb-out .ico{width:17px;height:17px}

/* «Приложение» — установка на рабочий стол */
.pwa{display:flex;flex-direction:column;gap:16px}
.pwa-hero{display:flex;align-items:center;gap:20px;padding:24px;border-radius:24px;background:linear-gradient(135deg,#06334a,#011d2b);color:#eef6f5;box-shadow:var(--shadow)}
.pwa-icon{width:76px;height:76px;border-radius:20px;box-shadow:0 14px 30px -10px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.08);flex:none}
.pwa-ht{flex:1;min-width:0}
.pwa-ht h1{font-family:var(--font-display);font-size:24px;font-weight:700;letter-spacing:-.02em;margin:0 0 6px;color:#fff}
.pwa-ht p{margin:0;font-size:13.5px;line-height:1.5;color:rgba(226,238,240,.72)}
.pwa-act{flex:none}
.pwa-card{padding:18px}
.pwa-tabs{margin-bottom:16px;overflow-x:auto}
.pwa-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;counter-reset:s}
.pwa-step{display:flex;gap:14px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--text-2)}
.pwa-step b{color:var(--text)}
.pwa-n{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#011d2b;font-weight:800;font-size:13px;box-shadow:0 6px 14px -6px rgba(255,93,0,.7),inset 0 1px 0 rgba(255,255,255,.3)}
:root[data-theme="dark"] .pwa-n{color:#fff}
.pwa-note{margin:16px 0 0;font-size:12.5px;color:var(--muted)}
@media(max-width:640px){
  .pwa-hero{flex-direction:column;align-items:flex-start;padding:20px;gap:14px}
  .pwa-act,.pwa-act .btn{width:100%}
  .pwa-act .btn{justify-content:center}
}

/* ——— окно задачи (js/features/task-sheet.js) ——— */
.tks{display:flex;flex-direction:column;gap:14px;padding:4px 20px 20px}
.tks-top{display:flex;align-items:center;gap:12px}
.tks-top .grow{min-width:0}
.tks-top b{display:block;font-size:14px}
.tks-top span{display:block;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tks-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.tks-flow span{display:flex;flex-direction:column;gap:6px;font-size:11.5px;font-weight:600;color:var(--muted)}
.tks-flow i{display:block;height:5px;border-radius:999px;background:var(--surface-3);transition:background .3s}
.tks-flow .done i{background:color-mix(in srgb,var(--accent) 45%,var(--surface-3))}
.tks-flow .cur{color:var(--text)}
.tks-flow .cur i{background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.tks-note{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:var(--surface-2);font-size:13px}
.tks-note .ico{width:18px;height:18px;color:var(--muted);flex:none;margin-top:1px}
.tks-note b{display:block}
.tks-note span{display:block;color:var(--text-2);margin-top:2px}
.tks-note.bad{background:var(--crit-soft)}
.tks-note.bad .ico,.tks-note.bad b{color:var(--crit)}
.tks-kvs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.tks-kv{padding:10px 12px;border-radius:12px;background:var(--surface-2)}
.tks-kv span{display:block;font-size:11.5px;color:var(--muted)}
.tks-kv b{display:block;font-size:14px;margin-top:2px}
.tks-kv.crit b{color:var(--crit)}
.tks-vids{display:flex;flex-wrap:wrap;gap:6px}
.tks-vids span{padding:4px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:600}
.tks-brief{border:1px solid var(--border);border-radius:14px;padding:0 14px}
.tks-brief summary{cursor:pointer;padding:12px 0;font-size:13px;font-weight:600;list-style:none}
.tks-brief summary::after{content:'›';float:right;transition:transform .2s;color:var(--muted)}
.tks-brief[open] summary::after{transform:rotate(90deg)}
.tks-br{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--border);font-size:12.5px}
.tks-br span{color:var(--muted);flex:none;max-width:45%}
.tks-br b,.tks-br a{text-align:right;font-weight:600;color:var(--text)}
.tks-br a{color:var(--accent);display:inline-flex;gap:4px;align-items:center}
.tks-br .ico{width:14px;height:14px}
.tks-pens{display:flex;flex-direction:column;gap:6px}
.tks-pens span{display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--crit)}
.tks-pens .ico{width:15px;height:15px}
.tks-acts{display:flex;flex-wrap:wrap;gap:8px;padding-top:4px}
.tks-acts .btn{flex:1 1 auto;justify-content:center}
.tks-wait,.tks-done{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted);padding:8px 4px}
.tks-done{color:var(--ok)}
.tks-wait .ico,.tks-done .ico{width:16px;height:16px}

/* ——— окно проверки задачи ——— */
.rv{display:flex;flex-direction:column;gap:14px;padding:4px 20px 20px}
.rv-opts{display:grid;gap:8px}
.rv-opt{display:flex;gap:12px;align-items:center;padding:12px 14px;border:1.5px solid var(--border);border-radius:14px;background:var(--surface);color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,background .2s,transform .2s}
.rv-opt:active{transform:scale(.98)}
.rv-opt .ico{width:20px;height:20px;color:var(--muted);flex:none}
.rv-opt b{display:block;font-size:14px}
.rv-opt em{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:1px}
.rv-opt.on{border-color:var(--accent);background:var(--accent-soft)}
.rv-opt.on .ico{color:var(--accent)}
.rv-revs{display:flex;flex-direction:column;gap:10px}
.rv-rev{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:14px;background:var(--surface-2)}
.rv-rev2{display:grid;grid-template-columns:minmax(0,1fr) 150px auto;gap:8px;align-items:center}
.rv-rev2 .kb-f{margin:0}
.rv-pen{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--crit-soft);cursor:pointer}
.rv-pen input{width:18px;height:18px;accent-color:var(--crit)}
.rv-pen b{display:block;font-size:13.5px;color:var(--crit)}
.rv-pen em{display:block;font-style:normal;font-size:12px;color:var(--text-2)}
@media(max-width:640px){ .rv-rev2{grid-template-columns:1fr 1fr} .tks,.rv{padding:4px 14px 16px} }

/* уведомления: пустое состояние и кликабельные строки */
.notif-empty{display:flex;flex-direction:column;align-items:center;gap:8px}
.notif-empty .ico{width:26px;height:26px;opacity:.5}
.notif-row{cursor:pointer;transition:background .15s}
.notif-row:hover{background:var(--surface-2)}
.notif-row--crit .notif-ic{color:var(--crit)}
.notif-row--ok .notif-ic{color:var(--ok)}
.notif-row--warn .notif-ic{color:var(--warn)}
.notif-tx{white-space:pre-line}
.cpln{display:flex;flex-direction:column;gap:14px;padding:4px 20px 20px}
.cpln-file{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;background:var(--surface-2);font-size:13px}
.cpln-file span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cpln-anon{margin:0;padding:12px 14px;border-radius:14px;background:var(--surface-2)}
.cpln-anon b{display:block;font-size:13.5px}
.cpln-anon em{display:block;font-style:normal;font-weight:500;font-size:12px;color:var(--muted)}
.sf-time{width:120px;height:36px;text-align:center;font-variant-numeric:tabular-nums}

/* модалки — поверх нижнего меню телефона (.bnav z-index:80) */
.modal-bg{z-index:90}
/* окна задачи / проверки / жалобы: длинное содержимое прокручивается внутри, кнопки не уезжают за экран */
.modal.cf-modal.tks-modal,.modal.cf-modal.rv-modal,.modal.cf-modal.cpln-modal{text-align:left;align-items:stretch;padding:20px 0 0;max-height:calc(var(--vvh,100vh) - 32px);width:100%}
.tks-modal .cf-h,.rv-modal .cf-h,.cpln-modal .cf-h{padding:0 20px;margin-bottom:10px}
.tks-modal .cf-h h3,.rv-modal .cf-h h3,.cpln-modal .cf-h h3{margin:0;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.tks-modal .modal-body,.rv-modal .modal-body,.cpln-modal .modal-body{overflow-y:auto;overscroll-behavior:contain;min-height:0;flex:1}
.tks-note b{display:flex;flex-wrap:wrap;gap:0 6px}
.tks-note b .overdue{white-space:nowrap}
@media(max-width:640px){
  .modal-bg:has(.tks-modal),.modal-bg:has(.rv-modal){padding:12px;align-items:end}
  .modal-bg:has(.cpln-modal){padding:12px;align-items:center}
  .tks-acts{position:sticky;bottom:0;background:var(--surface);padding:10px 0 4px;margin-top:-4px}
}
/* вкладки платформ на «Приложении» */
.pwa-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;margin-bottom:16px;border-radius:14px;background:var(--surface-2)}
.pwa-seg button{display:flex;align-items:center;justify-content:center;gap:6px;height:40px;border:0;border-radius:11px;background:none;color:var(--text-2);font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s}
.pwa-seg button .ico{width:16px;height:16px;flex:none}
.pwa-seg button.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00);color:#fff;box-shadow:0 8px 18px -8px rgba(255,93,0,.75),inset 0 1px 0 rgba(255,255,255,.25)}

/* вложения и оценка в окне задачи */
.tks-files{display:flex;flex-direction:column;gap:8px}
.tks-h{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);display:flex;gap:6px;align-items:center}
.tks-h em{font-style:normal;padding:1px 7px;border-radius:999px;background:var(--surface-3);color:var(--text-2);letter-spacing:0}
.tks-f{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:var(--surface-2)}
.tks-fi{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);flex:none}
.tks-fi .ico{width:17px;height:17px}
.tks-fn{flex:1;min-width:0;text-decoration:none;color:var(--text)}
.tks-fn b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tks-fn em{display:block;font-style:normal;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tks-empty{font-size:12.5px;color:var(--muted);padding:2px 0}
.tks-fadd{display:flex;gap:8px}
.tks-fadd .btn{flex:1;justify-content:center}
.tks-link{display:flex;flex-direction:column;gap:8px;padding:10px;border-radius:12px;background:var(--surface-2)}
.tks-link-a{display:flex;gap:8px;justify-content:flex-end}
.tks-rate{font-size:18px;color:#f5a524;letter-spacing:2px}
.tks-rate i{font-style:normal;color:var(--surface-3)}
.tks-rate span{display:block;font-size:12.5px;color:var(--text-2);letter-spacing:0;margin-top:2px}
/* оценка проекта */
.rt .pjx-body{display:flex;flex-direction:column;gap:18px}
.rt-sec{display:flex;flex-direction:column;gap:8px}
.rt-h{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.rt-nps{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:4px}
.rt-nps button{height:38px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);font:inherit;font-weight:700;cursor:pointer;transition:all .15s}
.rt-nps button.on.lo{background:var(--crit);border-color:var(--crit);color:#fff}
.rt-nps button.on.mid{background:var(--warn);border-color:var(--warn);color:#fff}
.rt-nps button.on.hi{background:var(--ok);border-color:var(--ok);color:#fff}
.rt-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1.2fr);gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--surface-2)}
.rt-who{min-width:0}
.rt-who b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-who span{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-ic{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--surface-3);color:var(--accent)}
.rt-ic .ico{width:15px;height:15px}
.rt-stars{display:flex;gap:2px}
.rt-stars button{width:30px;height:30px;border:0;background:none;font-size:22px;line-height:1;color:var(--surface-3);cursor:pointer;transition:transform .15s,color .15s;padding:0}
.rt-stars button.on{color:#f5a524}
.rt-stars button:active{transform:scale(1.25)}
.rt-note{height:36px}
.rt-foot{display:flex;justify-content:flex-end}
@media(max-width:640px){
  .rt-row{grid-template-columns:auto minmax(0,1fr);row-gap:8px}
  .rt-row .rt-stars{grid-column:1/-1}
  .rt-row .rt-note{grid-column:1/-1}
  .rt-nps{grid-template-columns:repeat(6,minmax(0,1fr))}
  .rt-foot .btn{width:100%;justify-content:center}
}
.pay-exp{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
@media(max-width:640px){ .pay-exp{width:100%} .pay-exp .dd{flex:1} }
.tm-star{color:#f5a524}
.tm-rc{font-style:normal;color:var(--muted);font-weight:500}

/* «капля» на кнопках (js/core/gestures.js) */
.rp-wrap{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none;z-index:0}
.rp{position:absolute;border-radius:50%;background:currentColor;opacity:.18;transform:scale(0);animation:rp .6s cubic-bezier(.2,.8,.3,1) forwards}
.btn--primary .rp,.btn--crit .rp{background:#fff;opacity:.3}
@keyframes rp{to{transform:scale(1);opacity:0}}
.btn,button{-webkit-tap-highlight-color:transparent}
.btn{transition:transform .18s cubic-bezier(.34,1.5,.5,1),background .2s,box-shadow .2s,color .2s}
.btn:active:not(:disabled){transform:scale(.96)}
.snap-login-btn{width:100%;justify-content:center;height:46px;font-size:15px}
.snap-login-hint{margin:14px 0 0!important;font-size:12.5px!important}
.snap-login-hint a{color:var(--accent)}

.snap-match{display:flex;flex-direction:column;align-items:center;gap:4px;margin:0 0 16px;padding:14px;border-radius:18px;background:var(--accent-soft)}
.snap-match span{font-size:12.5px;color:var(--text-2)}
.snap-match b{font-family:var(--font-display);font-size:46px;line-height:1;color:var(--accent);letter-spacing:.02em}
.snap-login-or{display:flex;align-items:center;gap:10px;margin:22px 0 12px;color:var(--muted);font-size:12px}
.snap-login-or::before,.snap-login-or::after{content:'';flex:1;height:1px;background:var(--border)}
.snap-pin{display:flex;gap:8px}
.snap-pin .in{flex:1;text-align:center;font-size:20px;letter-spacing:.2em;font-variant-numeric:tabular-nums;height:46px}
.snap-pin .btn{height:46px}
.pwa-warn{display:flex;gap:12px;padding:12px 14px;margin-bottom:16px;border-radius:14px;background:var(--warn-soft);font-size:13px;line-height:1.45}
.pwa-warn .ico{width:20px;height:20px;color:var(--warn);flex:none;margin-top:1px}
.pwa-warn b{display:block;margin-bottom:2px}
.pwa-warn span{color:var(--text-2)}
.pwa-code{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.pwa-code b{display:block;font-size:15px}
.pwa-code span{display:block;font-size:13px;color:var(--muted);margin-top:2px}
.pwa-pin{font-family:var(--font-display);font-size:40px;font-weight:700;letter-spacing:.12em;color:var(--accent);font-variant-numeric:tabular-nums}
.pwa-pin-t{font-size:12px!important}
/* уведомления: список прокручивается внутри, окно не растёт */
.notif-pop .notif-list{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
@media(max-width:640px){ :root .notif-pop{position:fixed;left:10px;right:10px;width:auto;z-index:95} }
.pwa-sec{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.pwa-sec b{display:block;font-size:15px}
.pwa-sec span{display:block;font-size:13px;color:var(--muted);margin-top:2px}
.pwa-out{color:var(--crit)}
.pwa-out .ico{width:16px;height:16px}
@media(max-width:640px){ .pwa-out,.pwa-code .btn{width:100%;justify-content:center} .pwa-seg button span{font-size:12px} }
/* «Смотреть как»: выбранный — яркая оранжевая плашка с градиентом и тенью; текст и галочка — по теме */
.viewas-row.on{background:linear-gradient(180deg,#ff7a2e,#ff5d00);box-shadow:0 10px 22px -10px rgba(255,93,0,.75),inset 0 1px 0 rgba(255,255,255,.25)}
.viewas-row.on .viewas-i .n,.viewas-row.on .viewas-i .r,.viewas-row.on .viewas-ck{color:#011d2b}
.viewas-row.on .viewas-i .r{opacity:.75}
:root[data-theme="dark"] .viewas-row.on .viewas-i .n,:root[data-theme="dark"] .viewas-row.on .viewas-i .r,:root[data-theme="dark"] .viewas-row.on .viewas-ck{color:#fff}
.viewas-row.on .viewas-ck{stroke-width:2.6}

/* мобильная копия «Добавить» в шапке страницы — только на телефоне (на десктопе кнопка в тулбаре) */
.page-head .actions.pj-mobadd{display:none}
@media(max-width:640px){ :root .main[data-view="gear"] .page-head .actions.pj-mobadd,:root .main[data-view="actors"] .page-head .actions.pj-mobadd,:root .main[data-view="locations"] .page-head .actions.pj-mobadd,:root .main[data-view="clients"] .page-head .actions.pj-mobadd{display:flex} }