/* SZKICE KONTA `/szkice` (wlasciciel 04.11, kanwa "Szkice - wspolny ekran szkicow konta").
   Siatka 2 kolumny, kafel 9:16 = podglad "W Reels" (`fp-mr` z fp.css, film nie gra),
   u gory stan i ⋮, pod kaflem guzik. Wszystko `szk-*`; kolory jak w b14 (czarne zloto). */
.szk-chipy{margin-top:12px}
.szk-dzial{margin:16px 0 8px;font:800 12px/1 Manrope,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#A9A49A}
.szk-dzial.zl{color:#E8C96A}
.szk-siatka{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 10px}
.szk-k{position:relative;min-width:0;display:flex;flex-direction:column;gap:8px;--szk-w:174px}
.szk-k.w-miejscu-znika{opacity:0;transform:scale(.96);transition:opacity .2s,transform .2s}
.szk-okno{display:block;position:relative;width:100%;aspect-ratio:9/16;border-radius:14px;overflow:hidden;color:inherit;text-decoration:none}
/* Okienko Reels na cala szerokosc kafla: `--w`/`--h`/`--k` liczy js/szkice.js z prawdziwej szerokosci. */
.szk-okno .fp-mr{width:100%;height:100%;border-radius:14px;border:1px solid #26262B;box-shadow:none;--zl:linear-gradient(135deg,#FBEFC2,#D9B64A 45%,#B08A24);--t:#F2EFE8;--t2:#A9A49A;--t3:#8B867E}
.szk-k.oplata .szk-okno .fp-mr{border-color:#3A3014}
.szk-plak{position:absolute;left:8px;top:8px;z-index:2;height:24px;padding:0 8px;border-radius:8px;background:rgba(0,0,0,.6);color:#E7E3DB;font:800 11px/24px Manrope,system-ui,sans-serif;white-space:nowrap;pointer-events:none}
.szk-plak.zl{background:linear-gradient(135deg,#FBEFC2,#D9B64A 45%,#B08A24);color:#1A1405}
/* /moje-ogloszenia (04.11): "Aktywne" zielono na ciemnym (jak "● Aktywne" w B6), reszta stanow ciemna. */
.szk-plak.ok{color:#4CC38A}
.szk-plak.ok::before{content:"● "}
/* Druga linia chipow (stany) i jedna linijka liczb pod kaflem - tylko niezerowe. */
.szk-stany{margin-top:4px}
.szk-liczby{margin:-2px 0 0;font:700 12px/1.3 Manrope,system-ui,sans-serif;color:#A9A49A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.szk-ml .szk-zl{color:#E8C96A}
.szk-pas{position:absolute;left:8px;right:8px;top:38px;z-index:2;display:flex;gap:3px;pointer-events:none}
.szk-pas i{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.28)}
.szk-pas i.on{background:#D9B64A}
.szk-film{position:absolute;left:8px;bottom:calc(44px + 8px);z-index:2;width:26px;height:26px;border-radius:7px;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;color:#fff;pointer-events:none}
.szk-film svg{width:14px;height:14px;fill:currentColor}
/* Menu ⋮ - arkusz od dolu (`details[data-arkusz]`, pytanie.css daje ramke i tlo). */
.szk-m{position:absolute;right:6px;top:6px;z-index:3}
/* Otwarty arkusz ponad paskiem dolu (1050) i dolnym menu (1100) - `.szk-m` ma wlasny kontekst. */
.szk-m[open]{z-index:2400}
.szk-m>summary{list-style:none;width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer}
.szk-m>summary::-webkit-details-marker{display:none}
.szk-m>summary svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.szk-ml-g{display:flex;flex-direction:column;gap:2px;padding:6px 4px 12px;border-bottom:1px solid #26262B;margin-bottom:6px}
.szk-ml-g b{font-size:16px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.szk-ml-g span{font-size:13px;color:#8B867E}
.szk-ml>a,.szk-ml>form>button{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:0 4px;border:0;background:none;font:800 16px Manrope,system-ui,sans-serif;color:inherit;text-decoration:none;cursor:pointer;text-align:left}
.szk-ml svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.szk-ml .szk-usun{color:#E8C96A}
:root[data-theme=light] .szk-ml .szk-usun{color:#8A6A14}
/* Guzik pod kaflem: Oplac (zloty) albo Dokoncz (kontur). */
.szk-g{display:flex;align-items:center;justify-content:center;height:40px;border-radius:12px;border:1px solid #D9B64A;color:#E8C96A;font:800 14px Manrope,system-ui,sans-serif;text-decoration:none}
.szk-g.zl{border:0;background:linear-gradient(135deg,#FBEFC2,#D9B64A 45%,#B08A24);color:#1A1405}
.szk-g:focus-visible{outline:2px solid #E3B341;outline-offset:2px}
/* Dol: "+ Nowe ogloszenie" przybite nad dolnym menu (`dol-pasek`). */
.szk-nowe{display:flex;align-items:center;justify-content:center;height:52px;border-radius:14px;background:linear-gradient(135deg,#FBEFC2,#D9B64A 45%,#B08A24);color:#1A1405;font:800 16px Manrope,system-ui,sans-serif;text-decoration:none}
/* Karkas 05.11: kafle 9:16 - kolumny z `--kr-kol` (2 / 3 / 4 od 1440). */
@media (min-width:768px){.szk-siatka{grid-template-columns:repeat(var(--kr-kol),minmax(0,1fr));gap:var(--kr-odstep)}}
:root[data-theme=light] .szk-ml-g{border-bottom-color:#E6E1D7}
:root[data-theme=light] .szk-ml-g span{color:#6B665E}
:root[data-theme=light] .szk-dzial{color:#6B665E}
:root[data-theme=light] .szk-liczby{color:#6B665E}
:root[data-theme=light] .szk-ml .szk-zl{color:#8A6A14}
:root[data-theme=light] .szk-dzial.zl{color:#8A6A14}
:root[data-theme=light] .szk-g{color:#8A6A14}

/* STREFA KASANIA (05.11, `tools/kasanie.mjs`): palec trafia w kwadrat co najmniej
   44x44 px, choc rysunek zostaje ten sam - przezroczysta warstwa wokol guzika
   (pseudo-element) lapie dotkniecie za niego. Wiekszy od 44 nie rosnie (`min`).
   `:where()` przy `position` ma zerowa wage, wiec kazda regula ekranu z wlasnym
   `position` wygrywa. */
:where(a.szk-g,.szk-m > summary){position:relative}
a.szk-g::after,
.szk-m > summary::after{content:"";position:absolute;top:min(0px,calc(50% - 22px));bottom:min(0px,calc(50% - 22px));left:min(0px,calc(50% - 22px));right:min(0px,calc(50% - 22px))}