/* Theme 3 - baza CSS: fonty, tokeny, reset, layout, komponenty (Zadanie 2) */

/* ===== FONTY (self-hosted, latin-ext) ===== */
@font-face{font-family:'IBM Plex Sans';src:url(/theme/3/fonts/ibm-plex-sans-v23-latin_latin-ext-regular.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url(/theme/3/fonts/ibm-plex-sans-v23-latin_latin-ext-500.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url(/theme/3/fonts/ibm-plex-sans-v23-latin_latin-ext-600.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url(/theme/3/fonts/ibm-plex-sans-v23-latin_latin-ext-700.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Barlow Semi Condensed';src:url(/theme/3/fonts/barlow-semi-condensed-v16-latin_latin-ext-500.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Barlow Semi Condensed';src:url(/theme/3/fonts/barlow-semi-condensed-v16-latin_latin-ext-600.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}

/* ===== TOKENS ===== */
:root{--brand:#d43e49;--brand-h:#AA3A43;--brand-l:#ff6b76;--brand-bg:#fbeced;--ok:#2fa26b;
 /* --bg biale (decyzja D1): tlo jak w interii/onecie, separacje przejmuja kreski i pasy.
    --band to juz nie "tlo o oczko ciemniejsze od strony", tylko delikatny pas rozdzielajacy.
    UWAGA: --band przestaje nadawac sie na KRESKE (1,09:1 wobec bieli) - patrz Krok 8 */
 --dark:#1b1e24;--darker:#0d0f13;--bg:#ffffff;--band:#f4f5f8;--line:#e2e5eb;--hair:#d9dce3;
 --txt:#1d222b;--txt-h:#14171d;--txt-2:#626b79;--txt-3:#8b93a1;--container:1320px;
 /* --card-sh:none - na bialym tle cien jest brudem, nie separacja. Karty stojace na tle
    strony maja border:1px solid var(--line) (wypisane nizej, jedna po drugiej).
    --card-sh-h zostaje: uzywany WYLACZNIE na :hover jako sygnal interakcji */
 --card-sh:none;--card-sh-h:0 6px 18px rgba(16,20,28,.13);
 --f-ui:'IBM Plex Sans',system-ui,sans-serif;--f-lab:'Barlow Semi Condensed',var(--f-ui);
 /* kolory sekcji: --sec-* to wartosci ustawiane dzis inline jako --ac w indexPolska.tpl /
    indexMiasta.tpl (zebrane tu, zeby byly jednym zrodlem prawdy). To kolory "jasne",
    uzywane na kreske belki .tm-shead i chip .tm-kat - NIE pod bialy tekst na duzej plamie. */
 --sec-biznes:#226697;
 --sec-sport:#3f9142;
 --sec-kultura:#c78a1e;
 --sec-zdrowie:#b0578d;
 --sec-moto:#54637a;
 --sec-turystyka:#12aab5;
 /* warianty kolorow sekcji dla kafla typograficznego .tm-nofoto (warstwa B).
    Biel na plaskim kolorze sekcji: #3f9142 daje 3,93:1, #c78a1e 2,97:1 - ponizej AA.
    Tekstura kafla dodatkowo rozjasnia tlo, wiec budzet bieli tekstury ograniczono do 0,06
    (--nofoto-tex) i przy takim budzecie ponizsze warianty daja min. 4,50:1.
    UWAGA: --ac-dark BEZ SUFIKSU celowo NIE jest tu zdefiniowany i NIE WOLNO go tu dopisac.
    Regula .tm-nofoto ma lancuch fallbacku var(--ac-dark,var(--ac,var(--brand))) - gdyby
    token istnial globalnie, lancuch bylby martwy i KAZDY kafel wyszedlby czerwony.
    Wartosc ustawia sekcja inline na <section> (warstwa C). */
 --ac-dark-fakty:#d23440;   /* z #d43e49 - plasko 4,88:1, pod tekstura 4,50:1 */
 --ac-dark-biznes:#226697;  /* bez zmian  - plasko 6,15:1, pod tekstura 5,41:1 */
 --ac-dark-sport:#367c39;   /* z #3f9142 - plasko 5,12:1, pod tekstura 4,55:1 */
 --ac-dark-kultura:#936616; /* z #c78a1e - plasko 5,06:1, pod tekstura 4,51:1 */
 --ac-dark-zdrowie:#a95086; /* z #b0578d - plasko 5,03:1, pod tekstura 4,52:1 */
 --ac-dark-moto:#54637a;    /* bez zmian  - plasko 6,10:1, pod tekstura 5,33:1 */
 /* z #12aab5 - Turystyka miala do 2026-09-05 ten sam kolor co Sport (--ac-dark-sport),
    co kasowalo kodowanie kolorem miedzy dzialami; turkus to nowa, samodzielna barwa
    (odcien 184st, w polowie drogi miedzy zielenia sportu a granatem biznesu, ale
    odlegly od obu o >20st) - plasko 5,23:1, pod tekstura 4,67:1 */
 --ac-dark-turystyka:#0d7880;
 /* Dom i nieruchomosci oraz Edukacja - dwa dzialy dolozone 2026-09-08. Wolne pola na kole
    barw byly juz tylko dwa: cieply braz/terakota i fiolet; pozostale odcienie nalezaly do
    dzialow istniejacych (czerwien, granat, zielen, ochra, magenta, szaroniebieski, turkus).
    Edukacja NIE bierze #b0578d z projektu SG (docs/superpowers/specs/2026-07-02-theme3-design.md),
    bo to barwa sekcji "Zdrowie i Rodzina" - dwa dzialy w jednym kolorze kasuja kodowanie
    kolorem, dokladnie jak Turystyka i Sport przed 2026-09-05. */
 --ac-dark-dom:#a8502f;      /* z #b5562a - plasko 5,45:1, pod tekstura 4,86:1 */
 --ac-dark-edukacja:#6b4ba8; /* bez zmian  - plasko 6,57:1, pod tekstura 5,72:1 */
 /* maksymalne laczne krycie bieli dekoracji .tm-nofoto - NIE podnosic bez ponownego pomiaru */
 --nofoto-tex:.06;
 /* metryczka na kaflu .tm-oc: .66 z makiety daje 3,55:1 na bialym zdjeciu (ponizej AA),
    .85 daje 4,69:1 w tym samym najgorszym punkcie */
 --oc-meta:rgba(255,255,255,.85);
 /* tlo pasa pelnej szerokosci sekcji Kultura (warstwa C) */
 --tint-kultura:#fdf7ec;
 /* przyciemnienie kafla .tm-oc - stopa .90 daje 16:1, punkt 32% (gorna krawedz tekstu)
    5,75:1 na skrajnie bialym zdjeciu; ponizej 32% tekst nie siega */
 --ov:linear-gradient(to top,rgba(6,8,12,.90) 0%,rgba(6,8,12,.62) 32%,rgba(6,8,12,.10) 62%,rgba(6,8,12,0) 100%);
 /* pas lokalny "Twoje miasto" (indexMiasta.tpl, wariant V3) - chlodny granat odroznia
    tresc miejska od czerwieni marki, ktora zostaje kolorem sekcji krajowych */
 --loc:#15588c;--loc-bg:#eef4fa;--loc-line:#dbe4ee}

/* ===== KONSEKWENCJE BIALEGO TLA (decyzja D1) - inwentarz swiadomych decyzji =====
   Karty stojace SAMODZIELNIE na tle strony dostaly border:1px solid var(--line):
     .tm-card .tm-latest .tm-top5 .tm-mini .tm-skrot .tm-band2 .tm-w .tm-mbar
     .tm-art-card .tm-art-rc .tm-art-com .tm-art-sad .tm-art-wid .tm-adm-side
     .tm-icobtn .tm-ucard oraz mobilny wariant .tm-li
   (.tm-artcard i .tm-pagecard dziedzicza ramke po .tm-card - nie wymagaja wlasnej reguly.)

   BEZ ZMIAN - mialy juz wlasne obramowanie, wiec zdjecie cienia niczego nie psuje:
     .tm-wt, .tm-mtcta, .tm-side30, .tm-search, .tm-chip, .tm-cchip, .tm-art-tag,
     .tm-art-cf, .card (compat.css), .img-thumbnail (compat.css), .tm-pv-* (wlasne ramki),
     .tm-top - pasek gorny stoi bezposrednio na tle strony (regula najwyzszego poziomu,
     nie element wewnatrz karty), ale ma wlasna kreske border-bottom:1px solid var(--line),
     wiec na bieli nadal odcina sie od tresci mimo tla --band

   BEZ ZMIAN - to placeholdery/plamy z wlasnym tlem, czytelne na bieli:
     .tm-ad (#dfe2e8 + dashed), .tm-art-ad (#f0f1f5 + dashed),
     .tm-art-pap (#f2f3f6), .tm-art-sadi (gradient),
     .tm-hbig / .tm-cimg / .tm-mimg / .tm-lth (ciemne gradienty)

   BEZ ZMIAN - var(--band) w roli TLA wewnatrz obramowanej karty (nie stoi na tle strony):
     .tm-mtd, .tm-mtgrid li, .tm-mth1, .tm-mtmin, .tm-mtch, .tm-mtday, .tm-aqnow,
     .tm-aqbar, .tm-wtlegend, .tm-wtrow:hover, .tm-pgchip, .tm-pgw path
   Zmiana --band z #eef0f4 na #f4f5f8 to roznica jednego oczka - te elementy pozostaja
   czytelne, bo maja wokol siebie ramke karty rodzica.

   .tm-art-ca (awatar komentarza) NIE dostal ramki, tylko zmiane tla var(--bg) -> var(--band):
   to kolko, nie karta; na bialym --bg zniknelo by na bialej karcie .tm-art-com. */

/* ===== RESET ===== */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--txt);font:15px/1.5 var(--f-ui);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}a{color:inherit;text-decoration:none}

/* ===== LAYOUT ===== */
.tm-in{max-width:var(--container);margin:0 auto;padding:0 16px}
.tm-cols{display:flex;gap:24px;align-items:flex-start}
.tm-mainc{flex:1;min-width:0}
.tm-side{width:300px;flex:none;display:flex;flex-direction:column;gap:18px}
@media(max-width:880px){.tm-cols{flex-direction:column}.tm-mainc{width:100%}.tm-side{width:100%}}

/* ===== KOMPONENTY ===== */
.tm-card{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh)}
a.tm-card{display:block;transition:box-shadow .15s,transform .15s,border-color .15s}
a.tm-card:hover{box-shadow:var(--card-sh-h);transform:translateY(-2px);border-color:#cfd4de}
.tm-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid #dfe2e9;border-radius:999px;padding:5px 12px;font-size:13px;font-weight:500}
.tm-btn{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(180deg,#e04b56,var(--brand));color:#fff;font-weight:600;font-size:13.5px;padding:10px 17px;border-radius:999px;box-shadow:0 6px 16px -6px rgba(212,62,73,.55)}
.tm-btn:hover{background:var(--brand-h)}
/* chip kategorii bierze --ac-dark (zmierzony na AA dla bialego tekstu, np. sport #367c39=5,12:1),
   a nie surowe --ac: bialy na jasniejszym --ac (np. #3f9142) dawal 3,93:1, ponizej AA 4,5:1.
   Lancuch fallbacku jest monotoniczny - gdzie --ac-dark nie ustawiono (hero), schodzi na --ac,
   a w ostatecznosci --brand (4,6:1), wiec nigdzie nie pogarsza kontrastu. Chip NA zdjeciu ma
   ciemne tlo z reguly .tm-oc .tm-kat (wyzsza specyficznosc), wiec ta zmiana go nie dotyczy. */
.tm-kat{display:inline-block;background:var(--ac-dark,var(--ac,var(--brand)));color:#fff;font:600 10.5px/1 var(--f-lab);letter-spacing:.16em;text-transform:uppercase;padding:5px 8px 4px}
/* belka sekcji: kreska 3 px w kolorze sekcji (--ac) biegnie przez cala szerokosc kolumny -
   to ona niesie kolor dzialu, dlatego .tm-stit::before (pasek 5x22) zostal usuniety.
   align-items:flex-end wyrownuje baseline tytulu, kursow NBP (TMnbp w belce Biznesu -
   po usunieciu boxu z sidebara jedyne miejsce z kursami) i linku "wiecej" do kreski */
.tm-shead{display:flex;align-items:flex-end;gap:13px;margin:34px 0 18px;padding-bottom:6px;border-bottom:3px solid var(--ac,var(--brand))}
.tm-stit{display:flex;align-items:center;gap:10px;font:500 30px/1 var(--f-lab);letter-spacing:.02em;text-transform:uppercase;color:var(--dark);white-space:nowrap}
/* .tm-stit::before (pasek 5x22 px w --ac) usuniety w warstwie A - kolor sekcji niesie teraz
   kreska border-bottom na .tm-shead; dwa akcenty naraz czytaly sie jako szum */
/* .tm-sline zostaje w szablonach jako rozpychacz flex (odsuwa "wiecej" w prawo), ale nie
   rysuje juz kreski - kreske przejal border-bottom .tm-shead. Zero zmian w .tpl
   (indexPolska.tpl:18,42,55,61,73,85,99,115,127 oraz indexMiasta.tpl - 9 wystapien) */
.tm-sline{flex:1;height:0}
.tm-morel{margin-left:auto;font:600 12.5px/1 var(--f-lab);letter-spacing:.14em;text-transform:uppercase;color:var(--txt-2);padding-bottom:3px}
.tm-morel:hover{color:var(--ac,var(--brand))}

/* ===== NAGŁÓWEK SERWISU ===== */
/* Odchudzony 2026-10-05 (pomysł #474, reklama A na pierwszym ekranie SG miasta) z 215 do ok. 190 px
   na desktopie: pasek górny 6/6 -> 4/4, pas z logo 14/11 -> 9/8 i logo 215x71 -> 195x65, menu 11 -> 9,
   FLASH 8 -> 6. Nagłówek jest wspólny dla wszystkich stron i portali; telefon (max-width:880px) ma
   własne wartości niżej i się nie zmienia. */
/* pasek górny: miasto, pogoda, jakość powietrza, data - źródło: naglowek-final.html */
.tm-top{background:var(--band);border-bottom:1px solid var(--line);font-size:12.5px;color:var(--txt-2)}
.tm-toprow{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding-top:4px;padding-bottom:4px}
.tm-top svg{flex:none}
.tm-city{display:flex;align-items:center;gap:6px;background:none;border:0;font:inherit;color:var(--txt);font-weight:600;font-size:13px;cursor:pointer}
.tm-city svg{color:var(--brand)}
.tm-city:hover span{color:var(--brand-h)}
/* pozycja pogoda/powietrze w pasku górnym - nadpisuje generyczny .tm-chip (pigułkę) w tym kontekście, bo tu to zwykły rządek ikona+tekst */
.tm-top .tm-chip{display:flex;gap:6px;white-space:nowrap;border:0;padding:0;border-radius:0;font-size:inherit;font-weight:400}
.tm-chip b{color:var(--txt);font-weight:600}
.tm-ok{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 6px rgba(47,162,107,.55);flex:none}
.tm-date{margin-left:auto;letter-spacing:.02em}
.tm-wz{white-space:nowrap}
/* pasek z logo, wyszukiwarką i logowaniem */
.tm-band{background:linear-gradient(180deg,#ffffff,#fafbfc)}
.tm-main{display:flex;align-items:center;gap:18px;padding-top:9px;padding-bottom:8px}
.tm-logo img{display:block;width:clamp(160px,19vw,195px);height:auto}
.tm-search{flex:1;min-width:150px;max-width:360px;margin-left:auto;display:flex;align-items:center;gap:9px;background:var(--band);border:1px solid #dfe2e9;border-radius:999px;padding:8px 15px;color:#7c8595;transition:border-color .2s,box-shadow .2s,background .2s}
.tm-search:hover,.tm-search:focus-within{border-color:var(--brand);background:#fff;box-shadow:0 4px 16px -6px rgba(212,62,73,.35)}
.tm-search input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--txt);font:inherit;font-size:16px}
.tm-search input::placeholder{color:#7c8595;font-size:13px}
/* margin-left:auto przeniesiony z .tm-search - po zdjeciu wyszukiwarki (brak modulu
   w silniku, 2026-07-21) nic nie dopychalo przycisku logowania do prawej krawedzi */
.tm-login{flex:none;margin-left:auto;display:inline-flex;align-items:center;gap:7px;background:linear-gradient(180deg,#e04b56,var(--brand));color:#fff;font-weight:600;font-size:13px;padding:9px 16px;border-radius:999px;box-shadow:0 6px 16px -6px rgba(212,62,73,.55);transition:background .2s}
.tm-login:hover{background:var(--brand-h)}
/* Rozkłady jazdy w pasku z logo (2026-09-06, tymczasowe ukrycie menu działów na miastach -
   patrz komentarz przy $tmDzialyWMenu w default.tpl). Obrys zamiast pełnego gradientu jak
   .tm-login: dwa jednakowo mocne przyciski obok siebie zacierają hierarchię, a Rozkłady to
   nawigacja, nie akcja konta. Tekst --brand-h na bieli daje 6,2:1 (samo --brand to 4,6:1 -
   przechodzi AA, ale bez zapasu). Hover odwraca układ na pełny --brand z białym tekstem. */
.tm-rozklnav{flex:none;margin-left:auto;display:inline-flex}
.tm-rozkl{display:inline-flex;align-items:center;gap:7px;background:#fff;color:var(--brand-h);font-weight:600;font-size:13px;padding:8px 15px;border:1px solid var(--brand);border-radius:999px;white-space:nowrap;transition:background .2s,color .2s}
.tm-rozkl:hover{background:var(--brand);color:#fff}
/* margin-left:auto może w tym pasku należeć tylko do JEDNEGO elementu - dwa rozdzieliłyby
   wolne miejsce po równo i zawiesiły Rozkłady w pół drogi od logo. Auto przejmuje .tm-rozklnav
   (stoi wcześniej), a .tm-login je oddaje - dotąd był jedynym, który dopychał pasek do prawej
   (patrz komentarz przy .tm-login wyżej). Gdy przycisku nie ma, .tm-login działa jak dotąd.
   Selektor celuje w OPAKOWANIE, bo to ono jest dzieckiem .tm-main i sąsiadem .tm-login -
   sam .tm-rozkl siedzi piętro niżej i sąsiadem już nie jest. */
.tm-rozklnav+.tm-login{margin-left:0}
/* pasek nawigacji głównej */
.tm-navband{background:#fff;border-top:1px solid #e8eaef}
.tm-nav{display:flex;flex-wrap:wrap;align-items:stretch;font-family:var(--f-lab);font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-size:14px}
.tm-nav a{position:relative;display:flex;align-items:center;padding:9px 13px;color:#3a4250;transition:color .15s}
.tm-nav a::after{content:"";position:absolute;left:13px;right:13px;bottom:-1px;height:3px;background:linear-gradient(90deg,var(--brand),var(--brand-l));transform:scaleX(0);transform-origin:left;transition:transform .22s}
.tm-nav a:hover,.tm-nav a.tm-act{color:var(--brand)}
.tm-nav a:hover::after,.tm-nav a.tm-act::after{transform:scaleX(1)}
.tm-more{margin-left:auto;gap:5px;color:#7c8595}
/* Waskie okno desktopowe (881-1100 px): belka dzialow ma tu zostac JEDNYM rzedem.
   Do 2026-09-08 nie trzeba bylo o to zabiegac - siedem pozycji zawijalo sie dopiero
   ponizej ~778 px viewportu, czyli juz pod progiem @media(max-width:880px), ktory chowa
   cala belke pod hamburger. Dolozenie dzialow Dom i Edukacja (+146 px zmierzone
   w Chromium z fontami motywu) przesunelo prog zawijania na 924 px dla portalu
   ogolnopolskiego (9 pozycji, suma 860 px) i 1016 px dla miasta bez rozkladow
   (10 pozycji, suma 953 px) - powstal wiec zakres, w ktorym belka jest jednoczesnie
   widoczna i zawinieta. Wygladalo to zle nie tyle przez sama dwurzedowosc, co przez
   .tm-more z margin-left:auto: w drugim rzedzie zostawal sam link "Wiecej" dosuniety
   do prawej krawedzi nad pustym pasem, a naglowek rosl z 44 na 87 px, spychajac cala
   strone o 43 px w dol. Belka siedzi w default.tpl, wiec dotyczylo to KAZDEJ podstrony.
   Zageszczamy pozycje zamiast skracac etykiety albo podnosic prog hamburgera: etykiety
   sa wspolne z belka sticky i z SEO, a hamburger na 1000 px odbieralby menu tam, gdzie
   miejsca jest az nadto. Podkreslenie .tm-nav a::after musi dostac te sama wartosc
   co padding poziomy - inaczej kreska aktywnej pozycji rozjedzie sie z jej obrysem. */
@media(min-width:881px) and (max-width:1100px){
 .tm-nav{letter-spacing:.02em}
 .tm-nav a{padding:9px 8px}
 .tm-nav a::after{left:8px;right:8px}
}
/* ===== NAGŁÓWEK PORTALU MIEJSKIEGO (2026-09-30, makieta SG-desktop) =====
   Chip rzeki w pasku górnym, belka "Działy i usługi" (separator, usługi dnia w kolorze --loc,
   panel "Więcej" na <details>), skrócona belka sticky i etykieta tickera "{Miasto} · teraz".
   Markup w default.tpl; lista usług panelu w tpl/inc/uslugi.tpl. */
.tm-rzchip svg{color:var(--loc)}
.tm-top a.tm-chip:hover{color:var(--brand-h)}
.tm-navsep{flex:none;width:1px;background:var(--line);margin:10px 8px}
.tm-nav a.tm-navusl{color:var(--loc)}
.tm-nav a.tm-navusl:hover,.tm-nav a.tm-navusl.tm-act{color:var(--brand)}
/* "Więcej": natywny <details> - otwiera się bez JS, js.js zamyka go po kliknięciu obok i ESC.
   Panel wisi pod belką przy prawej krawędzi (z-index nad tickerem i treścią, pod modalem 120) */
.tm-navmore{position:relative;margin-left:auto;display:flex}
.tm-navmore>summary{display:flex;align-items:center;gap:5px;padding:9px 4px 9px 13px;color:#626b79;cursor:pointer;list-style:none;-webkit-user-select:none;user-select:none}
.tm-navmore>summary::-webkit-details-marker{display:none}
.tm-navmore>summary:hover,.tm-navmore[open]>summary{color:var(--brand)}
.tm-navmore>summary:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.tm-navmore>summary svg{transition:transform .2s}
.tm-navmore[open]>summary svg{transform:rotate(180deg)}
.tm-navpanel{position:absolute;right:0;top:100%;z-index:60;display:grid;grid-template-columns:auto auto;gap:6px 40px;min-width:560px;padding:16px 22px 18px;background:#fff;border:1px solid var(--line);border-radius:0 0 10px 10px;box-shadow:0 18px 40px -12px rgba(16,20,28,.28);font:500 14px/1.3 var(--f-ui);letter-spacing:0;text-transform:none}
.tm-navgr{display:flex;flex-direction:column;min-width:0}
.tm-navgr-usl{display:grid;grid-template-columns:repeat(2,minmax(150px,auto));column-gap:28px;align-content:start}
.tm-navgh{grid-column:1/-1;margin-bottom:6px;font:600 11.5px var(--f-lab);letter-spacing:.16em;text-transform:uppercase;color:var(--txt-2)}
.tm-nav .tm-navpanel a{display:block;padding:6px 0;color:var(--txt)}
.tm-nav .tm-navpanel a::after{display:none}
.tm-nav .tm-navgr-usl a{color:var(--loc)}
.tm-nav .tm-navpanel a:hover{color:var(--brand)}
/* wąskie okno desktopowe: grupa usług chowa się, żeby belka została jednym rzędem - wszystkie
   usługi są w panelu "Więcej" i w rzędzie "Miasto na co dzień" na stronie głównej */
@media(min-width:881px) and (max-width:1180px){
 .tm-navsep,.tm-nav a.tm-navusl{display:none}
}
/* pasek górny zostaje jednym wierszem - poniżej 1024 px chip rzeki go łamał (stan wody jest też
   w karcie "Dziś w mieście" i w menu). Selektor z .tm-top, bo .tm-top .tm-chip ma display:flex */
@media(max-width:1024px){
 .tm-top .tm-rzchip{display:none}
}
/* belka sticky portalu miejskiego: Kalendarz i Turystyka ustępują miejsca chipowi miasta */
@media(max-width:1100px){
 .tm-sticknav .tm-stickopt{display:none}
}
@media(max-width:880px){
 /* przycisk rozkładów i hamburger stoją obok siebie: auto zostaje przy opakowaniu rozkładów */
 .tm-rozklnav~.tm-burger{margin-left:0}
 /* menu rozwinięte hamburgerem: separator poziomy, panel "Więcej" rozwija się w miejscu */
 #tmMenuToggle:checked ~ .tm-navband .tm-navsep{width:auto;height:1px;margin:6px 16px}
 #tmMenuToggle:checked ~ .tm-navband .tm-navmore{margin-left:0;flex-direction:column}
 .tm-navmore>summary{padding:12px 16px;border-bottom:1px solid #eef0f4}
 .tm-navpanel{position:static;display:block;min-width:0;padding:8px 16px 14px;border:0;border-radius:0;box-shadow:none;background:var(--band)}
 .tm-navgr+.tm-navgr{margin-top:12px}
 .tm-navgr-usl{grid-template-columns:1fr 1fr;column-gap:16px}
 #tmMenuToggle:checked ~ .tm-navband .tm-nav .tm-navpanel a{padding:8px 0;border-bottom:0}
}
/* etykieta tickera na telefonie: samo "teraz" - nazwa miasta zjadałaby pasek */
@media(max-width:560px){
 .tm-flash-m{display:none}
}
/* ticker FLASH */
.tm-ticker{background:var(--dark);border-top:2px solid var(--brand);border-bottom:3px solid var(--brand)}
.tm-tickrow{display:flex;align-items:stretch;overflow:hidden}
.tm-flash{flex:none;display:flex;align-items:center;gap:9px;background:var(--darker);color:#fff;font-family:var(--f-lab);font-weight:600;font-size:13px;letter-spacing:.16em;padding:6px 20px 6px 18px;clip-path:polygon(0 0,100% 0,calc(100% - 12px) 100%,0 100%);text-transform:uppercase}
.tm-flash i{font-style:normal;color:#ff8f97;font-weight:500;letter-spacing:.05em}
.tm-pulse{width:9px;height:9px;border-radius:50%;background:#ff5560;box-shadow:0 0 0 0 rgba(255,85,96,.75);animation:tmPul 1.4s ease-out infinite;flex:none}
@keyframes tmPul{70%{box-shadow:0 0 0 9px rgba(255,85,96,0)}100%{box-shadow:0 0 0 0 rgba(255,85,96,0)}}
/* pasek przewijanych nagłówków (tm-tick-belt); animowany wrapper .tm-belt-run objęty regułą prefers-reduced-motion na końcu pliku */
.tm-tick-belt{flex:1;overflow:hidden;display:flex;align-items:center;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
/* animacja na wspólnym wrapperze dwóch list (.tm-belt-run); druga lista to duplikat dla płynnej pętli
   (w default.tpl oznaczona aria-hidden="true", żeby czytniki ekranu nie czytały tytułów podwójnie) */
.tm-belt-run{display:flex;width:max-content;animation:tmRun 32s linear infinite}
.tm-tick-belt ul{display:flex;width:max-content;list-style:none;margin:0;padding:0}
/* pauza ruchu tickera: :hover (mysz) + :focus-within (klawiatura - tab na link tickera
   zatrzymuje przewijanie, WCAG 2.2.2 poziom A) + :active (dotyk - przytrzymanie palcem).
   Bez :focus-within/:active auto-ruch >5s obok tresci nie mial zadnej pauzy dla klawiatury
   ani dotyku, a ruchome linki trudno bylo trafic palcem. */
.tm-tickrow:hover .tm-belt-run,.tm-tickrow:focus-within .tm-belt-run,.tm-tickrow:active .tm-belt-run{animation-play-state:paused}
@keyframes tmRun{to{transform:translateX(-50%)}}
.tm-tick-belt li{white-space:nowrap;font-size:13px;font-weight:500;color:#f2e9ea}
.tm-sep{margin:0 20px;color:var(--brand);font-weight:600;letter-spacing:2px}
/* kursy walut w pasku FLASH (idea #285), tylko przy zmianie dziennej nad progiem (TMkursyTicker).
   .tm-nbp .up/.dn (wyzej w pliku, sekcja Strefy Biznesu) sa dobrane pod BIALE tlo - tu tlo jest
   ciemne (var(--dark)), wiec osobne odcienie: #4ade80 na #1b1e24 to ~9,6:1, #ff8f97 (juz uzywany
   w .tm-flash i) to ~7,7:1 - oba mocno powyzej progu AA (4,5:1) dla tekstu 13px */
.tm-nbp-tick .up{color:#4ade80}
.tm-nbp-tick .dn{color:#ff8f97}

/* ===== KARTY I SEKCJE SG ===== */
/* źródło: modernizacja-sg-polska.html - hero, top5, minisy, karty, pasy sekcji, sidebar SG */
.tm-shead:first-child{margin-top:0}
.tm-morel{white-space:nowrap}
.tm-ad{background:#dfe2e8;border:1px dashed #c3c8d2;border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#98a0ad;font:600 12px var(--f-lab);letter-spacing:.28em;text-transform:uppercase;gap:3px}
.tm-ad small{letter-spacing:.1em;font-size:10px}
/* kursy walut w nagłówku sekcji Strefa Biznesu */
.tm-nbp{display:flex;gap:14px;font-size:12.5px;color:var(--txt-2);white-space:nowrap}
.tm-nbp b{color:var(--txt)}
/* zieleni --ok (#2fa26b) na bieli daje ~3,2:1 - ponizej AA dla tekstu 12,5 px; osobny,
   ciemniejszy odcien #1c7c43 (~5,3:1) tylko dla kursow w naglowku Strefy Biznesu */
.tm-nbp .up{color:#1c7c43}
.tm-nbp .dn{color:var(--brand)}
/* atrybucja zrodla surowcow (pomysl #314, EIA - dane rzadu USA, atrybucja zalecana a nie
   prawnie wymagana, ale dobra praktyka redakcyjna); mala, wtopiona w tlo, nie konkuruje z liczbami */
.tm-nbp-zrodlo{font-size:10px;color:var(--txt-2);opacity:.75}
/* hero + najnowsze */
.tm-hero{display:grid;grid-template-columns:1.55fr 1fr;gap:18px}
.tm-hbig{position:relative;display:flex;align-items:flex-end;height:400px;border-radius:8px;overflow:hidden;background:linear-gradient(128deg,#39465b,#75839b 58%,#a9b5c6)}
.tm-hshade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,15,19,0) 42%,rgba(13,15,19,.9))}
.tm-hbody{position:relative;padding:22px 24px}
.tm-htit{display:block;margin:11px 0 8px;font-size:27px;font-weight:600;line-height:1.18;color:#fff}
.tm-hlead{display:block;color:#d7dce4;font-size:14px;line-height:1.5}
.tm-hmeta{display:block;margin-top:9px;font-size:12px;color:#9aa3b1}
.tm-latest{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:14px 16px 8px}
.tm-lhead{display:flex;align-items:center;gap:9px;font:600 14px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;padding-bottom:9px;border-bottom:2px solid var(--dark)}
.tm-ldot{width:8px;height:8px;border-radius:50%;background:var(--brand)}
.tm-li{display:flex;gap:11px;padding:10px 0;border-bottom:1px solid var(--line)}
.tm-li:last-child{border-bottom:0}
.tm-lth{flex:none;width:62px;height:46px;border-radius:6px}
/* margin/display jawnie - element jest <h3> w wierszu "Najnowsze" (warstwa B4), bez tego
   margines 1em z arkusza przegladarki rozpycha wiersz */
.tm-lt{display:block;margin:0;font-size:13px;font-weight:500;line-height:1.3;color:#242a34}
/* .tm-ltime BEZ KONSUMENTA od 2026-09-10: metryczka daty zniknela z obu zywych szablonow
   kolumny "Najnowsze" (NT3najnowszeM, NT3najnowszeKol) - lista jest sortowana po addData
   w oknie 3 dni, wiec wszystkie pozycje pokazywaly praktycznie te sama date. Ostatnie
   wystapienie w repo siedzi w NT3najnowsze.tpl, ktory sam deklaruje sie jako martwy od
   2026-09-08. Regula zostaje na wypadek powrotu metryczki; usuwajac ja, usun tez tamten plik. */
.tm-ltime{display:block;font:600 10.5px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--brand);margin-bottom:2px}
/* sidebar "Warto przeczytać" - kompaktowa lista z miniaturą (wypełnia pustą przestrzeń sidebara na HD); własne klasy, bo .tm-li ma mobilny override na kafle */
.tm-sart{display:flex;gap:11px;padding:10px 0;border-bottom:1px solid var(--line)}
.tm-sart:last-child{border-bottom:0;padding-bottom:2px}
.tm-sart-th{flex:none;width:70px;height:52px;border-radius:6px;overflow:hidden;background:linear-gradient(128deg,#39465b,#75839b 58%,#a9b5c6)}
.tm-sart-th img{display:block;width:100%;height:100%;object-fit:cover}
.tm-sart-b{display:flex;flex-direction:column;gap:2px;min-width:0}
.tm-sart-k{font:600 10.5px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--brand)}
.tm-sart-t{font-size:13px;font-weight:500;line-height:1.3;color:#242a34}
.tm-sart:hover .tm-sart-t{color:var(--brand)}
/* siatka: hero-karta + top5 */
.tm-sgrid{display:grid;grid-template-columns:1.55fr 1fr;gap:18px;margin-bottom:16px}
/* .tm-card - dodatkowe właściwości dla kart z obrazkiem (bazowy wygląd w sekcji KOMPONENTY) */
.tm-card{overflow:hidden;display:flex;flex-direction:column}
/* .tm-cimg nie ma od 2026-09-07 ANI JEDNEGO użycia w markupie: kafle "Przeczytaj jeszcze"
   (tpl/artykuly.tpl) dokleiły ją sobie dla overflow i tła, a dostawały razem z tym tę sztywną
   wysokość - 250px zamiast ~128px z aspect-ratio:16/9, czyli zdjęcie 320x180 mocno przycięte
   w pionie na KAŻDEJ stronie artykułu. Nie nadawaj tej klasy elementowi, który ma własną
   wysokość; wspólne przycinanie i tło bierz z reguły .tm-cimg,.tm-mimg,.tm-lth,.tm-art-rci */
.tm-cimg{height:250px}
.tm-cb{padding:13px 15px 15px}
.tm-ct{display:block;margin:6px 0 7px;font-size:16.5px;font-weight:600;line-height:1.32}
.tm-cl{font-size:12.5px;color:var(--txt-2);line-height:1.45}
.tm-meta{display:block;margin-top:8px;font-size:11.5px;color:var(--txt-3)}
/* flex-kolumna z wierszami flex:1 - lista zawsze wypełnia wysokość karty obok (bez pustki na dole) */
.tm-top5{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:6px 16px;display:flex;flex-direction:column}
.tm-top5 .tm-t5{flex:1;align-items:center}
.tm-t5{display:flex;gap:11px;padding:11px 0;border-bottom:1px solid var(--line);align-items:baseline}
.tm-t5:last-child{border-bottom:0}
.tm-t5 b{font:600 17px var(--f-lab);color:var(--ac,var(--brand));flex:none;width:18px}
.tm-t5 span{font-size:13px;font-weight:500;line-height:1.35;color:#242a34}
/* minisy (4 w rzędzie) */
.tm-minis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.tm-mini{background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:var(--card-sh)}
.tm-mimg{height:96px}
.tm-mb{padding:9px 11px 11px}
.tm-mk{font:600 10px var(--f-lab);letter-spacing:.12em;text-transform:uppercase;color:var(--ac,var(--brand))}
/* margin skrotowo zamiast margin-top - po warstwie B .tm-mt zostaje juz TYLKO w kafelku
   sponsora GoWork (.tm-madv), gdzie element jest <span>; zapis jest tam rownowazny
   poprzedniemu, a skrot chroni przed marginesem UA, gdyby klasa wrocila na naglowek */
.tm-mt{display:block;margin:4px 0 0;font-size:12.5px;font-weight:500;line-height:1.3;color:#242a34}
/* kiosk Fakty (wariant 4): modifier siatki minisów - obrazy 16:9, 2 pełne rzędy po 4.
   Strojenie .tm-mimg/.tm-mb/.tm-mt usuniete: po warstwie B1 szablon NT3mini renderuje
   w tej siatce wylacznie kafle .tm-oc-m, a proporcje kiosku niesie .tm-kiosk .tm-oc-m. */
.tm-kiosk{margin-top:16px}
/* skrót wydarzeń - box z tekstowymi pozycjami pod kioskiem Fakty na SG (bez nagłówka od
   2026-09-10 - patrz reguła .tm-skrot w sekcji "RYTM STRONY GŁÓWNEJ /polska") */
.tm-skrot{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:16px 20px 10px;margin-top:14px}
.tm-sitem{display:block;break-inside:avoid;padding:8px 0;border-bottom:1px solid var(--hair);font-size:12.5px;font-weight:500;line-height:1.45;color:#242a34}
.tm-sitem b{display:block;font:600 9.5px var(--f-lab);letter-spacing:.11em;text-transform:uppercase;color:var(--txt-2);margin-bottom:2px}
/* pasy zapowiedzi kolejnych sekcji */
.tm-band2{display:flex;align-items:center;gap:13px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:13px 16px;margin-top:10px;color:var(--txt-2);font-size:12.5px}
.tm-band2 b{font:600 15px var(--f-lab);letter-spacing:.05em;text-transform:uppercase;color:var(--dark);display:flex;align-items:center;gap:9px}
.tm-band2 b::before{content:"";width:5px;height:16px;background:var(--ac,var(--brand));border-radius:2px}
/* sidebar SG (strona główna) */
.tm-w{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:14px 16px}
.tm-wh{display:flex;align-items:center;gap:9px;font:600 13.5px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--dark);margin-bottom:10px}
.tm-wh::before{content:"";width:8px;height:8px;background:var(--brand)}
.tm-cities{display:flex;flex-wrap:wrap;gap:7px}
.tm-cchip{border:1px solid #dfe2e9;border-radius:999px;padding:4px 11px;font-size:12px;font-weight:500;color:#3a4250}
.tm-cchip.tm-hot{background:var(--brand);border-color:var(--brand);color:#fff}
/* box pogody dla Polski (widget TMpogodaPolska / szablon NT3pogodaPolska) */
/* pas mapy na tincie, rozciągnięty na pełną szerokość boxu (ujemne marginesy kasują
   padding .tm-w 14px 16px): mapa zyskuje 32px szerokości w sidebarze 300px, a tinta
   "nieba" odcina ją od bieli karty - kontur państwa jest biały i dostaje miękki cień,
   przez co czyta się jak mapa serwisu meteo, nie jak szara plama */
.tm-pgmapw{margin:-4px -16px 0;padding:2px 4px 4px;background:linear-gradient(180deg,#e7eff7,#f6f9fc)}
/* mapa Polski z markerami miast (NT3pogodaMapaPL.tpl): Warszawa + największe miasta kraju */
.tm-pgmap{display:block;width:100%;height:auto}
.tm-pgw{filter:drop-shadow(0 2px 5px rgba(27,45,78,.16))}
.tm-pgw path,.tm-pgw polyline{fill:#fff;stroke:#ccd6e2;stroke-width:1;stroke-miterlimit:10}
.tm-pgmd{fill:var(--brand);stroke:#fff;stroke-width:2}
.tm-pgmc{fill:var(--brand-h)}
/* fill klasy to fallback - temperatury dostają inline fill z palety meteo widgetu (pole .kolor) */
.tm-pgmt{font:600 33px var(--f-lab);fill:var(--dark)}
.tm-pgmn{font:500 25px var(--f-lab);fill:#4d5665;text-anchor:middle}
.tm-pgmap a:hover .tm-pgmn{fill:var(--brand);text-decoration:underline}
/* wschód/zachód słońca w martwym rogu mapy (morze na NW od Polski) */
.tm-pgsun{font:500 24px var(--f-lab);fill:#4d5665}
.tm-pgsunr{fill:#dd9b2f}
.tm-pgsuns{fill:#56617a}
/* markery ekstremów na mapie: kropka i temperatura w kolorze (max czerwony, min niebieski);
   temperatura ekstremum świadomie BEZ palety meteo (komentarz w NT3pogodaMapaPL.tpl),
   a wokół kropki pierścień - "naj-" ma być widoczne na pierwszy rzut oka */
.tm-pgmxh{fill:var(--brand)}
.tm-pgmxl{fill:#3b6fc9}
.tm-pgmr{fill:none;stroke-width:2.4}
.tm-pgmrh{stroke:var(--brand)}
.tm-pgmrl{stroke:#3b6fc9}
/* forma MINI ekstremum (kolizja pełnych etykiet dwóch ekstremów - widget pole .mini):
   temperatura obok kropki, odrobinę mniejsza niż nad markerami pełnej formy */
.tm-pgmts{font-size:29px}
/* kropla opadów przy markerze miasta z deszczem (pole .rain > 0 z tabeli pogoda) */
.tm-pgrain{fill:#2f7bbf;stroke:#fff;stroke-width:1.2}
/* pasek prognozy 3-dniowej miasta głównego: dzień / ikona / temp. max (kolor palety meteo)
   i min; całość jednym linkiem, etykieta z nazwą miasta pionowo-poziomo po lewej */
.tm-pgdays{display:flex;align-items:stretch;gap:2px;margin-top:9px;text-decoration:none}
/* etykieta miasta pionowo wzdłuż lewej krawędzi paska (rotate 180 = czytana od dołu ku górze,
   jak grzbiet książki) - poziomo "WARSZAWA" gniotła trzy kolumny dni */
.tm-pgdcap{flex:none;writing-mode:vertical-rl;transform:rotate(180deg);text-align:center;font:600 10px/1 var(--f-lab);letter-spacing:.14em;text-transform:uppercase;color:var(--txt-3);border-left:2px solid var(--line);padding-left:3px}
.tm-pgday{flex:1;display:flex;flex-direction:column;align-items:center;gap:0;padding:3px 0;border-radius:6px}
.tm-pgdd{font:600 11px var(--f-lab);letter-spacing:.05em;text-transform:uppercase;color:var(--txt-2)}
.tm-pgday img{width:34px;height:34px;margin:-1px 0}
.tm-pgdt{font-size:12.5px;color:var(--txt-2)}
.tm-pgdt b{font-weight:600;color:var(--dark)}
.tm-pgdays:hover .tm-pgday{background:var(--band)}
.tm-pgdays:hover .tm-pgdcap{color:var(--brand)}
/* pasek ekstremów pod mapą: termometr (czerwony max / niebieski min) + temperatura + miasto;
   jedna linia (wrap tylko awaryjnie, przy długich odmianach nazw miast) */
.tm-pgext{display:flex;flex-wrap:wrap;justify-content:space-between;gap:3px 12px;margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}
.tm-pgext a{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--txt-2);text-decoration:none}
.tm-pgext a:hover{color:var(--brand)}
.tm-pgext b{font-weight:600}
.tm-pgexi{flex:none}
.tm-pgexh{color:var(--brand)}
.tm-pgexl{color:#3b6fc9}
.tm-pglink{display:block;text-align:right;margin-top:9px;font-size:12.5px;font-weight:600;color:var(--brand)}
.tm-pgwz{vertical-align:-2px}
/* sidebar na 100% szerokości (<=880px): mapa z ogranicznikiem, inaczej rosłaby do ~800px
   wysokości na tablecie; tinta pasa zostaje pełnej szerokości, mapa centruje się w nim */
@media(max-width:880px){.tm-pgmap{max-width:430px;margin:0 auto}}
.tm-r{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);align-items:baseline}
.tm-r:last-child{border-bottom:0}
.tm-r b{font:600 16px var(--f-lab);color:var(--brand);flex:none}
.tm-r span{font-size:12.5px;font-weight:500;line-height:1.3;color:#242a34}
.tm-sticky{position:relative}
/* slot reklamy w prawym sidebarze (B0/B1) - wydzielony blok, szerokość 300px (= szer. sidebara
   i kreacji), wysokość DYNAMICZNA: startowa rezerwacja 250px (anty-CLS = najmniejsza kreacja
   300x250), a kreacja GPT rozpycha blok do własnej wysokości (300x250 / 300x600 / 300x1050).
   JS w tpl/inc/ads.tpl (slotRenderEnded) dopasowuje min-height do faktycznej kreacji i przelicza
   sticky B1. Brak bocznego paddingu/ramki - kreacja 300px musi zmieścić się w sidebarze 300px.
   Poprawka 2026-09-05: zdjęto szare tło (#eef0f4) i zaokrąglenie - slot stoi teraz
   bezpośrednio na tle strony, oddzielenie realizuje sam odstęp i etykieta "reklama". */
.reklamaB{width:300px;min-height:250px;margin:0 auto;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;padding:9px 0 11px}
.reklamaB>div{max-width:100%}
/* etykieta "reklama" nad kreacją (czytelniejsza niż domyślne #ddd z .reklamaTXT na białym tle) */
.reklamaB>div:first-child{margin-bottom:7px;color:var(--txt-3)}
/* .reklamaTXT to JEDYNA klasa z compat.css uzywana na stronach glownych (zmierzone: 1 z 231).
   Przeniesiona tutaj, zeby strona glowna nie musiala ladowac calego compat.css - patrz warunek
   przy <link> w default.tpl. Wartosci 1:1 z compat.css:221, zeby nic sie nie rozjechalo. */
.reklamaTXT{padding-top:5px;text-align:center;font-size:9px;color:#ddd;text-transform:uppercase}
/* gradienty placeholder pod miniatury (tm-g6 pochodzi z tła hero artykułu - sekcja ARTYKUŁ) */
.tm-g1{background:linear-gradient(135deg,#425063,#8593a8)}
.tm-g2{background:linear-gradient(160deg,#5a6b82,#9fb0c2)}
.tm-g3{background:linear-gradient(115deg,#6e7f94,#b9c4d2)}
.tm-g4{background:linear-gradient(205deg,#4c5a70,#93a1b4)}
.tm-g5{background:linear-gradient(145deg,#61718a,#aab6c6)}
.tm-g6{background:linear-gradient(135deg,#93a3b8 0%,#5f7089 55%,#3c4a5f 100%)}

/* ===== ARTYKUŁ ===== */
/* źródło: artykul-final-v3.html → klasy z przedrostkiem tm-art */
.tm-art-card{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:28px 36px 30px;margin:0 0 30px}
.tm-art-bc{font-size:12.5px;color:#8a93a2;margin:0 0 14px}
.tm-art-bca{color:#8a93a2;text-decoration:none}
.tm-art-bcx{color:#3a4250;font-weight:500}
.tm-art-bcs{color:#9aa2b1;margin:0 7px;font-weight:600}
.tm-art-h1{font-size:40px;line-height:1.14;font-weight:700;letter-spacing:-.015em;color:var(--txt-h);margin:0 0 18px;border-left:5px solid var(--brand);padding-left:18px;margin-left:-23px}
.tm-art-lead{font-size:19.5px;line-height:1.55;font-weight:600;color:#2a303b;margin:0 0 18px}
.tm-art-meta{display:flex;align-items:center;flex-wrap:wrap;gap:13px;padding:12px 0;border-top:1px solid #dfe2e9;border-bottom:1px solid #dfe2e9;font-size:13px;color:var(--txt-2);margin:0 0 14px}
.tm-art-ava{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#e04b56,#a92f3a);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:12.5px;flex:none}
.tm-art-metb{color:var(--txt);font-weight:600}
.tm-art-upd{color:var(--ok);font-weight:500}
.tm-art-dot{width:3px;height:3px;border-radius:50%;background:#c3c9d4;flex:none}
.tm-art-cat{font-family:var(--f-lab);font-weight:600;text-transform:uppercase;letter-spacing:.07em;font-size:12px;color:var(--brand);background:var(--brand-bg);border-radius:4px;padding:4px 9px}
.tm-art-mi{width:14px;height:14px;fill:#9aa2b1;flex:none;vertical-align:-2px}
.tm-art-mit{display:inline-flex;align-items:center;gap:5px}
/* przyciski udostępniania */
.tm-art-shrow{display:flex;align-items:center;gap:8px;margin:0 0 16px}
.tm-art-shb{display:inline-flex;align-items:center;gap:7px;border:1px solid #dfe2e9;background:#fff;border-radius:999px;padding:7px 13px;font-size:12.5px;font-weight:600;color:#3a4250}
.tm-art-shi{width:14px;height:14px}
/* zdjęcie główne + galeria + podpis */
.tm-art-hero{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:16/9;background:linear-gradient(135deg,#93a3b8 0%,#5f7089 55%,#3c4a5f 100%);display:flex;align-items:center;justify-content:center}
.tm-art-heroi{width:66px;height:66px;opacity:.4;fill:#fff}
.tm-art-gnav{position:absolute;right:14px;bottom:14px;display:flex;align-items:center;gap:8px}
.tm-art-gbtn{width:34px;height:34px;border-radius:50%;background:rgba(13,15,19,.72);display:flex;align-items:center;justify-content:center}
.tm-art-gch{width:16px;height:16px;fill:#fff}
.tm-art-gcnt{background:rgba(13,15,19,.72);color:#fff;font-family:var(--f-lab);font-weight:600;font-size:13px;padding:8px 13px;border-radius:999px;letter-spacing:.1em}
.tm-art-cap{display:flex;gap:10px;font-size:13px;color:#7c8595;line-height:1.5;padding:10px 2px 0;margin:0 0 26px}
.tm-art-capsrc{color:#a3abba;white-space:nowrap;margin-left:auto;padding-left:20px}
/* treść artykułu */
.tm-art-body{max-width:none}
.tm-art-p{font-size:17.5px;line-height:1.75;color:#2c333f;margin:0 0 26px}
.tm-art-lede::first-letter{font-family:var(--f-lab);font-weight:600;font-size:54px;line-height:.85;float:left;padding:7px 11px 0 0;color:var(--brand)}
.tm-art-h2{font-size:24px;font-weight:700;letter-spacing:-.3px;margin:34px 0 16px;color:var(--dark)}
.tm-art-q{margin:32px 0;padding:4px 0 4px 24px;border-left:4px solid var(--brand)}
.tm-art-qt{font-size:21px;line-height:1.5;font-weight:600;color:var(--dark);margin:0 0 10px}
.tm-art-qa{font-family:var(--f-lab);font-weight:600;text-transform:uppercase;letter-spacing:.09em;font-size:12.5px;color:#7c8595}
.tm-art-ad{margin:32px 0;background:#f0f1f5;border:1px dashed #cfd4dd;border-radius:8px;padding:36px 0;text-align:center}
.tm-art-adl{font-family:var(--f-lab);font-weight:600;font-size:11px;letter-spacing:.24em;color:#9aa2b1;display:block;margin:0 0 6px}
.tm-art-adt{font-size:13px;color:#aab1bf}
.tm-art-yt{aspect-ratio:16/9;border-radius:8px;background:linear-gradient(135deg,#2a3140,#141922);display:flex;align-items:center;justify-content:center;margin:4px 0 10px}
.tm-art-play{width:70px;height:48px;border-radius:10px;background:var(--brand);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(212,62,73,.45)}
.tm-art-ptr{width:20px;height:20px;fill:#fff}
.tm-art-ytc{font-size:12.5px;color:#8a93a2;margin:0 0 4px}
.tm-art-pap{display:flex;align-items:center;gap:13px;background:#f2f3f6;border-radius:8px;padding:13px 16px;margin:30px 0 26px;font-size:12.5px;color:#7c8595;line-height:1.55}
.tm-art-papb{font-family:var(--f-lab);background:var(--dark);color:#fff;font-weight:600;letter-spacing:.16em;font-size:12px;padding:5px 11px;border-radius:4px;flex:none}
.tm-art-tags{display:flex;flex-wrap:wrap;gap:9px;margin:0}
.tm-art-tag{background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 14px;font-size:13px;font-weight:500;color:#3a4250}
.tm-art-th{color:#9aa2b1;font-weight:600}
/* nagłówek sekcji "przeczytaj jeszcze" + kafle powiązanych */
.tm-art-sec{display:flex;align-items:center;gap:13px;margin:0 0 18px;font-family:var(--f-lab);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:17px;color:var(--dark)}
.tm-art-secb{width:5px;height:20px;background:var(--brand);border-radius:2px;flex:none}
.tm-art-secl{flex:1;height:1px;background:#dfe2e9}
.tm-art-rel{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:0 0 42px}
.tm-art-rc{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);overflow:hidden}
.tm-art-rci{aspect-ratio:16/9}
.tm-art-rcb{padding:12px 14px 14px}
.tm-art-rck{font-family:var(--f-lab);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:11px;color:var(--brand);display:block;margin:0 0 5px}
.tm-art-rct{font-size:14.5px;font-weight:600;line-height:1.38;color:var(--txt);margin:0 0 8px}
.tm-art-rcm{font-size:12px;color:#9aa2b1}
/* komentarze */
.tm-art-com{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:20px 22px}
.tm-art-comh{font-size:18px;font-weight:700;margin:0 0 16px}
.tm-art-c1{display:flex;gap:12px;padding:0 0 16px;border-bottom:1px solid var(--line);margin:0 0 16px}
/* --bg jest teraz biale, a awatar stoi na bialej karcie .tm-art-com - kolko zniknieloby.
   To nie jest karta do obramowania (spec traktuje ja jako karte), tylko kolko o tle --bg;
   przechodzi na --band (delikatny szary krazek) */
.tm-art-ca{width:36px;height:36px;border-radius:50%;background:var(--band);color:var(--txt-2);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:13px;flex:none}
.tm-art-cn{font-size:13.5px;font-weight:600}
.tm-art-ct{font-size:12px;color:#9aa2b1;margin-left:7px}
.tm-art-cx{font-size:14px;line-height:1.6;color:#3a4250;margin:5px 0 7px}
.tm-art-cr{font-size:12.5px;font-weight:600;color:var(--brand)}
.tm-art-cin{display:flex;gap:10px}
.tm-art-cf{flex:1;background:#f2f3f6;border:1px solid var(--line);border-radius:999px;padding:11px 18px;font-size:13.5px;color:#9aa2b1}
.tm-art-cbtn{background:linear-gradient(180deg,#e04b56,var(--brand));color:#fff;font-weight:600;font-size:13.5px;padding:11px 20px;border-radius:999px}

/* ===== SIDEBAR (WIDGETY ARTYKUŁU) ===== */
.tm-art-sad{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:12px 14px 14px}
.tm-art-sadl{display:flex;justify-content:space-between;align-items:center;font-family:var(--f-lab);font-weight:600;font-size:10.5px;letter-spacing:.22em;color:#a3abba;margin:0 0 10px}
.tm-art-stb{background:var(--dark);color:#fff;padding:3px 8px;border-radius:4px;letter-spacing:.18em}
.tm-art-sadi{background:linear-gradient(135deg,var(--band),#e3e6ec);border-radius:6px;display:flex;align-items:center;justify-content:center;color:#9aa2b1;font-size:13px}
.tm-art-wid{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:17px 18px 8px}
/* nagłówek widgetu - używany razem z .tm-art-sec (klasy łączone: class="tm-art-sec tm-art-widh") */
.tm-art-widh{font-size:15px;margin:0 0 6px}
.tm-art-wl{display:flex;gap:13px;padding:12px 0;border-bottom:1px solid var(--line);align-items:baseline}
.tm-art-wl:last-child{border-bottom:0}
.tm-art-wn{font-family:var(--f-lab);font-weight:600;font-size:23px;color:#8a93a2;flex:none;width:22px;line-height:1}
.tm-art-wl:first-child .tm-art-wn{color:var(--brand)}
.tm-art-wt{font-size:13.5px;font-weight:500;line-height:1.4;color:#2a303b}
.tm-art-stick{position:sticky;top:14px}

/* ===== STICKY BAR ===== */
/* źródło: zachowania-mobile.html, sekcja sticky - kompaktowa belka po przewinięciu strony */
.tm-stick{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;gap:16px;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:2px solid var(--brand);box-shadow:0 6px 18px rgba(16,20,28,.14);padding:8px 18px;border-radius:8px 8px 0 0;transform:translateY(-100%);transition:transform .25s ease}
/* klasę tm-stick-show dodaje JS (Zadanie 4) po przewinięciu poniżej nagłówka */
.tm-stick.tm-stick-show{transform:translateY(0)}
.tm-stick img{height:34px;width:auto}
.tm-sticknav{display:flex;gap:2px;font-family:var(--f-lab);font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-size:13.5px}
.tm-sticknav a{padding:8px 10px;color:#3a4250}
.tm-sticknav a.tm-act{color:var(--brand);box-shadow:inset 0 -3px 0 var(--brand)}
/* na portalu miejskim .tm-sticknav ma dziś jedną pozycję (Rozkłady) - bez lekkiego odsunięcia
   od logo czytałaby się jak część nazwy serwisu, a nie jak osobny link (2026-09-06) */
.tm-sticknav a:only-child{margin-left:6px}
/* Belka sticky jest JEDNA linia flexa bez zawijania: logo, dzialy i chip miasta dziela
   szerokosc okna. Do 2026-09-08 stalo tu piec dzialow (391 px zmierzone w Chromium), a od
   dolozenia Domu i Edukacji jest ich siedem (523 px). Roznica 132 px zabiera miejsce chipowi
   po prawej i przy dluzszej nazwie miasta lamie go na dwie linie - belka rosnie wtedy z 54
   na 63 px i podskakuje w trakcie przewijania. Najdluzsza nazwa w AAmiasta to "Ostrowiec
   Swietokrzyski" (23 znaki), wiec przypadek nie jest teoretyczny.
   Ponizej 1200 px zageszczamy wiec pozycje - tak samo jak belke gorna, tyle ze bez dolnej
   granicy: sticky nie ma odpowiednika progu 880 px, znika dopiero razem z .tm-sticknav
   w @media(max-width:880px) nizej. */
@media(max-width:1200px){
 .tm-sticknav{letter-spacing:.02em}
 .tm-sticknav a{padding:8px 6px}
}
/* min-width:0 na grupie po prawej: bez tego domyslne min-width:auto elementu flexa nie
   pozwala chipowi zejsc ponizej szerokosci tekstu, wiec wielokropek nizej nigdy by sie nie
   wlaczyl - nazwa miasta lamalaby sie na druga linie dokladnie jak dotad */
.tm-stickic{margin-left:auto;display:flex;gap:8px;align-items:center;min-width:0}
/* chip w belce sticky - nadpisuje generyczny .tm-chip (mniejszy padding/font, pogrubiony).
   font-family:inherit dolozone razem z pigulka konta (2026-09-10): <button> nie dziedziczy
   kroju z body, wiec chip stal dotad w foncie UA, a nowa pigulka obok stoi w IBM Plex - dwie
   stykajace sie pigulki w dwoch krojach widac golym okiem. Plex jest o ok. 14 proc. szerszy,
   dlatego nazwa miasta dostaje jednoczesnie wielokropek (.tm-cityn nizej).
   Chip urosl przez to z 26 na 27,6 px (Plex ma "normal" ok. 1,3 wobec ok. 1,15 fontu UA)
   i tyle ma zostac. JAWNEGO line-height TU NIE DAJEMY, mimo ze wyrownalby wysokosc do 26 px:
   nazwa miasta ma ponizej overflow:hidden, wiec pudelko nizsze od kroju SCINA tusz liter -
   przy 12 px kreske nad "S" w Swidnicy czy Swinoujsciu (podpikselowo, ale zawsze), a gdy
   uzytkownik ma w przegladarce wymuszony minimalny rozmiar czcionki (typowe u slabowidzacych),
   font rosnie do 16 px, a dlugosc absolutna nie - i kreski oraz ogonki znikaja calkiem.
   Wysokosc pigulki konta wyrownuje sie sama, bo stoi w tym samym kroju i rozmiarze. */
.tm-stick .tm-chip{gap:5px;padding:5px 11px;font-size:12px;font-weight:600;color:#3a4250;font-family:inherit;white-space:nowrap;min-width:0}
.tm-chip.tm-red{background:var(--brand);border-color:var(--brand);color:#fff}
/* Nazwa miasta siedzi we wlasnym <span>, zeby skracal sie WYLACZNIE napis, a strzalka ▾
   zostala widoczna przy kazdej szerokosci - to jedyny wizualny sygnal, ze chip otwiera modal
   wyboru miasta (aria-haspopup widzi czytnik, nie oko). Wielokropek nalozony na caly <button>
   zjadlby ja razem z koncem nazwy.
   text-align:left jest obowiazkowy, a nie ozdobny: arkusz UA daje <button> text-align:center,
   a wlasciwosc dziedziczy sie do spana - wycentrowana linia przy skracaniu obcina POCZATEK
   nazwy bez zadnego sygnalu ("trowiec Swietokrz..." zamiast "Ostrowiec Swietokrz...").
   PADDING Z UJEMNYM MARGINESEM to nie ozdobnik, tylko warunek czytelnosci polskich nazw:
   overflow przycina do krawedzi PADDINGU, a tusz kreski nad "S" (Swidnica, Swinoujscie,
   Ostrowiec Swietokrzyski) siega w IBM Plex Sans o ok. 1 px WYZEJ niz pudelko kroju, wiec bez
   zapasu czubek kreski jest scinany plasko - zmierzone pikselowo. Ujemny margines oddaje te
   3 px z powrotem, wiec pigulka ma dokladnie te sama wysokosc co bez tej pary wlasciwosci.
   Zapas 3 px, a nie 1 px, bo przy niezaladowanym Plexie wchodzi kroj systemowy z wlasnymi
   metrykami, a uzytkownik z wymuszonym minimalnym rozmiarem czcionki ma tu wieksze litery. */
.tm-stick .tm-chip .tm-cityn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;padding:3px 0;margin:-3px 0}
/* logo nie oddaje szerokosci przy ciasnocie - niedobor ma absorbowac nazwa miasta
   (wielokropkiem), a nie kadr logo, ktore dotad kurczylo sie na najwezszych telefonach */
.tm-stick>a{flex:none}
/* Wejscie do konta w belce sticky (idea#339, 2026-09-10). OBRYS, a nie wypelnienie jak
   .tm-login w pasku z logo: obok stoi wypelniony czerwienia chip miasta, a dwie jednakowo
   mocne pigulki obok siebie zatarlyby hierarchie - ta sama zasada, ktora opisuje komentarz
   przy .tm-rozkl. Chip miasta zostaje glowna akcja belki.
   WLASNA KLASA, a nie .tm-login: tamta ma display:none ponizej 880 px, wiec przycisk znikalby
   dokladnie tam, gdzie jest w naglowku JEDYNYM wejsciem do konta.
   line-height:normal (a nie konkretna liczba px) wyrownuje wysokosc z chipem miasta: chip jest
   <button> i bierze "normal" z arkusza UA, a ten link dziedziczylby 1,5 z <body>, czyli 18 px
   zamiast 15,6 px - pigulki rozjechalyby sie o 3 px. Slowo kluczowe zamiast dlugosci, bo przy
   wymuszonym w przegladarce wiekszym foncie ma rosnac razem z tekstem. */
.tm-stickacc{flex:none;display:inline-flex;align-items:center;gap:6px;background:#fff;color:var(--brand-h);border:1px solid var(--brand);border-radius:999px;padding:5px 11px;font-size:12px;font-weight:600;line-height:normal;white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
/* hover bierze --brand-h, a nie --brand: --brand to dokladnie kolor chipa miasta, wiec pod
   kursorem stanelyby obok siebie dwie identyczne czerwone pigulki */
.tm-stickacc:hover{background:var(--brand-h);border-color:var(--brand-h);color:#fff}
.tm-stickacc svg{flex:none}
/* stan zalogowanego - zielen zgodna z user.css (tam .tm-login zalogowanego dostaje gradient
   #2fa26b/#268a5a, hover #21794f); #21794f na bieli daje 5,4:1, czyli AA z zapasem.
   Kolor NIE jest tu jedynym nosnikiem stanu: ikona zalogowanego ma dodatkowo ptaszek, bo
   ponizej 880 px napis jest schowany i sam obrys musialby wystarczyc (WCAG 1.4.1 Use of
   Color), w dodatku na najgorszej mozliwej parze czerwien/zielen.
   Kolejnosc obu regul :hover jest nosna - maja te sama specyficznosc (0,1,1), wiec wariant
   zalogowanego musi stac nizej, inaczej zielona pigulka robilaby sie czerwona pod kursorem. */
.tm-stickacc-in{color:#21794f;border-color:#21794f}
.tm-stickacc-in:hover{background:#21794f;border-color:#21794f;color:#fff}

/* ===== MOBILE (max-width:880px) ===== */
/* źródło: zachowania-mobile.html, sekcja telefonu - przystosowanie istniejących komponentów nagłówka/tickera/kart, nie nowy zestaw klas */
.tm-icobtn{display:none;width:38px;height:38px;border-radius:10px;background:var(--band);border:1px solid var(--line);align-items:center;justify-content:center}
.tm-icobtn svg{width:17px;height:17px;stroke:#3a4250;fill:none;stroke-width:2;stroke-linecap:round}
.tm-icobtn.tm-burger{background:var(--brand)}
.tm-icobtn.tm-burger svg{stroke:#fff}
@media(max-width:880px){
 /* pasek górny skrócony.
    Cele dotykowe (WCAG 2.5.8 wymaga 24x24 px, praktyka mobilna 44 px): pole klikalne
    chipow i przycisku zmiany miasta powiekszamy paddingiem, a odbieramy go z paddingu
    wiersza - pasek nie rosnie, a rytm wizualny zostaje bez zmian. */
 .tm-toprow{gap:4px 12px;padding-top:0;padding-bottom:0}
 .tm-top{font-size:11px}
 .tm-top .tm-chip{padding:6px 2px}
 .tm-city{padding:6px 2px}
 /* kursy NBP inline: po usunięciu boxu z sidebara pasek w belce to JEDYNE miejsce z kursami,
    więc na wąskim ekranie nie znika (jak dawniej), tylko schodzi do własnego wiersza belki
    (order:9 = za tytułem i "więcej"); flex-wrap łamie 4 waluty na 2 wiersze przy <380px */
 .tm-shead .tm-nbp{order:9;width:100%;flex-wrap:wrap;gap:4px 12px;font-size:12px}
 /* nav sticky bara zbyt szeroki na wąski ekran */
 .tm-sticknav{display:none}
 /* belki sekcji: pozwól łamać długie tytuły (desktop ma nowrap). Tytuł 22 px zamiast
    desktopowych 30 px; przy zawinięciu link "więcej" schodzi do drugiego wiersza, więc
    padding-bottom jest mniejszy, żeby kreska --ac nie odkleiła się od tekstu */
 /* align-items:center zamiast flex-end: link "wiecej" ma teraz padding pionowy
    (cel dotykowy), a przy flex-end ten padding odklejalby kreske --ac od tekstu */
 .tm-shead{flex-wrap:wrap;align-items:center;gap:4px 13px;margin:26px 0 14px;padding-bottom:5px}
 .tm-stit{white-space:normal;font-size:22px}
 /* "więcej" na wąskim ekranie: mniejszy i ciaśniejszy, żeby zmieścił się obok tytułu.
    Padding pionowy podnosi cel dotykowy z 12 px do 28 px - to jedyne przejscie
    z sekcji na listing dzialu, wiec chybione dotkniecie kosztuje odslone. */
 .tm-morel{font-size:11.5px;letter-spacing:.1em;padding:8px 0 8px 12px}
 /* logo + ikony zamiast pełnej wyszukiwarki i loginu - pełne menu chowa się do hamburgera (details/anchor, Zadanie 4).
    Ikony 44x44 (praktyka mobilna) - o 6 px wieksze pole odbieramy z paddingu wiersza,
    zeby pasek z logo mial te sama wysokosc co dotad */
 .tm-main{gap:10px;padding-top:6px;padding-bottom:6px}
 .tm-icobtn{width:44px;height:44px}
 .tm-logo img{width:auto;height:30px}
 .tm-search,.tm-login,.tm-navband{display:none}
 .tm-icobtn{display:flex}
 /* na mobile .tm-login jest ukryty, wiec to hamburger musi dopchnac sie do prawej
    (po zdjeciu wyszukiwarki nie ma juz innego elementu rozpychajacego pasek) */
 .tm-burger{margin-left:auto}
 /* .tm-rozkl NIE dołącza do ukrywanych wyżej .tm-login/.tm-navband: tam, gdzie się pokazuje,
    jest jedynym linkiem do podstrony widocznym w pasku na telefonie poza logo. Konfliktu marginesów
    z hamburgerem tu nie ma i być nie może: przycisk wychodzi przy $tmMaRozklady, a hamburger
    przy $tmDzialyWMenu, czyli pod warunkiem dokładnie przeciwnym - w pasku stoi zawsze
    najwyżej jeden z nich. margin-left:auto dostaje wtedy .tm-rozklnav (opakowanie przycisku,
    reguła bazowa) albo .tm-burger z reguły wyżej - nigdy sam .tm-rozkl (2026-09-06) */
 .tm-rozkl{padding:8px 13px}
 /* Belka sticky na telefonie (idea#339, 2026-09-10): .tm-sticknav dostaje wyżej display:none,
    więc zostają logo, chip miasta i wejście do konta. To wejście jest tu JEDYNYM w całym
    nagłówku - .tm-login jest ukryty regułą wyżej, a menu pod hamburgerem nie ma pozycji konta
    (najbliższy link do konta stoi dopiero w stopce). Dlatego dostaje pełny cel dotykowy
    44x44 px (praktyka mobilna; WCAG 2.5.8 wymaga 24x24), a napis chowamy techniką .tm-vh
    (clip), NIGDY display:none: <svg> nie ma <title>, więc link zostałby bez nazwy dostępnej.
    Miejsce na koło oddaje sama belka - padding 8 -> 6 px, gap 16 -> 8 px, logo 34 -> 30 px
    (ta sama wysokość, którą logo ma w pasku z logo). Bez tej rekompensaty belka urosłaby
    z 58,5 na 62 px, a jej wysokość czyta jeszcze js.js przy przyklejaniu reklam w kolumnie
    bocznej. Po zmianie ma 58 px, czyli nie podskakuje w chwili pokazania.
    Zysk uboczny: 32 px odzyskane z logo i odstępów idzie na nazwę miasta, która przy 320 px
    łamała się dotąd na dwie linie. Reguła .tm-stick img ma tę samą specyficzność co bazowa
    (0,1,1) i wygrywa wyłącznie kolejnością - przeniesienie tego bloku wyżej wróciłoby logo
    do 34 px. */
 .tm-stick{gap:8px;padding:6px 12px}
 .tm-stick img{height:30px}
 /* chip miasta na telefonie rośnie z 26 na ok. 38 px (wiersz kroju + 2x10 padding + 2x1 obrys).
    To NIE jest wyrównanie do sąsiada dla urody: chip otwiera modal wyboru miasta, czyli jest
    główną akcją tej belki, a 26 px celu dotykowego jest poniżej praktyki mobilnej. Skoro
    wejście do konta obok dostaje pełne 44 px, ten przycisk nie może zostać najmniejszym
    celem w całym pasku. Szerokość nie rośnie (padding boczny bez zmian), więc rachunek
    nazwy miasta zostaje ten sam. */
 .tm-stick .tm-chip{padding:10px 11px}
 .tm-stickacc{width:44px;height:44px;padding:0;justify-content:center}
 .tm-stickacc svg{width:18px;height:18px}
 .tm-stickacc span{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
 /* ticker cieńszy */
 .tm-ticker{border-bottom-width:2px}
 .tm-flash{gap:6px;font-size:10.5px;letter-spacing:.14em;padding:6px 12px 6px 10px;clip-path:polygon(0 0,100% 0,calc(100% - 9px) 100%,0 100%)}
 .tm-pulse{width:7px;height:7px}
 .tm-tick-belt li{font-size:11px}
 /* treść jednokolumnowa: hero niższy, karty listy stają się poziomymi kartami */
 .tm-hero{grid-template-columns:1fr}
 .tm-hbig{height:200px}
 .tm-hbody{padding:12px 14px}
 .tm-kat{font-size:9px;letter-spacing:.11em;padding:3px 7px}
 .tm-htit{font-size:16.5px;margin:7px 0 0}
 .tm-li{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:10px;margin-top:10px}
 .tm-lth{width:92px;height:66px}
 .tm-sgrid{grid-template-columns:1fr}
 .tm-minis{grid-template-columns:repeat(2,1fr)}
 /* .tm-lcols{columns:1} niepotrzebne: .tm-skrot .tm-lcols to flex-wrap (pigułki, zmiana
    2026-09-10) - pozycje same zwijają się do jednej na wiersz przy wąskim oknie. */
 .tm-art-rel{grid-template-columns:repeat(2,1fr)}
}

/* ===== POWŁOKA LAYOUTU (Zadanie 4) ===== */
/* style przeniesione z inline <style> w default.tpl - jedno źródło prawdy (review Zadania 4) */
.tm-skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--brand);color:#fff;padding:10px 16px;border-radius:0 0 8px 0}
.tm-skip:focus{left:0}
.tm-logo{margin:0}
.tm-adtop{text-align:center;margin:14px auto;min-height:0}
/* stopka */
.tm-footer{background:var(--dark);color:#c7ccd6;margin-top:40px;padding:26px 0 30px;font-size:13px}
.tm-footer a{color:#e3e6ec}
.tm-footer a:hover{color:#fff}
.tm-footcols{display:flex;flex-wrap:wrap;gap:18px 40px;justify-content:space-between}
.tm-footh{font:600 13px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:#fff;margin-bottom:8px}
.tm-footc{color:#9aa3b1;font-size:12px;margin-top:14px}
/* menu mobilne CSS-only (progressive enhancement, bez JS):
   checkbox #tmMenuToggle jest rodzeństwem .tm-navband w <header> (przed .tm-band),
   hamburger to <label for="tmMenuToggle"> - JS tylko wzbogaca (aria-expanded, ESC) */
.tm-menucb{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0;white-space:nowrap}
#tmMenuToggle:focus-visible ~ .tm-band .tm-burger{outline:2px solid var(--brand);outline-offset:2px}
@media(max-width:880px){
 #tmMenuToggle:checked ~ .tm-navband{display:block}
 #tmMenuToggle:checked ~ .tm-navband .tm-nav{flex-direction:column}
 #tmMenuToggle:checked ~ .tm-navband .tm-nav a{padding:12px 16px;border-bottom:1px solid #eef0f4}
 #tmMenuToggle:checked ~ .tm-navband .tm-more{margin-left:0}
}
/* modal wyboru miasta (bez Bootstrapa) */
.tm-modal{position:fixed;inset:0;z-index:120;display:none;align-items:flex-start;justify-content:center;background:rgba(13,15,19,.55);padding:40px 16px;overflow:auto}
.tm-modal.tm-modal-open{display:flex}
.tm-modal-box{background:#fff;border-radius:10px;width:100%;max-width:680px;box-shadow:0 20px 60px rgba(0,0,0,.35);overflow:hidden}
.tm-modal-h{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line);font:600 18px var(--f-lab);letter-spacing:.04em;text-transform:uppercase}
.tm-modal-x{background:none;border:0;font-size:26px;line-height:1;color:#8b93a1;cursor:pointer}
.tm-modal-b{padding:16px 20px}
.tm-modal-b input[type=search]{width:100%;padding:11px 15px;border:1px solid #dfe2e9;border-radius:999px;font:inherit;font-size:15px;margin-bottom:12px}
#cityList{max-height:56vh;overflow:auto}
#cityList a{display:block;padding:8px 10px;border-bottom:1px solid var(--line);color:var(--txt)}
#cityList a:hover,#cityList a.tm-active{background:var(--brand-bg);color:var(--brand)}
/* Lightbox zdjęcia artykułu ([data-lity], obsługa w js.js - patrz komentarz tam).
   Ta sama mechanika co modal miast: display:none -> flex przez klasę -open, żeby nie
   mnożyć wzorców. Wyższy z-index niż .tm-modal (120), bo overlay ma przykryć wszystko.
   Cała rodzina .tm-lb* jest zarezerwowana dla tego overlaya - display:none z reguły niżej
   wygasza KAŻDY element, który dostanie tę klasę w markupie. Tak w dniach 2026-09-05 do
   2026-09-07 zniknęły daty i tytuły z wierszy listy "Najnowsze" (kolumna tekstu nazywa się
   dziś .tm-lbody, patrz komentarz przy tej regule). Nie nadawaj .tm-lb elementom treści. */
.tm-lb{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;background:rgba(13,15,19,.92);padding:24px}
.tm-lb.tm-lb-open{display:flex}
.tm-lb img{max-width:100%;max-height:calc(100vh - 100px);display:block;border-radius:4px;box-shadow:0 10px 40px rgba(0,0,0,.5)}
.tm-lb-cap{position:absolute;left:0;right:0;bottom:18px;text-align:center;color:#c9cfd9;font-size:13px;padding:0 24px}
.tm-lb-x{position:absolute;top:10px;right:16px;background:none;border:0;color:#fff;font-size:34px;line-height:1;cursor:pointer;opacity:.75}
.tm-lb-x:hover{opacity:1}
/* sygnał, że zdjęcie artykułu da się powiększyć */
.tm-artcard .position-relative a[data-lity]{display:block;cursor:zoom-in}
/* belka sticky - ukryta ma być też poza tab-order: visibility:hidden usuwa z fokusa
   (JS dodatkowo przełącza atrybut inert); visibility animowana dyskretnie z opóźnieniem przy chowaniu */
.tm-stick{visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s}
.tm-stick.tm-stick-show{visibility:visible;transition:transform .25s ease,visibility 0s}

/* ===== PREFERS-REDUCED-MOTION ===== */
/* animacje dekoracyjne (ticker, pulsujaca kropka) oraz zoom zdjecia na hoverze kafla .tm-oc:
   transform:scale na duzym obrazie to ruch calego kadru - dla uzytkownikow z ustawieniem
   "ogranicz animacje" wylaczamy i transition, i sam transform (samo animation:none nie
   wystarczy, bo scale jest realizowane przez transition, nie przez @keyframes) */
@media (prefers-reduced-motion:reduce){
 .tm-belt-run,.tm-pulse{animation:none}
 .tm-oc img,a.tm-card,.tm-mbar-cta,.tm-mbar-cta span{transition:none}
 .tm-oc:hover img,.tm-oc:focus-within img{transform:none}
 a.tm-card:hover{transform:none}
 .tm-mbar-cta:hover span{transform:none}
}

/* ===== TELEFON: pas uslugowy odchudzony (max 600 px) ===== */
/* Data z imieninami i godziny wschodu/zachodu zawijaly sie w gornym pasie na 3-4 wiersze
   przed logo, zjadajac budzet pierwszego ekranu na telefonie. Chowamy je ponizej 600 px;
   przy 880 px cala zawartosc pasa miesci sie w jednym wierszu, wiec tablety zostaja z pelna
   trescia. Dane "tu i teraz" (chip pogody i powietrza) zostaja - znika tylko data i wschod/zachod. */
@media(max-width:600px){.tm-date,.tm-wz{display:none}}
/* Poniżej 600 px przycisk zwija się z "Rozkłady jazdy" do samego "Rozkłady" - drugie słowo
   znika, ikona autobusu zostaje i dalej niesie znaczenie. Skrót musi bronić się sam:
   atrybut title nie jest tu zapasem dla NAZWY, bo na dotyku się nie pokazuje, a że element
   ma własną treść tekstową, nie wchodzi do nazwy dostępnej - ta brzmi po prostu "Rozkłady".
   Jako opis dostępny title zostaje i czytniki (NVDA, JAWS) domyślnie go zapowiadają po
   nazwie i roli, więc trzymaj w nim treść prawdziwą, a nie zamiennik etykiety (2026-09-06). */
@media(max-width:600px){.tm-rozkl-l{display:none}}

/* ===== STRONA GŁÓWNA - obrazy w kontenerach + drobne uzupełnienia (Zadanie 5) ===== */
/* odstęp treści SG pod reklamą A (odpowiednik .mp-body z makiety) */
.tm-body{padding-top:22px}
/* hero (.tm-hbig): zdjęcie wypełnia kartę pod przyciemnieniem i treścią */
.tm-hbig>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* przyciemnienie hero MUSI zostac absolutne (inset:0 z reguly .tm-hshade wyzej) - wczesniejsza
   wersja tej reguly nadawala mu position:relative, przez co pusty <span> byl elementem flex 0x0
   i gradient nie renderowal sie wcale (bialy tytul lezal wprost na zdjeciu). Tresc nad
   przyciemnieniem przez z-index:2 - dzieki temu dekoracja ::after kafla typograficznego
   (cudzyslow) wchodzi pomiedzy przyciemnienie a tekst, a nie na tekst. */
.tm-hbig .tm-hshade{position:absolute;inset:0}
.tm-hbig .tm-hbody{position:relative;z-index:2}
/* karta/mini/miniatura "najnowsze"/kafel "Przeczytaj jeszcze": kontener przycina, zdjęcie
   skalowane cover. .tm-art-rci jest tu wymieniona jawnie, bo markup strony artykułu nie
   dokleja już .tm-cimg - tamta klasa niesie height:250px (linia ~254) i rozpychała kafle
   "Przeczytaj jeszcze" do dwukrotności ich wysokości z aspect-ratio (2026-09-07) */
.tm-cimg,.tm-mimg,.tm-lth,.tm-art-rci{overflow:hidden;background:linear-gradient(128deg,#39465b,#75839b 58%,#a9b5c6)}
.tm-cimg img,.tm-mimg img,.tm-lth img,.tm-art-rci img{display:block;width:100%;height:100%;object-fit:cover}
/* h2 jako tytuł sekcji (SEO §8) - zdejmij domyślny margines UA, layout bez zmian */
.tm-stit{margin:0}

/* ===== STRONA ARTYKUŁU (Zadanie 6) =====
   źródło: makieta artykul-final-v3.html. Karta ".tm-card.tm-artcard" zawiera treść
   współdzielonego site/Artykuly/View.tpl (klasy Bootstrap/legacy) - stylujemy ją
   selektorami POTOMNYMI (View.tpl nie jest modyfikowany). Klasy tm-art-* elementów
   dokładanych przez wrapper (breadcrumb/share/pap/tagi/rel/com) są już w sekcji wyżej. */

/* kontener strony artykułu: odstępy jak w makiecie (.ara-wrap: gap 28, padding 24/46);
   ledger: .tm-side ma domyślnie gap 18px, makieta artykułu 22px - dociągamy tutaj */
.tm-artwrap{padding-top:24px;padding-bottom:46px}
.tm-artwrap .tm-cols{gap:28px}
.tm-artwrap .tm-side{gap:22px}

/* karta artykułu: padding jak .ara-card; blokowy przepływ (nadpisuje flex/overflow z .tm-card,
   by pływające elementy View.tpl i inicjał float działały poprawnie) */
.tm-artcard{display:block;overflow:visible;padding:28px 36px 30px;margin:0 0 24px}
@media(max-width:600px){.tm-artcard{padding:20px 18px 22px}}

/* --- H1 tytułu (View.tpl: <h1> w <div.py-2>) z czerwoną kreską wystającą w lewo --- */
.tm-artcard h1{font-size:40px;line-height:1.14;font-weight:700;letter-spacing:-.015em;color:var(--txt-h);margin:0 0 16px;border-left:5px solid var(--brand);padding-left:18px;margin-left:-23px}
@media(max-width:600px){.tm-artcard h1{font-size:28px;margin-left:0;padding-left:13px}}
/* patronat medialny (View.tpl float .fR) - zachowaj oblewanie */
.tm-artcard .fR{float:right}
.tm-artcard .fL{float:left}

/* --- pasek meta u góry (View.tpl: <div.fsmall.pt-2> z .fL/.fR) ---
   Układ na flex, nie na floatach. Floaty stawiały każdy slot na własnej linii bazowej
   (pomiar: kategoria 673,2 / autor 679,2 / data 681,2 - rozjazd 8 px), bo puste spany
   .iconify z View.tpl wnosiły line-box 18/20 px bez treści: theme/3 NIE ładuje biblioteki
   Iconify (jest tylko w theme/1/default.tpl:547) i ładować jej nie powinien. Markup
   View.tpl dostał zamiast nich inline SVG, a align-items:center trzyma ikonę i tekst
   w jednej osi niezależnie od ich wysokości.
   Drugi powód: pasek nie miał żadnej reguły @media, więc przy szerokości poniżej ~400 px
   data odpadała na osobną linię (57% artykułów przy oknie 390 px). Teraz cały nagłówek to
   JEDEN wiersz - okruszki, źródło i data razem - a przy ciasnocie kurczą się pojedyncze
   napisy (patrz reguły niżej), zamiast łamać pasek w przypadkowym miejscu.
   overflow:hidden zostaje - domyka floaty liczników redakcyjnych (ACL 194, View.tpl:18-20),
   które nadal są elementami .fR. */
.tm-artcard>.fsmall.pt-2{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-end;column-gap:12px;row-gap:6px;border-bottom:1px solid #dfe2e9;padding:0 0 11px;margin:0 0 18px;overflow:hidden;font-size:13px;color:var(--txt-2)}
/* Jeden wiersz zamiast łamania: przy ciasnocie kurczą się po kolei okruszki i nazwa źródła
   (wielokropek), a nie cały pasek. Data ma flex:none - nigdy się nie skraca.
   Dwa wyjątki, w których zawijanie jest lepsze niż cztery wielokropki obok siebie:
   widok redakcyjny (ACL 194 dokłada dwa liczniki .pr-3, razem 5 slotów) oraz telefon. */
.tm-artcard>.fsmall.pt-2:has(.pr-3){flex-wrap:wrap}
@media(max-width:560px){
	.tm-artcard>.fsmall.pt-2{flex-wrap:wrap}
	/* podział na dwa czytelne wiersze: okruszki u góry, pod nimi źródło i data.
	   Bez tego łamanie wypada przypadkowo (okruszki + źródło, a data sama niżej),
	   a kropka rozdzielająca zostaje wisieć na początku drugiego wiersza. */
	.tm-artcard>.fsmall.pt-2>nav{flex-basis:100%}
	.tm-artcard>.fsmall.pt-2>[title="autor"]::before{display:none}
}
.tm-artcard>.fsmall.pt-2>div,.tm-artcard>.fsmall.pt-2>nav{float:none;display:inline-flex;align-items:center;gap:6px;min-width:0;padding:0}
/* Okruszki wewnątrz paska (View.tpl) - ten sam wygląd co samodzielne .tm-art-bc na listach.
   Nadpisanie jest konieczne: reguła ".tm-artcard>.fsmall.pt-2 a" niżej ma wyższą
   specyficzność (0,3,1) niż .tm-art-bca (0,1,0) i pomalowałaby okruszki na kolor autora. */
.tm-artcard>.fsmall.pt-2 .tm-art-bca{color:#8a93a2;font-weight:400;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-artcard>.fsmall.pt-2 .tm-art-bcx{color:#3a4250;font-weight:500}
.tm-artcard>.fsmall.pt-2 .tm-art-bcs{margin:0 5px;flex:none}
/* kropka rozdzielająca okruszki od nazwy źródła (wzorzec .tm-art-dot z makiety) */
.tm-artcard>.fsmall.pt-2>[title="autor"]::before{content:"";width:3px;height:3px;border-radius:50%;background:#c3c9d4;flex:none}
/* Nazwa źródła bywa bardzo długa (rekord w próbce: "Bank Spółdzielczy w Szczytnie Jurand
   Cup 2026", 45 znaków). Bez limitu spycha datę do drugiej linii już na zwykłym laptopie,
   więc skracamy ją wielokropkiem zamiast łamać cały wiersz. */
.tm-artcard>.fsmall.pt-2>[title="autor"] span{max-width:28ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Data odpycha się od lewej i siada przy prawej krawędzi; kolejne .fR (liczniki redakcyjne,
   ACL 194) idą już za nią. justify-content:flex-end na rodzicu nie rusza pierwszej linii
   (margin-left:auto zjada tam całą wolną przestrzeń), ale gdy liczniki zawiną się do drugiej
   linii, dosuwa je do prawej zamiast zostawiać przyklejone do lewej krawędzi.
   Slot daty jest w View.tpl bezwarunkowy, więc zawsze istnieje co najmniej jeden .fR. */
.tm-artcard>.fsmall.pt-2>.fR{margin-left:auto;flex:none}
.tm-artcard>.fsmall.pt-2>.fR~.fR{margin-left:0}
/* ikony paska w konwencji theme/3: kontur 24x24, stroke currentColor - jak .tm-icobtn svg */
.tm-artcard>.fsmall.pt-2 svg{width:14px;height:14px;flex:none;fill:none;stroke:#9aa2b1;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tm-artcard>.fsmall.pt-2 a{color:var(--txt);font-weight:600}
/* nazwa źródła nie jest już linkiem (View.tpl miał martwe href="#"), ale ma zostać wyróżniona */
.tm-artcard>.fsmall.pt-2>[title="autor"] span{color:var(--txt);font-weight:600}
.tm-artcard>.fsmall.pt-2 .cSzary{color:var(--txt-2)}

/* --- zdjęcie główne + nawigator galerii (View.tpl: .position-relative > a > img.img-fluid) --- */
.tm-artcard .position-relative{border-radius:8px;overflow:hidden;margin:0 0 2px}
.tm-artcard .position-relative img.img-fluid{display:block;width:100%;height:auto}
/* nawigator galerii (.ArtViewGal L/R) - kołowe przyciski jak w makiecie (.ara-gbtn) */
.tm-artcard .ArtViewGal{width:64px;background:transparent;display:flex;align-items:center;justify-content:center}
.tm-artcard .ArtViewGal.L{justify-content:flex-start;padding-left:14px}
.tm-artcard .ArtViewGal.R{justify-content:flex-end;padding-right:14px}
.tm-artcard .ArtViewGal i{position:static;color:#fff;filter:drop-shadow(0 2px 6px rgba(13,15,19,.6))}
.tm-artcard .ArtViewGal:hover i{color:#fff;opacity:.85}
/* podpis zdjęcia (View.tpl: <div.fsmall.alL.cSzary>) - "fot. ..." */
.tm-artcard>.fsmall.cSzary{color:#7c8595;padding:10px 2px 0;margin:0 0 18px;line-height:1.5}

/* --- miniatury galerii pod zdjęciem (View.tpl: .container .row .img-thumbnail .artGal1) --- */
.tm-artcard .artGal1{position:relative;aspect-ratio:4/3;border-radius:6px;overflow:hidden;background:linear-gradient(128deg,#39465b,#75839b 58%,#a9b5c6)}
.tm-artcard .artGal1 img{width:100%;height:100%;object-fit:cover}
.tm-artcard .artGal1 .overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(13,15,19,.55);color:#fff;padding:0}

/* --- lead / zajawka (View.tpl: <div.bb.alJ.py-3.lh150>) --- */
.tm-artcard .bb{font-size:19.5px;line-height:1.55;font-weight:600;color:#2a303b;margin:14px 0 16px;padding:0}
/* ukryj legacy mobilny przycisk FB z View.tpl (wrapper daje własny pasek udostępniania) */
.tm-artcard .fb-share-button{display:none}

/* --- oznaczenie AI (wrapper artykuly.tpl): ikona Komisji Europejskiej + podpis w jednej, delikatnej
   linijce pod zajawką. Pliki SVG (images/ai/) mają przezroczyste marginesy w viewBox: okrągła ikona
   (31x31) widoczna ma ok. 20 px średnicy, pastylka (126x42) ok. 91x20 px, więc ujemne marginesy
   zjadają pusty margines i linijka ma wysokość ok. 20 px. Kolor podpisu z --txt-2 (5,4:1 na bieli,
   WCAG AA); tekst zawija się obok ikony (min-width:0), bez poziomego przewijania na 360 px. --- */
.tm-artcard .tm-art-ai{display:flex;align-items:center;gap:8px;margin:14px 0 16px;font-size:13px;line-height:1.4;color:var(--txt-2)}
.tm-artcard .tm-art-aii{flex:none;display:block;width:31px;height:31px;margin:-5.5px -6px -5.5px -5px}
.tm-artcard .tm-art-aim .tm-art-aii{width:126px;height:42px;margin:-11px -18px -11px -17px}
.tm-artcard .tm-art-ait{min-width:0}
/* boks „W kalendarzu wydarzeń” w artykule (pomysł #416) */
.tm-artcard .tm-artwyd{margin:0 0 16px;padding:12px 14px;border:1px solid var(--line);border-left:4px solid var(--sec-kultura);border-radius:6px;background:var(--tint-kultura)}
.tm-artcard .tm-artwyd-lab{margin:0 0 4px;font-family:var(--f-lab);font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ac-dark-kultura)}
.tm-artcard .tm-artwyd-nazwa{font-weight:600;color:var(--txt-h);text-decoration:underline;text-underline-offset:2px}
.tm-artcard .tm-artwyd-nazwa:hover,.tm-artcard .tm-artwyd-nazwa:focus-visible{color:var(--brand-h)}
.tm-artcard .tm-artwyd-kiedy,.tm-artcard .tm-artwyd-gdzie{margin:4px 0 0;font-size:14px;line-height:1.4;color:var(--txt)}

/* --- pasek udostępniania na <button> kopiuj (reset UA dla .tm-art-shb jako button) --- */
button.tm-art-shb{cursor:pointer;font-family:inherit}

/* --- treść (body) artykułu (View.tpl->wrapper: <div.txt232>, surowy HTML redakcyjny) --- */
.tm-artcard .txt232{font-size:17.5px;line-height:1.75;color:#2c333f}
.tm-artcard .txt232 p{margin:0 0 26px}
.tm-artcard .txt232 h2{font-size:24px;font-weight:700;letter-spacing:-.3px;margin:34px 0 16px;color:var(--dark)}
.tm-artcard .txt232 h3{font-size:20px;font-weight:700;margin:28px 0 12px;color:var(--dark)}
.tm-artcard .txt232 img{max-width:100%;height:auto;border-radius:8px;margin:6px 0}
.tm-artcard .txt232 a{color:var(--brand);text-decoration:underline}
.tm-artcard .txt232 ul,.tm-artcard .txt232 ol{margin:0 0 26px;padding-left:22px}
.tm-artcard .txt232 li{margin:0 0 8px}
.tm-artcard .txt232 blockquote{margin:32px 0;padding:4px 0 4px 24px;border-left:4px solid var(--brand);font-size:21px;line-height:1.5;font-weight:600;color:var(--dark)}
.tm-artcard .txt232 blockquote p{margin:0 0 10px}
/* podpis cytatu (autor wypowiedzi po myślniku, w tagu <strong>/<b> z importu depeszy) - do prawej, bez pogrubienia, kursywa, węższy odstęp między wierszami */
.tm-artcard .txt232 blockquote strong,.tm-artcard .txt232 blockquote b{display:block;text-align:right;font-weight:400;font-style:italic;line-height:1;font-size:15px;margin-top:10px}
.tm-artcard .txt232 iframe{max-width:100%}
/* reklama in-article (modifier TMArtykulyReklamaInsert: <div.mt-2.mb-2><ins.adsbygoogle>) */
.tm-artcard .txt232 .adsbygoogle{display:block;margin:0 auto;text-align:center}
/* inicjał (drop cap) na pierwszym akapicie treści - Barlow SC, czerwień, float */
.tm-artcard .txt232>p:first-child::first-letter{font-family:var(--f-lab);font-weight:600;font-size:54px;line-height:.85;float:left;padding:7px 11px 0 0;color:var(--brand)}

/* --- PRZECZYTAJ JESZCZE: karty jako linki (.tm-art-rc na <a>) --- */
a.tm-art-rc{display:block;color:inherit;text-decoration:none;transition:box-shadow .15s,transform .15s}
a.tm-art-rc:hover{box-shadow:var(--card-sh-h);transform:translateY(-2px)}
.tm-art-rc .tm-art-rci{display:block}

/* ===== PODSTRONY - wspólny wzorzec inc/page.tpl (Zadanie 7) =====
   breadcrumb (.tm-bc) + karta z tytułem "z kreską" (.tm-card.tm-pagecard/.tm-h1k) dla
   wrapperów other/pogoda/praca/noclegi/bok/reklama/redakcja/polityka/otm/user/profil/
   wirtualnyspacer. Styl kreski spójny z .tm-artcard h1 (sekcja ARTYKUŁ - Zadanie 6),
   pod nowymi nazwami klas z kontraktu inc/page.tpl. */
.tm-bc{font-size:12.5px;color:#8a93a2;margin:0 0 14px}
.tm-bc a{color:#8a93a2;text-decoration:none;font-weight:500}
.tm-bc a:hover{color:var(--brand)}
.tm-pagecard{display:block;overflow:visible;padding:28px 36px 30px}
.tm-h1k{font-size:30px;line-height:1.2;font-weight:700;letter-spacing:-.01em;color:var(--txt-h);margin:0 0 18px;border-left:5px solid var(--brand);padding-left:18px;margin-left:-23px}
@media(max-width:600px){.tm-pagecard{padding:20px 18px 22px}.tm-h1k{font-size:23px;margin-left:0;padding-left:13px}}

/* blok "miasto" (inc/miasto.tpl, Zadanie 7) - pogoda (widget legacy SGPogodaMiasta,
   stylowany przez compat.css) + liczba mieszkańców; wywoływany zwrotnie ze
   współdzielonego S/Artykuly/SGartFaktyMiasta*.tpl niezależnie od aktywnego motywu */
.tm-mw-pog{padding:0 6px}
.tm-mw-pop{text-align:center;padding:12px 6px 14px;margin:8px 0 0;background:var(--dark);color:#fff;border-radius:8px}
.tm-mw-popn{font:600 22px var(--f-lab)}
.tm-mw-popn .fas{margin-right:6px}
.tm-mw-popl{color:#fff;font-size:12.5px;text-decoration:underline;opacity:.85}

/* --- WAIT ("w przygotowaniu") i ADM/ADMINRN (bez sidebara reklamowego - Zadanie 7) --- */
.tm-wait{max-width:900px;margin:40px auto;text-align:center;padding:0 16px}
.tm-wait h1{font-size:30px;margin:18px 0 14px;color:var(--txt-h)}
.tm-wait img{max-width:100%;height:auto;border-radius:8px;margin-top:20px}
.tm-cd{display:flex;gap:14px;justify-content:center;margin:10px 0}
.tm-cd-u{background:var(--dark);color:#fff;border-radius:8px;padding:12px 16px;min-width:64px}
.tm-cd-n{font:700 30px var(--f-lab)}
.tm-cd-l{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#aab0bb}
.tm-adm-side{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh);padding:18px}
.tm-adm-side h2{font-size:17px;margin:0 0 10px;color:var(--txt-h)}
.tm-adm-side ul{margin:0;padding-left:18px}
.tm-adm-side li{margin:0 0 8px}

/* ===== PULPIT ZAPLECZA /adm (ext/admPulpit.php, rejestr ext/class/AdmPulpit.php) =====
   Kafle dzialow pogrupowane w siatce, pasek "Do rozpatrzenia" z licznikami i menu boczne {TMadmMenu}
   w dzialach. Akcent granatowy --loc (narzedzie wewnetrzne, nie tresc marki); licznik na --brand-h
   (bialy tekst 6,6:1). Kazdy link ma wlasna klase - regula .tm-pagecard :is(p,li,dd,td) a:not([class])
   kolorowalaby linki bez klasy na czerwono. */
.tm-admp-h{font:700 26px/1.2 var(--f-ui);margin:0 0 18px;color:var(--txt-h)}
.tm-admp-info{margin:0 0 18px;padding:10px 14px;border-radius:8px;background:var(--loc-bg);color:var(--txt)}
.tm-admp-grupa,.tm-admp-uwaga{margin:0 0 26px}
.tm-admp-gh{font:600 13px var(--f-lab);text-transform:uppercase;letter-spacing:.08em;color:var(--txt-2);margin:0 0 10px;padding:0 0 6px;border-bottom:1px solid var(--line)}
.tm-admp-gh .fas{color:var(--brand-h)}
.tm-admp-uwl{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.tm-admp-uwl li{margin:0}
.tm-admp-uwa{display:inline-flex;align-items:center;gap:8px;padding:7px 8px 7px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--txt-h);font:600 14px var(--f-ui);text-decoration:none}
.tm-admp-uwa:hover{border-color:var(--loc);color:var(--loc)}
.tm-admp-uwa .fas{color:var(--loc)}
.tm-admp-siatka{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin:0;padding:0;list-style:none}
.tm-admp-kafel{display:flex;flex-direction:column;margin:0;border:1px solid var(--line);border-radius:10px;background:#fff;transition:border-color .15s,box-shadow .15s}
.tm-admp-kafel:hover,.tm-admp-kafel:focus-within{border-color:var(--loc);box-shadow:var(--card-sh-h)}
.tm-admp-kafel-n{border-left:3px solid var(--brand-h)}
.tm-admp-glowny{display:grid;grid-template-columns:40px 1fr auto;grid-template-areas:"ik tyt n" "ik opis opis";gap:2px 12px;align-items:start;align-content:start;padding:14px 14px 12px;color:var(--txt);text-decoration:none;flex:1}
.tm-admp-glowny:hover .tm-admp-tyt{color:var(--loc)}
.tm-admp-ik{grid-area:ik;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:var(--loc-bg);color:var(--loc);font-size:18px}
.tm-admp-tyt{grid-area:tyt;font:600 16px/1.3 var(--f-ui);color:var(--txt-h);align-self:center}
.tm-admp-zew{font-size:11px;color:var(--txt-3);vertical-align:1px}
.tm-admp-opis{grid-area:opis;font-size:13.5px;line-height:1.45;color:var(--txt-2)}
.tm-admp-n{grid-area:n;display:inline-block;min-width:22px;padding:2px 7px;border-radius:999px;background:var(--brand-h);color:#fff;font:700 12px/1.4 var(--f-ui);text-align:center;align-self:center}
.tm-admp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tm-admp-pod{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:10px 14px 12px 66px;list-style:none;border-top:1px solid var(--line)}
.tm-admp-pod li{margin:0}
.tm-admp-pa{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--band);color:var(--txt-2);font:600 12.5px var(--f-lab);text-decoration:none}
.tm-admp-pa:hover{background:var(--loc);color:#fff}
@media(max-width:600px){.tm-admp-pod{padding-left:14px}.tm-admp-h{font-size:22px}}
/* menu boczne w dzialach */
.tm-admm-start{display:flex;align-items:center;gap:8px;padding:8px 10px;margin:0 0 6px;border-radius:8px;background:var(--loc-bg);color:var(--loc);font:600 15px var(--f-ui);text-decoration:none}
.tm-admm-gh{font:600 12px var(--f-lab);text-transform:uppercase;letter-spacing:.08em;color:var(--txt-2);margin:14px 0 4px}
.tm-adm-side .tm-admm-l{margin:0;padding:0;list-style:none}
.tm-adm-side .tm-admm-l li{margin:0}
.tm-admm-a{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:7px;color:var(--txt);font-size:14px;text-decoration:none}
.tm-admm-a .fas{width:16px;text-align:center;color:var(--txt-3)}
.tm-admm-a:hover{background:var(--band);color:var(--loc)}
.tm-admm-a.tm-admm-akt,.tm-admm-start.tm-admm-akt{background:var(--loc);color:#fff}
.tm-admm-a.tm-admm-akt .fas{color:#fff}
.tm-admm-n{margin-left:auto;min-width:20px;padding:1px 6px;border-radius:999px;background:var(--brand-h);color:#fff;font:700 11px/1.4 var(--f-ui);text-align:center}

/* ===== POGODA METEOSOURCE - pilot Warszawa (idea #284) =====
   strona /pogoda "polska" (NT3meteoPage przez ext/pogoda/polska.tpl) i pas pogodowy SG
   miast (NT3meteoPas); pigułka paska górnego "polska" (NT3meteoChip) zdjęta 2026-07-23.
   Ikony PNG z oficjalnego zestawu Meteosource: /theme/3/images/pogoda/{1-36}.png
   (numer walidowany w PHP). */
/* nagłówek: ikona + duża temperatura + opis (box i hero strony) */
.tm-mthead{display:flex;align-items:center;gap:11px}
.tm-mthead img{flex:none}
.tm-mttmp{font:600 32px var(--f-lab);color:var(--dark);line-height:1;flex:none}
.tm-mtsum{font-size:12.5px;color:var(--txt-2);line-height:1.35;min-width:0}
.tm-mtsum small{display:block;font-size:11.5px;color:var(--txt-3)}
a.tm-mthead:hover .tm-mtsum{color:var(--brand)}
/* rządek parametrów pod nagłówkiem boxu */
.tm-mtrow{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:9px;padding-top:8px;border-top:1px solid var(--line);font-size:12px;color:var(--txt-2)}
.tm-mtrow b{color:var(--txt);font-weight:600}
/* nowcasting w boxie: komunikat o opadach w najbliższej godzinie */
.tm-mtnc{margin-top:8px;background:#eef3fb;border-left:3px solid #3b6fc9;border-radius:4px;padding:6px 10px;font-size:12px;color:#2c4a7c}
/* pasek 4 dni prognozy w boxie */
.tm-mtdays{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}
.tm-mtd{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--band);border-radius:6px;padding:7px 2px;font-size:12.5px}
.tm-mtd b{font:600 11px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-2)}
.tm-mtd i{font-style:normal;font-weight:600;color:var(--txt)}
.tm-mtd em{font-style:normal;color:var(--txt-3)}
.tm-mtwk b{color:var(--brand)}
/* linki pełnej prognozy pod boxem: etykieta + dwa chipy (7 dni / 30 dni) czytelnie klikalne;
   obwódka + kolor marki, hover = wypełnienie tłem marki (silny sygnał, że to link) */
.tm-pgchips{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:11px}
.tm-pgchl{font-size:12px;color:var(--txt-2);margin-right:1px}
.tm-pgchip{display:inline-flex;align-items:center;padding:5px 12px;font:600 12.5px var(--f-lab);letter-spacing:.02em;color:var(--brand);background:var(--band);border:1px solid var(--line);border-radius:999px;transition:background .18s,color .18s,border-color .18s}
.tm-pgchip:hover{background:var(--brand);color:#fff;border-color:var(--brand)}
/* strona /pogoda: hero + siatka parametrów + astro */
.tm-mthero{margin-top:4px}
.tm-mtbig{font-size:44px}
.tm-mthero .tm-mtsum{font-size:14px}
.tm-mtgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;list-style:none;margin:16px 0 0;padding:0}
.tm-mtgrid li{background:var(--band);border-radius:8px;padding:10px 12px}
.tm-mtgrid b{display:block;font:600 16px var(--f-lab);color:var(--dark)}
.tm-mtgrid span{font-size:11.5px;color:var(--txt-2)}
.tm-mtastro{margin-top:10px;font-size:12.5px;color:var(--txt-2)}
.tm-mtastro b{color:var(--txt);font-weight:600}
/* ostrzeżenia meteo (teksty z API escapowane w szablonie) */
.tm-mtalert{background:var(--brand-bg);border-left:4px solid var(--brand);border-radius:6px;padding:10px 14px;margin:0 0 14px;font-size:13.5px}
.tm-mtalert b{display:block;color:var(--brand-h)}
.tm-mtalert-t{font-size:12px;color:var(--txt-2)}
.tm-mtalert p{margin:6px 0 0;line-height:1.5}
/* stopnie ostrzezen IMGW (1=zolte, 2=pomaranczowe, 3=czerwone): kolor ramki i tytulu
   wg stopnia - stopien z dopasowania IMGW w cronie albo z koloru naglowka Meteosource */
.tm-mtalert-s1{border-left-color:#e5a100}
.tm-mtalert-s1 b{color:#8a6100}
.tm-mtalert-s2{border-left-color:#e58100}
.tm-mtalert-s2 b{color:#8f5000}
.tm-mtalert-s3{border-left-color:#e50000}
.tm-mtalert-s3 b{color:#a30000}
/* nagłówki sekcji strony pogody */
.tm-mth2{font-size:21px;font-weight:700;letter-spacing:-.2px;margin:30px 0 12px;color:var(--dark)}
/* nagłówek sekcji z kontekstowym linkiem po prawej (np. "Najbliższe dni  prognoza na 30 dni ->") */
.tm-mth2row{display:flex;align-items:baseline;justify-content:space-between;gap:10px 16px;flex-wrap:wrap}
.tm-mth2more{font:600 13.5px var(--f-lab);letter-spacing:0;color:var(--brand);white-space:nowrap}
.tm-mth2more:hover{color:var(--brand-h)}
.tm-mtncsum{margin:0 0 10px;font-size:13.5px;color:var(--txt-2)}
.tm-mterr{font-size:15px;color:var(--txt-2)}
/* pasek jakości powietrza w boxie (NT3meteoBox): kategoria + kolor stanu + PM10/PM2.5 */
.tm-aq{margin-top:10px;padding-top:9px;border-top:1px solid var(--line)}
.tm-aqhd{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--txt-2)}
.tm-aqhd b{font-weight:600}
.tm-aqdot{width:10px;height:10px;border-radius:50%;flex:none}
.tm-aqbar{height:7px;margin:6px 0;border-radius:4px;background:var(--band);overflow:hidden}
.tm-aqbar span{display:block;height:100%;border-radius:4px;min-width:3px}
.tm-aqval{font-size:12px;color:var(--txt-2)}
.tm-aqval b{color:var(--txt);font-weight:600}
.tm-aqval small{color:var(--txt-3)}
/* jakość powietrza WPLECIONA w pogodę na stronie /pogoda (NT3meteoPage): bieżąca jako
   kompaktowy pasek przy warunkach bieżących, prognoza dobowa jako wskaźnik w wierszach dni.
   .tm-aqndot - wspólna kropka koloru kategorii (pasek bieżący + wiersze dni) */
.tm-aqnow{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;margin-top:12px;padding:10px 12px;background:var(--band);border-radius:8px;font-size:13px;color:var(--txt-2)}
.tm-aqndot{width:11px;height:11px;border-radius:50%;flex:none}
.tm-aqnst{font-weight:500}
.tm-aqnst b{font-weight:700}
.tm-aqnp{font-size:12.5px;color:var(--txt)}
.tm-aqnp b{color:var(--txt-3);font-weight:600;font-size:11px}
.tm-aqnu{font-size:11px;color:var(--txt-3)}
/* wykres opadów minutowych: 60 słupków, wysokość z inline --h (CSS-only, bez JS) */
.tm-mtmin{display:flex;align-items:flex-end;gap:1px;height:64px;background:var(--band);border-radius:6px;padding:4px 6px}
.tm-mtminb{flex:1;min-width:0;height:var(--h,0%);min-height:1px;background:#3b6fc9;border-radius:2px 2px 0 0}
.tm-mtminlab{display:flex;justify-content:space-between;font-size:11px;color:var(--txt-3);margin-top:3px}
/* pasek prognozy godzinowej (przewijany poziomo): na PC drag-to-scroll (js.js) +
   zawsze widoczny cienki scrollbar (systemowy overlay bywa ukryty) */
.tm-mthours{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;cursor:grab;scrollbar-width:thin;scrollbar-color:var(--hair) transparent}
.tm-mthours.tm-drag{cursor:grabbing}
.tm-mthours::-webkit-scrollbar{height:8px}
.tm-mthours::-webkit-scrollbar-thumb{background:var(--hair);border-radius:4px}
.tm-mthours::-webkit-scrollbar-thumb:hover{background:var(--txt-3)}
.tm-mthours::-webkit-scrollbar-track{background:transparent}
.tm-mth1{flex:none;display:flex;flex-direction:column;align-items:center;gap:3px;background:var(--band);border-radius:8px;padding:8px 9px;font-size:12.5px;min-width:56px}
.tm-mth1 b{font:600 11.5px var(--f-lab);color:var(--txt-2)}
.tm-mth1 i{font-style:normal;font-weight:600;color:var(--txt)}
.tm-mth1 em{font-style:normal;font-size:11px;color:var(--txt-3)}
.tm-mthsep{flex:none;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px;font-size:11px;color:var(--txt-2);border-left:2px solid var(--hair);padding:0 8px;white-space:nowrap}
.tm-mthsep b{font:600 12px var(--f-lab);text-transform:uppercase;letter-spacing:.05em;color:var(--brand)}
.tm-mtwet{color:#3b6fc9;font-weight:600}
/* wykres temperatury i opadów 48 h (SVG server-side, bez JS): pasmo temperatury
   u góry (linia + pole), pasmo opadów przy podstawie (słupki) - wspólna oś czasu,
   bez drugiej osi Y; paleta zwalidowana pod CVD (#e0662a temp / #3b6fc9 opady) */
.tm-mtchleg{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;margin:0 0 8px;font-size:12px;color:var(--txt-2)}
/* pozycja legendy (znacznik + opis) nierozrywalna przy zawijaniu */
.tm-mtchli{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.tm-mtchlt{display:inline-block;width:14px;height:4px;border-radius:2px;background:#e0662a}
.tm-mtchlo{display:inline-block;width:9px;height:9px;border-radius:2px;background:#3b6fc9}
/* kontener wykresu przewijany poziomo (drag-to-scroll w js.js, kursor grab); stała
   szerokość na punkt ustawiana inline (min-width na .tm-mtchin) - gdy treść mieści
   się w kolumnie, przewijanie po prostu nie występuje. Etykiety wartości i podpisy
   osi czasu są WEWNĄTRZ .tm-mtchin - przewijają się razem z wykresem */
.tm-mtch{position:relative;height:196px;margin:0 0 18px;background:var(--band);border-radius:8px;overflow-x:auto;overflow-y:hidden;cursor:grab;scrollbar-width:thin;scrollbar-color:var(--hair) transparent}
.tm-mtch.tm-drag{cursor:grabbing}
.tm-mtch::-webkit-scrollbar{height:8px}
.tm-mtch::-webkit-scrollbar-thumb{background:var(--hair);border-radius:4px}
.tm-mtch::-webkit-scrollbar-thumb:hover{background:var(--txt-3)}
.tm-mtch::-webkit-scrollbar-track{background:transparent}
.tm-mtchin{position:relative;height:100%}
.tm-mtchplot{position:relative;height:calc(100% - 20px)}
.tm-mtchplot svg{display:block;width:100%;height:100%}
.tm-mtchline{fill:none;stroke:#e0662a;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.tm-mtcharea{fill:rgba(224,102,42,.12)}
.tm-mtchrain{fill:#3b6fc9}
.tm-mtchsep{stroke:var(--hair);stroke-width:1;stroke-dasharray:3 3}
.tm-mtchbase{stroke:var(--hair);stroke-width:1}
.tm-mtchhit{fill:#fff;fill-opacity:0;pointer-events:all}
.tm-mtchval{position:absolute;transform:translate(-50%,-135%);font:600 11.5px var(--f-lab);color:var(--txt);pointer-events:none}
/* wykres 30 dni: pasmo min-maks temperatury (jedna seria) - krawędź maksimów to
   .tm-mtchline, minimów kreskowana (rozróżnialna też w druku/CVD), wypełnienie między nimi */
.tm-mtchband{fill:rgba(224,102,42,.14)}
.tm-mtchmin{fill:none;stroke:#e0662a;stroke-width:1.5;stroke-dasharray:5 4;stroke-linejoin:round;stroke-linecap:round}
.tm-mtchlm{display:inline-block;width:14px;height:0;border-top:2px dashed #e0662a}
/* etykiety minimów pod dolną krawędzią pasma, stonowane */
.tm-mtchvmin{transform:translate(-50%,40%);color:var(--txt-2)}
/* pierwsza etykieta wyrównana do lewej - centrowanie ucinałoby ją na krawędzi wykresu;
   w wykresie 30 dni (przeplot maks/min) span nr 2 to pierwsza etykieta minimum */
.tm-mtchval:first-of-type{transform:translate(0,-135%)}
.tm-mtch30 .tm-mtchval:nth-of-type(2){transform:translate(0,40%)}
.tm-mtchlab span:first-child{transform:none}
.tm-mtchday{position:absolute;top:5px;transform:translateX(4px);font:600 10.5px var(--f-lab);letter-spacing:.05em;text-transform:uppercase;color:var(--txt-2);pointer-events:none;white-space:nowrap}
/* tabliczka dnia przy prawej krawędzi (separator >90% szerokości) wyrównana do prawej -
   inaczej overflow:hidden kontenera obcinałby ją przy nocnych renderach */
.tm-mtchdayR{transform:translateX(calc(-100% - 4px))}
.tm-mtchlab{position:relative;height:16px;margin-top:2px;font-size:11px;color:var(--txt-3)}
.tm-mtchlab span{position:absolute;transform:translateX(-50%);white-space:nowrap}
/* "termometr tygodnia" - sekcja Najbliższe dni ze wspólną skalą temperatur (paski zakresu
   min-maks na jednej osi, geometria server-side z MeteosourceTM::tydzienTermometr) + kolumna
   jakości powietrza. Siatka 7 kolumn; kolory temperatur/powietrza inline z modelu (walidowane).
   Tor: .tm-wtscale wsunięta 8 px z boków - podziałki nagłówka i paski dni w jednym układzie */
.tm-wt{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh)}
.tm-wtscroll{overflow:visible}
.tm-wtlist{min-width:0}
.tm-wtgrid{display:grid;grid-template-columns:54px 34px 56px 30px minmax(0,1fr) 34px 46px;gap:12px;align-items:center;padding:9px 16px}
.tm-wthead{padding:7px 16px;border-bottom:1px solid var(--line);border-radius:8px 8px 0 0}
.tm-wth{font:600 10.5px/1 var(--f-lab);text-transform:uppercase;letter-spacing:.06em;color:var(--txt-3)}
.tm-wth-r{text-align:right}
.tm-wth-c{text-align:center}
.tm-wtrow{position:relative;transition:background .12s}
.tm-wtrow+.tm-wtrow{border-top:1px solid var(--line)}
.tm-wtrow:hover{background:var(--band)}
.tm-wtday{display:flex;flex-direction:column;line-height:1.05;gap:1px}
.tm-wtday b{font:700 13.5px/1 var(--f-lab);text-transform:uppercase;letter-spacing:.03em;color:var(--txt)}
.tm-wtday small{font-size:11px;color:var(--txt-3);font-variant-numeric:tabular-nums}
.tm-wtnow{margin-top:2px;align-self:flex-start;font:700 9px/1 var(--f-lab);text-transform:uppercase;letter-spacing:.05em;color:#fff;background:var(--brand);padding:2px 4px;border-radius:4px;font-style:normal}
.tm-wtwk .tm-wtday b{color:var(--brand)}
.tm-wtico{display:flex;justify-content:center}
.tm-wtico img{width:32px;height:32px;display:block}
.tm-wtprecip{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--txt-2);font-variant-numeric:tabular-nums}
.tm-wtdrop{width:13px;height:13px;flex:none;fill:#3b6fc9}
.tm-wtprecip.tm-wtwet{color:#3b6fc9;font-weight:600}
.tm-wtlo{text-align:right;font:500 13px/1 var(--f-ui);color:var(--txt-3);font-variant-numeric:tabular-nums}
.tm-wthi{text-align:left;font:700 14px/1 var(--f-ui);color:var(--txt);font-variant-numeric:tabular-nums}
.tm-wttrack{position:relative;height:30px}
.tm-wtaxis{height:20px}
.tm-wtscale{position:absolute;inset:0 8px}
.tm-wtrow .tm-wtscale::after{content:"";position:absolute;left:0;right:0;top:50%;height:3px;transform:translateY(-50%);background:var(--hair);border-radius:3px}
.tm-wtbar{position:absolute;top:50%;height:6px;transform:translateY(-50%);border-radius:4px;box-shadow:0 1px 2px rgba(16,20,28,.22);z-index:2}
.tm-wtknob{position:absolute;top:50%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;box-shadow:0 0 0 2px #fff,0 1px 2px rgba(16,20,28,.3);z-index:3}
.tm-wttick{position:absolute;top:50%;transform:translate(-50%,-50%);font:600 10px/1 var(--f-lab);color:var(--txt-3);background:#fff;padding:0 3px;font-variant-numeric:tabular-nums}
.tm-wtaq{display:flex;justify-content:center}
.tm-wtchip{min-width:22px;text-align:center;font:700 12px/1.35 var(--f-ui);font-variant-numeric:tabular-nums;padding:3px 7px;border-radius:6px}
.tm-wtlegend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:10px 16px;border-top:1px solid var(--line);background:var(--band);border-radius:0 0 8px 8px}
.tm-wtlg-t{font:600 10.5px/1 var(--f-lab);text-transform:uppercase;letter-spacing:.06em;color:var(--txt-3)}
.tm-wtlg{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--txt-2)}
.tm-wtlg i{width:10px;height:10px;border-radius:3px;display:inline-block;flex:none}
/* siatka prognozy 30-dniowej: stałe 5 kolumn (30 dni = 6 równych wierszy po 5),
   niezależnie od szerokości okna; na wąskim ekranie fallback auto-fill w @media */
.tm-mtcal{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.tm-mtday{display:flex;flex-direction:column;align-items:center;gap:3px;background:var(--band);border-radius:8px;padding:9px 6px;font-size:12.5px;text-align:center}
.tm-mtday b{font:600 11px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--txt-2)}
.tm-mtday i{font-style:normal;font-weight:600;color:var(--txt)}
.tm-mtday em{font-style:normal;color:var(--txt-3)}
.tm-mtday small{font-size:10.5px}
/* stopka źródła danych + CTA wyboru miasta pod prognozą na stronie pogody "polska" */
.tm-mtsrc{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;margin-top:18px;padding-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--txt-3)}
.tm-mtsrc a{color:var(--txt-2);text-decoration:underline}
.tm-mtcity{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:22px 0 0;font-size:14px;color:var(--txt-2)}
.tm-mtcity .tm-btn{border:0;cursor:pointer;font-family:inherit}
/* CTA na /pogoda: kafelek do wydzielonej podstrony prognozy 30-dniowej (/pogoda/prognoza-30-dni) */
.tm-mtcta{display:flex;align-items:center;gap:16px;margin:6px 0 4px;padding:15px 18px;background:linear-gradient(180deg,#fff,var(--band));border:1px solid var(--line);border-radius:10px;box-shadow:var(--card-sh);transition:box-shadow .2s,transform .2s,border-color .2s}
.tm-mtcta:hover{box-shadow:var(--card-sh-h);transform:translateY(-2px);border-color:var(--brand)}
.tm-mtcta-ic{flex:none;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:12px;background:linear-gradient(180deg,#e04b56,var(--brand));color:#fff;font:800 20px/1 var(--f-lab);box-shadow:0 6px 16px -6px rgba(212,62,73,.55)}
.tm-mtcta-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.tm-mtcta-t{font-size:16px;font-weight:700;color:var(--txt-h)}
.tm-mtcta-d{font-size:13px;color:var(--txt-2);line-height:1.4}
.tm-mtcta-b{flex:none;display:inline-flex;align-items:center;gap:6px;font:600 13px var(--f-lab);color:#fff;background:linear-gradient(180deg,#e04b56,var(--brand));padding:9px 16px;border-radius:999px;white-space:nowrap;box-shadow:0 6px 16px -6px rgba(212,62,73,.55);transition:background .2s}
.tm-mtcta:hover .tm-mtcta-b{background:var(--brand-h);color:#fff}
/* box "Prognoza 30 dni" w sidebarze strony /pogoda (link do podstrony długoterminowej) */
.tm-side30{display:flex;align-items:center;gap:11px;margin:0 0 14px;padding:12px 14px;background:linear-gradient(180deg,#fff,var(--band));border:1px solid var(--line);border-radius:10px;box-shadow:var(--card-sh);transition:box-shadow .2s,transform .2s,border-color .2s}
.tm-side30:hover{box-shadow:var(--card-sh-h);transform:translateY(-2px);border-color:var(--brand)}
.tm-side30-ic{flex:none;display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:10px;background:linear-gradient(180deg,#e04b56,var(--brand));color:#fff;font:800 17px/1 var(--f-lab);box-shadow:0 5px 14px -6px rgba(212,62,73,.55)}
.tm-side30-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.tm-side30-tx b{font-size:14.5px;font-weight:700;color:var(--txt-h)}
.tm-side30-tx small{font-size:12px;color:var(--txt-2);line-height:1.35}
.tm-side30-ar{flex:none;font-size:18px;color:var(--brand);font-weight:700}
.tm-side30:hover .tm-side30-ar{color:var(--brand-h)}
/* podstrona 30 dni: pasek podsumowania bieżącego u góry + powrót do /pogoda */
.tm-mt30now{margin:0 0 8px;font-size:14.5px;color:var(--txt)}
.tm-mt30now a,.tm-mt30back a{color:var(--brand);font-weight:600}
.tm-mt30now a:hover,.tm-mt30back a:hover{color:var(--brand-h)}
.tm-mt30back{margin:16px 0 0;font-size:14px}
@media(max-width:600px){
 .tm-mtgrid{grid-template-columns:repeat(2,1fr)}
 /* CTA 30 dni: na wąskim ekranie przycisk pod treścią (pełna szerokość, wyśrodkowany) */
 .tm-mtcta{flex-wrap:wrap;gap:12px}
 .tm-mtcta-b{width:100%;justify-content:center}
 /* termometr tygodnia: na wąskim ekranie przewijany poziomo (siatka 7 kolumn nie zmieści się) */
 .tm-wtscroll{overflow-x:auto}
 .tm-wtlist{min-width:360px}
 .tm-wtgrid{grid-template-columns:42px 28px 46px 26px minmax(0,1fr) 28px 40px;gap:8px;padding:8px 12px}
 .tm-wtico img{width:28px;height:28px}
 /* wykresy na wąskim ekranie: tylko niższe - etykiet NIE przerzedzamy, bo odstępy
    są stałe w px (przewijana treść o szerokości min-width na .tm-mtchin) */
 .tm-mtch{height:166px}
 /* 5 kolumn siatki 30 dni nie mieści się na wąskim ekranie - wracamy do auto-fill */
 .tm-mtcal{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}
}

/* ==== FOTOWOLTAIKA (/fotowoltaika, idea #286) ==== */
.tm-pv-msg{padding:10px 14px;border-radius:8px;margin:0 0 14px;font-weight:600}
.tm-pv-msg-ok{background:#e7f6ec;color:#1a7a3c}
.tm-pv-msg-err{background:#fdeaea;color:#b42318}
.tm-pv-form{margin:0 0 18px;border:1px solid #e3e6ea;border-radius:10px;padding:0 14px}
.tm-pv-form summary{cursor:pointer;font-weight:700;padding:12px 0}
.tm-pv-edit{margin:0 0 12px;font-size:.85rem}
.tm-pv-edit summary{padding:8px 0}
.tm-pv-frow{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 12px;align-items:flex-end}
.tm-pv-frow label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;flex:1 1 150px}
.tm-pv-frow input,.tm-pv-frow select{padding:8px;border:1px solid #cfd4da;border-radius:6px;font:inherit}
.tm-pv-btn{display:inline-block;background:#f5a300;color:#1c1c1c;border:0;border-radius:8px;
	padding:10px 22px;font-weight:700;cursor:pointer;text-decoration:none}
.tm-pv-btn:hover{background:#dd9300}
.tm-pv-card{border:1px solid #e3e6ea;border-radius:10px;padding:14px;margin:0 0 18px}
.tm-pv-prices{margin-top:24px}
.tm-pv-suma{border-color:#f5a300}
.tm-pv-suma>h2{margin:0 0 10px;font-size:1.15rem}
.tm-pv-inst>summary{cursor:pointer;display:flex;justify-content:space-between;gap:10px;
	align-items:flex-start;list-style:none}
.tm-pv-inst>summary::-webkit-details-marker{display:none}
.tm-pv-inst>summary::after{content:"▾";color:#68707a;font-size:.95rem;line-height:1.4}
.tm-pv-inst[open]>summary::after{content:"▴"}
.tm-pv-inst>summary h2{margin:0;font-size:1.15rem;flex:1}
.tm-pv-inst[open]>summary{margin-bottom:10px}
.tm-pv-iq{white-space:nowrap;font-weight:800;color:#1c1c1c;font-size:.95rem}
.tm-pv-irow{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.tm-pv-irow .tm-pv-edit{flex:1}
.tm-pv-sub{display:block;font-size:.8rem;font-weight:400;color:#68707a;margin-top:2px}
.tm-pv-del{margin-top:6px}
.tm-pv-del button{background:none;border:1px solid #cfd4da;border-radius:6px;padding:4px 10px;
	color:#b42318;cursor:pointer;font-size:.8rem}
.tm-pv-keybox{margin:0 0 12px;font-size:.85rem}
.tm-pv-keybox summary{padding:8px 0}
.tm-pv-keyrow{display:flex;gap:8px;align-items:center;margin:0 0 8px}
.tm-pv-keyfld{flex:1;min-width:0;padding:8px;border:1px solid #cfd4da;border-radius:6px;
	font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.8rem;
	background:#f7f8fa;color:#1c1c1c}
.tm-pv-copy{padding:8px 16px;white-space:nowrap}
.tm-pv-keygen{margin:0 0 8px}
.tm-pv-live{border:1px solid #d9edda;background:#f6fbf7;border-radius:10px;padding:12px 14px;margin:0 0 14px}
.tm-pv-live-stale{border-color:#e3e6ea;background:#f7f8fa}
.tm-pv-livehdr{display:flex;align-items:center;gap:8px;margin:0 0 10px}
.tm-pv-livehdr b{font-size:.95rem}
.tm-pv-livedot{width:10px;height:10px;border-radius:50%;background:#2e9e4f;flex:none;
	box-shadow:0 0 0 0 rgba(46,158,79,.5);animation:tmPvPulse 2s infinite}
.tm-pv-live-stale .tm-pv-livedot{background:#9aa0a6;animation:none}
@keyframes tmPvPulse{0%{box-shadow:0 0 0 0 rgba(46,158,79,.5)}70%{box-shadow:0 0 0 8px rgba(46,158,79,0)}100%{box-shadow:0 0 0 0 rgba(46,158,79,0)}}
@media (prefers-reduced-motion:reduce){.tm-pv-livedot{animation:none}}
.tm-pv-livetiles{margin:0}
.tm-pv-live-imp .tm-pv-big{color:#b42318}
.tm-pv-live-exp .tm-pv-big{color:#2e9e4f}
.tm-pv-livemore{margin-top:6px;font-size:.85rem}
.tm-pv-livemore summary{cursor:pointer;font-weight:700;padding:6px 0;color:#1c6b34}
.tm-pv-faztab{width:100%;border-collapse:collapse;margin:6px 0;font-size:.85rem}
.tm-pv-faztab th,.tm-pv-faztab td{text-align:left;padding:4px 8px;border-bottom:1px solid #e3e6ea}
.tm-pv-faztab thead th{color:#68707a;font-weight:600}
.tm-pv-faz-imp{color:#b42318}
.tm-pv-faz-exp{color:#2e9e4f}
/* Panel "na zywo" na gorze - agregat grupy (idea #286) */
.tm-pv-livetop-wrap{margin:0 0 16px}
.tm-pv-live-top{border-color:#d9edda;background:#f6fbf7}
.tm-pv-live-top.tm-pv-live-stale{border-color:#e3e6ea;background:#f7f8fa}
.tm-pv-grptiles{gap:22px}
.tm-pv-stat-progn .tm-pv-big{color:#0a6ebd}
.tm-pv-ekon{margin:2px 0 4px;font-size:.9rem;color:#68707a}
.tm-pv-ekon b{font-size:1.05rem}
.tm-pv-ekon-zysk b{color:#1a7a3c}
.tm-pv-ekon-koszt b{color:#b42318}
.tm-pv-ekon .tm-pv-sub{font-weight:400}
/* Macierz zysku (skladnik x okres) w panelu Na zywo - kolory z .tm-pv-ekon-zysk/koszt b */
.tm-pv-zysk-wrap{overflow-x:auto;margin:4px 0}
.tm-pv-zysk{border-collapse:collapse;font-size:.9rem;color:#68707a}
.tm-pv-zysk th,.tm-pv-zysk td{padding:2px 10px;text-align:right;white-space:nowrap}
.tm-pv-zysk thead th{font-weight:600;color:#68707a;font-size:.8rem;line-height:1.15}
.tm-pv-zysk thead th span{display:block;font-weight:400;font-size:.72rem;opacity:.7}
.tm-pv-zysk tbody th{text-align:left;font-weight:400;color:#3c4149}
.tm-pv-zysk-lbl{text-align:left!important;font-weight:700;color:#3c4149}
.tm-pv-zysk td b{font-size:1.02rem;font-variant-numeric:tabular-nums;font-weight:600}
.tm-pv-zysk-sum th,.tm-pv-zysk-sum td{border-top:1px solid #e4e7ec;padding-top:4px;font-weight:700}
.tm-pv-zysk-sum th{color:#3c4149}
.tm-pv-zysk-sum td b{font-weight:800}
/* Oznaczenie nieswiezych danych - zeby stary nocny odczyt (0 kW) nie wygladal jak live */
.tm-pv-stale-badge{display:none}
.tm-pv-live-stale .tm-pv-stale-badge{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:7px;background:#b42318;color:#fff;font-size:.72rem;font-weight:700}
.tm-pv-live-stale .tm-pv-today{opacity:.45}
.tm-pv-rozbicie{margin-top:4px;font-size:.85rem}
.tm-pv-rozbicie summary{cursor:pointer;font-weight:700;padding:6px 0;color:#1c6b34}
.tm-pv-srclist{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.tm-pv-srclist li{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:baseline;
	padding:6px 10px;border:1px solid #eef0f3;border-radius:8px;background:#fff}
.tm-pv-srcname{font-weight:700;color:#1c1c1c;min-width:8em}
.tm-pv-srcval{color:#68707a}
.tm-pv-srcval b{color:#1c1c1c;font-weight:800}
.tm-pv-srcprogn b{color:#0a6ebd}
.tm-pv-wait,.tm-pv-empty,.tm-pv-note{color:#68707a;font-size:.85rem}
.tm-pv-today{display:flex;flex-wrap:wrap;gap:18px;margin:0 0 12px}
.tm-pv-stat{display:flex;flex-direction:column;gap:2px;font-size:.8rem;color:#68707a}
.tm-pv-big{font-size:1.35rem;font-weight:800;color:#1c1c1c}
.tm-pv-chart{position:relative;margin:0 0 12px}
.tm-pv-dview[hidden]{display:none}
.tm-pv-chart svg{width:100%;height:170px;display:block}
.tm-pv-area{fill:#ffe9bd;fill-opacity:.7}
.tm-pv-line{fill:none;stroke:#f5a300;stroke-width:2.5}
.tm-pv-gx,.tm-pv-gy{stroke:#eef0f3;stroke-width:1}
.tm-pv-gx3,.tm-pv-gy{stroke:#dfe3e8}
.tm-pv-xlab{font-size:12px;fill:#68707a}
.tm-pv-ylab{font-size:10px;fill:#68707a;text-anchor:end}
.tm-pv-ymax{position:absolute;top:2px;right:6px;font-size:.75rem;color:#68707a}
.tm-pv-days{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));
	gap:8px;margin:0;padding:0}
.tm-pv-days li{border:1px solid #eef0f3;border-radius:8px;padding:8px;display:flex;
	flex-direction:column;gap:3px;font-size:.78rem;color:#68707a}
.tm-pv-dbtn{cursor:pointer}
.tm-pv-dbtn:hover{border-color:#f5a300}
.tm-pv-days li.tm-pv-akt{border-color:#f5a300;background:#fff8ea}
.tm-pv-dlab{font-weight:700;color:#1c1c1c}
.tm-pv-dkwh{font-size:.95rem;font-weight:800;color:#1c1c1c}
.tm-pv-dval{color:#1a7a3c;font-weight:700}
.tm-pv-dpeak{font-size:.72rem;color:#68707a}
.tm-pv-priceday h3{margin:10px 0 6px;font-size:.95rem}
.tm-pv-bars{display:flex;gap:2px;align-items:flex-end;height:110px}
.tm-pv-bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;height:100%;
	text-align:center}
.tm-pv-bar i{display:block;background:#9db6d8;border-radius:3px 3px 0 0;min-height:2px}
.tm-pv-bar.max i{background:#b42318}
.tm-pv-bar.min i{background:#1a7a3c}
.tm-pv-bar b{font-size:.62rem;color:#68707a;font-weight:600;margin-top:2px}
.tm-pv-fhint{font-size:.8rem;color:#68707a;margin:0 0 8px}
.tm-pv-zgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
	gap:8px;margin:0 0 12px}
.tm-pv-zak{display:flex;align-items:center;gap:6px;font-size:.8rem;color:#68707a}
.tm-pv-zak input{width:64px;padding:6px;border:1px solid #cfd4da;border-radius:6px;font:inherit}
.tm-pv-bilans{border:1px solid #eef0f3;border-radius:8px;padding:10px 12px;
	margin:0 0 12px;font-size:.85rem}
.tm-pv-bilans h3{margin:0 0 8px;font-size:.95rem}
.tm-pv-bstats{list-style:none;display:flex;flex-wrap:wrap;gap:6px 18px;
	margin:0 0 8px;padding:0;color:#68707a}
.tm-pv-bstats b{color:#1c1c1c}
.tm-pv-bgodz{margin:0 0 6px;color:#68707a}
.tm-pv-bgodz b{color:#1c1c1c}
.tm-pv-bosz{margin:0;font-weight:700}
.tm-pv-bosz b{color:#1a7a3c;font-size:1.05rem}
.tm-pv-bosz span{font-weight:400;color:#68707a;font-size:.78rem}
.tm-pv-landing p{margin:0 0 12px}
.tm-pv-cta{margin:18px 0}
@media (max-width:760px){.tm-pv-bars{height:80px}.tm-pv-bar b{font-size:.55rem}}

/* Zamknieta sekcja PRO (konto FREE) - klodka + CTA */
.tm-pv-lock{border:1px solid #e2e6ea;border-radius:10px;background:#f7f9fb;padding:16px 18px;margin:14px 0;text-align:center}
.tm-pv-lock-hd{font-size:16px;color:#334}
.tm-pv-lock-ico{margin-right:6px}
.tm-pv-lock-tag{display:inline-block;background:#1a7a3c;color:#fff;font-size:11px;font-weight:700;padding:1px 7px;border-radius:10px;vertical-align:middle;margin-left:4px}
.tm-pv-lock-op{color:#667;margin:8px 0 12px}
.tm-pv-probox,.tm-pv-prolist{max-width:640px;margin:0 auto}
.tm-pv-prolist{text-align:left;line-height:1.7}
.tm-pv-pro-ok{color:#1a7a3c;font-weight:700}
.tm-pv-probadge{margin:6px 0 10px;color:#1a7a3c;font-size:13px}
.tm-pv-admin{border-top:2px solid #e2e6ea}
.tm-pv-adminform label{display:inline-block;margin-right:14px}
.tm-pv-admintab{width:100%;border-collapse:collapse;margin-top:10px}
.tm-pv-admintab th,.tm-pv-admintab td{border-bottom:1px solid #eef1f4;padding:6px 8px;text-align:left}
.tm-pv-btn-del{background:#b42318}

/* ===== RYTM STRONY GŁÓWNEJ /polska - wariant V1 "gęsty portal" (warstwa C1) =====
   Rusztowanie układów sekcji SG. Wywołania widgetów są nietknięte - zmienia się wyłącznie
   siatka, w którą trafia ich wyjście (.tm-hbig / .tm-latest / .tm-mini / .tm-card / .tm-top5
   / .tm-sitem). Klasy przeniesione z makiety V1 pod prefiks tm-.
   UWAGA: reguły strojące kafle muszą stać PRZED sekcją "KAFELEK SPONSORA" (.tm-madv),
   bo .tm-madv dzieli z nimi specyficzność 0,2,0 i o pierwszeństwie decyduje kolejność. */

/* sekcja jako <section>: nagłówek jest jej pierwszym dzieckiem, więc istniejąca reguła
   .tm-shead:first-child zeruje górny margines - odstęp między sekcjami niesie .tm-sec */
.tm-sec{margin:0 0 34px}
.tm-sec:last-child{margin-bottom:0}

/* --- FAKTY POLSKA: "wydarzenia dnia" --- */
/* wysokość rzędu w zmiennej: jeden punkt regulacji dla hero, kafli i listy naraz */
.tm-dnia{--tm-dnia-h:442px;display:grid;grid-template-columns:1.6fr 1fr 272px;
 grid-auto-rows:var(--tm-dnia-h);gap:14px;align-items:stretch}
.tm-dnia>*{min-width:0;min-height:0}
/* NT3najnowsze oddaje wrapper .tm-hero z hero i listą w środku - display:contents wpuszcza
   oba elementy wprost do siatki .tm-dnia jako osobne kolumny (bez zmian w szablonie NT3*) */
.tm-dnia .tm-hero{display:contents}
.tm-dnia .tm-hbig{grid-area:1/1;height:100%;min-width:0}
.tm-dniamid{grid-area:1/2;display:grid;grid-template-rows:1fr 1fr;gap:14px;min-width:0;min-height:0}
/* kafle środkowej kolumny wypełniają wysokość: zdjęcie rośnie, pasek tytułu zostaje stały */
.tm-dniamid .tm-mini{display:flex;flex-direction:column;min-height:0}
.tm-dniamid .tm-mimg{flex:1;height:auto;min-height:0}
.tm-dniamid .tm-mt{font-size:14px}
/* warstwa B1 oddaje kafle jako .tm-oc (tytul na zdjeciu) ze stala proporcja - w siatce
   o zadanej wysokosci rzedu proporcja musi ustapic wysokosci komorki */
.tm-dniamid .tm-oc{height:100%;aspect-ratio:auto;min-height:0}
/* wąska kolumna: lista "Najnowsze" bez białej karty, oddzielona kreską, miniatury 88x62 */
.tm-dnia .tm-latest{grid-area:1/3;background:none;box-shadow:none;border-radius:0;
 /* border:0 kasuje tez bok gorny/prawy/dolny, ktore przeciekaly z bazowego .tm-latest
    (border:1px na wszystkich bokach - styl karty strony miasta). Separacje od srodkowej
    kolumny trzyma juz sam padding-left 14px, bez pionowej kreski. Uklady tablet/mobile
    (@media nizej) dokladaja border-top do wariantu stosu - tego nie ruszamy. */
 border:0;padding:0 0 0 14px;overflow:hidden}
.tm-dnia .tm-lhead{border-bottom:1px solid var(--line);color:var(--ac,var(--brand))}
.tm-dnia .tm-li{flex:1;align-items:center;border-bottom:1px solid var(--hair)}
/* ostatni wiersz TRZYMA kreske (jawne nadpisanie bazowego .tm-li:last-child{border-bottom:0}) -
   po zdjeciu ramki kolumny (border:0 wyzej) linia pod ostatnim wpisem domyka "Najnowsze" od dolu */
.tm-dnia .tm-li:last-child{border-bottom:1px solid var(--hair)}
.tm-dnia .tm-lth{width:88px;height:62px;border-radius:4px}
.tm-dnia .tm-lt{font-size:13px}

/* rząd uzupełniający Faktów: 6 kafli w jednym pasie (964/6 = ~152px, derywat s=320 schodzi
   do 0,48 - żadnego skalowania w górę).
   Strojenie typografii siedzi przy kaflu .tm-oc-m (sekcja "gesta siatka" nizej) -
   .tm-mt/.tm-mb w tej siatce juz nie istnieja. */
.tm-minis6{grid-template-columns:repeat(6,1fr)}

/* --- SKRÓT WYDARZEŃ: pas między kreskami, karty z paskiem akcentu (2026-09-10, wersja 2) ---
   Do 2026-09-10 pas miał etykietę "Skrót wydarzeń" w kolumnie 78px i siatkę 4 kolumn z datą
   publikacji przed każdym tytułem. Oba zniknęły na życzenie: etykieta dublowała h2
   "Fakty Polska" tuż nad pasem, a godzina w czterech wąskich kolumnach była metryczką, nie
   treścią. Bez kolumny etykiety cały tor 964px należy teraz do listy.
   PIERWSZA wersja układu (pigułki flex-wrap, border-radius:999px) odrzucona - na
   wielowierszowym tytule pełne zaokrąglenie stadionowe wygląda jak "bąbel", nie jak tag.
   Ta wersja zostaje kartą: lewy pasek w kolorze sekcji zamiast kropki, delikatne tło,
   zaokrąglenie tylko z prawej (8px) - czytelne niezależnie od liczby wierszy tytułu.
   border-left/border-right na .tm-skrot jawnie wyzerowane: bazowa reguła .tm-skrot (wyżej
   w pliku) ustawia "border" skrótem na wszystkich bokach, a ta reguła nadpisuje tylko
   top/bottom - bez jawnego zera zostawałaby niezamierzona pionowa kreska po bokach pasa.
   grid auto-fit zamiast ręcznych progów @media (jak w poprzedniej siatce 4 kolumn): liczba
   kart dopasowuje się sama do szerokości toru, karta nie schodzi nigdy poniżej 240px. */
.tm-skrot{background:none;box-shadow:none;border-radius:0;
 border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-left:0;border-right:0;
 padding:16px 0;margin-top:16px}
.tm-skrot .tm-lcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px 20px}

/* karta: pasek akcentu sekcji po lewej + tytuł, bez metryczki. Tło var(--band) odróżnia
   kartę od białego tła strony, mimo że samo .tm-skrot jest przezroczyste (pas "między
   kreskami", nie karta).
   overflow-wrap: długa nazwa własna nie ma prawa rozepchać karty poza kolumnę gridu
   (w teście z 68-znakowym słowem tekst wychodził poza boks o 95 px przy poprzedniej siatce).
   Dwie deklaracje, bo break-word obsługuje Safari starsze niż 15.4. */
.tm-skrot .tm-sitem{display:block;padding:9px 14px 9px 13px;
 border-left:3px solid var(--ac,var(--brand));border-radius:0 8px 8px 0;background:var(--band);
 font-size:12.5px;font-weight:500;line-height:1.4;color:#242a34;
 overflow-wrap:break-word;overflow-wrap:anywhere;transition:background .15s}

/* Wskazanie kursorem i fokus klawiaturowy - do 2026-09-07 dwanaście linków w tym pasie
   nie miało ŻADNEGO stanu. Sygnał nie może być samym kolorem (WCAG 1.4.1), stąd podkreślenie
   tytułu razem z tłem karty. Hover pod @media(hover:hover), bo na dotyku :hover zostaje
   przyklejony do ostatnio dotkniętej pozycji. */
@media(hover:hover){
 .tm-skrot .tm-sitem:hover{background:var(--line)}
 .tm-skrot .tm-sitem:hover .tm-sit{color:var(--ac-dark,var(--ac,var(--brand)));
  text-decoration:underline;text-underline-offset:2px}
}
.tm-skrot .tm-sitem:focus-visible{outline:2px solid var(--ac-dark,var(--ac,var(--brand)));
 outline-offset:1px}
.tm-skrot .tm-sitem:focus-visible .tm-sit{text-decoration:underline;text-underline-offset:2px}
@media(prefers-reduced-motion:reduce){.tm-skrot .tm-sitem{transition:none}}

/* --- STREFA BIZNESU: poziomy pas kafli + rządek notek --- */
/* 964px / 5 kolumn = ~185px na kafel; rząd 236px daje kadr zdjęcia ~174px, czyli derywat
   s skaluje się w DÓŁ. Przy 258px z makiety byłoby +9% w górę.
   Poprawka 2026-09-05: derywat s ma 400x209 px, nie 320x180 - zmierzone na 25 z 25 plików
   {id}s w www/img/art/2026/09 i zgodne z conf/art.php ($Sconf['artykuly']['sW']=400).
   Zapas jest więc większy, niż mówił ten komentarz: kadr 174 px wysokości przy obrazie
   209 px to skala 0,83, a nie 0,97. */
.tm-strip{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:236px;gap:10px}
.tm-strip>*{min-width:0;min-height:0}
.tm-strip .tm-card{grid-column:span 2;height:100%;display:flex;flex-direction:column;border-radius:6px}
.tm-strip .tm-cimg{flex:1;height:auto;min-height:0}
.tm-strip .tm-cb{padding:10px 12px 12px}
.tm-strip .tm-ct{font-size:17px;margin:5px 0}
.tm-strip .tm-cl{display:none}   /* lead nie mieści się w kaflu pasa */
.tm-strip .tm-mini{height:100%;display:flex;flex-direction:column;border-radius:6px}
.tm-strip .tm-mimg{flex:1;height:auto;min-height:0}
.tm-strip .tm-mb{padding:9px 10px 11px}
/* warianty .tm-oc z warstwy B1: karta wiodaca to .tm-oc-c, kafle to .tm-oc-m */
.tm-strip .tm-oc{height:100%;aspect-ratio:auto;min-height:0}
.tm-strip .tm-oc-c{grid-column:span 2}
.tm-strip .tm-oc-c .tm-oct{font-size:19px}
/* notki: ranking 6 pozycji jako trzy kolumny tekstu pod pasem, bez numeracji (kreska w --ac) */
.tm-noty{margin-top:12px;border-top:1px solid var(--line);padding-top:11px}
.tm-noty .tm-top5{display:grid;grid-template-columns:repeat(3,1fr);gap:0 20px;
 background:none;box-shadow:none;border-radius:0;padding:0}
.tm-noty .tm-t5{flex:none;display:block;position:relative;padding:6px 0 6px 13px;border-bottom:0}
.tm-noty .tm-t5 b{display:none}
.tm-noty .tm-t5::before{content:"";position:absolute;left:0;top:13px;width:6px;height:2px;
 background:var(--ac,var(--brand))}
.tm-noty .tm-t5 span{font-size:13.5px;line-height:1.3}

/* kafelek notowan surowcow (pomysl #314, czwarta wersja 2026-09-04): klasy .tm-oc/.tm-oc-m
   (te same co fotograficzne kafle artykulow) daja mu DOKLADNIE takie same wymiary co
   sasiednie zdjecia w kazdej siatce (w .tm-strip narzuca je grid-auto-rows) - zero osobnych
   regul rozmiaru tutaj. Od 2026-10-06 kafel stoi tylko na portalu polska (indexPolska.tpl);
   na SG miasta zastapil go panel budzetu GUS (.tm-gosbud), wiec .tm-surstand usunieta. Tlo to gradient w odcieniach
   akcentu Biznesu zamiast zdjecia (brak realnego zdjecia dla danych rynkowych); ciemne tlo
   => te same odcienie zmiany co pasek FLASH (.tm-nbp-tick), NIE .tm-nbp (kalibrowane pod
   biale tlo). */
.tm-surtile{background:linear-gradient(150deg,#132437 0%,#1c4666 42%,#2f7aab 100%)}
.tm-surico{position:absolute;top:14px;right:14px;width:28px;height:28px;color:rgba(255,255,255,.3);z-index:2}
.tm-surl2{display:flex;flex-direction:column;gap:6px;margin-top:7px}
.tm-suriTop{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.tm-suriL{font-size:12px;color:#fff;font-weight:600}
.tm-suriV{display:block;font-size:11px;color:rgba(255,255,255,.68);margin-top:1px}
.tm-surz{font-size:11px;font-weight:600;white-space:nowrap}
.tm-surz.up{color:#4ade80}
.tm-surz.dn{color:#ff8f97}
.tm-surtile .tm-nbp-zrodlo{display:block;margin-top:8px;color:rgba(255,255,255,.5)}

/* podstrona /notowania (pomysl #314): kursy walut NBP i ceny surowcow jako karty - kafelek
   "Surowce" na SG prowadzi tutaj zamiast do listy artykulow (brak sensownego artykulu dla
   samych liczb). Karty .tm-qcard sa wspolne dla NT3nbpStrona.tpl i NT3surowceStrona.tpl. */
.tm-not{padding:26px 0 50px}
.tm-notTit{font-size:32px;margin:0 0 8px}
.tm-notLead{color:var(--txt-2);font-size:14.5px;margin:0 0 30px;max-width:640px}
.tm-notH2{font-size:19px;margin:0 0 14px;padding-bottom:8px;border-bottom:2px solid var(--dark)}
.tm-qgrid{display:grid;gap:14px;margin:0 0 10px}
.tm-qgrid4{grid-template-columns:repeat(4,1fr)}
.tm-qgrid3{grid-template-columns:repeat(3,1fr)}
.tm-qcard{display:block;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--card-sh);padding:18px 20px;color:inherit;text-decoration:none}
/* karty sa linkami do /notowania/{slug} - hover jak na kartach artykulow (.tm-card:hover) */
a.tm-qcard:hover{border-color:var(--brand);box-shadow:var(--card-sh-h);transform:translateY(-2px)}
a.tm-qcard{transition:box-shadow .18s ease,transform .18s ease,border-color .18s ease}
.tm-qlabel{font:600 12px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-qvalue{font-size:26px;font-weight:700;color:var(--txt);margin:8px 0 4px}
.tm-qunit{font-size:13px;font-weight:400;color:var(--txt-2)}
.tm-qchange{font-size:13.5px;font-weight:600}
.tm-qchange.up{color:#1c7c43}
.tm-qchange.dn{color:var(--brand)}
.tm-notSrc{margin:6px 0 40px}
/* mikro-wykres 30 dni w karcie (SVG budowany w PHP - tmSparkSvg w function.TMnbp.php) */
.tm-sparkbox{margin-top:10px;line-height:0}
.tm-spark{display:block;width:100%;height:22px}
/* widok szczegolowy /notowania/{slug}: naglowek z biezaca wartoscia, duzy wykres, tabela */
.tm-notBack{margin:0 0 10px;font-size:13px}
.tm-qbig{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
/* przelacznik zakresu wykresu - zwykle odnosniki (kazdy zakres ma wlasny adres), bez JS */
.tm-zakres{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:0 0 16px}
.tm-zakresL{margin-right:2px;font:600 11px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-zakresB{display:inline-block;padding:6px 13px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 12.5px var(--f-lab);color:var(--txt-2);text-decoration:none;transition:border-color .2s,color .2s,background .2s}
a.tm-zakresB:hover{border-color:var(--brand);color:var(--brand)}
.tm-zakresB.is-on{background:var(--dark);border-color:var(--dark);color:#fff}
.tm-qvalueBig{font-size:34px;margin:4px 0 0}
.tm-qchangeBig{font-size:17px}
.tm-chartbox{background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--card-sh);padding:14px 16px 10px;margin-bottom:34px}
.tm-chart{display:block;width:100%;height:100%}
/* Opisy osi wykresu. Kwoty (os pionowa) i daty (os pozioma) to HTML pozycjonowany procentowo,
   a nie <text> w SVG - wykres ma preserveAspectRatio="none" i rozciaga sie na cala szerokosc
   kolumny, wiec tekst w srodku bylby scisniety w poziomie i skalowalby sie razem z rysunkiem.
   Procenty wylicza widget TMnotowanieDetal z tego samego marginesu, ktorym rysuje siatke. */
.tm-chartgrid{display:grid;grid-template-columns:auto 1fr;column-gap:10px}
.tm-chartY{position:relative;height:190px}
.tm-chartY span{position:absolute;right:0;transform:translateY(-50%);font:600 11.5px/1 var(--f-lab);color:var(--txt-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.tm-chartPlot{position:relative;height:190px}
.tm-chartX{grid-column:2;position:relative;height:15px;margin-top:7px}
.tm-chartX span{position:absolute;transform:translateX(-50%);font:600 11.5px/1 var(--f-lab);color:var(--txt-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.tm-chartX span.s{transform:none}
.tm-chartX span.e{transform:translateX(-100%)}
.tm-chartlab{display:flex;justify-content:space-between;gap:12px;margin-top:9px;padding-top:8px;border-top:1px solid var(--line);font-size:11.5px;color:var(--txt-2)}
.tm-tbl{width:100%;border-collapse:collapse;margin-bottom:40px;font-size:13.5px}
.tm-tbl th{text-align:left;font:600 11px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2);padding:8px 10px;border-bottom:2px solid var(--dark)}
.tm-tbl td{padding:9px 10px;border-bottom:1px solid var(--line)}
.tm-tbl td.up{color:#1c7c43;font-weight:600}
.tm-tbl td.dn{color:var(--brand);font-weight:600}
@media(max-width:880px){.tm-qgrid4{grid-template-columns:repeat(2,1fr)}.tm-qgrid3{grid-template-columns:1fr}}
@media(max-width:600px){
 .tm-chartbox{padding:12px 12px 8px}
 .tm-chartgrid{column-gap:7px}
 .tm-chartY,.tm-chartPlot{height:158px}
 .tm-chartY span,.tm-chartX span{font-size:10.5px}
 /* na waskim ekranie piec dat zlewa sie w jedna plame - zostawiamy skrajne i srodkowa */
 .tm-chartX span.m:nth-of-type(2),.tm-chartX span.m:nth-of-type(4){display:none}
 .tm-chartlab{flex-direction:column;gap:3px}
}

/* --- SPORT: lista wyników (bez numeracji) + mozaika kafli --- */
/* bez align-items:start - obie kolumny mają być tej samej wysokości, bo to z niej bierze się
   wyrównanie ostatniej pozycji rankingu do dolnej krawędzi kafli po prawej.
   Wysokość wiersza wyznacza wyższa kolumna, w praktyce siatka kafli (210+10+158 = 378px) */
.tm-mozaika{display:grid;grid-template-columns:296px 1fr;gap:22px}
.tm-mozaika>*{min-width:0}
/* Ranking siedzi w panelu w kolorze sekcji - ten sam mechanizm co kafel typograficzny
   .tm-nofoto (warstwa B2): tło bierze --ac-dark, token warstwy A ZMIERZONY pod biały tekst
   (sport #367c39 = 5,12:1). NIE podstawiać tu --ac (#3f9142) - płasko daje ~3,9:1, czyli
   poniżej AA dla tekstu tej wielkości. Panel zastępuje górną kreskę: na zielonym tle nie
   miałaby czego oddzielać, a dublowała kreskę nagłówka sekcji ~25px wyżej.
   flex + flex:1 dają .tm-top5 pełną wysokość kolumny (samo z siebie ma wysokość treści),
   a space-between rozkłada zapas równo w odstępy zamiast zostawiać dziurę pod ostatnią
   pozycją. Zawężone do .tm-mozaika, bo na stronach miast (.tm-gC) kolumna jest wysokości
   treści i nie ma czego rozkładać */
/* zaokrąglony wyłącznie lewy dolny róg (kolejność: TL TR BR BL), promieniem 8px - tym samym,
   którym operują kafle obok i reszta arkusza. Pozostałe trzy rogi zostają ostre celowo */
.tm-mozaika .tm-rank{display:flex;flex-direction:column;padding:13px 15px;border-radius:0 0 0 8px;
 background:var(--ac-dark,var(--ac,var(--brand)))}
.tm-mozaika .tm-rank .tm-top5{flex:1;justify-content:space-between;border-top:0}
/* 6 pozycji mieści się w 378px tylko przy tytułach ciętych do dwóch linii: trzy linie to
   ~77px na pozycję (6 x 77 = 462px), czyli kolumna urosłaby ponad kafle i zabrała ze sobą
   wyrównanie dołu. Stąd line-clamp i 13,5px zamiast 14,5px - przy 254px na tekst to ~68
   znaków, a szablon i tak tnie tytuł na 90 znakach */
.tm-mozaika .tm-rank .tm-t5 span{color:#fff;font-size:13.5px;
 display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
/* znacznik na zielonym tle musi być jasny - w kolorze sekcji byłby niewidoczny */
.tm-mozaika .tm-rank .tm-t5::before{background:rgba(255,255,255,.6);top:16px}
/* ostatnia pozycja bez dolnego paddingu - inaczej równo z dolną krawędzią panelu kończy się
   jej pudełko, a sam tekst wisi 9px wyżej; zapas wraca do odstępów między pozycjami */
.tm-mozaika .tm-rank .tm-t5:last-child{padding-bottom:0}
/* border:0 przed border-top jest konieczne: bazowa .tm-top5 rysuje ramkę z czterech stron
   (border:1px solid var(--line)) i samo nadpisanie border-top zostawiłoby szare boki i spód */
.tm-rank .tm-top5{background:none;box-shadow:none;border-radius:0;padding:0;
 border:0;border-top:2px solid var(--ac,var(--brand))}
.tm-rank .tm-t5{flex:none;align-items:baseline;padding:9px 0 9px 14px;position:relative;border-bottom:0}
/* bez numeracji - kreska w kolorze sekcji jak w notkach Biznesu (.tm-noty), numer nie niósł żadnej realnej rangi w kilkuelementowej sekcji tematycznej */
.tm-rank .tm-t5 b{display:none}
.tm-rank .tm-t5::before{content:"";position:absolute;left:0;top:17px;width:6px;height:2px;background:var(--ac,var(--brand))}
.tm-rank .tm-t5 span{font-size:14.5px}
/* prawa strona: 646px / 3 kolumny = ~209px; karta na 2 kolumnach = ~427px */
.tm-mgrid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:210px 158px;gap:10px}
.tm-mgrid>*{min-width:0;min-height:0}
.tm-mgrid .tm-card{grid-column:span 2;height:100%;display:flex;flex-direction:column;border-radius:6px}
.tm-mgrid .tm-cimg{flex:1;height:auto;min-height:0}
.tm-mgrid .tm-cl{display:none}
.tm-mgrid .tm-ct{font-size:19px}
.tm-mgrid .tm-mini{height:100%;display:flex;flex-direction:column;border-radius:6px}
.tm-mgrid .tm-mimg{flex:1;height:auto;min-height:0}
.tm-mgrid .tm-mb{padding:8px 10px 10px}
/* warianty .tm-oc z warstwy B1 */
.tm-mgrid .tm-oc{height:100%;aspect-ratio:auto;min-height:0}
.tm-mgrid .tm-oc-c{grid-column:span 2}
.tm-mgrid .tm-oc-c .tm-oct{font-size:20px}

/* --- NIERUCHOMOŚCI: rząd równych kafli + lista tekstowa w 2 kolumnach --- */
/* 5 pól po ~185px, rząd 214px -> kadr zdjęcia ~152px, derywat s schodzi do 0,84 */
.tm-eqstrip{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:214px;gap:10px}
.tm-eqstrip>*{min-width:0;min-height:0}
.tm-eqstrip .tm-card,.tm-eqstrip .tm-mini{height:100%;display:flex;flex-direction:column;border-radius:6px}
.tm-eqstrip .tm-cimg,.tm-eqstrip .tm-mimg{flex:1;height:auto;min-height:0}
.tm-eqstrip .tm-cb{padding:9px 10px 11px}
.tm-eqstrip .tm-ct{font-size:14px;margin:4px 0 0}
.tm-eqstrip .tm-cl,.tm-eqstrip .tm-meta{display:none}
/* warianty .tm-oc z warstwy B1: karta wiodąca jest tu równym kaflem (bez span) */
.tm-eqstrip .tm-oc{height:100%;aspect-ratio:auto;min-height:0}
.tm-eqstrip .tm-oc-c .tm-oct{font-size:15px;line-height:1.25}
.tm-eqstrip .tm-oc-c .tm-ocl{display:none}
.tm-tlist{margin-top:12px;border-top:1px solid var(--line);padding-top:8px}
.tm-tlist .tm-top5{display:grid;grid-template-columns:1fr 1fr;gap:0 26px;
 background:none;box-shadow:none;border-radius:0;padding:0}
.tm-tlist .tm-t5{flex:none;padding:9px 0 9px 14px;position:relative;border-bottom:1px solid var(--hair)}
/* bez numeracji - kreska w kolorze sekcji jak w notkach Biznesu (.tm-noty), numer nie niósł żadnej realnej rangi w kilkuelementowej sekcji tematycznej */
.tm-tlist .tm-t5 b{display:none}
.tm-tlist .tm-t5::before{content:"";position:absolute;left:0;top:17px;width:6px;height:2px;background:var(--ac,var(--brand))}
.tm-tlist .tm-t5 span{font-size:13.5px}

/* --- KULTURA: pas pełnej szerokości na tincie (sekcja POZA .tm-cols) --- */
/* token --tint-kultura dodaje warstwa A; fallback trzyma kolor nawet bez niej */
.tm-tint{background:var(--tint-kultura,#fdf7ec);padding:26px 0 30px;margin:0 0 34px}
.tm-tint .tm-shead{margin-top:0}
.tm-kult{display:grid;grid-template-columns:1fr 262px;gap:14px;align-items:stretch}
.tm-kult>*{min-width:0}
/* 1288 - 262 - 14 = 1012px na 5 kolumn = ~193px na kafel; karta wiodąca ~398px */
.tm-kultg{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:216px;gap:12px}
.tm-kultg>*{min-width:0;min-height:0}
.tm-kultg .tm-card{grid-column:span 2;height:100%;display:flex;flex-direction:column;border-radius:6px}
.tm-kultg .tm-cimg{flex:1;height:auto;min-height:0}
.tm-kultg .tm-cl{display:none}
.tm-kultg .tm-ct{font-size:17px}
.tm-kultg .tm-cb{padding:10px 12px 12px}
.tm-kultg .tm-mini{height:100%;display:flex;flex-direction:column;border-radius:6px}
.tm-kultg .tm-mimg{flex:1;height:auto;min-height:0}
.tm-kultg .tm-mb{padding:8px 10px 10px}
/* warianty .tm-oc z warstwy B1 */
.tm-kultg .tm-oc{height:100%;aspect-ratio:auto;min-height:0}
.tm-kultg .tm-oc-c{grid-column:span 2}
.tm-kultg .tm-oc-c .tm-oct{font-size:19px}
/* kolumna kalendarza: biały box z kreską w kolorze sekcji, wysokość całej siatki obok */
.tm-kal .tm-top5{height:100%;background:#fff;box-shadow:none;border-radius:0;
 border-top:3px solid var(--ac,var(--brand));padding:4px 15px 6px}
.tm-kal .tm-t5{align-items:baseline;padding-left:14px;position:relative;border-bottom:1px solid var(--hair)}
.tm-kal .tm-t5:last-child{border-bottom:0}
/* bez numeracji - kreska w kolorze sekcji jak w notkach Biznesu (.tm-noty), numer nie niósł żadnej realnej rangi w kilkuelementowej sekcji tematycznej */
.tm-kal .tm-t5 b{display:none}
.tm-kal .tm-t5::before{content:"";position:absolute;left:0;top:19px;width:6px;height:2px;background:var(--ac,var(--brand))}
.tm-kal .tm-t5 span{font-size:13.5px}
/* --- MOTO / TECH: gęsta siatka 4 kolumn (kolumna treści, obok sidebar z reklamą) --- */
/* Sekcja wróciła do .tm-cols, więc siatka liczy się z 964px, nie z 1288px:
   964px / 4 kolumny (gap 9) = ~234px na kafel; karta 2x2 = ~477x381px - to wymaga
   derywatu g w NT3karta (warstwa B, punkt B3).
   SZEŚCIU kolumn tu NIE przywracać: przy 964px kafel schodzi do ~153px i tytuł
   przestaje być czytelny (raz już naprawiane - commit 8a1db19). */
.tm-dense{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:186px;gap:9px}
.tm-dense>*{min-width:0;min-height:0}
.tm-dense .tm-card{grid-column:span 2;grid-row:span 2;height:100%;display:flex;flex-direction:column;border-radius:6px}
.tm-dense .tm-cimg{flex:1;height:auto;min-height:0}
.tm-dense .tm-ct{font-size:20px}
.tm-dense .tm-cb{padding:11px 13px 13px}
.tm-dense .tm-mini{height:100%;display:flex;flex-direction:column;border-radius:6px}
.tm-dense .tm-mimg{flex:1;height:auto;min-height:0}
.tm-dense .tm-mb{padding:8px 10px 10px}
.tm-dense .tm-mt{font-size:13px}
/* warianty .tm-oc z warstwy B1 */
.tm-dense .tm-oc{height:100%;aspect-ratio:auto;min-height:0}
.tm-dense .tm-oc-c{grid-column:span 2;grid-row:span 2}
.tm-dense .tm-oc-c .tm-oct{font-size:21px}
/* dwie kolumny zapowiedzi tekstowych pod siatką */
.tm-two{margin-top:14px}
.tm-two .tm-top5{display:grid;grid-template-columns:1fr 1fr;gap:0 26px;
 background:none;box-shadow:none;border-radius:0;padding:0}
.tm-two .tm-t5{flex:none;padding:8px 0 8px 14px;position:relative;border-bottom:1px solid var(--hair)}
/* bez numeracji - kreska w kolorze sekcji jak w notkach Biznesu (.tm-noty), numer nie niósł żadnej realnej rangi w kilkuelementowej sekcji tematycznej */
.tm-two .tm-t5 b{display:none}
.tm-two .tm-t5::before{content:"";position:absolute;left:0;top:16px;width:6px;height:2px;background:var(--ac,var(--brand))}
.tm-two .tm-t5 span{font-size:14px}

/* --- TURYSTYKA: karta wiodąca + wyróżnione zdjęcie w kolumnie 380px --- */
/* Sekcja stoi w kolumnie treści (964px): karta ~570px + zdjęcie 380px. Derywat m
   (420px szerokości) skaluje się w DÓŁ (0,90) zamiast w górę jak przy 440px. */
.tm-tur{display:grid;grid-template-columns:1fr 380px;grid-auto-rows:264px;gap:14px;margin-bottom:14px}
.tm-tur>*{min-width:0;min-height:0}
.tm-tur .tm-card{height:100%;display:flex;flex-direction:column;border-radius:6px}
.tm-tur .tm-cimg{flex:1;height:auto;min-height:0}
.tm-tur .tm-hbig{height:100%;border-radius:6px}
/* wariant .tm-oc z warstwy B1 */
.tm-tur .tm-oc{height:100%;aspect-ratio:auto;min-height:0}

/* --- EDUKACJA: zwarty blok 8 kafli 4 x 2 (kolumna tresci, 964px) ---
   Osiem kafli w jednym rzedzie dawaloby przy 964px ~112px na kafel, wiec blok ma cztery
   kolumny (~230px) w dwoch rzedach i ciasniejszy odstep niz lekki rzad .tm-minis (Zdrowie);
   proporcja kadru 16:10 (nizej w pliku) domyka to rozroznienie.
   Reguly .tm-mimg/.tm-mb/.tm-mt usuniete jako martwe (siatka renderuje .tm-oc-m).
   Strojenie tytulu MUSI miec trzy klasy: .tm-oc-m .tm-oct nizej w pliku ma te sama
   specyficznosc (0,2,0) i wygrywalo kolejnoscia - patrz sekcja "gesta siatka". */
.tm-minis8{grid-template-columns:repeat(4,1fr);gap:10px}

/* --- RWD warstwy C1 (punkty jak w makiecie V1; dolny zgodny z .tm-cols = 880px) --- */
@media(max-width:1200px){
 /* wąska lista "Najnowsze" schodzi pod hero i kafle */
 .tm-dnia{grid-template-columns:1.5fr 1fr;grid-template-rows:var(--tm-dnia-h) auto;grid-auto-rows:auto;--tm-dnia-h:380px}
 .tm-dnia .tm-latest{grid-area:2/1/3/3;border-left:0;border-top:1px solid var(--line);padding:10px 0 0}
 .tm-dnia .tm-latest .tm-li{flex:none}
 .tm-minis6{grid-template-columns:repeat(4,1fr)}
 /* .tm-dense i .tm-minis8 maja juz 4 kolumny w regule bazowej (sekcje wrocily do kolumny tresci) */
 .tm-strip,.tm-eqstrip{grid-template-columns:repeat(4,1fr)}
 .tm-kultg{grid-template-columns:repeat(3,1fr)}
 .tm-tur{grid-template-columns:1fr 300px}
}
@media(max-width:880px){
 /* jedna kolumna: kafle wracają do stałych wysokości zdjęć (flex:1 nie ma czego wypełniać) */
 .tm-dnia{grid-template-columns:1fr;grid-template-rows:initial;grid-auto-rows:auto}
 .tm-dnia .tm-hbig{grid-area:auto;height:200px}
 .tm-dniamid{grid-area:auto;grid-template-rows:auto auto}
 .tm-dniamid .tm-mimg{flex:none;height:96px}
 .tm-dniamid .tm-oc{height:auto;aspect-ratio:3/2}
 .tm-dnia .tm-latest{grid-area:auto;border-top:0;padding:0}
 .tm-minis6,.tm-minis8{grid-template-columns:repeat(2,1fr)}
 .tm-strip,.tm-eqstrip,.tm-dense{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px}
 .tm-dense .tm-card,.tm-dense .tm-oc-c{grid-row:span 2}
 .tm-mozaika{grid-template-columns:1fr}
 .tm-mgrid{grid-template-columns:1fr 1fr;grid-template-rows:initial;grid-auto-rows:180px}
 .tm-mgrid .tm-card,.tm-mgrid .tm-oc-c{grid-column:span 2}
 .tm-kult{grid-template-columns:1fr}
 .tm-tur{grid-template-columns:1fr;grid-auto-rows:230px}
 .tm-noty .tm-top5,.tm-tlist .tm-top5,.tm-two .tm-top5{grid-template-columns:1fr}
}

/* ===== KAFELEK SPONSORA W SIATCE .tm-minis (GoWork - BOK #315656) ===== */
/* .tm-madv - wariant .tm-mini z kreacją banerową zamiast miniatury artykułu.
   Blok stoi na końcu pliku i tak ma zostać: z innymi regułami o dwóch klasach dzieli
   specyficzność (0,2,0), więc o pierwszeństwie decyduje wyłącznie kolejność w pliku.
   Nad .tm-mimg (~140) i .tm-cimg,.tm-mimg,.tm-lth img (~410) wygrywa już samą
   specyficznością, niezależnie od pozycji.

   Dlaczego kafelek zajmuje 2 kolumny (grid-column:span 2):
   komórka .tm-minis jest zaprojektowana pod miniaturę artykułu (~230px w HD), a kreacja
   ma natywne 400x209. W jednej komórce baner schodził do 58% szerokości natywnej w HD
   i do 31% przy oknie 900px - logo i CTA stawały się nieczytelne. Stary theme/1 trzymał
   podłogę 300px (klasa .min300). Na 2 kolumnach komórka ma ~475px w HD, więc baner
   mieści się w natywnych 400x209 (max-width niżej), a na telefonie dostaje ~358px (~90%).

   Dlaczego własna proporcja zamiast height:96px z .tm-mimg: przy sztywnych 96px baner
   byłby kadrowany przez object-fit:cover (~410) - w HD o ~20% wysokości, poniżej 880px
   o ~56%. Kreacja o innym formacie: nadpisz --tm-adv-ar.

   Chip "Reklama" stonowany względem koloru sekcji, ale przez --txt-2 (5.39:1 na bieli),
   NIE --txt-3 (3.09:1) - etykieta ujawniająca treść płatną ma 10px i musi spełniać WCAG AA.

   Dlaczego kafelek zajmuje też 2 WIERSZE (grid-row:span 2):
   po warstwie B kafle artykułów to .tm-oc-m z aspect-ratio:3/2, czyli wiersz siatki ma
   wysokość WYNIKAJĄCĄ Z SZEROKOŚCI KOMÓRKI (230,5 px w HD -> 153,7 px), a kafelek sponsora
   ma wysokość z treści (baner 400x209 + belka tekstu ~52 px + ramki = ~263 px).
   Wiersz siatki jest sizowany do najwyższego elementu, więc reklama na 1 wierszu robiła
   wiersz 1. na ~263 px, a wiersz 2. zostawał na 153,7 px - stąd rozjazd rzędu.
   Policzone warianty (HD: komórka 230,5 px, gap 14 px, kolumna główna 964 px):
   - align-items:start -> kafle przestają się rozciągać (153,7 px), ale WIERSZ dalej ma
     263 px, więc pod pierwszym rzędem kafli zostaje ~110 px dziury. Odpada.
   - grid-auto-rows:1fr -> wiersze wyrównane, ale OBA do 263 px, czyli kafel 230x263
     (proporcja ~0,88). Derywat "s" ma 230x153, więc object-fit:cover skalowałby go
     w górę o 72% i obcinał ~42% szerokości kadru. Odpada.
   - grid-row:span 2 -> kafelek dostaje 2*153,7+14 = 321,4 px na swoje ~263 px treści
     (zapas 58 px, rozłożony po równo przez justify-content:center), a WIERSZE zostają
     na 153,7 px liczonych z proporcji kafli artykułów: rząd równy, kreacja w natywnych
     400x209. Wkład wysokości reklamy rozkłada się na 2 wiersze ((263-14)/2 = 124,5 px)
     i jest mniejszy niż 153,7 px, więc nie podbija wierszy. To wybrane wyjście.
   Rachunek komórek: kafelek zajmuje 2x2 = 4 komórki, więc do dwóch pełnych rzędów
   po 4 kolumny potrzeba 8 artykułów (8+4 = 12 = 3 wiersze) - patrz ilosc="8" w
   indexMiasta.tpl.
   Zmierzone (Chrome, kolumna główna = szerokość okna - 324 px sidebara i paddingów):
   okno 1400 px -> kafel 153,7 px, wiersze 154/153 px (równo), baner 400x209;
   okno 1200 px -> kafel 133,7, wiersze 134/133 (równo);
   okno 1000 px -> kafel 100,3, wiersze 115/116, czyli wiersze 1-2 są o ~15 px wyższe
   od wiersza 3. Poniżej ~1150 px belka tekstu kafelka (stała ~52 px, niezależna od
   szerokości) nie mieści się już w budżecie 2 wierszy. Świadomie NIE domykamy tej reszty
   przez zmniejszanie kreacji: zeszłaby poniżej podłogi 300 px z theme/1 (czytelność logo
   i CTA to przedmiot umowy), a 15 px na tle gap 14 px jest wizualnie nieodróżnialne
   od 110 px dziury, którą zostawiał wariant sprzed poprawki. */
.tm-madv{--ac:var(--txt-2);grid-column:span 2;grid-row:span 2;display:flex;flex-direction:column;justify-content:center}
/* max-width trzyma kreację w natywnych 400px (nie rozciągamy jej w górę), margin auto
   centruje ją w szerszej komórce; brak max-height - wysokość wynika z proporcji */
.tm-madv .tm-mimg{height:auto;aspect-ratio:var(--tm-adv-ar,400/209);max-width:400px;margin:0 auto;background:#fff}
/* contain - cała kreacja widoczna; białe tło zastępuje ciemny gradient-placeholder (~409),
   więc letterbox przy skrajnych szerokościach zlewa się z kartą */
.tm-madv .tm-mimg img{width:100%;height:100%;object-fit:contain;object-position:center}
/* tekst sponsora stonowany - kafelek nie udaje nagłówka redakcyjnego; wyróżniony sam anchor */
.tm-madv .tm-mt{color:var(--txt-2);font-weight:400}
.tm-madv .tm-mt a{color:var(--brand);font-weight:600}
/* dense tylko w siatce z reklamą: kafelek na 2 kolumnach nie mieści się obok pierwszego
   artykułu w układzie 2-kolumnowym i zostawiłby dziurę - dense wpuszcza w nią kolejny
   artykuł, a reklama dostaje pełny rząd. W układzie 4-kolumnowym bez efektu (brak dziur). */
.tm-minis-adv{grid-auto-flow:dense}
/* poniżej 880 px siatka ma 2 kolumny, więc kafelek zajmuje CAŁĄ szerokość rzędu i nie dzieli
   wiersza z żadnym kaflem artykułu - span 2 wierszy nie ma tam czego wyrównywać, a tylko
   rozciągałby reklamę na dwa puste wiersze. Wracamy do wysokości z treści. */
@media(max-width:880px){.tm-madv{grid-row:auto}}

/* ===== WIZYTÓWKA MIASTA W SIDEBARZE (TMmiastoInfo) ===== */
.tm-mwi{font-size:14px}
.tm-mwrow{display:flex;justify-content:space-between;align-items:baseline;padding:5px 0;border-bottom:1px solid var(--line)}
/* :last-of-type dopasowuje po znaczniku (div), a ostatnim div w .tm-mwi jest zawsze
   stopka .tm-mwf, nigdy .tm-mwrow - dlatego celujemy w przedostatnie dziecko rodzica,
   które przy dowolnej liczbie opcjonalnych wierszy (płeć/województwo) zawsze wypada
   na ostatnim .tm-mwrow tuż przed stopką */
.tm-mwi .tm-mwrow:nth-last-child(2){border-bottom:0}
.tm-mwl{color:var(--txt-2)}
.tm-mwv{font-weight:600;text-align:right}
/* stopka: drobny podpis źródła + wyraźny przycisk CTA do pełnych statystyk na samym dole */
.tm-mwf{margin-top:11px;display:flex;flex-direction:column;gap:9px}
.tm-mwsrc{font-size:12px;color:var(--txt-3)}
.tm-mwbtn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:linear-gradient(180deg,#e04b56,var(--brand));color:#fff;font-weight:600;font-size:13px;padding:10px 14px;border-radius:8px;box-shadow:0 6px 16px -8px rgba(212,62,73,.55);transition:background .2s}
.tm-mwbtn:hover{background:var(--brand-h)}
.tm-mwbtn span{transition:transform .2s}
.tm-mwbtn:hover span{transform:translateX(3px)}
/* poziomy pasek "miasto w liczbach" - wariant do głównej kolumny (między sekcjami) */
.tm-mbar{background:#fff;border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:8px;box-shadow:var(--card-sh);padding:14px 18px;margin:26px 0}
.tm-mbar-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.tm-mbar-tit{display:flex;align-items:center;gap:9px;font:600 13.5px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--dark)}
.tm-mbar-tit::before{content:"";width:8px;height:8px;background:var(--brand)}
.tm-mbar-src{font-size:12px;color:var(--txt-3);white-space:nowrap}
.tm-mbar-body{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.tm-mbar-stats{display:flex;flex-wrap:wrap;gap:12px 34px;flex:1 1 auto}
.tm-mbar-stat{display:flex;flex-direction:column;gap:2px;min-width:84px}
.tm-mbar-v{font-weight:700;font-size:22px;line-height:1.1;color:var(--dark)}
.tm-mbar-vt{font-size:16px;font-weight:600}
.tm-mbar-l{font-size:12px;color:var(--txt-2)}
.tm-mbar-cta{flex:none;display:inline-flex;align-items:center;gap:8px;background:linear-gradient(180deg,#e04b56,var(--brand));color:#fff;font-weight:600;font-size:13px;padding:10px 16px;border-radius:8px;box-shadow:0 6px 16px -8px rgba(212,62,73,.55);transition:background .2s}
.tm-mbar-cta:hover{background:var(--brand-h)}
.tm-mbar-cta span{transition:transform .2s}
.tm-mbar-cta:hover span{transform:translateX(3px)}
@media(max-width:560px){.tm-mbar-body{gap:12px}.tm-mbar-cta{width:100%;justify-content:center}}
/* "miasto w liczbach" w sidebarze (od 2026-10-07): wygląd boxu .tm-w (bez akcentu z lewej, odstęp
   daje gap kolumny), liczby w siatce 2x2, podpis GUS pod tytułem, przycisk na całą szerokość */
.tm-side .tm-mbar{margin:0;padding:14px 16px;border-left:1px solid var(--line)}
.tm-side .tm-mbar-head{margin-bottom:12px}
.tm-side .tm-mbar-body{flex-direction:column;align-items:stretch;gap:14px}
.tm-side .tm-mbar-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.tm-side .tm-mbar-stat{min-width:0}
.tm-side .tm-mbar-v{font-size:19px}
.tm-side .tm-mbar-vt{font-size:15px}
.tm-side .tm-mbar-cta{justify-content:center}
/* ujemny przyrost naturalny w kolorze marki; wydatki na mieszkańca w sidebarze na całą szerokość siatki */
.tm-mbar-minus{color:var(--brand-h)}
.tm-side .tm-mbar-szer{grid-column:1/-1}
/* belka "Msze dziś" (NT3wiaraBelka, 2026-10-05) pod paskiem "Miasto w liczbach" - ta sama karta co
   .tm-mbar, akcent w kolorze lokalnym; zastąpiła wiersz Mszy w karcie "Dziś w mieście" */
.tm-wibar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--loc);border-radius:8px;box-shadow:var(--card-sh);padding:13px 18px;margin:26px 0}
.tm-wibar-tit{flex:none;display:flex;align-items:center;gap:9px;margin:0;font:600 13.5px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--dark)}
.tm-wibar-tit::before{content:"";width:8px;height:8px;background:var(--loc)}
/* tytuł i link w pierwszym rzędzie (jak nagłówek .tm-mbar), godziny w drugim - kolejność przez order */
.tm-wibar-l{order:3;flex:1 1 100%;display:flex;flex-wrap:wrap;gap:6px 22px;min-width:0;margin:0;padding:0;list-style:none;font-size:14px}
.tm-wibar-l b{margin-right:5px;color:var(--loc);font-variant-numeric:tabular-nums}
.tm-wibar-l a{color:var(--txt)}
.tm-wibar-l a:hover{color:var(--brand)}
.tm-wibar-all{order:2;margin-left:auto;font:600 12px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--loc);white-space:nowrap}
.tm-wibar-all:hover{color:var(--brand)}
@media(max-width:560px){.tm-wibar{flex-direction:column;align-items:flex-start}.tm-wibar-l{flex-direction:column;flex-basis:auto}.tm-wibar-all{order:4;margin-left:0}}

/* ===== KAFEL Z TYTULEM NA ZDJECIU (.tm-oc) - warstwa B1 =====
   Uogolnienie mechanizmu .tm-hbig (sekcja "STRONA GLOWNA" wyzej): zdjecie jest position:absolute
   pod przyciemnieniem, wiec wysokosc kafla wyznacza WYLACZNIE siatka albo aspect-ratio - nigdy
   intrynsyczna wysokosc zdjecia. Dzieki temu jeden szablon (NT3karta / NT3mini) dziala w kazdym
   rozmiarze pola: karta wiodaca 575px, mini-kafel 230px, kiosk Faktow.
   Klasy .tm-card/.tm-ct oraz .tm-mini/.tm-mimg/.tm-mb ZOSTAJA w pliku, bo sa uzywane w
   markupie (.tm-mini* przez kafelek GoWork). Sama .tm-cimg od 2026-09-07 nie ma juz zadnego
   uzycia: strona artykulu (tpl/artykuly.tpl) przestala ja doklejac do .tm-art-rci, bo razem
   z przycinaniem brala stamtad height:250px - patrz komentarz przy .tm-cimg. */
.tm-oc{position:relative;display:block;overflow:hidden;min-width:0;min-height:0;border-radius:8px;background:#0d0f13;isolation:isolate}
.tm-oc>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .45s ease}
.tm-oc:hover>img{transform:scale(1.035)}
/* przyciemnienie z tokenu --ov (warstwa A) - bialy tekst ma powyzej AA nawet na jasnym zdjeciu */
.tm-oc::after{content:"";position:absolute;inset:0;z-index:1;background:var(--ov)}
.tm-ocb{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:14px 16px 13px;color:#fff}
/* tytul jest <h3> (w hero <h2>) - zdejmij margines i wage z arkusza przegladarki; przytnij do
   kilku wierszy, zeby dlugi tytul nie wypchnal chipu i daty poza kafel */
.tm-oct{margin:0;font-weight:600;color:#fff;text-wrap:balance;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.tm-oc:hover .tm-oct{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}
.tm-ocl{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-top:9px;font-size:14px;line-height:1.45;color:var(--oc-meta)}
.tm-ocm{display:block;margin-top:8px;font:500 11.5px/1 var(--f-lab);letter-spacing:.13em;text-transform:uppercase;color:var(--oc-meta)}
/* chip kategorii na zdjeciu - PRZYCIEMNIONY, nie rozjasniony. Poprzednie rgba(255,255,255,.18)
   dawalo biel na bieli: na jasnym kadrze chip mial 2,50:1, czyli gleboko ponizej AA i po prostu
   znikal. Ciemne tlo daje 7,74:1 w najgorszym punkcie i czyta sie jak plakietka prasowa. */
.tm-oc .tm-kat{background:rgba(6,8,12,.55);backdrop-filter:blur(2px);margin-bottom:8px}

/* ===== OCHRONA TEKSTU NA ZDJECIU =====
   Sam gradient nie wystarcza. Pomiar na 40 realnych zdjeciach z serwisu (najjasniejszy fragment
   pasa tekstu, nie srednia): najgorszy przypadek to 5,76:1, a 38% zdjec nie osiaga AAA. Formalnie
   AA przechodzi, ale nad jasnym niebem albo bialym murem tytul czyta sie zle.
   Obrys pod litera uniezaleznia kontrast od kadru: krawedz litery styka sie z obrysem, nie ze
   zdjeciem, wiec wynik jest staly - 12,80:1 przy kryciu .55 nawet na kadrze calkowicie bialym.
   paint-order:stroke fill maluje obrys POD wypelnieniem, wiec ksztalt liter zostaje nietkniety;
   samo -webkit-text-stroke rysuje obrys NA literach i wyzera je przy 14 px. Dlatego obrys wchodzi
   wylacznie w @supports, a cien jest warstwa bazowa dla przegladarek bez paint-order. */
.tm-oct,.tm-ocl,.tm-ocm,.tm-htit,.tm-hlead,.tm-hmeta{
	text-shadow:0 1px 2px rgba(6,8,12,.6),0 2px 10px rgba(6,8,12,.4)}
@supports (paint-order:stroke){
	.tm-oct,.tm-htit{paint-order:stroke fill;-webkit-text-stroke:3px rgba(6,8,12,.55);text-shadow:0 1px 3px rgba(6,8,12,.45)}
	.tm-ocl,.tm-ocm,.tm-hlead,.tm-hmeta{paint-order:stroke fill;-webkit-text-stroke:2px rgba(6,8,12,.5);text-shadow:none}
	/* kafel typograficzny ma pelne, kontrolowane tlo (--ac-dark) - obrys tylko brudzilby litery */
	.tm-nofoto .tm-oct,.tm-nofoto .tm-ocl,.tm-nofoto .tm-ocm,
	.tm-nofoto-h .tm-htit,.tm-nofoto-h .tm-hlead,.tm-nofoto-h .tm-hmeta{-webkit-text-stroke:0;text-shadow:none}
}
/* to samo dla kafla typograficznego w gałęzi bez paint-order */
.tm-nofoto .tm-oct,.tm-nofoto .tm-ocl,.tm-nofoto .tm-ocm,
.tm-nofoto-h .tm-htit,.tm-nofoto-h .tm-hlead,.tm-nofoto-h .tm-hmeta{text-shadow:none}
.tm-nofoto .tm-kat,.tm-nofoto-h .tm-kat{background:rgba(0,0,0,.28);backdrop-filter:none}
/* wariant: karta wiodaca sekcji (.tm-sgrid, kolumna 575px w HD) */
.tm-oc-c{aspect-ratio:16/9}
.tm-oc-c .tm-oct{font-size:23px;line-height:1.17;-webkit-line-clamp:3}
/* wariant: mini-kafel w rzedzie czterech (.tm-minis, komorka 230px w HD) */
.tm-oc-m{aspect-ratio:3/2}
.tm-oc-m .tm-ocb{padding:11px 12px 11px}
.tm-oc-m .tm-oct{font-size:14px;line-height:1.25;-webkit-line-clamp:3}
.tm-oc-m .tm-kat{font-size:9.5px;letter-spacing:.14em;padding:3px 6px;margin-bottom:6px}
/* Data publikacji w mini-kaflu dzialu "Fakty Polska" (szablon NT3miniFakty) - stoi tam,
   gdzie w pozostalych sekcjach chip .tm-kat, wiec bierze jego metryke: ten sam stopien,
   ta sama swiatlo i ten sam odstep do tytulu (.tm-oct ma margin:0, bez tego data by sie
   z nim skleila). Klasa .tm-ocm jest uzyta CELOWO zamiast nowej - tylko ona jest juz
   wpisana na wszystkie listy ochrony tekstu na zdjeciu nizej (cien, obrys w @supports
   i zerowanie obrysu na .tm-nofoto). Bazowa .tm-ocm daje kolor --oc-meta i wersaliki. */
.tm-oc-m .tm-ocm{font:600 9.5px/1 var(--f-lab);letter-spacing:.14em;margin:0 0 6px}
/* Strefy jednotematyczne (klasa .tm-nokat na sekcji): nazwa kategorii na kaflu (.tm-kat) oraz
   etykieta pozycji listy (.tm-sitem b) dubluja naglowek sekcji (h2 "Sport", "Strefa Biznesu",
   "Zdrowie i Rodzina"...), wiec w tych strefach je chowamy. Strefy mieszane (Fakty Polska,
   Na sygnale gdzie chip = nazwa miasta) NIE dostaja tej klasy - tam kategoria niesie realna
   informacje. Gospodarka na SG miasta zeszla z tej listy 2026-10-08 (9 kategorii, chip mowi, czy to Praca,
   Nieruchomosci czy Rolnictwo). Chowamy CSS-em, bo szablony kafli sa wspoldzielone ze strefami mieszanymi
   i z theme/1.
   Pas lokalny "Twoje miasto" stal na tej liscie do 2026-09-05 jako strefa mieszana z chipem.
   Dzis chipu nie ma w nim WCALE - zdjety z markupu w NT3ocMiasto.tpl, bo ten szablon nie jest
   z nikim wspoldzielony (pelne uzasadnienie w jego naglowku), wiec .tm-nokat jest tam zbedna. */
.tm-nokat .tm-kat,.tm-nokat .tm-sitem b{display:none}
/* kiosk Faktow - kafle nieco nizsze, zeby dwa pelne rzedy miescily sie wyzej na stronie */
.tm-kiosk .tm-oc-m{aspect-ratio:16/10}
/* UWAGA: .tm-oc-m .tm-oct wyzej ma specyficznosc 0,2,0, a lezy w pliku pozniej niz
   sekcje ukladow SG - strojenie tytulu per-siatka MUSI wiec miec trzy klasy
   (.tm-minis8 .tm-oc-m .tm-oct) albo stac ponizej tej linii. */
/* gesta siatka 8 kolumn (Edukacja): przeniesione z sekcji .tm-minis8, gdzie regula
   .tm-minis8 .tm-oct byla martwa - przegrywala kolejnoscia z .tm-oc-m .tm-oct */
.tm-minis8 .tm-oc-m{aspect-ratio:16/10}
.tm-minis8 .tm-oc-m .tm-oct{font-size:13.5px;line-height:1.24}
/* Gesta siatka: 6 kolumn (Fakty) i 8 kolumn (Edukacja) istnieja tylko powyzej 1200 px -
   nizej obie schodza do 4 i 2 kolumn, gdzie komorka ma 227 px i nic sie nie ucina.
   W komorce 147 px podpis .tm-ocb potrzebowal 99-101 px przy kaflu 92 px, czyli 108-110%
   jego wysokosci: gradient zjadal cale zdjecie, gorna krawedz podpisu byla przycieta,
   a tytul urywal sie w polowie zdania w 13 kaflach na 14. Kafel dostaje wiec proporcje
   4/3 (110 px zamiast 92) i wlasna typografie. Selektory MUSZA miec trzy klasy -
   .tm-oc-m .tm-oct wyzej ma te sama specyficznosc. */
@media(min-width:1201px){
 .tm-minis6 .tm-oc-m,.tm-minis8 .tm-oc-m{aspect-ratio:4/3}
 .tm-minis6 .tm-oc-m .tm-ocb,.tm-minis8 .tm-oc-m .tm-ocb{padding:7px 8px}
 .tm-minis6 .tm-oc-m .tm-kat,.tm-minis8 .tm-oc-m .tm-kat{font-size:8.5px;letter-spacing:.1em;padding:2px 5px;margin-bottom:3px}
 .tm-minis6 .tm-oc-m .tm-ocm,.tm-minis8 .tm-oc-m .tm-ocm{font-size:8.5px;letter-spacing:.1em;margin-bottom:3px}
 .tm-minis6 .tm-oc-m .tm-oct,.tm-minis8 .tm-oc-m .tm-oct{font-size:12px;line-height:1.18;-webkit-line-clamp:4}
 /* Kafel BEZ zdjecia w tym samym pasie. Bez tej linii wygrywa .tm-nofoto.tm-oc-m .tm-oct
    (0,3,0) z sekcji kafla typograficznego ponizej: ta sama specyficznosc co selektory
    powyzej, a lezy pozniej w pliku - media query specyficznosci nie podnosi. Tytul dostawal
    wtedy w komorce 149 px rozmiar liczony dla kafla 230 px i przelewal sie poza kadr.
    Cztery klasy w selektorze podnosza specyficznosc do (0,4,0) i domykaja komplet
    kompensacji tego bloku. */
 .tm-minis6 .tm-nofoto.tm-oc-m .tm-oct,.tm-minis8 .tm-nofoto.tm-oc-m .tm-oct{font-size:12px;line-height:1.18;-webkit-line-clamp:4}
}

/* ===== KAFEL TYPOGRAFICZNY (.tm-nofoto) - artykul bez zdjecia - warstwa B2 =====
   Modyfikator .tm-oc: te same warianty rozmiarowe (.tm-oc-c / .tm-oc-m) i ten sam blok tresci,
   inne tlo. Warunkiem w szablonach jest $art.width, NIE $art.foto - pole foto jest niepuste
   w 100% archiwum od 2024, wiec test po foto nigdy by tej galezi nie uruchomil.
   Kolor bierzemy z tokenow warstwy A: --ac-dark ustawia sekcja inline (warstwa C), lancuch
   fallbacku schodzi na --ac, a w ostatecznosci na --brand. Wartosci --ac-dark-* sa zmierzone
   pod bialy tekst z tekstura o budzecie --nofoto-tex (min. 4,50:1). */
.tm-nofoto{background:var(--ac-dark,var(--ac,var(--brand)))}
/* tekstura plus rozjasnienie w prawym gornym rogu - zastepuje zdjecie, kafel nie jest plaska plama.
   Krycie bieli obu warstw ograniczone tokenem --nofoto-tex - NIE podnosic bez pomiaru kontrastu */
.tm-nofoto::before{content:"";position:absolute;inset:0;z-index:1;background:repeating-linear-gradient(135deg,rgba(255,255,255,var(--nofoto-tex)) 0 2px,transparent 2px 9px),radial-gradient(120% 90% at 100% 0%,rgba(255,255,255,var(--nofoto-tex)),transparent 60%)}
/* ::after przejmuje role dekoracji (w .tm-oc jest gradientem) - inset z .tm-oc trzeba wyzerowac
   JAWNIE przez inset:auto, dopiero potem dzialaja top/right */
.tm-nofoto::after{content:"\201D";inset:auto;top:-46px;right:-10px;z-index:1;background:none;font:600 150px/1 var(--f-lab);color:rgba(255,255,255,.15);pointer-events:none}
.tm-nofoto .tm-oct{font-family:var(--f-lab);letter-spacing:.005em;text-transform:uppercase}
.tm-nofoto .tm-kat{background:rgba(0,0,0,.24)}
.tm-nofoto.tm-oc-c .tm-oct{font-size:30px;line-height:1.05;-webkit-line-clamp:5}
.tm-nofoto.tm-oc-m .tm-oct{font-size:17px;line-height:1.06;-webkit-line-clamp:5}
/* wyciszenie dekoracji dla malych pol: w komorce 230px cudzyslow 150px zjada caly kafel,
   a gesta tekstura zaczyna migotac - stad slabszy kontrast paska i mniejszy znak */
.tm-nofoto.tm-oc-m::before{background:repeating-linear-gradient(135deg,rgba(255,255,255,var(--nofoto-tex)) 0 2px,transparent 2px 9px)}
.tm-nofoto.tm-oc-m::after{font-size:92px;top:-26px;right:-6px;color:rgba(255,255,255,.11)}
/* dwa kafle w tym samym kolorze obok siebie czytaja sie jak blad renderowania - co drugi
   dostaje ciemniejszy odcien tego samego akcentu (kontrast z biela rosnie, wiec AA zachowane) */
.tm-minis>.tm-nofoto:nth-child(even){background-image:linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.18))}

/* wariant hero kafla typograficznego - .tm-hbig bez zdjecia (NT3najnowsze, NT3hero) */
.tm-hbig.tm-nofoto-h{background:var(--ac-dark,var(--ac,var(--brand)))}
/* kafel typograficzny nie ma zdjecia - przyciemnienie tylko zamazaloby kolor sekcji
   (dolna polowa kafla schodzilaby do rgba(13,15,19,.9), a wlasnie tam siedzi tytul);
   szablon renderuje <span class="tm-hshade"> bezwarunkowo, wiec gasimy go tutaj */
.tm-hbig.tm-nofoto-h .tm-hshade{display:none}
.tm-hbig.tm-nofoto-h::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,var(--nofoto-tex)) 0 2px,transparent 2px 9px),radial-gradient(120% 90% at 100% 0%,rgba(255,255,255,var(--nofoto-tex)),transparent 60%)}
.tm-hbig.tm-nofoto-h::after{content:"\201D";position:absolute;top:-34px;right:-14px;font:600 190px/1 var(--f-lab);color:rgba(255,255,255,.15);pointer-events:none}
.tm-hbig.tm-nofoto-h .tm-htit{font-family:var(--f-lab);text-transform:uppercase;letter-spacing:.005em;font-size:38px;line-height:1.03}
.tm-hbig.tm-nofoto-h .tm-kat{background:rgba(0,0,0,.24)}
.tm-hbig.tm-nofoto-h .tm-hlead,.tm-hbig.tm-nofoto-h .tm-hmeta{color:var(--oc-meta)}
/* wyroznione zdjecie sekcji (.tm-sgrid, kolumna 371px) - mniejsza skala tytulu i dekoracji */
.tm-sgrid .tm-hbig.tm-nofoto-h .tm-htit{font-size:26px}
.tm-sgrid .tm-hbig.tm-nofoto-h::after{font-size:130px;top:-22px}
/* miniatura wiersza "Najnowsze" dla artykulu bez zdjecia (NT3najnowsze) */
.tm-lth-nf{background:var(--ac-dark,var(--ac,var(--brand)))}
/* wiersz "Najnowsze": kolumna tekstu jest <div> (musi pomiescic <h3>), nie <span>.
   Klasa .tm-lbody, NIE .tm-lb - ta druga nalezy do overlaya lightboxa (linia ~601) i niesie
   display:none oraz position:fixed. Od 2026-09-05 do 2026-09-07 obie warstwy dzielily nazwe
   .tm-lb, wiec regula lightboxa gasila date i tytul we wszystkich 4 wierszach listy: w HTML
   byly, na ekranie nie. Nie da sie tego naprawic dopisaniem tu display - reszta deklaracji
   lightboxa (position:fixed, inset:0, z-index:200, ciemne tlo) zrobilaby z kazdego wiersza
   pelnoekranowa nakladke. Nazwy tych dwoch komponentow musza pozostac rozlaczne. */
.tm-lbody{min-width:0}
/* tytul pozycji skrotu wydarzen jako <h3> wewnatrz .tm-sitem (warstwa B4) */
.tm-sit{margin:0;font:inherit;color:inherit}

/* ===== WARSTWA B - RESPONSYWNOSC I RUCH ===== */
@media(max-width:880px){
 .tm-oc-c .tm-oct{font-size:18px;line-height:1.2}
 .tm-oc-m .tm-oct{font-size:13.5px}
 .tm-nofoto.tm-oc-c .tm-oct{font-size:22px}
 .tm-hbig.tm-nofoto-h .tm-htit,.tm-sgrid .tm-hbig.tm-nofoto-h .tm-htit{font-size:20px}
 .tm-hbig.tm-nofoto-h::after{font-size:110px;top:-18px}
}
@media (prefers-reduced-motion:reduce){
 .tm-oc>img{transition:none}
 .tm-oc:hover>img{transform:none}
}

/* ==========================================================================
   PAS LOKALNY "TWOJE MIASTO" (indexMiasta.tpl, wariant V3 "Lokalny-first")
   Pas pelnej szerokosci nad trescia krajowa. Stoi POZA .tm-in/.tm-cols, wiec tlo
   ciagnie sie od krawedzi do krawedzi okna. Swiadomie nie ma tu zadnego slotu
   reklamowego - kreacje IN0/IN1/B0/B1 sa robione pod biale tlo (spec par. 3).
   Moduly sa flexem, nie gridem: modul, ktory zniknal (miasto bez wydarzen,
   bez danych GUS), nie zostawia pustej kolumny - reszta rozklada sie sama.
   ========================================================================== */
.tm-loc{background:var(--loc-bg);border-bottom:1px solid var(--loc-line);padding-bottom:20px}
.tm-lochead{display:flex;align-items:center;flex-wrap:wrap;gap:13px;padding:16px 0 13px}
.tm-locbadge{flex:none;background:var(--brand);color:#fff;font:600 11px var(--f-lab);letter-spacing:.2em;text-transform:uppercase;padding:6px 10px}
.tm-loch1{margin:0;font:600 30px var(--f-lab);letter-spacing:.03em;text-transform:uppercase;color:var(--loc)}
.tm-loch1 em{font-style:normal;color:var(--dark)}
.tm-locline{flex:1;min-width:20px;height:2px;background:#d3e0ec}
.tm-locmore{flex:none;white-space:nowrap;font-size:13px;font-weight:600;color:var(--loc)}
.tm-locmore:hover{color:var(--brand)}
.tm-locmods{display:flex;flex-wrap:wrap;align-items:stretch;gap:12px;margin-bottom:14px}
.tm-locmod{flex:1 1 240px;min-width:0;background:#fff;border:1px solid var(--loc-line);border-radius:10px;padding:11px 13px}
/* modul wydarzen jest lista tytulow - dostaje dwa razy wiecej miejsca niz liczby */
.tm-locmod-ev{flex:2 1 330px}
.tm-locmh{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px;font:600 11.5px var(--f-lab);letter-spacing:.18em;text-transform:uppercase;color:var(--txt-3)}
.tm-locmh a{color:var(--loc);letter-spacing:.06em}
.tm-locmh a:hover{color:var(--brand)}

/* ==========================================================================
   BLOK "{MIASTO} DZISIAJ" (2026-09-30, docs/superpowers/specs/2026-09-30-gora-sg-miasta-design.md)
   Zastąpił pas .tm-loc na stronie głównej miasta (indexMiasta.tpl). Nowy korzeń .tm-dzien, więc
   reguły pasa (także mobilne order dla .tm-loc>.tm-in) go nie dotyczą; wspólne zostają tylko
   elementy nagłówka (.tm-lochead, .tm-locbadge, .tm-loch1, .tm-locline, .tm-locmore).
   Desktop: mozaika 1+4 (452 px) i karta "Dziś w mieście" 390 px tej samej wysokości.
   ========================================================================== */
.tm-dzien{background:var(--loc-bg);border-bottom:1px solid var(--loc-line);padding-bottom:22px}
.tm-dzien .tm-lochead{padding:12px 0 10px}
/* makieta: nazwa miasta w kolorze --loc, "dzisiaj" ciemne (w dawnym pasie odwrotnie) */
.tm-dzien .tm-loch1{color:var(--dark)}
.tm-dzien .tm-loch1 em{color:var(--loc)}
.tm-dz-grid{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:20px}
.tm-dz-bezkarty{grid-template-columns:minmax(0,1fr)}
/* mozaika: kafel wiodący na dwa rzędy + cztery mniejsze (ilosc="5" w indexMiasta.tpl - zmiana
   liczby wymaga zmiany siatki i odwrotnie) */
.tm-dz-news .tm-mozaika{display:grid;grid-template-columns:1.55fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:12px;height:452px}
.tm-dz-news .tm-mozaika>a{height:100%;min-height:0}
.tm-dz-news .tm-mozaika>a:first-child{grid-row:span 2}
.tm-dz-news .tm-mozaika .tm-oc-lead .tm-ocb{padding:20px 22px}
.tm-dz-news .tm-mozaika .tm-oc-lead .tm-oct{font-size:28px;line-height:1.18;-webkit-line-clamp:5}
.tm-dz-news .tm-mozaika .tm-oc-lead .tm-kat{background:var(--brand);backdrop-filter:none;margin-bottom:10px}
.tm-dz-news .tm-mozaika .tm-oc-s .tm-ocb{padding:12px 14px}
.tm-dz-news .tm-mozaika .tm-oc-s .tm-oct{font-size:15px;line-height:1.3;-webkit-line-clamp:3}
.tm-dz-news .tm-mozaika .tm-oc-s .tm-kat{font-size:10px;margin-bottom:7px}
/* karta (przebudowa 2026-10-05): strefa pogody .tm-dz-wx (blok z dużą temperaturą, kafle powietrza
   i wody), wiersze .tm-dz-r (komunikat RSO, sonda) i lista wydarzeń .tm-dz-ev, która bierze resztę
   wysokości - pozycje dzielą ją po równo, ale nie rosną ponad 56 px. Budżet przy 452 px: nagłówek 41,
   strefa pogody ok. 150, wiersz 56, nagłówek listy ok. 30 - pięć wydarzeń po ok. 44 px; z jednym
   wierszem (tm-dz-dod1) zostają cztery, z dwoma (tm-dz-dod2) dwa - reguły w @media(min-width:1001px) */
.tm-dz-karta{display:flex;flex-direction:column;height:452px;min-width:0;background:#fff;border:1px solid var(--loc-line);border-radius:10px;overflow:hidden}
.tm-dz-h{flex:none;margin:0;padding:13px 16px 10px;border-bottom:1px solid var(--line);font:600 13.5px var(--f-lab);letter-spacing:.14em;text-transform:uppercase;color:var(--dark)}
/* strefa pogody: blok na całą szerokość, pod nim kafle powietrza (70%, ocena i stężenia PM) i wody
   (30%, ikona wodowskazu, stan, pasek progów - 2026-10-07); jedyny kafel (brak powietrza, brak wody albo pogoda
   OWM) bierze całą szerokość */
.tm-dz-wx{flex:none;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,3fr);gap:9px 8px;padding:10px 16px 12px;border-bottom:1px solid var(--line)}
.tm-dz-wxm{grid-column:1/-1;display:grid;grid-template-columns:52px auto minmax(0,1fr);align-items:center;gap:10px;min-width:0;color:var(--txt)}
.tm-dz-wxm:hover .tm-dz-wxd b{color:var(--brand)}
.tm-dz-wxm:focus-visible,.tm-dz-tile:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.tm-dz-wxi{display:flex;align-items:center;justify-content:center;width:52px;height:52px;color:var(--loc)}
.tm-dz-wxi img{display:block;width:52px;height:52px}
.tm-dz-wxi svg{width:36px;height:36px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tm-dz-wxt{font:600 42px/1 var(--f-lab);letter-spacing:-.01em;color:var(--dark);white-space:nowrap}
.tm-dz-wxt sup{margin-left:2px;font-size:.4em;line-height:0;vertical-align:1.05em;color:var(--txt-2)}
.tm-dz-wxd{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:12.5px;line-height:1.35;color:var(--txt-2)}
/* padding/margin 2 px: zapas nad Ś/Ź/Ż przy overflow:hidden (jak w .tm-dz-v) */
.tm-dz-wxd>*{padding:2px 0;margin:-2px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-dz-wxd b{font-size:14.5px;font-weight:600;color:var(--txt);transition:color .15s}
.tm-dz-wxal{font-weight:600;color:var(--brand-h)}
.tm-dz-tile{display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;padding:6px 10px;background:var(--loc-bg);border:1px solid var(--loc-line);border-radius:8px;color:var(--txt);transition:border-color .15s}
.tm-dz-tile:hover{border-color:var(--loc)}
.tm-dz-tile:last-child:nth-child(2),.tm-dz-tile:only-child{grid-column:1/-1}
.tm-dz-tl{display:flex;align-items:center;gap:6px;min-width:0;font:600 11px/1.2 var(--f-lab);letter-spacing:.12em;text-transform:uppercase;color:var(--txt-2);white-space:nowrap;overflow:hidden}
.tm-dz-tl svg{flex:none;width:12px;height:12px;fill:none;stroke:var(--loc);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.tm-dz-aqdot{flex:none;width:9px;height:9px;border-radius:50%;box-shadow:0 0 0 2px #fff}
.tm-dz-tv{padding:2px 0;margin:-2px 0;font-size:15px;font-weight:700;line-height:1.25;color:var(--dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-dz-tv small{margin-left:6px;font-size:12px;font-weight:600;color:var(--txt-2)}
.tm-dz-tv small i{font-style:normal}
.tm-dz-ts{padding:2px 0;margin:-2px 0;font-size:11.5px;line-height:1.3;color:var(--txt-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* mały pasek wody: wypełnienie = stan, znacznik = stan ostrzegawczy (skala do alarmowego +10%,
   RzekiWidok::progi); przekroczony próg barwi kafel na bursztynowo, opis strefy pod paskiem */
.tm-dz-rzbar{position:relative;display:block;height:5px;margin:4px 0 1px;border-radius:3px;background:#d6dfe9}
.tm-dz-rzbar i{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:var(--loc)}
.tm-dz-rzbar b{position:absolute;top:-3px;bottom:-3px;width:2px;margin-left:-1px;background:#c98a00}
.tm-dz-rz-alert{background:#fdf3e1;border-color:#e8c97a}
.tm-dz-rz-alert .tm-dz-rzbar i{background:#c98a00}
.tm-dz-rz-alert .tm-dz-ts{font-weight:600;color:#7a5400}
/* woda w wąskim kafelku (30%): mała ikona wodowskazu (łata z podziałką nad dwiema falami) w białym
   kółku przy nazwie rzeki, pod nią stan i pasek; górna fala kołysze się powoli (bez ruchu przy
   prefers-reduced-motion) */
.tm-dz-rz{padding:6px 9px}
.tm-dz-rz .tm-dz-tl{letter-spacing:.08em}
.tm-dz-rzi{flex:none;display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--loc-line);color:var(--loc);overflow:hidden}
.tm-dz-tl .tm-dz-rzi svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.9}
/* rząd pod nazwą rzeki: pasek poziomu wobec progów i ikona trendu w kółku (rośnie bursztynowo,
   opada granatowo, bez zmian szaro; nazwa trendu w .tm-vh dla czytników) */
.tm-dz-rzrow{display:flex;align-items:center;gap:8px;min-width:0;margin-top:5px}
.tm-dz-rzrow .tm-dz-rzbar{flex:1;margin:0}
.tm-dz-rztr{flex:none;display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--loc-line);color:var(--txt-2)}
.tm-dz-rztr svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.tm-dz-rztr-rosnie{color:#b36b00;background:#fdf3e1;box-shadow:inset 0 0 0 1px #e8c97a}
.tm-dz-rztr-opada{color:var(--loc)}
.tm-dz-rz-alert .tm-dz-rzi{color:#c98a00;box-shadow:inset 0 0 0 1px #e8c97a}
@media(prefers-reduced-motion:no-preference){
 .tm-dz-rzw{animation:tmDzFala 3.2s ease-in-out infinite alternate}
 @keyframes tmDzFala{from{transform:translateX(-1.2px)}to{transform:translateX(1.2px)}}
}
/* wiersze karty (komunikat RSO, sonda): ikona w kółku, etykieta, wartość, podpis */
.tm-dz-lista{flex:none;list-style:none;margin:0;padding:0}
.tm-dz-r{height:56px;border-bottom:1px solid #eef0f4}
/* sonda pod listą wydarzeń: kreska nad wierszem; bez wydarzeń wiersz RSO nad nią ma już dolną */
.tm-dz-lista-k .tm-dz-r{border-bottom:0}
.tm-dz-ev+.tm-dz-lista-k .tm-dz-r{border-top:1px solid #eef0f4}
.tm-dz-a{display:grid;grid-template-columns:36px minmax(0,1fr) 14px;align-items:center;gap:12px;height:100%;padding:0 16px;color:var(--txt);transition:background .15s}
.tm-dz-a:hover{background:#f7fafd}
.tm-dz-a:hover .tm-dz-v{color:var(--brand)}
.tm-dz-a:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.tm-dz-ic{width:36px;height:36px;border-radius:50%;background:var(--loc-bg);display:flex;align-items:center;justify-content:center;color:var(--loc)}
.tm-dz-ic svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tm-dz-ic img{display:block;width:30px;height:30px}
.tm-dz-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.tm-dz-l{font:600 11px/1.2 var(--f-lab);letter-spacing:.14em;text-transform:uppercase;color:var(--txt-2)}
/* padding/margin 2 px: overflow:hidden z wielokropkiem ścina kreski nad Ś/Ź/Ż w pierwszym
   wierszu - zapas nad literą bez zmiany wysokości wiersza */
.tm-dz-v{padding:2px 0;margin:-2px 0;font-size:14px;font-weight:600;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-dz-s{padding:2px 0;margin:-2px 0;font-size:12.5px;line-height:1.35;color:var(--txt-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-dz-ch{width:14px;height:14px;fill:none;stroke:var(--txt-3);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.tm-dz-r-alert .tm-dz-ic{background:#fdecee;color:var(--brand)}
.tm-dz-r-alert .tm-dz-l{color:var(--brand-h)}
/* lista "Najbliższe wydarzenia" (NT3dzisWydarzenia): kafelek daty, nazwa, godzina i miejsce */
.tm-dz-ev{flex:1;min-height:0;display:flex;flex-direction:column;padding-bottom:4px}
.tm-dz-evh{flex:none;display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:10px 16px 4px}
.tm-dz-evt{margin:0;font:600 11px/1.2 var(--f-lab);letter-spacing:.14em;text-transform:uppercase;color:var(--txt-2)}
.tm-dz-evh a{font:600 11.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--loc);white-space:nowrap}
.tm-dz-evh a:hover{color:var(--brand)}
.tm-dz-evl{flex:1;min-height:0;display:flex;flex-direction:column;list-style:none;margin:0;padding:0}
.tm-dz-evl li{flex:1 1 0;min-height:0;max-height:56px}
.tm-dz-eva{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:11px;height:100%;padding:0 16px;color:var(--txt);transition:background .15s}
.tm-dz-eva:hover{background:#f7fafd}
.tm-dz-eva:hover .tm-dz-evn{color:var(--brand)}
.tm-dz-eva:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.tm-dz-evd{display:flex;flex-direction:column;align-items:center;justify-content:center;height:34px;border-radius:6px;background:var(--loc-bg);color:var(--loc);line-height:1.05;text-align:center}
.tm-dz-evd i{font:600 10.5px var(--f-lab);font-style:normal;letter-spacing:.08em;text-transform:uppercase}
.tm-dz-evd b{font:600 14px var(--f-lab)}
.tm-dz-evb{display:flex;flex-direction:column;gap:2px;min-width:0}
.tm-dz-evn{padding:2px 0;margin:-2px 0;font-size:13.5px;font-weight:600;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .15s}
.tm-dz-evm{padding:2px 0;margin:-2px 0;font-size:12px;line-height:1.3;color:var(--txt-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-dz-evm:empty{display:none}
@media(min-width:1001px){
 .tm-dz-dod1 .tm-dz-evl li:nth-child(n+5){display:none}
 .tm-dz-dod2 .tm-dz-evl li:nth-child(n+3){display:none}
}
/* rząd "Miasto na co dzień": pigułki usług (lista z tpl/inc/uslugi.tpl) */
.tm-uslrow{display:flex;align-items:center;gap:14px;margin-top:16px}
.tm-uslh{flex:none;font:600 12px var(--f-lab);letter-spacing:.18em;text-transform:uppercase;color:var(--loc)}
.tm-usllist{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.tm-usl{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 13px;background:#fff;border:1px solid var(--loc-line);border-radius:999px;font-size:13px;font-weight:600;color:var(--loc);white-space:nowrap;transition:border-color .15s,color .15s}
.tm-usl:hover{border-color:var(--brand);color:var(--brand)}
.tm-usl svg{flex:none;width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tm-dzien .tm-nek-sg{margin-top:14px}
/* poniżej 1000 px karta schodzi pod mozaikę (wiersze w dwóch kolumnach), mozaika zostaje 1+4
   na niższej siatce - pomiar przy 1000 px: układ jednokolumnowy dawał mozaikę 1148 px wysokości */
@media(max-width:1000px){
 .tm-dz-grid{grid-template-columns:minmax(0,1fr);gap:14px}
 .tm-dz-news .tm-mozaika{height:400px}
 .tm-dz-news .tm-mozaika .tm-oc-lead .tm-oct{font-size:22px}
 .tm-dz-karta{height:auto}
 /* karta na całą szerokość: blok pogody i oba kafle w jednym rzędzie */
 .tm-dz-wx{display:flex;align-items:stretch;gap:10px}
 .tm-dz-wxm{flex:1.7 1 0}
 .tm-dz-tile{flex:1 1 0}
 .tm-dz-aq{flex:1.75 1 0}
 .tm-dz-rz{flex:.75 1 0}
 .tm-dz-r{height:auto}
 .tm-dz-a{padding:11px 14px}
 .tm-dz-evl li{flex:none;max-height:none}
 .tm-dz-eva{padding:7px 14px}
}
@media(max-width:700px){
 .tm-dzien{padding-bottom:16px}
 .tm-dzien .tm-lochead{padding:10px 0 8px;gap:8px}
 .tm-dz-news .tm-mozaika{gap:8px}
 .tm-dz-news .tm-mozaika .tm-oc-lead .tm-ocb{padding:12px 14px}
 .tm-dz-news .tm-mozaika .tm-oc-lead .tm-oct{font-size:19px;-webkit-line-clamp:4}
 .tm-dz-news .tm-mozaika .tm-oc-s .tm-ocb{padding:8px 10px}
 .tm-dz-news .tm-mozaika .tm-oc-s .tm-oct{font-size:13.5px;line-height:1.25}
 .tm-dz-news .tm-mozaika .tm-oc-s .tm-kat{margin-bottom:5px;padding:4px 6px 3px;font-size:9px}
 .tm-dz-wx{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,3fr)}
 .tm-dz-wxm{grid-column:1/-1}
 /* usługi: jeden rząd przewijany w poziomie zamiast trzech-czterech rzędów pigułek */
 .tm-uslrow{flex-direction:column;align-items:stretch;gap:8px;margin-top:12px}
 .tm-usllist{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
}
@media(max-width:600px){
 .tm-dz-news .tm-mozaika{height:auto;grid-template-columns:1fr 1fr;grid-template-rows:none}
 .tm-dz-news .tm-mozaika>a{height:auto;width:100%;aspect-ratio:4/3}
 .tm-dz-news .tm-mozaika>a:first-child{grid-row:auto;grid-column:span 2;aspect-ratio:16/9}
}
/* telefon: kafel wody ma ok. 130 px treści - okno trendu ("/ 24 h") ustępuje strzałce z różnicą */
@media(max-width:420px){.tm-dz-tv small i{display:none}}

/* --- modul pogody (NT3meteoPas + fallback OWM NT3pogoda) --- */
.tm-wxp{display:flex;align-items:center;gap:11px}
.tm-wxp img{flex:none}
.tm-wxpt{flex:none;font:600 40px var(--f-lab);line-height:1;color:var(--dark)}
.tm-wxpt sup{font-size:19px;vertical-align:super;color:var(--txt-2)}
.tm-wxpd{min-width:0;font-size:12.5px;line-height:1.4;color:var(--txt-2)}
.tm-wxpd b{display:block;font-size:14px;color:var(--txt)}
a.tm-wxp:hover .tm-wxpd b{color:var(--brand)}
.tm-wxprow{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:9px;padding-top:8px;border-top:1px dashed var(--line);font-size:12.5px;color:var(--txt-2)}
.tm-wxprow b{color:var(--txt);font-weight:600}

/* --- jakosc powietrza WPLECIONA w modul pogody pasa (NT3meteoPas, 2026-07-23) ---
   kompaktowa linia-link na /powietrze pod mini-prognoza zamiast osobnego modulu
   .tm-locmod (zwolniony slot pasa zajmuje inny modul; podstrony /pogoda i /powietrze
   zostaja osobne - osobne odslony). Kolor indeksu niesie kropka (.tm-airpdot),
   etykieta slowna w --txt: jasne stany (zielony, zolty) mialy na bieli kontrast
   ponizej WCAG AA. Stare reguly osobnego modulu (.tm-airp/.tm-airpv/.tm-airpl/
   .tm-airpbar/.tm-airpm) usuniete razem z nim. */
.tm-airpdot{flex:none;width:10px;height:10px;border-radius:50%}
a.tm-wxpaq{display:flex;align-items:center;flex-wrap:wrap;gap:5px 8px;margin-top:9px;padding-top:8px;border-top:1px dashed var(--line);font-size:12.5px;color:var(--txt-2)}
.tm-wxpaq b{color:var(--txt);font-weight:600}
.tm-wxpaqm{color:var(--txt-3);font-size:12px}
.tm-wxpaqa{margin-left:auto;font:600 12px var(--f-lab);color:var(--loc);white-space:nowrap}
a.tm-wxpaq:hover .tm-wxpaqa{text-decoration:underline}

/* --- odznaki pogodowe + zalecenie dnia (MeteosourceTM::porady, NT3meteoPas, 2026-07-23) ---
   chipy: ikona SVG w kolorze odznaki + ciemny tekst na jasnym tincie tego koloru
   (tlo liczone server-side w porady() - bez zaleznosci od color-mix() w przegladarce);
   maks. 3 chipy, pod nimi jedno zalecenie z najwazniejszej odznaki.
   .tm-wxaccent = 3px pasek gradientu w kolorze biezacej temperatury (tempKolor)
   na gorze modulu pogody - subtelny akcent bez zmiany tla (decyzja D4). */
.tm-wxaccent{display:block;height:3px;border-radius:2px;margin-bottom:8px;opacity:.75}
.tm-wxbdgs{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}
.tm-wxbdg{display:inline-flex;align-items:center;gap:5px;padding:3px 9px 3px 7px;border-radius:20px;font:600 11.5px var(--f-lab);color:var(--txt);white-space:nowrap}
.tm-wxbdg i{display:flex}
.tm-wxadv{margin:7px 0 0;font-size:12.5px;line-height:1.4;color:var(--txt-2)}
.tm-wxadv:before{content:"\25B8";margin-right:5px;color:var(--loc)}

/* --- modul "Sonda dnia" w pasie (NT3sondaPas) + strona /sonda ---
   Odpowiedzi jako klikalne wiersze-pigulki: hover i stan zaznaczenia (CSS-only przez :has -
   progresywnie: bez wsparcia :has zostaje natywne radio + hover, nic sie nie psuje).
   Akcent --loc (granat pasa "Twoje miasto") spina sonde wizualnie z lokalna tozsamoscia.
   Formularz bez JS POSTuje na /sonda (strona bez cache ViewMain - tam zapis glosu, PRG,
   stan "juz glosowales"). Slupki wynikow wspolne: strona /sonda + archiwum. */
.tm-sondaq{margin:0 0 9px;font-size:13.5px;font-weight:600;line-height:1.35;color:var(--txt)}
.tm-sondaopts{display:flex;flex-direction:column;gap:6px}
.tm-sondao{display:flex;align-items:center;gap:9px;padding:8px 11px;border:1px solid var(--loc-line);border-radius:8px;background:#fff;font-size:12.5px;line-height:1.3;color:var(--txt);cursor:pointer;transition:border-color .15s,background .15s}
.tm-sondao input{accent-color:var(--loc);width:15px;height:15px;flex:none;margin:0;cursor:pointer}
.tm-sondao span{flex:1;min-width:0}
.tm-sondao:hover{border-color:var(--loc);background:var(--loc-bg)}
.tm-sondao:has(input:checked){border-color:var(--loc);background:var(--loc-bg);font-weight:600}
.tm-sondaf{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 10px;margin-top:11px}
.tm-sondab{padding:8px 20px;font:600 12.5px var(--f-lab);letter-spacing:.04em;color:#fff;background:var(--loc);border:0;border-radius:999px;cursor:pointer;transition:background .18s,transform .05s}
.tm-sondab:hover{background:#104063}
.tm-sondab:active{transform:translateY(1px)}
.tm-sondamore{font-size:11.5px;font-weight:600;color:var(--loc)}
.tm-sondamore:hover{text-decoration:underline}
/* strona /sonda: wieksze pytanie i odpowiedzi, wyniki, archiwum */
.tm-sondapg{margin:0 0 10px}
.tm-sondaqpg{font-size:18px;line-height:1.3;margin-bottom:12px}
.tm-sondaopg{font-size:14px;padding:11px 14px}
.tm-sondaskip{font-size:12.5px;font-weight:600;color:var(--loc)}
.tm-sondaskip:hover{text-decoration:underline}
.tm-sondaw{margin-top:6px}
.tm-sondar{margin:0 0 11px;transition:background .15s}
/* wiersz z odpowiedzia uzytkownika (".tm-sondamy" w srodku) dostaje delikatne tlo akcentu */
.tm-sondar:has(.tm-sondamy){background:var(--loc-bg);border-radius:8px;padding:9px 11px;margin:0 -11px 8px}
.tm-sondarl{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:13.5px;color:var(--txt)}
.tm-sondarl b{font:600 14px var(--f-lab);color:var(--loc);flex:none}
.tm-sondamy{font-style:normal;font-size:11px;font-weight:700;color:var(--loc);text-transform:uppercase;letter-spacing:.04em}
.tm-sondarb{height:9px;margin-top:4px;border-radius:5px;background:var(--band);overflow:hidden}
.tm-sondarb span{display:block;height:100%;min-width:4px;border-radius:5px;background:var(--loc)}
.tm-sondam{margin:4px 0 0;font-size:12.5px;color:var(--txt-2)}
.tm-sondam a{color:var(--loc);font-weight:600}
.tm-sondah2{font-size:21px;font-weight:700;letter-spacing:-.2px;margin:26px 0 12px;color:var(--dark)}
.tm-sondarch{padding:14px 0 4px;border-top:1px solid var(--line)}

/* --- modul najblizszych wydarzen (NT3eventsPas) --- */
.tm-evs{display:flex;flex-direction:column;gap:6px}
.tm-ev{display:flex;align-items:flex-start;gap:10px;padding-bottom:6px;border-bottom:1px dashed var(--line)}
.tm-ev:last-child{padding-bottom:0;border-bottom:0}
/* wydarzenia w pasie: 2 kolumny po 3 (razem ilosc=6). Modul jest szeroki (.tm-locmod-ev
   flex:2), wiec miesci dwie kolumny. Separacja gapem siatki zamiast dashed-kreski - kreska
   w dwoch kolumnach dawalaby nierowne linie miedzy wierszami. Mobile wraca do 1 kolumny. */
.tm-locmod-ev .tm-evs{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}
.tm-locmod-ev .tm-ev{padding-bottom:0;border-bottom:0}
.tm-evd{flex:none;width:44px;padding:4px 0;text-align:center;background:var(--loc);color:#fff;border-radius:6px}
.tm-evd b{display:block;font:600 17px var(--f-lab)}
.tm-evd i{font-style:normal;font:600 9.5px var(--f-lab);letter-spacing:.14em;text-transform:uppercase;opacity:.85}
.tm-evb{min-width:0}
.tm-evt{display:block;font-size:13.5px;font-weight:600;line-height:1.3;color:var(--txt)}
.tm-ev:hover .tm-evt{color:var(--loc)}
.tm-evm{display:block;margin-top:2px;font-size:12px;color:var(--txt-2)}

/* Modul "miasto w liczbach" (NT3miastoInfoBar) ZSZEDL z pasa lokalnego do glownej kolumny
   (2026-07-23, po sekcji Prawo), a 2026-10-07 do sidebara (override .tm-side .tm-mbar) - w kolumnie byl w pelnej, poziomej postaci .tm-mbar
   (styl full-width wyzej), wiec dawny override .tm-locmods .tm-mbar (kompaktowa karta pasa)
   zostal usuniety jako martwy. Zwolniony slot pasa dostaly dodatkowe wydarzenia. */

/* --- rzad lokalnych newsow: kafel wiodacy (2 rzedy) + 6 mniejszych (3 kolumny x 2 rzedy) ---
   Pas stoi POZA .tm-cols (szablon wstawia go wprost do .tm-loc>.tm-in), wiec tor to
   1320 - 2x16 = 1288 px, a NIE 964 px kolumny glownej - ten komentarz podawal wymiary
   kolumny glownej do 2026-09-05 i mylil kazdego, kto tu zagladal.
   Wymiary w HD po zmianie na 4 kolumny (gap 3x12 = 36): 1fr = (1288-36)/4,6 = 272,2 px
   => wiodacy 435,5x300 px, male 272,2x144 px. Przed zmiana (3 kolumny): 561,8 i 351,1 px.
   Wysokosc rzedu to (300-12)/2 = 144 px i NIE zalezy od liczby kolumn.
   Wiodacy bierze derywat g (950x496), male derywat m (623x325 - conf/art.php:8-13, liczba
   420 px z dawnego komentarza pochodzila z innego toru). Zaden nie jest skalowany w gore,
   a male po zwezeniu pokrywaja wreszcie DPR2 (623/276 = 2,26 px obrazu na px CSS; przy
   351 px kafla bylo 1,78, czyli niedomiar).
   Cena zwezenia: tytul ma 248 px zamiast 327 px, wiec clamp ucina 5,7% tytulow zamiast
   0,1% (pomiar w Chromium na 3491 tytulach z ostatnich 30 dni). Trzy wiersze tytulu maja
   104,8 px w kaflu 144 px, wiec podpis nadal miesci sie z zapasem.
   Wysokosc 300 px trzyma pas w ryzach: przy 1440x900 kafle startuja ok. 420 px od gory,
   wiec sa nad zgieciem (ryzyko 11 ze spec) - dlatego NIE podnosic.
   UWAGA: siatka wypelnia sie bez dziur WYLACZNIE przy 7 pozycjach (wiodacy na dwa rzedy
   + szesc malych = 8 komorek). Liczbe daje ilosc="7" w indexMiasta.tpl:69 - zmiana tam
   wymaga zmiany tutaj, i odwrotnie. */
.tm-locnews{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;grid-auto-rows:1fr;gap:12px;height:300px}
.tm-locnews>a{height:100%;min-height:0}
.tm-locnews>a:first-child{grid-row:span 2}
/* nazwa elementu wnetrza kafla jest ta z warstwy B1: .tm-oct (tytul); metryczki .tm-ocm
   ani chipu .tm-kat pas od 2026-09-05 nie renderuje - uzasadnienie w NT3ocMiasto.tpl */
.tm-oc-lead .tm-oct{font-size:22px;line-height:1.18;-webkit-line-clamp:3}
.tm-oc-s .tm-ocb{padding:11px 12px}
.tm-oc-s .tm-oct{font-size:14.5px;line-height:1.25;-webkit-line-clamp:3}
@media(max-width:1100px){
 .tm-locnews{height:auto;grid-template-columns:1fr 1fr}
 /* height:100% z reguly wyzej razem z aspect-ratio kazalo przegladarce liczyc
    SZEROKOSC z wysokosci wiersza - kafel wychodzil na 381 px w torze 343 px
    i robil poziomy scroll calego dokumentu. Wysokosc liczymy z szerokosci. */
 .tm-locnews>a{height:auto;width:100%}
 .tm-locnews>a:first-child{grid-row:auto;grid-column:span 2;aspect-ratio:16/9}
 .tm-locnews>a{aspect-ratio:16/10}
}
@media(max-width:560px){
 /* Siatka ZOSTAJE dwukolumnowa (regula z bloku 1100 px), a kafel wiodacy zostaje na calej
    szerokosci - do 2026-09-05 bylo tu przejscie na jedna kolumne i wiodacy tracil span.
    Powod zmiany: po dolozeniu dwoch kafli (5 -> 7) jedna kolumna dalaby przy 390x844 pas
    dlugi na 1459 px, czyli o 427 px wiecej niz przed zmiana. W dwoch kolumnach szesc
    malych kafli zajmuje trzy rzedy zamiast szesciu i pas jest KROTSZY niz byl przy pieciu
    kaflach - tresc krajowa wchodzi wyzej, a zaden artykul nie znika z DOM.
    Nad zgieciem nic sie przez to nie zmienia: siatka ma order:3 (blok 700 px nizej),
    wiec kafle i tak zaczynaja sie ponizej naglowka pasa i modulow danych. */
 .tm-loch1{font-size:22px}
}

/* --- PAS LOKALNY NA TELEFONIE (ponizej 700 px) ---------------------------
   Pas mial dawac sygnal lokalnosci, a na waskim ekranie zjadal caly pierwszy
   ekran: cztery moduly ustawialy sie jeden pod drugim (727 px), przez co
   pierwszy tytul artykulu wypadal na 1153 px, czyli 1,4 ekranu od gory -
   czytelnik z telefonu nie widzial ZADNEJ wiadomosci nad zgieciem.
   Nic nie znika: pogoda i powietrze schodza do jednego kompaktowego wiersza,
   wydarzenia do dwoch najblizszych pozycji (reszta pod linkiem "kalendarz"),
   a dane GUS do jednego przewijanego rzedu liczb. Na desktopie pas zostaje
   w pelnej postaci - to wybor wlasciciela produktu. */
@media(max-width:700px){
 /* --- KOLEJNOSC PASA NA TELEFONIE: kafle newsow przed wydarzeniami i GUS ---
    Pomiar przed zmiana, 390x844, slot reklamowy A pusty (czyli po zwinieciu
    rezerwacji przez slotRenderEnded z ads.tpl): naglowek serwisu konczy sie
    na 161 px, pas startuje na 190 px, jego wlasny naglowek zajmuje 69,5 px,
    a rzad modulow danych 380,9 px. Pierwszy kafel newsa wypadal dopiero na
    648 px, jego tytul na 763 px - nad zgieciem byl JEDEN tytul artykulu,
    a przy 375x667 ani jeden. Na /polska w tym samym viewporcie bylo ich piec,
    a strona miasta jest wazniejsza: to na nia trafia ruch lokalny z Google.

    .tm-locmods dostaje display:contents, wiec jego dzieci staja sie pozycjami
    tego samego flexa co .tm-lochead i .tm-locnews - i daja sie przestawic
    wlasnoscia order BEZ dotykania HTML. Kolejnosc na telefonie:
      1. naglowek pasa (badge "Twoje miasto" + h1 z nazwa miasta),
      2. pogoda i jakosc powietrza - dwie polowki jednego wiersza,
      3. kafle lokalnych newsow,
      4. najblizsze wydarzenia,
      5. miasto w liczbach.
    Zaden modul nie znika i zadna tresc nie chowa sie za gestem przewijania
    poziomego - wydarzenia i dane GUS schodza tylko nizej w tym samym pasie.
    Sygnal "to jest TWOJE miasto" zostaje nad zgieciem w calosci: h1 z nazwa
    miasta, temperatura i jakosc powietrza, czyli trzy rzeczy, ktorych
    czytelnik szuka na portalu miejskim od razu.
    Dlaczego pogoda i powietrze zostaja NAD kaflami, a nie schodza z reszta:
    zajmuja razem jeden wiersz 119 px i mieszcza sie w budzecie pierwszego
    ekranu, a jako jedyne moduly pasa niosa stan "tu i teraz".
    Powyzej 700 px pas zostaje w pelnej postaci - to wybor wlasciciela
    produktu (na desktopie 1440x900 pas ma 224,5 px i piec tytulow
    nad zgieciem, wiec nie ma czego naprawiac). */
 .tm-loc>.tm-in{display:flex;flex-wrap:wrap;align-items:stretch;gap:7px}
 .tm-locmods{display:contents}
 .tm-locnews{flex:1 1 100%;order:3}

 /* naglowek pasa: badge i tytul w jednym wierszu, link pod spodem */
 .tm-lochead{gap:8px;padding:9px 0 7px;flex:1 1 100%;order:1}
 .tm-locbadge{font-size:10px;padding:5px 8px}
 .tm-locmh{margin-bottom:5px;font-size:10.5px;letter-spacing:.1em}

 /* male moduly pasa (nie-wydarzenia): dwie polowki jednego paska zamiast dwoch kart
    (od 2026-07-23 to pogoda z powietrzem + kolejny modul pasa).
    Naglowki modulow nie moga sie lamac na dwa wiersze w torze 168 px,
    stad nowrap z wielokropkiem. */
 /* flex-grow:1 przy bazie 50% - miasto, ktore ma tylko jeden maly modul,
    dostaje caly wiersz, dokladnie jak przed zmiana kolejnosci */
 .tm-locmods>.tm-locmod:not(.tm-locmod-ev){flex:1 1 calc(50% - 4px);min-width:0;padding:7px 10px;order:2}
 .tm-locmods>.tm-locmod:not(.tm-locmod-ev) .tm-locmh{flex-wrap:nowrap;font-size:9.5px;letter-spacing:.06em}
 .tm-locmods>.tm-locmod:not(.tm-locmod-ev) .tm-locmh>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .tm-locmods>.tm-locmod:not(.tm-locmod-ev) .tm-locmh>a{flex:none;white-space:nowrap}
 /* opis pogody schodzi pod ikone i temperature - w torze 148 px obok nich
    lamalby sie na cztery wiersze */
 .tm-wxp{gap:6px;flex-wrap:wrap}
 .tm-wxp img{width:36px;height:36px}
 .tm-wxpt{font-size:26px}
 .tm-wxpt sup{font-size:12px}
 .tm-wxpd{flex:1 0 100%;font-size:11px;line-height:1.3}
 .tm-wxpd b{font-size:12px}
 /* mini-prognoza noc/jutro/opad zostaje na /pogoda - link jest w naglowku modulu */
 .tm-wxprow{display:none}
 /* linia powietrza w module pogody: zostaje kropka + stan (dane PM schodza na /powietrze,
    "szczegoly" tez - w waskim torze linia nie moze sie lamac na trzy wiersze).
    Selektor a.tm-wxpaq (nie .tm-wxpaq): regula bazowa to a.tm-wxpaq (specyficznosc 0,1,1),
    @media nie podnosi specyficznosci - golby .tm-wxpaq (0,1,0) przegralby i nie zadzialal */
 a.tm-wxpaq{font-size:11px;padding-top:6px;margin-top:6px}
 .tm-wxpaqm,.tm-wxpaqa{display:none}
 /* odznaki + zalecenie w polowce toru: mniejsze chipy, zalecenie zostaje (to
    najcenniejsza tresc modulu, a mobile nie ma tooltipow) */
 .tm-wxaccent{margin-bottom:6px}
 .tm-wxbdgs{gap:4px;margin-top:7px}
 .tm-wxbdg{font-size:10px;padding:2px 7px 2px 5px}
 .tm-wxadv{font-size:11px;margin-top:5px}
 /* sonda w polowce toru: mniejsze pytanie i odpowiedzi. Zawezone do .tm-locmod - bez tego
    mobilne reguly zbijalyby te same klasy .tm-sonda* na stronie /sonda (tam pytanie/odpowiedzi
    maja byc wieksze: .tm-sondaqpg/.tm-sondaopg) */
 .tm-locmod .tm-sondaq{font-size:12px}
 .tm-locmod .tm-sondao{font-size:11.5px;padding:6px 9px}
 .tm-locmod .tm-sondab{padding:6px 15px;font-size:11.5px}
 .tm-locmod .tm-sondamore{font-size:11px}

 /* wydarzenia: dwie najblizsze pozycje, reszta pod linkiem w naglowku modulu */
 .tm-locmod-ev{flex:1 1 100%;padding:7px 10px;order:4}
 /* mobile: siatka wydarzen wraca do 1 kolumny; pokazujemy 4 (reszta pod "kalendarz") */
 .tm-locmod-ev .tm-evs{grid-template-columns:1fr;gap:6px}
 .tm-ev:nth-child(n+5){display:none}
 .tm-evd{width:38px;padding:2px 0}
 .tm-evd b{font-size:15px}
 .tm-evt{font-size:12.5px}
 .tm-evm{font-size:11px}

 /* miasto w liczbach: jeden przewijany rzad liczb + waski przycisk */
 .tm-locmods .tm-mbar{flex:1 1 100%;padding:7px 10px;order:5}
 .tm-locmods .tm-mbar-head{margin-bottom:5px}
 .tm-locmods .tm-mbar-body{gap:7px}
 .tm-locmods .tm-mbar-stats{flex-wrap:nowrap;overflow-x:auto;gap:14px;padding-bottom:2px;-webkit-overflow-scrolling:touch}
 .tm-locmods .tm-mbar-stat{flex:none;min-width:0;white-space:nowrap}
 .tm-locmods .tm-mbar-v{font-size:15px}
 .tm-locmods .tm-mbar-vt{font-size:12.5px}
 .tm-locmods .tm-mbar-cta{padding:6px 12px;font-size:11.5px}

 /* kafel wiodacy: kadr 2/1 zamiast 16/9 - tytul wchodzi wyzej o ok. 20 px.
    Kafle dalsze: 16/9 zamiast 16/10 (w torze 358 px to 201 px zamiast 224 px).
    Bez tego tytul DRUGIEGO kafla konczyl sie na 841 px przy zgieciu 844 px,
    czyli miescil sie z zapasem 3 px - dosc, zeby wypasc poza ekran po dolozeniu
    jednej linii tytulu. Po zmianie tytul konczy sie na 796 px (zapas 48 px),
    a przy 360x800 drugi tytul w ogole wchodzi nad zgiecie. Kadr 16/9 jest juz
    uzywany dla kafli mobilnych w innej sekcji (.tm-gD), wiec nie
    wprowadza nowej proporcji - i nadal jest wezszy niz derywat 3/2, wiec
    zadne zdjecie nie jest skalowane w gore. */
 .tm-locnews>a:first-child{aspect-ratio:2/1}
 .tm-locnews>a{aspect-ratio:16/9}
}

/* Male kafle pasa na waskim ekranie: kadr kwadratowy zamiast 16/9.
   Ponizej 560 px szesc malych kafli stoi w DWOCH kolumnach (patrz komentarz przy
   .tm-locnews), wiec komorka ma 173 px zamiast 358 px - pomiar dla 390x844, tor 358 px.
   Kadr 16/9 dalby jej 97 px wysokosci, a sam podpis (chip kategorii, trzy wiersze tytulu
   i padding .tm-ocb) potrzebuje 104 px. Tekst wyszedlby poza kafel i zostalby przyciety
   OD GORY przez overflow:hidden z .tm-oc, czyli urwanym pierwszym wierszem tytulu.
   Dlaczego 1/1, a nie 4/3: przy 4/3 kafel ma 130 px, wiec podpis zajmuje 80% jego
   wysokosci i ze zdjecia zostaje pasek 26 px - kafel przestaje byc kaflem ze zdjeciem.
   Do tego grid-auto-rows:1fr zrownuje wiersze do 179 px (tyle ma kafel wiodacy w kadrze
   2/1 na calej szerokosci), wiec pod kazdym kaflem 4/3 zostawaloby 49 px pustego wiersza.
   Kadr 1/1 daje 173 px: podpis to 60% wysokosci, zdjecie jest widoczne, a wiersz jest
   wypelniony prawie dokladnie (179 px). Siatka NIE rosnie od tej zmiany, bo wysokosc
   wiersza i tak wyznacza kafel wiodacy.
   Blok MUSI stac PO @media(max-width:700px): obie reguly maja te sama specyficznosc
   (0,1,1), wiec o wyniku decyduje kolejnosc w pliku. Kafla wiodacego nie ruszamy -
   jego :first-child (0,2,1) wygrywa niezaleznie od kolejnosci i zostaje przy 2/1. */
@media(max-width:560px){
 .tm-locnews>a{aspect-ratio:1/1}
}

/* naglowek dostepny tylko dla czytnikow - awaryjny h1, gdy pas lokalny w calosci
   zniknie (miasto bez pogody, wydarzen, danych GUS i bez artykulow) */
.tm-vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ==========================================================================
   UKLADY SEKCJI STRONY MIASTA (indexMiasta.tpl, wariant V3)
   Kazda sekcja dostaje inny uklad przy NIEZMIENIONYCH wywolaniach widgetow -
   zmienia sie wylacznie rozlozenie wynikow w siatce (spec, warstwa C).
   Wymiary liczone dla kolumny glownej 964 px (kontener 1320 - 2x16 padding
   - 300 sidebar - 24 gap).
   UWAGA: po warstwie B1 szablony NT3karta/NT3mini renderuja kafle .tm-oc-c/.tm-oc-m
   (tytul na zdjeciu), a nie biale karty .tm-card/.tm-mini z .tm-mimg - selektory
   ponizej celuja wiec w klasy .tm-oc*. Kafel .tm-oc-m ma wlasne aspect-ratio 3/2,
   ktore w siatkach o narzuconej wysokosci trzeba wygasic (aspect-ratio:auto).
   ========================================================================== */

/* --- A. FAKTY POLSKA: "wydarzenia dnia" w wariancie miejskim (zmiana 2026-09-08) ---
   Uklad przeniesiony ze strony ogolnopolskiej: rzad .tm-dnia (hero + kolumna dwoch kafli
   .tm-dniamid + waska lista "Najnowsze") i pod nim szesciokolumnowy kiosk .tm-minis6.
   Cala geometria stoi juz w sekcji "FAKTY POLSKA: wydarzenia dnia" (od linii 1254) i NIE
   jest zawezona do indexPolska - tor tresci .tm-mainc ma 964 px na OBU stronach glownych
   (linie 99-103, zero nadpisan per strona), wiec nie ma czego przeliczac wszerz.
   Ponizej stoja wylacznie roznice wariantu miejskiego.

   Poprzedni uklad (.tm-gA: dwa kafle wiodace 2/3 + biala karta "Najnowsze" 1/3) usuniety
   razem z klasami .tm-gAm / .tm-lat / .tm-lath / .tm-latb - kazda z nich miala w calym
   repozytorium dokladnie jedno uzycie, w tej jednej sekcji.
   Szesciokolumnowy kiosk jest przy okazji jedyna siatka warstwy C1, ktorej strona miasta
   nie uzywa nigdzie indziej, wiec sekcja nie powtarza rytmu sasiadow (do 2026-10-05 nizej
   stal Region z .tm-rcols, tez czterokolumnowy pas tekstu - dlatego NIE przeniesiono tu
   "Skrotu wydarzen" ze strony ogolnopolskiej, ktory ma dokladnie taka siatke). */

/* Rzad 300 px zamiast 442 px. To nie kosmetyka, tylko warunek hierarchii strony miejskiej:
   przy 442 px hero bloku KRAJOWEGO mialby 409x442 = 181 tys. px2 i bylby najwiekszym
   zdjeciem strony, wiekszym od kafla wiodacego pasa lokalnego (.tm-locnews 1.6fr w torze
   1288 px = 435x300 = 130 tys. px2) - hierarchia "lokalne najpierw" by sie odwrocila.
   Przy 300 px hero ma 409x300 = 123 tys. px2, czyli o 6% mniej niz kafel miasta, i przy
   tej samej wysokosci rzedu, wiec oba pasy czytaja sie jako rownolegle. Cala sekcja ma
   wtedy 300 + 16 (margines kiosku) + 112 (kafel 149 px w kadrze 4/3) = 428 px wobec
   430 px poprzedniego ukladu, czyli slot reklamowy IN0 nie zjezdza.
   Skutek uboczny na tablecie: w oknie 881-1200 px rzad ma 300 px zamiast 380 px, ktore
   ustawia tam linia 1664 dla strony ogolnopolskiej - hero jest o 80 px nizszy.
   Dwie klasy, nie jedna: .tm-dnia{--tm-dnia-h} ma te sama specyficznosc (0,1,0), wiec
   o wyniku decydowalaby kolejnosc w pliku, a wartosc jest ustawiana powtornie w
   @media(max-width:1200px). Zapis (0,2,0) wygrywa niezaleznie od obu. */
.tm-dnia.tm-dnia-m{--tm-dnia-h:300px}

/* Zachowanie awaryjne przy niepelnej puli krajowej. Nie jest hipotetyczne: w maju-lipcu
   2026 bylo 19 dni z pieciona lub mniej publikacjami krajowymi w oknie (pomiar 2026-09-08
   po 180 dniach), a widget nie ma bramki progowej - oddaje tyle, ile znajdzie.
   1) Kiosk: auto-fit zwija puste sciezki, wiec cztery kafle zajmuja cala szerokosc pasa
      zamiast zostawiac dziure po prawej. Przy komplecie szesciu wynik jest identyczny jak
      repeat(6,1fr): (964 + 14) / (140 + 14) = 6 kolumn, kafel 149 px.
   2) Rzad wiodacy: gdy widget hero nie odda ani jednej pozycji, jego wrapper .tm-hero
      w ogole nie powstaje, a siatka trzykolumnowa zostawialaby dwie puste sciezki
      (409 px i 272 px) wokol samotnej kolumny kafli. Selektor :has zwija rzad do jednej
      kolumny o naturalnej wysokosci. Przegladarka bez :has po prostu ignoruje regule
      i dostaje stan sprzed tej poprawki, wiec to bezpieczne wzmocnienie, nie warunek
      dzialania ukladu. */
.tm-dnia-m:not(:has(.tm-hero)){grid-template-columns:1fr;--tm-dnia-h:auto}
/* Regula kiosku MUSI stac w oknie min-width:881px. Blok mobilny warstwy B ustawia
   .tm-minis6 na dwie kolumny selektorem (0,1,0), a .tm-minis6.tm-minis6-m ma (0,2,0)
   i lezy pozniej - bez okna przebijal telefon trzema kolumnami (zmierzone przy 500 px
   przed poprawka: 3 kolumny zamiast 2). Ta sama pulapka co przy typografii nizej. */
@media(min-width:881px){
 .tm-minis6.tm-minis6-m{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
}

/* Kiosk wariantu miejskiego: w oknie 881-1200 px TRZY kolumny zamiast czterech.
   Szesc kafli w siatce czterokolumnowej daje rzad 4+2, czyli dwie puste komorki na koncu
   (tak wyglada to na stronie ogolnopolskiej - pomiar w przegladarce przy 1100 px).
   Trzy kolumny to dwa pelne rzedy po trzy. Wlasna klasa .tm-minis6-m, a nie zmiana samej
   .tm-minis6, bo tamta jest wspoldzielona ze strona ogolnopolska, gdzie kiosk stoi w innym
   sasiedztwie i tej poprawki nie zamawiano.
   Dolna granica okna jest OBOWIAZKOWA: ponizej 881 px blok mobilny warstwy B ustawia
   .tm-minis6 na dwie kolumny selektorem (0,1,0), a .tm-minis6.tm-minis6-m ma (0,2,0)
   i bez ograniczenia okna przebilby telefon trzema kolumnami. */
@media(min-width:881px) and (max-width:1200px){
 .tm-minis6.tm-minis6-m{grid-template-columns:repeat(3,1fr)}
}

/* ===== RZAD 4 + 2: REDAKCJA + MATERIALY PROMOWANE (2026-09-10) =====
   Domyka sekcje "Fakty Polska" na stronie miasta. Do 2026-09-10 byl to rzad w calosci
   platny (szesc kafli, klasa .tm-promos, auto-fill); dzis jest DWUDZIELNY: cztery kafle
   redakcyjne po lewej (.tm-promog-l) i dwa platne po prawej (.tm-promog-r) z etykieta
   nad nimi. Rzad dziedziczy caly wyglad kafla po kiosku (.tm-minis .tm-kiosk .tm-minis6
   .tm-minis6-m na kontenerze zewnetrznym, szablon NT3miniKiosk) - reguly kafla sa
   selektorami POTOMKA, wiec dodatkowy poziom zagniezdzenia ich nie rusza. Wyjatek, o
   ktorym trzeba pamietac: .tm-minis>.tm-nofoto:nth-child(even) idzie kombinatorem
   DZIECKA, dlatego klasa .tm-minis stoi rowniez na obu podgrupach (naprzemienne tlo
   liczy sie wtedy osobno w kazdej z nich - to akceptowalne, a nawet czytelniejsze).

   1) SIATKA - JEDNA FORMULA NA WSZYSTKIE PASMA. Kafel ma byc co do piksela taki sam po
      obu stronach rzedu i taki sam jak w kiosku nad nim, a to daje sie zapisac jedna
      liczba. Przy szerokosci toru W i rynnie g=14: prawa kolumna = 2u+g, lewa = 4u+3g,
      razem W-g, wiec prawa = (W-2g)/3 = calc((100% - 28px)/3), a lewa bierze reszte
      (minmax(0,1fr) - zero jako minimum, zeby dlugi tytul nie rozpychal sciezki).
      Kafel wychodzi wtedy (W-5g)/6 po OBU stronach, czyli dokladnie tyle, ile daje
      repeat(6,1fr). Pomiar dla toru 964 px: prawa 312, lewa 638, kafel 149,0 px.
      Kolumny kontenera sa te same we wszystkich pasmach - zmieniaja sie tylko siatki
      wewnetrzne podgrup, wiec rownosc kafla trzyma sie sama:
        >=1201 px: lewa 4 kolumny, prawa 2 -> jeden wiersz kafli po (W-70)/6;
        881-1200: lewa 2x2, prawa 1x2 -> kafel (W-28)/3, czyli DOKLADNIE kafel kiosku
                  3-kolumnowego nad nim (272 px przy 1200, 166 px przy 881), a obie
                  podgrupy maja po dwa wiersze, wiec dolne krawedzie rownaja sie same;
        <=880:    podgrupy jedna pod druga, obie po 2 kolumny jak reszta warstwy mobilnej.
      W pasmie 1201-1319 px tor tresci schodzi z 964 px do ok. 830 px (okno minus 356 px
      na padding, sidebar i rynne, minus pasek przewijania), wiec kafel maleje do 127 px.
      Zmierzone w przegladarce przy oknie 1250 px: 135 px. Jest ciasniej niz w kiosku obok
      (auto-fit daje tam 5 sciezek po 165 px i szosty kafel jako sierote w drugim rzedzie -
      to stan sprzed tej zmiany, nie jej skutek), ale podpis sie miesci: kadr 4/3 daje przy
      135 px kafla 101 px wysokosci, a cztery wiersze tytulu 12px/1.18 z paddingiem to 71 px.
      Selektor kontenera ma TRZY klasy, bo musi przebic repeat(auto-fit,...) i repeat(3,1fr)
      z blokow kiosku (0,2,0) oraz repeat(2,1fr) warstwy mobilnej.
   2) ROZMIESZCZENIE JAWNE, NIE Z DOM. Kolejnosc w DOM to lewa grupa -> etykieta -> prawa
      grupa (pod telefon, gdzie siatka schodzi do jednej kolumny), a na desktopie
      grid-column/grid-row stawia etykiete w wierszu 1 nad prawa kolumna, a obie podgrupy
      w wierszu 2. Dzieki temu kafle obu stron startuja od WSPOLNEJ krawedzi niezaleznie
      od tego, czy etykieta zawinie sie w druga linie, a nad lewa grupa zostaje swiatlo
      wysokosci etykiety. row-gap 8 px zastepuje dawne .tm-promos{margin-top:8px},
      a margin-top:18px na kontenerze - dawne .tm-promoh{margin:18px 0 0}.
   3) BRAK JEDNEJ ZE STRON. Gdy pusta jest PRAWA (miasto bez ani jednego materialu
      platnego), kolumny zostaja nietkniete: kafle redakcyjne trzymaja 149 px, a wolne
      miejsce zostaje po prawej - dokladnie tak, jak robil to auto-fill poprzedniej
      wersji rzedu. Gdy pusta jest LEWA, kolumny zamieniaja sie szerokosciami, zeby kafle
      platne nadal mialy 149 px, a nie 312. Pusta lewa grupa to stan awaryjny, ale NIE
      teoretyczny: symulacja calego lancucha widgetow sekcji na 180 kolejnych dniach dala
      12 dni bez ani jednego kafla po lewej i wszystkie 12 leza w oknie 2026-04-25..08-01,
      czyli w udokumentowanej awarii importu PAP; w 81 dniach obu zdrowych rezimow lewa
      grupa byla pelna kazdego dnia. Regula z :has zabezpiecza wiec czas awarii zrodla,
      a nie codzienny tor. Przegladarka bez :has (Firefox starszy niz 121, czyli sprzed
      grudnia 2023) ignoruje ja i zostawia prawa grupe w drugiej kolumnie: w obu wariantach
      zmierzono te same kafle 149 px i te sama wysokosc rzedu, rozni sie wylacznie to,
      po ktorej stronie toru zostaje pustka.
   4) ETYKIETA (.tm-promoh). Od 2026-09-10 lzejsza: 11 px waga 400 zamiast 12 px waga 600.
      Powod jest ten sam, dla ktorego ma kolor --txt-2, a nie akcent sekcji - to podpis
      grupy, a nie belka: sekcja ma juz swoje h2 "Fakty Polska" i drugi mocny naglowek
      konkurowalby z nim o uwage. Wersalik i rozstrzelenie zostaja, bo to metryka etykiet
      calego motywu; zmniejszony trekking (.12em) rekompensuje mniejszy stopien pisma.
   5) KOLUMNY PODGRUP STOJA POZA @media I TO JEST WARUNEK POPRAWNOSCI, nie skrot. Kontener
      dostaje swoje dwie kolumny regula bezwarunkowa, wiec obie podgrupy musza miec wlasna
      siatke rowniez poza oknami media. Inaczej w szczelinie miedzy progami - szerokosc
      widoku scisle miedzy 1200 a 1201 px albo miedzy 880 a 881 px, a to sa realne
      szerokosci, bo przy zoomie przegladarki i skalowaniu Windows 110/125% widok glownej
      ramki ma czesc ulamkowa i Blink jej NIE zaokragla - podgrupy spadaja na bazowe
      .tm-minis{grid-template-columns:repeat(4,1fr)} i dwa kafle platne dziela trzecia
      czesc toru na cztery sciezki. Pomiar w takiej szczelinie: przed poprawka lewa
      4 x 128,9 px i prawa 2 x 57,4 px, po poprawce 128,9 i 128,8 px. Wartosci desktopowe
      (4 i 2 kolumny) sa wiec domyslne, a oba okna media tylko je nadpisuja. */
.tm-minis6.tm-minis6-m.tm-promorow{grid-template-columns:minmax(0,1fr) calc((100% - 28px)/3);gap:8px 14px;align-items:start;margin-top:18px}
.tm-promorow>.tm-promog{min-width:0}
.tm-promorow>.tm-promog-l{grid-column:1;grid-row:2;grid-template-columns:repeat(4,1fr)}
.tm-promorow>.tm-promoh{grid-column:2;grid-row:1;margin:0}
.tm-promorow>.tm-promog-r{grid-column:2;grid-row:2;grid-template-columns:repeat(2,1fr)}
@media(min-width:881px) and (max-width:1200px){
 .tm-promorow>.tm-promog-l{grid-template-columns:repeat(2,1fr)}
 .tm-promorow>.tm-promog-r{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:880px){
 .tm-minis6.tm-minis6-m.tm-promorow{grid-template-columns:minmax(0,1fr)}
 .tm-promorow>.tm-promog-l,.tm-promorow>.tm-promoh,.tm-promorow>.tm-promog-r{grid-column:1;grid-row:auto}
 .tm-promorow>.tm-promoh{margin-top:10px}
 .tm-promorow>.tm-promog-l,.tm-promorow>.tm-promog-r{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:881px){
 .tm-minis6.tm-minis6-m.tm-promorow:not(:has(.tm-promog-l)){grid-template-columns:calc((100% - 28px)/3) minmax(0,1fr)}
 .tm-promorow:not(:has(.tm-promog-l))>.tm-promoh,.tm-promorow:not(:has(.tm-promog-l))>.tm-promog-r{grid-column:1}
}
.tm-promoh{font:400 11px var(--f-lab);letter-spacing:.12em;text-transform:uppercase;color:var(--txt-2)}

/* Typografia wariantu jest kalibrowana pod kadr DESKTOPOWY, wiec cala stoi w
   @media(min-width:881px). Powod jest mechaniczny: blok mobilny warstwy B (linie 1950-1956)
   celuje w te same elementy przez .tm-htit (0,1,0) i .tm-hbig.tm-nofoto-h .tm-htit (0,3,0),
   a kazda regula z przedrostkiem .tm-dnia-m ma specyficznosc wyzsza i lezy w pliku pozniej,
   wiec bez tego okna po cichu przebilaby wersje telefonowa - w kaflu o stalej wysokosci
   200 px (linia 1676) tytul wyszedlby poza kadr. Zamkniecie w oknie jest odporniejsze niz
   powtarzanie kazdej reguly w bloku mobilnym: nastepna dopisana tutaj regula jest bezpieczna
   z automatu. Ta sama pulapka czeka przy KAZDEJ nowej regule dla .tm-nofoto/.tm-nofoto-h. */
@media(min-width:881px){
 /* tytul hero: regula bazowa (27 px) byla kalibrowana na pole 575x400 strony
    ogolnopolskiej, tutaj pole ma 409x300 */
 .tm-dnia-m .tm-htit{font-size:21px;line-height:1.2}
 /* kafle srodkowej kolumny maja tu 255x143 px zamiast 255x214 px jak na stronie
    ogolnopolskiej (rzad jest nizszy o 142 px). Trzy klasy w selektorze sa wymagane:
    .tm-oc-m .tm-oct (0,2,0) lezy w pliku pozniej i wygralaby kolejnoscia -
    patrz ostrzezenie przy .tm-kiosk .tm-oc-m. */
 .tm-dnia-m .tm-dniamid .tm-oct{font-size:13.5px;-webkit-line-clamp:2}
 /* Wiersz listy "Najnowsze": tytul przyciety do TRZECH linii. Na stronie ogolnopolskiej
    rzad ma 442 px i tytul czteroliniowy (wiersz 104 px) miesci sie z zapasem; tutaj rzad ma
    300 px, wiec 27 px etykiety + 3 x 104 px = 339 px, a .tm-latest ma overflow:hidden i po
    prostu ucinal trzeci wiersz o 38 px (pomiar w przegladarce: scrollHeight 338 przy
    wysokosci 300). Przy trzech liniach tekst ma 57 px, czyli mniej niz miniatura 88x62 -
    o wysokosci wiersza decyduje wtedy miniatura i suma wynosi 27 + 3 x 82 = 273 px, z
    zapasem, ktory rozdziela flex:1 na .tm-dnia .tm-li.
    Zmiana display na -webkit-box jest konieczna: regula bazowa .tm-lt ma display:block,
    a przy nim -webkit-line-clamp nie dziala. */
 .tm-dnia-m .tm-lt{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
 /* hero bez zdjecia (kafel typograficzny .tm-nofoto-h): regula bazowa daje 38 px
    wersalikow, co w kadrze 300 px jest piecioma wierszami. Wzorzec obnizki stoi juz
    w pliku dla .tm-sgrid. */
 .tm-dnia-m .tm-hbig.tm-nofoto-h .tm-htit{font-size:24px}
 .tm-dnia-m .tm-hbig.tm-nofoto-h::after{font-size:120px;top:-20px}
}

/* --- B. NA SYGNALE: rzad kafli o stalej proporcji, 3 kolumny ---
   Widget daje 6 pozycji, wiec 3 kolumny to dokladnie 2 pelne rzedy (w siatce
   4-kolumnowej ostatni rzad mial dwie puste komorki). */
.tm-sig{grid-template-columns:repeat(3,1fr)}
.tm-sig .tm-oc-m{aspect-ratio:16/9}
.tm-sig .tm-oc-m .tm-oct{font-size:15px}
@media(max-width:880px){.tm-sig{grid-template-columns:repeat(2,1fr)}}

/* --- C. REGION: miasta w okolicy + siatka artykulow z okolicy (przebudowa 2026-10-05) ---
   Sekcja stoi pod "Moto / Tech / Komunikacja" (do 2026-10-05 pod "Na sygnale", jako lista
   tekstowa .tm-rcols bez zdjec). Barwa to granat bloku "{Miasto} dzisiaj" (--loc, sekcja
   ustawia --ac i --ac-dark inline): Region jest przedluzeniem tresci lokalnej, a zielen,
   ktora mial wczesniej, nalezy do Sportu.
   Pasek .tm-regm: najblizsze miasta z portalem (nazwa + km, link do portalu miasta) w tej
   samej metryce co rzad uslug "Miasto na co dzien" (.tm-uslrow); na telefonie jeden rzad
   przewijany w poziomie, jak tam.
   Siatka .tm-regg: szablon NT3region bierze 9, 5 albo 3 pozycje (klasa .tm-regg-N), tak zeby
   kazdy wariant dawal pelne rzedy:
     >=1201 px  4 kolumny, kafel wiodacy 2x2 - n9: 4 + 8 = 12 pol (3 rzedy), n5: 4 + 4 (2 rzedy);
     881-1200   3 kolumny - n9: kafel wiodacy 2x2, 4 + 8 = 12 pol (4 rzedy); n5: kafel wiodacy
                1x2 (pionowy), 2 + 4 = 6 pol (2 rzedy);
     <=880      2 kolumny - kafel wiodacy na cala szerokosc w kadrze 16/9, reszta parami;
     n3         trzy rowne kafle 16/9 (jak "Na sygnale"), na telefonie pierwszy na cala szerokosc.
   Wysokosc rzedow wyznaczaja male kafle (aspect-ratio z .tm-oc-m - element z proporcja nie jest
   rozciagany w siatce), a kafel wiodacy nie ma proporcji, wiec rozciaga sie na swoje rzedy.
   Wymiary dla toru 964 px: maly kafel 230x154, wiodacy 475x322. */
/* etykieta na wysokosci PIERWSZEGO rzedu chipow (przy dwoch-trzech rzedach wysrodkowana wisiala
   w powietrzu miedzy nimi); padding-top 9 px = (wysokosc chipu 31 px - wiersz etykiety 13 px) / 2 */
.tm-regm{display:flex;align-items:flex-start;gap:14px;margin:0 0 16px}
.tm-regmh{flex:none;padding-top:9px;font:600 12px/1.1 var(--f-lab);letter-spacing:.18em;text-transform:uppercase;color:var(--loc)}
.tm-regml{display:flex;flex-wrap:wrap;gap:8px;min-width:0;margin:0;padding:0;list-style:none}
.tm-regc{display:inline-flex;align-items:baseline;gap:6px;padding:7px 12px;background:#fff;border:1px solid var(--loc-line);border-radius:999px;font-size:13px;font-weight:600;line-height:1.2;color:var(--loc);white-space:nowrap;transition:border-color .15s,color .15s}
.tm-regc span{font-size:11.5px;font-weight:500;color:var(--txt-2)}
.tm-regc:hover{border-color:var(--brand);color:var(--brand)}
.tm-regg{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.tm-regg>.tm-oc-lead{grid-column:span 2;grid-row:span 2}
.tm-regg .tm-oc-lead .tm-ocb{padding:18px 20px}
.tm-regg .tm-oc-lead .tm-oct{font-size:22px;line-height:1.2;-webkit-line-clamp:4}
.tm-regg .tm-oc-lead .tm-ocl{-webkit-line-clamp:2}
.tm-regg .tm-oc-lead .tm-kat{background:var(--loc);backdrop-filter:none;margin-bottom:9px}
/* kafel wiodacy bez zdjecia ma tlo --loc - chip w tym samym kolorze bylby niewidoczny */
.tm-regg .tm-nofoto .tm-kat{background:rgba(0,0,0,.28)}
.tm-regg-3{grid-template-columns:repeat(3,1fr)}
.tm-regg-3>.tm-oc-m{aspect-ratio:16/9}
/* 881-1200 px: obok stoi sidebar, wiec przy oknie 881 px tor ma ok. 525 px, a maly kafel 166x110.
   Kafel bez zdjecia dostawal wtedy z .tm-nofoto.tm-oc-m .tm-oct (0,3,0) 17 px wersalikami do 5
   wierszy - podpis byl wyzszy od kafla i overflow:hidden ucinal od gory chip "Miasto · km"
   (pomiar przegladu 2026-10-05: chip 12 px nad krawedzia przy 881 px). Cztery klasy w selektorze
   wygrywaja z tamta regula niezaleznie od kolejnosci. W n3 kadr 3/2 zamiast 16/9 z tego samego
   powodu (kafel 16/9 mial przy 881 px 93 px wysokosci). */
@media(min-width:881px) and (max-width:1200px){
 .tm-regg{grid-template-columns:repeat(3,1fr)}
 .tm-regg-5>.tm-oc-lead{grid-column:span 1}
 .tm-regg-5 .tm-oc-lead .tm-oct{font-size:18px}
 .tm-regg .tm-nofoto.tm-oc-m .tm-oct{font-size:14px;line-height:1.12;-webkit-line-clamp:4}
 .tm-regg-3>.tm-oc-m{aspect-ratio:3/2}
}
@media(max-width:880px){
 .tm-regg{grid-template-columns:repeat(2,1fr)}
 .tm-regg>.tm-oc-lead{grid-row:auto;aspect-ratio:16/9}
 .tm-regg-3>.tm-oc:first-child{grid-column:span 2}
}
@media(max-width:700px){
 .tm-regm{flex-direction:column;align-items:stretch;gap:8px}
 .tm-regmh{padding-top:0}
 .tm-regml{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
}
/* telefon: kafle 4/3 jak w mozaice bloku "dzisiaj" - w komorce ok. 173 px kadr 3/2 (115 px)
   nie zmiescilby chipu z nazwa miasta i trzech wierszy tytulu */
@media(max-width:600px){
 .tm-regg{gap:8px}
 .tm-regg>.tm-oc-m{aspect-ratio:4/3}
 .tm-regg-3>.tm-oc-m:first-child{aspect-ratio:16/9}
 .tm-regg .tm-oc-m .tm-ocb{padding:8px 10px}
 .tm-regg .tm-oc-m .tm-oct{font-size:13px;line-height:1.25}
 .tm-regg .tm-oc-lead .tm-ocb{padding:12px 14px}
 .tm-regg .tm-oc-lead .tm-oct{font-size:18px;-webkit-line-clamp:3}
 .tm-regg .tm-oc-lead .tm-ocl{display:none}
}

/* --- D. KULTURA: pas na tincie WEWNATRZ kolumny glownej ---
   Makieta V3 trzyma pas jako zaokraglona karte w kolumnie tresci, a nie jako pas
   pelnej szerokosci okna - dzieki temu nie trzeba rozcinac .tm-cols i sidebar oraz
   sticky B0/B1 zachowuja sie dokladnie jak dotad. Kafle: proporcja 4:3 (pozioma).
   Wnetrze pasa = 964 - 2x18 padding = 926 px; przy 4 kolumnach i gap 12 px kafel ma
   222,5 px.
   Poprawka 2026-09-05 - liczby derywatow byly falszywe. Realnie (conf/art.php:8-13,
   potwierdzone getimagesize na 280 plikach z www/img/art/2026/09): s = 400x209,
   m = 623x325, g = 950x496. W komentarzu stalo 320x180 i 420x236, czyli proporcja 16:9,
   ktorej zaden derywat nie ma - wszystkie maja 1,915.
   Po przeliczeniu przy object-fit:cover (obraz jest szerszy od kafla 4:3, wiec wiaze
   WYSOKOSC): s pokrywa 4:3 do 278 px szerokosci, m do 433 px - nadal zaden kafel
   nie jest skalowany w gore, wiec sam uklad zostaje bez zmian.
   UPADA natomiast argument o kaflach portretowych: przy 4:5 derywat m siega 260 px
   (325 px wysokosci x 0,8), a kafel potrzebuje 222,5 px - czyli 4:5 z makiety BYLOBY
   wykonalne, wbrew temu, co mowil ten komentarz (wyliczal 189 px z falszywego 420x236).
   Kafle zostaja 4:3, ale juz jako decyzja wizualna, nie jako ograniczenie plikow. */
.tm-cband{background:var(--tint-kultura,#fdf7ec);border:1px solid #f0e0c0;border-radius:12px;padding:18px 18px 20px;margin-bottom:16px}
.tm-cbandh{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.tm-cbandh h3{margin:0;font:600 15px var(--f-lab);letter-spacing:.18em;text-transform:uppercase;color:#8a6215}
.tm-cbandh span{flex:1;height:1px;background:#eadcbe}
.tm-gD{display:grid;grid-template-columns:1.5fr 1fr 1fr 290px;gap:12px;align-items:start}
.tm-gD>.tm-oc-c{grid-column:1;grid-row:1/span 2;height:100%;aspect-ratio:auto;min-height:300px}
.tm-gD>.tm-top5{grid-column:4;grid-row:1/span 2;background:transparent;box-shadow:none;border:1px solid #eadcbe;border-radius:10px}
.tm-gD .tm-oc-m{aspect-ratio:4/3}
/* dwa rzędy małych kafli rozciągnięte na wysokość wierszy siatki - wysokość dyktują karta z lewej
   (min-height 300) i boks TOP 5; przy sztywnym 4:3 dolne kafle kończyły się ok. 17 px wyżej niż sąsiedzi */
@media(min-width:1101px){.tm-gD>.tm-oc-m{aspect-ratio:auto;align-self:stretch;min-height:120px}}
/* bez numeracji - kreska w kolorze sekcji jak w notkach Biznesu (.tm-noty), numer nie niósł żadnej realnej rangi w kilkuelementowej sekcji tematycznej */
.tm-gD .tm-t5{position:relative;padding-left:14px}
.tm-gD .tm-t5 b{display:none}
.tm-gD .tm-t5::before{content:"";position:absolute;left:0;top:17px;width:6px;height:2px;background:var(--ac,var(--brand))}
@media(max-width:1100px){.tm-gD{grid-template-columns:1fr 1fr}.tm-gD>.tm-oc-c,.tm-gD>.tm-top5{grid-column:auto;grid-row:auto;min-height:0}.tm-gD>.tm-oc-c{aspect-ratio:16/9}}
@media(max-width:560px){.tm-gD{grid-template-columns:1fr}.tm-cband{padding:14px}}

/* --- E. GOSPODARKA (dawniej Strefa Biznesu): karta wiodaca + boks "Finanse w liczbach", pod spodem rzad kafli --- */
.tm-gB{display:grid;grid-template-columns:1.7fr 1fr;gap:16px;margin-bottom:14px;align-items:start}
/* rzad kafli sekcji - wariant dla miast BEZ kafelka sponsora GoWork.
   W miastach z umowa zostaje siatka 4-kolumnowa .tm-minis/.tm-minis-adv, bo kafelek
   .tm-madv zajmuje 2 komorki i tylko przy 4 kolumnach 6 artykulow + reklama daja
   rowne 2 rzedy (8 komorek). Patrz komentarz przy .tm-madv i BOK #315656. */
.tm-hcards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
/* dodatkowy rzad 3 artykulow domykajacy sekcje Strefa Biznesu na SG - sama .tm-hcards nie ma
   marginesu gornego (w swoim macierzystym miejscu stoi tuz pod belka sekcji), a tu przykleja
   sie do rzadka kafli nad soba */
.tm-hcards-dol{margin-top:20px}
.tm-hcards .tm-oc-m{aspect-ratio:16/9}
.tm-hcards .tm-oct{font-size:14px}
@media(max-width:880px){.tm-gB{grid-template-columns:1fr}.tm-hcards{grid-template-columns:1fr 1fr}}
/* boks "Finanse w liczbach" (NT3gusBudzetKpi) obok karty Gospodarki na SG miasta - od 2026-10-08 zamiast listy TOP5
   bez zdjec. Siega do dolu karty, zaokraglony ze wszystkich stron (w pelnym panelu .tm-gosbud tylko z lewej),
   przycisk do /miasto/stat dociskany do dolu boksu */
.tm-gB>.tm-gosbud-kpi{align-self:stretch;display:flex;flex-direction:column;align-items:flex-start;border-radius:8px}
.tm-gB>.tm-gosbud-kpi .tm-gosbud-dl{align-self:stretch;margin-bottom:auto;padding-bottom:18px}
/* pelny panel w dziale /gospodarka_biznes: boks wskaznikow szerszy niz 310 px, zeby "Wydatki na mieszkanca" w wersalikach
   miescilo sie w jednej linii (inaczej wartosci drugiego rzedu rozjezdzaja sie o linie) */
.tm-dzbud{margin-top:28px}
.tm-dzbud .tm-gosbud{grid-template-columns:minmax(0,350px) minmax(0,1fr);margin-top:0}
@media(max-width:700px){.tm-dzbud .tm-gosbud{grid-template-columns:1fr}}
@media(max-width:560px){.tm-hcards{grid-template-columns:1fr}}

/* panel "Budzet miasta" domykajacy sekcje (widget TMgusBudzet, szablon NT3gusBudzet, dane GUS BDL ze statMiasto;
   zastapil kafelek surowcow 2026-10-06). Z lewej blok wskaznikow na granacie sekcji z tekstura - ten sam mechanizm
   i budzet --nofoto-tex co .tm-biegi-cta (regula ::before i przycisk sa wspolne), wiec CALY tekst bloku jest czysto
   bialy: kazde przyciemnienie (opacity/rgba) zjada zapas kontrastu 5,41:1. Ikona to grafika poza tekstem.
   Z prawej struktura wydatkow (od 2026-10-08 zamiast "Z kazdych 100 zl"): miesieczna kwota na mieszkanca w naglowku,
   w legendzie zlote grupy i udzial w % (szary --txt-2, kolumna o stalej szerokosci). Pasek: segmenty z odstepem 2 px w kolorze tla, zaokraglone tylko konce
   paska, kolory grup w stalej kolejnosci (paleta sprawdzona walidatorem CVD; transport i komunalne maja kontrast
   ponizej 3:1, wiec legenda z kwotami jest zawsze widoczna, a pasek jest aria-hidden). Tekst legendy w kolorach
   tekstu, nie grup. "Pozostale" szare jak kazda kategoria zbiorcza. */
.tm-gosbud{display:grid;grid-template-columns:minmax(0,310px) minmax(0,1fr);margin-top:20px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--card-sh)}
.tm-gosbud-kpi{position:relative;overflow:hidden;isolation:isolate;padding:16px 18px 18px;border-radius:7px 0 0 7px;background:var(--ac-dark,var(--ac,var(--brand)));color:#fff}
.tm-gosbud-ico{position:absolute;top:14px;right:14px;width:30px;height:30px;color:rgba(255,255,255,.35)}
.tm-gosbud-lab{display:block;font:600 10.5px var(--f-lab);letter-spacing:.16em;text-transform:uppercase;margin-bottom:6px}
.tm-gosbud-h{margin:0;padding-right:40px;font:600 23px/1.08 var(--f-lab);letter-spacing:.005em;text-transform:uppercase;color:#fff}
.tm-gosbud-dl{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;margin:16px 0 18px}
/* komorki wyrownane do gory (od 2026-10-08, wczesniej do dolu): w drugim rzedzie tylko "Wydatki na mieszkanca" ma podpis
   <small> ("rocznie"), wiec wyrownanie do dolu stawialo "Deficyt" o linie nizej. Etykiety mieszcza sie w jednej linii
   (boks 351 px na SG, 350 px w dziale, pelna szerokosc na telefonie) */
.tm-gosbud-dl>div{display:flex;flex-direction:column;justify-content:flex-start;min-width:0}
.tm-gosbud-dl dt{font:600 10.5px/1.25 var(--f-lab);letter-spacing:.12em;text-transform:uppercase}
.tm-gosbud-dl dd{margin:3px 0 0;font:600 21px/1.15 var(--f-lab);font-variant-numeric:tabular-nums;white-space:nowrap}
.tm-gosbud-dl small{display:block;margin-top:2px;font:500 11.5px/1.3 var(--f-ui)}
.tm-gosbud-str{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:18px 22px}
.tm-gosbud-sh{margin:0 0 10px;font:600 12px var(--f-lab);letter-spacing:.14em;text-transform:uppercase;color:var(--dark)}
.tm-gosbud-sh b{font-size:15px;letter-spacing:.02em;text-transform:none;font-variant-numeric:tabular-nums;white-space:nowrap}
.tm-gosbud-bar{display:flex;gap:2px;height:20px}
.tm-gosbud-bar span{flex-basis:0;min-width:4px}
.tm-gosbud-bar span:first-child{border-radius:4px 0 0 4px}
.tm-gosbud-bar span:last-child{border-radius:0 4px 4px 0}
.tm-gosbud-leg{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px 24px}
.tm-gosbud-leg li{display:flex;align-items:baseline;gap:8px;font-size:13px;line-height:1.35;color:var(--txt)}
.tm-gosbud-leg i{flex:none;align-self:center;width:10px;height:10px;border-radius:3px}
.tm-gosbud-leg b{margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.tm-gosbud-leg em{flex:none;min-width:3.2em;font-style:normal;font-size:12px;text-align:right;color:var(--txt-2);font-variant-numeric:tabular-nums}
.tm-gosbud-zr{margin:14px 0 0;font-size:11.5px;line-height:1.4;color:var(--txt-2)}
.tm-gosbud-g-oswiata{background:#226697}
.tm-gosbud-g-spoleczne{background:#eb6834}
.tm-gosbud-g-transport{background:#1baf7a}
.tm-gosbud-g-komunalne{background:#eda100}
.tm-gosbud-g-pozostale{background:#c9ced6}
@media(max-width:700px){.tm-gosbud{grid-template-columns:1fr}.tm-gosbud-kpi{border-radius:7px 7px 0 0}.tm-gosbud-str{padding:16px}}

/* --- F. SPORT (SG miasta): karta + kafle po lewej, po prawej ranking i boks "Biegi" ---
   Reguly .tm-rank .tm-top5 / .tm-rank .tm-t5 sa juz w arkuszu (warstwa C1, sekcja
   Sportu na /polska) i celowo NIE sa tu powtarzane. Szara ramka wokol rankingu
   (dawne .tm-gC .tm-rank{border:1px solid var(--line);...;background:#fff}) zdjeta
   2026-09-05 na zyczenie: lista tytulow bez zdjec stoi teraz bez opakowania, z sama
   kreska w kolorze sekcji od gory (.tm-rank .tm-top5) - jak notki w Strefie Biznesu. */
.tm-gC{display:grid;grid-template-columns:1fr 300px;gap:16px;align-items:start}
/* prawa kolumna: ranking, a pod nim boks Biegi. min-width:0, zeby dluga nazwa zawodow
   nie rozpychala kolumny 300px (dziecko grida ma domyslnie min-width:auto) */
.tm-gCr{display:flex;flex-direction:column;gap:20px;min-width:0}
.tm-gCm{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tm-gCm>.tm-oc-c{grid-column:span 2}
@media(max-width:880px){.tm-gC{grid-template-columns:1fr}}

/* boks "Biegi" (modul Zapisy, idea #310; widget ext/S/function.TMzapisyBiegi.php +
   NT3zapisyBiegi.tpl). Zacheta dla organizatorow w panelu w kolorze sekcji - ten sam
   mechanizm i budzet tekstury co kafel typograficzny .tm-nofoto (--ac-dark zmierzony pod
   bialy tekst, --nofoto-tex), wiec caly tekst panelu MUSI byc czysto bialy: kazde
   przyciemnienie (opacity/rgba) zjada zapas kontrastu, ktorego pod tekstura jest 4,55:1. */
.tm-biegi{display:flex;flex-direction:column;gap:14px}
.tm-biegi-cta{position:relative;overflow:hidden;isolation:isolate;padding:16px 16px 15px;border-radius:8px;background:var(--ac-dark,var(--ac,var(--brand)));color:#fff}
.tm-biegi-cta::before,.tm-gosbud-kpi::before{content:"";position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(135deg,rgba(255,255,255,var(--nofoto-tex)) 0 2px,transparent 2px 9px),radial-gradient(120% 90% at 100% 0%,rgba(255,255,255,var(--nofoto-tex)),transparent 60%)}
.tm-biegi-lab{display:block;font:600 10.5px var(--f-lab);letter-spacing:.16em;text-transform:uppercase;margin-bottom:7px}
.tm-biegi-h{display:block;font:600 23px/1.08 var(--f-lab);letter-spacing:.005em;text-transform:uppercase;text-wrap:balance}
.tm-biegi-p{margin:9px 0 13px;font-size:13px;line-height:1.45}
/* przycisk odwrocony (bialy na zieleni): czerwony .tm-btn marki bilby sie w zielonym
   panelu z kolorem sekcji; napis w --ac-dark na bieli to 5,12:1 */
.tm-biegi-btn,.tm-gosbud-btn{display:inline-flex;align-items:center;gap:7px;background:#fff;color:var(--ac-dark,var(--ac,var(--brand)));font:600 13px var(--f-ui);padding:9px 15px;border-radius:999px;text-decoration:none;box-shadow:0 6px 16px -8px rgba(0,0,0,.45);transition:background .2s}
.tm-biegi-btn span,.tm-gosbud-btn span{transition:transform .2s}
.tm-biegi-btn:hover,.tm-gosbud-btn:hover{background:var(--band)}
.tm-biegi-btn:hover span,.tm-gosbud-btn:hover span{transform:translateX(3px)}
/* lista najblizszych biegow - wiersz jak "Warto przeczytac" w sidebarze (.tm-sart), tylko
   z kwadratowa miniatura 64px (plik s/{id}.jpg ma 100x100, wiec bez rozmycia) i data
   w kolorze sekcji nad nazwa - data jest tu informacja pierwszego rzedu, nie meta */
.tm-biegi-lh{margin:0;font:600 12px var(--f-lab);letter-spacing:.14em;text-transform:uppercase;color:var(--dark);padding-bottom:6px;border-bottom:2px solid var(--ac,var(--brand))}
.tm-biegi-i{display:flex;gap:11px;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none}
.tm-biegi-i:last-child{border-bottom:0;padding-bottom:2px}
.tm-biegi-th{flex:none;width:64px;height:64px;border-radius:6px;overflow:hidden;background:var(--band)}
.tm-biegi-th img{display:block;width:100%;height:100%;object-fit:cover}
.tm-biegi-b{display:flex;flex-direction:column;gap:3px;min-width:0}
.tm-biegi-d{font:600 11px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--ac-dark,var(--ac,var(--brand)))}
.tm-biegi-t{font-size:13.5px;font-weight:500;line-height:1.3;color:#242a34}
.tm-biegi-i:hover .tm-biegi-t{color:var(--ac-dark,var(--ac,var(--brand)))}
.tm-biegi-m{font-size:12px;line-height:1.35;color:var(--txt-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* etykieta stanu zapisow - pigulka; wariant "otwarte" w tincie sekcji, reszta neutralna */
.tm-biegi-s{align-self:flex-start;margin-top:2px;font:600 9.5px/1 var(--f-lab);letter-spacing:.1em;text-transform:uppercase;padding:4px 7px;border-radius:999px;background:var(--band);color:var(--txt-2)}
.tm-biegi-sOn{background:rgba(63,145,66,.14);color:var(--ac-dark,var(--ac,var(--brand)))}
/* Komplet miejsc. Wariant NIE bierze się ze statusu: zapisyZawody.statusZapisow zostaje
   'otwarte' także po wyczerpaniu limitu, więc bez tej klasy przy komplecie stałaby zielona
   pigułka "zapisy otwarte" obok licznika "wolne miejsca: 0 / 150". Kolory STAŁE (nie
   var(--ac-dark)) i te same co .tm-zap-sFull w treści strony - dzięki temu reguła działa
   również w sidebarze, który przestawia --ac-dark na czerwień (blok E niżej). */
.tm-biegi-sFull{background:#fdecec;color:#b3261e}
/* Licznik wolnych miejsc - czwarty wiersz kolumny .tm-biegi-b (flex-column, gap 3px).
   Osobny element, bo .tm-biegi-m ma nowrap + ellipsis i uciąłby liczby w kolumnie 300 px,
   a .tm-biegi-s to 9,5 px uppercase z letter-spacing .1em, w którym cyfry z ukośnikiem
   rozpychają pigułkę i psują rytm wiersza. Bez uppercase i bez letter-spacing - liczby
   czytają się wtedy źle. Kolor neutralny (--txt-2), żeby nie wymagać bliźniaczego
   nadpisania w bloku E przy zmienionej palecie sidebara. */
.tm-biegi-free{align-self:flex-start;font:600 11px var(--f-lab);color:var(--txt-2)}
/* bez zaplanowanych biegów jedna linijka zamiast boksu z zachętą (2026-10-10) */
.tm-biegi-min{display:block;padding:10px 12px;border-left:3px solid var(--ac,var(--brand));border-radius:0 6px 6px 0;background:var(--band);font-size:13.5px;line-height:1.4;color:var(--txt);text-decoration:none}
.tm-biegi-min b{color:var(--ac-dark,var(--ac,var(--brand)));white-space:nowrap}
.tm-biegi-min:hover b,.tm-biegi-min:focus-visible b{text-decoration:underline}
/* Turystyka na SG miasta (2026-10-10): "Zabytek do odkrycia" w prawej kolumnie (NT3zabytekTurystyka) */
.tm-zabsg{display:flex;flex-direction:column;gap:10px}
.tm-zabsg-o{display:flex;gap:12px;align-items:flex-start;color:var(--txt-h);text-decoration:none}
.tm-zabsg-o img{flex:0 0 120px;width:120px;height:80px;object-fit:cover;border-radius:6px;background:var(--band)}
.tm-zabsg-o span{min-width:0}
.tm-zabsg-o b{display:block;font:600 15px/1.3 var(--f-ui)}
.tm-zabsg-o small{display:block;margin-top:3px;font-size:12.5px;color:var(--txt-2)}
.tm-zabsg-o:hover b{color:var(--ac-dark,var(--ac));text-decoration:underline}
.tm-zabsg-all{display:block;padding:8px 12px;border-left:3px solid var(--ac,var(--brand));border-radius:0 6px 6px 0;background:var(--band);font-size:13.5px;line-height:1.4;color:var(--txt);text-decoration:none}
.tm-zabsg-all:hover{color:var(--ac-dark,var(--ac));text-decoration:underline}

/* --- G. MOTO / TECH: dwa rzedy kafli + gesta 3-kolumnowa lista tekstowa --- */
.tm-gE{display:grid;grid-template-columns:1.3fr 1.7fr;gap:16px;align-items:start}
.tm-gEm{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tm-txtcols{columns:3;column-gap:26px;margin-top:14px;padding-top:12px;border-top:2px solid var(--ac,var(--brand))}
.tm-txtcols .tm-sitem{break-inside:avoid}
@media(max-width:1100px){.tm-txtcols{columns:2}}
@media(max-width:880px){.tm-gE{grid-template-columns:1fr}.tm-txtcols{columns:1}}

/* ===== WARSTWA D - SEO I DOSTEPNOSC =====
   Blok celowo na koncu pliku: warstwy A/B/C edytuja gorne partie arkusza, wiec trzymanie
   regul dostepnosciowych osobno ogranicza konflikty przy rownoleglej pracy na main.
   UWAGA: .tm-sec, .tm-nofoto i .tm-nofoto::before sa juz w arkuszu (warstwy C1 i B2)
   i celowo NIE sa tu powtarzane - powtorzenie nadpisaloby dzialajace reguly. */

/* metryczka na kaflu z tytulem na zdjeciu - token zamiast rgba(255,255,255,.66) z makiety
   (.66 daje 3,55:1 nad bialym zdjeciem, czyli ponizej AA; --oc-meta ma .85 = 4,69:1) */
.tm-oc .tm-meta{color:var(--oc-meta)}

/* fokus klawiaturowy na kaflach - widoczny obrys takze na ciemnym/kolorowym tle */
.tm-oc:focus-visible,.tm-nofoto:focus-visible{outline:3px solid #fff;outline-offset:-3px;
  box-shadow:0 0 0 5px rgba(6,8,12,.55)}

/* ==========================================================================
   CELE DOTYKOWE (WCAG 2.5.8 Target Size Minimum - 24x24 px)
   Pomiar wyjsciowy przy 390x844 (getBoundingClientRect, bez elementow inert
   i ukrytych): /polska 22 elementy ponizej progu, Grudziadz 24. Najgorsze
   grupy: ticker 14 px, stopka 17 px, chipy sidebara 18,8 px, pas lokalny
   12-19,5 px. Na desktopie 1440x900 dochodzi 8-11 linkow "wiecej" (15,5 px)
   i pasek gorny (18,8-21,5 px) - tam blok max-width:880px nie dziala.

   Uzyte sa DWIE techniki i obie sa neutralne dla ukladu:
   1. Element INLINE (linki tickera i stopki): sam padding pionowy. Padding
      elementu inline powieksza jego prostokat trafienia, ale nie wchodzi do
      line-boxa, wiec ani pasek tickera, ani stopka nie robia sie wyzsze.
   2. Element blokowy / pozycja flexa (chipy, "wiecej", naglowki modulow):
      padding pionowy + UJEMNY margines tej samej wartosci. Prostokat rosnie,
      a wklad elementu w wysokosc rodzica zostaje dokladnie taki jak byl.

   Swiadomie pominiety: input.tm-menucb (1x1 px). To ukryty checkbox sterujacy
   menu CSS-only - nie jest celem dotykowym, dotyka sie <label class="tm-burger">
   o wymiarach 44x44 px. Powiekszenie samego checkboxa wysunelo by go na ekran.
   ========================================================================== */

/* --- ticker: 14 px (telefon) / 17 px (desktop) -> 26 / 29 px.
   Wnetrze paska ma 28 px na telefonie i 36 px na desktopie, wiec powiekszone
   pole miesci sie w .tm-tick-belt i nie jest przycinane przez overflow:hidden. */
.tm-tick-belt a{padding-top:6px;padding-bottom:6px}

/* --- stopka: 17 px -> 25 px. Linki stoja w zdaniu rozdzielone znakiem "|",
   wiec padding pionowy jest jedyna technika, ktora nie rozbija tego wiersza. */
.tm-footer a{padding-top:4px;padding-bottom:4px}

/* --- sidebar pogodowy /polska: ekstrema temperatur i link do prognozy.
   .tm-pglink ma wlasny margin-top:9px, wiec gorny margines jest pomniejszony
   o padding zamiast wyzerowany - odstep od boxu zostaje taki sam. */
.tm-pgext a{padding-top:3px;padding-bottom:3px;margin-top:-3px;margin-bottom:-3px}
.tm-pglink{padding-top:3px;padding-bottom:3px;margin-top:6px;margin-bottom:-3px}

/* --- pas lokalny: "wszystkie wiadomosci" w naglowku pasa (19,5 -> 25,5 px)
   i linki w naglowkach modulow pogoda/powietrze/wydarzenia (12-15 -> 24-27 px).
   .tm-locmh jest flexem z align-items:baseline - ujemne marginesy nie ruszaja
   linii bazowej, wiec tekst zostaje dokladnie tam, gdzie byl. */
.tm-locmore{padding-top:3px;padding-bottom:3px;margin-top:-3px;margin-bottom:-3px}
.tm-locmh a{padding-top:6px;padding-bottom:6px;margin-top:-6px;margin-bottom:-6px}

@media(min-width:881px){
 /* Ponizej 881 px te trzy elementy sa juz spadowane w bloku max-width:880px
    (linie 434-451), wiec regula celuje wylacznie w desktop.
    .tm-morel stoi w .tm-shead z align-items:flex-end - dlatego padding dolny
    jest o 3 px wiekszy od gornego: to odtwarza dotychczasowe padding-bottom:3px
    i kreska sekcji zostaje przyklejona do tekstu tak jak przed zmiana. */
 .tm-morel{padding-top:6px;padding-bottom:9px;margin-top:-6px;margin-bottom:-6px}
 .tm-top .tm-chip{padding-top:3px;padding-bottom:3px;margin-top:-3px;margin-bottom:-3px}
 /* .tm-city to <button> - ma domyslny padding UA 1px/6px, wiec ujemny margines
    jest o 1 px mniejszy z kazdej strony; inaczej przycisk oddawal te 2 px
    i pasek gorny robil sie o 2 px nizszy (pomiar: 215,4 -> 213,4 px). */
 .tm-city{padding-top:5px;padding-bottom:5px;margin-top:-4px;margin-bottom:-4px}
}

@media(max-width:700px){
 /* Stopka na telefonie: powiekszone pola trafienia sasiednich WIERSZY tego
    samego akapitu nachodzilyby na siebie (linia ma 19,5 px, pole 25 px).
    Interlinia 2,0 daje 26 px odstepu, czyli pola stykaja sie, ale nie zachodza.
    Koszt: stopka rosnie z 274 na 300 px - stoi na samym koncu dokumentu,
    wiec nie zabiera miejsca zadnej tresci. */
 .tm-footcols{line-height:2}
}

/* ===== PANEL UZYTKOWNIKA (/user, pomysl #322) =====
   Kafelki uslug dostepnych po zalogowaniu. Panel wygladal wczesniej jak z 2013 roku: pas
   320 px z tlem /usr/bgProfil.jpg, awatar 200x200 pozycjonowany inline stylami i sekcja
   statystyk artykulow bez zrodla danych - ani jednej klasy theme/3 w srodku karty, calosc
   na warstwie zgodnosci compat.css.
   Karty liczbowe u gory to gotowe .tm-qcard z /notowania (te same tokeny, ten sam hover),
   wiec tutaj sa tylko kafelki opisowe: tytul, zdanie wyjasnienia i wezwanie na dole. */
.tm-ulead{color:var(--txt-2);font-size:14.5px;margin:0 0 22px;max-width:680px}
.tm-udot{color:var(--txt-3);margin:0 4px}
.tm-ugrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 10px}
.tm-ugrid2{grid-template-columns:repeat(2,1fr)}
/* wysokosc rowna w rzedzie: wezwanie ("Otworz") ma stac na dole kazdego kafelka niezaleznie
   od dlugosci opisu, stad flex + margin-top:auto na .tm-ucm zamiast stalej wysokosci */
.tm-ucard{display:flex;flex-direction:column;gap:7px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--card-sh);padding:17px 19px 15px;color:inherit;text-decoration:none;transition:box-shadow .18s ease,transform .18s ease,border-color .18s ease}
a.tm-ucard:hover{border-color:var(--brand);box-shadow:var(--card-sh-h);transform:translateY(-2px)}
.tm-uct{font:600 16px var(--f-ui);color:var(--txt);line-height:1.25}
.tm-ucd{font-size:13.5px;color:var(--txt-2);line-height:1.5}
.tm-ucm{margin-top:auto;padding-top:9px;font:600 12px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--brand)}
.tm-ucm::after{content:" \2192"}
/* kafelek uslugi dla firm - dwa w rzedzie, wiec opis jest dluzszy i moze oddychac */
.tm-ucbig{padding:20px 22px 18px}
.tm-ucbig .tm-uct{font-size:18px}
@media(max-width:1000px){.tm-ugrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.tm-ugrid,.tm-ugrid2{grid-template-columns:1fr}}

/* ===== STRONY DZIALOW (/biznes, /sport, ..., pomysl #321) =====
   Dzial przestal byc lista tytulow z naglowkiem "Artykuly: X", a stal sie podstrona zbudowana
   z tych samych klockow co sekcje strony glownej: material otwierajacy .tm-oc-c, dwa kafle
   obok i siatka .tm-minis pod spodem. Kolor dzialu wchodzi jako --ac/--ac-dark na wrapperze
   .tm-dz (ustawiane inline przez szablon) i splywa do .tm-kat, .tm-nofoto oraz kreski przy h1
   - dokladnie tak, jak w sekcjach indexPolska.tpl. Zadna z regul ponizej nie ustawia --ac-dark
   globalnie: lancuch var(--ac-dark,var(--ac,var(--brand))) w .tm-nofoto musi zachowac fallback. */
.tm-dzbc{margin:0 0 10px}
/* B0 na gorze sidebara dzialu (2026-10-06) zaczyna sie rowno z okruszkami w kolumnie glownej - bez gornego
   odstepu .reklamaTXT/.reklamaB napis "reklama" stoi na linii tekstu okruszkow, nie 5 px nizej */
.tm-dz .tm-side>.tm-sticky:first-child>#reklamaB0d{padding-top:0}
.tm-dzbcs{margin:0 5px;color:var(--txt-3)}
.tm-dzh{margin:0 0 20px}
/* h1 dzialu: ten sam wzor co .tm-h1k (kreska z lewej), tylko w kolorze dzialu zamiast --brand */
.tm-dzt{font-size:32px;line-height:1.15;font-weight:700;letter-spacing:-.015em;color:var(--txt-h);margin:0 0 9px;border-left:5px solid var(--ac,var(--brand));padding-left:18px;margin-left:-23px}
.tm-dzl{color:var(--txt-2);font-size:15px;line-height:1.5;margin:0;max-width:720px}
/* link "Kolejki na SOR" pod leadem działu /zdrowie-i-rodzina (pomysł #496, 2026-10-07) */
.tm-dzsor{margin:10px 0 0}
/* boks "Kursy walut i surowce" w sidebarze /biznes i /gospodarka_biznes (2026-10-06, zastapil pasek pod leadem):
   wiersze wizytowki .tm-mwrow, podpis grupy (NBP, EIA) maly jak etykiety sekcji, kolory zmiany jak w belce .tm-nbp
   (ciemniejsza zielen #1c7c43 ~5,3:1 na bieli zamiast --ok) */
.tm-notbok-s{font:600 11px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-3);margin:12px 0 2px}
.tm-notbok-s:first-child{margin-top:0}
.tm-notbok small{font-size:12px;font-weight:500;margin-left:3px;color:var(--txt-2);white-space:nowrap}
.tm-notbok .up{color:#1c7c43}
.tm-notbok .dn{color:var(--brand)}
/* jednostka przy cenie surowca - wyciszona, bo niesie mniej niz sama liczba i kierunek zmiany */
.tm-nbpj{color:var(--txt-3);font-size:11px}
.tm-dznotL{font:600 11.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--ac,var(--brand));text-decoration:none;white-space:nowrap}
.tm-dznotL:hover{text-decoration:underline}

/* material otwierajacy: duza karta 16/9 + kolumna dwoch kafli. Szerokosc prawej kolumny (272px)
   dobrana tak, zeby dwa kafle z odstepem mialy wysokosc zblizona do karty - stad tez zdjecie
   aspect-ratio:auto na kaflach w tej kolumnie: maja wypelnic wysokosc karty, a nie narzucac wlasna. */
.tm-dzlead{display:grid;grid-template-columns:1fr 272px;gap:14px;margin:0 0 14px}
.tm-dzside2{display:grid;grid-template-rows:1fr 1fr;gap:14px;min-width:0}
.tm-dzside2 .tm-oc-m{aspect-ratio:auto}
.tm-dzbig .tm-oct{font-size:25px}
.tm-dzgrid{margin:0 0 8px}
/* .tm-dzgridP: trzy kafle w rzedzie zamiast czterech (kafel ma wiecej oddechu na liscie bez
   hierarchii). Dwa uzycia w start.tpl: siatka "Najnowsze w dziale" na stronie 1 (decyzja
   2026-09-05) oraz strony 2+, gdzie do tego dochodzi wiecej pozycji naraz (ext/dzial.php,
   ILOSC_KOLEJNE) - tam to czysta chronologia bez materialu otwierajacego. Bezpieczne wobec
   pulapki specyficznosci z .tm-dzsecW/.tm-minis (patrz komentarz przy .tm-dzminis5): to
   POJEDYNCZA klasa, wiec o kolejnosci decyduje sama pozycja w arkuszu - stoi po bazowej
   .tm-minis, wiec wygrywa. */
.tm-dzgridP{grid-template-columns:repeat(3,1fr)}

/* Reguly chipow tematow (.tm-dzchips/.tm-dzchip/.tm-dzchipn) usuniete razem z paskiem pigulek
   pod naglowkiem - decyzja z 2026-09-04. Te same kategorie stoja nizej pelnymi sekcjami
   z kaflami, wiec pasek dublowal strukture strony, nic nie wnoszac. Razem z nim zdjete
   scroll-behavior:smooth (bylo wylacznie dla skokow z chipow). */

/* sekcja tematyczna dzialu - naglowek .tm-shead jest ten sam co w sekcjach strony glownej.
   scroll-margin-top zostaje mimo zdjecia chipow: sekcje maja id, wiec mozna do nich trafic
   linkiem z zewnatrz, a bez zapasu belka sticky (#tmStick) zaslonilaby naglowek. */
.tm-dzsec{margin:26px 0 0;scroll-margin-top:86px}
.tm-dzsh{margin-bottom:14px}
/* siatka sekcji tematycznej: pelna szerokosc kontenera, wiec piec kafli zamiast czterech
   (.tm-minis ma repeat(4,1fr) pod kolumne tresci 964 px) */
.tm-dzminis5{grid-template-columns:repeat(5,1fr)}
.tm-dzile{font:600 11.5px var(--f-lab);letter-spacing:.09em;text-transform:uppercase;color:var(--txt-3);white-space:nowrap}

/* "{Klub} - wyniki i tabela" (idea #381, pilotaż Grudziądz) - stoi w kolumnie głównej
   (.tm-mainc), NIE w sidebarze (decyzja 2026-09-15), więc szerokość kolumny (964 px) daje
   dość miejsca na tabelę + loga bez wewnętrznego podziału na dwie kolumny. Tabela reuse
   .tm-tbl, .tm-dzpntab tylko obcina domyślny margin-bottom:40px. */
.tm-dzpnhlogo{width:32px;height:32px;vertical-align:middle;margin-right:8px;object-fit:contain}
.tm-dzpnliga{color:var(--txt-2);font-size:13.5px;margin:0 0 14px}
.tm-dzpnsezony{margin-left:10px;font-size:12.5px}
.tm-dzpnsezony a,.tm-dzpnsezony strong{margin-right:8px}
.tm-dzpninfo{display:block;margin-top:4px;color:var(--txt-3);font-size:11.5px}
.tm-dzpnerr{color:var(--txt-2);font-size:13.5px}
.tm-dzpntab{margin-bottom:22px}
.tm-dzpnlogo{width:24px;height:24px;vertical-align:middle;object-fit:contain;flex:none}
/* herb PRZED nazwą (na życzenie 2026-09-15) - flex na elemencie WEWNĄTRZ komórki
   (ext/dzial/pnZespol.tpl), nie na <td>: display:flex na komórce wyjmuje ją z układu tabeli */
.tm-dzpnz{display:inline-flex;align-items:center;gap:8px;color:var(--txt);text-decoration:none;white-space:nowrap}
a.tm-dzpnz:hover span{text-decoration:underline}
.tm-dzpnja{font-weight:700;color:var(--txt-h)}
.tm-dzpntab tr.tm-dzpnme{background:var(--brand-bg)}
.tm-dzpntab tr.tm-dzpnme td{font-weight:600;color:var(--txt-h)}
.tm-dzpnmh{font:600 11.5px var(--f-lab);letter-spacing:.09em;text-transform:uppercase;color:var(--txt-3);margin:0 0 10px}
/* wynik jako kolorowa plakietka (zielony=wygrana, marka/czerwony=porażka, szary=remis); listy
   meczów to od 2026-09-19 wiersze .tm-pn-tm (ext/dzial/pnMecze.tpl), dawne "chipy" usunięte */
.tm-dzpnd{color:var(--txt-3);white-space:nowrap}
.tm-dzpnbadge{margin-left:auto;padding:2px 8px;border-radius:20px;font-weight:700;font-size:11.5px;color:#fff;white-space:nowrap}
.tm-dzpnf-w .tm-dzpnbadge,.tm-dzpnbadge.tm-dzpnf-w,.tm-dzpnfk.tm-dzpnf-w{background:#1c7c43}
.tm-dzpnf-p .tm-dzpnbadge,.tm-dzpnbadge.tm-dzpnf-p,.tm-dzpnfk.tm-dzpnf-p{background:var(--brand)}
.tm-dzpnf-r .tm-dzpnbadge,.tm-dzpnbadge.tm-dzpnf-r,.tm-dzpnfk.tm-dzpnf-r{background:var(--txt-3)}

/* Żywe dane (idea #381, 2026-09-17): przełącznik klubów miasta, mecz w toku i terminarz.
   Kropka przy meczu w toku pulsuje, ale tylko dla osób, które nie wyłączyły animacji. */
.tm-dzpnkluby{margin:0 0 14px;font-size:13px;color:var(--txt-2)}
.tm-dzpnklublab{color:var(--txt-3);margin-right:6px}
.tm-dzpnkluby a,.tm-dzpnkluby strong{margin-right:10px;white-space:nowrap}
.tm-pn-live{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 14px;padding:8px 12px;border:1px solid var(--brand);border-radius:7px;background:var(--brand-bg);font-size:13px;color:var(--txt-h)}
.tm-pn-livedot{width:9px;height:9px;border-radius:50%;background:var(--brand);flex:none}
.tm-pn-livetxt{font:600 11.5px var(--f-lab);letter-spacing:.09em;text-transform:uppercase;color:var(--brand)}
.tm-pn-livewyn{margin-left:auto;white-space:nowrap}
.tm-dzpnpm.tm-pn-live{display:inline-flex;margin:0;padding:4px 10px}
@media(prefers-reduced-motion:no-preference){
	.tm-pn-livedot{animation:tmPnLive 1.6s ease-in-out infinite}
	@keyframes tmPnLive{0%,100%{opacity:1}50%{opacity:.25}}
}
/* Listy meczów (ext/dzial/pnMecze.tpl, 2026-09-19: ostatnie, najbliższe, puchar): mecz = wiersz
   o stałych kolumnach, żeby termin, rywal, rozgrywki i wynik albo zapowiedź stały jeden pod drugim.
   Układ zależy od szerokości LISTY (@container), nie ekranu - przy 1024 px kolumna główna obok
   bocznej ma ok. 670 px. Szeroka: pięć kolumn; średnia: rozgrywki pod rywalem; wąska (telefon):
   termin z miejscem, rywal, rozgrywki z wynikiem albo zapowiedzią.
   Nazwa rywala się łamie, nie ucina (ellipsis ścina polskie znaki). */
.tm-pn-terminarz{container-type:inline-size;list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:6px}
.tm-pn-tm{display:grid;grid-template-columns:128px 96px minmax(0,1fr) 170px 96px;grid-template-areas:"data gdzie rywal liga zap";align-items:center;column-gap:14px;padding:8px 12px;border:1px solid var(--line);border-radius:7px;font-size:13px;color:var(--txt-2);background:#fff}
.tm-pn-tdata{grid-area:data;display:flex;flex-direction:column;line-height:1.3;font-size:12px;color:var(--txt-3);white-space:nowrap}
.tm-pn-tdata strong{font-size:13px;font-weight:600;color:var(--txt-h)}
.tm-pn-tst{color:var(--brand)}
.tm-pn-tgdzie{grid-area:gdzie;justify-self:start;padding:2px 8px;border:1px solid var(--hair);border-radius:20px;font:600 11px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-2);white-space:nowrap}
.tm-pn-tdom{border-color:var(--txt-h);background:var(--txt-h);color:#fff}
.tm-pn-trywal{grid-area:rywal;display:flex;align-items:center;gap:8px;min-width:0;font-weight:600;color:var(--txt-h);text-decoration:none}
a.tm-pn-trywal:hover,a.tm-pn-trywal:focus-visible{text-decoration:underline}
.tm-pn-tliga{grid-area:liga;font-size:12px;line-height:1.3;color:var(--txt-3)}
.tm-pn-twyn{grid-area:zap;justify-self:end;min-width:48px;padding:4px 10px;font-size:12.5px;text-align:center;background:var(--txt-3)}
.tm-pn-twyn.tm-pn-tlive{background:var(--brand)}
@container (max-width:759px){
	.tm-pn-tm{grid-template-columns:118px 96px minmax(0,1fr) 96px;grid-template-areas:"data gdzie rywal zap" "data gdzie liga zap";row-gap:1px}
	.tm-pn-trywal{align-self:end}
	.tm-pn-tliga{align-self:start;padding-left:32px}
}
@container (max-width:539px){
	.tm-pn-tm{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"data gdzie" "rywal rywal" "liga zap";row-gap:7px;padding:9px 12px}
	.tm-pn-tdata{flex-direction:row;align-items:baseline;gap:6px}
	.tm-pn-tgdzie{justify-self:end}
	.tm-pn-trywal,.tm-pn-tliga{align-self:center}
	.tm-pn-tliga{padding-left:0}
}
/* przeglądarki bez @container (Safari < 16) dostają układ wąski na telefonie */
@supports not (container-type:inline-size){@media(max-width:600px){
	.tm-pn-tm{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"data gdzie" "rywal rywal" "liga zap";row-gap:7px;padding:9px 12px}
	.tm-pn-tdata{flex-direction:row;align-items:baseline;gap:6px}
	.tm-pn-tgdzie{justify-self:end}
}}
@media(max-width:600px){.tm-pn-livewyn{margin-left:0;flex:1 1 100%}}

/* podstrona zespołu /sport/zespol/{id}/{slug} (idea #381, na życzenie 2026-09-15,
   ext/dzial/zespol.tpl) - tabele reuse .tm-tbl + .tm-dzpntab, dane klubu i rekordy sezonu
   jako <dl>, całość w kolumnie głównej. Tabele w .tm-dzpntabw (przewijanie w poziomie na
   telefonie zamiast rozpychania strony). */
.tm-dzpntabw{overflow-x:auto}
.tm-dzpnwroc{display:inline-block;margin-right:14px;white-space:nowrap}
.tm-dzpnzh{display:flex;align-items:center;gap:16px}
.tm-dzpnzlogo{width:72px;height:72px;object-fit:contain;flex:none}
.tm-dzpnsez{margin-right:14px}
.tm-dzpnsez a,.tm-dzpnsez strong{margin-left:8px}
.tm-dzpnforma{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin:0 0 6px}
.tm-dzpnforma .tm-dzpnmh{margin:0 8px 0 0}
.tm-dzpnfk{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:5px;color:#fff;font:700 11.5px var(--f-lab)}
.tm-dzpnklub{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;align-items:start;margin-bottom:18px}
.tm-dzpnstad img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:8px}
.tm-dzpndl{margin:0}
.tm-dzpndl>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:6px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.tm-dzpndl dt{color:var(--txt-2)}
.tm-dzpndl dd{margin:0;font-weight:600;color:var(--txt-h);text-align:right}
.tm-dzpndl2{display:grid;grid-template-columns:1fr 1fr;column-gap:28px}
.tm-dzpnmh2{margin-top:6px}
.tm-dzpntren{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.tm-dzpntren li{display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border:1px solid var(--line);border-radius:8px;background:#fff}
.tm-dzpntren img{display:block;width:48px;height:48px;border-radius:50%;object-fit:cover;background:var(--band)}
.tm-dzpntren li>span{display:flex;flex-direction:column;font-size:13.5px}
.tm-dzpnstat th+th,.tm-dzpnstat td+td,.tm-dzpnkadra th+th,.tm-dzpnkadra td+td,.tm-dzpnmtab td:nth-child(4),.tm-dzpnmtab th:nth-child(4){text-align:center}
.tm-dzpnmtab .tm-dzpnbadge{display:inline-block;margin:0}
.tm-dzpnkadra tr.tm-dzpngr th{padding-top:14px;color:var(--txt-h);border-bottom:1px solid var(--line)}
.tm-dzpnkadra abbr{text-decoration:none;cursor:help}
.tm-dzpntab tr.tm-dzpnjat{background:var(--band)}
.tm-dzpntab tr.tm-dzpnjat td{font-weight:600}
@media(max-width:700px){.tm-dzpnklub,.tm-dzpndl2{grid-template-columns:1fr}.tm-dzpnzlogo{width:52px;height:52px}}

/* strona meczu /sport/mecz/{id}/{slug} (idea #381, 2026-09-19, ext/dzial/mecz.tpl) oraz strzelcy
   i odsyłacze "zapowiedź" przy listach meczów w dziale i na podstronie zespołu. Tablica wyniku
   w trzech kolumnach (gospodarz, wynik, gość), przebieg jako lista: gospodarz od lewej, gość od
   prawej. Nazwiska się łamią - bez ellipsis (ścina polskie znaki). */
.tm-pnm-strz{display:block;margin-top:3px;font-size:11.5px;line-height:1.35;color:var(--txt-3);white-space:normal}
.tm-pn-zap{grid-area:zap;justify-self:end;padding:3px 11px;border:1px solid var(--brand);border-radius:20px;font-size:12px;font-weight:600;line-height:1.4;color:var(--brand);text-decoration:none;white-space:nowrap}
.tm-pn-zap:hover,.tm-pn-zap:focus-visible{background:var(--brand-bg);color:var(--brand-h)}
a.tm-dzpnbadge{text-decoration:none}
a.tm-dzpnbadge:hover,a.tm-dzpnbadge:focus-visible{text-decoration:underline}
.tm-pnm-tablica{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:start;gap:16px;margin:0 0 16px;padding:18px 16px;border:1px solid var(--line);border-radius:10px;background:#fff;text-align:center}
.tm-pnm-live{border-color:var(--brand);background:var(--brand-bg)}
.tm-pnm-zesp{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.tm-pnm-zesp img{width:64px;height:64px;object-fit:contain}
.tm-pnm-zesp a{font-weight:700;font-size:15px;color:var(--txt-h);text-decoration:none}
.tm-pnm-zesp a:hover{text-decoration:underline}
.tm-pnm-wynik{display:flex;flex-direction:column;align-items:center;gap:4px;padding-top:10px}
.tm-pnm-wynik strong{font:700 40px/1.1 var(--f-lab);color:var(--txt-h);white-space:nowrap}
.tm-pnm-wynik .tm-pnm-godz{font-size:28px}
.tm-pnm-stat{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--txt-2)}
.tm-pnm-pol{font-size:12px;color:var(--txt-3)}
.tm-pnm-info{margin-bottom:12px}
.tm-pnm-przebieg{list-style:none;margin:0 0 18px;padding:0;border-top:1px solid var(--line)}
.tm-pnm-z{display:flex;align-items:center;gap:10px;padding:7px 4px;border-bottom:1px solid var(--line);font-size:13.5px}
.tm-pnm-przebieg .tm-pnm-zA{flex-direction:row-reverse;text-align:right}
.tm-pnm-min{flex:none;width:46px;font:600 12.5px var(--f-lab);color:var(--txt-3)}
.tm-pnm-zA .tm-pnm-min{text-align:right}
.tm-pnm-ikona{flex:none;display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:50%;background:var(--txt-3);color:#fff;font:700 8px var(--f-lab)}
.tm-pnm-t-gol .tm-pnm-ikona,.tm-pnm-t-karny .tm-pnm-ikona{background:#1c7c43}
.tm-pnm-t-samobojczy .tm-pnm-ikona{background:var(--brand)}
.tm-pnm-t-pudlo .tm-pnm-ikona{background:transparent;border:2px solid var(--txt-3)}
.tm-pnm-t-zolta .tm-pnm-ikona,.tm-pnm-t-zolta2 .tm-pnm-ikona,.tm-pnm-t-czerwona .tm-pnm-ikona{width:10px;border-radius:2px}
.tm-pnm-t-zolta .tm-pnm-ikona{background:#f2c200}
.tm-pnm-t-zolta2 .tm-pnm-ikona{background:linear-gradient(135deg,#f2c200 50%,#d0021b 50%)}
.tm-pnm-t-czerwona .tm-pnm-ikona{background:#d0021b}
.tm-pnm-t-zmiana .tm-pnm-ikona{background:transparent;color:var(--txt-3);font-size:14px}
.tm-pnm-t-zmiana .tm-pnm-ikona::before{content:"\21C4"}
.tm-pnm-t-var .tm-pnm-ikona{width:auto;padding:0 3px;border-radius:3px}
.tm-pnm-t-var .tm-pnm-ikona::before{content:"VAR"}
.tm-pnm-opis{min-width:0}
.tm-pnm-t-zmiana .tm-pnm-opis strong{font-weight:600}
.tm-pnm-zw{margin-left:4px;padding:1px 7px;border-radius:10px;background:var(--band);font-weight:700;font-size:12px;color:var(--txt-h)}
.tm-pnm-dod{display:block;font-size:12px;color:var(--txt-3)}
.tm-pnm-seria{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;font-size:13px}
.tm-pnm-seria .tm-pnm-zA{grid-column:2;text-align:right}
.tm-pnm-karny{display:inline-block;padding:1px 7px;border-radius:10px;font-size:11px;font-weight:700;color:#fff}
.tm-pnm-traf{background:#1c7c43}
.tm-pnm-pud{background:var(--brand)}
.tm-pnm-sklady{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.tm-pnm-gracze{list-style:none;margin:0 0 8px;padding:0;font-size:13.5px}
.tm-pnm-gracze li{display:flex;align-items:baseline;gap:8px;padding:4px 0;border-bottom:1px solid var(--line)}
.tm-pnm-nr{flex:none;width:24px;text-align:right;font:600 12px var(--f-lab);color:var(--txt-3)}
.tm-pnm-poz{margin-left:auto;font-size:11px;color:var(--txt-3);text-decoration:none;cursor:help}
.tm-pnm-rezl{margin:10px 0 4px;font:600 11.5px var(--f-lab);letter-spacing:.09em;text-transform:uppercase;color:var(--txt-3)}
.tm-pnm-rez li{color:var(--txt-2)}
.tm-pnm-miejsce{margin:0 0 8px;font-size:13.5px;color:var(--txt-2)}
.tm-pnm-forma{list-style:none;margin:0;padding:0;font-size:13px}
.tm-pnm-forma li{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:5px 0;border-bottom:1px solid var(--line)}
.tm-pnm-fl{color:var(--txt);text-decoration:none}
.tm-pnm-fl:hover{text-decoration:underline}
.tm-pnm-stats td{text-align:center;vertical-align:middle}
.tm-pnm-stats th:first-child,.tm-pnm-stats td:first-child{text-align:left;font-weight:600}
.tm-pnm-stats th:last-child,.tm-pnm-stats td:last-child{text-align:right;font-weight:600}
.tm-pnm-stats th:nth-child(2){text-align:center}
.tm-pnm-snazwa{display:block;font-size:12.5px;color:var(--txt-2)}
.tm-pnm-pasek{display:block;height:5px;margin-top:4px;border-radius:3px;background:var(--line);overflow:hidden}
.tm-pnm-pasek span{display:block;height:100%;background:var(--ac,var(--brand))}
.tm-pnm-bilans{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:baseline;margin:0 0 12px;font-size:13.5px;color:var(--txt-2)}
.tm-pnm-bilans strong{font-size:18px;color:var(--txt-h)}
/* Pogoda na mecz (idea #374, zadanie 7) - zapowiedź meczu, ext/dzial/mecz.tpl */
.tm-pnm-pogoda{display:flex;gap:14px;align-items:center;padding:14px 16px;background:#fff;border:1px solid var(--line);border-radius:10px}
.tm-pnm-pogoda img{flex:none}
.tm-pnm-pogc{min-width:0}
.tm-pnm-pogm{margin:0 0 2px;font-weight:700;color:var(--txt-h)}
.tm-pnm-pogo{margin:0 0 6px;color:var(--txt-2);font-size:13.5px}
.tm-pnm-pogd{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;margin:0;font-size:13px;color:var(--txt-2)}
.tm-pnm-pogtemp{font-weight:700;font-size:22px;color:var(--txt-h)}
@media(max-width:700px){.tm-pnm-sklady{grid-template-columns:1fr}.tm-pnm-tablica{gap:8px;padding:14px 8px}.tm-pnm-wynik strong{font-size:32px}.tm-pnm-wynik .tm-pnm-godz{font-size:24px}.tm-pnm-zesp img{width:48px;height:48px}.tm-pnm-zesp a{font-size:13.5px}.tm-pnm-min{width:38px}.tm-pnm-pogoda{padding:12px;gap:10px}.tm-pnm-pogtemp{font-size:19px}}

/* pełna tabela ligi /sport/tabela/{ligaId}/{slug} (ext/dzial/tabela.tpl, 2026-09-15): strefa
   awansu/spadku jako pasek w komórce z numerem miejsca (inset box-shadow - bez przesuwania
   kolumn), ten sam kolor w legendzie; forma jako małe klocki .tm-dzpnfk */
.tm-dzpntab{--st-a:#1c7c43;--st-ab:#7cc38f;--st-sb:#e8a33d;--st-s:var(--brand);--st-i:var(--txt-3)}
.tm-dzpnleg{--st-a:#1c7c43;--st-ab:#7cc38f;--st-sb:#e8a33d;--st-s:var(--brand);--st-i:var(--txt-3)}
.tm-dzpnpoz{white-space:nowrap}
.tm-dzpnst-a .tm-dzpnpoz{box-shadow:inset 3px 0 0 var(--st-a)}
.tm-dzpnst-ab .tm-dzpnpoz{box-shadow:inset 3px 0 0 var(--st-ab)}
.tm-dzpnst-sb .tm-dzpnpoz{box-shadow:inset 3px 0 0 var(--st-sb)}
.tm-dzpnst-s .tm-dzpnpoz{box-shadow:inset 3px 0 0 var(--st-s)}
.tm-dzpnst-i .tm-dzpnpoz{box-shadow:inset 3px 0 0 var(--st-i)}
.tm-dzpnlt th+th+th,.tm-dzpnlt td+td+td{text-align:center}
.tm-dzpnlt abbr{text-decoration:none;cursor:help}
.tm-dzpnfor{white-space:nowrap}
.tm-dzpnfkm{width:18px;height:18px;margin-right:2px;border-radius:4px;font-size:10px}
.tm-dzpnleg{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12.5px;color:var(--txt-2)}
.tm-dzpnleg li{display:flex;align-items:center;gap:6px}
.tm-dzpnleg span{width:12px;height:12px;border-radius:3px;background:var(--st-i)}
.tm-dzpnleg .tm-dzpnst-a span{background:var(--st-a)}
.tm-dzpnleg .tm-dzpnst-ab span{background:var(--st-ab)}
.tm-dzpnleg .tm-dzpnst-sb span{background:var(--st-sb)}
.tm-dzpnleg .tm-dzpnst-s span{background:var(--st-s)}
.tm-dzpnpelna{margin:-12px 0 18px}
/* odsyłacze #dzh-pilka (pasek, widget, tabela ligi) celują w <h2>, a scroll-margin ma tylko
   .tm-dzsec - bez tego belka sticky zasłania nagłówek sekcji po skoku */
.tm-dzpn .tm-stit{scroll-margin-top:86px}

/* pasek klubu miasta pod leadem działu Sport (idea #381, 2026-09-15) - zapowiedź sekcji
   z tabelą, która stoi niżej, pod artykułami. Odsyłacze w stylu .tm-dznotL (pasek walut). */
.tm-dzpnpas{margin-top:14px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding:10px 14px;border:1px solid var(--line);border-left:3px solid var(--ac,var(--brand));border-radius:8px;background:#fff}
.tm-dzpnpk{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--txt);text-decoration:none}
.tm-dzpnpk .tm-dzpnhlogo{margin-right:0}
.tm-dzpnpk strong{color:var(--txt-h)}
.tm-dzpnpk span{color:var(--txt-2);font-size:13.5px}
.tm-dzpnpk:hover strong{text-decoration:underline}
.tm-dzpnpm{font-size:13px;color:var(--txt-2)}
.tm-dzpnpm .tm-dzpnbadge{margin:0 3px}
.tm-dzpnpl{display:flex;flex-wrap:wrap;gap:4px 14px;margin-left:auto}

/* boks "{Klub} w tabeli" w sekcji Sport na SG miasta (ext/S/NT3pilkaNozna.tpl) - kolumna
   .tm-gCr 300 px; nagłówek i odsyłacz w języku boksu "Biegi" (.tm-biegi-lh, .tm-biegi-d).
   Nazwy zespołów się łamią (bez ellipsis - ścina polskie znaki), stąd white-space:normal. */
.tm-pnw{display:flex;flex-direction:column;gap:10px}
.tm-pnw-lh{margin:0;font:600 12px var(--f-lab);letter-spacing:.14em;text-transform:uppercase;color:var(--dark);padding-bottom:6px;border-bottom:2px solid var(--ac,var(--brand))}
.tm-pnw-k{display:flex;align-items:center;gap:11px;text-decoration:none}
.tm-pnw-k img{flex:none;width:44px;height:44px;object-fit:contain}
.tm-pnw-kb{display:flex;flex-direction:column;gap:2px;min-width:0}
.tm-pnw-kb strong{font-size:15px;color:var(--txt-h)}
.tm-pnw-kb span{font-size:12.5px;color:var(--txt-2)}
.tm-pnw-k:hover strong{color:var(--ac-dark,var(--ac,var(--brand)))}
.tm-pnw-m{display:flex;flex-direction:column;gap:5px;padding:9px 11px;border-radius:8px;background:var(--band)}
.tm-pnw-ml{font:600 11px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--ac-dark,var(--ac,var(--brand)))}
.tm-pnw-mw{display:flex;align-items:center;flex-wrap:wrap;gap:4px 7px;font-size:13px;color:var(--txt)}
.tm-pnw-mw .tm-dzpnbadge{margin:0}
.tm-pnw-t{width:100%;border-collapse:collapse;font-size:13px}
.tm-pnw-t td{padding:6px 4px;border-bottom:1px solid var(--line);vertical-align:middle}
.tm-pnw-t .tm-dzpnz{white-space:normal;gap:7px}
.tm-pnw-t .tm-dzpnlogo{width:20px;height:20px}
.tm-pnw-poz{width:26px;color:var(--txt-3)}
.tm-pnw-pkt{text-align:right;white-space:nowrap;color:var(--txt-2)}
.tm-pnw-t tr.tm-pnw-ja{background:var(--brand-bg)}
.tm-pnw-t tr.tm-pnw-ja td{font-weight:600;color:var(--txt-h)}
.tm-pnw-all{align-self:flex-start;font:600 11.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--ac-dark,var(--ac,var(--brand)));text-decoration:none}
.tm-pnw-all:hover{text-decoration:underline}
.tm-pnw-forma{display:flex;align-items:center;gap:4px;margin-top:-2px}
.tm-pnw-fl{margin-right:6px;font:600 11px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--txt-3)}
.tm-pnw-forma .tm-dzpnfk{margin:0;cursor:help}
/* kafel "Najbliższy mecz" w siatce sekcji Sport SG miasta (NT3pilkaMeczKafel, 2026-10-10): w rzędzie z kaflami
   zdjęciowymi .tm-oc-m (3/2), więc ciemne tło w kolorze sekcji i biały tekst; stretch wyrównuje do wysokości rzędu,
   herby na białym krążku, bo bywają ciemne */
.tm-pnk{display:flex;flex-direction:column;justify-content:space-between;gap:8px;align-self:stretch;min-width:0;padding:12px 14px;border-radius:8px;background:linear-gradient(140deg,#3f9142,#1f5a24);color:#fff;text-decoration:none}
.tm-pnk-lab{font:600 11px var(--f-lab);letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.tm-pnk-dr{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:start;gap:6px}
.tm-pnk-z{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0;text-align:center;font:600 13px/1.25 var(--f-ui);overflow-wrap:anywhere}
.tm-pnk-z img{width:40px;height:40px;padding:4px;box-sizing:content-box;border-radius:50%;background:#fff;object-fit:contain}
.tm-pnk-vs{padding-top:17px;font:700 15px var(--f-ui);opacity:.7}
.tm-pnk-t{font-size:13px;text-align:center}
.tm-pnk-t b{display:inline-block;margin-left:4px;padding:1px 7px;border-radius:10px;background:#fff;color:#1f5a24;font:700 11.5px/1.5 var(--f-lab)}
.tm-pnk-s{margin-top:-4px;font-size:12px;text-align:center;opacity:.8}
.tm-pnk:hover .tm-pnk-z span,.tm-pnk:focus-visible .tm-pnk-z span{text-decoration:underline}
/* telefon: w połowie szerokości nazwy klubów łamały się w środku słowa - kafel na całą szerokość, a ostatni z trzech
   kafli artykułów (zostałby sam w rzędzie) też na dwie kolumny */
@media(max-width:560px){.tm-gCm>.tm-pnk{grid-column:span 2}.tm-gCm>.tm-pnk~.tm-oc-m:last-child:nth-child(odd){grid-column:span 2}}
/* "Najczęściej czytane" z miniaturą w kolumnie sekcji Sport (NT3topFoto, 2026-10-10); bez zdjęcia pusty kafelek */
.tm-topf{display:flex;flex-direction:column}
.tm-tf{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);text-decoration:none}
.tm-tf:last-child{border-bottom:0}
.tm-tf-th{flex:none;width:72px;height:54px;border-radius:5px;overflow:hidden;background:var(--band)}
.tm-tf-th img{display:block;width:100%;height:100%;object-fit:cover}
.tm-tf-t{font-size:13px;font-weight:500;line-height:1.35;color:var(--txt-h)}
.tm-tf:hover .tm-tf-t,.tm-tf:focus-visible .tm-tf-t{color:var(--ac-dark,var(--ac,var(--brand)));text-decoration:underline}

/* DRUGI blok dwukolumnowy: od trzeciej sekcji tematycznej w dol tresc wraca do weszej kolumny,
   a obok staje kolumna z reklama B1, ktora jedzie z czytelnikiem az do konca bloku. Pierwsza
   sekcja w tej kolumnie nie dokłada juz swojego marginesu - odstep daje sam blok, inaczej
   przerwa przed "Rynkiem pracy" bylaby dwa razy wieksza niz miedzy pozostalymi sekcjami.
   Ta sama klasa (.tm-dzcols2) sluzy tez stronom 2+ dzialu (start.tpl): tam drugi blok nie
   powstaje z grup, tylko z drugiej polowy siatki .tm-dzgridP - B1 w sidebarze "od pewnego
   miejsca" zamiast poziomego bloku w srodku listy (decyzja z 2026-09-04). */
.tm-dzcols2{margin-top:26px}
.tm-dzcols2 .tm-dzsec:first-child{margin-top:0}
/* Sekcje w tej kolumnie NIE dostaja .tm-dzminis5 - zostaja przy bazowej .tm-minis, ktora ma
   cztery kolumny i wlasny prog 880 px (dwie kolumny na telefonie). Wlasna regula na czworke
   bylaby tu bledem: ".tm-dzsecW .tm-minis" ma wyzsza specyficznosc niz ".tm-minis" w media
   query, wiec wygralaby takze na telefonie i kafle mialyby po 75 px szerokosci.
   Szablon wysyla do tych sekcji osiem kafli (dwa pelne rzedy po cztery) zamiast dziesieciu
   pobranych (ext/dzial.php, ILOSC_GRUPA) - decyzja 2026-09-05. */

/* Na stronie dzialu nie ma juz ani sekcji "Rynek w liczbach" (.tm-qcta*, .tm-dzsrc), ani boksu
   surowcow w sidebarze (.tm-dzsur) - komplet notowan stoi w pasku pod leadem, w jednej linii
   z walutami, a pelne wykresy na /notowania (decyzja z 2026-09-04). Usuniete stad reguly
   dotyczyly wylacznie tych dwoch. .tm-qgrid4 i .tm-surtile ZOSTAJA nietkniete - korzystaja
   z nich /notowania, modul mojeArtykuly i kafelek surowcow na stronie glownej. */

/* Reklama B1 przeniesiona z sidebara miedzy sekcje tematyczne. Rezerwacja wysokosci (min-height
   pod najnizsza realna kreacje) jest tu wazniejsza niz w kolumnie bocznej: blok stoi w srodku
   strumienia tresci, wiec kreacja doladowana asynchronicznie przesuwalaby cala reszte strony. */
.tm-dzrek{display:flex;justify-content:center;align-items:center;min-height:106px;margin:26px 0 0}
.tm-dzrek:empty{display:none}

/* paginacja - pigulki jak przelacznik zakresu w /notowania (.tm-zakresB), zeby portal nie mial
   dwoch roznych jezykow dla tego samego gestu */
.tm-dzpag{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:22px 0 8px}
.tm-dzpa{display:inline-block;padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 13px var(--f-lab);color:var(--txt-2);text-decoration:none;transition:border-color .2s,color .2s,background .2s}
a.tm-dzpa:hover{border-color:var(--ac,var(--brand));color:var(--ac,var(--brand))}
.tm-dzpaOn{background:var(--ac,var(--brand));border-color:var(--ac,var(--brand));color:#fff}
.tm-dzpaP,.tm-dzpaN{font-family:var(--f-ui);font-size:12.5px}
.tm-dzinfo{font-size:12.5px;color:var(--txt-3);margin:0 0 26px}
.tm-dzpusto{padding:34px;text-align:center;color:var(--txt-2)}

/* Wlasne progi dla .tm-dzminis5: regula bazowa stoi na koncu arkusza, wiec wygralaby
   z breakpointami .tm-minis z linii ~1443 (ta sama specyficznosc, decyduje kolejnosc)
   i piec kolumn zostaloby az do telefonu. */
@media(max-width:1200px){.tm-dzminis5{grid-template-columns:repeat(4,1fr)}}
@media(max-width:1000px){.tm-dzminis5{grid-template-columns:repeat(3,1fr)}}
@media(max-width:880px){.tm-dzminis5{grid-template-columns:repeat(2,1fr)}}
/* .tm-dzgridP schodzi do dwoch kolumn razem z bazowa .tm-minis (telefon, sidebar juz pod
   trescia) - trzy waskie kafle w rzedzie na 390 px bylyby nieczytelne */
@media(max-width:880px){.tm-dzgridP{grid-template-columns:repeat(2,1fr)}}

@media(max-width:880px){
 /* Na waskim ekranie material otwierajacy idzie sam, a dwa kafle spod niego ustawiaja sie
    w dwie kolumny - tak samo jak .tm-minis nizej. Gdyby zostaly jedna kolumna, mielibysmy
    trzy kafle pelnej szerokosci z rzedu, a potem nagle siatke 2x - schodek bez uzasadnienia. */
 .tm-dzlead{grid-template-columns:1fr}
 .tm-dzside2{grid-template-rows:auto;grid-template-columns:repeat(2,1fr)}
 .tm-dzside2 .tm-oc-m{aspect-ratio:3/2}
 .tm-dzt{font-size:26px;margin-left:0;padding-left:14px}
 /* tytul na materiale otwierajacym: 25 px zajmowalo na telefonie polowe zdjecia i i tak
    bylo ucinane wielokropkiem */
 .tm-dzbig .tm-oct{font-size:19px}
}

/* =====================================================================================
   MODUŁ ZAPISY (pomysł #310) - lista na /zapisy i karta biegu /zapisy/bieg/{id}-{slug}
   =====================================================================================
   Blok stoi na KOŃCU arkusza świadomie: reguły .tm-zap* przyszły tu 2026-09-05 z
   <style> wewnątrz smarty/templates/ext/zapisy/info.tpl, gdzie siedziały tymczasowo
   ("do przeniesienia do css.css przy najbliższej okazji" - nagłówek tego szablonu).
   Okazją była przebudowa karty biegu: karta MUSI mówić tym samym językiem co kafel, z
   którego się na nią wchodzi, a nie mogła, dopóki klasy były zamknięte w innym szablonie.

   AKCENT KARTY TO --brand (czerwień marki), nie zieleń Sportu. Powód: kafel na /zapisy
   (.tm-zap-d w infoKarta.tpl) jest czerwony, a karta jest jego celem - jedno i drugie
   musi się zgadzać. Przełączenie CAŁEGO modułu na kolor sekcji Sport (--sec-sport /
   --ac-dark-sport) jest osobną decyzją projektową: wtedy trzeba zmienić kafel, boks
   "Biegi", kreskę .tm-h1k i tę sekcję razem, a nie samą kartę.

   Kontrast: etykiety i teksty pomocnicze idą na var(--txt-2) (#626b79 = 5,9:1 na bieli).
   Zabroniony jest tu #aaa z klas legacy (.cSzary w compat.css) - 2,32:1, poniżej AA.
   ===================================================================================== */

/* --- A. LISTA ZAWODÓW na /zapisy (przeniesione z info.tpl, bez zmian wizualnych) --- */
.tm-zap-list{display:grid;gap:12px;margin:0 0 26px}
.tm-zap{display:grid;grid-template-columns:120px 1fr;gap:16px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--card-sh);padding:14px}
.tm-zap-ph{display:block;width:120px;height:120px;border-radius:10px;overflow:hidden;background:var(--band)}
.tm-zap-ph img{width:100%;height:100%;object-fit:cover;display:block}
.tm-zap-nofoto{display:flex;align-items:center;justify-content:center;text-align:center;color:var(--brand);font:600 13px/1 var(--f-lab);letter-spacing:.08em;text-transform:uppercase}
.tm-zap-nofoto b{display:block;font:700 40px/1 var(--f-ui);letter-spacing:-.02em;margin-bottom:4px}
.tm-zap-b{display:flex;flex-direction:column;gap:6px;min-width:0}
.tm-zap-d{font:600 12px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--brand)}
.tm-zap-t{margin:0;font:700 18px/1.25 var(--f-ui)}
.tm-zap-t a{color:var(--txt-h)}
.tm-zap-m{font-size:13.5px;color:var(--txt-2);line-height:1.45}
.tm-zap-city{display:block;font-size:12.5px}
.tm-zap-act{margin-top:auto;padding-top:6px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.tm-zap-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 26px}
.tm-zap-step{padding:14px 16px;border:1px solid var(--line);border-radius:10px;font-size:13.5px;color:var(--txt-2);line-height:1.5}
.tm-zap-step b{display:block;color:var(--txt);font-size:15px;margin-bottom:4px}
.tm-zap-org{margin-top:8px;padding:18px 20px;border-radius:12px;background:var(--band)}
.tm-zap-org h2{margin:0 0 8px;font-size:18px}
.tm-zap-org p{margin:0 0 12px;font-size:14px;color:var(--txt-2);line-height:1.5}

/* --- B. PIGUŁKI STANU ZAPISÓW - wspólne dla listy i karty ---
   Jedno słownictwo w całym module: "zapisy otwarte" zielono, "brak wolnych miejsc"
   czerwono, każdy inny stan neutralnie. Teksty daje ZapisyZawodyRepo::etykietaStatusu(),
   więc szablon nigdy nie wymyśla własnych. Kolor NIE jest jedynym nośnikiem informacji -
   treść pigułki mówi to samo słowami (WCAG 1.4.1). */
.tm-zap-s{display:inline-block;padding:3px 10px;border-radius:999px;font:600 12px var(--f-lab);background:var(--band);color:var(--txt-2)}
.tm-zap-sOn{background:#e6f4ea;color:#1e7b34}
.tm-zap-sFull{background:#fdecec;color:#b3261e}
/* Licznik wolnych miejsc - OSOBNA pigułka obok pigułki stanu, nie doklejka do niej.
   Pigułka stanu mówi, CZY można się zapisać, licznik - ILE miejsc zostało; sklejone
   w jeden napis rozpychały pigułkę i wymuszały drugi, skrócony format w ciasnych
   miejscach (kafel listy, kolumna 300 px). Napis składa ZapisyZawodyRepo::etykietaMiejsc()
   i zawsze zaczyna się od słów "wolne miejsca:", więc "0 / 150" nigdy nie stoi samo -
   zero pozostaje czytelne bez koloru (WCAG 1.4.1, ta sama reguła co dla pigułek wyżej).
   Kolor tekstu podstawowy, nie --txt-2: to liczba, po którą użytkownik tu przyszedł. */
.tm-zap-miejsca{display:inline-block;padding:3px 10px;border-radius:999px;font:600 12px var(--f-lab);background:var(--band);color:var(--txt)}

/* --- C. KARTA BIEGU (bieg.tpl) --- */
/* hero: plakat po lewej, wszystko, po co użytkownik przyszedł, po prawej. Do 2026-09-05
   zdjęcie 280x280 wisiało samo nad metryczką, a obok niego stało pół kolumny pustki. */
.tm-zapk-hero{display:grid;grid-template-columns:280px 1fr;gap:26px;align-items:start;margin:0 0 22px}
.tm-zapk-foto{display:block;width:280px;border-radius:10px;overflow:hidden;background:var(--band)}
.tm-zapk-foto img{display:block;width:100%;height:auto}
.tm-zapk-hb{display:flex;flex-direction:column;gap:10px;min-width:0}
/* data jest tu informacją pierwszego rzędu, nie metryczką - ten sam wygląd co .tm-zap-d
   na kaflu listy, żeby przejście z listy na kartę nie wyglądało jak zmiana serwisu */
.tm-zapk-data{font:600 12.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--brand)}
/* własny h1 karty zamiast .tm-h1k: kreska z lewej i ujemny margines .tm-h1k są zrobione
   pod nagłówek stojący bezpośrednio w .tm-pagecard, a tutaj h1 siedzi w prawej kolumnie
   siatki hero - kreska wjeżdżałaby na zdjęcie */
.tm-zapk-h1{margin:0;font:700 30px/1.16 var(--f-ui);letter-spacing:-.01em;color:var(--txt-h);text-wrap:balance}
.tm-zapk-meta{font-size:14.5px;color:var(--txt-2);line-height:1.45}
.tm-zapk-meta b{color:var(--txt);font-weight:600}
.tm-zapk-stan{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
/* "start bezpłatny" - argument sprzedażowy usługi, którego karta dotąd nie wypowiadała */
.tm-zapk-free{display:inline-block;padding:3px 10px;border-radius:999px;font:600 12px var(--f-lab);background:#eef4fa;color:#15588c}
/* pasek akcji: przycisk zapisu MUSI być tutaj, w pierwszym ekranie. Wcześniej stał pod
   tabelą dystansów, około 2,5 ekranu telefonu od nagłówka */
.tm-zapk-cta{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin-top:4px}
.tm-zapk-btn{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(180deg,#e04b56,var(--brand));color:#fff;font:600 14px var(--f-ui);padding:11px 20px;border-radius:999px;border:0;box-shadow:0 6px 16px -6px rgba(212,62,73,.55);cursor:pointer}
.tm-zapk-btn:hover{background:var(--brand-h)}
/* wariant nieaktywny: SZARY, nie niebieski. Wyłączony .btn-primary z compat.css wyglądał
   jak aktywny przycisk w kolorze sekcji Biznes i zapraszał do klikania */
.tm-zapk-btn[disabled]{background:var(--band);color:var(--txt-3);box-shadow:none;cursor:not-allowed}
/* wyjaśnienie stoi obok przycisku, dopóki się mieści, i schodzi pod niego przy węższej
   kolumnie (flex-wrap na .tm-zapk-cta). max-width trzyma wiersz w czytelnej mierze */
.tm-zapk-why{font-size:13.5px;color:var(--txt-2);line-height:1.4;max-width:56ch}
.tm-zapk-lnk{font-size:13.5px;font-weight:600;color:var(--brand);text-decoration:underline;text-underline-offset:2px}
.tm-zapk-lnk:hover{color:var(--brand-h)}

/* zakładki podstron biegu - karta / lista startowa / wyniki. Dotąd te przejścia siedziały
   drobnym drukiem w OSTATNIEJ kolumnie tabeli dystansów, gdzie nikt ich nie szukał */
.tm-zapk-tabs{display:flex;flex-wrap:wrap;gap:0 22px;margin:0 0 22px;border-bottom:2px solid var(--line)}
.tm-zapk-tabs a,.tm-zapk-tabs span{display:inline-block;padding:9px 2px;font:600 13.5px var(--f-ui);color:var(--txt-2);border-bottom:2px solid transparent;margin-bottom:-2px}
.tm-zapk-tabs a:hover{color:var(--brand)}
.tm-zapk-tabs [aria-current]{color:var(--txt-h);border-bottom-color:var(--brand)}

/* fakty jako lista definicyjna: etykieta ma swoją kolumnę, więc wartości są wyrównane -
   w szarej ramce legacy etykieta i wartość leciały jednym ciągiem w wierszu */
.tm-zapk-f{display:grid;grid-template-columns:160px 1fr;gap:0;margin:0 0 22px;font-size:14.5px}
.tm-zapk-f dt{padding:9px 0;color:var(--txt-2);border-top:1px solid var(--line)}
.tm-zapk-f dd{margin:0;padding:9px 0;color:var(--txt);border-top:1px solid var(--line);min-width:0;overflow-wrap:break-word}
/* pierwszy wiersz bez kreski: stoi tuz pod kreska naglowka .tm-notH2 i dawal podwojna linie */
.tm-zapk-f dt:first-of-type,.tm-zapk-f dd:first-of-type{border-top:0}
.tm-zapk-f dd a{color:var(--brand);text-decoration:underline;text-underline-offset:2px}

/* opis organizatora - 68ch, bo na pełnej szerokości karty wiersz miał ponad 120 znaków */
.tm-zapk-opis{font-size:15px;line-height:1.62;color:var(--txt);max-width:68ch;margin:0 0 22px}

/* dystanse jako kafle, nie tabela: tabela z pięcioma kolumnami na telefonie uciekała
   poza ekran razem z akcjami, a wiersz i tak opisuje JEDEN obiekt - to karta, nie dane */
.tm-zapk-dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,380px));justify-content:start;gap:14px;margin:0 0 22px}
.tm-zapk-d{display:flex;flex-direction:column;gap:8px;padding:16px;border:1px solid var(--line);border-radius:10px;background:#fff}
.tm-zapk-dh{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.tm-zapk-dn{font:600 15.5px/1.25 var(--f-ui);color:var(--txt-h);min-width:0}
.tm-zapk-dkm{flex:none;font:600 13px var(--f-lab);letter-spacing:.04em;color:var(--brand)}
.tm-zapk-dm{font-size:13px;color:var(--txt-2);line-height:1.45}
/* pasek obsadzenia limitu - sam nigdy nie niesie informacji, liczby stoją obok słowami */
.tm-zapk-bar{height:6px;border-radius:999px;background:var(--band);overflow:hidden}
.tm-zapk-bar span{display:block;height:100%;background:var(--ok);border-radius:999px}
.tm-zapk-barFull span{background:#b3261e}
.tm-zapk-do{margin:0;font-size:13.5px;line-height:1.5;color:var(--txt-2)}
.tm-zapk-dk{margin:0;font-size:12.5px;line-height:1.45;color:var(--txt-3)}
.tm-zapk-dk b{color:var(--txt-2);font-weight:600}
.tm-zapk-da{margin-top:auto;padding-top:4px;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;font-size:13px}
.tm-zapk-da a{color:var(--brand);text-decoration:underline;text-underline-offset:2px}
.tm-zapk-dbtn{display:inline-flex;align-items:center;background:var(--brand);color:#fff!important;font:600 12.5px var(--f-ui);padding:7px 14px;border-radius:999px;text-decoration:none!important}
.tm-zapk-dbtn:hover{background:var(--brand-h)}

/* podpis tabeli - NIE .cSzary z compat.css (#aaa, 2,32:1, poniżej AA) */
.tm-zapk-cap{caption-side:top;text-align:left;padding:0 0 8px;font-size:13px;color:var(--txt-2)}

/* komunikat błędu karty w języku motywu - .alert-warning z compat.css to obcy wtręt */
.tm-zapk-alert{background:#f7ecd3;border-left:4px solid #e5a100;border-radius:6px;padding:12px 16px;margin:0 0 16px;font-size:14px;color:#6b4d10}
.tm-zapk-back{margin:26px 0 0;padding-top:16px;border-top:1px solid var(--line);font-size:13.5px}
.tm-zapk-back a{color:var(--brand);font-weight:600;text-decoration:underline;text-underline-offset:2px}

@media(max-width:760px){
 .tm-zapk-hero{grid-template-columns:1fr;gap:16px}
 /* plakat na telefonie: 200 px zamiast 280 px i wyśrodkowany - pełna szerokość ekranu
    zjadałaby pierwszy ekran, na którym ma być data, nazwa i przycisk zapisu */
 .tm-zapk-foto{width:200px;margin:0 auto}
 .tm-zapk-h1{font-size:23px}
 .tm-zapk-f{grid-template-columns:1fr;gap:0}
 .tm-zapk-f dt{padding:9px 0 0;border-top:1px solid var(--line);font-size:12.5px}
 .tm-zapk-f dd{padding:2px 0 9px;border-top:0}
 .tm-zapk-dl{grid-template-columns:1fr}
 .tm-zap-steps{grid-template-columns:1fr}
 .tm-zap{grid-template-columns:88px 1fr;gap:12px}
 .tm-zap-ph{width:88px;height:88px}
 .tm-zap-nofoto b{font-size:30px}
}

/* --- D. GOŁE <a> W TREŚCI PODSTRONY ---
   Reset arkusza (a{color:inherit;text-decoration:none}, początek pliku) sprawia, że
   odnośnik bez klasy jest nieodróżnialny od tekstu. Na kartach podstron to komplet
   nawigacji krzyżowej, więc przywracamy wygląd odnośnika jak w treści artykułu
   (.tm-artcard .txt232 a). :has(img) wyłącza linki opakowujące SAMĄ grafikę - miniatura
   plakatu, awatary na /profil, oferta na /reklama - bo podkreślenie rysowałoby się
   kreską pod obrazkiem. Przeglądarka bez :has() pomija całą regułę, czyli zostaje
   dzisiejszy stan; :has() jest już w tym arkuszu używane wyżej.

   ZAKRES zawężony do TEKSTU BIEŻĄCEGO (p, li, dd, td), a nie do całej karty: nagłówki
   kart mają własny, celowo ciemny kolor odnośnika (.tm-zap-t a na liście /zapisy),
   a reguła obejmująca całą kartę ma wyższą specyficzność i zamieniała tytuł kafla na
   czerwony podkreślony. Akcent w tym module należy do daty, nie do tytułu. */
.tm-pagecard :is(p,li,dd,td) a:not([class]):not(:has(img)){color:var(--brand);text-decoration:underline;text-underline-offset:2px}
.tm-pagecard :is(p,li,dd,td) a:not([class]):not(:has(img)):hover{color:var(--brand-h)}


/* --- E. BOKS MODUŁU W SIDEBARZE PODSTRON /zapisy (NT3zapisyBiegiSide.tpl) ---
   Wariant boksu "Biegi" ze strony głównej miasta: te same klasy .tm-biegi*, ta sama
   szerokość kolumny (300 px - .tm-side i .tm-gC mają tu identyczny wymiar), więc panel
   zachęty i wiersze listy nie potrzebują ani jednej własnej reguły. Różnice są dwie
   i obie wynikają z tego, że w sidebarze /zapisy akcentem jest CZERWIEŃ MARKI, a nie
   zieleń sekcji Sport, którą boks dostaje inline na stronie głównej. */

/* Łańcuch var(--ac-dark,var(--ac,var(--brand))) w regułach .tm-biegi-* sięgnąłby po samo
   --brand (#d43e49), a biel na nim ma pod teksturą mniej niż wariant przygotowany do tego
   celu. --ac-dark-fakty to ten sam czerwony zmierzony pod biały tekst z teksturą: 4,88:1
   na płaskim tle i 4,50:1 pod JEDNĄ warstwą tekstury (tak liczy cała tabela --ac-dark-*
   w tym arkuszu, css.css:40-50). W prawym górnym narożniku panelu warstwy .tm-biegi-cta
   ::before nakładają się (paski + poświata, łączna alfa 1-(1-.06)^2 = .1164) i biel ma tam
   4,18:1 na 5,5% powierzchni - pomiar pikselowy 2026-09-05. Nie jest to skutek tej zmiany:
   zieleń już wdrożonego boksu na SG wypada w tym samym punkcie na 4,10:1. Domknięcie AA
   wymagałoby zejścia z --nofoto-tex do .03 dla całego wzorca, czyli osobnej decyzji
   o wyglądzie kafli typograficznych, nie łatki w tym bloku.
   Napis przycisku i data na bieli: 4,88:1. */
.tm-biegiSide{--ac-dark:var(--ac-dark-fakty)}
/* Miara wiersza. W kolumnie 300 px zbędna, ale poniżej 881 px .tm-side dostaje width:100%
   (css.css:103) i akapit zachęty szedłby przez całą szerokość treści - zmierzone 124 znaki
   w wierszu przy oknie 880 px. Blok C tego samego modułu trzyma prozę na 56-68ch, a boks
   stoi teraz na podstronie obok tak ograniczonej treści. */
.tm-biegiSide .tm-biegi-p{max-width:68ch}
/* Nazwa biegu jest treścią wpisaną przez organizatora: jeden ciąg bez spacji dłuższy niż
   kolumna rozpycha .tm-side (width:300px, flex:none) i daje poziomy pasek przewijania
   CAŁEJ strony. Skracanie w PHP (truncate:64) ogranicza długość, nie łamliwość. */
.tm-biegiSide .tm-biegi-t{overflow-wrap:anywhere}
/* Hover przycisku. Wariant z SG zmienia tło na --band (#f4f5f8), na którym czerwony napis
   ma 4,47:1, czyli tuż pod AA - w zielonym wariancie sekcji tego problemu nie ma (5,12:1).
   Czerwień dostaje więc jaśniejsze tło marki (--brand-bg) i ciemniejszy napis (--brand-h):
   zmierzone 5,40:1. */
.tm-biegiSide .tm-biegi-btn:hover{background:var(--brand-bg);color:var(--brand-h)}
/* Pigułka "zapisy otwarte" na SG jest tintem koloru sekcji (zielone tło + tekst w --ac-dark).
   Tutaj --ac-dark jest czerwone, więc bez tej reguły wyszedłby czerwony napis na zielonym
   tle. Kolory bierzemy z .tm-zap-sOn, czyli z tych samych pigułek, jakie moduł pokazuje
   w treści strony - jedno słownictwo i jeden kolor stanu w całym module. */
.tm-biegiSide .tm-biegi-sOn{background:#e6f4ea;color:#1e7b34}
/* Drugie wyjście z panelu zachęty: lista swoich zawodów u organizatora, status wniosku
   u pozostałych. Czysta biel bez przezroczystości - każde przyciemnienie zjada zapas
   kontrastu panelu (powód w komentarzu przy .tm-biegi-cta). */
.tm-biegiSide .tm-biegi-org{display:inline-block;margin-left:14px;color:#fff;font:600 12.5px var(--f-ui);text-decoration:underline;text-underline-offset:2px}
.tm-biegiSide .tm-biegi-org:hover{text-decoration:none}
/* "wszystkie" w nagłówku listy - tylko na karcie biegu, gdzie lista jest listą POZOSTAŁYCH
   zawodów; pojawia się dopiero przy dwóch aktywnych biegach, bo przy jednym lista jest po
   odsianiu pusta i cały boks .tm-w nie powstaje. .tm-wh jest flexem, więc margin-left:auto
   dosuwa odnośnik do prawej krawędzi; wielkie litery dziedziczy z nagłówka.
   Pełny łańcuch fallbacku (--ac-dark -> --ac -> --brand), a nie skrót do --brand: skrót
   działałby wbrew regule opisanej przy tabeli --ac-dark-* (css.css:32-38). */
.tm-biegiSide .tm-biegi-all{margin-left:auto;font:600 10.5px var(--f-lab);letter-spacing:.1em;color:var(--ac-dark,var(--ac,var(--brand)))}
.tm-biegiSide .tm-biegi-all:hover{text-decoration:underline}

/* --- F. FORMULARZ ZAPISU (/zapisy/bieg/{id}-{slug}/zapisz, biegZapisz.tpl) ---
   Przebudowa 2026-09-05. Formularz stał na klasach z compat.css (.form-control, .mb-3,
   .ramka, .padAA), czyli na warstwie zgodności z theme/1: 11 pól, każde w osobnym
   wierszu - imię, nazwisko, telefon, e-mail, dystans, klub i uwagi na pełną szerokość
   kolumny (835 px przy oknie 1280 px), a rocznik, płeć i koszulkę zwężały style inline
   wpisane w szablon. Granice między zawodnikami ginęły w rytmie pól - z odstępu nie było
   widać, gdzie kończy się jeden, a zaczyna drugi. Zmierzone w tej samej kolumnie i na tym
   samym arkuszu (stary układ odtworzony z jego własnych klas): wysokość formularza
   1504 -> 1053 px (-30%), blok jednego zawodnika 693 -> 271 px, wiersz pola 69 -> 60 px.

   Trzy decyzje układu, wszystkie na "mniej miejsca":
   1. pola parami w jednym wierszu (.tm-zapf-r) - sekcja zgłaszającego z 4 wierszy na 2
   2. pole ma rozmiar swojej treści, nie kolumny (.tm-zapf-rn: 130 px na rocznik)
   3. karta zawodnika ma pasek nagłówka z numerem (.tm-zapf-osh) - podział jest
      widoczny, a nie domyślany z odstępu

   AKCENT: --brand, jak cały moduł (powód w nagłówku tej sekcji). Kółka z numerami
   biorą --ac-dark-fakty, a nie samo --brand: biel na #d43e49 daje 4,29:1, a na #d23440
   4,88:1 (tabela --ac-dark-* w czubku arkusza) - w kółku 21 px tekst jest mały, więc
   AA obowiązuje w pełnej wysokości 4,5:1, nie w ulgowym progu dla dużego tekstu.
   Etykiety pól idą na --txt-2 (5,9:1), nigdy na .cSzary z compat.css (2,32:1). */
.tm-zapf{max-width:760px}
/* jedna linia "co się zapisuje" - termin, dystanse i "start bezpłatny" tym samym
   słownictwem co karta biegu, żeby po dystans nie trzeba było wracać na kartę */
.tm-zapf-what{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin:0 0 10px;font-size:13.5px;color:var(--txt-2)}
.tm-zapf-what time{font:600 12.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--brand)}
.tm-zapf-what b{color:var(--txt);font-weight:600}
.tm-zapf-lead{margin:0 0 18px;max-width:68ch;font-size:14px;line-height:1.5;color:var(--txt-2)}
.tm-zapf-lead b{color:var(--txt);font-weight:600}

.tm-zapf-sec{margin:0 0 24px}
/* nagłówek sekcji z numerem kroku: formularz ma trzy etapy (kto zgłasza, kogo zapisuje,
   na co się zgadza), a do 2026-09-05 były to gołe <h2> bez żadnej hierarchii */
.tm-zapf-sh{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding-bottom:8px;border-bottom:1px solid var(--line);font:600 17px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-zapf-nrs{display:inline-flex;align-items:center;justify-content:center;flex:none;width:24px;height:24px;border-radius:999px;background:var(--ac-dark-fakty);color:#fff;font:700 13px/1 var(--f-ui)}

/* WIERSZ PÓL. Domyślnie dwie równe kolumny - imię|nazwisko, telefon|e-mail, klub|uwagi.
   minmax(0,1fr) zamiast 1fr, bo pole z długą wartością rozpycha domyślną kolumnę grida
   (min-content inputa to jego atrybut size, nie zero). */
.tm-zapf-r{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;margin:0 0 10px}
.tm-zapf-r1{grid-template-columns:minmax(0,1fr)}
/* rocznik + płeć. KOLEJNOŚĆ REGUŁ MA ZNACZENIE: .tm-zapf-rn stoi na elemencie razem
   z .tm-zapf-r i ma tę samą specyficzność, więc wygrywa tylko dlatego, że jest niżej
   w pliku. Przy przenoszeniu bloku nie rozdzielać tych dwóch reguł. */
.tm-zapf-rn{grid-template-columns:130px 200px}

.tm-zapf-fld{display:flex;flex-direction:column;gap:4px;min-width:0}
.tm-zapf-lab{font:600 12.5px var(--f-lab);letter-spacing:.04em;color:var(--txt-2)}
/* dopiski "(opcjonalnie)", "(tu wyślemy link)" - <i> bez kursywy, słabszym kolorem */
.tm-zapf-lab i,.tm-zapf-zg i{font-style:normal;font-weight:400;color:var(--txt-3)}
/* POLE. Własny wygląd zamiast .form-control z compat.css (promień 4 px, obramowanie
   --line 1,3:1 wobec bieli - pola zlewały się z kartą). Obramowanie --hair, promień 9 px,
   wysokość 38 px. appearance:none zdejmuje też natywną strzałkę <select>, dlatego niżej
   jest własna (data URI) - bez niej select nie miałby żadnego sygnału rozwijania. */
.tm-zapf-in{display:block;width:100%;min-width:0;padding:9px 12px;font:400 15px/1.35 var(--f-ui);color:var(--txt);background:#fff;border:1px solid var(--hair);border-radius:9px;appearance:none;-webkit-appearance:none}
.tm-zapf-in:hover{border-color:var(--txt-3)}
/* :user-invalid, a NIE :invalid - to drugie maluje pole na czerwono od chwili wejścia
   na stronę (pole wymagane i puste jest nieprawidłowe od startu), czyli wita zawodnika
   formularzem w błędach, których jeszcze nie popełnił. Wariant z :placeholder-shown nie
   ratuje sprawy: bez atrybutu placeholder pseudoklasa nie dopasowuje się nigdy.
   Przeglądarka bez :user-invalid po prostu nie pokazuje tego stanu. */
/* fokus: obramowanie marki + poświata --brand-bg. Nie usuwać outline bez tego zamiennika -
   pierścień jest jedynym sygnałem fokusu dla nawigacji klawiaturą (WCAG 2.4.7). */
.tm-zapf-in:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-bg)}
:user-invalid.tm-zapf-in{border-color:#c9756f}
select.tm-zapf-in{padding-right:32px;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23626b79' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center}
/* strzałki przewijania w polu rocznika są tu bezużyteczne (rok wpisuje się z klawiatury),
   a zabierają szerokość i zachęcają do klikania 110 razy */
.tm-zapf-in[type=number]{-moz-appearance:textfield}
.tm-zapf-in::-webkit-outer-spin-button,.tm-zapf-in::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* KARTA ZAWODNIKA. <fieldset> z paskiem nagłówka. Ukryta karta ma [hidden][disabled] -
   wyłączony fieldset nie wysyła swoich pól ani nie sprawdza na nich required (powód
   w nagłówku biegZapisz.tpl), więc [hidden] wystarczy tu na sam wygląd. */
.tm-zapf-os{position:relative;min-width:0;margin:0 0 12px;padding:0;border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}
/* float:left + width:100% to jedyny pewny sposób, żeby <legend> zachował się jak zwykły
   blok wewnątrz fieldsetu we WSZYSTKICH przeglądarkach (samo display:flex na legendzie
   było w Chrome ignorowane latami). Pasek jest dlatego <span> w środku legendy, a nie
   samą legendą. Treść po legendzie płynie pod nią, bo float ma pełną szerokość. */
.tm-zapf-osl{float:left;width:100%;margin:0;padding:0}
.tm-zapf-osh{display:flex;align-items:center;gap:8px;padding:9px 14px;background:var(--band);border-bottom:1px solid var(--line);font:600 12.5px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-zapf-nr{display:inline-flex;align-items:center;justify-content:center;width:21px;height:21px;border-radius:999px;background:var(--ac-dark-fakty);color:#fff;font:700 12px/1 var(--f-ui);letter-spacing:0}
/* clear:both jest tu WARUNKIEM POPRAWNEGO UKŁADU, nie kosmetyką: floatowana legenda
   jest wyjęta z flow, więc pierwszy wiersz pól startuje na wysokości paska nagłówka
   i znika pod jego tłem. Zmierzone bez tej reguły: imię i nazwisko zawodnika stały
   pod paskiem "ZAWODNIK 1", a na ich miejscu było 40 px pustki. */
.tm-zapf-osb{clear:both;padding:14px 14px 4px}
/* "Usuń" stoi NAD paskiem nagłówka (position:absolute), a nie w legendzie: czytniki
   ekranu ogłaszają treść legendy przy KAŻDYM polu fieldsetu, więc słowo "Usuń"
   powtarzałoby się przy imieniu, nazwisku, roczniku i płci. */
.tm-zapf-del{position:absolute;top:6px;right:8px;padding:4px 10px;background:0 0;border:0;border-radius:8px;font:600 12px var(--f-ui);color:var(--txt-2);cursor:pointer}
.tm-zapf-del:hover{background:var(--brand-bg);color:var(--brand-h)}
.tm-zapf-del:focus-visible{outline:2px solid var(--brand);outline-offset:1px}

/* DODAWANIE. Kreskowane obramowanie mówi "tu jeszcze nic nie ma" - przycisk nie jest
   akcją formularza (tą jest "Zapisz się" w kolorze marki), tylko rozwinięciem treści. */
.tm-zapf-more{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin:0}
/* [hidden] MUSI stać przy tej klasie: własne display:inline-flex bije regułę
   przeglądarki dla atrybutu hidden, więc bez tego przycisk "Dodaj zawodnika" zostawał
   widoczny przy komplecie zawodników i klikanie w niego nic nie dawało. */
.tm-zapf-add[hidden]{display:none}
.tm-zapf-add{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;background:#fff;border:1px dashed var(--hair);border-radius:999px;font:600 13.5px var(--f-ui);color:var(--brand);cursor:pointer}
.tm-zapf-add:hover{border-color:var(--brand);background:var(--brand-bg)}
.tm-zapf-cnt{font-size:12.5px;color:var(--txt-3)}
.tm-zapf-nojs{margin:8px 0 0;font-size:13px;line-height:1.45;color:var(--txt-2)}

/* ZGODY. Cztery oświadczenia w zwartej liście; siatka 18px/1fr trzyma drugą i dalszą
   linię tekstu w jednej kolumnie, a nie pod kwadratem checkboxa. */
.tm-zapf-zg{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tm-zapf-zg label{display:grid;grid-template-columns:18px minmax(0,1fr);gap:9px;align-items:start;font-size:13.5px;line-height:1.45;color:var(--txt-2);cursor:pointer}
.tm-zapf-zg input{width:17px;height:17px;margin:1px 0 0;accent-color:var(--brand)}

.tm-zapf-cap{margin:16px 0 0}
.tm-zapf-act{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin:20px 0 0;padding-top:16px;border-top:1px solid var(--line)}
/* komunikat po PRG-redirekcie. Zamiast .alert-* z compat.css (obcy wtręt w motywie) -
   ten sam język co .tm-zapk-alert na karcie: kreska z lewej, własne tło, bez ramki. */
.tm-zapf-msg{margin:0 0 16px;padding:12px 16px;border-radius:6px;border-left:4px solid #1e7b34;background:#e6f4ea;font-size:14px;line-height:1.45;color:#1e5c2c}
.tm-zapf-msgErr{border-left-color:#b3261e;background:#fdecec;color:#8e1f18}

/* WALIDACJA - lista braków nad przyciskiem "Zapisz się" (skrypt w biegZapisz.tpl).
   Ton NEUTRALNY, nie alarmowy: na świeżym formularzu brakuje wszystkiego, a czerwone
   pudło na wejściu czytałoby się jak błąd, którego użytkownik jeszcze nie popełnił.
   Czerwień zostaje dla :user-invalid na polu, które ktoś już ruszył, i dla komunikatu
   z serwera (.tm-zapf-msgErr). Dwie kolumny, bo lista ma po pierwszym wpisie kilkanaście
   krótkich pozycji i w jednej kolumnie odsuwałaby przycisk o pół ekranu. */
.tm-zapf-req{margin:20px 0 0;padding:11px 15px;border:1px solid var(--line);border-left:4px solid var(--txt-3);border-radius:6px;background:var(--band)}
.tm-zapf-reqh{margin:0;font:600 13.5px var(--f-ui);line-height:1.45;color:var(--txt-2)}
.tm-zapf-reql{list-style:none;margin:9px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px}
.tm-zapf-reql:empty{display:none}
/* Kropka jest POZYCJONOWANA, nie elementem flexa: przy pozycji dłuższej niż kolumna
   ("Oświadczenie o braku przeciwwskazań zdrowotnych") flex przenosił cały przycisk pod
   kropkę, a powód lądował bez wcięcia. Wcięcie 13 px daje wiszący akapit - druga linia
   pozycji stoi pod pierwszą, a nie pod znacznikiem. */
.tm-zapf-reql li{position:relative;padding-left:13px;font-size:13px;line-height:1.45;color:var(--txt-2)}
.tm-zapf-reql li::before{content:"";position:absolute;left:0;top:6px;width:5px;height:5px;border-radius:999px;background:var(--txt-3)}
/* Pozycja listy jest PRZYCISKIEM, nie odnośnikiem: prowadzi do pola na tej samej stronie,
   a nie pod adres - wygląda jak link, ale nie kłamie w drzewie dostępności. */
.tm-zapf-reqb{display:inline;padding:0;background:0 0;border:0;font:600 13px/1.45 var(--f-ui);color:var(--brand);text-align:left;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.tm-zapf-reqb:hover{color:var(--brand-h)}
.tm-zapf-reqb:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:4px}
.tm-zapf-reqp{font-style:normal;color:var(--txt-3)}

@media(max-width:760px){
 /* pary imię|nazwisko i klub|uwagi schodzą do jednej kolumny - dwa pola tekstowe po
    ~170 px na telefonie to pola, w które nie widać, co się wpisuje */
 .tm-zapf-r{grid-template-columns:minmax(0,1fr)}
 /* ale rocznik i płeć ZOSTAJĄ w linii: to cztery cyfry i dwie wartości, a cały sens
    tej przebudowy jest w pionie. Reguła musi stać PO .tm-zapf-r (ta sama specyficzność). */
 .tm-zapf-rn{grid-template-columns:104px minmax(0,1fr)}
 /* 16 px w polach: iOS Safari POWIĘKSZA całą stronę przy fokusie pola o czcionce
    mniejszej niż 16 px i nie oddala jej po wyjściu z pola */
 .tm-zapf-in{font-size:16px}
 .tm-zapf-sh{font-size:16px}
 .tm-zapf-osb{padding:12px 12px 2px}
 /* lista braków w jednej kolumnie - dwie po ~170 px łamią każdą pozycję na dwa wiersze */
 .tm-zapf-reql{grid-template-columns:minmax(0,1fr)}
}

/* ==========================================================================
   MODUŁ ZAPISY - blok K: KLAUZULA INFORMACYJNA RODO dla zawodnika
   Strona /zapisy/bieg/{id}-{slug}/klauzula (ext/zapisy/biegKlauzula.tpl) oraz ten sam
   tekst jako Załącznik nr 2 regulaminu usługi (site/Strony/zapisy-regulamin.tpl).
   Dokument prawny czyta się inaczej niż interfejs: liczy się długość wiersza (65-75
   znaków), wyraźny numer punktu do cytowania w korespondencji i pogrubione wprowadzenie,
   po którym da się skakać wzrokiem. Dlatego własny licznik punktów, a nie domyślne
   znaczniki <ol> - te w tekście o tej długości gubią się przy zawinięciu wiersza.
   ========================================================================== */
.tm-zapkl-strona{max-width:800px}
.tm-zapkl-impreza{margin:-6px 0 14px;font:600 14.5px var(--f-ui);color:var(--txt-2)}
.tm-zapkl{counter-reset:kl;list-style:none;margin:18px 0 0;padding:0}
.tm-zapkl>li{counter-increment:kl;position:relative;margin:0 0 16px;padding:0 0 0 34px;font-size:14.5px;line-height:1.6;color:var(--txt-1,#222)}
.tm-zapkl>li::before{content:counter(kl) ".";position:absolute;left:0;top:0;width:26px;text-align:right;font:700 13.5px var(--f-ui);color:var(--brand)}
.tm-zapkl>li>strong:first-child{color:var(--txt-1,#222)}
.tm-zapkl ul{margin:8px 0 0;padding:0 0 0 18px;list-style:disc}
.tm-zapkl ul li{margin:0 0 6px;line-height:1.55}
.tm-zapkl a{color:var(--brand);text-decoration:underline}
/* Brak danych administratora to nie ozdoba, a wada klauzuli - musi być widoczna dla
   zawodnika I dla organizatora, który zajrzy na własną stronę zapisu. */
.tm-zapkl-brak{display:block;margin:8px 0 0;padding:9px 12px;border-radius:6px;border-left:4px solid #b3261e;background:#fdecec;font-size:13.5px;line-height:1.45;color:#8e1f18}
.tm-zapkl-wersja{margin:18px 0 0;padding-top:12px;border-top:1px solid var(--line);font-size:13px;line-height:1.5;color:var(--txt-3)}
.tm-zapkl-linki{margin:20px 0 0;font-size:13.5px;line-height:1.7;color:var(--txt-3)}
.tm-zapkl-linki a{color:var(--brand)}

/* Dopisek przy wartości w liście faktów karty biegu (dziś: odnośnik do klauzuli przy
   nazwie organizatora). Mniejszy stopień i szary kolor - to przypis, nie fakt równy
   terminowi i miejscu. */
.tm-zapk-fdop{display:inline-block;margin-left:8px;font-size:12.5px;color:var(--txt-3)}
.tm-zapk-fdop a{color:var(--txt-3);text-decoration:underline}
.tm-zapk-fdop a:hover{color:var(--brand)}

/* Kto jest administratorem - zdanie NAD listą zgód w formularzu zapisu. Stoi w ramce
   z kreską koloru marki, bo to jedyna informacja z art. 13 RODO widoczna bez klikania. */
.tm-zapf-adm{margin:0 0 14px;padding:10px 14px;border-radius:6px;border-left:4px solid var(--brand);background:var(--brand-bg);font-size:13.5px;line-height:1.5;color:var(--txt-2)}
.tm-zapf-adm a{color:var(--brand-h,var(--brand))}

@media(max-width:760px){
 .tm-zapkl>li{padding-left:28px;font-size:14px}
 .tm-zapkl>li::before{width:21px}
}

/* ==========================================================================
   MODUŁ ZAPISY - generator kodu na stronę organizatora
   Strona /user/zapisy/kod (ext/zapisy/panelKod.tpl, pomysł #310): opcje, kod do
   wklejenia i dwa podglądy widgetu obok siebie.

   Reguły dotyczą WYŁĄCZNIE otoczki na naszej stronie. Sam widget przynosi własny,
   kompletny arkusz w Shadow DOM (ext/class/ZapisyWidget.php::css) - na stronie
   organizatora nie ma zmiennych motywu, więc żadna reguła stąd tam nie dociera
   i nie wolno jej tam zakładać.
   ========================================================================== */
.tm-h2k{margin:28px 0 6px;font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-kodOpcje{display:flex;flex-wrap:wrap;gap:14px;margin:10px 0 14px}
.tm-kodOpcje label{display:flex;flex-direction:column;gap:4px;font:600 13px var(--f-ui);color:var(--txt-2)}
.tm-kodOpcje select,.tm-kodOpcje input{min-width:200px}
/* Podgląd stoi na szachownicy, żeby dało się ocenić motyw ciemny na jasnej stronie
   i odwrotnie - widget ma własne tło, więc na jednolitym szarym tle nie było widać,
   gdzie się kończy. */
.tm-kodPodglad{margin:6px 0 4px;padding:16px;border:1px dashed var(--line);border-radius:10px;
 background:repeating-conic-gradient(#f4f4f4 0% 25%,#fbfbfb 0% 50%) 50%/18px 18px}
/* Podgląd zajmuje CAŁĄ szerokość kolumny panelu, a nie sztuczne 420 px: widget przełącza
   układ zapytaniem @container, więc wąski podgląd pokazywałby zawsze wariant mobilny
   i przeczył podpisowi obok. Organizator ma zobaczyć to, co dostanie w szerokim miejscu. */
.tm-kodJak{margin:8px 0 0;padding:0 0 0 20px;font-size:14.5px;line-height:1.65;color:var(--txt-2)}
.tm-kodJak li{margin:0 0 7px}
.tm-kodJak code{padding:1px 5px;border-radius:4px;background:var(--brand-bg);font-size:13px;color:var(--txt-1,#222)}
#tm-kodGen{display:none}

/* ==========================================================================
   MODUŁ ZAPISY - panel organizatora: zgłoszenia
   Strona /user/zapisy/zawody/zgloszenia/{id} (ext/zapisy/panelZgloszenia.tpl).
   Jedyne miejsce w Serwisie z telefonem, e-mailem i uwagami zawodników - stąd
   układ kart, a nie jednej szerokiej tabeli: każde zgłoszenie to zamknięta
   całość (zgłaszający + jego zawodnicy + zgody), którą organizator czyta
   w komplecie, zwykle szukając JEDNEJ osoby.
   ========================================================================== */
.tm-zapzg-szukaj{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0 6px}
.tm-zapzg-szukaj label{font:600 13px var(--f-ui);color:var(--txt-2)}
.tm-zapzg-szukaj input[type=search]{min-width:280px;flex:1 1 280px}
.tm-zapzg-licz{margin:0 0 14px}
.tm-zapzg{margin:0 0 14px}
/* Zgłoszenie anulowane zostaje na liście (organizator musi wiedzieć, że ktoś się
   wypisał), ale przygaszone - nie liczy się do listy startowej. */
.tm-zapzg-anul{opacity:.62}
.tm-zapzg-glowa{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin:0 0 8px}
.tm-zapzg-data{text-align:right;white-space:nowrap}
.tm-zapzg-osoby{margin:0 0 6px}
.tm-zapzg-osoby th{white-space:nowrap;font-weight:600}
.tm-zapzg-uwagi{margin:0 0 6px}
.tm-zapzg-zgody{margin:0}
/* Brak oświadczenia albo brak wersji klauzuli to stan do wyjaśnienia przed startem,
   nie ozdoba - dlatego kolor ostrzegawczy, a nie szary jak reszta wiersza zgód. */
.tm-zapzg-brak{color:var(--err,#b3261e);font-weight:600}
.tm-zapzg-nota{margin:18px 0 0;padding:10px 14px;border-radius:6px;border-left:4px solid var(--brand);
 background:var(--brand-bg);line-height:1.55}

@media(max-width:760px){
 .tm-zapzg-glowa{flex-direction:column}
 .tm-zapzg-data{text-align:left}
 .tm-zapzg-osoby{display:block;overflow-x:auto}
}
/* Zmiana numeru startowego w komórce Nr (tylko aktywny zawodnik bez wydanego pakietu). */
.tm-zapzg-nrf{display:flex;align-items:center;gap:4px;margin:0}
.tm-zapzg-nr{width:80px}
/* Pasek „Pobierz” (wydruki PDF i CSV organizatora, idea#458/#461) pod linkami ekranu zgłoszeń. */
.tm-zapzg-pobierz{margin:8px 0;padding:8px 10px;background:var(--brand-bg);border-radius:6px;line-height:1.6}

/* Numery startowe (/user/zapisy/zawody/numery/{id}, ext/zapisy/panelNumery.tpl, idea#459):
   pule dystansów, nadawanie numerów i import z pliku - trzy kroki jeden pod drugim. */
.tm-zapnr-h2{margin:22px 0 8px}
.tm-zapnr-tab{overflow-x:auto}
.tm-zapnr-pule th,.tm-zapnr-bledy th{white-space:nowrap;font-weight:600}
.tm-zapnr-pule td{vertical-align:middle}
.tm-zapnr-pule input{width:90px}
.tm-zapnr-pule form{margin:0}
.tm-zapnr-nota{margin:6px 0 0}
.tm-zapnr-nadaj fieldset{border:0;padding:0;margin:0 0 10px}
.tm-zapnr-nadaj legend{float:none;width:auto;margin:0 0 4px;font:600 13px var(--f-ui);color:var(--txt-2)}
.tm-zapnr-nadaj fieldset label{display:block;margin:0 0 4px}
.tm-zapnr-wiersz{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0}
.tm-zapnr-wiersz label{font:600 13px var(--f-ui);color:var(--txt-2)}
.tm-zapnr-kryt{margin:6px 0 0;padding-left:20px}
.tm-zapnr-imp{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px}
.tm-zapnr-imp input[type=file]{max-width:100%}

/* Formularz danych administratora (/user/zapisy/dane, ext/zapisy/panelDane.tpl).
   Etykiety dzielą klasę z formularzem zapisu (.tm-zapf-lab), ale ten formularz stoi
   w panelu, a nie w lejku zgłoszenia - stąd własny, prostszy układ jednokolumnowy. */
.tm-zapdane{max-width:560px}
.tm-zapdane label{display:block;margin:14px 0 4px}
.tm-zapdane input{width:100%;padding:7px 10px;border:1px solid var(--line);border-radius:6px;
 font:15px var(--f-ui);background:var(--bg-1,#fff);color:var(--txt-1,#222)}
.tm-zapdane input:focus{outline:2px solid var(--brand);outline-offset:1px}
.tm-zapdane h2{margin:26px 0 4px}

/* --- apteka dyżurna (pomysł #348) ---
   Moduł pasa lokalnego (NT3aptekaPas.tpl, widget TMapteki), podstrona /apteki
   (ext/apteki/miasto.tpl, polska.tpl) i podstrona apteki /apteki/{id}-{slug}/ (apteka.tpl). Akcent --loc (granat pasa "Twoje miasto").
   Art. 94a Prawa farmaceutycznego (zakaz reklamy aptek): żadna apteka nie dostaje
   wyróżnienia kolorem ani rozmiarem - zieleń (#1c6b43, 6,9:1 na bieli) niesie wyłącznie
   stan "trwa teraz / otwarte do", a nie aptekę.
   Drobne teksty w --txt-2, nie --txt-3 (#8b93a1 ma na bieli 3,2:1 - poniżej AA).
   Bez overflow:hidden i bez line-height w px przy tekstach z polskimi znakami (ścina kreski
   nad Ś/Ź i ogonki - patrz notatka o ellipsis w theme/3). */
.tm-locmod-apt .tm-apt-dz{padding-left:10px;border-left:3px solid var(--loc)}
.tm-locmod-apt .tm-apt-dz-teraz{border-left-color:#1c6b43}
.tm-apt-kiedy{margin:0 0 3px;font-size:12.5px;line-height:1.35;color:var(--txt-2)}
.tm-apt-kiedy b{font-weight:600;color:var(--txt)}
.tm-apt-dz-teraz .tm-apt-kiedy b{color:#1c6b43}
p.tm-apt-n{margin:0}
.tm-apt-n{font-size:14px;font-weight:600;line-height:1.3;color:var(--txt)}
/* nazwa apteki jako link do podstrony /apteki/{id}-{slug}/ (listy na /apteki) */
a.tm-apt-n{text-decoration:none}
a.tm-apt-n:hover,a.tm-apt-n:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
p.tm-apt-a{margin:2px 0 0}
.tm-apt-a{font-size:12.5px;line-height:1.4;color:var(--txt-2)}
.tm-apt-t{color:var(--loc);font-weight:600;white-space:nowrap}
.tm-apt-t:hover{text-decoration:underline}
.tm-apt-row{margin:9px 0 0;padding-top:8px;border-top:1px dashed var(--line);font-size:12.5px;line-height:1.4;color:var(--txt-2)}
.tm-apt-row b{font-weight:600;color:var(--txt)}
.tm-apt-row a.tm-apt-rl{color:var(--txt);text-decoration:none}
.tm-apt-row a.tm-apt-rl:hover{color:var(--loc);text-decoration:underline}
.tm-apt-lab{display:inline-block;margin-right:3px;padding:1px 6px;border-radius:4px;background:var(--loc-bg);font:600 10.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--loc)}
a.tm-apt-open{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 5px;margin-top:9px;padding-top:8px;border-top:1px dashed var(--line);font-size:12.5px;line-height:1.4;color:var(--txt-2)}
a.tm-apt-open b{font-size:14px;font-weight:600;color:var(--txt)}
a.tm-apt-open:hover b{color:var(--loc)}
.tm-apt-openm,.tm-apt-rowm{flex-basis:100%;font-size:11px;color:var(--txt-2)}
.tm-apt-rowm{display:block}
/* dyżur sąsiedniego powiatu jako wiersz pod wyróżnioną całodobową (NT3aptekaPas.tpl) */
.tm-apt-row-teraz .tm-apt-lab{background:#e5f4ec;color:#1c6b43}
.tm-apt-dz-cal{border-left-color:var(--loc)}
/* pierwszy wiersz modułu (miasto bez dyżuru) nie dostaje kreski oddzielającej */
.tm-locmod-apt .tm-locmh+.tm-apt-row,.tm-locmod-apt .tm-locmh+a.tm-apt-open{margin-top:0;padding-top:0;border-top:0}

/* podstrona /apteki */
.tm-apt-lead{max-width:760px;margin:0 0 14px;font-size:14.5px;line-height:1.55;color:var(--txt-2)}
.tm-apt-toc{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 24px}
.tm-apt-toc a{display:inline-block;padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 12.5px var(--f-lab);color:var(--txt-2);transition:border-color .2s,color .2s}
.tm-apt-toc a:hover{border-color:var(--loc);color:var(--loc)}
.tm-apt-sec{margin:0 0 30px;scroll-margin-top:86px}
.tm-apt-empty{margin:0 0 22px;padding:12px 14px;border-left:4px solid var(--loc);background:var(--loc-bg);font-size:14px;line-height:1.5}
/* rząd kart: dwie obok siebie, a pojedyncza (miasto z dyżurem sąsiedniego powiatu ma w "Teraz"
   samą kartę całodobowych) na pełną szerokość - auto-fit, nie sztywne 2 kolumny */
.tm-apt-now{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px;align-items:start}
.tm-apt-box{min-width:0;background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 16px;scroll-margin-top:86px}
/* "Otwarte teraz": szeroki blok pod rzędem kart, lista w kolumnach (auto-fill), żeby 10 aptek
   nie ciągnęło jednej wąskiej kolumny w dół; pozycje bez górnej kreski, z dolną przerywaną */
.tm-apt-box-w{margin-top:14px}
.tm-apt-list-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:0 22px}
.tm-apt-list-g .tm-apt-li,.tm-apt-list-g .tm-apt-li:first-child{padding:7px 0;border-top:0;border-bottom:1px dashed var(--line)}
.tm-apt-h3{margin:0 0 10px;font:600 12px var(--f-lab);letter-spacing:.12em;text-transform:uppercase;color:var(--txt-2)}
.tm-apt-list{list-style:none;margin:0;padding:0}
.tm-apt-li{display:flex;align-items:flex-start;gap:12px;padding:9px 0;border-top:1px solid var(--line)}
.tm-apt-li:first-child{padding-top:0;border-top:0}
.tm-apt-list-k .tm-apt-li{padding:7px 0}
.tm-apt-list-k .tm-apt-li:first-child{padding-top:0}
.tm-apt-g{flex:none;min-width:88px;font:600 15px var(--f-lab);color:var(--loc);font-variant-numeric:tabular-nums}
.tm-apt-b{display:flex;flex-direction:column;gap:2px;min-width:0}
.tm-apt-list-k .tm-apt-b{display:block}
.tm-apt-list-k .tm-apt-a{display:block}
.tm-apt-b .tm-apt-a{font-size:13px}
.tm-apt-m{font-size:12px;line-height:1.4;color:var(--txt-2)}
.tm-apt-teraz{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;background:#e5f4ec;font:600 11px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:#1c6b43;vertical-align:1px}
.tm-apt-do{font-size:12px;font-weight:600;color:#1c6b43;white-space:nowrap}
.tm-apt-minal .tm-apt-g,.tm-apt-minal .tm-apt-n{color:var(--txt-2)}
.tm-apt-muted{margin:0 0 10px;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-apt-note{margin:10px 0 0;font-size:12px;line-height:1.45;color:var(--txt-2)}
/* linki w treści (bez klasy) mają kolor z konwencji karty podstrony: .tm-pagecard :is(p,li,dd,td) a:not([class]) */
.tm-apt-sub{display:block;font-size:11.5px;color:var(--txt-2)}
.tm-apt-off .tm-apt-n,.tm-apt-off .tm-apt-a{color:var(--txt-2)}
/* podstrona apteki /apteki/{id}-{slug}/: stan "teraz" pod nagłówkiem, dane w dl, tydzień listą */
.tm-apt-back{margin:0 0 10px;font-size:13px}
.tm-apt-back a{color:var(--txt-2);text-decoration:none}
.tm-apt-back a:hover{color:var(--loc);text-decoration:underline}
.tm-apt-stan{margin:-6px 0 18px;padding:10px 14px;border-left:4px solid var(--txt-2);background:#f4f5f7;font-size:15px;line-height:1.45}
.tm-apt-stan b{font-weight:600}
.tm-apt-stan-otwarta{border-left-color:#1c6b43;background:#e5f4ec}
.tm-apt-stan-otwarta b{color:#1c6b43}
.tm-apt-stan-zamknieta{border-left-color:var(--loc);background:var(--loc-bg)}
.tm-apt-dl{display:grid;grid-template-columns:minmax(96px,auto) 1fr;gap:0 14px;margin:0 0 10px;font-size:14px}
.tm-apt-dl dt{padding:7px 0;color:var(--txt-2);border-top:1px solid var(--line)}
.tm-apt-dl dd{margin:0;padding:7px 0;color:var(--txt);border-top:1px solid var(--line);min-width:0;overflow-wrap:break-word}
.tm-apt-dl dt:first-of-type,.tm-apt-dl dd:first-of-type{border-top:0}
.tm-apt-dl dd b{font-weight:600}
.tm-apt-tydz{list-style:none;margin:6px 0 0;padding:0;font-size:13px;color:var(--txt-2)}
.tm-apt-tydz li{display:flex;justify-content:space-between;gap:12px;padding:3px 0;border-top:1px dashed var(--line)}
.tm-apt-tydz-dzis{color:var(--txt);font-weight:600}
/* adres apteki z punktem na mapie (_adres.tpl, apteka.tpl, NT3aptekaPas.tpl): cały adres to link
   z pinezką na początku; kolor tekstu adresu zostaje, pinezka w --loc; w listach blok szerokości
   treści (fit-content), żeby klikalny był adres, a nie cała kolumna; zawinięty adres nie wchodzi pod pinezkę */
a.tm-apt-lok{text-decoration:none}
a.tm-apt-lok:not(.tm-apt-a){color:inherit}
a.tm-apt-lok i{margin-right:4px;font-size:.95em;color:var(--loc)}
a.tm-apt-lok:hover,a.tm-apt-lok:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-apt-b>a.tm-apt-lok{display:flex;align-items:baseline;width:fit-content;max-width:100%;padding:2px 0}
.tm-apt-b>a.tm-apt-lok i{flex:none;width:11px;text-align:center}
.tm-apt-off a.tm-apt-lok i{color:var(--txt-2)}
/* mapa aptek (aptekiMapa.js, Leaflet): isolation zamyka z-indeksy warstw Leaflet (400-1000)
   w pudełku mapy - bez tego kontrolki wychodziły nad przyklejony nagłówek strony */
.tm-apt-mapa{position:relative;isolation:isolate;height:440px;margin:0 0 10px;border:1px solid var(--line);border-radius:8px;background:#e8edf2;overflow:hidden}
.tm-apt-mapa-s{height:300px}
.tm-apt-mapa-blad{display:flex;align-items:center;justify-content:center;padding:16px;font-size:13px;color:var(--txt-2)}
.tm-apt-mapa .leaflet-container{font:inherit}
/* mapy (podkład tmMapa.js, wspólne dla wszystkich modułów z mapą): komunikat "podkład
   niedostępny" nad kaflami - .leaflet-control ma z-index do 800, popup 700, stąd 1000 */
.tm-mapa-uwaga{position:absolute;left:0;right:0;bottom:0;z-index:1000;padding:6px 10px;background:rgba(255,255,255,.92);font-size:13px;color:var(--txt-2)}
.tm-apt-leg{display:flex;flex-wrap:wrap;gap:4px 16px;list-style:none;margin:0;padding:0;font-size:12.5px;color:var(--txt-2)}
.tm-apt-leg li{display:inline-flex;align-items:center;gap:6px}
.tm-apt-kr{display:inline-block;width:12px;height:12px;border-radius:50%;border:1.5px solid #fff;box-shadow:0 0 0 1px #c8ced8}
.tm-apt-kr-o{background:#1c6b43}
.tm-apt-kr-z{background:#626b79}
.tm-apt-kr-b{background:#aab1bd}
.tm-apt-kr-d{width:14px;height:14px;background:#fff;border:3px solid #15588c;box-shadow:none}
.tm-apt-pop{font-size:13px;line-height:1.4;color:var(--txt)}
.tm-apt-popn{display:block;margin:0 0 2px;font-size:14px;font-weight:600;color:var(--txt)}
a.tm-apt-popn{color:var(--loc)}
.tm-apt-popa{color:var(--txt-2)}
.tm-apt-pops{margin-top:4px;font-weight:600}
.tm-apt-pops-o{color:#1c6b43}
.tm-apt-pops-z,.tm-apt-pops-b{color:var(--txt-2)}
.tm-apt-popd{margin-top:2px;font-weight:600;color:#15588c}
.tm-apt-popl{display:inline-block;margin-top:6px;font-weight:600;color:var(--loc)}
.tm-apt-src{margin:0 0 12px;padding-left:18px;font-size:14px;line-height:1.5}
.tm-apt-src li{margin:0 0 8px}
.tm-apt-src .tm-apt-m{display:block}
.tm-apt-attr{margin:12px 0 4px;font-size:12.5px;line-height:1.5;color:var(--txt-2)}
.tm-apt-hub{list-style:none;margin:0;padding:0;columns:3 210px;column-gap:24px}
.tm-apt-hub li{break-inside:avoid;padding:4px 0;font-size:14px;line-height:1.4}
.tm-apt-hub small{font-size:12px;color:var(--txt-2);white-space:nowrap}
/* Tablet (701-1100 px, tor ok. 670-1070 px): trzeci moduł pasa ścisnął wydarzenia do ok. 390 px,
   a ich dwie kolumny łamały tytuły na 3-4 wiersze i pas rósł do 375 px (pomiar 1000 px).
   Gdy w pasie jest apteka, wydarzenia schodzą do własnego wiersza na pełną szerokość,
   a pogoda i apteka dzielą pierwszy. Bez wsparcia :has zostaje stary, ściśnięty układ. */
@media(min-width:701px) and (max-width:1100px){.tm-locmods:has(.tm-locmod-apt) .tm-locmod-ev{flex-basis:100%}}
@media(max-width:700px){
 /* Pas na telefonie: moduł apteki NIE dołącza do pogody i sondy w rzędzie połówek nad kaflami
    newsów (order:2) - trzeci mały moduł zająłby cały wiersz i zepchnął pierwszy tytuł
    artykułu pod zgięcie. Schodzi pod kafle (order:4) na pełną szerokość; przed wydarzeniami,
    bo stoi przed nimi w DOM. Selektor (0,3,0) jak reguła połówek, wygrywa kolejnością w pliku. */
 .tm-locmods>.tm-locmod.tm-locmod-apt{flex:1 1 100%;padding:7px 10px;order:4}
 .tm-locmods>.tm-locmod.tm-locmod-apt .tm-locmh{font-size:10.5px;letter-spacing:.1em}
 .tm-locmods>.tm-locmod.tm-locmod-apt .tm-locmh>span{overflow:visible;text-overflow:clip}
 .tm-locmod-apt .tm-apt-n{font-size:13px}
 .tm-locmod-apt .tm-apt-a,.tm-locmod-apt .tm-apt-kiedy,.tm-locmod-apt .tm-apt-row,.tm-locmod-apt a.tm-apt-open{font-size:11.5px}
 .tm-apt-now{grid-template-columns:minmax(0,1fr)}
 .tm-apt-g{min-width:76px;font-size:14px}
 .tm-apt-dl{grid-template-columns:minmax(80px,auto) 1fr}
 .tm-apt-mapa{height:340px}
 .tm-apt-mapa-s{height:260px}
}

/* =====================================================================================
   DZIAŁ POLITYKA - Sejm, Senat i władze miast (idea #358 i #361)
   Szablony: smarty/templates/ext/polityka/*.tpl (wrapper tpl/polityka.tpl + inc/page.tpl). Nowy wygląd
   2026-09-24 (spec docs/superpowers/specs/2026-09-24-polityka-ux-design.md): wspólne klocki - karta wpisu
   .tm-pol-wpis w liście .tm-pol-wpisy, etykiety rodzaju/głosu/werdyktu/statusu (słowo + kolor, kontrast
   co najmniej 4,5:1 - PolitykaCssTest), pasek wyniku .tm-pol-wbar, przycisk .tm-pol-btn, link powrotu
   .tm-pol-powrot, nagłówki dni .tm-pol-dzien-h, źródła w <details class="tm-pol-zrodla">, karty
   .tm-pol-rep (przeglądy, wynik głosowania). Klocki z innych modułów: .tm-tbl, .tm-qgrid/.tm-qcard,
   .tm-zapk-f, .tm-h2k, .tm-vh. Teksty drugorzędne var(--txt-2) (5,39:1). Zastępczy portret z inicjałami
   .tm-pol-ini ma wielkość zdjęcia; pasek mandatów rady .tm-pol-pasek + legenda (kolory .tm-pol-c1..c8
   neutralne, bez barw partyjnych). Każda reguła .tm-pol-* ma użycie w szablonie (test martwych reguł).
   ===================================================================================== */
.tm-pol{min-width:0}
/* --- nawigacja działu: rząd pigułek pod h1 (na profilach pod nagłówkiem ze zdjęciem) --- */
.tm-pol-nav{display:flex;flex-wrap:wrap;gap:6px 8px;margin:-4px 0 22px}
.tm-pol-nav a{display:inline-block;padding:6px 13px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 12.5px var(--f-lab);letter-spacing:.02em;color:var(--txt-2);text-decoration:none;transition:border-color .2s,color .2s,background-color .2s}
.tm-pol-nav a:hover,.tm-pol-nav a:focus-visible{border-color:var(--loc);color:var(--loc)}
.tm-pol-nav a:focus-visible{outline:2px solid var(--loc);outline-offset:2px}
.tm-pol-nav a[aria-current]{border-color:var(--loc);background:var(--loc);color:#fff}
.tm-pol-nav a[aria-current]:focus-visible{outline-color:var(--dark)}
.tm-pol-nav a[aria-current="true"]{background:var(--loc-bg);color:var(--loc)}

.tm-pol-lead{margin:0 0 20px;font-size:14.5px;line-height:1.6;color:var(--txt)}
.tm-pol-pusto{margin:0 0 22px;padding:12px 14px;border-left:4px solid var(--loc);background:var(--loc-bg);font-size:14px;line-height:1.5}

.tm-pol-sec{margin:0 0 8px}

.tm-pol-sub{margin:-8px 0 8px;font-size:16px;line-height:1.45;color:var(--txt)}
.tm-pol-meta{margin:0 0 18px;font:600 13px var(--f-lab);letter-spacing:.04em;color:var(--txt-2)}
.tm-pol-wynik{margin:6px 0 18px;font-size:14px;color:var(--txt)}

/* --- lista posłów miasta: karta ze zdjęciem 110x137 (portret, bez kadrowania) --- */
.tm-pol-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 26px;padding:0;list-style:none}
.tm-pol-os{display:grid;grid-template-columns:110px minmax(0,1fr);gap:14px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px}
.tm-pol-ph{display:block;position:relative;width:110px;height:137px;border-radius:6px;overflow:hidden;background:var(--band)}
.tm-pol-ph img{display:block;width:100%;height:100%;object-fit:cover}
.tm-pol-b{min-width:0}
.tm-pol-n{margin:0;font:700 16px/1.3 var(--f-ui)}
.tm-pol-n a,.tm-pol-nl{color:var(--txt-h);text-decoration:none}
.tm-pol-n a:hover,.tm-pol-nl:hover{color:var(--brand);text-decoration:underline}
.tm-pol-k{display:block;margin:2px 0 6px;font:600 12px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-2)}
.tm-pol-et{margin:0 0 8px;padding:0;list-style:none;font-size:13px;line-height:1.45;color:var(--txt)}
.tm-pol-et li{margin:0 0 2px}
.tm-pol-m{margin:0;font-size:12.5px;line-height:1.55;color:var(--txt-2)}
.tm-pol-m b{color:var(--txt);font-weight:600}
/* pasek frekwencji pod liczbą (aria-hidden, szerokość z PHP w style); wiersze akapitu to bloki .tm-pol-ml, bez <br> */
.tm-pol-ml{display:block}
.tm-pol-frek{display:block;max-width:180px;height:4px;margin:3px 0 5px;border-radius:2px;background:var(--band);overflow:hidden}
.tm-pol-frek span{display:block;height:100%;border-radius:2px;background:var(--loc)}
/* zastępczy portret: inicjały na tle --band, ta sama wielkość co zdjęcie (po .tm-pol-mph/.tm-pol-ph, bo te dają display:block) */
.tm-pol-ini{display:flex;align-items:center;justify-content:center;font:600 15px var(--f-lab);letter-spacing:.03em;color:var(--txt-2);background:var(--band);user-select:none}
.tm-pol-ini-b{font-size:26px}

/* --- wariant polska i widget: gęsta siatka z miniaturą 50x62 --- */
.tm-pol-h2{margin:22px 0 10px;padding-bottom:6px;border-bottom:2px solid var(--dark);font:700 17px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-pol-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 14px;margin:0 0 10px;padding:0;list-style:none}
.tm-pol-mo{display:flex;align-items:center;gap:10px;min-width:0;padding:4px 0}
.tm-pol-mph{flex:none;display:block;position:relative;width:50px;height:62px;border-radius:4px;overflow:hidden;background:var(--band)}
.tm-pol-mph img{display:block;width:100%;height:100%;object-fit:cover}
.tm-pol-mph.tm-pol-ini{display:flex}
.tm-pol-mb{display:flex;flex-direction:column;min-width:0;font-size:14px;line-height:1.3}
.tm-pol-mb .tm-pol-k{margin:1px 0 0;font-size:11px}
.tm-pol-mini{margin:0 0 18px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.tm-pol-mini-h{margin-top:0}
.tm-pol-mgrid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}

/* --- ostatnie głosowania Sejmu (lista pod posłami miasta) --- */

.tm-pol-gw{font-size:12.5px;color:var(--txt-2)}

/* --- profil posła --- */
.tm-pol-prof{display:grid;grid-template-columns:110px minmax(0,1fr);gap:22px;align-items:start;margin:0 0 18px}
.tm-pol-fig{margin:0}
.tm-pol-fig a,.tm-pol-fig .tm-pol-ini{display:block;position:relative;width:110px;height:137px;border-radius:6px;overflow:hidden;background:var(--band)}
.tm-pol-fig .tm-pol-ini{display:flex}
.tm-pol-fig img{display:block;width:110px;height:137px;object-fit:cover}
.tm-pol-fig figcaption{margin-top:4px;font-size:11.5px;line-height:1.3;color:var(--txt-2)}
.tm-pol-profb{min-width:0}
/* .tm-h1k ma ujemny margines pod nagłówek stojący wprost w karcie - obok zdjęcia wszedłby na nie */
.tm-pol-h1{margin-left:0;margin-bottom:8px}
.tm-pol-fn{margin:0 0 6px;font-size:15px;line-height:1.45;color:var(--txt)}
.tm-pol-wyg{margin:0;padding:8px 12px;border-left:4px solid var(--txt-3);background:var(--band);font-size:13.5px;line-height:1.5;color:var(--txt)}
.tm-pol-dane{margin:0 0 18px}
/* „O pośle” od 600 px w dwóch kolumnach par etykieta-wartość (spec 6.7, audyt 2026-09-24); poniżej 761 px
   .tm-zapk-f układa pary pionowo - tu wracają wiersze z kreską jak na komputerze */
@media(min-width:600px){
 .tm-pol-dane-2{grid-template-columns:auto 1fr auto 1fr;column-gap:14px}
 .tm-pol-dane-2 dt{padding:9px 0;font-size:inherit}
 .tm-pol-dane-2 dd{padding:9px 0;border-top:1px solid var(--line)}
 .tm-pol-dane-2 dt:nth-of-type(2n){padding-left:18px}
 .tm-pol-dane-2 dt:nth-of-type(-n+2),.tm-pol-dane-2 dd:nth-of-type(-n+2){border-top:0}
}
.tm-pol-kafle{margin:0 0 22px}
.tm-pol-kafle .tm-qvalue{font-size:22px}

/* --- tabele: przewijanie w poziomie na telefonie, głos tekstem + kolor --- */
.tm-pol-tw{position:relative;overflow-x:auto;margin:0 0 22px;-webkit-overflow-scrolling:touch}
.tm-pol-tbl{margin-bottom:0;min-width:520px}
.tm-pol-tbl caption{caption-side:top;text-align:left;padding:0 0 8px;font:700 15px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-pol-tbl caption.tm-vh{padding:0}
.tm-pol-tbl tbody th{text-align:left;font:600 13.5px/1.45 var(--f-ui);letter-spacing:0;text-transform:none;color:var(--txt-h);padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.tm-pol-tbl tbody th a{text-decoration:underline;text-decoration-color:var(--hair);text-underline-offset:2px}
.tm-pol-tbl tbody th a:hover{color:var(--loc);text-decoration-color:var(--loc)}
.tm-pol-tbl td{vertical-align:top}

.tm-pol-num td{text-align:right;font-variant-numeric:tabular-nums}

/* --- wystąpienia --- */

.tm-pol-nw{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:4px;background:var(--band);font:600 11px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt)}
.tm-pol-mb>.tm-pol-nw{align-self:flex-start;margin:2px 0 0}
/* barwy klubów (idea #361, 2026-09-24): --kl (tło) i --klt (napis) z PolitykaHelper::klubBarwa() w atrybucie style
   pozycji z osobą - plakietka i pasek pod zdjęciem je dziedziczą; bez barwy plakietka jest szara, a paska nie ma */
.tm-pol-kl{display:inline-block;padding:1px 6px;border-radius:4px;background:var(--kl,#8a9099);color:var(--klt,#1a1a1a);font:600 11px/1.45 var(--f-lab);letter-spacing:.04em;white-space:nowrap;vertical-align:1px}
.tm-pol-mb>.tm-pol-k{align-self:flex-start;margin:3px 0 1px}
/* długie nazwy klubów (Konfederacja Korony Polskiej) w wąskiej kolumnie siatki osób zawijają się zamiast wychodzić poza komórkę */
.tm-pol-mb .tm-pol-kl{white-space:normal}
.tm-pol-mph::after,.tm-pol-ph::after,.tm-pol-av::after,.tm-pol-fig a::after,.tm-pol-fig .tm-pol-ini::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--kl,transparent)}
.tm-pol-ph::after,.tm-pol-fig a::after,.tm-pol-fig .tm-pol-ini::after{height:4px}
.tm-pol-av{flex:none;display:block;position:relative;width:28px;height:35px;border-radius:3px;overflow:hidden;background:var(--band)}
.tm-pol-av img{display:block;width:100%;height:100%;object-fit:cover}
.tm-pol-av.tm-pol-ini{display:flex;font-size:11px}

/* --- wynik głosowania: paski w kolorach głosu (pasek aria-hidden, liczby tekstem) --- */

@media(max-width:880px){
 .tm-pol-list{grid-template-columns:minmax(0,1fr)}
 .tm-pol-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
 .tm-pol-os{grid-template-columns:78px minmax(0,1fr);gap:12px}
 .tm-pol-ph{width:78px;height:97px}
 .tm-pol-grid{grid-template-columns:minmax(0,1fr)}
 .tm-pol-prof{grid-template-columns:78px minmax(0,1fr);gap:14px}
 .tm-pol-fig a,.tm-pol-fig img,.tm-pol-fig .tm-pol-ini{width:78px;height:97px}
 .tm-pol-ini-b{font-size:21px}
 .tm-pol-kafle .tm-qvalue{font-size:19px}
 .tm-pol-nav{gap:6px}
 .tm-pol-nav a{padding:7px 12px}
}

/* --- Etap 2 - władze miejskie i senatorowie (idea #361, 2026-09-15) ---
   Szablony ext/polityka/{start,rada,senatorowie,senator}.tpl, wrapper tpl/polityka.tpl (.tm-pol-art).
   Boksy /polityka/ w kolejności DOM: #tm-pol-wladze, #tm-pol-parl. Role i stan zawsze tekstem;
   --brand na bieli 4,58:1 (etykieta roli), teksty drugorzędne var(--txt-2). Listy zamiast tabel. */

.tm-pol-h3{margin:20px 0 8px;font:700 16px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-pol-zapow{margin:0 0 12px;padding:8px 12px;border-left:4px solid var(--brand);background:var(--loc-bg);font-size:14px;line-height:1.5;color:var(--txt)}

.tm-pol-zast{margin:0 0 12px;padding:0;list-style:none;font-size:14px;line-height:1.5}
.tm-pol-zast li{margin:0 0 6px}
.tm-pol-zast .tm-pol-k{margin:0}
.tm-pol-zak{display:block;font-size:13px;color:var(--txt-2)}
.tm-pol-grupy{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 14px;padding:0;list-style:none;font-size:14px;line-height:1.4}
.tm-pol-grupy b{font-weight:600}
.tm-pol-grupy li{display:flex;align-items:flex-start;gap:6px}
/* pasek podziału mandatów: segment = grupa, flex-grow = liczba mandatów (style z PHP), min-width żeby 1 mandat był widoczny */
.tm-pol-pasek{display:flex;gap:2px;height:12px;margin:0 0 10px;border-radius:6px;overflow:hidden}
.tm-pol-pasek span{flex:1 1 0;min-width:4px}
.tm-pol-sw{display:inline-block;flex:none;width:12px;height:12px;margin-top:4px;border-radius:3px}
.tm-pol-c1{background:#15588c}.tm-pol-c2{background:#3f7bab}.tm-pol-c3{background:#7ea3c6}.tm-pol-c4{background:#b6cbde}
.tm-pol-c5{background:#4b5563}.tm-pol-c6{background:#7b8593}.tm-pol-c7{background:#adb4bf}.tm-pol-c8{background:#d6dae1}

/* link do postanowienia: szary z podkreśleniem (dwie linie czerwieni marki w boksie władz rozpraszały);
   własna klasa, bo generyczna reguła .tm-pagecard :is(p,li,dd,td) a:not([class]) ma wyższą specyficzność */
.tm-pol-zl{color:var(--txt-2);text-decoration:underline;text-decoration-color:var(--hair);text-underline-offset:2px}
.tm-pol-zl:hover{color:var(--loc);text-decoration-color:var(--loc)}

.tm-pol-okrg{margin:0 0 18px}
.tm-pol-okrg-m{margin:0 0 10px;font-size:13.5px;color:var(--txt-2)}
.tm-pol-rady{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin:0;padding:0;list-style:none}
.tm-pol-rady li{min-width:0;padding:8px 0;border-bottom:1px solid var(--line)}
.tm-pol-rady li>span{display:block}
.tm-pol-rn{font:700 15.5px/1.35 var(--f-ui);color:var(--txt-h)}
.tm-pol-rady .tm-pol-k{margin:2px 0 2px}
.tm-pol-rk{font-size:13px;line-height:1.45;color:var(--txt)}
.tm-pol-rady .tm-pol-m{margin-top:2px}
.tm-pol-rola{margin:2px 0 0;font:600 11px var(--f-lab);letter-spacing:.07em;text-transform:uppercase;color:var(--brand)}
.tm-pol-okr .tm-pol-sub{margin:0 0 10px;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-pol-okm{margin:0 0 12px;font-size:13.5px;line-height:1.55}
/* serwisy innych miast okręgu: pigułki pod kartami (posłowie i senatorowie w mieście) */
.tm-pol-okm-n{margin:0 0 22px}
.tm-pol-okm-n .tm-pol-meta{margin-bottom:8px}
.tm-pol-okm-l{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0;padding:0;list-style:none}
.tm-pol-okm-a{display:inline-block;padding:4px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:12.5px;line-height:1.4;color:var(--txt);text-decoration:none;transition:border-color .2s,color .2s}
.tm-pol-okm-a:hover,.tm-pol-okm-a:focus-visible{border-color:var(--loc);color:var(--loc)}
.tm-pol-okm-a:focus-visible{outline:2px solid var(--loc);outline-offset:2px}
/* jedna stopka źródeł na /polityka/ (zamiast trzech pod boksami) */
.tm-pol-biuro{margin:0 0 14px;font-size:14px;line-height:1.6;color:var(--txt)}
.tm-pol-art .tm-sitem{padding:9px 0}
@media(max-width:880px){
 .tm-pol-rady{grid-template-columns:minmax(0,1fr)}
}

/* --- Etap 3 (idea #361): zakładki posła, filtry, oś aktywności, stronicowanie --- */
.tm-pol-tabs{display:flex;flex-wrap:wrap;gap:0 4px;margin:0 0 18px;border-bottom:2px solid var(--line)}
.tm-pol-tabs a{display:inline-block;padding:9px 14px;margin-bottom:-2px;border-bottom:2px solid transparent;font:600 13px var(--f-lab);color:var(--txt-2);text-decoration:none}
.tm-pol-tabs a[aria-current]{color:var(--loc);border-bottom-color:var(--loc)}
.tm-pol-filtr{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 14px}
.tm-pol-filtr a{display:inline-block;padding:5px 11px;border:1px solid var(--line);border-radius:999px;font:600 12px var(--f-lab);color:var(--txt-2);text-decoration:none}
.tm-pol-filtr a[aria-current]{background:var(--loc);border-color:var(--loc);color:#fff}
.tm-pol-filtr-n{opacity:.75;font-weight:500}
.tm-pol-wbrew{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:4px;background:#fff3e0;color:#8a4b00;font:600 11px var(--f-lab)}

.tm-pol-os-d{display:block;font:600 12px var(--f-lab);color:var(--txt-2)}

.tm-pol-pag{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:16px 0}
.tm-pol-pag-i{width:100%;margin:0 0 4px;font-size:12.5px;color:var(--txt-2)}
.tm-pol-pag-a{display:inline-block;min-width:34px;padding:6px 9px;border:1px solid var(--line);border-radius:6px;text-align:center;font:600 12.5px var(--f-lab);color:var(--txt-2);text-decoration:none}
.tm-pol-pag-b{background:var(--loc);border-color:var(--loc);color:#fff}
.tm-pol-kom{margin:0 0 12px;padding:0;list-style:none}
.tm-pol-kom li{padding:9px 0;border-top:1px solid var(--line);font-size:14px;line-height:1.5;color:var(--txt)}
.tm-pol-kom li:first-child{border-top:0}
.tm-pol-kom-f{display:inline-block;padding:1px 7px;border-radius:4px;background:var(--band);font:600 11px/1.45 var(--f-lab);letter-spacing:.03em;color:var(--txt);vertical-align:1px}
.tm-pol-kom-d{display:block;margin-top:2px;font-size:12.5px;line-height:1.45;color:var(--txt-2)}
.tm-pol-byle{margin:0 0 12px}
.tm-pol-byle summary{cursor:pointer;font:600 13px var(--f-lab);color:var(--txt-2)}

/* --- Zadanie 15 (idea #361): strony wystąpienia i pisma --- */
/* wariant małego zdjęcia .tm-pol-fig (mówca w nagłówku wystąpienia, autorzy pisma) - ta sama ramka,
   50x62 zamiast domyślnych 110x137 */
.tm-pol-fig-s a,.tm-pol-fig-s .tm-pol-ini,.tm-pol-fig-s img{width:50px;height:62px}
.tm-pol-punkt{margin:0 0 14px;padding:10px 12px;background:var(--band);border-radius:6px}
.tm-pol-tresc p{margin:0 0 12px;line-height:1.6}
.tm-pol-wtr{color:var(--txt-2);font-style:italic}
.tm-pol-sprawa{margin:0 0 10px}
.tm-pol-odp{margin:0 0 18px;padding:12px 14px;border:1px solid var(--line);border-radius:8px}
.tm-pol-odp h3{margin:0 0 6px;font:600 14px var(--f-lab)}
.tm-pol-odp p{margin:0 0 8px;line-height:1.6}
.tm-pol-odp p:last-child{margin-bottom:0}
/* lista autorów pisma - wiersze .tm-pol-mo (zdjęcie/inicjały 50x62 + nazwisko) już ze start.tpl */

/* "Miasta w tym wystąpieniu/piśmie" - selektor na <p>, bo .tm-pol-miasta jest też nazwą <ul>
   w senator.tpl (związek z miastami portalu) i nie powinien dostać tego samego odstępu */
p.tm-pol-miasta{margin:0 0 18px;font-size:13.5px;line-height:1.55}
p.tm-pol-miasta a{margin-right:6px}

/* --- Zadanie 16 (idea #361): projekt ustawy - oś etapów, debata, "O czym było głosowanie" --- */

.tm-pol-etap-1{margin-left:18px}.tm-pol-etap-2{margin-left:36px}.tm-pol-etap-3{margin-left:54px}
.tm-pol-etap-d{font:600 12px var(--f-lab);color:var(--txt-2);margin-right:8px}
.tm-pol-etap-l{display:block;margin-top:2px;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-pol-deb{list-style:none;margin:0;padding:0}.tm-pol-deb li{padding:6px 0;border-bottom:1px solid var(--line)}

/* --- Zadanie 17 (idea #361): posiedzenia - lista, porządek dzienny, dzień po sprawach --- */
/* pigułki dni posiedzenia (posiedzenie.tpl): data + liczniki + info o transmisji, karta zamiast
   linku w rzędzie .tm-pol-nav (więcej treści niż w prostej pigułce) */
.tm-pol-dni{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px;padding:0;list-style:none}
.tm-pol-dzien{display:flex;flex-direction:column;gap:2px;min-width:132px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;text-decoration:none;transition:border-color .2s}
.tm-pol-dzien:hover,.tm-pol-dzien:focus-visible{border-color:var(--loc)}
.tm-pol-dzien:focus-visible{outline:2px solid var(--loc);outline-offset:2px}
.tm-pol-dzien-d{font:700 14px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-pol-dzien-l{font-size:12px;line-height:1.4;color:var(--txt-2)}
/* porządek dzienny (posiedzenie.tpl): <ol> z numeracją realnych punktów (value="N" z PHP, bo grupy
   scalone w debatę zostawiają luki w numeracji) */
/* porządek dzienny posiedzenia jako karty punktów z numerem w kółku - numer z atrybutu value <li> (spec 6.10) */
.tm-pol-punkty{display:grid;gap:8px;margin:0 0 18px;padding:0;list-style:none}
.tm-pol-pkt{position:relative;min-height:30px;padding:11px 14px 11px 54px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:14px;line-height:1.5;color:var(--txt)}
.tm-pol-pkt::before{content:attr(value);position:absolute;left:14px;top:9px;box-sizing:border-box;min-width:28px;height:28px;padding:0 5px;border-radius:14px;background:var(--band);font:600 13px/28px var(--f-lab);text-align:center;color:var(--txt-h)}
/* dzień posiedzenia po sprawach (posiedzenieDzien.tpl): każda sprawa (punkt/grupa specjalna) w
   ramce, jak karta - odróżnia kolejne sprawy bez dodatkowych nagłówków h2 na tle strony */
.tm-pol-sprawa-sec{padding:12px 14px;margin:0 0 14px;border:1px solid var(--line);border-radius:8px}
.tm-pol-det summary{cursor:pointer;font:600 14px var(--f-lab);margin:8px 0}

/* --- Zadanie 18 (idea #361): komisje sejmowe, globalna lista pism --- */
/* wiersz pisma posła powiązanego z miastem (tabela pisma.tpl, tylko host miasta) - te same tokeny
   akcentu miejskiego (--loc/--loc-bg) co pozostałe wyróżnienia działu */

.tm-pol-zm-lbl{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:4px;background:var(--loc);font:600 11px var(--f-lab);letter-spacing:.02em;color:#fff;white-space:nowrap}

/* --- Zadanie 19 (idea #361): sprawy miasta w Sejmie - boks, sejm-o-miescie, ranking, aktywność posłów miasta --- */
.tm-pol-mark{background:#fff1a8;color:inherit;padding:0 2px;border-radius:3px}

/* etykieta "poseł z okręgu" przy wzmiance - klasa .tm-pol-wz-et (nie .tm-pol-et): .tm-pol-et jest
   już nazwą <ul> pigułek na karcie posła (poslowie.tpl, senator.tpl) - drugie znaczenie tej samej
   klasy jako <span> zerowałoby font/line-height listy przez font: shorthand */
.tm-pol-wz-et{font:600 11px var(--f-lab);color:var(--loc)}

/* streszczenia AI (idea #393): ramka _ai.tpl (pismo, odpowiedź, projekt, profil posła), znacznik „AI",
   zdanie pod tytułem w listach pism i projektów, tabela „Jak głosuje" według wnioskodawcy. Tło --loc-bg
   (granat modułów miejskich), stopka o AI w --txt-2 (AA na jasnym tle) */
.tm-pol-ai{margin:0 0 20px;padding:14px 16px;border:1px solid var(--loc-line);border-left:3px solid var(--loc);border-radius:6px;background:var(--loc-bg)}
.tm-pol-ai-k{margin:8px 0 12px;padding:10px 12px}
.tm-pol-ai-h{margin:0 0 6px;font:600 14px var(--f-lab);color:var(--txt-h)}
.tm-pol-ai-z{display:inline-block;margin-right:4px;padding:1px 5px;border-radius:3px;background:var(--loc);color:#fff;font:700 11px var(--f-lab);vertical-align:1px}
.tm-pol-ai-t{margin:0 0 8px;font-size:15px;line-height:1.6;color:var(--txt)}
.tm-pol-ai-k .tm-pol-ai-t{font-size:14.5px}
.tm-pol-ai-p{margin:0 0 8px;padding-left:20px;font-size:14.5px;line-height:1.55;color:var(--txt)}
.tm-pol-ai-p li{margin:2px 0}
.tm-pol-ai-tem{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px}
.tm-pol-ai-tag{padding:2px 8px;border:1px solid var(--loc-line);border-radius:12px;background:var(--bg);font-size:12.5px;color:var(--txt)}
.tm-pol-ai-s{margin:4px 0 0;font-size:12px;line-height:1.5;color:var(--txt-2)}
.tm-pol-ailead{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;padding-block:1px;margin-top:3px;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-pol-ailead .tm-pol-ai-z{font-size:10px}
.tm-pol-jg caption{caption-side:top;padding:0 0 6px;text-align:left;font:600 14px var(--f-lab);color:var(--txt-h)}
/* --- dział lokalny 2026-09-23 (idea #361): etykieta „O mieście” (miasto w tytule) albo „Wzmianka” przy
   wzmiance, rozwijana lista scalonych podobnych elementów; menu działu na telefonie w jednym rzędzie
   przewijanym w poziomie (bez scroll-snap - przyciąganie cofało przewinięcie do bieżącej pozycji) - klasy
   -p (przewijane), -l (przewinięte od początku) i -k (koniec) dokłada js.js, wygaszenie krawędzi tylko po
   tej stronie, za którą są jeszcze pozycje --- */
.tm-pol-wz-l{display:inline-block;margin-left:6px;padding:1px 7px;border:1px solid var(--line);border-radius:999px;font:600 10.5px var(--f-lab);letter-spacing:.03em;color:var(--txt-2);vertical-align:1px}
.tm-pol-wz-l1{border-color:var(--loc);background:var(--loc);color:#fff}
.tm-pol-wz-pod{margin:6px 0 0;font-size:13px}
.tm-pol-wz-pod summary{cursor:pointer;color:var(--loc);font:600 12.5px var(--f-lab)}
.tm-pol-wz-pod ul{margin:6px 0 0;padding-left:18px;line-height:1.5}
/* hub „Sprawy w Sejmie”: zakładki widoków (O mieście, Aktywność posłów, Głosowania, Komisje), skrót głosów
   posłów związanych z miastem przy głosowaniu (-p = podzieleni) i osoby w karcie komisji hubu (.tm-pol-hk-o,
   nie .tm-pol-kom - ta jest już listą komisji profilu posła i podkomisji) */
.tm-pol-widoki{display:flex;gap:4px;margin:-6px 0 18px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.tm-pol-widoki::-webkit-scrollbar{display:none}
.tm-pol-widoki a{flex:none;margin-bottom:-1px;padding:8px 12px;border-bottom:3px solid transparent;font:600 13.5px var(--f-lab);color:var(--txt-2);text-decoration:none;white-space:nowrap}
.tm-pol-widoki a:hover,.tm-pol-widoki a:focus-visible{color:var(--loc)}
.tm-pol-widoki a[aria-current]{border-bottom-color:var(--loc);color:var(--loc)}
.tm-pol-glm{display:block;margin-top:4px;font-size:13px;line-height:1.45;color:var(--txt)}
.tm-pol-glm-p{padding:3px 8px;border-left:3px solid var(--loc);background:var(--loc-bg)}

.tm-pol-hk-o{display:flex;flex-wrap:wrap;gap:4px 16px;list-style:none;margin:5px 0 0;padding:0;font-size:13.5px}
.tm-pol-hk-o>li{display:flex;align-items:center;gap:6px}
@media(max-width:640px){
.tm-pol-nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.tm-pol-nav::-webkit-scrollbar{display:none}
.tm-pol-nav a{flex:none}
.tm-pol-nav.tm-pol-nav-p:not(.tm-pol-nav-k){-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
.tm-pol-nav.tm-pol-nav-p.tm-pol-nav-l:not(.tm-pol-nav-k){-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 82%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 82%,transparent)}
.tm-pol-nav.tm-pol-nav-p.tm-pol-nav-l.tm-pol-nav-k{-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%);mask-image:linear-gradient(90deg,transparent,#000 14%)}
}

/* --- nowy wygląd działu (idea #361, 2026-09-24, spec docs/superpowers/specs/2026-09-24-polityka-ux-design.md §5):
   link powrotu (strony szczegółowe zamiast menu), etykiety rodzaju/głosu/werdyktu/statusu (słowo + kolor, kontrast
   co najmniej 4,5:1 pilnuje PolitykaCssTest - format reguły {background:#…;color:#…} jest częścią testu), karta
   wpisu jednej listy dla całego działu, pasek wyniku, przycisk „więcej”, nagłówki dni, osoby, źródła w <details>.
   Tytuł karty obcięty do 3 linii line-clamp z line-height względnym i padding-block 1px (kreski nad Ś/Ź) --- */
.tm-pol-powrot{display:inline-flex;gap:5px;margin:0 0 8px;font:600 13px var(--f-lab);letter-spacing:.02em;color:var(--loc);text-decoration:none}
.tm-pol-powrot:hover{text-decoration:underline}
.tm-pol-powrot:focus-visible{outline:2px solid var(--loc);outline-offset:2px}
.tm-pol-typ{display:inline-block;padding:2px 7px;border-radius:4px;font:600 11px/1.4 var(--f-lab);letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
.tm-pol-typ-interpelacja{background:#efe8f7;color:#5b2a86}
.tm-pol-typ-zapytanie{background:#e8eaf6;color:#303f9f}
.tm-pol-typ-odpowiedz{background:#e0f2f1;color:#00695c}
.tm-pol-typ-wystapienie{background:#e3f0fb;color:#1558a0}
.tm-pol-typ-glosowanie{background:#fff3e0;color:#8a4b00}
.tm-pol-typ-sprawozdanie{background:#e0f5f7;color:#006270}
.tm-pol-typ-pismo{background:#f4f5f8;color:#1d222b}
.tm-pol-typ-projekt{background:#f4f5f8;color:#1d222b}
.tm-pol-glos{display:inline-block;padding:1px 7px;border:1px solid;border-radius:4px;font:700 11px/1.45 var(--f-lab);letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
.tm-pol-glos-za{background:#eaf6ee;color:#1c7c43}
.tm-pol-glos-przeciw{background:#fdecea;color:#b3261e}
.tm-pol-glos-wstrzymal{background:#fff4e0;color:#8a5a00}
.tm-pol-glos-nieobecny{background:#ffffff;color:#626b79}
.tm-pol-glos-brak{background:#ffffff;color:#626b79}
.tm-pol-werd{display:inline-flex;align-items:center;gap:5px;padding:2px 9px 2px 7px;border-radius:999px;font:700 11px/1.45 var(--f-lab);letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
.tm-pol-werd::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.tm-pol-werd-tak{background:#e6f4ea;color:#1c6b3a}
.tm-pol-werd-nie{background:#fdecea;color:#a3221b}
.tm-pol-status{display:inline-block;padding:1px 7px;border-radius:4px;font:600 11px/1.45 var(--f-lab);letter-spacing:.03em;white-space:nowrap}
.tm-pol-status-odpowiedz{background:#e6f4ea;color:#1c6b3a}
.tm-pol-status-czeka{background:#f4f5f8;color:#555d6b}
.tm-pol-status-termin{background:#fff3e0;color:#8a4b00}
/* stan projektu ustawy (stanKlasa z PHP, spec UX 2026-09-24): uchwalony zielono, odrzucony czerwono, pozostałe szaro */
.tm-pol-status-toku{background:#f4f5f8;color:#555d6b}
.tm-pol-status-uchwalony{background:#e6f4ea;color:#1c6b3a}
.tm-pol-status-odrzucony{background:#fdecea;color:#a3221b}
.tm-pol-status-wycofany{background:#f4f5f8;color:#555d6b}
.tm-pol-status-zakonczony{background:#f4f5f8;color:#555d6b}
.tm-pol-wpisy{list-style:none;margin:0 0 16px;padding:0}
.tm-pol-wpis{padding:12px 0 13px;border-bottom:1px solid var(--line)}
.tm-pol-wpis-m{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0 0 5px}
.tm-pol-wpis-d{font-size:12.5px;color:var(--txt-2)}
.tm-pol-wpis-m>.tm-pol-nl{font-weight:600;color:var(--txt-h)}
.tm-pol-wpis-t{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;padding-block:1px;font:600 15.5px/1.4 var(--f-ui);color:var(--txt-h);text-decoration:none}
.tm-pol-wpis-t:hover,.tm-pol-wpis-t:focus-visible{color:var(--loc);text-decoration:underline}
/* tytuł głosowania w całości (idea #427): link bez ucinania (zdanie AI ze znaczkiem albo pełny tytuł), pod zdaniem AI
   oficjalny tytuł małą, stonowaną czcionką; długi tytuł (do ok. 950 znaków) zawija się w kolumnie karty */
.tm-pol-wpis-t-pelny{display:block;-webkit-line-clamp:none;overflow:visible;overflow-wrap:break-word;overflow-wrap:anywhere}
.tm-pol-wpis-t-pelny .tm-pol-ai-z{font-size:10px}
.tm-pol-wpis-of{margin:3px 0 0;font-size:12px;line-height:1.45;color:var(--txt-2);overflow-wrap:break-word;overflow-wrap:anywhere}
.tm-pol-wpis-p{margin:3px 0 0;font-size:13.5px;line-height:1.5;color:var(--txt-2)}
.tm-pol-wpis-o{display:flex;flex-wrap:wrap;align-items:center;gap:4px 7px;margin:7px 0 0;font-size:13px}
.tm-pol-wpis-f{margin:6px 0 0;font-size:14px;line-height:1.55;color:var(--txt)}
/* treść karty listy najwyżej 3 linie (spec 5.4): line-height względny i padding-block 1px jak w .tm-pol-wpis-t (kreski nad Ś/Ź) */
.tm-pol-lin3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;padding-block:1px}
.tm-pol-wpis-w{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:7px 0 0;font-size:12.5px;color:var(--txt-2);font-variant-numeric:tabular-nums}
.tm-pol-wpis-w .tm-pol-wbar{flex:0 0 150px}
.tm-pol-wbar{display:flex;gap:2px;height:6px;border-radius:3px;overflow:hidden;background:var(--band)}
.tm-pol-wbar>span{display:block;height:100%}
.tm-pol-wbar-za{background:#2fa26b}
.tm-pol-wbar-przeciw{background:var(--brand)}
.tm-pol-wbar-wstrzymalo{background:#c98a0b}
.tm-pol-btn{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:8px 16px;border:1px solid var(--hair);border-radius:999px;background:#fff;font:600 14px/1.3 var(--f-ui);color:var(--txt-h);text-decoration:none;transition:border-color .2s,color .2s}
.tm-pol-btn:hover{border-color:var(--loc);color:var(--loc)}
.tm-pol-btn:focus-visible{outline:2px solid var(--loc);outline-offset:2px}
.tm-pol-btns{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 24px}
.tm-pol-dzien-h{margin:20px 0 0;padding:0 0 6px;border-bottom:2px solid var(--txt-h);font:700 13px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-h)}
.tm-pol-osy{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;padding:0;list-style:none}
.tm-pol-oso{display:inline-flex;align-items:center;gap:7px;min-width:0;font-size:13.5px}
.tm-pol-zrodla{margin:28px 0 0;padding-top:12px;border-top:1px solid var(--line);font-size:12.5px;line-height:1.55;color:var(--txt-2)}
.tm-pol-zrodla summary{cursor:pointer;font:600 13px var(--f-lab);letter-spacing:.02em;color:var(--txt-2)}
.tm-pol-zrodla summary:focus-visible{outline:2px solid var(--loc);outline-offset:2px}
.tm-pol-zrodla p{margin:6px 0 0}
/* przegląd miasta: karty „Kto reprezentuje {miasto}” (organ, rada, posłowie i senatorowie) - zastąpiły kafle
   skrótów (UX 2026-09-24); siatka auto-fit, bo szerokość kolumny treści zmienia się z paskiem bocznym */
.tm-pol-reps{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:4px 0 26px}
.tm-pol-rep{display:flex;flex-direction:column;gap:6px;min-width:0;padding:16px 16px 14px;border:1px solid var(--line);border-radius:12px;background:#fff}
.tm-pol-rep>p{margin:0}
.tm-pol-rep-e{margin:0;font:600 11.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-2)}
.tm-pol-rep-n{margin:0;font:700 19px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-pol-rep-n2{font:700 16px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-pol-rep-w{font:700 28px/1.1 var(--f-lab);color:var(--txt-h)}
.tm-pol-rep-o{font-size:13.5px;line-height:1.5;color:var(--txt-2)}
.tm-pol-rep-av{display:flex;flex-wrap:wrap;gap:5px;margin:2px 0;padding:0;list-style:none}
.tm-pol-rep-av .tm-pol-mo{padding:0}
.tm-pol-rep-av a.tm-pol-mph:focus-visible{outline:2px solid var(--loc);outline-offset:2px}
.tm-pol-rep-wiecej .tm-pol-ini{display:flex;color:var(--loc);text-decoration:none}
.tm-pol-rep .tm-pol-btns{margin:auto 0 0;padding-top:8px}
.tm-pol-rep .tm-pol-pasek{margin:4px 0 2px}
.tm-pol-rep .tm-pol-grupy{margin:0;font-size:13px}
.tm-pol-rep .tm-pol-zapow{margin:0 0 4px}
/* przegląd portalu polska (UX 2026-09-24): ranking miast z paskiem (szerokość z PHP, 100% = pierwsze miasto,
   pasek aria-hidden, liczba tekstem) i kafle archiwum Sejmu */
.tm-pol-ranking{list-style:none;margin:0 0 10px;padding:0;counter-reset:tmpolr}
.tm-pol-ranking li{display:grid;grid-template-columns:26px minmax(100px,170px) minmax(0,1fr) 48px;align-items:center;gap:10px;padding:5px 0;font-size:14px;counter-increment:tmpolr}
.tm-pol-ranking li::before{content:counter(tmpolr) ".";font:600 13px var(--f-lab);color:var(--txt-2);text-align:right}
.tm-pol-ranking-b{height:8px;border-radius:4px;background:var(--band);overflow:hidden}
.tm-pol-ranking-b span{display:block;height:100%;border-radius:4px;background:var(--loc)}
.tm-pol-ranking-n{text-align:right;font-size:13px;color:var(--txt-2);font-variant-numeric:tabular-nums}
.tm-pol-arch{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin:4px 0 26px}
.tm-pol-arch a{display:flex;flex-direction:column;gap:3px;padding:14px 16px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--txt);text-decoration:none;transition:border-color .2s}
.tm-pol-arch a:hover,.tm-pol-arch a:focus-visible{border-color:var(--loc)}
.tm-pol-arch a:focus-visible{outline:2px solid var(--loc);outline-offset:2px}
.tm-pol-arch b{font:700 15.5px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-pol-arch span{font-size:13px;line-height:1.45;color:var(--txt-2)}
/* strona głosowania (UX 2026-09-24, spec §6.6): karta wyniku z werdyktem pod nagłówkiem, duży pasek, liczby z
   procentami (kolor tylko wzmacnia etykietę), posłowie miasta w grupach głosu, mini pasek klubu; długi nagłówek
   (ponad 90 znaków) mniejszą czcionką - na telefonie tytuł „Pkt. 13 Sprawozdanie…” zajmował cały ekran */
.tm-h1k.tm-pol-h1-dl{font-size:22px;line-height:1.3}
.tm-pol-wynik-k{margin:6px 0 26px;padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:#fff}
.tm-pol-wynik-k>.tm-pol-rep-e{margin:0 0 10px}
.tm-pol-werd-r{margin:0}
.tm-pol-werd-l{padding:5px 14px 5px 11px;font-size:13px}
.tm-pol-werd-o{margin:8px 0 12px;font-size:14px;line-height:1.5;color:var(--txt)}
.tm-pol-werd-c{font:600 14px/1.4 var(--f-ui);color:var(--txt-h)}
.tm-pol-wpis-p>.tm-pol-werd{margin-right:2px;vertical-align:1px}
.tm-pol-wbar-l{height:14px;border-radius:7px}
.tm-pol-wynik-n{display:flex;flex-wrap:wrap;gap:8px 28px;margin:12px 0 0}
.tm-pol-wynik-n>div{display:flex;flex-direction:column}
.tm-pol-wynik-n dt{font:600 12px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--txt-2)}
.tm-pol-wynik-n dd{margin:0;font:700 22px/1.2 var(--f-lab);color:var(--txt-h);font-variant-numeric:tabular-nums}
.tm-pol-wynik-n small{font:500 13px var(--f-ui);color:var(--txt-2)}
.tm-pol-wynik-za dt{color:#1c7c43}
.tm-pol-wynik-przeciw dt{color:#b3261e}
.tm-pol-wynik-wstrzymalo dt{color:#8a5a00}
.tm-pol-wynik-p{margin:8px 0 0;font-size:12.5px;color:var(--txt-2)}
.tm-pol-glg-h{margin:14px 0 8px;font:700 14px var(--f-ui);color:var(--txt-h)}
.tm-pol-td-bar{width:110px;vertical-align:middle}
.tm-pol-td-bar .tm-pol-wbar{width:100px}
/* nagłówek profilu posła (UX 2026-09-24): trzy liczby prowadzące do zakładek pod funkcją i klubem */
.tm-pol-hero-l{display:flex;flex-wrap:wrap;gap:10px 26px;margin:12px 0 0;padding:0;list-style:none}
.tm-pol-hero-a{display:flex;flex-direction:column;gap:1px;color:var(--txt);text-decoration:none}
.tm-pol-hero-a:hover .tm-pol-hero-e,.tm-pol-hero-a:focus-visible .tm-pol-hero-e{color:var(--loc);text-decoration:underline}
.tm-pol-hero-a:focus-visible{outline:2px solid var(--loc);outline-offset:2px}
.tm-pol-hero-w{font:700 22px/1.15 var(--f-lab);color:var(--txt-h);font-variant-numeric:tabular-nums}
.tm-pol-hero-e{font-size:12.5px;color:var(--txt-2)}
.tm-pol-hero-a .tm-pol-frek{margin:3px 0 0;max-width:120px}
/* pismo i projekt (UX 2026-09-24, spec §6.9): autorzy pisma jako osoby pod tytułem, przebieg prac projektu jako oś
   z kropkami (poziomy wcięte klasami .tm-pol-etap-1..3) i werdyktem przy etapie z głosowaniem */
.tm-pol-pismo-o{margin:10px 0 20px;padding:12px 14px;border:1px solid var(--line);border-radius:10px}
.tm-pol-pismo-o .tm-pol-rep-e{margin:0 0 8px}
.tm-pol-kroki{list-style:none;margin:0 0 18px;padding:0 0 0 6px}
.tm-pol-kroki li{position:relative;padding:3px 0 14px 20px;border-left:2px solid var(--line);font-size:14px;line-height:1.5}
.tm-pol-kroki li::before{content:"";position:absolute;left:-7px;top:7px;width:8px;height:8px;border-radius:50%;background:#fff;border:2px solid var(--loc)}
.tm-pol-kroki li:last-child{border-left-color:transparent}
.tm-pol-kroki .tm-pol-werd{vertical-align:1px}
/* posiedzenia, komisje, lista posłów polska (UX 2026-09-24, spec §6.10): dni posiedzenia jako pigułki w karcie,
   skok do okręgu nad listą 41 okręgów - na telefonie jeden wiersz przewijany w poziomie (bez zwijania) */
.tm-pol-dni-l{margin:7px 0 0}
.tm-pol-okskok{margin:0 0 18px}
.tm-pol-okskok-h{margin:0 0 8px;font:600 13px var(--f-lab);color:var(--txt-2)}
/* karta posła miasta klikalna w całości: link nazwiska rozciągnięty ::after na kartę (spec 6.3) */
.tm-pol-os-k{position:relative;transition:border-color .15s}
.tm-pol-os-k .tm-pol-n a::after{content:"";position:absolute;inset:0;border-radius:10px}
.tm-pol-os-k:hover{border-color:var(--loc)}
.tm-pol-os-k:focus-within{outline:2px solid var(--loc);outline-offset:2px}
/* pełny ranking „Miasta w Sejmie”: pasek w kolumnie Razem (100% = pierwsze miasto, proc z PHP) */
.tm-pol-razem{display:inline-flex;align-items:center;gap:8px}
.tm-pol-razem .tm-pol-ranking-b{flex:none;width:72px}
@media(max-width:600px){
.tm-pol-okskok .tm-pol-okm-l{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.tm-pol-okskok .tm-pol-okm-l li{flex:none}
.tm-pol-razem .tm-pol-ranking-b{width:40px}
.tm-pol-wpis-w .tm-pol-wbar{flex-basis:100%}
.tm-pol-hero-l{gap:8px 18px}
.tm-pol-hero-w{font-size:19px}
.tm-h1k.tm-pol-h1-dl{font-size:19px}
.tm-pol-wynik-n dd{font-size:19px}
.tm-pol-ranking li{grid-template-columns:22px minmax(90px,120px) minmax(0,1fr) 40px;gap:8px}
}

/* SG portalu polska (2026-10-12): sejm (widget {TMsejm} + ext/S/NT3sejmSekcja.tpl): po lewej siatka miast z liczbą spraw
   w Sejmie z 30 dni (link na stronę miasta), po prawej kafle "Sejm w liczbach" 2 x N (.tm-gC) */
.tm-sejmsg,.tm-sejmsg-l,.tm-sejmsg-r{min-width:0}
.tm-sejmsg-ok{margin-left:6px;font-weight:400;letter-spacing:.04em;text-transform:none;color:var(--txt-2)}
.tm-sejmsg-m{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:20px}
.tm-sejmsg-m li{min-width:0;border-bottom:1px solid var(--line)}
.tm-sejmsg-m a{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:8px 0;font-size:14.5px;color:var(--txt-h);text-decoration:none}
.tm-sejmsg-mn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.tm-sejmsg-ml{font:600 13px var(--f-ui);color:var(--txt-2);font-variant-numeric:tabular-nums}
.tm-sejmsg-m a:hover .tm-sejmsg-mn,.tm-sejmsg-m a:focus-visible .tm-sejmsg-mn{color:var(--loc);text-decoration:underline}
.tm-sejmsg-k{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tm-sejmsg-k li{min-width:0}
.tm-sejmsg-k li.tm-sejmsg-kw{grid-column:1/-1}
.tm-sejmsg-k a{display:flex;flex-direction:column;gap:2px;height:100%;box-sizing:border-box;padding:9px 10px;border:1px solid var(--line);border-radius:6px;background:var(--loc-bg);color:var(--txt-h);text-decoration:none}
.tm-sejmsg-k a:hover,.tm-sejmsg-k a:focus-visible{border-color:var(--loc)}
.tm-sejmsg-ke{font:600 11px/1.3 var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--txt-2)}
.tm-sejmsg-k strong{font:700 21px/1.2 var(--f-ui);font-variant-numeric:tabular-nums}
.tm-sejmsg-kw strong{font-size:16px}
.tm-sejmsg-tr{margin-left:5px;font-size:11px;vertical-align:3px;color:var(--txt-2)}
.tm-sejmsg-ko{font-size:12px;line-height:1.35;color:var(--txt-2)}
@media(max-width:880px){
	.tm-sejmsg.tm-gC{gap:20px}
	.tm-sejmsg-k{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
}
@media(max-width:560px){
	.tm-sejmsg-m{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* =====================================================================================
   MODUŁ NEKROLOGI - DZIAŁ PUBLICZNY (idea #349, 2026-09-14)
   Szablony smarty/templates/ext/nekrologi/*.tpl (ext/nekrologi.php): lista kart, strona
   nekrologu, wizytówka zakładu, blok "Pogrzeby dziś i jutro" w kolumnie, strona błędu.
   Bez wiersza w `strony` moduł rysuje układ sam (.tm-in/.tm-cols/.tm-side z css.css) - tu tylko
   to, czego motyw nie ma. Akcent --loc (granat modułów miejskich: pas "Twoje miasto", /apteki,
   /polityka); żadnej czerwieni marki w treści nekrologu (stonowane kolory, płomień znicza to
   jedyny ciepły akcent). Drobne teksty w --txt-2 (AA na bieli), nie --txt-3.
   Bez ucinania nadmiaru pudełka i bez sztywnej wysokości linii w pikselach przy tekstach
   z polskimi znakami (ścina kreski nad Ś/Ź i ogonki - notatka o ellipsis w theme/3); test
   testCssModulu szuka zakazanej deklaracji w CAŁYM bloku łącznie z tym komentarzem.
   Każda klasa .tm-nek-* użyta w szablonach działu ma tu regułę (test testCssModulu).
   Reguły .tm-nek-pog* / .tm-nek-pusto / .tm-nek-pogrzeb-miniony są WSPÓLNE z widgetem
   TMnekrologiPogrzeby (NT3nekrologiPas/Side.tpl, Zadanie 15) - tam ich nie powtarzać.
   Znicz (.tm-nek-znicz-btn) i mapa (#nkMapa) dostają stany interakcji w Zadaniu 13,
   dopisywane ZA znacznikiem końca tej sekcji.
   ===================================================================================== */
.tm-nek-body{padding-top:14px}
.tm-nek-body .tm-bc{margin-bottom:12px}
.tm-nek-bcs{margin:0 2px;color:var(--txt-3)}
.tm-nek-head .tm-h1k{margin-left:0}
.tm-nek-lead{margin:-6px 0 18px;font-size:15px;line-height:1.55;color:var(--txt-2);max-width:760px}
.tm-nek-note{margin:0 0 14px;padding:10px 14px;border-left:3px solid var(--loc);background:var(--loc-bg);border-radius:0 6px 6px 0;font-size:13.5px;line-height:1.5;color:var(--txt-2)}
.tm-nek-note a{color:var(--loc);font-weight:600}

/* --- pasek zakładów z licencją (kolejność wg stażu abonamentu); stoi POD kartami i stronicowaniem,
   w pustym dziale pod informacją dla czytelników, zawsze nad boxem dla zakładów --- */
.tm-nek-pasek{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin:24px 0 0;padding:12px 16px;border:1px solid var(--loc-line);border-radius:8px;background:var(--loc-bg)}
.tm-nek-pasek-lab{font:600 11px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--loc)}
.tm-nek-pasek a{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;font-weight:600;color:var(--txt);text-decoration:none}
.tm-nek-pasek a:hover span{color:var(--loc);text-decoration:underline}
.tm-nek-pasek-logo{display:block;height:48px;width:auto;max-width:160px}

/* --- siatka kart (2 kolumny > 700 px) --- */
.tm-nek-lista{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0 0 6px}
.tm-nek-karta{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;padding:14px;border:1px solid var(--line);border-top:3px solid var(--txt-h);border-radius:8px;background:#fff}
.tm-nek-karta-foto a[data-lity]{display:block}
.tm-nek-karta-foto img{display:block;width:120px;height:160px;object-fit:cover;border-radius:6px;background:var(--band)}
.tm-nek-nofoto{display:flex;align-items:center;justify-content:center;width:120px;height:160px;border-radius:6px;background:var(--band);color:var(--txt-3)}
.tm-nek-karta-txt{min-width:0}
.tm-nek-imie{margin:0 0 6px;font:700 18px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-nek-imie a{color:inherit;text-decoration:none}
.tm-nek-imie a:hover{color:var(--loc)}
.tm-nek-sp{font-weight:500;letter-spacing:.08em;color:var(--txt-2)}
.tm-nek-daty{margin:0 0 6px;font-size:13.5px;line-height:1.5;color:var(--txt-2)}
.tm-nek-wiek{white-space:nowrap}
.tm-nek-pogrzeb{margin:0 0 4px;font-size:13.5px;line-height:1.5;color:var(--txt)}
.tm-nek-pogrzeb b{font-weight:600;color:var(--loc)}
.tm-nek-cer{display:inline-flex;align-items:center;vertical-align:-2px;margin-right:7px;color:var(--txt-h)}
.tm-nek-pogrzeb-miniony .tm-nek-cer{color:var(--txt-2)}
.tm-nek-pogrzeb em{font-style:normal;color:var(--txt-2)}
.tm-nek-pogrzeb-miniony,.tm-nek-pogrzeb-miniony b{color:var(--txt-2)}
.tm-nek-org{margin:6px 0 0;font-size:12.5px;line-height:1.45;color:var(--txt-2)}
.tm-nek-org a{color:var(--loc);font-weight:600}
.tm-nek-org-logo{margin:6px 0 0}
.tm-nek-org-logo img{height:48px;width:auto}

/* --- rodzaj ceremonii (pomysł #385): jeden zestaw symboli z ext/nekrologi/_symbol.tpl - krzyż łaciński
   (katolicka), gałązka oliwna (świecka, bez znaków religijnych), świeca (inne wyznanie i brak wskazania).
   Kolor z otoczenia (currentColor), symbol stoi w linii tekstu; krzyż grubszą kreską (dwie linie to cały
   rysunek), gałązka cieńszą (drobne liście). --- */
.tm-nek-sym{display:inline-block;flex:none;vertical-align:-.15em}
.tm-nek-sym-krzyz{stroke-width:2.1}
.tm-nek-sym-galazka{stroke-width:1.5}
.tm-nek-sym-swieca{stroke-width:1.7}
.tm-nek-nofoto .tm-nek-sym{color:var(--txt-2)}

/* --- pusty dział: informacja dla czytelników i rodzin (zaproszenie dla zakładów jest w .tm-nek-oferta) --- */
.tm-nek-zaproszenie{padding:22px 24px;border:1px solid var(--loc-line);border-radius:8px;background:var(--loc-bg)}
.tm-nek-zaproszenie h2{margin:0 0 10px;font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-nek-zaproszenie p{margin:0 0 10px;font-size:14.5px;line-height:1.6}
.tm-nek-zaproszenie .tm-nek-note{margin:12px 0 0;background:#fff}

/* --- box dla zakładów pogrzebowych pod listą (_oferta.tpl): granatowy panel z inline SVG znicza
   i tekst z korzyściami oraz przyciskami tel:/mailto. Bez cen. Rogi panelu zaokrąglone własnym
   border-radius (bez ucinania nadmiaru pudełka). Płomień i blask migoczą wolno i tylko bez
   prefers-reduced-motion - jedyny ruch na stronie działu. --- */
.tm-nek-oferta{display:grid;grid-template-columns:250px minmax(0,1fr);margin:28px 0 0;border:1px solid var(--loc-line);border-radius:10px;background:#fff}
.tm-nek-oferta-graf{display:flex;align-items:center;justify-content:center;padding:18px 14px;border-radius:9px 0 0 9px;background:linear-gradient(165deg,#164b78 0%,#0d2f4e 62%,#0a2640 100%)}
.tm-nek-oferta-svg{display:block;width:100%;max-width:222px;height:auto}
.tm-nek-oferta-plomien{transform-box:fill-box;transform-origin:50% 100%;animation:tmNekPlomien 3.2s ease-in-out infinite}
.tm-nek-oferta-blask{animation:tmNekBlask 3.2s ease-in-out infinite}
@keyframes tmNekPlomien{0%,100%{transform:scale(1,1)}30%{transform:scale(.97,1.04)}55%{transform:scale(1.02,.96)}80%{transform:scale(.99,1.02)}}
@keyframes tmNekBlask{0%,100%{opacity:1}55%{opacity:.78}}
@media(prefers-reduced-motion:reduce){.tm-nek-oferta-plomien,.tm-nek-oferta-blask{animation:none}}
.tm-nek-oferta-txt{min-width:0;padding:22px 26px 22px}
.tm-nek-oferta-txt h2{margin:0 0 8px;font:700 22px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-nek-oferta-lead{margin:0 0 14px;max-width:62ch;font-size:15px;line-height:1.6;color:var(--txt)}
.tm-nek-oferta-lista{display:grid;gap:7px;margin:0 0 18px;padding:0;list-style:none}
.tm-nek-oferta-lista li{position:relative;padding-left:26px;font-size:14.5px;line-height:1.5;color:var(--txt)}
.tm-nek-oferta-lista li::before{content:"";position:absolute;left:3px;top:.42em;width:11px;height:6px;border-left:2px solid var(--loc);border-bottom:2px solid var(--loc);transform:rotate(-45deg)}
.tm-nek-oferta-cta{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.tm-nek-oferta-tel,.tm-nek-oferta-mail{display:inline-flex;align-items:center;gap:9px;padding:11px 20px;border-radius:999px;font:600 15px var(--f-ui);text-decoration:none;overflow-wrap:anywhere}
.tm-nek-oferta-tel{border:2px solid var(--loc);background:var(--loc);color:#fff}
.tm-nek-oferta-tel:hover{border-color:#0f4470;background:#0f4470;color:#fff}
.tm-nek-oferta-mail{border:2px solid var(--loc);background:#fff;color:var(--loc)}
.tm-nek-oferta-mail:hover{background:var(--loc-bg);color:var(--loc)}
.tm-nek-oferta-tel:focus-visible,.tm-nek-oferta-mail:focus-visible{outline:3px solid #f2a341;outline-offset:2px}
.tm-nek-oferta-tel svg,.tm-nek-oferta-mail svg{flex:none}
.tm-nek-oferta-przyp{margin:12px 0 0;font-size:13px;line-height:1.5;color:var(--txt-2)}
/* poniżej 761 px panel z grafiką idzie nad tekst (obok niego tekst robił się wąski, a panel wysoki) */
@media(max-width:760px){
 .tm-nek-oferta{grid-template-columns:minmax(0,1fr)}
 .tm-nek-oferta-graf{padding:12px;border-radius:9px 9px 0 0}
 .tm-nek-oferta-svg{max-width:160px}
}

/* --- stronicowanie segmentem ścieżki --- */
.tm-nek-pag{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:22px 0 6px}
.tm-nek-pag-a{display:inline-block;padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 13px var(--f-lab);color:var(--txt-2);text-decoration:none}
.tm-nek-pag-p,.tm-nek-pag-n{color:var(--loc)}
a.tm-nek-pag-a:hover{border-color:var(--loc);color:var(--loc)}
.tm-nek-pag-on{background:var(--loc);border-color:var(--loc);color:#fff}
.tm-nek-pag-info{margin:0 0 20px;font-size:12.5px;color:var(--txt-2)}

/* --- strona nekrologu: karta z czarną wstęgą u góry, nagłówek w układzie klepsydry (symbol ceremonii,
   zdjęcie, "Śp." i nazwisko, daty - jedna kolumna, wyśrodkowane; pomysł #385), bez czerwonej belki
   h1 z .tm-h1k (nekrolog nie jest artykułem marki) --- */
.tm-nek-strona .tm-h1k{overflow-wrap:anywhere}
.tm-nek-art{border-top:6px solid var(--txt-h)}
.tm-nek-art .tm-h1k{margin:0 0 8px;padding-left:0;border-left:0}
.tm-nek-naglowek{display:flex;flex-direction:column;align-items:center;gap:10px;padding-bottom:16px;border-bottom:1px solid var(--line);text-align:center}
.tm-nek-sym-top{order:-2;display:flex;justify-content:center;margin:0 0 2px;color:var(--txt-h)}
.tm-nek-naglowek-txt{min-width:0;max-width:100%}
.tm-nek-rodowe{margin:0 0 6px;font-size:15px;color:var(--txt-2)}
.tm-nek-naglowek .tm-nek-daty{font-size:15px}
.tm-nek-naglowek .tm-nek-sp{font-size:.72em;vertical-align:.08em}
.tm-nek-foto{order:-1;margin:0}
.tm-nek-foto a{display:block}
.tm-nek-foto img{display:block;width:160px;height:213px;object-fit:cover;border-radius:6px;background:var(--band)}
.tm-nek-sekcja{margin:22px 0 0;padding:14px 18px;border-left:3px solid var(--loc);background:var(--loc-bg);border-radius:0 8px 8px 0}
.tm-nek-sekcja h2{margin:0 0 8px;font:700 16px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-nek-sekcja-sym{display:inline-flex;align-items:center;vertical-align:-3px;margin-right:8px;color:var(--txt-h)}
.tm-nek-dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;font-size:14.5px;line-height:1.5}
.tm-nek-dl dt{font-weight:600;color:var(--txt-2)}
.tm-nek-dl dd{margin:0;color:var(--txt)}
.tm-nek-tresc{margin:22px 0 0;font-size:16.5px;line-height:1.7;text-align:center;color:var(--txt)}
.tm-nek-podpis{margin:14px 0 0;text-align:center;font-style:italic;font-size:15px;color:var(--txt-2)}
.tm-nek-obrazy{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:22px 0 0}
.tm-nek-obrazy a{display:block}
.tm-nek-obrazy img{display:block;max-width:100%;max-height:560px;width:auto;height:auto;border:1px solid var(--line);border-radius:6px}
.tm-nek-znicz{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin:24px 0 0;padding:16px 18px;border:1px solid var(--line);border-radius:8px;background:var(--band)}
.tm-nek-znicz form{margin:0}
.tm-nek-znicz-btn{display:inline-flex;align-items:center;gap:9px;border:0;border-radius:999px;padding:10px 18px;background:var(--loc);color:#fff;font:600 14px var(--f-ui);cursor:pointer}
.tm-nek-znicz-btn:hover{background:#0f4470}
.tm-nek-znicz-ico{position:relative;display:inline-block;width:14px;height:18px;border-radius:7px 7px 3px 3px;background:linear-gradient(#ffd27a,#f2a341)}
.tm-nek-znicz-ico::before{content:"";position:absolute;left:50%;top:-8px;width:6px;height:9px;margin-left:-3px;border-radius:50% 50% 40% 40%;background:#ffb64d}
.tm-nek-znicz-lic{margin:0;font-size:14px;color:var(--txt-2)}
.tm-nek-znicz-lic b{font-weight:600;color:var(--txt-h)}
.tm-nek-znicz-n{font-size:16px}
.tm-nek-znicz-info{flex-basis:100%;margin:0;font-size:13px;color:var(--txt-2)}
.tm-nek-udostepnij{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:18px 0 0;font-size:13px;color:var(--txt-2)}
.tm-nek-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--loc-line);border-radius:999px;padding:7px 14px;background:#fff;color:var(--loc);font:600 13px var(--f-ui);cursor:pointer;text-decoration:none}
.tm-nek-btn:hover{background:var(--loc-bg)}
.tm-nek-btn-l{padding:6px 12px;font-size:12.5px}
.tm-nek-copy-msg{font-size:12.5px;color:#1c6b43}
.tm-nek-art .tm-nek-org{margin-top:20px;font-size:13.5px}
/* trzy klasy: theme koloruje linki w .tm-pagecard na --brand selektorem o specyficzności (0,2,3) - nekrolog ma zostać bez czerwieni marki */
.tm-nek-strona .tm-nek-art .tm-nek-org a{color:var(--loc)}
.tm-nek-strona .tm-nek-art .tm-nek-zglos a{color:var(--txt-2)}
.tm-nek-strona .tm-nek-art .tm-nek-zglos a:hover{color:var(--loc)}
.tm-nek-zglos{margin:16px 0 0;font-size:12.5px}
.tm-nek-zglos a{color:var(--txt-2);text-decoration:underline}
.tm-nek-zglos a:hover{color:var(--loc)}

/* --- wizytówka zakładu --- */
.tm-nek-wizytowka{margin:0 0 22px}
.tm-nek-wiz-h{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin:0 0 16px}
.tm-nek-wiz-h .tm-h1k{margin:0 0 4px}
.tm-nek-wiz-logo{display:block}
.tm-nek-wiz-logo img{display:block;height:80px;width:auto;max-width:240px}
.tm-nek-wiz-typ{margin:0;font:600 12px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--loc)}
.tm-nek-wiz-dane{grid-template-columns:90px minmax(0,1fr)}
.tm-nek-wiz-dane a{color:var(--loc);font-weight:600}
.tm-nek-wiz-opis{margin:16px 0 0;font-size:15px;line-height:1.65}
.tm-nek-mapa{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0}
.tm-nek-mapa-box{flex-basis:100%;height:320px;border:1px solid var(--line);border-radius:8px;background:var(--band)}
.tm-nek-mapa-box[hidden]{display:none}
.tm-nek-wiz-lista{margin:22px 0 0}
.tm-nek-wiz-lista .tm-h2k{margin:0 0 12px}

/* --- kolumna: "Pogrzeby dziś i jutro" (wspólne z widgetem TMnekrologiPogrzeby) --- */
.tm-nek-pog{list-style:none;margin:0;padding:0}
.tm-nek-pog-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 6px;padding:6px 0;border-top:1px dashed var(--line);font-size:13px;line-height:1.4}
.tm-nek-pog-row:first-child{border-top:0;padding-top:0}
.tm-nek-pog-sym{display:inline-flex;align-items:center;align-self:center;color:var(--txt-h)}
.tm-nek-pogrzeb-miniony .tm-nek-pog-sym{color:var(--txt-2)}
.tm-nek-pog-kiedy{flex:none;font:600 12px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--loc)}
.tm-nek-pog-kiedy em{font-style:normal;font-weight:500;letter-spacing:0;text-transform:none;color:var(--txt-2)}
.tm-nek-pog-kto{flex:1 1 auto;min-width:0;font-weight:600;color:var(--txt)}
.tm-nek-pog-kto:hover{color:var(--loc)}
.tm-nek-pog-gdzie{flex-basis:100%;font-size:12px;color:var(--txt-2)}
.tm-nek-pogrzeb-miniony .tm-nek-pog-kiedy,.tm-nek-pogrzeb-miniony .tm-nek-pog-kto,.tm-nek-pogrzeb-miniony .tm-nek-pog-gdzie{color:var(--txt-2)}
.tm-nek-pogrzeb-miniony .tm-nek-pog-kto{font-weight:500}
.tm-nek-pog-wiecej{display:inline-block;margin-top:7px;font-size:12.5px;font-weight:600;color:var(--loc)}
.tm-nek-pog-wiecej:hover{text-decoration:underline}
.tm-nek-pusto,.tm-nek-pog-pusto{margin:0;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-nek-pog-side .tm-nek-pog-row{font-size:13.5px}
.tm-nek-wiz-lista .tm-nek-pusto{font-size:14px}

/* --- strona błędu --- */
.tm-nek-blad .tm-nek-lead{margin-top:0}

/* --- responsywność: karty w jednej kolumnie < 701 px, mniejsze miniatury i nagłówek w pionie < 601 px --- */
@media(max-width:880px){.tm-nek-body .tm-side{margin-top:18px}}
@media(max-width:700px){.tm-nek-lista{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){
 .tm-nek-karta{grid-template-columns:88px minmax(0,1fr);gap:12px;padding:12px}
 .tm-nek-karta-foto img,.tm-nek-nofoto{width:88px;height:117px}
 .tm-nek-imie{font-size:16.5px}
 .tm-nek-foto img{width:120px;height:160px}
 .tm-nek-tresc{font-size:15.5px;text-align:left}
 .tm-nek-dl,.tm-nek-wiz-dane{grid-template-columns:minmax(0,1fr);gap:2px 0}
 .tm-nek-dl dt{margin-top:6px}
 .tm-nek-pasek{gap:8px 16px;padding:10px 12px}
 .tm-nek-pasek-logo{height:36px}
 .tm-nek-mapa-box{height:260px}
 .tm-nek-zaproszenie{padding:16px 16px}
 .tm-nek-oferta-txt{padding:16px 16px 18px}
 .tm-nek-oferta-txt h2{font-size:19px}
 .tm-nek-oferta-tel,.tm-nek-oferta-mail{flex:1 1 100%;justify-content:center}
}
/* --- koniec sekcji nekrologi (Zadanie 12) --- */
/* --- Nekrologi: formularz zgłoszenia, komunikaty, stany skryptu nekrologi.js (Zadanie 13) --- */
.tm-nek-zglos-strona{max-width:760px}
.tm-nek-zglos-strona .tm-nek-lead{margin-top:0}
.tm-nek-lead a{color:var(--loc);font-weight:600}
.tm-nek-flash{margin:0 0 18px;padding:12px 16px;border:1px solid #bfe0c8;border-radius:8px;background:#f1faf3;color:#1f5f34;font-size:14.5px;line-height:1.5}
.tm-nek-flash-err{border-color:#e6c3b0;background:#fbf2ec;color:#7a3a1d}
.tm-nek-form{display:flex;flex-direction:column;gap:14px}
.tm-nek-form .tm-nek-note{margin:4px 0 0}
.tm-nek-pole{display:flex;flex-direction:column;gap:6px}
.tm-nek-pole label{font-weight:600;font-size:14px;color:var(--txt-h)}
.tm-nek-pole select,.tm-nek-pole textarea,.tm-nek-pole input[type=email]{font:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--txt-h)}
.tm-nek-pole select:focus,.tm-nek-pole textarea:focus,.tm-nek-pole input[type=email]:focus{border-color:var(--loc);outline:2px solid var(--loc-line);outline-offset:0}
.tm-nek-pole textarea{resize:vertical;min-height:140px}
.tm-nek-pole-btn{display:flex;flex-direction:row;align-items:center;gap:10px;flex-wrap:wrap;margin:4px 0 0}
.tm-nek-btn[hidden]{display:none}
.tm-nek-btn[disabled]{opacity:.55;cursor:not-allowed}
.tm-nek-btn.is-ok{background:#1f5f34;border-color:#1f5f34;color:#fff}
.tm-nek-znicz-btn.is-wait{opacity:.6;cursor:progress}
.tm-nek-znicz-btn.is-on{background:#fff;color:var(--loc);box-shadow:inset 0 0 0 1px var(--loc-line);cursor:default}
.tm-nek-znicz-info.is-ok{color:#1f5f34}
.tm-nek-mapa-box.leaflet-container{clip-path:inset(0 round 8px)}
/* --- koniec sekcji nekrologi (Zadanie 13) --- */
/* --- Nekrologi: link "Zobacz pełną ofertę" w _oferta.tpl, podstrona dla zakładów pogrzebowych (Zadanie 16) --- */
.tm-nek-oferta-more{color:var(--loc);font-weight:600;text-decoration:none}
.tm-nek-oferta-more:hover{text-decoration:underline}
/* --- koniec sekcji nekrologi (Zadanie 16) --- */
/* --- Nekrologi: pasek "Pogrzeby dziś i jutro" na stronie głównej miasta (widget TMnekrologiPogrzeby,
   szablon ext/S/NT3nekrologiPas.tpl, wołany w indexMiasta.tpl POD kaflami .tm-locnews; pomysł #349,
   decyzja właściciela 2026-09-15). Niska biała belka w stylu kart pasa (.tm-locmod: ramka --loc-line,
   promień 10 px): nagłówek to .tm-locmh (etykieta + link "wszystkie nekrologi" po prawej - te same
   style, cel dotykowy i warianty mobilne co nagłówki pogody/apteki), pod nim jeden wiersz pozycji
   z zawijaniem: [logo 24 px] DZIŚ, 12:00 Śp. Imię Nazwisko Miejsce. Zakład to wyłącznie logo (nazwa
   w alt/title). Miniony dziś (.tm-nek-sg-min) wyszarzony jak w kolumnie działu. Bez czerwieni marki
   (nekrologi), bez ucinania nadmiaru pudełka (ścina kreski nad Ś/Ź i ogonki), bez sztywnej wysokości
   linii w px. Pomiar 1440 px: nagłówek + wiersz trzech pozycji = ok. 60 px, kafle nad paskiem bez zmian.
   Telefon (<=700 px): .tm-locmods ma tam display:contents, więc pasek jest pozycją tego samego
   flexa .tm-loc>.tm-in co nagłówek (order 1), pogoda (2), kafle (3), apteka i wydarzenia (4);
   order:3 stawia go tuż POD kaflami (DOM za nimi), przed apteką - bez order dostałby 0 i wskoczył
   NAD nagłówek pasa. Pozycje jedna pod drugą, gap flexa (7px) zastępuje margin-top. --- */
.tm-nek-sg{margin-top:12px;padding:9px 13px 10px;background:#fff;border:1px solid var(--loc-line);border-radius:10px}
.tm-nek-sg-h{margin-bottom:6px}
.tm-nek-sg-l{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;list-style:none;margin:0;padding:0}
.tm-nek-sg-i{display:inline-flex;flex-wrap:wrap;align-items:center;gap:2px 7px;font-size:13.5px;line-height:1.4;color:var(--txt)}
.tm-nek-sg-logo{display:inline-flex;align-items:center}
.tm-nek-sg-logo img{display:block;height:24px;width:auto;max-width:72px}
.tm-nek-sg-sym{display:inline-flex;align-items:center;color:var(--txt-h)}
.tm-nek-sg-kiedy{font:600 12px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--loc)}
.tm-nek-sg-kiedy em{font-style:normal;font-weight:500;letter-spacing:0;text-transform:none;color:var(--txt-2)}
.tm-nek-sg-kto{font-weight:600;color:var(--txt)}
.tm-nek-sg-kto:hover{color:var(--loc);text-decoration:underline}
.tm-nek-sg-gdzie{font-size:12.5px;color:var(--txt-2)}
.tm-nek-sg-min .tm-nek-sg-kiedy,.tm-nek-sg-min .tm-nek-sg-kto,.tm-nek-sg-min .tm-nek-sg-gdzie,.tm-nek-sg-min .tm-nek-sg-sym{color:var(--txt-2)}
.tm-nek-sg-min .tm-nek-sg-kto{font-weight:500}
/* tryb "Ostatnie nekrologi": data śmierci to spokojna informacja, nie termin - bez wersalików i akcentu godziny */
.tm-nek-sg-ost .tm-nek-sg-kiedy{font-family:inherit;font-size:12.5px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--txt-2)}
@media(max-width:700px){
 .tm-nek-sg{flex:1 1 100%;order:3;margin-top:0;padding:7px 10px 8px;border-radius:8px}
 .tm-nek-sg-h{margin-bottom:4px}
 .tm-nek-sg-l{flex-direction:column;align-items:stretch;gap:4px}
 .tm-nek-sg-i{display:flex;font-size:13px}
}
/* --- koniec sekcji nekrologi (pasek SG) --- */
/* --- Sekcja "Pamiętamy" na dole głównej kolumny SG miasta (2026-10-10; indexMiasta.tpl, NT3pamietamyNekrolog.tpl,
   NT3pamietamyZnani.tpl). Akcent stonowany (--ac z sekcji, szary łupek), bez czerwieni marki. Siatka: rocznice po
   lewej (kafelek daty + osoba + rocznica), panel nekrologów z informacją dla zakładów pogrzebowych po prawej (300 px);
   bez rocznic sam panel (.tm-pam-sam). Telefon: panel pod listą. --- */
.tm-pam-in{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;align-items:stretch}
.tm-pam-sam{grid-template-columns:minmax(0,1fr)}
.tm-pam-l{display:flex;flex-direction:column;list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--card-sh)}
.tm-pam-l li{flex:1 1 auto;display:flex}
.tm-pam-l li+li{border-top:1px solid var(--line)}
.tm-pam-a{flex:1;display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:14px;padding:11px 16px;color:var(--txt);transition:background .15s}
.tm-pam-a:hover{background:#f7f8fa}
.tm-pam-a:hover .tm-pam-n{color:var(--ac)}
.tm-pam-a:focus-visible{outline:2px solid var(--ac);outline-offset:-2px}
.tm-pam-d{display:flex;flex-direction:column;align-items:center;justify-content:center;height:46px;border-radius:8px;background:#eef0f3;color:var(--ac);line-height:1.1;text-align:center}
.tm-pam-d b{font:600 18px var(--f-lab)}
.tm-pam-d i{font:600 10.5px var(--f-lab);font-style:normal;letter-spacing:.08em;text-transform:uppercase}
.tm-pam-dz{background:var(--ac);color:#fff}
.tm-pam-b{display:flex;flex-direction:column;gap:3px;min-width:0}
.tm-pam-n{display:flex;align-items:center;gap:6px;font-size:15px;font-weight:600;line-height:1.35;transition:color .15s}
.tm-pam-sym{display:inline-flex;color:var(--txt-2)}
.tm-pam-m{font-size:13px;line-height:1.4;color:var(--txt-2)}
.tm-pam-ok{font-weight:600;color:var(--ac)}
.tm-pam-zn{color:var(--ac);font-weight:600}
.tm-pam-nekp{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:18px 18px 16px;background:#f4f5f7;border:1px solid var(--line);border-radius:10px;color:var(--txt)}
.tm-pam-swieca{color:var(--ac)}
.tm-pam-nekh{margin:0;font:600 16px var(--f-lab);color:var(--txt)}
.tm-pam-nekt{margin:0;font-size:13.5px;line-height:1.45;color:var(--txt-2)}
.tm-pam-btn{display:inline-flex;align-items:center;height:38px;padding:0 16px;border-radius:999px;background:var(--ac);color:#fff;font-size:13.5px;font-weight:600;transition:filter .15s}
.tm-pam-btn:hover{filter:brightness(1.12);color:#fff}
.tm-pam-zakl{margin:6px 0 0;padding-top:12px;border-top:1px solid var(--line);font-size:13px;line-height:1.45;color:var(--txt-2)}
.tm-pam-zakl b{display:block;margin-bottom:2px;color:var(--txt)}
.tm-pam-zakl a{font-weight:600;color:var(--ac);white-space:nowrap}
.tm-pam-zakl a:hover{text-decoration:underline}
@media(max-width:700px){
 .tm-pam-in{grid-template-columns:minmax(0,1fr);gap:14px}
 .tm-pam-a{gap:12px;padding:10px 12px}
 .tm-pam-n{font-size:14.5px}
}
/* --- koniec sekcji Pamiętamy --- */
/* --- Sekcja "Msze święte" na SG miasta (2026-10-10; indexMiasta.tpl, NT3wiaraSekcja.tpl, pomysł #384). Akcent
   ciepły brąz (--ac z sekcji). Po lewej karta: pasek dnia (dziś / jutro po ostatniej Mszy, święto w etykiecie), lista
   Mszy z kafelkiem godziny, pierwsza wyróżniona jako najbliższa; po prawej panel działu /wiara/ z informacją dla
   parafii (300 px). Bez Mszy dziś i jutro sam panel (.tm-msz-sam). Telefon: panel pod listą. --- */
.tm-msz-in{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;align-items:stretch}
.tm-msz-sam{grid-template-columns:minmax(0,1fr)}
.tm-msz-k{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--card-sh);overflow:hidden}
.tm-msz-dz{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:0;padding:10px 16px;background:#f7f3ec;border-bottom:1px solid var(--line);font-size:13px;color:var(--txt-2)}
.tm-msz-dz b{font:600 12.5px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--ac)}
.tm-msz-po{margin-left:auto;font-size:12.5px;font-style:italic}
.tm-msz-l{flex:1;display:flex;flex-direction:column;list-style:none;margin:0;padding:0}
.tm-msz-l li{flex:1 1 auto;display:flex}
.tm-msz-l li+li{border-top:1px solid var(--line)}
.tm-msz-a{flex:1;display:grid;grid-template-columns:64px minmax(0,1fr);align-items:center;gap:14px;padding:9px 16px;color:var(--txt);transition:background .15s}
.tm-msz-a:hover{background:#faf8f4}
.tm-msz-a:hover .tm-msz-n{color:var(--ac)}
.tm-msz-a:focus-visible{outline:2px solid var(--ac);outline-offset:-2px}
.tm-msz-g{display:flex;align-items:center;justify-content:center;height:38px;border-radius:8px;background:#f3eee5;color:var(--ac);font:600 17px var(--f-lab);font-variant-numeric:tabular-nums}
.tm-msz-nb .tm-msz-g{background:var(--ac);color:#fff}
.tm-msz-b{display:flex;flex-direction:column;gap:2px;min-width:0}
.tm-msz-n{font-size:15px;font-weight:600;line-height:1.35;transition:color .15s}
.tm-msz-m{font-size:13px;line-height:1.4;color:var(--txt-2)}
.tm-msz-tag{display:inline-block;margin-right:4px;padding:1px 7px;border-radius:999px;background:#f3eee5;color:var(--ac);font:600 11px var(--f-lab);letter-spacing:.06em;text-transform:uppercase}
.tm-msz-p{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:18px 18px 16px;background:#f7f4ee;border:1px solid var(--line);border-radius:10px;color:var(--txt)}
.tm-msz-ik{color:var(--ac)}
.tm-msz-ph{margin:0;font:600 16px var(--f-lab);color:var(--txt)}
.tm-msz-pt{margin:0;font-size:13.5px;line-height:1.45;color:var(--txt-2)}
.tm-msz-btn{display:inline-flex;align-items:center;height:38px;padding:0 16px;border-radius:999px;background:var(--ac);color:#fff;font-size:13.5px;font-weight:600;transition:filter .15s}
.tm-msz-btn:hover{filter:brightness(1.12);color:#fff}
.tm-msz-par{margin:6px 0 0;padding-top:12px;border-top:1px solid var(--line);font-size:13px;line-height:1.45;color:var(--txt-2)}
.tm-msz-par b{display:block;margin-bottom:2px;color:var(--txt)}
.tm-msz-par a{font-weight:600;color:var(--ac);white-space:nowrap}
.tm-msz-par a:hover{text-decoration:underline}
@media(max-width:700px){
 .tm-msz-in{grid-template-columns:minmax(0,1fr);gap:14px}
 .tm-msz-a{grid-template-columns:58px minmax(0,1fr);gap:12px;padding:9px 12px}
 .tm-msz-n{font-size:14.5px}
 .tm-msz-po{margin-left:0;flex-basis:100%}
}
/* --- koniec sekcji Msze święte --- */
/* --- Nekrologi: rocznice śmierci (pomysł #363) - podstrona /nekrologi/rocznice (ext/nekrologi/rocznice.tpl)
   i blok kolumny bocznej (_rocznice.tpl, pod kartą pogrzebów; renderowany tylko z wpisami).
   Ta sama stonowana szata co dział: akcent --loc, bez czerwieni marki, drobne teksty w --txt-2,
   bez ucinania nadmiaru pudełka i bez sztywnej wysokości linii w px (polskie znaki). Blok kolumny
   powtarza rytm wierszy karty pogrzebów (etykieta dnia wersalikami, nazwisko pogrubione, numer
   rocznicy w osobnej linii). Podstrona: dni jako sekcje z nagłówkiem .tm-h2k, wpisy jako niskie
   karty [miniatura 72x96 | nazwisko, rocznica i data, przycisk "Zapal znicz" do kotwicy #znicz]. --- */
.tm-nek-rocz-side{margin-top:14px}
.tm-nek-rocz{list-style:none;margin:0;padding:0}
.tm-nek-rocz-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 6px;padding:6px 0;border-top:1px dashed var(--line);font-size:13.5px;line-height:1.4}
.tm-nek-rocz-row:first-child{border-top:0;padding-top:0}
.tm-nek-rocz-sym{display:inline-flex;align-items:center;align-self:center;color:var(--txt-h)}
.tm-nek-rocz-kiedy{flex:none;font:600 12px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--loc)}
.tm-nek-rocz-kto{flex:1 1 auto;min-width:0;font-weight:600;color:var(--txt)}
.tm-nek-rocz-kto:hover{color:var(--loc)}
.tm-nek-rocz-nr{flex-basis:100%;font-size:12px;color:var(--txt-2)}
.tm-nek-rocz-wiecej{display:inline-block;margin-top:7px;font-size:12.5px;font-weight:600;color:var(--loc)}
.tm-nek-rocz-wiecej:hover{text-decoration:underline}
.tm-nek-rocz-link{margin:-8px 0 18px;font-size:14px}
.tm-nek-rocz-link a{color:var(--loc);font-weight:600}
.tm-nek-rocz-link a:hover{text-decoration:underline}
.tm-nek-rocznice .tm-nek-rocz-pusto h2{margin-top:0}
.tm-nek-rocz-dzien{margin:0 0 6px}
.tm-nek-rocz-dzien:first-of-type .tm-nek-rocz-h2{margin-top:4px}
.tm-nek-rocz-h2{padding-bottom:6px;border-bottom:2px solid var(--line)}
.tm-nek-rocz-dzis .tm-nek-rocz-h2{border-bottom-color:var(--loc)}
.tm-nek-rocz-lista{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tm-nek-rocz-karta{display:grid;grid-template-columns:72px minmax(0,1fr);gap:14px;align-items:center;padding:12px 14px;background:#fff;border:1px solid var(--line);border-top:3px solid var(--txt-h);border-radius:8px}
.tm-nek-rocz-foto a[data-lity]{display:block}
.tm-nek-rocz-foto img{display:block;width:72px;height:96px;object-fit:cover;border-radius:6px;background:var(--band)}
.tm-nek-rocz-nofoto{display:flex;align-items:center;justify-content:center;width:72px;height:96px;border-radius:6px;background:var(--band);color:var(--txt-2)}
.tm-nek-rocz-txt{min-width:0}
.tm-nek-rocz-imie{margin:0 0 4px;font:700 18px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-nek-rocz-imie a{color:inherit;text-decoration:none}
.tm-nek-rocz-imie a:hover{color:var(--loc)}
.tm-nek-rocz-info{margin:0 0 8px;font-size:14px;line-height:1.5;color:var(--txt-2)}
.tm-nek-rocz-info b{color:var(--txt-h)}
.tm-nek-rocz-akcje{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0}
.tm-nek-rocz-znicze{font-size:12.5px;color:var(--txt-2)}
@media(max-width:600px){
 .tm-nek-rocz-karta{grid-template-columns:56px minmax(0,1fr);gap:10px;padding:10px 12px}
 .tm-nek-rocz-foto img,.tm-nek-rocz-nofoto{width:56px;height:75px}
 .tm-nek-rocz-imie{font-size:16.5px}
}
/* --- koniec sekcji nekrologi (rocznice #363) --- */
/* --- Nekrologi: księga kondolencyjna (pomysł #364) - sekcja #kondolencje na stronie nekrologu
   (ext/nekrologi/nekrolog.tpl): lista opublikowanych wpisów (treść, podpis, data) i formularz
   (.tm-nek-kond-form; pola, przycisk i komunikaty dziedziczą style formularza zgłoszenia:
   .tm-nek-pole, .tm-nek-btn, .tm-nek-flash, stany is-wait/is-ok z Zadania 13). Wpis to spokojna
   karta z lewą kreską w kolorze modułów miejskich; bez czerwieni marki, bez ucinania nadmiaru
   pudełka i bez sztywnej wysokości linii w px (polskie znaki). --- */
.tm-nek-kond{margin:26px 0 0;padding-top:18px;border-top:1px solid var(--line)}
.tm-nek-kond-h{margin:0 0 12px;font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-nek-kond-ile{font-weight:500;color:var(--txt-2)}
.tm-nek-kond-lista{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:10px}
.tm-nek-kond-wpis{padding:10px 14px;border-left:3px solid var(--loc-line);background:var(--band);border-radius:0 8px 8px 0}
.tm-nek-kond-tresc{margin:0 0 6px;font-size:15px;line-height:1.55;color:var(--txt)}
.tm-nek-kond-meta{margin:0;font-size:13px;color:var(--txt-2)}
.tm-nek-kond-podpis{color:var(--txt-h)}
.tm-nek-kond-pusto{margin:0 0 18px;font-size:14.5px;line-height:1.5;color:var(--txt-2)}
.tm-nek-kond-form{display:flex;flex-direction:column;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:8px;background:#fff}
.tm-nek-kond-form[hidden]{display:none}
.tm-nek-kond-h3{margin:0;font:700 16px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-nek-kond-form .tm-nek-pole input[type=text]{font:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--txt-h)}
.tm-nek-kond-form .tm-nek-pole input[type=text]:focus{border-color:var(--loc);outline:2px solid var(--loc-line);outline-offset:0}
.tm-nek-kond-form .tm-nek-pole textarea{min-height:110px}
.tm-nek-kond-form .tm-nek-note{margin:0}
.tm-nek-kond-btn{padding:9px 18px;font-size:14px}
.tm-nek-kond-btn.is-wait{opacity:.6;cursor:progress}
.tm-nek-kond-info{margin:12px 0 0;padding:10px 14px;border:1px solid #e6c3b0;border-radius:8px;background:#fbf2ec;color:#7a3a1d;font-size:14.5px;line-height:1.5}
.tm-nek-kond-info.is-ok{border-color:#bfe0c8;background:#f1faf3;color:#1f5f34}
.tm-nek-kond-info[hidden]{display:none}
@media(max-width:600px){
 .tm-nek-kond-form{padding:12px 12px}
 .tm-nek-kond-h{font-size:18px}
}
/* --- koniec sekcji nekrologi (kondolencje #364) --- */

/* =====================================================================================
   MODUŁ STAN WODY RZEK (pomysł #366, 2026-09-16)
   Moduł "Stan wody" w pasie lokalnym strony głównej miasta (smarty/templates/ext/S/NT3rzekaPas.tpl,
   widget TMrzeki), dział /stan-wody/ (smarty/templates/ext/stanWody/*.tpl, moduł ext/stanWody.php:
   strona miasta, strona wodowskazu z wykresami SVG, hub ogólnopolski) i panel /adm/rzeki
   (smarty/templates/ext/admRzeki/*.tpl). Dział nie ma wiersza w tabeli `strony`, więc układ
   (.tm-in, .tm-cols, .tm-side) rysuje sam - tutaj jest tylko to, czego motyw nie ma.
   Akcent działu: --loc (granat modułów miejskich - pas "Twoje miasto", /apteki, /kolejki-nfz).
   Strefy stanu: 0 (poniżej ostrzegawczego) bez koloru, 1 (ostrzegawczy) bursztyn #c98a00
   (tekst #7a5400, 6,0:1 na bieli), 2 (alarmowy) czerwień #b3261e (5,9:1) - kolor jest tylko
   wzmocnieniem, tę samą informację niesie tekst (strefaTekst, komunikat "brakuje X cm").
   Stary pomiar (.tm-rz-sw-stary) szarzeje bez strefy; brak pomiaru (.tm-rz-sw-brak) pokazuje datę.
   Pasek do progów: szerokość i pozycje znaczników liczy PHP (style="width/left:N%"), pasek ma
   role="img" z pełnym opisem. Drobne teksty w --txt-2 (AA na bieli), nigdy w --txt-3.
   Bez ucinania nadmiaru pudełka i bez wysokości linii w pikselach przy tekstach z polskimi
   znakami (notatka o ellipsis w theme/3). Test RzekiCssTest pilnuje, że każda klasa .tm-rz-*
   użyta w szablonach ma tu regułę.
   ===================================================================================== */
.tm-rz-body{padding-top:14px}
.tm-rz-body .tm-bc{margin-bottom:12px}
.tm-rz-bcs{margin:0 2px;color:var(--txt-3)}
.tm-rz-head .tm-h1k{margin-left:0}
.tm-rz-lead{margin:-6px 0 18px;max-width:760px;font-size:15px;line-height:1.55;color:var(--txt-2)}
.tm-rz-sec{margin:0 0 30px;scroll-margin-top:86px}
.tm-rz-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-rz-h3{margin:14px 0 6px;font:600 16px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-rz-pojecia p{margin:0 0 10px;font-size:14.5px;line-height:1.6;color:var(--txt)}
.tm-rz-a{color:var(--loc);font-weight:600;text-decoration:none}
.tm-rz-a:hover,.tm-rz-a:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-rz-note{margin:0 0 10px;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-rz-attr{margin:0 0 8px;font-size:13.5px;line-height:1.55;color:var(--txt)}

/* --- karta wodowskazu: stan, trend, pasek do progów, komunikat, czas, szczegóły --- */
.tm-rz-karta{position:relative;margin:0 0 22px;padding:16px 18px 14px;background:#fff;border:1px solid var(--line);border-left:5px solid var(--loc);border-radius:10px}
.tm-rz-karta-gl{padding:20px 22px 16px}
.tm-rz-sw-aktualny.tm-rz-karta{border-left-color:var(--loc)}
.tm-rz-strefa-0.tm-rz-karta{border-left-color:var(--loc)}
.tm-rz-strefa-1.tm-rz-karta{border-left-color:#c98a00}
.tm-rz-strefa-2.tm-rz-karta{border-left-color:#b3261e}
.tm-rz-sw-stary.tm-rz-karta{border-left-color:var(--hair);background:var(--band)}
.tm-rz-sw-brak.tm-rz-karta{border-left-color:var(--hair);background:var(--band)}
.tm-rz-kh{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:0 0 10px}
.tm-rz-kt{margin:0;font:700 19px/1.3 var(--f-ui);color:var(--txt-h)}
h3.tm-rz-kt{font-size:16px}
.tm-rz-kt a{color:inherit;text-decoration:none}
.tm-rz-kt a:hover,.tm-rz-kt a:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-rz-wod{font-size:12.5px;color:var(--txt-2)}
.tm-rz-glowne{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin:0 0 10px}
.tm-rz-stan{font:600 40px var(--f-lab);color:var(--dark)}
.tm-rz-karta-gl .tm-rz-stan{font-size:52px}
.tm-rz-strefa-1 .tm-rz-stan{color:#7a5400}
.tm-rz-strefa-2 .tm-rz-stan{color:#b3261e}
.tm-rz-sw-stary .tm-rz-stan{color:var(--txt-2)}
.tm-rz-trend{display:inline-flex;align-items:baseline;gap:5px;font-size:14px;color:var(--txt)}
.tm-rz-trend b{font-weight:600}
.tm-rz-trend small{font-size:12px;color:var(--txt-2)}
.tm-rz-strz{font-weight:700}
.tm-rz-trend-rosnie .tm-rz-strz,.tm-rz-trend-rosnie b{color:#7a5400}
.tm-rz-trend-opada .tm-rz-strz,.tm-rz-trend-opada b{color:#1c6b43}
.tm-rz-trend-bez_zmian .tm-rz-strz{color:var(--txt-2)}
.tm-rz-trend-brak{color:var(--txt-2)}
.tm-rz-brak{margin:0 0 8px;font-size:15px;line-height:1.45;color:var(--txt)}
/* etykiety progów po dwóch stronach paska (ostrz. pod, alarm. nad) - progi bywają o kilkanaście procent od siebie
   i w wąskim module pasa etykiety pod paskiem nachodziłyby na siebie */
.tm-rz-pasek{position:relative;height:14px;margin:20px 0 24px;border-radius:7px;background:var(--band);border:1px solid var(--line)}
.tm-rz-pasek-stan{position:absolute;left:0;top:0;bottom:0;border-radius:7px;background:var(--loc);opacity:.85}
.tm-rz-strefa-1 .tm-rz-pasek-stan{background:#c98a00}
.tm-rz-strefa-2 .tm-rz-pasek-stan{background:#b3261e}
.tm-rz-sw-stary .tm-rz-pasek-stan{background:var(--txt-3)}
.tm-rz-pasek-ostrz,.tm-rz-pasek-alarm{position:absolute;top:-4px;bottom:-4px;width:2px;background:#c98a00}
.tm-rz-pasek-alarm{background:#b3261e}
.tm-rz-pasek-ostrz i,.tm-rz-pasek-alarm i{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:3px;font:600 10.5px var(--f-lab);letter-spacing:.04em;white-space:nowrap;color:#7a5400;font-style:normal}
.tm-rz-pasek-alarm i{color:#b3261e;top:auto;bottom:100%;margin:0 0 3px}
.tm-rz-kom{margin:0 0 6px;font-size:14px;line-height:1.5;color:var(--txt)}
.tm-rz-strefa-lab{font-weight:700}
.tm-rz-strefa-1 .tm-rz-strefa-lab{color:#7a5400}
.tm-rz-strefa-2 .tm-rz-strefa-lab{color:#b3261e}
.tm-rz-czas{margin:0;font-size:12.5px;line-height:1.5;color:var(--txt-2)}
.tm-rz-stary{color:var(--txt-2);font-style:italic}
.tm-rz-dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:8px 18px;margin:14px 0 0;padding-top:12px;border-top:1px dashed var(--line)}
.tm-rz-dl div{min-width:0}
.tm-rz-dl dt{font:600 11px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-rz-dl dd{margin:2px 0 0;font-size:14.5px;font-weight:600;color:var(--txt)}
.tm-rz-dl dd small{font-weight:400;font-size:12px;color:var(--txt-2)}
.tm-rz-siatka{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px}
.tm-rz-siatka .tm-rz-karta{margin:0}
.tm-rz-wiecej{margin:0 0 26px}
.tm-rz-btn{display:inline-block;padding:9px 16px;border-radius:8px;background:var(--loc);color:#fff;font:600 13.5px var(--f-lab);text-decoration:none}
.tm-rz-btn:hover,.tm-rz-btn:focus-visible{background:var(--brand);color:#fff}
.tm-rz-blad .tm-rz-lead{margin-top:6px}

/* --- wykresy SVG i tabele danych --- */
.tm-rz-svg-box{margin:0 0 8px;padding:6px 4px 0;background:#fff;border:1px solid var(--line);border-radius:10px}
.tm-rz-svg{display:block;width:100%;height:auto;font-family:var(--f-ui)}
.tm-rz-det{margin:0 0 6px}
.tm-rz-sum{cursor:pointer;font:600 13px var(--f-lab);color:var(--loc)}
.tm-rz-tbl{width:100%;margin:8px 0 0;border-collapse:collapse;font-size:13.5px}
.tm-rz-tbl th{padding:7px 10px;border-bottom:2px solid var(--dark);text-align:left;font:600 11px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-rz-tbl td{padding:7px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.tm-rz-tbl caption{caption-side:top;text-align:left}
.tm-rz-wykres .tm-rz-note{margin-top:4px}
.tm-rz-zrodlo{padding-top:4px}
.tm-rz-gora{margin:0;padding:0 0 0 18px;font-size:14.5px;line-height:1.6}
.tm-rz-gora li{margin:0 0 4px}
.tm-rz-miasta{margin:0 0 26px;font-size:13.5px;line-height:1.5;color:var(--txt-2)}

/* --- hub ogólnopolski: tabela miast --- */
.tm-rz-woj{margin-bottom:26px}
.tm-rz-tr td{vertical-align:middle}
.tm-rz-tbl-hub td small{display:block;font-size:12px;color:var(--txt-2)}
.tm-rz-tbl-hub .tm-rz-strefa-1 td:first-child,.tm-rz-tbl-hub .tm-rz-strefa-2 td:first-child{box-shadow:inset 4px 0 0 #c98a00}
.tm-rz-tbl-hub .tm-rz-strefa-2 td:first-child{box-shadow:inset 4px 0 0 #b3261e}

/* --- moduł "Stan wody" w pasie lokalnym (NT3rzekaPas.tpl, widget TMrzeki) --- */
.tm-locmod-rz .tm-rz-glowne{margin:0 0 6px}
.tm-locmod-rz .tm-rz-stan{font-size:36px}
.tm-locmod-rz .tm-rz-trend{font-size:13px}
.tm-locmod-rz .tm-rz-pasek{height:10px;margin:16px 0 20px}
.tm-locmod-rz .tm-rz-pasek-ostrz i,.tm-locmod-rz .tm-rz-pasek-alarm i{font-size:10px}
.tm-locmod-rz .tm-rz-kom{font-size:12.5px;margin-bottom:4px}
.tm-locmod-rz .tm-rz-czas{font-size:11.5px}
.tm-locmod-rz .tm-rz-brak{font-size:13px;margin-bottom:4px}
.tm-locmod-rz.tm-rz-strefa-1{border-color:#e6c98a}
.tm-locmod-rz.tm-rz-strefa-2{border-color:#e0a8a3}
.tm-rz-pas-wod{display:block;margin:0 0 4px;font-size:12px;color:var(--txt-2)}
.tm-rz-pas-wod a{color:var(--txt-2)}
.tm-rz-pas-src{display:block;margin:4px 0 0;font-size:11px;color:var(--txt-2)}

/* --- panel /adm/rzeki --- */
.tm-rz-adm-nav{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 18px}
.tm-rz-adm-nav a{display:inline-block;padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 12.5px var(--f-lab);color:var(--txt-2);text-decoration:none}
.tm-rz-adm-nav a:hover{border-color:var(--loc);color:var(--loc)}
.tm-rz-adm-nav a[aria-current]{border-color:var(--loc);background:var(--loc);color:#fff}
.tm-rz-adm-liczby{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px}
.tm-rz-adm-liczba{flex:1 1 150px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}
.tm-rz-adm-liczba b{display:block;font:600 24px var(--f-lab);color:var(--dark)}
.tm-rz-adm-liczba span{font-size:12px;color:var(--txt-2)}
.tm-rz-adm-flash{margin:0 0 16px;padding:10px 14px;border:1px solid #bfe0c8;border-radius:8px;background:#f1faf3;color:#1f5f34;font-size:14px}
.tm-rz-adm-flash-danger{border-color:#e6c3b0;background:#fbf2ec;color:#7a3a1d}
.tm-rz-adm-form{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px}
.tm-rz-adm-form input[type=text],.tm-rz-adm-form select{font:inherit;font-size:14px;padding:6px 10px;border:1px solid var(--line);border-radius:6px;background:#fff}
.tm-rz-adm-btn{font:600 13px var(--f-lab);padding:6px 12px;border:1px solid var(--loc);border-radius:6px;background:#fff;color:var(--loc);cursor:pointer}
.tm-rz-adm-btn:hover{background:var(--loc);color:#fff}
.tm-rz-adm-btn-x{border-color:#b3261e;color:#b3261e}
.tm-rz-adm-btn-x:hover{background:#b3261e}
.tm-rz-adm-akcje{display:flex;flex-wrap:wrap;gap:4px}
.tm-rz-adm-akcje form{display:inline}
.tm-rz-adm-uw{font-size:12px;color:var(--txt-2)}
.tm-rz-adm-st{display:inline-block;padding:1px 7px;border-radius:4px;font:600 11px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;background:var(--band);color:var(--txt-2)}
.tm-rz-adm-st-auto,.tm-rz-adm-st-zatwierdzone{background:#e5f4ec;color:#1c6b43}
.tm-rz-adm-st-propozycja{background:#fff4dc;color:#7a5400}
.tm-rz-adm-st-odrzucone{background:#fbf2ec;color:#7a3a1d}
.tm-rz-tbl-adm{font-size:13px}
.tm-rz-tbl-adm td,.tm-rz-tbl-adm th{padding:6px 8px}

/* --- responsywność: karty w jednej kolumnie, tabele jako karty, mniejsza liczba <= 700 px --- */
@media(max-width:700px){
 .tm-rz-karta,.tm-rz-karta-gl{padding:14px 14px 12px}
 .tm-rz-karta-gl .tm-rz-stan{font-size:42px}
 .tm-rz-tbl-hub thead{position:absolute;width:1px;height:1px;clip-path:inset(50%);white-space:nowrap}
 .tm-rz-tbl-hub tr{display:block;margin:0 0 10px;border:1px solid var(--line);border-radius:8px;padding:8px 10px}
 .tm-rz-tbl-hub td{display:flex;gap:8px;padding:3px 0;border:0}
 .tm-rz-tbl-hub td:before{content:attr(data-l);flex:0 0 68px;font:600 11px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-2)}
 .tm-rz-tbl-hub .tm-rz-strefa-1 td:first-child,.tm-rz-tbl-hub .tm-rz-strefa-2 td:first-child{box-shadow:none}
 .tm-rz-tbl-hub tr.tm-rz-strefa-1{border-left:4px solid #c98a00}
 .tm-rz-tbl-hub tr.tm-rz-strefa-2{border-left:4px solid #b3261e}
 /* moduł pasa na telefonie: pod kaflami newsów, po aptece (ta sama reguła i specyficzność co
    .tm-locmod-apt w sekcji pasa; wygrywa kolejnością w pliku z regułą połówek order:2) */
 .tm-locmods>.tm-locmod.tm-locmod-rz{flex:1 1 100%;padding:7px 10px;order:4}
 .tm-locmods>.tm-locmod.tm-locmod-rz .tm-locmh{font-size:10.5px;letter-spacing:.1em}
 .tm-locmod-rz .tm-rz-stan{font-size:28px}
}
/* --- koniec sekcji stan wody rzek --- */

/* =====================================================================================
   MODUŁ KOLEJKI NFZ (pomysł #367, 2026-09-15)
   Kafel "Kolejki NFZ" w sekcji "Zdrowie i Rodzina" strony głównej miasta
   (smarty/templates/ext/S/NT3nfzZdrowie.tpl, widget TMkolejkiNfz) oraz dział /kolejki-nfz/
   (smarty/templates/ext/kolejkiNfz/*.tpl, moduł ext/kolejkiNfz.php). Dział nie ma wiersza
   w tabeli `strony`, więc układ (.tm-in, .tm-cols, .tm-side) rysuje sam - tutaj jest tylko to,
   czego motyw nie ma.
   Akcent działu: --loc (granat modułów miejskich - pas "Twoje miasto", /apteki, /polityka).
   Kafel dziedziczy --ac sekcji "Zdrowie i Rodzina" (#b0578d) i wraca do --loc poza nią.
   Drobne teksty w --txt-2 (AA na bieli), nigdy w --txt-3 (3,2:1 to poniżej AA).
   Dane NFZ dotyczą zdrowia: żadna placówka nie dostaje wyróżnienia kolorem ani rozmiarem,
   kolor niesie wyłącznie wiek prognozy (świeża, starsza, bardzo stara, brak).
   Bez ucinania nadmiaru pudełka i bez wysokości linii w pikselach przy tekstach z polskimi
   znakami - obie rzeczy ścinają kreski nad Ś/Ź i ogonki (notatka o ellipsis w theme/3).
   Lista placówek: tabela powyżej 700 px, karty poniżej; role ARIA w HTML trzymają semantykę
   tabeli mimo display:block. Test NfzCssTest pilnuje, że każda klasa .tm-nfz-* użyta
   w szablonach ma tu regułę, i szuka zakazanych deklaracji w CAŁEJ sekcji łącznie z tym
   komentarzem - dlatego są one opisane słowami, a nie zapisane dosłownie.
   ===================================================================================== */
.tm-nfz-body{padding-top:14px}
.tm-nfz-body .tm-bc{margin-bottom:12px}
.tm-nfz-bcs{margin:0 2px;color:var(--txt-3)}
.tm-nfz-head .tm-h1k{margin-left:0}
.tm-nfz-lead{margin:-6px 0 16px;max-width:760px;font-size:15px;line-height:1.55;color:var(--txt-2)}
.tm-nfz-stan{margin:0 0 18px;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-nfz-sec{margin:0 0 30px;scroll-margin-top:86px}
.tm-nfz-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-nfz-grupa{margin-bottom:26px}
.tm-nfz-a{color:var(--loc);font-weight:600;text-decoration:none}
.tm-nfz-a:hover,.tm-nfz-a:focus-visible{text-decoration:underline;text-underline-offset:2px}

/* --- tabele: kategorie działu, pozostałe świadczenia, placówki kategorii --- */
.tm-nfz-tbl{width:100%;margin:0;border-collapse:collapse;font-size:13.5px}
.tm-nfz-tbl caption{caption-side:top;text-align:left}
.tm-nfz-tbl th{padding:8px 10px;border-bottom:2px solid var(--dark);text-align:left;font:600 11px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-nfz-tbl td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top}
.tm-nfz-tbl-kat{margin-bottom:4px}
.tm-nfz-tbl-inne{margin-top:8px}
.tm-nfz-tbl-plac{margin-bottom:4px}
.tm-nfz-tr:last-child td{border-bottom:0}
.tm-nfz-td{min-width:0}
.tm-nfz-td-kat{width:34%;font-weight:600}
.tm-nfz-td-ile{width:11%;text-align:right;font-variant-numeric:tabular-nums;color:var(--txt-2)}
.tm-nfz-td-kto{width:30%}
.tm-nfz-td-gdzie{width:24%}
.tm-nfz-td-tel{width:13%}
.tm-nfz-td-c1{width:17%}
.tm-nfz-td-c2{width:16%}
.tm-nfz-kat{color:var(--txt);font-weight:600;text-decoration:none}
.tm-nfz-kat:hover,.tm-nfz-kat:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}

/* --- wartości NFZ: kolor niesie wiek prognozy, nie ocenę placówki --- */
.tm-nfz-v{display:block;font-weight:600;color:var(--txt);font-variant-numeric:tabular-nums}
.tm-nfz-v-ok{color:#1c6b43}
.tm-nfz-v-stare{color:var(--txt)}
.tm-nfz-v-bardzoStare{font-weight:500;color:var(--txt-2)}
.tm-nfz-v-brak{font-weight:500;color:var(--txt-2)}
.tm-nfz-v-nieDotyczy{font-weight:500;color:var(--txt-2)}
.tm-nfz-kto{display:block;margin-top:2px;font-size:12px;line-height:1.4;color:var(--txt-2)}
.tm-nfz-uw{display:block;margin-top:2px;font-size:11.5px;line-height:1.4;color:var(--txt-2)}
.tm-nfz-st{display:block;margin-top:2px;font-size:11.5px;line-height:1.4;color:var(--txt-2)}
.tm-nfz-ocz{display:block;margin-top:3px;font-size:11.5px;line-height:1.4;color:var(--txt-2)}

/* --- komórki placówki --- */
.tm-nfz-dawca{display:block;font-weight:600;color:var(--txt)}
.tm-nfz-miejsce{display:block;margin-top:2px;font-size:12.5px;line-height:1.4;color:var(--txt-2)}
.tm-nfz-sw{display:block;margin-top:2px;font-size:12px;line-height:1.4;color:var(--txt-2)}
.tm-nfz-odz{display:inline-block;margin-top:4px;padding:1px 6px;border-radius:4px;background:var(--loc-bg);font:600 10.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--loc)}
.tm-nfz-adres{display:block;line-height:1.45}
.tm-nfz-doj{display:inline-block;margin-top:3px;font-size:12px;font-weight:600;color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-nfz-tel{font-weight:600;color:var(--loc);white-space:nowrap}
.tm-nfz-pusto{color:var(--txt-2)}

/* --- podsumowanie kategorii --- */
.tm-nfz-pods{margin-bottom:24px}
.tm-nfz-dl{display:grid;grid-template-columns:minmax(150px,auto) 1fr;gap:8px 18px;margin:0}
.tm-nfz-dl dt{padding-top:2px;font:600 11.5px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-nfz-dl dd{margin:0;font-size:14px;line-height:1.45}

/* --- zwijana lista pozostałych świadczeń --- */
.tm-nfz-det{margin:0 0 30px;padding:0 0 4px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tm-nfz-sum{display:flex;align-items:center;gap:8px;padding:12px 2px;cursor:pointer;list-style:none;font:600 13px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-nfz-sum::-webkit-details-marker{display:none}
.tm-nfz-sum::after{content:"\25BE";font-size:12px}
.tm-nfz-det[open] .tm-nfz-sum::after{content:"\25B4"}

/* --- ramki informacyjne: kardiolog, brak danych, uwagi --- */
.tm-nfz-kard{margin:0 0 30px;padding:14px 16px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg);font-size:14px;line-height:1.55}
.tm-nfz-kard .tm-nfz-h2{margin-bottom:6px;padding-bottom:0;border-bottom:0;font-size:17px}
.tm-nfz-pusto-sec{padding:14px 16px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg);font-size:14px;line-height:1.55}
.tm-nfz-pusto-sec .tm-nfz-h2{margin-bottom:6px;padding-bottom:0;border-bottom:0;font-size:17px}
.tm-nfz-note{margin:10px 0 0;font-size:13px;line-height:1.5;color:var(--txt-2)}

/* --- legenda, źródło danych, pozostałe kategorie, lista placówek --- */
.tm-nfz-legenda{margin-bottom:26px}
.tm-nfz-leg{margin:0;padding-left:20px;font-size:13.5px;line-height:1.6;color:var(--txt-2)}
.tm-nfz-leg li{margin:0 0 4px}
.tm-nfz-zrodlo{margin-bottom:10px}
.tm-nfz-attr{margin:0 0 8px;font-size:12.5px;line-height:1.55;color:var(--txt-2)}
.tm-nfz-lista{margin-bottom:26px}
.tm-nfz-poz{margin-bottom:26px}
.tm-nfz-poz-l{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0 0 10px;padding:0;list-style:none;font-size:13.5px;line-height:1.5}

/* --- portal ogólnopolski --- */
.tm-nfz-woj{margin-bottom:24px}
.tm-nfz-hub{margin:0;padding:0;list-style:none;columns:3 210px;column-gap:24px;font-size:13.5px;line-height:1.7}
.tm-nfz-ile{font-size:12px;color:var(--txt-2)}

/* --- strona błędu i pas reklamy pod treścią --- */
.tm-nfz-blad{margin:0 0 24px}
.tm-nfz-btn{display:inline-block;margin-top:6px;padding:9px 16px;border-radius:6px;background:var(--loc);font-weight:600;color:#fff;text-decoration:none}
.tm-nfz-btn:hover,.tm-nfz-btn:focus-visible{background:var(--dark);color:#fff}

/* --- kafel na stronie głównej miasta (sekcja "Zdrowie i Rodzina") --- */
.tm-nfz-kafel{margin:18px 0 0;padding:14px 16px;border:1px solid var(--line);border-left:3px solid var(--ac,var(--loc));border-radius:8px;background:#fff}
.tm-nfz-kh{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:0 0 8px}
.tm-nfz-kt{margin:0;font:600 15px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--dark)}
.tm-nfz-ks{font-size:12px;color:var(--txt-2)}
.tm-nfz-kl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 22px;margin:0;padding:0;list-style:none}
.tm-nfz-ki{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 8px;padding:7px 0;border-top:1px dashed var(--line);font-size:13.5px;line-height:1.4}
.tm-nfz-kn{font-weight:600;color:var(--txt);text-decoration:none}
.tm-nfz-kn:hover,.tm-nfz-kn:focus-visible{color:var(--ac-dark,var(--loc));text-decoration:underline;text-underline-offset:2px}
.tm-nfz-kv{margin-left:auto;font-weight:600;color:var(--txt);font-variant-numeric:tabular-nums;white-space:nowrap}
.tm-nfz-ku{flex-basis:100%;font-size:11.5px;line-height:1.4;color:var(--txt-2)}
.tm-nfz-kf{display:flex;flex-wrap:wrap;gap:4px 16px;margin:10px 0 0;font-size:12px;line-height:1.5;color:var(--txt-2)}
.tm-nfz-kw{font-weight:600;color:var(--ac-dark,var(--loc));text-decoration:none}
.tm-nfz-kw:hover,.tm-nfz-kw:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-nfz-kz{color:var(--txt-2)}
.tm-nfz-kzl{color:var(--txt-2);text-decoration:underline}

/* --- responsywność: kolumna boczna i kafel < 881 px, tabele jako karty <= 700 px --- */
@media(max-width:880px){.tm-nfz-body .tm-side{margin-top:18px}.tm-nfz-kl{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){
 .tm-nfz-kl{grid-template-columns:minmax(0,1fr)}
 .tm-nfz-hub{columns:2 150px}
 .tm-nfz-tbl thead{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);white-space:nowrap}
 .tm-nfz-tbl,.tm-nfz-tbl tbody,.tm-nfz-tbl tr,.tm-nfz-tbl td{display:block;width:100%}
 .tm-nfz-tr{margin:0 0 12px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}
 .tm-nfz-tr:last-child td{border-bottom:0}
 .tm-nfz-td{width:auto;padding:3px 0;border:0}
 .tm-nfz-td::before{content:attr(data-l) ": ";font-weight:600;color:var(--txt-2)}
 .tm-nfz-td-kat::before,.tm-nfz-td-kto::before{content:""}
 .tm-nfz-td-kat{width:auto;font-size:15px}
 .tm-nfz-td-kto{width:auto}
 .tm-nfz-td-gdzie{width:auto}
 .tm-nfz-td-tel{width:auto}
 .tm-nfz-td-c1{width:auto}
 .tm-nfz-td-c2{width:auto}
 .tm-nfz-td-ile{width:auto;text-align:left}
 .tm-nfz-v{display:inline}
 .tm-nfz-kto{display:inline;margin-left:6px}
 .tm-nfz-dl{grid-template-columns:minmax(0,1fr)}
 .tm-nfz-dl dt{padding-top:6px}
}
@media(max-width:600px){
 .tm-nfz-lead{font-size:14px}
 .tm-nfz-h2{font-size:17px}
 .tm-nfz-hub{columns:auto}
 .tm-nfz-kafel{padding:12px 13px}
 .tm-nfz-kf{font-size:11.5px}
 .tm-nfz-poz-l{gap:5px 12px}
}
/* kafel NFZ w siatce działu /zdrowie-i-rodzina (.tm-zmx-nfz, ext/dzial/zdrowieMix.tpl): lista kolejek w kolumnach od 170 px */
.tm-zmx-nfz .tm-nfz-kl{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
/* --- koniec sekcji kolejki NFZ (Zadanie 17) --- */

/* =====================================================================================
   MODUŁ STACJE ŁADOWANIA (pomysł #369, 2026-09-16)
   Kafel "Stacje ładowania" w sekcji "Moto / Tech / Komunikacja" strony głównej miasta
   (smarty/templates/ext/S/NT3ladowarkiTransport.tpl, widget TMladowarki) oraz dział /stacje-ladowania/
   (smarty/templates/ext/ladowarki/*.tpl, moduł ext/ladowarki.php, mapa www/theme/3/js/ladowarkiMapa.js).
   Dział nie ma wiersza w tabeli `strony`, więc układ (.tm-in, .tm-cols, .tm-side) rysuje sam - tutaj tylko to,
   czego motyw nie ma. Akcent działu: --loc (granat modułów miejskich); kafel dziedziczy --ac sekcji Moto.
   Kolor niesie wyłącznie status lokalizacji: zieleń "są wolne", czerwień "wszystkie zajęte", szarość "nieczynna
   albo brak aktualnych danych"; obramowanie pinezki mówi miasto/okolica. Drobne teksty w --txt-2 (AA na bieli).
   Bez ucinania nadmiaru pudełka i bez wysokości linii w pikselach przy tekstach z polskimi znakami (ścinają
   kreski nad Ś/Ź i ogonki). Karty listy w siatce dwóch kolumn powyżej 700 px, jednej poniżej; tabela punktów
   jako karty na telefonie. Test LadowarkiCssTest pilnuje, że każda klasa .tm-lad-* z szablonów i skryptu mapy
   ma tu regułę, i szuka zakazanych deklaracji w całej sekcji - dlatego są opisane słowami.
   ===================================================================================== */
.tm-lad-body{padding-top:14px}
.tm-lad-body .tm-bc{margin-bottom:12px}
.tm-lad-bcs{color:var(--txt-3);margin:0 2px}
.tm-lad-head{margin:0 0 18px}
.tm-lad-lead{margin:6px 0 10px;font-size:15px;color:var(--txt-2)}
.tm-lad-sum{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0 0 6px;padding:0;list-style:none;font-size:14.5px;font-weight:600}
.tm-lad-sum-i{display:inline-flex;align-items:baseline;gap:6px}
.tm-lad-sum-i::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--loc)}
.tm-lad-sum-w{color:#1c6b43}
.tm-lad-stan{margin:0;font-size:12.5px;color:var(--txt-2)}
.tm-lad-sec{margin:0 0 26px}
.tm-lad-h2{margin:0 0 10px;font-size:20px;font-weight:700;color:var(--txt)}
.tm-lad-h2::after{content:"";display:block;width:36px;height:3px;margin-top:6px;background:var(--loc);border-radius:2px}
.tm-lad-note{margin:8px 0 0;font-size:12.5px;color:var(--txt-2)}
.tm-lad-a{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-lad-btn{display:inline-block;padding:9px 16px;border:1px solid var(--loc);border-radius:6px;color:var(--loc);font-weight:600;text-decoration:none}
.tm-lad-btn:hover{background:var(--loc);color:#fff}
.tm-lad-pusto{padding:14px 16px;border:1px solid var(--line);border-left:3px solid var(--loc);border-radius:8px;background:#fff}
.tm-lad-blad{padding:20px}
/* mapa */
.tm-lad-mapa{position:relative;isolation:isolate;height:460px;margin:0 0 10px;border:1px solid var(--line);border-radius:8px;background:#e8edf2;overflow:hidden}
.tm-lad-mapa-s{height:300px}
.tm-lad-mapa-blad{display:flex;align-items:center;justify-content:center;padding:16px;font-size:13px;color:var(--txt-2)}
.tm-lad-mapa .leaflet-container{font:inherit}
.tm-lad-leg{display:flex;flex-wrap:wrap;gap:4px 16px;list-style:none;margin:0;padding:0;font-size:12.5px;color:var(--txt-2)}
.tm-lad-leg li{display:inline-flex;align-items:center;gap:6px}
.tm-lad-kr{width:12px;height:12px;border-radius:50%;border:2px solid #15588c;background:#aab1bd}
.tm-lad-kr-wolne{background:#1c6b43}
.tm-lad-kr-zajete{background:#b3261e}
.tm-lad-kr-brak{background:#aab1bd}
.tm-lad-kr-op{background:#d9a21b}
.tm-lad-kr-ok{background:#fff;border:1.5px solid #8a93a0}
.tm-lad-pop{font-size:13px;color:var(--txt)}
.tm-lad-popn{display:block;margin:0 0 2px;font-size:14px;font-weight:600;color:var(--txt)}
a.tm-lad-popn{color:var(--loc)}
.tm-lad-popa{color:var(--txt-2)}
.tm-lad-popp{margin-top:2px;color:var(--txt-2)}
.tm-lad-pops{margin-top:4px;font-weight:600}
.tm-lad-pops-wolne{color:#1c6b43}
.tm-lad-pops-zajete{color:#b3261e}
.tm-lad-pops-brak{color:var(--txt-2)}
.tm-lad-pops-op{color:#7a5600}
.tm-lad-popl{display:inline-block;margin-top:6px;font-weight:600;color:var(--loc)}
/* lista lokalizacji: karty */
.tm-lad-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.tm-lad-card{display:flex;flex-direction:column;gap:5px;padding:12px 14px;border:1px solid var(--line);border-left:3px solid var(--loc);border-radius:8px;background:#fff}
.tm-lad-card-ok{border-left-color:#8a93a0}
.tm-lad-ch{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.tm-lad-cn{font-size:15.5px;font-weight:700;color:var(--loc);text-decoration:none}
.tm-lad-cn:hover{text-decoration:underline}
.tm-lad-cm{font-size:12.5px;font-weight:600;color:var(--txt-2);white-space:nowrap}
.tm-lad-ca{display:inline-flex;align-items:baseline;gap:6px;font-size:13.5px;color:var(--txt);text-decoration:none}
.tm-lad-ca:hover{color:var(--loc)}
.tm-lad-ca .fas{color:var(--loc);font-size:12px}
.tm-lad-cd{font-size:12.5px;color:var(--txt-2)}
.tm-lad-cs{display:inline-block;padding:2px 8px;border-radius:12px;font-size:12.5px;font-weight:600;background:#eef1f4;color:var(--txt-2);width:max-content;max-width:100%}
.tm-lad-cs-wolne{background:#e3f3e9;color:#1c6b43}
.tm-lad-cs-zajete{background:#fbe9e7;color:#b3261e}
.tm-lad-cs-brak{background:#eef1f4;color:var(--txt-2)}
/* sieć, która nie przekazuje statusów do EIPA (bug#468) - bursztyn odróżnia ją od "nieczynna/brak danych" */
.tm-lad-cs-op{background:#fdf3d7;color:#7a5600}
.tm-lad-opbs{padding:6px 10px;border-left:3px solid #d9a21b;background:#fdf8e8;color:var(--txt)}
.tm-lad-cs-l{font-size:14px;padding:4px 12px;margin-top:6px}
.tm-lad-ci{display:flex;flex-wrap:wrap;gap:2px 14px;font-size:12.5px;color:var(--txt-2)}
.tm-lad-cop{font-weight:600}
.tm-lad-cz,.tm-lad-cg,.tm-lad-cp{display:inline}
.tm-lad-cp{color:var(--txt)}
/* podstrona lokalizacji */
.tm-lad-info{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 16px;margin:0 0 14px;font-size:14px}
.tm-lad-info dt{font-weight:600;color:var(--txt-2)}
.tm-lad-info dd{margin:0}
.tm-lad-tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.tm-lad-tbl th{text-align:left;padding:8px 10px;border-bottom:2px solid var(--line);font-size:12.5px;color:var(--txt-2)}
.tm-lad-td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.tm-lad-tr:last-child .tm-lad-td{border-bottom:0}
.tm-lad-kod{display:block;font-weight:600}
.tm-lad-tryb{display:block;font-size:12px;color:var(--txt-2)}
.tm-lad-kabel{font-size:12px;color:var(--txt-2)}
.tm-lad-czas{display:block;margin-top:3px;font-size:11.5px;color:var(--txt-2)}
.tm-lad-ceny{margin:0;padding:0;list-style:none}
.tm-lad-godz{border-collapse:collapse;font-size:13.5px}
.tm-lad-godz th{text-align:left;padding:4px 14px 4px 0;font-weight:600;color:var(--txt-2)}
.tm-lad-godz td{padding:4px 0}
/* spis miast */
.tm-lad-woj{margin-bottom:18px}
.tm-lad-miasta{columns:3;column-gap:24px;margin:0;padding:0;list-style:none;font-size:14px}
.tm-lad-mi{break-inside:avoid;padding:3px 0}
.tm-lad-mi-a{color:var(--loc);font-weight:600;text-decoration:none}
.tm-lad-mi-a:hover{text-decoration:underline}
.tm-lad-mi-n{color:var(--txt-3)}
.tm-lad-mi-l{margin-left:6px;font-size:12px;color:var(--txt-2)}
/* źródło */
.tm-lad-zrodlo{padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:#fafbfc}
.tm-lad-attr{margin:0;font-size:12.5px;color:var(--txt-2)}
/* kafel strony głównej (sekcja Moto) */
.tm-lad-kafel{margin:18px 0 0;padding:14px 16px;border:1px solid var(--line);border-left:3px solid var(--ac,var(--loc));border-radius:8px;background:#fff}
.tm-lad-kh{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0 0 6px}
.tm-lad-ico{flex:none;color:var(--ac,var(--loc))}
.tm-lad-kt{margin:0;font-size:17px;font-weight:700;color:var(--txt)}
.tm-lad-ks{font-size:12px;color:var(--txt-2)}
.tm-lad-kn{display:flex;flex-wrap:wrap;gap:4px 14px;margin:0 0 8px;padding:0;list-style:none;font-size:13px;color:var(--txt-2)}
.tm-lad-kni{display:inline}
.tm-lad-kni-w{color:#1c6b43;font-weight:600}
.tm-lad-kl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 22px;margin:0;padding:0;list-style:none}
.tm-lad-ki{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 8px;padding:7px 0;border-top:1px dashed var(--line);font-size:13.5px}
.tm-lad-kname{font-weight:600;color:var(--txt);text-decoration:none}
.tm-lad-kname:hover{color:var(--ac,var(--loc))}
.tm-lad-km{font-size:12px;color:var(--txt-2)}
.tm-lad-kv{font-size:12.5px;font-weight:600;color:var(--txt-2)}
.tm-lad-kv-wolne{color:#1c6b43}
.tm-lad-kv-zajete{color:#b3261e}
.tm-lad-kv-brak{color:var(--txt-2)}
.tm-lad-kv-op{color:#7a5600}
.tm-lad-kd{font-size:12px;color:var(--txt-2)}
.tm-lad-kf{display:flex;flex-wrap:wrap;gap:4px 16px;margin:10px 0 0;font-size:12px;color:var(--txt-2)}
.tm-lad-kw{font-weight:600;color:var(--ac,var(--loc));text-decoration:none}
.tm-lad-kw:hover{text-decoration:underline}
.tm-lad-kz{margin-left:auto}
.tm-lad-kzl{color:inherit;text-decoration:underline}
@media(max-width:880px){.tm-lad-body .tm-side{margin-top:18px}.tm-lad-kl{grid-template-columns:repeat(2,minmax(0,1fr))}.tm-lad-miasta{columns:2}}
@media(max-width:700px){
 .tm-lad-list{grid-template-columns:minmax(0,1fr)}
 .tm-lad-mapa{height:340px}
 .tm-lad-mapa-s{height:260px}
 .tm-lad-kl{grid-template-columns:minmax(0,1fr)}
 .tm-lad-tbl,.tm-lad-tbl thead,.tm-lad-tbl tbody,.tm-lad-tr,.tm-lad-td{display:block}
 .tm-lad-tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
 .tm-lad-tr{padding:8px 0;border-bottom:1px solid var(--line)}
 .tm-lad-td{padding:3px 0;border:0}
 .tm-lad-td::before{content:attr(data-l) ": ";font-size:12px;color:var(--txt-2)}
 .tm-lad-info{grid-template-columns:minmax(0,1fr)}
 .tm-lad-miasta{columns:1}
 .tm-lad-kafel{padding:12px 13px}
 .tm-lad-kz{margin-left:0}
}
/* --- koniec sekcji stacje ładowania --- */

/* =====================================================================================
   MODUŁ SZKOŁY, PRZEDSZKOLA I ŻŁOBKI (pomysł #371, 2026-09-16)
   Dział /szkoly/ (smarty/templates/ext/szkoly/*.tpl, moduł ext/szkoly.php: strona miasta, strona
   grupy - 13 grup RSPO plus żłobki i kluby dziecięce, podstrona placówki, portal ogólnopolski,
   sitemapa) oraz kafel "Szkoły i żłobki" w pasie lokalnym strony głównej miasta
   (smarty/templates/ext/S/NT3szkolyPas.tpl, widget TMszkoly, Zadanie 19). Dział nie ma wiersza
   w tabeli `strony`, więc układ (.tm-in, .tm-cols, .tm-side) rysuje sam - tutaj jest tylko to,
   czego motyw nie ma.
   Akcent działu: --loc (granat modułów miejskich - pas "Twoje miasto", /apteki, /kolejki-nfz,
   /stan-wody). Kafel w pasie dziedziczy --ac sekcji, w której go osadzono, i wraca do --loc, gdy
   sekcja tego nie ustawia.
   Kolor na mapie i w legendzie niesie wyłącznie GRUPĘ placówki (przedszkole, szkoła podstawowa,
   żłobek...), nigdy jej ocenę - paleta 13 grup i domyślnego koloru ma dokładnie te same wartości
   szesnastkowe co stała KOLORY w www/theme/3/js/szkolyMapa.js (test SzkolyCssTest porównuje jedno
   z drugim, żeby paleta nie rozjechała się przy kolejnej edycji jednego z dwóch plików).
   Drobne teksty w --txt-2 (kontrast AA na bieli), nigdy w --txt-3 (3,2:1 to poniżej AA) poza
   separatorem okruszków, tak jak w pozostałych modułach miejskich.
   Bez wysokości linii w jednostkach bezwzględnych i bez skracania tekstu wielokropkiem przy
   nazwach placówek - obie rzeczy ścinają kreski nad Ś/Ź i ogonki (notatka o ellipsis w theme/3),
   dlatego długie nazwy zawijają się na kolejne wiersze zamiast być obcinane. Pudełko mapy jest
   wyjątkiem celowym: przycina kafelki OpenStreetMap do zaokrąglonego rogu, tak jak istniejące
   pudełko mapy modułu Apteki w tym samym pliku - to nie dotyczy tekstu i nie ścina żadnych znaków.
   Lista klas .tm-szk-* jest wspólna z Zadaniem 16 (szablony działu) i Zadaniem 19 (kafel pasa) -
   test SzkolyCssTest pilnuje, że każda klasa .tm-szk-* faktycznie użyta w tych szablonach ma tu
   regułę, i szuka zakazanych deklaracji w CAŁEJ sekcji łącznie z tym komentarzem - dlatego są one
   opisane słowami, a nie zapisane dosłownie.
   ===================================================================================== */
.tm-szk-body{padding-top:14px}
.tm-szk-body .tm-bc{margin-bottom:12px}
.tm-szk-bcs{margin:0 2px;color:var(--txt-3)}
.tm-szk-okr{margin:0 0 12px;font-size:12.5px;color:var(--txt-2)}
.tm-szk-okr a{color:var(--txt-2);text-decoration:none}
.tm-szk-okr a:hover,.tm-szk-okr a:focus-visible{color:var(--loc);text-decoration:underline}
.tm-szk-head .tm-h1k{margin-left:0}
.tm-szk-lead{margin:-6px 0 10px;max-width:760px;font-size:15px;line-height:1.55;color:var(--txt-2)}
.tm-szk-stan{margin:0 0 20px;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-szk-sec{margin:0 0 30px;scroll-margin-top:86px}
.tm-szk-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-szk-h3{margin:0 0 10px;font:600 15px/1.35 var(--f-ui);color:var(--txt-h)}
.tm-szk-a{color:var(--loc);font-weight:600;text-decoration:none}
.tm-szk-a:hover,.tm-szk-a:focus-visible{text-decoration:underline;text-underline-offset:2px}

/* --- kolor i ikona grupy (2026-10-11): --szk-c kolor grupy jak na mapie (ikony, kreski), --szk-t jasny
   odcień na tło ikony (11% koloru na bieli), --szk-d ciemniejszy wariant do TEKSTU - liczony tak, żeby na
   bieli i na --szk-t miał co najmniej 4,6:1. Ikony z jednego sprite'u SVG (_ikony.tpl), kolor przez currentColor. --- */
.tm-szk-g-przedszkola{--szk-c:#e2711d;--szk-t:#fcefe6;--szk-d:#a55215}
.tm-szk-g-szkoly-podstawowe{--szk-c:#2f7dc9;--szk-t:#e8f1f9;--szk-d:#296eb1}
.tm-szk-g-licea{--szk-c:#6c3fa0;--szk-t:#efeaf5;--szk-d:#6c3fa0}
.tm-szk-g-technika{--szk-c:#0f9ba0;--szk-t:#e5f4f5;--szk-d:#0b767a}
.tm-szk-g-szkoly-branzowe{--szk-c:#b5533c;--szk-t:#f7ecea;--szk-d:#aa4e38}
.tm-szk-g-policealne{--szk-c:#7a8a3c;--szk-t:#f0f2ea;--szk-d:#647131}
.tm-szk-g-artystyczne{--szk-c:#c94f8f;--szk-t:#f9ecf3;--szk-d:#ab437a}
.tm-szk-g-specjalne{--szk-c:#4a5568;--szk-t:#ebecee;--szk-d:#4a5568}
.tm-szk-g-zespoly{--szk-c:#3c6e8f;--szk-t:#eaeff3;--szk-d:#3c6e8f}
.tm-szk-g-poradnie-i-inne{--szk-c:#8a6d3b;--szk-t:#f2efe9;--szk-d:#826637}
.tm-szk-g-inne{--szk-c:#8b93a1;--szk-t:#f2f3f5;--szk-d:#656b76}
.tm-szk-g-zlobki{--szk-c:#d1367a;--szk-t:#fae9f0;--szk-d:#be316f}
.tm-szk-g-kluby-dzieciece{--szk-c:#f2a341;--szk-t:#fef5ea;--szk-d:#946328}
.tm-szk-sprite{position:absolute;width:0;height:0;overflow:hidden}
.tm-szk-svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tm-szk-ik{display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;border-radius:11px;background:var(--szk-t,var(--band));color:var(--szk-c,var(--loc))}
.tm-szk-ik .tm-szk-svg{width:22px;height:22px}
.tm-szk-ik-s{width:32px;height:32px;border-radius:9px}
.tm-szk-ik-s .tm-szk-svg{width:18px;height:18px}
.tm-szk-ik-l{width:56px;height:56px;border-radius:15px}
.tm-szk-ik-l .tm-szk-svg{width:30px;height:30px;stroke-width:1.6}
.tm-szk-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* --- kafle liczników grup na stronie działu (_liczniki.tpl) --- */
.tm-szk-lic{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:0 0 26px;padding:0;list-style:none}
.tm-szk-lic-i{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"ik n" "e e";align-items:center;gap:8px 10px;align-content:start;height:100%;padding:12px 14px;border:1px solid var(--line);border-bottom:3px solid var(--szk-c,var(--loc));border-radius:10px;background:#fff;text-decoration:none;transition:box-shadow .2s,transform .2s}
.tm-szk-lic-i:hover,.tm-szk-lic-i:focus-visible{box-shadow:var(--card-sh-h);transform:translateY(-1px)}
.tm-szk-lic-i .tm-szk-ik{grid-area:ik;width:34px;height:34px;border-radius:9px}
.tm-szk-lic-i .tm-szk-ik .tm-szk-svg{width:19px;height:19px}
.tm-szk-lic-n{grid-area:n;display:block;font:700 26px/1 var(--f-lab);color:var(--txt-h)}
.tm-szk-lic-e{grid-area:e;display:block;font-size:12.5px;line-height:1.3;color:var(--txt-2)}

/* --- siatka kart placówek i karta (_karta.tpl) --- */
.tm-szk-karty{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin:0;padding:0;list-style:none}
.tm-szk-karta{display:flex;flex-direction:column;gap:9px;min-width:0;padding:14px 16px;border:1px solid var(--line);border-top:4px solid var(--szk-c,var(--loc));border-radius:10px;background:#fff;transition:box-shadow .2s}
.tm-szk-karta:hover,.tm-szk-karta:focus-within{box-shadow:var(--card-sh-h)}
.tm-szk-karta-g{display:flex;align-items:flex-start;gap:11px}
.tm-szk-karta-t{min-width:0}
.tm-szk-karta-n{display:block;font-size:15px;font-weight:600;line-height:1.35;color:var(--txt-h)}
a.tm-szk-karta-n{text-decoration:none}
a.tm-szk-karta-n:hover,a.tm-szk-karta-n:focus-visible{color:var(--szk-d,var(--loc));text-decoration:underline;text-underline-offset:2px}
.tm-szk-karta-s{display:block;margin-top:3px;font-size:13.5px;font-weight:600;line-height:1.35;color:var(--szk-d,var(--loc))}
.tm-szk-meta{display:flex;flex-wrap:wrap;align-items:center;gap:5px 8px}
.tm-szk-typ{font-size:12.5px;line-height:1.35;color:var(--txt-2)}
.tm-szk-odz{display:inline-block;padding:1px 7px;border-radius:4px;font:600 10.5px var(--f-lab);letter-spacing:.05em;text-transform:uppercase}
.tm-szk-odz-pub{background:#e5f4ec;color:#1c6b43}
.tm-szk-odz-niepub{background:#fdf1e3;color:#8a4b12}
.tm-szk-uczn{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:600;color:var(--txt)}
.tm-szk-uczn .tm-szk-svg{width:15px;height:15px;color:var(--szk-d,var(--txt-2))}
.tm-szk-adres{display:flex;align-items:flex-start;gap:6px;font-size:13px;line-height:1.45;color:var(--txt)}
.tm-szk-adres>.tm-szk-svg{width:16px;height:16px;margin-top:1px;color:var(--txt-2)}
.tm-szk-adres-t{flex:1 1 auto;min-width:0}
.tm-szk-miejscowosc{color:var(--txt-2);font-weight:400}
.tm-szk-adres .tm-szk-dojazd{display:inline-flex;align-items:center;justify-content:center;flex:none;width:30px;height:30px;margin:-5px 0 -4px;border-radius:50%;background:var(--szk-t,var(--band));color:var(--szk-d,var(--loc));transition:background .2s,color .2s}
.tm-szk-adres .tm-szk-dojazd .tm-szk-svg{width:16px;height:16px}
.tm-szk-adres .tm-szk-dojazd:hover,.tm-szk-adres .tm-szk-dojazd:focus-visible{background:var(--szk-d,var(--loc));color:#fff}
.tm-szk-akcje{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:2px}
.tm-szk-akcja{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border:1px solid var(--line);border-radius:999px;font-size:13px;font-weight:600;line-height:1.3;color:var(--txt);text-decoration:none;white-space:nowrap;transition:border-color .2s,color .2s}
.tm-szk-akcja .tm-szk-svg{width:15px;height:15px;color:var(--szk-d,var(--loc))}
.tm-szk-akcja:hover,.tm-szk-akcja:focus-visible{border-color:var(--szk-c,var(--loc));color:var(--szk-d,var(--loc))}
.tm-szk-miejsca{display:block;padding-top:8px;border-top:1px dashed var(--line);font-size:13px;line-height:1.4;color:var(--txt)}
.tm-szk-oplata{display:block;margin-top:3px;font-size:12.5px;color:var(--txt-2)}
.tm-szk-godziny{display:block;margin-top:3px;font-size:12.5px;color:var(--txt-2)}

/* --- sekcje grup na stronie działu i grupy (Publiczne/Niepubliczne/Pozostałe, "inne" zwinięta) --- */
.tm-szk-grupa{margin-bottom:30px}
.tm-szk-grupa-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 14px;padding-bottom:9px;border-bottom:2px solid var(--szk-c,var(--loc))}
.tm-szk-grupa-h .tm-szk-h2{flex:1 1 auto;margin-bottom:0;border-bottom:0;padding-bottom:0}
.tm-szk-h2-n{display:inline-block;margin-left:4px;padding:1px 9px;border-radius:999px;background:var(--szk-t,var(--band));font:700 14px/1.5 var(--f-lab);color:var(--szk-d,var(--txt-2));vertical-align:3px}
.tm-szk-grupa-wiecej{flex:none;font-size:13px;font-weight:600;color:var(--loc);text-decoration:none}
.tm-szk-grupa-wiecej:hover,.tm-szk-grupa-wiecej:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-szk-det{margin:0 0 30px;padding:0 0 4px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tm-szk-sum{display:flex;align-items:center;gap:10px;padding:12px 2px;cursor:pointer;list-style:none;font:600 13px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-szk-sum::-webkit-details-marker{display:none}
.tm-szk-sum::after{content:"\25BE";font-size:12px}
.tm-szk-det[open] .tm-szk-sum::after{content:"\25B4"}
.tm-szk-podgrupa{margin:0 0 26px}
.tm-szk-podgrupa-h{margin:0 0 12px;font:600 13px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-szk-wariant{display:inline-block;margin:0 0 20px;font-size:13.5px;font-weight:600;color:var(--loc);text-decoration:none}
.tm-szk-wariant:hover,.tm-szk-wariant:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-szk-nawgrupy{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 26px;padding:0;list-style:none}
.tm-szk-nawgrupy-i a{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 12.5px var(--f-lab);color:var(--txt-2);text-decoration:none}
.tm-szk-nawgrupy-i a:hover,.tm-szk-nawgrupy-i a:focus-visible{border-color:var(--szk-c,var(--loc));color:var(--szk-d,var(--loc))}
.tm-szk-nawgrupy-i .tm-szk-svg{width:15px;height:15px;color:var(--szk-c,var(--loc))}

/* --- najczęściej zadawane pytania (strona działu, też JSON-LD FAQPage) --- */
.tm-szk-faq{margin:0 0 30px}
.tm-szk-faq-i{margin:0 0 16px}
.tm-szk-faq-q{margin:0 0 4px;font:600 14.5px/1.4 var(--f-ui);color:var(--txt-h)}
.tm-szk-faq-a{margin:0;font-size:14px;line-height:1.55;color:var(--txt-2)}

/* --- mapa (_mapa.tpl, szkolyMapa.js): 360 px, legenda budowana w JS z kolorem grupy --- */
.tm-szk-mapa-wrap{margin:0 0 26px}
.tm-szk-mapa{position:relative;isolation:isolate;height:360px;margin:0 0 8px;border:1px solid var(--line);border-radius:8px;background:#e8edf2;overflow:hidden}
.tm-szk-mapa-s{height:280px}
.tm-szk-mapa-blad{display:flex;align-items:center;justify-content:center;padding:16px;font-size:13px;color:var(--txt-2)}
.tm-szk-mapa .leaflet-container{font:inherit}
.tm-szk-mapa-pominieta{margin:0 0 26px;padding:12px 14px;border-left:4px solid var(--loc);background:var(--loc-bg);font-size:14px;line-height:1.5}
.tm-szk-leg{display:flex;flex-wrap:wrap;gap:4px 14px;list-style:none;margin:0 0 26px;padding:0;font-size:12.5px;color:var(--txt-2)}
.tm-szk-leg li{display:inline-flex;align-items:center;gap:6px}
.tm-szk-kr{display:inline-block;width:12px;height:12px;border-radius:50%;border:1.5px solid #fff;box-shadow:0 0 0 1px #c8ced8}
.tm-szk-kr-przedszkola{background:#e2711d}
.tm-szk-kr-szkoly-podstawowe{background:#2f7dc9}
.tm-szk-kr-licea{background:#6c3fa0}
.tm-szk-kr-technika{background:#0f9ba0}
.tm-szk-kr-szkoly-branzowe{background:#b5533c}
.tm-szk-kr-policealne{background:#7a8a3c}
.tm-szk-kr-artystyczne{background:#c94f8f}
.tm-szk-kr-specjalne{background:#4a5568}
.tm-szk-kr-zespoly{background:#3c6e8f}
.tm-szk-kr-poradnie-i-inne{background:#8a6d3b}
.tm-szk-kr-inne{background:#8b93a1}
.tm-szk-kr-zlobki{background:#d1367a}
.tm-szk-kr-kluby-dzieciece{background:#f2a341}
.tm-szk-kr-domyslna{background:#626b79}
.tm-szk-pop{font-size:13px;line-height:1.4;color:var(--txt)}
.tm-szk-popn{display:block;margin:0 0 3px;font-size:14px;font-weight:600;color:var(--loc)}
.tm-szk-popt{font-weight:600}
.tm-szk-popl{display:inline-block;margin-top:6px;font-weight:600;color:var(--loc)}

/* --- podstrona placówki (placowka.tpl): dwie kolumny od 880 px, jedna kolumna niżej --- */
.tm-szk-plac{padding-top:4px}
.tm-szk-hero{display:flex;align-items:center;gap:16px;margin:0 0 16px;padding:18px 20px;border-radius:14px;background:linear-gradient(120deg,var(--szk-t,var(--band)) 0%,#fff 85%);border:1px solid var(--line);border-left:5px solid var(--szk-c,var(--loc))}
.tm-szk-hero .tm-szk-ik-l{background:#fff;box-shadow:0 1px 0 var(--line)}
.tm-szk-hero-t{min-width:0}
.tm-szk-hero-typ{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0 0 6px;font-size:13px;font-weight:600;color:var(--szk-d,var(--txt-2))}
.tm-szk-hero-h{margin:0;font:700 26px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-szk-hero-z,.tm-szk-hero-s{display:block}
.tm-szk-hero-s{margin-top:4px;font-size:18px;font-weight:600;color:var(--szk-d,var(--loc))}
.tm-szk-fakty{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:0 0 22px;padding:0;list-style:none}
.tm-szk-fakt{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:2px 10px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#fff}
.tm-szk-fakt .tm-szk-svg{grid-row:span 2;width:26px;height:26px;color:var(--szk-c,var(--loc))}
.tm-szk-fakt-n{font:700 24px/1.1 var(--f-lab);color:var(--txt-h)}
.tm-szk-fakt-e{font-size:12.5px;line-height:1.3;color:var(--txt-2)}
.tm-szk-plac-cols{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}
.tm-szk-plac-main{min-width:0}
.tm-szk-plac-aside{min-width:0}
.tm-szk-zawieszona{margin:0 0 18px;padding:12px 14px;border-left:4px solid #b3261e;background:#fbf2ec;font-size:14px;line-height:1.5;color:#7a3a1d}
.tm-szk-kontakt{padding:16px;border:1px solid var(--line);border-radius:12px;background:#fff}
.tm-szk-k-adres{display:flex;align-items:flex-start;gap:8px;margin:0 0 10px;font-size:14.5px;font-weight:600;line-height:1.45;color:var(--txt-h)}
.tm-szk-k-adres .tm-szk-svg{width:20px;height:20px;color:var(--szk-c,var(--loc))}
.tm-szk-trasa{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 14px;padding:10px 14px;border-radius:8px;background:var(--szk-d,var(--loc));font-size:14px;font-weight:600;color:#fff;text-decoration:none;transition:background .2s}
.tm-szk-trasa:hover,.tm-szk-trasa:focus-visible{background:var(--dark);color:#fff}
.tm-szk-trasa .tm-szk-svg{width:17px;height:17px}
.tm-szk-trasa-z{font-weight:400}
.tm-szk-k-l{margin:0 0 14px;padding:0;list-style:none;font-size:14px}
.tm-szk-k-l li{display:flex;align-items:center;gap:9px;padding:7px 0;border-top:1px solid var(--line);min-width:0}
.tm-szk-k-l li:first-child{border-top:0}
.tm-szk-k-l .tm-szk-svg{width:17px;height:17px;color:var(--szk-c,var(--loc))}
.tm-szk-k-l a{overflow-wrap:anywhere}
.tm-szk-kontakt .tm-szk-mapa-wrap,.tm-szk-kontakt .tm-szk-mapa{margin-bottom:0}
.tm-szk-sekcja{margin:0 0 24px}
.tm-szk-dl{margin:0;border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}
.tm-szk-dl-r{display:grid;grid-template-columns:minmax(150px,34%) 1fr;gap:4px 16px;padding:9px 14px;border-top:1px solid var(--line)}
.tm-szk-dl-r:first-child{border-top:0}
.tm-szk-dl-r:nth-child(even){background:#fafbfc}
.tm-szk-dl dt{font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-szk-dl dd{margin:0;font-size:14px;line-height:1.5;color:var(--txt)}
.tm-szk-nadrzedny{display:flex;align-items:center;gap:12px;margin:0 0 22px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--szk-t,var(--band));text-decoration:none;transition:box-shadow .2s}
.tm-szk-nadrzedny:hover,.tm-szk-nadrzedny:focus-visible{box-shadow:var(--card-sh-h)}
.tm-szk-nadrzedny .tm-szk-ik{background:#fff}
.tm-szk-nadrzedny-e{display:block;font-size:12.5px;color:var(--txt-2)}
.tm-szk-nadrzedny-n{display:block;font-size:15px;font-weight:600;line-height:1.35;color:var(--szk-d,var(--loc))}
.tm-szk-skladowe{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;margin:0 0 20px;padding:0;list-style:none}
.tm-szk-skl{display:flex;align-items:flex-start;gap:10px;height:100%;padding:11px 12px;border:1px solid var(--line);border-left:3px solid var(--szk-c,var(--loc));border-radius:8px;background:#fff;text-decoration:none;transition:box-shadow .2s}
.tm-szk-skl:hover,.tm-szk-skl:focus-visible{box-shadow:var(--card-sh-h)}
.tm-szk-skl .tm-szk-ik{width:34px;height:34px;border-radius:9px}
.tm-szk-skl .tm-szk-ik .tm-szk-svg{width:19px;height:19px}
.tm-szk-skl-n{display:block;font-size:14px;font-weight:600;line-height:1.35;color:var(--txt-h)}
.tm-szk-skl:hover .tm-szk-skl-n{color:var(--szk-d,var(--loc))}
.tm-szk-skl-t{display:block;margin-top:2px;font-size:12.5px;color:var(--txt-2)}

/* --- portal ogólnopolski (polska.tpl) --- */
.tm-szk-woj{margin-bottom:26px}
.tm-szk-tbl{width:100%;margin:0 0 8px;border-collapse:collapse;font-size:13.5px}
.tm-szk-tbl caption{caption-side:top;text-align:left}
.tm-szk-tbl th{padding:8px 10px;border-bottom:2px solid var(--dark);text-align:left;font:600 11px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-szk-tbl td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.tm-szk-tbl tr:last-child td{border-bottom:0}
.tm-szk-tbl-stat{margin-bottom:26px}

/* --- źródło danych (_zrodlo.tpl) i strona błędu --- */
.tm-szk-zrodlo{margin:20px 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px;line-height:1.55;color:var(--txt-2)}
.tm-szk-attr a{color:var(--txt-2)}
.tm-szk-blad{margin:0 0 24px}
.tm-szk-btn{display:inline-block;margin-top:6px;padding:9px 16px;border-radius:6px;background:var(--loc);font-weight:600;color:#fff;text-decoration:none}
.tm-szk-btn:hover,.tm-szk-btn:focus-visible{background:var(--dark);color:#fff}

/* --- kafel "Szkoły i żłobki" w pasie lokalnym strony głównej (NT3szkolyPas.tpl, Zadanie 19) --- */
.tm-szk-pas{margin:18px 0 0;padding:14px 16px;border:1px solid var(--line);border-left:3px solid var(--ac,var(--loc));border-radius:8px;background:#fff}
.tm-szk-pas-l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;margin:0;padding:0;list-style:none}
.tm-szk-pas-i{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:7px 0;border-top:1px dashed var(--line);font-size:13.5px;line-height:1.4}
.tm-szk-pas-n{font-weight:600;color:var(--txt);text-decoration:none}
.tm-szk-pas-n:hover,.tm-szk-pas-n:focus-visible{color:var(--ac-dark,var(--loc));text-decoration:underline;text-underline-offset:2px}
.tm-szk-pas-v{font-weight:600;color:var(--txt);font-variant-numeric:tabular-nums;white-space:nowrap}

/* --- responsywność: podstrona i karty < 881 px, siatki i tabela jako karty <= 700 px --- */
@media(max-width:880px){
 .tm-szk-plac-cols{grid-template-columns:minmax(0,1fr)}
 .tm-szk-plac-aside{margin-top:6px}
 .tm-szk-karty{grid-template-columns:repeat(2,minmax(0,1fr))}
 .tm-szk-hero-h{font-size:22px}
}
@media(max-width:700px){
 .tm-szk-karty{grid-template-columns:minmax(0,1fr)}
 .tm-szk-lic{grid-template-columns:repeat(2,minmax(120px,1fr))}
 .tm-szk-hero{align-items:flex-start;gap:12px;padding:14px}
 .tm-szk-hero .tm-szk-ik-l{width:44px;height:44px;border-radius:12px}
 .tm-szk-hero .tm-szk-ik-l .tm-szk-svg{width:24px;height:24px}
 .tm-szk-hero-h{font-size:20px}
 .tm-szk-hero-s{font-size:16px}
 .tm-szk-fakty{grid-template-columns:repeat(2,minmax(0,1fr))}
 .tm-szk-dl-r{grid-template-columns:minmax(0,1fr)}
 .tm-szk-pas-l{grid-template-columns:minmax(0,1fr)}
 .tm-szk-tbl thead{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);white-space:nowrap}
 .tm-szk-tbl,.tm-szk-tbl tbody,.tm-szk-tbl tr,.tm-szk-tbl td{display:block;width:100%}
 .tm-szk-tbl tr{margin:0 0 10px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff}
 .tm-szk-tbl td{border:0;padding:3px 0}
 .tm-szk-tbl td::before{content:attr(data-l) ": ";font-weight:600;color:var(--txt-2)}
 .tm-locmods>.tm-locmod.tm-locmod-szk{flex:1 1 100%;padding:7px 10px;order:4}
 .tm-locmods>.tm-locmod.tm-locmod-szk .tm-locmh{font-size:10.5px;letter-spacing:.1em}
 .tm-szk-mapa{height:280px}
 .tm-szk-mapa-s{height:220px}
}

/* --- panel /adm/szkoły (Zadanie 21) --- */
.tm-szk-adm-nav{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 18px}
.tm-szk-adm-nav a{display:inline-block;padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 12.5px var(--f-lab);color:var(--txt-2);text-decoration:none}
.tm-szk-adm-nav a:hover{border-color:var(--loc);color:var(--loc)}
.tm-szk-adm-nav a[aria-current]{border-color:var(--loc);background:var(--loc);color:#fff}
.tm-szk-adm-flash{margin:0 0 16px;padding:10px 14px;border:1px solid #bfe0c8;border-radius:8px;background:#f1faf3;color:#1f5f34;font-size:14px}
.tm-szk-adm-flash-danger{border-color:#e6c3b0;background:#fbf2ec;color:#7a3a1d}
.tm-szk-adm-form{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px}
.tm-szk-adm-form input[type=text],.tm-szk-adm-form select{font:inherit;font-size:14px;padding:6px 10px;border:1px solid var(--line);border-radius:6px;background:#fff}
.tm-szk-adm-btn{font:600 13px var(--f-lab);padding:6px 12px;border:1px solid var(--loc);border-radius:6px;background:#fff;color:var(--loc);cursor:pointer}
.tm-szk-adm-btn:hover{background:var(--loc);color:#fff}
.tm-szk-adm-btn-x{border-color:#b3261e;color:#b3261e}
.tm-szk-adm-btn-x:hover{background:#b3261e}
.tm-szk-adm-uw{font-size:12px;color:var(--txt-2)}
.tm-szk-adm-st{display:inline-block;padding:1px 7px;border-radius:4px;font:600 11px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;background:var(--band);color:var(--txt-2)}
.tm-szk-adm-st-ok{background:#e5f4ec;color:#1c6b43}
.tm-szk-adm-st-blad{background:#fbf2ec;color:#7a3a1d}
.tm-szk-tbl-adm{font-size:13px}
.tm-szk-tbl-adm td,.tm-szk-tbl-adm th{padding:6px 8px}
.tm-szk-adm-lista-miast{columns:3;font-size:13px}
.tm-szk-adm-log{font:12px/1.5 ui-monospace,monospace;max-height:320px;overflow:auto;background:var(--band);padding:10px;border-radius:8px}
@media(max-width:700px){
 .tm-szk-adm-lista-miast{columns:1}
}
/* --- koniec sekcji szkoły (Zadanie 18) --- */

/* =====================================================================================
   MODUŁ WIARA (idea #384, 2026-09-17)
   Dział /wiara/ (kościoły i miejsca kultu, godziny Mszy) - smarty/templates/ext/wiara/*.tpl,
   moduł ext/wiara.php - oraz kafel "Msze dziś" w pasie lokalnym strony głównej
   (smarty/templates/ext/S/NT3wiaraPas.tpl, widget TMwiara). Dział nie ma wiersza w tabeli
   `strony`, więc układ (.tm-in, .tm-cols, .tm-side) rysuje sam - tutaj jest tylko to, czego
   motyw nie ma.
   Akcent działu: --loc (granat modułów miejskich, jak /apteki, /kolejki-nfz, /polityka).
   Kafel pasa dziedziczy --ac sekcji strony głównej i wraca do --loc poza nią.
   Drobne teksty w --txt-2 (AA na bieli), nigdy w --txt-3.
   Kolor pinezki na mapie i kropki w legendzie niesie WYŁĄCZNIE grupę wyznania (paleta
   WiaraWyznania::PALETA, identyczna w wiaraMapa.js - test WiaraCssTest porównuje wartości).
   Bez ucinania nadmiaru pudełka i bez wysokości linii w pikselach przy tekstach z polskimi
   znakami - obie rzeczy ścinają kreski nad Ś/Ź i ogonki (notatka o ellipsis w theme/3); nazwa
   kościoła w kaflu pasa jest skracana w PHP (WiaraWidok/TMwiara), nie w CSS.
   Rozkład (.tm-wia-tabs/.tm-wia-panel): bez JS widoczny tylko panel "Dziś" (pozostałe dwa mają
   atrybut hidden w msze.tpl); JS (wiaraMsze.js) dopiero włącza zakładki z role="tab"/"tabpanel".
   Tabele powyżej 700 px, karty poniżej (jak Kolejki NFZ) - role ARIA w HTML trzymają semantykę
   tabeli mimo display:block.
   Test WiaraCssTest pilnuje, że każda klasa .tm-wia-* użyta w szablonach ma tu regułę
   (także klasy .tm-wia-pas-* kafla, którego szablon powstaje dopiero w Zadaniu 19), że paleta
   w wiaraMapa.js zgadza się z WiaraWyznania::PALETA i że w sekcji nie ma zakazanych deklaracji -
   dlatego są one opisane słowami, a nie zapisane dosłownie, również w tym komentarzu.
   ===================================================================================== */
.tm-wia-body{padding-top:14px}
.tm-wia-body .tm-bc{margin-bottom:12px}
.tm-wia-bcs{margin:0 2px;color:var(--txt-3)}
.tm-wia-head .tm-h1k{margin-left:0}
.tm-wia-lead{margin:-6px 0 16px;max-width:760px;font-size:15px;line-height:1.55;color:var(--txt-2)}
.tm-wia-stan{margin:0 0 18px;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-wia-sec{margin:0 0 30px;scroll-margin-top:86px}
/* POPRAWKA po próbie generalnej 2026-09-17: _godziny.tpl ma id="godziny" na tej samej sekcji
   (class="tm-wia-sec tm-wia-godziny"), więc potrzebuje własnego scroll-margin-top jak siostrzane
   sekcje z kotwicą (.tm-wia-mapa-sec, .tm-wia-adres-sec, .tm-wia-art-sec, .tm-wia-woj) - bez tej
   reguły WiaraCssTest::testKazdaKlasaMaRegule() pada na braku selektora .tm-wia-godziny (klasa
   .tm-wia-godziny-brak/-tekst/-niedziela/-powszednie/-okresowo/-stan nie liczy się jako reguła
   samej .tm-wia-godziny - test wymaga dokładnego dopasowania granicy klasy). */
.tm-wia-godziny{scroll-margin-top:86px}
.tm-wia-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-wia-grupa{margin-bottom:26px}
.tm-wia-grupa-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 18px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-wia-btn{display:inline-block;margin-top:6px;padding:9px 16px;border-radius:6px;background:var(--loc);font-weight:600;color:#fff;text-decoration:none}
.tm-wia-btn:hover,.tm-wia-btn:focus-visible{background:var(--dark);color:#fff}
.tm-wia-btn-l{background:none;padding:9px 10px;color:var(--loc)}
.tm-wia-btn-l:hover,.tm-wia-btn-l:focus-visible{background:var(--loc-bg);color:var(--loc)}
.tm-wia-blad{margin:0 0 24px}
.tm-wia-pusto{padding:14px 16px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg)}
.tm-wia-pusto .tm-wia-lead{margin-top:0}

/* --- Msze dziś w dziale (_mszeDzis.tpl, sekcja "dzis" w miasto.tpl) --- */
/* POPRAWKA po próbie generalnej 2026-09-17: sekcja ma id="dzis" (class="tm-wia-sec tm-wia-dzis"),
   brakowało własnego scroll-margin-top jak przy .tm-wia-godziny/-mapa-sec/-adres-sec/-art-sec/-woj. */
.tm-wia-dzis{scroll-margin-top:86px}
.tm-wia-dzis-etykieta{margin:0 0 10px;font-size:13px;color:var(--txt-2)}
.tm-wia-koniec{margin:0 0 10px;padding:12px 14px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg);font-size:14px;line-height:1.5}
.tm-wia-dzis-lista{margin:0;padding:0;list-style:none}
.tm-wia-jutro{margin-top:10px}
.tm-wia-dzis-item{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 10px;padding:8px 0;border-top:1px dashed var(--line);font-size:14px}
.tm-wia-dzis-item:first-child{border-top:0}
.tm-wia-godzina{min-width:52px;font-weight:700;color:var(--dark);font-variant-numeric:tabular-nums}
.tm-wia-nazwa{font-weight:600;color:var(--txt);text-decoration:none}
.tm-wia-nazwa:hover,.tm-wia-nazwa:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-wia-odl{font-size:12.5px;color:var(--txt-2);white-space:nowrap}
.tm-wia-uwaga{flex-basis:100%;font-size:12.5px;line-height:1.4;color:var(--txt-2)}
.tm-wia-link{display:inline-block;margin-top:10px;font-weight:600;color:var(--loc);text-decoration:none}
.tm-wia-link:hover,.tm-wia-link:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-wia-brak{padding:14px 16px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg);font-size:14px;line-height:1.55}
.tm-wia-miniona{opacity:.5}
.tm-wia-teraz{margin-left:6px;padding:1px 6px;border-radius:4px;background:var(--loc-bg);font:600 10.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--loc)}
.tm-wia-km{white-space:nowrap}

/* --- mapa i legenda (_mapa.tpl) --- */
.tm-wia-mapa-sec{scroll-margin-top:86px}
.tm-wia-mapa{height:420px;border-radius:8px;background:var(--loc-bg)}
.tm-wia-mapa-legenda{display:flex;flex-wrap:wrap;gap:6px 16px;margin:12px 0 0;padding:0;list-style:none;font-size:12.5px;color:var(--txt-2)}
.tm-wia-mapa-legenda-item{display:flex;align-items:center;gap:6px}
.tm-wia-mapa-kolor{display:inline-block;width:10px;height:10px;border-radius:50%}
.tm-wia-pop{font-size:13px;line-height:1.4}
.tm-wia-popn{display:block;font-weight:700;color:var(--txt);text-decoration:none}
.tm-wia-popa{display:block;margin-top:2px;color:var(--txt-2)}
.tm-wia-pops{display:block;margin-top:2px;font-weight:600;color:var(--loc)}
.tm-wia-popl{display:inline-block;margin-top:6px;font-weight:600;color:var(--loc);text-decoration:underline;text-underline-offset:2px}

/* --- karty kościołów (_karta.tpl, dział wg grupy wyznania) --- */
.tm-wia-karty{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.tm-wia-karta{padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:#fff}
.tm-wia-karta-nazwa{display:block;margin:0 0 4px;font-weight:700;font-size:15px;color:var(--txt);text-decoration:none}
.tm-wia-karta-nazwa:hover,.tm-wia-karta-nazwa:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-wia-karta-grupa{margin:0 0 4px;font-size:12px;color:var(--txt-2)}
.tm-wia-karta-miejscowosc{color:var(--txt-2);font-weight:400}
.tm-wia-karta-adres{margin:0 0 4px;font-size:13px;line-height:1.4;color:var(--txt-2)}
.tm-wia-karta-msza{margin:0 0 2px;font-size:13px;font-weight:600;color:var(--txt)}
.tm-wia-karta-tel{margin:0;font-weight:600;color:var(--loc);white-space:nowrap}
.tm-wia-karta-www{margin:0;color:var(--txt-2);text-decoration:underline}
.tm-wia-karta-budynek{margin:4px 0 0;font-size:11.5px;color:var(--txt-2)}

/* --- rozkład: zakładki i tabele (msze.tpl) --- */
.tm-wia-lokalizacja{display:inline-flex;align-items:center;gap:6px;margin:0 0 16px;padding:9px 16px;border:1px solid var(--loc);border-radius:6px;background:#fff;font-weight:600;color:var(--loc);text-decoration:none;cursor:pointer}
.tm-wia-lokalizacja:hover,.tm-wia-lokalizacja:focus-visible{background:var(--loc-bg)}
.tm-wia-lokalizacja[aria-busy="true"]{opacity:.6;pointer-events:none}
.tm-wia-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;border-bottom:1px solid var(--line)}
.tm-wia-tab{padding:9px 14px;border:0;border-bottom:3px solid transparent;background:none;font:600 13.5px var(--f-lab);color:var(--txt-2);cursor:pointer}
.tm-wia-tab[aria-selected="true"]{border-bottom-color:var(--loc);color:var(--txt)}
.tm-wia-panel{margin:0 0 30px}
.tm-wia-okresowo{margin:16px 0 0}
.tm-wia-tbl{width:100%;margin:0;border-collapse:collapse;font-size:13.5px}
/* POPRAWKA po próbie generalnej 2026-09-17: msze.tpl dokłada modyfikatory tm-wia-tbl-niedziela/
   -powszednie do dwóch tabel z rzędu - bez odstępu między nimi druga tabela sklejałaby się z
   pierwszą (WiaraCssTest::testKazdaKlasaMaRegule() wymaga też literalnego selektora obu klas). */
.tm-wia-tbl-niedziela,.tm-wia-tbl-powszednie{margin:0 0 20px}
.tm-wia-tbl th{padding:8px 10px;border-bottom:2px solid var(--dark);text-align:left;font:600 11px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-wia-td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top;min-width:0}
.tm-wia-tr:last-child .tm-wia-td{border-bottom:0}
.tm-wia-sezon{color:var(--txt-2)}
.tm-wia-brakrozkladu{margin:24px 0}
.tm-wia-brakrozkladu ul{margin:0;padding-left:20px;font-size:13.5px;line-height:1.6;color:var(--txt-2)}
.tm-wia-stopka{margin:24px 0 0;font-size:12px;color:var(--txt-2)}

/* --- podstrona miejsca (miejsce.tpl, _godziny.tpl) --- */
.tm-wia-figure{margin:0 0 18px}
.tm-wia-figure img{display:block;width:100%;height:auto;border-radius:8px}
.tm-wia-figcaption{margin-top:6px;font-size:11.5px;line-height:1.4;color:var(--txt-2)}
.tm-wia-adres-sec{scroll-margin-top:86px}
.tm-wia-adres{margin:0 0 6px;font-size:14px;line-height:1.5}
.tm-wia-dojazd{display:inline-block;margin:4px 0 14px;font-size:13px;font-weight:600;color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-wia-kontakt ul{margin:0;padding:0;list-style:none;font-size:14px;line-height:1.7}
.tm-wia-godziny-brak{color:var(--txt-2)}
.tm-wia-godziny-tekst{white-space:pre-line}
.tm-wia-godziny-niedziela,.tm-wia-godziny-powszednie,.tm-wia-godziny-okresowo{margin:0 0 16px}
.tm-wia-godziny-niedziela ul,.tm-wia-godziny-powszednie ul,.tm-wia-godziny-okresowo ul{margin:0;padding:0;list-style:none;font-size:13.5px;line-height:1.6}
.tm-wia-godziny-stan{margin:6px 0 0;font-size:12px;color:var(--txt-2)}
.tm-wia-opis{margin:0 0 20px}
.tm-wia-opis p{font-size:14px;line-height:1.6}
.tm-wia-zglos{display:inline-block;margin:0 0 20px;font-weight:600;color:var(--loc);text-decoration:none}
.tm-wia-zglos:hover,.tm-wia-zglos:focus-visible{text-decoration:underline;text-underline-offset:2px}

/* --- panel parafii na froncie (idea #482): plakietki Mszy, dwie tabele rozkładu wakacyjnego, znak
   potwierdzenia przez parafię, sekcje Spowiedź / Nabożeństwa / Kancelaria i link do panelu
   (_godziny.tpl, _sekcjeParafii.tpl, _mszeDzis.tpl, msze.tpl, miejsce.tpl). Plakietka nie łamie się
   w środku (bez zawijania), ale nie ucina tekstu - nazwy z polskimi znakami zostają całe. --- */
.tm-wia-plak{display:inline-block;margin-left:4px;padding:0 6px;border-radius:4px;background:var(--loc-bg);font:600 11px/1.6 var(--f-lab);letter-spacing:.02em;color:var(--loc);white-space:nowrap;vertical-align:baseline}
.tm-wia-potw{display:inline-flex;align-items:center;gap:6px;margin:0 0 12px;padding:6px 12px;border-radius:6px;background:#eaf5ef;font-size:13.5px;font-weight:600;color:#1c6b43}
.tm-wia-tabela{margin:0 0 18px}
.tm-wia-tabela-teraz{padding-left:12px;border-left:3px solid var(--loc)}
.tm-wia-okres-h{margin:0 0 10px;font:700 16px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-wia-godziny-swieta{margin:0 0 16px}
.tm-wia-godziny-swieta ul{margin:0;padding:0;list-style:none;font-size:13.5px;line-height:1.6}
.tm-wia-spowiedz,.tm-wia-nabozenstwa,.tm-wia-kancelaria{scroll-margin-top:86px}
.tm-wia-przedzialy,.tm-wia-nab-lista{margin:0;padding:0;list-style:none;font-size:13.5px;line-height:1.6}
.tm-wia-dni{font-weight:600;color:var(--txt)}
.tm-wia-sek-uwaga{margin:6px 0 0;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-wia-nab{padding:4px 0}
.tm-wia-nab-teraz{margin:2px 0;padding:4px 8px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg)}
.tm-wia-nab-n{font-weight:600;color:var(--txt)}
.tm-wia-nab-t{color:var(--txt)}
.tm-wia-nab-o{font-size:12.5px;color:var(--txt-2)}
.tm-wia-parafia{margin:-8px 0 20px;font-size:13.5px}
.tm-wia-parafia a{font-weight:600;color:var(--loc);text-decoration:underline;text-underline-offset:2px}

/* --- sekcja „O kościele” podstrony kościoła (_oKosciele.tpl, idea #480): ramka zabytku z linkiem do
   działu Zabytki, fakty z Wikidata i rejestru NID jako lista opisowa (na telefonie jedna kolumna),
   wstęp z pl.wikipedii z podpisem licencji jak wstęp w Zabytkach i dopiski źródeł. --- */
.tm-wia-okosc{scroll-margin-top:86px}
.tm-wia-okosc-zab{margin:0 0 14px;padding:10px 14px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg)}
.tm-wia-okosc-zabt{margin:0 0 4px;font-size:14px;font-weight:600;color:var(--txt)}
.tm-wia-okosc-zabl{font-size:13.5px;font-weight:600;color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-wia-okosc-zabl:hover,.tm-wia-okosc-zabl:focus-visible{text-decoration:none}
.tm-wia-okosc-fakty{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 16px;margin:0 0 14px;font-size:14px;line-height:1.5}
.tm-wia-okosc-fakty dt{font-weight:600;color:var(--txt-2)}
.tm-wia-okosc-fakty dd{margin:0;color:var(--txt)}
.tm-wia-okosc-wstep{padding-left:14px;border-left:3px solid var(--line)}
.tm-wia-okosc-tekst{margin:0 0 6px;font-size:14px;line-height:1.6}
.tm-wia-okosc-wiecej{margin:0;font-size:13px}
.tm-wia-okosc-wiecej a{color:var(--loc)}
.tm-wia-okosc-licencja{margin:6px 0 0;font-size:11.5px;line-height:1.4;color:var(--txt-2)}
.tm-wia-zrodlo-dop{margin:4px 0 0;font-size:12.5px;color:var(--txt-2)}

/* --- artykuły i FAQ (_artykuly.tpl, NT3wiaraArt.tpl) --- */
.tm-wia-art-sec{scroll-margin-top:86px}
.tm-wia-art-wiecej{font-weight:600;color:var(--loc);text-decoration:none}
.tm-wia-art-wiecej:hover,.tm-wia-art-wiecej:focus-visible{text-decoration:underline;text-underline-offset:2px}
/* POPRAWKA po próbie generalnej 2026-09-17: sekcja FAQ w miasto.tpl ma class="tm-wia-sec tm-wia-faq"
   bez własnej reguły - literał selektora wymagany przez WiaraCssTest, treść dziedziczy z .tm-wia-sec. */
.tm-wia-faq{margin:0}
.tm-wia-faq-item{margin:0 0 8px;padding:4px 0;border-bottom:1px solid var(--line)}
.tm-wia-faq-item summary{padding:8px 2px;cursor:pointer;list-style:none;font-weight:600;font-size:14.5px;color:var(--txt)}
.tm-wia-faq-item summary::-webkit-details-marker{display:none}
.tm-wia-art{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.tm-wia-art-a{display:block;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;text-decoration:none}
.tm-wia-art-tytul{display:block;margin:0 0 4px;font-weight:600;font-size:13.5px;line-height:1.35;color:var(--txt)}
.tm-wia-art-a:hover .tm-wia-art-tytul,.tm-wia-art-a:focus-visible .tm-wia-art-tytul{color:var(--loc)}
.tm-wia-art-data{display:inline-block;font-size:11.5px;color:var(--txt-2)}
.tm-wia-art-miasto{display:inline-block;margin-left:6px;font-size:11.5px;color:var(--txt-2)}

/* --- źródło danych --- */
.tm-wia-zrodlo{margin-bottom:10px}

/* --- formularz zgłoszenia (zglos.tpl, Task 17) --- */
.tm-wia-zglos-strona{max-width:600px}
.tm-wia-form{margin:0}
.tm-wia-flash{margin:0 0 16px;padding:12px 14px;border-left:3px solid #1c6b43;border-radius:0 6px 6px 0;background:#eaf5ef;font-size:14px}
.tm-wia-flash-err{border-left-color:var(--loc);background:var(--loc-bg)}
.tm-wia-pole{margin:0 0 16px}
.tm-wia-pole label,.tm-wia-pole legend{display:block;margin-bottom:5px;font:600 13px var(--f-lab);color:var(--txt-2)}
.tm-wia-pole input[type="text"],.tm-wia-pole input[type="email"],.tm-wia-pole textarea{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:6px;font:15px var(--f-ui);color:var(--txt)}
.tm-wia-radio{display:inline-flex;align-items:center;gap:6px;margin:0 12px 6px 0;font-size:14px;font-weight:400}
.tm-wia-note{margin:8px 0 0;font-size:12.5px;color:var(--txt-2)}
.tm-wia-pole-btn{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center}
.tm-wia-pole-btn .tm-wia-btn{margin-top:0;border:0;font:15px var(--f-ui)}
.tm-wia-pole-btn .tm-wia-btn[type="submit"]{cursor:pointer}
.tm-wia-pole-btn .tm-wia-btn:disabled{background:var(--line);color:var(--txt-2);cursor:not-allowed}

/* --- portal ogólnopolski (polska.tpl) --- */
.tm-wia-polska-sumy{margin-bottom:24px}
.tm-wia-polska-grupa{margin:0 0 4px;font-size:13.5px;line-height:1.6}
.tm-wia-woj{scroll-margin-top:86px}
.tm-wia-woj-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 18px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-wia-miasta{margin:0;padding:0;list-style:none;columns:3 210px;column-gap:24px;font-size:13.5px;line-height:1.7}
/* POPRAWKA po próbie generalnej 2026-09-17: <li class="tm-wia-miasto"> (wrapper linku+liczby w
   liście miast wielokolumnowej) nie miał własnej reguły - break-inside:avoid pilnuje, żeby wiersz
   miasta nie łamał się na dwie kolumny w układzie CSS columns. */
.tm-wia-miasto{break-inside:avoid;padding:3px 0}
.tm-wia-miasto-link{color:var(--loc);font-weight:600;text-decoration:none}
.tm-wia-miasto-link:hover,.tm-wia-miasto-link:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-wia-miasto-liczba{font-size:12px;color:var(--txt-2)}
.tm-wia-przygotowaniu{font-size:12px;color:var(--txt-2)}

/* --- kafel "Msze dziś" w pasie lokalnym strony głównej (NT3wiaraPas.tpl, Zadanie 19) --- */
.tm-wia-pas{margin:18px 0 0;padding:14px 16px;border:1px solid var(--line);border-left:3px solid var(--ac,var(--loc));border-radius:8px;background:#fff}
.tm-wia-pas-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:0 0 8px}
.tm-wia-pas-t{margin:0;font:600 15px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--dark);text-decoration:none}
.tm-wia-pas-t:hover,.tm-wia-pas-t:focus-visible{color:var(--ac-dark,var(--loc))}
.tm-wia-pas-l{margin:0;padding:0;list-style:none}
.tm-wia-pas-i{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 8px;padding:6px 0;border-top:1px dashed var(--line);font-size:13.5px}
.tm-wia-pas-i:first-child{border-top:0}
.tm-wia-pas-g{min-width:44px;font-weight:700;color:var(--dark);font-variant-numeric:tabular-nums}
.tm-wia-pas-n{display:inline-block;max-width:100%;white-space:normal;line-height:1.4;color:var(--txt);text-decoration:none}
.tm-wia-pas-n:hover,.tm-wia-pas-n:focus-visible{color:var(--ac-dark,var(--loc));text-decoration:underline;text-underline-offset:2px}
.tm-wia-pas-jutro{margin-top:8px;font-size:12px;color:var(--txt-2)}
.tm-wia-pas-wiecej{display:inline-block;margin-top:8px;font-weight:600;color:var(--ac-dark,var(--loc));text-decoration:none}
.tm-wia-pas-wiecej:hover,.tm-wia-pas-wiecej:focus-visible{text-decoration:underline;text-underline-offset:2px}

/* --- responsywność: karty, tabele jako karty <= 700 px, kafel < 881 px --- */
@media(max-width:880px){.tm-wia-body .tm-side{margin-top:18px}.tm-wia-karty{grid-template-columns:minmax(0,1fr)}.tm-wia-art{grid-template-columns:minmax(0,1fr)}.tm-wia-miasta{columns:2 150px}}
@media(max-width:700px){
 .tm-wia-mapa{height:320px}
 .tm-wia-tbl thead{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);white-space:nowrap}
 .tm-wia-tbl,.tm-wia-tbl tbody,.tm-wia-tbl tr,.tm-wia-tbl td{display:block;width:100%}
 .tm-wia-tr{margin:0 0 12px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}
 .tm-wia-tr:last-child .tm-wia-td{border-bottom:0}
 .tm-wia-td{width:auto;padding:3px 0;border:0}
 .tm-wia-td::before{content:attr(data-l) ": ";font-weight:600;color:var(--txt-2)}
 .tm-wia-miasta{columns:auto}
}
@media(max-width:600px){
 .tm-wia-lead{font-size:14px}
 .tm-wia-h2{font-size:17px}
 .tm-wia-grupa-h2{font-size:17px}
 .tm-wia-woj-h2{font-size:17px}
 .tm-wia-pas{padding:12px 13px}
 .tm-wia-lokalizacja{width:100%;justify-content:center}
 .tm-wia-okosc-fakty{grid-template-columns:minmax(0,1fr);gap:0}
 .tm-wia-okosc-fakty dd{margin:0 0 8px}
}
/* --- koniec sekcji wiara (Zadanie 18) --- */

/* =====================================================================================
   MODUŁ ZABYTKI (idea #370, 2026-09-23)
   Dział /zabytki/ (zabytki i atrakcje w mieście) - smarty/templates/ext/zabytki/*.tpl,
   moduł ext/zabytki.php. Dział nie ma wiersza w tabeli `strony`, więc układ (.tm-in,
   .tm-cols, .tm-side) rysuje sam - tutaj jest tylko to, czego motyw nie ma.
   Akcent działu: --loc (granat modułów miejskich, jak /wiara, /apteki, /kolejki-nfz,
   /polityka). Drobne teksty w --txt-2 (AA na bieli), nigdy w --txt-3.
   Opis redakcji i wstęp z Wikipedii (.tm-zab-opis p) mają white-space:pre-line zamiast
   dzielenia na akapity w szablonie (tekst bez HTML z panelu, akapity oddzielone pustą
   linią) - bez |trim ani funkcji PHP w szablonie (bug#337).
   Bez ucinania nadmiaru pudełka i bez wysokości linii w pikselach przy tekstach z
   polskimi znakami - obie rzeczy ścinają kreski nad Ś/Ź i ogonki (notatka o ellipsis w
   theme/3); nazwa obiektu w kaflu jest skracana w PHP (ZabytkiWidok/ZabytkiKategorie -
   patrz Task 10/12), nie w CSS.
   Karty (.tm-zab-karty) 2 kolumny >= 881 px, 1 kolumna poniżej (jak Wiara/Szkoły).
   Wiersze (.tm-zab-wiersze, kategoria.tpl) świadomie BEZ karty na telefonie - to zwarta
   lista tysięcy pozycji (Warszawa), a nie tabela jak w Kolejkach NFZ.
   Test ZabytkiCssTest pilnuje, że każda klasa .tm-zab-* użyta w szablonach ma tu regułę
   (także trzy modyfikatory .tm-zab-znaczek-* składane w szablonie z wartości $z - patrz
   stała KLASY_ZNACZKI w tym teście) i że w sekcji nie ma zakazanych deklaracji.
   ===================================================================================== */
.tm-zab-body{padding-top:14px}
.tm-zab-body .tm-bc{margin-bottom:12px}
.tm-zab-bcs{margin:0 2px;color:var(--txt-3)}
.tm-zab-head .tm-h1k{margin-left:0}
.tm-zab-lead{margin:-6px 0 16px;max-width:760px;font-size:15px;line-height:1.55;color:var(--txt-2)}
.tm-zab-liczby{margin:0 0 18px;font-size:13.5px;color:var(--txt-2)}
.tm-zab-sec{margin:0 0 30px;scroll-margin-top:86px}
.tm-zab-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-zab-btn{display:inline-block;margin-top:6px;padding:9px 16px;border-radius:6px;background:var(--loc);font-weight:600;color:#fff;text-decoration:none}
.tm-zab-btn:hover,.tm-zab-btn:focus-visible{background:var(--dark);color:#fff}
.tm-zab-btn-l{background:none;padding:9px 10px;color:var(--loc);margin-right:8px}
.tm-zab-btn-l:hover,.tm-zab-btn-l:focus-visible{background:var(--loc-bg);color:var(--loc)}
.tm-zab-blad{margin:0 0 24px}
.tm-zab-pusto{padding:14px 16px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg)}
.tm-zab-pusto .tm-zab-lead{margin-top:0}
.tm-zab-usuniety{margin:0 0 24px}

/* --- kotwice kategorii (nawigacja pod nagłówkiem, miasto.tpl) --- */
.tm-zab-kotwice{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.tm-zab-kotwica{padding:6px 12px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;font-weight:600;color:var(--txt-2);text-decoration:none}
.tm-zab-kotwica:hover,.tm-zab-kotwica:focus-visible{border-color:var(--loc);color:var(--loc)}

/* --- mapa działu (_mapa.tpl) i mała mapa obiektu (obiekt.tpl) --- */
.tm-zab-mapa-sec{scroll-margin-top:86px}
.tm-zab-mapa{height:420px;border-radius:8px;background:var(--loc-bg)}
.tm-zab-mapa-obiekt-sec{scroll-margin-top:86px}
.tm-zab-mapa-obiekt{height:260px;border-radius:8px;background:var(--loc-bg)}
.tm-zab-mapa-przyblizone{margin:8px 0 0;font-size:12px;color:var(--txt-2)}
.tm-zab-mapa-legenda{display:flex;flex-wrap:wrap;gap:6px 16px;margin:12px 0 0;padding:0;list-style:none;font-size:12.5px;color:var(--txt-2)}
.tm-zab-mapa-legenda-item{display:flex;align-items:center;gap:6px}
.tm-zab-mapa-kolor{display:inline-block;width:10px;height:10px;border-radius:50%}
.tm-zab-mapa-kolor-zabytek{background:#b91c1c}
.tm-zab-mapa-kolor-atrakcja{background:#1d4ed8}
.tm-zab-mapa-kolor-okolica{background:#8a93a0}

/* --- karty obiektów (_karta.tpl, sekcje kategorii i okolicy) --- */
.tm-zab-kategoria{}
.tm-zab-okolica{}
.tm-zab-karty{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 0 12px;padding:0;list-style:none}
.tm-zab-karta{display:flex;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:#fff}
.tm-zab-karta-fot{flex:0 0 96px;display:block}
.tm-zab-karta-fot img{display:block;width:96px;height:64px;border-radius:6px;object-fit:cover}
.tm-zab-karta-tresc{min-width:0}
.tm-zab-karta-nazwa{display:block;margin:0 0 4px;font-weight:700;font-size:15px;color:var(--txt);text-decoration:none}
.tm-zab-karta-nazwa:hover,.tm-zab-karta-nazwa:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-zab-karta-datowanie{margin:0 0 4px;font-size:12px;color:var(--txt-2)}
.tm-zab-karta-adres{margin:0 0 4px;font-size:13px;line-height:1.4;color:var(--txt-2)}
.tm-zab-karta-dystans{margin:0 0 4px;font-size:12.5px;font-weight:600;color:var(--loc)}
.tm-zab-wszystkie{display:inline-block;margin-top:4px;font-weight:600;color:var(--loc);text-decoration:none}
.tm-zab-wszystkie:hover,.tm-zab-wszystkie:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-zab-okolica-reszta{margin:8px 0 0;font-size:12.5px;color:var(--txt-2)}

/* --- znaczki karty (zdjęcie/opis/muzeum) --- */
.tm-zab-znaczki{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0 0;padding:0;list-style:none}
.tm-zab-znaczek{padding:2px 7px;border-radius:4px;background:var(--loc-bg);font:600 10.5px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--loc)}
.tm-zab-znaczek-zdjecie{background:var(--loc-bg);color:var(--loc)}
.tm-zab-znaczek-opis{background:var(--loc-bg);color:var(--loc)}
.tm-zab-znaczek-muzeum{background:#eef2ff;color:#3730a3}

/* --- zespół obiektów (_zespol.tpl, <details> bez JS) --- */
.tm-zab-zespol{margin:8px 0 0}
.tm-zab-zespol summary{cursor:pointer;font-size:12.5px;font-weight:600;color:var(--loc)}
.tm-zab-zespol-l{margin:6px 0 0;padding-left:18px;font-size:13px;line-height:1.6}

/* --- lista kategorii: zwarte wiersze bez obrazków (kategoria.tpl, Warszawa - tysiące pozycji) --- */
.tm-zab-wiersze{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.tm-zab-wiersz{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.tm-zab-wiersz-nazwa{font-weight:600;color:var(--txt);text-decoration:none}
.tm-zab-wiersz-nazwa:hover,.tm-zab-wiersz-nazwa:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-zab-wiersz-chronologia{font-size:12px;color:var(--txt-2)}
.tm-zab-wiersz-adres{font-size:12px;color:var(--txt-2)}

/* --- podstrona obiektu: zdjęcia, opis, wstęp, karta informacyjna --- */
.tm-zab-figure{margin:0 0 18px}
.tm-zab-figure-a{display:block}
.tm-zab-figure img{display:block;width:100%;height:auto;border-radius:8px}
.tm-zab-figcaption{margin-top:6px;font-size:11.5px;line-height:1.4;color:var(--txt-2)}
.tm-zab-opis{margin:0 0 18px}
.tm-zab-opis p{font-size:14px;line-height:1.6;white-space:pre-line}
.tm-zab-opis-redakcja{}
.tm-zab-wstep{border-left:3px solid var(--loc);padding-left:14px}
.tm-zab-wstep-link{font-size:13px}
.tm-zab-wstep-podpis{margin:6px 0 0;font-size:11.5px;line-height:1.4;color:var(--txt-2)}
.tm-zab-karta-info{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:0 0 20px;font-size:13.5px;line-height:1.6}
.tm-zab-karta-info dt{font-weight:600;color:var(--txt-2)}
.tm-zab-karta-info dd{margin:0;color:var(--txt)}
.tm-zab-grupa{margin:0 0 6px;font-size:13.5px;color:var(--txt-2)}
.tm-zab-grupa-l{margin:0 0 20px;padding-left:18px;font-size:13.5px;line-height:1.6}
.tm-zab-poblizu{scroll-margin-top:86px}
.tm-zab-poblizu-l{margin:0;padding:0;list-style:none;font-size:13.5px;line-height:1.8}
.tm-zab-poblizu-dystans{color:var(--txt-2);font-size:12px}
.tm-zab-linki{margin:0 0 12px}
.tm-zab-zglos{display:inline-block;margin:0 0 20px;font-weight:600;color:var(--loc);text-decoration:none}
.tm-zab-zglos:hover,.tm-zab-zglos:focus-visible{text-decoration:underline;text-underline-offset:2px}

/* --- blok „Ten kościół w dziale Wiara” (_wiara.tpl, idea #480) --- */
.tm-zab-wiara{padding:14px 16px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg)}
.tm-zab-wiara .tm-zab-h2{margin-bottom:10px}
.tm-zab-wiara-dzien{margin:0 0 4px;font-size:12px;color:var(--txt-2)}
.tm-zab-wiara-msze{margin:0 0 10px;font-size:14px;line-height:1.55;color:var(--txt)}
.tm-zab-wiara-plak{padding:1px 6px;border:1px solid var(--loc-line);border-radius:4px;background:var(--bg);font:600 10.5px/1.4 var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--loc)}
.tm-zab-wiara-link{margin:0}
.tm-zab-wiara-a{font-weight:600;color:var(--loc);text-decoration:none}
.tm-zab-wiara-a:hover,.tm-zab-wiara-a:focus-visible{text-decoration:underline;text-underline-offset:2px}

/* --- źródła i licencje (_zrodla.tpl) --- */
.tm-zab-zrodlo{margin:0 0 10px;font-size:12px;line-height:1.5;color:var(--txt-2)}

/* --- portal ogólnopolski (polska.tpl) --- */
.tm-zab-polska-sumy{margin-bottom:24px;font-size:13.5px;color:var(--txt-2)}
.tm-zab-woj{scroll-margin-top:86px}
.tm-zab-woj-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 18px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-zab-miasta{margin:0;padding:0;list-style:none;columns:3 210px;column-gap:24px;font-size:13.5px;line-height:1.7}
.tm-zab-miasto{break-inside:avoid;padding:3px 0}
.tm-zab-miasto-link{color:var(--loc);font-weight:600;text-decoration:none}
.tm-zab-miasto-link:hover,.tm-zab-miasto-link:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-zab-miasto-liczba{font-size:12px;color:var(--txt-2)}
.tm-zab-przygotowaniu{font-size:12px;color:var(--txt-2)}

/* --- formularz zgłoszeń (zglos.tpl, Task 21) --- */
.tm-zab-zglos-strona{max-width:640px}
.tm-zab-flash{margin:0 0 16px;padding:12px 14px;border-radius:8px;font-size:13.5px;line-height:1.5;background:var(--band);border:1px solid var(--loc)}
.tm-zab-flash-err{border-color:#c0392b;background:rgba(192,57,43,.08)}
.tm-zab-form{display:block}
.tm-zab-pole{margin:0 0 16px}
.tm-zab-pole label{display:block;margin:0 0 5px;font-size:13px;font-weight:600;color:var(--txt-2)}
.tm-zab-pole input[type=text],.tm-zab-pole input[type=email],.tm-zab-pole input[type=file],.tm-zab-pole textarea{width:100%;box-sizing:border-box;padding:9px 10px;font:14px/1.4 var(--f-ui);border:1px solid var(--line);border-radius:6px;background:var(--bg)}
.tm-zab-pole textarea{resize:vertical}
.tm-zab-radio{display:block;margin:0 0 6px;font-size:13.5px}
.tm-zab-check{display:block;font-size:12.5px;line-height:1.5;color:var(--txt-2)}
.tm-zab-sekcja{margin:0 0 16px}
.tm-zab-pole-btn{display:flex;align-items:center;gap:14px;margin-top:22px}
.tm-zab-note{margin:0 0 14px;font-size:11.5px;line-height:1.4;color:var(--txt-2)}

/* --- responsywność: karty, wiersze i mapa <= 880/700/600 px --- */
@media(max-width:880px){.tm-zab-body .tm-side{margin-top:18px}.tm-zab-karty{grid-template-columns:minmax(0,1fr)}.tm-zab-miasta{columns:2 150px}}
@media(max-width:700px){
 .tm-zab-mapa{height:320px}
 .tm-zab-karta-fot{display:none}
 .tm-zab-miasta{columns:auto}
}
@media(max-width:600px){
 .tm-zab-lead{font-size:14px}
 .tm-zab-h2{font-size:17px}
 .tm-zab-woj-h2{font-size:17px}
}
/* --- koniec sekcji zabytki (Zadanie 14) --- */

/* =====================================================================================
   KALENDARZ WYDARZEŃ /kalendarz (ext/kalendarz/*.tpl) - lista dni z zakładkami okresów, filtrami
   rodzaju i ceny, mini-kalendarzem i sekcją "W okolicy"; na portalu polska przegląd weekendu wg
   województw. Projektowany najpierw pod telefon: zakładki i filtry przewijają się w poziomie,
   mini-kalendarz na telefonie jest zwinięty pod zakładkami, na komputerze stoi w pasku bocznym.
   Akcent sekcji Kultura (--kal kreski i tła, --kal-d tekst i aktywne przyciski, 5,06:1 z bielą).
   Tytuły wydarzeń zawijają się zamiast wielokropka (wielokropek ścina kreski nad Ś i Ź).
   Korzeń strony to .tm-kalpg, nie .tm-kal - goła .tm-kal to boks TOP 5 w sekcji Kultura indexPolska.tpl.
   Plakaty z importu to kwadraty 280x280 z białymi pasami (62% poziomych, 28% pionowych): kafel 140 px
   (ostry przy gęstości 2x) z mix-blend-mode multiply zamienia białe pasy w tło kafla, więc każdy plakat
   ma ten sam kształt. Wydarzenie z innego miasta ma znacznik z pinezką w kolorze lokalnym (--loc).
   Bieg z Zapisów ma pigułkę stanu w kolorach modułu Zapisy (.tm-zap-sOn/.tm-zap-sFull) i przycisk
   w ciemniejszym kolorze marki; mecz ma w kaflu herby obu drużyn (PNG z przezroczystością,
   bez blend) i wynik w ciemnej plakietce.
   ===================================================================================== */
.tm-kalpg{--kal:#c78a1e;--kal-d:#936616;padding-top:14px}
/* korzeń ma własne .tm-in, a szablon puste.tpl owija treść w drugie - bez tego podwójny margines boczny */
.tm-in>.tm-kalpg{padding-left:0;padding-right:0}
.tm-kalpg .tm-bc{margin-bottom:12px}
.tm-kal-bcs{margin:0 2px;color:var(--txt-3)}
.tm-kal-head .tm-h1k{margin-left:0}
.tm-kal-lead{margin:-6px 0 14px;font-size:15px;line-height:1.5;color:var(--txt-2)}
/* boks „Organizujesz wydarzenie?” w pasku bocznym (pomysł #443) - globalne a{color:inherit}, więc kolory jawnie */
.tm-kal-dodaj{position:relative;margin:0 0 18px;padding:16px 16px 14px;border:1px solid var(--line);border-top:3px solid var(--kal);border-radius:10px;background:linear-gradient(180deg,#fdf6e9 0,#fff 70%)}
.tm-kal-dodaj-i{display:block;margin:0 0 8px;color:var(--kal-d)}
.tm-kal-dodaj-h{margin:0 0 6px;font:700 17px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-kal-dodaj-p{margin:0 0 14px;font-size:14px;line-height:1.5;color:var(--txt-2)}
.tm-kal-dodaj-a{display:block;padding:10px 14px;border-radius:8px;background:var(--brand);color:#fff;font:700 15px/1.3 var(--f-ui);text-align:center;text-decoration:none}
.tm-kal-dodaj-a:hover,.tm-kal-dodaj-a:focus-visible{background:var(--brand-h);color:#fff}
.tm-kal-dodaj-m{display:block;margin:10px 0 0;font-size:13.5px;text-align:center;color:var(--txt-2);text-decoration:underline;text-underline-offset:2px}
.tm-kal-dodaj-m:hover,.tm-kal-dodaj-m:focus-visible{color:var(--brand-h)}
.tm-kal-dodaj a:focus-visible{outline:2px solid var(--brand);outline-offset:2px}

/* --- zakładki okresów i przyciski filtrów --- */
.tm-kal-zak{display:flex;gap:2px;margin:0 0 12px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.tm-kal-zak::-webkit-scrollbar{display:none}
.tm-kal-zak a{flex:none;padding:9px 13px 8px;border-bottom:3px solid transparent;font:600 15px var(--f-lab);color:var(--txt-2);text-decoration:none;white-space:nowrap}
.tm-kal-zak a:hover,.tm-kal-zak a:focus-visible{color:var(--txt-h)}
.tm-kal-zak a.tm-kal-akt{border-bottom-color:var(--kal);color:var(--txt-h)}
.tm-kal-filtr{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 12px}
.tm-kal-filtr a{flex:none;display:inline-block;padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 13px var(--f-lab);color:var(--txt-2);text-decoration:none;white-space:nowrap}
.tm-kal-filtr a:hover,.tm-kal-filtr a:focus-visible{border-color:var(--kal);color:var(--kal-d)}
.tm-kal-filtr a.tm-kal-akt{border-color:var(--kal-d);background:var(--kal-d);color:#fff}
.tm-kal-n{font-weight:500;color:var(--txt-3)}
.tm-kal-filtr a.tm-kal-akt .tm-kal-n{color:rgba(255,255,255,.85)}
.tm-kal-filtr-c a{font-size:12.5px}

/* --- dni i pozycje listy --- */
.tm-kal-dzien{margin:0 0 22px}
.tm-kal-dz{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:8px 0 4px;padding:0 0 7px;border-bottom:2px solid var(--kal);font:700 18px/1.3 var(--f-ui);color:var(--txt-h);scroll-margin-top:86px}
.tm-kal-tyg{text-transform:capitalize}
.tm-kal-zn{align-self:center;padding:2px 7px;border-radius:4px;background:var(--brand);font:600 11.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:#fff}
.tm-kal-odb{font:500 13px var(--f-ui);color:var(--txt-3)}
.tm-kal-lista{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));column-gap:24px;margin:0;padding:0;list-style:none}
.tm-kal-poz{display:flex;gap:14px;min-width:0;padding:14px 0;border-bottom:1px solid var(--line)}
.tm-kal-pat .tm-kal-t a{color:var(--brand-h)}
.tm-kal-fot{flex:none;display:block;width:140px;height:140px;border-radius:8px;overflow:hidden;background:var(--band)}
.tm-kal-fot img{display:block;width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply}
.tm-kal-fot0{display:flex;align-items:center;justify-content:center;height:100%;padding:0 10px;background:var(--tint-kultura);font:600 12px var(--f-lab);letter-spacing:.05em;text-transform:uppercase;text-align:center;color:var(--kal-d)}
.tm-kal-b{flex:1;min-width:0}
.tm-kal-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0 0 4px;font:600 11.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--kal-d)}
.tm-kal-patr{color:var(--brand)}
/* znacznik zawija się jak tekst (nie flex): długa nazwa miasta schodzi do drugiej linii, pinezka zostaje
   przy pierwszej, odległość nie rozdziela się na "29" i "km" */
.tm-kal-gdzie{display:inline-block;max-width:100%;padding:3px 10px 3px 8px;border:1px solid var(--loc-line);border-radius:13px;background:var(--loc-bg);font:700 13.5px/1.3 var(--f-ui);letter-spacing:0;text-transform:none;color:var(--loc)}
.tm-kal-gdzie i{margin-right:5px;font-size:12px}
.tm-kal-km{display:inline-block;margin-left:3px;padding-left:7px;border-left:1px solid var(--loc-line);font-weight:500;color:var(--txt-2);white-space:nowrap}
.tm-kal-t{margin:0 0 5px;font:600 15.5px/1.35 var(--f-ui);overflow-wrap:anywhere}
.tm-kal-t a{color:var(--txt-h);text-decoration:none}
.tm-kal-t a:hover,.tm-kal-t a:focus-visible{color:var(--kal-d);text-decoration:underline;text-underline-offset:2px}
.tm-kal-godz{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;margin:0 0 4px;font-size:13px}
.tm-kal-godz a{padding:1px 7px;border:1px solid var(--line);border-radius:4px;font-weight:600;color:var(--txt);text-decoration:none}
.tm-kal-godz a:hover,.tm-kal-godz a:focus-visible{border-color:var(--kal);color:var(--kal-d)}
.tm-kal-dzt{margin-right:2px;font-weight:600;color:var(--txt)}
.tm-kal-do{color:var(--txt-2)}
.tm-kal-m{margin:0 0 3px;font-size:13px;line-height:1.4;color:var(--txt-2)}
.tm-kal-c{margin:0;font-size:13px;font-weight:600;color:var(--txt-h)}
.tm-kal-dzien.tm-kal-bylo .tm-kal-poz{opacity:.72}
/* biegi z Zapisów i mecze z działu Sport */
.tm-kal-herby{display:flex;align-items:center;justify-content:center;gap:8px}
.tm-kal-fot.tm-kal-herby img{width:52px;height:52px;object-fit:contain;mix-blend-mode:normal}
.tm-kal-zst{display:inline-block;padding:2px 9px;border-radius:999px;background:var(--band);font:600 12px/1.4 var(--f-lab);letter-spacing:0;text-transform:none;color:var(--txt-2)}
.tm-kal-zst-on{background:#e6f4ea;color:#1e7b34}
.tm-kal-zst-full{background:#fdecec;color:#b3261e}
.tm-kal-wynik{display:inline-block;padding:1px 9px;border-radius:4px;background:var(--txt-h);font-weight:700;font-variant-numeric:tabular-nums;color:#fff}
.tm-kal-st{font-weight:600;color:var(--txt-2)}
.tm-kal-zap{margin:0 0 3px;font-size:13px;line-height:1.4;color:var(--txt)}
.tm-kal-ctap{margin:7px 0 0}
/* przycisk w --brand-h: biały 13 px na --brand ma 4,58:1 (AA bez zapasu), na --brand-h 6,18:1 */
.tm-kalpg a.tm-kal-cta{display:inline-flex;align-items:center;padding:6px 15px;border-radius:999px;background:var(--brand-h);font:600 13px var(--f-ui);color:#fff;text-decoration:none}
.tm-kalpg a.tm-kal-cta:hover,.tm-kalpg a.tm-kal-cta:focus-visible{background:#8c2d35}

/* --- stany: pusto, kolejna strona, uwaga, sekcje dodatkowe --- */
.tm-kal-pusto{margin:6px 0 24px;padding:16px 18px;border:1px dashed var(--hair);border-radius:8px;background:var(--band);font-size:14.5px;line-height:1.5}
.tm-kal-pusto p{margin:0 0 6px}
.tm-kal-pusto p:last-child{margin:0}
.tm-kal-pusto a{color:var(--kal-d);font-weight:600}
.tm-kal-dalej{margin:4px 0 24px}
.tm-kal-dalej a{display:inline-block;padding:10px 18px;border:1px solid var(--kal);border-radius:6px;font:600 14px var(--f-ui);color:var(--kal-d);text-decoration:none}
.tm-kal-dalej a:hover,.tm-kal-dalej a:focus-visible{background:var(--tint-kultura)}
.tm-kal-sek{margin:30px 0}
.tm-kal-h2{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 0 6px;padding:0 0 7px;border-bottom:2px solid var(--kal);font:700 20px/1.25 var(--f-ui);color:var(--txt-h);scroll-margin-top:86px}
.tm-kal-h2s{font-size:14px;font-weight:400;color:var(--txt-2)}
.tm-kal-okol{padding:16px 20px 14px;border:1px solid var(--loc-line);border-radius:12px;background:var(--loc-bg)}
.tm-kal-okol .tm-kal-h2{border-bottom-color:var(--loc)}
.tm-kal-okol .tm-kal-poz{border-bottom-color:var(--loc-line)}
.tm-kal-okol .tm-kal-gdzie,.tm-kal-okol .tm-kal-fot{background:#fff}
.tm-kal-oklead{margin:0 0 2px;font-size:13.5px;line-height:1.5;color:var(--txt-2)}
.tm-kal-okm{margin:10px 0 0;font-size:13.5px;line-height:1.7;color:var(--txt-2)}
.tm-kal-okm a,.tm-kal-miasta a{color:var(--loc);font-weight:600;text-decoration:none}
.tm-kal-okm a:hover,.tm-kal-miasta a:hover,.tm-kal-okm a:focus-visible,.tm-kal-miasta a:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-kal-okn{color:var(--txt-3);font-size:12.5px}
.tm-kal-uwaga{margin:26px 0 8px;font-size:12.5px;line-height:1.5;color:var(--txt-3)}
.tm-kal-det{border-bottom:1px solid var(--line)}
.tm-kal-det summary{display:flex;align-items:center;gap:8px;padding:11px 2px;cursor:pointer;list-style:none;font:600 15px var(--f-lab);color:var(--txt-h)}
.tm-kal-det summary::-webkit-details-marker{display:none}
.tm-kal-det summary::after{content:"\25BE";margin-left:auto;font-size:12px;color:var(--txt-3)}
.tm-kal-det[open] summary::after{content:"\25B4"}
.tm-kal-miasta{columns:3 170px;column-gap:20px;margin:0 0 12px;padding:0 2px;list-style:none;font-size:13.5px;line-height:1.9}

/* --- mini-kalendarz miesiąca (pasek boczny na komputerze, zwinięty pod zakładkami na telefonie) --- */
.tm-kal-mc{padding:12px;border:1px solid var(--line);border-radius:10px;background:#fff}
.tm-kal-mch{display:flex;align-items:center;justify-content:space-between;margin:0 0 6px}
.tm-kal-mcm{font:700 15px var(--f-ui);color:var(--txt-h);text-decoration:none}
.tm-kal-mcm:hover,.tm-kal-mcm:focus-visible{color:var(--kal-d)}
.tm-kal-mcn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:6px;font-size:22px;color:var(--txt-2);text-decoration:none}
a.tm-kal-mcn:hover,a.tm-kal-mcn:focus-visible{background:var(--band);color:var(--txt-h)}
.tm-kal-mct{width:100%;border-collapse:collapse;table-layout:fixed}
.tm-kal-mct th{padding:4px 0;font:600 11.5px var(--f-lab);color:var(--txt-3);text-align:center}
.tm-kal-mct td{padding:2px;text-align:center}
.tm-kal-mcd{display:flex;align-items:center;justify-content:center;height:36px;border-radius:6px;font-size:13.5px}
a.tm-kal-mcd{background:var(--tint-kultura);font-weight:700;color:var(--txt-h);text-decoration:none}
a.tm-kal-mcd:hover,a.tm-kal-mcd:focus-visible{background:#f3e3c3}
.tm-kal-mc0{color:var(--txt-3)}
.tm-kal-mcd.tm-kal-bylo{opacity:.5}
.tm-kal-mcd.tm-kal-dzis{box-shadow:inset 0 0 0 2px var(--brand)}
.tm-kal-mcd.tm-kal-wyb{background:var(--kal-d);color:#fff}
.tm-kal-mcmob{display:none;margin:0 0 12px}
.tm-kal-mcmob summary{display:inline-block;padding:5px 12px;border:1px solid var(--line);border-radius:999px;cursor:pointer;list-style:none;font:600 13px var(--f-lab);color:var(--txt-2)}
.tm-kal-mcmob summary::-webkit-details-marker{display:none}
.tm-kal-mcmob summary::after{content:" \25BE"}
.tm-kal-mcmob[open] summary::after{content:" \25B4"}
.tm-kal-mcmob .tm-kal-mc{max-width:380px;margin-top:8px}

/* --- Nowe w sprzedaży (pomysł #407): pasek boczny /kalendarz (.tm-nowe-bok) i strona główna miasta
   (.tm-nowe-sg, ext/S/NT3kalendarzNowe.tpl). Tytuł zawija się zamiast wielokropka (kreski nad Ś i Ź),
   liczba terminów i start sprzedaży w kolorze akcentu Kultury (5,06:1 z bielą). --- */
.tm-nowe{--kal:#c78a1e;--kal-d:#936616}
.tm-nowe-bok{margin:0 0 18px;padding:12px 16px 4px;border:1px solid var(--line);border-top:3px solid var(--kal);border-radius:10px}
.tm-nowe-h{margin:0 0 4px;font:700 17px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-nowe-l{margin:0;padding:0;list-style:none}
.tm-nowe-p{display:flex;flex-direction:column;gap:2px;min-width:0;padding:9px 0;border-bottom:1px solid var(--line)}
.tm-nowe-p:last-child{border-bottom:0}
.tm-nowe-t{font:600 15px/1.35 var(--f-ui);color:var(--txt-h);text-decoration:none;overflow-wrap:anywhere}
.tm-nowe-t:hover,.tm-nowe-t:focus-visible{color:var(--kal-d);text-decoration:underline}
.tm-nowe-m{font-size:13.5px;line-height:1.4;color:var(--txt-2);overflow-wrap:anywhere}
.tm-nowe-ile{white-space:nowrap}
.tm-nowe-s{font:600 12.5px/1.4 var(--f-lab);letter-spacing:.02em;text-transform:uppercase;color:var(--kal-d)}
.tm-nowe-s b{color:var(--txt-h)}
.tm-nowe-sg .tm-nowe-l{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 22px}
.tm-nowe-sg .tm-nowe-p,.tm-nowe-sg .tm-nowe-p:last-child{border-bottom:1px solid var(--line)}

/* pasek kalendarza na karcie wydarzenia (wtyczka TMkalendarzBok, tpl/inc/page.tpl) - poza
   korzeniem .tm-kalpg, więc kolory działu tutaj; odstępy daje gap, nie marginesy klocków */
.tm-kalbok{--kal:#c78a1e;--kal-d:#936616;display:flex;flex-direction:column;gap:18px}
.tm-kalbok>*{margin:0}
/* --- responsywność --- */
@media(max-width:880px){
 .tm-kal-mcside{display:none}
 .tm-kal-mcmob{display:block}
 .tm-kalpg .tm-side{margin-top:18px}
 .tm-nowe-sg .tm-nowe-l{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
 .tm-kal-lead{font-size:14px}
 .tm-nowe-sg .tm-nowe-l{grid-template-columns:minmax(0,1fr)}
 .tm-nowe-sg .tm-nowe-p:last-child{border-bottom:0}
 .tm-kal-filtr{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-16px;padding-right:16px}
 .tm-kal-filtr::-webkit-scrollbar{display:none}
 .tm-kal-lista{grid-template-columns:minmax(0,1fr)}
 .tm-kal-poz{gap:12px}
 .tm-kal-fot{width:112px;height:112px}
 .tm-kal-fot.tm-kal-herby img{width:44px;height:44px}
 .tm-kal-okol{margin-left:-16px;margin-right:-16px;padding:14px 16px 12px;border-width:1px 0;border-radius:0}
 .tm-kal-dz{font-size:17px}
 .tm-kal-h2{font-size:18px}
}
/* --- koniec sekcji kalendarz --- */

/* =====================================================================================
   KARTA WYDARZENIA /wydarzenie/{id} (ext/wydarzenie/*.tpl, idea iB, układ D "Afisz z wyborem
   terminu") - afisz: rozmyty plakat w tle (::before, --tm-wyd-tlo ustawiane inline przez szablon),
   przyciemnienie gradientem (::after) pod kontrast białego tekstu >=4,5:1 nawet na jasnych plakatach,
   kartka z datą przypięta do dolnego rogu plakatu, wybór godziny i bilety w jednej linii. Bez plakatu
   (data-rodzaj na .tm-wyd-afisz) tło to gradient marki - kultura (spektakle/koncerty i pokrewne) albo
   sport (sport/biegi/mecze), tak jak sekcje strony głównej. Pod afiszem: pasek "w innych miastach"
   (przewijany w bok) i dwie kolumny (opis + mapa leniwie ładowana przez tmMapa.js/tmWydarzenie.js).
   Na telefonie (<768px) afisz się prostuje, a przy typie "kup" dochodzi pasek zakupu przyklejony do
   dołu, włączany klasą .tm-wyd-pasek--on dopiero, gdy przycisk z afisza zniknie z ekranu (tmWydarzenie.js).
   Karta stoi w .tm-pagecard - każdy link ma własną klasę (reguła .tm-pagecard :is(p,li,dd,td) a:not([class])).
   ===================================================================================== */
.tm-wyd{margin:0}
.tm-wyd-arch{padding:4px 0}

/* --- afisz --- */
.tm-wyd-afisz{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:200px 1fr;gap:32px;padding:30px 32px 34px;border-radius:14px;color:#fff}
/* bez plakatu (brak modyfikatora --foto): gradient marki wg rodzaju - kultura (domyślnie) albo sport */
.tm-wyd-afisz::before{content:"";position:absolute;inset:-40px;z-index:-2;filter:blur(28px) saturate(1.25);background:linear-gradient(135deg,var(--sec-kultura),var(--darker))}
.tm-wyd-afisz[data-rodzaj="sport"]::before,
.tm-wyd-afisz[data-rodzaj="biegi"]::before,
.tm-wyd-afisz[data-rodzaj="mecze"]::before{background:linear-gradient(135deg,var(--sec-sport),var(--darker))}
/* z plakatem: szablon dokłada klasę --foto razem ze zmienną --tm-wyd-tlo (inline, adres plakatu) */
.tm-wyd-afisz--foto::before{background:var(--tm-wyd-tlo) center/cover no-repeat}
/* warstwa .90/.66 - ta sama stopa co --ov na kaflach .tm-oc, zmierzona na najjaśniejszym plakacie */
/* przyciemnienie min. .82 w każdym miejscu: na białym plakacie tło ok. #383a3e - biel 11:1, #aeb5c1 5,6:1, #8fe0b2 7,5:1 (WCAG AA dla etykiet 13 px) */
.tm-wyd-afisz::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(13,15,19,.9) 0%,rgba(13,15,19,.82) 100%)}
.tm-wyd-pw{position:relative;min-width:0}
.tm-wyd-pa{display:block}
.tm-wyd-p{display:block;width:100%;aspect-ratio:566/800;border-radius:10px;object-fit:cover;box-shadow:0 12px 28px rgba(0,0,0,.45)}
.tm-wyd-p0{display:flex;align-items:center;justify-content:center;aspect-ratio:566/800;padding:0 12px;border-radius:10px;background:rgba(255,255,255,.12);box-shadow:0 12px 28px rgba(0,0,0,.35);text-align:center}
.tm-wyd-p0 span{font:600 13px/1.3 var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:#fff}
/* kartka z kalendarza: pełne nazwy (najdłuższe PAŹDZIERNIK i poniedziałek mieszczą się w 120 px), dzień największy */
.tm-wyd-dt{position:absolute;bottom:-14px;left:12px;display:inline-grid;min-width:120px;overflow:hidden;border-radius:10px;background:#fff;color:var(--txt-h);text-align:center;line-height:1.1;box-shadow:0 8px 20px rgba(0,0,0,.4)}
.tm-wyd-dt-m{padding:5px 8px 4px;background:var(--brand);font:700 12.5px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:#fff}
.tm-wyd-dt-d{padding:6px 10px 0;font:700 44px/1 var(--f-lab)}
.tm-wyd-dt-w{padding:3px 10px 8px;font:600 15px var(--f-lab);color:var(--txt-2)}
.tm-wyd-main{min-width:0}
.tm-wyd-eye{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;font:600 13px var(--f-lab);letter-spacing:.08em;text-transform:uppercase}
.tm-wyd-rodz{color:#fff;text-decoration:none}
.tm-wyd-rodz:hover,.tm-wyd-rodz:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-wyd-dot{width:4px;height:4px;border-radius:50%;background:#8b93a1}
.tm-wyd-za{color:#8fe0b2}
.tm-wyd-h1{font:700 clamp(24px,3vw,34px)/1.15 var(--f-lab);margin:6px 0 10px;color:#fff;text-wrap:balance}
.tm-wyd-miejsce{display:flex;gap:8px;align-items:flex-start;margin:0;font-size:15px;color:#d7dbe2}
.tm-wyd-miejsce i{flex:none;margin-top:3px;color:var(--brand-l)}
.tm-wyd-hr{height:1px;margin:18px 0 16px;background:rgba(255,255,255,.18)}

/* --- (2) termin + bilety w jednej linii --- */
.tm-wyd-act{display:grid;grid-template-columns:1fr auto;gap:16px 36px;align-items:end}
.tm-wyd-lab{margin:0 0 9px;font:600 13px var(--f-lab);letter-spacing:.09em;text-transform:uppercase;color:#aeb5c1}
.tm-wyd-lab span{margin-left:6px;font:500 14px var(--f-ui);letter-spacing:0;text-transform:none;color:#fff}
.tm-wyd-terms{display:flex;flex-wrap:wrap;gap:8px}
a.tm-wyd-t{display:inline-flex;align-items:center;justify-content:center;height:44px;min-width:82px;padding:0 15px;border:1.5px solid rgba(255,255,255,.4);border-radius:10px;background:rgba(255,255,255,.07);font:700 18px var(--f-lab);color:#fff;text-decoration:none}
a.tm-wyd-t:hover,a.tm-wyd-t:focus-visible{border-color:#fff}
a.tm-wyd-t[aria-current="true"]{background:#fff;border-color:#fff;color:var(--txt-h)}
.tm-wyd-wiecej{display:inline-block;margin-top:9px;font:600 13px var(--f-ui);color:#e9ebef;text-decoration:underline;text-decoration-color:rgba(255,255,255,.4);text-underline-offset:3px}
.tm-wyd-biletcol{min-width:180px}
.tm-wyd-stan-info,.tm-wyd-wolny{margin:0;max-width:34ch;font:600 15px/1.35 var(--f-ui);color:#fff}
.tm-wyd-stan-info .tm-wyd-a{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.45)}
.tm-wyd-buyrow{display:flex;align-items:center;gap:16px}
.tm-wyd-price{font:700 24px/1 var(--f-lab);color:#fff;white-space:nowrap}
.tm-wyd-price small{display:block;margin-bottom:2px;font:500 12px var(--f-ui);letter-spacing:0;text-transform:none;color:#aeb5c1}
.tm-wyd-price small[hidden]{display:none}
/* --brand-h na tle afisza: biały tekst 16px daje 6,18:1 (marka sama --brand daje tylko 4,58:1) */
a.tm-wyd-kup{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 28px;border-radius:999px;background:var(--brand-h);font:600 16px var(--f-ui);color:#fff;text-decoration:none;box-shadow:0 6px 18px rgba(0,0,0,.35)}
a.tm-wyd-kup:hover,a.tm-wyd-kup:focus-visible{background:#8c2d35}

/* --- (3) akcje dodatkowe --- */
.tm-wyd-foot{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.14);font-size:13.5px}
.tm-wyd-det{position:relative}
.tm-wyd-det summary{display:inline-flex;gap:7px;align-items:center;cursor:pointer;list-style:none;color:#e9ebef;text-decoration:underline;text-decoration-color:rgba(255,255,255,.35);text-underline-offset:3px}
.tm-wyd-det summary::-webkit-details-marker{display:none}
.tm-wyd-det[open] summary{text-decoration:none}
.tm-wyd-det .tm-wyd-link{position:absolute;left:0;top:100%;z-index:3;display:block;min-width:170px;margin-top:8px;padding:9px 14px;border:1px solid var(--line);border-radius:8px;background:#fff;font-weight:600;color:var(--txt);text-decoration:none;box-shadow:0 10px 24px rgba(16,20,28,.22)}
.tm-wyd-det .tm-wyd-link + .tm-wyd-link{top:calc(100% + 42px)}
.tm-wyd-det .tm-wyd-link:hover,.tm-wyd-det .tm-wyd-link:focus-visible{background:var(--band)}
.tm-wyd-udost{display:inline-flex;position:relative;gap:7px;align-items:center;padding:0;border:0;background:none;font:inherit;color:#e9ebef;text-decoration:underline;text-decoration-color:rgba(255,255,255,.35);text-underline-offset:3px;cursor:pointer}
.tm-wyd-kop{position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);padding:4px 10px;border-radius:6px;background:var(--txt-h);font:600 12px var(--f-ui);color:#fff;white-space:nowrap}
.tm-wyd-konkurs{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.tm-wyd-zgl{display:inline-flex;gap:7px;align-items:center;margin-left:auto;color:#c9ced6;text-decoration:underline;text-decoration-color:rgba(255,255,255,.3);text-underline-offset:3px}
.tm-wyd-zgl:hover{color:#fff}

/* --- sekcje pod afiszem: lista terminów i pasek "w innych miastach" --- */
.tm-wyd-sek{margin:28px 0}
.tm-wyd-h2{margin:0 0 12px;font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-wyd-tlist{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;padding:0;list-style:none}
.tm-wyd-titem{font-size:14px}
a.tm-wyd-a{color:var(--brand);text-decoration:underline;text-underline-offset:2px}
a.tm-wyd-a:hover,a.tm-wyd-a:focus-visible{color:var(--brand-h)}
.tm-wyd-miasta{display:flex;gap:10px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:thin}
a.tm-wyd-mchip{flex:none;display:flex;flex-direction:column;gap:2px;min-width:150px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:#fff;text-decoration:none}
a.tm-wyd-mchip:hover,a.tm-wyd-mchip:focus-visible{border-color:var(--brand)}
.tm-wyd-mch-m{font:700 14.5px var(--f-ui);color:var(--txt-h)}
.tm-wyd-mch-km{margin-left:5px;font-style:normal;font-weight:400;font-size:12.5px;color:var(--txt-3)}
.tm-wyd-mch-d{font-size:12.5px;color:var(--txt-2)}
.tm-wyd-mch-g{font:700 13.5px var(--f-lab);color:var(--txt-h)}

/* --- dwie kolumny: opis i "na miejscu" --- */
.tm-wyd-cols{display:grid;grid-template-columns:1fr 300px;gap:32px;align-items:start;margin-top:6px;padding-top:26px;border-top:1px solid var(--line)}
.tm-wyd-col{min-width:0}
.tm-wyd-wyk{margin:0 0 6px;font:700 16px var(--f-ui);color:var(--txt-h)}
.tm-wyd-opis p{margin:0 0 10px;max-width:68ch;line-height:1.6}
.tm-wyd-opis a{color:var(--brand);text-decoration:underline;text-underline-offset:2px}
.tm-wyd-art{margin:12px 0 0}
.tm-wyd-wyst{margin:10px 0 0;font-size:14.5px;line-height:1.6;color:var(--txt-2)}
.tm-wyd-wyst b{color:var(--txt-h)}
.tm-wyd-det2{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.tm-wyd-det2 summary{cursor:pointer;list-style:none;font:600 15px var(--f-lab);color:var(--txt-h)}
.tm-wyd-det2 summary::-webkit-details-marker{display:none}
.tm-wyd-det2 summary::after{content:"\25BE";margin-left:8px;font-size:12px;color:var(--txt-3)}
.tm-wyd-det2[open] summary::after{content:"\25B4"}
.tm-wyd-det2 .tm-wyd-owyk{margin-top:8px;font-size:14.5px;line-height:1.6;color:var(--txt-2)}
.tm-wyd-det2 .tm-wyd-owyk a{color:var(--brand)}
/* --- trasa wydarzenia (pomysł #405): link „Cała trasa” pod „Występują” i obok nagłówka paska innych miast --- */
.tm-wyd-seria-p{margin:10px 0 0;font-size:14.5px;line-height:1.5}
a.tm-wyd-seria{color:var(--brand);font-weight:600;text-decoration:underline;text-underline-offset:2px}
a.tm-wyd-seria:hover,a.tm-wyd-seria:focus-visible{color:var(--brand-h)}
.tm-wyd-seria-nag{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 16px;margin:0 0 12px}
.tm-wyd-seria-nag .tm-wyd-h2{margin:0}
.tm-wyd-seria-nag a.tm-wyd-seria{font-size:14px;white-space:nowrap}
.tm-wyd-video{position:relative;margin-top:16px;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:var(--dark)}
.tm-wyd-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

.tm-wyd-side{position:relative}
.tm-wyd-facts{display:grid;grid-template-columns:100px 1fr;margin:0;font-size:14px}
.tm-wyd-facts dt,.tm-wyd-facts dd{padding:10px 0;border-bottom:1px solid var(--line);margin:0}
.tm-wyd-facts dt{color:var(--txt-2)}
.tm-wyd-mapa{position:relative;margin-top:16px;height:220px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--band)}
.tm-wyd-mapa .leaflet-container{background:var(--band)}
.tm-wyd-route{margin:8px 0 0;font-size:14px}
.tm-wyd-route i{margin-right:6px;color:var(--txt-3)}

/* --- pasek zakupu na telefonie: pojawia się (klasa --on) po zniknięciu przycisku z afisza --- */
.tm-wyd-pasek{display:none}
@media(max-width:767px){
 .tm-wyd-pasek{position:sticky;bottom:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 -18px;padding:10px 18px;background:#fff;border-top:1px solid var(--line);box-shadow:0 -8px 18px rgba(16,20,28,.12)}
 .tm-wyd-pasek--wait{display:none}
 .tm-wyd-pasek--wait.tm-wyd-pasek--on{display:flex}
 .tm-wyd-pasek-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 13px var(--f-ui);color:var(--txt-2)}
 .tm-wyd-pasek .tm-wyd-price{color:var(--txt-h)}
 .tm-wyd-pasek .tm-wyd-price small{color:var(--txt-3)}
 .tm-wyd-pasek a.tm-wyd-kup{height:40px;padding:0 20px;font-size:14.5px;box-shadow:none}
}

/* --- responsywność --- */
@media(max-width:880px){
 .tm-wyd-cols{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:767px){
 /* telefon: plakat obok rodzaju i tytułu, reszta afisza (miejsce, termin, bilety, akcje) na pełną szerokość -
    .tm-wyd-main znika z układu (display:contents), jego dzieci są komórkami siatki afisza */
 .tm-wyd-afisz{grid-template-columns:96px minmax(0,1fr);gap:0 14px;padding:16px 16px 14px;border-radius:0;margin:0 -18px}
 .tm-wyd-main{display:contents}
 .tm-wyd-pw{grid-column:1;grid-row:1;align-self:start}
 .tm-wyd-head{grid-column:2;grid-row:1;min-width:0}
 .tm-wyd-miejsce,.tm-wyd-hr,.tm-wyd-act,.tm-wyd-foot{grid-column:1/-1}
 .tm-wyd-miejsce{margin-top:18px}
 .tm-wyd-biletcol>.tm-wyd-lab{display:none}
 .tm-wyd-buyrow{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px}
 .tm-wyd-h1{font-size:23px;margin:4px 0 8px}
 .tm-wyd-miejsce{font-size:13.5px}
 /* kartka pod plakatem na całą jego szerokość (96 px), sklejona z nim w jeden blok */
 .tm-wyd-p,.tm-wyd-p0{border-radius:8px 8px 0 0}
 .tm-wyd-dt{position:relative;left:auto;bottom:auto;display:grid;width:100%;min-width:0;border-radius:0 0 8px 8px;box-shadow:0 8px 18px rgba(0,0,0,.35)}
 .tm-wyd-dt-m{font-size:10.5px;letter-spacing:.06em;padding:3px 2px}
 .tm-wyd-dt-d{font-size:30px;padding:4px 4px 0}
 .tm-wyd-dt-w{font-size:12.5px;padding:2px 4px 6px}
 .tm-wyd-act{grid-template-columns:minmax(0,1fr);gap:14px}
 .tm-wyd-terms{display:grid;grid-template-columns:repeat(2,1fr)}
 a.tm-wyd-t{min-width:0}
 .tm-wyd-foot{gap:16px 20px;font-size:13px}
}
@media(max-width:600px){
 .tm-wyd-afisz{margin:0 -16px}
 .tm-wyd-h2{font-size:18px}
 .tm-wyd-sek{margin:22px 0}
 .tm-wyd-facts{grid-template-columns:1fr}
 .tm-wyd-facts dt{padding-bottom:0;border-bottom:0}
 .tm-wyd-facts dd{padding-top:2px}
}
/* --- koniec sekcji karta wydarzenia --- */

/* =====================================================================================
   MODUŁ ZNANI (idea #372, 2026-09-26)
   Dział /znani-mieszkancy/ (znane osoby urodzone w mieście, dane z Wikidata i polskiej
   Wikipedii) - smarty/templates/ext/znani/*.tpl, moduł ext/znani.php. Dział nie ma wiersza
   w tabeli `strony`, więc układ (.tm-in, .tm-cols, .tm-side) rysuje sam - tutaj jest tylko
   to, czego motyw nie ma. Akcent: --loc (granat modułów miejskich, jak /zabytki, /wiara).
   Drobne teksty w --txt-2 (AA na bieli), nigdy w --txt-3. Bez ucinania nadmiaru pudełka,
   bez ellipsis i bez wysokości linii w pikselach: nazwiska i opisy mają polskie znaki
   (kreski nad Ś/Ź, ogonki), które takie deklaracje ścinają - długi tekst po prostu się zawija.
   Karty (.tm-zna-karty) w dwóch kolumnach do 600 px, potem jedna; dane z Wikidata mogą być
   długie (nazwy, opisy), stąd min-width:0 na kolumnach siatki i zawijanie słów.
   Test ZnaniCssTest pilnuje, że każda klasa .tm-zna-* użyta w szablonach ma tu regułę
   i że w sekcji nie ma zakazanych deklaracji.
   Podstrona osoby (.tm-zna-os): zdjęcie z Commons obok faktów, na telefonie jedno pod
   drugim; ikona AI z tła, jak w artykułach.
   ===================================================================================== */
.tm-zna-body{padding-top:14px}
.tm-zna-body .tm-bc{margin-bottom:12px}
.tm-zna-bcs{margin:0 2px;color:var(--txt-3)}
.tm-zna-head .tm-h1k{margin-left:0}
.tm-zna-lead{margin:-6px 0 18px;max-width:760px;font-size:15px;line-height:1.55;color:var(--txt-2)}
.tm-zna-sec{margin:0 0 28px;scroll-margin-top:86px}
.tm-zna-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-zna-link{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-zna-link:hover,.tm-zna-link:focus-visible{color:var(--dark)}
.tm-zna-btn{display:inline-block;margin-top:6px;padding:9px 16px;border-radius:6px;background:var(--loc);font-weight:600;color:#fff;text-decoration:none}
.tm-zna-btn:hover,.tm-zna-btn:focus-visible{background:var(--dark);color:#fff}
.tm-zna-blad{margin:0 0 24px}
.tm-zna-pusto{padding:14px 16px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg)}
.tm-zna-pusto .tm-zna-lead{margin-top:0}

/* --- karty osób (_karta.tpl) --- */
.tm-zna-karty{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 0 18px;padding:0;list-style:none}
.tm-zna-karta{display:flex;flex-direction:column;gap:3px;min-width:0;padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:#fff;overflow-wrap:anywhere}
.tm-zna-karta-nazwa{display:block;font-size:16px;font-weight:700;line-height:1.3;color:var(--txt-h)}
.tm-zna-karta-lata{margin:0;font-size:13px;font-weight:600;color:var(--loc)}
.tm-zna-karta-opis{margin:0;font-size:13.5px;line-height:1.45;color:var(--txt-2)}

.tm-zna-karta-link{color:inherit;text-decoration:none}
.tm-zna-karta-link:hover,.tm-zna-karta-link:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}

/* --- podstrona osoby (osoba.tpl, przyrost 2): zdjęcie z Commons, fakty, opis AI --- */
.tm-zna-os{margin:0 0 26px}
.tm-zna-os-gora{display:flex;flex-wrap:wrap;align-items:flex-start;gap:18px 24px;margin:0 0 20px}
.tm-zna-os-fig{flex:0 1 260px;min-width:0;margin:0}
.tm-zna-os-fot{display:block;border-radius:8px;background:var(--loc-bg);cursor:zoom-in}
.tm-zna-os-img{display:block;width:100%;height:auto;border-radius:8px}
.tm-zna-os-podpis{margin-top:6px;font-size:12px;line-height:1.45;color:var(--txt-2);overflow-wrap:anywhere}
.tm-zna-os-fakty{flex:1 1 280px;min-width:0;margin:0}
.tm-zna-os-fakt{display:grid;grid-template-columns:minmax(0,120px) minmax(0,1fr);gap:4px 14px;padding:9px 0;border-bottom:1px solid var(--line)}
.tm-zna-os-fakt dt{font-size:13px;font-weight:600;color:var(--txt-2)}
.tm-zna-os-fakt dd{margin:0;font-size:15px;line-height:1.45;color:var(--txt-h);overflow-wrap:anywhere}
.tm-zna-os-opis{max-width:760px;margin:0 0 18px}
.tm-zna-os-opis p{margin:0 0 12px;font-size:16px;line-height:1.65}
.tm-zna-os-ai{display:flex;align-items:center;gap:8px;margin:0 0 14px;font-size:13px;line-height:1.4;color:var(--txt-2)}
.tm-zna-os-ai-ikona{flex:none;display:block;width:126px;height:42px;margin:-11px -18px -11px -17px;background:url(/theme/3/images/ai/ai-modified.svg) no-repeat center/contain}
.tm-zna-os-ai-tekst{min-width:0}
.tm-zna-os-opis .tm-zna-os-licencja{font-size:12.5px;line-height:1.5;color:var(--txt-2)}

/* --- pasek stron (_paginacja.tpl) --- */
.tm-zna-pag{margin:0 0 26px}
.tm-zna-pag-lista{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.tm-zna-pag-link{display:inline-block;min-width:36px;padding:7px 11px;border:1px solid var(--line);border-radius:6px;font-size:13.5px;font-weight:600;text-align:center;color:var(--loc);text-decoration:none}
.tm-zna-pag-link:hover,.tm-zna-pag-link:focus-visible{border-color:var(--loc);background:var(--loc-bg)}
.tm-zna-pag-poprz,.tm-zna-pag-nast{padding-left:14px;padding-right:14px}
.tm-zna-pag-biezaca{display:inline-block;min-width:36px;padding:7px 11px;border:1px solid var(--loc);border-radius:6px;background:var(--loc);font-size:13.5px;font-weight:600;text-align:center;color:#fff}
.tm-zna-pag-przerwa{padding:7px 4px;font-size:13.5px;color:var(--txt-2)}

/* --- źródła i zgłoszenia (_zrodlo.tpl) --- */
.tm-zna-zrodlo{margin:0 0 20px;padding-top:12px;border-top:1px solid var(--line)}
.tm-zna-zrodlo p{margin:0 0 8px;font-size:12.5px;line-height:1.5;color:var(--txt-2)}

/* --- portal ogólnopolski (polska.tpl) --- */
.tm-zna-polska-sumy{margin-bottom:24px;font-size:13.5px;color:var(--txt-2)}
.tm-zna-woj{scroll-margin-top:86px}
.tm-zna-woj-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 18px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-zna-miasta{margin:0;padding:0;list-style:none;columns:3 210px;column-gap:24px;font-size:13.5px;line-height:1.7}
.tm-zna-miasto{break-inside:avoid;padding:3px 0}
.tm-zna-miasto-link{color:var(--loc);font-weight:600;text-decoration:none}
.tm-zna-miasto-link:hover,.tm-zna-miasto-link:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-zna-miasto-liczba{font-size:12px;color:var(--txt-2)}

/* --- belka rocznic na stronie głównej miasta (pomysł #436, ext/S/NT3znaniRocznice.tpl) - wzór .tm-wibar
   (belka Mszy tuż nad nią): pozycje jedna pod drugą, okrągła rocznica w kolorze akcentu --- */
.tm-znbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--loc);border-radius:8px;box-shadow:var(--card-sh);padding:13px 18px;margin:26px 0}
.tm-znbar-tit{flex:none;display:flex;align-items:center;gap:9px;margin:0;font:600 13.5px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--dark)}
.tm-znbar-tit::before{content:"";width:8px;height:8px;background:var(--loc)}
.tm-znbar-l{order:3;flex:1 1 100%;display:flex;flex-direction:column;gap:6px;min-width:0;margin:0;padding:0;list-style:none;font-size:14px;color:var(--txt-2);overflow-wrap:anywhere}
.tm-znbar-l a{font-weight:600;color:var(--txt)}
.tm-znbar-l a:hover{color:var(--brand)}
.tm-znbar-data{font-weight:600;color:var(--loc);font-variant-numeric:tabular-nums}
.tm-znbar-ok{color:var(--loc)}
.tm-znbar-reszta{order:4;font-size:13px;color:var(--txt-2)}
.tm-znbar-all{order:2;margin-left:auto;font:600 12px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--loc);white-space:nowrap}
.tm-znbar-all:hover{color:var(--brand)}
@media(max-width:560px){.tm-znbar{flex-direction:column;align-items:flex-start}.tm-znbar-l{flex-basis:auto}.tm-znbar-all{order:5;margin-left:0;white-space:normal}}

/* --- zapowiedź osób związanych pod listą urodzonych (miasto.tpl, etap B, pomysł #437) --- */
.tm-zna-zap{margin-top:8px}
.tm-zna-zap-wiecej{margin:0;font-size:14px;font-weight:600;color:var(--txt-2)}

/* --- responsywność: kolumny, karty i pasek stron <= 880/700/600 px --- */
@media(max-width:880px){.tm-zna-body .tm-side{margin-top:18px}.tm-zna-miasta{columns:2 150px}}
@media(max-width:700px){
 .tm-zna-miasta{columns:auto}
 .tm-zna-pag-lista{gap:5px}
}
@media(max-width:600px){
 .tm-zna-lead{font-size:14px}
 .tm-zna-h2{font-size:17px}
 .tm-zna-woj-h2{font-size:17px}
 .tm-zna-karty{grid-template-columns:minmax(0,1fr)}
 .tm-zna-os-fig{flex-basis:100%;max-width:320px}
 .tm-zna-os-fakt{grid-template-columns:minmax(0,1fr)}
}
/* --- koniec sekcji znani (idea #372) --- */

/* strona miejsca /miejsce/{id} (pomysł #404) - lista z klas kalendarza (.tm-kalpg .tm-kal-*), tu nagłówek i mapa */
.tm-miejsce-g{margin:0 0 14px}
.tm-miejsce-kat{margin:0 0 4px;font:600 11.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--kal-d)}
.tm-miejsce-adr{margin:6px 0 0;font-size:14px;line-height:1.45;color:var(--txt-2)}
.tm-miejsce-adr i{margin-right:6px}
.tm-miejsce-lead{margin:6px 0 0;font-size:14px;color:var(--txt)}
.tm-miejsce-mapa{height:260px;margin:0 0 8px;border-radius:8px;overflow:hidden;background:var(--band)}
.tm-miejsce-trasa{margin:0 0 18px;font-size:14px}
.tm-miejsce-trasa i{margin-right:6px}
.tm-miejsce-wiecej{margin:16px 0 0;font-size:14px}
.tm-miejsce-dodaj{margin:10px 0 0;font-size:14px}
.tm-miejsce-dodaj-a{color:var(--brand);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.tm-miejsce-dodaj-a:hover,.tm-miejsce-dodaj-a:focus-visible{color:var(--brand-h)}
.tm-miejsce-dodaj-a:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:2px}
@media (max-width:640px){.tm-miejsce-mapa{height:200px}}

/* dział tras /wydarzenia-trasy/ (pomysł #405) - korzeń .tm-kalpg (zakładki, nagłówki i puste stany z klas kalendarza),
   tu ranking, opis trasy, mapa terminów i terminy po województwach; linki z klasą (.tm-pagecard barwi linki bez klasy) */
.tm-trasa-lista{margin:0 0 18px;padding:0;list-style:none}
.tm-trasa-poz{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;padding:11px 0;border-bottom:1px solid var(--line)}
.tm-kalpg a.tm-trasa-poz-t{flex:1 1 100%;font:700 17px/1.3 var(--f-ui);color:var(--txt-h);text-decoration:none}
.tm-kalpg a.tm-trasa-poz-t:hover,.tm-kalpg a.tm-trasa-poz-t:focus-visible{color:var(--kal-d);text-decoration:underline;text-underline-offset:2px}
.tm-trasa-poz-typ,.tm-trasa-typ{font:600 11.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--kal-d)}
.tm-trasa-poz-n,.tm-trasa-poz-d{font-size:14px;color:var(--txt-2)}
.tm-trasa-str{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 16px;margin:6px 0 18px;font-size:14px;color:var(--txt-2)}
.tm-kalpg a.tm-trasa-strl{display:inline-block;padding:7px 14px;border:1px solid var(--kal);border-radius:6px;font:600 14px var(--f-ui);color:var(--kal-d);text-decoration:none}
.tm-kalpg a.tm-trasa-strl:hover,.tm-kalpg a.tm-trasa-strl:focus-visible{background:var(--kal-d);color:#fff}
.tm-trasa-g{margin:0 0 14px}
.tm-trasa-typ{margin:0 0 4px}
.tm-trasa-o{display:flex;align-items:flex-start;gap:18px;margin:0 0 18px}
.tm-trasa-fot{flex:0 0 180px}
.tm-trasa-fot img{display:block;width:100%;height:auto;border-radius:8px}
.tm-trasa-opis{flex:1 1 auto;min-width:0;font-size:15px;line-height:1.6;color:var(--txt)}
.tm-trasa-opis p{margin:0 0 10px}
.tm-trasa-wyst{color:var(--txt-2)}
.tm-trasa-mapa{height:340px;margin:0 0 14px;border-radius:8px;overflow:hidden;background:var(--band)}
.tm-trasa-woj{margin:18px 0 0;scroll-margin-top:86px}
.tm-trasa-h3{margin:0 0 4px;font:700 16px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-trasa-ter{margin:0;padding:0;list-style:none}
.tm-trasa-t{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.tm-trasa-t-d{flex:0 0 220px;color:var(--txt-2)}
.tm-kalpg a.tm-trasa-t-m{font-weight:700;color:var(--txt-h);text-decoration:underline;text-underline-offset:2px}
.tm-kalpg a.tm-trasa-t-m:hover,.tm-kalpg a.tm-trasa-t-m:focus-visible{color:var(--kal-d)}
.tm-trasa-t-o{flex:1 1 160px;min-width:0;color:var(--txt-2)}
.tm-kalpg a.tm-trasa-kup{display:inline-flex;align-items:center;margin-left:auto;padding:5px 13px;border-radius:999px;background:var(--brand-h);font:600 13px var(--f-ui);color:#fff;text-decoration:none}
.tm-kalpg a.tm-trasa-kup:hover,.tm-kalpg a.tm-trasa-kup:focus-visible{background:#8c2d35}
.tm-trasa-wiecej,.tm-trasa-pow{margin:14px 0 0;font-size:14px}
.tm-trasa-wej{margin:-8px 0 14px;font-size:14.5px}
.tm-kalpg a.tm-trasa-a{color:var(--kal-d);font-weight:600}
/* „Zgłoś błąd” (pomysł #405): link na stronie trasy i formularz /zglos-blad/ (pola z klas formularza Ważnych punktów) */
.tm-zglb-link{margin:6px 0 0;font-size:13.5px}
.tm-zglb-link .fas{font-size:12px;margin-right:4px}
.tm-kalpg a.tm-zglb-a{color:var(--kal-d);font-weight:600}
.tm-zglb-k{max-width:760px}
.tm-rz-adm-tresc{white-space:pre-line;max-width:420px;overflow-wrap:anywhere}
.tm-trasa-pop{display:flex;flex-direction:column;gap:2px;font-size:13px;line-height:1.4}
.tm-trasa-pop-m{font-weight:700}
@media (max-width:640px){.tm-trasa-o{flex-direction:column}.tm-trasa-fot{flex-basis:auto;max-width:220px}.tm-trasa-mapa{height:240px}.tm-trasa-t-d{flex-basis:100%}.tm-kalpg a.tm-trasa-kup{margin-left:0}}

/* =====================================================================================
   MODUŁ WAŻNE PUNKTY (idea #375, 2026-09-28)
   Dział /wazne-punkty/ (urzędy, sądy, policja, straż pożarna, poczty, dworce, szpitale,
   przychodnie) - smarty/templates/ext/punkty/*.tpl, moduł ext/punkty.php, mapa
   www/theme/3/js/punktyMapa.js. Dział nie ma wiersza w tabeli `strony`, więc układ
   (.tm-in, .tm-cols, .tm-side) rysuje sam - tutaj jest tylko to, czego motyw nie ma.
   Klasy BEM z korzeniem .tm-punkty (.tm-punkty__element, --modyfikator), żadna nie jest
   składana w szablonie ze zmiennej. Akcent działu: --loc (granat modułów miejskich);
   drobne teksty w --txt-2, --txt-3 tylko dla ozdobnika okruszków. Kolory kategorii
   przychodzą z conf/punkty.php inline (style="background:...") - tu nie ma ich kopii.
   Każdy link ma własną klasę: reguła .tm-pagecard :is(p,li,dd,td) a:not([class]) barwi
   linki bez klasy na czerwono. .tm-h1k ma w motywie ujemny margines (belka) - w dziale
   zerowany. Bez ucinania pudełka, ellipsis i wysokości linii w px (ścinają Ś/Ź i ogonki).
   Test PunktyCssTest pilnuje reguły dla każdej klasy z szablonów i z punktyMapa.js.
   ===================================================================================== */
.tm-punkty{padding-top:14px}
.tm-punkty__bc{margin-bottom:12px}
.tm-punkty__bcs{margin:0 2px;color:var(--txt-3)}
.tm-bc .tm-punkty__bca:hover,.tm-bc .tm-punkty__bca:focus-visible{color:var(--loc)}
.tm-punkty__head{margin:0 0 6px}
.tm-punkty__head .tm-h1k{margin-left:0}
.tm-punkty__kat{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 8px;font-size:13px}
.tm-punkty__kat-a{font-weight:600;color:var(--loc);text-decoration:none}
.tm-punkty__kat-a:hover,.tm-punkty__kat-a:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-punkty__lead{margin:-6px 0 12px;max-width:760px;font-size:15px;line-height:1.55;color:var(--txt-2)}
.tm-punkty__akt{margin:0 0 16px;font-size:12.5px;color:var(--txt-2)}
.tm-punkty__zastepcza{margin:-8px 0 14px;font-size:12.5px;color:var(--txt-2)}
.tm-punkty__sec{margin:0 0 28px;scroll-margin-top:86px}
.tm-punkty__h2{display:flex;flex-wrap:wrap;align-items:center;gap:0 8px;margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-punkty__h3{margin:16px 0 6px;font:700 15px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-punkty__opis{margin:0 0 12px;font-size:14px;line-height:1.55;color:var(--txt)}
.tm-punkty__uwaga{margin:8px 0 0;font-size:12px;line-height:1.5;color:var(--txt-2)}
.tm-punkty__liczba{font-size:.85em;font-weight:400;color:var(--txt-2)}
.tm-punkty__kolor{display:inline-block;flex:none;width:10px;height:10px;margin-right:6px;border-radius:50%;vertical-align:middle}

/* --- nawigacja kategorii (hub) --- */
.tm-punkty__nav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.tm-punkty__kotwica{padding:6px 12px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;font-weight:600;color:var(--txt-2);text-decoration:none}
.tm-punkty__kotwica:hover,.tm-punkty__kotwica:focus-visible{border-color:var(--loc);color:var(--loc)}

/* --- listy punktów (_lista.tpl, _okolica.tpl, w pobliżu) --- */
.tm-punkty__lista{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.tm-punkty__poz{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px;line-height:1.45}
.tm-punkty__link{font-weight:600;color:var(--txt);text-decoration:none}
.tm-punkty__link:hover,.tm-punkty__link:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-punkty__nazwa{font-weight:600;color:var(--txt)}
.tm-punkty__etykieta{padding:1px 7px;border-radius:4px;background:var(--loc-bg);font:600 11px var(--f-lab);letter-spacing:.03em;color:var(--loc)}
.tm-punkty__sor{padding:1px 6px;border-radius:4px;background:#fdecef;font:700 11px var(--f-lab);letter-spacing:.04em;color:#a3123a;text-decoration:none;cursor:help}
.tm-punkty__adres{flex-basis:100%;font-size:13px;color:var(--txt-2)}
.tm-punkty__gugik{display:inline-block;margin-left:6px;font-size:12px;font-style:italic;color:var(--txt-2)}
.tm-punkty__odl{font-size:12.5px;font-weight:600;color:var(--loc)}
.tm-punkty__wiecej-p{margin:10px 0 0}
.tm-punkty__wiecej{font-weight:600;color:var(--loc);text-decoration:none}
.tm-punkty__wiecej:hover,.tm-punkty__wiecej:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-punkty__okolica .tm-punkty__lista{margin-bottom:8px}

/* --- mapa (_mapa.tpl) i legenda z filtrem (_legenda.tpl) --- */
.tm-punkty__mapa{height:420px;border-radius:8px;background:var(--loc-bg)}
.tm-punkty__mapa--mala{height:280px}
.tm-punkty__mapa--blad{display:flex;align-items:center;justify-content:center;height:auto;min-height:64px;padding:16px;font-size:13.5px;color:var(--txt-2)}
.tm-punkty__legenda{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:12px 0 0;font-size:13px;color:var(--txt-2)}
.tm-punkty__legenda-tytul{font-weight:600;color:var(--txt)}
.tm-punkty__leg{display:inline-flex;align-items:center;gap:4px;cursor:pointer}
.tm-punkty__filtr{margin:0 2px 0 0;accent-color:var(--loc)}
.tm-punkty__filtr:disabled{cursor:default}
.tm-punkty__pop{font-size:13px;line-height:1.45}
.tm-punkty__pop-n{display:block;margin:0 0 4px;font-weight:700;color:var(--txt)}
a.tm-punkty__pop-n{color:var(--loc);text-decoration:none}
a.tm-punkty__pop-n:hover,a.tm-punkty__pop-n:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-punkty__pop-l{display:inline-block;font-size:12.5px;font-weight:600;color:var(--loc);text-decoration:none}

/* --- podstrona punktu: karta kontaktu, godziny, akcje --- */
.tm-punkty__karta{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;margin:0;font-size:14px;line-height:1.55}
.tm-punkty__dt{font-weight:600;color:var(--txt-2)}
.tm-punkty__dd{margin:0;color:var(--txt)}
.tm-punkty__a{color:var(--loc);text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
.tm-punkty__a:hover,.tm-punkty__a:focus-visible{color:var(--dark)}
.tm-punkty__godziny{border-collapse:collapse;min-width:280px;font-size:14px}
.tm-punkty__godz-w{border-bottom:1px solid var(--line)}
.tm-punkty__godz-d{padding:6px 18px 6px 0;font-weight:600;text-align:left;color:var(--txt)}
.tm-punkty__godz-g{padding:6px 0;color:var(--txt)}
.tm-punkty__godz-z .tm-punkty__godz-d,.tm-punkty__godz-z .tm-punkty__godz-g{color:var(--txt-2)}
.tm-punkty__okresowo{margin:10px 0 0;padding-left:18px;font-size:13.5px;line-height:1.6}
.tm-punkty__okres{color:var(--txt)}
.tm-punkty__akcje{margin:0 0 24px}
.tm-punkty__akcje-lista,.tm-punkty__linki-lista{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.tm-punkty__powiazany{display:block}
.tm-punkty__linki{margin:0 0 24px}
.tm-punkty__btn{display:inline-block;padding:9px 16px;border:1px solid var(--loc);border-radius:6px;background:var(--loc);font-size:13.5px;font-weight:600;color:#fff;text-decoration:none}
.tm-punkty__btn:hover,.tm-punkty__btn:focus-visible{background:var(--dark);border-color:var(--dark);color:#fff}
.tm-punkty__btn--jasny{background:#fff;color:var(--loc)}
.tm-punkty__btn--jasny:hover,.tm-punkty__btn--jasny:focus-visible{background:var(--loc-bg);border-color:var(--loc);color:var(--loc)}

/* --- komunikaty: pusto, usunięty, błąd --- */
.tm-punkty__pusto{margin:0 0 22px;padding:14px 16px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg);font-size:14px;line-height:1.55}
.tm-punkty__pusto .tm-punkty__opis:last-child{margin-bottom:0}
.tm-punkty__komunikat{margin:0 0 24px}
.tm-punkty__komunikat .tm-punkty__lead{margin-top:0}

/* --- portal polska: spis miast województwami --- */
.tm-punkty__woj .tm-punkty__h2{font-size:18px}
.tm-punkty__miasta{margin:0;padding:0;list-style:none;columns:3 210px;column-gap:24px;font-size:13.5px;line-height:1.7}
.tm-punkty__miasto{break-inside:avoid;padding:3px 0}

/* --- źródło danych (_zrodlo.tpl) --- */
.tm-punkty__zrodlo{margin:8px 0 0;padding-top:12px;border-top:1px solid var(--line)}
.tm-punkty__zrodlo-p{margin:0 0 8px;font-size:12px;line-height:1.5;color:var(--txt-2)}
.tm-punkty__zglos{font-weight:600;color:var(--loc);text-decoration:none}
.tm-punkty__zglos:hover,.tm-punkty__zglos:focus-visible{text-decoration:underline;text-underline-offset:2px}

/* --- formularz zgłoszeń (zglos.tpl) --- */
.tm-punkty__form{max-width:760px;margin:0 0 12px}
.tm-punkty__pole{min-width:0;margin:0 0 16px;padding:0;border:0}
.tm-punkty__etk{display:block;margin:0 0 6px;padding:0;font-size:14px;font-weight:600;color:var(--txt)}
.tm-punkty__radio{display:flex;align-items:flex-start;gap:8px;margin:0 0 6px;font-size:14px;line-height:1.45;color:var(--txt);cursor:pointer}
.tm-punkty__radio input{margin-top:3px;accent-color:var(--loc)}
.tm-punkty__in{box-sizing:border-box;width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:6px;background:#fff;font:inherit;font-size:14px;line-height:1.5;color:var(--txt)}
.tm-punkty__in:focus{border-color:var(--loc);outline:2px solid var(--loc-bg);outline-offset:0}
textarea.tm-punkty__in{min-height:140px;resize:vertical}
.tm-punkty__note{margin:6px 0 0;font-size:12px;line-height:1.5;color:var(--txt-2)}
.tm-punkty__flash{margin:0 0 16px;padding:12px 14px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg);font-size:14px;line-height:1.5;color:var(--txt)}
.tm-punkty__flash--ok{border-left-color:#2e7d32;background:#edf7ee}
.tm-punkty__flash--blad{border-left-color:#a3123a;background:#fdecef}
button.tm-punkty__btn{font-family:inherit;line-height:1.4;cursor:pointer}
.tm-punkty__btn:disabled{opacity:.55;cursor:not-allowed}

/* --- responsywność <= 880/700/600 px --- */
@media(max-width:880px){.tm-punkty .tm-side{margin-top:18px}.tm-punkty__miasta{columns:2 150px}}
@media(max-width:700px){
 .tm-punkty__mapa{height:320px}
 .tm-punkty__mapa--mala{height:240px}
 .tm-punkty__karta{grid-template-columns:minmax(0,1fr);gap:2px 0}
 .tm-punkty__dd{margin-bottom:8px}
 .tm-punkty__miasta{columns:auto}
}
@media(max-width:600px){
 .tm-punkty__lead{font-size:14px}
 .tm-punkty__h2{font-size:17px}
 .tm-punkty__godziny{width:100%;min-width:0}
 .tm-punkty__btn{padding:8px 12px}
}
/* --- koniec sekcji wazne punkty (idea #375) --- */

/* =====================================================================================
   MODUŁ OSTRZEŻENIA RSO (pomysł #387, 2026-09-28)
   Pasek pilnych ostrzeżeń RSO/IMGW (ext/S/function.TMostrzezenia.php, NT3ostrzezeniaPasek.tpl) -
   NAD sekcją pasa lokalnego .tm-loc na stronie głównej miasta (spec 9.1), tylko przy pilnym RSO
   (przypisanym albo regionalnym) albo ostrzeżeniu IMGW od 2. stopnia w oknie 24 h. Kolor koduje
   dotkliwość: czerwień #b3261e (RSO pilne albo IMGW 3. stopnia) albo bursztyn #b35c00 (sam IMGW
   2. stopnia, ciemniejszy niż w module Stan wody .tm-rz-strefa-1/2 - biały tekst na #c98a00 miał
   kontrast tylko 2,95:1, #b35c00 daje ok. 4,7:1 - próg AA 4,5:1, WCAG 1.4.3). Kolor jest tylko wzmocnieniem, tę samą informację niesie słowna etykieta
   (Pilne/ALERT RCB/Ostrzeżenie IMGW N. stopnia) - bez polegania wyłącznie na barwie (WCAG 1.4.1).
   Moduł zwykłych komunikatów (NT3ostrzezeniaPas.tpl) w pasie lokalnym .tm-locmods, zaraz po module
   pogody - klasy .tm-locmod/.tm-locmh są WSPÓLNE dla wszystkich modułów pasa (zdefiniowane raz przy
   pasie lokalnym), tutaj tylko modyfikator .tm-locmod-ostrz i wnętrze listy.
   Bez ucinania nadmiaru pudełka, bez ellipsis i bez wysokości linii w pikselach - tytuły komunikatów
   RSO bywają długie i mają polskie znaki diakrytyczne, które takie deklaracje ścinają.
   Test OstrzezeniaCssTest pilnuje, że każda klasa .tm-ostrz-* użyta w szablonach widgetu i działu ma
   tu regułę i że w sekcji nie ma zakazanych deklaracji.
   ===================================================================================== */
.tm-ostrz-pasek{padding:10px 0;color:#fff}
.tm-ostrz-pasek-czerwony{background:#b3261e}
.tm-ostrz-pasek-pomaranczowy{background:#b35c00}
.tm-ostrz-pasek-in{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;font-size:13.5px;line-height:1.4}
.tm-ostrz-pasek-poz{display:inline-flex;flex-wrap:wrap;gap:5px;align-items:baseline;min-width:0}
.tm-ostrz-pasek-lab{flex:none;font:700 11.5px var(--f-lab);letter-spacing:.05em;text-transform:uppercase}
.tm-ostrz-pasek-poz a{min-width:0;color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
.tm-ostrz-pasek-wsz{flex:none;margin-left:auto;white-space:nowrap;font-weight:600;color:#fff;text-decoration:underline;text-underline-offset:2px}
.tm-ostrz-pasek-poz a:hover,.tm-ostrz-pasek-poz a:focus-visible,.tm-ostrz-pasek-wsz:hover,.tm-ostrz-pasek-wsz:focus-visible{text-decoration-thickness:2px}
.tm-ostrz-pasek-niesw{flex-basis:100%;font-size:12.5px;opacity:.92}

/* --- moduł w pasie lokalny (NT3ostrzezeniaPas.tpl) --- */
.tm-locmod-ostrz{display:flex;flex-direction:column}
.tm-ostrz-lista{display:flex;flex-direction:column;gap:9px;margin:0;padding:0;list-style:none}
.tm-ostrz-pas-niesw{margin:10px 0 0;font-size:12.5px;color:var(--txt-2)}
.tm-ostrz-poz a{color:var(--txt-h);font-weight:600;text-decoration:none;overflow-wrap:anywhere}
.tm-ostrz-poz a:hover,.tm-ostrz-poz a:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-ostrz-meta{display:block;margin-top:2px;font-size:12px;color:var(--txt-2)}

/* --- dział /ostrzezenia/ (ext/ostrzezenia/*.tpl, zadanie 17): nagłówek, sekcje, karty, archiwum, podpis --- */
.tm-ostrz-body{padding-top:14px}
.tm-ostrz-body .tm-bc{margin-bottom:12px}
.tm-ostrz-lead{margin:-6px 0 18px;max-width:760px;font-size:15px;line-height:1.55;color:var(--txt-2)}
.tm-ostrz-nieswiezo{margin:0 0 18px;padding:9px 14px;border-left:3px solid var(--txt-3);border-radius:0 6px 6px 0;background:var(--band);font-size:13px;color:var(--txt-2)}
.tm-ostrz-pusto{margin:0 0 20px;padding:14px 16px;border-left:3px solid var(--loc);border-radius:0 6px 6px 0;background:var(--loc-bg)}
.tm-ostrz-sec{margin:0 0 28px;scroll-margin-top:86px}
.tm-ostrz-h2{margin:0 0 12px;padding-bottom:7px;border-bottom:2px solid var(--loc);font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-ostrz-karty{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.tm-ostrz-karta{padding:12px 14px;border:1px solid var(--line);border-left:4px solid var(--loc);border-radius:0 8px 8px 0;background:#fff}
.tm-ostrz-karta-pilna{border-left-color:#b3261e;background:#fdf2f1}
.tm-ostrz-karta-tag{display:inline-block;margin:0 0 4px;padding:2px 8px;border-radius:4px;background:#b3261e;font:700 11px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:#fff}
.tm-ostrz-karta-tytul{display:block;font-size:16px;font-weight:700;line-height:1.35;color:var(--txt-h);text-decoration:none}
.tm-ostrz-karta-tytul:hover,.tm-ostrz-karta-tytul:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-ostrz-karta-zaj{margin:6px 0 0;font-size:14px;line-height:1.5;color:var(--txt)}
.tm-ostrz-karta-meta{margin:8px 0 0;font-size:12.5px;color:var(--txt-2)}

/* --- sekcja "Pogoda" (IMGW od 2. stopnia) --- */
.tm-ostrz-pogoda{padding:12px 14px;border:1px solid var(--line);border-left:4px solid #b35c00;border-radius:0 8px 8px 0;background:#fff}
.tm-ostrz-pogoda+.tm-ostrz-pogoda{margin-top:12px}
.tm-ostrz-pogoda-3{border-left-color:#b3261e}
.tm-ostrz-pogoda-naglowek{margin:0;font-size:16px;font-weight:700;color:var(--txt-h)}
.tm-ostrz-pogoda-opis{margin:6px 0 0;font-size:14px;line-height:1.5;color:var(--txt)}
.tm-ostrz-pogoda-okno{margin:8px 0 0;font-size:12.5px;color:var(--txt-2)}
.tm-ostrz-pogoda-podpis{margin:4px 0 0;font-size:11.5px;line-height:1.4;color:var(--txt-3)}

/* --- sekcja "Pozostałe komunikaty w województwie" (zwinięta) --- */
.tm-ostrz-szczegoly{margin:0 0 28px}
.tm-ostrz-szczegoly summary{cursor:pointer;padding:9px 0;font:700 15px var(--f-ui);color:var(--loc)}
.tm-ostrz-szczegoly summary:hover,.tm-ostrz-szczegoly summary:focus-visible{color:var(--dark)}
.tm-ostrz-szczegoly[open] summary{margin-bottom:8px}

/* --- sekcja "Archiwum" --- */
.tm-ostrz-archiwum{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.tm-ostrz-archiwum-poz{padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
.tm-ostrz-archiwum-poz a{color:var(--txt-h);font-weight:600;text-decoration:none}
.tm-ostrz-archiwum-poz a:hover,.tm-ostrz-archiwum-poz a:focus-visible{color:var(--loc);text-decoration:underline;text-underline-offset:2px}
.tm-ostrz-archiwum-stan{display:block;margin-top:2px;font-size:12.5px;color:var(--txt-2)}

/* --- podpis źródła (_podpis.tpl) --- */
.tm-ostrz-podpis{margin:10px 0 0;padding-top:10px;border-top:1px solid var(--line);font-size:12.5px;line-height:1.5;color:var(--txt-2)}
.tm-ostrz-podpis a{color:var(--txt-2);text-decoration:underline;text-underline-offset:2px}

/* --- podstrona komunikatu (komunikat.tpl) --- */
.tm-ostrz-komunikat{margin:0 0 26px}
.tm-ostrz-stan-banner{margin:0 0 18px;padding:12px 14px;border-left:3px solid var(--txt-3);border-radius:0 6px 6px 0;background:var(--band);font-size:14px;color:var(--txt-2)}
.tm-ostrz-tresc{max-width:760px}
.tm-ostrz-tresc p{margin:0 0 12px;font-size:16px;line-height:1.65}
.tm-ostrz-miasta{margin:0;padding:0;list-style:none;columns:2 190px;column-gap:20px;font-size:13.5px;line-height:1.7}
.tm-ostrz-miasta li{break-inside:avoid;padding:3px 0}
.tm-ostrz-miasta a{color:var(--loc);font-weight:600;text-decoration:none}
.tm-ostrz-miasta a:hover,.tm-ostrz-miasta a:focus-visible{text-decoration:underline;text-underline-offset:2px}

/* --- hub polska i strona województwa --- */
.tm-ostrz-polska-sumy{margin:0 0 20px;font-size:13.5px;color:var(--txt-2)}
.tm-ostrz-woj-tabela{width:100%;border-collapse:collapse;font-size:14px}
.tm-ostrz-woj-tabela th,.tm-ostrz-woj-tabela td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left}
.tm-ostrz-woj-tabela a{color:var(--loc);font-weight:600;text-decoration:none}
.tm-ostrz-woj-tabela a:hover,.tm-ostrz-woj-tabela a:focus-visible{text-decoration:underline;text-underline-offset:2px}

/* --- responsywność: pasek, moduł, karty, tabela województw <= 700 px --- */
@media(max-width:700px){
 .tm-ostrz-pasek-wsz{margin-left:0;flex-basis:100%}
 .tm-ostrz-miasta{columns:1}
 .tm-ostrz-woj-tabela,.tm-ostrz-woj-tabela thead,.tm-ostrz-woj-tabela tbody,.tm-ostrz-woj-tabela tr,.tm-ostrz-woj-tabela td{display:block}
 .tm-ostrz-woj-tabela thead{position:absolute;left:-9999px}
 .tm-ostrz-woj-tabela tr{margin-bottom:10px;border:1px solid var(--line);border-radius:8px;padding:6px 10px}
 .tm-ostrz-woj-tabela td{border-bottom:none;padding:5px 0}
 .tm-ostrz-woj-tabela td:before{content:attr(data-l);display:inline-block;min-width:110px;font-weight:600;color:var(--txt-2)}
}
/* --- panel /adm/ostrzezenia (ext/admOstrzezenia/*.tpl, zadanie 18) - wzór reguł .tm-rz-adm-* panelu Stanu wody --- */
.tm-ostrz-tbl{width:100%;margin:8px 0 0;border-collapse:collapse;font-size:13.5px}
.tm-ostrz-tbl th{padding:7px 10px;border-bottom:2px solid var(--dark);text-align:left;font:600 11px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-ostrz-tbl td{padding:7px 10px;border-bottom:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}
.tm-ostrz-tbl-adm{font-size:13px}
.tm-ostrz-tbl-adm td,.tm-ostrz-tbl-adm th{padding:6px 8px}
.tm-ostrz-adm-nav{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 18px}
.tm-ostrz-adm-nav a{display:inline-block;padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 12.5px var(--f-lab);color:var(--txt-2);text-decoration:none}
.tm-ostrz-adm-nav a:hover{border-color:var(--loc);color:var(--loc)}
.tm-ostrz-adm-nav a[aria-current]{border-color:var(--loc);background:var(--loc);color:#fff}
.tm-ostrz-adm-flash{margin:0 0 16px;padding:10px 14px;border:1px solid #bfe0c8;border-radius:8px;background:#f1faf3;color:#1f5f34;font-size:14px}
.tm-ostrz-adm-flash-danger{border-color:#e6c3b0;background:#fbf2ec;color:#7a3a1d}
.tm-ostrz-adm-form{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px}
.tm-ostrz-adm-form input[type=text],.tm-ostrz-adm-form select{font:inherit;font-size:14px;padding:6px 10px;border:1px solid var(--line);border-radius:6px;background:#fff}
.tm-ostrz-adm-inline{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px;margin:2px 0}
.tm-ostrz-adm-inline input[type=text],.tm-ostrz-adm-inline select{font:inherit;font-size:13px;padding:3px 6px;border:1px solid var(--line);border-radius:4px;background:#fff}
.tm-ostrz-adm-btn{font:600 13px var(--f-lab);padding:6px 12px;border:1px solid var(--loc);border-radius:6px;background:#fff;color:var(--loc);cursor:pointer}
.tm-ostrz-adm-btn:hover{background:var(--loc);color:#fff}
.tm-ostrz-adm-btn-mala{font:600 11.5px var(--f-lab);padding:2px 8px;border:1px solid var(--line);border-radius:4px;background:#fff;color:var(--txt-2);cursor:pointer}
.tm-ostrz-adm-btn-mala:hover{border-color:var(--loc);color:var(--loc)}
.tm-ostrz-adm-uw{font-size:12px;color:var(--txt-2)}
.tm-ostrz-adm-znac{display:inline-block;margin-left:4px;padding:1px 7px;border-radius:4px;font:600 11px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;background:var(--band);color:var(--txt-2)}
.tm-ostrz-adm-wyszarzony td{color:var(--txt-3)}
.tm-ostrz-adm-czerwony,.tm-ostrz-adm-czerwony td{color:#b3261e;font-weight:600}
.tm-ostrz-adm-wyniki{margin:0 0 14px;padding-left:18px;font-size:13.5px;line-height:1.6}
.tm-ostrz-adm-log{max-height:420px;overflow:auto;margin:0 0 18px;padding:10px 12px;border:1px solid var(--line);border-radius:6px;background:var(--band);font-size:12px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
/* Panel /adm/gsc - Search Console (idea #411): kafel stanu połączenia, akcje, wynik testu, szczegóły techniczne */
.tm-gsc-adm{max-width:960px}
.tm-gsc-adm h2{margin:0 0 14px}
.tm-gsc-adm-flash{margin:0 0 16px;padding:10px 14px;border:1px solid #bfe0c8;border-radius:8px;background:#f1faf3;color:#1f5f34;font-size:14px}
.tm-gsc-adm-flash-danger{border-color:#e6c3b0;background:#fbf2ec;color:#7a3a1d}
.tm-gsc-adm-flash ol{margin:6px 0 0;padding-left:20px}
.tm-gsc-adm-stan{margin:0 0 20px;padding:18px 20px;border:1px solid var(--line);border-left:6px solid #8a8f98;border-radius:8px;background:#fff;box-shadow:var(--card-sh)}
.tm-gsc-adm-stan-ok{border-left-color:#2e7d32}
.tm-gsc-adm-stan-wygaslo,.tm-gsc-adm-stan-blad{border-left-color:#b3261e;background:#fdf6f5}
.tm-gsc-adm-stan-zakres,.tm-gsc-adm-stan-brak,.tm-gsc-adm-stan-wylaczone{border-left-color:#9a5b00;background:#fffaf0}
.tm-gsc-adm-stan-glowa{display:flex;align-items:flex-start;gap:12px}
.tm-gsc-adm-stan-glowa h3{margin:0 0 4px;font-size:20px;line-height:1.25;color:var(--txt-h)}
.tm-gsc-adm-stan-glowa p{margin:0;font-size:14.5px;line-height:1.5}
.tm-gsc-adm-kropka{flex:0 0 auto;width:14px;height:14px;margin-top:5px;border-radius:50%;background:#8a8f98}
.tm-gsc-adm-stan-ok .tm-gsc-adm-kropka{background:#2e7d32;box-shadow:0 0 0 4px #e3f1e4}
.tm-gsc-adm-stan-wygaslo .tm-gsc-adm-kropka,.tm-gsc-adm-stan-blad .tm-gsc-adm-kropka{background:#b3261e;box-shadow:0 0 0 4px #f6dedc}
.tm-gsc-adm-stan-zakres .tm-gsc-adm-kropka,.tm-gsc-adm-stan-brak .tm-gsc-adm-kropka,.tm-gsc-adm-stan-wylaczone .tm-gsc-adm-kropka{background:#9a5b00;box-shadow:0 0 0 4px #fbecd2}
.tm-gsc-adm-dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px 18px;margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--line)}
.tm-gsc-adm-dl div{min-width:0}
.tm-gsc-adm-dl dt{font:600 11.5px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--txt-2)}
.tm-gsc-adm-dl dd{margin:2px 0 0;font-size:14px;overflow-wrap:anywhere}
.tm-gsc-adm-akcje{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 0}
.tm-gsc-adm-akcje form{margin:0}
.tm-gsc-adm-btn{font:600 13.5px var(--f-lab);padding:8px 16px;border:1px solid var(--loc);border-radius:6px;background:#fff;color:var(--loc);cursor:pointer}
.tm-gsc-adm-btn:hover{background:var(--loc);color:#fff}
.tm-gsc-adm-btn-glowny{background:var(--loc);color:#fff}
.tm-gsc-adm-btn-glowny:hover{filter:brightness(.92)}
.tm-gsc-adm-uw{margin:10px 0 0;font-size:12.5px;color:var(--txt-2)}
.tm-gsc-adm-blad{margin:12px 0 0;padding:8px 12px;border-radius:6px;background:#fbeceb;color:#8c1d18;font-size:13px;overflow-wrap:anywhere}
.tm-gsc-adm-wynik{margin:0 0 20px;padding:16px 20px;border:1px solid var(--line);border-radius:8px;background:#fff}
.tm-gsc-adm-wynik h3{margin:0;font-size:17px;color:var(--txt-h)}
.tm-gsc-adm-wynik .tm-gsc-adm-uw{margin:2px 0 12px}
.tm-gsc-adm-wynik-blad{border-color:#e6c3b0}
.tm-gsc-adm-liczby{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:0 0 12px}
.tm-gsc-adm-liczba{padding:10px 12px;border:1px solid var(--line);border-radius:6px;background:var(--band)}
.tm-gsc-adm-liczba b{display:block;font-size:22px;line-height:1.2;color:var(--txt-h)}
.tm-gsc-adm-liczba span{font-size:12.5px;color:var(--txt-2)}
.tm-gsc-adm-liczba-zle b{color:#b3261e}
.tm-gsc-adm-det{margin:8px 0 0;font-size:13.5px}
.tm-gsc-adm-det summary{cursor:pointer;font-weight:600;padding:4px 0}
.tm-gsc-adm-det ul{margin:6px 0 0;padding-left:18px;line-height:1.55}
.tm-gsc-adm-tech{padding:12px 16px;border:1px solid var(--line);border-radius:8px;background:var(--band)}
.tm-gsc-adm-tech h4{margin:14px 0 4px;font-size:14px}
.tm-gsc-adm-tech p{margin:4px 0;overflow-wrap:anywhere}
.tm-gsc-adm-ostrzezenia{margin:4px 0;padding-left:18px;color:#7a3a1d}
@media(max-width:600px){.tm-gsc-adm-stan,.tm-gsc-adm-wynik{padding:14px}.tm-gsc-adm-stan-glowa h3{font-size:18px}}

/* ===== GSC PANEL =====
   Panel /adm/gsc (idea 411, E4): zakladki, kafle, wykres liniowy (HTML + SVG), tabele, formularze ustawien, telefon.
   Kolory przez zmienne z :root; twarde wartosci tylko w stanach lepiej/gorzej/poziom (te same co blok stanow wyzej).
   Wysokosc .tm-gsc-adm-wykres-plot = GscWykres::H (220), osie Y tej samej wysokosci, etykiety pozycjonowane w %. */
.tm-gsc-adm{min-width:0}
.tm-gsc-adm-pulpit,.tm-gsc-adm-portal,.tm-gsc-adm-alerty-strona,.tm-gsc-adm-mapy-strona,.tm-gsc-adm-uslugi-strona,.tm-gsc-adm-inspekcje,.tm-gsc-adm-dziennik,.tm-gsc-adm-dostep,.tm-gsc-adm-drazenie,.tm-gsc-adm-ustawienia{min-width:0;overflow-wrap:break-word}
.tm-gsc-adm-wymiary{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0 24px}
.tm-gsc-adm h3{margin:0 0 10px;color:var(--txt-h)}
.tm-gsc-adm-menu ul,.tm-gsc-adm-zakladki ul,.tm-gsc-adm-typy ul,.tm-gsc-adm-strony ul{display:flex;flex-wrap:wrap;gap:4px 18px;margin:0;padding:0;list-style:none}
.tm-gsc-adm-menu{margin:0 0 18px;border-bottom:1px solid var(--line)}
.tm-gsc-adm-menu a,.tm-gsc-adm-zakladki a,.tm-gsc-adm-typy a{display:block;padding:8px 2px;border-bottom:3px solid transparent;font:600 14px var(--f-lab);color:var(--txt-2);text-decoration:none}
.tm-gsc-adm-menu a:hover,.tm-gsc-adm-zakladki a:hover,.tm-gsc-adm-typy a:hover{color:var(--loc)}
.tm-gsc-adm-menu a[aria-current],.tm-gsc-adm-zakladki a[aria-current],.tm-gsc-adm-typy a[aria-current]{border-bottom-color:var(--brand-h);color:var(--txt-h)}
.tm-gsc-adm-menu a{margin-bottom:-1px}
.tm-gsc-adm-zakladki,.tm-gsc-adm-typy{margin:0 0 12px}
.tm-gsc-adm-strony{margin:14px 0 0}
.tm-gsc-adm-strony a{display:block;min-width:32px;padding:5px 9px;border:1px solid var(--line);border-radius:6px;font:600 13px var(--f-lab);text-align:center;color:var(--txt);text-decoration:none}
.tm-gsc-adm-strony a[aria-current]{border-color:var(--brand-h);background:var(--brand-h);color:var(--bg)}
.tm-gsc-adm-portal-glowa h2{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.tm-gsc-adm-host{margin:0 0 14px;font-size:13.5px;color:var(--txt-2);overflow-wrap:anywhere}
.tm-gsc-adm-kod{font:600 12px var(--f-lab);letter-spacing:.04em;color:var(--txt-2)}
.tm-gsc-adm-stan-danych,.tm-gsc-adm-komunikat{margin:0 0 16px;font-size:13.5px;color:var(--txt-2)}
.tm-gsc-adm-komunikat{padding:12px 16px;border:1px solid var(--line);border-radius:8px;background:var(--band);font-size:14.5px;color:var(--txt)}
.tm-gsc-adm-alerty{margin:0 0 14px;font-size:14px;font-weight:600}
.tm-gsc-adm-sekcja{margin:0 0 26px;min-width:0}
.tm-gsc-adm-kafle{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:0 0 24px}
.tm-gsc-adm-kafel{min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:var(--bg)}
.tm-gsc-adm-kafel h3{margin:0 0 8px;font:600 12px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-2)}
.tm-gsc-adm-kafel dl{margin:0}
.tm-gsc-adm-kafel dl>div{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 8px;padding:3px 0}
.tm-gsc-adm-kafel dt{font-size:12.5px;color:var(--txt-2)}
.tm-gsc-adm-kafel dd{margin:0;text-align:right}
.tm-gsc-adm-wartosc{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--txt-h)}
.tm-gsc-adm-zmiana{font-size:12.5px;font-variant-numeric:tabular-nums;color:var(--txt-2);white-space:nowrap}
.tm-gsc-adm-znacznik{display:inline-block;padding:0 6px;border-radius:4px;background:var(--band);font:600 11px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--txt-2)}
.tm-gsc-adm-lepiej{color:#2e7d32}
.tm-gsc-adm-gorzej{color:#b3261e}
.tm-gsc-adm-poziom{display:inline-block;padding:1px 8px;border-radius:4px;font:600 11.5px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;background:var(--band);color:var(--txt-2)}
/* kolor tekstu #9a5b00: 5,4:1 na bieli i 4,6:1 na #fbecd2 (AA); poprzedni odcień miał ok. 3,6:1 */
.tm-gsc-adm-poziom-ostrzezenie{background:#fbecd2;color:#9a5b00}
.tm-gsc-adm-poziom-krytyczny{background:#f6dedc;color:#b3261e}
/* wykres: trzy kolumny (os lewa, pole z SVG, os prawa), etykiety osi X pod polem */
.tm-gsc-adm-wykres{--gsc-os:46px;position:relative;margin:0 0 8px;min-width:0}
.tm-gsc-adm-wykres-ramka{display:grid;grid-template-columns:var(--gsc-os) minmax(0,1fr) var(--gsc-os);align-items:start}
.tm-gsc-adm-wykres-plot{position:relative;height:220px;border-bottom:1px solid var(--hair)}
.tm-gsc-adm-wykres-plot svg{display:block;width:100%;height:220px;overflow:visible}
.tm-gsc-adm-wykres-os{position:relative;height:220px;margin:0;padding:0;list-style:none;font-size:11px;line-height:1;font-variant-numeric:tabular-nums;color:var(--txt-2)}
.tm-gsc-adm-wykres-os li{position:absolute;left:0;right:0;transform:translateY(-50%);white-space:nowrap}
.tm-gsc-adm-wykres-os1 li{padding-right:6px;text-align:right}
.tm-gsc-adm-wykres-os2 li{padding-left:6px;text-align:left}
.tm-gsc-adm-wykres-osx{position:relative;height:20px;margin:4px var(--gsc-os) 0;padding:0;list-style:none;font-size:11px;color:var(--txt-2)}
.tm-gsc-adm-wykres-osx li{position:absolute;top:0;white-space:nowrap;transform:translateX(-50%)}
/* ta sama specyficzność co reguła li, inaczej ona nadpisuje wyrównanie pierwszej i ostatniej etykiety */
.tm-gsc-adm-wykres-osx li.tm-gsc-adm-wykres-osx-s{transform:none}
.tm-gsc-adm-wykres-osx li.tm-gsc-adm-wykres-osx-m{transform:translateX(-50%)}
.tm-gsc-adm-wykres-osx li.tm-gsc-adm-wykres-osx-e{transform:translateX(-100%)}
.tm-gsc-adm-wykres-klik,.tm-gsc-adm-wykres-wysw,.tm-gsc-adm-wykres-klik-wst,.tm-gsc-adm-wykres-wysw-wst{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.tm-gsc-adm-wykres-klik{stroke:var(--brand-h);stroke-width:2}
.tm-gsc-adm-wykres-wysw{stroke:var(--txt-2);stroke-width:1.5;stroke-dasharray:5 4}
/* dni wstępne: osobny odcinek przerywany (linia główna kończy się na ostatnim dniu finalnym) */
.tm-gsc-adm-wykres-klik-wst{stroke:var(--brand-h);stroke-width:2;stroke-dasharray:3 3}
.tm-gsc-adm-wykres-wysw-wst{stroke:var(--txt-2);stroke-width:1.5;stroke-dasharray:1 3}
.tm-gsc-adm-wykres-wst{fill:var(--band)}
.tm-gsc-adm-wykres-legenda{display:flex;flex-wrap:wrap;gap:4px 18px;margin:6px 0 0;font-size:12.5px;color:var(--txt-2)}
.tm-gsc-adm-wykres-legenda span::before{content:"";display:inline-block;width:18px;height:0;margin-right:6px;vertical-align:middle;border-top:2px solid var(--txt-2)}
.tm-gsc-adm-wykres-legenda .tm-gsc-adm-wykres-leg-klik::before{border-top-color:var(--brand-h)}
.tm-gsc-adm-wykres-legenda .tm-gsc-adm-wykres-leg-wysw::before{border-top-style:dashed}
.tm-gsc-adm-wykres-legenda .tm-gsc-adm-wykres-leg-wst::before{height:10px;border:1px solid var(--hair);background:var(--band)}
.tm-gsc-adm-wykres-dane{margin:10px 0 0;font-size:13px}
.tm-gsc-adm-wykres-dane summary{cursor:pointer;font-weight:600;padding:4px 0}
.tm-gsc-adm-wykres-dane .tm-gsc-adm-tab{margin-top:6px}
/* tabele: opakowanie przewijane poziomo, liczby wyrownane do prawej */
.tm-gsc-adm-tabwrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.tm-gsc-adm-tabwrap .tm-gsc-adm-tab{min-width:520px}
.tm-gsc-adm-tabwrap-wymiar .tm-gsc-adm-tab{min-width:340px}
.tm-gsc-adm-tab{width:100%;border-collapse:collapse;font-size:13.5px;font-variant-numeric:tabular-nums}
.tm-gsc-adm-tab caption{padding:0 0 6px;text-align:left;font:600 12px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--txt-2)}
.tm-gsc-adm-tab th,.tm-gsc-adm-tab td{padding:7px 10px;border-bottom:1px solid var(--line);text-align:right;vertical-align:top;overflow-wrap:anywhere}
.tm-gsc-adm-tab thead th{background:var(--band);font:600 12px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--txt-2);white-space:nowrap}
.tm-gsc-adm-tab th:first-child,.tm-gsc-adm-tab td:first-child{text-align:left}
.tm-gsc-adm-tab tbody th{font-weight:600;color:var(--txt-h)}
.tm-gsc-adm-tab tbody tr:hover{background:var(--band)}
.tm-gsc-adm-tab-alerty td,.tm-gsc-adm-tab-dziennik td,.tm-gsc-adm-tab-dostep td,.tm-gsc-adm-tab-mapy td,.tm-gsc-adm-tab-uslugi td,.tm-gsc-adm-tab-inspekcje td{text-align:left}
.tm-gsc-adm-tab-inspekcje td:first-child{max-width:28em;overflow-wrap:anywhere}
.tm-gsc-adm-tab-indeks td:first-child{white-space:nowrap}
.tm-gsc-adm-tab a{color:var(--loc)}
.tm-gsc-adm-sort a,.tm-gsc-adm-ranking thead a{color:inherit;text-decoration:none}
.tm-gsc-adm-sort a:hover,.tm-gsc-adm-ranking thead a:hover{color:var(--loc)}
.tm-gsc-adm-tab th[aria-sort] a::after{content:" \25BC";font-size:9px;color:var(--brand-h)}
.tm-gsc-adm-tab th[aria-sort=ascending] a::after{content:" \25B2"}
/* filtry i formularze */
.tm-gsc-adm-filtr{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0 0 14px;font-size:13.5px}
.tm-gsc-adm-filtr label{font-weight:600;color:var(--txt-2)}
.tm-gsc-adm-filtr select,.tm-gsc-adm-filtr input[type=text],.tm-gsc-adm-form select,.tm-gsc-adm-form input[type=number],.tm-gsc-adm-form input[type=text]{max-width:100%;padding:6px 8px;border:1px solid var(--hair);border-radius:6px;background:var(--bg);font:14px var(--f-ui);color:var(--txt)}
.tm-gsc-adm-form{max-width:720px;margin:0 0 20px}
.tm-gsc-adm-grupa{min-width:0;margin:0 0 16px;padding:12px 16px 4px;border:1px solid var(--line);border-radius:8px}
.tm-gsc-adm-grupa legend{padding:0 6px;font:600 13px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-2)}
.tm-gsc-adm-pole{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0 0 12px;padding:2px 0 2px 8px;border-left:3px solid transparent;font-size:14px}
.tm-gsc-adm-pole>label{font-weight:600}
.tm-gsc-adm-pole-blad{border-left-color:#b3261e}
.tm-gsc-adm-pole-blad input,.tm-gsc-adm-pole-blad select{border-color:#b3261e}
.tm-gsc-adm-lista{display:flex;flex-wrap:wrap;gap:4px 14px;margin:0;padding:0;border:0}
.tm-gsc-adm-lista legend{padding:0 10px 0 0;font-weight:600}
.tm-gsc-adm-zakres,.tm-gsc-adm-domyslna,.tm-gsc-adm-zmienione{font-size:12.5px;color:var(--txt-2)}
.tm-gsc-adm-zmienione{color:#9a5b00;font-weight:600}
.tm-gsc-adm-potwierdz,.tm-gsc-adm-pole>label.tm-gsc-adm-potwierdz{display:block;flex-basis:100%;font-size:13px;font-weight:400}
.tm-gsc-adm-form-wiersz{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0}
.tm-gsc-adm-drazenie-cel{margin:0 0 14px;font-size:15px;overflow-wrap:anywhere}
.tm-gsc-adm-z-pamieci{margin:0 0 12px;font-size:12.5px;color:var(--txt-2)}
@media(max-width:600px){
 .tm-gsc-adm-wykres{--gsc-os:38px}
 .tm-gsc-adm-wykres-osx li.tm-gsc-adm-wykres-osx-m{display:none}
 .tm-gsc-adm-wartosc{font-size:18px}
 .tm-gsc-adm-grupa{padding:10px 10px 2px}
 .tm-gsc-adm-tab th,.tm-gsc-adm-tab td{padding:6px 6px}
 .tm-gsc-adm-menu ul{gap:0 14px}
}
/* E6: sekcja Google w /moje-artykuly i ramka Mapa w Google w panelach modułów */
.tm-gsc-int{margin:24px 0}
.tm-gsc-int-uw{color:var(--txt-2);font-size:14px}
.tm-gsc-int-tabwrap{overflow-x:auto}
.tm-gsc-int-tab{width:100%;border-collapse:collapse;font-size:14px}
.tm-gsc-int-tab th,.tm-gsc-int-tab td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:right}
.tm-gsc-int-tab th:first-child,.tm-gsc-int-tab td:first-child{text-align:left}
.tm-gsc-int-wst{font-size:12px;color:#9a5b00}
.tm-gsc-int-h3{font-size:16px;margin:16px 0 8px}
.tm-gsc-int-lista{padding-left:18px;font-size:14px;overflow-wrap:anywhere}
.tm-gsc-int-werdykt{font-weight:600}
.tm-gsc-int-ok{color:#2e7d32}
.tm-gsc-int-ostrzezenie{color:#9a5b00}
.tm-gsc-int-krytyczny{color:#b3261e}
.tm-gsc-int-dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin:8px 0}
.tm-gsc-int-dl div{background:var(--band);padding:8px;border-radius:6px}
.tm-gsc-int-dl dt{font-size:12px;color:var(--txt-2)}
.tm-gsc-int-dl dd{margin:0;font-size:18px;font-weight:600}

/* --- koniec sekcji ostrzeżenia RSO (Zadanie 16/17) --- */

/* ===== ZDROWIE I RODZINA na stronie głównej miasta (pomysł #492, od 2026-10-09) =====
   Belka SOR w nagłówku sekcji (jej reguły stoją w sekcji modułu SOR), a apteka dyżurna to kafel .tm-aptmini wpleciony
   w siatkę artykułów .tm-minis-zdr: dwie komórki w drugim rzędzie, za piątym artykułem puli (order), przed lokalnymi
   Zakupami; na telefonie (2 kolumny) cały wiersz, a dense wciąga Zakupy w dziurę obok piątego artykułu. Wiersz z kaflem
   bywa wyższy niż 3/2 komórki (wąski desktop), więc artykuły tej siatki rozciągają się do wysokości wiersza (jak .tm-zmx).
   Linie kafla nie łamią się (wielokropek) - wysokość stała niezależnie od długości nazw. Zieleń usługi jak w dziale.
   Kolejki NFZ zeszły ze strony głównej, więc dawny rząd .tm-zdrlok zniknął. */
.tm-minis-zdr{grid-auto-flow:row dense}
.tm-minis-zdr>*{order:2}
.tm-minis-zdr>.tm-oc:nth-child(-n+5){order:0}
.tm-minis-zdr>.tm-aptmini{order:1;grid-column:span 2}
.tm-minis-zdr>.tm-oc{align-self:stretch;justify-self:stretch;width:100%}
.tm-aptmini{--zc:#1d7f47;--zt:#eef7f2;--zb:#cde6d8;display:flex;flex-direction:column;justify-content:center;gap:8px;min-width:0;padding:12px 14px;background:var(--zt);border:1px solid var(--zb);border-left:4px solid var(--zc);border-radius:8px}
p.tm-aptmini-h{display:flex;align-items:center;gap:8px;margin:0;min-width:0}
.tm-aptmini-ic{flex:none;display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--zc);color:#fff}
a.tm-aptmini-t{font:700 15px/1.2 var(--f-ui);color:var(--zc);text-decoration:none;white-space:nowrap}
a.tm-aptmini-o{margin-left:auto;font-size:12px;color:var(--txt-2);text-decoration:none;white-space:nowrap}
a.tm-aptmini-o b{color:var(--zc)}
a.tm-aptmini-t:hover,a.tm-aptmini-o:hover,a.tm-aptmini-t:focus-visible,a.tm-aptmini-o:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-aptmini-ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
.tm-aptmini-i{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;column-gap:6px;min-width:0;font-size:12.5px;line-height:1.5;color:var(--txt-2)}
.tm-aptmini-i+.tm-aptmini-i{padding-top:7px;border-top:1px dashed var(--zb)}
.tm-aptmini-i>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-aptmini-l{padding:0 5px;border-radius:3px;background:#fff;font:600 10px/1.6 var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--zc)}
.tm-aptmini-i--teraz .tm-aptmini-l{background:var(--zc);color:#fff}
a.tm-aptmini-n{font-weight:700;font-size:13.5px;color:var(--txt);text-decoration:none}
a.tm-aptmini-n:hover,a.tm-aptmini-n:focus-visible{color:var(--zc);text-decoration:underline}
.tm-aptmini-a{grid-column:1/-1}
/* Zmiksowana siatka strony 1 działu /zdrowie-i-rodzina w mieście (2026-10-07, ext/dzial/zdrowieMix.tpl): artykuły
   i kafle usług w jednym gridzie 3-kolumnowym, dense zatyka dziury po kaflu bez danych. Kafel usługi = kolorowe tło,
   pas z ikoną po lewej i widget w środku bez własnej ramki; --loc przekolorowuje linki i etykiety widgetów na kolor
   usługi: SOR czerwony, apteka zielony, NFZ niebieski. Na tablecie 2 kolumny, na telefonie jedna. */
.tm-zmx{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 16px;grid-auto-flow:row dense;margin:0 0 18px}
.tm-zmx-lead,.tm-zmx-nfz{grid-column:span 2}
/* kafel z aspect-ratio w gridzie domyślnie się nie rozciąga (normal = start) - jawne stretch wyrównuje artykuły
   i materiał otwierający do wysokości kafla usługi w tym samym rzędzie; width:100% i justify-self:stretch są
   konieczne, bo sama wyższa wysokość przeliczała przez proporcję szerokość i kafle nachodziły na sąsiednie */
.tm-zmx>.tm-oc{align-self:stretch;justify-self:stretch;width:100%}
.tm-zmx-info{display:flex;min-width:0;background:var(--zt);border:1px solid var(--zb);border-radius:8px;overflow:hidden;--loc:var(--zc);--loc-bg:#fff;--ac:var(--zc);--ac-dark:var(--zc)}
.tm-zmx-sor{--zc:#c4302b;--zt:#fdf1f0;--zb:#f2d0cd}
.tm-zmx-apt{--zc:#1d7f47;--zt:#eef7f2;--zb:#cde6d8}
.tm-zmx-nfz{--zc:#1d5fa8;--zt:#eff4fb;--zb:#d2e1f2}
.tm-zmx-ic{flex:none;width:40px;display:flex;justify-content:center;align-items:flex-start;padding-top:13px;background:var(--zc);color:#fff}
.tm-zmx-in{flex:1;min-width:0;padding:12px 14px}
.tm-zmx-in>*{margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.tm-zmx-in h3,.tm-zmx-in .tm-locmh{color:var(--zc)}
@media(max-width:880px){.tm-zmx{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.tm-zmx{grid-template-columns:minmax(0,1fr)}.tm-zmx-lead,.tm-zmx-nfz{grid-column:auto}}
/* siatka działu /wydarzenia na portalu miasta (ext/dzial/kulturaMix.tpl, 2026-10-10): kafle weekendu (2 komórki), nowości
   w sprzedaży, rocznicy i zabytku w kolorach kultury; komponent tm-locmod jak apteka w siatce Zdrowia */
.tm-zmx-wyd{--zc:#8f5c0a;--zt:#fdf7ec;--zb:#f0e0c0;grid-column:span 2}
.tm-zmx-now{--zc:#7a4fb0;--zt:#f6f2fb;--zb:#e2d7f0}
.tm-zmx-roc{--zc:#8a6215;--zt:#fbf6ea;--zb:#ecdcb8}
.tm-zmx-zab{--zc:#56683a;--zt:#f3f6ec;--zb:#d9e2c6}
.tm-zmx-in .tm-nowe-p{padding:7px 0}
.tm-zmx-in .tm-nowe-t{font-size:14px}
.tm-zmx-in .tm-nowe-m,.tm-zmx-in .tm-nowe-s{font-size:12.5px}
.tm-wydk-l{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:9px}
.tm-wydk-l li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;align-items:start}
.tm-wydk-l li.tm-wydk-bez{grid-template-columns:minmax(0,1fr)}
.tm-wydk-l img{width:64px;height:48px;object-fit:cover;border-radius:4px;display:block}
.tm-wydk-t{display:block;font:600 14px/1.3 var(--f-ui);color:var(--txt-h);text-decoration:none;overflow-wrap:anywhere}
.tm-wydk-t:hover,.tm-wydk-t:focus-visible{color:var(--zc);text-decoration:underline}
.tm-wydk-l small{display:block;margin-top:2px;font-size:12.5px;line-height:1.35;color:var(--txt-2)}
.tm-wydk-all{font:600 13px var(--f-ui);color:var(--zc);text-decoration:none}
.tm-wydk-all:hover{text-decoration:underline}
.tm-rock-l{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tm-rock-l li{display:flex;flex-direction:column;gap:1px;font-size:13px;line-height:1.35;color:var(--txt-2)}
.tm-rock-l a{font:600 14px/1.3 var(--f-ui);color:var(--txt-h);text-decoration:none}
.tm-rock-l a:hover{color:var(--zc);text-decoration:underline}
.tm-rock-l b{color:var(--zc)}
.tm-zabk{display:block;color:var(--txt-h);text-decoration:none}
.tm-zabk img{display:block;width:100%;max-width:240px;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:6px;margin:0 0 8px}
.tm-zabk b{display:block;font:600 14px/1.3 var(--f-ui)}
.tm-zabk small{display:block;margin-top:2px;font-size:12.5px;color:var(--txt-2)}
.tm-zabk:hover b{color:var(--zc);text-decoration:underline}
@media(max-width:560px){.tm-zmx-wyd{grid-column:auto}}
/* ===== DZIAŁ TURYSTYKA W MIEŚCIE (2026-10-11, ext/dzial/turystykaMix.tpl) =====
   Kafle przewodnika w siatce .tm-zmx: atrakcje w turkusie działu (wiodąca na 2 komórki), pogoda na wyjazd w błękicie,
   okolica w zieleni zabytków na pełny rząd, dojazd w fiolecie na 2 komórki; weekend i zabytek dnia biorą klasy Kultury. */
.tm-zmx-tur{--zc:#0e7f88;--zt:#eef9fa;--zb:#c9eaed}
.tm-zmx-turw{grid-column:span 2}
.tm-zmx-turp{--zc:#2a6fb0;--zt:#eff5fb;--zb:#d2e2f2}
.tm-zmx-turo{--zc:#56683a;--zt:#f3f6ec;--zb:#d9e2c6;grid-column:1/-1}
.tm-zmx-turd{--zc:#5b4a8a;--zt:#f4f2fa;--zb:#dcd6ee;grid-column:span 2}
.tm-tura{display:block;color:var(--txt-h);text-decoration:none}
.tm-tura img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:6px;margin:0 0 8px}
.tm-zmx-turw .tm-tura img{aspect-ratio:16/9}
.tm-tura-e{display:block;font:600 11px/1.4 var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--zc)}
.tm-tura b{display:block;margin-top:2px;font:700 15px/1.3 var(--f-ui)}
.tm-zmx-turw .tm-tura b{font-size:19px}
.tm-tura:hover b,.tm-tura:focus-visible b{color:var(--zc);text-decoration:underline}
.tm-tura-o{margin:8px 0 0;font-size:13.5px;line-height:1.5;color:var(--txt)}
.tm-tura-o a{font-size:12px;color:var(--txt-3)}
.tm-turpog-l{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:8px}
.tm-turpog-l li{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:0 8px;align-items:center;font-size:13.5px}
.tm-turpog-l small{grid-column:2/-1;font-size:12px;color:var(--txt-2)}
.tm-turpog-t{font-weight:700;white-space:nowrap}
.tm-turpog-ai{margin:8px 0 0;font-size:13px;line-height:1.45;color:var(--txt-2)}
.tm-zmx-turp .tm-rzchip{display:inline-flex;margin-top:10px}
.tm-turo-l{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.tm-turo-l a{display:block;color:var(--txt-h);text-decoration:none}
.tm-turo-l img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:5px;margin:0 0 6px}
.tm-turo-l b{display:block;font:600 13.5px/1.3 var(--f-ui)}
.tm-turo-l small{display:block;margin-top:2px;font-size:12px;color:var(--txt-2)}
.tm-turo-l a:hover b,.tm-turo-l a:focus-visible b{color:var(--zc);text-decoration:underline}
.tm-turdoj-p{margin:0 0 6px;font-size:13.5px;line-height:1.5}
.tm-turdoj-p a{color:var(--txt-h)}
.tm-turdoj-p a:hover,.tm-turdoj-p a:focus-visible{color:var(--zc)}
.tm-turdoj-w{white-space:nowrap;font-weight:600}
.tm-dzwydb .tm-turpogb{margin-left:8px}
@media(max-width:880px){.tm-turo-l{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.tm-zmx-turw,.tm-zmx-turd{grid-column:auto}.tm-dzwydb .tm-turpogb{margin:6px 0 0}}
/* boks GUS "Zdrowie i rodzina w liczbach" w kolumnie bocznej działu: podpis grupy wydatków jak etykiety sekcji */
.tm-zgus-h{margin:12px 0 0;padding-top:4px;font:600 11px/1.3 var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-3)}

/* ===== PODATKI I OPLATY W MIESCIE (idea #495): belka sekcji Gospodarka + zestawienie na /gospodarka_biznes =====
   Belka to ten sam element co pasek kursow (.tm-nbp): wlasny uklad i zejscie na osobny wiersz na telefonie
   dziedziczone z .tm-shead .tm-nbp. Tu tylko luzniejszy odstep, bo pozycje maja dluzsze etykiety niz kody walut,
   i kursor pomocy - opis zrodla siedzi w atrybucie title. */
.tm-podatki{gap:4px 16px}
a.tm-podatki{text-decoration:none}
a.tm-podatki:hover b{text-decoration:underline}
.tm-podatki i{font-style:normal;font-size:11px;color:var(--txt-3)}
/* belka w nagłówku sekcji (podatki, sport, SOR) między telefonem a pełnym desktopem schodzi do własnego wiersza
   pod tytułem, jak na telefonie (2026-10-09): przy nowrap w jednym wierszu belka Gospodarki wypychała "więcej"
   poza kolumnę na ekranach węższych niż ok. 1366 px (scrollWidth nagłówka 940 przy 653-909 px) */
@media(min-width:701px) and (max-width:1365px){
 .tm-shead:has(>.tm-podatki){flex-wrap:wrap;row-gap:4px}
 .tm-shead>.tm-podatki{order:9;width:100%;flex-wrap:wrap;gap:4px 16px}
}
/* ===== SPORT W LICZBACH (GUS, 2026-10-07): belka sekcji Sport na SG miasta + boks na /sport =====
   Belka korzysta z .tm-nbp/.tm-podatki (uklad, zejscie na wiersz na telefonie). Boks: duza liczba na mieszkanca,
   pozycja, slupki trendu (wysokosc w % maksimum z modelu GusSport), lista obiektow. */
.tm-sgus-big{font-size:13px;color:var(--txt-2);padding:2px 0 0}
.tm-sgus-big b{display:block;font:700 26px/1.15 var(--f-ui);color:var(--ac,var(--txt-h))}
.tm-sgus-poz{font-size:12.5px;color:var(--txt-2);margin:2px 0 0}
.tm-sgus-tr{display:flex;align-items:flex-end;gap:4px;height:64px;margin:10px 0 2px;padding-bottom:15px;position:relative}
.tm-sgus-sl{flex:1 1 0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.tm-sgus-sl i{display:block;min-height:2px;background:var(--ac,var(--brand));opacity:.35;border-radius:2px 2px 0 0}
.tm-sgus-sl:last-child i{opacity:1}
.tm-sgus-sl small{position:absolute;left:0;right:0;bottom:-15px;font-size:9.5px;line-height:13px;text-align:center;color:var(--txt-3)}
.tm-sgus-tr+.tm-sgus-poz{margin-bottom:6px}
.tm-mwi .tm-sgus-ob{border-bottom:0}
.tm-sgus-obl{list-style:none;margin:0 0 4px;padding:0 0 6px;display:flex;flex-wrap:wrap;gap:2px 12px;font-size:12.5px;color:var(--txt-2);border-bottom:1px solid var(--line)}
.tm-sgus-obl b{color:var(--txt)}
.tm-sgus-brak{color:var(--txt-3)}
/* telefon: belka schodzi do wlasnego wiersza (.tm-shead .tm-nbp) - bez liczby cwiczacych miesci sie w jednym */
@media(max-width:700px){.tm-sgus span:nth-child(3){display:none}}
/* zestawienie pod lekiem dzialu: nazwa grupy jako podpis tabeli, kreski zamiast ramek (reszta strony jest biala) */
.tm-podat{margin:26px 0 8px}
.tm-podat-t{margin:0 0 4px;font:700 20px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-podat-l,.tm-podat-s{margin:0 0 12px;font-size:13px;line-height:1.5;color:var(--txt-2)}
.tm-podtab{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:14px;line-height:1.4;table-layout:fixed}
/* stale szerokosci kolumn, zeby trzy tabele (woda, podatki, odpady) mialy kolumny w jednej linii */
.tm-podtab thead th:nth-child(1){width:25%}
.tm-podtab thead th:nth-child(2){width:18%}
.tm-podtab thead th:nth-child(3){width:13%}
.tm-podtab thead th:nth-child(4){width:12%}
.tm-podtab thead th:nth-child(5){width:13%}
.tm-podtab thead th:nth-child(6){width:19%}
.tm-podtab caption{text-align:left;padding:0 0 6px;font:600 12.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--ac,var(--brand))}
.tm-podtab th,.tm-podtab td{padding:8px 10px 8px 0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;overflow-wrap:break-word}
.tm-podtab thead th{font:600 11.5px var(--f-lab);letter-spacing:.05em;text-transform:uppercase;color:var(--txt-3)}
.tm-podtab tbody th{font-weight:500;color:var(--txt)}
.tm-podtab small{display:block;font-size:11.5px;color:var(--txt-3)}
.tm-podtab td small{display:inline;margin-left:3px}
/* liczba zawsze w jednym kawalku, jednostka (np. "zl/osobe/mies.") moze zawinac sie pod nia i nie wchodzi w sasiednia kolumne */
.tm-podtab .tm-podn b{white-space:nowrap}
.tm-podtab td a{color:var(--ac,var(--brand));text-decoration:none}
.tm-podtab td a:hover{text-decoration:underline}
/* boks "Koszty w mieście" w sidebarze działu Gospodarka (idea #495, etap 2) */
.tm-podbok-r{margin:0 0 8px;font-size:13px;line-height:1.45;color:var(--txt-2)}
.tm-podstrz{display:inline-block;margin-left:4px;font-size:12px;font-weight:600;white-space:nowrap;color:var(--txt-2)}
.tm-podstrz-nizej{color:var(--txt-2)}
@media (max-width:780px){
 /* na telefonie i waskim tablecie mediana, miejsce, data i zrodlo spadaja pod nazwe i stawke (tabela bez poziomego przewijania ani nakladania kolumn) */
 .tm-podtab thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
 .tm-podtab tr{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:8px 0;border-bottom:1px solid var(--line)}
 .tm-podtab th,.tm-podtab td{padding:0;border:0}
 .tm-podtab tbody th{grid-column:1}
 .tm-podtab .tm-podn{grid-column:2;grid-row:1;text-align:right}
 .tm-podtab td:nth-child(n+3){grid-column:1 / -1;font-size:12.5px;color:var(--txt-2)}
 /* pusta mediana i miejsce (pozycje bez porownania) nie zajmuja wiersza na telefonie */
 .tm-podtab .tm-podpusty{display:none}
 .tm-podtab .tm-podmed::before{content:"Mediana kraju: ";color:var(--txt-3)}
 .tm-podtab .tm-podmie::before{content:"Miejsce (od najtańszych): ";color:var(--txt-3)}
 .tm-podtab .tm-podod::before{content:"Obowiązuje od ";color:var(--txt-3)}
}
/* podstrona cen i podatkow miasta (idea #495, etap 2): kafle, kalkulator, wynik */
.tm-podkafle{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:0 0 6px}
.tm-podkafel{background:#fff;border:1px solid var(--line);border-radius:8px;padding:12px 14px}
.tm-podkafel-e{font:600 11.5px var(--f-lab);letter-spacing:.05em;text-transform:uppercase;color:var(--txt-3)}
.tm-podkafel-w{margin:4px 0 6px;font:700 22px/1.2 var(--f-ui);color:var(--txt-h)}
.tm-podkafel-w small{font-size:12px;font-weight:500;color:var(--txt-2)}
.tm-podkafel-m,.tm-podkafel-p{font-size:12.5px;line-height:1.4;color:var(--txt-2)}
.tm-podkal{background:#fff;border:1px solid var(--line);border-radius:8px;padding:14px 16px}
.tm-podkal-pola{display:flex;flex-wrap:wrap;gap:10px 18px;margin:0 0 12px}
.tm-podkal-pola label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--txt-2)}
.tm-podkal-pola input{width:9.5em;max-width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:6px;font-size:15px}
.tm-podkal-w{display:block}
.tm-podwyn{width:100%;border-collapse:collapse;font-size:14px}
.tm-podwyn th,.tm-podwyn td{padding:7px 0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tm-podwyn td{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.tm-podwyn th{font-weight:500;color:var(--txt)}
.tm-podwyn-s th,.tm-podwyn-s td{font-weight:700;border-bottom-width:2px}

/* ===== PANEL PARAFII /user/parafia (idea #482, 2026-10-05) =====
   Panel konta parafii: ext/userParafia.php + smarty/templates/ext/userParafia/*.tpl. Pola, przyciski
   i alerty z compat.css (.form-control, .btn, .alert); tu układ: przełącznik kościoła, zakładki, stany
   sekcji, drogi dostępu, siatki Mszy i przedziałów (tabela dni x pary pól, bez JavaScriptu) i lista
   nabożeństw. Na telefonie wiersz siatki składa się w pionie, pary pól po dwie w rzędzie. */
.tm-pf-kosciol{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:0 0 12px}
.tm-pf-wybor{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0}
.tm-pf-wybor .form-select{width:auto;max-width:100%}
.tm-pf-nav{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px}
.tm-pf-h3{margin:18px 0 8px;font:600 16px/1.3 var(--f-ui);color:var(--txt-h)}
.tm-pf-stanl{margin:0 0 12px}
.tm-pf-stan{display:inline-block;padding:2px 9px;border-radius:999px;font-size:13px;line-height:1.5;background:var(--band);color:var(--txt-2)}
.tm-pf-stan-ok{background:#e6f4ea;color:#1e6b34}
.tm-pf-stan-czeka{background:#fff4d6;color:#6f4e00}
.tm-pf-stan-odrzucona{background:#fde8e7;color:#a12a20}
.tm-pf-stan-brak{background:var(--band);color:var(--txt-2)}
.tm-pf-notatka{display:block;margin-top:4px;font-size:13px;color:var(--txt-2)}
.tm-pf-potw{margin:0 0 18px}
.tm-pf-akcje{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:10px 0}
.tm-pf-akcje form{margin:0}
.tm-pf-sekcje th[scope="row"]{font-weight:600}
.tm-pf-kroki{margin:0 0 14px;padding-left:20px;line-height:1.6}
.tm-pf-regulamin{margin:0 0 20px;padding:16px 18px;border:1px solid var(--line);border-radius:8px;background:var(--band)}
.tm-pf-regulamin .tm-h2k{margin-top:0}
.tm-pf-drogi{display:grid;gap:12px;margin:0 0 20px;padding:0;list-style:none}
.tm-pf-droga{padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:#fff}
.tm-pf-droga .tm-pf-h3{margin-top:0}
.tm-pf-droga-off{background:var(--band)}
.tm-pf-droga-off .tm-pf-h3{color:var(--txt-2)}
.tm-pf-kod{display:inline-block;padding:4px 10px;border-radius:6px;background:var(--band);font-size:15px;letter-spacing:.02em;user-select:all;overflow-wrap:anywhere}
.tm-pf-form{margin:0 0 20px}
.tm-pf-fs{min-width:0;margin:0;padding:0;border:0}
.tm-pf-fs:disabled{opacity:.7}
.tm-pf-czeka{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.tm-pf-wycofaj{margin:0}
.tm-pf-bledy,.tm-pf-obecny{margin:6px 0 0;padding-left:18px}
.tm-pf-bledy{margin-top:0}
.tm-pf-uwagi{margin-top:14px}
.tm-pf-tabela{max-width:100%;overflow-x:auto;margin:0 0 10px}
.tm-pf-siatka{width:100%;border-collapse:collapse}
.tm-pf-siatka th,.tm-pf-siatka td{padding:7px 8px 7px 0;border-bottom:1px solid var(--line);vertical-align:top;text-align:left}
.tm-pf-siatka th{width:170px;font-size:14px;font-weight:600}
.tm-pf-jaknd{display:block;margin-top:4px;font-size:13px;font-weight:400;color:var(--txt-2)}
.tm-pf-sloty{display:flex;flex-wrap:wrap;gap:6px}
.tm-pf-slot{display:flex;flex-direction:column;gap:3px;width:118px}
.tm-pf-slot .form-control,.tm-pf-slot .form-select{width:100%;min-width:0}
.tm-pf-slot-oddo{flex-direction:row;align-items:center;width:auto}
.tm-pf-slot-oddo .form-control{width:104px}
.tm-pf-wak{margin:16px 0 4px}
.tm-pf-nab{margin:0 0 10px;padding-left:22px}
.tm-pf-nabw{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 12px;padding:10px 0;border-bottom:1px solid var(--line)}
.tm-pf-nabp{display:flex;flex-direction:column;min-width:0}
.tm-pf-nabp .form-select{max-width:260px}
.tm-pf-nabdni{display:flex;flex-wrap:wrap;gap:4px 10px;min-width:0;margin:0;padding:0;border:0}
.tm-pf-nabdni legend{float:none;width:100%;margin:0 0 2px}
.tm-pf-dzien{display:inline-flex;align-items:center;gap:3px;font-size:13.5px}
.tm-pf-dzien abbr{text-decoration:none}
@media (max-width:600px){
 .tm-pf-siatka tr{display:block;border-bottom:1px solid var(--line)}
 .tm-pf-siatka th,.tm-pf-siatka td{display:block;width:auto;border-bottom:0}
 .tm-pf-siatka th{padding-bottom:2px}
 .tm-pf-siatka td{padding-top:0}
 .tm-pf-slot{width:calc(50% - 3px)}
 .tm-pf-slot.tm-pf-slot-oddo{width:100%}
}
/* --- koniec sekcji panel parafii (idea #482) --- */

/* ===== MODUŁ SOR (idea #496, 2026-10-06) =====
   Kolejki na szpitalnych oddziałach ratunkowych: strona /zdrowie-i-rodzina/sor/ (korzeń .tm-in.tm-sor: karty oddziałów, tabela grup
   pilności, spis województw na portalu polska, objaśnienie), kafel "SOR teraz" (.tm-sor--kafel na .tm-locmod
   w rzędzie danych miasta sekcji Zdrowie i w boksie bocznym działu zdrowia) oraz boks na podstronie szpitala
   w Ważnych punktach (.tm-sor__boks). Kolory grup jak w konfiguracji modułu: pasek przy nazwie grupy, nazwa koloru
   dla czytników ekranu w tekście ukrytym. Linki zawsze z własną klasą (reguła .tm-pagecard), wysokość linii w em,
   bez ucinania tekstu (polskie znaki). */
.tm-in.tm-sor{padding-bottom:8px}
.tm-sor__bc{margin-bottom:6px}
.tm-sor__bcs{color:var(--txt-3)}
.tm-sor__bca{color:var(--loc);text-decoration:none}
.tm-sor__bca:hover{text-decoration:underline}
.tm-sor__head{margin:0 0 12px}
.tm-sor__head .tm-h1k{margin-left:0}
.tm-sor__lead{margin:6px 0 0;font-size:15px;line-height:1.55em;color:var(--txt-2)}
.tm-sor__112{margin:0 0 18px;padding:10px 14px;border-left:4px solid #c62828;border-radius:6px;background:#fdecef;font-size:15px;line-height:1.5em;color:#7f1d1d}
.tm-sor__112 strong{color:#a3123a}
.tm-sor__sec{margin:0 0 22px}
.tm-sor__h2{margin:0 0 10px;font:700 19px/1.3em var(--f-ui);color:var(--txt-h)}
.tm-sor__opis{margin:0 0 10px;font-size:14.5px;line-height:1.6em;color:var(--txt)}
.tm-sor__pusto{padding:14px 16px;border:1px dashed var(--line);border-radius:8px;background:var(--band)}
.tm-sor__karta{margin:0 0 14px;padding:14px 16px;border:1px solid var(--line);border-left:3px solid var(--loc);border-radius:8px;background:#fff}
.tm-sor__nazwa{margin:0 0 4px;font:700 16.5px/1.35em var(--f-ui);color:var(--txt-h)}
.tm-sor__nazwa-a{color:var(--loc);text-decoration:none}
.tm-sor__nazwa-a:hover{text-decoration:underline}
.tm-sor__adres,.tm-sor__tel,.tm-sor__odl{margin:0 0 4px;font-size:14px;line-height:1.5em;color:var(--txt-2)}
.tm-sor__doj,.tm-sor__tel-a,.tm-sor__miasto-a,.tm-sor__zr-a{color:var(--loc);text-decoration:underline}
.tm-sor__doj{margin-left:6px;font-weight:600}
.tm-sor__liczby{display:flex;flex-wrap:wrap;gap:6px 18px;margin:10px 0 6px;font-size:14.5px;line-height:1.4em;color:var(--txt)}
.tm-sor__liczba{white-space:nowrap}
.tm-sor__v{font-size:20px;font-weight:700;color:var(--txt-h)}
.tm-sor__najd{margin:0 0 8px;font-size:14px;line-height:1.5em;color:var(--txt-2)}
.tm-sor__brak{margin:10px 0 0;padding:8px 10px;border-radius:6px;background:var(--band);font-size:14px;line-height:1.5em;color:var(--txt-2)}
.tm-sor__stan{margin:6px 0 0;font:600 11.5px/1.4em var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-3)}
.tm-sor__grupy{width:100%;margin:6px 0 4px;border-collapse:collapse;font-size:14px;line-height:1.4em}
.tm-sor__gth{padding:6px 8px 6px 0;border-bottom:1px solid var(--line);font:600 11.5px/1.3em var(--f-lab);letter-spacing:.05em;text-transform:uppercase;text-align:right;color:var(--txt-3)}
.tm-sor__gth--l{text-align:left}
.tm-sor__gw{border-bottom:1px solid var(--line)}
.tm-sor__gn{padding:6px 8px 6px 0;font-weight:500;text-align:left;color:var(--txt)}
.tm-sor__gl{padding:6px 8px;text-align:right;font-weight:700;color:var(--txt-h)}
.tm-sor__gc{padding:6px 0 6px 8px;text-align:right;color:var(--txt-2)}
.tm-sor__kol{display:inline-block;width:10px;height:10px;margin-right:7px;border-radius:2px;vertical-align:baseline;background:#7a8291}
.tm-sor__kol--szary{background:#7a8291}
.tm-sor__kol--czerwony{background:#c62828}
.tm-sor__kol--pomaranczowy{background:#ef6c00}
.tm-sor__kol--zolty{background:#f2b705}
.tm-sor__kol--zielony{background:#2e7d32}
.tm-sor__kol--niebieski{background:#1565c0}
.tm-sor__info{padding:14px 16px;border:1px solid var(--loc-line);border-radius:8px;background:var(--loc-bg)}
.tm-sor__legenda{margin:0 0 10px;padding:0;list-style:none}
.tm-sor__leg{margin:0 0 4px;font-size:14px;line-height:1.5em;color:var(--txt)}
.tm-sor__leg-n{font-weight:600}
.tm-sor__zrodlo{margin:10px 0 0;padding-top:8px;border-top:1px solid var(--loc-line)}
.tm-sor__zrodlo-p{margin:8px 0 0;font-size:12.5px;line-height:1.5em;color:var(--txt-3)}
.tm-sor__spis{margin:0;padding:0;list-style:none}
.tm-sor__poz{display:flex;flex-wrap:wrap;gap:2px 12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px;line-height:1.45em}
.tm-sor__poz-n{flex:1 1 280px;font-weight:600;color:var(--txt-h)}
.tm-sor__poz-m{flex:0 1 160px;color:var(--txt-2)}
.tm-sor__poz-v{flex:1 1 100%;color:var(--txt-2)}
.tm-sor__komunikat{padding:18px 20px}
.tm-sor__komunikat .tm-sor__112{margin:12px 0}
.tm-sor__wiecej-p{margin:12px 0 0}
.tm-sor__btn{display:inline-block;padding:9px 16px;border:1px solid var(--loc);border-radius:6px;background:var(--loc);font-size:13.5px;font-weight:600;line-height:1.4em;color:#fff;text-decoration:none}
.tm-sor__btn:hover{background:var(--dark);border-color:var(--dark)}
/* kafel "SOR teraz": ramkę i szerokość w rzędzie danych miasta daje .tm-locmod, w boksie bocznym działu ramka znika */
.tm-sor--kafel{display:flex;flex-direction:column}
.tm-sor--kafel .tm-sor__v{font-size:17px}
.tm-sor--kafel .tm-sor__liczby{margin:4px 0}
.tm-sor__kh{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:0 0 6px}
.tm-sor__kt{margin:0;font:700 15px/1.3em var(--f-ui);color:var(--txt-h)}
.tm-sor__kteraz{font:600 11px/1.3em var(--f-lab);letter-spacing:.12em;text-transform:uppercase;color:#c62828}
.tm-sor__kn-p{margin:0 0 4px;font-size:14px;line-height:1.4em}
.tm-sor__kn{color:var(--loc);font-weight:600;text-decoration:none}
a.tm-sor__kn:hover{text-decoration:underline}
.tm-sor__kl{margin:4px 0 0;padding:0;list-style:none}
.tm-sor__ki{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 10px;padding:5px 0;border-bottom:1px dashed var(--line);font-size:13.5px;line-height:1.4em}
.tm-sor__kv{color:var(--txt-2)}
.tm-sor__kr{margin:6px 0 0;font-size:13px;line-height:1.4em;color:var(--txt-2)}
.tm-sor__112k{margin:10px 0 0;font-size:13px;line-height:1.45em;color:#a3123a}
.tm-sor__kf{display:flex;flex-direction:column;gap:4px;margin:auto 0 0;padding-top:10px}
.tm-sor__kw{color:var(--loc);font-weight:600;text-decoration:none}
.tm-sor__kw:hover{text-decoration:underline}
.tm-sor__kz{font-size:11.5px;line-height:1.45em;color:var(--txt-3)}
.tm-sor__kzl{color:var(--txt-2);text-decoration:underline}
/* SOR dla dzieci: dopisek przy nazwie (kafel, karta, spis) i wiersz w boksie szpitala; drugi oddział pod kaflem */
.tm-sor__dz{display:inline-block;margin-left:4px;padding:1px 6px;border-radius:4px;background:var(--loc-bg);font:600 11px/1.4em var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--loc);white-space:nowrap;vertical-align:middle}
.tm-sor__dzp{margin:0 0 6px}
.tm-sor__dzp .tm-sor__dz{margin-left:0}
.tm-sor__dod{margin:10px 0 0;padding-top:8px;border-top:1px dashed var(--line)}
.tm-sor__dod-h{margin:0 0 4px;font:600 11.5px/1.4em var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-3)}
/* boks "Kolejka na SOR teraz" na podstronie szpitala (sekcja #sor Ważnych punktów): kilka oddziałów jeden pod drugim */
.tm-sor__boks{margin:0 0 12px}
.tm-sor__boks+.tm-sor__boks{padding-top:12px;border-top:1px dashed var(--line)}
/* etap 2 (2026-10-07): analizy, wykresy doby (inline SVG koloruje wyłącznie CSS przez zmienne), paski grup pilności,
   sekcje stałe "Jak działa SOR", FAQ i "Jak liczymy"; zmienne na korzeniu .tm-sor (strona, kafel, boks szpitala) */
.tm-sor{--sor-wykres:#7f9cc0;--sor-wykres-teraz:#1f4e85;--sor-wykres-wasy:#3d4652;--sor-wykres-luka:#b8bfca;--sor-g-p1:#c62828;--sor-g-p2:#ef6c00;--sor-g-p3:#f2b705;--sor-g-p4:#2e7d32;--sor-g-p5:#1565c0;--sor-g-szary:#7a8291}
.tm-sor__112d{margin:-10px 0 18px;font-size:14px;line-height:1.5em;color:#7f1d1d}
.tm-sor__pozost,.tm-sor__przed,.tm-sor__t4{margin:0 0 6px;font-size:14px;line-height:1.5em;color:var(--txt-2)}
.tm-sor__t4{font-style:italic}
.tm-sor__pasek{margin:6px 0 10px}
.tm-sor__pasek-p{margin:0 0 4px;font-size:13.5px;line-height:1.45em;color:var(--txt-2)}
.tm-sor__pasek-s{display:flex;width:100%;border-radius:4px;background:var(--band)}
.tm-sor__seg{display:flex;flex:0 1 auto;align-items:center;justify-content:center;min-width:1.8em;padding:2px 0;font:700 12.5px/1.5em var(--f-ui);color:#fff}
.tm-sor__seg:first-child{border-radius:4px 0 0 4px}
.tm-sor__seg:last-child{border-radius:0 4px 4px 0}
.tm-sor__seg--czerwony{background:var(--sor-g-p1)}
.tm-sor__seg--pomaranczowy{background:var(--sor-g-p2);color:#1a1a1a}
.tm-sor__seg--zolty{background:var(--sor-g-p3);color:#1a1a1a}
.tm-sor__seg--zielony{background:var(--sor-g-p4)}
.tm-sor__seg--niebieski{background:var(--sor-g-p5)}
.tm-sor__seg--szary{background:var(--sor-g-szary)}
.tm-sor__seg-l{white-space:nowrap}
.tm-sor__trend{margin:10px 0 4px}
.tm-sor__trend-p,.tm-sor__p2{margin:0 0 6px;font-size:14px;line-height:1.5em;color:var(--txt)}
.tm-sor__p2{font-weight:600}
.tm-sor__trend-l{display:block;width:100%;max-width:240px;height:36px}
.tm-sor__trend-o{fill:none;stroke:var(--sor-wykres-teraz);stroke-width:2;vector-effect:non-scaling-stroke}
.tm-sor__analizy{padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:#fff}
.tm-sor__t7,.tm-sor__p3,.tm-sor__p1,.tm-sor__p4,.tm-sor__p8,.tm-sor__p11{margin:0 0 8px;font-size:14.5px;line-height:1.55em;color:var(--txt)}
.tm-sor__podpis{margin:0 0 10px;font-size:12.5px;line-height:1.5em;color:var(--txt-3)}
.tm-sor__dopisek{margin:10px 0 0;padding:8px 10px;border-radius:6px;background:#fdecef;font-size:13.5px;line-height:1.5em;color:#7f1d1d}
.tm-sor__fig{margin:4px 0 10px;padding:0 14px}
.tm-sor__fig--mini{max-width:240px;margin:6px 0;padding:0}
.tm-sor__wykres{display:block;width:100%;height:120px}
.tm-sor__wykres--mini{height:40px}
.tm-sor__slupek{fill:var(--sor-wykres)}
.tm-sor__slupek--teraz{fill:var(--sor-wykres-teraz);stroke:var(--txt-h);stroke-width:1;vector-effect:non-scaling-stroke}
.tm-sor__luka{fill:var(--sor-wykres-luka)}
.tm-sor__luka--zamr{fill:var(--sor-g-szary)}
.tm-sor__was{stroke:var(--sor-wykres-wasy);stroke-width:1.5;vector-effect:non-scaling-stroke}
.tm-sor__osie{position:relative;height:2.8em;margin:2px 0 0;padding:0;list-style:none;font:500 11px/1.3em var(--f-lab);color:var(--txt-3)}
.tm-sor__os{position:absolute;top:0;transform:translateX(-50%);white-space:nowrap}
.tm-sor__os--teraz{top:1.4em;transform:translateX(-100%);font-weight:700;color:var(--sor-wykres-teraz)}
.tm-sor__tab{max-width:100%;overflow-x:auto}
.tm-sor__p8t{width:100%;margin:0 0 8px;border-collapse:collapse;font-size:13.5px;line-height:1.4em}
.tm-sor__p8t .tm-sor__gc{text-align:left}
.tm-sor__analiza{margin:10px 0 0;padding-top:8px;border-top:1px dashed var(--line)}
.tm-sor__klin{margin:4px 0 0;font-size:13.5px;line-height:1.45em;color:var(--txt-2)}
.tm-sor__det{margin:0 0 8px;padding:8px 12px;border:1px solid var(--line);border-radius:6px;background:#fff}
.tm-sor__sum{cursor:pointer;font:600 14.5px/1.45em var(--f-ui);color:var(--txt-h)}
.tm-sor__det[open]>.tm-sor__sum{margin-bottom:8px}
.tm-sor__doba-d .tm-sor__fig{padding:0}
.tm-sor__faq .tm-sor__h2,.tm-sor__linki .tm-sor__h2{font-size:17px}
.tm-sor__faq-d .tm-sor__opis{margin:0}
.tm-sor__kroki,.tm-sor__lista{margin:0 0 10px;padding-left:22px;font-size:14px;line-height:1.55em;color:var(--txt)}
.tm-sor__przeg{margin:0;font-size:12.5px;line-height:1.5em;color:var(--txt-3)}
.tm-sor__region{padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:var(--band)}
.tm-sor__kraj .tm-sor__licznik{margin:0 0 4px;font:700 17px/1.4em var(--f-ui);color:var(--txt-h)}
.tm-sor__licznik{margin:0 0 4px}
.tm-sor__wojn{margin:-6px 0 8px;font:600 11.5px/1.4em var(--f-lab);letter-spacing:.05em;text-transform:uppercase;color:var(--txt-3)}
.tm-sor__link{color:var(--loc);font-weight:600;text-decoration:underline}
.tm-sor__linki-l{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0;padding:0;list-style:none}
.tm-sor__linki-i{font-size:14px;line-height:1.5em}
@media (max-width:700px){
 .tm-sor__karta{padding:12px 13px}
 .tm-sor__v{font-size:18px}
 .tm-sor__poz-m{flex-basis:100%}
}
@media (max-width:600px){
 /* tabela grup na telefonie mieści się bez przewijania: mniejsze odstępy i czcionka */
 .tm-sor__grupy{font-size:13px}
 .tm-sor__gn,.tm-sor__gth{padding-right:4px}
 .tm-sor__gl{padding:6px 4px}
 .tm-sor__gc{padding-left:4px}
 .tm-sor__112{padding:9px 11px;font-size:14px}
 /* wykresy i paski: niższe słupki, ciaśniejsze etykiety osi, karty analiz z mniejszym marginesem */
 .tm-sor__wykres{height:96px}
 .tm-sor__fig{padding:0 10px}
 .tm-sor__osie{font-size:10.5px}
 .tm-sor__analizy,.tm-sor__region{padding:12px 13px}
 .tm-sor__seg{font-size:12px}
}
/* belka "SOR teraz" w nagłówku sekcji Zdrowie i Rodzina na stronie głównej miasta (NT3sorBelka, 2026-10-09): wygląd
   pozycji z .tm-nbp/.tm-podatki, w linii obok tytułu (poniżej 1366 px we własnym wierszu - reguła belek .tm-podatki).
   Belka może się kurczyć, a długi wariant (najbliższy SOR, kilka oddziałów) zawija pozycje w obrębie belki zamiast
   wypychać "więcej" poza kolumnę; bez ucinania (overflow ścina kreski nad Ś/Ź) */
.tm-shead>.tm-sorb{flex:0 1 auto;min-width:0;flex-wrap:wrap;row-gap:0}
.tm-sorb .tm-sorb-stan i{font-size:11px}
/* belka "W ten weekend" w nagłówku sekcji Kultura na SG miasta i pod leadem działu /wydarzenia (NT3wydarzeniaBelka,
   2026-10-10) - wygląd belki SOR */
.tm-shead>.tm-wydb{flex:0 1 auto;min-width:0;flex-wrap:wrap;row-gap:0}
.tm-wydb .tm-wydb-n i{font-size:11px}
.tm-dzwydb{margin:10px 0 0}
.tm-dzwydb .tm-wydb{display:inline-flex}
/* SG portalu polska (2026-10-12): sor */
/* belka "SOR w Polsce" w nagłówku sekcji Zdrowie SG portalu polska (NT3sorBelkaKraj, 2026-10-12) - korzysta
   w całości z belki SOR miasta (.tm-nbp/.tm-podatki/.tm-sorb: układ w linii tytułu, zawijanie, poniżej 1366 px
   i na telefonie własny wiersz z reguł .tm-shead .tm-nbp / .tm-shead>.tm-podatki). Tu tylko: dopisek
   "dane z N kolejek, stan na" nie łamie się w środku, a na wąskim telefonie schodzi pod liczby. */
.tm-sorbk .tm-sorb-stan i{white-space:nowrap}
@media (max-width:480px){
 .tm-shead>.tm-sorbk .tm-sorb-stan{flex-basis:100%}
}

/* --- koniec sekcji SOR (idea #496) --- */

/* =====================================================================================
   MODUŁ DODAJ WYDARZENIE (pomysł #443, 2026-10-08)
   Kreator /dodaj-wydarzenie/ (smarty/templates/ext/dodajWydarzenie/*.tpl, ext/dodajWydarzenie.php) i skrypt
   www/theme/3/js/tmZgloszenie.js. Bez JS wszystkie kroki stoją jeden pod drugim i formularz wysyła zwykły POST;
   klasa .tm-dodw--js na formularzu (dokłada ją skrypt) włącza tryb kroków: pasek postępu, nawigacja, ukryte kroki.
   Korzeń .tm-dodw, klasy BEM .tm-dodw__element i --modyfikator. Linki zawsze z własną klasą (reguła .tm-pagecard
   barwi linki bez klasy), wysokość linii w em, bez ucinania tekstu (polskie znaki). Pola na telefonie na całą
   szerokość, żadnego przewijania w poziomie. Test TmZgloszenieJsTest pilnuje reguły dla każdej klasy z JS.
   ===================================================================================== */
.tm-dodw{padding-top:14px}
.tm-dodw__form{max-width:760px}
.tm-dodw__opis{margin:0 0 14px;font-size:15px;line-height:1.55em;color:var(--txt-2)}
.tm-dodw__komunikat{margin:0 0 16px;padding:10px 14px;border-left:4px solid var(--loc);border-radius:6px;background:var(--loc-bg);font-size:15px;line-height:1.5em;color:var(--txt)}
.tm-dodw__komunikat[hidden]{display:none}
.tm-dodw__komunikat--blad{border-left-color:#c62828;background:#fdecef;color:#7f1d1d}
.tm-dodw__komunikat--ok{border-left-color:var(--ok);background:#ecf7f1;color:#1d5c3d}
.tm-dodw__komunikat:focus{outline:2px solid var(--loc);outline-offset:2px}
.tm-dodw__szkic-b{margin-left:4px;padding:0;border:0;background:none;font:inherit;color:var(--loc);text-decoration:underline;cursor:pointer}
/* pasek postępu: bez JS ukryty (kroki widać wszystkie naraz) */
.tm-dodw__pasek{display:none;margin:0 0 18px;padding:0;list-style:none;counter-reset:dodw}
.tm-dodw--js .tm-dodw__pasek{display:flex;gap:6px}
.tm-dodw__pasek-i{flex:1 1 0;min-width:0;counter-increment:dodw;padding-top:6px;border-top:4px solid var(--line);font:600 13px/1.35em var(--f-ui);color:var(--txt-2)}
.tm-dodw__pasek-i[aria-current="step"]{border-top-color:var(--brand);color:var(--txt-h)}
.tm-dodw__pasek-i.is-done{border-top-color:var(--brand-l)}
.tm-dodw__pasek-b{display:block;width:100%;padding:0;border:0;background:none;font:inherit;line-height:1.35em;color:inherit;text-align:left;cursor:pointer;overflow-wrap:anywhere}
.tm-dodw__pasek-b::before{content:counter(dodw) ". "}
.tm-dodw__pasek-b:disabled{cursor:default;color:var(--txt-3)}
.tm-dodw__pasek-b:focus-visible{outline:2px solid var(--loc);outline-offset:2px}
/* kroki */
.tm-dodw__krok{min-width:0;margin:0 0 26px;padding:0;border:0}
.tm-dodw__krok[hidden]{display:none}
.tm-dodw__legend{margin:0 0 12px;padding:0;font:700 19px/1.3em var(--f-ui);color:var(--txt-h)}
.tm-dodw__legend:focus{outline:none}
.tm-dodw__pole{margin:0 0 14px}
.tm-dodw__label{display:block;margin:0 0 4px;font-weight:600;font-size:14px;line-height:1.4em;color:var(--txt-h)}
.tm-dodw__pomoc{margin:4px 0 0;font-size:13px;line-height:1.45em;color:var(--txt-2)}
.tm-dodw__input{display:block;box-sizing:border-box;width:100%;max-width:100%;padding:9px 11px;border:1px solid var(--hair);border-radius:6px;background:#fff;font:15px/1.4em var(--f-ui);color:var(--txt)}
textarea.tm-dodw__input{min-height:150px;resize:vertical}
.tm-dodw__input:focus{border-color:var(--loc);outline:2px solid var(--loc-line);outline-offset:0}
.tm-dodw__input[aria-invalid="true"]{border-color:#c62828}
.tm-dodw__blad{margin:5px 0 0;font-size:13.5px;line-height:1.45em;color:#b3261e}
.tm-dodw__blad[hidden]{display:none}
.tm-dodw__licznik{margin:4px 0 0;font-size:12.5px;line-height:1.4em;color:var(--txt-3);text-align:right}
.tm-dodw__wiersz{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.tm-dodw__wybor{display:flex;align-items:flex-start;gap:8px;margin:0 0 8px;font-size:15px;line-height:1.45em}
.tm-dodw__wybor input{flex:0 0 auto;margin-top:.2em}
/* terminy i seria */
.tm-dodw__termin{margin:0 0 10px;padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--band)}
.tm-dodw__termin[hidden],.tm-dodw__do[hidden]{display:none}
.tm-dodw__termin-usun{margin-top:8px;padding:0;border:0;background:none;font:inherit;font-size:13.5px;color:#b3261e;text-decoration:underline;cursor:pointer}
.tm-dodw__termin-usun[hidden]{display:none}
.tm-dodw__dodaj{margin:0 0 14px;padding:8px 14px;border:1px dashed var(--loc);border-radius:999px;background:#fff;font:600 14px/1.3em var(--f-ui);color:var(--loc);cursor:pointer}
.tm-dodw__dodaj:disabled{border-color:var(--hair);color:var(--txt-3);cursor:not-allowed}
.tm-dodw__dodaj[hidden]{display:none}
.tm-dodw__seria{margin:8px 0 0;padding:0 0 0 18px;font-size:14px;line-height:1.5em}
.tm-dodw__seria-i{margin:0 0 2px}
.tm-dodw__seria-i--limit{list-style:none;margin-left:-18px;color:#8a5a00}
/* podpowiedź: podobne wydarzenie już jest w kalendarzu */
.tm-dodw__podobne{margin:0 0 14px;padding:10px 14px;border-left:4px solid #b26a00;border-radius:6px;background:#fff6e5;font-size:14px;line-height:1.5em;color:var(--txt)}
.tm-dodw__podobne[hidden]{display:none}
.tm-dodw__podobne-h{margin:0 0 6px;font-weight:600;color:var(--txt-h)}
.tm-dodw__podobne-l{margin:0 0 6px;padding:0 0 0 18px}
.tm-dodw__podobne-i{margin:0 0 3px}
.tm-dodw__podobne-a{font-weight:600;color:var(--loc);text-decoration:underline;overflow-wrap:anywhere}
.tm-dodw__podobne-o{margin:0;color:var(--txt-2)}
/* miejsce: podpowiedzi i mapa */
.tm-dodw__podp{position:relative;z-index:5;margin:2px 0 0;padding:4px 0;border:1px solid var(--hair);border-radius:6px;background:#fff;box-shadow:0 8px 20px -10px rgba(0,0,0,.35);list-style:none;max-height:280px;overflow-y:auto}
.tm-dodw__podp[hidden]{display:none}
.tm-dodw__podp-o{padding:7px 11px;cursor:pointer;line-height:1.4em}
.tm-dodw__podp-o[aria-selected="true"],.tm-dodw__podp-o:hover{background:var(--loc-bg)}
.tm-dodw__podp-n{display:block;font-weight:600;color:var(--txt-h)}
.tm-dodw__podp-a{display:block;font-size:13px;color:var(--txt-2)}
.tm-dodw__info{margin:5px 0 0;font-size:13.5px;line-height:1.45em;color:var(--txt-2)}
.tm-dodw__info[hidden]{display:none}
.tm-dodw__mapa{height:320px;margin:10px 0 0;border:1px solid var(--line);border-radius:8px;background:var(--band)}
.tm-dodw__mapa--blad{display:flex;align-items:center;justify-content:center;height:auto;min-height:60px;padding:12px;font-size:14px;line-height:1.45em;color:var(--txt-2);text-align:center}
.tm-dodw__pin{background:none;border:0}
.tm-dodw__pin-i{display:block;width:26px;height:26px;border:2px solid #fff;border-radius:50% 50% 50% 0;box-shadow:0 2px 6px rgba(0,0,0,.4);transform:rotate(-45deg)}
.tm-dodw__pin:focus-visible .tm-dodw__pin-i{outline:3px solid var(--loc);outline-offset:2px}
.tm-dodw__pop{font-size:14px;line-height:1.4em;font-weight:600}
/* zdjęcie i kadr */
.tm-dodw__zdj-a{display:inline-block;margin:8px 0 0}
.tm-dodw__zdj-a[hidden]{display:none}
.tm-dodw__zdj{display:block;max-width:240px;height:auto;border-radius:6px;border:1px solid var(--line)}
.tm-dodw__kadr{margin:10px 0 0}
.tm-dodw__kadr[hidden]{display:none}
.tm-dodw__canvas{display:block;max-width:100%;height:auto;border-radius:6px;cursor:move;touch-action:none}
.tm-dodw__canvas:focus-visible{outline:3px solid var(--loc);outline-offset:2px}
/* podsumowanie i wysyłka */
.tm-dodw__podsum{margin:0 0 16px}
.tm-dodw__podsum-h{margin:14px 0 6px;font:700 16px/1.3em var(--f-ui);color:var(--txt-h)}
.tm-dodw__podsum-dl{display:grid;grid-template-columns:minmax(120px,32%) 1fr;gap:4px 12px;margin:0;font-size:14px;line-height:1.45em}
.tm-dodw__podsum-dl dt{color:var(--txt-2)}
.tm-dodw__podsum-dl dd{margin:0;color:var(--txt);overflow-wrap:anywhere;white-space:pre-line}
.tm-dodw__zgody{margin:14px 0;padding:12px;border:1px solid var(--line);border-radius:8px}
.tm-dodw__nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.tm-dodw__btn{padding:10px 18px;border:0;border-radius:999px;background:var(--loc);font:600 14px/1.3em var(--f-ui);color:#fff;cursor:pointer}
.tm-dodw__btn:hover{filter:brightness(1.1)}
.tm-dodw__btn--wstecz{background:#fff;border:1px solid var(--hair);color:var(--txt)}
.tm-dodw__wyslij{margin-top:14px}
.tm-dodw__wyslij.is-wait{opacity:.6;cursor:progress}
/* linki, podgląd, stany zgłoszeń, tabela Moje, pułapka antyspamowa (strony Moje, propozycja, podgląd, formularz) */
.tm-dodw__link{color:var(--loc);font-weight:600;text-decoration:underline;overflow-wrap:anywhere}
.tm-dodw__link:hover{filter:brightness(.85)}
a.tm-dodw__btn{display:inline-block;text-decoration:none}
.tm-dodw__podglad{margin:0 0 22px;padding:14px;border:1px dashed var(--hair);border-radius:8px;background:var(--band)}
.tm-dodw__pu{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.tm-dodw__tabela{width:100%;margin:0 0 16px;border-collapse:collapse;font-size:14.5px;line-height:1.45em}
.tm-dodw__tabela th{padding:8px 10px;border-bottom:2px solid var(--line);font-weight:700;text-align:left;color:var(--txt-h)}
.tm-dodw__tabela td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}
.tm-dodw__stan{display:inline-block;padding:2px 9px;border-radius:999px;background:var(--band);font-size:13px;font-weight:600;line-height:1.5em;color:var(--txt)}
.tm-dodw__stan--opublikowane{background:#ecf7f1;color:#1d5c3d}
.tm-dodw__stan--odrzucone,.tm-dodw__stan--spam{background:#fdecef;color:#7f1d1d}
.tm-dodw__stan--czeka_na_srodki,.tm-dodw__stan--do_wyjasnienia{background:#fff6e5;color:#6b4500}
.tm-dodw__stan--duplikat,.tm-dodw__stan--wycofane{background:var(--band);color:var(--txt-2)}
@media(max-width:600px){
 .tm-dodw__pasek-i{font-size:12px}
 .tm-dodw__podsum-dl{grid-template-columns:1fr}
 .tm-dodw__podsum-dl dd{margin-bottom:6px}
 .tm-dodw__mapa{height:260px}
}
/* --- koniec sekcji dodaj wydarzenie (pomysł #443) --- */
/* --- PANEL PROPOZYCJI WYDARZEŃ /adm/wydarzenia (pomysł #443, 2026-10-08; ext/admWydarzenia/*.tpl) - wzór reguł .tm-rz-adm-* --- */
.tm-wydp-adm{max-width:1100px}
.tm-wydp-adm-h{margin:0 0 14px}
.tm-wydp-adm-h3{margin:0 0 6px;font-size:22px;color:var(--txt-h)}
.tm-wydp-adm-h4{margin:0 0 10px;font:600 15px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--txt-2)}
.tm-wydp-adm-p{margin:0 0 12px;font-size:14px;line-height:1.5}
.tm-wydp-adm-komunikat{margin:0 0 14px;font-size:15px}
.tm-wydp-adm-nav{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 18px}
.tm-wydp-adm-nav__a{display:inline-block;padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font:600 12.5px var(--f-lab);color:var(--txt-2);text-decoration:none}
.tm-wydp-adm-nav__a:hover{border-color:var(--loc);color:var(--loc)}
.tm-wydp-adm-nav__a[aria-current]{border-color:var(--loc);background:var(--loc);color:#fff}
.tm-wydp-adm-odznaka{display:inline-block;min-width:18px;margin-left:4px;padding:0 6px;border-radius:999px;background:#b3261e;color:#fff;font:600 11px var(--f-lab);text-align:center}
.tm-wydp-adm-nav__a[aria-current] .tm-wydp-adm-odznaka{background:#fff;color:var(--loc)}
.tm-wydp-adm-baner{margin:0 0 16px;padding:10px 14px;border:1px solid #ecd9a6;border-radius:8px;background:#fff8e6;color:#6b4a00;font-size:14px}
.tm-wydp-adm-flash{margin:0 0 16px;padding:10px 14px;border:1px solid #bfe0c8;border-radius:8px;background:#f1faf3;color:#1f5f34;font-size:14px}
.tm-wydp-adm-flash--success{border-color:#bfe0c8;background:#f1faf3;color:#1f5f34}
.tm-wydp-adm-flash--warning{border-color:#ecd9a6;background:#fff8e6;color:#6b4a00}
.tm-wydp-adm-flash--danger{border-color:#e6c3b0;background:#fbf2ec;color:#7a3a1d}
.tm-wydp-adm-filtr{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 14px;margin:0 0 14px}
.tm-wydp-adm-form{display:block;margin:0 0 14px}
.tm-wydp-adm-l{display:block;margin:0 0 10px;font-size:13.5px;color:var(--txt-2)}
.tm-wydp-adm-filtr .tm-wydp-adm-l{margin:0}
.tm-wydp-adm-l input[type=text],.tm-wydp-adm-l input[type=url],.tm-wydp-adm-l input[type=number],.tm-wydp-adm-l input[type=date],.tm-wydp-adm-l select,.tm-wydp-adm-l textarea{display:block;width:100%;max-width:640px;margin-top:3px;box-sizing:border-box;font:inherit;font-size:14px;padding:6px 10px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--txt)}
.tm-wydp-adm-filtr .tm-wydp-adm-l input,.tm-wydp-adm-filtr .tm-wydp-adm-l select{width:auto}
.tm-wydp-adm-l input[type=checkbox]{display:inline-block;width:auto;margin:0 6px 0 0}
.tm-wydp-adm-fs{margin:0 0 12px;padding:8px 12px;border:1px solid var(--line);border-radius:6px}
.tm-wydp-adm-fs legend{padding:0 6px;font:600 12.5px var(--f-lab);color:var(--txt-2)}
.tm-wydp-adm-blad{display:block;margin:-6px 0 10px;color:#b3261e;font-size:12.5px}
.tm-wydp-adm-btn{font:600 13px var(--f-lab);padding:6px 12px;border:1px solid var(--loc);border-radius:6px;background:#fff;color:var(--loc);cursor:pointer}
.tm-wydp-adm-btn:hover{background:var(--loc);color:#fff}
.tm-wydp-adm-link{color:var(--loc);text-decoration:underline}
.tm-wydp-adm-link:hover{text-decoration:none}
.tm-wydp-adm-znacznik{display:inline-block;padding:1px 7px;border-radius:4px;font:600 11px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;background:#fff4dc;color:#7a5400}
.tm-wydp-adm-sek{margin:0 0 22px;padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:#fff}
.tm-wydp-adm-dl{display:grid;grid-template-columns:minmax(110px,170px) 1fr;gap:6px 14px;margin:0 0 12px;font-size:14px}
.tm-wydp-adm-dl dt{font:600 12px var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--txt-2)}
.tm-wydp-adm-dl dd{margin:0;overflow-wrap:anywhere}
.tm-wydp-adm-opis{white-space:pre-line;overflow-wrap:anywhere}
.tm-wydp-adm-zdj{display:inline-block;margin:0 0 6px}
.tm-wydp-adm-zdj img{display:block;max-width:100%;height:auto;border:1px solid var(--line);border-radius:6px}
.tm-wydp-adm-lista{margin:0 0 12px;padding-left:18px;font-size:14px;line-height:1.6}
.tm-wydp-adm-podglad{overflow:auto;max-height:720px;border:1px solid var(--line);border-radius:6px}
.tm-wydp-adm-tbl{width:100%;margin:8px 0 14px;border-collapse:collapse;font-size:13.5px}
.tm-wydp-adm-tbl th{padding:7px 10px;border:1px solid var(--line);background:var(--band);text-align:left;font:600 11px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-2)}
.tm-wydp-adm-tbl td{padding:7px 10px;border:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}
.tm-wydp-adm-stronicowanie{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin:0 0 14px;font-size:14px}
@media (max-width:700px){
 .tm-wydp-adm-dl{grid-template-columns:1fr;gap:2px}
 .tm-wydp-adm-dl dd{margin-bottom:8px}
 .tm-wydp-adm-tbl{display:block;overflow-x:auto}
}
/* --- koniec sekcji panel propozycji wydarzeń (pomysł #443) --- */

/* ===== TRANSPORT W {MIASTO} (pomysł #493, 2026-10-10) =====
   Boks "Rozkłady i dworce" (NT3transportBoks, widget TMtransport) w kolumnie .tm-gCr sekcji na stronie głównej miasta
   i w kolumnie bocznej działu /transport: bloki z ramką i akcentem sekcji jak kafel ładowarek (.tm-lad-kafel), lista
   nazwa + dopisek (liczba linii albo typ punktu). .tm-gC-pelna: sekcja bez boksu - artykuły bez pustej kolumny 300 px.
   .tm-trbox-pelny: miasto bez artykułów - bloki obok siebie na całą szerokość. */
.tm-gC-pelna{grid-template-columns:1fr}
.tm-trbox{display:flex;flex-direction:column;gap:14px}
.tm-trbox-b{padding:13px 15px;border:1px solid var(--line);border-left:3px solid var(--ac,var(--loc));border-radius:8px;background:#fff}
.tm-trbox-h{display:flex;align-items:center;gap:8px;margin:0 0 4px;font:700 17px/1.2 var(--f-ui);color:var(--txt)}
.tm-trbox-h a{color:inherit;text-decoration:none}
.tm-trbox-h a:hover,.tm-trbox-h a:focus-visible{color:var(--ac,var(--loc));text-decoration:underline;text-underline-offset:2px}
.tm-trbox-ic{flex:none;color:var(--ac,var(--loc))}
.tm-trbox-s{margin:0 0 4px;font-size:13px;color:var(--txt-2)}
.tm-trbox-l{margin:0;padding:0;list-style:none}
.tm-trbox-l li{display:flex;align-items:baseline;gap:8px;padding:7px 0;border-top:1px dashed var(--line);font-size:13.5px;min-width:0}
.tm-trbox-l li:first-child{border-top:0}
.tm-trbox-l a{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;color:var(--txt);text-decoration:none}
.tm-trbox-l a:hover,.tm-trbox-l a:focus-visible{color:var(--ac,var(--loc));text-decoration:underline}
.tm-trbox-l span{margin-left:auto;flex:none;font-size:12px;color:var(--txt-2)}
a.tm-trbox-w{display:inline-block;margin-top:6px;font-size:12.5px;font-weight:600;color:var(--ac,var(--loc));text-decoration:none}
a.tm-trbox-w:hover,a.tm-trbox-w:focus-visible{text-decoration:underline}
.tm-trbox-pelny .tm-trbox{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
/* na telefonie i tablecie (.tm-gC w jednej kolumnie) boks pod artykułami, bloki obok siebie, gdy jest miejsce */
@media(max-width:880px){.tm-gCr>.tm-trbox{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
/* blok "Utrudnienia w ruchu" (NT3drogiTransport, etap 2): lista dwuwierszowa - etykieta drogi/źródła, odcinek albo
   tytuł komunikatu, skutek z terminem; skutek ważny (droga zamknięta, awaria mostu) czerwienią; podpis źródeł pod listą */
.tm-trbox-dl{margin:0;padding:0;list-style:none}
.tm-trbox-dl li{display:flex;flex-direction:column;gap:2px;padding:8px 0;border-top:1px dashed var(--line);font-size:13.5px;line-height:1.35;min-width:0}
.tm-trbox-dl li:first-child{border-top:0;padding-top:2px}
.tm-trbox-dl a{font-weight:600;color:var(--txt);text-decoration:none}
.tm-trbox-dl a:hover,.tm-trbox-dl a:focus-visible{color:var(--ac,var(--loc));text-decoration:underline}
.tm-trbox-dl b{font-weight:600;color:var(--txt)}
.tm-trbox-dk{font:600 10.5px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--ac-dark,var(--ac,var(--loc)))}
.tm-trbox-dk i{font-style:normal;text-transform:none;letter-spacing:.04em}
/* belka "Rozkład: 3 przewoźnicy, wszystkie" w nagłówku sekcji (NT3transportBelka, od 2026-10-10): etykieta jak etykiety
   bloków kolumny, przewoźnicy pogrubieni, "wszystkie" zwykłą wagą; poniżej 1366 px belka schodzi do własnego wiersza
   regułą belek .tm-podatki */
.tm-trbelka{align-items:baseline}
.tm-trbelka-e{font:600 10.5px var(--f-lab);letter-spacing:.1em;text-transform:uppercase;color:var(--txt-2)}
.tm-trbelka a{font-weight:600;color:var(--ac-dark,var(--ac));text-decoration:none}
.tm-trbelka a.tm-trbelka-w{font-weight:400;color:var(--txt-2)}
.tm-trbelka a:hover,.tm-trbelka a:focus-visible{text-decoration:underline;text-underline-offset:2px}
.tm-trbox-ds{font-size:12.5px;color:var(--txt-2)}
.tm-trbox-ds-w{color:#b3261e;font-weight:600}
.tm-trbox-z{margin:6px 0 0;font-size:11.5px;color:var(--txt-3)}
.tm-trbox-z a{color:inherit;text-decoration:underline}
/* układ sekcji na stronie głównej miasta (od 2026-10-10): górny rząd .tm-trtop - karta i boks utrudnień tej samej
   wysokości (wiersz grida rozciąga obie komórki; karta bez proporcji 16:9, z minimalną wysokością, zdjęcie i tak
   object-fit:cover), pod nim rząd .tm-trminis na całą szerokość: 3 kafle + boks ładowarek w komórce czwartego kafla
   (albo 4 kafle, gdy ładowarki stoją w prawej kolumnie) */
.tm-trtop{align-items:stretch}
.tm-trtop-l{display:flex;min-width:0}
.tm-trtop-l>.tm-oc{flex:1;aspect-ratio:auto;min-height:320px}
.tm-trtop>.tm-gCr>.tm-trbox{flex:1}
.tm-trtop>.tm-gCr>.tm-trbox>.tm-trbox-b{flex:1;display:flex;flex-direction:column}
.tm-trtop .tm-trbox-z{margin-top:auto;padding-top:6px}
.tm-trminis{margin-top:14px}
.tm-trminis>.tm-trbox{min-width:0}
.tm-trminis>.tm-oc{align-self:stretch;justify-self:stretch;width:100%}
.tm-trminis>.tm-trbox>.tm-trbox-b{height:100%;padding:10px 12px;display:flex;flex-direction:column;justify-content:space-between;gap:3px;line-height:1.3}
.tm-trminis .tm-trbox-h{margin:0;font-size:15px}
.tm-trminis .tm-trbox-s,.tm-trminis a.tm-trbox-w{margin:0;font-size:12px}
.tm-trminis .tm-trbox-z{margin:0;font-size:11px}
.tm-trbox-pelny{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
@media(max-width:880px){.tm-trtop-l>.tm-oc{aspect-ratio:16/9;min-height:0}}
/* "Utrudnienia w ruchu" w barwach ostrzegawczych: pasek w ukośne pasy u góry, ciepłe tło, pomarańczowy akcent
   i pachołek drogowy (.tm-trbox-drg, inline SVG) przy prawej krawędzi nagłówka - także w kolumnie działu /transport */
.tm-trbox-b.tm-trbox-dr{position:relative;overflow:hidden;padding-top:19px;border-color:#f0d6a4;border-left-color:#e8590c;background:linear-gradient(180deg,#fff3dc 0,#fffaf1 55%,#fff 100%)}
.tm-trbox-dr::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:repeating-linear-gradient(-45deg,#f5b400 0 10px,#2b2f36 10px 20px)}
.tm-trbox-dr .tm-trbox-ic{color:#e8590c}
.tm-trbox-drg{flex:none;margin:-8px 0 -10px auto}
.tm-trbox-dr .tm-trbox-dk{color:#b4470a}
.tm-trbox-dr .tm-trbox-dl li{border-top-color:#efd9b8}
/* boks "Stacje ładowania" (NT3ladowarkiMini) w zieleni ładowarek (jak .tm-aptmini/.tm-lad): zielone tło z gradientem,
   słupek ładowania z kablem jako ikona nagłówka (.tm-trbox-ladg, inline SVG), duża liczba punktów (.tm-trlad-n),
   linia lokalizacji i mocy (.tm-trlad-s) i dopisek "ładowania" (.tm-trlad-x) - w kaflu do 180 px ukryte, a ikona
   i nagłówek mniejsze (zapytanie kontenerowe, telefon i laptop 1024 px), żeby boks
   nie przerastał kafli artykułów) i zielony przycisk "Zobacz na mapie" (.tm-trlad-btn) */
.tm-trbox-b.tm-trbox-lad{position:relative;overflow:hidden;container-type:inline-size;border-color:#cde6d8;border-left-color:#1d7f47;background:linear-gradient(160deg,#e3f4ea 0,#f3faf6 60%,#fff 100%)}
.tm-trbox-lad .tm-trbox-h{gap:6px;font-size:15px;line-height:1.15}
.tm-trbox-lad .tm-trbox-h a:hover,.tm-trbox-lad .tm-trbox-h a:focus-visible{color:#1d7f47}
.tm-trbox-ladg{flex:none;margin:-3px 0 -3px -4px}
.tm-trlad-n{margin:2px 0 0;font-size:12.5px;line-height:1.1;color:var(--txt-2)}
.tm-trlad-n b{margin-right:2px;font:800 26px/1 var(--f-ui);letter-spacing:-.02em;color:#1d7f47}
.tm-trlad-s{font-size:12px}
a.tm-trlad-btn{align-self:flex-start;margin-top:3px;padding:4px 11px;border-radius:999px;background:#1d7f47;color:#fff;font-size:12px;font-weight:700;line-height:1.3;text-decoration:none;white-space:nowrap}
a.tm-trlad-btn:hover,a.tm-trlad-btn:focus-visible{background:#166238;color:#fff}
@container (max-width:180px){.tm-trlad-s,.tm-trlad-x{display:none}.tm-trbox-lad .tm-trbox-h{font-size:13px;gap:4px}.tm-trbox-ladg{width:22px;height:22px;margin:-2px 0 -2px -3px}.tm-trlad-n b{font-size:24px}}
/* kafel stacji ładowania w kolumnie bocznej działu /transport (300 px): lista w jednej kolumnie jak na telefonie,
   odstęp nad kaflem tylko z gap kolumny (.tm-side), bez własnego marginesu */
.tm-side .tm-lad-kafel{margin:0}
.tm-side .tm-lad-kl{grid-template-columns:minmax(0,1fr)}
.tm-side .tm-lad-kz{margin-left:0}
/* przycisk "Zobacz na mapie" boksu utrudnień (do /transport/utrudnienia#mapa) - pomarańczowa pigułka, na SG na dole boksu */
a.tm-trdr-btn{align-self:flex-start;margin-top:8px;padding:4px 11px;border-radius:999px;background:#e8590c;color:#fff;font-size:12px;font-weight:700;line-height:1.3;text-decoration:none;white-space:nowrap}
a.tm-trdr-btn:hover,a.tm-trdr-btn:focus-visible{background:#c2470a;color:#fff}
.tm-trbox-dr{display:flex;flex-direction:column}
.tm-trtop a.tm-trdr-btn{margin-top:auto}
.tm-trtop .tm-trbox-dl{margin-bottom:8px}
.tm-trbox-dr .tm-trbox-h a:hover,.tm-trbox-dr .tm-trbox-h a:focus-visible{color:#c2470a}
/* podstrona /transport/utrudnienia (ext/dzial/utrudnienia.tpl, mapa tmUtrudnienia.js) */
.tm-dr-sec{margin:0 0 22px}
.tm-dr-h2{display:flex;align-items:center;gap:8px;margin:0 0 10px;font:800 19px/1.25 var(--f-ui)}
.tm-dr-ile{padding:1px 8px;border-radius:999px;background:#fff3dc;color:#b4470a;font-size:13px}
.tm-dr-rso{margin:0;padding:0;list-style:none;border:1px solid #f0d6a4;border-left:4px solid #e8590c;border-radius:8px;background:#fffaf1}
.tm-dr-rso li{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;padding:10px 12px;border-top:1px solid #efd9b8}
.tm-dr-rso li:first-child{border-top:0}
.tm-dr-rso a{flex:1 1 300px;font-weight:700;color:var(--txt);text-decoration:none}
.tm-dr-rso a:hover,.tm-dr-rso a:focus-visible{color:#c2470a;text-decoration:underline}
.tm-dr-rso time{font-size:12px;color:var(--txt-3)}
.tm-dr-et{padding:1px 7px;border-radius:4px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:#fff;background:#e8590c}
.tm-dr-et-k{background:#54637a}
.tm-dr-zr{margin:8px 0 0;font-size:12px;color:var(--txt-3)}
.tm-dr-mapa{position:relative;isolation:isolate;height:440px;margin:0 0 6px;border:1px solid var(--line);border-radius:8px;background:#e8edf2;overflow:hidden}
.tm-dr-mapa-blad{display:flex;align-items:center;justify-content:center;padding:16px;font-size:13px;color:var(--txt-2)}
.tm-dr-mapa .leaflet-container{font:inherit}
.tm-dr-leg{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0 0 14px;font-size:12px;color:var(--txt-2)}
.tm-dr-pt{display:inline-block;width:11px;height:11px;border:2px solid #fff;border-radius:50%;background:#e8590c;box-shadow:0 0 0 1px #c9ced6}
.tm-dr-pt-w{background:#c92a2a}
.tm-dr-pt-c{background:#1f3a5f}
.tm-dr-lista{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.tm-dr-poz{padding:12px 14px;border:1px solid var(--line);border-left:4px solid #e8590c;border-radius:8px;background:#fff;scroll-margin-top:90px}
.tm-dr-poz-w{border-left-color:#c92a2a}
.tm-dr-poz:target{box-shadow:0 0 0 2px #f5b400}
.tm-dr-pg{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:12px;color:var(--txt-3)}
.tm-dr-nr{padding:1px 7px;border-radius:4px;background:#2b2f36;color:#fff;font-weight:800;letter-spacing:.02em}
a.tm-dr-nm{margin-left:auto;color:#c2470a;font-weight:700;text-decoration:none}
a.tm-dr-nm:hover,a.tm-dr-nm:focus-visible{text-decoration:underline}
.tm-dr-odc{margin:6px 0 2px;font:700 16px/1.3 var(--f-ui)}
.tm-dr-sk{margin:0;font-size:14px;color:var(--txt-2)}
.tm-dr-sk b{color:#b4470a}
.tm-dr-poz-w .tm-dr-sk b{color:#c92a2a}
.tm-dr-op{margin:6px 0 0;font-size:13.5px;line-height:1.5;color:var(--txt-2)}
.tm-dr-pop{font-size:13px;line-height:1.35}
a.tm-dr-popn{display:block;margin-bottom:3px;font-weight:700;color:var(--txt)}
.tm-dr-pops{font-weight:700;color:#b4470a}
.tm-dr-pops-w{color:#c92a2a}
.tm-dr-popt{color:var(--txt-2)}
.tm-dr-dlug{display:inline-block;margin-left:4px;padding:1px 7px;border-radius:4px;background:#eef1f5;color:#54637a;font:700 11px/1.5 var(--f-ui);text-transform:uppercase;letter-spacing:.03em;vertical-align:2px}
.tm-dr-cz{display:flex;align-items:flex-start;gap:6px;margin:6px 0 0;padding:6px 9px;border-radius:6px;background:#fff3dc;color:#7a3a07;font-size:13.5px;line-height:1.4}
.tm-dr-cz svg{flex:none;margin-top:2px;color:#e8590c}
@media(max-width:640px){.tm-dr-mapa{height:320px}}
/* --- koniec sekcji Transport w {miasto} (pomysł #493) --- */
/* --- Edukacja i Szkolenia na SG miasta (2026-10-11, pomysł #371): belka w nagłówku (.tm-edub na .tm-nbp/.tm-podatki),
   panel "Szkoły i przedszkola" w .tm-gCr (NT3szkolySgPanel), pas "Oświata w liczbach" pod siatką (NT3szkolySgLiczby;
   słupki trendu z .tm-sgus-tr). Model {TMszkolySg} - SzkolyWidok::modelSg. --- */
.tm-shead>.tm-edub{flex:0 1 auto;min-width:0;flex-wrap:wrap;row-gap:0}
.tm-edu{margin-bottom:18px}
.tm-edup{display:flex;flex-direction:column;gap:10px}
.tm-edup-l{list-style:none;margin:0;padding:0}
.tm-edup-l li+li{border-top:1px solid var(--line,#e6e8ec)}
.tm-edup-r{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 2px;color:var(--txt-h);text-decoration:none}
.tm-edup-n{min-width:0;font:600 14px/1.3 var(--f-ui)}
.tm-edup-n small{display:block;margin-top:1px;font:400 12px/1.3 var(--f-ui);color:var(--txt-2)}
.tm-edup-v{flex:0 0 auto;min-width:34px;padding:2px 8px;border-radius:999px;background:var(--band);font:700 13px/1.5 var(--f-ui);text-align:center;color:var(--ac-dark,var(--ac))}
.tm-edup-r:hover .tm-edup-n,.tm-edup-r:focus-visible .tm-edup-n{color:var(--ac-dark,var(--ac));text-decoration:underline}
.tm-edup-r:hover .tm-edup-v{background:var(--ac,var(--brand));color:#fff}
.tm-edup-cta{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.tm-edup-btn{display:inline-block;padding:8px 14px;border-radius:6px;background:var(--ac,var(--brand));color:#fff;font:600 13.5px/1.2 var(--f-ui);text-decoration:none}
.tm-edup-btn:hover,.tm-edup-btn:focus-visible{background:var(--ac-dark,var(--ac));text-decoration:underline}
.tm-edup-all{font-size:13.5px;color:var(--ac-dark,var(--ac));text-decoration:none}
.tm-edup-all:hover{text-decoration:underline}
.tm-edul{margin:0 0 18px;padding:14px 16px 12px;border-radius:8px;background:var(--band);border-top:3px solid var(--ac,var(--brand))}
.tm-edul .tm-pnw-lh{border-bottom:0;padding-bottom:10px}
.tm-edul-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px 20px}
.tm-edul-t{min-width:0}
.tm-edul-t>b{display:block;font:700 26px/1.15 var(--f-ui);color:var(--ac-dark,var(--ac))}
.tm-edul-t>span{display:block;margin-top:2px;font-size:13px;line-height:1.35;color:var(--txt-2)}
.tm-edul-t>small{display:block;margin-top:5px;font-size:12px;line-height:1.35;color:var(--txt-2)}
.tm-edul-tr .tm-sgus-tr{height:48px;margin:8px 0 0}
.tm-edul-src{margin:12px 0 0;font-size:11.5px;line-height:1.4;color:var(--txt-2)}
.tm-edul-src a{color:var(--ac-dark,var(--ac));white-space:nowrap}
@media(max-width:560px){.tm-edul-g{grid-template-columns:1fr 1fr}.tm-edul-t>b{font-size:22px}
 .tm-edul-tr .tm-sgus-sl small{visibility:hidden}.tm-edul-tr .tm-sgus-sl:first-child small,.tm-edul-tr .tm-sgus-sl:last-child small{visibility:visible;overflow:visible;white-space:nowrap}
 .tm-edul-tr .tm-sgus-sl:first-child small{text-align:left}.tm-edul-tr .tm-sgus-sl:last-child small{text-align:right}}
/* SG portalu polska (2026-10-12): szkoly */
/* --- Edukacja i Szkolenia na SG portalu polska (2026-10-12, pomysł #371): belka krajowa NT3szkolyKrajBelka
   ({TMszkolySg szablon="NT3szkolyKrajBelka"}). Układ, kolory i zejście do własnego wiersza (telefon <=700 px oraz
   701-1365 px) dziedziczy w całości z istniejących reguł .tm-nbp / .tm-podatki / .tm-shead>.tm-edub w css.css -
   tu tylko pilnowanie, żeby liczba i jej opis ("35 tys. placówek oświatowych") nie rozjechały się przy zawijaniu. --- */
.tm-edubk span{white-space:nowrap}

/* --- koniec sekcji Edukacja i Szkolenia --- */
/* --- Dział /edukacja na portalu miasta (2026-10-11): ścieżka edukacji (.tm-edz-s), "Oświata w liczbach" (.tm-edz-g)
   i boks GUS (.tm-edz-boks). Kolory grup z .tm-szk-g-* działu /szkoly/ (--szk-c, --szk-t, --szk-d), ikony ze sprite'a
   ext/szkoly/_ikony.tpl. Model EdukacjaWidok, szablony ext/dzial/edu*.tpl. --- */
.tm-edz{margin:0 0 22px}
.tm-edz-s{list-style:none;margin:0;padding:0;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:12px}
.tm-edz-k{position:relative;display:flex;flex-direction:column;min-width:0;border-radius:12px;background:var(--szk-t);border-top:4px solid var(--szk-c)}
.tm-edz-k+.tm-edz-k::before{content:"";position:absolute;left:-7px;top:38px;width:7px;height:7px;border:solid var(--txt-3);border-width:2px 2px 0 0;transform:translate(-50%,-50%) rotate(45deg)}
.tm-edz-kl{flex:1;display:flex;flex-direction:column;gap:8px;padding:12px 12px 10px;color:var(--txt-h);text-decoration:none;border-radius:0 0 12px 12px}
.tm-edz-k .tm-szk-ik{background:#fff}
.tm-edz-kt{display:flex;flex-direction:column;gap:2px;min-width:0}
.tm-edz-kw{font:600 11px/1.3 var(--f-ui);letter-spacing:.03em;text-transform:uppercase;color:var(--szk-d)}
.tm-edz-kn{font:700 15px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-edz-kc{margin-top:4px;font:700 19px/1.15 var(--f-ui);color:var(--szk-d)}
.tm-edz-kd{font-size:12.5px;line-height:1.35;color:var(--txt-2)}
a.tm-edz-kl:hover,a.tm-edz-kl:focus-visible{background:rgba(255,255,255,.55)}
a.tm-edz-kl:hover .tm-edz-kn,a.tm-edz-kl:focus-visible .tm-edz-kn{color:var(--szk-d);text-decoration:underline}
.tm-edz-kp{list-style:none;margin:0;padding:0 10px 10px;display:flex;flex-direction:column;gap:4px}
.tm-edz-kp a{display:flex;justify-content:space-between;gap:6px;padding:4px 8px;border-radius:7px;background:#fff;font:600 12.5px/1.3 var(--f-ui);color:var(--szk-d);text-decoration:none}
.tm-edz-kp a:hover,.tm-edz-kp a:focus-visible{text-decoration:underline}
.tm-edz-kp b{flex:none}
.tm-edz-inne{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0}
.tm-edz-ch{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;background:var(--szk-t,var(--band));color:var(--szk-d,var(--txt-h));font:600 12.5px/1.3 var(--f-ui);text-decoration:none}
.tm-edz-ch .tm-szk-svg{width:15px;height:15px;color:var(--szk-c)}
.tm-edz-ch:hover,.tm-edz-ch:focus-visible{text-decoration:underline}
.tm-edz-ch.tm-edz-mapa{background:var(--ac);color:#fff}
.tm-edz-ch.tm-edz-mapa .tm-szk-svg{color:#fff}
.tm-edz-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.tm-edz-c{min-width:0;padding:14px 16px;border-radius:10px;background:var(--card,#fff);border:1px solid var(--line);border-top:3px solid var(--szk-c,var(--ac))}
.tm-edz-cw{grid-column:1/-1}
.tm-edz-ch3{display:flex;align-items:center;gap:10px;margin:0 0 12px;font:700 16px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-edz-big{display:flex;flex-wrap:wrap;gap:8px 22px}
.tm-edz-big b{display:block;font:700 26px/1.1 var(--f-ui);color:var(--szk-d,var(--ac-dark))}
.tm-edz-big span{display:block;margin-top:2px;font-size:13px;line-height:1.35;color:var(--txt-2)}
.tm-edz-op{margin:12px 0 0;font-size:14px;line-height:1.4;color:var(--txt-h)}
.tm-edz-op span{color:var(--txt-2)}
.tm-edz-dalej{display:inline-block;margin-top:10px;font:600 13.5px/1.3 var(--f-ui);color:var(--szk-d,var(--ac-dark));text-decoration:none}
.tm-edz-dalej:hover,.tm-edz-dalej:focus-visible{text-decoration:underline}
.tm-edz-note{margin:8px 0 0;font-size:12px;line-height:1.4;color:var(--txt-2)}
.tm-edz-bar{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.tm-edz-bar a{display:grid;grid-template-columns:minmax(0,10.5em) minmax(0,1fr) 2.6em;align-items:center;gap:10px;color:var(--txt-h);text-decoration:none}
.tm-edz-bn{font-size:13px;line-height:1.25}
.tm-edz-bt{height:10px;border-radius:999px;background:var(--band);overflow:hidden}
.tm-edz-bt i{display:block;height:100%;border-radius:999px;background:var(--szk-c)}
.tm-edz-bv{font:700 14px/1 var(--f-ui);text-align:right;color:var(--szk-d)}
.tm-edz-bar a:hover .tm-edz-bn,.tm-edz-bar a:focus-visible .tm-edz-bn{color:var(--szk-d);text-decoration:underline}
.tm-edz-split{height:12px;margin:12px 0 6px;border-radius:999px;background:#f2a341;overflow:hidden}
.tm-edz-split i{display:block;height:100%;background:var(--szk-c)}
.tm-edz-leg{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;margin:0;font-size:12.5px;color:var(--txt-2)}
.tm-edz-lp::before,.tm-edz-ln::before{content:"";display:inline-block;width:9px;height:9px;margin-right:5px;border-radius:50%;background:var(--szk-c)}
.tm-edz-ln::before{background:#f2a341}
.tm-edz-kal{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:2px 12px;padding:12px 14px;border-radius:10px;background:var(--szk-t)}
.tm-edz-kal-e{grid-column:1/-1;font:600 11px/1.2 var(--f-ui);letter-spacing:.04em;text-transform:uppercase;color:var(--szk-d)}
.tm-edz-kal-n{font:700 18px/1.25 var(--f-ui);color:var(--txt-h)}
.tm-edz-kal-o{grid-row:2/4;grid-column:2;align-self:center;padding:6px 10px;border-radius:999px;background:var(--szk-c);color:#fff;font:700 14px/1.2 var(--f-ui);white-space:nowrap}
.tm-edz-kal-d{font-size:14px;color:var(--txt-2)}
.tm-edz-kal-t .tm-edz-kal-o{background:#2fa26b}
.tm-edz-kall{list-style:none;margin:10px 0 0;padding:0}
.tm-edz-kall li{display:flex;justify-content:space-between;gap:12px;padding:6px 2px;border-bottom:1px solid var(--line);font-size:13.5px;line-height:1.3;color:var(--txt-h)}
.tm-edz-kall li:last-child{border-bottom:0}
.tm-edz-kall b{flex:none;font-weight:600;color:var(--szk-d);text-align:right}
.tm-edz-pn{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.tm-edz-pn li{display:grid;grid-template-columns:minmax(0,9.5em) minmax(0,1fr);grid-template-areas:"n s" "n v";align-items:center;gap:2px 10px}
.tm-edz-pn-n{grid-area:n;font-size:13px;line-height:1.25;color:var(--txt-h);text-decoration:none}
.tm-edz-pn-n:hover,.tm-edz-pn-n:focus-visible{color:var(--szk-d);text-decoration:underline}
.tm-edz-pn .tm-edz-split{grid-area:s;height:8px;margin:0}
.tm-edz-pn-v{grid-area:v;font-size:12px;color:var(--txt-2)}
.tm-edz-pn-v b{color:var(--txt-h)}
.tm-edz-pn-v a{color:var(--txt-2)}
.tm-edz-pn-v a:hover,.tm-edz-pn-v a:focus-visible{color:var(--szk-d)}
.tm-edz-pn+.tm-edz-leg{margin-top:10px}
.tm-edz-ur{display:flex;align-items:flex-end;gap:8px;height:150px;padding:20px 0 20px;position:relative}
.tm-edz-us{flex:1;min-width:0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative}
.tm-edz-us i{position:relative;display:block;width:100%;max-width:54px;min-height:3px;border-radius:5px 5px 0 0;background:var(--szk-t);border:1px solid var(--szk-c);border-bottom:0}
.tm-edz-us em{position:absolute;bottom:100%;left:-6px;right:-6px;padding-bottom:3px;font:600 11.5px/1 var(--f-ui);font-style:normal;text-align:center;color:var(--txt-2)}
.tm-edz-us small{position:absolute;top:100%;margin-top:5px;font-size:11.5px;color:var(--txt-2)}
.tm-edz-ut i{background:var(--szk-c)}
.tm-edz-ut em,.tm-edz-ut small{font-weight:700;color:var(--szk-d)}
.tm-edz-ut-t{margin:12px 0 0;font:600 14px/1.4 var(--f-ui);color:var(--txt-h)}
.tm-edz-bk{padding:2px 0 10px;margin-bottom:4px;border-bottom:1px solid var(--line)}
.tm-edz-bk>b{display:block;font:700 24px/1.15 var(--f-ui);color:var(--ac-dark,var(--ac))}
.tm-edz-bk>span{display:block;font-size:12.5px;line-height:1.35;color:var(--txt-2)}
.tm-edz-bk>small{display:block;margin-top:2px;font-size:12px;color:var(--txt-2)}
.tm-edz-bk .tm-sgus-tr{height:58px}
.tm-edz-bp{margin:8px 0 0;font-size:12px;line-height:1.4;color:var(--txt-2)}
@media(max-width:760px){
 .tm-edz-s{grid-auto-flow:row;grid-template-columns:1fr;gap:8px}
 .tm-edz-k+.tm-edz-k::before{left:31px;top:-4px;transform:translate(-50%,-50%) rotate(135deg)}
 .tm-edz-kl{flex-direction:row;align-items:center;gap:12px;padding:10px 12px}
 .tm-edz-kt{flex:1}
 .tm-edz-kc{margin-top:2px;font-size:17px}
 .tm-edz-kp{flex-direction:row;flex-wrap:wrap;padding:0 12px 10px}
 .tm-edz-g{grid-template-columns:1fr}
 .tm-edz-ur{gap:4px}
 .tm-edz-us em{font-size:10px}
 .tm-edz-us small{font-size:10.5px}
}

/* ===== STRONA GŁÓWNA PORTALU POLSKA - etap 1 (2026-10-12): sekcja Sejm, belki danych krajowych w nagłówkach sekcji
   (SOR, szkoły, GDDKiA, prąd jutro, GUS sport), weekend i trasy po Polsce w Kulturze, Ekstraklasa w Sporcie ===== */
/* --- drogi --- */
/* belka "Utrudnienia na drogach krajowych" w nagłówku sekcji "Transport w Polsce" na SG portalu ogólnopolskiego
   (NT3drogiKrajBelka, 2026-10-12): wygląd pozycji z .tm-nbp/.tm-podatki, w linii obok tytułu (poniżej 1366 px we
   własnym wierszu - reguła belek .tm-podatki, na telefonie .tm-shead .tm-nbp). Jak belka SOR może się kurczyć
   i zawija pozycje w obrębie belki zamiast wypychać "więcej" poza kolumnę; bez ucinania (overflow ścina kreski nad Ś/Ź) */
.tm-shead>.tm-drgk{flex:0 1 auto;min-width:0;flex-wrap:wrap;row-gap:0}

/* --- prad --- */
/* ===== PRĄD JUTRO (RDN Fixing I TGE, 2026-10-12): belka w nagłówku "Strefa Biznesu" na SG portalu polska =====
   Element ma klasy .tm-nbp.tm-podatki (układ pozycji, kolory, zejście do wiersza na telefonie i 701-1365 px).
   Obok kursów NBP (4 waluty) i linku "więcej" nie mieści się w jednym wierszu nawet na pełnym desktopie
   (tytuł ok. 250 px + NBP ok. 390 px + belka ok. 330 px + "więcej"), a zawinięta w linii przestawiałaby "więcej"
   do drugiego wiersza - dlatego zawsze schodzi do własnego wiersza pod tytułem (order:9 = po "więcej"). */
.tm-shead:has(>.tm-prad){flex-wrap:wrap;row-gap:4px}
.tm-shead>.tm-prad{order:9;width:100%;flex-wrap:wrap;gap:2px 14px}
.tm-prad span:first-child{color:var(--txt)}
@media(max-width:700px){
 .tm-shead>.tm-prad{gap:2px 12px;font-size:12px}
}

/* --- sportgus --- */
/* sportgus - belka GUS sportu w nagłówku sekcji "Sport" SG polska ({TMsportGus szablon="NT3sportGus"} -> NT3sportGusPolska).
   Belka to ten sam element co na SG miasta: a.tm-nbp.tm-podatki.tm-sgus - układ, kolory, podkreślenie liczb po
   najechaniu i zejście do własnego wiersza na telefonie (.tm-shead>.tm-podatki, @media w css.css) są już w css.css.
   Nowych reguł nie trzeba; jedyna poprawka: na wąskim telefonie pozycje belki mogą się zawijać same w sobie,
   bo etykieta z liczbą jest dłuższa niż kod waluty w belce kursów. */
@media (max-width:420px){
 .tm-shead>.tm-sgus{gap:2px 12px}
}

/* --- wydarzenia --- */
/* ===== WYDARZENIA NA SG PORTALU POLSKA (TMwydarzeniaPolska, 2026-10-12) =====
   Belka "W ten weekend" (NT3weekendPolskaBelka) w nagłówku sekcji Kultura - w całości belka .tm-nbp/.tm-podatki
   (układ w linii tytułu, zawijanie i własny wiersz na telefonie z reguł .tm-shead .tm-nbp). Tu tylko: okres się
   nie łamie, a na wąskim telefonie schodzi pod liczby.
   Blok "Trasy koncertowe i kabaretowe" (NT3trasyPolska): lista tekstowa jak ranking w .tm-kal (kreska w kolorze
   sekcji --ac zamiast numeru), działa w kolumnie 262 px i na pełnej szerokości. */
.tm-wydpb .tm-wydpb-d i{white-space:nowrap}
@media (max-width:480px){
 .tm-shead>.tm-wydpb .tm-wydpb-d{flex-basis:100%}
}

.tm-trpl{display:flex;flex-direction:column;min-width:0;background:#fff;border-top:3px solid var(--ac,var(--brand));padding:12px 15px 14px}
.tm-trpl-h{margin:0 0 4px;font:600 17px/1.25 var(--f-lab);color:var(--txt-h)}
.tm-trpl-h a{color:inherit;text-decoration:none}
.tm-trpl-h a:hover{color:var(--ac-dark,var(--ac,var(--brand)))}
.tm-trpl-h2{margin:14px 0 2px;font:600 13px/1.3 var(--f-lab);letter-spacing:.04em;text-transform:uppercase;color:var(--txt-2)}
.tm-trpl-l{list-style:none;margin:0;padding:0}
.tm-trpl-p{position:relative;display:flex;flex-direction:column;gap:1px;padding:8px 0 8px 14px;border-bottom:1px solid var(--hair)}
.tm-trpl-p:last-child{border-bottom:0}
.tm-trpl-p::before{content:"";position:absolute;left:0;top:17px;width:6px;height:2px;background:var(--ac,var(--brand))}
.tm-trpl-t{font-size:14px;font-weight:600;line-height:1.35;color:var(--txt);text-decoration:none;overflow-wrap:anywhere}
.tm-trpl-t:hover{color:var(--ac-dark,var(--ac,var(--brand)));text-decoration:underline}
.tm-trpl-n{font-size:12.5px;color:var(--txt-2)}
.tm-trpl-d{font-size:12px;color:var(--txt-3)}
.tm-trpl-nowe .tm-trpl-t{font-weight:500}
.tm-trpl-all{align-self:flex-start;margin-top:10px;font-size:13px;font-weight:600;color:var(--ac-dark,var(--ac,var(--brand)));text-decoration:none}
.tm-trpl-all:hover{text-decoration:underline}
@media (max-width:700px){
 .tm-trpl{padding:10px 0 12px;background:none}
 .tm-trpl-t{font-size:15px}
 .tm-trpl-p{padding:10px 0 10px 14px}
 .tm-trpl-p::before{top:19px}
 .tm-trpl-all{padding:6px 0}
}

/* --- wydarzenia: sekcja Kultura w kolumnie treści + karty "W ten weekend w Polsce" (NT3weekendPolska, 2026-10-12) --- */
.tm-kult-c .tm-kultg{grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(200px,1fr)}
.tm-kult-c .tm-trpl{height:100%}
.tm-kult-c .tm-trpl-h2,.tm-kult-c .tm-trpl-nowe{display:none}
#s-kultura~.tm-wydpb .tm-wydpb-d{display:none}
.tm-wpl{margin:0 0 18px}
.tm-wpl-h{margin:0 0 10px;font:600 13px/1.3 var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-h)}
.tm-wpl-h a{color:inherit;text-decoration:none}
.tm-wpl-h a:hover,.tm-wpl-h a:focus-visible{color:var(--ac-dark,var(--ac));text-decoration:underline}
.tm-wpl-l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 12px}
.tm-wpl-p{display:flex;flex-direction:column;min-width:0}
.tm-wpl-f{display:block;aspect-ratio:3/2;border-radius:6px;overflow:hidden;background:var(--band)}
.tm-wpl-f img{display:block;width:100%;height:100%;object-fit:cover}
.tm-wpl-f0{display:flex;align-items:center;justify-content:center;height:100%;padding:8px;font:600 12px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--ac-dark,var(--ac));text-align:center}
.tm-wpl-m{display:flex;flex-wrap:wrap;gap:2px 8px;margin:8px 0 2px;font:600 11px/1.3 var(--f-lab);letter-spacing:.05em;text-transform:uppercase;color:var(--txt-2)}
.tm-wpl-g{color:var(--ac-dark,var(--ac))}
.tm-wpl-t{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:14.5px;font-weight:600;line-height:1.35;color:var(--txt-h);text-decoration:none}
.tm-wpl-t:hover,.tm-wpl-t:focus-visible{color:var(--ac-dark,var(--ac));text-decoration:underline}
.tm-wpl-k{margin:3px 0 0;font-size:12.5px;color:var(--txt-2)}
.tm-wpl-all{display:inline-block;margin-top:12px;font-size:13px;font-weight:600;color:var(--ac-dark,var(--ac));text-decoration:none}
.tm-wpl-all:hover,.tm-wpl-all:focus-visible{text-decoration:underline}
@media(max-width:880px){
 .tm-wpl-l{grid-template-columns:repeat(2,minmax(0,1fr))}
 .tm-kult-c .tm-kultg{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px}
}
@media(max-width:480px){
 .tm-wpl-all{display:flex;align-items:center;min-height:40px}
}

/* --- pilka --- */
/* Blok Ekstraklasy na SG portalu polska (2026-10-12, ext/S/NT3pilkaLigaPolska.tpl, {TMpilkaNozna liga=...}):
   pas pod mozaiką sekcji Sport - tabela (6 miejsc + reszta w <details>) i kolejka obok; na telefonie jedno pod drugim.
   Nagłówki .tm-pnw-lh, herb i nazwa .tm-dzpnz/.tm-dzpnlogo z boksu klubu miasta. Kolumny obu tabel mają
   stałe szerokości (table-layout:fixed), żeby wiersze z <details> stały równo pod pierwszymi sześcioma. */
.tm-pnl{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px 32px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.tm-pnl-tab,.tm-pnl-kol{display:flex;flex-direction:column;gap:8px;min-width:0}
.tm-pnl-t{width:100%;border-collapse:collapse;table-layout:fixed;font-size:13px}
.tm-pnl-t th{padding:0 4px 4px;font:600 10.5px var(--f-lab);letter-spacing:.08em;text-transform:uppercase;color:var(--txt-3);text-align:left}
.tm-pnl-t abbr{text-decoration:none;cursor:help}
.tm-pnl-t td{padding:5px 4px;border-bottom:1px solid var(--line);vertical-align:middle}
.tm-pnl-t .tm-dzpnz{white-space:normal;gap:7px}
.tm-pnl-t .tm-dzpnlogo{width:20px;height:20px}
.tm-pnl-poz{width:30px;color:var(--txt-3)}
.tm-pnl-n{width:34px;text-align:center;white-space:nowrap;color:var(--txt-2)}
.tm-pnl-br{width:52px}
.tm-pnl-pkt{font-weight:700;color:var(--txt-h)}
.tm-pnl-wiecej summary{cursor:pointer;padding:6px 4px;font:600 11.5px var(--f-lab);letter-spacing:.06em;text-transform:uppercase;color:var(--ac-dark,var(--ac,var(--brand)))}
.tm-pnl-wiecej summary:hover{text-decoration:underline}
.tm-pnl-wiecej[open] summary{margin-bottom:2px}
.tm-pnl-st{margin-left:6px;padding:1px 7px;border-radius:20px;background:var(--band);font-size:10.5px;letter-spacing:.08em;color:var(--txt-2);vertical-align:1px}
.tm-pnl-m{list-style:none;margin:0;padding:0}
.tm-pnl-mm{display:grid;grid-template-columns:78px minmax(0,1fr) 62px minmax(0,1fr);align-items:center;gap:6px;padding:6px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--txt)}
.tm-pnl-d{font-size:12px;color:var(--txt-3);white-space:nowrap}
.tm-pnl-g{text-align:right}
.tm-pnl-w{display:flex;flex-direction:column;align-items:center;justify-self:center;min-width:48px;padding:2px 6px;border-radius:6px;background:var(--band);font-weight:700;color:var(--txt-h);white-space:nowrap}
.tm-pnl-w a{color:inherit;text-decoration:none}
.tm-pnl-w a:hover{text-decoration:underline}
.tm-pnl-wt{background:none;font-weight:600;color:var(--txt-2)}
.tm-pnl-wl{background:var(--brand-bg);color:var(--brand)}
.tm-pnl-wl small{font-size:10.5px;font-weight:600}
.tm-pnl-stan{grid-column:1/-1;margin:0;font-size:11.5px;color:var(--txt-3)}
@media(max-width:900px){
	.tm-pnl{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:480px){
	.tm-pnl-br{display:none}
	.tm-pnl-mm{grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr);row-gap:2px}
	.tm-pnl-d{grid-column:1/-1}
	.tm-pnl-g,.tm-pnl-a{font-size:12.5px}
}
.tm-pnl-t th.tm-pnl-n{text-align:center}