:root{--farbe: #1F4E79;--farbe-hell: #eaf0f6;--akzent: #2E9E7B;--warnung: #8a5a00;--warnung-grund: #fff6e5;--fehler: #a4262c;--fehler-grund: #fdecea;--text: #1a1d21;--leise: #5c636d;--rand: #c8cdd5;--grund: #ffffff;--flaeche: #f5f7fa}*{box-sizing:border-box}body{margin:0;font:17px/1.55 system-ui,-apple-system,Segoe UI,sans-serif;color:var(--text);background:var(--flaeche)}h1{font-size:1.55rem;margin:0}h2{font-size:1.2rem;margin:0 0 .25rem}.anmeldung{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:1.5rem}.anmeldung form{background:var(--grund);padding:2rem;border-radius:12px;box-shadow:0 2px 20px #00000017;width:100%;max-width:26rem}.anmeldung h1{margin-bottom:1.5rem}.kopf{background:var(--farbe);color:#fff;padding:.9rem 1.5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.kopf h1{font-size:1.15rem;font-weight:600}.kopf .rechts{display:flex;align-items:center;gap:1rem;font-size:.95rem}.gerüst{display:grid;grid-template-columns:15rem 1fr 24rem;gap:1.5rem;padding:1.5rem;align-items:start;max-width:90rem;margin:0 auto}@media(max-width:1200px){.gerüst{grid-template-columns:14rem 1fr}.vorschau{display:none}}@media(max-width:820px){.gerüst{grid-template-columns:1fr}}nav.bereiche{position:sticky;top:1.5rem}nav.bereiche button{display:block;width:100%;text-align:left;padding:.7rem .9rem;border:0;background:transparent;border-radius:8px;font:inherit;cursor:pointer;color:var(--text)}nav.bereiche button:hover{background:var(--farbe-hell)}nav.bereiche button[aria-current=true]{background:var(--farbe);color:#fff;font-weight:600}nav.bereiche button .anzahl{float:right;background:var(--warnung-grund);color:var(--warnung);border-radius:999px;padding:0 .5rem;font-size:.8rem;font-weight:600}.tafel{background:var(--grund);border-radius:12px;padding:1.75rem;box-shadow:0 1px 3px #00000012}.tafel>p.einleitung{color:var(--leise);margin:0 0 1.5rem}.feld{margin-bottom:1.4rem}.feld>label{display:block;font-weight:600;margin-bottom:.3rem}.feld .hinweis{color:var(--leise);font-size:.9rem;margin:.35rem 0 0}.feld .fehler{color:var(--fehler);font-size:.9rem;margin:.35rem 0 0;font-weight:600}input[type=text],input[type=email],input[type=password],input[type=number],select,textarea{width:100%;min-height:46px;padding:.6rem .75rem;border:1px solid var(--rand);border-radius:8px;font:inherit;background:var(--grund);color:var(--text)}textarea{min-height:7rem;resize:vertical}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--farbe);outline-offset:1px;border-color:var(--farbe)}input[aria-invalid=true],textarea[aria-invalid=true]{border-color:var(--fehler)}.schalter{display:flex;align-items:flex-start;gap:.75rem}.schalter input[type=checkbox]{width:1.4rem;height:1.4rem;margin-top:.15rem;flex:0 0 auto}.schalter label{font-weight:600}button.tat{background:var(--farbe);color:#fff;border:0;border-radius:8px;padding:.75rem 1.4rem;font:inherit;font-weight:600;cursor:pointer;min-height:46px}button.tat:hover{filter:brightness(1.1)}button.tat:disabled{opacity:.55;cursor:default}button.leise{background:transparent;color:inherit;border:1px solid currentColor;border-radius:8px;padding:.45rem .9rem;font:inherit;cursor:pointer}.meldung{padding:.9rem 1.1rem;border-radius:8px;margin-bottom:1.25rem}.meldung.fehler{background:var(--fehler-grund);color:var(--fehler);border:1px solid #f5c2bd}.meldung.hinweis{background:var(--warnung-grund);color:var(--warnung);border:1px solid #f0d9a8}.meldung ul{margin:.5rem 0 0;padding-left:1.25rem}.stand{font-size:.9rem;display:inline-flex;align-items:center;gap:.4rem;min-height:1.4rem}.stand.gespeichert{color:var(--akzent)}.stand.laeuft{color:var(--leise)}.stand.fehler{color:var(--fehler);font-weight:600}.vorschau{position:sticky;top:1.5rem}.vorschau h2{font-size:1rem;margin-bottom:.5rem}.vorschau .rahmen{background:var(--grund);border-radius:12px;overflow:hidden;box-shadow:0 1px 3px #00000012}.vorschau .balken{color:#fff;padding:.8rem 1rem;font-weight:600}.vorschau .blasen{padding:1rem;min-height:11rem;background:var(--flaeche)}.vorschau .blase{background:var(--grund);border-radius:14px 14px 14px 4px;padding:.6rem .9rem;margin-bottom:.6rem;white-space:pre-wrap}.vorschau .blase.besucher{background:var(--farbe);color:#fff;border-bottom-left-radius:14px;border-bottom-right-radius:4px;margin-left:2rem}.vorschau .fuss{padding:.5rem 1rem 1rem;font-size:.8rem;color:var(--leise);text-align:center}.vorschau>p{color:var(--leise);font-size:.88rem}.liste{list-style:none;padding:0;margin:0}.liste li{display:flex;gap:.6rem;align-items:flex-start;padding:.5rem 0;border-bottom:1px solid var(--rand)}.liste li:last-child{border-bottom:0}.liste .weg{background:transparent;border:0;color:var(--fehler);cursor:pointer;font:inherit;text-decoration:underline;padding:0;flex:0 0 auto}.fortschritt{display:flex;gap:.4rem;margin-bottom:1rem}.fortschritt span{flex:1;height:6px;border-radius:3px;background:var(--rand)}.fortschritt span.voll{background:var(--farbe)}.schrittzahl{color:var(--leise);font-size:.95rem;margin:0 0 1.25rem;font-weight:600}.schrittleiste{display:flex;gap:.75rem;align-items:center;margin-top:2rem;padding-top:1.25rem;border-top:1px solid var(--rand)}.schrittleiste .tat{margin-left:auto}.meldung.fertig{background:#e9f7f1;color:#1d6b53;border:1px solid #a8dcc8}