.hn-bar{background-color:var(--color-bg-light);border-bottom:1px solid var(--color-border-light);color:var(--color-text);font-size:var(--fs-hot-news-meta,13px);line-height:1.4;}
.hn-bar[hidden]{display:none;}
.hn-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:9px;padding-bottom:9px;min-height:44px;box-sizing:border-box;}
.hn-news{display:flex;align-items:center;gap:10px;flex:1 1 auto;min-width:0;}
.hn-head{display:flex;align-items:center;gap:10px;flex:0 0 auto;}
.hn-label{display:inline-flex;align-items:center;gap:7px;color:var(--color-primary);font-weight:700;font-size:var(--fs-hot-news-meta,13px);white-space:nowrap;}
.hn-dot{display:block;width:8px;height:8px;border-radius:50%;background-color:currentColor;flex:0 0 auto;}
.hn-times{display:grid;}
.hn-time{grid-area:1/1;color:var(--color-news-date);white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s .3s;}
.hn-time.is-active{opacity:1;visibility:visible;transition-delay:0s;}
.hn-titles{display:grid;flex:1 1 auto;min-width:0;list-style:none;margin:0;padding:0;}
.hn-title{grid-area:1/1;min-width:0;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s .3s;}
.hn-title.is-active{opacity:1;visibility:visible;transition-delay:0s;}
.hn-link{color:var(--color-news-title);font-size:var(--fs-hot-news-title,15px);font-weight:700;line-height:1.3;text-decoration:none;}
.hn-link:hover{color:var(--color-primary);}
.hn-link:focus-visible,.hn-weather:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:2px;}
.hn-side{display:flex;align-items:center;flex:0 0 auto;white-space:nowrap;}
.hn-group + .hn-group{margin-left:14px;padding-left:14px;border-left:1px solid var(--color-border-light);}
.hn-weather{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none;}
.hn-wx-icon{font-size:1.25em;line-height:1;}
.hn-temp{color:var(--color-news-title);font-weight:700;}
.hn-city,.hn-date{color:var(--color-news-date);}
/* ---- Warianty wyglądu (7.85.0). V1 = styl bazowy wyżej; V2-V4 nadpisują tylko kolory i etykietę. Ten sam markup, klasa .hn-vN na .hn-bar. ---- */
/* V2 — czerwony alarm: tło koloru głównego, etykieta jako plakietka z białą ramką ("PILNE"). */
.hn-v2{background-color:var(--color-primary);border-bottom:0;color:var(--color-white);}
.hn-v2 .hn-dot{display:none;}
.hn-v2 .hn-label{color:var(--color-white);border:1.5px solid currentColor;border-radius:6px;padding:3px 10px;font-size:calc(var(--fs-hot-news-meta,13px) - 1px);line-height:1.2;letter-spacing:.04em;text-transform:uppercase;}
.hn-v2 .hn-time,.hn-v2 .hn-city,.hn-v2 .hn-date{color:rgba(255,255,255,.78);}
.hn-v2 .hn-link,.hn-v2 .hn-link:hover,.hn-v2 .hn-temp{color:var(--color-white);}
.hn-v2 .hn-link:hover{text-decoration:underline;}
.hn-v2 .hn-group + .hn-group{border-left-color:rgba(255,255,255,.35);}
.hn-v2 .hn-link:focus-visible,.hn-v2 .hn-weather:focus-visible{outline-color:var(--color-white);}
/* V3 — ciemny pasek: tło ciemne motywu, etykieta jako wypełniony prostokąt w kolorze głównym. */
.hn-v3{background-color:var(--color-bg-dark);border-bottom:0;color:var(--color-white);}
.hn-v3 .hn-dot{display:none;}
.hn-v3 .hn-label{background-color:var(--color-primary);color:var(--color-white);border-radius:3px;padding:4px 10px;font-size:calc(var(--fs-hot-news-meta,13px) - 1px);line-height:1.2;letter-spacing:.05em;text-transform:uppercase;}
.hn-v3 .hn-time,.hn-v3 .hn-city,.hn-v3 .hn-date{color:rgba(255,255,255,.65);}
.hn-v3 .hn-link,.hn-v3 .hn-link:hover,.hn-v3 .hn-temp{color:var(--color-white);}
.hn-v3 .hn-link:hover{text-decoration:underline;}
.hn-v3 .hn-group + .hn-group{border-left-color:rgba(255,255,255,.25);}
.hn-v3 .hn-link:focus-visible,.hn-v3 .hn-weather:focus-visible{outline-color:var(--color-white);}
/* V4 — biały pasek z akcentem u góry, etykieta jako wypełniona pigułka. */
.hn-v4{background-color:var(--color-white);border-top:3px solid var(--color-primary);}
.hn-v4 .hn-dot{display:none;}
.hn-v4 .hn-label{background-color:var(--color-primary);color:var(--color-white);border-radius:999px;padding:3px 11px;font-size:calc(var(--fs-hot-news-meta,13px) - 1px);line-height:1.2;letter-spacing:.04em;text-transform:uppercase;}
@media (max-width:768px){.hn-inner{display:block;position:relative;gap:0;padding-top:10px;padding-bottom:10px;min-height:0;}
.hn-news{display:block;}
.hn-head{margin-bottom:3px;padding-right:80px;}
.hn-side{position:absolute;top:10px;right:15px;}
.hn-city,.hn-date{display:none;}
.hn-group + .hn-group{margin-left:0;padding-left:0;border-left:0;}
}
@media (prefers-reduced-motion:reduce){.hn-time,.hn-title{transition:none;}
}
@media print{.hn-bar{display:none;}
}
/* ==== Warianty V5-V11 (7.86.0). Ten sam szkielet co V1; tryby: V5 ticker, V9 kolumny, reszta stos z rotacją. ==== */
.hn-ic{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
@keyframes hn-ring{from{transform:scale(1);opacity:.55}to{transform:scale(2.9);opacity:0}}
@keyframes hn-run{to{transform:translateX(var(--hn-shift,-50%))}}
@keyframes hn-fade{from{opacity:0}to{opacity:1}}

/* V5 — przewijany ticker: etykieta stoi, tytuły płyną w lewo; najechanie wstrzymuje ruch. */
.hn-v5{background-color:var(--color-white);border-top:1px solid var(--color-border-light);border-bottom:1px solid var(--color-border-light);}
.hn-v5 .hn-inner{gap:16px;padding-top:0;padding-bottom:0;min-height:46px;}
.hn-v5 .hn-news{gap:16px;min-width:0;}
.hn-v5 .hn-label{background-color:var(--color-primary);color:var(--color-white);border-radius:5px;padding:6px 12px;font-size:calc(var(--fs-hot-news-meta,13px) - .5px);letter-spacing:.03em;text-transform:uppercase;}
.hn-v5 .hn-dot{position:relative;}
.hn-v5 .hn-dot::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background-color:currentColor;pointer-events:none;animation:hn-ring 1.8s ease-out infinite;}
.hn-ticker{flex:1 1 auto;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 26px,#000 calc(100% - 26px),transparent);mask-image:linear-gradient(90deg,transparent,#000 26px,#000 calc(100% - 26px),transparent);}
.hn-track{display:flex;width:max-content;animation:hn-run var(--hn-dur,50s) linear infinite;}
.hn-ticker:hover .hn-track,.hn-ticker:focus-within .hn-track{animation-play-state:paused;}
.hn-tick{position:relative;display:flex;align-items:baseline;gap:10px;padding-right:58px;white-space:nowrap;color:inherit;text-decoration:none;}
.hn-tick::after{content:"";position:absolute;right:26px;top:50%;width:5px;height:5px;margin-top:-2.5px;background-color:var(--color-primary);}
.hn-tick .hn-time{opacity:1;visibility:visible;transition:none;}
.hn-tick .hn-link{display:inline;color:var(--color-news-title);font-size:var(--fs-hot-news-title,15px);font-weight:700;}
.hn-tick:hover .hn-link,.hn-tick:focus-visible .hn-link{color:var(--color-primary);}
.hn-tick:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px;}

/* V6 — miniatura zdjęcia po lewej, rotacja co N sekund. */
.hn-v6{background-color:var(--color-bg-light);border-bottom:1px solid var(--color-border-light);}
.hn-v6 .hn-inner{gap:14px;padding-top:8px;padding-bottom:8px;}
.hn-thumbs{display:grid;flex:0 0 auto;}
.hn-thumb{grid-area:1/1;width:46px;height:46px;border-radius:10px;overflow:hidden;background-color:var(--color-border-light);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s .3s;}
.hn-thumb.is-active{opacity:1;visibility:visible;transition-delay:0s;}
.hn-img{display:block;width:100%;height:100%;object-fit:cover;}
.hn-v6 .hn-news{flex-direction:column;align-items:flex-start;gap:1px;flex:1 1 auto;min-width:0;}
.hn-v6 .hn-titles{width:100%;}

/* V7 — chip kategorii przed czasem i tytułem, link "Wszystkie newsy" po prawej. */
.hn-v7{background-color:var(--color-white);border-bottom:1px solid var(--color-border-light);}
.hn-v7 .hn-inner{min-height:52px;}
.hn-cats{display:grid;}
.hn-cat{grid-area:1/1;align-self:center;justify-self:start;padding:4px 10px;border:1px solid color-mix(in srgb,var(--color-primary) 26%,var(--color-white));border-radius:6px;background-color:color-mix(in srgb,var(--color-primary) 9%,var(--color-white));color:var(--color-primary);font-size:calc(var(--fs-hot-news-meta,13px) - .5px);font-weight:700;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s .3s;}
.hn-cat.is-active{opacity:1;visibility:visible;transition-delay:0s;}
/* Jedna linia ZAWSZE: chip, czas i tytuł obok siebie; tytuł nie zawija się, a gdy się nie mieści — kończy się wielokropkiem (świadomy wyjątek od zasady "bez ucinania tytułów", na życzenie klienta). */
/* Wyrównanie do lewej tuż za chipem (7.90.1): w stosie wszystkie chipy/czasy/tytuły leżą w jednej komórce siatki, więc kolumna miała szerokość NAJSZERSZEGO z nich i krótki chip zostawiał dziurę przed czasem. W V7 nieaktywne elementy są więc display:none (liczy się tylko aktywny), a zmianę newsa pokazuje krótkie wejście zamiast przenikania. */
.hn-v7 .hn-cats,.hn-v7 .hn-times{display:flex;align-items:center;}
.hn-v7 .hn-cat,.hn-v7 .hn-time,.hn-v7 .hn-title{display:none;opacity:1;visibility:visible;transition:none;}
.hn-v7 .hn-cat.is-active,.hn-v7 .hn-time.is-active,.hn-v7 .hn-title.is-active{display:block;animation:hn-fade .35s ease;}
.hn-v7 .hn-news{flex-wrap:nowrap;}
.hn-v7 .hn-head{flex:0 0 auto;}
.hn-v7 .hn-titles,.hn-v7 .hn-title{min-width:0;}
.hn-v7 .hn-link{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}

/* V8 — minimalny: ikona i etykieta, tytuł, czas przy prawej krawędzi; bez tła. */
.hn-v8{background-color:transparent;border-bottom:1px solid var(--color-border-light);}
.hn-v8 .hn-inner{min-height:42px;padding-top:6px;padding-bottom:6px;}
.hn-v8 .hn-news{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"label title time";align-items:center;column-gap:10px;}
.hn-v8 .hn-head{display:contents;}
.hn-v8 .hn-label{grid-area:label;gap:8px;}
.hn-v8 .hn-dot{display:none;}
.hn-v8 .hn-titles{grid-area:title;}
.hn-v8 .hn-times{grid-area:time;justify-self:end;}
.hn-v8 .hn-link{font-size:calc(var(--fs-hot-news-title,15px) - 1px);font-weight:600;}

/* V9 — kilka newsów obok siebie; rotacja przesuwa całe grupy (na telefonie jeden news). */
.hn-v9{background-color:var(--color-bg-light);border-bottom:1px solid var(--color-border-light);}
.hn-v9 .hn-inner{align-items:stretch;padding-top:0;padding-bottom:0;min-height:62px;}
.hn-v9 .hn-news{align-items:stretch;gap:0;}
.hn-v9 .hn-head{align-items:center;padding-right:22px;}
.hn-v9 .hn-titles{grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);}
.hn-v9 .hn-title{grid-area:auto;display:none;flex-direction:column;justify-content:center;gap:2px;padding:9px 22px;border-left:1px solid var(--color-border-light);opacity:1;visibility:visible;transition:none;}
.hn-v9 .hn-title.is-active{display:flex;animation:hn-fade .35s ease;}
.hn-v9 .hn-time{opacity:1;visibility:visible;transition:none;}
.hn-v9 .hn-link{font-size:calc(var(--fs-hot-news-title,15px) - 1px);}

/* V10 — odcień koloru głównego z grubą lewą krawędzią. */
.hn-v10{background-color:color-mix(in srgb,var(--color-primary) 9%,var(--color-white));border-bottom:1px solid color-mix(in srgb,var(--color-primary) 18%,var(--color-white));box-shadow:inset 5px 0 0 var(--color-primary);}
.hn-v10 .hn-inner{min-height:50px;}
.hn-v10 .hn-news{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"label title time";align-items:center;column-gap:12px;}
.hn-v10 .hn-head{display:contents;}
.hn-v10 .hn-label{grid-area:label;gap:8px;font-weight:800;}
.hn-v10 .hn-dot{display:none;}
.hn-v10 .hn-label .hn-ic{width:20px;height:20px;}
.hn-v10 .hn-titles{grid-area:title;}
.hn-v10 .hn-times{grid-area:time;justify-self:end;}
.hn-v10 .hn-time{color:var(--color-primary);font-weight:600;}

/* V11 — skośne cięcie: kolorowy blok z etykietą sięga do lewej krawędzi ekranu (pseudo-element, bez liczenia marginesów). */
.hn-v11{overflow:hidden;background-color:var(--color-bg-light);border-bottom:1px solid var(--color-border-light);}
.hn-v11 .hn-inner{align-items:stretch;padding-top:0;padding-bottom:0;min-height:48px;}
.hn-v11 .hn-news{display:grid;grid-template-columns:auto auto 1fr;grid-template-areas:"label time title";align-items:stretch;column-gap:12px;}
.hn-v11 .hn-head{display:contents;}
.hn-v11 .hn-label{grid-area:label;position:relative;align-items:center;gap:8px;padding-right:14px;background-color:var(--color-primary);color:var(--color-white);}
.hn-v11 .hn-label::before{content:"";position:absolute;top:0;right:100%;bottom:0;width:100vw;background-color:var(--color-primary);}
.hn-v11 .hn-label::after{content:"";position:absolute;top:0;bottom:0;left:100%;width:22px;background-color:var(--color-primary);clip-path:polygon(0 0,100% 0,0 100%);}
.hn-v11 .hn-times{grid-area:time;align-self:center;margin-left:22px;}
.hn-v11 .hn-titles{grid-area:title;align-self:center;}
.hn-v11 .hn-side{align-self:center;}

@media (max-width:768px){
.hn-v5 .hn-inner{display:flex;align-items:center;padding:0 15px;gap:12px;}
.hn-v5 .hn-news{display:flex;gap:12px;}
.hn-v5 .hn-head{margin:0;padding:0;}
.hn-v5 .hn-side{display:none;}
.hn-v6 .hn-inner{display:flex;align-items:center;gap:12px;padding-top:9px;padding-bottom:9px;}
.hn-v6 .hn-news{display:flex;}
.hn-v6 .hn-head{margin-bottom:0;}
.hn-v7 .hn-inner{display:flex;align-items:center;padding-top:10px;padding-bottom:10px;}
.hn-v7 .hn-news{display:flex;align-items:center;gap:10px;min-width:0;width:100%;}
.hn-v7 .hn-head{margin:0;padding:0;}
.hn-v7 .hn-side{display:none;}
.hn-v8 .hn-news{grid-template-columns:auto 1fr;grid-template-areas:"label title";align-items:start;}
.hn-v8 .hn-times,.hn-v8 .hn-side{display:none;}
.hn-v9 .hn-inner{display:block;padding-top:10px;padding-bottom:10px;}
.hn-v9 .hn-news{display:block;}
.hn-v9 .hn-title{padding:0;border-left:0;}
.hn-v10 .hn-news{grid-template-columns:auto 1fr;grid-template-areas:"label time" "title title";row-gap:2px;}
.hn-v10 .hn-side{display:none;}
.hn-v10 .hn-inner{padding-top:9px;padding-bottom:9px;}
.hn-v11 .hn-news{grid-template-columns:auto 1fr;grid-template-areas:"label time" "label title";column-gap:12px;row-gap:1px;}
.hn-v11 .hn-times{align-self:end;padding-top:8px;}
.hn-v11 .hn-titles{align-self:start;margin-left:22px;padding-bottom:9px;}
.hn-v11 .hn-side{display:none;}
}
@media (prefers-reduced-motion:reduce){.hn-track{animation:none;}
.hn-v9 .hn-title.is-active{animation:none;}
.hn-v7 .hn-cat.is-active,.hn-v7 .hn-time.is-active,.hn-v7 .hn-title.is-active{animation:none;}
.hn-v5 .hn-dot::after{animation:none;}
}

/* ==== Układ boxed (7.87.0, ramka i zaokrąglenie 7.89.0): sam pasek jest pudełkiem o szerokości TREŚCI strony (kontener minus jego padding), więc krawędzie wypadają równo z kartami pod nim. Wnętrze (.container.hn-inner) zostaje i daje wewnętrzny odstęp. Ramka jest zerowa, dopóki PHP nie doda klas .hn-bd-t/-b/-l/-r (włączone boki); .hn-sq wyłącza zaokrąglenie. Pionowy margines (domyślnie 0, czyli margin: 0 auto) to zmienne --hn-mv-d (komputer) i --hn-mv-m (telefon, <=768 px) ustawiane inline przez PHP tylko dla wartości > 0. ==== */
.hn-bar.hn-boxed{width:calc(100% - 40px);max-width:calc(var(--container-width,1300px) - 40px);margin:var(--hn-mv-d,0) auto;border-width:0;border-style:solid;border-color:var(--color-border-light);border-radius:10px;}
.hn-bar.hn-boxed.hn-sq{border-radius:0;}
.hn-boxed.hn-bd-t{border-top-width:1px;}
.hn-boxed.hn-bd-b{border-bottom-width:1px;}
.hn-boxed.hn-bd-l{border-left-width:1px;}
.hn-boxed.hn-bd-r{border-right-width:1px;}
.hn-v2.hn-boxed{border-color:color-mix(in srgb,var(--color-primary) 78%,#000);}
.hn-v3.hn-boxed{border-color:color-mix(in srgb,var(--color-white) 22%,var(--color-bg-dark));}
.hn-v4.hn-boxed.hn-bd-t{border-top-width:3px;border-top-color:var(--color-primary);}
.hn-v10.hn-boxed{border-color:color-mix(in srgb,var(--color-primary) 18%,var(--color-white));}
@media (max-width:768px){.hn-bar.hn-boxed{width:calc(100% - 30px);margin:var(--hn-mv-m,0) auto;}
}
/* V12 — miniatura zdjęcia (jak V6) i przewijany ticker (jak V5). Etykieta stoi, a w torze każdy news ma miniaturę i dwie linie: czas nad tytułem. */
.hn-tick-txt{display:contents;}
.hn-v12{background-color:var(--color-bg-light);border-bottom:1px solid var(--color-border-light);}
.hn-v12 .hn-inner{gap:16px;padding-top:8px;padding-bottom:8px;min-height:62px;}
.hn-v12 .hn-news{gap:16px;min-width:0;}
.hn-v12 .hn-tick{align-items:center;gap:12px;padding-right:44px;}
/* V12 bez separatora 5x5: każdy news zaczyna się miniaturą, więc znacznik między newsami jest zbędny (7.90.2). */
.hn-v12 .hn-tick::after{content:none;}
.hn-v12 .hn-tick-txt{display:flex;flex-direction:column;gap:1px;}
.hn-tick-img{display:block;flex:0 0 auto;width:46px;height:46px;border-radius:10px;overflow:hidden;background-color:var(--color-border-light);}
@media (max-width:768px){
.hn-v12 .hn-inner{display:flex;align-items:center;gap:12px;padding:8px 15px;}
.hn-v12 .hn-news{display:flex;gap:12px;}
.hn-v12 .hn-head{margin:0;padding:0;}
.hn-v12 .hn-side{display:none;}
}

/* Pełna szerokość bez obramowania (7.92.0): klasa .hn-nb dodawana przez PHP, gdy układ = full i checkbox "obramowanie paska" odznaczony. Zeruje wszystkie ramki paska (dolną, górną, akcent V4); box-shadow V10 (lewa krawędź) to element wyglądu wariantu, nie ramka, i zostaje. */
.hn-bar.hn-nb{border-width:0;}