/* pws-dashboard.css - hlavní stránka dashboardu (PWS_index2.php) podle DESIGN.md.
   Tokeny a písma bere z pws-base.css. Starý vzhled bloků je zatím v inline CSS
   PWS_index2.php; tady je to, co už odpovídá novému systému. */

/* ---------- písmo celé stránky ---------- */

body {
  font-family: var(--pr-sans);
  line-height: 1.35;
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
}

/* tlačítka a pole písmo nedědí, prohlížeč jim dává systémové */
button,
input,
select {
  font-family: inherit;
}

/* nadpis bloku: role headline v menším měřítku starých dlaždic */
.PWS_module_title:not(.pws-links) > span {
  font-size: var(--pr-fs-body);
  font-weight: 600;
}

/* Plex 12px je širší než dřívější Arial 10px a popisky se lámou na dva řádky.
   Blok proto roste podle obsahu místo pevných 192px a řada se srovná na nejvyšší
   blok; lišta odkazů zůstává dole. */
.PWS_weather_container {
  align-items: stretch;
}

div.PWS_weather_item {
  height: auto;
  min-height: 192px;
  display: flex;
  flex-direction: column;
}

div.PWS_weather_item > .pws-block-body {
  flex: 1 0 auto;
}

/* bloky slunce, měsíce a větru mají boxům inline výšku 40/64px na míru Arialu 10px;
   !important jen do přestavby bloků z komponent reportu */
.PWS_div_left,
.PWS_div_right {
  height: auto !important;
}

/* lišta odkazů pod blokem (Grafy - Předpověď ...) byla 10px */
.PWS_module_title.pws-links {
  text-align: left;
  font-size: var(--pr-fs-note);
  padding-top: 2px;
}

/* ---------- hlavička ---------- */

.pws-top {
  flex: 1 1 100%;
  min-width: 0;
  margin: 2px 2px 8px;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--pr-surface);
  border: 1px solid var(--pr-line);
  border-radius: 10px;
  color: var(--pr-ink);
  text-align: left;
}

.pws-top-title {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin-left: 6px;
}

/* motiv dashboardu dává každému h1 podklad hlavičky ($clr_mnbg) */
.pws-top h1 {
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  /* název stránky je role Title (DESIGN.md, 20 px), o stupeň nad nadpisy karet */
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.015em;
  text-align: left;
  color: var(--pr-ink);
}

.pws-top-sub {
  font-size: var(--pr-fs-note);
  color: var(--pr-ink-dim);
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* tiché ovladače: v klidu zvednutý grafit a tlumený inkoust, při najetí plný */
.pws-top-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid var(--pr-line);
  border-radius: 6px;
  background: var(--pr-surface-2);
  color: var(--pr-ink-dim);
  font-family: var(--pr-sans);
  font-size: var(--pr-fs-body);
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
  transition: color .15s, border-color .15s;
}

.pws-top-btn:hover,
.pws-top-btn[aria-expanded="true"] {
  color: var(--pr-ink);
  border-color: var(--pr-ink-faint);
}

.pws-top-btn svg {
  flex: none;
  fill: currentColor;
  stroke: currentColor;
}

/* jediný závazný prvek značky (PRODUCT.md): odkaz na stanici v síti In-počasí */
.pws-top-ext {
  margin-left: auto;
}

.pws-top :focus-visible,
#sidebarMenu :focus-visible {
  outline: 2px solid var(--pr-zast);
  outline-offset: 2px;
}

@media (max-width: 639px) {
  .pws-top-sub {
    display: none;
  }

  /* na telefonu jen ikony, popisky nese aria-label */
  .pws-top-btn .pws-top-txt {
    display: none;
  }
}

@media (pointer: coarse) {
  .pws-top-btn {
    min-height: 40px;
    min-width: 40px;
    justify-content: center;
  }
}

/* zavírací tlačítko menu: dřív oranžový span bez klávesnice */
.pws-menu-close {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  margin: 10px 0 0 196px;
  border: 1px solid var(--pr-line);
  border-radius: 6px;
  background: var(--pr-surface-2);
  color: var(--pr-ink-dim);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}

.pws-menu-close:hover {
  color: var(--pr-ink);
}

/* ---------- barvy podle rolí (DESIGN.md) ---------- */

/* Hodnoty jsou inkoust, popisky tlumený inkoust ($clr_txt). Barva zůstává jen tam,
   kde něco znamená: teplota ze škály (inline z PHP), stav, varování. */
div.PWS_weather_item b,
.pws-val {
  color: var(--pr-ink);
}

/* stav bloku má přednost před pravidlem pro hodnoty výše */
.PWS_weather_item b.PWS_offline {
  color: var(--pr-warn);
}

.PWS_weather_item b.PWS_online {
  color: var(--pr-ok);
}

/* starší barevné třídy bloků: oranžová zbyla jen u výstrah (bouřka, mráz, požár,
   polární záře), ostatní nic neznamenaly */
.orange { color: var(--pr-warn); }
.blue { color: var(--pr-hum-ink); }
.green, .yellow, .red, .purple, .maroon { color: var(--pr-ink); }
.grey { color: var(--pr-ink-dim); }

/* karta bloku: obrys, poloměr a jeden měkký stín místo černého rámečku */
div.PWS_weather_item {
  border: 1px solid var(--pr-line);
  border-radius: 10px;
  box-shadow: var(--pr-shadow);
}

/* nadpis a lišta odkazů odděleny jemnou linkou místo šedého pruhu */
.PWS_module_title:not(.pws-links) {
  border-bottom: 1px solid var(--pr-line-soft);
}

.PWS_module_title.pws-links {
  border-top: 1px solid var(--pr-line-soft);
}

/* boxy hodnot: dřív barevná 3px hrana podle hodnoty (inline), teď jako buňky reportu */
.PWS_div_left,
.PWS_div_right {
  border: 1px solid var(--pr-line) !important;
  border-radius: 6px;
  background: var(--pr-surface-2);
}

/* odkazy v blocích a liště: tlumené, při najetí plný inkoust */
div.PWS_weather_item a:hover,
.sidebarMenuInner li a:hover {
  color: var(--pr-ink);
}

/* hlavní teplota je pilulka: bílý text na ztmavené barvě škály i ve světlém tématu */
div.PWS_weather_item .pws-temp-pill b {
  color: inherit;
}

/* nesvítící dílky UV a světelných sloupců bral motiv z barvy pruhu nadpisu */
.PWS_bar {
  color: var(--pr-line);
}

/* zástupný prázdný box (barometr bez trendu) jen držel místo */
.PWS_div_right.pws-empty {
  visibility: hidden;
}

/* Boxy hodnot jsou buňky, ne karty v kartě: podklad bez obrysu a dost místa kolem
   textu (dřív padding 1px). Přebíjí i obrys z dřívějšího pravidla výše. */
.PWS_div_left,
.PWS_div_right {
  border: 0 !important;
  padding: 4px 6px;
}

/* jméno čidla v dlaždici: barvy registru jsou laděné na tmavé, na světlém se ztmaví */
html.light .pws-tile-name {
  color: color-mix(in oklab, var(--tile-accent), var(--pr-ink) 45%);
}

/* nadpis bloku měl pevných 18px a text narážel na linku pod ním */
.PWS_module_title:not(.pws-links) {
  height: auto;
  padding: 4px 8px 3px;
}

/* ---------- mřížka stránky (shape brief) ---------- */

/* Řada „Teď“ i mřížka bloků sdílejí sloupce: telefon 1, tablet 2, desktop 3,
   od 1280px 4. Dřív pevné dlaždice 316px v flexu a na širokém monitoru 960px sloupec. */
.PWS_weather_container.pws-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  margin: 0 auto 14px;
  padding: 0 2px;
}

.pws-grid > .PWS_weather_item {
  width: auto;
  min-width: 0;
  margin: 0;
  float: none;
}

@media (min-width: 640px) {
  .PWS_weather_container.pws-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pws-now-station { grid-column: 1 / -1; }
}

@media (min-width: 960px) {
  .PWS_weather_container.pws-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pws-now-station { grid-column: auto; }
}

@media (min-width: 1280px) {
  .PWS_weather_container { width: 1280px; }
  .PWS_weather_container.pws-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pws-now-station { grid-column: span 2; }
}

/* ---------- karty řady „Teď“ (komponenty z reportu) ---------- */

.pws-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 12px 14px;
  background: var(--pr-surface);
  border: 1px solid var(--pr-line);
  border-radius: 10px;
  box-shadow: var(--pr-shadow);
  color: var(--pr-ink);
  text-align: left;
}

.pws-card * {
  text-align: inherit;
}

.pws-card-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin-bottom: 10px;
}

.pws-card-head h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--pr-ink);
  background: none;
}

.pws-card-head .pws-stat {
  margin-left: auto;
}

.pws-now-body {
  flex: 1 0 auto;
}

.pws-chip {
  font-family: var(--pr-mono);
  font-size: var(--pr-fs-label);
  color: var(--pr-ink);
  background: var(--pr-surface-2);
  box-shadow: inset 0 0 0 1px var(--pr-line);
  border-radius: 4px;
  padding: 1px 7px;
}

.pws-stat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 10px 2px 8px;
  border-radius: 999px;
  background: var(--pr-surface-2);
  box-shadow: inset 0 0 0 1px var(--pr-line);
  font-size: var(--pr-fs-note);
  color: var(--pr-ink);
  white-space: nowrap;
}

.pws-stat .pws-age { color: var(--pr-ink-dim); }

.pws-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex: none;
}

/* budík vlevo, hodnoty „teď“ vpravo, zbytek přes celou šířku pod nimi */
.pws-readout {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px 12px;
  align-items: start;
}

.pws-gauge-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.pws-gauge {
  display: block;
  width: clamp(112px, 34cqi, 140px);
  height: auto;
}

.pws-gauge text { font-family: var(--pr-mono); }
.pws-gauge-v { font-size: 31px; font-weight: 600; letter-spacing: -1px; }
.pws-gauge-u { font-size: 14px; fill: var(--pr-ink-dim); }

.pws-cells {
  display: grid;
  gap: 1px;
  background: var(--pr-line-soft);
  border-radius: 7px;
  overflow: hidden;
}

.pws-cells-now { grid-template-columns: minmax(0, 1fr); }

.pws-cells-more {
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pws-cell {
  padding: 7px 10px 8px;
  background: var(--pr-surface-2);
  min-width: 0;
}

/* lichá poslední buňka by nechala díru vedle sebe */
.pws-cells-more > .pws-cell:last-child:nth-child(odd) { grid-column: 1 / -1; }

.pws-k {
  font-size: var(--pr-fs-label);
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--pr-ink-dim);
}

.pws-v {
  margin-top: 4px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 6px;
}

.pws-n {
  margin-top: 3px;
  font-size: var(--pr-fs-note);
  color: var(--pr-ink-dim);
}

.pws-num {
  font-family: var(--pr-mono);
  font-size: 15px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  color: var(--pr-ink);
}

.pws-u {
  font-family: var(--pr-sans);
  font-size: var(--pr-fs-note);
  font-weight: 400;
  color: var(--pr-ink-dim);
}

.pws-sep { color: var(--pr-ink-faint); }

.pws-pill,
.pws-hum {
  display: inline-flex;
  padding: 2px 10px;
  border-radius: 999px;
  font-family: var(--pr-mono);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.pws-pill {
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .22);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}

.pws-hum {
  background: var(--pr-hum-bg);
  color: var(--pr-hum-ink);
  box-shadow: inset 0 0 0 1px var(--pr-hum-bd);
}

.pws-warn {
  padding: 0 8px;
  border-radius: 999px;
  font-size: var(--pr-fs-note);
  color: var(--pr-warn);
  background: color-mix(in srgb, var(--pr-warn) 10%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pr-warn) 40%, transparent);
}

/* lišta odkazů dole v kartě: tiché odkazy, na dotyku 40px cíle */
.pws-card-links {
  margin: 10px -14px -12px;
  padding: 6px 14px;
  border-top: 1px solid var(--pr-line-soft);
  font-size: var(--pr-fs-note);
  color: var(--pr-ink-dim);
}

.pws-card-links a { color: var(--pr-ink-dim); }
.pws-card-links a:hover { color: var(--pr-ink); }

/* zvýrazněný odkaz na bohatší stránku webu (Stránka předpovědi, Historie čidel): jantarový čip,
   stejný u všech, aby se poznalo, že vede na celou stránku */
.pws-card-links a.pws-link-hi,
#sidebarMenu .sidebarMenuInner li a.pws-link-hi {
  --hi: var(--q-sun);
  padding: 1px 9px;
  border-radius: 999px;
  color: var(--hi);
  background: color-mix(in srgb, var(--hi) 12%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--hi) 38%, transparent);
  font-weight: 600;
  white-space: nowrap;
}
.pws-card-links a.pws-link-hi::after,
#sidebarMenu .sidebarMenuInner li a.pws-link-hi::after { content: " →"; }
.pws-card-links a.pws-link-hi:hover,
#sidebarMenu .sidebarMenuInner li a.pws-link-hi:hover { color: var(--pr-ink); background: color-mix(in srgb, var(--hi) 22%, transparent); }

@media (pointer: coarse) {
  .pws-card-links a { display: inline-flex; align-items: center; min-height: 40px; }
}

/* mikroklima: obě čidla v jedné kartě vedle stanice, karta vyplní výšku řady */
.pws-now-sensors {
  display: grid;
  min-width: 0;
}

.pws-head-note {
  margin-left: auto;
  font-size: var(--pr-fs-note);
  color: var(--pr-ink-dim);
}

.pws-micro-list {
  display: grid;
  align-content: start;
  gap: 1px;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--pr-line-soft);
  border-radius: 7px;
  overflow: hidden;
}

.pws-micro-row {
  display: grid;
  gap: 4px;
  padding: 10px 12px 11px;
  background: var(--pr-surface-2);
}

.pws-micro-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 4px 8px;
}

/* název čidla v jeho barvě jako v reportu; na světlém tématu ztmavený kvůli kontrastu */
.pws-micro-head h4 {
  margin: 0;
  font-size: var(--pr-fs-control);
  font-weight: 600;
  color: var(--pr-accent);
}

/* 45 % inkoustu dávalo zelené sadu 4,45:1, pod hranicí 4,5:1 */
html.light .pws-micro-head h4 {
  color: color-mix(in oklab, var(--pr-accent), var(--pr-ink) 55%);
}

.pws-micro-vals {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
}

.pws-micro-t {
  font-family: var(--pr-mono);
  font-size: 20px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.pws-micro-t.pws-zero { color: var(--pr-ink-dim); }

/* rozdíl proti stanici: barva směru, ne teplotní škály (DESIGN.md, Směr změny) */
.pws-delta {
  padding: 2px 8px;
  border-radius: 999px;
  font-family: var(--pr-mono);
  font-size: var(--pr-fs-body);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  /* text posunutý k inkoustu: čistá chladnější modrá měla na své výplni 3,9:1 */
  color: color-mix(in oklab, var(--tone), var(--pr-ink) 30%);
  background: color-mix(in srgb, var(--tone) 12%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tone) 40%, transparent);
}

.pws-delta-w { --tone: var(--pw-warmer); }
.pws-delta-c { --tone: var(--pw-colder); }
.pws-delta-n { --tone: var(--pr-ink-dim); }

.pws-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.pws-micro .pws-card-links a:not(.pws-link-hi) { color: var(--pr-ink); }

.pws-now-station { container-type: inline-size; }

/* budík stanice je hlavní hodnota stránky: větší kruh i číslo (výjimka ze stupnice
   velikostí platí jen pro tuhle plochu rychlého pohledu) */
.pws-gauge.pws-gauge-big { width: clamp(150px, 38cqi, 210px); }
.pws-gauge .pws-gauge-hero { font-size: 38px; letter-spacing: -1.5px; }
.pws-gauge .pws-gauge-hero-s { font-size: 32px; letter-spacing: -1.5px; }

/* na širší kartě stanice (4 sloupce) se vejdou buňky do tří sloupců */
@container (min-width: 520px) {
  .pws-now-station .pws-cells-more { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pws-now-station .pws-cells-more > .pws-cell:last-child:nth-child(odd) { grid-column: auto; }
}

/* hlavička nesmí přidat k šířce kontejneru vlastní boční okraje */
.pws-top {
  margin-inline: 0;
}

/* Staré bloky mají vnitřní sloupce 86 + 136 + 86 px (+ inline okraje) na míru dlaždice
   316px; ve sloupci mřížky (~309px) by pravý plovoucí sloupec spadl pod ostatní.
   Obsah se třemi sloupci je proto flex a prostřední sloupec bere zbytek. */
.pws-grid .PWS_module_content:has(> .PWS_middle) {
  display: flex;
  align-items: flex-start;
}

.pws-grid .PWS_module_content:has(> .PWS_middle) > .PWS_left,
.pws-grid .PWS_module_content:has(> .PWS_middle) > .PWS_right {
  flex: none;
}

.pws-grid .PWS_module_content:has(> .PWS_middle) > .PWS_middle {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
}

/* štítek stavu bloku má záporný okraj, aby ve staré dlaždici seděl v pruhu nadpisu;
   v kartě by vlezl do nadpisu */
.pws-now-body .PWS_ol_time {
  float: none;
  margin: 0 0 4px;
  text-align: right;
}

/* pět buněk ve třech sloupcích: poslední zabere zbytek řady */
@container (min-width: 520px) {
  .pws-now-station .pws-cells-more > .pws-cell:nth-child(5):last-child { grid-column: span 2; }
}

/* ---------- karty mřížky (vítr, srážky; další bloky přibývají) ---------- */

.pws-gcard { container-type: inline-size; }

.pws-head-warn { margin-left: auto; }

.pws-wide { grid-column: 1 / -1; min-width: 0; }

.pws-cells + .pws-cells { margin-top: 10px; }

.pws-cells-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.pws-cells-sum { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pws-cells-sum:has(> :nth-child(4)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.pws-num.pws-lead { font-size: 20px; }
.pws-zero,
.pws-zero .pws-u { color: var(--pr-ink-dim); }

.pws-num-s {
  font-family: var(--pr-mono);
  font-variant-numeric: tabular-nums;
  color: var(--pr-ink);
  white-space: nowrap;
}

.pws-card-note {
  margin: 10px 0 0;
  font-size: var(--pr-fs-note);
  color: var(--pr-ink-dim);
}

/* písmena světových stran jsou popisky, ne data */
:is(.pws-gauge, .pws-rose) .pws-compass-l {
  font-family: var(--pr-sans);
  font-size: 14px;
  font-weight: 600;
  fill: var(--pr-ink-dim);
}

/* rekordy: období vlevo, hodnota zarovnaná doprava, kdy padla tlumeně za ní */
.pws-rec {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--pr-fs-note);
}

.pws-rec thead th {
  padding: 0 0 4px;
  font-size: var(--pr-fs-label);
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--pr-ink-dim);
  text-align: left;
  border-bottom: 1px solid var(--pr-line);
}

.pws-rec tbody th {
  padding: 5px 8px 5px 0;
  font-weight: 400;
  color: var(--pr-ink-dim);
  text-align: left;
  white-space: nowrap;
}

.pws-rec tbody tr + tr > * { border-top: 1px solid var(--pr-line-soft); }

.pws-rec .pws-rec-v {
  width: 1%;
  padding: 5px 6px 5px 0;
  text-align: right;
  white-space: nowrap;
}

.pws-rec .pws-rec-v .pws-num { font-size: 14px; }

.pws-rec .pws-rec-t {
  padding: 5px 8px 5px 0;
  font-family: var(--pr-mono);
  font-variant-numeric: tabular-nums;
  color: var(--pr-ink-dim);
  white-space: nowrap;
}

.pws-readout + .pws-card-note,
.pws-wide > .pws-rec { margin-top: 2px; }

/* v kartě mřížky je vedle kompasu jen úzký sloupec buněk, kompas smí být větší */
.pws-gcard .pws-gauge { width: clamp(116px, 40cqi, 140px); }

/* šestimístný tlak a odpočet do západu se do kruhu vejdou jen o stupeň menší */
.pws-gauge .pws-gauge-v-s { font-size: 24px; letter-spacing: -.5px; }
.pws-gauge .pws-gauge-u-t { font-family: var(--pr-sans); font-size: 13px; }

/* slunce a měsíc: vlastní barvy jen pro kreslený obraz, obě témata */
:root {
  --pw-sun: #e0c04f;
  --pw-moon-lit: #e6e4d8;
  --pw-moon-dark: #262d30;
  --pw-moon-edge: var(--pr-line);
  --pw-warmer: #e0813f;
  --pw-colder: #4a90d9;
}

html.light {
  --pw-sun: #b38b14;
  --pw-moon-lit: #fbf3d2;
  --pw-moon-dark: #b9c3c7;
  --pw-moon-edge: #9aa6ab;
  /* na bílé kartě ztmavené na kontrast 4,5:1, odstín zůstává jako v reportu */
  --pw-warmer: #a9531a;
  --pw-colder: #2a64a8;
}

/* extrémy teploty: období, min, pruh rozpětí na společné ose, max */
.pws-ext {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--pr-fs-note);
}

.pws-ext thead th {
  padding: 0 0 4px;
  font-size: var(--pr-fs-label);
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--pr-ink-dim);
  text-align: right;
}

.pws-ext thead th:last-child { text-align: left; }

.pws-ext tbody > tr > * {
  padding: 6px 0;
  border-top: 1px solid var(--pr-line-soft);
  vertical-align: middle;
}

.pws-ext tbody th {
  width: 1%;
  padding-right: 8px;
  font-weight: 400;
  color: var(--pr-ink-dim);
  text-align: left;
  white-space: nowrap;
}

.pws-ext-v {
  width: 1%;
  white-space: nowrap;
  text-align: right;
}

.pws-ext-v:last-child { text-align: left; }
.pws-ext-v .pws-num { display: block; font-size: 14px; }
.pws-pill.pws-pill-xs,
.pws-hum.pws-pill-xs { padding: 1px 8px; font-size: var(--pr-fs-note); }
.pws-ext-v .pws-pill-xs + .pws-ext-t { margin-top: 2px; }

.pws-ext-t {
  display: block;
  font-family: var(--pr-mono);
  font-size: var(--pr-fs-label);
  color: var(--pr-ink-dim);
}

.pws-ext-bar {
  position: relative;
  min-width: 60px;
}

.pws-ext-track {
  position: absolute;
  left: 8px;
  right: 8px;
  top: 50%;
  height: 6px;
  margin-top: -3px;
  border-radius: 3px;
  background: var(--pr-line-soft);
}

.pws-ext-track i {
  position: absolute;
  top: 0;
  bottom: 0;
  border-radius: 3px;
}

/* ovzduší: slovní hodnocení, šestistupňová škála EEA, látky v µg/m³ */
.pws-aq { margin-bottom: 10px; }

.pws-aq-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  font-size: 15px;
  font-weight: 600;
  color: var(--pr-ink);
}

.pws-aq-scale {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 3px;
}

.pws-aq-scale i {
  height: 6px;
  border-radius: 3px;
  background: var(--pr-line);
}

.pws-aq-ends {
  display: flex;
  justify-content: space-between;
  margin-top: 4px;
  font-size: var(--pr-fs-label);
  color: var(--pr-ink-dim);
}

.pws-cells-sum .pws-n {
  display: flex;
  align-items: center;
  gap: 5px;
}

/* obloha: ikona stavu vedle popisu, METAR jako surová data */
.pws-sky {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}

.pws-sky img { flex: none; width: 64px; height: 64px; }

.pws-sky-desc {
  margin: 0 0 2px;
  font-size: 15px;
  font-weight: 600;
  color: var(--pr-ink);
}

.pws-sky p.pws-n { margin: 0; }

.pws-metar {
  font-family: var(--pr-mono);
  font-size: var(--pr-fs-label);
  line-height: 1.5;
  overflow-wrap: anywhere;
  text-wrap: pretty;
}

.pws-card-note a { color: var(--pr-ink-dim); text-decoration: underline; text-underline-offset: 2px; }
.pws-card-note a:hover { color: var(--pr-ink); }

/* kamera: záběr přes celou šířku obsahu karty, pevný poměr drží výšku řádku */
.pws-cam {
  display: block;
  border-radius: 7px;
  overflow: hidden;
  background: var(--pr-surface-2);
}

.pws-cam img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* externí kamera občas nevrátí obrázek; místo ikony rozbitého obrázku věta */
.pws-cam.pws-cam-off img { visibility: hidden; }
.pws-cam.pws-cam-off { position: relative; }
.pws-cam.pws-cam-off::after {
  content: attr(data-off);
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: var(--pr-fs-note);
  color: var(--pr-ink-dim);
}

/* pruh výstrah nad řadou „Teď“; bez výstrahy prázdný a bez místa */
.pws-alerts:empty { display: none; }

.pws-alerts {
  display: grid;
  /* starý kontejner centruje obsah, bez pevného sloupce by se pruh smrskl na text */
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  margin: 0 auto 14px;
  padding: 0 2px;
}

.pws-alert {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  padding: 10px 14px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--tone) 10%, var(--pr-surface));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tone) 45%, transparent);
  font-size: var(--pr-fs-body);
  color: var(--pr-ink);
  text-align: left;
}

.pws-alert b { font-weight: 600; }
.pws-alert-n { color: var(--pr-ink-dim); }

.pws-alert a {
  margin-left: auto;
  color: var(--pr-ink);
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (pointer: coarse) {
  .pws-alert a { display: inline-flex; align-items: center; min-height: 40px; }
}

/* ---------- odolnost (harden) ---------- */

/* delší jazyky (němčina) mají v úzkých buňkách jednoslovné popisky delší než buňka */
.pws-k,
.pws-n,
.pws-card-head h3,
.pws-alert b {
  overflow-wrap: anywhere;
  hyphens: auto;
}

/* karta, jejíž obnova selhala: obsah zůstává, jen ztlumený, aby nevypadal jako čerstvý */
.pws-failed .pws-now-body > :not(.pws-card-head) {
  opacity: .6;
}

/* položky menu měly 22px na výšku; na dotyku 40px cíle */
@media (pointer: coarse) {
  .sidebarMenuInner li { padding-block: 0; }
  .sidebarMenuInner li a { display: flex; align-items: center; min-height: 40px; }
}

/* ---------- polish ---------- */

/* lišta odkazů karty: ikona a oddělovače mimo odkazy */
.pws-card-links .pws-sep { color: var(--pr-ink-faint); }

/* odkazy uvnitř karet a patičky mají zaoblený rámeček fokusu */
.pws-card a:focus-visible,
.pws-alert a:focus-visible,
.pws-foot a:focus-visible,
.pws-cam:focus-visible {
  border-radius: 4px;
}

/* patička: zdroj dat vlevo, stanice a vzkaz uprostřed, zásluhy vpravo */
.pws-foot {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 16px;
  margin: 0 2px 14px;
  padding: 12px 14px;
  border-top: 1px solid var(--pr-line);
  font-size: var(--pr-fs-note);
  color: var(--pr-ink-dim);
  text-align: left;
}

.pws-foot p { margin: 0; }
.pws-foot-main { text-align: center; }
.pws-foot-msg { margin-top: 2px; }
.pws-foot-about { max-width: 72ch; margin: 6px auto 0 !important; text-wrap: balance; }
.pws-foot a { color: var(--pr-ink-dim); }
.pws-foot a:hover { color: var(--pr-ink); }
.pws-foot-logo img { display: block; height: 24px; width: auto; opacity: .7; }
.pws-foot-side { display: flex; align-items: center; gap: 12px; }
.pws-foot img[src*="flags"] { vertical-align: -1px; }

.pws-foot-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

/* odznak „!“ z PWS_load_files.php jako tečka; barvu (červená / oranžová) nese inline styl */
#statuses .PWS_round {
  display: inline-block;
  width: 8px;
  height: 8px;
  padding: 0;
  border-radius: 50%;
  font-size: 0;
  vertical-align: middle;
}

@media (max-width: 639px) {
  .pws-foot { grid-template-columns: minmax(0, 1fr); justify-items: center; }
}

/* počítadlo TOPlist je cizí bílý obrázek; v tmavém tématu jen tlumeně, aby nesvítil */
.pws-counters { margin: 0 auto 16px; text-align: center; }
.pws-counters img { opacity: .55; filter: grayscale(1); }
.pws-counters a:hover img { opacity: 1; filter: none; }
html.light .pws-counters img { opacity: .8; }

/* odznak jednotek v menu: popisek, ne varování */
.pws-unit-mark {
  display: inline-block;
  margin-left: 4px;
  padding: 0 4px;
  border-radius: 4px;
  box-shadow: inset 0 0 0 1px var(--pr-line);
  background: var(--pr-surface-2);
  color: var(--pr-ink-dim);
  font-family: var(--pr-mono);
  font-size: var(--pr-fs-label);
  font-weight: 600;
  line-height: 1.5;
}

/* popupy s grafy měly na telefonu 250 px na výšku */
.featherlight-content { height: min(85vh, 760px); }

/* kamera osamocená na posledním řádku mřížky zabere celý řádek jako panoráma,
   jinak by vedle ní zela prázdná místa */
@media (min-width: 960px) and (max-width: 1279px) {
  .pws-grid > .pws-gcard:has(.pws-cam):last-child:nth-child(3n+1) { grid-column: 1 / -1; }
  .pws-grid > .pws-gcard:has(.pws-cam):last-child:nth-child(3n+1) .pws-cam img { aspect-ratio: 32 / 9; }
}

@media (min-width: 640px) and (max-width: 959px) {
  .pws-grid > .pws-gcard:has(.pws-cam):last-child:nth-child(odd) { grid-column: 1 / -1; }
  .pws-grid > .pws-gcard:has(.pws-cam):last-child:nth-child(odd) .pws-cam img { aspect-ratio: 21 / 9; }
}

@media (min-width: 1280px) {
  .pws-grid > .pws-gcard:has(.pws-cam):last-child:nth-child(4n+1) { grid-column: 1 / -1; }
  .pws-grid > .pws-gcard:has(.pws-cam):last-child:nth-child(4n+1) .pws-cam img { aspect-ratio: 32 / 9; }
}

/* odkazy v patičce měly na dotyku 16 px na výšku */
@media (pointer: coarse) {
  .pws-foot a { display: inline-flex; align-items: center; min-height: 40px; }
}

/* srovnání dnešního rozpětí v kartě Mikroklima: stejná tabulka jako Extrémy teploty */
.pws-ext-cmp { margin-top: 12px; }

/* karta Extrémy: přepínač veličiny v hlavičce, malý a tichý jako navigace v reportu */
.pws-ext-sw {
  display: inline-flex;
  align-items: center;
  margin-left: auto;
  border-radius: 7px;
  background: var(--pr-surface-2);
  box-shadow: inset 0 0 0 1px var(--pr-line);
  font-size: var(--pr-fs-body);
}
.pws-ext-sw button {
  appearance: none;
  width: 28px;
  height: 28px;
  padding: 0 0 2px;
  border: 0;
  border-radius: 7px;
  background: none;
  color: var(--pr-ink-dim);
  font: 600 17px/1 var(--pr-sans);
  text-align: center !important;
  cursor: pointer;
}
/* na dotyku by :hover po klepnutí zůstal viset jako stisknutý */
@media (hover: hover) {
  .pws-ext-sw button:hover { color: var(--pr-ink); background: var(--pr-line-soft); }
}
.pws-ext-sw-l { min-width: 7.5em; padding: 0 2px; text-align: center !important; color: var(--pr-ink); white-space: nowrap; }
.pws-ext-sw-n { font-family: var(--pr-mono); font-size: var(--pr-fs-label); color: var(--pr-ink-dim); }
.pws-ext-p[hidden] { display: none !important; }
.pws-card-head .pws-quiet + .pws-ext-sw { margin-left: 8px; }
@media (pointer: coarse) {
  .pws-ext-sw button { width: 40px; height: 40px; }
}
.pws-ext thead th.pws-ext-title { text-align: left; }
.pws-ext tbody th.pws-ext-who { color: var(--pr-accent); font-weight: 600; }
html.light .pws-ext tbody th.pws-ext-who { color: color-mix(in oklab, var(--pr-accent), var(--pr-ink) 55%); }

/* aktuální hodnota na pruhu: knoflík jako na budíku */
.pws-ext-now {
  position: absolute;
  top: 50%;
  width: 10px;
  height: 10px;
  margin: -5px 0 0 -5px;
  border-radius: 50%;
  background: var(--pr-ink);
  box-shadow: 0 0 0 2px var(--pr-surface);
}

/* široká karta stanice: všechny buňky vedle velkého budíku, jinak by pod buňkami
   „teď“ zůstal prázdný pruh výšky budíku */
@container (min-width: 520px) {
  .pws-now-station .pws-readout { grid-template-rows: auto 1fr; }
  .pws-now-station .pws-gauge-wrap { grid-row: 1 / span 2; }
  .pws-now-station .pws-cells-now { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pws-now-station .pws-cells-more { grid-column: 2; align-self: start; }
}

/* ---------- stará data (critique: jeden pruh, tichá tečka, zhasnuté barvy) ---------- */

.pws-quiet {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  font-size: var(--pr-fs-note);
  color: var(--pr-ink-dim);
  white-space: nowrap;
}

/* karta se starými daty: barvy škály, stavů a vlhkosti zhasnou, aby hodnota nevypadala
   jako čerstvá; tečka stáří v hlavičce zůstává */
.pws-now-body:has(> .pws-head-stale) > :not(.pws-card-head) :is(.pws-num, .pws-pill, .pws-hum, .pws-delta) {
  color: var(--pr-ink-dim) !important;
}

.pws-now-body:has(> .pws-head-stale) > :not(.pws-card-head) :is(.pws-pill, .pws-hum) {
  background: var(--pr-surface) !important;
  box-shadow: inset 0 0 0 1px var(--pr-line) !important;
  text-shadow: none;
}

.pws-now-body:has(> .pws-head-stale) > :not(.pws-card-head) .pws-dot,
.pws-now-body:has(> .pws-head-stale) .pws-aq-scale i.on {
  background: var(--pr-ink-faint) !important;
}

.pws-now-body:has(> .pws-head-stale) .pws-ext-track i,
.pws-now-body:has(> .pws-head-stale) .pws-sky img {
  filter: grayscale(1);
  opacity: .55;
}

.pws-now-body:has(> .pws-head-stale) .pws-aq-head { color: var(--pr-ink-dim); }

/* rám popupu (Featherlight) jako karta: dřív průhledný se zavíracím pruhem 60×20 px vlevo */
.featherlight { background: rgba(8, 10, 11, .72); }
html.light .featherlight { background: rgba(20, 26, 28, .45); }

.featherlight .featherlight-content {
  padding: 0;
  border: 1px solid var(--pr-line);
  border-radius: 10px;
  background: var(--pr-surface);
  box-shadow: var(--pr-shadow);
  overflow: hidden;
}

.featherlight .featherlight-content iframe { display: block; border: 0; }

/* lišta s názvem a křížkem nad obsahem: křížek ležel přes popup a na telefonu zakrýval text */
.featherlight .featherlight-content { padding-top: 44px; }

.featherlight .featherlight-content::before {
  content: "";
  position: absolute;
  top: 43px;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--pr-line);
}

.pws-fl-title {
  position: absolute;
  top: 0;
  left: 0;
  right: 52px;
  height: 43px;
  padding: 0 14px;
  font-size: 15px;
  font-weight: 600;
  line-height: 43px;
  color: var(--pr-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.featherlight .featherlight-close-icon {
  top: 4px;
  right: 6px;
  left: auto;
  width: 36px;
  height: 36px;
  line-height: 34px;
  border: 1px solid var(--pr-line);
  border-radius: 6px;
  background: var(--pr-surface-2);
  color: var(--pr-ink-dim);
  font-size: 20px;
}

.featherlight .featherlight-close-icon:hover { color: var(--pr-ink); }

@media (max-width: 639px) {
  .featherlight .featherlight-content { width: calc(100% - 16px); margin-inline: 8px; }
}

/* záběr kamery je 16:9; rám stejné výšky by nad a pod ním nechal tmu. Navíc lišta s názvem
   (44 px), přepínač kamer a režimu a poznámka pod záběrem (webcam_popup.php) */
.featherlight.pws-fl-cam .featherlight-content { height: calc(min(850px, 100vw - 16px) * 9 / 16 + 140px); max-height: 92vh; }

/* knihovna má ikonu zavření nastavenou na prázdný text; křížek ze dvou čar */
.featherlight .featherlight-close-icon::before,
.featherlight .featherlight-close-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 2px;
  margin: -1px 0 0 -8px;
  border-radius: 1px;
  background: currentColor;
  transform: rotate(45deg);
}

.featherlight .featherlight-close-icon::after { transform: rotate(-45deg); }

/* ---------- předpověď yr.no: nejbližší hodiny a další dny ---------- */

.pws-fct-cap,
.pws-fct-days caption {
  margin: 0 0 6px;
  text-align: left;
}

.pws-fct-near {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--pr-line-soft);
  border-radius: 7px;
  overflow: hidden;
}

.pws-fct-p {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-width: 0;
  padding: 8px 4px 9px;
  background: var(--pr-surface-2);
  text-align: center;
}

.pws-fct-when {
  font-size: var(--pr-fs-note);
  line-height: 1.3;
  color: var(--pr-ink-dim);
}

.pws-fct-p img { width: 40px; height: 40px; margin: 2px 0; }

.pws-fct-t { white-space: nowrap; }
.pws-fct-t .pws-num { font-size: 14px; }
.pws-fct-p .pws-n { margin: 0; font-size: var(--pr-fs-label); white-space: nowrap; }

.pws-fct-days { margin-top: 14px; }
.pws-fct-days caption { caption-side: top; }
.pws-fct-date { color: var(--pr-ink-dim); font-family: var(--pr-mono); font-size: var(--pr-fs-label); }
.pws-fct-ico { width: 1%; padding-right: 4px !important; }
.pws-fct-ico img { display: block; width: 28px; height: 28px; }

.pws-fct-src { margin-top: auto; padding-top: 10px; display: flex; align-items: center; gap: 6px; }
.pws-fct-src .pws-quiet { margin-left: 0; }

/* karta předpovědi roste jako ostatní karty řady; zdroj drží dole */
.pws-now-body:has(> .pws-fct-near) { display: flex; flex-direction: column; }

/* ---------- menu: panel přes výšku okna, ztmavené pozadí, aktuální volby ---------- */

#sidebarMenu {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 40 !important;
  width: min(280px, 86vw);
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--pr-surface);
  border-right: 1px solid var(--pr-line);
  box-shadow: 0 0 40px rgba(0, 0, 0, .45);
}

#sidebarMenu .sidebarMenuInner,
#sidebarMenu .sidebarMenuInner li { width: 100%; float: none; box-sizing: border-box; }
#sidebarMenu .sidebarMenuInner li a { float: none; }

.pws-menu-close { margin: 10px 10px 0 auto; }

/* ztmavení stránky za otevřeným menu; klik do něj menu zavře (posluchač kliku mimo menu) */
html.pws-menu-open body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 39;
  background: rgba(8, 10, 11, .6);
}

html.light.pws-menu-open body::before { background: rgba(20, 26, 28, .35); }

.pws-menu-cur {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  color: var(--pr-ink);
  font-weight: 600;
}

.pws-menu-cur::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--pr-zast);
}

.pws-menu-lang summary {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 28px;
  cursor: pointer;
  color: var(--pr-ink-dim);
  font-weight: 600;
}

.pws-menu-lang summary img { border-radius: 2px; }

.pws-menu-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 0 4px;
}

.pws-menu-flags a { display: inline-flex; }
.pws-menu-flags img { display: block; border-radius: 2px; }

@media (pointer: coarse) {
  .pws-menu-cur, .pws-menu-lang summary { min-height: 40px; }
  .pws-menu-flags a { min-width: 40px; min-height: 40px; align-items: center; justify-content: center; }
}

/* položky menu zarovnané vlevo (dřív globální text-align: center), oddíly jako popisky */
#sidebarMenu .sidebarMenuInner li { padding: 2px 16px; text-align: left; }
#sidebarMenu .sidebarMenuInner .separator {
  margin: 10px 0 2px;
  padding: 8px 16px 4px;
  border-top: 1px solid var(--pr-line-soft);
  font-size: var(--pr-fs-label);
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--pr-ink-dim);
  text-align: left;
}
#sidebarMenu .sidebarMenuInner li a { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; font-size: var(--pr-fs-body); }
/* čip v menu: výška jako ostatní položky, jinak by se nafoukl do 28 px vysoké pilulky */
#sidebarMenu .sidebarMenuInner li a.pws-link-hi { min-height: 0; margin: 4px 0; padding: 2px 10px; }

/* ---------- polish po critique ---------- */

/* svg se kreslí zmenšený (viewBox 152 px do 116–140 px), proto popisky uvnitř
   budíků mají ve viewBoxu 14 px: na obrazovce vyjdou kolem 11 px */

/* model stanice je popisek, ne naměřená hodnota: bez mono, verzálky jako ostatní popisky */
.pws-chip {
  font-family: var(--pr-sans);
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

/* okraje stránky: na telefonu 16 px (DESIGN.md), na 1280 px karty nedosahují na kraj okna */
@media (max-width: 639px) {
  .PWS_weather_container { box-sizing: border-box; width: 100%; padding-inline: 16px; }
  .PWS_weather_container.pws-grid { padding-inline: 16px; }
}

@media (min-width: 1280px) {
  .PWS_weather_container { width: min(1280px, calc(100% - 32px)); }
}

/* na úzké kartě (telefon 320 px) se pruh rozpětí zúží dřív, než by tabulka přetekla */
@container (max-width: 300px) {
  .pws-ext-bar { min-width: 16px; }
  .pws-ext-track { left: 4px; right: 4px; }
}

@media (pointer: coarse) {
  #sidebarMenu .sidebarMenuInner li a { min-height: 40px; }
}

/* nadpis karty jako odkaz na graf: vypadá jako nadpis, ikona grafu prozradí, že jde kliknout */
.pws-title-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: inherit;
  text-decoration: none;
}

.pws-title-ico { color: var(--pr-ink-faint); transition: color .15s; }
.pws-title-link:hover .pws-title-ico,
.pws-title-link:focus-visible .pws-title-ico { color: var(--pr-ink); }
.pws-title-link:hover { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* ---------- řada „Teď“ na středních šířkách (critique: hlavní hodnota jako třetina řady) ---------- */

/* 960–1279 px: stanice přes celou řadu, pod ní předpověď a mikroklima přes dva sloupce */
@media (min-width: 960px) and (max-width: 1279px) {
  .pws-now-station { grid-column: 1 / -1; }
  .pws-now-sensors { grid-column: span 2; }
}

/* široké mikroklima: čidla vedle sebe */
.pws-micro { container-type: inline-size; }

@container (min-width: 520px) {
  .pws-micro-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* na široké kartě stanice smí budík narůst a obsah se drží uprostřed výšky řady,
   místo prázdného pruhu pod buňkami */
.pws-now-station .pws-now-body { display: flex; flex-direction: column; }
.pws-now-station .pws-readout { flex: 1 0 auto; align-content: center; }

@container (min-width: 520px) {
  .pws-gauge.pws-gauge-big { width: clamp(180px, 36cqi, 240px); }
}

/* stav nebe nad budíkem (pws_now_sky_html): ikona a slovo vlevo, rozdíl proti včerejšku vpravo */
.pws-sky {
  display: flex;
  align-items: center;
  gap: 4px 12px;
  margin-bottom: 12px;
  padding: 10px 12px;
  border-radius: 7px;
  background: var(--pr-surface-2);
}
.pws-sky img { flex: none; width: 38px; height: 38px; }
.pws-sky-w { min-width: 0; }
.pws-sky-t { display: block; font-size: 17px; font-weight: 600; line-height: 1.2; color: var(--pr-ink); }
.pws-sky-w .pws-n { display: block; margin-top: 2px; font-family: var(--pr-mono); font-weight: 600; }
.pws-sky-d { margin-left: auto; text-align: right; }
.pws-sky-d .pws-num { font-size: 16px; }
.pws-sky-d .pws-n { display: block; margin-top: 2px; }
/* výstraha ČHMÚ: pruh přes celou šířku řádku v barvě úrovně (žlutá warn, oranžová a červená bad) */
.pws-sky-has-wrn { flex-wrap: wrap; }
.pws-sky-wrn { flex-basis: 100%; display: flex; align-items: center; gap: 6px; margin-top: 4px; padding: 6px 10px; border-radius: 6px;
  font-size: 13px; color: var(--pr-ink); text-decoration: none;
  background: color-mix(in srgb, var(--tone) 14%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tone) 45%, transparent); }
.pws-sky-wrn b { color: var(--tone); font-weight: 600; }
.pws-sky-wrn svg { flex: none; width: 16px; height: 16px; fill: none; stroke: var(--tone); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.pws-sky-wrn::after { content: "→"; margin-left: auto; color: var(--tone); }
.pws-sky-wrn:hover { background: color-mix(in srgb, var(--tone) 22%, transparent); }

/* řádky mřížky stanice podle obsahu, volné místo jde nad a pod blok (vycentrování) */
@container (min-width: 520px) {
  .pws-now-station .pws-readout { grid-template-rows: auto auto; }
}

/* ---------- barvy veličin a oddíly (DESIGN.md, Barvy veličin) ---------- */

.pws-q-wind   { --q: var(--q-wind); }
.pws-q-rain   { --q: var(--q-rain); }
.pws-q-baro   { --q: var(--q-baro); }
.pws-q-sun    { --q: var(--q-sun); }
.pws-q-around { --q: var(--q-around); }
.pws-q-hum    { --q: var(--pr-hum-ink); }

.pws-card-ico {
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 26px;
  height: 26px;
  margin-right: -2px;
  border-radius: 7px;
  color: var(--q, var(--pr-ink-dim));
  background: color-mix(in oklab, var(--q, var(--pr-ink-dim)) 16%, transparent);
}

.pws-card-ico svg { width: 16px; height: 16px; }

/* teplota nemá jeden odstín, má škálu: ikona nese její konce místo barvy veličiny */
.pws-card-ico.pws-q-temp {
  color: var(--pr-ink);
  background: linear-gradient(135deg, color-mix(in oklab, var(--pw-colder) 30%, transparent),
                                      color-mix(in oklab, var(--pw-warmer) 30%, transparent));
}

.pws-card-ico.pws-q-micro { background: var(--pr-surface-2); }

/* tón karty jen v podkladu a lince; čísla zůstávají inkoustem nebo teplotní škálou */
.pws-tint {
  background: color-mix(in oklab, var(--q) 6%, var(--pr-surface));
  border-color: color-mix(in oklab, var(--q) 30%, var(--pr-line));
}

/* nadpis karty a hlavní hodnota srážek nesou odstín veličiny (číslo budíku větru, tlaku
   a slunce ho dostává přímo v SVG), stejně jako budík teploty nese teplotní škálu */
.pws-tint .pws-card-head h3,
.pws-q-rain .pws-lead:not(.pws-zero) { color: var(--q); }
.pws-tint .pws-title-ico { color: color-mix(in oklab, var(--q) 55%, transparent); }

.pws-tint .pws-cell { background: color-mix(in oklab, var(--q) 6%, var(--pr-surface-2)); }
.pws-tint .pws-cells { background: color-mix(in oklab, var(--q) 10%, var(--pr-line-soft)); }

.pws-sec + .pws-sec { margin-top: 10px; }

.PWS_weather_container.pws-sec-head {
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
  flex-wrap: nowrap;
  gap: 10px;
  margin-bottom: 10px;
  padding: 0 2px;
  overflow: visible;
}

.pws-sec-head h2 {
  margin: 0;
  font-size: var(--pr-fs-note);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--pr-ink);
  white-space: nowrap;
}

.pws-sec-note {
  font-size: var(--pr-fs-note);
  color: var(--pr-ink-dim);
  white-space: nowrap;
}

.pws-sec-head::after {
  content: "";
  flex: 1;
  align-self: center;
  height: 1px;
  background: var(--pr-line);
}

@media (max-width: 639px) {
  .PWS_weather_container.pws-sec-head { padding-inline: 16px; }
}

/* měření: vítr a slunce dostanou dvojnásobnou šířku, aby se vedle budíku vešly rekordy
   a další údaje; dense vyplní díry, kdyby pořadí v nastavení bylo jiné */
.pws-grid-measure,
.pws-grid-around { grid-auto-flow: row dense; }

@media (min-width: 640px) and (max-width: 959px) {
  .pws-grid-measure > .pws-c-wind { grid-column: 1 / -1; }
}

@media (min-width: 960px) {
  .pws-grid-measure > .pws-c-wind { grid-column: span 2; }
}

@media (min-width: 1280px) {
  .pws-grid-measure > :is(.pws-c-sun, .pws-c-temp_ext) { grid-column: span 2; }
}

@container (min-width: 560px) {
  :is(.pws-c-wind, .pws-c-sun) .pws-readout {
    grid-template-columns: auto minmax(0, .8fr) minmax(0, 1.2fr);
    align-items: center;
  }
  .pws-c-wind .pws-readout > .pws-wide,
  .pws-c-sun .pws-readout > .pws-cells-more { grid-column: 3; grid-row: 1; }
}

/* hodnoty veličin v jejich odstínu: buňky větru, srážek a tlaku na kartě Stanice a čísla
   v kartách měření (Okolí ne, šedomodrá by čísla jen ztlumila); nula zůstává tlumená */
.pws-cell[class*="pws-q-"] .pws-num:not(.pws-zero),
.pws-gcard.pws-tint:not(.pws-q-around) .pws-num:not(.pws-zero) { color: var(--q); }
.pws-n.pws-fct-v { font-weight: 600; }
.pws-cell[class*="pws-q-"] .pws-u,
.pws-gcard.pws-tint .pws-u { color: var(--pr-ink-dim); }
/* neaktuální údaj barvu ztrácí jako všechno ostatní na kartě */
.pws-now-body:has(> .pws-head-stale) .pws-cell .pws-num:not(.pws-zero),
.pws-gcard .pws-now-body:has(> .pws-head-stale) .pws-num:not(.pws-zero) { color: var(--pr-ink-dim); }

.pws-nv { font-weight: 600; font-family: var(--pr-mono); font-variant-numeric: tabular-nums; }
.pws-nv-hum { color: var(--pr-hum-ink); }

/* UV index: pásma WHO, na světlém tématu ztmavená kvůli kontrastu */
.pws-uv {
  display: inline-flex;
  padding: 1px 9px;
  border-radius: 999px;
  font: 600 14px/1.4 var(--pr-mono);
  font-variant-numeric: tabular-nums;
  color: var(--uvc, var(--pr-ink-dim));
  background: color-mix(in srgb, var(--uvc, var(--pr-ink-dim)) 12%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--uvc, var(--pr-ink-dim)) 38%, transparent);
}
.pws-uv-1 { --uvc: #4cc38a; }
.pws-uv-2 { --uvc: #e0c04f; }
.pws-uv-3 { --uvc: #e79445; }
.pws-uv-4 { --uvc: #f05545; }
.pws-uv-5 { --uvc: #b48cff; }
html.light .pws-uv-1 { --uvc: #1d7a50; }
html.light .pws-uv-2 { --uvc: #866300; }
html.light .pws-uv-3 { --uvc: #a9531a; }
html.light .pws-uv-4 { --uvc: #c4321f; }
html.light .pws-uv-5 { --uvc: #7440cf; }

/* východ a západ: slunce teplé (žlutá nahoru, oranžová dolů), měsíc studené (krémová, šedomodrá) */
:root {
  --rs-sun-up: #f0c64e;
  --rs-sun-down: #ec8a5e;
  --rs-moon-up: #e6dcb0;
  --rs-moon-down: #9fb2c6;
}
html.light {
  --rs-sun-up: #866300;
  --rs-sun-down: #a9481e;
  --rs-moon-up: #6f6230;
  --rs-moon-down: #4f6478;
}
.pws-rs { display: inline-flex; align-items: center; gap: 6px; }
.pws-rs svg { width: 20px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pws-moonday { display: inline-flex; align-items: center; gap: 7px; }
.pws-moonday i { width: 11px; height: 11px; border-radius: 50%; flex: none; }
.pws-md-full { background: var(--pw-moon-lit); box-shadow: 0 0 0 1px var(--pw-moon-edge); }
.pws-md-new { background: var(--pw-moon-dark); box-shadow: inset 0 0 0 1px var(--pr-ink-faint); }

/* pásma evropského indexu kvality ovzduší (EEA) jako stupnice; na světlém ztmavená */
:root {
  --aq-0: #4fd1c5;
  --aq-1: #5cc59a;
  --aq-2: #e0c84a;
  --aq-3: #f06a4f;
  --aq-4: #e04a78;
  --aq-5: #b06ad0;
}
html.light {
  --aq-0: #0e7c74;
  --aq-1: #1a7a51;
  --aq-2: #7a6300;
  --aq-3: #b8322a;
  --aq-4: #9a1d4a;
  --aq-5: #7d2181;
}
.pws-aq-scale i:not(.on) { opacity: .28; }
.pws-aq-scale i.on { height: 8px; margin-top: -1px; }
.pws-now-body:has(> .pws-head-stale) .pws-aq-scale i { background: var(--pr-line) !important; opacity: 1; }

/* křivka dne v kartě Vítr a Slunce (pws_day_spark): vyplní místo pod budíkem průběhem dne */
.pws-spark-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 14px; }
.pws-spark-leg { display: inline-flex; align-items: center; gap: 6px; font-size: var(--pr-fs-label); color: var(--pr-ink-dim); }
.pws-spark-leg i { width: 14px; height: 2px; border-radius: 1px; background: var(--q); }
.pws-spark-leg i.pws-dash { height: 0; margin-left: 6px; background: none; border-top: 2px dashed var(--q); }
.pws-spark-leg i.pws-gust { margin-left: 6px; background: var(--q-gust); }
.pws-spark { margin-top: 6px; }
.pws-spark svg { display: block; width: 100%; height: 58px; }
.pws-spark-grid { stroke: var(--pr-line-soft); stroke-width: 1; vector-effect: non-scaling-stroke; }
.pws-spark-ticks { position: relative; height: 15px; }

/* extrémy dne v teplotní křivce karty Stanice: maximum pod vrcholem, minimum nade dnem */
.pws-spark { position: relative; }
.pws-spark-marks { position: absolute; inset: 0 0 auto; height: 58px; pointer-events: none; }
.pws-spark-mk { position: absolute; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; box-shadow: 0 0 0 2px var(--pr-surface); }
.pws-spark-ml {
  position: absolute;
  padding: 1px 5px;
  border-radius: 999px;
  font: 600 11px/1.3 var(--pr-mono);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  background: var(--pr-surface-2);
  --mx: -50%;
}
.pws-spark-ml.l { --mx: -6px; }
.pws-spark-ml.r { --mx: calc(-100% + 6px); }
.pws-spark-ml.hi { transform: translate(var(--mx), 7px); }
.pws-spark-ml.lo { transform: translate(var(--mx), calc(-100% - 7px)); }

/* patičky karet (Petr 2026-11-01): tři a víc odkazů na střed, kratší vlevo jako dřív (Stanice „Graf
   teploty · Extrémy počasí“ vlevo sedí líp). Odkazy o stupeň jasnější a tečky s mezerou: tlumený text
   s tlumenými tečkami splýval, nejvíc na nažloutlé kartě Slunce. Odkaz se nezalamuje uvnitř. */
.pws-card-links:has(.pws-sep ~ .pws-sep) { text-align: center; }
.pws-card-links a { white-space: nowrap; }
.pws-card-links a:not(.pws-link-hi) { color: color-mix(in srgb, var(--pr-ink) 70%, var(--pr-ink-dim)); }
.pws-card-links a:not(.pws-link-hi):hover { color: var(--pr-ink); }
.pws-card-links .pws-sep { margin: 0 3px; opacity: .65; }
/* patička karty Předpověď: čip Stránky předpovědi na vlastním řádku a pod ním hodinová předpověď
   a mapa; ve třech položkách v řadě se mapa zalamovala sama a tečka visela na konci řádku */
section.pws-now-fct footer.pws-card-links a.pws-link-hi { display: flex; align-items: center; gap: .3em; width: fit-content; margin: 2px auto 4px; }
section.pws-now-fct footer.pws-card-links a.pws-link-hi + .pws-sep { display: none; }

/* „co přijde“ v kartě Předpověď (pws_fct_next_html): událost v barvě svého významu, kdy a kolik */
.pws-fct-next { list-style: none; margin: 0 0 12px; padding: 8px 12px; border-radius: 7px; background: var(--pr-surface-2); }
.pws-fct-next li { font-size: 14px; line-height: 1.45; color: var(--pr-ink-dim); }
.pws-fct-next li b { font-weight: 600; }
.pws-fct-next .pws-num { font-size: 14px; }
.pws-fct-next .pws-fct-dry { color: var(--pr-ink-dim); }

/* bublina nad grafem s data-tip (js/pws-tip.js): svislá čára a kroužek na křivce, bublina na <body>;
   výšku a polohu čáry nastaví skript podle grafu */
:is(.pws-spark, .pws-lc)[data-tip] svg { touch-action: pan-y; cursor: crosshair; }
.pws-spark-x { position: absolute; border-left: 1px dashed var(--pr-ink-faint); pointer-events: none; }
.pws-spark-cur {
  position: absolute;
  width: 10px;
  height: 10px;
  margin: -5px 0 0 -5px;
  border: 2px solid var(--pr-ink);
  border-radius: 50%;
  background: var(--pr-surface);
  box-sizing: border-box;
  pointer-events: none;
}
.pws-tip {
  position: fixed;
  z-index: 1000;
  min-width: 150px;
  padding: 8px 10px;
  border-radius: 7px;
  background: var(--pr-surface-2);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .3), 0 0 0 1px var(--pr-line);
  font: 12px/1.4 var(--pr-sans);
  color: var(--pr-ink);
  transform: translate(-50%, -100%);
  pointer-events: none;
}
.pws-tip.below { transform: translate(-50%, 0); }
/* šablona dashboardu má v inline CSS div { display: block }, které by atribut hidden přebilo */
.pws-tip[hidden] { display: none !important; }
.pws-tip-h { display: flex; align-items: center; gap: 6px; padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px solid var(--pr-line); font: 600 13px var(--pr-mono); }
.pws-tip-h::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--pr-ok); }
.pws-tip-r { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 2px 0; }
.pws-tip-r > span:first-child { color: var(--pr-ink-dim); }
/* hodnoty řádku drží pohromadě, bublina radši zešiří */
.pws-tip-r > span:last-child { white-space: nowrap; }
.pws-tip-r b { font: 600 13px var(--pr-mono); font-variant-numeric: tabular-nums; }
.pws-tip-r .pws-tip-0 { color: var(--pr-ink-dim); }
.pws-tip-sep { color: var(--pr-ink-faint); }
.pws-tip-h .pws-tip-sep { white-space: nowrap; font: 400 12px var(--pr-sans); color: var(--pr-ink-dim); }
.pws-tip-sky { display: flex; align-items: center; gap: 6px; padding: 0 0 4px; color: var(--pr-ink); }
.pws-tip-sky img { width: 26px; height: 26px; }
.pws-spark-cur[hidden] { display: none; }
.pws-spark-ticks span { position: absolute; top: 2px; transform: translateX(-50%); font-size: var(--pr-fs-label); color: var(--pr-ink-dim); }
.pws-spark-ticks span:first-child { transform: none; }
.pws-spark-ticks span:last-child { transform: translateX(-100%); }

/* růžice větru za 24 h (pws_wind_rose_html); na široké kartě stojí vlevo pod kompasem, křivka dne vpravo */
.pws-rose-body { display: flex; align-items: center; gap: 16px; margin-top: 6px; }
.pws-rose { flex: none; display: block; width: 150px; height: 150px; }
.pws-rose-grid { fill: none; stroke: var(--pr-line); stroke-width: 1; }
.pws-rose-sum { display: flex; flex-direction: column; min-width: 0; }
.pws-rose-sum > .pws-num { font-size: 22px; }
.pws-rose-leg { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 8px; font-size: var(--pr-fs-label); color: var(--pr-ink-dim); }
.pws-rose-leg span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.pws-rose-leg i { width: 10px; height: 10px; border-radius: 2px; }

@container (min-width: 560px) {
  .pws-wind-day { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 28px; align-items: start; }
  .pws-wind-day > .pws-rose-box { order: -1; }
}

/* dráha slunce: pásma soumraků pod obzorem a tečka aktuální polohy */
:root { --tw-civil: #3b4f86; --tw-naut: #2a3a66; --tw-astro: #1d2848; --tw-line: #7d8fb8; }
html.light { --tw-civil: #c6d1ee; --tw-naut: #aebcdf; --tw-astro: #97a7d0; --tw-line: #5a6fa8; }
.pws-tw-civil { fill: var(--tw-civil); fill-opacity: .55; }
.pws-tw-naut { fill: var(--tw-naut); fill-opacity: .55; }
.pws-tw-astro { fill: var(--tw-astro); fill-opacity: .55; }
.pws-sunpath-hz { stroke: var(--pr-ink-faint); stroke-width: 1; vector-effect: non-scaling-stroke; }
.pws-sunpath-plot { position: relative; }
.pws-sunpath svg { height: 64px; }
.pws-sunpath-now {
  position: absolute;
  width: 10px;
  height: 10px;
  margin: -5px 0 0 -5px;
  border-radius: 50%;
  background: var(--tw-line);
  box-shadow: 0 0 0 2px var(--pr-surface);
}
.pws-sunpath-now.up { background: var(--q-sun); }

/* legenda křivky teploty: značka nese konce teplotní škály */
.pws-spark-leg-t i { background: linear-gradient(90deg, var(--pw-colder), var(--pw-warmer)); }
.pws-spark-leg-t i.pws-dash { background: none; border-top: 2px dashed var(--pr-ink-dim); }
.pws-spark-leg i.pws-dot { height: 0; margin-left: 6px; background: none; border-top: 2px dotted var(--pr-ink-dim); }

/* natahovací graf (Mikroklima, Srážky): zabere výšku, kterou kartě nechá vyšší soused v řadě */
.pws-fill { display: flex; flex: 1 1 auto; flex-direction: column; margin-top: 12px; }
.pws-cmp-leg { flex-wrap: wrap; gap: 4px 14px; }
.pws-cmp-leg span { display: inline-flex; align-items: center; gap: 6px; }
.pws-fill-plot { position: relative; flex: 1 1 auto; min-height: 64px; margin-top: 6px; }
.pws-fill-plot svg { position: absolute; inset: 0; display: block; width: 100%; height: 100%; overflow: visible; }
.pws-fill-marks span {
  position: absolute;
  right: 0;
  transform: translateY(-100%);
  padding-bottom: 1px;
  font-family: var(--pr-mono);
  font-size: var(--pr-fs-label);
  color: var(--pr-ink-faint);
}
.pws-micro .pws-card-links { margin-top: 10px; }
.pws-c-rain .pws-now-body { display: flex; flex-direction: column; }
.pws-rain-base { stroke: var(--pr-line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.pws-rain-days .pws-fill-plot { min-height: 48px; }

/* graf v pásech se společnou osou (pws-lc): průběh roku ve Statistikách (PWS_wureports.php)
   a předpověď na 48 h na Stránce předpovědi (fct_yrno_chart.php) */
.pws-lc { position: relative; }
.pws-lc-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 12px 0 4px; }
.pws-lc-h:first-child { margin-top: 0; }
.pws-lc-p { position: relative; }
.pws-lc svg { display: block; width: 100%; }
.pws-lc-zero { stroke: var(--pr-ink-faint); stroke-width: 1; vector-effect: non-scaling-stroke; }
.pws-lc-yl span { position: absolute; left: 2px; transform: translateY(-50%); font: 10px var(--pr-mono); color: var(--pr-ink-dim); background: color-mix(in srgb, var(--pr-surface) 70%, transparent); padding: 0 2px; border-radius: 3px; pointer-events: none; }
.pws-lc-ticks { margin-top: 2px; }
.pws-lc-ticks span { transform: translateX(-50%) !important; }
.pws-spark-leg i.pws-lc-band { height: 8px; border-radius: 2px; background: linear-gradient(90deg, var(--pw-colder), var(--pw-warmer)); opacity: .55; }
.pws-spark-leg i.pws-lc-band-b { background: var(--q-baro); }
.pws-lc-h .pws-spark-leg i:not(.pws-lc-band):not(.pws-gust) { background: linear-gradient(90deg, var(--pw-colder), var(--pw-warmer)); }
.pws-lc { container-type: inline-size; }
/* noc tmavší než den v obou tématech */
.pws-lc-night { fill: #000; fill-opacity: .22; }
html.light .pws-lc-night { fill: var(--pr-ink); fill-opacity: .06; }
.pws-lc-icons { position: relative; height: 30px; margin-bottom: 4px; }
.pws-lc-icons img { position: absolute; top: 0; width: 28px; height: 28px; transform: translateX(-50%); }
/* na úzkém grafu ikona jen po 6 h, po 3 h by se překrývaly */
@container (max-width: 560px) { .pws-lc-icons .pws-lc-i3 { display: none; } }
/* osa dnů pod hodinami: den vystředěný na svůj úsek, hranice dne linkou; na úzkém grafu
   a v deseti dnech zkratka („Po 2.“), štítky extrémů deseti dnů na úzkém grafu jen tečkou */
.pws-lc-days { position: relative; height: 20px; margin-top: 3px; }
.pws-lc-days > span { position: absolute; top: 0; box-sizing: border-box; padding-top: 3px; border-left: 1px solid var(--pr-line);
  text-align: center; font-size: 12px; font-weight: 600; color: var(--pr-ink); white-space: nowrap; overflow: hidden; }
.pws-lc-days > span:first-child { border-left-color: transparent; }
.pws-lc-ds { display: none; }
.pws-lc-days-d .pws-lc-dl { display: none; }
.pws-lc-days-d .pws-lc-ds { display: inline; }
@container (max-width: 560px) {
  .pws-lc-dl { display: none; }
  .pws-lc-ds { display: inline; }
  .pws-lc-days-d > span { font-size: 11px; }
  .pws-lc-mk-d .pws-spark-ml { display: none; }
}

/* předpověď a měření teď (pws_fct_check_html) */
.pws-chk-v { margin: 0 0 8px; }
.pws-chk-v b { font-size: 15px; color: var(--pr-ink); }
.pws-chk-v .pws-n { display: block; margin-top: 2px; }
.pws-chk { list-style: none; margin: 0; padding: 0; }
.pws-chk li { display: grid; grid-template-columns: minmax(80px, auto) minmax(90px, auto) 1fr auto; align-items: center; gap: 4px 14px;
  padding: 7px 0; border-top: 1px solid var(--pr-line-soft); }
.pws-chk li:first-child { border-top: 0; }
.pws-chk-k { color: var(--pr-ink-dim); }
.pws-chk-m .pws-num { font-size: 15px; }
.pws-chk-e { font-size: var(--pr-fs-note); color: var(--pr-ink-dim); }
.pws-chk-b { justify-self: end; padding: 1px 9px; border-radius: 999px; font: 600 12px/1.5 var(--pr-sans); white-space: nowrap; color: var(--c);
  background: color-mix(in srgb, var(--c) 12%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 38%, transparent); }
@media (max-width: 520px) {
  .pws-chk li { grid-template-columns: minmax(70px, auto) 1fr auto; }
  .pws-chk-e { grid-column: 2 / -1; grid-row: 2; }
}