/* ===== GENERATOR E8 MATEMATYKA — style (akcent = kolor okładki zbioru #708050) ===== */
:root{
  --zbior:#708050; --zbior-c:#5A6840; --zbior-tlo:#F0F2E9; --zbior-linia:#D8DEC8;
  --gen-ziel:#2F7D5D; --gen-ziel-tlo:#EAF5EF; --gen-blad:#B5442E; --gen-blad-tlo:#FAEDE8;
  --gen-fiolet:#7D3C98; --gen-fiolet-tlo:#F4EDF8;
}
.obszar-gen{background:var(--tlo);transition:background .2s}
.obszar-gen.ciemny{--tlo:#17121A; --biel:#211A24; --tekst:#F0E9ED; --szary:#A396A0;
  --zbior-tlo:#262B1C; --zbior-linia:#3C452B; --zbior:#8FA368; --zbior-c:#A9BC84;
  --gen-ziel-tlo:#1A3528; --gen-blad-tlo:#3A1F17; --gen-fiolet-tlo:#2C2135;
  background:var(--tlo);color:var(--tekst)}
.obszar-gen.ciemny .narz, .obszar-gen.ciemny .sidebar, .obszar-gen.ciemny .rama,
.obszar-gen.ciemny .gkrok, .obszar-gen.ciemny .side-stopka{background:var(--biel);border-color:#352B3C}
.obszar-gen.ciemny .dz, .obszar-gen.ciemny .side-glowa{border-color:#352B3C}

.narz{border-bottom:1px solid #EFE7EC;background:var(--biel)}
.narz .wrap{display:flex;align-items:center;gap:10px;padding:9px 20px;font-size:13.5px;color:var(--szary)}
.stat{display:inline-flex;align-items:center;gap:9px;padding:5px 13px 5px 6px;border:1px solid #EFE7EC;border-radius:12px;background:var(--biel)}
.stat .ik{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none}
.stat .ik svg{width:14px;height:14px}
.s-tecz .ik{background:var(--zbior-tlo);color:var(--zbior-c)}
.s-seria .ik{background:#FDEBD2;color:#C06A14}
.s-ok .ik{background:#EAF2E2;color:#49682F}
.s-los .ik{background:#F1EDEF;color:#6F5F6A}
.st-t{display:flex;flex-direction:column;line-height:1.15}
.st-t b{font-size:17px;color:var(--tekst)}
.st-t small{font-size:12px;color:var(--szary);white-space:nowrap}
.obszar-gen.ciemny .stat{background:var(--biel);border-color:#352B3C}

@media(max-width:700px){.st-t small{display:none}.stat{padding:5px 10px}}
.narz b{color:var(--tekst);font-variant-numeric:tabular-nums}
.narz .spacer{flex:1}
.narz .klik{cursor:pointer}
.tgl{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--szary);cursor:pointer;user-select:none}
.tgl .tor{width:26px;height:15px;border-radius:8px;background:#E4DBE0;position:relative;transition:.15s}
.tgl .tor::after{content:'';position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:50%;background:#fff;transition:left .15s;box-shadow:0 0 0 1px rgba(0,0,0,.1)}
.tgl.on .tor{background:var(--zbior)}
.tgl.on .tor::after{left:13px}

.uklad-gen{display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;align-items:start;padding:20px 0 40px}
@media(max-width:860px){.uklad-gen{grid-template-columns:1fr}}
.obszar-gen.skupienie .sidebar,.obszar-gen.skupienie .baner-gen{display:none}
.obszar-gen.skupienie .uklad-gen{grid-template-columns:1fr;max-width:880px;margin:0 auto}

/* ===== baner tytułowy (zielona ramka) + countdown ===== */
.baner-gen{grid-column:1/-1;display:flex;gap:14px;align-items:stretch;flex-wrap:wrap}
.ramka-tytul{flex:1;min-width:260px;display:flex;align-items:center;gap:14px;background:var(--zbior-tlo);border:1.5px solid var(--zbior);border-radius:16px;padding:16px 22px}
.ramka-tytul .znaczek{width:44px;height:58px;border-radius:5px;background:var(--zbior);flex-shrink:0;box-shadow:3px 3px 0 var(--zbior-linia);background-image:url('/img/zbior-e8-mat/okladka.jpg');background-size:cover;background-position:center}
.ramka-tytul h1{font-size:23px;font-weight:800;line-height:1.25;color:var(--zbior-c);letter-spacing:-.01em}
.ramka-tytul h1 small{display:block;font-size:13px;font-weight:700;color:var(--zbior);letter-spacing:.05em;margin-bottom:2px}
.cd-ramka{display:flex;flex-direction:column;justify-content:center;align-items:center;background:var(--biel);border:1.5px solid var(--zbior-linia);border-radius:16px;padding:10px 24px;min-width:150px}
.cd-ramka b{font-size:34px;font-weight:800;color:var(--zbior-c);letter-spacing:-.03em;line-height:1.1;font-variant-numeric:tabular-nums}
.cd-ramka span{font-size:11.5px;color:var(--szary);font-weight:700;letter-spacing:.04em;text-align:center}

/* ===== sidebar działów ===== */
.sidebar{position:sticky;top:84px;background:var(--biel);border:1px solid #EFE7EC;border-radius:16px;overflow:hidden;display:flex;flex-direction:column;max-height:calc(100vh - 104px)}
@media(max-width:860px){.sidebar{position:static;max-height:none}}
.side-glowa{display:flex;justify-content:space-between;align-items:baseline;padding:12px 16px 8px;border-bottom:1px solid #EFE7EC}
.side-glowa h2{font-size:15px;font-weight:800;margin:0}
.side-glowa a{font-size:12.5px;color:var(--zbior-c);font-weight:700;cursor:pointer}
.side-lista{overflow-y:auto;flex:1}
.dz{border-bottom:1px solid #F4EEF1}
.dz:last-child{border-bottom:0}
.dz-g{display:flex;align-items:center;gap:10px;padding:8px 14px;cursor:pointer;user-select:none}
.dz-g:hover{background:var(--zbior-tlo)}
.ptak{width:19px;height:19px;border:1.8px solid var(--zbior-linia);border-radius:5px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff;transition:.12s}
.dz.on .ptak{background:var(--zbior);border-color:var(--zbior)}
.dz.on .ptak::after{content:'✓'}
.dz.czesc .ptak{background:var(--zbior);border-color:var(--zbior);opacity:.65}
.dz.czesc .ptak::after{content:'–';font-weight:800}
.pp .pp-ile{margin-left:auto;font-size:12px;color:var(--szary);font-variant-numeric:tabular-nums}
.dz-g .n{flex:1;min-width:0;font-size:15.5px;font-weight:700;line-height:1.3}
.dz-g .n small{display:block;font-weight:600;color:var(--szary);font-size:13px}
.dz-g .proc{font-size:12.5px;color:var(--zbior-c);font-weight:800;font-variant-numeric:tabular-nums;line-height:0}
/* pierścień postępu działu – „ładuje się" przy wejściu */
.ring{width:28px;height:28px;display:block}
.ring .rt{fill:none;stroke:#EBE4DE;stroke-width:3}
.ring .rw{fill:none;stroke:var(--zbior);stroke-width:3;stroke-linecap:round;transform:rotate(-90deg);transform-origin:center;transition:stroke-dashoffset .9s ease}
.ring text{font-size:10px;font-weight:800;fill:var(--zbior-c);font-family:inherit}
.dz-g .roz{font-size:9px;color:var(--szary);padding:4px;transition:transform .15s}
.dz.rozw .roz{transform:rotate(180deg)}
.pod-lista{display:none;background:var(--tlo);border-top:1px dashed #EFE7EC;padding:5px 14px 7px 41px}
.dz.rozw .pod-lista{display:block}
.pp{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;padding:3px 0;cursor:pointer}
.pp .mk{width:15px;height:15px;border:1.5px solid var(--zbior-linia);border-radius:4px;display:inline-flex;align-items:center;justify-content:center;font-size:9px;color:#fff}
.pp.on .mk{background:var(--zbior);border-color:var(--zbior)}
.pp.on .mk::after{content:'✓'}
.side-stopka{border-top:1px solid #EFE7EC;padding:12px 14px;background:var(--biel)}
.side-stopka .pula{font-size:13.5px;color:var(--szary);margin-bottom:8px}
.side-stopka .pula b{color:var(--tekst);font-size:18px}
.btn-losuj{width:100%;border:0;border-radius:12px;background:var(--zbior);color:#fff;font-size:16.5px;font-weight:800;padding:13px;cursor:pointer;transition:.15s}
.btn-losuj:hover{background:var(--zbior-c)}
.side-stopka .enter{text-align:center;font-size:10.5px;color:var(--szary);margin-top:6px}

/* ===== scena / rama ===== */
.scena-gen{min-width:0;padding:0!important;margin:0}
.iko{display:inline-flex;align-items:center;gap:6px}
.iko svg{width:15px;height:15px;flex-shrink:0}
.akcja.iko svg{width:14px;height:14px}
.rama{background:var(--biel);border:1px solid #EFE7EC;border-top:4px solid var(--zbior);border-radius:16px;overflow:hidden;box-shadow:0 2px 10px rgba(42,15,35,.05)}
.rama-glowa{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid #EFE7EC}
/* width:auto - goła reguła .q (odstęp \quad z parsera LaTeX, 1em) nie może
   zgniatać słowa "Zadanie" w nagłówku do 15px */
.rama-glowa .q{font-weight:800;font-size:15px;white-space:nowrap;flex-shrink:0;width:auto}
.rama-glowa .pkt{font-size:12.5px;color:var(--szary);border-left:1px solid #EFE7EC;padding-left:12px;white-space:nowrap;flex-shrink:0}
/* badge trudności może się skracać zamiast zgniatać "Zadanie 1 pkt" obok */
.rama-glowa .trud-pig{min-width:0;overflow:hidden;text-overflow:ellipsis}
@media (max-width:640px){.rama-glowa .trud-pig small{display:none}}
.rama-glowa .spacer{flex:1}
.akcja{font-size:12.5px;color:var(--szary);font-weight:700;cursor:pointer;padding:4px 8px;border-radius:7px}
.akcja:hover{color:var(--zbior-c);background:var(--zbior-tlo)}
.kartka-cke{background:#fff;color:#1a1a1a;margin:16px;border:1px solid #E8E4DC}
/* PASEK ZADANIA — w kolorze ZBIORU (decyzja 8.10) */
.pasek-zad{background:var(--zbior-c);color:#fff;display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:7px 12px}
.pasek-zad b{font-size:16px}
.pasek-zad span{font-size:12.5px;opacity:.95}
.cke-w{padding:15px 19px 17px;font-family:Helvetica,'Helvetica Neue',Arial,sans-serif}
.tresc-zad{font-size:16.5px;line-height:1.65}
.tresc-zad p{margin:5px 0}
.tresc-zad .wyroznione{font-weight:700}
.math{font-family:Georgia,serif;font-style:italic}
.abcd-gen{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}
.abcd2{grid-template-columns:repeat(2,1fr)}
@media(max-width:620px){.abcd-gen{grid-template-columns:repeat(2,1fr)}}
.odp-cke{padding:8px 11px;font-size:16px;cursor:pointer;border:1.5px solid #E5E1D8;border-radius:8px;transition:.1s;background:#fff}
.odp-cke:hover{border-color:#708050}
.odp-cke b{margin-right:6px}
.odp-cke.dobra{border-color:#2F7D5D;background:#EAF5EF}
.odp-cke.zla{border-color:#B5442E;background:#FAEDE8}
.wybor-gen{display:inline-table;border-collapse:collapse;margin:0 4px;vertical-align:middle}
.wybor-gen td{border:1px solid #1a1a1a;padding:2px 12px;font-weight:700;font-size:14.5px;cursor:pointer}
.wybor-gen td.dobra{background:#EAF5EF;border-color:#2F7D5D}
.wybor-gen td.zla{background:#FAEDE8;border-color:#B5442E}
.feedback{display:none;margin:12px 16px 0;padding:10px 14px;font-size:14.5px;font-weight:600;border-radius:9px}
.feedback.ok{display:block;background:var(--gen-ziel-tlo);color:var(--gen-ziel)}
.feedback.nie{display:block;background:var(--gen-blad-tlo);color:var(--gen-blad)}
/* trudność – kompaktowa pigułka w nagłówku ramy, widoczna OD RAZU (oficjalny % CKE) */
.trud-pig{display:inline-flex;align-items:center;gap:7px;border-radius:30px;padding:4px 12px;font-size:12.5px;font-weight:800;letter-spacing:.02em;white-space:nowrap}
.trud-pig i{width:8px;height:8px;border-radius:50%;font-style:normal}
.trud-pig small{font-weight:600;font-size:12px;opacity:.85}
.trud-pig.latwe{background:#EAF2E2;color:#49682F}.trud-pig.latwe i{background:#6E9A48}
.trud-pig.typowe{background:#F8EFD6;color:#7A5E12}.trud-pig.typowe i{background:#C9A13F}
.trud-pig.trudne{background:#FAE6E0;color:#8A3321}.trud-pig.trudne i{background:#C25138}
.gkroki-sek{padding:13px 16px 16px}
.gkroki-sek h3{font-size:11.5px;letter-spacing:.08em;color:var(--szary);font-weight:800;margin:0 0 8px}
.gkrok{border:1px solid #EFE7EC;border-radius:11px;margin-bottom:7px;background:var(--biel);overflow:hidden}
.gkrok-g{display:flex;align-items:center;gap:10px;padding:11px 16px;cursor:pointer}
.gkrok-g:hover{background:var(--zbior-tlo)}
/* tytuły kroków ZIELONE #708050 - identycznie jak w zbiorach (sekcja
   ROZWIĄZANIA w e-booku); KaTeX w tytule dziedziczy kolor */
.gkrok .t{font-weight:700;font-size:15px;color:var(--zbior)}
/* treść merytoryczna (tytuły i treści kroków, odpowiedź) w czcionce arkusza
   CKE - tej samej co zbiory (helvet): tekst Helvetica, matematyka KaTeX/CM */
.gkrok .t,.gkrok .c,.odp-box #odp-tekst{font-family:Helvetica,'Helvetica Neue',Arial,sans-serif}
/* KaTeX domyślnie powiększa wzory do 1.21em - w zbiorach (LaTeX 10pt) tekst
   i matematyka mają TEN SAM rozmiar, więc cyfry wystawały ponad tekst.
   1em = proporcje 1:1 jak w e-booku. */
.tresc-zad .katex,.odp-cke .katex,.odp-box .katex,.gkrok .katex,.feedback .katex,.gen-info .katex,.pasek-zad .katex{font-size:1em}
/* najechanie na zablokowany krok: podświetlenie + jasna zachęta */
.gkrok.lock .gkrok-g:hover{background:var(--zbior-tlo)}
.gkrok.lock .gkrok-g:hover .t{color:var(--zbior-c)}
.gkrok.lock .klodka::after{content:''}
.gkrok.lock .gkrok-g:hover .klodka::after{content:' Odblokuj pełne rozwiązania – 79 zł';font-size:12.5px;font-weight:800}
.gkrok .chev{margin-left:auto;font-size:10px;color:var(--zbior-c);transition:transform .15s}
.gkrok.otwarty .chev{transform:rotate(180deg)}
.gkrok .c{display:none;padding:0 16px 13px;font-size:15.5px}
.gkrok.otwarty .c{display:block}
.gkrok.otwarty .t-zwin{display:none}
.gkrok.otwarty .t-pelny{display:inline!important}
.gkrok.lock .t{color:var(--szary)}
.klodka{margin-left:auto;font-size:13px;color:var(--zbior-c)}
.uwaga{font-size:14px;color:var(--gen-fiolet);margin-top:5px}
/* odpowiedź – pasek jak \odp w zbiorze, w kolorze zbioru, zasłonięty do kliknięcia */
/* pasek odpowiedzi jak w zbiorze: pełne jasnozielone tło, "Odp." bold,
   treść zwykłą wagą (bold tylko tam, gdzie ma go samo rozwiązanie) */
.odp-box{position:relative;background:var(--zbior-tlo);padding:11px 15px;margin-top:9px;font-size:16px;font-weight:400;overflow:hidden;font-family:Helvetica,'Helvetica Neue',Arial,sans-serif}
.odp-box b{margin-right:4px}
.odp-zaslona{position:absolute;inset:0;background:var(--zbior-tlo);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14.5px;font-weight:800;color:var(--zbior-c);gap:7px}
.odp-zaslona:hover{background:var(--zbior-linia)}
.odp-box.odkryta .odp-zaslona{display:none}
.pod-rama{display:flex;align-items:center;gap:12px;margin-top:12px}
.btn-cichy{border:1.5px solid var(--zbior);border-radius:30px;background:transparent;color:var(--zbior-c);font-size:14px;font-weight:800;padding:9px 20px;cursor:pointer}
.btn-cichy:hover{background:var(--zbior-tlo)}
.zglos{margin-left:auto;font-size:12.5px;color:var(--szary);text-decoration:underline;cursor:pointer}
.tlo-modal{display:none;position:fixed;inset:0;background:rgba(42,15,35,.55);z-index:200;align-items:center;justify-content:center;padding:20px}
.tlo-modal.otwarty{display:flex}
.modal-gen{background:#fff;color:#2B2028;border-radius:18px;max-width:420px;width:100%;padding:28px;text-align:center}
.modal-gen h3{font-size:20px;font-weight:800;margin:8px 0 6px}
.modal-gen p{font-size:14.5px;color:#71636C}
.modal-gen .btn{margin-top:14px;width:100%;border-radius:12px;background:var(--zbior)}
.modal-konto{position:relative;text-align:center}
.m-x{position:absolute;top:10px;right:14px;border:0;background:none;font-size:22px;color:#9A8C95;cursor:pointer}
.m-ikona{width:52px;height:52px;border-radius:50%;background:var(--zbior-tlo);color:var(--zbior-c);display:flex;align-items:center;justify-content:center;margin:0 auto 4px}
.m-ikona svg{width:24px;height:24px}
.btn-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin-top:16px;padding:11px 0;border:1.5px solid #E2DAE0;border-radius:12px;background:#F7F5F6;font-size:14.5px;font-weight:800;color:#2B2028;cursor:pointer;font-family:inherit}
.btn-google:hover{background:#F0EDEF}
.m-divider{display:flex;align-items:center;gap:10px;margin:14px 0 10px;color:#9A8C95;font-size:11.5px}
.m-divider::before,.m-divider::after{content:'';flex:1;height:1px;background:#EFE7EC}
.m-pole{text-align:left;margin-bottom:10px}
.m-pole label{display:block;font-size:12.5px;font-weight:800;margin-bottom:4px;color:#2B2028}
.m-pole input{width:100%;padding:10px 12px;border:1.5px solid #E2DAE0;border-radius:10px;font-size:14.5px;font-family:inherit;background:#fff;color:#2B2028}
.m-pole input:focus{outline:none;border-color:var(--zbior)}
.m-check{display:flex;align-items:center;gap:7px;font-size:12px;color:#71636C;text-align:left;margin:4px 0 2px;cursor:pointer}
.m-check a{color:var(--zbior-c);font-weight:700;text-decoration:underline;cursor:pointer}
.m-stopka{margin-top:12px;font-size:13px;color:#71636C}
.m-stopka a{color:var(--zbior-c);font-weight:800;cursor:pointer}
.modal-gen .zamknij{margin-top:9px;background:none;border:0;color:#71636C;cursor:pointer;font-size:12px;text-decoration:underline}

/* ===== treść zadań (konwersja z LaTeX) ===== */
.tresc-zad p{margin:0 0 10px}
.tresc-zad p:last-child{margin-bottom:0}
.tresc-zad .c{text-align:center;margin:10px 0}
.tresc-zad img.rys{max-width:100%;height:auto;display:inline-block}
.tab-cke{border-collapse:collapse;margin:8px auto;background:#fff}
.tab-cke td{border:1px solid #1a1a1a;padding:4px 10px;text-align:center;font-size:14.5px}
.tab-cke td.tlo{background:#F0F0F0}
.mbox{display:inline-block;vertical-align:top}
.qq{display:inline-block;width:2em}
.q{display:inline-block;width:1em}
.hsp{display:inline-block;width:.8em}
.ramka{border:1px solid #1a1a1a;padding:2px 8px;display:inline-block}
.wybor-inline{display:inline-table;border-collapse:collapse;vertical-align:middle;margin:0 3px}
.wybor-inline td{border:1px solid #1a1a1a;padding:2px 12px;font-weight:700;font-size:13.5px;cursor:pointer;background:#fff}
.wybor-inline td.dobra{background:#DDF0E6}
.wybor-inline td.zla{background:#F8E2DC}
.wybor-inline td.wyb{outline:2px solid var(--zbior)}
/* uwaga "Dlaczego?" jak w zbiorze: zielony bold label, treść przygaszona */
.gkrok .uw{font-size:13.5px;color:var(--szary);margin-top:8px}
.gkrok .uw b{color:var(--zbior)}
.odp-box .katex{font-size:1em}
.katex{font-size:1.06em}
.tresc-zad .katex-display{margin:8px 0}
.otwarte-ocena{display:none;margin:12px 16px 0;gap:10px}
.otwarte-ocena.widoczna{display:flex}
.otwarte-ocena button{flex:1;padding:9px 0;border-radius:9px;font-weight:800;font-size:13.5px;cursor:pointer;font-family:inherit;border:1.5px solid}
.otwarte-ocena .dob{border-color:#49682F;color:#49682F;background:#fff}
.otwarte-ocena .dob:hover{background:#EAF2E2}
.otwarte-ocena .zle{border-color:#8A3321;color:#8A3321;background:#fff}
.otwarte-ocena .zle:hover{background:#FAE6E0}
.gen-info{margin:10px 16px 0;padding:9px 12px;border-radius:9px;background:#F6F1F4;color:#71636C;font-size:12.5px;display:none}
.gen-info.widoczna{display:block}

/* ===== siatka ABCD (render z opcje_html) ===== */
.odp-siatka{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:9px;margin-top:13px}
.odp-siatka .odp-cke b{margin-right:4px}

/* ===== cennik na stronie generatora ===== */
.gen-cennik{margin:34px 0 8px;padding:26px 22px;background:var(--biel);border:1px solid #EFE7EC;border-radius:16px}
.gen-cennik h2{font-size:22px;font-weight:800;text-align:center;margin:0 0 6px}
.gen-cennik-pod{text-align:center;color:var(--szary);font-size:14px;margin:0 0 20px}
.gen-karty{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;max-width:760px;margin:0 auto}
.gen-karta{border:1.5px solid #E6DEE3;border-radius:14px;padding:20px;display:flex;flex-direction:column;position:relative;background:#fff}
.gen-karta.wyrozniona{border-color:var(--zbior);box-shadow:0 4px 18px rgba(112,128,80,.14)}
.gen-karta .badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--zbior);color:#fff;font-size:11px;font-weight:800;letter-spacing:.04em;padding:3px 12px;border-radius:20px;white-space:nowrap}
.gen-karta h3{font-size:16px;font-weight:800;margin:0 0 8px}
.gen-karta .cena{display:flex;align-items:baseline;gap:8px;margin-bottom:12px}
.gen-karta .cena b{font-size:30px;font-weight:800;color:var(--zbior-c)}
.gen-karta .cena span{font-size:12.5px;color:var(--szary)}
.gen-karta ul{list-style:none;padding:0;margin:0 0 16px;flex:1}
.gen-karta li{font-size:13.5px;padding:4px 0 4px 20px;position:relative}
.gen-karta li::before{content:'✓';position:absolute;left:0;color:var(--zbior-c);font-weight:800}
.gen-karta .btn{text-align:center}

/* ===== blok SEO ===== */
.gen-seo{margin:10px 0 40px;padding:0 4px;color:var(--tekst)}
.gen-seo h2{font-size:17px;font-weight:800;margin:0 0 8px}
.gen-seo p{font-size:14px;line-height:1.7;color:#55454E;margin:0 0 10px}
.obszar-gen.ciemny .gen-cennik,.obszar-gen.ciemny .gen-karta{background:var(--biel);border-color:#352B3C}
.gen-karta .cena s{font-size:16px;color:#A89AA2;font-weight:700}
.ring-p{width:24px;height:24px;border-radius:50%;border:3px solid #EBE4DE;display:block}

/* ===== FAQ (zwijane - treść w DOM dla wyszukiwarek, wizualnie 5 linijek) ===== */
.gen-faq-sek{margin:6px 0 40px}
.gen-faq-sek h2{font-size:17px;font-weight:800;margin:0 0 10px}
.gen-faq{border:1px solid #EFE7EC;border-radius:11px;background:var(--biel);margin-bottom:8px;padding:0 16px}
.gen-faq summary{cursor:pointer;font-weight:700;font-size:14.5px;padding:12px 0;list-style:none;position:relative;padding-right:26px}
.gen-faq summary::after{content:'▾';position:absolute;right:2px;color:var(--zbior-c);transition:transform .15s}
.gen-faq[open] summary::after{transform:rotate(180deg)}
.gen-faq p{font-size:14px;line-height:1.65;color:#55454E;margin:0;padding:0 0 14px}
.obszar-gen.ciemny .gen-faq{background:var(--biel);border-color:#352B3C}

/* kreciolek na czas pierwszego losowania (placeholder w SSR) */
.gen-spin{display:inline-block;width:17px;height:17px;border:2.5px solid #E5DCE1;border-top-color:var(--zbior);border-radius:50%;margin-right:9px;vertical-align:-3px;animation:genspin .8s linear infinite}
@keyframes genspin{to{transform:rotate(360deg)}}

/* klikalne odpowiedzi A.-E. zapisane w tresci (30 zadan bez \abcd) */
.odp-linia{cursor:pointer;border-radius:7px;padding:2px 7px;margin:-2px -7px;transition:background .1s}
.odp-linia:hover{background:var(--zbior-tlo)}
.odp-linia.dobra{background:#EAF5EF;box-shadow:inset 0 0 0 1.5px #2F7D5D}
.odp-linia.zla{background:#FAEDE8;box-shadow:inset 0 0 0 1.5px #B5442E}
/* klikalne komorki Prawda/Falsz w tabelkach (114 zadan) */
.td-pf{cursor:pointer;transition:background .1s}
.td-pf:hover{background:var(--zbior-tlo)}
.td-pf.wyb{outline:2px solid var(--zbior);outline-offset:-2px}
.td-pf.dobra{background:#EAF5EF}
.td-pf.zla{background:#FAEDE8}