:root{--grund: #f7f7f5;--flaeche: #ffffff;--rand: #dcdcd6;--text: #1e1e1c;--text-leise: #66665f;--akzent: #2f5d8a;--akzent-hell: #eaf1f8;--gut: #2e6b45;--gut-hell: #e9f3ec;--warnung: #8a5a1e;--warnung-hell: #fbf1e3;--fehler: #9b2c2c;--fehler-hell: #f9ecec;--akzent-rand: #cddef0;--gut-rand: #cfe3d6;--warnung-rand: #e8d5b5;--fehler-rand: #edcaca;--akzent-tief: #26507a;--rand-stark: #c4c4bc;--auf-akzent: #ffffff;--radius: 8px;--schatten: 0 1px 2px rgba(0, 0, 0, .06), 0 3px 8px rgba(0, 0, 0, .04)}@media (prefers-color-scheme: dark){:root{--grund: #131312;--flaeche: #1c1c1a;--rand: #3a3a36;--text: #f2f2ee;--text-leise: #a3a39a;--akzent: #7ea9d6;--akzent-hell: #1b2a38;--gut: #6fc08d;--gut-hell: #16261c;--warnung: #d9a45c;--warnung-hell: #2a2015;--fehler: #e58c8c;--fehler-hell: #2c1a1a;--akzent-rand: #2f4a63;--gut-rand: #2c4a37;--warnung-rand: #4a3a20;--fehler-rand: #4d2e2e;--akzent-tief: #9dbfe3;--rand-stark: #4e4e48;--auf-akzent: #10161c;--schatten: none}}*{box-sizing:border-box}body{margin:0;background:var(--grund);color:var(--text);font:15px/1.55 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}h1,h2,h3{line-height:1.25;margin:0 0 .5rem;font-weight:600}h1{font-size:1.5rem}h2{font-size:1.15rem}h3{font-size:1rem}p{margin:0 0 .75rem}a{color:var(--akzent)}.kopf{background:var(--flaeche);border-bottom:1px solid var(--rand);padding:.7rem 1.25rem;display:flex;align-items:center;gap:1.25rem;position:sticky;top:0;z-index:10}.kopf .marke{font-weight:600;font-size:1.05rem;letter-spacing:.02em}.kopf nav{display:flex;gap:.25rem;flex:1}.kopf nav a{padding:.35rem .7rem;border-radius:var(--radius);text-decoration:none;color:var(--text-leise)}.kopf nav a:hover{background:var(--grund)}.kopf nav a.aktiv{background:var(--akzent-hell);color:var(--akzent);font-weight:500}.kopf .benutzer{color:var(--text-leise);font-size:.88rem}main{max-width:62rem;margin:0 auto;padding:1.5rem 1.25rem 4rem}.karte{background:var(--flaeche);border:1px solid var(--rand);border-radius:var(--radius);padding:1.1rem 1.25rem;margin-bottom:1rem;box-shadow:var(--schatten)}.karte.schmal{max-width:26rem;margin-inline:auto}.karte-kopf{display:flex;align-items:baseline;gap:.75rem;margin-bottom:.75rem}.karte-kopf h2,.karte-kopf h3{margin:0;flex:1}label{display:block;margin-bottom:.85rem}label>span.beschriftung{display:block;font-size:.85rem;color:var(--text-leise);margin-bottom:.25rem;font-weight:500}input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),select,textarea{width:100%;padding:.5rem .6rem;font:inherit;border:1px solid var(--rand);border-radius:var(--radius);background:var(--flaeche);color:var(--text)}input:focus,select:focus,textarea:focus{outline:2px solid var(--akzent);outline-offset:-1px;border-color:var(--akzent)}textarea{min-height:9rem;resize:vertical;font-family:inherit}input[type=file]{font:inherit;width:100%}.zustimmung{display:flex;gap:.6rem;align-items:flex-start;background:var(--warnung-hell);border:1px solid var(--warnung-rand);border-radius:var(--radius);padding:.7rem .8rem;margin-bottom:.9rem}.zustimmung input{margin-top:.2rem;flex:none}.zustimmung span{font-size:.88rem;line-height:1.45}button{font:inherit;padding:.45rem .9rem;border-radius:var(--radius);border:1px solid var(--rand);background:var(--flaeche);color:var(--text);cursor:pointer}button:hover:not(:disabled){background:var(--grund)}button:disabled{opacity:.5;cursor:not-allowed}button.haupt{background:var(--akzent);border-color:var(--akzent);color:var(--auf-akzent);font-weight:500}button.haupt:hover:not(:disabled){background:var(--akzent-tief)}button.leise{border-color:transparent;color:var(--text-leise);padding:.3rem .5rem}button.leise:hover:not(:disabled){background:var(--grund);color:var(--text)}button.gefahr{color:var(--fehler);border-color:transparent}button.gefahr:hover:not(:disabled){background:var(--fehler-hell)}.knopfreihe{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.marke-status{display:inline-block;font-size:.78rem;padding:.1rem .5rem;border-radius:99px;border:1px solid transparent;white-space:nowrap}.st-bereit{background:var(--gut-hell);color:var(--gut);border-color:var(--gut-rand)}.st-arbeit{background:var(--akzent-hell);color:var(--akzent);border-color:var(--akzent-rand)}.st-auswahl{background:var(--warnung-hell);color:var(--warnung);border-color:var(--warnung-rand)}.st-fehler{background:var(--fehler-hell);color:var(--fehler);border-color:var(--fehler-rand)}.meldung{padding:.65rem .8rem;border-radius:var(--radius);margin-bottom:.9rem;border:1px solid transparent;font-size:.92rem}.meldung.fehler{background:var(--fehler-hell);color:var(--fehler);border-color:var(--fehler-rand)}.meldung.warnung{background:var(--warnung-hell);color:var(--warnung);border-color:var(--warnung-rand)}.meldung.gut{background:var(--gut-hell);color:var(--gut);border-color:var(--gut-rand)}.meldung.hinweis{background:var(--warnung-hell);color:var(--warnung);border-color:var(--warnung-rand)}.meldung.ruhig{background:var(--grund);color:var(--text-leise);border-color:var(--rand)}.leiser{color:var(--text-leise);font-size:.88rem}input.zeitmarke{max-width:9rem;font-variant-numeric:tabular-nums}.spanne{display:flex;gap:1rem;flex-wrap:wrap}.spanne>label{min-width:0}.zeile.aufnahme{display:grid;gap:.6rem}.zeile.aufnahme .stimmname{color:var(--akzent);font-weight:600;text-decoration:none}.zeile.aufnahme .stimmname:hover{text-decoration:underline}.zeile.aufnahme .text{margin:0;color:var(--text)}.zeile.aufnahme .hinweise{display:grid;gap:.2rem}.zeile.aufnahme audio{width:100%}@media (max-width: 640px){input,select,textarea{font-size:16px}button,.knopfreihe a>button{min-height:44px}.karte-kopf{flex-wrap:wrap;gap:.4rem}.guete{gap:.5rem 1rem}h1{font-size:1.3rem}}.tempo{margin-bottom:.3rem}.tempo-reihe{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.tempo-reihe input[type=range]{flex:1 1 12rem;min-width:0;accent-color:var(--akzent)}.tempo-reihe b{min-width:8.5rem;font-variant-numeric:tabular-nums}.freiwillig{font-weight:400;color:var(--text-leise)}.leer{color:var(--text-leise);text-align:center;padding:2.5rem 1rem}.liste{display:grid;gap:.75rem}.liste>*{min-width:0}.liste>a{display:block;text-decoration:none;color:inherit}.zeile{display:flex;gap:1rem;align-items:center;min-width:0;padding:.8rem 1rem;background:var(--flaeche);border:1px solid var(--rand);border-radius:var(--radius)}.zeile:hover{border-color:var(--rand-stark)}.zeile .haupttext{flex:1;min-width:0}.zeile .haupttext .titel{font-weight:500}.zeile .haupttext .unter{color:var(--text-leise);font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.guete{display:flex;gap:1.25rem;flex-wrap:wrap;font-size:.85rem}.guete div{color:var(--text-leise)}.guete b{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}.kandidat{border:1px solid var(--rand);border-radius:var(--radius);padding:.8rem .9rem;margin-bottom:.6rem;background:var(--flaeche)}.kandidat.gewaehlt{border-color:var(--akzent);background:var(--akzent-hell)}.kandidat audio{width:100%;margin:.5rem 0}audio{width:100%}.fortschritt{display:flex;align-items:center;gap:.6rem;color:var(--akzent);font-size:.9rem}.dreher{width:14px;height:14px;flex:none;border:2px solid var(--akzent-hell);border-top-color:var(--akzent);border-radius:50%;animation:dreh .8s linear infinite}@keyframes dreh{to{transform:rotate(360deg)}}.abschnitte{display:grid;gap:.4rem;margin-top:.6rem}.abschnitt{display:flex;gap:.6rem;font-size:.88rem;padding:.4rem .6rem;background:var(--grund);border-radius:6px;border:1px solid var(--rand)}.abschnitt .nr{color:var(--text-leise);font-variant-numeric:tabular-nums;flex:none;min-width:1.5rem}@media (max-width: 640px){.kopf{flex-wrap:wrap;gap:.6rem}main{padding:1rem .75rem 3rem}.zeile{flex-wrap:wrap}}.diktat{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;margin:-.4rem 0 .9rem}.diktat .leiser{flex:1 1 14rem;min-width:0}.aufnahme-anzeige{display:flex;align-items:center;gap:.5rem;font-variant-numeric:tabular-nums;color:var(--fehler);font-size:.9rem}.aufnahme-anzeige .punkt{width:9px;height:9px;border-radius:50%;background:var(--fehler);animation:pulsieren 1.2s ease-in-out infinite}@keyframes pulsieren{50%{opacity:.25}}.aufnahme-anzeige .pegel{width:70px;height:6px;border-radius:3px;background:var(--rand);overflow:hidden}.aufnahme-anzeige .pegel>span{display:block;height:100%;background:var(--gut);transition:width .1s linear}.vorlesetext{background:var(--flaeche);border:1px solid var(--rand);border-left:3px solid var(--akzent);border-radius:var(--radius);padding:1rem 1.2rem;margin-bottom:.9rem;max-height:20rem;overflow-y:auto;font-size:1.05rem;line-height:1.85;max-width:42em}.vorlesetext p{margin:0 0 .9rem}.vorlesetext p:last-child{margin-bottom:0}