/* fulfillment-cc UI — дизайн-система v3 */

/* ── Темы: light / dark / aurora ─────────────────────────── */
:root{
  --bg:#F4F5F7;--surface:#FFFFFF;--surface2:#F7F8FA;
  --border:#EAEAEF;--border2:#DEDEE6;
  --text:#15151A;--muted:#65656F;--faint:#9A9AA4;
  --brand:#5B57D6;--brand-soft:#ECECFB;
  --green:#15935C;--green-soft:#E6F4EC;
  --amber:#946400;--amber-soft:#FAF0DA;
  --red:#C7423F;--red-soft:#FBEAEA;
  --teal:#0E8C8C;--teal-soft:#E0F3F3;
  --r:14px;--r-sm:9px;
  --shadow:0 1px 2px rgba(16,16,20,.04),0 2px 8px rgba(16,16,20,.04);
}
html.theme-dark{
  --bg:#0a0a14;--surface:#16161C;--surface2:#1C1C23;
  --border:#27272F;--border2:#34343E;
  --text:#ECECF0;--muted:#9A9AA6;--faint:#6B6B77;
  --brand:#807CEC;--brand-soft:#23223A;
  --green:#3DD68C;--green-soft:#11241C;
  --amber:#E0A93B;--amber-soft:#2A2113;
  --red:#F0726E;--red-soft:#2B1514;
  --teal:#3FD0D0;--teal-soft:#10262A;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 2px 10px rgba(0,0,0,.25);
}
html.theme-aurora{
  --bg:#0A0A14;--surface:rgba(255,255,255,.045);--surface2:rgba(255,255,255,.08);
  --border:rgba(255,255,255,.10);--border2:rgba(255,255,255,.17);
  --text:#E7E9F3;--muted:#9DA1B5;--faint:#6C7088;
  --brand:#A78BFA;--brand-soft:rgba(139,92,246,.24);
  --green:#4ADE9A;--green-soft:rgba(34,160,100,.18);
  --amber:#F2B441;--amber-soft:rgba(180,130,20,.18);
  --red:#FB7A78;--red-soft:rgba(190,60,60,.18);
  --teal:#5BD6D6;--teal-soft:rgba(30,170,170,.16);
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 40px rgba(90,50,170,.16);
}
html.theme-aurora .card,html.theme-aurora .auth-box{
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
}
.aurora-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:0;transition:opacity .5s}
html.theme-aurora .aurora-bg{opacity:1}
.aurora-bg .ga{position:absolute;border-radius:50%;filter:blur(100px)}
.aurora-bg .g1{top:-100px;left:-80px;width:400px;height:400px;background:rgba(37,99,235,.3)}
.aurora-bg .g2{top:40%;right:-60px;width:380px;height:380px;background:rgba(99,102,241,.2)}
.aurora-bg .g3{bottom:-80px;left:40%;width:400px;height:400px;background:rgba(14,116,144,.2)}

/* ── Reset ───────────────────────────────────────────────── */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:var(--bg);color:var(--text);font-size:14.5px;line-height:1.5;
  -webkit-font-smoothing:antialiased;transition:background .2s,color .2s;
}
a{color:inherit;text-decoration:none}
::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:6px}

/* ── Layout ──────────────────────────────────────────────── */
.app{display:flex;min-height:100vh;position:relative;z-index:1}

/* ── Sidebar ─────────────────────────────────────────────── */
.sidebar{
  width:250px;flex:0 0 250px;
  background:var(--surface);border-right:1px solid var(--border);
  display:flex;flex-direction:column;padding:18px 14px;
  position:sticky;top:0;height:100vh;overflow:hidden;
  transition:width .22s cubic-bezier(.4,0,.2,1),flex .22s cubic-bezier(.4,0,.2,1);
  z-index:20;
}
html.theme-dark .sidebar,html.theme-aurora .sidebar{
  background:rgba(255,255,255,.025);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
}
.sidebar.sb-collapsed{width:64px;flex:0 0 64px}

/* Brand */
.sb-brand{display:flex;align-items:center;justify-content:space-between;padding:6px 8px 18px}
.sb-logo{display:flex;align-items:center;gap:11px;overflow:hidden}
.sb-logo-mark{
  width:36px;height:36px;border-radius:10px;flex-shrink:0;
  background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:20px;
  box-shadow:0 4px 14px rgba(124,58,237,.35);
}
.sb-logo-text{overflow:hidden;white-space:nowrap;transition:opacity .15s,width .22s}
.sb-name{font-size:15px;font-weight:600;color:var(--text);display:block;line-height:1.15}
.sb-sub{font-size:12px;color:var(--faint)}
.sb-collapse-btn{
  background:transparent;border:0;color:var(--faint);
  padding:5px;border-radius:7px;cursor:pointer;font-size:16px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.15s;
}
.sb-collapse-btn:hover{background:var(--surface2);color:var(--text)}
.sb-collapsed .sb-logo-text{opacity:0;width:0;pointer-events:none}
.sb-collapsed .sb-collapse-btn{margin:0 auto}
.sb-collapsed .sb-brand{justify-content:center;padding:6px 0 18px}

/* Nav */
.sb-nav{display:flex;flex-direction:column;gap:3px;margin-top:4px;flex:1;overflow-y:auto;overflow-x:hidden}
.sb-nav::-webkit-scrollbar{width:0}
.sb-section{
  font-size:11px;font-weight:600;color:var(--faint);text-transform:uppercase;
  letter-spacing:.04em;padding:14px 12px 6px;white-space:nowrap;overflow:hidden;transition:opacity .15s;
}
.sb-collapsed .sb-section{opacity:0;height:0;padding:0;pointer-events:none}
.sb-link{
  display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--r-sm);
  color:var(--muted);font-weight:500;font-size:14px;transition:.15s;
  border:1px solid transparent;white-space:nowrap;
}
.sb-link:hover{
  background:linear-gradient(to right,rgba(124,58,237,.15),rgba(217,70,239,.08));
  border-color:rgba(124,58,237,.2);color:var(--text);
}
.sb-link.sb-active{
  background:linear-gradient(to right,rgba(124,58,237,.25),rgba(217,70,239,.12));
  border-color:rgba(124,58,237,.4);color:#fff;font-weight:600;
}
.sb-icon{font-size:20px;flex-shrink:0;width:20px;text-align:center}
.sb-label{transition:opacity .15s;overflow:hidden;text-overflow:ellipsis}
.sb-collapsed .sb-label{opacity:0;width:0;padding:0}
.sb-collapsed .sb-link{margin:0 auto;width:46px;justify-content:center;padding:10px 0;gap:0}
.sb-collapsed .sb-icon{width:20px}

/* Footer */
.sb-foot{margin-top:auto;display:flex;flex-direction:column;gap:8px;padding-top:10px}
.sb-themes{
  display:flex;gap:3px;border-radius:var(--r-sm);
  background:var(--surface2);border:1px solid var(--border);padding:4px;
}
.sb-th{
  flex:1;background:transparent;border:0;color:var(--muted);border-radius:7px;
  padding:7px 0;cursor:pointer;font-size:15px;display:flex;align-items:center;
  justify-content:center;transition:.15s;
}
.sb-th:hover{color:var(--text)}
.sb-th.on{background:var(--surface);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.15)}
.sb-sync{
  padding:10px 8px;border-top:1px solid var(--border);
  display:flex;align-items:center;gap:9px;font-size:13px;color:var(--muted);
}
.sb-sync-dot{
  width:30px;height:30px;border-radius:50%;flex-shrink:0;
  background:var(--green-soft);color:var(--green);
  display:flex;align-items:center;justify-content:center;font-size:15px;
}
.sb-user{
  display:flex;align-items:center;gap:9px;padding:8px;
  border-top:1px solid var(--border);
}
.sb-av{
  width:30px;height:30px;border-radius:8px;flex-shrink:0;
  background:var(--brand-soft);color:var(--brand);
  display:flex;align-items:center;justify-content:center;font-size:14px;
}
.sb-user-info{flex:1;min-width:0;transition:opacity .15s}
.sb-user-email{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sb-logout{font-size:11.5px;color:var(--red);display:flex;align-items:center;gap:3px;transition:.12s}
.sb-logout:hover{filter:brightness(1.2)}
.sb-collapsed .sb-user-info,.sb-collapsed .sb-sync > div{opacity:0;width:0;overflow:hidden}
.sb-collapsed .sb-user{justify-content:center}

/* ── Accordion nav items ─────────────────────────────────── */
.sb-acc-hd{
  display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--r-sm);
  color:var(--muted);font-weight:500;font-size:14px;cursor:pointer;transition:.15s;
  border:1px solid transparent;
}
.sb-acc-hd:hover{
  background:linear-gradient(to right,rgba(124,58,237,.15),rgba(217,70,239,.08));
  border-color:rgba(124,58,237,.2);color:var(--text);
}
.sb-acc-chev{margin-left:auto;font-size:15px;transition:transform .2s;flex-shrink:0}
.sb-acc.open .sb-acc-chev{transform:rotate(90deg)}
.sb-acc-body{display:none;flex-direction:column;gap:1px;padding:2px 0 4px 20px}
.sb-acc.open .sb-acc-body{display:flex}
.sb-acc-link{
  display:flex;align-items:center;gap:9px;padding:8px 12px;border-radius:var(--r-sm);
  color:var(--muted);font-size:13px;font-weight:500;transition:.15s;border:1px solid transparent;
}
.sb-acc-link:hover{background:rgba(124,58,237,.1);color:var(--text)}
.sb-acc-link.sb-active{color:var(--brand);font-weight:600;background:var(--brand-soft)}
.sb-soon{opacity:.45;pointer-events:none;cursor:default}
.sb-soon-tag{
  margin-left:auto;font-size:10px;background:var(--surface2);
  border:1px solid var(--border);padding:1px 7px;border-radius:99px;color:var(--faint);flex-shrink:0;
}
.sb-collapsed .sb-acc-body{display:none!important}
.sb-collapsed .sb-acc-hd{justify-content:center;padding:10px 0;margin:0 auto;width:46px}

/* Expand button (в topbar когда collapsed) */
.sb-expand-btn{
  background:transparent;border:1px solid var(--border);border-radius:var(--r-sm);
  color:var(--muted);padding:7px 9px;cursor:pointer;font-size:17px;
  display:flex;align-items:center;justify-content:center;transition:.12s;
}
.sb-expand-btn:hover{background:var(--surface2);color:var(--text)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  background:var(--surface);border-bottom:1px solid var(--border);
  padding:15px 28px;display:flex;align-items:center;justify-content:space-between;
  position:sticky;top:0;z-index:10;gap:12px;flex-wrap:wrap;
}
.topbar-l{display:flex;align-items:center;gap:10px}
.topbar h1{font-size:18px;font-weight:600;letter-spacing:-.01em}
.topbar-r{display:flex;align-items:center;gap:8px}
/* Липкий topbar ОБЯЗАН быть непрозрачным: в dark/aurora --surface полупрозрачный →
   прокручиваемый контент просвечивал сквозь него (наезд текста). Матовое стекло. */
html.theme-dark .topbar{background:#13131c}
html.theme-aurora .topbar{background:rgba(12,12,22,.85);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
html.theme-dark .mob-bar{background:#13131c}
html.theme-aurora .mob-bar{background:rgba(12,12,22,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.content{padding:22px 28px 60px;max-width:1280px}

/* ── Cards ───────────────────────────────────────────────── */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow)}
.card.pad{padding:20px 22px}
.card-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 20px;border-bottom:1px solid var(--border);
}
.card-title{font-size:14px;font-weight:600}
.card-body{padding:16px 20px}

/* ── KPI метрики ─────────────────────────────────────────── */
.kpi-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));margin-bottom:20px}
.kpi{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r);
  box-shadow:var(--shadow);padding:18px 20px;position:relative;overflow:hidden;
}
.kpi-ico{
  position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;font-size:17px;
}
.kpi-ico.brand{background:var(--brand-soft);color:var(--brand)}
.kpi-ico.green{background:var(--green-soft);color:var(--green)}
.kpi-ico.amber{background:var(--amber-soft);color:var(--amber)}
.kpi-ico.teal{background:var(--teal-soft);color:var(--teal)}
.kpi-ico.red{background:var(--red-soft);color:var(--red)}
.kpi-lbl{font-size:12.5px;color:var(--muted);font-weight:500}
.kpi-val{font-size:26px;font-weight:700;margin-top:4px;letter-spacing:-.03em;line-height:1.1}
.kpi-sub{font-size:12px;color:var(--faint);margin-top:5px}

/* ── Buttons ─────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:6px;background:var(--brand);color:#fff;
  border:0;border-radius:var(--r-sm);padding:9px 16px;font:inherit;font-weight:500;
  font-size:13.5px;cursor:pointer;white-space:nowrap;transition:.12s;
}
.btn:hover{filter:brightness(1.1)}
.btn.ghost{background:var(--surface);color:var(--text);border:1px solid var(--border2)}
.btn.ghost:hover{background:var(--surface2)}
.btn.sm{padding:6px 12px;font-size:12.5px}
.btn.xs{padding:4px 10px;font-size:12px}
.btn.danger{background:var(--red)}
.btn.success{background:var(--green)}
.btn i{font-size:16px}
button{
  display:inline-flex;align-items:center;gap:5px;
  background:var(--brand);color:#fff;border:0;border-radius:var(--r-sm);
  padding:8px 14px;font:inherit;font-size:13.5px;font-weight:500;cursor:pointer;transition:.12s;
}
button:hover{filter:brightness(1.1)}
button.ghost{background:var(--surface);color:var(--text);border:1px solid var(--border2)}
button.ghost:hover{background:var(--surface2)}
button.sm{padding:5px 11px;font-size:12.5px}
button.danger{background:var(--red)}

/* ── Chips / badges ──────────────────────────────────────── */
.chip{
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 9px;border-radius:99px;font-size:12px;font-weight:500;
  background:var(--surface2);border:1px solid var(--border);color:var(--muted);
  line-height:1.4;
}
.chip i{font-size:13px}
.chip.green{background:var(--green-soft);color:var(--green);border-color:transparent}
.chip.amber{background:var(--amber-soft);color:var(--amber);border-color:transparent}
.chip.red{background:var(--red-soft);color:var(--red);border-color:transparent}
.chip.brand{background:var(--brand-soft);color:var(--brand);border-color:transparent}
.chip.teal{background:var(--teal-soft);color:var(--teal);border-color:transparent}

/* ── Tables ──────────────────────────────────────────────── */
.tbl{width:100%;border-collapse:collapse}
.tbl th{
  font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;
  color:var(--faint);padding:11px 16px;text-align:left;
  border-bottom:1px solid var(--border);background:var(--surface2);
}
.tbl td{padding:11px 16px;font-size:13.5px;border-bottom:1px solid var(--border);vertical-align:middle}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl tbody tr:hover{background:var(--surface2)}
.tbl td strong{font-weight:600}
.num{text-align:right!important;font-variant-numeric:tabular-nums}
.money{font-weight:600;font-variant-numeric:tabular-nums}

/* ── Forms ───────────────────────────────────────────────── */
input[type=text],input[type=email],input[type=password],input[type=number],
input[type=search],select,textarea{
  background:var(--surface2);border:1px solid var(--border2);border-radius:var(--r-sm);
  color:var(--text);font:inherit;font-size:13.5px;padding:8px 11px;
  width:100%;transition:.12s;outline:none;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft);
}
input::placeholder,textarea::placeholder{color:var(--faint)}
input[readonly]{opacity:.7;cursor:default}
label{font-size:13px;font-weight:500;color:var(--muted);display:block}
label > input,label > select,label > textarea{margin-top:5px}

/* ── Flash banner ────────────────────────────────────────── */
.flash{
  padding:11px 16px;border-radius:var(--r-sm);font-size:13.5px;
  display:flex;align-items:center;gap:9px;margin-bottom:14px;
}
.flash i{font-size:17px;flex-shrink:0}
.flash.info{background:var(--brand-soft);color:var(--brand);border:1px solid var(--brand-soft)}
.flash.success{background:var(--green-soft);color:var(--green)}
.flash.warn{background:var(--amber-soft);color:var(--amber)}
.flash.err{background:var(--red-soft);color:var(--red)}

/* ── Pills / tags ────────────────────────────────────────── */
.pills{display:flex;flex-wrap:wrap;gap:7px}
.pill{
  display:inline-flex;align-items:center;gap:5px;padding:5px 13px;border-radius:99px;
  font-size:12.5px;font-weight:500;background:var(--brand-soft);color:var(--brand);
}
.pill.ok{background:var(--green-soft);color:var(--green)}
.pill.warn{background:var(--amber-soft);color:var(--amber)}
.pill.red{background:var(--red-soft);color:var(--red)}
.pill.muted{background:var(--surface2);color:var(--muted);border:1px solid var(--border)}

/* ── Details / accordion ─────────────────────────────────── */
details summary{
  padding:12px 20px;cursor:pointer;color:var(--brand);font-weight:600;font-size:13.5px;
  display:flex;align-items:center;gap:7px;list-style:none;
}
details summary::-webkit-details-marker{display:none}
details summary::before{content:'\ea6c';font-family:tabler-icons;font-size:16px;transition:.2s}
details[open] summary::before{transform:rotate(90deg)}
details .det-body{padding:6px 20px 20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}

/* ── Selectors / filters ─────────────────────────────────── */
.filter-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.filter-bar form{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.filter-bar select,.filter-bar input{width:auto}

/* ── Utils ───────────────────────────────────────────────── */
.mt{margin-top:14px}.mt2{margin-top:20px}.mb{margin-bottom:14px}.mb2{margin-bottom:20px}
.sep{height:1px;background:var(--border);margin:18px 0}
.muted{color:var(--muted)}.faint{color:var(--faint)}
.mono{font-family:ui-monospace,'Fira Code',monospace;font-size:12.5px;word-break:break-all}
.label{font-size:11.5px;font-weight:600;color:var(--faint);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px}
.empty{padding:48px 24px;text-align:center;color:var(--faint)}
.empty i{font-size:36px;display:block;margin-bottom:10px;opacity:.5}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
@media(max-width:860px){.g2,.g3{grid-template-columns:1fr}}
.flex-sb{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.link{color:var(--brand);cursor:pointer}
.link:hover{text-decoration:underline}
.back{display:inline-flex;align-items:center;gap:5px;color:var(--muted);font-size:13.5px;margin-bottom:14px}
.back:hover{color:var(--text)}

/* ── Auth pages ──────────────────────────────────────────── */
.auth-wrap{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg)}
.auth-box{
  width:390px;max-width:94vw;
  background:var(--surface);border:1px solid var(--border);
  border-radius:18px;box-shadow:0 4px 24px rgba(15,23,42,.12);overflow:hidden;
}
.auth-head{padding:30px 28px 20px;text-align:center;border-bottom:1px solid var(--border)}
.auth-logo{
  width:52px;height:52px;border-radius:14px;background:var(--brand);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:22px;font-weight:800;margin:0 auto 14px;
}
.auth-title{font-size:20px;font-weight:700;margin-bottom:5px}
.auth-sub{font-size:13.5px;color:var(--muted)}
.auth-body{padding:22px 28px 28px;display:flex;flex-direction:column;gap:14px}

/* ── Mobile ──────────────────────────────────────────────── */
.mob-bar{display:none}
.mob-menu-btn{
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:8px;
  color:#fff;padding:7px 9px;cursor:pointer;font-size:17px;
  display:flex;align-items:center;justify-content:center;
}
.sb-overlay{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:19;
}
@media(max-width:860px){
  .sidebar{position:fixed;top:0;left:0;height:100vh;transform:translateX(-100%);transition:transform .25s cubic-bezier(.4,0,.2,1);width:248px!important;flex:unset!important}
  .sidebar.mob-open{transform:translateX(0)}
  .sb-overlay.open{display:block}
  .mob-bar{
    display:flex;align-items:center;justify-content:space-between;
    padding:11px 16px;
    background:var(--surface);
    border-bottom:1px solid var(--border);
    position:sticky;top:0;z-index:25;
  }
  .content{padding:16px 16px 50px}
  .topbar{padding:12px 16px}
  .topbar h1{font-size:16px}
  .kpi-grid{grid-template-columns:1fr 1fr}
  .sb-expand-btn{display:none!important}
}

/* ── Who: аватар+имя+подпись в строке таблицы (облик макета) ─ */
.who{display:flex;align-items:center;gap:11px}
.who .av{
  width:34px;height:34px;border-radius:9px;flex:0 0 34px;
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:600;background:var(--brand-soft);color:var(--brand);
}
.who b{font-weight:600;display:block;line-height:1.25}
.who span{font-size:12px;color:var(--faint)}

/* ── Карточки сотрудников (.emp/.ecard) ──────────────────── */
.emp{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.ecard{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r);
  box-shadow:var(--shadow);padding:16px 18px;display:flex;gap:14px;align-items:center;
}
.ecard .av{
  width:42px;height:42px;border-radius:50%;flex-shrink:0;
  background:var(--brand-soft);color:var(--brand);
  display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;
}
.ecard .inf b{display:block;font-size:14px;font-weight:600;line-height:1.3}
.ecard .inf span{font-size:12px;color:var(--muted)}
.badge{margin-left:auto;font-size:12px;font-weight:500;padding:4px 10px;border-radius:99px}
.badge.on-shift{background:var(--green-soft);color:var(--green)}
.badge.off-shift{background:var(--surface2);color:var(--muted)}

/* ── Page header (шапка лендинга модуля) ─────────────────── */
.page-header{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px;margin-bottom:22px}
.page-h2{font-size:23px;font-weight:700;letter-spacing:-.02em;line-height:1.15;color:var(--text)}
.page-sub{font-size:13.5px;color:var(--muted);margin-top:5px;max-width:720px;line-height:1.5}
.section-h{font-size:12px;font-weight:600;color:var(--faint);text-transform:uppercase;letter-spacing:.04em;margin-bottom:12px}

/* ── Action cards (карты-разделы: плотные, мелкая плашка, без chevron) ─ */
.action-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(225px,1fr));gap:14px;margin-bottom:26px}
.action{
  display:block;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r);box-shadow:var(--shadow);padding:18px;
  transition:transform .15s,border-color .15s,box-shadow .15s;
}
.action:hover{transform:translateY(-2px);border-color:rgba(124,58,237,.4);box-shadow:0 6px 24px rgba(124,58,237,.18)}
html.theme-aurora .action{backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.action-ico{
  width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  font-size:19px;background:var(--brand-soft);color:var(--brand);
}
.action-ico.green{background:var(--green-soft);color:var(--green)}
.action-ico.amber{background:var(--amber-soft);color:var(--amber)}
.action-ico.teal{background:var(--teal-soft);color:var(--teal)}
.action-ico.red{background:var(--red-soft);color:var(--red)}
.action-title{font-size:14.5px;font-weight:600;color:var(--text);margin-top:13px}
.action-desc{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.45}
.action-status{font-size:11.5px;margin-top:11px;color:var(--green);display:flex;align-items:center;gap:5px}
.action-status .dot{font-size:8px;line-height:1}
.action.primary{border-color:rgba(124,58,237,.35);background:linear-gradient(to bottom right,var(--brand-soft),transparent)}

/* ── Команда: раскрытие строки редактирования (без JS) + пилюли разделов ──── */
.emp-edit{display:none;padding:14px 16px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--r-sm);margin:0 0 10px}
.emp-tgl:checked ~ .emp-edit{display:block}
.blk-pills{display:flex;flex-wrap:wrap;gap:8px}
.blk-pill{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:99px;font-size:12.5px;
  background:var(--surface);border:1px solid var(--border);color:var(--muted);cursor:pointer;transition:.12s}
.blk-pill:hover{border-color:var(--border2);color:var(--text)}
.blk-pill input{width:auto;margin:0;accent-color:var(--brand)}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;align-items:end}

/* util */
.hide{display:none!important}