:root { --fg:#1b1f23; --grau:#5d6670; --rand:#d5dae0; --bg:#f3f5f7; --akzent:#0b5fff; --ok:#177245; --warn:#b4540a; --fehler:#b3261e; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin:0; font:17px/1.45 -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif; color:var(--fg); background:var(--bg); }
main { max-width:560px; margin:0 auto; padding:16px; }
h1 { font-size:1.6rem; margin:.4em 0 .2em; }
h2 { font-size:1.2rem; margin:1.4em 0 .5em; }
.karte { background:#fff; border:1px solid var(--rand); border-radius:14px; padding:16px; margin:12px 0; }
.kopf { display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; justify-content:space-between; padding:10px 0; }
.kopf nav { display:flex; flex-wrap:wrap; gap:6px 14px; }
a { color:var(--akzent); }
label { display:block; font-weight:600; margin:12px 0 4px; }
input[type=text], input[type=password], input[type=email], input[type=search], select, textarea {
  width:100%; font:inherit; padding:12px; border:1px solid var(--rand); border-radius:10px; background:#fff; }
textarea { min-height:70px; }
button, .knopf { font:inherit; font-weight:600; border:0; border-radius:12px; padding:12px 16px; background:var(--akzent); color:#fff; cursor:pointer; min-height:48px; text-decoration:none; display:inline-block; }
button.gross { display:block; width:100%; min-height:64px; font-size:1.25rem; margin-top:14px; }
button.zweit { background:#e8ecf1; color:var(--fg); }
button.gefahr { background:var(--fehler); }
button:disabled { opacity:.5; cursor:default; }
.zeile { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.liste { list-style:none; margin:0; padding:0; }
.liste li { border-top:1px solid var(--rand); padding:12px 0; }
.liste li:first-child { border-top:0; }
.liste a.eintrag { display:block; color:inherit; text-decoration:none; }
.name { font-weight:600; }
.klein { color:var(--grau); font-size:.9rem; }
.badge { display:inline-block; padding:2px 10px; border-radius:99px; font-size:.85rem; font-weight:600; }
.badge.frei { background:#dff3e7; color:var(--ok); }
.badge.verliehen { background:#fde8d4; color:var(--warn); }
.badge.aus { background:#e8ecf1; color:var(--grau); }
.status { font-size:1.15rem; margin:14px 0 4px; }
.meldung { min-height:1.4em; margin:10px 0 0; }
.meldung.fehler { color:var(--fehler); font-weight:600; }
.meldung.ok { color:var(--ok); font-weight:600; }
.tagurl { font:600 1.15rem/1.3 ui-monospace, Menlo, monospace; word-break:break-all; background:#eef3ff; border:2px solid var(--akzent); border-radius:12px; padding:14px; margin:10px 0; }
.codes { font:1rem/1.8 ui-monospace, Menlo, monospace; columns:2; }
.qr { text-align:center; margin:10px 0; }
.qr svg { width:200px; height:200px; }
table { width:100%; border-collapse:collapse; font-size:.92rem; }
th, td { text-align:left; padding:6px 4px; border-top:1px solid var(--rand); vertical-align:top; }
.tab-scroll { overflow-x:auto; }
[hidden] { display:none !important; }