:root{--bg:#f3f4f6;--karte:#ffffff;--ink:#1b1e23;--muted:#68707a;--linie:#e2e5e9;--gut:#1a7f37;--gut-bg:#e7f4ec;--warn:#b42318;--warn-bg:#fdecea;--akzent:#2456c4;--jetzt:#d94f1e}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%}body{font-family:Segoe UI,system-ui,sans-serif;background:var(--bg);color:var(--ink)}button{font:inherit;cursor:pointer}input,select,textarea{font:inherit}code{font-family:Consolas,Cascadia Mono,monospace;font-size:.92em}.hauptmenue{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:20px;padding:10px 22px;background:var(--karte);border-bottom:1px solid var(--linie)}.hauptmarke{font-weight:700;font-size:17px}.hauptmenue nav{display:flex;gap:4px}.hauptmenue nav a{padding:7px 14px;border-radius:8px;text-decoration:none;color:var(--ink);font-size:14px}.hauptmenue nav a.aktiv{background:var(--ink);color:#fff}.hauptbenutzer{margin-left:auto;font-size:13.5px;color:var(--muted);display:flex;align-items:center;gap:8px}.rollenmarke{background:#eef1f5;border-radius:999px;padding:2px 9px;font-size:12px;margin-left:6px}.farbpunkt{display:inline-block;width:12px;height:12px;border-radius:50%;vertical-align:middle}button.klein{border:1px solid var(--linie);background:var(--karte);border-radius:7px;padding:4px 10px;font-size:13px;margin-left:4px}button.klein.gefahr,button.sekundaer.gefahr{color:var(--warn);border-color:#f3c2bd}button.primaer{background:var(--akzent);border:none;color:#fff;padding:9px 18px;border-radius:9px;font-size:14px;font-weight:600}button.sekundaer{background:var(--karte);border:1px solid var(--linie);padding:8px 18px;border-radius:9px;font-size:14px}button:disabled{opacity:.5;cursor:default}.seite{max-width:1100px;margin:0 auto;padding:18px 22px 60px}.seite h1{font-size:22px;margin:6px 0 10px}.kopfzeile{display:flex;align-items:center;gap:14px}.kopfzeile h1{flex:1}.untermenue{display:flex;gap:4px;margin-bottom:12px;flex-wrap:wrap}.untermenue a{padding:6px 12px;border-radius:8px;text-decoration:none;color:var(--ink);font-size:14px;border:1px solid var(--linie);background:var(--karte)}.untermenue a.active{background:var(--ink);color:#fff;border-color:var(--ink)}.karte{background:var(--karte);border:1px solid var(--linie);border-radius:12px;padding:16px 18px;margin-bottom:14px}.karte h3{margin:0 0 10px;font-size:13px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.4px}.karte h3 span{font-weight:400;text-transform:none;letter-spacing:0;margin-left:8px}.status{padding:10px 14px;border-radius:10px;font-weight:600;margin:10px 0;font-size:14px}.status.gut{background:var(--gut-bg);color:var(--gut)}.status.warn{background:var(--warn-bg);color:var(--warn)}.warn{color:var(--warn)}.muted-text{color:var(--muted);font-size:14px;margin:8px 0 14px;line-height:1.45}.ks{font-size:12.5px;color:var(--muted)}.kacheln{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.kachel{background:var(--karte);border:1px solid var(--linie);border-left:5px solid #9aa4b0;border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}.kachel .kl{font-size:15px;font-weight:600}.tabelle{width:100%;border-collapse:collapse;background:var(--karte);border:1px solid var(--linie);border-radius:12px;overflow:hidden;font-size:14px}.tabelle th{text-align:left;color:var(--muted);font-weight:600;padding:9px 12px;border-bottom:1px solid var(--linie);font-size:12.5px}.tabelle td{padding:9px 12px;border-bottom:1px solid #f0f2f4;vertical-align:top}.tabelle tr:last-child td{border-bottom:none}.tabelle td.rechts{text-align:right;white-space:nowrap}.tabelle tr.inaktiv td{opacity:.55}.tabelle tr.warnzeile td{background:#fff8f7}.zeile-form{display:flex;gap:8px;margin:10px 0 14px}.zeile-form input{flex:1;max-width:360px;padding:8px 10px;border:1px solid var(--linie);border-radius:8px}.token-karte{border-left:5px solid var(--akzent)}.token-karte h3{text-transform:none;letter-spacing:0;font-size:15px;color:var(--ink)}.token-zeile{display:flex;gap:8px;align-items:center;background:#f6f8fb;padding:10px;border-radius:8px;margin:8px 0;overflow-x:auto}.token-zeile code{white-space:nowrap}.einstellung{padding:8px 0;border-bottom:1px dashed #eef0f2}.einstellung:last-child{border-bottom:none}.einstellung label{display:grid;grid-template-columns:minmax(200px,1fr) 2fr;gap:12px;align-items:center;font-size:14px}.einstellung input{padding:7px 10px;border:1px solid var(--linie);border-radius:8px;width:100%}.einstellung .geheim{display:flex;gap:6px;align-items:center}@media(max-width:700px){.einstellung label{grid-template-columns:1fr}}.hinweisseite{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.hinweiskarte{background:var(--karte);border:1px solid var(--linie);border-radius:14px;padding:28px 32px;max-width:440px;text-align:center}.hinweiskarte h1{margin:0 0 8px;font-size:22px}.hinweiskarte p{color:var(--muted);margin:0 0 16px}.hinweis-klein{font-size:13px}.knopf{background:var(--akzent);color:#fff;border:none;padding:11px 26px;border-radius:9px;font-size:15px;font-weight:600}.knopf.sekundaer{background:var(--karte);color:var(--ink);border:1px solid var(--linie)}.dialog-hintergrund{position:fixed;top:0;right:0;bottom:0;left:0;background:#14192073;display:flex;align-items:center;justify-content:center;z-index:50;padding:12px}.dialog{background:var(--karte);border-radius:14px;padding:22px 24px;width:min(560px,100%);max-height:95vh;overflow:auto;display:flex;flex-direction:column;gap:10px}.dialog h2{margin:0 0 6px;font-size:19px}.dialog label{display:flex;flex-direction:column;gap:4px;font-size:13.5px;color:var(--muted)}.dialog label.zeile{flex-direction:row;align-items:center;gap:8px;color:var(--ink)}.dialog input:not([type=checkbox]),.dialog select,.dialog textarea{padding:8px 10px;border:1px solid var(--linie);border-radius:8px;color:var(--ink);width:100%}.dialog input[type=color]{width:56px;height:38px;padding:2px}.zwei-felder{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:520px){.zwei-felder{grid-template-columns:1fr}}.datum-zeit{display:flex;gap:6px}.datum-zeit input[type=time]{max-width:110px}.farbwahl{display:flex;gap:8px;align-items:center}.dialog-knoepfe{display:flex;gap:8px;margin-top:8px;align-items:center}.dialog-knoepfe .platz{flex:1}.kalender{max-width:1400px;margin:0 auto;padding:14px 18px 40px}.kalender-leiste{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:12px}.kalender-nav{display:flex;align-items:center;gap:6px;flex:1}.kalender-nav button{width:36px;height:36px;border:1px solid var(--linie);background:var(--karte);border-radius:8px;font-size:18px}.kalender-nav button.heute{width:auto;padding:0 12px;font-size:14px}.kalender-nav h1{font-size:20px;margin:0 0 0 10px}.kalender-schalter{display:flex;gap:4px;background:#eef1f5;border-radius:9px;padding:3px}.kalender-schalter button{border:none;background:transparent;padding:7px 14px;border-radius:7px;font-size:14px}.kalender-schalter button.aktiv{background:var(--karte);box-shadow:0 1px 2px #00000014}.kalender-schalter button.primaer{margin-left:8px}.monat-raster{display:grid;grid-template-columns:2.2em repeat(7,1fr);gap:1px;background:var(--linie);border:1px solid var(--linie);border-radius:10px;overflow:hidden}.monat-raster>*{background:var(--karte);min-height:2em}.wt-kopf,.kw-kopf{padding:6px;text-align:center;color:var(--muted);font-size:12.5px;font-weight:600;min-height:0}.monat-raster .kw{display:flex;align-items:flex-start;justify-content:center;padding-top:8px;color:var(--muted);font-size:12px;background:#fafbfc}.zelle{min-height:100px;padding:4px;cursor:pointer;display:flex;flex-direction:column;gap:2px}.zelle:hover{background:#f6f8fb}.zelle.fremd .nr{opacity:.35}.zelle.we{background:#fbfbfc}.zelle.heute .nr{background:var(--jetzt);color:#fff;border-radius:50%}.zelle .nr{font-size:13px;font-weight:600;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.chip{display:flex;gap:4px;align-items:center;border:none;text-align:left;border-radius:5px;padding:2px 6px;font-size:12.5px;background:color-mix(in srgb,var(--farbe) 16%,white);border-left:3px solid var(--farbe);color:var(--ink);width:100%;overflow:hidden}.chip.ganz{background:var(--farbe);color:#fff}.chip .zeit{color:var(--muted);font-variant-numeric:tabular-nums;flex:0 0 auto}.chip .text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wochen-raster{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.wochentag{background:var(--karte);border:1px solid var(--linie);border-radius:10px;padding:8px;min-height:300px;display:flex;flex-direction:column;gap:4px;cursor:pointer}.wochentag.heute{border-color:var(--jetzt)}.wochentag .kopf{color:var(--muted);font-size:13px;margin-bottom:4px}@media(max-width:900px){.wochen-raster{grid-template-columns:1fr}.wochentag{min-height:0}}.termin-liste .karte.heute{border-left:5px solid var(--jetzt)}.termin-zeile{display:grid;grid-template-columns:130px 1fr auto auto;gap:12px;align-items:center;width:100%;border:none;background:transparent;text-align:left;padding:8px 6px;border-left:4px solid var(--farbe);margin:4px 0;border-radius:4px;font-size:14px}.termin-zeile:hover{background:#f6f8fb}.termin-zeile .zeit{color:var(--muted);font-variant-numeric:tabular-nums}.termin-zeile .titel{font-weight:600}.termin-zeile .ort,.termin-zeile .wer{color:var(--muted);font-size:13px}@media(max-width:600px){.termin-zeile{grid-template-columns:1fr;gap:2px}}.tv{--grund:#f5f7fa;--flaeche:#ffffff;--linie:#d3dbe4;--schrift:#16202b;--gedaempft:#5d6b7a;height:100vh;display:flex;flex-direction:column;overflow:hidden;background:var(--grund);color:var(--schrift);font-size:clamp(13px,1.15vw,26px)}.tv-kopf{display:flex;align-items:baseline;gap:1.5rem;padding:.35rem 1rem;border-bottom:2px solid var(--linie);flex:0 0 auto}.tv-titel{font-size:1.35em;font-weight:700;letter-spacing:.02em}.tv-datum{font-size:1.05em;color:var(--gedaempft)}.tv-kw{margin-left:.7rem;padding:.1em .5em;border:1px solid var(--linie);border-radius:.3em;font-size:.8em}.tv-kopfwetter{display:flex;align-items:center;gap:.3em;font-size:1.1em;font-weight:600;margin-left:auto}.tv-punkte{display:flex;gap:.4rem;align-items:center;margin-left:1.2rem}.tv-punkt{width:.55em;height:.55em;border-radius:50%;background:var(--linie)}.tv-punkt.aktiv{background:var(--jetzt)}.tv-uhr{font-size:1.6em;font-weight:700;font-variant-numeric:tabular-nums;margin-left:1.2rem}.tv-fuss{padding:.15em 1rem;color:var(--gedaempft);font-size:.72em;display:flex;justify-content:space-between;flex:0 0 auto}.tv-inhalt{flex:1;min-height:0;display:flex}.tv-stoerung{flex:0 0 auto;display:flex;align-items:center;gap:1rem;padding:.3em 1rem;background:#fff3cd;color:#5c4400;font-size:.95em;border-bottom:1px solid var(--linie)}.tv-stoerung.schwer{background:#c8102e;color:#fff}.tv-stoerung .linie{font-weight:800;padding:.1em .5em;border-radius:.3em;background:#0000001f;white-space:nowrap}.tv-stoerung .text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tv-stoerung .zaehler{opacity:.7;font-size:.85em}.tv-muellband{flex:0 0 auto;display:flex;align-items:center;gap:1rem;padding:.25em 1rem;font-size:1.05em;font-weight:700;color:#101820}.tv-muellband .tonne{font-size:1.5em;line-height:1}.tv-hinweis{height:100vh;display:flex;align-items:center;justify-content:center;background:#16202b;color:#e8eef5;text-align:center;padding:2rem;font-size:clamp(14px,1.4vw,28px)}.tv-hinweis h1{margin:0 0 .4em}.tv-hinweis p{color:#9fb0c2;max-width:40em;word-break:break-word}.tv-nacht{height:100vh;background:#000;color:#3a4048;display:flex;align-items:flex-end;justify-content:flex-end;padding:3vh 3vw;font-size:3vw;font-variant-numeric:tabular-nums}.tv-uebersicht{flex:1;display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:.8rem;padding:.8rem;min-height:0}.tv-spalte{display:flex;flex-direction:column;gap:.8rem;min-height:0;overflow:hidden}.tv-kachel{background:var(--flaeche);border:1px solid var(--linie);border-radius:.5rem;padding:.6rem .9rem;display:flex;flex-direction:column;min-height:0;overflow:hidden;flex:0 0 auto}.tv-abfahrten{flex:1 1 0}.tv-abfahrten.sbahn{flex:1.5 1 0}.tv-tabelle{flex:1;min-height:0;overflow:hidden}.nicht-sichtbar{display:none!important}.tv-kachel h2{font-size:.85em;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--gedaempft);margin:0 0 .45rem;flex:0 0 auto;display:flex;align-items:center;gap:.5em}.tv .leer{color:var(--gedaempft);margin:0}.produkt{display:inline-block;font-weight:800;color:#fff;border-radius:.25em;padding:.05em .45em;letter-spacing:0;text-transform:none}.produkt.sbahn{background:#0a8a3a}.produkt.bus{background:#95276e}.tv-termine{flex:1 1 0}.tv-termine-liste{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:.5rem}.tv-tag-kopf{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--linie);padding-bottom:.15em;margin-bottom:.25em}.tv-tag-kopf .wann{font-weight:700}.tv-tag.heute .tv-tag-kopf .wann{color:var(--jetzt)}.tv-tag-kopf .datum{color:var(--gedaempft);font-size:.9em}.tv-termin{display:grid;grid-template-columns:5.2em 1fr auto;gap:.5em;align-items:baseline;padding:.15em .5em;border-left:.3em solid var(--farbe);margin:.15em 0;border-radius:.2em;background:color-mix(in srgb,var(--farbe) 10%,white)}.tv-termin .zeit{color:var(--gedaempft);font-variant-numeric:tabular-nums;font-size:.9em}.tv-termin .titel{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tv-termin .ort{grid-column:2;color:var(--gedaempft);font-size:.85em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tv-termin .wer{grid-column:3;grid-row:1;color:var(--gedaempft);font-size:.8em}.tv-abfahrten table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}.tv-abfahrten tr{border-bottom:1px solid var(--linie)}.tv-abfahrten tr:last-child{border-bottom:none}.tv-abfahrten td{padding:.28em .3em;vertical-align:middle}.tv-abfahrten .linie{font-weight:700;background:#c8102e;color:#fff;border-radius:.25em;padding:.1em .45em;text-align:center;width:1px;white-space:nowrap}.tv-abfahrten .richtung{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:0;width:100%}.tv-abfahrten .zeit{font-weight:700;white-space:nowrap;width:1px;padding-left:.8em}.tv-abfahrten .delay{color:var(--jetzt);font-size:.8em;margin-left:.25em}.tv-abfahrten .inmin{color:var(--gedaempft);white-space:nowrap;width:1px;text-align:right;padding-left:.8em}.tv-abfahrten .ausfall{opacity:.5;text-decoration:line-through}.tv-stoerungen{flex:0 0 auto}.tv-stoerungen ul{margin:0;padding-left:1.1em;font-size:.9em;line-height:1.35}.tv-stoerungen li{margin:.15em 0}.tv-wetter .wzeile{display:flex;align-items:center;gap:.7rem}.wsvg{flex:0 0 auto;display:block}.wgrad{font-size:2.1em;font-weight:700;font-variant-numeric:tabular-nums}.wdetails{color:var(--gedaempft);line-height:1.3;font-size:.9em}.wdetails strong{color:var(--schrift)}.wtage{display:flex;gap:.4rem;margin-top:.5rem;border-top:1px solid var(--linie);padding-top:.4rem}.wtag{flex:1;text-align:center;font-size:.85em}.wtag-name{color:var(--gedaempft)}.wtag-temp{font-weight:700}.wtag-temp span{color:var(--gedaempft);font-weight:400}.wtag-regen{color:#3d9be9;font-size:.85em}.tv-muellliste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35em}.tv-muellliste li{display:flex;align-items:center;gap:.6em}.punktfarbe{width:.85em;height:.85em;border-radius:.2em;flex:0 0 auto}.mtext{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mwann{color:var(--gedaempft);white-space:nowrap}.tv-tanken table{width:100%;border-collapse:collapse;font-size:.92em}.tv-tanken td{padding:.2em .3em}.tv-tanken .marke{font-weight:700;white-space:nowrap}.tv-tanken .ort{color:var(--gedaempft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:0;width:100%}.tv-tanken .preis{font-weight:700;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.tv-tanken .zu{opacity:.5}.tv-punkte{border-left:.4em solid var(--farbe)}.saldo-zeile{display:flex;align-items:baseline;gap:.7em}.saldo{font-size:2em;font-weight:800;font-variant-numeric:tabular-nums}.saldo-details{color:var(--gedaempft);font-size:.85em}.saldo-details .rest.warn{color:var(--jetzt);font-weight:700}.buchungen{list-style:none;margin:.3em 0 0;padding:0;font-size:.88em}.buchungen li{display:grid;grid-template-columns:3.5em 1fr auto;gap:.5em;padding:.12em 0;border-top:1px dashed var(--linie)}.buchungen .pkt{font-weight:700;text-align:right;font-variant-numeric:tabular-nums}.buchungen .plus{color:var(--gut)}.buchungen .minus{color:var(--warn)}.buchungen .bez{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.buchungen .wann{color:var(--gedaempft);white-space:nowrap}.buchungen .storniert{text-decoration:line-through;opacity:.5}.tv-kalender{flex:1;display:flex;flex-direction:column;padding:.6rem .8rem;min-height:0}.tv-kalender-kopf{font-size:1.4em;font-weight:700;margin-bottom:.3rem}.tv-kalender-raster{flex:1;display:grid;grid-template-columns:2.2em repeat(7,1fr);grid-template-rows:auto repeat(var(--wochen),1fr);gap:1px;background:var(--linie);border:1px solid var(--linie);border-radius:.4rem;overflow:hidden;min-height:0}.tv-kalender-raster>*{background:var(--flaeche);min-height:0;overflow:hidden}.tv-kalender-raster .wt-kopf,.tv-kalender-raster .kw-kopf{padding:.2em;text-align:center;color:var(--gedaempft);font-size:.8em;font-weight:600}.tv-kalender-raster .kw{display:flex;align-items:flex-start;justify-content:center;padding-top:.3em;color:var(--gedaempft);font-size:.75em;background:#fafbfc}.tv-kalender-raster .zelle{padding:.2em .3em;display:flex;flex-direction:column;gap:.1em;cursor:default}.tv-kalender-raster .zelle.we{background:#fbfbfc}.tv-kalender-raster .zelle.fremd .nr{opacity:.3}.tv-kalender-raster .zelle.heute .nr{background:var(--jetzt);color:#fff;border-radius:50%}.tv-kalender-raster .nr{font-size:.9em;font-weight:700;width:1.6em;height:1.6em;display:flex;align-items:center;justify-content:center}.tv-kalender-raster .chip{font-size:.72em;padding:.1em .4em;border-radius:.25em;display:block;background:color-mix(in srgb,var(--farbe) 16%,white);border-left:.25em solid var(--farbe);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tv-kalender-raster .chip.ganz{background:var(--farbe);color:#fff}.tv-kalender-raster .chip .zeit{color:var(--gedaempft);margin-right:.3em}.tv-kalender-raster .chip.ganz .zeit{color:#fffc}.tv-kalender-raster .mehr{font-size:.7em;color:var(--gedaempft)}.tv-fotos{flex:1;position:relative;background:#000;overflow:hidden}.tv-fotos .hintergrund{position:absolute;top:-5%;right:-5%;bottom:-5%;left:-5%;background-size:cover;background-position:center;filter:blur(30px) brightness(.5);z-index:0}.tv-fotos .foto{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;z-index:1}.tv-fotos .foto.neu{animation:einblenden 1.2s ease both}.tv-fotos .foto.alt{animation:ausblenden 1.2s ease both}.tv-fotos .leer{color:#889;padding:2rem}@keyframes einblenden{0%{opacity:0}to{opacity:1}}@keyframes ausblenden{0%{opacity:1}to{opacity:0}}.tv-muellgross{flex:1;display:flex;align-items:center;justify-content:center;gap:3rem;background:var(--tonne);color:#101820}.tv-muellgross .symbol{font-size:9em;line-height:1}.tv-muellgross .wann{font-size:2.6em;font-weight:800;line-height:1.1}.tv-muellgross .was{font-size:4em;font-weight:800;line-height:1.05}.tv-muellgross .datum2{font-size:1.4em;opacity:.75;margin-top:.3em}.tv-muellgross .folgende{display:flex;gap:.6rem;margin-top:1.2rem;flex-wrap:wrap}.tv-muellgross .chip{border-left:.4em solid var(--tonne);background:var(--flaeche);padding:.25em .7em;border-radius:.25em;font-size:.85em;display:inline-block;width:auto}.feld-block{display:flex;flex-direction:column;gap:4px;font-size:13.5px;color:var(--muted)}.feld-block input,.feld-block select{padding:8px 10px;border:1px solid var(--linie);border-radius:8px;color:var(--ink)}.anleitung{margin:6px 0 0;padding-left:18px;font-size:13.5px;line-height:1.5;color:var(--muted)}
