:root{--nacht:#070b18;--tiefe:#0e1530;--tiefe2:#131c3c;--rand:#212c52;--text:#eef1fa;--gedaempft:#98a3c7;--aurora:#5cf2a6;--aurora-tief:#1fb377;--sehrhoch:#a8ff78;--hoch:#5cf2a6;--mittel:#f5d060;--gering:#f08c4b;--keine:#6d7699;--akzent:var(--aurora);--muted:var(--gedaempft);--bg2:var(--tiefe)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--nacht);color:var(--text);font:16px/1.55 "IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;position:relative;min-height:100vh}
body::before{content:"";position:fixed;inset:0;z-index:-2;background:
 radial-gradient(1px 1px at 12% 18%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 28% 72%,#dfe6ff 60%,transparent 61%),radial-gradient(1.5px 1.5px at 44% 32%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 61% 9%,#cfd8ff 60%,transparent 61%),radial-gradient(1px 1px at 73% 58%,#fff 60%,transparent 61%),radial-gradient(1.5px 1.5px at 86% 26%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 91% 81%,#dfe6ff 60%,transparent 61%),radial-gradient(1px 1px at 7% 52%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 37% 91%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 55% 66%,#cfd8ff 60%,transparent 61%),radial-gradient(1.5px 1.5px at 19% 40%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 67% 84%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 80% 44%,#dfe6ff 60%,transparent 61%),radial-gradient(1px 1px at 48% 5%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 96% 60%,#fff 60%,transparent 61%),radial-gradient(1px 1px at 3% 88%,#cfd8ff 60%,transparent 61%);opacity:.55}
body::after{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(60% 40% at 50% -10%,rgba(92,242,166,.16),transparent 70%),radial-gradient(40% 30% at 85% 10%,rgba(124,196,255,.08),transparent 70%);pointer-events:none}
a{color:var(--aurora);text-decoration-thickness:1px;text-underline-offset:3px}a:hover{color:#fff}
main{max-width:1040px;margin:0 auto;padding:1.2rem 1.2rem 3rem}
h1,h2,h3,.display{font-family:"Fraunces","Iowan Old Style",Georgia,serif;font-weight:600;letter-spacing:-.01em}
h1{font-size:clamp(1.8rem,4.5vw,3rem);line-height:1.08;margin:.6rem 0 1rem;font-variation-settings:"opsz" 72}
h2{font-size:1.35rem;margin:2rem 0 .6rem;color:var(--text)}h3{font-size:1.05rem;margin:.6rem 0 .25rem}
.kopf{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1.2rem;border-bottom:1px solid var(--rand);background:rgba(7,11,24,.7);backdrop-filter:blur(8px);position:sticky;top:0;z-index:5}
.marke{font-family:"Fraunces",Georgia,serif;font-style:italic;font-weight:600;font-size:1.35rem;color:var(--text);text-decoration:none;letter-spacing:-.01em}.marke b{font-style:normal;color:var(--aurora);font-weight:600}
.kopf nav a{margin-left:1.1rem;color:var(--gedaempft);text-decoration:none;font-size:.95rem}.kopf nav a:hover{color:var(--text)}
.satz{font-size:1.15rem;line-height:1.5;background:linear-gradient(180deg,var(--tiefe2),var(--tiefe));padding:1.1rem 1.2rem;border-left:4px solid var(--aurora);border-radius:6px;margin:1rem 0}
.satz strong{font-family:"Fraunces",Georgia,serif;font-size:1.25em;font-weight:600}
.satz.stufe-hoch,.satz.stufe-sehr-hoch{border-color:var(--hoch)}.satz.stufe-mittel{border-color:var(--mittel)}.satz.stufe-gering{border-color:var(--gering)}.satz.stufe-keine{border-color:var(--keine)}
.pfadnav,.klein{font-size:.85rem;color:var(--gedaempft)}
.kacheln{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.8rem;margin:1rem 0}
.kachel{background:var(--tiefe);border:1px solid var(--rand);padding:1rem 1.1rem;border-radius:10px;display:flex;flex-direction:column;text-decoration:none;color:var(--text);transition:border-color .2s,transform .2s}a.kachel:hover{border-color:var(--aurora);transform:translateY(-2px)}
.kachel .wert{font-family:"Fraunces",Georgia,serif;font-size:1.9rem;font-weight:600;line-height:1.1}.kachel .label{color:var(--gedaempft);margin-top:.15rem}.kachel .klein{margin-top:.35rem}
table.stunden{width:100%;border-collapse:collapse;margin:.5rem 0;font-variant-numeric:tabular-nums}table.stunden td,table.stunden th{padding:.35rem .5rem;border-bottom:1px solid var(--rand);text-align:left}
tr.klar td{color:var(--sehrhoch)}tr.wolkig td{color:var(--mittel)}tr.bedeckt td{color:var(--gedaempft)}
.stufe-sehr-hoch{color:var(--sehrhoch)}.stufe-hoch{color:var(--hoch)}.stufe-mittel{color:var(--mittel)}.stufe-gering{color:var(--gering)}.stufe-keine,.stufe-unbekannt{color:var(--keine)}
.laender{columns:3;column-gap:2rem}.laender section{break-inside:avoid;margin-bottom:1rem}.laender ul,.nachbarn,.beste{padding-left:1.1rem}.laender li{font-size:.92rem}
.fuss{max-width:1040px;margin:2rem auto;padding:1rem 1.2rem;color:var(--gedaempft);font-size:.85rem;border-top:1px solid var(--rand)}
figure.grafik{margin:.8rem 0 1.2rem;overflow-x:auto;-webkit-overflow-scrolling:touch}figure.grafik svg{display:block;width:100%;min-width:560px;height:auto}figure.grafik figcaption{font-size:.85rem;color:var(--gedaempft);margin-top:.4rem}
details{margin:.5rem 0 1rem}summary{cursor:pointer;color:var(--aurora)}
/* Startseite */
.held{padding:1.5rem 0 .5rem}.held h1{max-width:18ch}.held .unter{font-size:1.15rem;color:var(--gedaempft);max-width:60ch}
.finder{background:var(--tiefe);border:1px solid var(--rand);border-radius:14px;padding:1.1rem;margin:1.2rem 0;display:grid;gap:.8rem;grid-template-columns:auto 1fr}
.finder .knopf{background:var(--aurora);color:#062a19;border:0;border-radius:10px;padding:.85rem 1.1rem;font:600 1rem "IBM Plex Sans",sans-serif;cursor:pointer;white-space:nowrap}.finder .knopf:hover{background:#7ff7ba}
.finder .suche{position:relative}.finder input{width:100%;padding:.85rem 1rem;border-radius:10px;border:1px solid var(--rand);background:var(--nacht);color:var(--text);font:1rem "IBM Plex Sans",sans-serif}.finder input:focus{outline:2px solid var(--aurora);border-color:transparent}
.finder .treffer{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--tiefe2);border:1px solid var(--rand);border-radius:10px;list-style:none;margin:0;padding:.3rem;z-index:6;display:none}.finder .treffer.offen{display:block}.finder .treffer a{display:flex;justify-content:space-between;padding:.5rem .7rem;border-radius:7px;text-decoration:none;color:var(--text)}.finder .treffer a:hover,.finder .treffer a.aktiv{background:var(--rand)}.finder .treffer .land{color:var(--gedaempft);font-size:.85rem}
.finder .zuletzt{grid-column:1/-1;color:var(--gedaempft);font-size:.9rem;min-height:1.2em}
.karte-block{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1.5rem;align-items:start;margin:1rem 0}
.karte svg{width:100%;height:auto;display:block}.karte path{stroke:var(--nacht);stroke-width:.8;transition:filter .15s}.karte a:hover path,.karte path:hover{filter:brightness(1.35);stroke:#fff}
.karte .f-sehr-hoch{fill:var(--sehrhoch)}.karte .f-hoch{fill:var(--hoch)}.karte .f-mittel{fill:var(--mittel)}.karte .f-gering{fill:var(--gering)}.karte .f-keine{fill:#2a3560}.karte .f-unbekannt{fill:#1c244a}
.legende{display:flex;flex-wrap:wrap;gap:.5rem .9rem;font-size:.85rem;color:var(--gedaempft);margin:.5rem 0}.legende span::before{content:"";display:inline-block;width:.8em;height:.8em;border-radius:3px;margin-right:.35em;vertical-align:-.05em;background:var(--c)}
.beste li{margin:.2rem 0}
@media(max-width:760px){.laender{columns:1}.kopf{flex-wrap:wrap;gap:.4rem}.kopf nav a{margin:0 .7rem 0 0}.finder{grid-template-columns:1fr}.karte-block{grid-template-columns:1fr}main{padding:1rem 1rem 3rem}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Kreisseite */
.kacheln.kompakt{grid-template-columns:repeat(4,1fr);gap:.6rem}.kacheln.kompakt .kachel{padding:.8rem .9rem}.kacheln.kompakt .wert{font-size:1.5rem}.kacheln.kompakt .label{font-size:.9rem}
figure.grafik.nacht{margin-top:.6rem}
.banner{background:linear-gradient(90deg,#0f3d2b,#1fb377 60%,#0f3d2b);text-align:center;padding:.55rem 1rem;font-weight:600}.banner a{color:#062a19;text-decoration:none}
body.ereignis .satz{box-shadow:0 0 0 1px rgba(92,242,166,.35),0 0 40px rgba(92,242,166,.18);animation:atmen 4s ease-in-out infinite}
@keyframes atmen{0%,100%{box-shadow:0 0 0 1px rgba(92,242,166,.35),0 0 30px rgba(92,242,166,.12)}50%{box-shadow:0 0 0 1px rgba(92,242,166,.6),0 0 60px rgba(92,242,166,.28)}}
@media(max-width:760px){.kacheln.kompakt{grid-template-columns:1fr 1fr}.kacheln.kompakt .wert{font-size:1.35rem}h1{font-size:1.65rem}.satz{font-size:1.05rem;padding:.9rem 1rem}.satz strong{display:block;font-size:1.35em;margin-bottom:.2rem}figure.grafik.nacht svg{min-width:0}.kreis table.stunden td:nth-child(2){font-size:.9rem}}
@media(prefers-reduced-motion:reduce){body.ereignis .satz{animation:none}}

/* Ereignismodus Startseite */
.ueberzeile{font-family:"IBM Plex Sans",sans-serif;font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.8rem;color:var(--aurora);margin:0}
.ereignis-held h1{max-width:22ch}
.live{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin:1rem 0 .4rem}.live .kachel{padding:.7rem .9rem}.live .wert{font-size:1.4rem}.live .label{font-size:.85rem}
body.ereignis::after{background:radial-gradient(70% 45% at 50% -10%,rgba(92,242,166,.32),transparent 70%),radial-gradient(40% 30% at 85% 10%,rgba(124,196,255,.10),transparent 70%)}
@media(max-width:760px){.live{grid-template-columns:1fr 1fr}}

.karte .f-b1{fill:#1c2f5a}.karte .f-b2{fill:#1c5cab}.karte .f-b3{fill:#3987e5}.karte .f-b4{fill:#6da7ec}.karte .f-b5{fill:#cde2fb}

/* Polarlicht-Vorhänge im Ereignismodus: drei geblurrte, schräg gestellte Bänder, die von oben in die Seite ragen */
.aurora{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.aurora span{position:absolute;left:-20%;width:140%;height:95vh;top:-20vh;transform-origin:50% 0;filter:blur(30px);opacity:.9;mix-blend-mode:screen;
 background:linear-gradient(180deg,rgba(92,242,166,0) 0%,rgba(92,242,166,.85) 18%,rgba(120,255,190,.6) 38%,rgba(72,150,255,.35) 60%,rgba(190,90,255,.22) 78%,rgba(0,0,0,0) 100%)}
.aurora span:nth-child(1){transform:skewX(-14deg) scaleY(1);animation:wabern1 14s ease-in-out infinite}
.aurora span:nth-child(2){top:-28vh;height:100vh;opacity:.65;transform:skewX(9deg);animation:wabern2 19s ease-in-out infinite;background:linear-gradient(180deg,rgba(92,242,166,0) 0%,rgba(140,255,200,.8) 16%,rgba(92,242,166,.5) 42%,rgba(190,90,255,.3) 68%,rgba(0,0,0,0) 100%)}
.aurora span:nth-child(3){top:-15vh;height:85vh;opacity:.55;filter:blur(14px);transform:skewX(-4deg);animation:wabern3 11s ease-in-out infinite;background:repeating-linear-gradient(94deg,rgba(92,242,166,.0) 0 40px,rgba(140,255,200,.6) 60px 90px,rgba(92,242,166,0) 110px 160px),linear-gradient(180deg,rgba(92,242,166,.7),rgba(0,0,0,0) 85%)}
@keyframes wabern1{0%,100%{transform:skewX(-14deg) translateX(-3%) scaleY(1)}35%{transform:skewX(-9deg) translateX(4%) scaleY(1.12)}70%{transform:skewX(-17deg) translateX(-6%) scaleY(.94)}}
@keyframes wabern2{0%,100%{transform:skewX(9deg) translateX(5%) scaleY(1);opacity:.38}50%{transform:skewX(4deg) translateX(-7%) scaleY(1.18);opacity:.5}}
@keyframes wabern3{0%,100%{transform:skewX(-4deg) translateX(0) scaleY(1);opacity:.32}50%{transform:skewX(2deg) translateX(9%) scaleY(1.25);opacity:.42}}
body.ereignis .kopf{background:rgba(7,11,24,.45)}
body.ereignis .held h1{text-shadow:0 0 40px rgba(92,242,166,.35)}
body.ereignis .satz,body.ereignis .kachel,body.ereignis .finder{background:rgba(10,16,38,.78);backdrop-filter:blur(6px)}body.ereignis .held .unter{color:#dfe6ff}
@media(prefers-reduced-motion:reduce){.aurora span{animation:none!important}}
@media(max-width:760px){.aurora span{filter:blur(28px);height:55vh}}

.karte .d-sehr-dunkel{fill:#0b1020}.karte .d-dunkel{fill:#1c2f5a}.karte .d-maessig-aufgehellt{fill:#2f4a8f}.karte .d-hell{fill:#5a78c8}.karte .d-sehr-hell{fill:#c9d3f5}.karte .park{fill:var(--aurora);stroke:#062a19;stroke-width:1.5}

/* Finsternis-Animationen */
.finsternis-held{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:1.4rem;align-items:center;margin:1rem 0}
.anim{position:relative;aspect-ratio:2/1;border-radius:12px;background:radial-gradient(60% 80% at 50% 50%,#0f1734,#070b18 80%);overflow:hidden;border:1px solid var(--rand)}
.anim.sofi .sonne{position:absolute;left:50%;top:50%;width:38%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#fff6d5 0 60%,#ffd166 75%,rgba(255,180,60,.0) 100%);box-shadow:0 0 40px 12px rgba(255,210,120,.45)}
.anim.sofi .mond{position:absolute;left:50%;top:50%;width:37%;aspect-ratio:1;border-radius:50%;background:#070b18;box-shadow:inset -6px -4px 14px rgba(255,255,255,.06);transform:translate(-50%,calc(-50% - var(--versatz)*1%)) translateX(-90%);animation:sofi 9s ease-in-out infinite}
@keyframes sofi{0%{transform:translate(-50%,calc(-50% - var(--versatz)*1%)) translateX(-90%)}45%,55%{transform:translate(-50%,calc(-50% - var(--versatz)*1%)) translateX(0)}100%{transform:translate(-50%,calc(-50% - var(--versatz)*1%)) translateX(90%)}}
.anim.mofi .halb{position:absolute;left:50%;top:50%;width:70%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:rgba(80,90,140,.18)}
.anim.mofi .kern{position:absolute;left:50%;top:50%;width:31%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:rgba(20,25,60,.75);box-shadow:0 0 30px rgba(0,0,0,.6)}
.anim.mofi svg{position:absolute;inset:0;width:100%;height:100%}
.anim.mofi .mondlauf{animation:mofi 10s linear infinite;transform:translate(60px,calc(var(--y,0)*1px))}
@keyframes mofi{0%{transform:translate(60px,calc(var(--y,0)*1px))}100%{transform:translate(340px,calc(var(--y,0)*1px))}}
.countdown{display:inline-block;margin-left:.4rem;color:var(--aurora);font-weight:600;font-variant-numeric:tabular-nums}
@media(max-width:760px){.finsternis-held{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.anim.sofi .mond{animation:none;transform:translate(-50%,calc(-50% - var(--versatz)*1%))}.anim.mofi .mondlauf{animation:none;transform:translate(200px,calc(var(--y,0)*1px))}}

/* Minikarten und Themenkacheln */
.minikarten{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem;margin:.6rem 0 1.2rem}
.mini{display:flex;flex-direction:column;gap:.15rem;padding:.75rem .8rem;background:var(--tiefe);border:1px solid var(--rand);border-radius:10px;text-decoration:none;color:var(--text);transition:border-color .2s,transform .2s}.mini:hover{border-color:var(--aurora);transform:translateY(-2px)}
.mini svg,.thema svg{width:24px;height:24px;color:var(--aurora);margin-bottom:.25rem}.mini .t{font-size:.85rem;color:var(--gedaempft)}.mini .w{font-weight:600;font-size:.98rem}
.themen{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.8rem;margin:1rem 0}
.thema{display:flex;flex-direction:column;padding:1rem 1.1rem;background:var(--tiefe);border:1px solid var(--rand);border-radius:12px;text-decoration:none;color:var(--text);transition:border-color .2s,transform .2s}.thema:hover{border-color:var(--aurora);transform:translateY(-2px)}
.thema .t{font-size:.85rem;color:var(--gedaempft)}.thema .w{font-family:"Fraunces",Georgia,serif;font-size:1.35rem;font-weight:600;line-height:1.2;margin:.1rem 0 .3rem}.thema .d{font-size:.88rem;color:var(--gedaempft);line-height:1.4}
@media(max-width:760px){.themen{grid-template-columns:1fr 1fr}.thema .w{font-size:1.15rem}}

.recht{max-width:760px}.recht h2{font-size:1.1rem;margin-top:1.5rem}.recht p,.recht li{color:var(--text)}