:root{--akzent: #0d9488;--akzent-dunkel: #0f766e;--akzent-hell: #ccfbf1;--tinte: #1f2937;--tinte-leise: #6b7280;--linie: #e5e7eb;--flaeche: #ffffff;--grund: #f8fafc;--gruen: #16a34a;--gruen-hell: #dcfce7;--grau-hell: #f3f4f6;--rot: #dc2626;--rot-hell: #fee2e2;--gelb-hell: #fef9c3;--gelb-tinte: #854d0e;--radius: 16px;--schatten: 0 1px 3px rgba(15, 23, 42, .08), 0 4px 12px rgba(15, 23, 42, .05);--nav-hoehe: 64px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:var(--grund);color:var(--tinte);font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased}.app{max-width:480px;margin:0 auto;min-height:100dvh;background:var(--grund);display:flex;flex-direction:column}.kopf{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 10px}.logo{font-size:22px;font-weight:800;letter-spacing:-.02em;color:var(--akzent-dunkel)}.sprachen{display:flex;gap:4px;background:var(--grau-hell);border-radius:999px;padding:3px}.sprach-knopf{border:none;background:transparent;font:inherit;font-size:12px;font-weight:700;color:var(--tinte-leise);padding:6px 10px;min-height:32px;border-radius:999px;cursor:pointer}.sprach-knopf.aktiv{background:var(--flaeche);color:var(--akzent-dunkel);box-shadow:0 1px 2px #0f172a1f}.inhalt{flex:1;padding-bottom:calc(var(--nav-hoehe) + 20px)}.seite{padding:4px 16px 16px;display:flex;flex-direction:column;gap:14px}.seiten-titel{font-size:20px;font-weight:800;margin:4px 0 0}.abschnitt-titel{font-size:17px;font-weight:700;margin:6px 0 0}.karte{background:var(--flaeche);border-radius:var(--radius);box-shadow:var(--schatten);padding:16px}.karten-titel{font-size:16px;font-weight:700;margin:0 0 10px}.leise-text{color:var(--tinte-leise)}.klein{font-size:13px}.versteckt{display:none}.meldung{margin:0;padding:12px 14px;border-radius:12px;background:var(--grau-hell)}.meldung.fehler{background:var(--rot-hell);color:var(--rot)}.meldung.erfolg{background:var(--gruen-hell);color:var(--gruen);font-weight:600}.warnung-dezent{margin:8px 0 0;padding:8px 12px;border-radius:10px;background:var(--gelb-hell);color:var(--gelb-tinte);font-size:14px}.knopf{font:inherit;font-weight:600;border:none;border-radius:12px;min-height:44px;padding:10px 16px;cursor:pointer;transition:filter .12s ease}.knopf:disabled{opacity:.55;cursor:default}.knopf:not(:disabled):active{filter:brightness(.94)}.knopf.primaer{background:var(--akzent);color:#fff}.knopf.sekundaer{background:var(--akzent-hell);color:var(--akzent-dunkel)}.knopf.leise{background:var(--grau-hell);color:var(--tinte-leise)}.knopf.voll{width:100%}.knopf.gross{min-height:52px;font-size:17px}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;height:var(--nav-hoehe);display:flex;background:var(--flaeche);border-top:1px solid var(--linie);padding-bottom:env(safe-area-inset-bottom);z-index:10}.nav-knopf{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:none;background:none;font:inherit;font-size:11px;font-weight:600;color:var(--tinte-leise);cursor:pointer;min-height:44px}.nav-knopf.aktiv{color:var(--akzent-dunkel)}.suchleiste{position:relative}.such-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--tinte-leise);display:flex}.suchleiste input{width:100%;font:inherit;min-height:48px;padding:10px 14px 10px 44px;border:1px solid var(--linie);border-radius:14px;background:var(--flaeche);box-shadow:var(--schatten);outline:none}.suchleiste input:focus{border-color:var(--akzent)}.ort-filter{display:flex;gap:8px}.ort-filter select{flex:1;min-width:0;font:inherit;font-size:14px;min-height:44px;padding:8px 10px;border:1px solid var(--linie);border-radius:12px;background:var(--flaeche);color:var(--tinte)}.ort-filter select:disabled{color:var(--tinte-leise);background:var(--grau-hell)}.start-bereich{display:flex;flex-direction:column;gap:14px}.stat-kacheln{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stat-kachel{background:var(--flaeche);border-radius:var(--radius);box-shadow:var(--schatten);padding:14px 8px;display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center}.stat-kachel strong{font-size:20px;color:var(--akzent-dunkel)}.stat-kachel span{font-size:12px;color:var(--tinte-leise)}.hinweis-karte h2{font-size:17px;margin:0 0 6px}.hinweis-karte p{margin:0;color:var(--tinte-leise)}.ergebnis-liste{display:flex;flex-direction:column;gap:12px}.produkt-kopf{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.produkt-name{font-size:16px;font-weight:700;margin:0}.produkt-kopf .leise-text{margin:2px 0 0;font-size:13px}.guenstigster{text-align:right;flex-shrink:0}.guenstigster strong{display:block;font-size:20px;color:var(--akzent-dunkel)}.guenstigster span{font-size:11px;color:var(--tinte-leise)}.preis-zeilen{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column}.preis-zeile{padding:10px 0;border-top:1px solid var(--linie)}.preis-zeile.frische-veraltet{opacity:.6}.preis-zeile-haupt{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.preis-zeile-ort{display:flex;flex-direction:column}.ketten-name{font-weight:700}.preis-zeile-ort .leise-text{font-size:13px}.preis-zeile-preis{text-align:right;flex-shrink:0;display:flex;flex-direction:column}.preis-zeile-preis strong{font-size:17px}.preis-zeile-preis .leise-text{font-size:12px}.preis-zeile-badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.preis-zeile .warnung-dezent{margin-top:6px}.preis-zeile .leise-text.klein{margin:6px 0 0}.badge{display:inline-flex;align-items:center;font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;white-space:nowrap}.badge-frisch{background:var(--gruen-hell);color:var(--gruen)}.badge-aelter,.badge-veraltet{background:var(--grau-hell);color:var(--tinte-leise)}.badge-aktion{background:var(--akzent-hell);color:var(--akzent-dunkel)}.badge-neutral{background:var(--grau-hell);color:var(--tinte-leise)}.status-fertig{background:var(--gruen-hell);color:var(--gruen)}.status-fehler{background:var(--rot-hell);color:var(--rot)}.status-neu,.status-in_bearbeitung{background:var(--grau-hell);color:var(--tinte-leise)}.foto-knopf{width:100%;min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;font:inherit;font-size:16px;font-weight:600;color:var(--akzent-dunkel);background:var(--flaeche);border:2px dashed var(--akzent);border-radius:var(--radius);cursor:pointer}.foto-knopf:active{background:var(--akzent-hell)}.vorschau-bereich{display:flex;flex-direction:column;gap:10px}.vorschau-bild{width:100%;max-height:45vh;object-fit:contain;border-radius:var(--radius);background:var(--flaeche);box-shadow:var(--schatten)}.bon-detail{display:flex;flex-direction:column;gap:12px}.lese-zustand{display:flex;flex-direction:column;align-items:center;gap:12px;padding:28px 16px;text-align:center;color:var(--tinte-leise)}.lese-zustand p{margin:0;font-weight:600}.spinner{width:34px;height:34px;border-radius:50%;border:4px solid var(--akzent-hell);border-top-color:var(--akzent);animation:drehen .9s linear infinite}@keyframes drehen{to{transform:rotate(360deg)}}.fehler-karte{background:var(--rot-hell)}.fehler-karte p{margin:0;color:var(--rot);font-weight:600}.bon-fakten{margin:0;display:flex;flex-direction:column;gap:6px}.bon-fakten div{display:flex;justify-content:space-between;gap:12px}.bon-fakten dt{color:var(--tinte-leise);font-size:14px}.bon-fakten dd{margin:0;font-weight:600;text-align:right}.bon-summe{font-size:18px;color:var(--akzent-dunkel)}.bon-positionen{margin:10px 0 0;font-size:14px;color:var(--tinte-leise)}.hinweis-badge{margin:8px 0 0;padding:8px 12px;border-radius:10px;background:var(--akzent-hell);color:var(--akzent-dunkel);font-size:14px;font-weight:600}.review-bereich,.review-karte{display:flex;flex-direction:column;gap:10px}.review-text{margin:0;font-weight:700;font-family:ui-monospace,Cascadia Mono,Consolas,monospace;font-size:14px}.review-meta{margin:-6px 0 0;color:var(--tinte-leise);font-size:14px}.review-aktionen{display:flex;flex-direction:column;gap:8px}.review-formular{display:flex;flex-direction:column;gap:10px}.review-formular label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:600;color:var(--tinte-leise);flex:1}.review-formular input{font:inherit;min-height:44px;padding:8px 12px;border:1px solid var(--linie);border-radius:10px;outline:none}.review-formular input:focus{border-color:var(--akzent)}.feld-reihe{display:flex;gap:8px}.bon-liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.bon-listen-eintrag{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;font:inherit;text-align:left;background:var(--flaeche);border:none;border-radius:var(--radius);box-shadow:var(--schatten);padding:14px 16px;min-height:60px;cursor:pointer}.bon-listen-eintrag:active{filter:brightness(.97)}.bon-listen-links{display:flex;flex-direction:column;gap:2px}.bon-listen-kette{font-weight:700}.bon-listen-links .leise-text{font-size:13px}.bon-listen-rechts{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.bon-listen-summe{font-weight:700;color:var(--akzent-dunkel)}@media (min-width: 768px){body{font-size:17px}.app{max-width:1080px}.kopf{padding:20px 32px 12px}.logo{font-size:28px}.seite{padding:8px 32px 32px;gap:18px}.suchleiste input{font-size:18px}.stat-kachel strong{font-size:28px}.stat-kachel span{font-size:14px}.ergebnis-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(440px,1fr));gap:16px;align-items:start}.produkt-name{font-size:21px}.produkt-kopf .leise-text{font-size:15px}.guenstigster strong{font-size:28px}.guenstigster span{font-size:13px}.ketten-name{font-size:18px}.preis-zeile{padding:12px 0}.preis-zeile-preis strong{font-size:21px}.preis-zeile-ort .leise-text,.preis-zeile-preis .leise-text{font-size:14px}.badge{font-size:12px}.bon-liste,.review-liste{max-width:720px}}.duplikat-banner{margin-top:12px;padding:12px 14px;border-radius:12px;background:#fef3c7;border:1px solid #f59e0b;color:#78350f}.duplikat-banner strong{display:block;margin-bottom:4px}.duplikat-banner p{margin:0;font-size:14px}.badge-duplikat{background:#fef3c7;color:#92400e;border:1px solid #f59e0b}.positionen-bereich{padding:6px 16px}.positionen-umschalter{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;border:none;background:none;font:inherit;font-size:14px;font-weight:600;color:var(--akzent-dunkel);padding:10px 0;min-height:44px;cursor:pointer;text-align:left}.positionen-pfeil{display:inline-flex;transition:transform .15s ease;color:var(--tinte-leise)}.positionen-pfeil.offen{transform:rotate(180deg)}.positionen-liste{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-direction:column}.position-zeile{padding:8px 0;border-top:1px solid var(--linie)}.position-haupt{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.position-text{font-family:ui-monospace,Cascadia Mono,Consolas,monospace;font-size:13px;overflow-wrap:anywhere}.position-preis{font-weight:600;white-space:nowrap}.position-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:3px}.badge-pos-auto{background:var(--gruen-hell);color:var(--gruen)}.badge-pos-auto-neu{background:var(--akzent-hell);color:var(--akzent-dunkel)}.badge-pos-review{background:var(--gelb-hell);color:var(--gelb-tinte)}.badge-pos-pfand{background:var(--grau-hell);color:var(--tinte-leise)}.verlauf-bereich{margin-top:10px;border-top:1px solid var(--linie)}.verlauf-knopf{display:inline-flex;align-items:center;gap:6px;border:none;background:none;font:inherit;font-size:13px;font-weight:600;color:var(--akzent-dunkel);padding:10px 0 4px;min-height:40px;cursor:pointer}.verlauf-inhalt{padding:4px 0 2px}.verlauf-inhalt p{margin:0 0 6px}.verlauf-diagramm{margin:0}.verlauf-zeichnung{position:relative}.verlauf-diagramm svg{display:block;width:100%;height:auto;overflow:visible}.verlauf-gitter{stroke:var(--linie);stroke-width:1;vector-effect:non-scaling-stroke}.verlauf-y-achse{position:absolute;top:0;left:0;bottom:0;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}.verlauf-y-achse span{font-size:11px;color:var(--tinte-leise);background:#ffffffbf;border-radius:6px;padding:0 4px}.verlauf-legende{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px}.verlauf-legende-eintrag{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--tinte-leise)}.verlauf-punkt{width:10px;height:10px;border-radius:50%;flex-shrink:0}.verlauf-diagramm .leise-text.klein{margin:8px 0 0}@media (min-width: 768px){.positionen-umschalter,.verlauf-knopf{font-size:15px}.position-text{font-size:14px}.verlauf-diagramm svg{max-height:280px;min-height:200px;height:220px}.verlauf-legende-eintrag{font-size:13px}.verlauf-y-achse span{font-size:12px}}.meldung.info{background:#e0f2f1;border:1px solid #0d9488;color:#0f766e;border-radius:12px;padding:10px 14px}.standort-karte{border:1px solid #f59e0b}.standort-formular{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;align-items:flex-end}.standort-formular label{display:flex;flex-direction:column;gap:4px;flex:1 1 140px;font-size:13px;color:var(--tinte-leise)}.standort-formular input{border:1px solid var(--linie);border-radius:10px;padding:10px 12px;font:inherit;min-height:44px}.monats-balken{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}.monats-balken li{display:grid;grid-template-columns:58px 1fr auto;align-items:center;gap:10px}.monats-label{font-size:13px;color:var(--tinte-leise)}.monats-spur{background:var(--grau-hell);border-radius:999px;height:14px;overflow:hidden}.monats-fuellung{display:block;height:100%;background:#0d9488;border-radius:999px}.monats-wert{font-size:13px;font-weight:700;white-space:nowrap}.ausgaben-produkte{list-style:none;margin:10px 0 0;padding:0}.ausgaben-produkt{padding:10px 0;border-top:1px solid var(--linie)}.ausgaben-produkt-kopf{display:flex;justify-content:space-between;align-items:center;gap:10px}.ausgaben-produkt-name{font-weight:700}.badge-teurer{background:#fee2e2;color:#991b1b}.badge-billiger{background:#dcfce7;color:#166534}.korb-karte{border:1px solid #0d9488}.korb-liste{list-style:none;margin:10px 0 0;padding:0}.korb-liste li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 0;border-top:1px solid var(--linie)}.korb-entfernen{border:none;background:var(--grau-hell);border-radius:999px;width:28px;height:28px;cursor:pointer;color:var(--tinte-leise)}.korb-aktionen{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}.korb-vergleich{margin-top:12px;display:flex;flex-direction:column;gap:8px}.korb-kette{border:1px solid var(--linie);border-radius:10px;padding:10px 12px}.korb-kette.beste{border-color:#0d9488;background:#f0fdfa}.korb-kette-kopf{display:flex;justify-content:space-between;align-items:baseline;gap:10px}.korb-knopf{margin-top:10px;border:1px solid #0d9488;background:transparent;color:#0f766e;border-radius:999px;padding:8px 14px;min-height:40px;font:inherit;font-weight:600;cursor:pointer}.korb-knopf.im-korb{background:#0d9488;color:#fff}.badge-fragen{background:#fef3c7;color:#92400e;border:1px solid #f59e0b;font-weight:700}.offene-fragen-hinweis{background:#fef3c7;border:1px solid #f59e0b;color:#78350f;border-radius:12px;padding:10px 14px;margin-top:8px}
