/* Pełna galeria (galeria.php): wyszukiwarka + lista wyników + szczegóły klepsydry.
   Komputer (≥1000 px): cały ekran przeglądarki, lista po lewej, szczegóły po prawej. Węższe ekrany: albo lista, albo szczegóły. */
body.pelna{padding-inline:0}
.gal-top{padding-inline:16px}
.gal-top .bar{max-width:none}

.gal-app{display:block}
/* wąski ekran: pokazujemy jeden z paneli */
.gal-app[data-widok="lista"] .gal-szczegol{display:none}
.gal-app[data-widok="szczegol"] .gal-lista{display:none}
.gal-lista,.gal-szczegol{padding:8px 16px 40px;min-width:0}

/* formularz */
.filtry>summary{font:700 13px/1 var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--brand);cursor:pointer;padding-block:12px;list-style-position:inside}
.filtr{border:0;margin:0 0 14px;padding:0;min-width:0}
.filtr legend{padding:0;margin-bottom:6px;font:600 15px/1.3 var(--font);color:var(--muted)}
.pole{font:400 17px/1.3 var(--font);color:var(--ink);background:var(--surface);border:0;border-radius:10px;padding:10px 12px;box-shadow:inset 0 2px 5px rgba(0,0,0,.22),inset 0 -1px 2px rgba(255,255,255,.9)}
.pole:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
input.pole[type=search]{width:100%}
.czas{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.czas label{display:flex;align-items:center;gap:6px;font-size:16px;color:var(--muted)}
.czas input.pole{width:5.5em}
.chipy{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border-radius:10px;font:500 16px/1 var(--font);color:rgba(0,0,0,.66);background:var(--surface);
 box-shadow:0 6px 10px -4px rgba(0,0,0,.35),0 -4px 8px -2px rgba(255,255,255,.8),inset 0 2px 3px -1px rgba(255,255,255,.7),inset 0 -2px 4px -1px rgba(0,0,0,.15);
 transition:box-shadow 250ms cubic-bezier(.23,1,.32,1),color 250ms ease-out}
.chip input:checked+span{color:var(--ink);font-weight:700;box-shadow:0 6px 10px -4px rgba(0,0,0,.2),0 -4px 8px -2px rgba(255,255,255,.8),inset 0 4px 9px 0 rgba(0,0,0,.35),inset 0 -3px 7px 0 rgba(255,255,255,.8)}
.chip input:focus-visible+span{outline:3px solid var(--brand);outline-offset:3px}
.chipy.przewijane{max-height:11.5rem;overflow-y:auto;padding:4px 6px 10px 2px;margin:-4px -6px 0 -2px}
.chip small{font:400 13px/1 var(--font);color:var(--muted);font-variant-numeric:tabular-nums}
.probka{display:inline-block;width:16px;height:16px;border-radius:50%;background:var(--c);box-shadow:0 0 0 1px rgba(0,0,0,.35)}
.brak{margin:0;font:italic 400 14px var(--font);color:var(--muted)}
.akcje{display:flex;align-items:center;gap:20px;padding-block:6px 4px}
.wyczysc{color:var(--muted)}
.licznik{margin:14px 0 8px;font:600 16px/1.3 var(--font);color:var(--muted);font-variant-numeric:tabular-nums}
.ostrzezenie{margin:0 0 8px;font:italic 400 14px var(--font);color:var(--brand)}

/* lista wyników */
.wyniki{list-style:none;margin:0;padding:0}
.wyniki li+li{border-top:1px solid rgba(0,0,0,.1)}
.wynik{display:flex;align-items:center;gap:14px;padding:8px 10px;border-radius:10px;text-decoration:none}
.wynik:hover{background:rgba(0,0,0,.05)}
.wynik[aria-current="true"]{background:rgba(107,67,5,.12);box-shadow:inset 3px 0 0 var(--brand)}
.miniatura{flex:none;width:72px;height:72px;border-radius:8px;overflow:hidden;background:rgba(0,0,0,.08);display:block}
.miniatura img{display:block;width:100%;height:100%;object-fit:cover}
.tekst{display:grid;gap:2px;min-width:0}
.tekst strong{font:600 17px/1.25 var(--font);overflow-wrap:anywhere}
.tekst small{font:400 14px/1.35 var(--font);color:var(--muted)}
.pusto{padding:16px 0;font:italic 400 16px var(--font);color:var(--muted)}

/* szczegóły */
.pasek{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:8px 16px}
.pasek[hidden]{display:none}
.pasek .poz{font:600 16px var(--font);color:var(--muted);font-variant-numeric:tabular-nums;margin-right:auto}
.pasek .wroc{margin-right:8px}
.pasek .para{display:flex;gap:10px}
.pasek .para .squish{min-width:56px}
.gal-szczegol .slide{grid-template-columns:1fr;align-items:start;gap:20px}
.gal-szczegol .stage{aspect-ratio:4/3;max-height:72vh}

@media (min-width:1000px){
 body.pelna{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}
 .gal-top{flex:none;padding-inline:24px}
 .gal-app{flex:1;min-height:0;display:grid;grid-template-columns:clamp(340px,30vw,460px) minmax(0,1fr);border-top:1px solid rgba(0,0,0,.12)}
 /* oba panele widoczne niezależnie od data-widok; każdy przewija się osobno */
 .gal-app[data-widok] .gal-lista,.gal-app[data-widok] .gal-szczegol{display:block}
 .gal-lista,.gal-szczegol{overflow-y:auto;overscroll-behavior:contain;padding:12px 24px 32px}
 .gal-lista{border-right:1px solid rgba(0,0,0,.12)}
 .gal-szczegol{container-type:inline-size}
 .pasek .wroc{display:none}
 .pasek .poz{margin-right:auto}
}
@container (min-width:880px){
 .gal-szczegol .slide{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
}