:root{--bg: #FAFAF8;--karte: #FFFFFF;--alt-flaeche: #F3F4F2;--trennlinie: #E4E6E3;--text: #242B32;--text-dim: #65686D;--text-disabled: #999DA3;--akzent: #0B4E5E;--akzent-text: #FFFFFF;--akzent-schwach: rgba(11, 78, 94, .08);--gruen: #1E8E3E;--gruen-schwach: rgba(30, 142, 62, .1);--bernstein: #B45309;--bernstein-schwach: rgba(180, 83, 9, .1);--rot: #C4281C;--rot-schwach: rgba(196, 40, 28, .1);--blau: #1A56DB;--blau-schwach: rgba(26, 86, 219, .1);color-scheme:light}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:16px;line-height:1.45}.app{max-width:480px;margin:0 auto;padding:16px 16px 0;min-height:100vh;display:flex;flex-direction:column}.app-main{flex:1;padding-bottom:96px}.app-header h1{font-size:20px;font-weight:700;margin:4px 0;color:var(--text)}.warteschlange-hinweis{color:var(--bernstein);font-size:14px;margin:0 0 16px}.card{background:var(--karte);border:1px solid var(--trennlinie);border-radius:16px;padding:20px;margin-bottom:24px}.card h2{margin-top:0;margin-bottom:12px;font-size:18px;font-weight:600;color:var(--text)}.segmented{display:flex;gap:8px;margin-bottom:16px}.segment{flex:1;padding:12px;min-height:44px;border-radius:12px;border:1px solid var(--trennlinie);background:var(--karte);color:var(--text);font-size:15px}.segment.aktiv{background:var(--akzent);color:var(--akzent-text);border-color:var(--akzent);font-weight:600}.capture-buttons{display:flex;flex-direction:column;gap:12px}button{cursor:pointer;font-family:inherit}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--akzent);outline-offset:2px}.btn-primary,.btn-secondary{padding:14px;min-height:48px;border-radius:12px;border:none;font-size:16px;font-weight:600}.btn-primary{background:var(--akzent);color:var(--akzent-text)}.btn-secondary{background:var(--karte);color:var(--akzent);border:1px solid var(--trennlinie)}.btn-text{background:none;border:none;color:var(--akzent);font-size:13px;font-weight:600;padding:8px 0;min-height:44px}button:disabled{opacity:.5;cursor:not-allowed}.hinweis{color:var(--text-dim);font-size:14px}.fehler{color:var(--rot);font-size:14px}.reading-liste{display:flex;flex-direction:column;gap:12px}.reading-card{display:flex;gap:12px;padding:12px;border-radius:12px;background:var(--alt-flaeche);border:1px solid var(--trennlinie)}.reading-thumb{width:64px;height:64px;border-radius:10px;overflow:hidden;flex-shrink:0;background:var(--trennlinie)}.reading-thumb img{width:100%;height:100%;object-fit:cover}.thumb-platzhalter{width:100%;height:100%}.thumb-geloescht{display:flex;align-items:center;justify-content:center;color:var(--gruen);font-size:1.4rem;font-weight:700}.reading-info{flex:1;min-width:0}.reading-kopf{display:flex;justify-content:space-between;align-items:center}.badge{font-size:12px;padding:3px 10px;border-radius:999px;font-weight:600}.badge-bestaetigt{background:var(--gruen-schwach);color:var(--gruen)}.badge-zu_pruefen{background:var(--bernstein-schwach);color:var(--bernstein)}.badge-fehler{background:var(--rot-schwach);color:var(--rot)}.badge-gruppe{display:flex;gap:6px;flex-shrink:0}.reading-ausgeschlossen{opacity:.6}.datenqualitaet-liste{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.datenqualitaet-eintrag{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--text-dim);background:var(--alt-flaeche);border-radius:10px;padding:8px 10px}.reading-wert{font-size:18px;font-weight:600;margin:4px 0;color:var(--text)}.reading-meta{font-size:13px;color:var(--text-dim)}.korrektur{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}.korrektur input{flex:1;min-width:100px;min-height:44px;padding:8px 10px;border-radius:10px;border:1px solid var(--trennlinie);background:var(--karte);color:var(--text);font-size:16px}.korrektur button{padding:8px 16px;min-height:44px;border-radius:10px;border:none;background:var(--akzent);color:var(--akzent-text);font-weight:600}.chart-reihe{display:flex;flex-direction:column;gap:20px}.chart-box h3{margin:0 0 8px;font-size:16px;font-weight:600;color:var(--text)}.chart-svg{width:100%;height:100px;background:var(--alt-flaeche);border-radius:10px}.chart-info{font-size:13px;color:var(--text-dim);margin:6px 0 0}.chart-svg-gross{height:180px}.legende{display:flex;flex-wrap:wrap;gap:16px;margin-top:10px;font-size:13px;color:var(--text-dim)}.legende span{display:inline-flex;align-items:center;gap:6px}.legende-zeichen{display:inline-block;width:14px;height:14px;border-radius:3px;flex-shrink:0}.legende-flaeche{background:var(--akzent);opacity:.55}.legende-linie{height:3px;border-radius:2px;background:var(--bernstein)}.kosten-gesamt{font-size:28px;font-weight:700;margin:0 0 10px;color:var(--text)}.kosten-perioden{display:flex;flex-direction:column;gap:8px}.kosten-periode{display:flex;flex-direction:column;gap:2px;padding:10px;border-radius:10px;background:var(--alt-flaeche);font-size:14px}.kosten-periode span:first-child{color:var(--text-dim);font-size:13px}.kosten-fussnote{margin-top:14px;font-size:13px}.tarif-toggle{width:100%;margin-bottom:24px}.tarif-liste{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.tarif-eintrag{display:flex;flex-direction:column;gap:2px;padding:12px;border-radius:10px;background:var(--alt-flaeche);font-size:14px}.tarif-eintrag span{color:var(--text-dim);font-size:13px}.tarif-neu-titel{font-size:16px;font-weight:600;margin:8px 0;color:var(--text)}.tarif-formular{display:flex;flex-direction:column;gap:12px}.tarif-formular label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:500;color:var(--text-dim)}.tarif-formular input,.tarif-formular select{padding:12px;min-height:48px;border-radius:12px;border:1px solid var(--trennlinie);background:var(--karte);color:var(--text);font-size:16px;width:100%}.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;background:var(--karte);border-top:1px solid var(--trennlinie);padding:6px 4px calc(6px + env(safe-area-inset-bottom));z-index:10}.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;border-radius:10px;color:var(--text-dim);font-size:12px;padding:6px 0}.nav-item.aktiv{color:var(--akzent);background:var(--akzent-schwach);font-weight:600}.nav-icon{font-size:1.3rem;line-height:1}.zuhause{display:flex;flex-direction:column;gap:16px}.zuhause-karte{background:var(--karte);border:1px solid var(--trennlinie);border-radius:16px;padding:20px}.zuhause-highlight{display:flex;align-items:center;gap:12px;margin-bottom:16px}.zuhause-icon{font-size:1.6rem}.zuhause-highlight strong{font-size:22px;font-weight:700;color:var(--text)}.abweichung{font-size:14px;display:block}.abweichung.hoch{color:var(--rot)}.abweichung.niedrig{color:var(--gruen)}.zuhause-stats{display:flex;gap:12px;margin-bottom:12px}.zuhause-stat{flex:1;display:flex;flex-direction:column;gap:2px;padding:12px;border-radius:12px;background:var(--alt-flaeche)}.zuhause-stat strong{font-size:20px;font-weight:700;color:var(--text)}.vorjahres-vergleich{margin-top:10px;padding-top:12px;border-top:1px solid var(--trennlinie)}.fortschrittsbalken{width:100%;height:10px;border-radius:999px;background:var(--alt-flaeche);overflow:hidden;margin:8px 0}.fortschrittsbalken-fuellung{height:100%;background:var(--akzent);border-radius:999px}.detail-toggle{width:100%;margin-top:12px}.bdew-tabelle{margin-top:12px;overflow-x:auto}.bdew-tabelle table{width:100%;border-collapse:collapse;font-size:13px}.bdew-tabelle th,.bdew-tabelle td{padding:8px 10px;text-align:right;border-bottom:1px solid var(--trennlinie);white-space:nowrap}.bdew-tabelle th:first-child,.bdew-tabelle td:first-child{text-align:left}.bdew-eigene-zeile td{background:var(--akzent-schwach);font-weight:700;color:var(--text)}.bdew-eigene-zeile td:first-child{border-left:4px solid var(--akzent);padding-left:8px}.aktivitaet-vorschlaege{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}.chip{padding:8px 14px;min-height:36px;border-radius:999px;border:1px solid var(--trennlinie);background:var(--karte);color:var(--text);font-size:13px}.aktivitaet-name-input{width:100%;padding:12px;min-height:48px;border-radius:12px;border:1px solid var(--trennlinie);background:var(--karte);color:var(--text);font-size:16px;margin-bottom:12px}.aktivitaet-laufend{padding:12px;border-radius:12px;background:var(--akzent-schwach);border:1px solid var(--akzent)}.aktivitaet-liste{display:flex;flex-direction:column;gap:8px}.aktivitaet-eintrag{display:flex;flex-direction:column;gap:2px;padding:12px;border-radius:12px;background:var(--alt-flaeche);border:1px solid var(--trennlinie);font-size:14px}.aktivitaet-unplausibel{border:1px solid var(--rot);background:var(--rot-schwach)}.korrektur-toggle{margin-top:10px;width:100%}.aktivitaet-korrektur{display:flex;flex-direction:column;gap:14px;margin-top:12px;padding-top:12px;border-top:1px solid var(--trennlinie)}.aktivitaet-korrektur-feld{display:flex;flex-direction:column;gap:8px}.aktivitaet-korrektur-feld label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:500;color:var(--text-dim)}.aktivitaet-korrektur-feld input{padding:10px;min-height:44px;border-radius:10px;border:1px solid var(--trennlinie);background:var(--karte);color:var(--text);font-size:16px}.aktivitaet-korrektur-feld button{padding:10px;min-height:44px;border-radius:10px;border:none;background:var(--akzent);color:var(--akzent-text);font-weight:600}.aktivitaet-bild{width:100%;max-width:200px;border-radius:10px;border:1px solid var(--trennlinie)}.reading-aktionen{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center}.btn-text-gefahr{color:var(--rot)}.loeschen-bestaetigung{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--text-dim)}.dq-kennzahlen-reihe{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:16px}.dq-kennzahlen-block{flex:1;min-width:220px;background:var(--alt-flaeche);border-radius:14px;padding:12px 14px}.dq-kennzahlen-block h3{margin:0 0 8px;font-size:15px;font-weight:600}.dq-kennzahlen-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.dq-kennzahl{display:flex;flex-direction:column;align-items:center;text-align:center}.dq-kennzahl strong{font-size:20px;font-weight:700}.dq-kennzahl span{font-size:11px;color:var(--text-dim)}.jahresvergleich-block{margin-bottom:24px}.jahresvergleich-block h3{margin:0 0 10px;font-size:16px;font-weight:600}.jahresvergleich-labels{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--text-dim);margin-top:6px}.dq-kennzahlen-grid-2{grid-template-columns:repeat(2,1fr)}.hinweis-abstand{margin-top:8px}.abwesenheit-banner{background:var(--bernstein-schwach);color:var(--bernstein);border-radius:10px;padding:10px 14px;margin:0 0 16px}.datenqualitaet-liste-abstand{margin-top:12px}.uebersicht-untertitel{font-size:15px;margin:16px 0 8px}.letzte-ablesungen-tabelle{display:flex;flex-direction:column;gap:6px}.letzte-ablesungen-zeile{display:flex;justify-content:space-between;gap:8px;font-size:14px;padding:6px 10px;background:var(--alt-flaeche);border-radius:10px}.chart-untertitel{font-size:13px;font-weight:600;color:var(--text-dim);margin:12px 0 6px}.verbrauch-kopfzeile{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}.segmented-klein{margin-bottom:0;width:auto}.segmented-klein .segment{flex:none;padding:6px 12px;min-height:32px;font-size:13px}.legende-tageswert{background:var(--trennlinie)}.verbrauch-tabelle{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}.verbrauch-tabelle th,.verbrauch-tabelle td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--trennlinie)}.preiseffekt-liste{display:flex;flex-direction:column;gap:8px}.preiseffekt-zeile{display:grid;grid-template-columns:1fr 2fr auto;align-items:center;gap:10px;font-size:13px}.preiseffekt-label{color:var(--text-dim)}.preiseffekt-balken-spur{background:var(--alt-flaeche);border-radius:6px;overflow:hidden;height:14px}.preiseffekt-balken{height:100%;border-radius:6px}.preiseffekt-wert{font-weight:600;text-align:right;white-space:nowrap}.kosten-medium-balken{margin-bottom:16px}.kosten-medium-segment{display:inline-block;height:16px;vertical-align:middle}.kosten-medium-balken>.kosten-medium-segment:first-child{border-radius:8px 0 0 8px}.kosten-medium-balken>.kosten-medium-segment:last-child{border-radius:0 8px 8px 0}.horizontale-balken-liste{display:flex;flex-direction:column;gap:8px}.horizontale-balken-zeile{display:grid;grid-template-columns:minmax(80px,1fr) 2fr auto;align-items:center;gap:10px;font-size:13px}.horizontale-balken-label{color:var(--text-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hochrechnung-box{background:var(--alt-flaeche);border-radius:14px;padding:14px}.hochrechnung-eingaben{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:10px}.hochrechnung-eingaben label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:500;color:var(--text-dim);flex:1;min-width:140px}.hochrechnung-eingaben input,.hochrechnung-eingaben select{padding:10px;min-height:44px;border-radius:10px;border:1px solid var(--trennlinie);background:var(--karte);color:var(--text);font-size:16px}.manuell-eingabe-label{font-size:13px;font-weight:500;color:var(--text-dim);margin:4px 0}
