:root{--tlo:#f2f4f7;--karta:#fff;--tekst:#1c2430;--cichy:#66717f;--linia:#dde2e8;--akcent:#1f5fbf;--akcent-c:#174a96;--ok:#1e8449;--ok-tlo:#e3f4e9;--uwaga:#a86b00;--uwaga-tlo:#fff3d6;--zle:#c0392b;--zle-tlo:#fde8e6;--szary-tlo:#e9edf1;--cien:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.1);--promien:8px}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,sans-serif;color:var(--tekst);background:var(--tlo);-webkit-text-size-adjust:100%}
body.modal-otwarty{overflow:hidden}
a{color:var(--akcent)}
h1,h2,h3{margin:0 0 .5rem;font-weight:600;line-height:1.25}
h1{font-size:1.4rem}h2{font-size:1.15rem}h3{font-size:1.05rem}
p{margin:.3rem 0 .6rem}
.cichy{color:var(--cichy)}
.mono{font-family:ui-monospace,Consolas,"Liberation Mono",monospace}
.lamanie{word-break:break-all}
.srodek{text-align:center}
.naglowek{display:flex;align-items:center;gap:1rem;padding:.55rem 1rem;background:#fff;border-bottom:1px solid var(--linia);position:sticky;top:0;z-index:5;flex-wrap:wrap}
.marka{font-weight:700;font-size:1.05rem;white-space:nowrap}
.marka .cichy{font-weight:400}
.nawigacja{display:flex;gap:.25rem;flex:1}
.zakladka{background:none;border:0;padding:.45rem .8rem;border-radius:var(--promien);cursor:pointer;font:inherit;color:var(--tekst)}
.zakladka:hover{background:var(--szary-tlo)}
.zakladka.aktywna{background:var(--akcent);color:#fff}
.uzytkownik{display:flex;align-items:center;gap:.6rem;margin-left:auto}
.tresc{max-width:1280px;margin:0 auto;padding:1rem}
.pasek{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.8rem}
.pasek h2{margin:0}
.odstep{flex:1}
.karta{background:var(--karta);border:1px solid var(--linia);border-radius:var(--promien);box-shadow:var(--cien);padding:1rem;margin-bottom:.8rem}
.siatka{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.siatka .karta{margin:0}
.odstep-gora{margin-top:.8rem}
.przycisk{font:inherit;padding:.45rem .85rem;border-radius:var(--promien);border:1px solid var(--linia);background:#fff;color:var(--tekst);cursor:pointer;white-space:nowrap}
.przycisk:hover{background:var(--szary-tlo)}
.przycisk:disabled{opacity:.55;cursor:default}
.przycisk.glowny{background:var(--akcent);border-color:var(--akcent);color:#fff}
.przycisk.glowny:hover{background:var(--akcent-c)}
.przycisk.niebezpieczny{color:var(--zle);border-color:#efb9b3}
.przycisk.niebezpieczny:hover{background:var(--zle-tlo)}
.przycisk.maly{padding:.25rem .6rem;font-size:.85rem}
.przycisk.szeroki{width:100%}
.akcje-siatka{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.5rem;margin-top:.8rem}
.pole{display:block;margin-bottom:.75rem}
.pole>span{display:block;font-size:.85rem;color:var(--cichy);margin-bottom:.2rem}
input,select,textarea{font:inherit;width:100%;padding:.5rem .6rem;border:1px solid #c9d1da;border-radius:6px;background:#fff;color:var(--tekst)}
input:focus,select:focus{outline:2px solid #9dbdf0;border-color:var(--akcent)}
input[type=checkbox]{width:auto;margin:0}
.wiersz-pol{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.pole-wybor{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}
.podpowiedz{font-size:.8rem;color:var(--cichy);margin-top:.15rem}
.skroty{display:flex;gap:.4rem;flex-wrap:wrap;margin:.3rem 0 .6rem}
.znacznik{display:inline-block;padding:.1rem .5rem;border-radius:999px;font-size:.8rem;font-weight:600;background:var(--szary-tlo);color:var(--tekst);white-space:nowrap}
.znacznik.ok,.znacznik.dziala,.znacznik.active{background:var(--ok-tlo);color:var(--ok)}
.znacznik.uwaga,.znacznik.zawieszona,.znacznik.activating,.znacznik.reloading{background:var(--uwaga-tlo);color:var(--uwaga)}
.znacznik.zle,.znacznik.blad,.znacznik.failed{background:var(--zle-tlo);color:var(--zle)}
.znacznik.zatrzymana,.znacznik.inactive,.znacznik.nieznany{background:var(--szary-tlo);color:var(--cichy)}
.znacznik.demo{background:#efe3ff;color:#5b2ca0;margin-left:.5rem}
.tabela{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--linia);border-radius:var(--promien);box-shadow:var(--cien);overflow:hidden}
.tabela th,.tabela td{padding:.5rem .6rem;text-align:left;border-bottom:1px solid var(--linia);vertical-align:middle}
.tabela th{font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;color:var(--cichy);background:#f8fafc}
.tabela tbody tr:last-child td{border-bottom:0}
.tabela tbody tr:hover{background:#f8fafc}
.tabela tr.glowna td{background:#f4f7fb}
.tabela td.liczba{text-align:right;font-variant-numeric:tabular-nums}
.tabela td.akcje{text-align:right}
.modal-tlo{position:fixed;inset:0;background:rgba(16,24,40,.45);display:flex;align-items:flex-start;justify-content:center;padding:4vh 1rem;z-index:50;overflow:auto}
.modal-okno{background:#fff;border-radius:10px;width:100%;max-width:620px;box-shadow:0 10px 40px rgba(0,0,0,.25);max-height:92vh;display:flex;flex-direction:column}
.modal-okno.szeroki{max-width:960px}
.modal-naglowek{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.8rem 1rem;border-bottom:1px solid var(--linia)}
.modal-naglowek h3{margin:0}
.modal-tresc{padding:1rem;overflow:auto}
.modal-przyciski{display:flex;gap:.5rem;justify-content:flex-end;flex-wrap:wrap;margin-top:1rem}
pre.wynik{background:#0f172a;color:#e2e8f0;padding:.75rem;border-radius:6px;overflow:auto;font-size:.8rem;max-height:55vh;white-space:pre-wrap;word-break:break-word;margin:.5rem 0}
.blad{background:var(--zle-tlo);color:var(--zle);border:1px solid #f1c3bd;padding:.6rem .8rem;border-radius:6px;margin:.6rem 0}
.ostrzezenie{background:var(--uwaga-tlo);color:#6b4400;border:1px solid #f0d9a0;padding:.6rem .8rem;border-radius:6px;margin:.6rem 0}
.informacja{background:#e8f0fc;color:#173a6b;border:1px solid #c3d6f3;padding:.6rem .8rem;border-radius:6px;margin:.6rem 0}
.sekret{font-family:ui-monospace,Consolas,monospace;font-size:1.15rem;background:#fffbe6;border:1px dashed #d9b84a;padding:.6rem .8rem;border-radius:6px;word-break:break-all;display:flex;align-items:center;gap:.6rem;justify-content:space-between;flex-wrap:wrap;margin:.5rem 0}
.lista-kodow{columns:2;font-family:ui-monospace,Consolas,monospace;font-size:1.05rem;margin:.5rem 0;padding-left:1.4rem}
.lista-kodow li{margin:.15rem 0}
.szczegoly{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0 1rem;margin:0}
.szczegoly dt{color:var(--cichy);font-size:.8rem;margin-top:.45rem}
.szczegoly dd{margin:0;word-break:break-word}
.pasek-postepu{height:8px;background:var(--szary-tlo);border-radius:4px;overflow:hidden;margin:.4rem 0}
.pasek-postepu>div{height:100%;background:var(--akcent)}
.pasek-postepu.uwaga>div{background:var(--uwaga)}
.pasek-postepu.zle>div{background:var(--zle)}
.duza-liczba{font-size:1.5rem;font-weight:600}
.kregi{display:inline-block;width:1em;height:1em;border:2px solid #c9d1da;border-top-color:var(--akcent);border-radius:50%;animation:obrot .8s linear infinite;vertical-align:-.15em;margin-right:.4rem}
@keyframes obrot{to{transform:rotate(360deg)}}
.toast{position:fixed;right:1rem;bottom:1rem;background:#1c2430;color:#fff;padding:.6rem .9rem;border-radius:8px;box-shadow:var(--cien);z-index:60;max-width:90vw}
.toast.uwaga{background:var(--uwaga)}
.toast.zle{background:var(--zle)}
.ekran-logowania{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem}
.logowanie{width:100%;max-width:380px}
.logowanie h1{margin-bottom:.1rem}
.logowanie p{margin:0 0 1rem}
.qr{background:#fff;padding:.5rem;display:inline-block;border:1px solid var(--linia);border-radius:8px}
.qr svg{width:220px;height:220px;display:block}
.filtr{max-width:320px}
.wpis-blad td{background:#fff5f4}
.wpis-blokada td{background:#fff8e8}
.lista-uslug{list-style:none;margin:0;padding:0}
.lista-uslug li{display:flex;justify-content:space-between;align-items:center;padding:.3rem 0;border-bottom:1px solid var(--linia)}
.lista-uslug li:last-child{border-bottom:0}
@media (max-width:760px){
.naglowek{gap:.5rem;padding:.5rem .75rem}
.nawigacja{order:3;width:100%;overflow-x:auto}
.tresc{padding:.75rem}
.tabela thead{display:none}
.tabela,.tabela tbody,.tabela tr,.tabela td{display:block;width:100%}
.tabela tr{border-bottom:6px solid var(--tlo);padding:.3rem 0}
.tabela td{border:0;padding:.25rem .75rem;display:flex;justify-content:space-between;gap:.75rem;text-align:right}
.tabela td::before{content:attr(data-etykieta);color:var(--cichy);font-size:.8rem;text-align:left;flex-shrink:0}
.tabela td.bez-etykiety::before{content:none}
.tabela td.bez-etykiety,.tabela td.akcje{justify-content:flex-end}
.lista-kodow{columns:1}
.modal-tlo{padding:2vh .5rem}
input,select,textarea{font-size:16px}
.przycisk{min-height:40px}
.tabela td.akcje .przycisk{width:100%}
}