/* Open Sans, self-hosting: bez zapytań do Google przed zgodą widza. */
@font-face{font-family:"Open Sans";font-style:normal;font-weight:400 800;font-stretch:100%;font-display:swap;
  src:url(fonty/opensans-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Open Sans";font-style:normal;font-weight:400 800;font-stretch:100%;font-display:swap;
  src:url(fonty/opensans-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* Kolory wyłącznie jako zmienne: motyw jasny z kierunku B to podmiana tego bloku. */
:root{
  --tlo:#012A3D; --panel:#023850; --kafel:#01465F;
  --tekst:#FFFFFF; --tekst2:#CFDDE3; --tekst3:#A9BCC4;
  --akcent:#F9A00B; --na-akcent:#012A3D;
  --linia:rgba(255,255,255,.14); --linia2:rgba(255,255,255,.3);
  --tlo-rgb:1,42,61; /* te same trzy liczby co --tlo; zasłony i gradienty biorą z nich kolor */
  --nakladka:rgba(var(--tlo-rgb),.9); --cien:rgba(0,0,0,.4);
  --postep-tlo:rgba(255,255,255,.25); --fokus-na-akcencie:#FFFFFF;
  --margines:clamp(16px,4vw,56px);
  --blad:#FF8A80; --blad-tlo:rgba(255,138,128,.14); --na-blad:#012A3D; /* stan błędu: osobny od akcentu */
  --stan-ok:#7FD99A; /* stan "dobrze" (Zapisano): ~9:1 na --tlo i ~8:1 na --panel */
  --google-tlo:#FFFFFF; --google-tekst:#1F1F1F;
  --logo-tlo:#FFFFFF; /* karta programu z logo: logotypy mają białe tło */
  /* Tematy: paleta kategorialna czytelna na --tlo; tekst na przycisku = --na-akcent (kontrast >= 5,5:1). Bursztyn zostaje akcentem marki. */
  --temat-zdrowie:#5FD08A; --temat-moda-i-uroda:#F28DB2; --temat-gotowanie:#FF8F6B;
  --temat-rozrywka:#B79CFF; --temat-zycie-i-relacje:#6CC4F5; --temat-ruch:#C6DB4A;
  --temat-muzyka:#4FD6CF; --temat-prawo-i-finanse:#A9BDD0; --temat-technologia:#F2777A;
}
.t-zdrowie{--kolor:var(--temat-zdrowie)}.t-moda-i-uroda{--kolor:var(--temat-moda-i-uroda)}.t-gotowanie{--kolor:var(--temat-gotowanie)}
.t-rozrywka{--kolor:var(--temat-rozrywka)}.t-zycie-i-relacje{--kolor:var(--temat-zycie-i-relacje)}.t-ruch{--kolor:var(--temat-ruch)}
.t-muzyka{--kolor:var(--temat-muzyka)}.t-prawo-i-finanse{--kolor:var(--temat-prawo-i-finanse)}.t-technologia{--kolor:var(--temat-technologia)}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--tlo);color:var(--tekst);font:400 19px/1.55 "Open Sans",system-ui,sans-serif;min-height:100vh;display:flex;flex-direction:column}
body>main{flex:1}
img{max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--akcent);outline-offset:3px;border-radius:4px}
.ukryte{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skok{position:absolute;left:8px;top:-60px;background:var(--akcent);color:var(--na-akcent);padding:10px 18px;border-radius:8px;font-weight:700;z-index:10}
.skok:focus{top:8px}
h1,h2,h3{margin:0;font-weight:800}
h2{font-size:clamp(1.4rem,2vw,1.9rem)}

/* Nagłówek */
.gora{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;padding:16px var(--margines);border-bottom:1px solid var(--linia)}
.logo{display:flex;align-items:center;text-decoration:none}
.logo img{display:block;height:44px;width:auto}
.menu{display:flex;flex-wrap:wrap;gap:4px 22px;font-size:18px;font-weight:600}
.menu a{color:var(--tekst2);text-decoration:none;padding:8px 0;border-bottom:3px solid transparent}
.menu a[aria-current]{color:var(--akcent);border-color:var(--akcent)}
.szukaj{flex:1 1 240px;display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--linia2);border-radius:999px;padding:0 16px;min-height:48px}
.szukaj input{flex:1;min-width:0;background:transparent;border:0;color:inherit;font:inherit;font-size:18px;outline:none}
.szukaj:focus-within{border-color:var(--akcent)}
.szukaj svg{flex:none;stroke:var(--tekst2)}
.partnerzy{border:2px solid var(--akcent);color:var(--akcent);padding:10px 20px;border-radius:999px;font-weight:700;text-decoration:none;font-size:17px;white-space:nowrap}
.konto-btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 18px;border-radius:999px;border:1px solid var(--linia2);font-weight:700;font-size:17px;text-decoration:none;white-space:nowrap}
.konto-btn:hover{border-color:var(--akcent)}
.konto-btn .kolo{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--akcent);color:var(--na-akcent);font-weight:800;font-size:16px}

/* Przyciski */
.przycisk{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;font:inherit;font-size:18px;font-weight:700;cursor:pointer;text-decoration:none;border:1px solid var(--linia2);background:transparent;color:var(--tekst)}
.przycisk.glowny{background:var(--akcent);color:var(--na-akcent);border-color:var(--akcent);font-weight:800}
.przycisk.akcent{border:2px solid var(--akcent);color:var(--akcent)}
.przycisk.akcent[aria-pressed=true]{background:var(--akcent);color:var(--na-akcent)}
.przycisk svg{flex:none}

/* Hero */
.hero{position:relative;overflow:hidden;background:var(--kafel)}
.slajdy{display:grid}
.slajd{grid-area:1/1;position:relative;min-height:clamp(420px,52vw,640px);display:flex;align-items:flex-end}
.slajd>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.slajd:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--tlo-rgb),.96) 0%,rgba(var(--tlo-rgb),.82) 38%,rgba(var(--tlo-rgb),.15) 75%),linear-gradient(0deg,var(--tlo) 0%,rgba(var(--tlo-rgb),0) 35%)}
.slajd>div{position:relative;z-index:1;padding:clamp(28px,5vw,72px) var(--margines);max-width:780px;display:flex;flex-direction:column;gap:18px}
.slajd h1,.slajd h2{font-size:clamp(2.3rem,5vw,4.2rem);line-height:1.05;overflow-wrap:anywhere;margin:0}
.slajd p{margin:0;font-size:clamp(1.1rem,1.5vw,1.3rem);color:var(--tekst2)}
/* karuzela: włącza ją app.js (klasa .kar); bez JS widać tylko slajd 1 i nie ma kontrolek */
.hero.kar .slajd{transition:opacity .6s ease,visibility .6s}
.hero.kar .slajd>div{padding-bottom:clamp(96px,10vw,120px)}
.hero.kar .slajd:not(.aktywny){opacity:0;visibility:hidden}
.hero-ster{position:absolute;z-index:2;left:var(--margines);right:var(--margines);bottom:clamp(16px,2.5vw,32px);display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.hero-ster .przycisk{min-height:48px;background:rgba(var(--tlo-rgb),.75)}
.hero-kropki{display:flex;gap:4px}
.hero-kropki button{width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer;display:grid;place-items:center}
.hero-kropki button:before{content:"";width:16px;height:16px;border-radius:50%;border:2px solid var(--tekst);background:transparent}
.hero-kropki button[aria-current=true]:before{background:var(--akcent);border-color:var(--akcent)}
.hero-kropki button:focus-visible,.hero-ster .przycisk:focus-visible{outline:3px solid var(--akcent);outline-offset:2px}
@media (max-width:600px){.slajd>img{object-position:70% center}}
@media (prefers-reduced-motion:reduce){.hero.kar .slajd{transition:none}}
.nadtytul{font-size:15px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--akcent)}
.przyciski{display:flex;flex-wrap:wrap;gap:12px}

/* Układ stron */
main{padding:8px var(--margines) 64px;display:flex;flex-direction:column;gap:52px}
main.podstrona{padding-top:clamp(24px,4vw,48px)}
.rzad{display:flex;flex-direction:column;gap:16px}
.rzad[hidden]{display:none}
.rzad-nagl{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 16px}
.rzad-nagl small{font-size:16px;color:var(--tekst3)}
.rzad-nagl a{color:var(--akcent);font-weight:700;font-size:17px;text-decoration:none}

/* Kafle odcinków */
.kafel{text-decoration:none;display:flex;flex-direction:column;gap:8px;min-width:0}
.kafel .obraz{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:var(--kafel)}
.kafel img{width:100%;height:100%;object-fit:cover;display:block}
.kafel .czas{position:absolute;right:8px;bottom:8px;background:var(--nakladka);font-size:15px;font-weight:700;padding:2px 8px;border-radius:6px}
.kafel .postep{position:absolute;left:0;right:0;bottom:0;height:6px;background:var(--postep-tlo)}
.kafel .postep i{display:block;height:100%;background:var(--akcent)}
.kafel .program{font-size:14px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--akcent)}
.kafel .tytul{font-size:19px;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.kafel .meta{font-size:16px;color:var(--tekst3)}
.kafel:hover .tytul{text-decoration:underline}
/* Siatka bez przewijania: komputer 4 kolumny, tablet 3, telefon 2. Elementy .p-pc (7. i 8.) widać tylko na komputerze, tak żeby początek miał 2 pełne rzędy (8 / 6 / 6). */
.siatka{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 22px}
@media (max-width:1000px){.siatka{grid-template-columns:repeat(3,minmax(0,1fr))}.siatka>.p-pc{display:none!important}}
@media (max-width:600px){.siatka{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}}
.przycisk.wiecej-duze{align-self:center;justify-content:center;min-height:56px;min-width:min(100%,320px);font-size:19px}
@media (max-width:600px){.przycisk.wiecej-duze{align-self:stretch}}

/* Programy i tematy */
.plakat:before{content:"";display:block;padding-top:125%} /* min. 4:5, ale karta z logo może być wyższa i wtedy sąsiad się rozciąga */
.plakat{min-width:0;position:relative;border-radius:14px;overflow:hidden;text-decoration:none;background:var(--kafel)}
.plakat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.plakat:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(var(--tlo-rgb),.97) 18%,rgba(var(--tlo-rgb),.1) 70%)}
.plakat div{position:absolute;left:18px;right:18px;bottom:18px;z-index:1;display:flex;flex-direction:column;gap:4px}
.plakat b{font-size:22px;font-weight:800;line-height:1.15}
.plakat span{font-size:16px;color:var(--akcent);font-weight:700}
.plakat.z-logo{background:var(--logo-tlo);display:flex;flex-direction:column}
.plakat.z-logo:before,.plakat.z-logo:after{display:none}
.plakat.z-logo picture{display:block}
.plakat.z-logo img{position:static;display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}
.plakat.z-logo div{position:static;flex:1;padding:14px 18px 16px;background:var(--panel)}
.logo-programu{display:block;width:clamp(96px,14vw,160px);height:auto;aspect-ratio:1;object-fit:contain;border-radius:16px;background:var(--logo-tlo)}
.tematy{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.temat{display:flex;align-items:center;gap:14px;min-height:72px;padding:14px 20px;border-radius:20px;background:var(--kolor,var(--panel));color:var(--na-akcent);border:3px solid transparent;text-decoration:none;transition:transform .15s,border-color .15s}
.temat .ik{flex:none}
.temat .tx{display:flex;flex-direction:column;min-width:0}
.temat b{font-size:21px;font-weight:800;line-height:1.2}
.temat .tx span{font-size:16px;font-weight:600}
.temat:hover,.temat:focus-visible{transform:translateY(-3px);border-color:var(--tekst)}
@media (prefers-reduced-motion:reduce){.temat{transition:none}.temat:hover,.temat:focus-visible{transform:none}}
.kropka{display:inline-block;width:.6em;height:.6em;border-radius:50%;background:var(--kolor,var(--tekst3));margin-right:.45em;vertical-align:baseline}
.pasek-tematu{width:72px;height:8px;border-radius:4px;background:var(--kolor)}

/* Biblioteka */
h1.strona{font-size:clamp(2.1rem,4.4vw,3.6rem);line-height:1.05;overflow-wrap:anywhere}
.lead{margin:0;color:var(--tekst2);max-width:78ch}
.wyszukiwarka{display:flex;align-items:center;gap:12px;background:var(--panel);border:2px solid var(--linia2);border-radius:16px;padding:0 20px;min-height:64px;max-width:900px}
.wyszukiwarka:focus-within{border-color:var(--akcent)}
.wyszukiwarka svg{flex:none;color:var(--akcent)}
.wyszukiwarka input{flex:1;min-width:0;background:transparent;border:0;color:inherit;font:inherit;font-size:20px;outline:none}
.chipy{display:flex;flex-wrap:wrap;gap:10px;padding:5px 4px 8px}
.chipy button{flex:none;min-height:48px;padding:0 20px;border-radius:999px;font:inherit;font-size:17px;font-weight:700;cursor:pointer;border:2px solid var(--linia2);background:transparent;color:var(--tekst)}
.chipy button[aria-pressed=true]{background:var(--akcent);border-color:var(--akcent);color:var(--na-akcent)}
.filtry{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.filtry label{display:flex;align-items:center;gap:10px;font-size:17px;color:var(--tekst2)}
.filtry select{min-height:48px;max-width:100%;padding:0 14px;border-radius:10px;background:var(--panel);color:var(--tekst);border:1px solid var(--linia2);font:inherit;font-size:17px}
.licznik{margin-left:auto;font-size:17px;color:var(--tekst3)}
.pusto{padding:48px 24px;border-radius:16px;background:var(--panel);display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.pusto b{font-size:22px;font-weight:800}

/* Fokus na bursztynowym tle: bursztynowy obrys by znikał */
.przycisk.glowny:focus-visible,.przycisk.akcent[aria-pressed=true]:focus-visible,.chipy button[aria-pressed=true]:focus-visible,.rozdzialy button[aria-current=true]:focus-visible{outline-color:var(--fokus-na-akcencie)}

/* Odcinek */
.okruszki{font-size:16px;color:var(--tekst3);display:flex;flex-wrap:wrap;gap:8px}
.okruszki a{color:var(--tekst3)}
.odcinek{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start}
.odcinek>.glowna{flex:999 1 640px;min-width:0;display:flex;flex-direction:column;gap:22px}
.odcinek>aside{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:22px}
.ekran{position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;border:0;border-radius:14px;overflow:hidden;background:var(--kafel);color:inherit}
.ekran img,.ekran iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ekran img{object-fit:cover}
button.ekran{cursor:pointer}
.ekran .graj{color:var(--na-akcent);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:104px;height:104px;border-radius:50%;background:var(--akcent);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 40px var(--cien)}
.ekran .start{position:absolute;left:16px;bottom:14px;background:var(--nakladka);font-size:16px;font-weight:700;padding:4px 12px;border-radius:8px}
.odcinek h1{font-size:clamp(1.9rem,3.4vw,3rem);line-height:1.12;overflow-wrap:anywhere}
.naglowek{display:flex;flex-direction:column;gap:10px}
.naglowek .nadtytul a{text-decoration:none}
.naglowek span.meta{font-size:17px;color:var(--tekst3)}
.opis{display:flex;flex-direction:column;gap:12px;max-width:78ch}
.opis h2{font-size:1.4rem}
.opis p{margin:0;color:var(--tekst2)}
.nastepny{display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:16px;background:var(--panel);border:2px solid var(--akcent);text-decoration:none}
.nastepny div{display:flex;gap:14px;align-items:center}
.nastepny img{width:150px;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:8px;flex:none;background:var(--kafel)}
.nastepny b{font-size:18px;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.rozdzialy{display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:16px;background:var(--panel)}
.rozdzialy h2{font-size:1.3rem;margin-bottom:6px}
.rozdzialy button{display:flex;gap:14px;align-items:baseline;text-align:left;width:100%;min-height:48px;padding:8px 12px;border-radius:10px;border:0;cursor:pointer;font:inherit;font-size:17px;background:transparent;color:var(--tekst)}
.rozdzialy button b{font-weight:800;min-width:56px;color:var(--akcent)}
.rozdzialy button[aria-current=true]{background:var(--akcent);color:var(--na-akcent)}
.rozdzialy button[aria-current=true] b{color:var(--na-akcent)}

/* Strony prostsze */
.pusta-strona{display:flex;flex-direction:column;gap:18px;align-items:flex-start;padding-top:clamp(24px,6vw,80px)}

/* Autoodtwarzanie: nakładka na odtwarzaczu i okno "Oglądać dalej?" */
.nakladka{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;padding:clamp(12px,3vw,32px);background:rgba(var(--tlo-rgb),.94)}
.nakladka.odlicz{gap:clamp(12px,3vw,28px)}
.nakladka img{position:static;width:min(40%,360px);height:auto;aspect-ratio:16/9;border-radius:10px;flex:none}
.odlicz-tekst{display:flex;flex-direction:column;gap:10px;min-width:0;max-width:520px}
.odlicz-wiersz{display:flex;align-items:center;gap:12px}
.odlicz-tytul{font-size:clamp(1rem,2vw,1.4rem);line-height:1.25;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pierscien{flex:none;transform:rotate(-90deg)}
.pierscien circle{fill:none;stroke-width:7}
.pierscien .tlo{stroke:var(--postep-tlo)}
.pierscien .ruch{stroke:var(--akcent);stroke-dasharray:176;animation:odlicz 10s linear forwards}
@keyframes odlicz{to{stroke-dashoffset:176}}
@media (prefers-reduced-motion:reduce){.pierscien{display:none}}
.nakladka .przycisk{min-height:56px}
.nakladka .przyciski{flex-wrap:nowrap;gap:10px}
.duzy-graj{min-height:72px;font-size:24px;padding:0 40px}
.okno-tlo{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(var(--tlo-rgb),.88)}
.okno{max-width:520px;width:100%;display:flex;flex-direction:column;gap:16px;padding:clamp(20px,4vw,32px);border-radius:16px;background:var(--panel);border:2px solid var(--akcent)}
.okno h2{font-size:clamp(1.5rem,3vw,2rem)}
.okno p{margin:0;color:var(--tekst2)}
.okno .przycisk{min-height:56px}
.okno .przyciski{flex-direction:column}
@media (max-width:600px){.nakladka img{display:none}.nakladka .przycisk{padding:0 14px;font-size:16px}}

/* Konto: logowanie, panel, formularze */
main.konto{gap:24px}
main.konto [data-widok]{display:none;flex-direction:column;gap:20px;align-items:flex-start}
main.konto[data-stan=ladowanie] [data-widok=ladowanie],main.konto[data-stan=niedostepne] [data-widok=niedostepne],main.konto[data-stan=wejscie] [data-widok=wejscie],
main.konto[data-stan=kod] [data-widok=kod],main.konto[data-stan=powitanie] [data-widok=powitanie],main.konto[data-stan=panel] [data-widok=panel]{display:flex}
.formularz{display:flex;flex-direction:column;gap:14px;width:100%;max-width:520px}
.formularz.szeroki{max-width:720px}
.formularz form{display:flex;flex-direction:column;gap:14px}
.formularz h2{font-size:1.3rem;margin-top:10px}
.formularz label,.formularz legend{font-weight:700;font-size:18px}
.formularz label small,.pole-zgody small{display:block;font-weight:400;font-size:16px;color:var(--tekst3)}
.formularz label:not(.pole-zgody) small{display:inline}
.pole-zgody span{display:flex;flex-direction:column}
.formularz input:not([type=checkbox]):not([type=radio]),.formularz textarea{width:100%;min-height:56px;padding:12px 16px;border-radius:12px;border:2px solid var(--linia2);background:var(--panel);color:var(--tekst);font:inherit;font-size:20px}
.formularz textarea{resize:vertical;min-height:160px}
.formularz input:focus-visible,.formularz textarea:focus-visible{outline:3px solid var(--akcent);outline-offset:2px;border-color:var(--akcent)}
#kod{font-size:32px;letter-spacing:.35em;text-align:center;font-weight:800}
.formularz fieldset{border:0;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}
.pole-zgody{display:flex;align-items:flex-start;gap:14px;min-height:48px;padding:10px 0;cursor:pointer}
.pole-zgody input{flex:none;width:28px;height:28px;margin:2px 0 0;accent-color:var(--akcent);cursor:pointer}
.pole-zgody b{font-weight:700}
.przycisk.duzy{min-height:56px;width:100%;justify-content:center;font-size:19px}
.przycisk.maly{min-height:48px;font-size:17px;padding:0 18px;justify-content:center}
.przycisk.google{background:var(--google-tlo);color:var(--google-tekst);border-color:var(--google-tlo)}
.przycisk.niebezpieczny{border:2px solid var(--blad)}
.przycisk.niebezpieczny:hover{background:var(--blad);color:var(--na-blad)}
.albo{display:flex;align-items:center;gap:14px;color:var(--tekst3);font-size:17px;margin:6px 0}
.albo:before,.albo:after{content:"";flex:1;height:1px;background:var(--linia2)}
.link{min-height:48px;padding:0 6px;background:none;border:0;color:var(--akcent);font:inherit;font-size:18px;font-weight:700;text-decoration:underline;cursor:pointer}
.link:disabled{color:var(--tekst3);text-decoration:none;cursor:default}
.blad{margin:0;padding:12px 16px;border-radius:10px;border:2px solid var(--blad);background:var(--blad-tlo);font-weight:600}
.komunikat{margin:0;padding:14px 18px;border-radius:10px;border:2px solid var(--akcent);background:var(--panel);max-width:720px}
.zapisano{margin:12px 0 0;min-height:28px;width:fit-content;padding:6px 16px;border:2px solid var(--stan-ok);border-radius:10px;background:var(--panel);font-weight:700;color:var(--stan-ok)}
.zapisano:empty{border-color:transparent;background:none}
.zapisano:not(:empty):before{content:"\2713\00a0"}
.drobne{margin:0;font-size:16px;color:var(--tekst3)}
.pusto-info{margin:0;color:var(--tekst2)}
#turnstile:empty,#zap-turnstile:empty{display:none}
.zakladki{display:flex;flex-wrap:wrap;gap:8px;border-bottom:1px solid var(--linia);width:100%}
.zakladki [role=tab]{min-height:52px;padding:0 20px;border:0;border-bottom:4px solid transparent;background:none;color:var(--tekst2);font:inherit;font-size:18px;font-weight:700;cursor:pointer}
.zakladki [role=tab][aria-selected=true]{color:var(--akcent);border-color:var(--akcent)}
[role=tabpanel]{width:100%;padding-top:16px}
.kafel-wr{display:flex;flex-direction:column;gap:12px;min-width:0}
.lista-obs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.lista-obs li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:10px 16px;border-radius:12px;background:var(--panel);font-weight:700}
.dane{display:flex;flex-direction:column;gap:4px;margin:0}
.dane dt{font-size:16px;color:var(--tekst3)}
.dane dd{margin:0;font-size:20px;font-weight:700;overflow-wrap:anywhere}
dialog{max-width:min(520px,calc(100vw - 32px));padding:clamp(20px,4vw,32px);border-radius:16px;border:2px solid var(--akcent);background:var(--panel);color:var(--tekst)}
dialog::backdrop{background:rgba(var(--tlo-rgb),.85)}
dialog h2{margin-bottom:10px}
dialog p{margin:0 0 16px;color:var(--tekst2)}
dialog .przyciski{flex-direction:column}
dialog .przycisk{justify-content:center;min-height:56px}

/* Zachęty do konta: znikają, gdy konta są wyłączone (app.js ustawia body[data-konto]) */
body[data-konto=wylaczone] [data-konto-tylko]{display:none!important}
.ramka-konto{display:flex;flex-direction:column;gap:12px;padding:16px 18px;border-radius:14px;background:var(--panel);border:2px solid var(--akcent)}
.ramka-konto p{margin:0;font-weight:700}
.ramka-konto .przycisk{min-height:48px;font-size:17px}
.pas-konto{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 28px;padding:20px clamp(18px,3vw,32px);border-radius:16px;background:var(--panel);border:1px solid var(--linia2)}
.pas-konto p{margin:0;font-weight:700;font-size:clamp(1.05rem,1.6vw,1.3rem);flex:1 1 320px}
.pas-konto .przyciski{flex-wrap:nowrap;align-items:center}
.pas-konto .przycisk.zamknij{width:48px;min-width:48px;min-height:48px;padding:0;justify-content:center;font-size:26px;line-height:1}

/* Stopka */
.dol{padding:36px var(--margines);border-top:1px solid var(--linia);display:flex;flex-wrap:wrap;gap:14px 32px;font-size:17px;color:var(--tekst3)}
.dol b{color:var(--tekst);font-weight:800}
.dol a{color:var(--tekst2)}

@media (max-width:600px){
  .gora{gap:10px 16px}
  .partnerzy{padding:8px 14px}
  .logo img{height:36px}
  .kafel .tytul{font-size:17px}
  .kafel .meta{font-size:15px}
  .plakat b{font-size:19px}
  .plakat div{left:12px;right:12px;bottom:12px}
  .nastepny img{width:110px}
  .licznik{margin-left:0;width:100%}
}