/* Wetter in der Region (27.10.2026): Regionalkarte wie auf Bayrischzell TV, Baustein [[wetter-region]] (inc/wetterregion.php).
   Alle Masse der Karte wachsen mit ihrer Breite: --u ist ein Pixel des 1300 px breiten Kartenbilds. */
.wregion{margin:30px 0 10px}
.wregion .wr-intro{margin:0 0 14px}
.wr-wahl{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 16px}
.wr-knopf{font:inherit;font-size:1rem;line-height:1.2;cursor:pointer;border:2px solid var(--gruen,#3e5a4c);background:#fff;color:var(--gruen-dunkel,#314a3e);border-radius:999px;padding:9px 18px}
.wr-knopf span{font-weight:400}
.wr-knopf.aktiv{background:var(--gruen-dunkel,#314a3e);border-color:var(--gruen-dunkel,#314a3e);color:#fff}
.wr-knopf:focus-visible{outline:3px solid #ddbd79;outline-offset:2px}
.wr-tagzeile{margin:0 0 12px}
.wr-karte{position:relative;container-type:inline-size;aspect-ratio:1300/813;border-radius:14px;overflow:hidden;background:#102b40;--u:calc(100cqw / 1300)}
.wr-karte img{display:block;width:100%;height:100%;object-fit:cover}
.wr-karte .wr-punkt,.wr-karte .wr-box,.wr-karte .wr-name,.wr-land{position:absolute}
.wr-land{font-size:calc(var(--u) * 22);font-weight:600;letter-spacing:.35em;text-transform:uppercase;color:#f7f5ef99;transform:translate(-50%,-80%);white-space:nowrap;pointer-events:none}
.wr-punkt{width:calc(var(--u) * 18);height:calc(var(--u) * 18);margin:calc(var(--u) * -9) 0 0 calc(var(--u) * -9);border-radius:50%;background:#f7f5ef;box-shadow:0 0 0 max(2px,calc(var(--u) * 3)) #091f31}
.wr-punkt.heimat{width:calc(var(--u) * 22);height:calc(var(--u) * 22);margin:calc(var(--u) * -11) 0 0 calc(var(--u) * -11);background:#ddbd79}
.wr-box{box-sizing:border-box;height:calc(var(--u) * 88);display:flex;align-items:center;gap:calc(var(--u) * 8);padding:0 calc(var(--u) * 18) 0 calc(var(--u) * 10);border-radius:calc(var(--u) * 20);background:#091f31ed;border:max(1px,calc(var(--u) * 2)) solid #f7f5ef3c;box-shadow:0 calc(var(--u) * 6) calc(var(--u) * 14) #020a1278;white-space:nowrap;color:#f7f5ef;line-height:1}
.wr-box.heimat{border:max(2px,calc(var(--u) * 3)) solid #ddbd79}
.b-oben{transform:translate(-50%,calc(-100% - var(--u) * 20))}
.b-unten{transform:translate(-50%,calc(var(--u) * 20))}
.b-rechts{transform:translate(calc(var(--u) * 24),-50%)}
.b-links{transform:translate(calc(-100% - var(--u) * 24),-50%)}
.b-oben-rechts{transform:translate(calc(var(--u) * 6),calc(-100% - var(--u) * 20))}
.b-oben-links{transform:translate(calc(-100% - var(--u) * 6),calc(-100% - var(--u) * 20))}
.b-unten-rechts{transform:translate(calc(var(--u) * 6),calc(var(--u) * 20))}
.b-unten-links{transform:translate(calc(-100% - var(--u) * 6),calc(var(--u) * 20))}
.b-oben::after,.b-unten::after{content:'';position:absolute;left:50%;width:max(1px,calc(var(--u) * 2.4));height:calc(var(--u) * 12);background:#f7f5efd2;transform:translateX(-50%)}
.b-oben::after{top:100%}
.b-unten::after{bottom:100%}
.wr-sym{display:flex;line-height:0;font-size:calc(var(--u) * 68)}
.wr-sym svg{display:block}
.wr-max{font-size:calc(var(--u) * 60);font-weight:800;margin-left:calc(var(--u) * 4)}
.wr-box i,.wr-liste i{display:block;width:max(1px,calc(var(--u) * 2));height:calc(var(--u) * 44);background:#f7f5ef5a;margin:0 calc(var(--u) * 6) 0 calc(var(--u) * 8)}
.wr-min{font-size:calc(var(--u) * 42);font-weight:700;color:#8ac4f0}
.wr-name{font-size:max(11px,calc(var(--u) * 32));font-weight:700;line-height:1.2;color:#f7f5ef;white-space:nowrap;text-shadow:0 0 6px #040e18,0 0 3px #040e18,0 2px 4px #040e18e6}
.l-unter{transform:translate(-50%,calc(var(--u) * 16))}
.l-ueber{transform:translate(-50%,calc(-100% - var(--u) * 16))}
.l-rechts{transform:translate(calc(var(--u) * 18),-50%)}
.l-links{transform:translate(calc(-100% - var(--u) * 18),-50%)}
/* Liste fuer schmale Bildschirme, dort sind die Kaestchen auf der Karte zu klein */
.wr-liste{list-style:none;margin:12px 0 0;padding:0;display:none;gap:8px}
.wr-liste li{display:flex;align-items:center;gap:8px;background:#102b40;color:#f7f5ef;border-radius:12px;padding:8px 14px;line-height:1}
.wr-liste li.heimat{box-shadow:inset 0 0 0 2px #ddbd79}
.wr-liste .wr-lname{flex:1;font-weight:700;font-size:1.05rem}
.wr-liste .wr-sym{font-size:38px}
.wr-liste .wr-max{font-size:28px;min-width:2.3em;text-align:right;font-variant-numeric:tabular-nums}
.wr-liste i{width:1px;height:24px;margin:0 6px}
.wr-liste .wr-min{font-size:21px;min-width:2.5em;text-align:right;font-variant-numeric:tabular-nums}
.wr-info{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 40px;margin:16px 0 0;font-weight:600}
.wr-kopf{display:block;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted,#61705f);margin-bottom:2px}
.wr-legende{display:flex;align-items:center;gap:10px;margin-left:auto;font-weight:700}
.wr-legende i{width:2px;height:1.2em;background:#c5cec6}
.wr-legende .nacht{color:#2f7fc0}
.wregion .wetter-quelle{margin-top:12px}
@media (max-width:699px){
  .wr-karte .wr-box{display:none}
  .wr-liste{display:grid}
  .wr-legende{margin-left:0}
}