:root{--bg:#EEF3F6;--s:#fff;--ink:#13222C;--mut:#5A6B77;--ln:#D3DDE3;--ac:#0083B8;--rot:#C62828;--gruen:#2E7D32;--or:#B26A00;--heute:#E3F2FA}
@media (prefers-color-scheme:dark){:root{--bg:#0E161C;--s:#16222A;--ink:#E4EDF2;--mut:#92A3AE;--ln:#2A3A45;--ac:#3BB6E8;--rot:#EF6B6B;--gruen:#5CBF63;--or:#F0A940;--heute:#10303F;color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif}
[hidden]{display:none!important}
button{font:inherit;color:inherit;cursor:pointer;border:1px solid var(--ln);background:var(--s);border-radius:12px;padding:10px 14px}
button:disabled{opacity:.5}
input{font:inherit;color:var(--ink);background:var(--s);border:1px solid var(--ln);border-radius:10px;padding:10px 12px;width:100%}
textarea{font:inherit;color:var(--ink);background:var(--s);border:1px solid var(--ln);border-radius:10px;padding:10px 12px;width:100%;resize:vertical}
label{display:block;font-size:14px;color:var(--mut);margin:10px 0 4px}
label input,label textarea{margin-top:4px}
h1{font-size:24px;margin:0}
.fehler{color:var(--rot);min-height:1.4em}
.gross{width:100%;font-size:19px;font-weight:600;padding:15px;margin-top:10px}
.blau{background:var(--ac);border-color:var(--ac);color:#fff}
.gruen{background:var(--gruen);border-color:var(--gruen);color:#fff}
.rot{background:var(--rot);border-color:var(--rot);color:#fff}
.klein{font-size:15px;padding:8px 12px}

#login{max-width:420px;margin:0 auto;padding:40px 20px}
#login h1{margin-bottom:16px}

#haupt{max-width:560px;margin:0 auto;padding:0 0 150px}
header{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 8px;position:sticky;top:0;background:var(--bg);z-index:2}
.menu{margin:0 16px 8px;padding:12px;background:var(--s);border:1px solid var(--ln);border-radius:12px;display:flex;flex-direction:column;gap:8px}
.menu p{margin:0;color:var(--mut);font-size:14px}
.hinweis{margin:0 16px 8px;padding:10px 12px;border-radius:10px;background:#FFF3E0;color:#7A4A00;font-size:15px}
@media (prefers-color-scheme:dark){.hinweis{background:#3A2A10;color:#F5C77E}}

.tag{margin:14px 16px 4px;font-weight:700;font-size:15px;color:var(--mut)}
.tag.heute{color:var(--ac)}
.termin{display:flex;gap:12px;align-items:flex-start;margin:0 16px 6px;padding:12px 14px;background:var(--s);border:1px solid var(--ln);border-radius:12px;width:calc(100% - 32px);text-align:left}
.termin.heute{background:var(--heute)}
.termin .zeit{min-width:58px;font-weight:700;font-variant-numeric:tabular-nums}
.termin .zeit small{display:block;font-weight:400;color:var(--mut);font-size:13px}
.termin .titel{flex:1;word-break:break-word}
.termin .wer{font-size:12px;color:var(--mut);white-space:nowrap}
.leer{margin:40px 16px;text-align:center;color:var(--mut)}

.unten{position:fixed;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;gap:20px;padding:14px 16px calc(18px + env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--bg) 35%)}
.unten .platz{width:48px}
.rund{width:48px;height:48px;border-radius:50%;padding:0;font-size:20px}
.mik{width:104px;height:104px;border-radius:50%;background:var(--ac);border:none;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.25);padding:0}
.mik #mikIcon{font-size:34px;line-height:1}
.mik #mikText{font-size:14px;margin-top:4px}
.mik.aufnahme{background:var(--rot);animation:puls 1.2s infinite}
.mik.arbeitet{background:var(--mut)}
@keyframes puls{0%{box-shadow:0 0 0 0 rgba(198,40,40,.5)}100%{box-shadow:0 0 0 22px rgba(198,40,40,0)}}

#schleier{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:10}
.blatt{position:fixed;left:0;right:0;bottom:0;max-height:92vh;overflow:auto;background:var(--bg);border-radius:18px 18px 0 0;padding:18px 18px calc(18px + env(safe-area-inset-bottom));z-index:11;max-width:560px;margin:0 auto}
.blatt h2{font-size:20px;margin:0 0 8px}
.blatt .gesagt{font-size:15px;color:var(--mut);margin:0 0 6px}
.blatt .zeile{display:flex;gap:10px}
.blatt .zeile>label{flex:1}
.blatt .wtag{font-weight:600;color:var(--ac);margin-left:6px}
.blatt .warn{color:var(--or);font-size:15px;margin:8px 0 0}
.blatt .knoepfe{display:flex;gap:10px;margin-top:6px}
.blatt .knoepfe button{flex:1}
.schalter{display:flex;align-items:center;gap:10px;margin:12px 0 0;font-size:16px;color:var(--ink)}
.schalter input{width:24px;height:24px}
.kandidat{display:block;width:100%;text-align:left;margin:6px 0;padding:12px 14px}
.kandidat.gewaehlt{border:2px solid var(--rot)}
.kandidat small{display:block;color:var(--mut)}
.detail p{margin:4px 0}
.detail .mut{color:var(--mut);font-size:14px}

.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:150px;background:#13222C;color:#fff;padding:12px 16px;border-radius:12px;z-index:20;display:flex;gap:14px;align-items:center;max-width:92vw}
.toast button{background:transparent;border:1px solid #fff;color:#fff;padding:6px 10px}