/* Bewusst schmal gehalten: die Oberflaeche soll lesbar sein, nicht huebsch. Systemschriften, keine
   externen Dateien (die CSP laesst ohnehin nur eigene Quellen zu). */
:root{
  --grund:#f6f7f9; --karte:#fff; --linie:#dfe3e8; --text:#1d2733; --leise:#6b7785;
  --marine:#12355b; --gold:#b8860b; --rot:#b3261e; --gruen:#1e7a46; --warn-bg:#fdf3d7;
}
*{box-sizing:border-box}
body{margin:0;background:var(--grund);color:var(--text);font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.kopf{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 18px;background:var(--marine);color:#fff}
.marke{font-weight:700;letter-spacing:.2px}
.verein{font-weight:400;opacity:.75;margin-left:6px}
.stand{font-size:13px;opacity:.85}
.reiter{display:flex;gap:2px;padding:0 12px;background:var(--marine)}
.reiter button{border:0;background:transparent;color:#fff;opacity:.7;padding:9px 14px;cursor:pointer;
  font:inherit;font-size:14px;border-bottom:3px solid transparent}
.reiter button[aria-selected="true"]{opacity:1;border-bottom-color:var(--gold);font-weight:600}
.inhalt{padding:18px;max-width:1100px;margin:0 auto}
.hinweis{background:var(--karte);border:1px solid var(--linie);border-left:4px solid var(--marine);
  padding:10px 14px;border-radius:6px;margin-bottom:14px;font-size:14px}
.karte{background:var(--karte);border:1px solid var(--linie);border-radius:8px;overflow:hidden}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--linie);vertical-align:top}
th{background:#eef1f5;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--leise)}
tr:last-child td{border-bottom:0}
.zahlen{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.zahl{background:var(--karte);border:1px solid var(--linie);border-radius:8px;padding:8px 14px;min-width:104px}
.zahl b{display:block;font-size:22px;line-height:1.2}
.zahl span{font-size:12px;color:var(--leise)}
.stufen{display:flex;gap:4px;flex-wrap:wrap}
.stufen button{border:1px solid var(--linie);background:#fff;border-radius:99px;padding:3px 10px;
  font:inherit;font-size:12.5px;cursor:pointer;color:var(--leise)}
.stufen button[aria-pressed="true"]{font-weight:700;color:#fff;border-color:transparent}
.stufen button[data-s="nogo"][aria-pressed="true"]{background:var(--rot)}
.stufen button[data-s="notfalls"][aria-pressed="true"]{background:var(--gold)}
.stufen button[data-s="nicht_optimal"][aria-pressed="true"]{background:var(--marine)}
.stufen button[data-s="ok"][aria-pressed="true"]{background:var(--gruen)}
.leise{color:var(--leise);font-size:13px}
.werkzeug{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
input[type=search]{border:1px solid var(--linie);border-radius:6px;padding:6px 10px;font:inherit;min-width:200px}
.paar{font-weight:600;font-variant-numeric:tabular-nums}
.offen td{background:var(--warn-bg)}
.senden{background:var(--marine);color:#fff;border:0;border-radius:6px;padding:8px 16px;font:inherit;font-weight:600;cursor:pointer}
.senden:hover{background:#0d2743}
select{border:1px solid var(--linie);border-radius:6px;padding:4px 8px;font:inherit}
input[type=text]{border:1px solid var(--linie);border-radius:6px;padding:6px 10px;font:inherit}
.kopieren{border:1px solid var(--linie);background:#fff;border-radius:6px;padding:3px 9px;font:inherit;font-size:12.5px;cursor:pointer}