:root{--grund:#e7ebf1;--flaeche:#fff;--app:#f3f5f8;--schrift:#16212c;--schrift2:#40505f;--gedaempft:#78889a;--linie:#e3e8ee;--linie2:#eef1f5;--marke:#0f5f68;--marke-dunkel:#0a4750;--marke-sanft:#e0edee;--gruen:#1c7a4c;--gruen-sanft:#e2f1e9;--bernstein:#96620f;--bernstein-sanft:#faeeda;--blau:#2a5fa8;--blau-sanft:#e6edf8;--rot:#a93a33;--rot-sanft:#f9e9e7;--rl:20px;--rm:14px;--rs:10px;--ff:"IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif}*{box-sizing:border-box}html,body{background:var(--grund);color:var(--schrift);font-family:var(--ff);-webkit-font-smoothing:antialiased;margin:0;padding:0;font-size:15px;line-height:1.5}h1{letter-spacing:-.2px;margin:0 0 6px;font-size:24px}h2{margin:0 0 12px;font-size:17px}p{margin:0 0 12px}a{color:var(--marke)}.mitte{max-width:460px;margin:0 auto;padding:48px 20px 64px}.breit{max-width:980px;margin:0 auto;padding:28px 20px 64px}.marke{align-items:center;gap:10px;margin-bottom:24px;display:flex}.marke-zeichen{background:var(--marke);border-radius:8px;flex:none;width:30px;height:30px}.marke-name{letter-spacing:-.2px;font-size:17px;font-weight:600}.blatt{background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--rl);margin-bottom:16px;padding:22px}.kopfzeile{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;display:flex}.hinweis{color:var(--gedaempft);margin:6px 0 0;font-size:13px}label{margin-bottom:14px;display:block}.feldname{color:var(--schrift2);margin-bottom:5px;font-size:13px;font-weight:600;display:block}input,select{border:1px solid var(--linie);border-radius:var(--rs);background:var(--app);width:100%;color:var(--schrift);font-family:var(--ff);padding:11px 12px;font-size:15px}input:focus,select:focus{border-color:var(--marke);background:var(--flaeche);outline:none}.zeile{gap:12px;display:flex}.zeile>label{flex:1}button{border-radius:var(--rs);background:var(--marke);color:#fff;width:100%;font-family:var(--ff);cursor:pointer;border:none;padding:12px 16px;font-size:15px;font-weight:600}button:hover{background:var(--marke-dunkel)}button:disabled{opacity:.6;cursor:default}button.leise{width:auto;color:var(--schrift2);border:1px solid var(--linie);background:0 0;padding:8px 14px;font-weight:500}button.leise:hover{background:var(--app)}.fehler{background:var(--rot-sanft);color:var(--rot);border-radius:var(--rs);margin-bottom:16px;padding:11px 13px;font-size:14px}.gelungen{background:var(--gruen-sanft);color:var(--gruen);border-radius:var(--rs);margin-bottom:16px;padding:11px 13px;font-size:14px}.kacheln{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;display:grid}.kachel{background:var(--app);border-radius:var(--rm);padding:14px 16px}.kachel .wert{letter-spacing:-.5px;font-size:26px;font-weight:600}.kachel .name{color:var(--gedaempft);font-size:13px}.code{font-variant-numeric:tabular-nums;letter-spacing:3px;color:var(--marke);font-size:30px;font-weight:600}.merker{border-radius:999px;padding:3px 9px;font-size:12px;font-weight:600;display:inline-block}.merker.aktiv{background:var(--gruen-sanft);color:var(--gruen)}.merker.gesperrt{background:var(--rot-sanft);color:var(--rot)}.merker.loeschung{background:var(--bernstein-sanft);color:var(--bernstein)}.person{border-top:1px solid var(--linie2);padding:14px 0}.person:first-of-type{border-top:none;padding-top:0}.person-kopf{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.person-name{font-weight:600}.person-merker{flex:none}.merker.blau{background:var(--blau-sanft);color:var(--blau)}.knopfreihe{flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;display:flex}.knopfreihe form{width:auto}.unterformular{background:var(--app);border-radius:var(--rm);margin-top:12px;padding:16px}.tage{flex-wrap:wrap;gap:6px;margin-bottom:4px;display:flex}.tag{border:1px solid var(--linie);border-radius:var(--rs);background:var(--flaeche);cursor:pointer;align-items:center;gap:5px;margin:0;padding:6px 10px;font-size:13px;display:flex}.tag input{width:auto}