:root{color-scheme:light;--bg:#F7F6F3;--weiss:#fff;--tinte:#1D1F24;--grau:#6B6F78;--linie:#E4E1DA;--akzent:#2F4E9E;--gut:#1F7A4D;--warn:#B4541A;--hell:#EEF1F8}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--tinte);font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif}
.kopf{position:sticky;top:0;z-index:5;background:var(--weiss);border-bottom:1px solid var(--linie);padding:12px 20px}
.zeile{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.zeile+.zeile{margin-top:10px}
h1{font-size:18px;margin:0 8px 0 0;letter-spacing:-.2px}
.reiter{display:flex;gap:4px;flex-wrap:wrap}
.reiter button,.chips button{border:1px solid var(--linie);background:var(--weiss);border-radius:8px;padding:6px 12px;font:inherit;cursor:pointer;color:var(--tinte)}
.reiter button.an,.chips button.an{background:var(--tinte);color:#fff;border-color:var(--tinte)}
.chips{display:flex;gap:4px;flex-wrap:wrap}
.filter label{color:var(--grau);display:flex;align-items:center;gap:6px}
input,select{font:inherit;border:1px solid var(--linie);border-radius:8px;padding:5px 8px;background:var(--weiss);color:var(--tinte)}
input[type=search]{min-width:200px}
.schalter input{width:auto}
.rechts{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.knopf{border:1px solid var(--linie);border-radius:8px;padding:6px 10px;text-decoration:none;color:var(--akzent);background:var(--weiss);cursor:pointer}
main{max-width:1280px;margin:0 auto;padding:20px}
.leer{color:var(--grau)}
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.kpi{background:var(--weiss);border:1px solid var(--linie);border-radius:12px;padding:12px 14px}
.kpi b{display:block;font-size:22px;letter-spacing:-.3px}
.kpi span{color:var(--grau);font-size:12.5px}
.kpi.haupt{border-color:var(--akzent)}
h2{font-size:16px;margin:30px 0 4px}
.hinweis{color:var(--grau);margin:0 0 12px;font-size:13px}
.karte{background:var(--weiss);border:1px solid var(--linie);border-radius:12px;padding:14px 16px;margin-bottom:12px;overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{text-align:left;font-weight:600;color:var(--grau);font-size:12px;padding:6px 8px;border-bottom:1px solid var(--linie);white-space:nowrap}
td{padding:7px 8px;border-bottom:1px solid #F0EEE9;vertical-align:top}
tr:last-child td{border-bottom:0}
td.z,th.z{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.balken{position:relative;height:18px;background:#F1EFEA;border-radius:5px;min-width:120px}
.balken i{position:absolute;left:0;top:0;bottom:0;background:var(--akzent);border-radius:5px;opacity:.85}
.balken i.gut{background:var(--gut)}
.balken i.warn{background:var(--warn)}
.balken em{position:absolute;right:6px;top:0;font-style:normal;font-size:11.5px;line-height:18px;color:var(--tinte)}
.raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:12px}
.raster.breit{grid-template-columns:repeat(auto-fill,minmax(540px,1fr))}
.frage td:first-child{min-width:170px}
.frage .balken{min-width:110px}
.frage h3{font-size:14px;margin:0 0 2px}
.frage .klein{color:var(--grau);font-size:12px;margin-bottom:8px}
.marke{display:inline-block;font-size:11px;border-radius:5px;padding:1px 6px;background:var(--hell);color:var(--akzent);margin-left:6px;vertical-align:middle}
.rot{color:var(--warn);font-weight:600}
.saeulen{display:flex;align-items:flex-end;gap:3px;height:110px;padding-top:6px}
.saeulen div{flex:1;background:var(--akzent);border-radius:3px 3px 0 0;min-height:1px;position:relative;opacity:.85}
.saeulen div.zwei{background:#C9CFDF}
.achse{display:flex;gap:3px;font-size:10.5px;color:var(--grau)}
.achse span{flex:1;text-align:center}
details summary{cursor:pointer;color:var(--akzent)}
.antw{display:grid;grid-template-columns:140px 1fr;gap:2px 10px;font-size:12.5px;margin-top:6px}
.antw b{color:var(--grau);font-weight:500}
.fuss{color:var(--grau);font-size:12px;margin:24px 0}
body.login{display:grid;place-items:center;min-height:100vh}
body.login form{background:var(--weiss);border:1px solid var(--linie);border-radius:14px;padding:28px;display:grid;gap:12px;width:300px}
body.login button{background:var(--tinte);color:#fff;border:0;border-radius:8px;padding:9px;font:inherit;cursor:pointer}
.fehler{color:var(--warn);margin:0}
@media (max-width:640px){.kopf{padding:10px 12px}main{padding:12px}.raster,.raster.breit{grid-template-columns:1fr}.frage td:first-child{min-width:120px}.rechts{margin-left:0}}
