/* Sterownia AGBO — design system. Ciemny „mostek dowodzenia”, mobile-first. */
:root{
  --bg:#070b14; --bg2:#0a101c; --panel:#0e1524; --panel2:#141d31; --panel3:#1a2540;
  --line:#1e2a42; --line2:#2a3858; --grid:rgba(124,156,255,.06);
  --txt:#e6ebf5; --txt2:#c3cce0; --mut:#8b97ae; --mut2:#64708a;
  --acc:#7c9cff; --acc-bg:rgba(124,156,255,.12); --cyan:#22d3ee;
  --ok:#34d399; --ok-bg:rgba(52,211,153,.12); --warn:#fbbf24; --warn-bg:rgba(251,191,36,.12);
  --err:#f87171; --err-bg:rgba(248,113,113,.12); --sleep:#64748b; --probny:#c084fc; --fired:#475569;
  --bx:#2f7be5; --bx-bg:rgba(47,123,229,.14);
  --r-s:8px; --r:14px; --r-l:20px;
  --sp1:4px; --sp2:8px; --sp3:12px; --sp4:16px; --sp5:24px; --sp6:32px;
  --fs-xs:.72rem; --fs-s:.82rem; --fs:.92rem; --fs-m:1.02rem; --fs-l:1.25rem; --fs-xl:1.7rem;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"DejaVu Sans Mono",monospace;
  --tab-h:64px; --safe-b:env(safe-area-inset-bottom,0px); --safe-t:env(safe-area-inset-top,0px);
  --shadow:0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--txt);font-family:var(--font);font-size:16px;line-height:1.45}
body{
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:28px 28px;background-attachment:fixed;
}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;
  background:radial-gradient(ellipse 80% 55% at 50% 0%,rgba(124,156,255,.10),transparent 60%),radial-gradient(ellipse at 50% 40%,transparent 0,var(--bg) 75%)}
a{color:var(--acc);text-decoration:none}a:hover{text-decoration:underline}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
.ic{flex:none;vertical-align:middle}
h1,h2,h3,h4{margin:0;line-height:1.25;letter-spacing:.01em}
h2.sec{display:flex;align-items:center;gap:var(--sp2);font-size:var(--fs-m);margin:var(--sp5) 0 var(--sp3)}
h2.sec .ic{color:var(--acc)}h2.sec small{color:var(--mut);font-weight:500;font-size:var(--fs-s);margin-left:auto}
pre{white-space:pre-wrap;word-break:break-word;font-family:var(--mono);font-size:.78rem;line-height:1.5;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r-s);padding:var(--sp3);margin:var(--sp2) 0;max-height:420px;overflow:auto;color:var(--txt2)}
.mut{color:var(--mut)}.small{font-size:var(--fs-s)}.xs{font-size:var(--fs-xs)}
.row{display:flex;align-items:center;gap:var(--sp2);min-width:0}.row.wrap{flex-wrap:wrap}.sp{flex:1}
.stack>*+*{margin-top:var(--sp3)}
.ellip{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.hide{display:none!important}

/* ---------- Layout ---------- */
#app{min-height:100vh}
.col{min-width:0}
main#view{padding:var(--sp3) var(--sp4) calc(var(--tab-h) + var(--safe-b) + 28px);max-width:1180px;margin:0 auto;outline:none}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:var(--sp2);
  padding:calc(var(--sp3) + var(--safe-t)) var(--sp4) var(--sp3);background:rgba(7,11,20,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top h1{font-size:var(--fs-m);font-weight:750;min-width:0}
.top .back{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--panel2);border:1px solid var(--line);color:var(--txt);margin-left:-4px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.08em;font-size:.95rem}
.brand .logo{width:28px;height:28px;border-radius:50%;border:2px solid var(--acc);display:grid;place-items:center;box-shadow:0 0 12px rgba(124,156,255,.5)}
.brand .logo i{width:9px;height:9px;border-radius:50%;background:var(--warn);box-shadow:0 0 8px var(--warn)}
.brand span{color:var(--acc)}
.demo{font-size:.62rem;font-weight:800;letter-spacing:.1em;color:#1a1200;background:var(--warn);border-radius:5px;padding:3px 7px;white-space:nowrap;text-transform:uppercase}
.top .demo{margin-left:auto}

/* bottom tab bar (telefon) */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;background:rgba(9,13,24,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-top:1px solid var(--line);padding:4px 2px calc(4px + var(--safe-b))}
.tabbar a{flex:1;min-width:0;height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--mut);font-size:.66rem;font-weight:600;position:relative;border-radius:12px;text-decoration:none}
.tabbar a.on{color:var(--txt)}
.tabbar a.on .ic{color:var(--acc);filter:drop-shadow(0 0 6px rgba(124,156,255,.7))}
.tabbar a.on::before{content:"";position:absolute;top:-5px;width:26px;height:3px;border-radius:0 0 3px 3px;background:var(--acc);box-shadow:0 0 10px var(--acc)}
.badge{position:absolute;top:4px;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--err);color:#fff;font-size:.64rem;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 2px var(--bg)}

/* side nav (desktop) */
.side{display:none}
@media (min-width:900px){
  #app{display:grid;grid-template-columns:236px 1fr}
  .side{display:flex;flex-direction:column;position:sticky;top:0;height:100vh;padding:var(--sp4) var(--sp3);border-right:1px solid var(--line);background:rgba(8,12,22,.85);backdrop-filter:blur(8px)}
  .side .brand{padding:var(--sp2) var(--sp2) var(--sp5)}
  .side nav{display:flex;flex-direction:column;gap:2px}
  .side nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;color:var(--mut);font-weight:600;font-size:.9rem;position:relative;text-decoration:none}
  .side nav a:hover{background:var(--panel);color:var(--txt)}
  .side nav a.on{background:var(--acc-bg);color:var(--txt)}
  .side nav a.on .ic{color:var(--acc)}
  .side nav .badge{position:static;margin-left:auto;box-shadow:none}
  .side .grp{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mut2);margin:var(--sp4) 12px var(--sp1)}
  .side .foot{margin-top:auto;border-top:1px solid var(--line);padding-top:var(--sp3);font-size:var(--fs-s)}
  .tabbar{display:none}
  main#view{padding:var(--sp5) var(--sp6) var(--sp6)}
  .top{padding:var(--sp4) var(--sp6)}
  .top .brand{display:none}
}

/* ---------- Komponenty ---------- */
.card{background:linear-gradient(180deg,rgba(255,255,255,.015),transparent),var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:var(--sp4);position:relative}
.card+.card{margin-top:var(--sp3)}
.card.tap{cursor:pointer;transition:border-color .15s,transform .1s}
.card.tap:hover{border-color:var(--line2)}.card.tap:active{transform:scale(.99)}
.card.accent{border-left:3px solid var(--c,var(--acc))}
.card h3{font-size:var(--fs-m);margin:2px 0 4px}
.glow{box-shadow:0 0 0 1px rgba(52,211,153,.25),0 0 30px rgba(52,211,153,.08)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:12px;border:1px solid var(--line2);background:var(--panel2);color:var(--txt);font-weight:700;font-size:.88rem;white-space:nowrap;text-decoration:none!important}
.btn:hover{border-color:var(--acc)}
.btn:disabled{opacity:.5;cursor:default}
.btn.pri{background:var(--acc);border-color:var(--acc);color:#0a0f1e}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#03241a}
.btn.no{background:var(--err-bg);border-color:rgba(248,113,113,.4);color:var(--err)}
.btn.ghost{background:transparent}
.btn.sm{min-height:34px;padding:0 12px;font-size:.8rem;border-radius:10px}
.btn.block{width:100%}
.btn.dash{width:100%;border:1px dashed var(--acc);background:rgba(124,156,255,.06);min-height:52px}
.acts{display:flex;gap:var(--sp2);margin-top:var(--sp3)}.acts .btn{flex:1}

.pill{display:inline-flex;align-items:center;gap:5px;font-size:.68rem;font-weight:750;padding:3px 9px;border-radius:99px;white-space:nowrap;background:var(--panel3);color:var(--txt2);letter-spacing:.02em}
.pill .d{width:7px;height:7px;border-radius:50%;background:currentColor}
.pill.pracuje{background:var(--ok-bg);color:var(--ok)}.pill.pracuje .d{animation:pulse 1.6s infinite}
.pill.czeka{background:var(--warn-bg);color:var(--warn)}
.pill.spi{background:rgba(100,116,139,.18);color:#a5b0c4}
.pill.blad{background:var(--err-bg);color:var(--err)}
.pill.probny{background:rgba(192,132,252,.14);color:var(--probny)}
.pill.zwolniony{background:rgba(71,85,105,.25);color:#94a3b8;text-decoration:line-through}
.pill.bx{background:var(--bx-bg);color:#7fb2ff}
.pill.acc{background:var(--acc-bg);color:var(--acc)}
.pill.ver{background:var(--ok);color:#03241a;font-weight:850}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.6)}70%{box-shadow:0 0 0 6px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}

.chips{display:flex;gap:6px;overflow-x:auto;padding:2px 0 6px;margin:0 calc(-1 * var(--sp4));padding-left:var(--sp4);padding-right:var(--sp4);scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:36px;border:1px solid var(--line);background:var(--panel);color:var(--txt2);border-radius:99px;padding:0 13px;font-size:.8rem;font-weight:600}
.chip.on{border-color:var(--acc);background:var(--acc-bg);color:var(--txt)}
.chip .n{font-size:.68rem;color:var(--mut);font-weight:700}
@media (min-width:900px){.chips{margin:0;padding-left:0;padding-right:0;flex-wrap:wrap}}

.seg{display:inline-flex;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:3px;gap:2px}
.seg a,.seg button{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border-radius:9px;color:var(--mut);font-weight:700;font-size:.8rem;border:0;background:none;text-decoration:none!important}
.seg .on{background:var(--panel3);color:var(--txt)}

.tag{display:inline-block;font-size:.66rem;font-weight:700;padding:2px 7px;border-radius:6px;background:var(--panel3);color:var(--txt2);margin:2px 4px 2px 0}

/* KPI */
.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp2)}
@media (min-width:700px){.kpis{grid-template-columns:repeat(4,1fr)}}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:var(--sp3) var(--sp4);color:var(--txt);text-decoration:none!important;display:block;position:relative;overflow:hidden}
.kpi .l{font-size:var(--fs-xs);color:var(--mut);font-weight:650;letter-spacing:.04em;text-transform:uppercase;display:flex;align-items:center;gap:6px}
.kpi .v{font-size:var(--fs-xl);font-weight:850;font-variant-numeric:tabular-nums;line-height:1.15;margin-top:4px}
.kpi .v small{font-size:.9rem;color:var(--mut);font-weight:650}
.kpi::after{content:"";position:absolute;right:-18px;bottom:-18px;width:70px;height:70px;border-radius:50%;background:var(--c,var(--acc));opacity:.08}
.kpi.hot{border-color:rgba(251,191,36,.45)}.kpi.hot .v{color:var(--warn)}

/* rozwój zespołu */
.evo-hero{border-color:rgba(52,211,153,.35);background:radial-gradient(120% 90% at 0% 0%,rgba(52,211,153,.10),transparent 55%),var(--panel)}
.evo-hero .hd{display:flex;align-items:center;gap:10px}
.evo-hero .hd .ic{color:var(--ok)}
.evo-item{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--line);color:var(--txt);text-decoration:none!important}
.evo-item:first-of-type{border-top:0}
.evo-item .vb{flex:none;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:44px}
.evo-item .vb .pill{font-size:.72rem}
.evo-item .vb .arrow{font-size:.62rem;color:var(--mut)}
.evo-item b{color:var(--txt)}
.evo-item .t{font-size:var(--fs-s);color:var(--txt2);line-height:1.45}

/* listy zdarzeń */
.feed{position:relative;padding-left:18px}
.feed::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--line)}
.feed .ev{position:relative;padding:6px 0 10px}
.feed .ev::before{content:"";position:absolute;left:-17px;top:11px;width:10px;height:10px;border-radius:50%;background:var(--c,var(--acc));box-shadow:0 0 0 3px var(--bg)}
.feed .ev .t{font-size:var(--fs-s)}
.feed .ev .w{font-size:var(--fs-xs);color:var(--mut)}

/* propozycje */
.prop .meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:var(--fs-xs);color:var(--mut)}
.prop h3{font-size:1rem;margin:8px 0}
.ba{display:grid;grid-template-columns:1fr;gap:8px;margin:10px 0}
@media (min-width:700px){.ba{grid-template-columns:1fr 1fr}}
.ba>div{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:.85rem;line-height:1.5;white-space:pre-wrap;word-break:break-word}
.ba small{display:block;font-weight:800;letter-spacing:.12em;font-size:.62rem;margin-bottom:4px}
.ba .przed small{color:var(--err)}.ba .po small{color:var(--ok)}
.ba .po{border-color:rgba(52,211,153,.25)}
.why{font-size:.85rem;color:var(--txt2);border-left:3px solid var(--acc);padding:2px 0 2px 10px;margin:10px 0;white-space:pre-wrap}
.approver{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;font-weight:700;padding:3px 9px;border-radius:99px;background:var(--warn-bg);color:var(--warn)}
.approver.other{background:rgba(192,132,252,.14);color:var(--probny)}
.decided{display:flex;align-items:center;gap:8px;font-weight:700;font-size:.85rem;margin-top:8px}
.decided.ok{color:var(--ok)}.decided.no{color:var(--err)}

/* formularze */
.f label{display:block;font-size:.76rem;color:var(--mut);margin:14px 0 6px;font-weight:650;letter-spacing:.02em}
.f label:first-child{margin-top:0}
input[type=text],input[type=password],input[type=number],select,textarea{width:100%;background:var(--bg2);color:var(--txt);border:1px solid var(--line2);border-radius:12px;padding:11px 12px;font-size:16px;outline:none;transition:border-color .15s}
input:focus,select:focus,textarea:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(124,156,255,.15)}
textarea{min-height:84px;resize:vertical;line-height:1.45}
textarea.code{font-family:var(--mono);font-size:13px;min-height:220px}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--mut) 50%),linear-gradient(135deg,var(--mut) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:34px}
.err-msg{color:var(--err);font-size:var(--fs-s);margin-top:8px;min-height:1.2em}

/* stany */
.empty{text-align:center;padding:var(--sp5) var(--sp4);color:var(--mut);border:1px dashed var(--line2);border-radius:var(--r);font-size:var(--fs-s)}
.empty .ic{color:var(--mut2);margin-bottom:6px}
.empty b{display:block;color:var(--txt2);font-size:var(--fs);margin-bottom:2px}
.skel{border-radius:var(--r);background:linear-gradient(90deg,var(--panel) 0,var(--panel2) 50%,var(--panel) 100%);background-size:200% 100%;animation:sk 1.2s infinite;height:84px;margin-bottom:var(--sp3)}
@keyframes sk{to{background-position:-200% 0}}
.errbox{border:1px solid rgba(248,113,113,.4);background:var(--err-bg);color:var(--err);border-radius:var(--r);padding:var(--sp4);font-size:var(--fs-s)}

/* toast */
#toasts{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--tab-h) + var(--safe-b) + 16px);z-index:80;display:flex;flex-direction:column;gap:8px;width:min(92vw,420px);pointer-events:none}
@media (min-width:900px){#toasts{bottom:24px}}
.toast{background:var(--panel3);border:1px solid var(--line2);border-radius:12px;padding:12px 14px;font-size:.86rem;box-shadow:var(--shadow);animation:tin .2s ease-out;display:flex;gap:8px;align-items:center}
.toast.ok{border-color:rgba(52,211,153,.5)}.toast.ok .ic{color:var(--ok)}
.toast.err{border-color:rgba(248,113,113,.5)}.toast.err .ic{color:var(--err)}
@keyframes tin{from{opacity:0;transform:translateY(8px)}}

/* bottom sheet / modal */
.sheet-wrap{position:fixed;inset:0;z-index:60;display:none;align-items:flex-end;justify-content:center;background:rgba(2,4,10,.62);backdrop-filter:blur(2px)}
.sheet-wrap.on{display:flex}
.sheet{background:var(--panel);border:1px solid var(--line2);border-bottom:0;border-radius:var(--r-l) var(--r-l) 0 0;width:100%;max-width:640px;max-height:90vh;overflow:auto;-webkit-overflow-scrolling:touch;padding:10px var(--sp4) calc(var(--sp5) + var(--safe-b));animation:sup .22s ease-out;box-shadow:var(--shadow)}
.sheet .grab{width:42px;height:5px;border-radius:99px;background:var(--line2);margin:0 auto 10px}
.sheet .sh{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px}
.sheet .sh h3{font-size:1.1rem}
.sheet .x{margin-left:auto;flex:none;width:38px;height:38px;border-radius:50%;border:0;background:var(--panel3);color:var(--txt);display:grid;place-items:center}
@keyframes sup{from{transform:translateY(40px);opacity:.4}}
@media (min-width:900px){.sheet-wrap{align-items:center}.sheet{border-radius:var(--r-l);border-bottom:1px solid var(--line2);max-height:86vh}}

/* ---------- Mapa ---------- */
.map-wrap{position:relative;margin:0 calc(-1 * var(--sp4));overflow:hidden}
@media (min-width:900px){.map-wrap{margin:0;border:1px solid var(--line);border-radius:var(--r-l);background:radial-gradient(circle at 50% 50%,rgba(124,156,255,.07),transparent 65%)}}
svg.radar{display:block;width:100%;height:auto;max-height:82vh;touch-action:manipulation;user-select:none;-webkit-user-select:none}
svg.radar text{fill:var(--txt);text-anchor:middle;dominant-baseline:central;pointer-events:none;font-family:var(--font)}
svg.radar .ring{fill:none;stroke:rgba(124,156,255,.12);stroke-dasharray:2 6}
svg.radar .sweep{transform-origin:400px 400px;animation:spin 14s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
svg.radar .l1{stroke-width:2;fill:none;opacity:.55}
svg.radar .l1.flow{stroke-dasharray:4 8;animation:flow 1.4s linear infinite;opacity:.9}
svg.radar .l2{stroke-width:1.3;fill:none;opacity:.45}
svg.radar .l3{stroke-width:1;fill:none;opacity:.32;stroke-dasharray:3 4}
@keyframes flow{to{stroke-dashoffset:-24}}
svg.radar g.n{cursor:pointer}
svg.radar g.n:hover .body{filter:brightness(1.4)}
svg.radar .hit{fill:transparent}
svg.radar .st-pracuje{animation:blink 1.8s ease-in-out infinite}
@keyframes blink{50%{opacity:.35}}
svg.radar .ag-l{font-size:11px;fill:var(--txt2)}
svg.radar .dep-l{font-size:15px;font-weight:800}
svg.radar .hm-l{font-size:10.5px;font-weight:700;fill:var(--probny)}
svg.radar.dim g.sector{opacity:.18;transition:opacity .2s}
svg.radar.dim g.sector.focus{opacity:1}
@media (max-width:620px){svg.radar .ag-l{display:none}svg.radar .dep-l{font-size:19px}}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.74rem;color:var(--mut);margin:var(--sp3) 0}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:9px;height:9px;border-radius:50%}
.map-hint{font-size:var(--fs-xs);color:var(--mut);text-align:center;margin:4px 0 0}
.map-grid{display:grid;gap:var(--sp4)}
@media (min-width:1100px){.map-grid{grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);align-items:start}}

.dep-card .hd{display:flex;align-items:center;gap:10px}
.dep-ic{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:1.3rem;background:color-mix(in srgb,var(--c) 14%,transparent);border:1px solid color-mix(in srgb,var(--c) 45%,transparent);box-shadow:0 0 14px color-mix(in srgb,var(--c) 25%,transparent)}
.dots{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}
.dots i{width:10px;height:10px;border-radius:50%;background:var(--sleep)}
.hm{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;font-weight:700;color:var(--probny)}

/* drzewo org */
.org{font-size:.9rem}
.org ul{list-style:none;margin:0;padding-left:20px;position:relative}
.org>ul{padding-left:0}
.org li{position:relative;padding:5px 0 5px 0}
.org ul ul li::before{content:"";position:absolute;left:-13px;top:0;bottom:0;border-left:1.5px solid var(--line2)}
.org ul ul li:last-child::before{bottom:calc(100% - 26px)}
.org ul ul li::after{content:"";position:absolute;left:-13px;top:26px;width:11px;border-top:1.5px solid var(--line2)}
.onode{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--c,var(--line2));border-radius:12px;padding:8px 10px;min-height:44px;cursor:pointer;color:var(--txt);text-decoration:none!important}
.onode:hover{border-color:var(--line2)}
.onode .av{width:30px;height:30px;font-size:.72rem}
.onode .nm{font-weight:700;font-size:.86rem}
.onode .sub{font-size:.72rem;color:var(--mut)}
.onode.root{border-color:rgba(251,191,36,.5);border-left-color:var(--warn);background:linear-gradient(90deg,rgba(251,191,36,.08),transparent),var(--panel)}
.onode.dept{background:linear-gradient(90deg,color-mix(in srgb,var(--c) 10%,transparent),transparent),var(--panel)}
.onode.human{border-style:dashed}

/* awatar agenta */
.av{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:850;font-size:.8rem;border:2px solid var(--c,var(--acc));background:var(--bg2);color:var(--txt);position:relative}
.av .sd{position:absolute;right:-2px;top:-2px;width:11px;height:11px;border-radius:50%;border:2px solid var(--panel);background:var(--sleep)}
.av.lg{width:60px;height:60px;font-size:1.1rem;border-width:3px;box-shadow:0 0 18px color-mix(in srgb,var(--c) 40%,transparent)}
.av.lg .sd{width:15px;height:15px}
.av.human{border-style:dashed}

/* ---------- Sprawy ---------- */
.toolbar{display:flex;align-items:center;gap:var(--sp2);flex-wrap:wrap;margin-bottom:var(--sp2)}
.thr{display:flex;flex-direction:column;gap:6px}
.thr .tt{font-weight:700;font-size:.94rem;line-height:1.3}
.thr .ln{font-size:.8rem;color:var(--mut);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.stage{display:inline-flex;align-items:center;gap:5px;font-size:.68rem;font-weight:750;padding:3px 9px;border-radius:99px;white-space:nowrap;background:color-mix(in srgb,var(--sc) 15%,transparent);color:var(--sc)}
.stage::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.kanban{display:flex;align-items:flex-start;gap:var(--sp3);overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(-1 * var(--sp4));padding:4px var(--sp4) var(--sp3);-webkit-overflow-scrolling:touch}
.kcol{flex:none;width:min(82vw,310px);scroll-snap-align:start;background:rgba(14,21,36,.65);border:1px solid var(--line);border-radius:var(--r);padding:var(--sp3);max-height:calc(100vh - 230px);display:flex;flex-direction:column}
.kcol .kh{display:flex;align-items:center;gap:8px;font-weight:750;font-size:.84rem;margin-bottom:var(--sp2);padding-bottom:var(--sp2);border-bottom:2px solid var(--sc)}
.kcol .kh .n{margin-left:auto;font-size:.72rem;color:var(--mut)}
.kcol .kb{overflow-y:auto;display:flex;flex-direction:column;gap:var(--sp2)}
.kcol .card{padding:var(--sp3)}
.kcol .card+.card{margin-top:0}
@media (min-width:900px){.kanban{margin:0;padding-left:0;padding-right:0}}

/* wątek / czat */
.thread-head{margin-bottom:var(--sp3)}
.thread-head h2{font-size:1.12rem;margin:6px 0 8px}
.thread-meta{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp2);margin-top:var(--sp3)}
.thread-meta label{font-size:.7rem;color:var(--mut);font-weight:650;display:block;margin-bottom:4px}
.thread-meta select{padding:9px 32px 9px 10px;font-size:14px}
.chat{display:flex;flex-direction:column;gap:12px;padding-bottom:var(--sp3)}
.msg{display:flex;gap:9px;align-items:flex-start;max-width:100%}
.msg .bub{min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:4px 16px 16px 16px;padding:9px 12px;font-size:.88rem;line-height:1.5;max-width:min(86%,640px);word-break:break-word}
.msg .h{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:.72rem;color:var(--mut);margin-bottom:3px}
.msg .h b{color:var(--c,var(--txt))}
.msg.op{flex-direction:row-reverse}
.msg.op .bub{background:linear-gradient(180deg,rgba(124,156,255,.16),rgba(124,156,255,.08));border-color:rgba(124,156,255,.4);border-radius:16px 4px 16px 16px}
.msg.op .h{justify-content:flex-end}
.msg.bxm .bub{background:var(--bx-bg);border-color:rgba(47,123,229,.5)}
.msg.sys{justify-content:center}
.msg.sys .bub{background:transparent;border:1px dashed var(--line2);border-radius:99px;font-size:.76rem;color:var(--mut);text-align:center;padding:5px 14px;max-width:92%}
.bxtag{font-size:.6rem;font-weight:850;letter-spacing:.06em;color:#fff;background:var(--bx);border-radius:4px;padding:1px 5px}
.mention{color:var(--cyan);font-weight:650}
.bub code{font-family:var(--mono);font-size:.82em;background:var(--bg2);padding:1px 4px;border-radius:4px}
.composer{position:sticky;bottom:calc(var(--tab-h) + var(--safe-b) + 6px);z-index:10;display:flex;gap:8px;align-items:flex-end;background:rgba(14,21,36,.96);backdrop-filter:blur(10px);border:1px solid var(--line2);border-radius:18px;padding:6px 6px 6px 12px;margin-top:var(--sp3);box-shadow:var(--shadow)}
.composer textarea{border:0;background:transparent;min-height:44px;max-height:160px;padding:11px 0;box-shadow:none!important;resize:none}
.composer .btn{min-height:44px;width:44px;padding:0;border-radius:14px;flex:none}
@media (min-width:900px){.composer{bottom:16px}}

/* ---------- Agent ---------- */
.ag-head{display:flex;gap:14px;align-items:center}
.ag-head h2{font-size:1.25rem}
.ag-head .sub{font-size:.8rem;color:var(--mut);margin-top:2px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp2);margin-top:var(--sp4)}
.stat{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.stat .l{font-size:.66rem;color:var(--mut);text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.stat .v{font-size:1.25rem;font-weight:850;font-variant-numeric:tabular-nums}
.meter{height:8px;background:var(--panel3);border-radius:99px;overflow:hidden;margin:6px 0 2px}
.meter i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--acc),var(--ok))}
.meter.low i{background:linear-gradient(90deg,var(--err),var(--warn))}
.kv{display:grid;grid-template-columns:92px 1fr;gap:8px 12px;font-size:.86rem}
.kv>b{color:var(--mut);font-weight:600;font-size:.78rem;padding-top:2px}
.kv>div{min-width:0;word-break:break-word}
.vers{position:relative;padding-left:22px}
.vers::before{content:"";position:absolute;left:8px;top:14px;bottom:14px;width:2px;background:linear-gradient(var(--ok),var(--line))}
details.ver{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-bottom:var(--sp2)}
details.ver::before{content:"";position:absolute;left:-19px;top:16px;width:12px;height:12px;border-radius:50%;background:var(--panel3);border:2px solid var(--ok);box-shadow:0 0 0 3px var(--bg)}
details.ver.cur::before{background:var(--ok);box-shadow:0 0 0 3px var(--bg),0 0 10px var(--ok)}
details.ver summary{list-style:none;cursor:pointer;padding:10px 12px;display:flex;gap:10px;align-items:flex-start}
details.ver summary::-webkit-details-marker{display:none}
details.ver summary .c{flex:1;min-width:0;font-size:.84rem;line-height:1.4}
details.ver summary .c .m{font-size:.7rem;color:var(--mut);margin-top:2px}
details.ver summary .chev{transition:transform .15s;color:var(--mut)}
details.ver[open] summary .chev{transform:rotate(180deg)}
details.ver .body{padding:0 12px 12px}
.lesson{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:.84rem}
.lesson+.lesson{margin-top:var(--sp2)}
.lesson .m{display:flex;gap:6px;align-items:center;font-size:.7rem;color:var(--mut);margin-bottom:4px;flex-wrap:wrap}
.run{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line);font-size:.84rem}
.run:first-child{border-top:0}
.run .s{flex:none;width:10px;height:10px;border-radius:50%;margin-top:5px}
.two{display:grid;gap:var(--sp3)}
@media (min-width:1000px){.two{grid-template-columns:1fr 1fr;align-items:start}.two>*{margin-top:0!important}}
.tmpl{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tmpl button{background:var(--bg2);border:1px solid var(--line2);color:var(--txt);border-radius:12px;padding:10px;font-size:.8rem;text-align:left;min-height:64px}
.tmpl button.on{border-color:var(--acc);background:var(--acc-bg)}
.tmpl button b{display:block;font-size:.84rem;margin-bottom:2px}
.ag-row{display:flex;align-items:center;gap:12px}
.ag-row .nm{font-weight:700;font-size:.92rem}
.ag-row .sub{font-size:.74rem;color:var(--mut);margin-top:1px}
.ag-row .r{text-align:right;flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.agrid{display:grid;gap:var(--sp2)}
@media (min-width:760px){.agrid{grid-template-columns:1fr 1fr}.agrid .card+.card{margin-top:0}}
@media (min-width:1200px){.agrid{grid-template-columns:1fr 1fr 1fr}}

/* Bitrix */
.steps{counter-reset:s;display:grid;gap:var(--sp2)}
@media (min-width:800px){.steps{grid-template-columns:repeat(2,1fr)}}
.stp{display:flex;gap:12px;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:var(--sp3) var(--sp4)}
.stp .num{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--bx-bg);color:#7fb2ff;font-weight:850}
.stp b{display:block;margin-bottom:2px}
.stp p{margin:0;font-size:var(--fs-s);color:var(--txt2)}
.flowline{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:.76rem;margin:var(--sp3) 0}
.flowline span{background:var(--panel2);border:1px solid var(--line2);border-radius:8px;padding:5px 9px;font-weight:650}
.flowline .ar{background:none;border:0;padding:0;color:var(--mut)}

/* logowanie */
body.auth .tabbar,body.auth .side,body.auth .top{display:none}
body.auth #app{display:block}
.login{min-height:100vh;display:grid;place-items:center;padding:var(--sp4)}
.login .box{width:min(100%,380px)}
.login .orb{width:96px;height:96px;margin:0 auto var(--sp4);border-radius:50%;border:2px solid var(--acc);display:grid;place-items:center;position:relative;box-shadow:0 0 40px rgba(124,156,255,.35),inset 0 0 30px rgba(124,156,255,.15)}
.login .orb::before,.login .orb::after{content:"";position:absolute;inset:-14px;border-radius:50%;border:1px dashed rgba(124,156,255,.3)}
.login .orb::after{inset:-30px;border-color:rgba(124,156,255,.14);animation:spin 30s linear infinite}
.login .orb i{width:24px;height:24px;border-radius:50%;background:var(--warn);box-shadow:0 0 22px var(--warn)}
.login h1{text-align:center;font-size:1.4rem;letter-spacing:.14em;font-weight:850}
.login h1 span{color:var(--acc)}
.login p.sub{text-align:center;color:var(--mut);font-size:var(--fs-s);margin:6px 0 var(--sp5)}
.login .btn{margin-top:var(--sp4)}

/* „więcej” */
.menu-list a{display:flex;align-items:center;gap:14px;padding:14px 4px;border-bottom:1px solid var(--line);color:var(--txt);font-weight:650;text-decoration:none!important;min-height:56px}
.menu-list a .ic{color:var(--acc)}
.menu-list a .chev{margin-left:auto;color:var(--mut)}
.menu-list a small{display:block;font-weight:500;color:var(--mut);font-size:.74rem}

.dash-grid{display:grid;gap:var(--sp4)}
@media (min-width:1000px){.dash-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:start}}
.dash-grid>section>h2.sec:first-child{margin-top:var(--sp4)}
.intro{font-size:var(--fs-s);color:var(--mut);margin:0 0 var(--sp3)}
.hello{margin:var(--sp2) 0 var(--sp4)}
.hello h2{font-size:1.35rem;font-weight:800}
.hello p{margin:4px 0 0;color:var(--mut);font-size:var(--fs-s)}