/* SunRoute: Stil für die Wetter-Seiten (Fragen mit aktueller Antwort), baut auf rechtliches.css auf */
:root{--gruen:#36553a;--gruen-text:#fbf5e6;--erster:#c0582a;}
[data-theme=dark]{--gruen:#fb8a4a;--gruen-text:#121110;--erster:#fb8a4a;}
body{background-image:radial-gradient(circle at 85% 0,rgba(242,193,78,.18),transparent 420px);}
[data-theme=dark] body{background-image:radial-gradient(circle at 85% 0,rgba(242,189,75,.07),transparent 420px);}
.dachzeile{font:700 14px 'Barlow Condensed',sans-serif;letter-spacing:1.2px;text-transform:uppercase;color:var(--accent);margin-bottom:6px;}
.blatt .stand{margin:0 0 4px;}
.fazit{background:var(--bg);border-left:4px solid var(--name-sun);border-radius:12px;padding:14px 18px 6px;margin:16px 0 4px;font-size:17px;}
.erklaer{font-size:14.5px;color:var(--ink2);}
.orte{list-style:none;padding:0;margin:12px 0 6px;display:flex;flex-direction:column;gap:8px;}
.ort{display:flex;align-items:center;gap:14px;background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:11px 14px;margin:0;}
.ort.erster{border-color:var(--name-sun);box-shadow:0 0 0 1px var(--name-sun) inset;}
.platz{flex-shrink:0;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font:700 16px 'Barlow Condensed',sans-serif;background:var(--surface);border:1px solid var(--line);color:var(--ink2);}
.erster .platz{background:var(--erster);border-color:var(--erster);color:#fff;}
[data-theme=dark] .erster .platz{color:#121110;}
.ort-text{flex:1;min-width:0;}
.ort-name{font:700 19px/1.15 'Barlow Condensed',sans-serif;letter-spacing:.2px;}
.ort-name small{font:500 14px 'Barlow',sans-serif;color:var(--ink3);margin-left:4px;}
.tage{display:flex;flex-wrap:wrap;gap:2px 16px;font-size:14.5px;color:var(--ink2);margin-top:2px;}
.tage b{color:var(--ink);font-weight:600;}
.punkte{flex-shrink:0;font:700 22px 'Barlow Condensed',sans-serif;color:var(--primary);min-width:40px;text-align:center;line-height:1;}
[data-theme=dark] .punkte{color:var(--name-sun);}
.selbst{display:flex;align-items:center;gap:18px;background:var(--bg);border-radius:14px;padding:14px 18px;margin:18px 0 6px;}
.selbst p{margin:0;flex:1;}
.knopf{flex-shrink:0;display:inline-block;background:var(--gruen);color:var(--gruen-text);text-decoration:none;font:700 18px 'Barlow Condensed',sans-serif;letter-spacing:.8px;text-transform:uppercase;padding:11px 20px;border-radius:12px;box-shadow:0 3px 0 rgba(0,0,0,.25);}
[data-theme=dark] a.knopf{color:var(--gruen-text);}
@media(max-width:560px){.selbst{flex-direction:column;align-items:stretch;text-align:left;}.knopf{text-align:center;}}
.land-tabelle{width:100%;border-collapse:collapse;font-size:15px;margin:8px 0 6px;}
.land-tabelle th{text-align:left;font:700 13px 'Barlow Condensed',sans-serif;letter-spacing:.8px;text-transform:uppercase;color:var(--ink3);padding:6px 8px;border-bottom:1px solid var(--line);}
.land-tabelle td{padding:8px;border-bottom:1px solid var(--line);}
.land-tabelle tr:last-child td{border-bottom:0;}
@media(max-width:560px){.land-tabelle{font-size:14px;}.land-tabelle th,.land-tabelle td{padding:6px 4px;}.handy-ohne-letzte th:last-child,.handy-ohne-letzte td:last-child{display:none;}}
.fuss p{margin-bottom:6px;color:var(--ink3);}
.punkte small{display:block;font:600 10.5px 'Barlow',sans-serif;letter-spacing:.4px;text-transform:uppercase;color:var(--ink3);margin-top:-2px;text-align:center;}
.tag .see{font-style:normal;font-weight:600;color:var(--accent);}
.weitere{padding-left:20px;}
.weitere li{margin-bottom:7px;}
.weitere a{font-weight:600;text-decoration:none;}
@media(hover:hover){.weitere a:hover{text-decoration:underline;}}
/* Hell/Dunkel-Knopf wie in der App: zeigt den aktuellen Modus, Sonne geht unter, Mond kommt */
.kopf .zurueck{margin-left:auto;}
.theme-btn{position:relative;overflow:hidden;width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink2);cursor:pointer;flex-shrink:0;}
.theme-btn .ic{position:absolute;left:50%;top:50%;width:20px;height:20px;margin:-10px 0 0 -10px;transition:transform .6s cubic-bezier(.5,0,.25,1),opacity .6s;}
[data-theme=light] .theme-btn .tb-moon{transform:translateY(-32px);opacity:0;}
[data-theme=dark] .theme-btn .tb-sun{transform:translateY(32px);opacity:0;}
.theme-btn:focus-visible{outline:2px solid var(--name-sun);outline-offset:2px;}
@media(prefers-reduced-motion:reduce){.theme-btn .ic{transition:none;}}
@media(max-width:400px){.marke span{font-size:22px;}.zurueck{padding:8px 10px;font-size:14px;}}