:root{
  --bg:#f6f7fb; --panel:#ffffff; --soft:#f1f3f7; --line:#e7e9ee; --line-strong:#d7dae1;
  --txt:#0f1729; --muted:#697586; --accent:#4f46e5; --accent-hover:#4338ca; --accent-soft:#eef2ff; --accent-jasny:color-mix(in srgb, var(--accent) 45%, #ffffff);
  /* F5.2: ciemna chroma (pasek boczny, ekran startowy) — te powierzchnie widac na KAZDYM ekranie */
  --ciemne:color-mix(in srgb, var(--accent) 28%, #14111f);
  --ciemne-2:color-mix(in srgb, var(--accent) 16%, #0d0a1a);
  --ciemne-txt:color-mix(in srgb, var(--accent) 18%, #dcd9ea);
  --ciemne-txt-slaby:color-mix(in srgb, var(--accent) 24%, #b3aecb);   /* F5.2: jasny wariant akcentu do gradientow — jeden token zamiast rozsianych jasnych fioletow */
  --violet:var(--accent);
  --ok:#15a05a; --warn:#d97706; --danger:#dc2626;
  --spotkanie:#7c3aed; --email:#0ea5e9; --telefon:#15a05a; --zadanie:#697586;
  --font:'Inter',-apple-system,Segoe UI,Roboto,system-ui,sans-serif;
  --radius:14px; --radius-sm:9px; --radius-lg:20px; --radius-xl:26px;
  /* magnific — gradient akcentu + szklane powierzchnie (glassmorphism) */
  --grad:linear-gradient(135deg,var(--accent) 0%,var(--violet) 100%);
  --grad-br:linear-gradient(135deg,#818cf8 0%,var(--accent-jasny) 100%);
  --glass:rgba(255,255,255,.70); --glass-2:rgba(255,255,255,.52); --glass-line:rgba(255,255,255,.75);
  --blur:saturate(165%) blur(16px);
  --sh-sm:0 1px 2px rgba(79,70,229,.05),0 2px 7px rgba(79,70,229,.06);
  --sh-md:0 4px 14px rgba(79,70,229,.07),0 12px 32px rgba(79,70,229,.09);
  --sh-lg:0 18px 50px rgba(79,70,229,.16);
  --shadow:var(--sh-sm);
  --ring:0 0 0 3px var(--accent-soft);
  --tr:.16s cubic-bezier(.4,0,.2,1);
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
/* POLA TEKSTOWE BIORA CZCIONKE APLIKACJI (zgloszenie Pawla 2026-08-29: „ciagle pisze jakas dziwna
   czcionka?"). Przegladarka domyslnie rysuje <textarea> czcionka MASZYNOWA i tak wygladalo pole
   pytania w Bazie wiedzy [ZMIERZONE: font-family = monospace, gdy cala strona ma Inter].
   Dotad kazdy komponent ustawial to sobie sam (.addfld, .cronf, .mailcompose) — kto zapomnial,
   ten dostawal maszyne do pisania. To jest regula OGOLNA i o najnizszej siled: dowolna istniejaca
   klasa albo styl w kodzie ja przebija, wiec pola celowo maszynowe (kod, JSON) zostaja jak byly. */
textarea,input,select,button{font-family:inherit}
body{background:
  radial-gradient(1300px 820px at 88% -12%, rgba(167,139,250,.50), transparent 60%),
  radial-gradient(1100px 780px at -10% 8%, rgba(129,140,248,.42), transparent 58%),
  radial-gradient(1200px 900px at 50% -22%, rgba(196,181,253,.30), transparent 62%),
  radial-gradient(1000px 820px at 58% 120%, rgba(232,121,249,.24), transparent 62%),
  var(--bg);
  background-attachment:fixed;color:var(--txt);font:14px/1.55 var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
/* ===== SCROLLBARY — cienkie, nowoczesne (zamiast grubych systemowych belek), spójne z motywem ===== */
/* Standard (Chrome 121+/Firefox). UWAGA: scrollbar-width NIE jest dziedziczone → musi być na KAŻDYM scrollerze (*);
   scrollbar-color JEST dziedziczone → wystarczy na html + override dla ciemnych powierzchni. */
*{scrollbar-width:thin}
html{scrollbar-color:rgba(90,80,140,.34) transparent}
.sidebar,.nav,.app.view-launcher .main{scrollbar-color:rgba(255,255,255,.26) transparent}
/* WebKit fallback (starszy Chrome/Safari; nowy Chrome i tak używa standardu wyżej) */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background-color:rgba(90,80,140,.30);border:2px solid transparent;background-clip:padding-box;border-radius:8px}
::-webkit-scrollbar-thumb:hover{background-color:rgba(90,80,140,.52)}
::-webkit-scrollbar-corner{background:transparent}
.nav::-webkit-scrollbar-thumb,.app.view-launcher .main::-webkit-scrollbar-thumb{background-color:rgba(255,255,255,.22);border:2px solid transparent;background-clip:padding-box;border-radius:8px}
.nav::-webkit-scrollbar-thumb:hover,.app.view-launcher .main::-webkit-scrollbar-thumb:hover{background-color:rgba(255,255,255,.40)}
.hidden{display:none !important}
small{color:var(--muted)}
kbd{font:11px monospace;background:var(--soft);border:1px solid var(--line);border-radius:5px;padding:1px 5px;color:var(--muted)}
.btn{border:1px solid var(--line);background:#fff;color:var(--txt);padding:8px 14px;border-radius:var(--radius-sm);cursor:pointer;font-weight:600;font-size:14px;transition:background var(--tr),border-color var(--tr),box-shadow var(--tr)}
.btn:hover{background:var(--soft);border-color:var(--line-strong)}
.btn:focus-visible{outline:none;box-shadow:var(--ring)}
.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn--primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
.btn--sm{padding:5px 11px;font-size:13px}
.abtn{border:1px solid var(--line);background:#fff;border-radius:7px;padding:3px 12px;font-size:13px;font-weight:600;cursor:pointer;color:var(--accent)}
.abtn:hover{background:var(--accent-soft)}
.upsearch{margin:7px 0 5px}
.upsearch .upcliq{width:100%;max-width:300px;border:1px solid var(--line);border-radius:8px;padding:7px 11px;font-size:13px;background:#fff}
.upsearch .upcliq:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.upclilist{display:flex;flex-wrap:wrap;gap:6px}
.iconbtn{border:none;background:transparent;cursor:pointer;font-size:15px;color:var(--muted);padding:6px;border-radius:8px}
.iconbtn:hover{background:var(--soft);color:var(--txt)}

.brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:16px}
.brand__mark{display:grid;place-items:center;width:26px;height:26px;background:#111827;color:#fff;border-radius:7px;font-size:14px}
.brand--big{font-size:24px}.brand--big .brand__mark{width:34px;height:34px;font-size:18px}

/* LOGIN */
.login{min-height:100%;display:grid;place-items:center;padding:24px;
  background:radial-gradient(900px 500px at 80% -10%,#eef2ff,transparent)}
.login__card{width:100%;max-width:380px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:30px;box-shadow:var(--shadow)}
.login__sub{color:var(--muted);margin:8px 0 18px}
.login__hint{color:var(--muted);font-size:12px;margin-top:14px}
.field{display:flex;flex-direction:column;gap:6px;margin:10px 0}
.field span{font-size:13px;color:var(--muted)}
.field input{border:1px solid var(--line);border-radius:9px;padding:10px 12px;font-size:14px}
.field input:focus{outline:none;border-color:var(--accent)}
.login .btn--primary{width:100%;margin-top:8px}

/* APP LAYOUT */
.app{display:grid;grid-template-columns:264px 1fr;height:100vh;overflow:hidden;transition:grid-template-columns .22s ease}
.app.nav-collapsed{grid-template-columns:68px 1fr}

/* SIDEBAR — Wariant B (ciemny). Motyw scope'owany do .sidebar; obszar contentu pozostaje jasny. */
.sidebar{background:var(--ciemne);color:#e5e0f7;display:flex;flex-direction:column;padding:10px 10px 0;overflow:hidden}
.sidebar__top{display:flex;flex-direction:column;gap:8px;padding:4px 4px 8px}
.sidebar__brandrow{display:flex;align-items:center;gap:10px}
.sidebar .brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:15.5px;color:#fff;flex:1;min-width:0}
.sidebar .brand__mark{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,var(--accent),var(--accent-jasny));color:#fff;font-weight:800;font-size:15px;flex:none;box-shadow:none}
.sidebar .brand__txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav__collapse{border:none;background:none;cursor:pointer;color:var(--ciemne-txt);display:flex;padding:4px;border-radius:7px;flex:none}
.nav__collapse:hover{background:rgba(255,255,255,.08);color:#e5e0f7}
.nav__collapse svg{transition:transform .18s}
.app.nav-collapsed .nav__collapse svg{transform:rotate(180deg)}
.sidebar .search{position:relative;display:flex;align-items:center;background:rgba(255,255,255,.09);border-radius:9px}
.sidebar .search input{width:100%;border:none;background:none;color:#e5e0f7;padding:8px 11px;font-size:12.5px}
.sidebar .search input::placeholder{color:var(--ciemne-txt)}
.sidebar .search input:focus{outline:none}
.sidebar .search kbd{position:absolute;right:8px;font-size:10.5px;color:var(--ciemne-txt);border:1px solid rgba(255,255,255,.18);border-radius:5px;padding:1px 5px;background:none}
.nav{flex:1;display:flex;flex-direction:column;gap:2px;overflow-y:auto;overflow-x:hidden;padding:2px 0 12px}
.nav__pinned,.nav__favlist,.nav__kids{display:flex;flex-direction:column;gap:1px}
.nav__sep{height:1px;background:rgba(255,255,255,.13);margin:7px 6px}
.nav__favhd{display:flex;align-items:center;gap:6px;padding:6px 10px 4px;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ciemne-txt-slaby)}
.sidebar .nav__label{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ciemne-txt-slaby);margin:8px 8px 4px}
.nav__item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:none;background:transparent;color:#e5e0f7;padding:9px 10px;border-radius:9px;cursor:pointer;font-size:13.5px;font-weight:600}
.nav__item:hover{background:rgba(255,255,255,.08)}
.nav__item.is-active{background:var(--accent);color:#fff}
.nav__ic{display:flex;flex:none;color:inherit}
.nav__svg{display:block}
.nav__txt{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav__badge{font-size:11px;font-weight:600;color:#cfc9ec;background:rgba(255,255,255,.12);border-radius:20px;padding:1px 7px}
.nav__item.is-active .nav__badge{background:rgba(255,255,255,.18);color:rgba(255,255,255,.9)}
.nav__dot{width:7px;height:7px;border-radius:50%;background:#f5a34b;flex:none}
.nav__star{display:flex;flex:none;color:var(--ciemne-txt);opacity:.35;padding:1px;border-radius:5px;cursor:pointer}
.nav__star:hover{opacity:1}
.nav__star.is-on{opacity:1;color:#e3dcff}
/* „Schowaj z menu" — POKAZUJE SIE DOPIERO PO NAJECHANIU na pozycje. Przy spoczynku menu wyglada
   jak dotad (gwiazdka + licznik), wiec nie robimy balaganu z drugiej ikony w kazdym wierszu. */
.nav__hide{display:flex;flex:none;color:var(--ciemne-txt);opacity:0;padding:1px;border-radius:5px;cursor:pointer;transition:opacity .12s}
.nav__item:hover .nav__hide{opacity:.35}
.nav__hide:hover{opacity:1 !important}
.app.nav-collapsed .nav__hide{display:none}
.nav__ghead{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:none;background:transparent;color:#e5e0f7;padding:9px 10px;border-radius:9px;cursor:pointer;font-size:13.5px;font-weight:600}
.nav__ghead:hover{background:rgba(255,255,255,.08)}
.nav__chev{display:flex;flex:none;color:var(--ciemne-txt);transition:transform .18s}
.nav__group.is-open .nav__chev{transform:rotate(180deg)}
.nav__group .nav__kids{margin:2px 0 5px 19px;border-left:1px solid rgba(255,255,255,.13);padding-left:8px}
.nav__group:not(.is-open) .nav__kids{display:none}
.nav__kids .nav__item{font-size:12.5px;font-weight:500;padding:7px 9px;color:var(--ciemne-txt)}
.nav__kids .nav__ic{color:var(--ciemne-txt)}
.nav__kids .nav__item.is-active,.nav__kids .nav__item.is-active .nav__ic{color:#fff}
/* zwinięty (68px) — tylko wyśrodkowane ikony + tooltip (title) */
.app.nav-collapsed .brand__txt,.app.nav-collapsed .sidebar .search,.app.nav-collapsed .nav__txt,.app.nav-collapsed .nav__badge,.app.nav-collapsed .nav__dot,.app.nav-collapsed .nav__star,.app.nav-collapsed .nav__chev,.app.nav-collapsed .nav__favhd,.app.nav-collapsed .userbox__meta,.app.nav-collapsed .userbox__cog,.app.nav-collapsed .recent{display:none}
.app.nav-collapsed .sidebar{padding-left:8px;padding-right:8px}
.app.nav-collapsed .nav__group .nav__kids{display:none}
.app.nav-collapsed .nav__item,.app.nav-collapsed .nav__ghead{justify-content:center;padding:9px 0}
.app.nav-collapsed .sidebar__brandrow,.app.nav-collapsed .userbox{justify-content:center}
/* Ostatnie + stopka (ciemne) */
.recent{padding:0 0 4px}
.recent__item{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;cursor:pointer;font-size:12.5px;color:var(--ciemne-txt)}
.recent__item:hover{background:rgba(255,255,255,.08)}
.recent__av{display:grid;place-items:center;width:22px;height:22px;border-radius:6px;background:rgba(255,255,255,.1);font-size:11px;font-weight:700;color:#cfc9ec}
.userbox{margin-top:auto;display:flex;align-items:center;gap:10px;padding:12px 6px;border-top:1px solid rgba(255,255,255,.13)}
.userbox__av{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(124,92,252,.22);color:var(--accent-jasny);font-size:12px;font-weight:700;flex:none}
.userbox__meta{display:flex;flex-direction:column;line-height:1.25;min-width:0}.userbox__meta b{font-size:12.5px;color:#fff}.userbox__meta small{font-size:11px;color:var(--ciemne-txt)}
.userbox__cog{margin-left:auto;cursor:pointer;color:var(--ciemne-txt)}
/* LAUNCHER (Faza 2) — ciemny widok kafelków sekcji (klik nagłówka grupy w menu) */
@keyframes lchOrbit{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.app.view-launcher .main{padding:0;display:flex;flex-direction:column}
.app.view-launcher #vLauncher{flex:1;min-height:0;display:block}
.app.view-launcher .gcomposer{display:none}
.launcher{position:relative;overflow:hidden;min-height:100%;padding:38px 42px 46px;background:radial-gradient(1000px 540px at 18% -10%,var(--ciemne) 0%,var(--ciemne-2) 58%)}
.launcher__decor{position:absolute;top:-160px;right:-120px;width:480px;height:480px;animation:lchOrbit 60s linear infinite;pointer-events:none}
.launcher__decor span{position:absolute;border-radius:50%;border:1px solid rgba(167,139,250,.16)}
.launcher__decor span:nth-child(1){inset:0}
.launcher__decor span:nth-child(2){inset:60px;border-color:rgba(96,165,250,.13)}
.launcher__decor span:nth-child(3){inset:130px;border-color:rgba(196,181,253,.10)}
.launcher__decor i{position:absolute;left:50%;top:-3px;width:7px;height:7px;margin-left:-3px;border-radius:50%;background:var(--accent-jasny);box-shadow:0 0 14px var(--accent-jasny)}
.launcher__grid{position:absolute;left:-10%;right:-10%;bottom:-26%;height:50%;background-image:linear-gradient(rgba(124,92,252,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(124,92,252,.14) 1px,transparent 1px);background-size:46px 46px;transform:perspective(700px) rotateX(60deg);-webkit-mask-image:linear-gradient(to top,rgba(0,0,0,.7),transparent);mask-image:linear-gradient(to top,rgba(0,0,0,.7),transparent);pointer-events:none}
.launcher__inner{position:relative;max-width:1100px}
.launcher__crumb{font-size:12px;color:rgba(255,255,255,.42);margin-bottom:8px;letter-spacing:.04em}
.launcher__hd{display:flex;align-items:center;gap:16px;margin-bottom:4px}
.launcher__ico{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,var(--accent),var(--accent-jasny));color:#fff;box-shadow:0 10px 26px rgba(124,92,252,.45)}
.launcher__title{margin:0;font-size:28px;font-weight:500;color:#fff;letter-spacing:.01em}
.launcher__sub{margin:10px 0 28px;color:var(--ciemne-txt-slaby);font-size:14px;max-width:560px}
.launcher__tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:20px}
.lch__tile{position:relative;overflow:hidden;border-radius:20px;padding:24px;cursor:pointer;display:flex;flex-direction:column;gap:18px;border:1px solid transparent;background:linear-gradient(165deg,rgba(255,255,255,.07),rgba(255,255,255,.028)) padding-box,linear-gradient(135deg,rgba(167,139,250,.5),rgba(56,189,248,.18) 55%,rgba(167,139,250,.12)) border-box;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .22s,box-shadow .22s}
.lch__tile:hover{transform:translateY(-5px);box-shadow:0 24px 54px rgba(70,40,220,.38);background:linear-gradient(165deg,rgba(255,255,255,.11),rgba(255,255,255,.05)) padding-box,linear-gradient(135deg,rgba(196,181,253,.85),rgba(56,189,248,.45) 55%,rgba(167,139,250,.35)) border-box}
.lch__glow{position:absolute;top:-50px;right:-50px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(139,111,251,.22),transparent 70%);pointer-events:none}
.lch__row{display:flex;align-items:flex-start;gap:16px;position:relative}
.lch__ico{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,var(--accent),var(--accent-jasny));color:#fff;flex:none;box-shadow:0 8px 22px rgba(124,92,252,.5)}
.lch__body{flex:1;min-width:0}
.lch__name{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:500;color:#fff;letter-spacing:.01em}
.lch__count{font-size:11px;font-weight:600;color:var(--accent-jasny);background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.12);padding:2px 9px;border-radius:20px}
.lch__desc{font-size:13px;color:var(--ciemne-txt-slaby);margin-top:5px;line-height:1.5}
.lch__star{display:flex;flex:none;cursor:pointer;color:rgba(255,255,255,.6);opacity:.45}
.lch__star:hover{opacity:1}
.lch__star.is-on{opacity:1;color:#e3dcff}
.lch__acts{display:flex;gap:10px;position:relative;margin-top:auto}
.lch__new{display:flex;align-items:center;gap:6px;border:none;background:linear-gradient(135deg,var(--accent),var(--accent-jasny));color:#fff;font-weight:600;font-size:12.5px;padding:8px 16px;border-radius:10px;cursor:pointer;box-shadow:0 8px 20px rgba(124,92,252,.35)}
.lch__new:hover{filter:brightness(1.12)}
.lch__open{border:1px solid rgba(255,255,255,.18);background:none;color:#cfc9ec;font-weight:500;font-size:12.5px;padding:8px 16px;border-radius:10px;cursor:pointer}
.lch__open:hover{background:rgba(255,255,255,.08)}

/* MAIN */
.mainwrap{display:flex;flex-direction:column;overflow:hidden}
.topbar{display:flex;align-items:center;height:56px;padding:0 22px;border-bottom:1px solid var(--line);background:var(--panel);position:relative;z-index:60}   /* z-index: dropdown powiadomień (dziecko topbara, absolute) MUSI malować się NAD .main (main ma isolation:isolate → własny kontekst; bez tego panel lądował POD treścią = bug „widać górę ramki, nieklikalne", zgł. Stefan .618) */
.topbar__title{font-size:17px;margin:0}
.topbar__actions{margin-left:auto;display:flex;align-items:center;gap:4px}
.topbar__refresh{display:inline-flex;align-items:center;gap:6px;color:var(--muted);background:transparent;border-color:transparent}
.topbar__refresh:hover{background:var(--soft);color:var(--accent);border-color:var(--line)}
.topbar__refresh.is-busy{opacity:.55;pointer-events:none}
.main{flex:1;overflow-y:auto;padding:22px}
.view{display:none}.view.is-active{display:block}
.view__head{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.view__head h2{margin:0;font-size:19px}

/* DASHBOARD */
.greeting h2{margin:0 0 4px;font-size:22px}
.greeting p{color:var(--muted);margin:0 0 18px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)}
.kpi__lab{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.kpi__val{font-size:26px;font-weight:800;margin-top:6px}
.kpi__sub{font-size:12px;color:var(--muted)}
.kpi--danger .kpi__val{color:var(--danger)}
.timeline{position:relative}
.tl__slot{margin-bottom:18px}
.tl__time{font-size:12px;color:var(--muted);font-weight:700;margin-bottom:6px}
.tl__row{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:11px 14px;margin-bottom:8px;box-shadow:var(--shadow)}
.tl__row.now{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.tl__main{flex:1}.tl__main b{font-size:14px}.tl__main small{display:block}

/* TABLES */
/* WIDOCZNY pasek przewijania w krotkich listach (np. „Pliki bazy"). Zgloszenie Pawla 2026-08-28:
   „sa te pliki, tylko nie bylo widac paska przewijania" — globalny thumb rgba(...,.30) na jasnym
   panelu jest praktycznie niewidoczny, wiec lista 12 pozycji wygladala na liste 3 pozycji.
   ⚠️ Lekiem NIE jest rozciagniecie listy: to zjada rozmowe, po ktora ten ekran istnieje. */
.bwscroll{scrollbar-width:auto;scrollbar-color:rgba(90,80,140,.62) rgba(90,80,140,.12)}
.bwscroll::-webkit-scrollbar{width:12px}
.bwscroll::-webkit-scrollbar-track{background:rgba(90,80,140,.12);border-radius:8px}
.bwscroll::-webkit-scrollbar-thumb{background-color:rgba(90,80,140,.62);border:2px solid transparent;background-clip:padding-box;border-radius:8px}
.bwscroll::-webkit-scrollbar-thumb:hover{background-color:rgba(90,80,140,.80)}
.tablewrap{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel);box-shadow:var(--shadow)}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);font-size:14px}
th{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);background:var(--soft)}
tr:last-child td{border-bottom:none}
tbody tr:hover td{background:#fafafe}
.link{color:var(--accent);font-weight:600;cursor:pointer}
.link[data-kon],.zadtbl .link[data-kon]{color:var(--violet)}   /* nazwy klientów = jeden brand-fiolet (jak tło nagłówków tabel + dashboard); .zadtbl .link[data-kon] (0,3,0) bije .zadtbl .link z l.602 */
.empty{padding:24px;text-align:center;color:var(--muted)}

/* BADGES */
.badge{display:inline-block;padding:2px 9px;border-radius:20px;font-size:12px;font-weight:600;border:1px solid transparent}
/* .780 UWAGA — klient z wstrzymanymi platnosciami (uslugi wstrzymane do decyzji zarzadu). Ma KRZYCZEC: czerwien + bold,
   ten sam znacznik na liscie Klientow, karcie klienta, kartach pracy i w wyborze firmy (zrodlo: kontrahenci.platnosci='wstrzymane'). */
.uwagatag{display:inline-block;padding:1px 8px;border-radius:20px;font-size:11px;font-weight:800;letter-spacing:.3px;
  color:#fff;background:var(--danger);border:1px solid #b91c1c;white-space:nowrap;vertical-align:middle}
/* .781 (zgloszenie Pawla: "na liscie klientow slabo") — sama plakietka ginela w gestej tabeli,
   wiec NAZWA firmy z UWAGA jest dodatkowo czerwona i pogrubiona. Dwie klasy = wygrywa z .link. */
/* ⚠️ `.link[data-kon]` (fioletowe linki do klienta) ma TE SAMA sile co `.link.link--uwaga` — przy remisie wygrywa
   pozniejsza w pliku, wiec kolor alarmu przegrywal z dekoracyjnym. Dokladamy [data-kon] => o jeden stopien wyzej. */
.link.link--uwaga,.link.link--uwaga[data-kon]{color:var(--danger);font-weight:800}
.platwstrz{color:var(--danger);font-weight:700}   /* kolumna Platnosci: "wstrzymane" ma krzyczec tak samo jak nazwa */
/* .782 KARTY PRACY rozliczane POJEDYNCZO (firmy bez umowy/pakietu): czerwone godziny = czeka na fakture,
   zielone potwierdzenie = juz zafakturowana. Paweł: "na czerwono swieca 4h - rozliczam i jest na zielono". */
.godzfv{color:var(--danger)}
/* .786 NADGODZINY DO FAKTURY w rejestrze — Pawel: "ladnie sie prosto na czerwono pokazywalo".
   Mocny czerwien (bialy tekst), zeby w gestej tabeli bylo widac z daleka -- `.btn--danger` daje tylko
   czerwony tekst na bialym i ginie. ⚠️ Prefiks `button` (lekcja .781): bez niego `.btn--primary` wygrywa remis. */
/* .787 KARTA REKORDU — pod polem "Klient" ta sama informacja co przy WYBORZE firmy: UWAGA + sposob rozliczen.
   Pawel: "po dolozeniu klienta dalej juz nie widzimy, z jaka forma rozliczenia to klient... czy nie ma UWAGA". */
/* GODZINY Z KALENDARZA NA KARCIE ZADANIA (.1261, zgloszenie Stefana Ocetkiewicza) — czas przy kazdym
   wpisie + suma pod lista, zeby nie trzeba bylo liczyc w glowie. „—" znaczy: NIE liczylismy tego
   wpisu (caly dzien albo cykliczny), a powod jest w podpowiedzi. Cicha suma bylaby gorsza niz brak. */
.zadkal-h{margin-left:auto;font-size:12px;font-weight:700;color:var(--txt);white-space:nowrap}
.zadkal-h--nie{color:var(--muted);font-weight:600}
.zadkal-suma{margin:6px 0 2px;padding-top:6px;border-top:1px dashed var(--line);font-size:12.5px;text-align:right}
/* PODPOWIEDZ PRZY ZAMYKANIU ZADANIA — z etykieta-przypomnieniem, o ktora prosil Stefan wprost. */
.zk-kalinfo{margin:0 0 10px;padding:8px 11px;border:1px solid #bfdbfe;background:#eff6ff;border-radius:9px;font-size:12.5px;line-height:1.55;color:#1e40af}
.zk-kalinfo__uwaga{color:#b45309}
.zk-kalinfo__spr{color:#9a3412;font-weight:600}
.keyrozl{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:-5px 0 9px;padding:0 2px;font-size:13px}
/* „Pokaz karte klienta" (.1251, zgloszenie Stefana Ocetkiewicza) — z karty zadania/projektu/leada
   nie dalo sie PODEJRZEC kartoteki klienta: klikniecie w pole „Klient" otwiera WYBOR klienta,
   czyli jego ZMIANE. Osobny przycisk, bo oczywiste klikniecie jest juz zajete przez picker.
   Powrot dziala sam — globalny handler `[data-kon]` odklada krok na stosie („← Wstecz"). */
.keykarta{margin:-3px 0 9px;width:100%;justify-content:center}
button.btn--fv{background:var(--danger);border-color:#b91c1c;color:#fff;font-weight:700}
button.btn--fv:hover{background:#b91c1c;color:#fff}
/* .784 TRYB "Do rozliczenia" — glowna akcja osoby rozliczajacej, ma sie wyroznia z paska filtrow */
/* ⚠️ lekcja .781: `.fpill.is-on` ma TE SAMA sile co `.fpill--akcja.is-on` -- przy remisie wygrywa pozniejsza
   w pliku, wiec kolor akcji przegrywal z domyslnym fioletem. Prefiks `button` => o jeden stopien wyzej. */
button.fpill--akcja{border-color:var(--ok);color:var(--ok);font-weight:700}
button.fpill--akcja.is-on{background:var(--ok);border-color:var(--ok);color:#fff}
button.fpill--akcja.is-on b{color:#fff}
.dorozlbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 2px 10px;padding:9px 13px;
  border:1px solid var(--ok);border-left:4px solid var(--ok);border-radius:10px;background:#f0fdf4;font-size:13px}
.fvok{color:var(--ok);font-weight:700;white-space:nowrap}
.b-spotkanie{color:var(--spotkanie);background:var(--accent-soft);border-color:var(--accent-soft)}
.b-email{color:var(--email);background:#f0f9ff;border-color:#e0f2fe}
.b-telefon{color:var(--telefon);background:#f0fdf4;border-color:#dcfce7}
.b-zadanie{color:var(--zadanie);background:var(--soft);border-color:var(--line)}
.b-status{color:#374151;background:var(--soft);border-color:var(--line)}
.b-oferta{color:var(--accent);background:var(--accent-soft);border-color:#e0e7ff}
.b-otwarty{color:var(--warn);background:#fffbeb;border-color:#fef3c7}
/* .842 (zgloszenie Pawla: "czy status otwarte moglby miec taki zielony odcien jak kolor numeru wersji na belce")
   — DOKLADNIE te same trzy wartosci co `.verbadge.ok`. ⚠️ NIE MYLIC z `.b-otwarty` wyzej (zolty): tamten opisuje
   LEADA/PROJEKT „Otwarty", ten status „otwarte" zadania i decyzji. Nazwy sa mylaco podobne. */
.b-open{color:#16a34a;background:rgba(22,163,74,.14);border-color:rgba(22,163,74,.3)}
/* OZNACZENIE PRIV (migracja 005) — pozycja widoczna tylko dla przypisanego operatora i super-administratora.
   Kolor CELOWO inny niz statusy: to nie jest etap pracy, tylko informacja KTO to widzi. */
.b-priv{color:#7c3aed;background:#f5f3ff;border-color:#ddd6fe;font-weight:700}
.privtgl{display:flex;align-items:center;gap:6px;font-size:13px;cursor:pointer;user-select:none}
.privtgl input{cursor:pointer;margin:0}
.b-prop{color:#92400e;background:#fef3c7;border-color:#fde68a}
.b-rej{color:var(--muted);background:var(--soft);border-color:var(--line);text-decoration:line-through}

/* CARDS (klienci) */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
.card h3{margin:0 0 3px;font-size:16px;cursor:pointer}
.card h3:hover{color:var(--accent)}
.card__meta{color:var(--muted);font-size:13px;margin-bottom:10px}
.card__row{display:flex;justify-content:space-between;font-size:13px;padding:3px 0;color:#374151}

/* ZADANIA grupowane */
.group__lab{font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:18px 0 8px;font-weight:700}
.task{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:8px;box-shadow:var(--shadow)}
.task input{width:17px;height:17px;accent-color:var(--accent)}
.task__main{flex:1}.task__main b{font-size:14px}.task__main.done b{text-decoration:line-through;color:var(--muted)}
.task__main small{display:block;color:var(--muted)}
.task__av{display:grid;place-items:center;width:24px;height:24px;border-radius:6px;background:var(--soft);font-size:11px;font-weight:700;color:var(--muted)}
/* PROPOZYCJE zadań z transkrypcji (do_zatwierdzenia) + priorytet + uczestnicy spotkania */
.group__lab--prop{color:#92400e}
.group__lab--prop small{text-transform:none;letter-spacing:0;font-weight:500;color:var(--muted)}
.task--prop{cursor:pointer;border-color:#fde68a;background:#fffdf5;border-left:3px solid var(--warn)}
.task--prop:hover{box-shadow:0 2px 10px rgba(180,131,9,.14)}
.prio{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;border:1px solid var(--line);white-space:nowrap}
.prio--wysoki{color:#b91c1c;background:#fef2f2;border-color:#fecaca}
.prio--sredni{color:#92400e;background:#fffbeb;border-color:#fde68a}
.prio--niski{color:var(--muted);background:var(--soft);border-color:var(--line)}
.partpick{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:8px 0 2px;padding:10px;background:var(--soft);border:1px solid var(--line);border-radius:8px}
.partopt{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:#374151;cursor:pointer}
.partopt input{width:15px;height:15px;accent-color:var(--accent)}
.pchip{display:inline-block;font-size:12px;font-weight:600;color:var(--accent);background:var(--accent-soft);border:1px solid #e0e7ff;border-radius:999px;padding:1px 9px;margin-right:3px}

/* POCZTA — skrzynka (lista + podgląd) */
.mailconnect h3{margin:4px 0 6px}
.mailbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:4px 2px 12px}
.mailbar__r{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mailtabs{display:flex;gap:4px}
.mailsearch{display:flex;align-items:center;gap:6px;flex:1 1 240px;min-width:180px;max-width:440px}
.mailsearch input{flex:1;min-width:120px;border:1px solid var(--line);border-radius:9px;padding:7px 11px;font-size:13px;background:var(--panel)}
.mailsearch input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.mailauto{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);white-space:nowrap}
.mailauto input{width:15px;height:15px;accent-color:var(--accent)}
.mailauto__ts{font-size:11px;color:var(--muted);white-space:nowrap;min-width:64px}
.maildraft-hint{font-size:12px;color:var(--muted);background:var(--soft);border-radius:8px;padding:6px 10px;margin-bottom:8px}
.mailfmt{display:flex;align-items:center;gap:4px;margin-bottom:6px}
.mailfmt__b{border:1px solid var(--line);background:var(--panel);border-radius:7px;padding:4px 10px;font-size:13px;cursor:pointer;color:var(--txt)}
.mailfmt__b:hover{background:var(--soft)}
.mailfmt__sep{width:1px;height:18px;background:var(--line);margin:0 4px}
/* .1274 (prosba Pawla: „rodzaj, wielkosc i kolor czcionki"): trzy kontrolki w pasku formatowania maila.
   Wygladaja jak przyciski B/I obok, bo to ten sam pasek — nie druga estetyka w tym samym miejscu. */
.mailfmt__sel{border:1px solid var(--line);background:var(--panel);border-radius:7px;padding:3px 7px;font:inherit;font-size:12.5px;color:var(--txt);max-width:150px;cursor:pointer}
.mailfmt__sel:hover{border-color:var(--violet)}
.mailfmt__col{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line);background:var(--panel);border-radius:7px;padding:2px 7px;font-size:13px;cursor:pointer}
.mailfmt__col:hover{border-color:var(--violet)}
.mailfmt__col input[type=color]{width:22px;height:20px;border:0;background:transparent;padding:0;cursor:pointer}
.mailatts{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 4px}
.mailpow{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--ok,#16a34a);font-weight:700}   /* ADR-0020: "z tego maila juz cos jest" — numer rekordu obok przycisku, zamiast milczacego "Konwertuj" */
.mailatt-chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;background:var(--accent-soft);border:1px solid #e0e7ff;border-radius:8px;padding:4px 9px;color:var(--txt)}
.mailatt-chip a{color:var(--danger);text-decoration:none;font-weight:700}
.cvatts{display:flex;flex-direction:column;gap:4px;max-height:180px;overflow:auto;border:1px solid var(--line);border-radius:9px;padding:8px 10px;background:var(--panel)}
.cvatt{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--txt);cursor:pointer}
.cvatt input{width:15px;height:15px;accent-color:var(--accent);flex:0 0 auto}
.mailtab{font-size:13px;font-weight:600;padding:6px 13px;border:1px solid var(--line);background:var(--panel);border-radius:8px;cursor:pointer;color:var(--muted)}
.mailtab:hover{background:var(--soft)}
.mailtab.is-active{color:var(--accent);background:var(--accent-soft);border-color:#e0e7ff}
.mailview{display:flex;gap:14px;height:calc(100vh - 330px);min-height:320px}
.maillist{width:380px;min-width:300px;overflow:auto;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.mailprev{flex:1;overflow:auto;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:18px}
.mailprev__empty{color:var(--muted);text-align:center;padding:48px 16px}
.mailrow{padding:10px 13px;border-bottom:1px solid var(--line);cursor:pointer}
.mailrow:hover{background:var(--soft)}
.mailrow.sel{background:var(--accent-soft)}
.mailrow.unread .mailrow__from,.mailrow.unread .mailrow__subj{font-weight:700}
.mailrow.unread{border-left:3px solid var(--accent)}
.mailrow__top{display:flex;justify-content:space-between;gap:8px;font-size:13px;color:#1f2937}
.mailrow__from{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:230px}
.mailrow__date{color:var(--muted);font-size:11px;white-space:nowrap}
.mailrow__subj{font-size:13px;color:#374151;margin:2px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mailrow__meta{display:flex;align-items:center;gap:6px}
.mailclip{font-size:12px}
/* POTWIERDZENIA ODCZYTU (.1133) — ptaszek w kompozytorach, pasek w podgladzie, znacznik na liscie wyslanych. */
.mailpotw{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);cursor:pointer;white-space:nowrap;margin-left:6px}
.mailpotw input{accent-color:var(--accent);width:14px;height:14px}
.mailpotwbar{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:8px 0 4px;padding:7px 11px;border-radius:9px;font-size:12.5px;background:rgba(217,119,6,.1);border:1px solid rgba(217,119,6,.35);color:#b45309}
.mailpotwbar.is-ok{background:rgba(22,163,74,.1);border-color:rgba(22,163,74,.35);color:#15803d}
.mailpotw__ok{font-size:11px;font-weight:700;color:#15803d;white-space:nowrap}
.mailpotw__wait{font-size:11px;font-weight:700;color:var(--muted);white-space:nowrap}
.mailhead{border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:14px}
.mailhead h3{margin:0 0 4px}
/* ── NAGLOWEK WIADOMOSCI (Pawel 2026-08-20: "przydaloby sie widziec naglowek wyslanego maila jak
   w Zoho Mail"). Nadawca z awatarem + data w jednej linii, pod spodem wiersze Do / Kopia do / UDW /
   Tagi / Zabezpieczenia. Etykieta o stalej szerokosci = wartosci wyrownane w kolumnie, jak w kliencie
   pocztowym. Dlugie listy adresow zawijaja sie i lamia w srodku adresu, zeby nie rozpychac panelu. */
.mailhd{margin:6px 0 2px}
.mailhd__top{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.mailhd .mailhd__av{width:32px;height:32px;font-size:11px}   /* dwie klasy w selektorze: samo .mailhd__av przegrywalo z .av (24px) zdefiniowanym nizej w pliku */
.mailhd__kto{font-size:13.5px;color:var(--txt);min-width:0;overflow-wrap:anywhere}
.mailhd__adr{color:var(--muted);font-size:12.5px}
.mailhd__data{margin-left:auto;color:var(--muted);font-size:12px;white-space:nowrap}
.mailhd__d{margin:8px 0 0 41px;display:flex;flex-direction:column;gap:3px}   /* 32px awatara + 9px odstepu = wiersze zaczynaja sie pod nazwiskiem nadawcy */
.mailhd__r{display:flex;gap:8px;font-size:12.5px;line-height:1.45}
.mailhd__lb{flex:0 0 96px;color:var(--muted)}
.mailhd__lb::after{content:":"}
.mailhd__vl{color:var(--txt);min-width:0;overflow-wrap:anywhere}
.mailhd__tls{color:var(--ok,#16a34a);font-weight:600}
.mailhd--s{margin:2px 0 6px}
.mailhd.mailhd--s .mailhd__av{width:24px;height:24px;font-size:10px}
.mailhd--s .mailhd__d{margin-left:33px}
.mailtag--ro{cursor:default;padding:2px 8px;font-size:12px}
.mailatts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.mailatt{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--accent);background:var(--accent-soft);border:1px solid #e0e7ff;border-radius:8px;padding:4px 10px;text-decoration:none}
.mailatt:hover{filter:brightness(.97)}
/* ⚠️ `flex-wrap` DOPISANE w .1255: pasek dostal trzy przyciski wiecej (Wszystkim / Przekaz dalej /
   Usun) i bez zawijania ostatnie wychodzilyby poza panel podgladu — dokladnie ta wpadka, co
   z kolumna akcji plikow (.740): przycisk byl, tylko niewidoczny. Zawijamy zamiast ucinac. */
.mailactions{margin-top:12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* 🗑 Usun — odsuniete na PRAWO i wyszarzone: akcja niszczaca nie stoi obok „Odpowiedz" jako rowna
   z nia (lekcja `.799`: akcja destrukcyjna z dala od codziennych). Czerwone dopiero po najechaniu. */
.mailakc--usun{margin-left:auto;opacity:.75}
.mailakc--usun:hover{opacity:1;color:#b91c1c;border-color:#fecaca;background:#fef2f2}
.mailbody{font-size:13.5px;line-height:1.55;color:#1f2937;white-space:normal;word-break:break-word}
.mailcompose{display:flex;flex-direction:column;height:100%;min-height:0}
.mailcompose h3{margin:0 0 10px;flex:0 0 auto}
.mailcompose .cfgform{max-width:none;flex:1 1 auto;display:flex;flex-direction:column;min-height:0;gap:8px}
.mailcompose .cfgform>.cfgrow{margin:0}
/* ── KOMPOZYTOR JAK W NORMALNEJ POCZCIE (Pawel 2026-08-18: "czy pola Od/Do/Temat musza zajmowac
   3/4 ekranu... zobacz jak te proporcje wygladaja w normalnych systemach"). Wzor: Zoho —
   naglowek to zwarte JEDNOLINIJKOWE wiersze (etykieta z lewej, pole obok), tresc dostaje reszte.
   Bylo: etykieta NAD kazdym polem = ~70px na wiersz, naglowek zjadal pol panelu. */
.mailcompose .cfgform>.cfgrow:not(.cfgrow--grow){flex-direction:row;align-items:center;gap:10px}
.mailcompose .cfgform>.cfgrow:not(.cfgrow--grow)>label{flex:0 0 74px;margin:0;font-size:12px}
/* ── WIERSZ TRESCI: min-height na WIERSZU, nie tylko na polu. ⚠️ Lekcja z .1061: min-height na
   samym polu ROZSADZALO wiersz (ten mogl sie skurczyc do 90px), a pole przelewalo sie POD przyciski
   Wyslij/Anuluj — "fatalnie zaslaniane przez przyciski". Wiersz rosnie -> przyciski ida ZA nim. */
.mailcompose .cfgrow--grow{flex:1 1 auto;display:flex;flex-direction:column;min-height:min(420px,48vh)}
.mailcompose .cfgrow--grow textarea,.mailcompose .cfgrow--grow .mailedit{flex:1 1 auto;min-height:120px;resize:none}
.mailcompose .cfgactions{flex:0 0 auto;margin-top:2px}
/* KONWERSJA MAILA (.1458): ta formatka nie ma rosnącego edytora, więc nie wolno jej ściskać do 100%
   wysokości — przy niskich oknach wiersze wychodziły z formy i NACHODZIŁY na przyciski (zrzut Marcina
   2026-09-01; klikał wielokrotnie, bo nie widział reakcji). Naturalna wysokość + przewija .mailprev. */
.mailcompose--konwersja{height:auto;min-height:0}
.mailcompose--konwersja .cfgform{flex:0 0 auto}
/* .1459: załączniki na formatce dodawania zadania/pomysłu/decyzji (chipy jak w kompozytorze Poczty) */
.addatts__list{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.mailcompose>p.s{flex:0 0 auto;margin:8px 0 0}
.mailcompose input,.mailcompose textarea{width:100%;box-sizing:border-box}
.mailcompose textarea{font:inherit;font-size:13px;line-height:1.5}
.mailedit{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:9px;padding:10px 12px;font:inherit;font-size:13px;line-height:1.55;overflow:auto;background:var(--panel);color:var(--txt)}
.mailedit:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.mailedit:empty::before{content:attr(data-ph);color:var(--muted)}
.mailedit--box{min-height:120px;max-height:320px}
/* .1275 (prosba Pawla: „zeby od razu przy kliknieciu Odpowiedz pojawiala sie stopka podpisu"):
   podglad stopki SKLEJONY z polem tresci — wyglada jak dalszy ciag wiadomosci, ale NIE jest polem
   edycji (tresc maila bierze sie z pola wyzej, a stopke dokleja serwer przy wysylce). */
/* .1294: podglad stoi NAD polem tresci, wiec skleja sie z nim od gory (zaokraglenie i brak
   krawedzi po stronie pola). Przy odpowiedzi pole niesie caly cytat i rosnie — pod spodem
   podglad wypadal poza ekran (zmierzone: 888 px przy oknie 720 px). */
.mailsig-auto{border:1px solid var(--line);border-top:0;border-radius:0 0 9px 9px;background:var(--soft);
              padding:8px 12px 10px;max-height:150px;overflow:auto;
              /* .1295: PRZYKLEJONY do dolnej krawedzi widoku okna. ZMIERZONE: kolumna okna ma
                 1152 px przy 619 px widocznych, wiec pasek pod polem tresci ladowal poza ekranem
                 (888 px przy oknie 720 px) i wygladal na nieobecny. Nad polem z kolei wymuszal
                 pisanie POD podpisem. Sticky godzi jedno z drugim: kolejnosc naturalna, pasek widoczny. */
              position:sticky;bottom:0;z-index:2}
.mailsig-auto__t{font-size:11.5px;color:var(--muted);margin-bottom:6px}
.mailsig-auto__b{font-size:12.5px;opacity:.9;pointer-events:none}
.mailsig-auto__b a{color:inherit;text-decoration:none}
/* .1279 (zgloszenie Pawla: „cos mi sie pojawia, ale nie wiem co dalej"): przyciski „Opublikuj"/„Anuluj"
   stały POD dlugim polem tresci, czyli poza ekranem — formularz wygladal na niedokonczony.
   Pasek akcji przykleja sie do dolu panelu i jest widoczny od pierwszej chwili. */
.ntakcje{position:sticky;bottom:0;background:var(--panel);padding:10px 0 4px;margin-top:6px;
         border-top:1px solid var(--line);display:flex;align-items:center;gap:8px;z-index:2}
/* .1280 OBRAZKI W OGLOSZENIACH — na scianie i w edytorze trzymaja sie szerokosci kolumny.
   Bez tego zrzut 1200 px rozpycha karte wpisu i cala sciana jedzie w bok. */
.tabkarta img,.tabpisz__ed img,#ntTresc img,.mailedit img{max-width:100%;height:auto;border-radius:8px;display:block;margin:6px 0}
.tabkarta img{border:1px solid var(--line);cursor:zoom-in}   /* .1281: klik = pelny rozmiar w nakladce */
/* .1281 (Pawel: „mam trzy paski przewijania i zadnym nie dojade do konca"): formularz ogloszenia
   z maila ma JEDEN obszar przewijany (pole tresci) + przyklejony pasek akcji. Naglowek i pole tytulu
   zostaja w widoku, zeby nie trzeba bylo ich szukac scrollem. */
.ntnag{position:sticky;top:0;background:var(--panel);padding:2px 0 6px;margin:0 0 8px;z-index:3}
#ntTresc img{max-height:none}
.ntakcje{flex-wrap:wrap}
.ntkat{flex:0 1 220px;min-width:150px}
/* .1287 (Pawel: „jeszcze troche ten wyglad minimalnie dopracuj… ta zakladka kategorie"):
   listy rozwijane w pasku publikacji mialy WYGLAD SYSTEMOWY — szara, kanciasta wstawka obok
   zaokraglonych pol i przyciskow. Ubieramy je tak samo jak reszte paska (ta sama ramka, to samo
   tlo, ta sama wysokosc) i dokladamy wlasna strzalke, bo natywna znika razem z `appearance`. */
select.ntkat{appearance:none;-webkit-appearance:none;border:1px solid var(--line);background:var(--panel);
  color:var(--txt);border-radius:9px;padding:6px 30px 6px 11px;font:inherit;font-size:13px;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);
  background-position:calc(100% - 15px) calc(50% + 1px),calc(100% - 10px) calc(50% + 1px);
  background-size:5px 5px,5px 5px;background-repeat:no-repeat}
select.ntkat:hover{border-color:var(--violet)}
select.ntkat:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
input.ntkat{border:1px solid var(--line);background:var(--panel);color:var(--txt);border-radius:9px;
  padding:6px 11px;font:inherit;font-size:13px}
/* pasek publikacji: rowna wysokosc i odstepy — fajki nie maja „skakac" wzgledem list i przyciskow */
.tabpisz__row,.ntakcje{gap:10px;align-items:center;flex-wrap:wrap}
.tabpisz__row .tabwazne,.ntakcje .tabwazne{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;white-space:nowrap}
.tabodb [data-odbtog]{border-radius:9px;min-height:34px}
/* .1287: WYSOKOSCI W PASKU. Zmierzone przed poprawka: lista 34 px, fajki 19, przyciski 25 i 30 —
   pasek wygladal jak zlepek przypadkowych elementow. Jedna wysokosc dla wszystkiego i fajki
   ubrane w te sama „pigulke", co reszta. */
.tabpisz__row>*,.ntakcje>*{min-height:34px}
.tabpisz__row .tabwazne,.ntakcje .tabwazne{min-height:34px;padding:0 11px;border:1px solid var(--line);
  border-radius:9px;background:var(--panel);cursor:pointer}
.tabpisz__row .tabwazne:hover,.ntakcje .tabwazne:hover{border-color:var(--violet)}
.tabpisz__row .btn,.ntakcje .btn{min-height:34px;display:inline-flex;align-items:center}
.tabpisz__row .cfgsaved,.ntakcje .cfgsaved{min-height:0}
/* .1290 (Pawel: „popraw rozwijalna liste — bo jakby sie przyklejala"): odbiorcy korzystaja ze
   WSPOLNEJ listy wyboru (`.combopop`), ktora sama dopasowuje sie do krawedzi ekranu i warstw okien.
   Zostaje tu tylko WYGLAD POZYCJI przy wyborze wielokrotnym. */
.comboopt--multi{display:flex;align-items:center;gap:8px}
.comboopt--multi .comboopt__ptak{font-size:14px;line-height:1;opacity:.75}
.comboopt--multi.is-zazn{background:var(--accent-soft)}
.comboopt--multi.is-zazn .comboopt__ptak{opacity:1;color:var(--violet)}
.tabodb{min-height:34px}

/* .1287: WYSOKOSCI W PASKU. Zmierzone przed poprawka: lista 34 px, fajki 19, przyciski 25 i 30 —
   pasek wygladal jak zlepek przypadkowych elementow. Jedna wysokosc dla wszystkiego i fajki
   ubrane w te sama „pigulke", co reszta. */
.tabpisz__row>*,.ntakcje>*{min-height:34px}
.tabpisz__row .tabwazne,.ntakcje .tabwazne{min-height:34px;padding:0 11px;border:1px solid var(--line);
  border-radius:9px;background:var(--panel);cursor:pointer}
.tabpisz__row .tabwazne:hover,.ntakcje .tabwazne:hover{border-color:var(--violet)}
.tabpisz__row .btn,.ntakcje .btn{min-height:34px;display:inline-flex;align-items:center}
.tabpisz__row .cfgsaved,.ntakcje .cfgsaved{min-height:0}
/* .1285 (ujednolicenie tablicy i maila): wybor odbiorcow powiadomienia. Lista jest ZWINIETA —
   przy 24 osobach rozwinieta zaslanialaby formularz, a to ona ma sluzyc wpisowi, nie odwrotnie. */
.tabodb{position:relative;display:inline-block}
.tabodb__lista{position:absolute;bottom:calc(100% + 6px);left:0;z-index:20;background:var(--panel);
  border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 34px rgba(20,16,60,.18);
  padding:8px 10px;max-height:260px;overflow:auto;min-width:250px}
.tabodb__akcje{font-size:11.5px;margin-bottom:6px;color:var(--muted)}
.tabodb__p{display:flex;align-items:center;gap:6px;font-size:12.5px;padding:2px 0;white-space:nowrap}
.tabodb__ja{margin-top:6px;padding-top:6px;border-top:1px solid var(--line);white-space:normal}
/* .1273 (zgloszenie Pawla 2026-08-25): OBRAZ WKLEJONY W TRESC MAILA.
   1) `max-width` — bez tego zrzut 4K rozpychal pole w bok, a uchwyt do skalowania lezal poza ekranem;
   2) ramka z uchwytem rysowana POZA edytorem (position:fixed) — edytor to contenteditable, wiec
      element wstrzykniety do srodka trafilby do tresci wysylanego maila. */
.mailedit img{max-width:100%;height:auto}
.mailedit img.is-imgsel{outline:2px solid var(--violet);outline-offset:1px}
.imgres{position:fixed;z-index:1300;pointer-events:none;border:1.5px solid var(--violet);border-radius:3px}
/* .1273b (Pawel: „nie widze kwadracikow w rogach do zmniejszania obrazka"): uchwyty w CZTERECH rogach
   i pokazywane JUZ PRZY NAJECHANIU mysza — poprzednia wersja czekala na klikniecie w obraz, wiec
   o ich istnieniu trzeba bylo wiedziec z gory. Funkcja, o ktorej nie wiadomo, nie istnieje. */
.imgres__h{position:absolute;width:14px;height:14px;border-radius:4px;background:var(--violet);
           border:2px solid #fff;box-shadow:0 1px 4px rgba(20,16,60,.35);pointer-events:auto}
.imgres__h[data-rog="se"]{right:-7px;bottom:-7px;cursor:nwse-resize}
.imgres__h[data-rog="sw"]{left:-7px;bottom:-7px;cursor:nesw-resize}
.imgres__h[data-rog="ne"]{right:-7px;top:-7px;cursor:nesw-resize}
.imgres__h[data-rog="nw"]{left:-7px;top:-7px;cursor:nwse-resize}
.imgres__n{position:absolute;left:0;top:-23px;background:var(--violet);color:#fff;font-size:11px;line-height:1;
           padding:4px 7px;border-radius:6px;white-space:nowrap}
/* .1273: WYSYLKA W TOKU. Mail leci kilka sekund, a formatka stala bez zmian — niecierpliwy user klikal
   „Wyslij" kilka razy i kazde klikniecie to OSOBNA wiadomosc u adresata. Pola gasna, przycisk jest
   zablokowany i mowi „Wysylam…" (blokada logiczna siedzi w app.js — to jest tylko jej widok). */
.is-sending .mailedit,.is-sending .addfld input,.is-sending .addfld select,
.is-sending .cfgrow input,.is-sending .cfgrow select{opacity:.55;pointer-events:none}
.mailinline{margin-top:14px;display:flex;flex-direction:column;gap:10px}   /* obrazki OSADZONE w tresci maila (zrzuty/logo) — pod tekstem, przez /api/mail/inline */
.mailinline img{max-width:100%;height:auto;border:1px solid var(--line);border-radius:9px;display:block}
.mailbody .mailinline{display:block;margin:10px 0}
/* .1307: GALERIA obrazkow NIEUZYTYCH w tresci = zwykle ikonki i baner ze stopki nadawcy.
   Do .1306 szly jako kolumna kafli na cala szerokosc, wiec ikonka 32 px wygladala jak zrzut ekranu
   (zgloszenie Pawla: "rozjezdza sie tylko u nas — nie wysylamy rozjazdu, tylko zle czytamy").
   Teraz: rzad miniatur. Klik dalej otwiera pelny rozmiar, wiec zaden obrazek nie ginie. */
.mailinline--galeria{flex-direction:row;flex-wrap:wrap;align-items:flex-start;gap:8px;padding-top:4px;border-top:1px dashed var(--line)}
.mailinline--galeria img{max-height:72px;width:auto;max-width:100%;border-radius:6px;cursor:zoom-in}
/* .1307/.1308: kwadratowy obrazek ze stopki = IKONKA SERWISU, nie kafel na cala szerokosc.
   Dotyczy obu drog: galerii pod trescia I obrazkow WSTAWIONYCH W TRESC (znaczniki [[OBRAZEK:n]]),
   bo stopka idzie wlasnie ta druga — `.1307` poprawil tylko galerie i Pawel dalej widzial kafle. */
.mailinline img.is-ikona{max-height:24px;width:auto;border:0;border-radius:4px;display:inline-block;vertical-align:middle}
.mailbody .mailinline--ikona{display:inline-block;margin:0 6px 0 0}
/* podpowiadanie adresów w kompozytorze (Kasia 2026-08-18) — okienko pod polem Do/DW/UDW */
.mailcompose .cfgrow{position:relative}
.mailsug{position:absolute;top:100%;z-index:40;background:var(--panel);border:1px solid var(--line);border-radius:9px;box-shadow:0 10px 30px rgba(16,24,40,.14);max-height:240px;overflow:auto}
.mailsug__p{padding:7px 11px;cursor:pointer;display:flex;flex-direction:column;gap:1px}
.mailsug__p small{color:var(--muted)}
.mailsug__p:hover,.mailsug__p.akt{background:var(--accent-soft)}
/* TAGI POCZTY (Kasia 2026-08-18, migracja 037): pasek nad lista + kropki na wierszach + edytor */
.mailtagi{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:7px 2px}
.mailtagi__lab{font-size:12px;color:var(--muted);font-weight:600}
.mailtag{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-size:12.5px;cursor:pointer;background:var(--panel);color:var(--txt)}
.mailtag:hover{background:var(--soft)}
.mailtag.akt{border-color:var(--accent);background:var(--accent-soft);font-weight:700}
.mailtag i{width:10px;height:10px;border-radius:50%;display:inline-block}
.mailtag small{color:var(--muted)}
.mailtag b{font-weight:400;opacity:.35;cursor:pointer;margin-left:2px}
.mailtag b:hover{opacity:1}
.mailtag--add{font-weight:700}
.mailtag__kropka{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:4px;vertical-align:middle}
.mailtag__paleta{display:flex;gap:8px;flex-wrap:wrap}
.mailtag__paleta i{width:26px;height:26px;border-radius:8px;cursor:pointer;display:inline-block;border:2px solid transparent}
.mailtag__paleta i.akt{border-color:var(--txt);box-shadow:0 0 0 2px var(--panel) inset}
.mailtag__poz{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;cursor:pointer}
.mailtag__poz:hover{background:var(--soft)}
.mailtag__poz i{width:11px;height:11px;border-radius:50%}
.mailtag__poz span{flex:1}
.mailtag__poz b{color:var(--ok,#16a34a);width:16px}
/* miniatury obrazkow na karcie zadania/pomyslu (Pawel 2026-08-18: zrzut zamiast slownego opisu) */
.zadgaleria{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 10px}
.zadgaleria img{max-height:120px;max-width:200px;border:1px solid var(--line);border-radius:9px;display:block;object-fit:cover}
.zadgaleria a:hover img{box-shadow:0 4px 14px rgba(16,24,40,.18)}   /* obrazek W MIEJSCU wklejenia (znacznik z czesci HTML), nie tylko galeria na dole */   /* pole odpowiedzi na karcie zadania (poza .mailcompose, ktore rozciaga na wysokosc panelu) */

/* ASYSTENT pełny */
.assistant{max-width:760px;margin:0 auto;text-align:center;padding-top:32px}
.assistant__mark{width:54px;height:54px;border-radius:14px;background:#111827;color:#fff;display:grid;place-items:center;font-size:24px;margin:0 auto 16px}
.assistant h2{margin:0 0 6px}
.assistant p{color:var(--muted)}
.suggest{display:flex;flex-direction:column;gap:10px;margin:22px 0;text-align:left}
.suggest button{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:13px 16px;text-align:left;cursor:pointer;font-size:14px;color:#374151}
.suggest button:hover{border-color:var(--accent);color:var(--accent)}
.composer{display:flex;gap:10px;border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--panel);align-items:center}
.composer input{flex:1;border:none;outline:none;font-size:14px}
.composer__clip{flex:none;color:var(--violet);background:transparent;padding:4px 6px;display:flex;align-items:center;border-radius:8px;transition:background var(--tr)}
.composer__clip:hover{background:var(--accent-soft);color:var(--violet)}
/* .1431 (zgloszenie Pawla „czy nie moglby miec ladnej zaokraglonej formy jak pasek asystenta?"):
   pasek „Wiedzy o kliencie" przechodzi na TEN komponent zamiast wlasnego stylu. Rozni sie od
   asystenta jednym: ma pole WIELOLINIJKOWE (Shift+Enter = nowa linia), a `.composer input` wyzej
   celuje tylko w `input`. Regula jest DOKLADANA, nie zmieniana — dzis zaden `.composer` nie
   zawiera `textarea`, wiec nie moze niczego przestawic w istniejacych paskach. */
.composer textarea{flex:1;border:none;outline:none;font-size:14px;resize:none;background:transparent;font-family:inherit;line-height:1.45;color:inherit}
.composer--big textarea{font-size:15px}

/* ASYSTENT — dolny dok (cała szerokość) */
.assist{display:none;background:var(--panel);border-top:1px solid var(--line);flex-direction:column;overflow:hidden;height:clamp(260px,40vh,460px);box-shadow:0 -6px 24px rgba(16,24,40,.10)}
.app.assist-open .assist{display:flex}
.assist__head{display:flex;align-items:center;gap:7px;padding:7px 18px;border-bottom:1px solid var(--line)}
.assist__title{font-weight:800;font-size:14px}
.assist__ctx2{color:var(--muted);font-size:12px}
.assist__head .iconbtn{margin-left:auto}
.assist__ctx{padding:7px 22px;font-size:12px;color:var(--muted);background:var(--soft);border-bottom:1px solid var(--line)}
.assist__body{flex:1;overflow-y:auto;padding:16px 22px;display:flex;flex-direction:column;gap:12px}
.acard{border:1px solid var(--line);border-radius:11px;padding:13px;background:var(--panel);max-width:860px}
.acard__t{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:7px;display:flex;align-items:center;gap:6px}
.acard p{margin:0;font-size:13px;color:#374151}
.acard .btn{margin-top:10px;padding:6px 11px;font-size:13px}
.amsg{font-size:14px;line-height:1.55;padding:11px 15px;border-radius:13px;border:1px solid var(--line);max-width:860px;white-space:pre-wrap;word-wrap:break-word}
.amsg--u{background:var(--accent);color:#fff;border-color:var(--accent);align-self:flex-end}
.amsg--b{background:var(--soft);align-self:flex-start}
.amsg--b b{color:var(--txt)}
.amsg__err{color:var(--txt)}
.amsg__errhint{font-size:12px;color:var(--muted);margin:4px 0 8px}
.amsg__retry{margin-top:2px}
/* dynamiczny wskaźnik „Hermes pracuje": pulsująca kropka + lecące sekundy */
.amsg--think{background:var(--soft)}
.think{display:inline-flex;align-items:center;gap:9px;flex-wrap:wrap}
.think__dot{width:9px;height:9px;border-radius:50%;background:var(--accent);flex:none;animation:thinkpulse 1.1s ease-in-out infinite}
.think__txt{color:var(--muted)}
.think__sec{font-variant-numeric:tabular-nums;color:var(--accent);opacity:.85;font-weight:600;font-size:.85em;min-width:30px}
.think__hint{color:var(--muted);opacity:.65;font-size:.82em;font-style:italic}
@keyframes thinkpulse{0%{opacity:.35;transform:scale(.8);box-shadow:0 0 0 0 rgba(79,70,229,.45)}50%{opacity:1;transform:scale(1.1);box-shadow:0 0 0 6px rgba(79,70,229,0)}100%{opacity:.35;transform:scale(.8);box-shadow:0 0 0 0 rgba(79,70,229,0)}}
.asuggest{display:flex;flex-wrap:wrap;gap:7px;max-width:860px}
.asuggest button{text-align:left;border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:9px 11px;cursor:pointer;font-size:13px;color:#374151}
.asuggest button:hover{border-color:var(--accent);color:var(--accent)}
.assist__composer{display:flex;gap:8px;padding:12px 22px;border-top:1px solid var(--line);align-items:center}
.assist__clip{flex:none;color:var(--violet);background:transparent;border:0;cursor:pointer;padding:4px 6px;display:flex;align-items:center;border-radius:8px;transition:background var(--tr)}
.assist__clip:hover{background:var(--accent-soft);color:var(--violet)}
.assist__attach{display:flex;flex-wrap:wrap;gap:6px;padding:8px 22px 0}
.atchip{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);border:1px solid var(--line);border-radius:var(--radius-sm);padding:4px 6px 4px 9px;font-size:13px;max-width:100%}
.atchip__ic{flex:none;font-size:14px}
.atchip__nm{max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;color:var(--txt)}
.atchip__sz{flex:none;color:var(--muted);font-size:12px}
.atchip__x{flex:none;border:0;background:transparent;cursor:pointer;color:var(--muted);font-size:13px;line-height:1;padding:0 2px}
.atchip__x:hover{color:var(--danger)}
.assist--drag{outline:2px dashed var(--accent);outline-offset:-5px;background:var(--accent-soft)}
.assist__composer input{flex:1;border:1px solid var(--line);border-radius:10px;padding:11px 14px;font-size:14px}
.assist__composer input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.assist__composer .btn{padding:11px 16px}

/* ADMIN */
.adminblock{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-bottom:14px;box-shadow:var(--shadow)}
.adminblock h3{margin:0 0 4px;font-size:15px}
.adminblock p{margin:0;color:var(--muted);font-size:13px}

/* iteracja UI */
.composer--big{padding:14px 16px;border:1.5px solid var(--line);box-shadow:var(--shadow);border-radius:14px}
.composer--big input{font-size:15px}
.composer--big:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.dash-composer{position:sticky;bottom:-22px;margin-top:22px;background:linear-gradient(transparent,var(--bg) 30%);padding-top:10px}
.dash-composer .composer--big{background:#fff}
.app.assist-open .dash-composer{display:none}
/* globalny composer — na wszystkich widokach, chowa się gdy dok otwarty */
.gcomposer{flex:none;padding:12px 22px 16px;border-top:1px solid var(--line);background:var(--bg)}
.gcomposer .composer--big{background:#fff;max-width:980px;margin:0 auto}
.app.assist-open .gcomposer{display:none}
.app.view-czat .gcomposer{display:none}   /* Czat ma własny pasek pisania — globalny kompozytor Hermesa nie nachodzi na dole */
.app.view-bazywiedzy .gcomposer{display:none}   /* to samo w Bazach wiedzy: panel dziedziny ma własne pole pytania, a DWA pola „Wyślij" pod sobą myliły — jedno pytało bazę, drugie zwykłego Hermesa (zgłoszenie Pawła 2026-08-29) */
.app.wk-open .gcomposer{display:none}   /* zakładka „Wiedza klienta" na karcie kontrahenta — ma własne pole pytania, ta sama zasada co wyżej */
tbody tr.clk{cursor:pointer}
tbody tr.clk:hover td{background:var(--accent-soft)}
.colcfg{margin-left:auto;font-size:12px;color:var(--muted)}
/* segment filtra + chip aktywnego filtra (sterowany przez asystenta) */
.seg{display:inline-flex;gap:6px;flex-wrap:wrap}
.seg button{border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:5px 12px;font-size:13px;font-weight:600;color:#374151;cursor:pointer}
.seg button:hover{border-color:var(--accent)}
.seg button.is-active{background:var(--accent-soft);border-color:#e0e7ff;color:var(--accent)}
.fchip{display:inline-flex;align-items:center;gap:8px;background:var(--accent-soft);color:var(--accent);border:1px solid #e0e7ff;border-radius:20px;padding:4px 11px;font-size:12px;font-weight:700;margin-left:6px}
.fchip__x{cursor:pointer;font-weight:800}
.wikicard{background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:14px 16px;font-size:13px;line-height:1.65;color:#374151;max-width:820px}
.wl{color:var(--accent);font-weight:600}
.dash-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}
.dash-grid--mail{grid-template-columns:3fr 1fr}   /* zakładka E-mail/Kalendarz: e-mail szerszy, kalendarz węższy (przed media-query, by <1100px wciąż stackowało) */
/* .1465: zakładka Zadania z OBSERWOWANYMI (decyzja Pawła): Moje ≈ Obserwowane, „Do zatwierdzenia" wąskie */
.dash-grid--zad3{grid-template-columns:1.15fr 1.15fr 0.7fr}
@media(max-width:1400px){.dash-grid--zad3{grid-template-columns:1fr 1fr}.dash-grid--zad3>div:last-child{grid-column:1/-1}}
.obsgwiazdka{background:none;border:none;cursor:pointer;font-size:16px;line-height:1;padding:2px 4px}
.obsgwiazdka:hover{transform:scale(1.15)}
.dash-grid h3{font-size:14px;margin:0 0 10px;color:#374151}
.dash-h{font-size:14px;font-weight:700;margin:0 0 10px;color:#374151}
.funnel{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:22px}
.fstage{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:13px 15px;box-shadow:var(--shadow)}
.fstage__lab{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.fstage__val{font-size:18px;font-weight:800;margin:5px 0 9px}
.fstage__track{height:7px;background:var(--soft);border-radius:20px;overflow:hidden}
.fstage__bar{height:100%;border-radius:20px;min-width:4px}
.tl__row--warn{border-left:3px solid var(--danger)}
.dkpi{display:flex;align-items:center;gap:13px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:15px 16px;box-shadow:var(--shadow);cursor:pointer;transition:border-color .12s,box-shadow .12s}
.dkpi:hover{border-color:var(--accent);box-shadow:0 2px 8px rgba(79,70,229,.12)}
.dkpi__ico{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:21px}
.dkpi__val{font-size:25px;font-weight:800;line-height:1.05}
.dkpi__lab{font-size:12px;color:var(--muted);margin-top:4px}
.dkpi__lab b{color:#374151;font-weight:700}
.dtabs{display:flex;gap:4px;margin-bottom:16px;border-bottom:1px solid var(--line)}
.dtab{flex:1;border:none;background:transparent;padding:11px 8px;font-size:14px;font-weight:700;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent}
.dtab:hover{color:var(--txt)}
.dtab.is-active{color:var(--accent);border-bottom-color:var(--accent)}
.dpanel{display:none}.dpanel.is-active{display:block}
.dash-mut{font-size:12px;color:var(--muted);font-weight:400}
/* Asystent jako pełny widok-czat (zastąpił dolny dok) */
.achat{display:flex;flex-direction:column;height:calc(100vh - 100px);max-width:980px;margin:0 auto;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}
.achat__head{display:flex;align-items:center;gap:7px;padding:13px 20px;border-bottom:1px solid var(--line);font-size:15px}
.achat__head small{color:var(--muted)}
.achat__ctx{margin-left:auto;font-size:12px;color:var(--muted)}
@media(max-width:1100px){.dash-grid{grid-template-columns:1fr}}
/* Dashboard o stałej wysokości — listy mają własny scroll, dolny dok nie zasłania */
#vDashboard.is-active{display:flex;flex-direction:column;height:100%;min-height:0}
#vDashboard.is-active > .greeting,
#vDashboard.is-active > .kpis,
#vDashboard.is-active > .dtabs{flex:none}
#vDashboard.is-active > .dash-composer{flex:none;position:static;bottom:auto;margin-top:14px}
#vDashboard.is-active .dpanel.is-active{display:flex;flex-direction:column;flex:1;min-height:0}
#vDashboard.is-active .dash-grid{flex:1;min-height:0;grid-template-rows:minmax(0,1fr)}
#vDashboard .dash-grid > div{display:flex;flex-direction:column;min-height:0;min-width:0;overflow-y:auto;padding-right:6px}   /* min-width:0 = szeroka tabela zadań przewija się W kolumnie (zadtblwrap overflow-x), nie rozpycha grida/strony */
#vDashboard .dash-grid > div > .dash-h{position:sticky;top:0;z-index:2;background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-line);border-radius:12px;box-shadow:var(--sh-sm);margin:0 0 10px;padding:7px 13px}
@media(max-width:1100px){
  #vDashboard.is-active{height:auto;display:block}
  #vDashboard.is-active .dpanel.is-active{display:block}
  #vDashboard.is-active .dash-grid{grid-template-rows:none}
  #vDashboard .dash-grid > div{overflow:visible;display:block;padding-right:0}
  #vDashboard .dash-grid > div > .dash-h{position:static}
}
/* Widoki listowe (Leady/Klienci/Zadania/Projekty/Spotkania/Pomysły/Decyzje/Kalendarz) o stałej wysokości
   — nagłówek u góry stały, treść z własnym scrollem; dolny dok asystenta nie zasłania */
.view--list.is-active{display:flex;flex-direction:column;height:100%;min-height:0}
.view--list.is-active > .view__head{flex:none}
.view--list.is-active > :not(.view__head){flex:0 1 auto;min-height:0;overflow:auto}
.view--list.is-active thead th{position:sticky;top:0;z-index:2}
.view--list.is-active .group__lab{position:sticky;top:0;z-index:2;background:var(--bg);margin-bottom:0;padding-bottom:8px}
.profile__head{display:flex;align-items:center;gap:12px;margin-bottom:4px}
.profile__head h2{margin:0}
.profile__back{cursor:pointer;color:var(--accent);font-weight:600;font-size:13px}
.profile__sub{color:var(--muted);margin:0 0 18px}
.psec{margin-bottom:22px}
.psec h3{font-size:14px;margin:0 0 8px;color:#374151;display:flex;align-items:center;gap:8px}
.psec h3 .cnt{font-size:12px;color:var(--muted);background:var(--soft);border-radius:20px;padding:0 8px}
.admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.admin-card{background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:15px;cursor:pointer;box-shadow:var(--shadow)}
.admin-card:hover{border-color:var(--accent)}
.admin-card h3{margin:0 0 4px;font-size:14px}
.admin-card small{color:var(--muted);font-size:12px}

/* formularze konfiguracji */
.cfgform{display:flex;flex-direction:column;gap:13px;max-width:580px;margin-top:12px}
.cfgrow{display:flex;flex-direction:column;gap:5px}
.cfgrow label{font-size:13px;color:var(--muted);font-weight:600}
.cfgrow input,.cfgrow select{border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:14px;font-family:inherit;background:#fff}
.cfgrow input:focus,.cfgrow select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.cfgrow--chk{flex-direction:row;align-items:center;gap:9px}
.cfgrow--chk label{color:var(--txt)}
.cfgrow--chk input{width:17px;height:17px;accent-color:var(--accent)}
.cfgactions{display:flex;gap:8px;margin-top:4px;align-items:center}
.cfgnote{font-size:12px;color:var(--muted)}
.cfgsaved{color:var(--ok);font-size:13px;font-weight:600;margin-left:6px}
.cfgout{background:#0f1115;color:#d7e3f4;border-radius:9px;padding:12px 14px;font:12px/1.55 ui-monospace,Consolas,monospace;white-space:pre-wrap;margin-top:6px;min-height:54px}
.cfgtable{width:100%;border-collapse:collapse;margin-bottom:12px}
.cfgtable th,.cfgtable td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);font-size:13px}
.cfgtable th{color:var(--muted);text-transform:uppercase;font-size:11px;letter-spacing:.4px}
.cfgcols{display:grid;grid-template-columns:1fr 1fr;gap:8px}
/* KARTA ZDARZENIA — redesign 2026-07-03: Cały dzień + miejsce w rzędzie, separator powiązań, zasób odpięty, asystent terminów */
.cfrow1{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
.cfrow1 .nfseg{flex:0 0 auto;gap:4px}
.cfrow1 .nfseg button{padding:6px 9px;font-size:12px}
.cfrow1 .cfpill{padding:6px 9px;font-size:12px}
.cfrow1 .cfchk{font-size:13px}
.cflinks{margin-top:8px;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:6px 14px 12px}
.cflinks .cfsep{margin-top:2px}
.cflinks .cfsep::before,.cflinks .cfsep::after{background:var(--line-strong)}
.cfpill{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);background:#fff;border-radius:9px;padding:7px 12px;font-size:13px;font-weight:600;color:var(--txt);cursor:pointer;white-space:nowrap}
.cfpill:hover{background:var(--soft);border-color:var(--line-strong)}
/* KONIEC SERII cyklicznej (migracja 034) — stoi w tym samym rzedzie co pigulka powtarzania,
   wiec ma jej wysokosc i zawija sie razem z nia na waskim ekranie (telefon). */
.cfseria{display:flex;align-items:center;gap:7px;margin-top:8px;flex-wrap:wrap}
/* PRZYPOMNIENIA O WYDARZENIU (.1129, ADR-0043) — chipy „15 min wczesniej" + „dodaj". */
.cfprzyp{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
/* ZAPROSZONY W CUDZYM WPISIE (zgloszenie Stefana Ocetkiewicza 2026-08-24) — pasek mowiacy WPROST,
   czego tu nie zmieni i co zmieni. Bez niego wyszarzone pola wygladaja jak awaria (lekcja .649). */
.cfgosc{margin:0 16px 10px;padding:9px 12px;border:1px solid #fde68a;background:#fffbeb;border-radius:9px;font-size:12.5px;line-height:1.5;color:#92400e}
.calmodal__card .is-locked{opacity:.55;cursor:not-allowed}
.calmodal__card .is-locked:hover{background:inherit;border-color:var(--line)}
/* ZAPROSZENIA NA SPOTKANIE (.1135) — pasek przycisku na formatce + lista adresatow w podgladzie. */
.cfzapro{display:flex;flex-direction:column;gap:3px;font-size:12px;margin-top:6px}
/* .1139: JEDEN znacznik „Spotkanie Meet" zamiast trzech wierszy (decyzja Pawla 2026-08-21).
   Rozwijane pole gosci + podglad odbiorcow siedza w ramce, zeby bylo widac, ze naleza do znacznika. */
.cfmeetchk{font-size:13.5px;padding:8px 0}
.cfmeetbox{background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:9px 12px 11px}
/* ⚠️ Bez tej linii `display` powyzej BIJE wbudowane [hidden]{display:none} i pole gosci sterczy
   przy odznaczonym znaczniku — dokladnie ta pulapka, ktora .1138 naprawial przy .cfseria. */
.cfmeetbox[hidden]{display:none}
.cfzapro__brak{color:#b45309}
/* .1141: link do spotkania online. Na karcie wpisu pelny (skrocony adres + „kopiuj"), na listach
   sama ikona 🎥 — ta sama informacja, proporcjonalnie do miejsca. */
/* .1142: ogloszenie dociagnnięte z powiadomienia, gdy nie ma go na biezacej scianie (zgloszenie
   Stefana). Ramka mowi WPROST, skad sie tu wzielo — inaczej wygladaloby jak zwykly wpis sciany. */
.tabwskaz{border:1px solid var(--accent);border-radius:12px;padding:6px;margin-bottom:12px;background:var(--accent-soft)}
.tabwskaz__hd{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);padding:2px 6px 6px}
.cpop__meet{display:flex;align-items:center;gap:7px;overflow-wrap:anywhere}
/* .1145: „goscie sa, linku nie ma" - stan, ktory do tej pory byl nieodroznialny od zwyklego spotkania */
.cpop__brak{background:#fffbeb;color:#b45309;border:1px solid #fde68a;border-radius:9px;padding:7px 9px;line-height:1.45}
.cpop__kop{flex:0 0 auto;border:1px solid var(--line);background:#fff;border-radius:7px;padding:1px 8px;font:inherit;font-size:11px;color:var(--muted);cursor:pointer}
.cpop__kop:hover{border-color:var(--accent);color:var(--accent)}
.calag__meet{flex:0 0 auto;text-decoration:none;font-size:15px;line-height:1;padding:2px 5px;border-radius:7px}
.calag__meet:hover{background:var(--accent-soft)}
.cfzapro__hist{color:var(--muted)}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--accent);cursor:pointer;text-decoration:underline}
.cfmeet{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* .1138: 180, NIE 260 — od kiedy pole stoi w polowie karty (calmodal__r2), przy bazie 260 px
   przycisk „Utworz link Meet" nie miescil sie obok i spadal do drugiego wiersza. */
.cfmeet input{flex:1 1 180px;min-width:0}
.zaprolista{max-height:220px;overflow:auto;margin-top:6px;border:1px solid var(--line);border-radius:9px}
.zaprow{display:flex;align-items:center;gap:9px;padding:6px 10px;border-bottom:1px solid var(--line);font-size:12.5px}
.zaprow:last-child{border-bottom:none}
.zaprow__kto{flex:1 1 auto;min-width:0;overflow-wrap:anywhere;font-weight:600}
.zaprow__mail{color:var(--muted);overflow-wrap:anywhere}
.przypchip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-size:12.5px;background:var(--panel)}
.przypchip b{font-weight:400;opacity:.4;cursor:pointer;margin-left:2px}
.przypchip b:hover{opacity:1;color:var(--danger,#dc2626)}
.przypadd{border:1px dashed var(--line);background:transparent;color:var(--muted);font:inherit;font-size:12.5px;border-radius:999px;padding:3px 11px;cursor:pointer}
.przypadd:hover{border-color:var(--accent);color:var(--accent)}
.cfseria__lab{font-size:12px;color:var(--muted);font-weight:600}
/* flex:0 0 auto = pola NIE kurcza sie do ikonki, gdy w rzedzie zrobi sie ciasno */
.cfseria__tryb{flex:0 0 auto;padding:6px 9px;font-size:12px;height:auto;width:auto;min-width:132px}
.cfseria__pole{flex:0 0 auto;padding:6px 9px;font-size:12px;height:auto;width:auto;min-width:118px;max-width:170px}
.cfseria__ile{font-size:12px;color:var(--muted)}
/* KONTAKTY KLIENTA na karcie (zgłoszenie Pawła 2026-08-18) — zwarta lista pod nazwą klienta
   w prawej szynie. Ten sam blok na karcie zadania, projektu i leada. */
.keykont{margin:8px 0 2px;padding:8px 10px;background:var(--soft);border-radius:9px}
.keykont__h{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.keykont__i{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:2px 6px;padding:5px 0}
.keykont__i+.keykont__i{border-top:1px solid var(--line)}
.keykont__n{font-size:13px;font-weight:600;color:var(--txt)}
.keykont__s{font-size:11px;color:var(--muted);grid-column:1;margin-top:-2px}
.keykont__e{grid-row:1;grid-column:2}
.keykont__d{grid-column:1/-1;font-size:12px;color:var(--muted);word-break:break-word}
/* mail jako przycisk (nasza formatka), telefon jako link tel: — oba maja wygladac jak zwykly odsylacz */
.keykont__l{background:none;border:0;padding:0;font:inherit;color:var(--accent);cursor:pointer;text-decoration:none}
.keykont__l:hover{text-decoration:underline}
.keykont__p{font-size:12px;color:var(--muted);padding:3px 0}
/* KALENDARZ — dwa szybkie widoki nad lista kalendarzy (decyzja Pawla 2026-08-18) */
.calrail__widoki{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 2px}   /* .1318: trzeci przycisk schodzi POD dwa pierwsze zamiast wypadac poza kolumne (zmierzone: 309 px tresci na 208 px miejsca) */
.calrail__widoki .btn{flex:1 1 0;justify-content:center;padding:6px 4px;font-size:12px;white-space:nowrap}
.calrail__hint{font-weight:400;font-size:11px;color:var(--muted);text-transform:none;letter-spacing:0}
.cfplace{margin-top:2px}
.cfchk{display:inline-flex;align-items:center;gap:7px;font-size:14px;color:var(--txt);font-weight:600;cursor:pointer;white-space:nowrap}
.cfchk input{width:17px;height:17px;accent-color:var(--accent)}
.cfbtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.cfsep{display:flex;align-items:center;gap:10px;margin:6px 0 2px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.5px;font-weight:700}
.cfsep::before,.cfsep::after{content:"";flex:1;height:1px;background:var(--line)}
.cfai{width:100%;margin-top:4px;border:1px dashed var(--accent);background:var(--accent-soft);color:var(--accent);border-radius:11px;padding:12px 14px;font-size:14px;font-weight:600;cursor:pointer;text-align:center}
.cfai:hover{background:var(--accent);color:#fff;border-style:solid}
.calai__ov{z-index:90}
.calai__card{max-width:520px}
.calai__lead{font-size:13px;color:var(--muted);margin:2px 0 10px;line-height:1.5}
.calai__out{margin-top:12px}
.calai__bot{background:var(--accent-soft);border-radius:11px;padding:11px 13px;font-size:13.5px;line-height:1.5;margin-bottom:10px}
.calai__day{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0}
.calai__day>b{font-size:13px;min-width:70px}

/* ===== KARTA KLIENTA — kokpit ===== */
.prof__back{cursor:pointer;display:inline-flex;align-items:center;gap:6px;color:var(--accent);background:var(--panel);border:1px solid var(--line);font-family:inherit;font-weight:600;font-size:13px;border-radius:8px;padding:7px 14px;margin-bottom:12px;box-shadow:var(--shadow)}
.prof__back:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.prof__hd{display:flex;align-items:center;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.prof__av{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:13px;background:var(--accent-soft);color:var(--accent);font-size:19px;font-weight:800}
.prof__id{flex:0 1 auto;min-width:180px}
.prof__id h2{margin:0;font-size:21px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.prof__sub{color:var(--muted);font-size:13px;margin:4px 0 0}
.prof__acts{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.prof__acts a.btn{text-decoration:none;display:inline-flex;align-items:center}
.prof{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:22px;align-items:start}
.prof--solo{grid-template-columns:minmax(0,1fr)}   /* karta bez prawego rail-a (pliki przeniesione do zakladki) — pelna szerokosc */
/* .1111: `minmax(0,1fr)` zamiast `1fr`. Kolumna `1fr` nie schodzi ponizej najszerszej rzeczy w srodku,
   wiec karta klienta byla SZERSZA OD EKRANU i na dole siedzial pasek przewijania — na KAZDEJ zakladce
   (zmierzone: nadmiar 184 px identyczny na Przegladzie, Haslach i Licencjach). Zglosil Pawel przy kafelkach
   licencji, ale przyczyna byla wspolna dla calej karty. */
@media(max-width:1080px){.prof{grid-template-columns:minmax(0,1fr)}}
.pkpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
@media(max-width:1500px){.pkpis{grid-template-columns:repeat(2,1fr)}}
.pkpi{background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:11px 13px;box-shadow:var(--shadow);min-width:0}
.pkpi__lab{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.pkpi__val{font-size:18px;font-weight:800;margin-top:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pkpi__sub{font-size:12px;font-weight:600;margin-top:4px;color:var(--muted)}
/* PROJEKTY Etap1 — pasek postępu (% realizacji) */
.pprog{display:flex;align-items:center;gap:10px;margin:-4px 0 18px}
.pprog__track{flex:1;height:9px;background:var(--line);border-radius:6px;overflow:hidden}
.pprog__track>span{display:block;height:100%;background:linear-gradient(90deg,var(--brand,#3b82f6),#22c55e);border-radius:6px;transition:width .3s}
.pprog__pct{font-size:13px;font-weight:800;min-width:38px;text-align:right}
.pprog__etap{font-size:12px;font-weight:600;color:var(--muted);padding:2px 8px;background:var(--panel);border:1px solid var(--line);border-radius:999px;white-space:nowrap}
.prjmini{display:inline-flex;align-items:center;gap:7px;width:100%}
.prjmini__t{flex:1;height:7px;background:var(--line);border-radius:5px;overflow:hidden;min-width:40px}
.prjmini__t>span{display:block;height:100%;background:linear-gradient(90deg,var(--brand,#3b82f6),#22c55e);border-radius:5px}
.prjmini>small{font-size:11px;font-weight:700;color:var(--muted);min-width:30px;text-align:right}
/* BUDŻET PROJEKTU (Etap 2) */
.ibtn{border:1px solid var(--line);background:var(--panel);border-radius:7px;padding:3px 7px;font-size:12px;font-weight:600;color:var(--ink);cursor:pointer;line-height:1.4}
.ibtn:hover{background:var(--hover,#f1f1f7);border-color:var(--brand,var(--accent))}
.budz-sum{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:18px}
@media(max-width:1100px){.budz-sum{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.budz-sum{grid-template-columns:repeat(2,1fr)}}
.budzkpi{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:9px 11px;min-width:0}
.budzkpi__lab{font-size:10px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.budzkpi__val{font-size:16px;font-weight:800;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* .1149 ROBOCIZNA (Etap 2 kontrolingu): rozbicie kosztu pracy per osoba + dopisek na kaflu kosztow */
.budzkpi__sub{font-size:10.5px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.budz-rob{border:1px solid var(--line);border-radius:10px;padding:4px 12px}
.budz-rob__brak{background:#fffbeb;color:#b45309;border:1px solid #fde68a;border-radius:9px;padding:7px 9px;margin:8px 0;font-size:12.5px;line-height:1.45}
.budzrobrow{display:grid;grid-template-columns:1fr 110px 120px;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line);font-size:13px}
.budzrobrow:last-child{border-bottom:0}
.budzrobrow.is-sum{border-top:2px solid var(--line-strong,var(--line));border-bottom:0}
.budzrobrow__g{text-align:right;color:var(--muted)}
.budzrobrow__k{text-align:right;font-weight:700}
/* ===== FAKTURA ZAKUPOWA: ODCZYT OBOK ORYGINALU (zamowienie Pawla 2026-08-21) =====
   PO CO: propozycja modelu i oryginal dokumentu byly na DWoCH ekranach — zrodlo otwieralo sie
   w nowej karcie przegladarki, wiec sprawdzanie „czy AI dobrze przeczytala" szlo z pamieci.
   Teraz: z lewej odczytane pola, z prawej oryginal, jedno spojrzenie.
   ⚠️ Prawa kolumna jest STICKY — przy dlugiej rozpisce pozycji zrodlo ma zostac na oczach. */
.fzsplit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}  /* POL NA POL — zgloszenie Pawla: przy 60/40 orginal byl scisniety, a to on jest tu dowodem */
.fzsplit--solo{grid-template-columns:minmax(0,1fr)}
.fzsplit__l{min-width:0}                       /* min-width:0 = warunek, by dlugie nazwy pozycji nie rozpychaly gridu */
.fzsplit__r{position:sticky;top:8px;min-width:0}
.fzsrc{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.fzsrc__bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 10px;border-bottom:1px solid var(--line)}
.fzsrc__bar b{font-size:13px}
.fzsrc__bar .fzsrc__sp{margin-left:auto}
.fzsrc__box{position:relative;overflow:auto;max-height:calc(100vh - 210px);background:var(--bg,#f8fafc);text-align:center}
.fzsrc__box.is-lupa img{cursor:zoom-in}
/* LUPA — czyta drobny tekst BEZ przelaczania widoku. Pokazuje piksele ORYGINALU (nie powiekszony
   podglad), wiec jest ostra. `pointer-events:none` jest tu konieczne: inaczej lupa lapalaby mysz
   i zdarzenie `mousemove` nad obrazem przestaloby przychodzic. */
.fzlupa{position:absolute;width:230px;height:230px;border-radius:50%;border:3px solid var(--accent);
  box-shadow:0 6px 22px rgba(0,0,0,.28);background-repeat:no-repeat;background-color:#fff;
  pointer-events:none;display:none;z-index:5}
.fzsrc__box.is-lupa .fzlupa.is-on{display:block}
/* POLA NAGLOWKA WPISYWANE NA KARCIE — okno „Popraw" zaslanialo orginal, wiec nie bylo z czego
   przepisywac (zgloszenie Pawla). Teraz pola stoja obok podgladu. */
.fzhead__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-top:8px}
.fzfld{display:flex;flex-direction:column;gap:3px;font-size:12px}
.fzfld span{color:var(--muted);font-weight:600}
.fzfld input{padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13.5px;background:var(--panel);color:inherit;width:100%}
.fzfld input:focus{outline:2px solid var(--accent);outline-offset:-1px}
.fzfld--brak input{border-color:#fbbf24;background:#fffbeb}   /* nieodczytane = zolte, zeby bylo widac, co zostalo do wpisania */
.fzfld--brak span::after{content:" — do wpisania";color:#b45309;font-weight:600}
.fzfld--ok input{border-color:#86efac}
.fzfld__wide{grid-column:1/-1}
.fzsrc__box img{width:100%;height:auto;display:block}
.fzsrc__box.is-11 img{width:auto;max-width:none}   /* 1:1 = prawdziwe piksele; male literki na zrzucie z ERP inaczej sa nieczytelne */
.fzsrc__box iframe{width:100%;height:calc(100vh - 250px);border:0;display:block;background:#fff}
.fzsrc__brak{padding:14px;font-size:13px;color:var(--muted)}
/* WASKI EKRAN: zrodlo schodzi POD odczyt i przestaje byc przyklejone — inaczej zjadaloby cala
   wysokosc telefonu i rozpiska pozycji staje sie nieuzywalna. */
@media (max-width:1100px){
  .fzsplit{grid-template-columns:minmax(0,1fr)}
  .fzsplit__r{position:static}
  .fzsrc__box{max-height:60vh}
  .fzsrc__box iframe{height:60vh}
}
.budzkpi--over{border-color:#ef4444}.budzkpi--over .budzkpi__val{color:#ef4444}
.budzkpi--good{border-color:#22c55e}.budzkpi--good .budzkpi__val{color:#16a34a}
.budz-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.budz-head h4{margin:0;font-size:14px}
.budz-tb{display:flex;gap:6px;flex-wrap:wrap}
.budz-cols{display:grid;grid-template-columns:minmax(180px,2fr) 1fr 1fr auto;gap:10px;padding:0 10px 6px;font-size:10px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);border-bottom:1px solid var(--line)}
.budz-tree{display:flex;flex-direction:column}
.budzrow{display:grid;grid-template-columns:minmax(180px,2fr) 1fr 1fr auto;gap:10px;align-items:center;padding:7px 10px;border-bottom:1px solid var(--line)}
.budzrow:hover{background:var(--hover,#f7f7fb)}
.budzrow__name{display:flex;align-items:center;gap:7px;min-width:0;font-size:14px}
.budzrow__name b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.budzrow__acts{display:flex;gap:4px;justify-content:flex-end}
.budzb{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;padding:2px 6px;border-radius:999px}
.budzb--g{background:#eef2ff;color:var(--accent)}.budzb--k{background:#fef2f2;color:#dc2626}.budzb--p{background:#ecfdf5;color:#059669}
.budzc{display:flex;flex-direction:column;gap:3px}
.budzc__n{font-size:13px;font-weight:700}.budzc__n small{font-weight:500;color:var(--muted)}
.budzc__bar{height:5px;background:var(--line);border-radius:4px;overflow:hidden}
.budzc__bar>span{display:block;height:100%;background:var(--brand,var(--accent));border-radius:4px}
.budzc.is-over .budzc__n b{color:#dc2626}.budzc.is-over .budzc__bar>span{background:#ef4444}
.budzc.is-rev .budzc__bar>span{background:#22c55e}
.budz-reals{display:flex;flex-direction:column}
.budzreal{display:grid;grid-template-columns:92px minmax(120px,1.4fr) 110px 2fr auto auto;gap:10px;align-items:center;padding:6px 10px;border-bottom:1px solid var(--line);font-size:13px}
/* .1148 PLATNOSCI KLIENTA (Etap 1 kontrolingu): wiersz raty = termin, kwota, opis, dwa czeki.
   CZERWONY = termin minal bez odhaczonej FV (to ma kluc w oczy); zielone tlo czeka = odhaczony. */
.budzplat{display:grid;grid-template-columns:92px 110px 1fr auto auto auto auto;gap:10px;align-items:center;padding:6px 10px;border-bottom:1px solid var(--line);font-size:13px}
.budzplat.is-late{background:#fef2f2}
.budzplat.is-late .budzplat__d{color:#b91c1c;font-weight:700}
.budzplat__kw{font-weight:700;text-align:right}
.budzplat__o{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.budzplat__late{color:#b91c1c;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.budzchk{border:1px solid var(--line);background:#fff;border-radius:8px;padding:3px 9px;font:inherit;font-size:12px;color:var(--muted);cursor:pointer;white-space:nowrap}
.budzchk:hover{border-color:var(--accent);color:var(--accent)}
.budzchk.is-on{background:#f0fdf4;border-color:#dcfce7;color:#15803d;font-weight:700}
@media (max-width:900px){ .budzplat{grid-template-columns:88px 1fr auto auto;row-gap:4px} .budzplat__o{grid-column:1/-1} }
.budzreal__d{color:var(--muted);font-size:12px}
.budzreal__poz{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.budzreal__kw{font-weight:800;text-align:right}.budzreal__kw.is-cost{color:#dc2626}.budzreal__kw.is-rev{color:#16a34a}
.budzreal__o{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.budzreal__src{font-size:10px;font-weight:700;text-transform:uppercase;color:var(--brand,var(--accent));background:#eef2ff;padding:1px 6px;border-radius:999px}
.budz-empty{padding:18px;text-align:center}.budz-empty p{color:var(--muted);margin-bottom:12px}
.budz-empty .budz-tb{justify-content:center}
.ptabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:16px;overflow-x:auto}
.ptab{border:none;background:transparent;padding:9px 13px;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}
.ptab:hover{color:var(--txt)}
.ptab.is-active{color:var(--accent);border-bottom-color:var(--accent)}
.ptab .cnt{font-size:11px;background:var(--soft);border-radius:20px;padding:0 7px;margin-left:5px;color:var(--muted)}
.ppanel{display:none}.ppanel.is-active{display:block}
.psec2{margin-bottom:20px}
.psec2 h3{font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin:0 0 9px}
.tldot{flex:none;width:9px;height:9px;border-radius:50%}
.notebox{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:12px;box-shadow:var(--shadow);margin-bottom:16px}
.notebox textarea{width:100%;border:none;outline:none;resize:vertical;min-height:60px;font:14px/1.5 inherit;font-family:inherit;color:var(--txt)}
.notebox__bar{display:flex;align-items:center;gap:10px;margin-top:8px}
.notebox__hint{font-size:12px;color:var(--muted);flex:1}
.note{border:1px solid var(--line);border-radius:11px;background:var(--panel);padding:12px 14px;margin-bottom:10px;box-shadow:var(--shadow)}
.note__hd{display:flex;align-items:center;gap:8px;margin-bottom:5px}
.note__hd b{font-size:13px}.note__hd small{color:var(--muted);margin-left:auto}
.note__bd{font-size:14px;line-height:1.55;color:#374151;white-space:pre-wrap}
/* Formularz „Nowa notatka" (karty klient/projekt/lead) → save_note */
.noteform{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:12px;box-shadow:var(--shadow);margin-bottom:16px;display:flex;flex-direction:column;gap:9px}
.nf__top{display:flex;align-items:center;gap:10px}
.nfinput{flex:1;min-width:0;border:1px solid var(--line);border-radius:9px;padding:8px 11px;font:inherit;font-size:14px;color:var(--txt);background:#fff}
.nfinput:focus{outline:none;border-color:var(--accent)}
.nfinput--sm{font-size:13px;padding:7px 9px}
.nftext{width:100%;border:1px solid var(--line);border-radius:9px;outline:none;resize:vertical;min-height:74px;font:14px/1.5 inherit;color:var(--txt);padding:9px 11px;background:#fff;box-sizing:border-box}
.nftext:focus{border-color:var(--accent)}
.nfseg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;flex:none}
.nfseg__b{border:none;background:#fff;padding:7px 13px;font-size:13px;font-weight:600;cursor:pointer;color:var(--muted)}
.nfseg__b+.nfseg__b{border-left:1px solid var(--line)}
.nfseg__b.is-active{background:var(--accent-soft);color:var(--accent)}
.nf__meta{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.nffield{display:flex;flex-direction:column;gap:3px;font-size:12px;font-weight:600;color:var(--muted);flex:1;min-width:150px}
.nffield--wide{flex-basis:100%;flex-grow:1}
.nfsel{border:1px solid var(--line);border-radius:8px;padding:7px 9px;font:inherit;font-size:13px;font-weight:400;color:var(--txt);background:#fff}
.nfsel:focus{outline:none;border-color:var(--accent)}
.nfchip{align-self:flex-start;display:inline-block;background:var(--accent-soft);color:var(--accent);border-radius:7px;padding:6px 10px;font-size:13px;font-weight:600}
.av{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--accent);color:#fff;font-size:10px;font-weight:700;flex:none}
.av--soft{background:var(--soft);color:var(--muted)}
.rail{display:flex;flex-direction:column;gap:16px}
.railsec{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;box-shadow:var(--shadow)}
.railsec h3{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:0 0 11px}
.person{display:flex;align-items:center;gap:10px;padding:6px 0}
.person__meta{flex:1;min-width:0;line-height:1.3}
.person__meta b{font-size:13px;display:block}
.person__meta small{color:var(--muted);font-size:12px}
.person .iconbtn{text-decoration:none}
.dl__row{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:6px 0;border-bottom:1px solid var(--soft)}
.dl__row:last-child{border-bottom:none}
.dl__row span{color:var(--muted)}
.dl__row b{font-weight:600;text-align:right}
[data-goto],[data-open]{cursor:pointer}
tbody tr[data-open]:hover td{background:var(--accent-soft)}
.cardbannerwrap{flex:1 1 auto;display:flex;justify-content:center;min-width:180px}
.cardbanner{font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:#fff;background:linear-gradient(135deg,var(--accent),var(--violet));border:none;border-radius:999px;padding:5px 14px;white-space:nowrap;box-shadow:0 2px 8px rgba(99,102,241,.35)}
.person__acts{margin-left:auto;display:inline-flex;gap:6px;align-items:center}
tbody tr[data-goto]:hover td{background:var(--accent-soft)}
.tl__row[data-goto]:hover,.task[data-goto]:hover{border-color:var(--accent)}
.tl__row[data-open],.tl__row[data-calopen],.tl__row[data-goto]{cursor:pointer}   /* klikalne karty pulpitu (zadanie/kalendarz) */
.tl__row[data-calopen]:hover{border-color:var(--accent)}
.tl__time--task .listdate{font-size:12px;padding:3px 6px}   /* edytowalny termin w karcie zadania (węższy) */
/* Przegląd jako dashboard */
.pdash{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(max-width:780px){.pdash{grid-template-columns:1fr}}
.pcard{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;box-shadow:var(--shadow);min-width:0}
.pcard--wide{grid-column:1/-1}
.pcard h4{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin:0 0 8px;display:flex;align-items:center;gap:7px}
.pcard h4 .cnt{font-size:11px;background:var(--soft);border-radius:20px;padding:0 7px;color:var(--muted)}
.pli{display:flex;align-items:center;gap:8px;padding:8px 6px;margin:0 -6px;border-bottom:1px solid var(--soft);font-size:13px;border-radius:7px}
.pli:last-child{border-bottom:none}
.pli:hover{background:var(--soft)}
.pli__main{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pli__r{color:var(--muted);font-size:12px;flex:none}
/* Zakładka PLAN projektu — harmonogram etapów (spójny z .pcard/.pli) */
.pli--task{padding-left:22px;font-size:13px}
.etap-st{font-size:11px;font-weight:600;padding:2px 9px;border-radius:20px;border:1px solid transparent;white-space:nowrap;flex:none}
.etap-st--planowany{color:var(--muted);background:var(--soft);border-color:var(--line)}
.etap-st--w_toku{color:var(--accent);background:var(--accent-soft);border-color:#e0e7ff}
.etap-st--zrobiony{color:var(--ok);background:#ecfdf5;border-color:#d1fae5}
.plan-etsel{border:1px solid var(--line);border-radius:7px;padding:4px 7px;font-size:12px;background:#fff;color:var(--txt);font-family:inherit;max-width:170px;flex:none}
.plan-etsel:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
/* .576 (Etap 6): edytowalne daty etapu w wierszu Harmonogramu */
.etap-dates{display:inline-flex;align-items:center;gap:3px;flex:none}
.etap-date{border:1px solid var(--line);border-radius:6px;padding:2px 5px;font-size:11px;background:#fff;color:var(--txt);font-family:inherit;width:120px}
.etap-date:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.etap-date--hint{border-color:var(--accent);background:var(--accent-soft)}   /* .577: podświetlenie pustych pól dat (zachęta) gdy zaden etap nie ma dat */
.etap-dsep{color:var(--muted);font-size:11px}
/* .576: OŚ CZASU etapów (własny layout, bez zależności) */
.etos{position:relative;margin:2px 0 6px;padding:4px 8px 2px}
.etos__grid{position:absolute;left:158px;right:8px;top:4px;bottom:20px;pointer-events:none;z-index:0}
.etos__mline{position:absolute;top:0;bottom:0;width:1px;background:var(--line);opacity:.6}
.etos__today{position:absolute;top:0;bottom:0;width:2px;background:#ef4444;opacity:.75}
.etos__row{position:relative;display:flex;align-items:center;height:34px;z-index:1}   /* .580: grubsze wiersze osi */
.etos__lbl{width:150px;flex:0 0 150px;padding-right:8px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:6px}
.etos__lp{flex:none;min-width:16px;height:16px;border-radius:50%;background:var(--soft);color:var(--muted);font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.etos__track{position:relative;flex:1 1 auto;height:100%}
.etos__bar{position:absolute;top:5px;height:24px;border-radius:6px;font-size:11px;font-weight:600;color:#fff;line-height:24px;padding:0 8px;overflow:hidden;white-space:nowrap;box-sizing:border-box;box-shadow:0 1px 3px rgba(16,12,40,.18);min-width:6px}   /* .580: grubsze paski */
.etos__bar--planowany{background:#94a3b8}
.etos__bar--w_toku{background:var(--accent,var(--violet))}
.etos__bar--zrobiony{background:#16a34a}
.etos__bar.is-approx{opacity:.66;background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.22) 0,rgba(255,255,255,.22) 4px,transparent 4px,transparent 8px)}
.etos__nodate{position:absolute;top:5px;left:2px;font-size:10px;color:var(--muted)}
.etos__scale{position:relative;height:16px;margin-left:158px}
.etos__mlbl{position:absolute;font-size:10px;color:var(--muted);transform:translateX(2px);white-space:nowrap}
.etos__leg{display:flex;gap:14px;flex-wrap:wrap;align-items:center;font-size:11px;color:var(--muted);padding:2px 8px 8px}
.etos__leg span{display:inline-flex;align-items:center;gap:5px}
.etos__dot{width:11px;height:11px;border-radius:3px;display:inline-block}
.etos__empty{padding:10px 8px;color:var(--muted);font-size:13px}
.etos__hint{margin:2px 0 10px;padding:11px 14px;background:var(--accent-soft);border:1px dashed var(--accent);border-radius:10px;color:var(--txt);font-size:13px;line-height:1.5}   /* .577: zachęta do wpisania dat etapów zamiast mylącego pustego wykresu */
/* .580: karta Plan — przełącznik Harmonogram/Zarządzaj + kolory etapów */
.planvtog{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;margin-bottom:14px}
.planvtog__b{border:none;background:#fff;padding:8px 15px;font-size:13px;font-weight:600;cursor:pointer;color:var(--muted)}
.planvtog__b+.planvtog__b{border-left:1px solid var(--line)}
.planvtog__b.is-active{background:var(--accent-soft);color:var(--accent)}
.etap-dot{width:13px;height:13px;border-radius:50%;flex:none;display:inline-block}
.etap-dot--btn{border:2px solid #fff;box-shadow:0 0 0 1px var(--line);cursor:pointer;padding:0}
.etap-dot--btn:hover{box-shadow:0 0 0 2px var(--accent)}
.etap-lp{width:20px;text-align:center;color:var(--muted);font-size:12px;flex:none}
.etcpick{padding:12px}
.etcpick__hd{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:9px}
.etcpick__grid{display:grid;grid-template-columns:repeat(8,1fr);gap:7px}
.etcpick__sw{width:22px;height:22px;border-radius:6px;border:2px solid #fff;box-shadow:0 0 0 1px var(--line);cursor:pointer;padding:0}
.etcpick__sw.is-on{box-shadow:0 0 0 2px var(--accent)}
.etcpick__def{display:block;margin-top:11px;font-size:12px;color:var(--muted);background:none;border:none;cursor:pointer;padding:2px}
.etcpick__def:hover{color:var(--accent)}
.harmo-bulk{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 10px;margin-bottom:8px;background:var(--soft);border:1px solid var(--line);border-radius:9px;font-size:13px}
.harmo-bulk [data-zbcount]{color:var(--muted);font-size:12px}
.reccard{max-width:680px}
/* pasek akcji edycji na karcie rekordu (Krok 1) */
.recacts{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 18px;max-width:680px}
.recacts .recact{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.recacts select,.recacts input[type=date]{border:1px solid var(--line);border-radius:8px;padding:6px 9px;font:inherit;font-size:13px;background:#fff;color:var(--txt)}
.recacts select:focus,.recacts input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.recact-msg{font-size:12px;font-weight:600;color:var(--ok)}
.reccard .dl__row{padding:9px 0}
.reccard .note__bd{font-size:14px}
/* Duże pole Opis na karcie rekordu (zadanie/pomysł/decyzja) — edycja inline */
.railsec--opis h3{color:var(--accent)}
.opisbox{width:100%;box-sizing:border-box;font-family:inherit;font-size:14px;line-height:1.55;color:#374151;border:1px solid var(--line);border-radius:10px;padding:11px 13px;resize:vertical;background:#fff}
.opisbox:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.opisbar{display:flex;align-items:center;gap:10px;margin-top:9px}
.opisro{min-height:36px}
/* Karta rekordu: układ 2-kolumnowy (Szczegóły | Opis) + inline edycja pól przez rozwijaną listę */
.reccard--split{max-width:1320px;display:grid;grid-template-columns:1.7fr 1fr;gap:14px;align-items:start}
@media(max-width:900px){.reccard--split{grid-template-columns:1fr}}
.recmain{display:flex;flex-direction:column;gap:14px;min-width:0}
.recside{min-width:0;display:flex;flex-direction:column;gap:14px}
.recside .opisbox{min-height:260px}
/* redesign karty (2026-06-28): nagłówek z akcjami, Opis-hero, Status-akcent, edytowalny termin */
.recheadbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.recheadbar-r{display:flex;gap:8px;align-items:center}
.railsec:empty{display:none}
.railsec--opishero{border-color:var(--accent);background:var(--accent-soft)}
.railsec--opishero .opishero-hd{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:9px}
.railsec--opishero h3{color:var(--accent);margin:0}
.opishero-sub{font-weight:500;text-transform:none;letter-spacing:0}
.opisbox--hero{min-height:150px;background:#fff}
/* KOMENTARZE wewnętrzne karty zadania (2026-07-08) — dodawanie + akcje edytuj/usuń */
.komadd{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.komadd .btn{align-self:flex-end}
.komta{width:100%;box-sizing:border-box;font-family:inherit;font-size:13px;line-height:1.5;color:#374151;border:1px solid var(--line);border-radius:8px;padding:8px 10px;resize:vertical;background:#fff;min-height:44px}
.komta:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.komtresc{font-size:13px;line-height:1.5;color:var(--txt);margin-top:3px;white-space:pre-wrap;overflow-wrap:anywhere}
.komacts{display:flex;gap:12px;margin-top:6px}
.komacts .link{font-size:12px;cursor:pointer}
.railsec--status{border-color:var(--accent)}
.railsec--status h3{color:var(--accent)}
.railstatus{width:100%;box-sizing:border-box;font:inherit;font-size:14px;font-weight:600;border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:#fff;color:var(--txt)}
.railstatus:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.statushint{margin-top:6px;font-size:11px}
.raildate{border:1px solid var(--line);border-radius:7px;padding:3px 7px;font:inherit;font-size:13px;background:#fff;color:var(--txt)}
.raildate:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
/* KLUCZOWE pola karty (Przypisanie) — wyróżnione, klikalne (user 2026-06-28: koniec „masy szarych pól") */
.railsec--key{border-color:var(--accent)}
.railsec--key h3{color:var(--accent)}
.keyfield{margin-bottom:10px}
.keyfield:last-child{margin-bottom:0}
.keyfield-lab{display:block;font-size:12px;color:var(--muted);margin-bottom:4px}
.kf-need{color:var(--danger,#dc2626);font-weight:600}
.keyctl{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:9px;padding:9px 12px;background:#fff;font-size:14px;font-weight:600;color:var(--txt);cursor:pointer}
.keyctl:hover{border-color:var(--accent);background:var(--accent-soft)}
.keyctl .cpchev{color:var(--muted);font-style:normal;font-size:12px}
.keyctl--need{border-color:var(--danger,#dc2626);background:#fef2f2}
.keyctl--ro{cursor:default;font-weight:500}
.keyctl--ro:hover{border-color:var(--line);background:#fff}
.keyctl-v{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.comboopt small{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:1px}
.combogrp{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:7px 10px 3px;border-top:1px solid var(--soft);margin-top:3px}
.comboopt--inactive{opacity:.62}
.comboopt--inactive:hover{opacity:1}
/* FAZA 2: panel Konwersacja (wątek Zoho na karcie) */
.konw-hd{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.konw-hd h3{margin:0}
/* .1240: akcje odpowiedzi przeniesione POD nagłówek wątku (były pod całą korespondencją — przy dłuższej
   historii trzeba było przewinąć wszystko, żeby zobaczyć, że da się odpowiedzieć). `flex-wrap` jest tu
   konieczny: cztery kontrolki obok tytułu nie mieszczą się na węższym ekranie i bez zawijania
   „Odśwież wątek" wypadłby poza kartę. */
.konw-akcje{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.konw-thread{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.konw-msg{border:1px solid var(--line);border-radius:10px;padding:8px 11px}
.konw-msg--us{border-color:var(--accent);background:var(--accent-soft);margin-left:26px}
.konw-meta{font-size:12px;color:var(--muted);margin-bottom:3px}
/* .1146 (zgloszenie Lukasza Zarzyckiego): watek zwijany, najnowsze na gorze. Zwinieta pozycja to
   JEDEN wiersz - kto, kiedy i poczatek tresci - wiec cala korespondencja miesci sie na ekranie. */
.konw-meta[data-konwtog]{cursor:pointer;display:flex;align-items:baseline;gap:6px;margin-bottom:0;padding:3px 0;flex-wrap:wrap}
.konw-meta[data-konwtog]:hover{color:var(--txt)}
.konw-ch{color:var(--muted);flex:0 0 auto;width:11px;display:inline-block}
.konw-meta b{color:var(--txt);font-size:12.5px}
/* podglad tresci na zwinietej pozycji: zabiera reszte wiersza i URYWA sie wielokropkiem, nie zawija */
.konw-prev{flex:1 1 120px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:italic;opacity:.85}
.konw-msg.is-open .konw-prev{display:none}   /* rozwinieta pokazuje pelna tresc — podglad bylby powtorzeniem */
.konw-wrap{margin-top:6px}
.konw-wrap[hidden]{display:none}   /* ⚠️ bez tej linii `display` na dziecku bilby wbudowane [hidden] */
.konw-body{font-size:13px;line-height:1.5;color:var(--txt);word-break:break-word}
.konw-reply{border-top:1px solid var(--soft);padding-top:10px}
.cellpick{cursor:pointer;display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:7px;padding:2px 8px;background:#fff;font-weight:600;color:var(--txt)}
.cellpick:hover{border-color:var(--accent);background:var(--accent-soft)}
.cpchev{color:var(--muted);font-size:11px}
.combopop{position:absolute;z-index:1000;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.18);padding:7px;max-width:460px}
.comboinp{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:7px;padding:7px 10px;font:inherit;font-size:13px;outline:none;margin-bottom:6px}
.comboinp:focus{border-color:var(--accent)}
.combolist{max-height:260px;overflow-y:auto}
.comboopt{padding:7px 9px;border-radius:7px;cursor:pointer;font-size:13px;display:flex;flex-direction:column;align-items:stretch;gap:1px;line-height:1.3}
.comboopt:hover{background:var(--accent-soft)}
.comboopt.is-cur{background:var(--soft);font-weight:700}
.comboopt small{display:block;color:var(--muted);margin-left:0;font-size:11px;margin-top:1px}
.comboopt__bill{align-self:flex-start;display:inline-block;font-weight:700;font-size:11px;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent);border-radius:6px;padding:0 7px;margin-top:2px;line-height:1.55}
.comboopt--add{color:var(--accent);font-weight:700;border-top:1px solid var(--soft);margin-top:3px}
.comboopt--add:hover{background:var(--accent-soft)}
.comboempty{padding:9px;color:var(--muted);font-size:13px;text-align:center}
.convbar{background:var(--accent-soft);border:1px solid var(--accent);color:var(--accent);border-radius:10px;padding:10px 14px;margin:0 0 16px;font-size:13px;font-weight:600;max-width:680px}
/* Lista zadań — tabela + szybkie akcje inline */
.zadseg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;margin-bottom:14px}
.zadseg__b{border:none;background:#fff;padding:7px 14px;font-size:13px;font-weight:600;cursor:pointer;color:var(--muted)}
.zadseg__b+.zadseg__b{border-left:1px solid var(--line)}
/* KLODKA PRZY CUDZYM ZADANIU (ADR-0051) — wiersz zespolu, ktorego nie da sie otworzyc bez zgody.
   Wyglada jak PRZYCISK, nie jak ikonka ostrzegawcza: to jest DROGA DALEJ (zloz wniosek), a nie
   komunikat „nie wolno". Roznica jest istotna — ekran bez wyjscia to osobna klasa usterki (.1082). */
.zadklodka{border:1px solid var(--line);background:var(--soft);color:var(--muted);border-radius:999px;
           padding:1px 9px;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;margin-left:6px}
.zadklodka:hover:not(:disabled){background:#fff;color:var(--accent);border-color:var(--accent)}
.zadklodka:disabled{opacity:.7;cursor:default}
.zadseg__b.is-active{background:var(--accent-soft);color:var(--accent)}
.zadgrp{margin-bottom:20px}
.zadgrp__h{font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700;margin:0 0 9px}
.zadgrp__h--prop{color:var(--accent)}
.zadgrp__h small{font-weight:400;text-transform:none;letter-spacing:0}
.zadtbl{width:100%;border-collapse:collapse;font-size:13px}
.zadtbl th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);padding:7px 9px;border-bottom:1px solid var(--line);font-weight:600;white-space:nowrap}
.zadtbl td{padding:7px 9px;border-bottom:1px solid var(--soft);vertical-align:middle}
.zadtbl tbody tr:hover td{background:var(--accent-soft)}
.listdate{border:1px solid var(--line);border-radius:7px;padding:4px 7px;font:inherit;font-size:12px;background:#fff;color:var(--txt)}
.listdate:focus{outline:none;border-color:var(--accent)}
.listdate.overdue,.zadtbl span.overdue{color:var(--danger);font-weight:700}
.cellpick--sm{padding:2px 7px;font-size:12px}
.zadacts{white-space:nowrap;text-align:right}
.zbtn{border:1px solid var(--line);background:#fff;border-radius:7px;min-width:28px;height:28px;cursor:pointer;font-size:13px;margin-left:3px;line-height:1;padding:0 5px}
.zbtn:hover{background:var(--soft)}
.zbtn--ok:hover{background:var(--ok);color:#fff;border-color:var(--ok)}
.zbtn--no:hover{background:var(--danger);color:#fff;border-color:var(--danger)}
/* Konfigurowalna tabela: pasek + wybór kolumn (popover) + przeciąganie szerokości */
.zadbar{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.zadbar .zadseg{margin-bottom:0}
.zadbulk{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;padding-left:10px;margin-left:2px;border-left:1px solid var(--line)}
.zadbulk b{color:var(--accent)}
/* Etap 5 (ADR-0011): widok TABLICA (Kanban) zadan — kolumny=status, przeciaganie karty = zmiana statusu */
.zadvtog{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.zadvtog__b{border:none;background:#fff;padding:7px 12px;font-size:13px;font-weight:600;cursor:pointer;color:var(--muted)}
.zadvtog__b+.zadvtog__b{border-left:1px solid var(--line)}
.zadvtog__b.is-active{background:var(--accent-soft);color:var(--accent)}
.kancols{padding:8px 6px;max-height:340px;overflow:auto}   /* .578: popup wyboru widocznych kolumn tablicy */
.kancols__hd{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;padding:2px 6px 8px}
.kancols__list{display:flex;flex-direction:column;gap:1px}
.kancols__it{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:7px;font-size:13px;cursor:pointer}
.kancols__it:hover{background:var(--soft)}
.kancols__it input{flex:none}
.zadkanban{display:flex;gap:14px;align-items:flex-start;overflow-x:auto;padding-bottom:8px}
.zadkcol{flex:1 1 0;min-width:250px;background:var(--panel2,#f6f5fb);border:1px solid var(--line);border-radius:12px;padding:10px}
.zadkcol__h{display:flex;align-items:center;gap:8px;font-weight:700;font-size:13px;margin:2px 4px 10px}
.zadkcol__n{margin-left:auto;background:#fff;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:1px 9px;font-size:12px;font-weight:600}
.zadkcol__body{display:flex;flex-direction:column;gap:8px;min-height:56px}
.zadkcard{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 11px;cursor:pointer;box-shadow:0 1px 2px rgba(16,12,40,.05);transition:box-shadow .12s,border-color .12s}
.zadkcard.can-move{cursor:grab}
.zadkcard.can-move:active{cursor:grabbing}
.zadkcard:hover{box-shadow:0 4px 12px rgba(124,58,237,.14);border-color:var(--accent-soft)}
.zadkcard__t{font-weight:600;font-size:13px;line-height:1.3;margin-bottom:6px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.zadkcard__m{display:flex;flex-wrap:wrap;gap:8px;font-size:12px;color:var(--muted);margin-bottom:6px}
.zadkcard__term.is-over{color:var(--danger,#dc2626);font-weight:600}
.zadkcard__f{display:flex;align-items:center;gap:8px;justify-content:space-between;font-size:12px;color:var(--muted);flex-wrap:wrap}
/* .596 (feedback Pawła): wskazniki POWIAZAN na kartach Kanbana — wyrazne, wypelnione pigulki zamiast slabych emoji/tekstu; spojnie zadanie<->plik na WSZYSTKICH powierzchniach */
.zadkcard__flags{display:inline-flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.relchip{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;line-height:1.5;white-space:nowrap;border:1px solid transparent}
.zadkcard__plik,.relchip--plik{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;line-height:1.5;white-space:nowrap;background:rgba(37,99,235,.12);border:1px solid rgba(37,99,235,.42);color:#1d4ed8}   /* zadanie -> podpiete pliki (paperclip) */
/* ZNACZNIK „KLIENT ODPISAL" (.1130) — ten sam kafelek na Kanbanie i w kolumnie Nazwa kazdej listy zadan.
   Swieza odpowiedz (dzis) mocniejsza: ma sie RZUCAC W OCZY posrod kilkudziesieciu kart. */
.zadwiad{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;line-height:1.5;white-space:nowrap;background:rgba(217,119,6,.12);border:1px solid rgba(217,119,6,.4);color:#b45309}
.zadwiad.is-swieze{background:rgba(220,38,38,.13);border-color:rgba(220,38,38,.45);color:#b91c1c}
.relchip--zad{background:rgba(124,58,237,.14);border-color:rgba(124,58,237,.46);color:var(--accent-hover)}   /* plik -> powiazane zadania (link) */
.relchip--flag{background:var(--accent-soft,#f3efff);border-color:var(--line);color:var(--muted);font-weight:600}   /* wiedza / kluczowy zasob (status pliku) */
.zadk-ghost{opacity:.4}
.zadk-chosen{box-shadow:0 8px 20px rgba(124,58,237,.28)}
.zadk-note{margin-top:10px;font-size:12px;color:var(--muted)}
.filtpresets{display:flex;gap:4px;flex-wrap:wrap;padding:6px 8px}
.zadcolsbtn{margin-left:auto}
.zadtbl--cfg{table-layout:fixed}
.zadtbl--cfg th{position:relative;overflow:hidden}
.zadtbl--cfg td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ===== E1 rozliczeń: rozszerzenia OPT-IN wspólnej tabeli (grupowanie / stopka sum / kolumny liczbowe / numer wiersza / edycja liczby).
   Klasy, których pozostałe listy nie używają — zero wpływu na Zadania/Klientów/Leady/Pliki itd. ===== */
.zadtbl--cfg tr.cfg-grp td{background:var(--accent-soft);color:var(--violet,var(--accent-hover));font-weight:700;font-size:12px;text-transform:uppercase;
  letter-spacing:.03em;cursor:pointer;overflow:visible;white-space:nowrap;user-select:none}   /* overflow:visible — inaczej reguła .zadtbl--cfg td ucina sumę grupy wielokropkiem */
.zadtbl--cfg tr.cfg-grp:hover td{filter:brightness(.97)}
.cfg-grp__tw{display:inline-block;width:15px;color:var(--muted)}
.cfg-grp__s{float:right;font-weight:800;text-transform:none;letter-spacing:0;color:var(--txt);font-variant-numeric:tabular-nums}
.zadtbl--cfg tfoot td{background:var(--soft);font-weight:700;border-top:2px solid var(--line);position:sticky;bottom:0;overflow:visible}
.zadtbl--cfg th.thnum,.zadtbl--cfg td.tdnum{text-align:right;font-variant-numeric:tabular-nums}
.tdnum .numneg,.numneg{color:#dc2626;font-weight:700}
.zadtbl--cfg th.thno,.zadtbl--cfg td.tdno{text-align:right;color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums;padding-right:6px}
.listnum{border:1px solid var(--soft);border-radius:9px;padding:5px 9px;font:inherit;font-size:12px;width:100%;box-sizing:border-box;
  text-align:right;font-variant-numeric:tabular-nums;background:#fff;color:var(--txt)}
.listnum:focus{outline:none;border-color:var(--accent)}
.listnum::-webkit-outer-spin-button,.listnum::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.listnum.is-reczne{border-color:var(--accent);background:var(--accent-soft);font-weight:700}   /* ADR-0023: godziny wpisane RECZNIE (zastepuja sume z kart pracy) */
.erpt{display:inline-block;min-width:34px;text-align:center;padding:2px 7px;border-radius:6px;font-size:10.5px;font-weight:800;letter-spacing:.03em}
.erpt--env{background:#e0f2fe;color:#0369a1}.erpt--opt{background:#fef3c7;color:#92400e}.erpt--xl{background:var(--accent-soft);color:var(--accent-hover)}
.vpill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:700;white-space:nowrap}
.vpill--bazowa{background:var(--soft);color:var(--muted)}.vpill--brazowa{background:#fdf0e3;color:#b45309}
.vpill--srebrna{background:#eef2f6;color:#475569}.vpill--zlota{background:#fef9c3;color:#a16207}
/* KARTA UMOWY: karty pracy WYBRANEGO miesiaca (jedna zasada: selektor okresu = te karty, ktore widzisz).
   Lista na komponencie osi aktywnosci (.aktlist/.akt__i) — ten sam wyglad co zakladka Aktywnosc. */
.umnagl{display:flex;align-items:center;gap:10px;padding:8px 12px;margin-bottom:8px;background:var(--accent-soft);
  border-radius:10px;font-size:13px;color:var(--violet,var(--accent-hover))}
.umnagl>b{font-size:14px}
.umnagl .btn{margin-left:auto}
.umnagl .muted2{font-variant-numeric:tabular-nums}
/* kropka rodzaju pracy przy wierszu (kolumna 9px siatki .akt__i) */
.akt__d{width:9px;height:9px;border-radius:50%;background:var(--accent,var(--violet))}
.akt__d--wyjazdowe{background:#f59e0b}
.akt__d--zdalne{background:var(--accent)}
/* KARTY PRACY: wlasna siatka wiersza — data i godziny w STALYCH kolumnach (dotad data lamala sie na dwie linie
   przy dlugim opisie) + lista PRZEWIJALNA (przy 50 wpisach karta nie moze rosnac w nieskonczonosc). */
.umkarty{max-height:min(58vh,520px);overflow-y:auto;border:1px solid var(--line,#e6e6ef);border-radius:10px;background:var(--panel)}
.umkarty{scrollbar-width:thin;scrollbar-color:var(--accent,var(--violet)) rgba(124,58,237,.10)}
.umkarty::-webkit-scrollbar{width:11px}
.umkarty::-webkit-scrollbar-track{background:rgba(124,58,237,.08)}
.umkarty::-webkit-scrollbar-thumb{background:var(--accent,var(--violet));border-radius:8px;border:3px solid transparent;background-clip:padding-box}
.umkarty .akt__i{grid-template-columns:30px 9px 1fr 104px 92px 74px}
.umkarty .akt__i--nieplatna{background:repeating-linear-gradient(135deg,transparent,transparent 7px,rgba(0,0,0,.022) 7px,rgba(0,0,0,.022) 14px)}
.akt__rodz{justify-self:start;font-size:11.5px;white-space:nowrap}
.akt__pusty{padding:12px 14px;color:var(--muted,#697586);font-size:12.5px;font-style:italic;border-bottom:1px solid var(--line,#e6e6ef)}
.akt__godzin{max-width:70px;padding:3px 6px}
.umrodzbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.umrodzbar .zadseg__b{font-size:12px;padding:4px 10px}
.akt__d--wewnetrzne{background:#94a3b8}
.akt__d--projektowe{background:#10b981}
.akt__data{color:var(--muted,#697586);font-size:11.5px;white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.akt__godz{font-weight:700;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.kchip[data-rejf]{cursor:pointer}
.kchip.is-on{background:var(--accent);color:#fff;font-weight:700}
.mcard__m .budzc{min-width:120px}   /* pasek godzin czytelny także w karcie mobilnej */
.colrz{position:absolute;top:0;right:0;width:7px;height:100%;cursor:col-resize;user-select:none}
.colrz:hover{background:var(--accent)}
.colchooser{padding:9px;min-width:180px}
.colchooser__h{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700;margin-bottom:7px}
.colchooser__row{display:flex;align-items:center;gap:8px;padding:5px 4px;font-size:13px;cursor:pointer;border-radius:6px}
.colchooser__row:hover{background:var(--soft)}
/* .716: KOLEJNOSC kolumn — strzalki przy kazdej pozycji (zamiast przeciagania: dziala tak samo mysza i palcem) */
/* .724: WYLACZONY przycisk ma WYGLADAC na wylaczony — inaczej user klika w martwy element i nie wie, czemu nic sie nie dzieje.
   (Powod zawsze obok, w tooltipie albo w pasku wyjasniajacym — lekcja .649: zaden przycisk nie moze byc disabled bez widocznego powodu.) */
.btn:disabled,.btn[disabled]{opacity:.42;cursor:not-allowed;filter:grayscale(.65);box-shadow:none}
.btn:disabled:hover,.btn[disabled]:hover{transform:none}
/* .721: pasek „co dalej" po zaznaczeniu wierszy ptaszkiem — nastepny krok ma byc widoczny, a nie do odgadniecia */
.rejsel{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 12px;padding:9px 14px;font-size:13px;
  background:linear-gradient(90deg,rgba(124,58,237,.10),rgba(124,58,237,.04));border:1px solid rgba(124,58,237,.28);border-radius:12px}
.colchooser{min-width:250px;max-width:min(320px,92vw)}
/* Strzalki MUSZA byc zawsze widoczne — dluga nazwa kolumny („Dodatkowy pakiet") ma sie przyciac, nie wypchnac ich poza okno */
.colchooser__row>label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.colmv{display:flex;gap:2px;flex:0 0 auto}
.colmv__b{border:1px solid var(--line);background:var(--panel);color:var(--txt);border-radius:6px;width:22px;height:22px;line-height:1;font-size:10px;cursor:pointer;padding:0}
.colmv__b:hover:not(:disabled){background:var(--accent,var(--violet));color:#fff;border-color:var(--accent,var(--violet))}
.colmv__b:disabled{opacity:.28;cursor:default}
.colchooser__hint{font-size:11px;color:var(--muted);margin:6px 2px 0}
/* .716: PILOT poziomego przewijania — ten sam pasek co pod tabela, ale przyklejony do dolu ekranu.
   Bez niego przy dlugiej liscie trzeba bylo przewinac WSZYSTKIE wiersze, zeby siegnac paska (zgloszenie Pawla). */
.tblsx{position:relative}
.tblsx__end{display:block;height:1px}
.tblsx__bar{position:sticky;bottom:0;z-index:6;overflow-x:auto;overflow-y:hidden;height:15px;margin-top:-15px;
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.92) 45%);border-radius:0 0 14px 14px;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.tblsx__bar>i{display:block;height:1px}
.tblsx__bar{scrollbar-width:auto;scrollbar-color:var(--accent,var(--violet)) rgba(124,58,237,.10)}
.tblsx__bar::-webkit-scrollbar{height:13px}
.tblsx__bar::-webkit-scrollbar-track{background:rgba(124,58,237,.10)}
.tblsx__bar::-webkit-scrollbar-thumb{background:var(--accent,var(--violet));border-radius:8px;border:3px solid transparent;background-clip:padding-box}
.tblsx__bar::-webkit-scrollbar-thumb:hover{background:var(--violet,var(--accent-hover));background-clip:padding-box}
/* ===== Nowoczesny wygląd tabel list (zadania → wzorzec dla reszty) ===== */
.zadtblwrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);background:var(--panel)}
/* WIDOCZNY pasek przewijania w poziomie — Chrome domyślnie chowa nakładkowy scrollbar i user nie wie,
   że po prawej są jeszcze kolumny (zgłoszenie Pawła). Ten sam wygląd dla list CFG i tabel kart. */
.zadtblwrap{scrollbar-width:auto;scrollbar-color:var(--accent,var(--violet)) rgba(124,58,237,.10)}
.zadtblwrap::-webkit-scrollbar{height:12px}
.zadtblwrap::-webkit-scrollbar-track{background:rgba(124,58,237,.09);border-radius:0 0 14px 14px}
.zadtblwrap::-webkit-scrollbar-thumb{background:var(--accent,var(--violet));border-radius:8px;border:3px solid transparent;background-clip:padding-box}
.zadtblwrap::-webkit-scrollbar-thumb:hover{background:var(--violet,var(--accent-hover));background-clip:padding-box}
.zadgrp__h{font-size:12px;padding:2px 2px 9px}
.zadtbl{font-size:13.5px}
.zadtbl th{padding:11px 14px;font-size:11px;color:#fff;background:var(--violet);border-bottom:1px solid var(--violet);font-weight:700;letter-spacing:.5px}
/* UCHWYT ROZSUWANIA KOLUMN — dotąd niewidoczny do czasu najechania (nikt nie wiedział, że kolumny da się rozsuwać).
   Teraz stała, delikatna kreska na nagłówku + wyraźne podświetlenie pod kursorem. */
.zadtbl--cfg th .colrz{width:9px}
.zadtbl--cfg th .colrz::after{content:"";position:absolute;top:22%;right:3px;width:2px;height:56%;background:rgba(255,255,255,.42);border-radius:2px}
.zadtbl--cfg th .colrz:hover{background:rgba(255,255,255,.30)}
.zadtbl--cfg th .colrz:hover::after{background:#fff;width:3px}
/* ===== Lejek-filtr + sort w nagłówku (BRAMA TABEL — jeden silnik, 7 list) ===== */
.zadtbl--cfg th{padding-left:11px;padding-right:11px}
.thlab{vertical-align:middle}
.thsort,.thfilt{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;margin-left:7px;color:#fff;opacity:.92;vertical-align:middle;line-height:1;border-radius:6px;transition:opacity .12s,background .12s}
.thsort{font-size:12px;width:17px;height:18px}
.thfilt{width:20px;height:18px;opacity:.85}
.thsort:hover,.thfilt:hover{opacity:1;background:rgba(255,255,255,.30)}
.thsort.is-on{opacity:1;font-size:13px;background:rgba(255,255,255,.30)}
.thfilt.is-on{opacity:1;background:rgba(255,255,255,.45)}
.thfilt svg{display:block;width:13px;height:13px}
/* lejek-popup (enum/text/num) */
.filtpop{min-width:218px;max-width:300px;padding:10px}
.filtpop__h{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700;margin-bottom:8px}
.filtvals{max-height:240px;overflow:auto;margin:4px 0}
.filtval{display:flex;align-items:center;gap:8px;padding:5px 5px;font-size:13px;cursor:pointer;border-radius:6px}
.filtval:hover{background:var(--soft)}
.filtnum{display:flex;gap:9px}
.filtnum label{display:flex;flex-direction:column;gap:3px;flex:1;font-size:12px;color:var(--muted)}
.filttext{display:flex;flex-direction:column;gap:7px}
.filtrad{display:flex;align-items:center;gap:7px;font-size:13px;cursor:pointer}
.filtpop input[type=text],.filtpop input[type=number]{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:7px;padding:6px 9px;font:inherit;font-size:13px;color:var(--txt)}
.filtpop input:focus{outline:none;border-color:var(--accent)}
.filtpop__b{display:flex;gap:7px;margin-top:9px}
.filtpop__b .btn{flex:1}
.fbtn-go{background:var(--accent);color:#fff;border-color:var(--accent)}
.fbtn-go:hover{filter:brightness(1.06)}
/* Pod-tabele KART (lead/projekt/klient) — ujednolicone do stylu głównych list (fioletowy nagłówek) + wiersz filtrów */
.zadtbl--card thead tr:first-child th{cursor:pointer}
.zadtbl--card .sarr{color:#fff;font-size:10px;margin-left:3px}
.zadtbl--card thead .filtrow th{background:var(--soft);padding:6px 9px;border-bottom:1px solid var(--line);text-transform:none;letter-spacing:0}
.zadtbl--card .filtrow input,.zadtbl--card .filtrow select{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:7px;padding:4px 7px;font:inherit;font-size:12px;color:var(--txt);background:#fff;font-weight:400}
.zadtbl--card .filtrow input:focus,.zadtbl--card .filtrow select:focus{outline:none;border-color:var(--accent)}
/* Formularz DODAWANIA (modal) — „+ Dodaj" na listach; pola = kolumny tabeli */
.modalov{position:fixed;inset:0;background:rgba(30,27,75,.34);backdrop-filter:blur(2px);z-index:950;display:flex;align-items:flex-start;justify-content:center;padding:60px 20px;overflow:auto}
.modalbox{background:#fff;border-radius:16px;box-shadow:0 24px 70px rgba(20,16,60,.34);width:min(460px,100%);max-height:86vh;overflow:auto}
.modalbox__h{font-size:17px;font-weight:700;padding:18px 22px;border-bottom:1px solid var(--line)}
.modalbox__f{display:flex;justify-content:flex-end;gap:10px;padding:15px 22px;border-top:1px solid var(--line);position:sticky;bottom:0;background:#fff}
.addform__b{padding:16px 22px;display:flex;flex-direction:column;gap:13px}
/* FORMATKA SZERZEJ, NIE DLUZEJ (Pawel 2026-08-18: "troche za bardzo sie wydluzyla — nie mozesz
   bardziej po szerokosci?"). Wspolny modal dodawania: krotkie pola w DWOCH kolumnach, pelna
   szerokosc tylko dla pierwszego pola (nazwa), opisow (textarea), ptaszkow i pol z podpowiedziami.
   :has() — Chrome 105+; starsze przegladarki zostana przy jednej kolumnie (grid sie nie wlaczy tam,
   gdzie selektor nieznany? nie — grid wlaczy sie zawsze, wiec span-reguly MUSZA byc wspierane;
   panel wymaga nowoczesnego Chrome, co juz zalozylismy przy min() w .1059). */
.modalbox.addform{width:min(660px,94vw)}
.modalbox.addform .addform__b{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:11px 14px;align-items:start}   /* .1111: `minmax(0,1fr)` zamiast `1fr` — kolumna `1fr` NIE MOZE zejsc ponizej najszerszego pola, wiec na waskim ekranie formularz rozpychal okno i wracal poziomy pasek przewijania (zmierzone: 375 px, 10 pol poza oknem) */
.modalbox.addform .addform__b>.addfld:first-child,
.modalbox.addform .addform__b>.addfld:has(textarea),
.modalbox.addform .addform__b>.addfld--cb,
.modalbox.addform .addform__b>.addfld:has(#zdDeskMail),
.modalbox.addform .addform__b>.addfld:has(.addcl){grid-column:1/-1}
.modalbox.addform .addform__b>.addform__b{grid-column:1/-1;display:grid;grid-template-columns:1fr;padding:0}
/* SCALANIE ZADAŃ — checkbox w wierszu, przycisk paska, okno wyboru głównego */
.zadselcb{width:15px;height:15px;cursor:pointer;accent-color:var(--accent);vertical-align:middle}
.zadmergebtn:not(:disabled){border-color:var(--accent);color:var(--accent);font-weight:600}
.zadmergebtn:disabled{opacity:.5;cursor:not-allowed}
.mergebox__b{padding:16px 22px;display:flex;flex-direction:column;gap:12px}
.mergebox__b .muted2{font-size:12.5px;line-height:1.5;color:var(--muted)}
.mergelist{display:flex;flex-direction:column;gap:7px}
.mergeopt{display:flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
.mergeopt:hover{background:var(--accent-soft)}
.mergeopt input{accent-color:var(--accent);flex:none}
.mergeopt__id{font-weight:700;font-size:12.5px;color:var(--accent);flex:none}
.mergeopt__t{font-size:13px;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.addfld{display:flex;flex-direction:column;gap:5px}
.addfld[hidden]{display:none}   /* .901: pole zalezne (Etap projektu) chowamy atrybutem `hidden` — bez tej linii `display:flex` BIJE wbudowane [hidden]{display:none} (wyzsza specyficznosc) i pole zostawaloby widoczne. Ta sama pulapka co przy PRIV w .84x. */
/* .906 PODZIAL ZADANIA — jeden wiersz = jedno nowe zadanie: nazwa + wykonawca + kosz, opis pod spodem na calej szerokosci */
.splitrow{display:grid;grid-template-columns:1fr 200px 34px;grid-template-areas:"tyt wyk del" "op op op";gap:8px;margin-bottom:10px;padding-bottom:10px;border-bottom:1px dashed var(--line)}
.splitrow:last-child{border-bottom:0;margin-bottom:0}
.splitrow>.splittyt{grid-area:tyt}.splitrow>.splitwyk{grid-area:wyk}.splitrow>.splitdel{grid-area:del}.splitrow>.splitop{grid-area:op}
.splitrow input,.splitrow select,.splitrow textarea{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:9px;padding:9px 11px;font:inherit;font-size:14px;color:var(--txt);background:#fff}
.splitrow textarea{resize:vertical;min-height:38px;font-size:13px}
.splitrow input:focus,.splitrow select:focus,.splitrow textarea:focus{outline:none;border-color:var(--accent)}
@media(max-width:700px){.splitrow{grid-template-columns:1fr 34px;grid-template-areas:"tyt del" "wyk wyk" "op op"}}
.addfld>span{font-size:12px;font-weight:600;color:var(--muted)}
/* .1119: „Zlecił" przy zamykaniu zadania — wartość DO ODCZYTU, ale ma wyglądać jak pole formularza,
   inaczej ginie między polami do wpisywania (ta sama wysokość i wcięcie co input obok). */
.instr-yt{font-size:12px;opacity:.75}   /* .1121: znak, ze tytul prowadzi do filmu, nie do pobierania */
.zk-zlecil{padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:var(--soft);font-size:14px}
.addfld .req{color:var(--danger);font-style:normal}
.addfld .opt{font-weight:400;color:var(--muted2,#aab);font-size:11px}
.addfld input,.addfld textarea,.addfld select,.addcl{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:9px;padding:9px 11px;font:inherit;font-size:14px;color:var(--txt);background:#fff}
.addfld input:focus,.addfld textarea:focus,.addfld select:focus{outline:none;border-color:var(--accent)}
.addfld textarea{resize:vertical;min-height:64px}
.addcl{text-align:left;cursor:pointer;color:var(--muted)}
.addcl.is-set{color:var(--txt);font-weight:600}
.addcl:hover{border-color:var(--accent)}
.addform__err{color:var(--danger);font-size:13px;padding:0 22px 6px;font-weight:600}
.zadtbl td{padding:10px 14px;border-bottom:1px solid var(--soft);color:var(--txt)}
.zadtbl tbody tr:last-child td{border-bottom:none}
.zadtbl tbody tr:hover td{background:var(--accent-soft)}
.zadtbl .link{color:var(--accent);font-weight:600}
.zadtbl .badge,.zadtbl .prio{border-radius:999px;padding:3px 11px;font-size:11px;font-weight:700;letter-spacing:.2px}
.cellpick{border-color:transparent;background:transparent;padding:3px 8px;border-radius:8px;font-weight:600}
.cellpick:hover{border-color:var(--line);background:var(--panel);box-shadow:var(--shadow)}
.cellpick .cpchev{opacity:.35}
.cellpick:hover .cpchev{opacity:1;color:var(--accent)}
.zbtn{border-radius:9px;border-color:var(--soft);width:30px;height:30px}
.listdate{border-color:var(--soft);border-radius:9px;padding:5px 9px}
/* tabela sortowalna/filtrowalna */
.dtbl{overflow-x:auto}
.dtbl table{min-width:640px}
.dtbl th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
.dtbl th.sortable:hover{color:var(--txt)}
.dtbl .sarr{font-size:10px;color:var(--accent)}
.dtbl .filtrow th{padding:6px 8px;background:var(--panel);border-bottom:1px solid var(--line)}
.dtbl .filtrow input,.dtbl .filtrow select{width:100%;min-width:64px;border:1px solid var(--line);border-radius:6px;padding:4px 7px;font-size:12px;font-family:inherit;background:#fff;color:var(--txt)}
.dtbl .filtrow input:focus,.dtbl .filtrow select:focus{outline:none;border-color:var(--accent)}
.dtbl td{font-size:13px;vertical-align:top}

/* ===== ASYSTENT: układ 2-kolumnowy + przeglądarka skilli Hermesa ===== */
.asystent-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:24px;align-items:start;max-width:1240px;margin:0 auto}
.asystent-grid .assistant{max-width:none;margin:0;padding-top:18px}
.skills{position:sticky;top:0;display:flex;flex-direction:column;max-height:calc(100vh - 150px);background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.skills__head{display:flex;align-items:center;gap:8px;padding:13px 14px 8px}
.skills__title{font-size:14px;font-weight:700;display:flex;align-items:center;gap:7px}
.skills__count{color:var(--muted);font-weight:600;font-size:13px}
.skills__refresh{margin-left:auto;font-size:16px;line-height:1}
.skills__refresh.is-spin{animation:skspin .8s linear infinite}
@keyframes skspin{to{transform:rotate(360deg)}}
.skills__meta{padding:0 14px 9px;font-size:11px;color:var(--muted)}
.skills__tools{display:flex;flex-direction:column;gap:8px;padding:0 14px 10px;border-bottom:1px solid var(--line)}
.skills__modes{display:flex;gap:4px;background:var(--soft);border-radius:9px;padding:3px}
.skmode{flex:1;border:none;background:transparent;border-radius:7px;padding:6px 4px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;white-space:nowrap}
.skmode:hover{color:var(--txt)}
.skmode.is-active{background:var(--panel);color:var(--accent);box-shadow:var(--shadow)}
.skills__alwayson{font-size:11px;color:var(--muted);line-height:1.4}
.skills__alwayson:empty{display:none}
.skills__search{border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:13px;font-family:inherit;background:var(--soft);color:var(--txt)}
.skills__search:focus{outline:none;border-color:var(--accent);background:#fff}
.skills__body{flex:1;min-height:0;overflow-y:auto;padding:6px 8px}
.skgroup{border-bottom:1px solid var(--soft)}
.skgroup:last-child{border-bottom:none}
.skgroup__h{display:flex;align-items:center;gap:8px;padding:8px 6px;cursor:pointer;user-select:none;border-radius:8px}
.skgroup__h:hover{background:var(--soft)}
.skgroup__chev{color:var(--muted);font-size:11px;transition:transform .15s;width:10px;flex:none}
.skgroup.is-open .skgroup__chev{transform:rotate(90deg)}
.skgroup__cb{width:15px;height:15px;accent-color:var(--accent);cursor:pointer;flex:none}
.skgroup__lab{font-weight:700;font-size:13px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.skgroup__n{font-size:11px;color:var(--muted);background:var(--soft);border-radius:20px;padding:1px 8px;font-weight:700;flex:none}
.skgroup__items{display:none;padding:2px 0 8px 8px}
.skgroup.is-open .skgroup__items{display:block}
.skitem{display:flex;align-items:flex-start;gap:6px;padding:4px 6px 4px 8px;border-radius:8px}
.skitem:hover{background:var(--accent-soft)}
.skitem__pick{display:flex;align-items:flex-start;gap:8px;flex:1;min-width:0;cursor:pointer}
.skitem__cb{width:15px;height:15px;margin-top:2px;accent-color:var(--accent);cursor:pointer;flex:none}
.skstar{border:none;background:transparent;cursor:pointer;font-size:15px;line-height:1;color:#cbd1d9;padding:2px;flex:none;align-self:center}
.skstar:hover{color:#f5a623}
.skstar.is-on{color:#f5a623}
.skitem__lock{font-size:10px}
.skitem__main{display:flex;flex-direction:column;gap:1px;min-width:0}
.skitem__name{font-size:13px;font-weight:600;color:var(--txt);word-break:break-word}
.skitem__desc{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.skills__foot{padding:9px 14px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);background:var(--soft)}
.sksec{border-bottom:1px solid var(--line)}
.sksec:last-child{border-bottom:none}
.sksec__h{display:flex;align-items:center;gap:8px;padding:10px;cursor:pointer;user-select:none}
.sksec__h:hover{background:var(--soft)}
.sksec__lab{flex:1;font-size:13px;font-weight:700}
.sksec--domyslne .sksec__lab{color:#b8860b}
.sksec--domyslne.is-open{background:linear-gradient(0deg,transparent,rgba(245,166,35,.06))}
.sksec__body{display:none;padding:0 4px 8px}
.sksec.is-open>.sksec__body{display:block}
.sksec.is-open>.sksec__h .skgroup__chev{transform:rotate(90deg)}
.sksec__empty{font-size:12px;color:var(--muted);padding:4px 12px 10px;line-height:1.45}
.sksec__list{padding:2px 0}
.skopt{border:none;background:transparent;cursor:pointer;font-size:13px;line-height:1;padding:2px;flex:none;align-self:center;opacity:.4;filter:grayscale(1)}
.skopt:hover{opacity:1;filter:none}
.skopt.is-on{opacity:1;filter:none}
.skitem.is-dim{opacity:.6}
.skitem__plug{width:15px;text-align:center;flex:none;font-size:12px;opacity:.6;filter:grayscale(1)}
.sklink{color:var(--accent);cursor:pointer;font-weight:600}
.sklink:hover{text-decoration:underline}
.paneltabs{display:flex;gap:2px;padding:8px 8px 0;flex:none;border-bottom:1px solid var(--line)}
.ptabbtn{flex:1;border:none;background:transparent;padding:8px 4px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}
.ptabbtn:hover{color:var(--txt)}
.ptabbtn.is-active{color:var(--accent);border-bottom-color:var(--accent)}
.paneltab{display:none;flex-direction:column;min-height:0;flex:1}
.paneltab.is-active{display:flex}
/* UMIEJĘTNOŚCI — karty (czysty widok użytkownika w Asystencie) */
.umhead{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px 0;flex:none}
.umhead__title{font-weight:800;font-size:15px;letter-spacing:-.01em}
.umhead__hint{color:var(--muted);font-size:12px;line-height:1.5;padding:6px 14px 10px;flex:none}
.umscroll{flex:1;min-height:0;overflow-y:auto;padding:2px 12px 12px}
.umlist{display:flex;flex-direction:column;gap:10px}
.umcard{display:flex;gap:12px;align-items:flex-start;padding:12px 13px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);box-shadow:var(--sh-sm);cursor:pointer;transition:border-color var(--tr),box-shadow var(--tr),background var(--tr)}
.umcard:hover{border-color:var(--line-strong);box-shadow:var(--sh-md)}
.umcard.is-on{border-color:var(--accent);background:var(--accent-soft);box-shadow:var(--sh-md)}
.umcard__cb{margin:2px 0 0;width:17px;height:17px;accent-color:var(--accent);cursor:pointer;flex:none}
.umcard__main{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.umcard__top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.umcard__name{font-weight:700;font-size:13.5px;color:var(--txt);line-height:1.3}
.umcard__tech{font-weight:500;font-size:11px;color:var(--muted)}
.umcard__badge{flex:none;font-size:10.5px;font-weight:700;color:var(--violet);background:#f3eefe;border:1px solid #e7dcff;padding:2px 9px;border-radius:999px;white-space:nowrap}
.umcard__desc{color:var(--muted);font-size:12px;line-height:1.45;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.umfoot{margin-top:12px;font-size:12px;color:var(--txt);line-height:1.5;padding:10px 12px;background:var(--soft);border:1px solid var(--line);border-radius:var(--radius-sm)}
.umfoot__infra{display:block;color:var(--muted);font-size:11px;margin-top:5px}
.umempty{color:var(--muted);font-size:12.5px;padding:16px 14px;border:1px dashed var(--line-strong);border-radius:var(--radius-sm);line-height:1.55;text-align:center}
/* Zaawansowane — zwijane zarządzanie (katalog skilli / narzędzia / crony) */
.adv{margin-top:18px;border-top:1px solid var(--line)}
.adv__head{display:flex;align-items:center;gap:7px;cursor:pointer;padding:11px 2px 4px;font-weight:700;font-size:12.5px;color:var(--muted);user-select:none}
.adv__head:hover{color:var(--txt)}
.adv__head .skgroup__chev{transition:transform var(--tr)}
.adv.is-open .adv__head .skgroup__chev{transform:rotate(90deg)}
.adv__body{display:none;padding-top:4px}
.adv.is-open .adv__body{display:block}
/* ASYSTENT v2 — dwie kolumny (lewa: wszystkie + kategorie, prawa: ulubione) */
.asys2{max-width:1240px;margin:0 auto}
.asys2__top{display:flex;flex-direction:column;gap:10px;margin-bottom:16px;padding:12px 15px;background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-line);border-radius:var(--radius-lg);box-shadow:var(--sh-sm)}
.asys2__intro{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12.5px;line-height:1.5}
.asys2__mark{display:grid;place-items:center;width:26px;height:26px;flex:none;background:var(--grad);color:#fff;border-radius:9px;font-size:14px}
.suggest--inline{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px;margin:0}
.suggest--inline button{width:auto;text-align:left;border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 13px;font-size:12.5px;font-weight:600;color:var(--txt);cursor:pointer;transition:background var(--tr),border-color var(--tr)}
.suggest--inline button:hover{background:var(--accent-soft);border-color:var(--accent)}
.asys2__cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
@media(max-width:1100px){.asys2__cols{grid-template-columns:1fr}}
.catchips{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px 2px;flex:none;max-height:96px;overflow-y:auto}
.catchip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:4px 11px;font-size:11.5px;font-weight:600;color:var(--muted);cursor:pointer;white-space:nowrap;transition:background var(--tr),color var(--tr),border-color var(--tr)}
.catchip:hover{background:var(--soft);color:var(--txt)}
.catchip.is-on{background:var(--accent);border-color:var(--accent);color:#fff}
.catchip b{font-weight:800;opacity:.65;margin-left:3px}
.catchip.is-on b{opacity:.9}
.brow{display:flex;gap:6px;align-items:flex-start;padding:8px 9px;border:1px solid transparent;border-radius:var(--radius-sm);transition:background var(--tr),border-color var(--tr)}
.brow:hover{background:var(--soft)}
.brow.is-on{background:var(--accent-soft);border-color:var(--accent)}
.brow__star{flex:none;border:none;background:transparent;color:var(--warn);font-size:16px;line-height:1;cursor:pointer;padding:1px 3px;border-radius:6px}
.brow__star:not(.is-fav){color:var(--line-strong)}
.brow__star:hover{background:#fff;color:var(--warn)}
.brow__pick{flex:1;min-width:0;display:flex;gap:8px;align-items:flex-start;cursor:pointer}
.brow__cb{margin-top:2px;width:16px;height:16px;accent-color:var(--accent);cursor:pointer;flex:none}
.brow__main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.brow__top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.brow__name{font-weight:700;font-size:13px;color:var(--txt)}
.brow__desc{color:var(--muted);font-size:11.5px;line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.umcard__pick{flex:1;min-width:0;display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.umcard__star{flex:none;border:none;background:transparent;color:var(--warn);font-size:16px;line-height:1;cursor:pointer;padding:2px 4px;border-radius:6px}
.umcard__star:hover{background:var(--soft)}
/* === KARTA UMIEJĘTNOŚCI v3 — jedna, dopracowana (obie kolumny), pastelowa plakietka per kategoria === */
.umc{display:flex;gap:13px;align-items:flex-start;padding:14px 16px;background:#fff;border:1px solid #ECEAF2;border-radius:16px;transition:border-color var(--tr),background var(--tr),box-shadow var(--tr)}
.umc:hover{border-color:#DAD3EF;box-shadow:0 2px 12px rgba(99,80,230,.07)}
.umc.is-on{background:#F7F5FE;border-color:#E2DAFA}
.umc__cb{margin-top:2px;width:18px;height:18px;accent-color:var(--violet);cursor:pointer;flex:none}
.umc__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.umc__top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.umc__name{font-weight:600;font-size:14px;color:var(--ciemne-2);line-height:1.3}
.umc__tech{font-weight:400;font-size:11.5px;color:#A6ABBA}
.umc__right{display:flex;align-items:center;gap:8px;flex:none}
.umc__star{border:none;background:transparent;color:#CDD2DC;font-size:15px;line-height:1;cursor:pointer;padding:1px 3px;border-radius:6px;transition:color var(--tr)}
.umc__star.is-fav{color:#F2B53C}
.umc__star:hover{color:#E0A52E}
.umc__badge{font-size:11px;font-weight:600;padding:3px 11px;border-radius:999px;white-space:nowrap}
.umc__desc{color:#6B7280;font-size:12.5px;line-height:1.5;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
#browseBody{display:flex;flex-direction:column;gap:10px;padding:8px 13px 14px}
.umlist{gap:10px}
.umscroll{padding:6px 13px 14px}
/* kategorie — spokojniejsze chipy */
.catchips{gap:7px;padding:13px 13px 5px;max-height:104px}
.catchip{border:1px solid #ECEAF2;background:#fff;border-radius:999px;padding:5px 13px;font-size:12px;font-weight:600;color:#7A8194}
.catchip:hover{background:#F7F5FE;color:var(--ciemne);border-color:#E2DAFA}
.catchip.is-on{background:var(--violet);border-color:var(--violet);color:#fff}
.catchip b{font-weight:700;opacity:.6;margin-left:4px;font-size:11px}
.catchip.is-on b{opacity:.85}
/* nagłówki paneli + przycisk select-all — więcej oddechu */
.umhead{padding:14px 16px 2px}
.umhead__title{font-size:14.5px;font-weight:700;letter-spacing:-.01em}
.umhead__hint{padding:9px 16px 12px;font-size:11.5px;line-height:1.55}
.skills__tools{padding:6px 13px 10px}
#favAll{border:1px solid #ECEAF2;background:#fff;color:var(--violet);font-size:12px;font-weight:600;padding:5px 12px;border-radius:9px}
#favAll:hover{background:#F7F5FE;border-color:#E2DAFA}
/* === v3.1 ODCHUDZENIE — dropdown kategorii zamiast ściany chipów + dużo powietrza === */
.asys2__cols{gap:24px}
.umc{padding:15px 18px;gap:14px;border-radius:15px}
.umlist{gap:12px}
#browseBody{gap:12px;padding:10px 15px 16px}
.umscroll{padding:8px 15px 16px}
.umhead{padding:16px 18px 2px}
.umhead__hint{padding:9px 18px 13px;color:#9097A6}
.browsebar{display:flex;gap:8px;padding:12px 15px 12px;flex:none}
.browsebar__search{flex:1;min-width:0;border:1px solid var(--line);border-radius:10px;padding:9px 13px;font-size:13px;background:#fff;color:var(--txt)}
.browsebar__search::placeholder{color:#9aa0ad}
.browsebar__search:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.browsebar__cat{flex:none;max-width:48%;border:1px solid var(--line);border-radius:10px;padding:9px 11px;font-size:12.5px;font-weight:500;background:#fff;color:var(--ciemne);cursor:pointer}
.browsebar__cat:focus{outline:none;border-color:var(--accent)}
.asys2__top{padding:13px 16px;gap:8px;margin-bottom:18px}
.asys2__intro{font-size:12px}
.suggest--inline button{font-size:12px;padding:6px 12px;font-weight:500}
/* === v4 TRZY STREFY — wąskie panele po bokach, PRZESTRONNY środek, mniejsze marginesy === */
.asys3{max-width:1640px;margin:0 auto}
.asys3__cols{display:grid;grid-template-columns:minmax(285px,330px) minmax(0,1fr) minmax(285px,330px);gap:30px;align-items:start}
@media(max-width:1280px){.asys3__cols{grid-template-columns:1fr}.asys3__cols .skills{position:static;max-height:600px}.assistant--center{order:-1}}
.assistant--center{align-self:start;padding:46px 28px 34px;text-align:center}
.assistant--center h2{font-size:25px;margin:18px 0 10px;letter-spacing:-.02em}
.assistant--center p{color:var(--muted);font-size:14px;line-height:1.65;max-width:520px;margin:0 auto}
.assistant--center .suggest{max-width:560px;margin:26px auto 0}
.assistant__note{color:var(--muted);font-size:12px;margin-top:20px}
/* boczne panele — wąskie, karty bardziej kwadratowe (opis 3 linie, paski przewijania robią resztę) */
.skills--side .browsebar{flex-direction:column;gap:8px}
.skills--side .browsebar__cat{max-width:none}
.skills--side .umc{padding:13px 15px;gap:11px}
.skills--side .umc__desc{-webkit-line-clamp:3}
.skills--side .umc__name{font-size:13.5px}
.skills--side .umhead{flex-wrap:wrap;gap:6px}
.skills--side #favAll{font-size:11.5px;padding:4px 10px}
/* === v5 — Ulubione LEWO / Wszystkie PRAWO; checkbox=preferencja (tylko w Ulubionych); WIĘKSZE gwiazdki === */
#agentPanel{order:1}
.assistant--center{order:2}
#browseCol{order:3}
@media(max-width:1280px){.assistant--center{order:-1}}
.umc__star{font-size:20px;padding:2px 5px}
.umc--nocb .umc__star{font-size:22px}
.umc__star:hover{transform:scale(1.12)}
/* Ulubione — bardziej widoczne: delikatne fioletowe tło (wyróżnione od „Wszystkie") */
#agentPanel{background:linear-gradient(180deg,rgba(244,241,254,.92),rgba(233,227,252,.86));border:1px solid var(--accent-jasny);box-shadow:0 12px 34px rgba(124,58,237,.13)}
#agentPanel .umhead__title{color:var(--accent-hover)}
#agentPanel .umc.is-on{border-color:var(--accent-jasny);box-shadow:0 3px 14px rgba(124,58,237,.16)}
.tool{border-bottom:1px solid var(--soft)}
.tool:last-child{border-bottom:none}
.tool__h{display:flex;align-items:center;gap:8px;padding:8px 10px;cursor:pointer;user-select:none}
.tool__h:hover{background:var(--soft)}
.tool__lab{flex:1;font-size:13px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tool.is-open>.tool__h .skgroup__chev{transform:rotate(90deg)}
.tool__body{display:none;padding:0 12px 10px 28px}
.tool.is-open>.tool__body{display:block}
.tool__desc{font-size:12px;color:var(--muted);margin-bottom:6px}
.tool__chips{display:flex;flex-wrap:wrap;gap:4px}
.tchip{font:11px ui-monospace,Consolas,monospace;background:var(--soft);border:1px solid var(--line);border-radius:6px;padding:1px 6px;color:var(--txt)}
.tool__none{font-size:11px;color:var(--muted)}
.tbadge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;padding:1px 7px;border-radius:20px;background:var(--soft);color:var(--muted);flex:none}
.tbadge--on{background:#dcfce7;color:#15803d}
.tbadge--cfg{background:#fef3c7;color:#b45309}
/* Połączone aplikacje (Narzędzia) + katalog skilli */
.integr{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:8px;background:var(--panel)}
.integr__h{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.integr__ico{font-size:16px;flex:none}
.integr__name{font-weight:700;font-size:13px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.integr__detail{font-size:12px;color:var(--muted);line-height:1.45}
.skcatsub{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700;margin:10px 8px 4px}
.sksec__hint{font-weight:400;color:var(--muted);font-size:11px}
.cron{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:8px;background:var(--panel)}
.cron__top{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.cron__name{font-weight:700;font-size:13px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cron__sched{font:11px ui-monospace,Consolas,monospace;color:var(--accent);margin-bottom:4px}
.cron__prompt{font-size:12px;color:var(--muted);line-height:1.4;margin-bottom:8px}
.cron__run{font-size:11.5px;color:var(--muted);margin-bottom:6px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cron__err{font-size:11.5px;color:var(--danger);background:#fef2f2;border:1px solid #fecaca;border-radius:7px;padding:4px 8px;margin-bottom:6px;line-height:1.4;word-break:break-word}
.cron-st{font-size:10.5px;font-weight:700;padding:1px 7px;border-radius:999px;white-space:nowrap}
.cron-st--ok{background:#dcfce7;color:#15803d}
.cron-st--err{background:#fee2e2;color:#b91c1c}
.cron-st--never{background:#f1f5f9;color:#64748b}
.cron--overdue{border-color:#fca5a5;box-shadow:0 0 0 1px #fca5a5}
.cron__acts{display:flex;gap:6px;flex-wrap:wrap}
.cron__acts button{border:1px solid var(--line);background:#fff;border-radius:7px;padding:3px 10px;font-size:12px;font-weight:600;color:var(--accent);cursor:pointer}
.cron__acts button:hover{background:var(--accent-soft)}
.cron__acts .cron__del{color:var(--danger)}
.cron__acts .cron__del:hover{background:#fee2e2}
.cronadd{flex:none;border-top:1px solid var(--line);padding:10px 12px;background:var(--soft)}
.cronform{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.cronf{display:flex;flex-direction:column;gap:3px;font-size:12px;font-weight:600;color:var(--muted)}
.cronf input,.cronf textarea,.cronf select{border:1px solid var(--line);border-radius:8px;padding:7px 9px;font:inherit;font-size:13px;font-weight:400;color:var(--txt);background:#fff}
.cronf input:focus,.cronf textarea:focus,.cronf select:focus{outline:none;border-color:var(--accent)}
.cronquick{display:flex;gap:6px;flex-wrap:wrap;margin-top:-2px}
.cronquick button{border:1px dashed var(--line);background:#fff;border-radius:20px;padding:3px 10px;font-size:12px;cursor:pointer;color:var(--accent)}
.cronquick button:hover{background:var(--accent-soft);border-style:solid}
.cronform__bar{display:flex;align-items:center;gap:8px}
.cron__edit{margin-top:8px;padding:9px 10px;border:1px solid var(--line);border-radius:9px;background:var(--soft);display:flex;flex-direction:column;gap:7px}
.cronmsg{font-size:12px;font-weight:600}
/* Automatyzacje (crony) — karty w duchu kart pulpitu */
.acard-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(430px,1fr));gap:12px;align-items:start}
.acard{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:#fff;box-shadow:0 1px 2px rgba(16,24,40,.04)}
.acard--off{opacity:.72;background:var(--soft)}
.acard--warn{border-color:#fecaca}
.acard__hd{display:flex;align-items:center;gap:11px}
.acard__ico{width:38px;height:38px;flex:none;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:19px;background:var(--accent-soft)}
.acard__ttl{flex:1;min-width:0}
.acard__name{font-weight:700;font-size:15px;color:var(--txt)}
.acard__when{font-size:12.5px;color:var(--accent);font-weight:600;margin-top:1px}
.acard__chip{flex:none;font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px}
.acard__chip.is-on{background:#ecfdf5;color:var(--ok)}
.acard__chip.is-off{background:#f1f5f9;color:var(--muted)}
.acard__desc{font-size:13px;line-height:1.5;color:var(--txt);margin-top:10px}
.acard__tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:9px}
.acard__lab{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.acard__tool{font-size:11.5px;font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:7px;padding:2px 9px}
.acard__flow{font-size:12px;color:var(--muted);margin-top:7px}
.acard__flow b{color:var(--violet)}
.acard__meta{font-size:12px;color:var(--muted);margin-top:10px}
.acard__ok{color:var(--ok);font-weight:600}
.acard__bad{color:var(--danger);font-weight:600}
.acard__never{color:var(--muted)}
.acard__err{font-size:12px;color:var(--danger);background:#fef2f2;border-radius:8px;padding:5px 9px;margin-top:8px}
.acard__acts{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.acard__acts button{border:1px solid var(--line);background:#fff;border-radius:9px;padding:6px 13px;font-size:12.5px;font-weight:600;color:var(--accent);cursor:pointer}
.acard__acts button:hover{background:var(--accent-soft)}
.acard__acts .acard__del{color:var(--danger);margin-left:auto}
.acard__acts .acard__del:hover{background:#fee2e2}
.acard__tech{margin-top:10px}
.acard__tech summary{font-size:11.5px;color:var(--muted);cursor:pointer;user-select:none}
.acard__techbody{font-size:11.5px;color:var(--muted);line-height:1.5;margin-top:6px;background:var(--soft);border-radius:8px;padding:8px 10px;white-space:pre-wrap;word-break:break-word}
.acard__techbody code{background:#fff;border:1px solid var(--line);border-radius:5px;padding:1px 5px;font-size:11px}
.ce__q{font-weight:700;font-size:12.5px}
.ce__modes{display:flex;gap:16px;flex-wrap:wrap;font-size:13px}
.ce__modes label{display:flex;align-items:center;gap:6px;cursor:pointer}
.ce__int,.ce__daily{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px}
.ce__n,.ce__u,.ce__time,.ce__raw{border:1px solid var(--line);border-radius:8px;padding:6px 8px;font:inherit;font-size:13px;background:#fff}
.ce__n{width:66px}
.ce__work{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12.5px}
.ce__preview{font-size:12.5px;color:var(--muted)}
.ce__preview b{color:var(--accent)}
.ce__adv summary{font-size:11.5px;color:var(--muted);cursor:pointer}
.ce__adv .ce__raw{margin-top:6px;width:100%;font-family:ui-monospace,Consolas,monospace}
/* Konsola Hermesa */
.hk-ver{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:#ecfdf5;margin-bottom:6px}
.hk-ver--old{background:#fffbeb;border-color:#fde68a}
.hk-ver__col{min-width:90px}
.hk-ver__lab{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.hk-ver__big{font-size:22px;font-weight:800;color:var(--txt);font-family:ui-monospace,Consolas,monospace}
.hk-ver__arrow{font-size:20px;color:var(--muted)}
.hk-ver__badge{margin-left:auto;font-size:12.5px;font-weight:700;padding:5px 12px;border-radius:20px}
.hk-ver__badge.is-cur{background:#d1fae5;color:var(--ok)}
.hk-ver__badge.is-old{background:#fef3c7;color:#b45309}
.hk-h{margin:16px 0 7px;font-size:13px;color:var(--muted)}
.hk-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.hk-cell{border:1px solid var(--line);border-radius:11px;padding:10px 13px;background:#fff}
.hk-cell__lab{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.hk-cell__val{font-size:17px;font-weight:700;color:var(--txt);margin-top:2px}
.hk-feats{display:flex;flex-wrap:wrap;gap:7px}
.hk-feat{font-size:12px;font-weight:600;padding:3px 10px;border-radius:8px}
.hk-feat.on{background:#ecfdf5;color:var(--ok)}
.hk-feat.off{background:#f1f5f9;color:var(--muted)}
.hk-rels{display:flex;flex-direction:column;gap:4px}
.hk-rel{font-size:12.5px;color:var(--txt);padding:5px 0;border-bottom:1px solid var(--soft)}
/* Workflow — oś czasu kroków */
.wf-timeline{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:9px}
.wf-arr{color:var(--muted);font-size:12px}
.wf-step{font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:8px;background:#f1f5f9;color:var(--muted)}
.wf-step small{font-weight:400;opacity:.8}
.wf-step--done{background:#ecfdf5;color:var(--ok)}
.wf-step--pending,.wf-step--waiting{background:#fef3c7;color:#b45309}
.wf-step--running{background:var(--accent-soft);color:var(--accent)}
.wf-step--failed,.wf-step--rejected{background:#fee2e2;color:var(--danger)}
/* ===== WORKFLOW Faza 2: karty + szczegóły + wizualizacja grafu ===== */
.wfcard{cursor:pointer;transition:box-shadow .12s,border-color .12s}
.wfcard:hover{border-color:var(--accent);box-shadow:0 2px 12px rgba(79,70,229,.13)}
.wfd-stats{display:flex;flex-wrap:wrap;gap:7px}
.wfd-stat{font-size:12px;color:var(--muted);background:var(--soft);border-radius:8px;padding:3px 10px}
.wfd-stat b{color:var(--txt);font-weight:700}
.wfd-stat.is-run b{color:var(--accent)}
.wfd-stat.is-ok b{color:var(--ok)}
.wfd-stat.is-bad b{color:var(--danger)}
.wfd-stat.is-wait b{color:#b45309}
.wfd-hd{display:flex;align-items:center;gap:11px;margin-bottom:4px}
.wfd-split{display:grid;grid-template-columns:minmax(230px,330px) 1fr;gap:16px;align-items:start;margin-top:6px}
@media(max-width:900px){.wfd-split{grid-template-columns:1fr}}
.wfd-runs,.wfd-graph{min-width:0}
.wfd-run{border:1px solid var(--line);border-radius:11px;padding:9px 11px;margin-bottom:8px;cursor:pointer;background:#fff;transition:border-color .12s,background .12s}
.wfd-run:hover{border-color:var(--accent)}
.wfd-run.is-sel{border-color:var(--accent);background:var(--accent-soft)}
.wfd-run__hd{display:flex;align-items:center;justify-content:space-between;gap:8px}
.wfd-run__when{font-size:11.5px;color:var(--muted);margin-top:3px}
.wfd-graph__wrap{border:1px solid var(--line);border-radius:12px;background:linear-gradient(180deg,#fff,#fafbff);padding:8px;overflow:auto;max-height:560px}
.wfd-nodeinfo{font-size:12px;color:var(--txt);margin-top:8px;min-height:18px}
.wfd-nodeinfo pre{background:var(--soft);border-radius:8px;padding:8px;overflow:auto;font-size:11px;margin:5px 0 0;white-space:pre-wrap}
.wfg{display:block;margin:0 auto}
.wfg-edge{fill:none;stroke:var(--line-strong);stroke-width:1.5;opacity:.65}
.wfg-arrh{fill:var(--line-strong)}
.wfg-elbl{font-size:10.5px;fill:var(--muted);paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round}
.wfg-node{cursor:pointer}
.wfg-node rect{fill:#fff;stroke:var(--line-strong);stroke-width:1.5;transition:fill .12s,stroke .12s,stroke-width .12s,filter .12s}
.wfg-node:hover rect{stroke-width:2.5;filter:brightness(.97)}
.wfg-ico{font-size:16px}
.wfg-name{font-size:12px;font-weight:700;fill:var(--txt)}
.wfg-sub{font-size:10px;fill:var(--muted)}
.wfg-node--start rect{fill:#ecfdf5;stroke:var(--ok)}
.wfg-node--koniec rect{fill:#f3f4f6;stroke:var(--muted)}
.wfg-node--agent rect{fill:var(--accent-soft);stroke:var(--violet)}
.wfg-node--par rect{fill:#f0fdfa;stroke:#0d9488}
.wfg-node--par .wfg-sub{fill:#0d9488}
.wfg-node--recenzja rect{fill:#fff7ed;stroke:#ea580c}   /* H11: krok recenzji — drugi agent sprawdza wynik pierwszego */
.wfg-node--recenzja .wfg-sub{fill:#ea580c}
.wfg-node--decyzja rect{fill:#fffbeb;stroke:var(--warn)}
.wfg-node--akcja rect{fill:#eff6ff;stroke:var(--accent)}
.wfg-node--powiad rect{fill:#fdf2f8;stroke:#db2777}
.wfg-node.is-done rect{fill:#dcfce7;stroke:var(--ok);stroke-width:2}
.wfg-node.is-active rect{fill:#fef3c7;stroke:var(--warn);stroke-width:2}
.wfg-node.is-failed rect{fill:#fee2e2;stroke:var(--danger);stroke-width:2}
.wfg-node.is-current rect{stroke:var(--accent);stroke-width:3;filter:drop-shadow(0 0 6px rgba(79,70,229,.45))}
.wfg-here{font-size:14px}
.wfg-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:11.5px;color:var(--muted);margin-top:8px;align-items:center}
.wfg-legend i.wfg-lg{display:inline-block;width:11px;height:11px;border-radius:3px;border:1.5px solid;margin-right:4px;vertical-align:middle}
.wfg-lg.start{border-color:var(--ok);background:#ecfdf5}
.wfg-lg.agent{border-color:var(--violet);background:var(--accent-soft)}
.wfg-lg.akcja{border-color:var(--accent);background:#eff6ff}
.wfg-lg.recenzja{border-color:#ea580c;background:#fff7ed}
.wfg-lg.decyzja{border-color:var(--warn);background:#fffbeb}
/* H12: MODELE AI — czym pracuje każde zadanie i ile to kosztuje (Administracja → Modele AI) */
.mod-card{margin-bottom:12px}
.mod-koszt{flex:none;text-align:right;font-size:11.5px;color:var(--muted);line-height:1.35}
.mod-koszt__v{font-size:19px;font-weight:800;color:var(--txt)}
.mod-row{display:flex;gap:9px;align-items:flex-end;flex-wrap:wrap;margin-top:10px}
.mod-fld{flex:1;min-width:240px;display:flex;flex-direction:column;gap:4px}
.mod-fld>span{font-size:11.5px;color:var(--muted);font-weight:600}
.mod-fld input{width:100%;font-family:ui-monospace,Consolas,monospace;font-size:13px}
.mod-meta{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin-top:8px;font-size:12px}
.mod-uzycie{margin-top:9px;font-size:12.5px;line-height:1.9}
.mod-zad{display:inline-block;margin:0 5px 0 0;padding:2px 9px;border-radius:999px;background:var(--soft);border:1px solid var(--line)}
.mod-zad.is-rozjazd{background:#fff7ed;border-color:#fdba74;color:#9a3412}   /* rejestr mowi co innego niz pomiar — pokazujemy, nie chowamy */
@media(max-width:760px){.mod-koszt{text-align:left;margin-top:6px}}
/* H11: ŁAŃCUCH AGENTÓW — kroki po kolei + kto je wykonuje (Administracja → Workflow → przepływ) */
.wf-lanc{margin:12px 0;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:linear-gradient(180deg,#fff,#fafbff)}
.wf-lanc__l{list-style:none;margin:8px 0 0;padding:0;counter-reset:none}
.wf-lstep{display:flex;gap:11px;align-items:flex-start;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:#fff;margin-bottom:7px}
.wf-lstep.is-recenzja{border-color:#fdba74;background:#fff7ed}
.wf-lstep__ico{flex:none;font-size:17px;line-height:1.25}
.wf-lstep__b{flex:1;min-width:0}
.wf-lstep__n{font-size:13.5px;font-weight:700;color:var(--txt)}
.wf-lstep__w{font-size:12.5px;color:var(--txt);margin-top:4px;display:flex;flex-wrap:wrap;align-items:center;gap:7px}
.wf-lstep__w select{max-width:280px}
.wf-lstep__st{margin-left:8px;font-size:11px;font-weight:700;padding:1px 8px;border-radius:999px;background:var(--soft);color:var(--muted)}
.wf-lstep__st.is-ok{background:#dcfce7;color:#15803d}
.wf-lstep__st.is-bad{background:#fee2e2;color:#b91c1c}
.wf-lstep__st.is-run{background:#fef3c7;color:#b45309}
.wf-lstep__rec{margin-top:6px;padding:7px 9px;border-radius:8px;background:#fff;border:1px dashed #fdba74;font-size:12px;white-space:pre-wrap}
.wf-lstep__a{flex:none;display:flex;gap:6px;align-items:center}
@media(max-width:760px){.wf-lstep{flex-wrap:wrap}.wf-lstep__a{width:100%;justify-content:flex-end}}
.wfg-lg.koniec{border-color:var(--muted);background:#f3f4f6}
.wfd-nodeinfo{font-size:12.5px;line-height:1.5}
.wfni-h b{font-size:13.5px}
.wfni-desc{margin:6px 0 0;padding-left:18px}
.wfni-desc li{margin:3px 0;color:var(--txt)}
.wfni-raw{margin-top:8px}
.wfni-raw summary{cursor:pointer;color:var(--muted);font-size:11.5px}
.wfni-raw pre{margin:4px 0 0;font-size:11px;background:#f6f6f6;padding:6px 8px;border-radius:6px;overflow:auto;white-space:pre-wrap}
/* edytor grafu */
.btn--danger{color:var(--danger);border-color:#fecaca}
.btn--danger:hover{background:#fef2f2}
.wfd-graph__wrap.is-edit{background:repeating-linear-gradient(45deg,#fff,#fff 10px,#fafbff 10px,#fafbff 20px)}
.wfcond{margin-top:4px}
.wfcond__t{font-size:11.5px;color:var(--muted);margin-bottom:5px}
.wfcond__r{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}
.wfcond__r input,.wfcond__r select{width:100%}
.wf-trlist{margin-top:6px}
.wf-tr{display:flex;align-items:center;gap:8px;padding:6px 9px;border:1px solid var(--line);border-radius:9px;margin-bottom:6px;cursor:pointer;font-size:12.5px;background:#fff}
.wf-tr:hover{border-color:var(--accent);background:var(--accent-soft)}
.wf-tr>span:first-child{flex:1;min-width:0;font-weight:600;color:var(--txt)}
.wf-tr__e{flex:none;color:var(--accent);font-weight:700}
/* warstwa ludzka: decydenci, powiadomienia, terminy */
.wfappr{display:flex;flex-wrap:wrap;gap:6px 14px;padding:4px 0}
.wfappr__o{display:inline-flex;align-items:center;gap:6px;font-size:13px;cursor:pointer}
.wfappr__o input{accent-color:var(--accent)}
.wfappr__auto{display:flex;align-items:baseline;gap:7px;margin:2px 0 8px;padding:7px 9px;border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent);border-radius:7px;cursor:pointer}
.spo-trigbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0 0 10px;padding:9px 13px;border:1px solid color-mix(in srgb,var(--ok,#16a34a) 35%,transparent);background:color-mix(in srgb,var(--ok,#16a34a) 7%,transparent);border-radius:9px;font-size:13px;cursor:pointer}
.spo-trigbar:hover{background:color-mix(in srgb,var(--ok,#16a34a) 12%,transparent)}
.spo-trigbar.is-warn{border-color:color-mix(in srgb,#b45309 40%,transparent);background:color-mix(in srgb,#b45309 8%,transparent)}
.spo-trigbar.is-off{border-color:color-mix(in srgb,var(--danger) 45%,transparent);background:color-mix(in srgb,var(--danger) 9%,transparent)}
.spo-trigbar__t{font-weight:700}
.spo-trigbar__i{color:var(--text,#1f2937)}
.spo-trigbar__go{margin-left:auto;font-weight:600;color:var(--accent);white-space:nowrap}
.wf-unread{display:inline-block;background:var(--danger);color:#fff;font-size:11px;font-weight:700;border-radius:20px;padding:1px 8px;margin-left:4px}
.wf-notifs{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.wf-notif{display:flex;align-items:flex-start;gap:10px;padding:8px 11px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:default}
.wf-notif.is-unread{border-color:var(--accent);background:var(--accent-soft);cursor:pointer}
.wf-notif__b{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.wf-notif__b b{font-size:13px;color:var(--txt)}
.wf-notif__b small{font-size:12px;color:var(--muted)}
.wf-notif__t{flex:none;font-size:11px;color:var(--muted)}
.wf-over{color:var(--danger);font-weight:700}
.wf-mailcfg{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin:2px 0 10px}
.wf-mailcfg select{padding:5px 9px;border:1px solid var(--line-strong);border-radius:8px;font-size:13px}
.wf-mailcfg .cfgsaved{font-size:12px;color:var(--ok)}
/* Centrum budowania — schemat warstw */
.bh-wrap{border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,#fff,#fafbff);padding:10px;margin:4px 0 6px;overflow:auto}
.bh-svg{display:block;width:100%;max-width:680px;height:auto;margin:0 auto}
.bh-nm{font-size:16px;font-weight:700;fill:var(--txt)}
.bh-sub{font-size:11.5px;fill:var(--muted)}
.bh-ico{font-size:19px}
.bh-base{fill:#fff;stroke:var(--line-strong);stroke-width:1.5}
.bh-comp{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1.5}
.bh-edge{stroke:var(--muted);stroke-width:1.6;fill:none}
.bh-lg{font-size:11.5px;fill:var(--muted)}
/* Konsola komend Hermesa (wariant A) */
.hkc-quick{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.hkc-quick .btn{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px}
.hkc-row{display:flex;gap:8px;align-items:center;max-width:680px}
.hkc-row input{flex:1;padding:8px 11px;border:1px solid var(--line-strong);border-radius:9px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px}
.hkc-row input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.hkc-out{margin-top:10px;background:#0f1729;color:#e7e9ee;border-radius:10px;padding:12px 14px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;line-height:1.5;white-space:pre-wrap;overflow:auto;max-height:360px;max-width:880px}
.hkc-meta{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px;max-width:780px;margin:4px 0}
.hkc-mf{display:flex;flex-direction:column;gap:3px}
.hkc-mf span{font-size:11.5px;color:var(--muted);font-weight:600}
.hkc-mf input{padding:6px 9px;border:1px solid var(--line-strong);border-radius:8px;font-size:12.5px;font-family:ui-monospace,Menlo,Consolas,monospace}
.hkc-inst{background:var(--accent-soft);border:1px solid var(--accent);border-radius:10px;padding:9px 12px;font-size:12.5px;line-height:1.5;margin:2px 0 8px;max-width:820px}
.hkc-inst code{background:#fff;padding:1px 5px;border-radius:5px;font-size:12px}
.hkc-inst--top{margin:0 0 14px;font-size:13.5px;border-width:2px}
.hkc-id{margin:6px 0;font-size:14px}
.hkc-proj{background:var(--accent);color:#fff;padding:1px 8px;border-radius:6px}
.hk-more{margin:4px 0 12px;border:1px solid var(--line);border-radius:10px;background:var(--soft)}
.hk-more>summary{cursor:pointer;padding:9px 13px;font-weight:600;font-size:13px;color:var(--muted);list-style:none}
.hk-more>summary::-webkit-details-marker{display:none}
.hk-more>summary::before{content:"▸ "}
.hk-more[open]>summary::before{content:"▾ "}
.hk-morebox{padding:2px 13px 12px}
.ntree{font-size:13px}
.ntgrp{margin-bottom:1px}
.ntgrp__h{display:flex;align-items:center;gap:7px;padding:6px;cursor:pointer;user-select:none;border-radius:8px}
.ntgrp__h:hover{background:var(--soft)}
.ntgrp.is-open>.ntgrp__h .skgroup__chev{transform:rotate(90deg)}
.ntgrp__lab{font-weight:700;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ntgcb{width:15px;height:15px;accent-color:var(--accent);cursor:pointer;flex:none}
.ntgrp__items{display:none;padding:2px 0 6px 18px}
.ntgrp.is-open>.ntgrp__items{display:block}
.ntsubs{padding-left:10px}
.ntitem{display:flex;align-items:flex-start;gap:8px;padding:5px 8px;border-radius:8px;cursor:pointer}
.ntitem:hover{background:var(--accent-soft)}
.ntcb{width:15px;height:15px;margin-top:1px;accent-color:var(--accent);cursor:pointer;flex:none}
.ntico{flex:none;font-size:14px;line-height:1.3}
.ntfico{flex:none;font-size:22px;line-height:1;width:28px;text-align:center;text-decoration:none}
.ntdgrp{margin:2px 0}
.ntdrow{display:flex;align-items:center;gap:8px;padding:4px 6px;border-radius:8px}
.ntdrow--top{margin-top:6px}
.ntdname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ntdsub{margin-left:16px;border-left:2px solid var(--line);padding-left:8px}
.ntdkids{margin-left:16px;border-left:2px solid var(--line);padding-left:8px}
.ntfocus{flex:none;border:none;background:transparent;cursor:pointer;font-size:13px;opacity:.35;padding:0 2px;border-radius:6px;transition:opacity .12s,background .12s}
.ntgrp__h:hover .ntfocus{opacity:.8}
.ntfocus:hover{opacity:1;background:var(--accent-soft)}
.login__err{color:var(--danger);font-size:13px;min-height:16px;margin:8px 0 0;text-align:center;font-weight:500}
.login__forgot{display:block;text-align:center;margin:12px 0 0;font-size:13px;color:var(--muted);text-decoration:none;cursor:pointer}
.login__forgot:hover{color:var(--txt);text-decoration:underline}
.login__hint{color:var(--muted);font-size:12px;margin:2px 0 6px;text-align:center}
.ntmain{display:flex;flex-direction:column;gap:1px;min-width:0}
.ntname{font-weight:600;color:var(--txt);word-break:break-word}
.ntmeta{font-size:11px;color:var(--muted)}
.ntlink{color:var(--accent);font-weight:600;text-decoration:none}
.ntlink:hover{text-decoration:underline}
.ntpdm{background:none;border:0;padding:0;cursor:pointer;font:inherit;font-size:11px}   /* D1: „⬆ podmień" przy pliku — wygląda jak ntlink, nie jak natywny button */
/* ===== ZAKŁADKA „PLIKI" — przestronna przeglądarka (redesign) ===== */
.pliki__bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:4px 0 16px}
.pfolders{display:flex;gap:7px;flex-wrap:wrap;flex:1;min-width:0}
.pfolder{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 14px;font-size:13px;font-weight:600;cursor:pointer;color:var(--txt);display:inline-flex;align-items:center;gap:7px;white-space:nowrap;max-width:230px;overflow:hidden;text-overflow:ellipsis}
.pfolder:hover{background:var(--soft)}
.pfolder.is-active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.pfolder .cnt{color:var(--muted);font-weight:600;font-size:12px}
.pfolder.is-active .cnt{color:var(--accent)}
.pliki__tools{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.pfile__search{border:1px solid var(--line);border-radius:9px;padding:8px 12px;font-size:13px;background:#fff;min-width:190px}
.pfile__search:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.pfile{display:flex;align-items:center;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 15px;margin-bottom:9px;transition:border-color var(--tr,.15s),box-shadow var(--tr,.15s)}
.pfile:hover{border-color:var(--line-strong);box-shadow:var(--sh-sm)}
.pfile--click{cursor:pointer}   /* ergonomia v3: cały wiersz klikalny (otwiera), jedyny przycisk = Edytuj przy Office */
.pfile__ico{flex:none;width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:23px;background:var(--soft)}
.pfile__ico--word{background:#eef2ff}.pfile__ico--excel{background:#e6f7ef}.pfile__ico--pdf{background:#fdeaea}.pfile__ico--ppt{background:#fdf0e6}.pfile__ico--img{background:#eef0f8}.pfile__ico--txt{background:#f1f3f7}.pfile__ico--video{background:#f3ecfd}
.pfile__main{flex:1;min-width:0}
.pfile__name{font-size:15px;font-weight:600;color:var(--txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.pfile__name:hover{color:var(--accent);text-decoration:underline}
.pfile__meta{font-size:12.5px;color:var(--muted);margin-top:3px}
.pfile__acts{flex:none;display:flex;align-items:center;gap:8px}
.pfile__more{border:1px solid var(--line);background:#fff;border-radius:8px;width:36px;height:33px;cursor:pointer;font-size:17px;color:var(--muted);line-height:1;display:flex;align-items:center;justify-content:center}
.pfile__more:hover{background:var(--soft);color:var(--txt)}
.pmenu{position:absolute;z-index:80;min-width:200px;background:var(--panel);border:1px solid var(--line);border-radius:11px;box-shadow:var(--sh-lg,0 10px 30px rgba(15,23,41,.14));padding:6px}
.pmenu__it{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border-radius:8px;font-size:13.5px;color:var(--txt);background:none;border:0;cursor:pointer;text-align:left;text-decoration:none;box-sizing:border-box}
.pmenu__it:hover{background:var(--accent-soft)}
.pmenu__it--danger{color:var(--danger)}
.pmenu__it--danger:hover{background:#fde8e8}
.pliki__empty{padding:34px 20px;text-align:center;color:var(--muted);font-size:14px;border:1px dashed var(--line);border-radius:12px}
.pliki__hint{font-size:12px;margin-top:6px;opacity:.85}
@media(max-width:640px){.pliki__bar{flex-direction:column;align-items:stretch}.pliki__tools{justify-content:space-between}.pfile__search{flex:1}}
.ntempty{font-size:12px;color:var(--muted);padding:4px 8px}
.ntitem--doc{cursor:default}
.ntdrivenote{padding:4px 8px;font-weight:600}
.ntsoon{color:var(--muted);font-weight:400}
.ntscope{margin-top:10px;padding:8px 10px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);background:var(--soft);border-radius:8px}
.ntdrive__bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:4px 8px 8px}
.ntsubh{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700;margin:8px 8px 2px}
.ntopen{cursor:pointer}
.ndetail{font-size:13px}
.ntback{border:none;background:transparent;color:var(--accent);font-weight:600;cursor:pointer;padding:4px 0;font-size:13px}
.ntback:hover{text-decoration:underline}
.ndetail__hd{display:flex;align-items:center;gap:8px;margin:8px 0 2px}
.ndetail__t{margin:0;font-size:15px}
.ndetail__meta{font-size:12px;color:var(--muted);margin-bottom:10px}
.ndetail__drive{margin-bottom:12px}
.ndetail__body{border-top:1px solid var(--line);padding-top:10px}
.ndetail__body .wikicard{font-size:13px;line-height:1.6}
@media(max-width:1100px){.asystent-grid{grid-template-columns:1fr}.skills{position:static;max-height:600px}}

/* TREŚĆ / STRUMIEŃ — znacznik źródła, „bez klienta", picker przypisania, toast */
.srcb{display:inline-block;font-size:12px;color:var(--muted);white-space:nowrap}
.srcb--ff{color:#b45309;font-weight:600}
.muted2{color:var(--muted);font-style:italic}
.assignbox{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
.assignbox .assignsel{padding:4px 8px;border:1px solid var(--line);border-radius:7px;font-size:13px;max-width:220px}
.nstoast{position:fixed;right:18px;bottom:18px;z-index:9999;color:#fff;padding:11px 16px;border-radius:10px;font-weight:600;font-size:13px;box-shadow:var(--shadow);opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s;pointer-events:none;max-width:380px}
.nstoast.show{opacity:1;transform:translateY(0)}

/* NAGRYWANIE EKRANU (etap 2): pasek sterowania w trakcie nagrania + ostrzezenia i pasek postepu w okienkach */
.nagrbar{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:10000;display:flex;align-items:center;gap:10px;background:var(--panel,#fff);border:1px solid var(--line);border-left:4px solid #e24b4a;border-radius:12px;padding:8px 14px;box-shadow:var(--sh-lg,0 10px 30px rgba(15,23,41,.18))}
.nagrbar__dot{width:11px;height:11px;border-radius:50%;background:#e24b4a;flex:none;animation:nagrpuls 1.4s ease-in-out infinite}
.nagrbar__t{font-variant-numeric:tabular-nums;font-weight:700;font-size:16px;color:var(--txt);min-width:52px}
.nagrbar--pauza{border-left-color:#b7791f}
.nagrbar--pauza .nagrbar__dot{background:#b7791f;animation:none}
@keyframes nagrpuls{0%,100%{opacity:1}50%{opacity:.25}}
.nagrbar--czeka{border-left-color:var(--violet);font-size:13.5px;color:var(--txt);max-width:min(92vw,660px)}
.nagrbar--czeka b{white-space:nowrap}
.nagrbar--czeka small{display:block;font-size:11.5px;font-style:normal;margin-top:2px}
.nagrbar--blad{border-left-color:#e24b4a}
.nagrwarn{background:#fef3c7;color:#92400e;border-radius:9px;padding:9px 12px;font-size:13px;line-height:1.45;margin-bottom:9px}
.nagrwarn--info{background:#eef2ff;color:var(--accent-hover)}
.nagrpost{height:8px;border-radius:99px;background:var(--soft,#f1f3f7);overflow:hidden;margin-top:10px}
.nagrpost__bar{height:100%;width:0;border-radius:99px;background:var(--accent,var(--violet));transition:width .2s}
/* checkbox w .addfld: bez tego `.addfld input{width:100%}` rozciaga kwadracik na cala szerokosc (ta sama pulapka co .cgm-o, l. 2041) */
.addfld--cb{flex-direction:row;align-items:center;gap:9px}
.addfld--cb input[type=checkbox]{width:16px;height:16px;flex:0 0 auto;margin:0;padding:0;accent-color:var(--accent,var(--violet))}
.addfld--cb>span{font-size:13.5px;font-weight:500;color:var(--txt)}
/* Wybor dzwieku przed nagraniem: dwa kafelki zamiast malego checkboxa (Pawel przeoczyl kwadracik na tescie 28.07) */
.nagrpicks{display:flex;gap:9px}
.nagrpick{flex:1;display:flex;align-items:center;gap:10px;border:2px solid var(--line);border-radius:11px;padding:10px 12px;cursor:pointer;background:#fff;transition:border-color .15s,background .15s}
.nagrpick:hover{border-color:var(--line-strong)}
.nagrpick.is-on{border-color:var(--accent,var(--violet));background:#f6f2fe}
.nagrpick input[type=radio]{width:16px;height:16px;flex:0 0 auto;margin:0;padding:0;accent-color:var(--accent,var(--violet))}
.nagrpick__ico{font-size:21px;line-height:1}
.nagrpick__t{display:flex;flex-direction:column;min-width:0}
.nagrpick__t b{font-size:13.5px;color:var(--txt)}
.nagrpick__t small{font-size:11.5px;color:var(--muted)}

/* Szukajka na liście (Klienci) */
.listsearch{flex:1;min-width:180px;max-width:340px;padding:7px 11px;border:1px solid var(--line);border-radius:9px;font-size:13px;background:var(--panel)}
.listsearch:focus{outline:none;border-color:var(--accent)}

/* Combobox typeahead (picker przypisania klienta) */
.cpick{position:relative;display:inline-block;min-width:240px;vertical-align:top}
.cpick__in{width:100%;padding:5px 9px;border:1px solid var(--accent);border-radius:8px;font-size:13px}
.cpick__in:focus{outline:none}
.cpick__menu{position:absolute;z-index:50;left:0;right:0;top:calc(100% + 3px);background:var(--panel);border:1px solid var(--line);border-radius:9px;box-shadow:var(--shadow);max-height:280px;overflow:auto}
.cpick__opt{display:flex;flex-direction:column;gap:1px;padding:7px 10px;cursor:pointer;border-bottom:1px solid var(--soft)}
.cpick__opt:hover{background:var(--accent-soft)}
.cpick__opt small{color:var(--muted);font-size:11px}
.cpick__empty{padding:8px 10px;color:var(--muted);font-size:12px}
.cpick__add{color:var(--accent);font-weight:600}

/* Modal „Dodaj klienta" (po NIP / po nazwie) */
/* ⚠️ WARSTWA 1100, NIE 200 (zgłoszenie Pawła 2026-08-13: „chce dodać nowego klienta i wtedy ta
   do wyszukiwania chowa się pod spodem — DRAMAT"). Okno „➕ Dodaj klienta" otwiera się Z WNĘTRZA
   formatki zadania (.modalov = 950) przez picker klienta (.combopop = 1000), więc z-index 200
   malował je POD nimi: użytkownik widział przyciemnienie i nie mógł nic kliknąć. Kolejność warstw:
   .modalov 950 < .combopop 1000 < .acmodal 1100 — okno otwarte NA WIERZCHU zawsze wygrywa. */
.acmodal{position:fixed;inset:0;z-index:1100;background:rgba(16,24,40,.45);display:grid;place-items:start center;padding:48px 16px;overflow:auto}
/* ⚠️ .1242 — ZGŁOSZENIE GRZEGORZA MOTŁOCHA: „tworzyłem wpis w kalendarzu i z tego poziomu od razu
   zadanie; zadanie się utworzyło, wpis też, ale nie utworzyło się powiązanie". [ZMIERZONE] przyczyną
   NIE było samo powiązanie, tylko WARSTWY: formatka zadania (.modalov = 950) otwierana Z WNĘTRZA
   okna kalendarza (.acmodal = 1100) lądowała POD nim — `elementFromPoint` w miejscu formatki
   zwracał `calmodal__r2`, czyli okno kalendarza. Formatka istniała, ale była NIEWIDOCZNA
   i NIEKLIKALNA, więc jedyną drogą było zamknięcie kalendarza — a wtedy wpis zapisywał się
   bez zadania. To ta sama klasa błędu, co zgłoszenie Pawła z 2026-08-13 o „➕ Dodaj klienta"
   („chowa się pod spodem — DRAMAT"), tylko piętro wyżej.
   ZASADA: okno otwarte PÓŹNIEJ jest NA WIERZCHU. `.modalov` wywołany z wnętrza `.acmodal`
   dostaje 1200 — powyżej kalendarza, poniżej pickera klienta (1300), który sam bywa z niego wołany. */
.acmodal ~ .modalov{z-index:1200}
.acmodal ~ .modalov .combopop,
.acmodal ~ .combopop{z-index:1300}
/* Na niskim ekranie (laptop ~768 px wysokości) 48 px pustki u góry to stracony wiersz formularza. */
@media (max-height:820px){.acmodal{padding:16px 16px 24px}}
.acmodal__card{width:100%;max-width:480px;background:var(--panel);border-radius:16px;box-shadow:var(--shadow);padding:18px 20px}
.acmodal__hd{display:flex;justify-content:space-between;align-items:center;font-size:16px;margin-bottom:12px}
.acseg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;margin-bottom:12px}
.acseg__b{border:none;background:var(--panel);padding:7px 16px;font-size:13px;font-weight:600;cursor:pointer;color:var(--muted)}
.acseg__b.is-active{background:var(--accent);color:#fff}
.acsearch{display:flex;gap:8px}
.acsearch .nfinput{flex:1}
.acmodal__hint{font-size:12px;color:var(--muted);margin:8px 0}
.acload{padding:12px;background:var(--soft);border-radius:9px;font-size:13px;color:var(--muted)}
.acerr{padding:10px 12px;background:#fef2f2;border:1px solid #fecaca;border-radius:9px;font-size:13px;color:var(--danger)}
.acsub{font-size:12px;color:var(--muted);margin:6px 0}
.accand{padding:9px 11px;border:1px solid var(--line);border-radius:9px;margin-bottom:7px;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.accand:hover{border-color:var(--accent);background:var(--accent-soft)}
.accand small{color:var(--muted);font-size:11px}
.acconfirm__hd{font-weight:700;font-size:13px;margin-bottom:8px}
.acf{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted);margin-bottom:8px}
.acf .nfinput,.acf .nftext{font-size:13px;color:var(--txt)}
.acconfirm .dl__row{display:flex;justify-content:space-between;gap:10px;padding:3px 0;font-size:12px;border-top:1px solid var(--soft)}
/* 🔴 PRZYCISK ZAPISU MA BYĆ ZAWSZE POD RĘKĄ — zgłoszenie Pawła: „to jak teraz mam zatwierdzić?".
   Okno rośnie od treści (dołożony wiersz, wielu uczestników, lista salek) i pasek akcji zjeżdżał
   pod krawędź ekranu. Samo poszerzenie okna łagodzi objaw — przy dłuższej formatce problem wróci.
   `sticky` przykleja pasek do dołu KARTY, więc widać go niezależnie od ilości treści i wysokości
   ekranu. To jest naprawa przyczyny, poszerzenie jest naprawą wygody. */
.acconfirm__bar{display:flex;align-items:center;gap:10px;margin-top:12px;position:sticky;bottom:-18px;background:var(--panel);padding:12px 0 6px;margin-bottom:-6px;border-top:1px solid var(--line);z-index:2}
.acconfirm__bar .acmsg{flex:1;font-size:12px}

/* Rozwijane okienko podsumowania spotkania */
.sumpanel{border:1px solid var(--line);border-radius:9px;margin-top:8px;overflow:hidden}
.sumpanel__h{display:flex;align-items:center;gap:7px;padding:9px 11px;cursor:pointer;font-weight:600;font-size:13px;background:var(--soft);user-select:none}
.sumpanel__h:hover{background:var(--accent-soft)}
.sumpanel__h .skgroup__chev{transition:transform .15s;color:var(--muted)}
.sumpanel__b{padding:10px 12px;border-top:1px solid var(--line)}
.sumpanel__b .wikicard{font-size:13px;line-height:1.6}

/* ===================== MAGNIFIC — lekkość · gradienty indigo→violet · glassmorphism ===================== */
/* Marki, avatary = gradient */
.brand__mark,.assistant__mark{background:var(--grad);box-shadow:0 6px 16px rgba(124,58,237,.30)}
.userbox__av,.prof__av{background:var(--grad);color:#fff;border:none;box-shadow:0 6px 16px rgba(124,58,237,.24)}
/* Przyciski primary = gradient + miękki lift */
.btn--primary{background:var(--grad);border:none;box-shadow:0 6px 16px rgba(99,102,241,.26)}
.btn--primary:hover{background:var(--grad);box-shadow:0 10px 24px rgba(99,102,241,.36);transform:translateY(-1px)}
.btn--primary:active{transform:translateY(0)}
/* Szklany chrome: sidebar / topbar / dok asystenta */
.sidebar{background:var(--ciemne);border-right:1px solid rgba(255,255,255,.08)}   /* Wariant B: ciemny sidebar — nadpisuje glassmorphism (reszta obszaru zostaje jasna) */
.topbar{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border-bottom:1px solid var(--glass-line)}
.assist{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border-top:1px solid var(--glass-line);box-shadow:0 -10px 40px rgba(79,70,229,.13)}
/* Nawigacja: aktywny element = gradientowa pigułka */
.nav__item{border-radius:10px;transition:background var(--tr),color var(--tr),box-shadow var(--tr)}
.nav__item.is-active{background:var(--grad);color:#fff;box-shadow:0 6px 16px rgba(124,58,237,.30)}
.nav__item.is-active .nav__badge{background:rgba(255,255,255,.22);color:#fff}
.search input{border-radius:11px}
/* KPI = szklane karty, gradientowe liczby, lift na hover */
.kpi{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-line);border-radius:var(--radius-lg);box-shadow:var(--sh-md);transition:transform var(--tr),box-shadow var(--tr)}
.kpi:hover{transform:translateY(-3px);box-shadow:var(--sh-lg)}
.kpi__val{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.kpi--danger .kpi__val{background:none;-webkit-text-fill-color:var(--danger)}
/* Sekcje/karty przeglądu + panel skilli = szkło + powietrze */
.railsec,.pcard,.skills{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-line);border-radius:var(--radius-lg);box-shadow:var(--sh-md)}
/* Plan dnia — translucentne wiersze (bez blur dla płynności) */
.tl__row{background:var(--glass);border:1px solid var(--glass-line);border-radius:14px;box-shadow:var(--sh-sm);transition:transform var(--tr),box-shadow var(--tr)}
.tl__row:hover{transform:translateY(-1px);box-shadow:var(--sh-md)}
.tl__row.now{border-color:transparent;box-shadow:0 0 0 2px rgba(139,92,246,.45),var(--sh-md)}
/* Tabele list = jaśniejsza karta, większe zaokrąglenie, indygo cień; nagłówek z muśnięciem koloru */
.zadtblwrap,.tablewrap{border-radius:var(--radius-lg);border:1px solid var(--glass-line);box-shadow:var(--sh-md);background:rgba(255,255,255,.82)}
th{background:#eef0fb}   /* generyczne tabele (admin/mail) — jasne; listy `.zadtbl th` mają fiolet (reguła wyżej, wyższa specyficzność) */
/* Login = szklana karta na fioletowym tle */
.login{background:
  radial-gradient(1000px 600px at 80% -10%, rgba(196,181,253,.55), transparent 60%),
  radial-gradient(800px 600px at 10% 110%, rgba(165,180,252,.40), transparent 55%),
  var(--bg)}
.login__card{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-line);border-radius:var(--radius-xl);box-shadow:var(--sh-lg)}
/* Zakładki panelu aktywne = gradientowy podkreślnik */
.ptabbtn.is-active{border-bottom-color:transparent;background-image:var(--grad);background-size:100% 2px;background-position:bottom;background-repeat:no-repeat}

/* ===== MAGNIFIC · rozszerzenie na widoki (Asystent / Administracja / Poczta / Kalendarz) ===== */
/* Karty administracji = szkło + lift */
.admin-card{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-line);border-radius:var(--radius-lg);box-shadow:var(--sh-md);transition:transform var(--tr),box-shadow var(--tr)}
.admin-card:hover{transform:translateY(-2px);box-shadow:var(--sh-lg)}
/* Poczta: panele listy/podglądu = szkło; aktywna zakładka folderu = gradient */
.maillist,.mailprev{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-line);border-radius:var(--radius-lg);box-shadow:var(--sh-md)}
.mailtab.is-active{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 4px 12px rgba(124,58,237,.26)}
.mailrow.sel{background:rgba(99,102,241,.10)}
/* Karty integracji / cronów (w szklanym panelu skilli) = lekko translucentne, BEZ blur (wydajność) */
.integr,.cron{background:rgba(255,255,255,.55);border:1px solid var(--glass-line);border-radius:13px;box-shadow:var(--sh-sm)}
/* Sugestie asystenta + karty odpowiedzi = miękki lift */
.asuggest button,.acard{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-line);border-radius:13px;box-shadow:var(--sh-sm);transition:transform var(--tr),box-shadow var(--tr)}
.asuggest button:hover{transform:translateY(-1px);box-shadow:var(--sh-md);color:var(--accent);border-color:var(--glass-line)}
/* Globalny dolny composer = szklany pasek (spójny z dokiem asystenta) */
.gcomposer{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border-top:1px solid var(--glass-line)}
/* Zakładki dashboardu (Spotkania/Zadania · Leady/Projekty · E-mail) = gradientowy podkreślnik */
.dtab.is-active{border-bottom-color:transparent;background-image:var(--grad);background-size:100% 2px;background-position:bottom;background-repeat:no-repeat}
/* Segmenty (zakres zadań / dodawanie klienta) aktywne = gradientowa pigułka (spójne z nawigacją) */
.zadseg{border-radius:11px}
.zadseg__b.is-active,.acseg__b.is-active{background:var(--grad);color:#fff;box-shadow:0 4px 12px rgba(124,58,237,.22)}
.zadseg__b.is-active+.zadseg__b,.zadseg__b.is-active{border-left-color:transparent}

/* ===================== §6 TŁO JASNYCH WIDOKÓW — „AI / tafla wody" (handoff README) ===================== */
/* Warstwa tła CAŁEGO obszaru treści (Dashboard + listy). Aurora na .main, pod nią animowany decor (z-index:-1),
   nad nim treść widoków. Czysto-CSS (transform/opacity). NIE dotyka treści/logiki. Ciemny launcher wyłączony. */
.main{position:relative;isolation:isolate;
  background:
    radial-gradient(720px 460px at 92% -12%, rgba(124,92,252,.28), transparent 58%),
    radial-gradient(640px 480px at -6% 112%, rgba(139,92,246,.20), transparent 60%),
    radial-gradient(520px 360px at 50% 130%, rgba(167,139,250,.18), transparent 62%),
    linear-gradient(180deg,#f7f1e8,#f4eee4)}   /* referencja infografiki: ciepła kremowa baza + monochrom fiolet (bez błękitu) */
.cbg{display:none}   /* Paweł: wyłączone „pływanie" (smugi waterSheen + orbity) — zostaje samo statyczne piaskowe tło (aura na .main). Re-enable: position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden */
.cbg__sheen{position:absolute;left:0;will-change:transform}
.cbg__sheen--1{top:-40%;width:60%;height:180%;background:linear-gradient(105deg,transparent,rgba(124,92,252,.36) 42%,rgba(139,111,251,.5) 50%,rgba(96,101,220,.34) 58%,transparent);filter:blur(30px);animation:waterSheen 14s ease-in-out infinite alternate}
.cbg__sheen--2{top:20%;width:50%;height:120%;background:linear-gradient(105deg,transparent,rgba(124,92,252,.24) 50%,transparent);filter:blur(36px);animation:waterSheen 20s ease-in-out infinite alternate-reverse}
.cbg__orbits{position:absolute;top:-40px;right:-30px;width:340px;height:340px;opacity:.5;animation:orbitA 80s linear infinite}
.cbg__orbits i{position:absolute;border-radius:50%}
.cbg__orbits i:nth-child(1){inset:0;border:1.5px solid rgba(124,92,252,.22)}
.cbg__orbits i:nth-child(2){inset:52px;border:1.5px solid rgba(139,92,246,.18)}
.cbg__orbits i:nth-child(3){inset:118px;border:1.5px solid rgba(167,139,250,.16)}
.cbg__orbits b{position:absolute;left:50%;top:-4px;width:9px;height:9px;margin-left:-4px;border-radius:50%;background:var(--accent-jasny);box-shadow:0 0 14px var(--accent-jasny)}
@keyframes waterSheen{0%{transform:translateX(-30%) translateY(-10%) rotate(8deg)}100%{transform:translateX(60%) translateY(10%) rotate(8deg)}}
@keyframes orbitA{from{transform:rotate(0)}to{transform:rotate(360deg)}}
/* Ciemny launcher: bez aury i bez decoru (kafle mają własne ciemne tło) */
.app.view-launcher .main{background:none}
.app.view-launcher .cbg{display:none}
@media (prefers-reduced-motion:reduce){.cbg__sheen,.cbg__orbits{animation:none}}
/* Karty tabel/list na tafli: mocniejsze szkło + cienki gradientowy pasek u góry */
.zadtblwrap,.tablewrap{position:relative;background:rgba(255,255,255,.66);-webkit-backdrop-filter:saturate(165%) blur(13px);backdrop-filter:saturate(165%) blur(13px);border:1px solid rgba(255,255,255,.5);border-radius:16px;box-shadow:0 12px 34px rgba(70,50,160,.10),0 1px 3px rgba(40,30,90,.05)}
.zadtblwrap::before,.tablewrap::before,.maillist::before,.mailprev::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent-hover),var(--accent) 45%,var(--accent-jasny));z-index:1;pointer-events:none}
.maillist,.mailprev{position:relative}
/* cfg-listy: zewnętrzny .tablewrap opakowuje realną kartę .zadtblwrap → zneutralizuj (bez podwójnej karty/paska) */
.tablewrap:has(.zadtblwrap){background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border:none;box-shadow:none;border-radius:0}   /* potomek (nie tylko bezpośredni) — Projekty zagnieżdża .zadtblwrap w #vProjektyList; bez tego podwójne szkło */
.tablewrap:has(.zadtblwrap)::before{display:none}
/* mobilne karty (lista renderowana jako karty) — kontener bez chrome/paska (kartami są .mcard) */
.zadtblwrap.mcardwrap{background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border:none;box-shadow:none;border-radius:0}
.zadtblwrap.mcardwrap::before{display:none}

/* ===================== KALENDARZ (moduł spotkań) ===================== */
#vKalendarz{flex:1 1 auto;min-height:0;display:flex;overflow:hidden}
.cal{flex:1;min-height:0;display:grid;grid-template-columns:248px 1fr;gap:18px;overflow:hidden}
@media(max-width:1080px){#vKalendarz{overflow:auto}.cal{grid-template-columns:1fr;overflow:visible}}
.calrail{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-line);border-radius:var(--radius-lg);box-shadow:var(--sh-md);padding:14px;display:flex;flex-direction:column;gap:9px;overflow:auto}
.calnew{width:100%;justify-content:center}
.calrail__sec{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:700;margin-top:4px}
.ccal{display:flex;align-items:center;gap:9px;padding:5px 6px;border-radius:9px;cursor:pointer;font-size:13px;font-weight:600;color:var(--txt);user-select:none}
.ccal:hover{background:var(--soft)}
.ccal input{display:none}
.ccal__dot{width:15px;height:15px;border-radius:5px;background:var(--cc);flex:none;border:0;padding:0;cursor:pointer;box-shadow:inset 0 0 0 2px rgba(255,255,255,.55)}
.ccal__dot:hover{box-shadow:inset 0 0 0 2px rgba(255,255,255,.55),0 0 0 2px var(--cc)}
.ccal.is-hidden .ccal__dot{background:transparent;box-shadow:inset 0 0 0 2px var(--cc)}
.ccal.is-hidden .ccal__n{color:var(--muted)}
.ccal__n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;cursor:pointer}
.calcpick{padding:10px;width:210px}
.calcpick__t{font-size:12px;font-weight:700;color:var(--muted);margin-bottom:8px}
.calcpick__grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.calcpick__sw{width:20px;height:20px;border-radius:6px;border:0;cursor:pointer;padding:0;box-shadow:inset 0 0 0 2px rgba(255,255,255,.5)}
.calcpick__sw:hover{transform:scale(1.12)}
.calcpick__sw.is-on{outline:2px solid var(--txt);outline-offset:1px}
.calcpick__row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.calcpick__custom{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);cursor:pointer}
.calcpick__custom input[type=color]{width:26px;height:22px;border:1px solid var(--line);border-radius:6px;padding:0;background:none;cursor:pointer}
.calrail__tz{margin-top:auto;font-size:11px;color:var(--muted);padding-top:6px}
/* ⚠️ `margin-top:6px` bylo dobre, gdy mini-kalendarz stal na DOLE kolumny. Od `.1255` stoi na
   GORZE (zgloszenie Stefana), wiec odstep nalezy sie POD nim — inaczej przykleja sie do przycisku
   „＋ Nowe zdarzenie". Kreska oddziela wybor DNIA od reszty sterowania. */
.cmini{margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.cmini__hd{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:700;margin-bottom:6px}
.cmini__nav{border:none;background:transparent;cursor:pointer;color:var(--muted);font-size:16px;border-radius:6px;width:22px;height:22px;line-height:1}
.cmini__nav:hover{background:var(--soft);color:var(--accent)}
.cmini__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;text-align:center}
.cmini__dow{font-size:10px;color:var(--muted);font-weight:700;padding:2px 0}
.cmini__d{font-size:11px;padding:4px 0;border-radius:6px;cursor:pointer}
.cmini__d:hover{background:var(--soft)}
.cmini__d.oth{color:var(--line-strong)}
.cmini__d.today{color:#fff;background:var(--grad);font-weight:700}
.cmini__d.sel:not(.today){box-shadow:inset 0 0 0 2px var(--accent);font-weight:700}
.calmain{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-line);border-radius:var(--radius-lg);box-shadow:var(--sh-md);overflow:hidden}
.caltop{display:flex;align-items:center;gap:8px;padding:11px 14px;border-bottom:1px solid var(--line);flex:none}
.calt__nav{font-size:18px}
.caltop__lab{font-size:16px;font-weight:800;margin-left:4px}
.calseg{margin-left:auto;display:inline-flex;border:1px solid var(--line);border-radius:11px;overflow:hidden}
.calvb{border:none;background:#fff;padding:7px 14px;font-size:13px;font-weight:600;cursor:pointer;color:var(--muted)}
.calvb+.calvb{border-left:1px solid var(--line)}
.calvb.is-active{background:var(--grad);color:#fff}
.calgrid{display:flex;flex-direction:column;min-height:0;flex:1}
.calgrid__hd{display:flex;flex:none;border-bottom:1px solid var(--line)}
.calgutter__sp{width:56px;flex:none}
.calhd{flex:1;text-align:center;padding:7px 4px;border-left:1px solid var(--line)}
.calhd__dow{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700}
.calhd__d{display:inline-grid;place-items:center;min-width:30px;height:30px;font-size:16px;font-weight:800;margin-top:2px}
.calhd.is-today .calhd__d{background:var(--grad);color:#fff;border-radius:50%}
.calad{display:flex;flex:none;border-bottom:1px solid var(--line);background:rgba(99,102,241,.045)}
.calad__lab{width:56px;flex:none;font-size:11px;color:var(--muted);padding:5px;text-align:right;text-transform:uppercase;letter-spacing:.3px}
.calad__cell{flex:1;border-left:1px solid var(--line);padding:3px;min-height:24px;display:flex;flex-direction:column;gap:2px}
.calad__ev{font-size:12.5px;font-weight:600;padding:2px 7px;border-radius:6px;background-color:var(--evc);background-image:linear-gradient(rgba(255,255,255,.78),rgba(255,255,255,.78));border-left:3px solid var(--evc);color:#1f2937;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.calgrid__body{flex:1;overflow-y:auto;display:flex;position:relative}
.calgutter{width:56px;flex:none}
.calhr{position:relative;border-top:1px solid var(--line)}
.calhr span{position:absolute;top:-8px;right:8px;font-size:12.5px;font-weight:600;color:var(--muted)}   /* .1315: godziny po lewej byly nieczytelne (10px) */
.calcol{flex:1;position:relative;border-left:1px solid var(--line)}
.calline{position:absolute;left:0;right:0;border-top:1px solid var(--soft)}
.calnow{position:absolute;left:0;right:0;border-top:2px solid #ef4444;z-index:5}
.calnow::before{content:"";position:absolute;left:-4px;top:-4px;width:7px;height:7px;border-radius:50%;background:#ef4444}
.calev{position:absolute;border-radius:8px;padding:5px 9px;font-size:13px;line-height:1.3;overflow:hidden;cursor:pointer;background-color:var(--evc);background-image:linear-gradient(rgba(255,255,255,.80),rgba(255,255,255,.80));border-left:3px solid var(--evc);color:#1f2937;box-shadow:var(--sh-sm);transition:box-shadow var(--tr),transform var(--tr)}
.calev:hover{box-shadow:var(--sh-md);z-index:6;transform:translateY(-1px)}
.calev__h{font-weight:800;color:var(--evc)}
.calev__t{font-weight:600}   /* .1318: powrot do rozmiaru z .calev (13 px) — 14 px rozpychalo kafelki */
.calev__s{display:block;font-size:11.5px;font-weight:600;color:var(--txt);   /* .1319 (Pawel: „mocniejszy kolor, moze czarny”): druga linia byla szara jak podpis, a niesie salke, klienta i numer zadania */overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.calmonth{display:flex;flex-direction:column;flex:1;min-height:0}
.calmonth__hd{display:grid;grid-template-columns:repeat(7,1fr);flex:none;border-bottom:1px solid var(--line)}
.calmh{padding:7px;text-align:center;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700}
.calmonth__grid{display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:1fr;flex:1;min-height:0;overflow-y:auto}
.calmc{border-left:1px solid var(--line);border-top:1px solid var(--line);padding:4px 5px;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;gap:2px;min-height:84px}
.calmc:hover{background:rgba(99,102,241,.04)}
.calmc.oth{background:rgba(15,23,41,.015)}
.calmc.oth .calmc__d{color:var(--line-strong)}
.calmc__d{font-size:12px;font-weight:700;align-self:flex-start;min-width:22px;height:22px;display:grid;place-items:center;border-radius:50%}
.calmc.is-today .calmc__d{background:var(--grad);color:#fff}
.calchip{font-size:11px;padding:1px 6px;border-radius:5px;background-color:var(--evc);background-image:linear-gradient(rgba(255,255,255,.80),rgba(255,255,255,.80));border-left:3px solid var(--evc);color:#1f2937;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.calchip b{color:var(--evc)}
.calmore{font-size:10.5px;color:var(--muted);font-weight:600;cursor:pointer;padding:0 4px}
.calmore:hover{color:var(--accent)}
.cpop{width:340px;max-width:92vw;padding:0 16px 14px}
.cpop__bar{height:6px;margin:0 -16px 12px}
.cpop__x{position:absolute;top:9px;right:9px;border:none;background:transparent;cursor:pointer;font-size:13px;color:var(--muted);border-radius:6px;width:24px;height:24px}
.cpop__x:hover{background:var(--soft);color:var(--txt)}
.cpop__t{margin:2px 0 10px;font-size:16px;padding-right:24px}
.cpop__row{font-size:13px;color:var(--txt);margin:6px 0;display:flex;gap:7px;align-items:flex-start}
.cpop__int{color:var(--muted)}
.cpop__sec{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700;margin:11px 0 6px;border-top:1px solid var(--line);padding-top:9px}
.cpop__u{display:flex;align-items:center;gap:8px;font-size:13px;margin:5px 0}
.cpop__av{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:10px;font-weight:700;flex:none}
.cpop__org{font-size:11px;color:var(--muted);font-weight:600}
.cpop__op{font-size:13px;color:#374151;margin-top:10px;padding-top:9px;border-top:1px solid var(--line);line-height:1.5}
.cpop__foot{margin-top:11px;padding-top:9px;border-top:1px solid var(--line);display:flex;gap:7px}
.cpop__rsvp{display:flex;gap:6px;margin:0 0 10px}
.rsvpb{flex:1;border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 4px;font-size:13px;font-weight:600;cursor:pointer;color:var(--muted);transition:all var(--tr)}
.rsvpb:hover{border-color:var(--accent);color:var(--accent)}
.rsvpb--tak.is-on{background:#15a05a;border-color:#15a05a;color:#fff}
.rsvpb--moze.is-on{background:#d97706;border-color:#d97706;color:#fff}
.rsvpb--nie.is-on{background:#dc2626;border-color:#dc2626;color:#fff}
.cpop__u{justify-content:flex-start}
.cpop__un{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rsvp{font-size:11px;font-weight:700;padding:1px 8px;border-radius:999px;white-space:nowrap;flex:none}
.rsvp--y{background:#f0fdf4;color:#15803d}
.rsvp--m{background:#fffbeb;color:#b45309}
.rsvp--n{background:#fef2f2;color:#b91c1c}
.rsvp--c{background:var(--soft);color:var(--muted)}
.cffind{width:100%;justify-content:center;margin-bottom:11px;color:var(--accent);border-color:var(--accent-soft);background:var(--accent-soft)}
.cffind:hover{background:var(--grad);color:#fff;border-color:transparent}
.cfslots{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:11px}
.cfslots:empty{display:none}
.cfslots__h{flex-basis:100%;font-size:12px;color:var(--muted);font-weight:600}
.cfslot{border:1px solid var(--accent);background:#fff;color:var(--accent);border-radius:8px;padding:4px 11px;font-size:13px;font-weight:600;cursor:pointer}
.cfslot:hover{background:var(--grad);color:#fff;border-color:transparent}
/* ===== EDYTOR ROLI — dluga formatka z WLASNYM przewijaniem i przyklejonym paskiem zapisu =====
   Zgloszenie Pawla 2026-08-10: "nawet na dol nie moge zejsc do zapisania ustawien". Lista modulow
   urosla do 24 pozycji w 7 grupach; przycisk "Zapisz" na koncu dlugiej tresci = formularz, ktorego
   NIE DA SIE zapisac. Naglowek i pasek akcji stoja, przewija sie WYLACZNIE srodek. */
.rolemodal{display:flex;flex-direction:column;max-height:min(88vh,880px);padding-bottom:0}
.rolemodal__body{overflow:auto;flex:1;min-height:0;padding-right:4px;margin-right:-4px}
.rolemodal__bar{position:sticky;bottom:0;background:var(--panel);border-top:1px solid var(--soft);
  margin:0 -20px;padding:12px 20px;border-radius:0 0 16px 16px}
/* Siatka modulow: STALA kolumna kontrolki, zeby przelaczniki tworzyly rowna os, a nie schodki. */
.rolegrid{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;margin-top:8px}
.rolehd{grid-column:1/-1;margin:14px 0 4px;font-size:10.5px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--soft);padding-bottom:4px}
.rolehd:first-child{margin-top:2px}
.rolerow{display:grid;grid-template-columns:1fr 112px;align-items:center;gap:10px;
  font-size:13px;font-weight:400;padding:3px 0;min-height:30px}
.rolerow__n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--txt)}
.rolerow__s{width:112px;box-sizing:border-box;border:1px solid var(--line);border-radius:8px;
  padding:4px 8px;font:inherit;font-size:12px;background:#fff;color:var(--txt);cursor:pointer}
.rolerow__s:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.rolerow:hover .rolerow__s{border-color:var(--accent)}
/* Modul, o ktorym rola NIE decyduje (dostaje go kazdy zalogowany): pokazany, ale bez przelacznika
   i z podanym powodem. Samo pominiecie wygladalo jak brak/przeoczenie — pytanie Pawla o "Apki". */
.rolerow--info .rolerow__n{color:var(--muted)}
.rolerow__i{font-size:11.5px;color:var(--muted);text-align:center;border:1px dashed var(--line);
  border-radius:8px;padding:3px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:640px){.rolegrid{grid-template-columns:1fr}}

/* Formularz nowego/edycji zdarzenia (Faza 2) */
/* 680, NIE 540. Paweł 2026-08-18 prosił o SZERSZĄ formatkę, a ja ją WYDŁUŻYŁEM — przez co przycisk
   zapisu uciekł pod dolną krawędź ekranu. Szerzej = mniej wierszy = mniej przewijania. */
/* KARTA EDYCJI WPISU — szersza i wyzsza (zgloszenie Pawla 2026-08-19: „karta edycji wpisu troche
   wieksza"). 680 -> 840 px; przy nizszych ekranach okno i tak przewija sie w srodku, wiec zysk
   idzie w pola, nie w przewijanie. */
.calmodal__card{max-width:840px}
/* .1138: 48 px oddechu nad i pod oknem to na formatce zdarzenia czysta strata — okno i tak jest
   najwyzsze w aplikacji. 24 px wystarcza, zeby nie kleilo sie do krawedzi, i oddaje 48 px tresci. */
.calmodal{padding:24px 16px}
.calmodal__card .cfgrow{margin-bottom:11px}
.calmodal__card .cfgrow>label{font-size:12px;color:var(--muted);font-weight:600;margin-bottom:4px;display:block}
.calmodal__card .nfinput,.calmodal__card .nftext{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:9px;padding:8px 11px;font:inherit;font-size:14px;background:#fff;color:var(--txt)}
.calmodal__card .nftext{resize:vertical;line-height:1.5}
.calmodal__card .nfinput:focus,.calmodal__card .nftext:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.calmodal__card .cfgrow--chk{display:flex;flex-direction:row;align-items:center;gap:8px}
.calmodal__card .cfgrow--chk>label{margin:0}
.calmodal__card .cfgrow--chk input{width:17px;height:17px;accent-color:var(--accent)}
.calmodal__when,.calmodal__r2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.calmodal__dt{display:flex;gap:7px}
.calmodal__dt .nfinput{flex:1;min-width:0}
.calmodal__dt .cfTime{max-width:104px;flex:none}
.calmodal__opts{display:flex;flex-wrap:wrap;gap:7px 16px;padding:9px 11px;background:var(--soft);border:1px solid var(--line);border-radius:9px;max-height:128px;overflow:auto}
.calmodal__cb{display:inline-flex;align-items:center;gap:6px;font-size:13px;cursor:pointer;font-weight:600;color:var(--txt)}
.calmodal__cb input{width:15px;height:15px;accent-color:var(--accent)}
.calmodal__cb small{color:var(--muted);font-weight:400}
/* Formularz zdarzenia — rozwijane listy (uczestnicy/sale) + tryb miejsca */
.cfdrop{border:1px solid var(--line);border-radius:9px;background:#fff;overflow:hidden}
.cfdrop>summary{cursor:pointer;list-style:none;padding:9px 11px;font-size:13px;font-weight:600;color:var(--txt);user-select:none}
.cfdrop>summary::-webkit-details-marker{display:none}
.cfdrop>summary::before{content:"▸ ";color:var(--muted)}
.cfdrop[open]>summary::before{content:"▾ "}
.cfdrop__list{display:flex;flex-direction:column;gap:8px;padding:4px 11px 11px;max-height:170px;overflow:auto;border-top:1px solid var(--line)}
.cfsale{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.calmodal__card .nfseg{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:0}
.calmodal__dot{width:11px;height:11px;border-radius:4px;flex:none}
/* KOLIZJA TERMINU POD DATAMI (.1253, zgloszenie Stefana Ocetkiewicza) — „czerwony napis, ze podany
   zakres dat koliduje z jakims innym zdarzeniem". Nie blokuje zapisu: to OSTRZEZENIE, bo nakladajace
   sie wpisy bywaja swiadome (np. „cały dzień" konferencja + krotkie spotkanie w srodku). */
.cfkonf{margin:-2px 16px 10px;padding:8px 11px;border:1px solid #fecaca;background:#fef2f2;border-radius:9px;color:#b91c1c;font-size:12.5px;line-height:1.5}
.cfkonf[hidden]{display:none}
.cfkonf ul{margin:4px 0 4px 2px;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px}
.cfkonf small{color:#9f1239;opacity:.85}
.cfkonf__l{background:none;border:none;padding:0;font:inherit;color:#b91c1c;text-decoration:underline;cursor:pointer}
.cfkonf__l:hover{color:#7f1d1d}
.cfkonf__kto{opacity:.8}
.cfavail{margin-top:6px;display:flex;flex-direction:column;gap:4px}
.cfavail:empty{display:none}
.cfa{font-size:12px;padding:5px 9px;border-radius:8px;line-height:1.45}
.cfa--ok{background:#f0fdf4;color:#15803d;border:1px solid #dcfce7}
.cfa--bad{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}
.cfa--warn{background:#fffbeb;color:#b45309;border:1px solid #fde68a}
.cfa__sug{display:inline-flex;flex-wrap:wrap;gap:5px;margin-left:4px;align-items:center}
.cfa__sugb{border:1px solid var(--accent);background:var(--accent-soft);color:var(--accent);border-radius:7px;padding:1px 9px;font-size:12px;font-weight:600;cursor:pointer}
.cfa__sugb:hover{background:var(--grad);color:#fff;border-color:transparent}
.cfa__none{color:var(--muted);font-style:italic;margin-left:4px}

/* ===== CZAT natywny ===== */
.czat-split{display:grid;grid-template-columns:300px 1fr;gap:14px;height:calc(100vh - 150px);min-height:420px}
@media(max-width:760px){.czat-split{grid-template-columns:1fr;height:auto}}
.czat-contacts{border:1px solid var(--line);border-radius:12px;overflow-y:auto;background:var(--card)}
.czat-c{display:flex;align-items:center;gap:10px;padding:9px 11px;border-bottom:1px solid var(--line);cursor:pointer}
.czat-c:hover{background:var(--accent-soft)}
.czat-c.is-sel{background:var(--accent-soft)}
.czat-c__m{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.czat-c__m b{font-size:13px}
.czat-c__m small{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.czat-av{position:relative;width:36px;height:36px;flex:0 0 36px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px}
.czat-av.sm{width:30px;height:30px;flex-basis:30px;font-size:12px}
.czat-dot{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;border:2px solid var(--card)}
.czat-dot.on{background:#1D9E75}
.czat-dot.off{background:#c0392b}
.czat-unread{background:var(--grad);color:#fff;border-radius:10px;min-width:18px;height:18px;padding:0 5px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.czat-conv{border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;background:var(--card);overflow:hidden}
.czat-conv__h{display:flex;align-items:center;gap:9px;padding:10px 13px;border-bottom:1px solid var(--line)}
.czat-conv__h small{margin-left:auto}
.czat-empty{margin:auto;color:var(--muted);padding:30px;text-align:center}
.czat-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:7px}
/* ⚠️ PASEK Z DNIEM USUNIETY (.1250). Wersja .1247 wstawiala miedzy wiadomosci przyklejona „pigulke"
   z dniem — przy przewijaniu paski NACHODZILY NA SIEBIE i robil sie nieczytelny bigos
   („piate Dzis pnia" na zrzucie Pawla). Decyzja Pawla: data stoi PRZY KAZDYM WPISIE, obok godziny
   (`.czat-b__c`), w formacie `24.08.2026 - 13:25`. Prosciej i bez nakladania. */
.czat-b{max-width:72%;align-self:flex-start;background:var(--card,#fff);color:var(--txt,#1d2333);border:1px solid var(--line);border-radius:12px;border-bottom-left-radius:3px;padding:7px 11px}   /* FIX 2026-07-02: było var(--bg2,#1c1c28) — motyw NIE definiuje --bg2, wchodził CIEMNY fallback = czarne dymki z czarnym tekstem */
.czat-b.me{align-self:flex-end;background:var(--grad,var(--accent,var(--accent)));color:#fff;border-color:transparent;border-radius:12px;border-bottom-right-radius:3px}   /* 2026-07-02: moje = wypełniony akcent + biały tekst (accent-soft zlewał się z tłem — strony rozmowy były nieodróżnialne) */
.czat-b__t{display:block;font-size:13px;white-space:pre-wrap;word-break:break-word}
.czat-b__c{display:block;text-align:right;color:var(--muted);font-size:10px;margin-top:2px}
.czat-input{display:flex;gap:10px;align-items:flex-end;padding:14px 16px;border-top:2px solid var(--accent);background:var(--accent-soft)}
.czat-input input[type=text],.czat-input input:not([type]){flex:1;min-width:0}
.czat-ta{flex:1;min-width:0;min-height:48px;max-height:140px;resize:none;font-family:inherit;font-size:14.5px;line-height:1.45;padding:12px 14px;border:2px solid var(--accent);border-radius:12px;background:var(--card);color:inherit;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.czat-ta::placeholder{color:var(--muted)}
.czat-ta:focus{outline:none;box-shadow:0 0 0 3px var(--accent-soft),0 1px 3px rgba(0,0,0,.06)}
.czat-send{align-self:stretch;min-height:48px;padding:0 22px;font-size:14px;font-weight:700}
.czat-clip-btn{align-self:center;font-size:20px;line-height:1}
/* ===== PASEK FILTRÓW (wzór Airtable) — pigułki, spójna wysokość, czysto ===== */
.fbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px;padding:9px 10px;background:var(--card);border:1px solid var(--line);border-radius:12px}
.fbar__lbl{font-size:12px;font-weight:600;color:var(--muted);display:inline-flex;align-items:center;gap:5px;padding-left:2px}
.fbar__sp{flex:1}
.fpill{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border:1px solid var(--line);border-radius:9px;background:transparent;color:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:border-color .12s,background .12s}
.fpill:hover{border-color:var(--accent)}
.fpill.is-on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.fpill .fchev{opacity:.45;font-size:10px;margin-left:1px}
/* PASEK KART PRACY — porzadkowanie .950 (zgloszenie Pawla: „balagan przyciskow, wszystko rozstrzelone").
   TRZY GATUNKI KONTROLEK MAJA TERAZ TRZY WYGLADY, bo wczesniej filtr, tryb i akcja byly identyczna pigulka:
     .fmc   = przelacznik miesiaca (jedna kontrolka zamiast dwoch dat + dwoch przyciskow),
     .fchip = WLACZONY filtr z krzyzykiem (filtr wylaczony nie zajmuje juz miejsca — chowa sie pod „+ filtr"),
     .fpill.is-on (wypelniony) = TRYB, w ktorym jestes; .fico = akcja (ikona po prawej). */
.fmc{display:inline-flex;align-items:center;gap:2px;height:34px;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.fmc button{height:32px;border:0;background:transparent;color:inherit;font:inherit;font-size:13px;font-weight:600;cursor:pointer;padding:0 9px;white-space:nowrap}
.fmc button:hover{background:var(--accent-soft);color:var(--accent)}
.fmc .fmc__t{min-width:118px;text-align:center;font-weight:700}
.fchip{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 10px;border:1px solid var(--accent);border-radius:9px;background:var(--accent-soft);color:var(--accent);font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;font-family:inherit}
.fchip i{font-style:normal;opacity:.6;font-size:12px}
.fchip:hover i{opacity:1}
.fbar__sep{width:1px;height:22px;background:var(--line);margin:0 2px}
.fpill--tryb.is-on{background:var(--accent);border-color:var(--accent);color:#fff}
.fico{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid var(--line);border-radius:9px;background:transparent;color:var(--muted);font-size:15px;cursor:pointer;font-family:inherit}
.fico:hover{border-color:var(--accent);color:var(--accent)}
.fdate{height:34px;padding:0 10px;border:1px solid var(--line);border-radius:9px;background:var(--card);color:inherit;font-size:13px;font-family:inherit}
.fdate:focus{outline:none;border-color:var(--accent)}
.fpop{position:fixed;z-index:600;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 36px rgba(0,0,0,.22);min-width:256px;padding:8px;font-size:13px}
.fpop__o{display:flex;gap:9px;align-items:center;padding:7px 9px;border-radius:8px;cursor:pointer}
.fpop__o:hover{background:var(--accent-soft)}
.fpop__ft{display:flex;gap:6px;margin-top:6px;border-top:1px solid var(--line);padding-top:8px}
/* ===== PODSUMOWANIE KART (środek między filtrami a tabelą) — czysty pasek statystyk ===== */
.ksum{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 10px;padding:10px 14px;border:1px solid var(--line);border-radius:12px}
.ksum__l{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.ksum__r{display:flex;align-items:center;gap:8px}
.kstat{font-size:13px;color:var(--muted)}
.kstat b{font-size:16px;color:inherit}
.kstat--h b{color:var(--accent)}
.kchip{font-size:12px;color:var(--muted);background:var(--accent-soft);border-radius:20px;padding:3px 10px;font-weight:500}
.ksum__wyk{font-size:12px;color:var(--muted);margin:-2px 2px 12px;display:flex;gap:7px;flex-wrap:wrap;align-items:center}
/* ===== BADGE WERSJI (topbar) — zielony=aktualna, czerwony=nieaktualna ===== */
.verbadge{font-size:11px;font-weight:800;padding:3px 9px;border-radius:20px;letter-spacing:.2px;cursor:pointer;white-space:nowrap;border:1px solid transparent}
.verbadge:empty{display:none}
.verbadge.ok{background:rgba(22,163,74,.14);color:#16a34a;border-color:rgba(22,163,74,.3)}
.verbadge.stale{background:rgba(220,38,38,.16);color:#dc2626;border-color:rgba(220,38,38,.4)}
.czat-file{display:inline-flex;align-items:center;gap:3px;font-size:12.5px;font-weight:600;color:var(--accent);text-decoration:none;padding:3px 0;border-bottom:1px solid transparent}
.czat-file:hover{border-bottom-color:var(--accent)}
.czat-b.me .czat-file{color:var(--accent)}
.czat-fwrap{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.czat-fcrm{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:6px;font-size:11px;padding:1px 7px;cursor:pointer}
.czat-fcrm:hover{border-color:var(--accent);color:var(--accent)}
.czp-list{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.modalov.czatpl .modalbox{max-width:480px}
/* ROZLICZENIA E5 — tabela raportu miesięcznego */
.raptbl{border-collapse:collapse}
.raptbl th,.raptbl td{border-bottom:1px solid var(--line,#e5e7eb);padding:5px 8px;text-align:left;vertical-align:top}
.raptbl thead th{font-weight:600;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.03em}
.raptbl tbody tr:hover{background:var(--hover,rgba(0,0,0,.03))}
/* Spotkania → kolumna Proces: „coś się właśnie tworzy" (krok workflow wykonywany teraz) */
.spo-working{display:inline-block;padding:2px 8px;border-radius:999px;background:#fef3c7;color:#92400e;font-size:11px;font-weight:600;animation:spoPulse 1.4s ease-in-out infinite}
@keyframes spoPulse{0%,100%{opacity:1}50%{opacity:.45}}
.spo-queued{display:inline-block;padding:2px 8px;border-radius:999px;background:#e6f1fb;color:#185fa5;font-size:11px;font-weight:600;animation:spoPulse 2.2s ease-in-out infinite}
/* Edytor harmonogramu crona — duży, czytelny builder (co ile · okno godzin · dni) */
.ce__big{display:flex;flex-direction:column;gap:10px;margin:8px 0;padding:12px 14px;background:var(--bg2,#f6f6fb);border:1px solid var(--line,#e5e7eb);border-radius:12px}
.ce__big .ce__row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14.5px}
.ce__big .ce__lab{font-weight:700;min-width:118px;display:inline-flex;align-items:center;gap:5px}
.ce__big input[type=number]{width:66px;font-size:15px;padding:6px 8px;border:1px solid var(--line,#d1d5db);border-radius:8px}
.ce__big select{font-size:15px;padding:6px 8px;border:1px solid var(--line,#d1d5db);border-radius:8px;background:#fff}
.ce__big label{display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.ce [hidden]{display:none!important}   /* tryb int/daily — ukrywanie ma działać mimo reguł display na .ce__int/.ce__daily */

/* ===== DZWONEK POWIADOMIEŃ (wnioski o dostęp do haseł + workflow) ===== */
.topbar__actions{position:relative}
.notifbadge{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:var(--danger,#dc2626);color:#fff;font-size:10px;font-weight:800;line-height:16px;text-align:center;box-shadow:0 0 0 2px var(--panel,#fff)}
.notifbadge[hidden]{display:none}
.notifpanel{position:absolute;top:calc(100% + 8px);right:0;width:360px;max-height:70vh;overflow:auto;background:var(--panel,#fff);border:1px solid var(--line,#e7e9ee);border-radius:12px;box-shadow:0 12px 32px rgba(15,23,41,.16);z-index:120;padding:6px}
.notifpanel[hidden]{display:none}
/* .626: watek korespondencji mailowej na karcie zadania (oba kierunki, jak przy Zoho) */
.mailwatek{margin:6px 0 10px;max-height:230px;overflow:auto;border:1px solid var(--line,#e6e6ef);border-radius:8px;background:var(--bg,#f6f6fb)}
.mailwatek__i{padding:7px 10px;border-bottom:1px solid var(--line,#e6e6ef);font-size:12.5px}
.mailwatek__i:last-child{border-bottom:0}
.mailwatek__i.is-out{background:var(--accent-soft,#eef2ff)}
.mailwatek__h{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.mailwatek__t{color:var(--muted,#697586);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mailwatek__hd{cursor:pointer}                                  /* .666: cala pozycja watku klikalna -> tresc on-demand */
.mailwatek__hd:hover{background:rgba(0,0,0,.03)}
.mailwatek__hd:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:6px}
.mailwatek__ch{display:inline-block;width:11px;color:var(--muted,#697586);font-size:11px}
.mailwatek__b{margin-top:6px;padding-top:6px;border-top:1px dashed var(--line,#e6e6ef)}
.mailwatek__tx{white-space:pre-wrap;max-height:240px;overflow:auto;font-size:12.5px;line-height:1.5;color:var(--txt)}
.mailwatek:has(.mailwatek__b:not([hidden])){max-height:520px}
/* .1368: naglowek ROZMOWY — pokazuje sie TYLKO gdy do zadania przypieto wiecej niz jedna korespondencje
   (zgloszenie Pawla: przy kilku watkach wiadomosci zlewaly sie w jedna liste po dacie). Przy jednym
   watku wyglad zostaje bez zmian — dlatego nie ma tu zadnych marginesow "na zapas". */
.mailwatek__grp{display:flex;justify-content:space-between;gap:8px;align-items:baseline;margin:10px 0 -4px;font-size:12px;font-weight:700;color:var(--muted,#697586)}
.mailwatek__grp .mailwatek__gt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ADR-0021 AKTYWNOSC rekordu — wzorowane na .mailwatek, ale z liczba porzadkowa i kolumna "kto".
   ⚠️ OSOBNE klasy, NIE rozszerzenie .tl__row: tamta jest stylowana dwa razy (tu i w motywie) i zyje
   takze na pulpicie oraz w kalendarzu — zmiana przeciekalaby poza karty. */
.aktlist{border:1px solid var(--line,#e6e6ef);border-radius:10px;background:var(--panel);overflow:hidden}
.akt__i{display:grid;grid-template-columns:34px 9px 1fr auto;gap:10px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--line,#e6e6ef);font-size:12.5px}
.akt__i:last-child{border-bottom:0}
.akt__i[data-open],.akt__i[data-tlurl],.akt__i[data-mailuid]{cursor:pointer}
.akt__i:hover{background:rgba(0,0,0,.03)}
.akt__lp{color:var(--muted,#697586);font-variant-numeric:tabular-nums;text-align:right;font-size:11.5px}
.akt__m{min-width:0}
.akt__h{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.akt__h b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.akt__t{color:var(--muted,#697586);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.akt__g--brak{color:var(--muted,#697586);cursor:help}
.akt__kto{color:var(--muted,#697586);font-size:11.5px;white-space:nowrap;max-width:140px;overflow:hidden;text-overflow:ellipsis}
.akt__err{margin-bottom:8px;font-size:12.5px;color:var(--danger)}
@media(max-width:640px){.akt__i{grid-template-columns:26px 9px 1fr}.akt__kto{display:none}}   /* na telefonie "kto" znika z osobnej kolumny — temat wazniejszy niz autor */   /* rozwinieta tresc potrzebuje miejsca; bez :has() zostaje przewijanie */
.notifhd{font-weight:800;font-size:13px;padding:6px 8px;color:var(--muted,#697586);display:flex;align-items:center;gap:8px}
.notifhd>span{flex:1}
.notifsnd{border:1px solid var(--line,#e7e9ee);background:#fff;border-radius:8px;padding:2px 7px;font-size:14px;line-height:1.5;cursor:pointer}   /* .625: przelacznik dzwieku powiadomien (dzwonek + czat) */
.notifsnd:hover{border-color:var(--accent,var(--accent));background:var(--accent-soft,#eef2ff)}
/* .1127: para przyciskow naglowka dzwonka (⚙ wybor rodzajow + 🔊 dzwiek).
   ⚠️ MUSI byc bardziej szczegolowe niz `.notifhd>span{flex:1}` — inaczej opakowanie rozpycha naglowek. */
.notifhd>span.notifhd__b{flex:0 0 auto;display:flex;gap:6px}
/* ── EKRAN „Moje powiadomienia" (.1127): grupy per modul, wiersz = przelacznik + nazwa + powod. */
.pwd-grupa{margin-top:14px}
.pwd-grupa h4{margin:0 0 6px;font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.pwd-poz{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;margin-bottom:6px;cursor:pointer;background:var(--panel)}
.pwd-poz:hover{background:var(--soft)}
.pwd-poz.is-stale{cursor:default;opacity:.85;background:var(--soft)}
.pwd-poz input{margin-top:2px;width:16px;height:16px;accent-color:var(--accent);flex:0 0 auto}
.pwd-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.pwd-txt b{font-size:13px}
.pwd-txt small{color:var(--muted);font-size:12px;line-height:1.45}
.pwd-txt i{color:var(--muted);font-style:italic}
.notifempty{padding:18px 10px;text-align:center;color:var(--muted,#697586);font-size:13px}
.notifitem{padding:9px 10px;border-radius:9px;border:1px solid var(--line,#e7e9ee);margin:5px 2px;background:#fff}
.notifitem.is-unread{border-color:var(--accent,var(--accent));background:var(--accent-soft,#eef2ff)}
.notifitem__t{font-weight:700;font-size:13px;color:var(--txt,#0f1729)}
.notifitem__b{font-size:12.5px;color:var(--muted,#697586);margin-top:2px;line-height:1.4}
.notifitem__act{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:7px}
.notifitem__act .hwn-date{font-size:12px;padding:4px 6px;border:1px solid var(--line,#e7e9ee);border-radius:7px}

/* ===== BRIEFING KLIENTA (moc ② — „Przygotuj mnie") ===== */
.briefov{position:fixed;inset:0;z-index:200;background:rgba(20,18,40,.55);backdrop-filter:blur(2px);display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px;overflow:auto}
.briefbox{background:var(--panel,#fff);width:min(720px,96vw);border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.35);overflow:hidden}
.briefhd{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--line,#e7e9ee);font-size:15px;color:var(--txt,#0f1729)}
.briefclose{cursor:pointer;color:var(--muted,#697586);font-size:16px;padding:2px 8px;border-radius:6px;user-select:none}
.briefclose:hover{background:var(--soft,#f1f3f7)}
.briefbody{padding:18px;max-height:72vh;overflow:auto}
.briefmd{font-size:14px;line-height:1.6;color:var(--txt,#0f1729)}

/* ===== Q2: załączniki z korespondencji Zoho (screeny klienta) ===== */
.konw-atts{margin:10px 0;padding:9px 11px;border:1px dashed var(--line,#e7e9ee);border-radius:9px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--soft,#f8f9fc)}
.konw-att{display:inline-flex;align-items:center;gap:5px;font-size:12.5px}
.konw-att a{color:var(--accent,var(--accent));text-decoration:none;font-weight:600}
.konw-att a:hover{text-decoration:underline}
/* inline screeny (obrazki) w wątku Zoho pod wiadomością + w pasku, oraz w czacie */
.konw-imgs{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.konw-imgw{display:inline-flex;flex-direction:column;align-items:flex-start;gap:3px}
.konw-img,.czat-img{max-width:220px;max-height:200px;border-radius:8px;border:1px solid var(--line,#e7e9ee);cursor:pointer;display:block;object-fit:cover}
/* .1344 (zgloszenie Pawla: „w zoho desk dobre i mail klienta dobrze, a u nas..."): obrazek WKLEJONY
   W TRESC to czesc wiadomosci, nie zalacznik — u klienta i w Desku ma pelna szerokosc, a u nas byl
   znaczkiem 220x200 przycietym `object-fit:cover` (czyli jeszcze obcietym!). Zrzut ekranu w takiej
   miniaturze jest nieczytelny. Miniatury zalacznikow zostaja male — to inna rzecz. */
/* .1345: rozmiar czytelny, ale nie na pol ekranu — klikniecie i tak powieksza (zgloszenie Pawla).
   `contain` zamiast `cover`: zrzut ekranu ma byc CALY, tylko mniejszy — nie przyciety w kadrze. */
.konw-imgw>a>.konw-img{max-width:min(100%,460px);max-height:340px;width:auto;object-fit:contain}
.konw-img:hover,.czat-img:hover{opacity:.92}
.czat-fwrap--img{align-items:flex-start}
/* podgląd po najechaniu — powiększony obraz, fixed (nic nie przycina), nad wszystkim, nie łapie myszy */
#imgZoom{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:none;z-index:99999;max-width:min(92vw,1000px);max-height:92vh;border-radius:10px;border:1px solid var(--line,#e7e9ee);box-shadow:0 24px 70px rgba(0,0,0,.5);background:#fff;pointer-events:none}
/* reakcje emoji na wiadomości czatu */
.czat-res{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px;align-items:center}
.czat-b.me .czat-res{justify-content:flex-end}
.czat-re{display:inline-flex;align-items:center;gap:3px;font-size:12px;line-height:1;padding:2px 8px;border:1px solid var(--line,#e7e9ee);border-radius:999px;background:var(--card,#fff);color:var(--txt);cursor:pointer}
.czat-re:hover{background:var(--soft,#f2f3f8)}
.czat-re.on{border-color:var(--accent,var(--accent));background:#eef0ff;font-weight:600}
.czat-re__n{font-size:11px;color:var(--muted)}
.czat-re.on .czat-re__n{color:var(--accent,var(--accent))}
.czat-re--add{opacity:.55;padding:2px 6px}
.czat-re--add:hover{opacity:1}
.czat-repal{position:fixed;z-index:99999;display:flex;gap:2px;padding:5px 7px;background:var(--card,#fff);border:1px solid var(--line,#e7e9ee);border-radius:999px;box-shadow:0 12px 34px rgba(0,0,0,.22)}
.czat-repick{font-size:19px;line-height:1;background:none;border:none;cursor:pointer;padding:2px 5px;border-radius:8px}
.czat-repick:hover{background:var(--soft,#f2f3f8);transform:scale(1.15)}
/* most SMS↔grupa: uczestnicy-telefony (modal) + baner kosztu */
.cgsms-row{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}
.cgsms-row input{flex:1;min-width:130px}
.cgsms-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.cgsms-chip{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;padding:3px 9px;border:1px solid var(--line,#e7e9ee);border-radius:999px;background:#eef0ff}
.cgsms-chip button{background:none;border:none;cursor:pointer;color:var(--muted);font-size:13px;padding:0 2px}
.cgsms-chip button:hover{color:var(--danger,#dc2626)}
.czat-smsbanner{font-size:12px;color:#9a3412;background:#fff7ed;border-bottom:1px solid #fed7aa;padding:6px 14px}

/* ===== KATALOG WIEDZY (W3) — widok „Wiedza": picker obszaru, karty, wyniki, joby ingestu ===== */
.wz{display:flex;flex-direction:column;gap:14px;padding:4px 2px}
.wz__bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
/* WIEDZA: katalogi główne (systemy) → obszary → obszar (breadcrumb + hero „Poradź się" + dokumenty pod rozwijaniem) */
.wzcrumb{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.wzcr{background:none;border:0;padding:5px 8px;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;color:var(--accent);display:inline-flex;align-items:center;gap:5px}
.wzcr:hover{background:var(--accent-soft)}
.wzcr--cur{color:var(--txt);cursor:default}.wzcr--cur:hover{background:none}
.wzcr__sep{color:var(--muted)}
.wzcrumb__sp{flex:1}
.wzsys{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.wzsystile{display:flex;align-items:center;gap:15px;padding:22px 20px;border:1px solid var(--line);border-radius:16px;background:var(--panel);cursor:pointer;text-align:left;transition:border-color .15s,box-shadow .15s}
.wzsystile:hover{border-color:var(--accent);box-shadow:var(--sh-md,0 8px 24px rgba(15,23,41,.09))}
.wzsystile__ico{font-size:36px;flex:none;line-height:1}
.wzsystile__main{flex:1;min-width:0}
.wzsystile__main b{font-size:17px;display:block;margin-bottom:2px}
.wzsystile__main small{color:var(--muted);font-size:13px}
.wzsystile__go{font-size:24px;color:var(--muted);flex:none}
.wzhero{border:1px solid var(--line);border-radius:16px;background:var(--accent-soft);padding:18px 20px;margin-bottom:16px}
.wzhero__t{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.wzhero__ico{font-size:30px;line-height:1}
.wzhero__t b{font-size:18px;display:block}
.wzhero__t small{color:var(--muted);font-size:13px;display:block;margin-top:2px}
.wzhero__ask{display:flex;gap:10px;align-items:center}
.wzhero__in{flex:1;border:1px solid var(--line);border-radius:11px;padding:13px 15px;font-size:15px;background:#fff}
.wzhero__in:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.wzhero__ask .btn--primary{padding:12px 20px;font-size:15px;white-space:nowrap}
.wzhero__sub{margin-top:9px}
.wzlink{background:none;border:0;color:var(--accent);cursor:pointer;font-size:13px;font-weight:600;padding:0}
.wzlink:hover{text-decoration:underline}
.wzdetails{border:1px solid var(--line);border-radius:12px;margin-top:16px;background:var(--panel)}
.wzdetails>summary{cursor:pointer;padding:13px 15px;font-weight:600;font-size:14px;display:flex;align-items:center;gap:9px;list-style:none;user-select:none}
.wzdetails>summary::-webkit-details-marker{display:none}
.wzdetails__lab::before{content:"▸ ";color:var(--muted)}
.wzdetails[open]>summary .wzdetails__lab::before{content:"▾ "}
.wzdetails__n{color:var(--muted);font-weight:600}
.wzdetails__adm{margin-left:auto;display:flex;gap:6px}
.wzdetails__bd{padding:0 15px 15px}
@media(max-width:640px){.wzhero__ask{flex-direction:column;align-items:stretch}.wzhero__ask .btn--primary{width:100%}}
.wz__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.wzcard{display:flex;gap:10px;align-items:center;padding:14px;border:1px solid var(--line,#e7e9ee);border-radius:12px;background:var(--panel,#fff);cursor:pointer;text-align:left}
.wzcard:hover{border-color:var(--accent,var(--accent));box-shadow:var(--shadow,0 2px 8px rgba(0,0,0,.06))}
.wzcard__ico{font-size:22px}
.wzcard small{display:block;color:var(--muted,#6b7280)}
.wz__ask{display:flex;gap:8px;align-items:center}
.wz__ask input{flex:1}
.wzhit{border:1px solid var(--line,#e7e9ee);border-radius:10px;padding:10px 12px;margin:6px 0;background:var(--panel,#fff)}
.wzhit__head{display:flex;justify-content:space-between;gap:8px;margin-bottom:4px;flex-wrap:wrap}
.wzhit__txt{color:var(--muted,#6b7280);font-size:13px;line-height:1.45}
.wz__dochead{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.wz__dochead h3{margin:0;flex:1}
.wzjob{padding:6px 10px;border-radius:8px;margin:4px 0;font-size:13px}
.wzjob--run{background:rgba(245,158,11,.14);color:#92600a}
.wzjob--ok{background:rgba(16,185,129,.12);color:#0b7a58}
.wzjob--err{background:rgba(226,75,74,.10);color:var(--danger,#e24b4a)}
.wznote{display:flex;flex-direction:column;gap:8px;border:1px dashed var(--line,#e7e9ee);border-radius:10px;padding:12px;margin:6px 0;background:var(--soft,#f8f9fc)}
.wznote textarea{background:var(--panel,#fff);color:var(--txt,#1d2333);border:1px solid var(--line,#e7e9ee);border-radius:8px;padding:8px;font:inherit}

/* ===== W6: półka Koncepty + pasek precedensów na leadzie ===== */
.wzhit--click{cursor:pointer}
.wzhit--click:hover{border-color:var(--accent,var(--accent))}
.wzprec{margin:10px 0 2px;padding:9px 12px;border:1px dashed var(--accent,var(--accent));border-radius:10px;background:var(--accent-soft,#eef2ff);font-size:13px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.wzprec__it{border:1px solid var(--accent,var(--accent));background:var(--panel,#fff);color:var(--accent,var(--accent));border-radius:999px;padding:3px 10px;font-size:12.5px;cursor:pointer;font-weight:600}
.wzprec__it:hover{background:var(--accent,var(--accent));color:#fff}

/* ===== CZAT: grupy + baner zaczepki (2026-07-02) ===== */
.czat-b__who{display:block;font-size:11px;font-weight:700;color:var(--accent,var(--accent));margin-bottom:2px}
.czat-cnew{padding:8px 10px;border-bottom:1px solid var(--line,#e7e9ee);background:var(--soft,#f8f9fc)}
.czat-cnew .btn{width:100%}
.czat-av--grp{background:var(--accent-soft,#eef2ff);color:var(--accent,var(--accent));font-size:16px}
.czatping{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:1300;display:flex;align-items:center;gap:12px;background:var(--card,#fff);border:2px solid var(--accent,var(--accent));border-radius:14px;padding:12px 14px;box-shadow:0 14px 44px rgba(31,35,60,.22);max-width:560px;min-width:320px;animation:czatping-in .25s ease}
.czatping__m{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.czatping__m b{font-size:13.5px}
.czatping__m small{color:var(--muted,#6b7280);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@keyframes czatping-in{from{opacity:0;transform:translateX(-50%) translateY(-14px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}

/* CZAT GRUPY: równa siatka wyboru osób w modalu (2026-07-02 — .wfappr z workflow się tu rozjeżdżał) */
.cgm-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px;max-height:280px;overflow-y:auto;padding:2px;margin-top:6px}
.cgm-o{display:flex;align-items:center;gap:9px;padding:8px 11px;border:1px solid var(--line,#e7e9ee);border-radius:9px;cursor:pointer;font-size:13px;background:var(--card,#fff)}
.cgm-o span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cgm-o input{accent-color:var(--accent,var(--accent));flex:0 0 auto;margin:0;width:16px;height:16px;padding:0}   /* nadpisuje .addfld input{width:100%} — checkbox brał całą szerokość i zgniatał nazwisko do 0 */
.cgm-o:hover{border-color:var(--accent,var(--accent))}
.cgm-o:has(input:checked){border-color:var(--accent,var(--accent));background:var(--accent-soft,#eef2ff)}

/* CZAT: kontrast wnętrza MOJEGO dymka (biały tekst na akcencie) */
.czat-b.me .czat-b__c{color:rgba(255,255,255,.78)}
.czat-b.me .czat-file{color:#fff;text-decoration:underline}
.czat-b.me .muted2{color:rgba(255,255,255,.72)}
.czat-b.me .czat-fcrm{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.4)}

/* F5.2 — EKRAN LOGOWANIA NA JEDNYM KOLORZE. Cala paleta wyprowadzona z `--accent` przez color-mix,
   wiec klient ustawia JEDEN kolor w manifescie i przemalowuje sie caly ekran powitalny — zamiast
   dwudziestu osobnych ustawien, ktorych nikt nie wypelni. Zmienne sa zakresowane do `.login`
   (zero wplywu na reszte panelu). Zielona kropka „online" i czerwien bledu ZOSTAJA — to znaczenia,
   nie marka: zielony pod czerwony motyw znaczylby nadal „dziala". */
.login{
  --log: var(--accent);
  --log-tlo-1: color-mix(in srgb, var(--log) 26%, #0b0817);
  --log-tlo-2: color-mix(in srgb, var(--log) 9%, #06040e);
  --log-jasny: color-mix(in srgb, var(--log) 45%, #ffffff);
  --log-rdzen: color-mix(in srgb, var(--log) 18%, #ffffff);
  --log-tekst: color-mix(in srgb, var(--log) 26%, #d8d4ea);
  --log-tekst-slaby: color-mix(in srgb, var(--log) 32%, #b6b1cc);
  --log-link: color-mix(in srgb, var(--log) 18%, #d9d5ec);
}
/* ===================== LOGOWANIE (Faza 3 — ciemny 3D, Wariant B). Na KOŃCU pliku → wygrywa nad regułami glass (.login/.login__card wyżej). ===================== */
@keyframes brainSpin{from{transform:rotateY(0deg)}to{transform:rotateY(360deg)}}
@keyframes corePulse{0%,100%{transform:scale(1);opacity:.95}50%{transform:scale(1.12);opacity:1}}
@keyframes chipFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes loginGrid{from{background-position:0 0,0 0}to{background-position:0 44px,44px 0}}
@keyframes loginOrbit{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.login{position:fixed;inset:0;overflow:hidden;padding:0 9% 0 0;display:flex;align-items:center;justify-content:flex-end;background:radial-gradient(1100px 700px at 32% 32%,var(--log-tlo-1) 0%,var(--log-tlo-2) 62%)}
.login.hidden{display:none}
.login__grid{position:absolute;left:-15%;right:-15%;bottom:-32%;height:64%;background-image:linear-gradient(color-mix(in srgb, var(--log) 22%, transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb, var(--log) 22%, transparent) 1px,transparent 1px);background-size:44px 44px;transform:perspective(700px) rotateX(62deg);animation:loginGrid 3s linear infinite;-webkit-mask-image:linear-gradient(to top,rgba(0,0,0,.8),transparent);mask-image:linear-gradient(to top,rgba(0,0,0,.8),transparent);pointer-events:none}
.login__brainwrap{position:absolute;left:34%;top:47%;width:0;height:0;transform:translate(-50%,-50%) rotateX(var(--brx,0deg)) rotateY(var(--bry,0deg));transform-style:preserve-3d;transition:transform .18s ease-out;pointer-events:none}
.login__sphere{position:absolute;left:-190px;top:-190px;width:380px;height:380px;transform-style:preserve-3d;animation:brainSpin 18s linear infinite}
.login__sphere span{position:absolute;inset:0;border:1.5px solid color-mix(in srgb, var(--log-jasny) 34%, transparent);border-radius:50%}
.login__core{position:absolute;left:50%;top:50%;width:96px;height:96px;margin:-48px 0 0 -48px;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--log-rdzen),var(--log) 45%,color-mix(in srgb, var(--log) 8%, transparent) 75%);box-shadow:0 0 90px color-mix(in srgb, var(--log) 85%, transparent),0 0 180px color-mix(in srgb, var(--log) 40%, transparent);animation:corePulse 3.4s ease-in-out infinite}
.login__orbit{position:absolute;transform-style:preserve-3d;pointer-events:none}
.login__orbit--a{left:-235px;top:-235px;width:470px;height:470px;animation:loginOrbit 9s linear infinite}
.login__orbit--a i{position:absolute;left:50%;top:-4px;width:9px;height:9px;margin-left:-4px;border-radius:50%;background:var(--log-jasny);box-shadow:0 0 16px var(--log-jasny)}
.login__orbit--b{left:-205px;top:-205px;width:410px;height:410px;animation:loginOrbit 13s linear infinite reverse}
.login__orbit--b i{position:absolute;left:50%;bottom:-3px;width:7px;height:7px;margin-left:-3px;border-radius:50%;background:var(--log-jasny);box-shadow:0 0 14px var(--log-jasny)}
.login__chip{position:absolute;z-index:1;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:9px 14px;color:var(--log-link);font-size:12px;display:flex;align-items:center;gap:8px;animation:chipFloat 7s ease-in-out infinite}
.login__chip--1{left:9%;top:16%}
.login__chip--2{left:13%;bottom:20%;animation-duration:9s;animation-delay:1.2s}
.login__chip--3{left:42%;top:11%;animation-duration:8s;animation-delay:.6s}
.login__chip .dot{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 10px #4ade80}
.login__card{position:relative;z-index:2;width:392px;max-width:100%;background:rgba(255,255,255,.055);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:34px;box-shadow:0 34px 90px rgba(5,0,30,.6);display:flex;flex-direction:column;gap:18px}
.login__logo{display:flex;align-items:center;gap:12px}
.login__logo .brand__mark{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--log),var(--log-jasny));color:#fff;font-size:18px;font-weight:800;box-shadow:0 8px 24px color-mix(in srgb, var(--log) 50%, transparent)}
.login__logo b{font-size:17px;color:#fff;display:block;line-height:1.2}
.login__logo small{font-size:11.5px;color:var(--log-tekst)}
.login__hello h2{margin:0;font-size:23px;font-weight:800;color:#fff;letter-spacing:-.01em}
.login__hello p{margin:4px 0 0;font-size:13px;color:var(--log-tekst)}
.login .brand{color:#fff}
.login .login__sub{color:var(--log-tekst);margin:0}
.login .login__hint{color:var(--log-tekst-slaby);font-size:11.5px;margin:0}
.login .field{gap:6px;margin:0}
.login .field span{font-size:12.5px;color:var(--log-tekst)}
.login .field input{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#fff;border-radius:12px;padding:13px 15px;font-size:13.5px}
.login .field input::placeholder{color:var(--log-tekst-slaby)}
.login .field input:focus{outline:none;border-color:color-mix(in srgb, var(--log-jasny) 65%, transparent);box-shadow:0 0 0 3px color-mix(in srgb, var(--log) 18%, transparent)}
.login .btn--primary{width:100%;margin-top:4px;background:linear-gradient(135deg,var(--log),var(--log-jasny));border:none;color:#fff;border-radius:12px;padding:14px;font-size:14px;font-weight:800;box-shadow:0 12px 30px color-mix(in srgb, var(--log) 45%, transparent)}
.login .btn--primary:hover{filter:brightness(1.1)}
.login__forgot{color:var(--log-link);font-size:12.5px;text-align:center}
.login__forgot:hover{color:#fff}
.login .login__err{color:#ffb4b4;font-size:12.5px;margin:0;text-align:center}
@media(max-width:820px){.login{justify-content:center;padding:0 20px}.login__brainwrap,.login__chip{display:none}}

/* ===================== MOBILE (Faza 4 — szuflada + dolny pasek). Lofi wg README; stylowanie wg desktopu. ===================== */
.topbar__burger{display:none;border:none;background:none;cursor:pointer;color:var(--muted);padding:6px;border-radius:8px;margin-right:2px}
.topbar__burger:hover{background:var(--soft);color:var(--accent)}
.navscrim{display:none}
.mtabs{display:none}
@media(max-width:900px){
  .app{grid-template-columns:1fr}
  .sidebar{position:fixed;top:0;left:0;bottom:0;width:284px;z-index:60;transform:translateX(-100%);transition:transform .25s ease;border-radius:0 18px 18px 0;box-shadow:12px 0 40px rgba(20,10,60,.3)}
  .app.nav-open .sidebar{transform:translateX(0)}
  .nav__collapse{display:none}
  .navscrim{display:block;position:fixed;inset:0;background:rgba(20,14,45,.42);z-index:55;opacity:0;pointer-events:none;transition:opacity .25s}
  .app.nav-open .navscrim{opacity:1;pointer-events:auto}
  .topbar__burger{display:flex}
  .verbadge,.topbar__refresh{display:none}
  .gcomposer{display:none}
  .main{padding:16px 14px 74px}
  .app.view-launcher .main{padding:0}
  .launcher{padding:24px 16px 84px}
  .launcher__tiles{grid-template-columns:1fr}
  .mtabs{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--panel);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .mtab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:none;background:none;cursor:pointer;color:var(--muted);font-size:10px;font-weight:600;border-radius:10px;padding:6px 0}
  .mtab svg{width:22px;height:22px}
  .mtab.is-active{color:var(--accent)}
}
/* MOBILE — responsywność WNĘTRZA (tabele/karty/siatki), uzupełnienie otoczki z Fazy 4 */
@media(max-width:900px){
  /* karty rekordu (lead/projekt/klient): kolumny gridu nie rozpychają się poza ekran (min-width:auto→0 → treść scrolluje/zawija zamiast wypychać track) */
  .prof{grid-template-columns:1fr}
  .prof > *{min-width:0}
  .pkpis{grid-template-columns:repeat(2,1fr)}
  .pdash{grid-template-columns:1fr}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .cards{grid-template-columns:1fr}
  /* tabele: przewijanie w poziomie zamiast rozpychania strony + ciaśniejsze komórki */
  .tablewrap,.zadtblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table th,table td{padding:9px 10px;font-size:12.5px}
  /* nagłówek widoku: tytuł + akcje zawijają się zamiast wypychać */
  .view__head{flex-wrap:wrap;gap:10px}
  .view__head h2{font-size:17px}
  /* karty na mobile: „⚙ Kolumny"/resizery nieistotne; pasek filtrów przewija się w poziomie zamiast wystawać */
  .zadcolsbtn,.zadbar{display:none}
  .seg{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;max-width:100%}
  .seg::-webkit-scrollbar{height:0}
}
@media(max-width:400px){
  .kpis,.pkpis{grid-template-columns:1fr}
}
/* MOBILE — listy jako KARTY (Część A). Karty renderuje JS tylko na ≤900px (cfgCardsHTML) */
.mcardwrap{overflow:visible;border:none;background:none;box-shadow:none}
.mcards{display:flex;flex-direction:column;gap:10px;padding:2px 2px 8px}
.mcard{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;box-shadow:var(--shadow)}
.mcard__top{display:flex;align-items:flex-start;gap:10px}
.mcard__title{flex:1;min-width:0;font-size:15px;font-weight:600;line-height:1.32;overflow:hidden}
.mcard__title .link{font-size:15px;font-weight:600}
.mcard__badge{flex:none;white-space:nowrap}
.mcard__meta{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:9px}
.mcard__m{font-size:12.5px;color:#374151;display:inline-flex;align-items:center;gap:5px;min-width:0;max-width:100%}
.mcard__m i{font-style:normal;color:var(--muted);opacity:.75;font-size:10.5px;text-transform:uppercase;letter-spacing:.03em}
.mcard__m .cellpick{font-size:12.5px}
/* MOBILE — kalendarz jako AGENDA (Część B) */
.calag{padding:4px 2px 14px;display:flex;flex-direction:column;gap:16px}
.calag__day{display:flex;flex-direction:column;gap:6px}
.calag__dhd{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:2px 2px 4px}
.calag__ev{display:flex;align-items:flex-start;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:11px 13px;cursor:pointer;box-shadow:var(--shadow)}
.calag__ev:hover{border-color:var(--accent)}
.calag__dot{flex:none;width:9px;height:9px;border-radius:50%;margin-top:5px}
.calag__time{flex:none;font-size:12.5px;font-weight:700;color:var(--txt);min-width:54px}
.calag__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.calag__t{font-size:14px;font-weight:600;line-height:1.3}
.calag__sub{font-size:12px;color:var(--muted)}
.calag__empty{text-align:center;color:var(--muted);padding:40px 16px;font-size:13.5px;line-height:1.6}
@media(max-width:900px){
  .calrail{display:none}
  .caltop{flex-wrap:wrap;gap:6px;padding:8px 10px;height:auto}
  .calvb[data-calview="tydzien"]{display:none}
  #vKalendarz{overflow:auto}
  .cal{gap:0}
  .calmain{overflow:visible;background:none;border:none;box-shadow:none}
}
/* MOBILE — modale / poczta / dok Hermesa (Części C-E) */
@media(max-width:900px){
  .modalov,.acmodal{padding:14px 10px;align-items:flex-start}
  /* ⚠️ `overflow:auto` DOŁOŻONE 2026-08-18: było samo `max-height:92vh`, czyli treść wyższa niż
     ekran była PRZYCINANA bez możliwości przewinięcia — na telefonie przycisk zapisu stawał się
     nieosiągalny. Ta sama klasa, co zgłoszenie „to jak teraz mam zatwierdzić?" na dużym ekranie. */
  .modalbox,.acmodal__card,.calmodal__card{width:100%;max-width:100%;max-height:92vh;overflow:auto}
  .calmodal__when,.calmodal__r2{grid-template-columns:1fr}
  /* .1138 [ZMIERZONE na 375 px]: rzad „Ustawienia" ma flex-wrap:nowrap (celowo — na szerokim
     ekranie lista konca serii nie moze sie kurczyc), przez co Biuro/Wyjazd/Zdalnie wystawalo
     153 px poza karte i robilo pasek w bok. Na waskim ekranie zawijamy — desktop bez zmian. */
  .cfrow1{flex-wrap:wrap}
  .mailview{flex-direction:column;height:auto}
  .maillist{width:100%;min-width:0;max-height:42vh}
  .mailprev{min-height:50vh}
  .app.assist-open .mtabs{display:none}
}
/* MOBILE — widok ASYSTENTA = SAM asystent: dok Hermesa na całą wysokość, panele konfiguracyjne (przeglądarka skilli / ulubione / zarządzanie narzędziami) ukryte. Skille/agentów konfiguruje się z desktopu — na telefonie tylko rozmowa. Hook: klasa .view-asystent na #app (switchView). */
@media(max-width:900px){
  .app.view-asystent .main{display:none}                                   /* ukryj .asys3 (cały panel konfiguracyjny widoku Asystenta) */
  .app.view-asystent .assist{display:flex;flex:1;height:auto;min-height:0;border-top:none;box-shadow:none;margin-bottom:calc(64px + env(safe-area-inset-bottom))}  /* dok wypełnia obszar pod topbarem; margines = wysokość dolnego paska #mtabs (61px, fixed) + odstęp → kompozytor nad zakładkami */
  .app.view-asystent .assist__head .iconbtn{display:none}                  /* „✕ zamknij" zbędne — widok JEST asystentem, nie ma czego zamykać */
  .app.view-asystent.assist-open .mtabs{display:flex}                      /* na tym widoku dolny pasek zostaje (nawigacja) nawet po otwarciu rozmowy */
  .app.view-asystent ~ #pwypBar{display:none}                              /* pasek „wypożyczone pliki" (fixed, body-level) zasłaniałby kompozytor — na widoku SAMEGO asystenta go chowamy (widoczny na wszystkich innych widokach) */
}

/* ═══ TABLICA OGŁOSZEŃ (ADR-0017) — ściana firmowa. Strumień kart, nie tabela: jednokolumnowa z założenia,
   więc mobile działa bez osobnego wariantu. ⚠️ .tabkarta__tresc ZOSTAJE z pre-wrap: wpisy sprzed .1100 to
   CZYSTY TEKST z prawdziwymi znakami nowej linii i bez tego zlałyby się w jeden akapit. Wpisy nowe są
   HTML-em bez surowych nowych linii, więc pre-wrap ich nie rusza — jedna reguła obsługuje oba roczniki.
   ⚠️ .1100 (aneks do ADR-0017, decyzja Pawła): treść MA formatowanie, więc dawna reguła „nigdy innerHTML"
   ustąpiła LIŚCIE DOZWOLONYCH po stronie serwera (`_tablica_html`). */
.tabwrap{max-width:760px;margin:0 auto;padding:0 4px 40px}
.tabpisz{background:var(--card,#fff);border:1px solid var(--line,#e6e1d8);border-radius:14px;padding:12px;margin-bottom:14px}
.tabpisz textarea{width:100%;border:1px solid var(--line,#e6e1d8);border-radius:10px;padding:9px 11px;font:inherit;resize:vertical;background:transparent;color:inherit}
/* .1100: pole pisania z formatowaniem (contenteditable) — wygląda i zachowuje się jak dotychczasowe
   pole tekstowe: ta sama ramka, ta sama wysokość startowa, rośnie z treścią. Podpowiedź przez ::before,
   bo `placeholder` działa tylko w <input>/<textarea>. */
.tabpisz__ed{width:100%;min-height:64px;max-height:340px;overflow:auto;border:1px solid var(--line,#e6e1d8);border-radius:10px;padding:9px 11px;font:inherit;background:transparent;color:inherit;line-height:1.55;overflow-wrap:anywhere}
.tabpisz__ed:focus{outline:none;border-color:var(--accent,#6d5bd0)}
.tabpisz__ed:empty::before{content:attr(data-ph);color:var(--muted,#9aa1b2)}
.tabpisz__ed a{color:var(--accent,#6d5bd0);text-decoration:underline}
.tabpisz__ed ul,.tabpisz__ed ol{margin:4px 0 4px 20px}
.tabedyt{margin:6px 0 2px}
/* .1102: wyodrebniony TYTUL wpisu (migracja 044). Wpis bez tytulu wyglada jak dotad — naglowka
   po prostu nie ma, nic sie nie przesuwa. */
.tabpisz__tyt{width:100%;border:1px solid var(--line,#e6e1d8);border-radius:10px;padding:9px 11px;margin-bottom:8px;font:inherit;font-weight:700;background:transparent;color:inherit}
.tabpisz__tyt:focus{outline:none;border-color:var(--accent,#6d5bd0)}
.tabkarta__tyt{margin:2px 0 4px;font-size:17px;font-weight:800;line-height:1.3;overflow-wrap:anywhere}
.tabkat--polka{margin-top:8px;border-top:1px solid var(--line,#e6e1d8);padding-top:10px}   /* polka archiwalna ODDZIELONA kreska od kategorii biezacych — widac, ze to inny rodzaj miejsca */
.tabkarta__tresc a{color:var(--accent,#6d5bd0);text-decoration:underline}
.tabkarta__tresc ul,.tabkarta__tresc ol{margin:6px 0 6px 22px}
.tabkarta__tresc b,.tabkarta__tresc strong{font-weight:700}
.tabpisz__row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px}
.tabpisz__row input[type=text]{flex:1 1 190px;min-width:150px;border:1px solid var(--line,#e6e1d8);border-radius:9px;padding:7px 10px;font:inherit;background:transparent;color:inherit}
.tabwazne{display:flex;gap:6px;align-items:center;font-size:12.5px;color:var(--muted,#7a7268);white-space:nowrap}
.tabfiltry{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 12px}
.tabkarta{background:var(--card,#fff);border:1px solid var(--line,#e6e1d8);border-radius:14px;padding:13px 14px;margin-bottom:12px}
/* .1126: ogloszenie WSKAZANE z dzwonka — sciana ma dziesiatki kafelkow, wiec samo przewiniecie
   nie wystarczy: czlowiek musi zobaczyc, KTORY to. Podswietlenie gasnie samo po ~2,5 s. */
.tabkarta--wskaz{border-color:var(--violet);box-shadow:0 0 0 3px var(--accent-soft);transition:box-shadow .3s,border-color .3s}
.tabkarta.is-pin{border-color:color-mix(in srgb, var(--violet) 33%, transparent);box-shadow:0 0 0 1px color-mix(in srgb, var(--violet) 13%, transparent)}
.tabkarta--kom{margin:8px 0 0 14px;padding:10px 12px;background:var(--glass,#faf7f2);border-radius:11px}
.tabkarta__h{display:flex;gap:10px;align-items:center}
.tabkarta__kto{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.tabkarta__kto small{color:var(--muted,#7a7268);font-size:11.5px}
.tabkarta__akcje{margin-left:auto;display:flex;gap:2px;opacity:.5;transition:opacity .15s}
.tabkarta:hover .tabkarta__akcje{opacity:1}
.tabkarta__odzn{margin:7px 0 0;display:flex;gap:5px;flex-wrap:wrap;empty-cells:hide}
.tabkarta__odzn:empty{display:none}
.tabkarta__tresc{margin:8px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.55}
.tabfilm{position:relative;margin:11px 0 0;padding-bottom:56.25%;height:0;border-radius:11px;overflow:hidden;background:#000}
.tabfilm iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.tabkarta__f{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}
.tabreakcje{display:flex;gap:4px;flex-wrap:wrap}
.tabreak{border:1px solid var(--line,#e6e1d8);background:transparent;border-radius:999px;padding:2px 9px;font-size:14px;cursor:pointer;line-height:1.5;color:inherit}
.tabreak:hover{border-color:var(--violet)}
.tabreak.is-on{background:color-mix(in srgb, var(--violet) 9%, transparent);border-color:var(--violet)}
.tabreak b{font-size:11.5px;font-weight:700;margin-left:2px}
.tabkom{margin-top:10px;border-top:1px solid var(--line,#e6e1d8);padding-top:8px}
.tabkom__pisz{display:flex;gap:8px;align-items:flex-end;margin:9px 0 2px 14px;flex-wrap:wrap}
.tabkom__pisz .mailfmt{flex:1 1 100%}                       /* .1100: pasek formatowania nad polem, przycisk „Wyślij" zostaje obok pola */
.tabkom__pisz .tabpisz__ed{flex:1 1 200px;min-height:44px}
.tabkom__pisz textarea{flex:1;border:1px solid var(--line,#e6e1d8);border-radius:10px;padding:7px 10px;font:inherit;resize:vertical;background:transparent;color:inherit}
@media (max-width:900px){
  .tabwrap{padding:0 2px 30px}
  .tabkarta--kom{margin-left:8px}
  .tabkom__pisz{margin-left:8px;flex-direction:column;align-items:stretch}
}

/* ADR-0018 + uklad 3-kolumnowy tablicy (decyzja Pawla: lewy pasek = kategorie, prawy = przypiete/autorzy).
   Sciana zostaje WASKA celowo — dlugie linijki tekstu czyta sie zle. Paski to dodatek, nie tresc:
   przy waskim ekranie znikaja calkiem, zeby nie spychac sciany do rynienki. */
.tabuklad{display:grid;grid-template-columns:210px minmax(0,760px) 240px;gap:18px;justify-content:center;align-items:start;padding:0 8px 40px}
.tabuklad .tabwrap{max-width:none;padding:0;margin:0}
.tabrail{position:sticky;top:10px;display:flex;flex-direction:column;gap:12px}
.tabbox{background:var(--card,#fff);border:1px solid var(--line,#e6e1d8);border-radius:14px;padding:11px 12px}
.tabbox h4{margin:0 0 8px;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted,#7a7268)}
.tabkat{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;text-align:left;border:0;background:transparent;color:inherit;font:inherit;padding:6px 8px;border-radius:9px;cursor:pointer}
.tabkat:hover{background:var(--glass,#f3efe8)}
.tabkat.is-on{background:color-mix(in srgb, var(--violet) 9%, transparent);color:var(--violet);font-weight:600}
.tabkat span{font-size:11.5px;color:var(--muted,#7a7268)}
.tabskrot{display:block;width:100%;text-align:left;border:0;background:transparent;color:inherit;font:inherit;padding:6px 8px;border-radius:9px;cursor:pointer;line-height:1.4}
.tabskrot:hover{background:var(--glass,#f3efe8)}
.tabskrot b{font-weight:500;font-size:12.5px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tabosoba{display:flex;gap:8px;align-items:center;padding:4px 0;font-size:12.5px}
.tabosoba .av{width:24px;height:24px;font-size:10px}
.tabkarta.is-blysk{animation:tabblysk 1.2s ease-out}
@keyframes tabblysk{0%,40%{box-shadow:0 0 0 3px color-mix(in srgb, var(--violet) 33%, transparent)}100%{box-shadow:none}}
/* KARTA PODGLADU LINKU (ADR-0018) — obrazek leci WPROST z cudzego serwera, bez proxy; no-referrer w HTML */
.tablink{display:flex;gap:0;flex-direction:column;margin-top:11px;border:1px solid var(--line,#e6e1d8);border-radius:12px;overflow:hidden;text-decoration:none;color:inherit;background:var(--glass,#faf7f2)}
.tablink:hover{border-color:var(--violet)}
.tablink__img{display:block;max-height:240px;overflow:hidden;background:var(--line,#e6e1d8)}
.tablink__img img{width:100%;height:100%;object-fit:cover;display:block}
.tablink__txt{display:block;padding:9px 11px;min-width:0}
.tablink__txt b{display:block;font-size:13.5px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.tablink__txt small{display:block;color:var(--muted,#7a7268);font-size:12px;line-height:1.45;margin-top:3px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.tablink__txt i{display:block;font-style:normal;font-size:11px;color:var(--muted,#7a7268);margin-top:5px;text-transform:lowercase}
/* 🔴 ZGLOSZENIE PAWLA 2026-08-21: „po wejsciu na Tablice z telefonu nie ma mozliwosci wyboru
   kategorii tresci (ani kategorii edytowalnych, jak enova czy Hermes, ani kategorii przypisanej
   do info o zmianach)". Do .1142 obie szyny mialy tu `display:none` — czyli byly KASOWANE, nie
   przenoszone, mimo ze komentarz w app.js twierdzil: „na telefonie paski chowaja sie pod sciane".
   Kategorie to jedyne wejscie na polke „Opis wersji CRM", wiec z telefonu nie dalo sie przeczytac
   opisu zadnego wydania. Teraz: lewa szyna zamienia sie w PASEK KAFELKOW nad sciana (przewijany
   w bok), prawa schodzi POD sciane. Nic nie znika. */
@media (max-width:1280px){
  .tabuklad{grid-template-columns:minmax(0,760px) 240px;grid-template-areas:"kat kat" "sciana prawa"}
  .tabrail--l{grid-area:kat} .tabwrap{grid-area:sciana} .tabrail--r{grid-area:prawa}
  .tabrail--l{position:static;flex-direction:row}
  .tabrail--l .tabbox{width:100%;padding:8px 10px}
  .tabrail--l .tabbox h4{margin-bottom:6px}
  /* kategorie w jednym rzedzie, przewijalnym palcem — nie zabieraja ekranu na wysokosc */
  .tabrail--l .tabkat{width:auto;flex:0 0 auto;border:1px solid var(--line,#e6e1d8);white-space:nowrap}
  .tabrail--l .tabbox>*:not(h4){display:inline-flex;vertical-align:top;margin:0 6px 0 0}
  .tabrail--l .tabbox{overflow-x:auto;white-space:nowrap}
  .tabrail--l .tabkat--polka{margin-top:0;border-top:1px solid var(--line,#e6e1d8)}   /* w rzedzie kreska u gory nic nie oddziela — zostaje sama ramka */
}
@media (max-width:1040px){
  .tabuklad{grid-template-columns:minmax(0,1fr);grid-template-areas:"kat" "sciana" "prawa"}
  .tabrail--r{position:static}
}

/* Ekran polaczenia z YouTube (.648) — stan polaczenia zamiast formularza z sekretami */
.ytstan{border:1px solid var(--line,#e6e1d8);border-radius:12px;padding:11px 13px;background:var(--glass,#faf7f2)}
.ytstan--ok{border-color:#1D9E7555;background:#1D9E7510}
.ytstan b{display:block;margin-bottom:2px}

/* Szybkie akcje na gornym pasku (.650). Na telefonie chowamy — tam jest dolny pasek i menu,
   a szesc ikon obok siebie w waskim naglowku to scisk, nie ergonomia. */
@media (max-width:820px){ .topbar__quick{display:none !important} }
/* .1143: ...a skoro chowamy je z belki, MUSZA byc gdzies indziej. Do .1142 nie byly NIGDZIE:
   ani dolny pasek, ani szuflada ich nie mialy, wiec z telefonu nie dalo sie dodac zadania,
   wyslac maila, zapisac notatki, nagrac ekranu, dodac instrukcji ani otworzyc drugiej zakladki.
   Tu jest ich mobilne wejscie — rzad kafelkow na gorze szuflady (Menu na dolnym pasku). */
/* .1144: zaznaczanie zadan na pulpicie (prosba Pawla) — ptaszek + podswietlony wiersz + pasek akcji.
   Pasek nosi TAKZE klase `.zadbulk`, wiec wyglada i chowa sie tak samo jak ten w module Zadania
   (razem z linia `.zadbulk[hidden]{display:none}` — bez niej `display:inline-flex` bilby `hidden`). */
.tlchk{flex:0 0 auto;display:inline-flex;align-items:center;padding:0 8px 0 2px;cursor:pointer}
.tlchk input{width:17px;height:17px;accent-color:var(--accent);cursor:pointer}
.tl__row.is-sel{background:var(--accent-soft)}
.dashbulk{margin:0 0 8px}
.navquick{display:none}
@media (max-width:820px){
  .navquick{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px 12px 4px}
  .navquick[hidden]{display:none}   /* rola bez zadnego z tych modulow — pusty rzad bylby smieciem */
}
.navquick__b{display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 4px;border:1px solid var(--line,#e6e1d8);
  border-radius:10px;background:transparent;color:inherit;font:inherit;font-size:11px;cursor:pointer;line-height:1.2}
.navquick__b span{font-size:18px;line-height:1}
.navquick__b:active{background:var(--glass,#f3efe8)}

/* ADR-0019 etap 1 — ZWIJANY KOMPOZYTOR (wzorzec Gmaila).
   ⚠️ Zwiniecie NIE niszczy DOM-u: to te samo okno, tylko przesuniete do belki na dole i przepuszczajace kliki.
   Dzieki temu tresc, adresat i wybrane zalaczniki zostaja nietkniete. */
.modalov.mailcm .modalbox__h{display:flex;align-items:center;gap:10px}
/* .1273 (zgloszenie Pawla 2026-08-25: „moglaby byc szersza i przez to wygodniejsza — pod spodem i tak
   sie nic nie dzieje, a wystarczy widocznosc niewielkiego tla"): okno pisania maila rosnie do 1600 px
   (szerokosc ustawiona przy tworzeniu okna), a TUTAJ rosnie POLE TRESCI — bez tego szerokie okno bylo
   plaskie i dalej pisalo sie w szparze na 320 px. */
/* .1336 (zgloszenie Pawla: „czemu tak ograniczyles pole do pisania maila"): pole tresci w oknie
   odpowiedzi mialo tylko min-height:120px z `.mailedit--box` — przy krotkim cytacie zostawal
   pasek na trzy linijki i pisalo sie „przez dziurke od klucza". Teraz pole startuje od ~40%
   wysokosci ekranu i rosnie z trescia do polowy okna. */
.modalov.mailcm .mailedit--box{min-height:clamp(240px,40vh,520px);max-height:min(56vh,620px)}
/* .1277: lista podpowiadanych adresow (`.mailsug`) jest pozycjonowana ABSOLUTNIE wzgledem najblizszego
   rodzica z `position:relative`. W oknie pisania takiego rodzica nie bylo, wiec podpowiedzi wyladowalyby
   przy krawedzi okna zamiast pod polem. */
.modalov.mailcm .addfld{position:relative}
.cmzwin{margin-left:auto;border:1px solid var(--line,#e6e1d8);background:transparent;color:inherit;font:inherit;
        font-size:12.5px;padding:3px 10px;border-radius:8px;cursor:pointer;white-space:nowrap}
.cmzwin:hover{border-color:var(--violet);color:var(--violet)}
/* stan zwiniety: kontener przestaje przyciemniac i lapac kliki, samo okno siada w prawym dolnym rogu */
.modalov.mailcm.is-min{background:transparent;pointer-events:none;align-items:flex-end;justify-content:flex-end;
        padding:0 0 88px;   /* nad paskiem asystenta (zmierzone 78px) + 10px luzu — zwiniety mail ma go NIE zaslaniac */
        /* .1278 (zgloszenie Pawla: „czy zwiniecie tej formatki umozliwialoby jednak prace w programie?"):
           klikniecia przechodzily JUZ WCZESNIEJ (`pointer-events:none`), ale `.modalov` ROZMYWA tlo
           (`backdrop-filter`), a zwiniecie tego nie kasowalo — caly panel wygladal na zablokowany
           i nikt nie probowal w niego kliknac. Rozmycie ma prawo istniec tylko przy oknie otwartym. */
        backdrop-filter:none;-webkit-backdrop-filter:none}
.modalov.mailcm.is-min .modalbox{pointer-events:auto;width:min(360px,92vw)!important;max-height:none;margin:0 18px 0 0;
        border-radius:12px 12px 0 0;box-shadow:0 -6px 28px rgba(91,33,182,.18);overflow:hidden}
.modalov.mailcm.is-min .modalbox__h{cursor:pointer;padding:10px 14px;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.modalov.mailcm.is-min .modalbox__h::before{content:attr(data-min);overflow:hidden;text-overflow:ellipsis}
.modalov.mailcm.is-min .modalbox__h{font-size:0}          /* chowamy oryginalny tytul... */
.modalov.mailcm.is-min .modalbox__h::before{font-size:13.5px}   /* ...i pokazujemy skrocony z data-min */
.modalov.mailcm.is-min .cmzwin{font-size:12.5px}
.modalov.mailcm.is-min .addform__b,
.modalov.mailcm.is-min .modalbox__f,
.modalov.mailcm.is-min .cfgnote{display:none}
@media (max-width:900px){
  .modalov.mailcm.is-min{padding-bottom:150px}   /* telefon: nad paskiem asystenta ORAZ dolna nawigacja */
  .modalov.mailcm.is-min .modalbox{width:100%!important;margin:0;border-radius:12px 12px 0 0}
}

/* ADR-0019 etap 2 — PASEK ZAKLADEK. Chowa sie przy jednej zakladce (nie zabiera wysokosci bez powodu)
   i na telefonie (tam jest dolna nawigacja). Zakladka = zapamietane MIEJSCE, nie zywy ekran. */
.zakl{display:flex;align-items:center;gap:4px;padding:5px 14px 0;overflow-x:auto;scrollbar-width:none;flex:0 0 auto}
.zakl::-webkit-scrollbar{display:none}
.zakl[hidden]{display:none}
.zakl__it{display:flex;align-items:center;gap:6px;max-width:210px;min-width:0;border:1px solid var(--line,#e6e1d8);
          border-bottom:none;background:var(--glass,#f3efe8);color:inherit;font:inherit;font-size:12.5px;
          padding:6px 8px 6px 10px;border-radius:9px 9px 0 0;cursor:pointer;white-space:nowrap}
.zakl__it:hover{background:var(--card,#fff)}
.zakl__it.is-on{background:var(--card,#fff);border-color:color-mix(in srgb, var(--violet) 33%, transparent);box-shadow:inset 0 2px 0 var(--violet);font-weight:600}
.zakl__ic{flex:0 0 auto;font-size:13px}
.zakl__t{overflow:hidden;text-overflow:ellipsis;min-width:0}
.zakl__x{flex:0 0 auto;opacity:.35;padding:0 2px;border-radius:5px;font-size:11px}
.zakl__x:hover{opacity:1;background:var(--danger,#dc2626);color:#fff}
/* ── TRYB CIASNY od 7 zakladki (.1125). Przy 9 kafelkach w oknie 1024 px na nazwe zostawalo 11 px
   [ZMIERZONE] — sam krzyzyk zjadal miejsce. Na nieaktywnych chowamy go i pokazujemy DOPIERO na
   najechanie, NAKLADKA (position:absolute), zeby pasek nie drgal przy przesuwaniu myszy.
   Na aktywnej zakladce krzyzyk zostaje zawsze — zamkniecie ma byc jednym klikiem, nie polowaniem. */
.zakl--ciasno .zakl__it{position:relative}
.zakl--ciasno .zakl__it:not(.is-on) .zakl__x{display:none}
.zakl--ciasno .zakl__it:not(.is-on):hover .zakl__x{display:block;position:absolute;right:3px;top:50%;transform:translateY(-50%);
  opacity:1;background:var(--danger,#dc2626);color:#fff;box-shadow:-7px 0 7px 3px var(--card,#fff)}
.zakl__add{border:1px dashed var(--line,#e6e1d8);background:transparent;color:var(--muted,#7a7268);font:inherit;
           padding:5px 11px;border-radius:9px 9px 0 0;cursor:pointer;line-height:1.3}
.zakl__add:hover{border-color:var(--violet);color:var(--violet)}
@media (max-width:900px){ .zakl{display:none!important} }

/* Wybor statusu przy odpowiedzi na zgloszenie Zoho (zgloszenie Sebastiana .661) */
.konwstat{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted,#7a7268)}
.konwstat select{font:inherit;font-size:12px;padding:3px 6px;border:1px solid var(--line,#e6e1d8);border-radius:7px;background:transparent;color:inherit;max-width:230px}

/* ⚠️ ZGLOSZENIE PAWLA 2026-08-11 ("nie moge rozwinac opcji wyslij z adresu, zeby wybrac adres"):
   reguly `display:` na tych klasach BIJA wbudowane w przegladarke [hidden]{display:none} (styl autora
   > styl przegladarki), wiec kontrolki chowane atrybutem `hidden` sterczaly na ekranie PUSTE i nie
   dawaly sie rozwinac. Zmierzone: .konwstat->flex, .nffield->flex, .zadbulk->inline-flex,
   .addfld->flex, .cronform->flex. Dotykalo 6 miejsc: wybor nadawcy Zoho (#konwFromWrap), pole "Od"
   w kompozytorze maila (#cmFromWrap, mial sie pokazywac dopiero przy 2+ aliasach), pasek operacji
   seryjnych zadan (#zadBulkBar, "Zaznaczono 0"), pole "Nr zrodla" (#nfRefWrap), pole "Plik"
   w formatce instrukcji, formularze dodawania crona i integracji (#cronForm/#integrForm).
   Ten sam patch stosowaly juz .ce [hidden], .notifbadge[hidden], .notifpanel[hidden], .zakl[hidden]. */
.konwstat[hidden],.nffield[hidden],.zadbulk[hidden],.addfld[hidden],.cronform[hidden]{display:none}
/* SIODMY raz ta sama pulapka (zgloszenie Pawla 2026-08-21, formatka „Nowe zdarzenie"): wiersz
   „Powtarzaj: bez konca" sterczal na formatce, mimo ze powtarzanie bylo ustawione na „Nie powtarza".
   `seriaSync()` ustawialo `hidden`, ale `.cfseria{display:flex}` je bilo. Kazde nowe `display:` na
   klasie chowanej atrybutem `hidden` MUSI dostac tu swoja linie. */
.cfseria[hidden]{display:none}

/* ...i druga polowa tego samego zgloszenia: pasek odpowiedzi ma trzy kontrolki (Wyslij + status + nadawca),
   a `.opisbar` jest `nowrap` — zmierzone przy karcie 365 px: wybor nadawcy konczyl sie 308 px ZA prawa
   krawedzia paska, czyli byl ucinany. Zawijamy zamiast ucinac (ten sam patch co `.plikakc` przy `.742`). */
#zadMailReply .opisbar{flex-wrap:wrap}

/* ADR-0023: dokupiony pakiet godzin widoczny PRZY PULI umowy (zgloszenie Pawla: "czemu nie widac pakietu") */
.umpakinfo{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0 4px;padding:8px 12px;
  background:var(--accent-soft);border-radius:8px;font-size:13px}
.umpakinfo .link{font-family:ui-monospace,Consolas,monospace;font-size:12px}

/* ADR-0023: kolumna "Dodatkowy pakiet" w rejestrze umow */
.pakpill{display:inline-block;padding:2px 9px;border-radius:999px;background:#e6f4f1;color:#0f8b7e;
  font-weight:700;font-size:12.5px;white-space:nowrap}

/* .740 (Pawel: "dalej nie wiem gdzie sa te aktywnosci") — przyciski akcji pliku ZAWIJAJA sie zamiast byc ucinane.
   Powod: 5 przyciskow potrzebuje ~470 px; przy wezszej kolumnie ostatni wychodzil poza komorke i znikal bez sladu.
   Wspolne dla rejestru Plikow, Raportow i list na kartach klienta/projektu/leada. */
.plikakc{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.plikakc>.btn{white-space:nowrap}

/* .743 PASEK PROPOZYCJI (szkic umowy czekajacy na podpis) — jedno miejsce zamiast szukania po przyciskach. */
.szkicbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;
  margin:10px 0 14px;padding:10px 14px;border-radius:12px;
  background:#fef6e7;border:1px solid #f0c674}
.szkicbar__l b{display:block;font-size:15px}
.szkicbar__l small{display:block;color:#6b5b3e;margin-top:2px}
.szkicbar__r{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
@media (prefers-color-scheme: dark){
  .szkicbar{background:#3a2f18;border-color:#7a6330}
  .szkicbar__l small{color:#d8c9a5}
}

/* ── MARKETING (ADR-0030) — tasma produkcji tresci. Tablica etapow uzywa klas Kanbana zadan
   (.zadkanban/.zadkcol/.zadkcard) dla PARYTETU wygladu; tu tylko to, czego tam nie ma. ── */
.mkt-tresc{margin-top:14px}
.mkt-pusto{color:var(--muted);font-size:13px;padding:14px;text-align:center;border:1px dashed var(--line);border-radius:10px;background:var(--panel2,#f6f5fb)}
.mkt-kalendarz{display:flex;flex-direction:column;gap:18px}
.mkt-mies h4{margin:0 0 8px;font-size:14px;color:var(--muted);text-transform:capitalize}
.mkt-mies{display:flex;flex-direction:column;gap:8px}
/* Ekran wyboru trybu — kwota MUSI byc widoczna zanim czlowiek kliknie "Utworz" (ADR-0033 d.9) */
.mkt-symulacja h4{margin:4px 0 10px;font-size:14px}
.mkt-tryby{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.mkt-tryb{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:9px 12px;cursor:pointer}
.mkt-tryb:hover{border-color:var(--accent)}
.mkt-tryb input{grid-row:span 2;accent-color:var(--accent)}
.mkt-tryb b{font-size:13px}
.mkt-tryb span{font-size:12px;color:var(--muted)}
.mkt-koszt{border:1px solid var(--line);border-radius:10px;padding:11px 13px;background:var(--panel2,#f6f5fb)}
.mkt-koszt__suma{font-size:14px}
.mkt-koszt__suma b{font-size:17px;color:var(--accent)}
.mkt-koszt__blad{color:var(--danger,#dc2626);font-size:13px}
.mkt-koszt__szczegoly{margin-top:7px;font-size:12px}
.mkt-koszt__szczegoly summary{cursor:pointer;color:var(--muted)}
.mkt-etapy{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.table--mini td{padding:5px 8px;font-size:13px;border-bottom:1px solid var(--line)}
.mkt-kanal{padding:5px 0;font-size:13px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* ZADANIE UPGRADE (039) — dodatkowe zaznaczenie w oknie "Zamknij zadanie": NIEBIESKIE tlo odroznia je
   od zwyklych statusow rozliczeniowych (fiolet btn--primary); wlaczone = pelny niebieski + biale litery. */
.zkupgb{background:#e8f3ff;border-color:#9ccafd;color:#0b62c4}
.zkupgb.is-on{background:#0091ff;border-color:#0091ff;color:#fff}
/* SORT PER KOLUMNA Kanbana (Pawel 2026-08-18): ↕ w naglowku kazdej kolumny; podswietlony (niebieski)
   = kolumna ma WLASNY porzadek, rozny od wspolnego "Sortuj". Wspolne dla zadan i plikow. */
.zadkcol__sortb{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:13px;line-height:1;padding:2px 4px;border-radius:6px}
.zadkcol__sortb:hover{background:#fff;color:var(--text)}
.zadkcol__sortb.akt{color:#0091ff;font-weight:800}
/* KONTAKT SPRAWY (migracja 041, zgloszenie Pawla 2026-08-19): przypieta osoba na wierzchu,
   reszta pod rozwijaczem. Wyroznienie subtelne — to nadal ta sama lista, nie osobny modul. */
.keykont__i--pin{background:var(--accent-soft);border-radius:7px;padding:6px 7px;margin:2px -3px}
.keykont__i--pin+.keykont__i{border-top:0}
.keykont__akc{grid-row:1;grid-column:2;display:flex;gap:2px;align-items:center}
.keykont__pin{opacity:.45}
.keykont__pin:hover{opacity:1}
.keykont__pin.akt{opacity:1}
.keykont__wiecej{display:block;width:100%;text-align:left;background:none;border:0;padding:5px 0 2px;
  font:inherit;font-size:12px;color:var(--muted);cursor:pointer}
.keykont__wiecej:hover{color:var(--accent)}
/* SZUKAJKA PULPITU (zgloszenie Lukasza Zarzyckiego 2026-08-19; miejsce poprawione przez Pawla tego
   samego dnia): siedzi W WIERSZU NAGLOWKA „Zadania otwarte", zeby NIE zabierac wysokosci listy.
   Naglowek jest szeroki i pusty po prawej — pole wchodzi dokladnie tam. Na waskim ekranie zawija sie
   pod naglowek (flex-wrap), zamiast sciskac tytul do jednej litery. */
.dash-hrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dash-hrow .dash-h{margin:0;flex:0 0 auto}
.dash-hrow__q{flex:1 1 220px;min-width:0;max-width:420px;padding:6px 11px;border:1px solid var(--line);
  border-radius:8px;background:var(--card);font:inherit;font-size:12.5px;color:var(--txt)}
.dash-hrow__q:focus{outline:none;border-color:var(--accent)}
.dash-hrow__i{font-size:12px;white-space:nowrap}
/* HISTORIA ZMIAN WPISU w dymku kalendarza (migracja 043) */
.cpop__hist{background:none;border:0;padding:0;font:inherit;font-size:12px;color:var(--accent);cursor:pointer}
.cpop__hist:hover{text-decoration:underline}
.cpop__histbox{margin:2px 0 6px;max-height:190px;overflow-y:auto}
.cpop__histi{font-size:12px;color:var(--txt);padding:4px 0;border-top:1px solid var(--line)}
.cpop__histi small{display:block;color:var(--muted);font-size:11px;margin-top:1px}
/* PRZECIAGANIE WPISOW KALENDARZA (zgloszenie Pawla 2026-08-19) */
.calev{touch-action:none}
.calev--drag{opacity:.85;box-shadow:0 10px 24px rgba(0,0,0,.28);z-index:40;cursor:grabbing}
body.cal-dragging{user-select:none;cursor:grabbing}
body.cal-dragging .calev:not(.calev--drag){pointer-events:none}   /* SASIEDNIE kafelki nie moga przechwytywac
   wskaznika, bo `elementFromPoint` musi trafic w KOLUMNE DNIA. ⚠️ Ciagniety kafelek zostaje klikalny —
   `pointer-events:none` na nim zerwaloby przechwycenie wskaznika i przeciaganie urwaloby sie w polowie. */
/* WIDOCZNY FILTR NA KOLUMNIE (zgloszenie Pawla 2026-08-19: „nie widac, czy filtr jest i na jakich
   kolumnach"). Naglowek filtrowanej kolumny dostaje BURSZTYNOWE tlo — kolor inny niz caly pasek,
   wiec widac go katem oka; do tego zapalony lejek i kreska u dolu, zeby dzialalo tez przy
   monochromatycznym widzeniu (nie opieramy sygnalu WYLACZNIE na kolorze). */
/* Kolor SELEDYNOWY liczony Z PALETY panelu, nie dobrany na oko: miekka miete miesza sie z akcentem
   (--accent), wiec siedzi w tej samej rodzinie co fioletowy pasek i nie krzyczy jak bursztyn
   (pierwsza wersja; Pawel: „kolor fatalny"). Napis ciemny — kontrast na jasnym tle. */
.zadtbl th.th--filtr{background:color-mix(in srgb, #7fd8c4 88%, var(--accent) 12%);color:#0d3b33;
  box-shadow:inset 0 -3px 0 color-mix(in srgb, var(--accent) 35%, #0d3b33)}
.zadtbl th.th--filtr .thlab{font-weight:800}
.zadtbl th.th--filtr .thsort,.zadtbl th.th--filtr .thfilt{color:#0d3b33}
.zadtbl th.th--filtr .thfilt.is-on{background:rgba(13,59,51,.18)}
.zadtbl th.th--filtr .thsort:hover,.zadtbl th.th--filtr .thfilt:hover{background:rgba(13,59,51,.26)}

/* ═══ NOTATNIK I SZUKANIE W CZACIE (.1107) ═══════════════════════════════════════════════════
   Notatnik to BRUDNOPIS, nie rozmowa — stąd brak kropki obecności i licznika nieprzeczytanych
   (liczenie „nieprzeczytanych od samego siebie” nie miałoby sensu). Oddzielony kreską od ludzi,
   żeby było widać, że to inny rodzaj miejsca — ta sama zasada co półka z opisami wersji. */
.czat-c--notes{border-bottom:1px solid var(--line,#e6e1d8);margin-bottom:4px;padding-bottom:8px}
.czat-c--notes .czat-av{background:var(--accent-soft,#EDE9FB);color:var(--accent,#6d5bd0)}
.czat-find{padding:6px 8px 2px;position:relative}
.czat-find input{width:100%;border:1px solid var(--line,#e6e1d8);border-radius:9px;padding:7px 10px;font:inherit;background:transparent;color:inherit}
.czat-find input:focus{outline:none;border-color:var(--accent,#6d5bd0)}
.czat-find__out{max-height:320px;overflow:auto;margin-top:6px;border:1px solid var(--line,#e6e1d8);border-radius:10px;background:var(--card,#fff)}
.czat-find__it{display:block;width:100%;text-align:left;border:none;border-bottom:1px solid var(--line,#e6e1d8);background:none;color:inherit;font:inherit;padding:7px 10px;cursor:pointer}
.czat-find__it:last-child{border-bottom:none}
.czat-find__it:hover,.czat-find__it:focus-visible{background:var(--accent-soft,#EDE9FB);outline:none}
.czat-find__it b{font-size:12px}
.czat-find__it span{float:right;font-size:11px;color:var(--muted,#9aa1b2);font-variant-numeric:tabular-nums}
.czat-find__it i{display:block;font-style:normal;font-size:12.5px;line-height:1.4;overflow-wrap:anywhere;margin-top:2px}
.czat-find__none{padding:8px 10px;font-size:13px;color:var(--muted,#9aa1b2)}
/* Zaznaczanie wiadomości TYLKO w notatniku — w rozmowie z człowiekiem checkboxy byłyby hałasem. */
.czat-zazn{display:none}
.czat-conv--notes .czat-zazn{display:inline-block;margin-right:6px;vertical-align:top;accent-color:var(--accent,#6d5bd0)}
.czat-notesbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 12px;background:var(--accent-soft,#EDE9FB);border-bottom:1px solid var(--line,#e6e1d8);font-size:13px}
.czat-notesbar #czatZaznIle{font-weight:800}
/* NOTATKA, KTORA POSZLA DO POMYSLU (.1108, Pawel: „niech nie znikaja z czata, tylko niech sie zmieni
   kolor tla na jakis seledyn"). Do .1107 przeniesiona notatka ZNIKALA i nie dalo sie odroznic tych,
   ktore poszly, od tych, ktore czekaja. Seledyn = ten sam kolor co filtrowany naglowek kolumny
   (#7fd8c4 / napis #0d3b33) — jeden jezyk kolorow w calym panelu, nie druga zielen.
   ⚠️ Musi bic `.czat-b.me`: w notatniku KAZDA notatka jest „moja", wiec domyslnie ma wypelniony
   akcent i bialy tekst — sam `background` bez nadpisania koloru pisma dalby biale na seledynie. */
.czat-b.is-pomysl,.czat-b.me.is-pomysl{background:color-mix(in srgb, #7fd8c4 42%, var(--card,#fff) 58%);
  color:#0d3b33;border-color:color-mix(in srgb, #7fd8c4 70%, #0d3b33 30%)}
.czat-b.me.is-pomysl .czat-b__c,.czat-b.me.is-pomysl .muted2{color:rgba(13,59,51,.72)}
.czat-b.me.is-pomysl .czat-file{color:#0d3b33}
.czat-b__pom{display:inline-block;margin-top:4px;border:1px solid rgba(13,59,51,.35);background:rgba(13,59,51,.10);
  color:#0d3b33;font:inherit;font-size:11px;font-weight:700;border-radius:999px;padding:1px 8px;cursor:pointer}
.czat-b__pom:hover,.czat-b__pom:focus-visible{background:rgba(13,59,51,.20);outline:none}

/* ═══ LICENCJE — zakładka karty klienta (.1110, zgłoszenia Pawła) ════════════════════════════════
   Seledyn (#7fd8c4) jest w tym panelu kolorem „patrz tutaj": filtrowany nagłówek kolumny, notatka
   przeniesiona do pomysłu, a teraz system główny i pola obowiązkowe. Jeden kolor = jedno znaczenie. */
/* SYSTEM GŁÓWNY — kafelek, nie pas przez cały ekran (.1111, Paweł: „ma na środku pełno miejsca,
   a na mniejszych ekranach też się nie mieści"). Rozciągnięty na 1600 px wiersz „Comarch ERP XL
   … Aktywna" to kilometr pustki w środku; ograniczamy szerokość do czytelnego kafla, a na wąskim
   ekranie `100%` i tak wygrywa, więc nic nie wystaje. */
.licsys{background:color-mix(in srgb, #7fd8c4 26%, var(--card,#fff) 74%);border:1px solid color-mix(in srgb, #7fd8c4 60%, #0d3b33 40%);
  max-width:min(100%,560px);min-width:0}
.licsys h3{color:#0d3b33}
.licsys .dl__row{gap:12px;align-items:baseline}
.licsys .dl__row span{flex:0 0 auto}
.licsys .dl__row b{min-width:0;overflow-wrap:anywhere}
/* Kafelki: NIGDY pasek przewijania w bok (.1111, Pawel: „na mniejszych ekranach się nie mieszczą").
   `minmax(min(100%,360px),1fr)` = kolumna nie może być szersza od kontenera, więc przy wąskim ekranie
   siatka SAMA schodzi do jednej kolumny — bez progów w media query, ktore trzeba zgadywać.
   `auto-fit` na szerokim monitorze daje trzy/cztery kolumny, przez co kafelek robi się BARDZIEJ
   KWADRATOWY (prośba Pawła) zamiast rozciągać wiersz „etykieta — — — wartość" przez pół ekranu. */
.licgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:12px;margin-top:10px;padding:0 2px;align-items:start}
.liccard{margin:0;min-width:0}
.liccard__h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:2px}
/* Długa wartość (np. „Serwerowa (dowolni użytkownicy)") ma się ZAWIJAĆ, a nie rozpychać kafelek —
   to ona wypychała siatkę poza ekran mimo elastycznych kolumn. */
.liccard .dl__row{gap:12px;align-items:baseline}
.liccard .dl__row span{flex:0 0 auto}
.liccard .dl__row b{min-width:0;overflow-wrap:anywhere}
.liccheck{display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.liccheck input{accent-color:var(--accent,#6d5bd0);cursor:pointer}
.liccheck--all{font-size:13px;color:var(--muted)}
/* EDYCJA NA KLIK — wartość ma WYGLĄDAĆ na klikalną, inaczej nikt nie zgadnie, że nią jest.
   Podkreślenie kropkowane zamiast przycisku: nie zabiera miejsca w gęstym wierszu. */
.licinl{cursor:pointer;border-bottom:1px dashed color-mix(in srgb, var(--accent,#6d5bd0) 45%, transparent);border-radius:3px;padding:0 2px}
.licinl:hover{background:color-mix(in srgb, #7fd8c4 30%, transparent)}
.licinl__f{font:inherit;border:1px solid var(--accent,#6d5bd0);border-radius:7px;padding:2px 6px;max-width:100%;background:#fff;color:var(--txt,#1d2333)}
/* POLA OBOWIĄZKOWE w formularzu — tło seledynowe + kropka przy etykiecie; `is-bad` po nieudanym zapisie. */
.cfgrow--req>label::after{content:" •";color:#0d3b33;font-weight:900}
.cfgrow--req input,.cfgrow--req select,.cfgrow--req textarea{background:color-mix(in srgb, #7fd8c4 22%, #fff 78%);border-color:color-mix(in srgb, #7fd8c4 65%, #0d3b33 35%)}
.cfgrow input.is-bad,.cfgrow select.is-bad{border-color:var(--danger,#dc2626);box-shadow:0 0 0 3px rgba(220,38,38,.16)}
.cfgnote--req{background:color-mix(in srgb, #7fd8c4 20%, #fff 80%);border:1px solid color-mix(in srgb, #7fd8c4 55%, #0d3b33 45%);color:#0d3b33;border-radius:10px;padding:8px 11px;font-size:13px}
/* SZERSZE OKNO FORMULARZA + koniec poziomego paska przewijania: pola w wierszach flex nie mogły
   zejść poniżej swojej treści (brak `min-width:0`), więc dwie kolumny rozpychały okno na 660 px.
   .1111 (Paweł: „dalej za wąska — przecież pod spodem nie pracujemy"): okno bierze niemal całą
   szerokość ekranu, bo w czasie wypełniania formularza i tak nic za nim nie robimy. Poniżej 820 px
   dwie kolumny przestają się mieścić po ludzku → schodzimy do JEDNEJ. Dzięki temu pasek przewijania
   w bok nie pojawia się na ŻADNEJ szerokości — przewijamy tylko w pionie, jak w każdym formularzu. */
.modalbox.addform--wide{width:min(1180px,97vw)}
/* .1120: okno JEDNOKOLUMNOWE — dla formatek, ktore nie sa formularzem o dwoch kolumnach pol,
   tylko krotkim wyborem z objasnieniem (nagrywanie ekranu, zapis nagrania). W siatce 2-kolumnowej
   objasnienia ladowaly obok pol i zjadaly polowe okna — zglosil Pawel: „jest ucieta, a napisy
   po lewej sa niepotrzebne, bo tu raczej nikt sie nie zgubi". */
.modalbox.addform--1kol .addform__b{grid-template-columns:minmax(0,1fr)}
.modalbox.addform--1kol{width:min(560px,94vw)}
.modalbox.addform .cfgrow input,.modalbox.addform .cfgrow select,.modalbox.addform .cfgrow textarea{min-width:0;max-width:100%}
.modalbox.addform .cfgrow>div{min-width:0}
.modalbox.addform .addform__b{overflow-x:hidden}
@media (max-width:820px){
  .modalbox.addform .addform__b{grid-template-columns:minmax(0,1fr)}
  .modalbox.addform--wide{width:min(1180px,98vw)}
}

/* ADR-0044 — POLE WGRYWANIA FAKTURY (Finanse → Zakupy). Zgloszenie Pawla 2026-08-21: "czy to jest
   ladne intuicyjne pole? Gdzie to mam wkleic poza ekranem???" — pierwsza wersja miala TYLKO zdanie
   w pasku ("przeciagnij plik w to okno"), czyli obiecywala cel, ktorego nie bylo widac. Tu jest
   WIDOCZNY obszar: mowi co upusc, przyjmuje klikniecie (wybor pliku) i podswietla sie przy
   przeciaganiu. Wersja --duza to pusty rejestr (glowny element ekranu), zwykla — pasek nad tabela. */
.fzdrop{display:flex;align-items:center;gap:14px;padding:14px 18px;margin-bottom:12px;cursor:pointer;
  border:2px dashed var(--line-strong);border-radius:14px;background:var(--soft);
  transition:border-color .12s,background .12s,box-shadow .12s}
.fzdrop:hover{border-color:var(--accent);background:var(--accent-soft)}
.fzdrop:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.fzdrop.is-drag{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 4px var(--accent-soft)}
.fzdrop__ikona{font-size:30px;line-height:1;flex:0 0 auto}
.fzdrop__t{font-weight:700;font-size:15px;color:var(--txt)}
.fzdrop__s{color:var(--muted);font-size:13px;margin-top:2px}
.fzdrop--duza{flex-direction:column;text-align:center;padding:34px 18px;gap:8px}
.fzdrop--duza .fzdrop__ikona{font-size:44px}
.fzdrop--duza .fzdrop__t{font-size:17px}
@media (max-width:820px){
  .fzdrop{flex-direction:column;text-align:center;padding:18px}
  .fzdrop--duza{padding:26px 14px}
}
/* .1355 (zgloszenie Lukasza Zarzyckiego): numer ticketu Zoho na karcie tablicy — ma byc widoczny
   od razu, ale NIE przykrywac tytulu: mniejszy, w kolorze akcentu, w jednej linii z nazwa. */
.zadkcard__zoho{font-weight:700;font-size:11px;color:var(--accent);text-decoration:none;white-space:nowrap}
a.zadkcard__zoho:hover{text-decoration:underline}
/* .1359 (prosba Pawla): skad pochodzi mail w zakladce „Inne" — znacznik folderu obok klienta i zadania.
   Ten sam jezyk wizualny co `pchip`, ale w innym kolorze: to nie jest przypisanie w CRM, tylko miejsce
   w skrzynce uzytkownika. Pelna sciezke („B2B/ExactSystems/ESKLEP") pokazujemy w podpowiedzi. */
.mailfld{display:inline-block;padding:1px 7px;border-radius:999px;background:var(--accent-soft,#eef0ff);color:var(--accent,#4b5bdc);font-size:11px;font-weight:600;white-space:nowrap;margin-left:4px}
/* .1364 (prosba Pawla): katalog z choc jednym NIEPRZECZYTANYM mailem — delikatnie inaczej.
   Nie krzykliwie: pogrubiona nazwa + cieply akcent obwodki i kropka. Wybrany katalog (.akt)
   zachowuje swoje wyroznienie — te dwa stany musza dac sie rozroznic naraz. */
.mailtag.ma-nowe{font-weight:700;border-color:var(--accent,#4b5bdc);background:var(--accent-soft,#eef0ff)}
.mailtag.ma-nowe::before{content:"●";color:var(--accent,#4b5bdc);font-size:9px;margin-right:5px;vertical-align:1px}
/* .1365 (prosba Pawla: „ten na ktorym jestem tez powinien sie wyrozniac — moze seledyn?"): WYBRANY
   katalog dostaje seledyn — TEN SAM `#7fd8c4`, co pola obowiazkowe w formularzach, zeby panel mowil
   jednym jezykiem kolorow. Regula stoi PO `.ma-nowe`, wiec wybor wygrywa wizualnie nad „sa nowe" —
   ale kropka nieprzeczytanych zostaje, bo te dwa stany trzeba widziec naraz. */
#mailFoldery .mailtag.akt{background:color-mix(in srgb, #7fd8c4 30%, #fff 70%);border-color:color-mix(in srgb, #7fd8c4 70%, #0d3b33 30%);color:#0d3b33;font-weight:700}
#mailFoldery .mailtag.akt.ma-nowe::before{color:#0d3b33}

/* ===== PYTANIA I ODPOWIEDZI (.1445) — jeden WYSOKI wiersz: pytanie na gorze, rozwiazanie pod nim.
   Zgloszenie Pawla 2026-08-30: „wyzszy wiersz i w tym samym wierszu na gorze pytanie na dole
   rozwiazanie — jedna szersza kolumna to pokaze". Wspolna regula tabel (`.zadtbl--cfg td`) tnie
   kazda komorke do JEDNEJ linii z wielokropkiem, wiec zdejmujemy ja WYLACZNIE dla tej kolumny
   i WYLACZNIE na tym ekranie — pozostale dziesiec rejestrow zostaje nietknietych.
   ⚠️ PRZYCINAMY STYLEM, NIE W JS: pelna tresc musi zostac w DOM-ie, bo szukajka listy czyta
   `tr.textContent`. Ucinanie w JS zwezilo by wyszukiwanie do poczatkow zdan. */
#vPytania .zadtbl--cfg td[data-col="para"]{white-space:normal;padding-top:11px;padding-bottom:11px;line-height:1.45}
#vPytania .qapyt{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer}
#vPytania .qarozw{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  margin-top:4px;color:var(--muted);font-weight:400}
/* TAGI — pigulki tematow wyznaczone slownikiem po stronie serwera. Komorka musi zawijac,
   bo wpis miewa trzy tagi; wspolna regula tabel tnie do jednej linii, wiec ja tu zdejmujemy. */
#vPytania .zadtbl--cfg td[data-col="tagi"]{white-space:normal;overflow:hidden}
.qatag{display:inline-block;margin:1px 4px 1px 0;padding:1px 8px;border-radius:999px;font-size:11px;font-weight:600;
  background:color-mix(in srgb, var(--violet) 12%, transparent);color:var(--violet);
  border:1px solid color-mix(in srgb, var(--violet) 28%, transparent);white-space:nowrap}
/* Przelacznik starych wpisow — ta sama waga wizualna co `.cfgnote`, ale klikalny. */
.qastare{display:inline-flex;align-items:center;gap:7px;margin-top:8px;padding:6px 11px;border:1px solid var(--line);
  border-radius:10px;background:var(--soft);font-size:12.5px;color:var(--muted);cursor:pointer;user-select:none}
.qastare:hover{border-color:var(--violet);color:var(--text)}
.qastare input{cursor:pointer;margin:0}

/* ===== FLOTA — „Zarządzanie instalacjami" (ADR-0053; redesign po uwadze Pawła 2026-09-01:
   „kokpit pilota XXII wieku — wchodzę i wszystko widzę, zarządzam", nie tabelka drobnym druczkiem).
   Estetyka = ekran startowy (.launcher): ciemna chroma + perspektywiczna siatka + poświaty. ===== */
.fl-kokpit{position:relative;overflow:hidden;border-radius:var(--radius-lg);padding:26px 28px 22px;
  background:radial-gradient(1100px 560px at 16% -12%,var(--ciemne) 0%,var(--ciemne-2) 60%);color:#fff;box-shadow:var(--sh-lg)}
.fl-kokpit::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-30%;height:55%;pointer-events:none;
  background-image:linear-gradient(rgba(124,92,252,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(124,92,252,.16) 1px,transparent 1px);
  background-size:46px 46px;transform:perspective(700px) rotateX(60deg);
  -webkit-mask-image:linear-gradient(to top,rgba(0,0,0,.75),transparent);mask-image:linear-gradient(to top,rgba(0,0,0,.75),transparent)}
.fl-kokpit>*{position:relative;z-index:1}
.fl-tyt{margin:0;font-size:27px;font-weight:800;letter-spacing:-.02em;line-height:1.15}
.fl-sub{margin:6px 0 0;font-size:14px;color:var(--ciemne-txt-slaby);max-width:860px}
.fl-wiek{display:inline-flex;align-items:center;gap:7px;margin-top:10px;padding:6px 13px;border-radius:999px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font-size:12.5px;color:var(--ciemne-txt)}
/* ORB statusu — świecąca kula */
.fl-orb{width:58px;height:58px;border-radius:50%;flex:none;position:relative}
.fl-orb--sm{width:44px;height:44px}
.fl-orb--ok{background:radial-gradient(circle at 32% 30%,#7cf2b0,var(--ok) 62%);box-shadow:0 0 26px rgba(21,160,90,.65),0 0 64px rgba(21,160,90,.35)}
.fl-orb--warn{background:radial-gradient(circle at 32% 30%,#ffd88a,var(--warn) 62%);box-shadow:0 0 26px rgba(217,119,6,.6),0 0 64px rgba(217,119,6,.32)}
.fl-orb--err{background:radial-gradient(circle at 32% 30%,#ff9d9d,var(--danger) 62%);box-shadow:0 0 26px rgba(220,38,38,.65),0 0 64px rgba(220,38,38,.35)}
.fl-orb--off{background:radial-gradient(circle at 32% 30%,#cbd5e1,#64748b 62%);box-shadow:0 0 18px rgba(100,116,139,.5)}
/* Pas wielkich wskaźników w hero */
.fl-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-top:18px}
.fl-stat{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:16px;cursor:default;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.fl-stat__num{font-size:36px;font-weight:800;line-height:1;letter-spacing:-.02em}
.fl-stat__lab{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--ciemne-txt-slaby)}
.fl-stat__sub{font-size:12.5px;color:var(--ciemne-txt);margin-top:3px}
.fl-stat--err{border-color:rgba(220,38,38,.55);background:rgba(220,38,38,.14)}
.fl-stat--warn{border-color:rgba(217,119,6,.5);background:rgba(217,119,6,.12)}
/* Wielkie piguły-zakładki */
.fl-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.fl-tab{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);color:#fff;font:inherit;
  font-size:15px;font-weight:700;padding:11px 24px;border-radius:999px;cursor:pointer;transition:all var(--tr)}
.fl-tab:hover{background:rgba(255,255,255,.14);transform:translateY(-1px)}
.fl-tab.is-active{background:var(--grad);border-color:transparent;box-shadow:0 8px 24px rgba(124,92,252,.5)}
/* „Do zerknięcia" — bursztynowa karta w kokpicie */
.fl-alert{margin-top:18px;padding:16px 20px;border-radius:16px;background:rgba(217,119,6,.14);
  border:1px solid rgba(217,119,6,.45)}
.fl-alert__tyt{font-size:15px;font-weight:800;letter-spacing:.02em;display:flex;align-items:center;gap:9px}
.fl-alert ul{margin:10px 0 0;padding-left:4px;list-style:none}
.fl-alert li{font-size:14.5px;line-height:1.45;padding:7px 0;border-top:1px solid rgba(255,255,255,.09);display:flex;gap:10px}
.fl-alert li:first-child{border-top:0}
.fl-ok-linia{margin-top:18px;font-size:15px;color:#7cf2b0;display:flex;align-items:center;gap:9px;font-weight:600}
/* Jasna strefa treści pod kokpitem */
.fl-body{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px 20px;margin-top:16px;box-shadow:var(--sh-md)}
/* Tabela floty — nadpisania rozmiarów silnika CFG TYLKO w tej strefie (parytet kontrolek zostaje) */
.fl-body .cfgtable td{padding:13px 14px;font-size:14.5px;vertical-align:middle}
.fl-body .cfgtable th{font-size:12px;letter-spacing:.06em;padding:11px 14px}
.fl-body .cfg-grp td{padding:10px 14px;font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:var(--soft)}
.fl-body .link b{font-size:15.5px}
/* Piguła statusu — kolorowe tło, nie sama kropka */
.fl-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;font-size:13.5px;font-weight:700;white-space:nowrap}
.fl-pill::before{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.fl-pill--ok{color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,#fff)}
.fl-pill--warn{color:var(--warn);background:color-mix(in srgb,var(--warn) 14%,#fff)}
.fl-pill--err{color:var(--danger);background:color-mix(in srgb,var(--danger) 12%,#fff)}
.fl-pill--off{color:#64748b;background:#f1f5f9}
/* Kafle karty instalacji (Przegląd) */
.fl-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.fl-tile{border-radius:16px;padding:16px 18px;border:1px solid var(--line);background:var(--panel);border-left:5px solid var(--line-strong)}
.fl-tile--ok{border-left-color:var(--ok);background:color-mix(in srgb,var(--ok) 5%,#fff)}
.fl-tile--warn{border-left-color:var(--warn);background:color-mix(in srgb,var(--warn) 6%,#fff)}
.fl-tile--err{border-left-color:var(--danger);background:color-mix(in srgb,var(--danger) 5%,#fff)}
.fl-tile__lab{font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:8px}
.fl-tile__val{font-size:19px;font-weight:800;margin-top:7px;letter-spacing:-.01em;line-height:1.25}
.fl-tile__sub{font-size:13px;color:var(--muted);margin-top:5px;line-height:1.45}
/* Wielkie przyciski akcji (hero karty) — rysowane ZAWSZE; nieczynne wyłączone z powodem (wzorzec Promptów) */
.fl-akcje{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.fl-btn{display:inline-flex;align-items:center;gap:9px;font:inherit;font-size:15px;font-weight:700;padding:12px 22px;
  border-radius:14px;cursor:pointer;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.1);color:#fff;transition:all var(--tr)}
.fl-btn:hover:not(:disabled){background:rgba(255,255,255,.18);transform:translateY(-1px)}
.fl-btn--primary{background:var(--grad);border-color:transparent;box-shadow:0 8px 24px rgba(124,92,252,.45)}
.fl-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.fl-btn__tag{font-size:10px;font-weight:800;letter-spacing:.06em;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.18)}
/* Chipy typu/RODO w hero */
.fl-chip{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;border-radius:999px;font-size:12.5px;font-weight:700;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);color:var(--ciemne-txt)}
.fl-chip--rodo{background:rgba(220,38,38,.16);border-color:rgba(220,38,38,.5);color:#ffb4b4}
/* Karty serwerów — maszynownia */
.fl-srvy{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}
.fl-srv{border-radius:18px;border:1px solid var(--line);background:var(--panel);padding:20px 22px;box-shadow:var(--sh-md)}
.fl-srv--milczy{outline:2px solid var(--danger);opacity:.85}
.fl-srv__glowa{display:flex;align-items:center;gap:14px}
.fl-srv__nazwa{font-size:18px;font-weight:800;letter-spacing:-.01em}
.fl-srv__typ{font-size:12.5px;color:var(--muted)}
.fl-gauge{margin-top:12px}
.fl-gauge__lab{display:flex;justify-content:space-between;font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:5px}
.fl-gauge__tor{height:14px;border-radius:999px;background:var(--soft);overflow:hidden}
.fl-gauge__pas{height:100%;border-radius:999px;transition:width .4s ease}
.fl-gauge--ok .fl-gauge__pas{background:linear-gradient(90deg,#34d399,var(--ok))}
.fl-gauge--warn .fl-gauge__pas{background:linear-gradient(90deg,#fbbf24,var(--warn))}
.fl-gauge--err .fl-gauge__pas{background:linear-gradient(90deg,#f87171,var(--danger))}
.fl-srv__meta{margin-top:12px;font-size:14px;display:flex;gap:16px;flex-wrap:wrap}
.fl-srv__meta b{font-size:16px}
.fl-srv details{margin-top:12px}
.fl-srv summary{cursor:pointer;font-weight:700;font-size:13.5px;color:var(--accent)}
@media (max-width:900px){
  .fl-kokpit{padding:20px 18px}
  .fl-tyt{font-size:22px}
  .fl-stat__num{font-size:30px}
  .fl-tab{padding:10px 16px;font-size:14px}
}