:root{
  --bg:#eef1f0; --paper:#fff; --ink:#1b2624; --muted:#5d6b68; --line:#d3dbd9;
  --accent:#16695c; --accent-soft:#dcefeb;
  --rech:#2f5fa8; --rech-bg:#e3ebf8; --mahn:#b23a2a; --mahn-bg:#f9e2de; --ang:#7a4fa3; --ang-bg:#efe6f7;
  --sonst:#5f6463; --sonst-bg:#ebedec; --pruef:#8a5f00; --pruef-bg:#fbf0d4; --ok:#2f7d3a; --ok-bg:#e1f2e3;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#121817; --paper:#1a2220; --ink:#e4ebe9; --muted:#97a6a2; --line:#2e3a37;
  --accent:#4fbfa9; --accent-soft:#1d3a35;
  --rech:#8fb2ec; --rech-bg:#1e2c44; --mahn:#f08d7c; --mahn-bg:#3f2220; --ang:#c6a3ea; --ang-bg:#30243e;
  --sonst:#b0b5b4; --sonst-bg:#2a302f; --pruef:#e8bd55; --pruef-bg:#3a2f14; --ok:#7fd08b; --ok-bg:#1d3522;
  color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 "Segoe UI",system-ui,-apple-system,sans-serif}
a{color:var(--accent)}
h1,h2,h3{margin:0;line-height:1.2} h1{font-size:24px} h2{font-size:18px} h3{font-size:16px}
.wrap{max-width:1120px;margin:0 auto;padding:20px max(16px,env(safe-area-inset-right)) 60px max(16px,env(safe-area-inset-left));display:grid;gap:16px}
.bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;padding:10px max(16px,env(safe-area-inset-left));background:#16695c;color:#fff}
.bar a{color:#fff;text-decoration:none;opacity:.9} .bar a:hover{opacity:1;text-decoration:underline}
.bar .app{font-weight:700;opacity:1} .bar nav{display:flex;gap:14px;flex-wrap:wrap} .sp{flex:1}
.bar form{margin:0} .link{background:none;border:0;color:#fff;font:inherit;cursor:pointer;min-height:40px;opacity:.9}
.meldung{padding:10px 14px;border-radius:8px;border:1px solid var(--line);background:var(--paper)}
.meldung.ok{border-color:var(--ok);background:var(--ok-bg)} .meldung.fehler{border-color:var(--mahn);background:var(--mahn-bg)}
.karte{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px;display:grid;gap:14px;min-width:0}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.tile{border:1px solid var(--line);border-radius:8px;padding:8px 10px;text-decoration:none;color:inherit;background:var(--paper)}
.tile .n{font-size:24px;font-weight:600;font-variant-numeric:tabular-nums} .tile .l{font-size:12px;color:var(--muted)}
.tile.an{outline:2px solid var(--accent)}
.tile.warn{border-color:var(--mahn);background:var(--mahn-bg)} .tile.warn .n{color:var(--mahn)}
.tile.pr{border-color:var(--pruef);background:var(--pruef-bg)} .tile.pr .n{color:var(--pruef)}
.chip{display:inline-block;font-size:12px;font-weight:500;padding:2px 8px;border-radius:999px;white-space:nowrap}
.k-rechnung,.k-gutschrift{background:var(--rech-bg);color:var(--rech)} .k-mahnung{background:var(--mahn-bg);color:var(--mahn)}
.k-angebot,.k-auftrag{background:var(--ang-bg);color:var(--ang)} .k-pruefen{background:var(--pruef-bg);color:var(--pruef)}
.k-lieferschein,.k-kontoauszug,.k-sonstiges{background:var(--sonst-bg);color:var(--sonst)}
.c-ok{background:var(--ok-bg);color:var(--ok)} .c-p{background:var(--pruef-bg);color:var(--pruef)} .c-f{background:var(--mahn-bg);color:var(--mahn)}
.btn{display:inline-flex;align-items:center;justify-content:center;font:inherit;font-size:14px;min-height:48px;padding:0 16px;border-radius:8px;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;text-decoration:none}
.btn.pri{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.btn.klein{min-height:36px;padding:0 10px;font-size:13px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tabs{display:flex;gap:4px;overflow-x:auto;padding-bottom:2px;flex-wrap:wrap}
.tab{font-size:13px;padding:8px 10px;border-radius:6px;border:1px solid var(--line);white-space:nowrap;text-decoration:none;color:inherit;background:var(--paper)}
.tab.an{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);font-weight:600}
.tab small{color:var(--muted);margin-left:4px} .tab.leer{opacity:.5}
.tbl{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
th{text-align:left;font-weight:500;color:var(--muted);font-size:12px;border-bottom:1px solid var(--line);padding:6px 8px}
td{border-bottom:1px solid var(--line);padding:8px;vertical-align:middle}
td.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.mono{font-family:Consolas,ui-monospace,monospace;font-size:13px;overflow-wrap:anywhere}
input[type=checkbox]{width:20px;height:20px;accent-color:var(--accent)}
.field{display:grid;gap:4px} .field label{font-size:12px;color:var(--muted)}
select,input[type=text],input[type=password],input[type=search],textarea{font:inherit;font-size:15px;min-height:44px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink);min-width:0;width:100%}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.note{font-size:13px;color:var(--muted)}
.months{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:6px}
.m{border:1px solid var(--line);border-radius:6px;padding:6px 8px;font-size:12px}
.m b{display:block;font-size:13px} .m.geholt{opacity:.55} .m.neu{border-color:var(--accent);background:var(--accent-soft)}
.split{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:16px}
@media (max-width:760px){.split{grid-template-columns:1fr}}
.vorschau{width:100%;height:75vh;border:1px solid var(--line);border-radius:8px;background:#fff}
img.vorschau{height:auto;object-fit:contain}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:14px;margin:0}
.kv dt{color:var(--muted)} .kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.mailtext{white-space:pre-wrap;font-size:13px;max-height:50vh;overflow:auto;border:1px solid var(--line);border-radius:8px;padding:10px;background:var(--bg)}
.lauf{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:14px}
.unten{position:sticky;bottom:0;background:var(--paper);border-top:1px solid var(--line);padding:10px 0 calc(10px + env(safe-area-inset-bottom))}
.anmelden{max-width:380px;margin:10vh auto 0}
.suchfeld{margin:0;flex:1 1 220px;max-width:420px}
.suchfeld input{width:100%;min-height:38px;border:0;border-radius:8px;padding:0 12px;font:inherit;font-size:14px;background:rgba(255,255,255,.95);color:#1b2624}
.k-eingangsrechnung,.k-rechnung{background:var(--rech-bg);color:var(--rech)}
.k-ausgangsrechnung{background:var(--ok-bg);color:var(--ok)}
mark{background:#ffe08a;color:#1b2624;border-radius:2px;padding:0 1px}
.treffer{display:grid;gap:2px;padding:10px 0;border-bottom:1px solid var(--line)}
.treffer:last-child{border-bottom:0}
.treffer .kopf{display:flex;gap:8px;flex-wrap:wrap;align-items:baseline}
.treffer .stelle{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.hilfe{max-width:72ch} .hilfe h2{margin-top:10px} .hilfe p,.hilfe li{margin:4px 0}
