/* podlicz.pl – układ jak Resend (makieta zaakceptowana 23.10.2026). Kolory: czarno-biało jak ElevenLabs (24.10.2026 – indygo odrzucone).
   Menu z lewej: na górze przycisk z nazwą firmy i rolą (przełącznik), niżej grupy (Wydatki / Sprzedaż / Firma), na dole osoba i Wyloguj.
   Treść: duży tytuł działu z podsumowaniem, zakładki-pigułki, pasek narzędzi (szukanie, filtry, czarny przycisk „Dodaj…”), tabela bez ramki,
   stan jako kolorowa kropka + słowo. Tryb ciemny z ustawień systemu albo przyciskiem (słońce/księżyc) w menu i w Moje konto. Telefon ≤ 800 px: przełącznik u góry, zakładki działów na dole, plus jako okrągły przycisk.
   Mechanika bez zmian: ikony stron z belka.py (.tszuk/.tfiltr/.tdodaj/button.tjak) ustawia TEN plik w pasek narzędzi; szuflady z prawej; własna lista rozwijana (JS_LISTA).
   Wszystkie style podlicz.pl są TU (dawne CSS_TMASZ / CSS_KOSZTY / CSS_WLASNE / CSS w ekran_ksef są puste). */

:root{color-scheme:light dark;
  --tlo:#fff;--tlo2:#fafafa;--hover:#f3f3f3;--aktyw:#ececec;--linia:#e6e6e6;--linia2:#f0f0f0;
  --tekst:#171717;--szary:#6f6f6f;--szary2:#a3a3a3;--link:#171717;
  --akcent:#171717;--akcent-t:#fff;--akcent-h:#2e2e2e;
  --hg:#171717;--hg-tlo:rgba(0,0,0,.06);
  --ziel:#15803d;--ziel-tlo:#e7f6ec;--czerw:#c62828;--czerw-tlo:#fde8e8;--zolty:#b45309;--zolty-tlo:#fff4e0;--nieb:#2563eb;--nieb-tlo:#e8f0fe;
  --cien:0 1px 2px rgba(0,0,0,.04);--cien2:0 20px 60px rgba(0,0,0,.14),0 0 0 1px rgba(0,0,0,.04);--cien3:0 12px 32px rgba(0,0,0,.10),0 1px 2px rgba(0,0,0,.04);
  --licz-a:rgba(255,255,255,.22);--bw:240px;--r:10px;--r2:8px}
/* tryb ciemny: z ustawień systemu, chyba że osoba wybrała sama (data-motyw=jasny|ciemny – przycisk w Moje konto, zapis w localStorage, JS_MOTYW w ekran.py) */
@media (prefers-color-scheme:dark){:root:not([data-motyw=jasny]){
  --tlo:#000;--tlo2:#0a0a0a;--hover:#161616;--aktyw:#1f1f1f;--linia:#262626;--linia2:#1c1c1c;
  --tekst:#ededed;--szary:#a3a3a3;--szary2:#737373;--link:#ededed;
  --akcent:#ededed;--akcent-t:#0a0a0a;--akcent-h:#d4d4d4;
  --hg:#ededed;--hg-tlo:rgba(255,255,255,.08);
  --ziel:#4ade80;--ziel-tlo:#0c2a19;--czerw:#ff6b6b;--czerw-tlo:#3a1414;--zolty:#fbbf24;--zolty-tlo:#2f2306;--nieb:#7cb0ff;--nieb-tlo:#0f2246;
  --cien:none;--cien2:0 20px 60px rgba(0,0,0,.6),0 0 0 1px #262626;--cien3:0 12px 32px rgba(0,0,0,.5),0 0 0 1px #262626;--licz-a:rgba(0,0,0,.18)}}
:root[data-motyw=ciemny]{color-scheme:dark;
  --tlo:#000;--tlo2:#0a0a0a;--hover:#161616;--aktyw:#1f1f1f;--linia:#262626;--linia2:#1c1c1c;
  --tekst:#ededed;--szary:#a3a3a3;--szary2:#737373;--link:#ededed;
  --akcent:#ededed;--akcent-t:#0a0a0a;--akcent-h:#d4d4d4;
  --hg:#ededed;--hg-tlo:rgba(255,255,255,.08);
  --ziel:#4ade80;--ziel-tlo:#0c2a19;--czerw:#ff6b6b;--czerw-tlo:#3a1414;--zolty:#fbbf24;--zolty-tlo:#2f2306;--nieb:#7cb0ff;--nieb-tlo:#0f2246;
  --cien:none;--cien2:0 20px 60px rgba(0,0,0,.6),0 0 0 1px #262626;--cien3:0 12px 32px rgba(0,0,0,.5),0 0 0 1px #262626;--licz-a:rgba(0,0,0,.18)}
:root[data-motyw=jasny]{color-scheme:light}
html.zw{--bw:64px}

html{font-size:14px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--tlo);color:var(--tekst);font:14px/1.45 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--link);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--szary2)} a:hover{text-decoration-color:currentColor}
b,strong{font-weight:600}
svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
::placeholder{color:var(--szary2)}

/* ---------- pola i przyciski ---------- */
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=search],input[type=number],input[type=date],input[type=month],input:not([type]),select,textarea{
  font:inherit;color:var(--tekst);background:var(--tlo);border:1px solid var(--linia);border-radius:var(--r2);padding:0 10px;height:34px;box-sizing:border-box;outline:0;transition:border-color .12s,box-shadow .12s}
textarea{height:auto;min-height:4.5em;padding:8px 10px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--tekst);box-shadow:0 0 0 1px var(--tekst)}
input[type=file]{font:inherit;font-size:13px;color:var(--szary)}
button,.guzik,a.btn{font:inherit;font-size:13px;font-weight:600;line-height:1;height:34px;padding:0 14px;border:1px solid var(--akcent);border-radius:var(--r2);background:var(--akcent);color:var(--akcent-t);cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;white-space:nowrap;box-sizing:border-box;transition:background .12s,border-color .12s}
button:hover,.guzik:hover,a.btn:hover{background:var(--akcent-h);border-color:var(--akcent-h);text-decoration:none}
button.szary,.guzik.szary,a.btn,.gz.sz,button.sz{background:var(--tlo);border-color:var(--linia);color:var(--tekst);font-weight:500}
button.szary:hover,a.btn:hover,.gz.sz:hover,button.sz:hover{background:var(--hover);border-color:var(--linia)}
button:disabled{opacity:.45;cursor:not-allowed}
button.ziel{background:var(--akcent);border-color:var(--akcent);color:var(--akcent-t)}
.inline{display:inline} form.inline{display:inline-block;margin:0}
code,kbd{font:inherit;font-size:12.5px;background:var(--hover);border:1px solid var(--linia);border-radius:5px;padding:.05em .45em;white-space:nowrap}

/* ---------- pasek boczny ---------- */
body.zbok{padding-left:var(--bw);transition:padding-left .18s ease}
aside.bok{position:fixed;left:0;top:0;bottom:0;width:var(--bw);box-sizing:border-box;z-index:50;display:flex;flex-direction:column;overflow:visible;
  background:var(--tlo);border-right:1px solid var(--linia);font-size:14px;padding:16px 12px 12px;gap:10px;transition:width .18s ease}
aside.bok .menu-tg{display:none}
/* przełącznik firmy / roli */
details.ws{position:relative;flex:0 0 auto} details.ws summary{list-style:none;display:flex;align-items:center;gap:10px;height:44px;padding:0 10px;box-sizing:border-box;border:1px solid var(--linia);border-radius:var(--r);background:var(--tlo);cursor:pointer;user-select:none}
details.ws summary::-webkit-details-marker{display:none} details.ws.stat summary{cursor:default;pointer-events:none} details.ws summary:hover,details.ws[open] summary{background:var(--tlo2)} details.ws[open] summary{border-color:var(--szary2)}
details.ws .zn,.wsl .zn{width:26px;height:26px;border-radius:7px;background:var(--akcent);color:var(--akcent-t);font-size:11px;font-weight:700;letter-spacing:.02em;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
details.ws .op,.wsl .op{display:flex;flex-direction:column;min-width:0;flex:1 1 auto;line-height:1.2} details.ws .op b,.wsl .op b{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
details.ws .op small,.wsl .op small{font-size:11px;color:var(--szary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} details.ws summary>svg{width:16px;height:16px;color:var(--szary);flex:0 0 auto}
.wsl{position:fixed;left:12px;top:66px;width:300px;max-width:calc(100vw - 24px);box-sizing:border-box;padding:6px;background:var(--tlo);border:1px solid var(--linia);border-radius:12px;box-shadow:var(--cien3);z-index:80;display:flex;flex-direction:column;gap:2px}
.wsl form{margin:0;display:block}
.wsl .poz{display:flex;align-items:center;gap:10px;width:100%;height:48px;padding:0 10px;box-sizing:border-box;border:0;border-radius:var(--r2);background:none;color:var(--tekst);text-decoration:none;font:inherit;text-align:left;cursor:pointer}
.wsl .poz:hover{background:var(--hover)} .wsl .poz.a{background:var(--hover)} .wsl .poz>svg{width:16px;height:16px;flex:0 0 auto;color:var(--tekst)}
.wsl .poz.dodaj{height:40px;color:var(--szary);font-size:13px;font-weight:500;border-top:1px solid var(--linia2);border-radius:0;margin-top:4px;padding-top:4px} .wsl .poz.dodaj svg{margin:0 5px;color:var(--szary)}
aside.bok small.sek,.wsl small.sek{display:block;font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--szary2);text-transform:uppercase;padding:14px 10px 6px} .wsl small.sek{padding:8px 10px 4px}
aside.bok nav.poz{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:2px;scrollbar-width:none} aside.bok nav.poz::-webkit-scrollbar{display:none}
aside.bok nav.poz a,aside.bok .dol a,aside.bok .dol button{display:flex;align-items:center;gap:10px;height:36px;padding:0 10px;box-sizing:border-box;border-radius:var(--r2);
  color:var(--szary);text-decoration:none;font-weight:500;line-height:1.2;width:100%;font-size:14px;background:none;border:0;cursor:pointer;text-align:left;flex:0 0 auto}
aside.bok nav.poz a:hover,aside.bok .dol a:hover,aside.bok .dol button:hover{background:var(--hover);color:var(--tekst);text-decoration:none}
aside.bok nav.poz a.a{background:var(--aktyw);color:var(--tekst);font-weight:600}
aside.bok svg{width:18px;height:18px;flex:0 0 18px;stroke-width:1.6} aside.bok nav.poz a.a svg{color:var(--tekst)}
aside.bok a .t,aside.bok .dol button .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:opacity .12s}
aside.bok .licz{margin-left:auto;background:var(--aktyw);color:var(--tekst);border-radius:999px;padding:0 7px;font-size:11px;font-weight:600;line-height:18px;min-width:18px;text-align:center;box-sizing:border-box}
aside.bok nav.poz a.a .licz{background:var(--akcent);color:var(--akcent-t)}
aside.bok .podt{display:none} aside.bok nav.poz a.tel{display:none}
aside.bok .dol{flex:0 0 auto;display:flex;flex-direction:column;gap:2px;padding-top:10px;border-top:1px solid var(--linia2)}
aside.bok .dol .aw{width:22px;height:22px;border-radius:50%;background:var(--aktyw);color:var(--tekst);font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;margin:0 -2px}
aside.bok .dol form{display:flex;align-items:center;margin:0;gap:2px} aside.bok .dol form button{flex:1 1 auto;min-width:0}
button.motyw svg:nth-of-type(2){display:none} @media (prefers-color-scheme:dark){:root:not([data-motyw=jasny]) button.motyw svg:nth-of-type(1){display:none} :root:not([data-motyw=jasny]) button.motyw svg:nth-of-type(2){display:inline-block}}
:root[data-motyw=ciemny] button.motyw svg:nth-of-type(1){display:none} :root[data-motyw=ciemny] button.motyw svg:nth-of-type(2){display:inline-block}
.konto button.motyw{margin-top:10px} .konto button.motyw svg{width:16px;height:16px}
aside.bok .dol .zwin{flex:0 0 36px;width:36px;padding:0;justify-content:center;color:var(--szary2)} aside.bok .dol .zwin:hover{color:var(--tekst)}
aside.bok .wer{display:block;font-size:11px;color:var(--szary2);white-space:nowrap;padding:6px 10px 0}
aside.bok .gb.dzk{margin-left:auto;font-size:10.5px;font-weight:600;letter-spacing:.04em;color:var(--szary);border:1px solid var(--linia);border-radius:5px;padding:0 5px;line-height:17px;background:var(--tlo)}
html.zw aside.bok{padding:16px 10px 12px} html.zw aside.bok .t,html.zw aside.bok .wer,html.zw aside.bok .gb.dzk,html.zw aside.bok small.sek,html.zw details.ws .op,html.zw details.ws summary>svg,html.zw aside.bok .dol form button:first-child{display:none}
html.zw details.ws summary{padding:0 8px;justify-content:center} html.zw aside.bok nav.poz a,html.zw aside.bok .dol a{padding:0 12px}
html.zw aside.bok nav.poz a{position:relative} html.zw aside.bok .licz{position:absolute;top:2px;right:2px;margin:0;font-size:10px;padding:0 5px;line-height:15px;min-width:15px}
html.zw .wsl{width:280px;left:10px}

/* ---------- górna belka (jak panel Hegard, 08.11.2026): ZAWSZE --belka (60px) wysokości na każdej stronie – tyle samo co nagłówek szuflady .szh (właściciel 08.11.2026: pasek nie może skakać między stronami); przyklejona u góry; z lewej tytuł działu i podsumowanie, z prawej akcje strony
   (lupa .tszuk, lejek .tfiltr, czarny „Dodaj…” .tdodaj, „?” button.tjak (belka.pomoc) – ekran._zloz wycina je z treści i wstawia do .nagn); pod belką zakładki-pigułki ---------- */
main#m{min-width:0;position:relative}
header.nag{--belka:60px;position:sticky;top:0;z-index:40;padding:0 40px;background:var(--tlo);border-bottom:1px solid var(--linia);box-sizing:border-box}
header.nag .nagw{display:flex;align-items:center;justify-content:space-between;gap:16px;height:var(--belka);padding:0;box-sizing:border-box;overflow:hidden}   /* bez max-width: akcje strony stoją przy PRAWEJ krawędzi (właściciel 08.11.2026) */
header.nag .nagt{min-width:0;overflow:hidden} header.nag h1{margin:0;font-size:19px;font-weight:600;letter-spacing:-.02em;line-height:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} header.nag h1 small{font-size:13px;font-weight:500;color:var(--szary);letter-spacing:0}
header.nag p.gstat{margin:0;height:18px;color:var(--szary);font-size:13px;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
header.nag .nagn{display:flex;align-items:center;gap:14px;flex:0 0 auto;margin-left:auto} header.nag .nagn .tszuk{width:15rem}
header.nag button.tdodaj{background:var(--akcent);border-color:var(--akcent);color:var(--akcent-t);font-weight:600} header.nag button.tdodaj:hover,header.nag button.tdodaj.a{background:var(--akcent-h);border-color:var(--akcent-h)}
details.zwin{margin-top:18px} details.zwin summary{cursor:pointer;color:var(--szary);font-size:13px;font-weight:500;list-style:none} details.zwin summary::before{content:"›";display:inline-block;width:14px;transition:transform .12s} details[open].zwin summary::before{transform:rotate(90deg)} details.zwin summary:hover{color:var(--tekst)}
.gstat b{color:var(--tekst);font-weight:600} .gstat b.z{color:var(--ziel)} .gstat b.c{color:var(--czerw)} .gstat b.u{color:var(--zolty)}
.gstat .gkom{display:inline-block;margin-right:8px;padding:0 9px;border-radius:999px;font-weight:500;font-size:12.5px;line-height:18px;vertical-align:top}
.gstat .gkom.ok{background:var(--ziel-tlo);color:var(--ziel)} .gstat .gkom.blad{background:var(--czerw-tlo);color:var(--czerw)} .gstat .gkom a{color:inherit}
p.gstat{margin:.4rem 0 .8rem;color:var(--szary);font-size:13.5px}
nav.grupa{display:flex;align-items:center;gap:4px;flex-wrap:wrap;padding:16px 40px 0;box-sizing:border-box} nav.grupa .mies{margin-right:12px}   /* ‹ miesiąc › po lewej + zakładki w jednym rzędzie (właściciel 08.11.2026) */
nav.grupa a{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:999px;color:var(--szary);font-weight:500;font-size:13px;white-space:nowrap;text-decoration:none}
nav.grupa a:hover{background:var(--hover);color:var(--tekst)} nav.grupa a.a{background:var(--akcent);color:var(--akcent-t);font-weight:600}
nav.grupa a .licz{background:var(--aktyw);color:var(--tekst);border-radius:999px;padding:0 6px;font-size:11px;font-weight:600;line-height:18px} nav.grupa a.a .licz{background:var(--licz-a);color:inherit}

/* ---------- treść strony: pasek narzędzi z ikon belka.py, potem tabela ---------- */
.biuro{padding:0 40px 3rem} .biuro .uz{max-width:76rem;padding-top:18px;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.biuro .uz>*{flex:1 1 100%;min-width:0;margin-top:0;margin-bottom:0}
.biuro .uz>style,.biuro .uz>script,.biuro .uz>form[hidden],.biuro .uz>.szuf{flex:0 0 0;display:none}
.biuro .uz>.szuf{display:flex}
.biuro .uz>p.gstat{order:-3} .biuro .uz>p.gstat:empty{display:none}
.biuro .uz>table{margin-top:12px}
.opis{color:var(--szary);margin:.2rem 0 1rem;max-width:62rem;line-height:1.5} .opis b{color:var(--tekst)}
.wroc{display:inline-block;margin:0 0 .8rem;font-size:13px;color:var(--szary);text-decoration:none} .wroc:hover{color:var(--tekst)}
.biuro p.ok{background:var(--ziel-tlo);color:var(--ziel);font-weight:500;padding:.55rem .9rem;border-radius:var(--r2);margin:.3rem 0 1rem}
.tblad{background:var(--czerw-tlo);color:var(--czerw);font-weight:500;padding:.55rem .9rem;border-radius:var(--r2);margin:.3rem 0 1rem}
.biuro .link{background:var(--zolty-tlo);border:1px solid var(--zolty);color:var(--tekst);padding:.6rem .9rem;border-radius:var(--r2);margin:.3rem 0 1rem;word-break:break-all;font-size:13px}
.czeka{color:var(--zolty)} .tmsz{color:var(--szary2)}
.uzup{background:var(--zolty-tlo);border:1px solid var(--zolty);color:var(--tekst);padding:.55rem .9rem;border-radius:var(--r2);margin:16px 40px 0;max-width:76rem;box-sizing:border-box;font-size:13.5px} .uzup a{color:var(--link);font-weight:500}
#offline{display:none;position:fixed;left:0;right:0;bottom:0;padding:.6rem 1rem;background:var(--czerw);color:#fff;font-weight:600;z-index:200}
.err{background:var(--czerw-tlo);color:var(--czerw);padding:.5rem 1rem}
/* stany: kolorowa kropka + słowo (Resend) */
.dz,.ds,.dk,.stan,.db{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;line-height:20px;white-space:nowrap;vertical-align:middle;color:var(--tekst)}
.dz::before,.ds::before,.dk::before,.stan::before,.db::before{content:"";width:7px;height:7px;border-radius:50%;flex:0 0 auto;background:var(--szary2)}
.dz::before,.stan.ok::before{background:var(--ziel)} .ds::before{background:var(--zolty)} .dk::before,.stan.zle::before{background:var(--czerw)} .stan.brak{color:var(--szary)} .db{color:var(--szary);font-size:12.5px}
.gb{display:inline-block;min-width:1.4em;padding:0 .3em;border-radius:4px;background:var(--aktyw);color:var(--szary);text-align:center;font-weight:600;font-size:11px;line-height:18px;letter-spacing:.03em}

/* pasek narzędzi: lupa jako pole z ikoną, lejek i plus z napisem (title), „?” jako okrągły przycisk */
button.tik,a.tik{height:34px;padding:0 12px;display:inline-flex;align-items:center;gap:8px;border:1px solid var(--linia);border-radius:var(--r2);background:var(--tlo);color:var(--tekst);cursor:pointer;box-sizing:border-box;font-size:13px;font-weight:500}
button.tik svg,a.tik svg{width:15px;height:15px;stroke-width:1.9;flex:0 0 auto} button.tik:hover,a.tik:hover{background:var(--hover);text-decoration:none}
button.tik.a,a.tik.a{background:var(--aktyw)} button.tik.jest{border-color:var(--tekst)} button.tik.jest::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--tekst);order:2}
button.tfiltr::after,button.tdodaj::after{content:attr(title)}
.tszuk{position:relative;display:inline-flex;align-items:center;width:17rem;max-width:100%;margin:0}
.tszuk input{width:100%;height:34px;padding:0 30px 0 34px;font-size:13px} .tszuk.akt input{border-color:var(--tekst)}
/* chip z klawiszem skrótu („F” = skocz do szukaj, JS_BELKA); znika, gdy pole ma fokus albo tekst; na dotyku nie ma sensu */
.tszuk kbd.sk{position:absolute;right:7px;top:50%;transform:translateY(-50%);min-width:20px;height:20px;padding:0 5px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--linia);border-radius:5px;background:var(--tlo2);color:var(--szary);font:500 11.5px/1 inherit;font-family:inherit;pointer-events:none}
.tszuk:focus-within kbd.sk,.tszuk.akt kbd.sk{display:none} @media (hover:none){.tszuk kbd.sk{display:none} .tszuk input{padding-right:10px}}
.tszuk button.tik{position:absolute;left:1px;top:1px;height:32px;width:32px;padding:0;justify-content:center;border:0;background:none;color:var(--szary)} .tszuk button.tik:hover{color:var(--tekst)}
button.tjak{width:34px;height:34px;padding:0;border-radius:50%;justify-content:center;color:var(--szary);font-size:14px;font-weight:600;flex:0 0 auto} button.tjak.a{background:var(--akcent);border-color:var(--akcent);color:var(--akcent-t)}   /* „?” = belka.pomoc: ta sama szuflada co plus i lejek */
.szuf .szh button.tik{border:0;background:none;box-shadow:none;font-size:18px;width:30px;height:30px;padding:0;justify-content:center} .szuf .szh button.tik:hover{background:var(--hover)}

/* tabela bez ramki: cienkie linie, szary nagłówek, wiersz ~44 px */
table{width:100%;border-collapse:collapse;border-spacing:0;font-size:14px;table-layout:auto}
th{text-align:left;color:var(--szary);font-weight:500;font-size:12px;padding:0 12px 10px;white-space:nowrap;border-bottom:1px solid var(--linia)}
td{padding:11px 12px;border-bottom:1px solid var(--linia2);vertical-align:middle;white-space:normal;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
/* 08.11.2026 (właściciel): ZAKAZ tabeli wewnętrznej – tabela to lista strony na całą szerokość, nigdy ramka przewijana w bok. Tekst w komórkach się łamie; daty, kwoty i ikony (td.d – belka.tabela, td.n, td.ik) nie. */
table.tmasz{width:100%;max-width:none;table-layout:auto} tr.razem td{border-bottom:0;padding:14px 12px;text-align:right;font-size:14px;color:var(--szary)} tr.razem td b{font-weight:600;color:var(--tekst);font-size:15px} tr.razem td small{display:inline;margin-left:8px;color:var(--szary2)} td.d,td.n,td.ik,td .stan,td .dz,td .ds,td .dk,td .db{white-space:nowrap} td.d{width:1%}
tbody tr:hover td{background:var(--tlo2)}
td b{font-weight:500;color:var(--tekst)} td small{display:block;color:var(--szary);font-size:12px;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
td .op{display:block;max-width:22em;overflow:hidden;text-overflow:ellipsis} td small{max-width:22em}   /* dwa rzędy w komórce: opis z „…” */
/* 08.11.2026 (właściciel): ikony w wierszu ZAWSZE na tym samym miejscu – brak załącznika = wyszarzony spinacz, brak kosza = puste miejsce tej samej szerokości; nic się nie przesuwa */
td.ik{white-space:nowrap} td.ik>*{display:inline-flex;width:22px;justify-content:center;margin:0 4px 0 0;vertical-align:middle} td.ik form.ikf{gap:0}
td .tmik.wyl{color:var(--linia);cursor:default} td .tmik.wyl:hover{color:var(--linia)} td .tmik.zal{cursor:pointer}
td .zr{cursor:pointer;text-decoration:underline;text-underline-offset:3px} td .mailz{display:inline-flex;vertical-align:middle;color:var(--szary);margin-left:5px;cursor:help} td .mailz svg{width:14px;height:14px}
/* podgląd pliku / faktury w szufladzie z prawej (iframe na całą szufladę), link „w nowej karcie” u dołu */
#szuf-podglad:has(iframe){width:min(56rem,94vw)} .szuf .pgl:has(iframe){flex:1 1 auto;display:flex;flex-direction:column;min-height:0;margin:-20px}
.szuf .pgl iframe{flex:1 1 auto;width:100%;border:0;min-height:50vh;background:#fff} .szuf .pgl dl.szcz{margin:6px 0 10px;padding:0 20px;max-width:none} .szuf .pgl p.pgo.opis{border-top:0;color:var(--szary)} .szuf .pgl p.pgo{margin:0;padding:10px 20px;border-top:1px solid var(--linia);font-size:13px} .szuf .pgl p.pgo.uw{color:var(--czerw);line-height:1.45} .szuf .pgl p.pgo.uw b{color:var(--czerw)}
.szuf .pgl form.dol{margin:0;padding:10px 20px;border-top:1px solid var(--linia);display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap} .szuf .pgl form.dol label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--szary)} .szuf .pgl form.dol input[type=file]{font-size:13px} .szuf .pgl p.pgo.uw{color:var(--czerw);line-height:1.45} .szuf .pgl p.pgo.uw b{color:var(--czerw)}
.szuf .pgl form.dol{margin:0;padding:10px 20px;border-top:1px solid var(--linia);display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap} .szuf .pgl form.dol label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--szary)} .szuf .pgl form.dol input[type=file]{font-size:13px}
/* 08.11.2026: tabele na całą szerokość (właściciel: lista za wąska / ucięta); pasek narzędzi składa po stronie serwera ekran._zloz → header.nag .nagn */
header.nag{max-width:none} .biuro .uz:has(>table){max-width:none}
th.n,td.n{text-align:right} tr.wyl td{color:var(--szary2)} tr.wyl td b{color:var(--szary)}
th.gbk,td.gbk{width:1.6rem;padding-right:0} tr[data-href],tr[data-podglad]{cursor:pointer}
td .tmik{color:var(--szary);display:inline-flex;align-items:center;vertical-align:middle;line-height:0;text-decoration:none;font-size:12.5px;margin-right:.5rem} td .tmik:hover{color:var(--tekst)}
td .tmik svg{width:15px;height:15px} td a.tmik:not(:has(svg)){line-height:1.2;text-decoration:underline;text-underline-offset:3px}
td .tik.olt{display:inline-flex;width:16px;height:16px;min-height:0;padding:0;margin:0;border:0;background:none;box-shadow:none;color:var(--szary2);vertical-align:middle;line-height:0;flex:none} td .tik.olt:hover{color:var(--czerw)}
td .tik.olt svg{width:14px;height:14px}
td form.ikf{display:inline-flex;gap:6px;align-items:center;margin:0;vertical-align:middle}
td .gz{height:28px;padding:0 10px;font-size:12.5px} td .gzi,td select.gzi{height:28px;font-size:12.5px;padding:0 8px;width:11em}
#szuf-jak .szt{font-size:14px;line-height:1.55} #szuf-jak p{margin:0 0 .6rem} #szuf-jak p b{color:var(--tekst)} #szuf-jak kbd{white-space:normal}

/* karty i formularze na stronie (Firma, Użytkownik, KSeF, Moje konto, Firmy klientów) */
.karta,.konto section{background:var(--tlo);border:1px solid var(--linia);border-radius:12px;padding:20px 22px;margin:0 0 14px;max-width:60rem;box-shadow:var(--cien);box-sizing:border-box}
.karta h2,.konto h2{margin:0 0 14px;font-size:16px;font-weight:600;letter-spacing:-.01em;display:flex;align-items:center;gap:10px;flex-wrap:wrap} .karta h2 small{color:var(--szary);font-weight:400;font-size:13px}
.karta.firma{max-width:none;display:flex;flex-direction:column;gap:14px;padding:18px 20px} .karta.firma.zamk{background:var(--tlo2)}
.karta.firma .glowa{display:flex;align-items:center;gap:12px;flex-wrap:wrap} .karta.firma .glowa h2{margin:0} .karta.firma .glowa .kto{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}
.karta.firma .glowa .kto span{color:var(--szary);font-size:13px} .karta.firma .glowa .zn{width:32px;height:32px;border-radius:8px;background:var(--akcent);color:var(--akcent-t);font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.karta.firma.zamk .glowa .zn{background:var(--aktyw);color:var(--tekst)} .karta.firma .glowa a.btn,.karta.firma .glowa button{height:32px;padding:0 12px;font-size:13px;font-weight:500;background:var(--tlo);border-color:var(--linia);color:var(--tekst)}
.karta.firma .glowa a.btn:hover,.karta.firma .glowa button:hover{background:var(--hover)} .karta.firma .glowa form{margin:0}
.karta.firma .kwoty{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;padding-top:14px;border-top:1px solid var(--linia2)}
.karta.firma .kw{font-size:12px;color:var(--szary);display:flex;flex-direction:column;gap:3px;min-width:0} .karta.firma .kw b{font-size:16px;font-weight:600;color:var(--tekst);font-variant-numeric:tabular-nums;letter-spacing:-.01em;white-space:nowrap}
.karta.firma .kw b.sl{font-size:14px;font-weight:500;white-space:normal}
/* Moje konto – „Pierwsze kroki”: pasek postępu, kółko ✓ / numer, tytuł, opis, formularz */
.konto .pasek{height:4px;border-radius:999px;background:var(--aktyw);margin:-4px 0 18px;overflow:hidden} .konto .pasek i{display:block;height:100%;background:var(--akcent);border-radius:999px}
ol.kroki{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0}
ol.kroki .krok{display:flex;gap:14px;padding:16px 0;border-top:1px solid var(--linia2)} ol.kroki .krok:first-child{border-top:0;padding-top:4px} ol.kroki .krok>div{flex:1 1 auto;min-width:0}
ol.kroki .nr{flex:0 0 28px;width:28px;height:28px;border-radius:50%;border:1px solid var(--linia);display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:600;color:var(--szary);margin-top:-2px}
ol.kroki .krok.ok .nr{background:var(--ziel);border-color:var(--ziel);color:#fff} ol.kroki .krok.akt .nr{background:var(--akcent);border-color:var(--akcent);color:var(--akcent-t)}
ol.kroki h3{margin:0 0 2px;font-size:15px;font-weight:600;letter-spacing:-.01em} ol.kroki .krok.ok h3{color:var(--szary)} ol.kroki p.opis{margin:0 0 10px;font-size:13.5px}
ol.kroki form.pola{margin-top:6px}
form.pola{display:grid;grid-template-columns:10rem minmax(0,1fr);gap:10px 16px;align-items:start;max-width:46rem} form.pola label.t{color:var(--szary);font-size:13px;padding-top:8px} form.pola>span{padding-top:8px}
form.pola .guziki{grid-column:2;display:flex;gap:8px;flex-wrap:wrap;margin-top:6px} form.pola input[type=text],form.pola input[type=email],form.pola input[type=tel],form.pola input[type=password],form.pola select{width:100%}
form.pola input[style*=width],form.pola input[type=date]{width:auto} form.pola>.opis{grid-column:1/-1;margin:0}
.dodatkowe{margin-top:16px;padding-top:14px;border-top:1px solid var(--linia);display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.konto ul.adresy{list-style:none;margin:0 0 12px;padding:0;max-width:46rem} .konto ul.adresy li{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:9px 0;border-top:1px solid var(--linia2);font-size:14px} .konto ul.adresy li:first-child{border-top:0} .konto ul.adresy form{margin:0}
.konto ul.adresy .ad{min-width:0;overflow:hidden;text-overflow:ellipsis;font-weight:500} .konto ul.adresy .st{font-size:12px;color:var(--ziel);white-space:nowrap} .konto ul.adresy .st.czeka{color:var(--szary)} .konto ul.adresy .tag{font-size:11px;color:var(--szary);border:1px solid var(--linia);border-radius:999px;padding:1px 7px;line-height:1.4}
.konto ul.adresy li>button.link,.konto ul.adresy li>form:not(.zm){margin-left:auto} .konto ul.adresy li.dod>button.link{margin-left:0} .konto ul.adresy li.dod .opis{margin:0}
.konto ul.adresy form.zm{display:none;flex-basis:100%;margin:4px 0 2px} .konto ul.adresy li.otw form.zm{display:grid} .konto ul.adresy li.otw>button.link{display:none}
main button.link,.konto button.link{height:auto;width:auto;padding:0;background:none;border:0;color:var(--link);font-size:13px;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--szary2);cursor:pointer;box-shadow:none}
.konto form.pola{margin-top:4px} .konto form.pola>button{grid-column:2;justify-self:start;margin-top:6px}
.nipstan{font-size:12px;color:var(--ziel);display:inline-block;margin-left:8px} .nipstan.zle{color:var(--czerw)} form.pola .nipstan{display:block;margin:4px 0 0}
.wcz{background:var(--nieb-tlo);border:1px solid var(--nieb);border-radius:var(--r2);padding:.6rem .8rem;font-size:13px;line-height:1.5} .wcz button{height:28px;font-size:12.5px;padding:0 10px;background:var(--tlo);border-color:var(--linia);color:var(--tekst);vertical-align:middle}
.upusc{position:fixed;inset:0;background:var(--nieb-tlo);outline:3px dashed var(--nieb);outline-offset:-14px;display:none;place-items:center;z-index:300;font-size:1.4rem;font-weight:600;color:var(--tekst);text-align:center;padding:2rem;pointer-events:none;backdrop-filter:blur(2px)} .upusc.akt{display:grid}

/* formularz w szufladzie (etykieta nad polem) */
.szform{display:grid;gap:14px} .szform label{display:grid;gap:5px;font-size:12.5px;font-weight:500;color:var(--szary)} .szform label input,.szform label select,.szform label textarea{width:100%;color:var(--tekst)}
.szform small{font-weight:400;font-size:12px;color:var(--szary2)} .szform .nipstan{margin:0}
.szform button.zap,.szform>button{justify-self:start}

/* ---------- lista wierszy (belka.lista) i etykieta–wartość (belka.szczegoly) – zamiast tabel w szufladzie, na karcie, w szczegółach (zakaz tabel wewnętrznych 08.11.2026; wzór Mobbin: Mercury, Twenty) ---------- */
ul.lst{list-style:none;margin:0 0 12px;padding:0;max-width:60rem} ul.lst li{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--linia2);font-size:14px} ul.lst li:first-child{border-top:0}
ul.lst .lt{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:1px} ul.lst .lt b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} ul.lst .lt small{color:var(--szary);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
ul.lst .lp{flex:0 0 auto;white-space:nowrap;font-variant-numeric:tabular-nums;font-size:13.5px;color:var(--tekst)} ul.lst .lp b{font-weight:500}
ul.lst .la{flex:0 0 auto;min-width:22px;display:flex;justify-content:flex-end} ul.lst .la form{margin:0} ul.lst .la .gz{height:28px;padding:0 10px;font-size:12.5px}
.szuf ul.lst{max-width:none}
dl.szcz{margin:4px 0 12px;padding:0;max-width:60rem;display:flex;flex-direction:column} dl.szcz>div{display:grid;grid-template-columns:11rem minmax(0,1fr);gap:12px;padding:8px 0;border-top:1px solid var(--linia2);font-size:14px} dl.szcz>div:first-child{border-top:0}
dl.szcz dt{color:var(--szary);font-size:13px;margin:0} dl.szcz dd{margin:0;min-width:0;overflow-wrap:anywhere}
.szuf dl.szcz>div{grid-template-columns:8rem minmax(0,1fr)}

/* ---------- okienko potwierdzenia usunięcia (skrypty.JS_POTWIERDZ; wzór Mobbin: Elicit, Navan) ---------- */
.pot{position:fixed;inset:0;z-index:95;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(2px)} .pot.otw{display:flex}
.pot .potk{background:var(--tlo);border:1px solid var(--linia);border-radius:16px;box-shadow:var(--cien2);width:min(26rem,100%);padding:28px 24px 20px;text-align:center;box-sizing:border-box}
.pot .poti{width:48px;height:48px;border-radius:50%;background:var(--czerw-tlo);color:var(--czerw);display:inline-flex;align-items:center;justify-content:center;margin-bottom:14px} .pot .poti svg{width:22px;height:22px;stroke-width:1.8}
.pot h3{margin:0 0 6px;font-size:16px;font-weight:600;letter-spacing:-.01em;line-height:1.35} .pot p{margin:0 0 20px;color:var(--szary);font-size:13.5px}
.pot .potg{display:flex;gap:8px;justify-content:center} .pot .potg button{height:36px;padding:0 18px;font-size:13.5px;margin:0} .pot button.czer{background:var(--czerw);border-color:var(--czerw);color:#fff} .pot button.czer:hover{filter:brightness(.92)}

/* ---------- szuflada z prawej (dodawanie, filtry, instrukcja) ---------- */
.szuf{--belka:60px;position:fixed;top:0;right:0;bottom:0;width:27rem;max-width:92vw;z-index:70;box-sizing:border-box;display:flex;flex-direction:column;background:var(--tlo);border-left:1px solid var(--linia);
  transform:translateX(102%);visibility:hidden;transition:transform .18s ease,visibility 0s .18s} .szuf.szer{width:36rem}
.szuf.otw{transform:none;visibility:visible;transition:transform .18s ease;box-shadow:var(--cien2)}
.szuf .szh{height:var(--belka);flex:0 0 var(--belka);box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0 12px 0 20px;border-bottom:1px solid var(--linia)} .szuf .szh b{font-size:16px;font-weight:600;letter-spacing:-.01em}
.szuf .szt{flex:1 1 auto;min-height:0;overflow:auto;padding:20px;display:flex;flex-direction:column}
.szuf .szt>form{flex:1 1 auto;display:flex;flex-direction:column;gap:14px} .szuf .szt>form>button,.szuf form.pola .guziki,.szuf .szform .guz{margin-top:auto}
.szuf form.pola{display:flex;flex-direction:column;gap:5px;align-items:stretch;max-width:none} .szuf form.pola label.t{margin-top:10px;font-size:12.5px;font-weight:500}
.szuf form.pola>input,.szuf form.pola>select,.szuf form.pola>div>input{width:100%}
/* stała stopka szuflady (belka._szuflada stopka=…): przyciski nie jadą z treścią; przycisk wysyła formularz z treści przez form="id" */
.szuf .szd{flex:0 0 auto;display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap;padding:12px 20px;border-top:1px solid var(--linia);background:var(--tlo)}
.szuf .szd button,.szuf .szd a.btn{height:36px;padding:0 18px;font-size:13.5px}
/* strefa „przeciągnij plik tutaj albo kliknij” (belka.upusc) */
.upz{display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center;padding:22px 16px;border:1.5px dashed var(--linia);border-radius:var(--r);background:var(--tlo2);cursor:pointer;font-size:13px;line-height:1.45;color:var(--szary)}
.upz:hover,.upz:focus-visible{border-color:var(--tekst);background:var(--hover);outline:0} .upz svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-bottom:4px;color:var(--tekst)}
.upz b{font-size:14px;font-weight:600;color:var(--tekst)} .upz small{font-size:12.5px;max-width:28rem}
.szuf form.pola .opis{margin:0 0 6px;font-size:13px}
.szuf h2{display:none} .szuf .pgl{font-size:14px;line-height:1.55}

/* własna lista rozwijana (JS_LISTA) */
.lw{position:relative;display:inline-block;vertical-align:middle;max-width:100%;box-sizing:border-box;font-size:13.5px;font-weight:400;text-align:left;line-height:1.25;color:var(--tekst)} .szform .lw,.szuf form.pola .lw{display:block;width:100%!important}
.lw [hidden]{display:none!important}
.lw .lwp{display:flex;align-items:center;justify-content:space-between;gap:8px;height:34px;background:var(--tlo);border:1px solid var(--linia);border-radius:var(--r2);padding:0 10px;cursor:pointer;box-sizing:border-box;user-select:none;white-space:nowrap;outline:0}
td .lw .lwp{height:28px;padding:0 8px;font-size:12.5px} .lw .lwp:hover{background:var(--tlo2)} .lw .lwp.wyl{color:var(--szary2);cursor:not-allowed}
.lw.otw .lwp,.lw .lwp:focus-visible{border-color:var(--tekst);box-shadow:0 0 0 1px var(--tekst)}
.lw .lwt{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.lw .lwp::after{content:"";flex:none;width:.4rem;height:.4rem;border-right:1.6px solid var(--szary);border-bottom:1.6px solid var(--szary);transform:rotate(45deg);margin:-.2rem .1rem 0 0} .lw.otw .lwp::after{transform:rotate(-135deg);margin-top:.2rem}
.lw .lwl{position:fixed;z-index:90;display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box;max-width:min(26rem,calc(100vw - 16px));background:var(--tlo);border:1px solid var(--linia);border-radius:var(--r);box-shadow:var(--cien3)}
.lw input.lwi,.lw input.lwi:focus{flex:none;width:auto!important;min-width:0;margin:0!important;height:36px;font-size:13.5px;background:none!important;border:0!important;border-bottom:1px solid var(--linia)!important;border-radius:0!important;padding:0 12px!important;box-shadow:none!important}
.lw .lwk{display:block;overflow-y:auto;overscroll-behavior:contain;padding:4px}
.lw .lwk small{display:block;padding:8px 10px 3px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--szary2)}
.lw .lwo{display:block;padding:7px 10px;border-radius:5px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--tekst)}
.lw .lwo:hover,.lw .lwo.k{background:var(--hover)} .lw .lwo.a{background:var(--aktyw);font-weight:500} .lw .lwo.wyl{color:var(--szary2);cursor:default;background:none}

/* ---------- KSeF i faktury ---------- */
.ksf .krok{counter-reset:k;max-width:46rem;padding-left:1.3rem;margin:.4rem 0 .8rem} .ksf .krok li{margin:0 0 .55rem;line-height:1.55;color:var(--tekst)} .ksf .krok b{font-weight:600}
.ksf textarea{width:100%;min-height:4.5em;font-size:13px;word-break:break-all}
/* edytor pozycji faktury / oferty: siatka wierszy (.pw), nie tabela – nagłówek .ph szary jak th */
.pozycje{margin:.4rem 0;display:flex;flex-direction:column} .pozycje .pw{display:grid;grid-template-columns:minmax(10rem,3fr) 4.5rem 5rem 7rem 6.5rem 6.5rem 6.5rem;gap:6px;align-items:center;padding:4px 0;border-bottom:1px solid var(--linia2)}
.pozycje .ph{font-size:12px;color:var(--szary);font-weight:500;padding-bottom:8px;border-bottom:1px solid var(--linia)} .pozycje .n{text-align:right} .pozycje span.n{font-variant-numeric:tabular-nums;font-size:13.5px}
.pozycje input,.pozycje select{width:100%;height:30px;font-size:13px;box-sizing:border-box} .pozycje .lw{width:100%!important} .pozycje .lw .lwp{height:30px} .pozycje input.n{text-align:right}
.ksf .suma{font-size:14px;margin:.6rem 0 .8rem;color:var(--szary)} .ksf .suma b{color:var(--tekst);font-size:16px}
.ksf form.fakt{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:12px 16px;max-width:64rem;margin-top:4px} .ksf form.fakt label{display:grid;gap:5px;font-size:12.5px;font-weight:500;color:var(--szary)}
.ksf form.fakt input,.ksf form.fakt select{width:100%;color:var(--tekst)} .ksf form.fakt .caly{grid-column:1/-1} .ksf form.fakt .guziki{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:4px}
.ksf form.fakt .gkom.blad{background:var(--czerw-tlo);color:var(--czerw);padding:.5rem .8rem;border-radius:var(--r2);margin:0} .ksf form.fakt .gkom a{color:inherit}
.ksf form.fakt button[data-dodaj-wiersz]{background:var(--tlo)!important;border:1px solid var(--linia)!important;color:var(--tekst)!important;padding:0 12px!important;height:30px!important;font-size:12.5px!important;margin-top:4px}
.ksf form.fakt .wroc{margin:0}

/* ---------- ekrany bez logowania: pół na pół (ciemna strona + formularz) ---------- */
/* wejście (logowanie, rejestracja, pierwsze konto): z lewej ciemny pas z logo i krótkim opisem, z prawej formularz (makieta „jak Resend” z 23.10.2026, przywrócona 24.10 na prośbę właściciela) */
body.wej{min-height:100vh;margin:0;display:flex;flex-wrap:wrap;background:var(--tlo)}
body.wej aside.lewa{flex:1 1 480px;min-width:0;box-sizing:border-box;padding:48px 56px;background:#0a0a0a;color:#ededed;--hg:#ededed;--tlo:#0a0a0a;--szary:#8f8f8f;display:flex;flex-direction:column;justify-content:space-between;gap:40px;min-height:100vh}
body.wej aside.lewa .logo{display:block;height:28px;color:#ededed;text-decoration:none} body.wej aside.lewa .logo svg{height:28px;width:auto;stroke:none}
body.wej aside.lewa .haslo{max-width:440px;display:flex;flex-direction:column;gap:18px} body.wej aside.lewa h2{margin:0;font-size:34px;font-weight:600;letter-spacing:-.03em;line-height:40px}
body.wej aside.lewa .haslo p{margin:0;font-size:15px;line-height:24px;color:#a3a3a3} body.wej aside.lewa p.stopka{margin:0;font-size:13px;color:#737373}
body.wej main{flex:1 1 480px;min-width:0;box-sizing:border-box;padding:48px 56px;display:flex;flex-direction:column;justify-content:center;align-items:center}
body.wej main>*{width:100%;max-width:360px} body.wej main .logo.tel{display:none}
body.wej h1{margin:0 0 6px;font-size:24px;font-weight:600;letter-spacing:-.02em} body.wej p{margin:0 0 14px;color:var(--szary);font-size:14px;line-height:1.5} body.wej p b{color:var(--tekst)}
body.wej form{display:grid;gap:14px;margin:10px 0 0} body.wej label{display:grid;gap:6px;font-size:13px;font-weight:500;color:var(--tekst)} body.wej label br{display:none}
body.wej input{width:100%;height:44px;font-size:16px;border-radius:var(--r);padding:0 14px} body.wej input.kod{font-size:24px;letter-spacing:.3em;height:52px;text-align:center}
body.wej button{height:44px;font-size:14px;width:100%;border-radius:var(--r)} body.wej details{margin-top:18px} body.wej summary{cursor:pointer;color:var(--szary);font-size:13.5px;list-style:none;display:flex;align-items:center;gap:6px}
body.wej summary::before{content:"";width:.35rem;height:.35rem;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(-45deg);margin:0 2px 0 1px;transition:transform .12s} body.wej details[open] summary::before{transform:rotate(45deg)}
body.wej summary::-webkit-details-marker{display:none} body.wej details form{margin-top:12px}
body.wej p.blad{background:var(--czerw-tlo);color:var(--czerw);padding:.6rem .9rem;border-radius:var(--r2)} body.wej p.ok{background:var(--ziel-tlo);color:var(--ziel);padding:.6rem .9rem;border-radius:var(--r2)}
body.wej p.dol{margin:18px 0 0;font-size:13px;line-height:20px} body.wej .nipstan{margin:0}
body.wej form.ponow{display:block;margin:6px 0 0} body.wej button.link{height:auto;width:auto;padding:0;background:none;border:0;color:var(--link);font-size:13px;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--szary2);cursor:pointer}

/* ---------- telefon ≤ 800 px: przełącznik u góry, działy na dole, plus jako okrągły przycisk, tabele jako karty ---------- */
@media (max-width:800px){
 body.zbok{padding:0 0 76px}
 aside.bok{display:contents}
 details.ws{position:sticky;top:0;z-index:60;background:var(--tlo);padding:10px 12px;border-bottom:1px solid var(--linia)} details.ws summary{height:40px}
 .wsl{left:12px;right:12px;top:56px;width:auto}
 aside.bok nav.poz{position:fixed;left:0;right:0;bottom:0;z-index:60;flex-direction:row;align-items:stretch;gap:0;padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:var(--tlo);border-top:1px solid var(--linia);overflow-x:auto}
 aside.bok nav.poz small.sek,aside.bok nav.poz .podt{display:none} aside.bok nav.poz a.tel{display:flex}
 aside.bok nav.poz a{flex:1 1 0;min-width:56px;flex-direction:column;justify-content:center;gap:4px;height:52px;padding:4px 0;font-size:10px;font-weight:500;color:var(--szary2);border-radius:var(--r2);position:relative}
 aside.bok nav.poz a.a{background:none;color:var(--tekst)} aside.bok nav.poz a svg{width:22px;height:22px;flex:0 0 22px} aside.bok nav.poz a .t{flex:0 0 auto;overflow:visible}
 aside.bok nav.poz .licz{position:absolute;top:2px;right:calc(50% - 22px);margin:0;font-size:10px;padding:0 5px;line-height:15px;min-width:15px;background:var(--akcent);color:var(--akcent-t)}
 aside.bok .dol,aside.bok>script{display:none}
 header.nag{padding:0 16px;top:61px} header.nag .nagw{flex-wrap:wrap;height:auto;min-height:var(--belka);padding:8px 0;row-gap:8px;overflow:visible} header.nag .nagn{flex:1 1 100%;margin-left:0} header.nag .nagn .tszuk{flex:1 1 auto;width:auto} header.nag .nagn:empty{display:none} nav.grupa{padding:12px 16px 0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none} nav.grupa::-webkit-scrollbar{display:none}
 .uzup{margin:12px 16px 0}
 .biuro{padding:0 16px 3rem} .biuro .uz{padding-top:14px}
 body.zbok button.tdodaj{position:fixed;right:16px;bottom:92px;z-index:65;width:56px;height:56px;padding:0;border-radius:16px;justify-content:center;box-shadow:0 8px 24px rgba(0,0,0,.18);margin:0} header.nag button.tdodaj::after{display:none}
 header.nag button.tdodaj svg{width:24px;height:24px;stroke-width:2}
 .szuf{width:auto!important;max-width:none!important;left:0} .szuf.otw .szh{padding-left:16px} .szuf .szt{padding:16px} .szuf .szd{padding:12px 16px calc(12px + env(safe-area-inset-bottom))} .szuf .szd>button,.szuf .szd>a{flex:1 1 auto}
 form.pola{grid-template-columns:minmax(0,1fr)} form.pola .guziki{grid-column:1} .konto form.pola>button{grid-column:1}
 .karta,.konto section{padding:16px} .karta.firma .kwoty{grid-template-columns:repeat(2,minmax(0,1fr))}
 main input,main select,main textarea{max-width:100%} main form{max-width:100%}
 main table.kt,main table.kt tbody,main table.kt tr{display:block;width:auto!important} main table.kt colgroup,main table.kt thead,main table.kt tr.glowa{display:none}
 main table.kt tr{border:1px solid var(--linia);border-radius:var(--r);margin:0 0 10px;padding:8px 12px;background:var(--tlo)}
 main table.kt td,main table.kt tbody th{display:flow-root;padding:4px 0 4px 38%!important;border:0!important;width:auto!important;min-width:0!important;max-width:none!important;height:auto!important;border-radius:0!important;
   white-space:normal!important;overflow:visible!important;text-align:left!important;background:none!important;overflow-wrap:anywhere}
 main table.kt td::before,main table.kt tbody th::before{content:attr(data-l);float:left;margin:.1rem 0 0 -61.3%;width:56%;color:var(--szary);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;line-height:1.3}
 main table.kt td[data-l=""],main table.kt td:not([data-l]){padding-left:0!important} main table.kt td[data-l=""]::before{display:none}
 main table.kt td small{white-space:normal!important;overflow:visible!important} main table.kt td>div,main table.kt td>form,main table.kt td>span,main table.kt td>label{flex-wrap:wrap;max-width:100%}
 main table.kt td input,main table.kt td select{max-width:100%} main table.kt td label,main table.kt td button{flex:none;overflow-wrap:normal}
 .pozycje .ph{display:none} .pozycje .pw{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:4px;padding:8px 0} .pozycje .pw>input[name=p_nazwa]{grid-column:1/-1}
 dl.szcz>div{grid-template-columns:1fr;gap:2px} ul.lst li{flex-wrap:wrap} ul.lst .lt{flex-basis:100%}
 body.wej aside.lewa{display:none} body.wej main{padding:40px 20px;justify-content:flex-start} body.wej main .logo.tel{display:block;height:26px;margin:0 0 28px;color:var(--tekst)} body.wej main .logo.tel svg{height:26px;width:auto;stroke:none}
}

/* ---------- przełącznik miesiąca (belka.miesiac, 08.11.2026; wzór Mobbin: Copilot Money – siatka 12 miesięcy, Monarch – strzałki): ‹ listopad 2026 ▾ › ---------- */
.mies{display:inline-flex;align-items:center;gap:2px;flex:0 0 auto!important;position:relative;margin:0}
.biuro .uz>.mies{order:-2;flex:0 0 auto}
.mies .mk{display:inline-flex;align-items:center;justify-content:center;width:32px;height:34px;border:1px solid var(--linia);border-radius:var(--r2);color:var(--szary);text-decoration:none;font-size:18px;line-height:1;background:var(--tlo)}
.mies .mk:hover{background:var(--hover);color:var(--tekst)}
.mies details.mw{position:relative} .mies details.mw summary{list-style:none;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 12px;min-width:11em;justify-content:center;border:1px solid var(--linia);border-radius:var(--r2);background:var(--tlo);font-size:13.5px;font-weight:600;cursor:pointer;user-select:none;text-transform:capitalize;white-space:nowrap}
.mies details.mw summary::-webkit-details-marker{display:none} .mies details.mw summary::after{content:"";width:.38rem;height:.38rem;border-right:1.6px solid var(--szary);border-bottom:1.6px solid var(--szary);transform:rotate(45deg);margin:-3px 0 0}
.mies details.mw summary:hover,.mies details.mw[open] summary{background:var(--hover)} .mies details.mw[open] summary{border-color:var(--tekst)}
.mies .mwl{position:absolute;left:50%;top:40px;transform:translateX(-50%);z-index:90;width:17rem;box-sizing:border-box;padding:10px;background:var(--tlo);border:1px solid var(--linia);border-radius:12px;box-shadow:var(--cien3)}
.mies .mwr{display:flex;align-items:center;justify-content:space-between;margin:0 0 8px} .mies .mwr b{font-size:14px;font-weight:600}
.mies .mwr button{width:30px;height:30px;padding:0;border:0;border-radius:var(--r2);background:none;color:var(--szary);font-size:18px;font-weight:400} .mies .mwr button:hover{background:var(--hover);color:var(--tekst)}
.mies .mwg{display:grid;grid-template-columns:repeat(4,1fr);gap:4px} .mies .mwg a{display:flex;align-items:center;justify-content:center;height:34px;border-radius:var(--r2);text-decoration:none;font-size:13px;font-weight:500;color:var(--tekst)}
.mies .mwg a:hover{background:var(--hover)} .mies .mwg a.a{background:var(--akcent);color:var(--akcent-t);font-weight:600}
.mies .mwd{display:flex;gap:14px;justify-content:center;margin:10px 0 0;padding-top:10px;border-top:1px solid var(--linia2)} .mies .mwd a{font-size:12.5px;color:var(--szary);text-decoration:none} .mies .mwd a:hover,.mies .mwd a.a{color:var(--tekst);text-decoration:underline}

/* ---------- lista „Do zrobienia” (ekran_zadania, 08.11.2026; wzór Mobbin: Xero Expenses, Remote „Things to do”): sekcja = nagłówek z licznikiem + wiersze;
   wiersz = ikona rodzaju · kto / co (2 linie) · spinacz · dzień · kwota · stan · JEDEN przycisk – wszystko w stałych kolumnach ---------- */
.sek{margin:14px 0 0} .sek h2{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:15px;font-weight:600;letter-spacing:-.01em}
.sek h2 .licz{background:var(--aktyw);color:var(--tekst);border-radius:999px;padding:0 7px;font-size:11.5px;font-weight:600;line-height:19px;min-width:19px;text-align:center;box-sizing:border-box}
.sek>p.opis{margin:0 0 8px;font-size:13px} .sek p.pusto{margin:0;padding:10px 12px;border:1px dashed var(--linia);border-radius:var(--r2);color:var(--ziel);font-size:13px} .sek p.pusto::before{content:"✓ ";font-weight:600}
details.sek.zwin{margin-top:22px} details.sek.zwin summary{cursor:pointer;color:var(--szary);font-size:13px;font-weight:500;list-style:none} details.sek.zwin summary::before{content:"›";display:inline-block;width:14px;transition:transform .12s} details.sek.zwin[open] summary::before{transform:rotate(90deg)} details.sek.zwin summary:hover{color:var(--tekst)}
details.sek.zwin[open] summary{margin-bottom:6px}
ul.zad{list-style:none;margin:0;padding:0;border:1px solid var(--linia);border-radius:var(--r);background:var(--tlo);overflow:hidden}
ul.zad li.zd{display:grid;grid-template-columns:32px minmax(0,1fr) 22px 6.5em 9em minmax(9em,auto) max-content;align-items:center;gap:0 12px;padding:9px 12px;border-top:1px solid var(--linia2);min-height:52px;box-sizing:border-box}
ul.zad li.zd:first-child{border-top:0} ul.zad li.zd:hover{background:var(--tlo2)}
ul.zad .zi{width:32px;height:32px;border-radius:8px;background:var(--aktyw);color:var(--szary);display:inline-flex;align-items:center;justify-content:center} ul.zad .zi svg{width:16px;height:16px;stroke-width:1.7}
ul.zad li.bank .zi{background:var(--nieb-tlo);color:var(--nieb)} ul.zad li.sprzedaz .zi{background:var(--ziel-tlo);color:var(--ziel)} ul.zad li.rata .zi{background:var(--zolty-tlo);color:var(--zolty)}
ul.zad .zo{min-width:0;display:flex;flex-direction:column;gap:1px;line-height:1.3} ul.zad .zo b{font-weight:500;color:var(--tekst);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} ul.zad .zo small{color:var(--szary);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
ul.zad .zp{display:inline-flex;width:22px;height:22px;align-items:center;justify-content:center;color:var(--szary);cursor:pointer;border-radius:5px} ul.zad .zp:hover{background:var(--hover);color:var(--tekst)} ul.zad .zp svg{width:15px;height:15px}
ul.zad .zp.wyl{color:var(--linia);cursor:default} ul.zad .zp.wyl:hover{background:none;color:var(--linia)}
ul.zad .zdz{color:var(--szary);font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
ul.zad .zk{text-align:right;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;letter-spacing:-.01em} ul.zad .zk.c{color:var(--tekst)} ul.zad .zk.z{color:var(--ziel)} ul.zad .zk small{font-weight:400;color:var(--szary);font-size:11.5px}
ul.zad .zs{min-width:0;overflow:hidden} ul.zad .zs>span{max-width:100%;overflow:hidden;text-overflow:ellipsis}
ul.zad .za{display:flex;justify-content:flex-end;min-width:10.5em} ul.zad .za form{margin:0} ul.zad .za .gz{height:30px;padding:0 12px;font-size:12.5px} ul.zad .za a.btn.gz{height:30px}
ul.zad .za .szuf{display:flex}
.szform a.btn{justify-self:start} .szform>small{margin-top:-10px;color:var(--szary2);font-size:12px}
.konto ul.adresy form.zm .guziki2{grid-column:2;display:flex;gap:8px;flex-wrap:wrap} .konto ul.adresy li.cof .ad{color:var(--szary);font-weight:400} .konto ul.adresy li.cof form{margin-left:auto}
@media (max-width:800px){
 .biuro .uz>.mies{flex:1 1 100%;justify-content:center} .mies details.mw{flex:1 1 auto} .mies details.mw summary{width:100%;box-sizing:border-box}
 ul.zad li.zd{grid-template-columns:32px minmax(0,1fr) 22px auto;grid-template-areas:"i o p k" "i s s s" "i z z z" ". a a a";row-gap:6px}
 ul.zad .zi{grid-area:i;align-self:start} ul.zad .zo{grid-area:o} ul.zad .zp{grid-area:p} ul.zad .zk{grid-area:k} ul.zad .zdz{grid-area:z} ul.zad .zs{grid-area:s} ul.zad .za{grid-area:a;justify-content:flex-start}
 ul.zad .za .gz,ul.zad .za a.btn.gz,ul.zad .za form,ul.zad .za form button{width:100%}
 .konto ul.adresy form.zm .guziki2{grid-column:1}
}