:root{--vn-tiefblau:#0b4f8a;--vn-blau:#2f78b7;--vn-gruen:#2f8f4e;--vn-hellgruen:#6fbf8e;--vn-gold:#f2b705;--vn-warmgold:#f0a83a;--vn-nachtblau:#083d6e;--vn-grund:#f3f7fb;--vn-flaeche:#fff;--vn-flaeche-2:#e8f0f8;--vn-text:#12263b;--vn-text-leise:#44576a;--vn-linie:#cfdce8;--vn-akzent:#083d6e;--vn-akzent-text:#fff;--vn-link:#1d62a1;--vn-erfolg:#1b6e39;--vn-erfolg-flaeche:#e2f3e7;--vn-fehler:#b3261e;--vn-fehler-flaeche:#fce9e6;--vn-warnung:#7a4d00;--vn-warnung-flaeche:#fff3d1;--vn-note-1:#b3261e;--vn-note-2:#9a6200;--vn-note-3:#1b6e39;--vn-note-4:#1d62a1;--vn-fluss:linear-gradient(115deg, #083d6e 0%, #2f78b7 36%, #6fbf8e 64%, #f2b705 88%, #f0a83a 100%);--vn-grund-fluss:radial-gradient(110% 55% at 0% 0%, #2f78b721, transparent 62%), radial-gradient(80% 45% at 100% 35%, #6fbf8e21, transparent 62%), radial-gradient(90% 50% at 40% 105%, #f2b7051c, transparent 62%);--vn-schatten-1:0 1px 2px #102a4614, 0 2px 6px #102a460f;--vn-schatten-2:0 2px 4px #102a460f, 0 8px 20px #102a461a;--vn-schatten-3:0 4px 10px #102a4612, 0 18px 40px #102a4629;--vn-kante:inset 0 1px 0 #ffffffe6;--vn-sockel:0 3px 0 #c2d2e2;--vn-akzent-sockel:0 3px 0 #052a4c;--vn-mulde:inset 0 1px 3px #102a4624;--vn-rahmen:#1a2533;--vn-radius-s:10px;--vn-radius-m:16px;--vn-radius-l:24px;--vn-radius-rund:999px;--vn-abstand-1:4px;--vn-abstand-2:8px;--vn-abstand-3:12px;--vn-abstand-4:16px;--vn-abstand-5:24px;--vn-abstand-6:32px;--vn-schrift:system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Noto Sans Thai", "Noto Sans Arabic", "Noto Sans Devanagari", sans-serif;--vn-groesse:17px;--vn-zeile:1.5;--vn-zeile-lern:1.7;--vn-dauer-kurz:.16s;--vn-dauer:.28s;--vn-dauer-karte:.48s;--vn-kurve:cubic-bezier(.2, .8, .2, 1);--vn-kurve-feder:cubic-bezier(.34, 1.36, .64, 1)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--vn-grund:#0c1a2a;--vn-flaeche:#15293f;--vn-flaeche-2:#1d354f;--vn-text:#eaf1f8;--vn-text-leise:#aebfd0;--vn-linie:#2e4964;--vn-akzent:#8cc4f2;--vn-akzent-text:#0c1a2a;--vn-link:#8cc4f2;--vn-erfolg:#7fd09c;--vn-erfolg-flaeche:#173a2a;--vn-fehler:#ff9c92;--vn-fehler-flaeche:#3d1f22;--vn-warnung:#f5c451;--vn-warnung-flaeche:#3a3018;--vn-note-1:#ff9c92;--vn-note-2:#f5c451;--vn-note-3:#7fd09c;--vn-note-4:#8cc4f2;--vn-grund-fluss:radial-gradient(110% 55% at 0% 0%, #2f78b738, transparent 62%), radial-gradient(80% 45% at 100% 35%, #6fbf8e1f, transparent 62%), radial-gradient(90% 50% at 40% 105%, #f2b70514, transparent 62%);--vn-schatten-1:0 1px 2px #00000059, 0 2px 6px #00000040;--vn-schatten-2:0 2px 4px #0000004d, 0 8px 20px #00000059;--vn-schatten-3:0 4px 10px #0000004d, 0 18px 40px #00000080;--vn-kante:inset 0 1px 0 #ffffff12;--vn-sockel:0 3px 0 #091522;--vn-akzent-sockel:0 3px 0 #4a86ba;--vn-mulde:inset 0 1px 3px #00000080;--vn-rahmen:#34475c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--vn-grund:#0c1a2a;--vn-flaeche:#15293f;--vn-flaeche-2:#1d354f;--vn-text:#eaf1f8;--vn-text-leise:#aebfd0;--vn-linie:#2e4964;--vn-akzent:#8cc4f2;--vn-akzent-text:#0c1a2a;--vn-link:#8cc4f2;--vn-erfolg:#7fd09c;--vn-erfolg-flaeche:#173a2a;--vn-fehler:#ff9c92;--vn-fehler-flaeche:#3d1f22;--vn-warnung:#f5c451;--vn-warnung-flaeche:#3a3018;--vn-note-1:#ff9c92;--vn-note-2:#f5c451;--vn-note-3:#7fd09c;--vn-note-4:#8cc4f2;--vn-grund-fluss:radial-gradient(110% 55% at 0% 0%, #2f78b738, transparent 62%), radial-gradient(80% 45% at 100% 35%, #6fbf8e1f, transparent 62%), radial-gradient(90% 50% at 40% 105%, #f2b70514, transparent 62%);--vn-schatten-1:0 1px 2px #00000059, 0 2px 6px #00000040;--vn-schatten-2:0 2px 4px #0000004d, 0 8px 20px #00000059;--vn-schatten-3:0 4px 10px #0000004d, 0 18px 40px #00000080;--vn-kante:inset 0 1px 0 #ffffff12;--vn-sockel:0 3px 0 #091522;--vn-akzent-sockel:0 3px 0 #4a86ba;--vn-mulde:inset 0 1px 3px #00000080;--vn-rahmen:#34475c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root{--bg:var(--vn-flaeche);--flaeche:var(--vn-flaeche-2);--text:var(--vn-text);--leise:var(--vn-text-leise);--linie:var(--vn-linie);--akzent:var(--vn-akzent);--akzent-text:var(--vn-akzent-text);--teal:var(--vn-link);--frage:var(--vn-warnung-flaeche);--frage-rand:#e0b84f}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--frage-rand:#a8873a}}*{box-sizing:border-box}html{background:var(--vn-grund)}body{color:var(--text);font:var(--vn-groesse)/var(--vn-zeile) var(--vn-schrift);margin:0}body:before{content:"";z-index:-1;background:var(--vn-grund-fluss);pointer-events:none;position:fixed;inset:0}.app{flex-direction:column;min-height:100vh;display:flex}header{padding:14px 16px 2px}.marke{align-items:center;gap:9px;margin:0;font-size:1rem;display:flex}.marke .zeichen{width:32px;height:32px;box-shadow:var(--vn-schatten-1);border-radius:9px}.marke .wort{width:auto;height:20px}.marke .wort.dunkel{display:none}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .marke .wort.hell{display:none}:root:not([data-theme=light]) .marke .wort.dunkel{display:inline}}.wrap{flex:1;width:100%;max-width:640px;margin:0 auto;padding:8px 16px 104px}h2{text-wrap:balance;margin:10px 0 6px;font-size:1.35rem;line-height:1.25}h3{text-wrap:balance;margin:22px 0 6px;font-size:1.08rem}.leise{color:var(--leise);font-size:.94rem}button,select,input,textarea,.knopf{font:inherit;color:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid var(--vn-blau);outline-offset:2px}.haupt,.zweit,.knopf{text-align:center;text-wrap:balance;transition:transform var(--vn-dauer-kurz) var(--vn-kurve);border:0;border-radius:14px;padding:12px 16px;font-weight:650;display:inline-block}.haupt{background:var(--akzent);color:var(--akzent-text);box-shadow:var(--vn-akzent-sockel), var(--vn-schatten-1)}.zweit,.knopf{background:var(--vn-flaeche);border:1px solid var(--linie);box-shadow:var(--vn-sockel)}.haupt:active,.zweit:active,.knopf:active{box-shadow:none;transform:translateY(3px)}button:disabled{opacity:.45;transform:none}.breit{width:100%;margin-top:10px}.mini{background:var(--vn-flaeche);border:1px solid var(--linie);box-shadow:var(--vn-schatten-1);transition:transform var(--vn-dauer-kurz) var(--vn-kurve);border-radius:999px;padding:5px 11px;font-size:.92rem}.mini:active{transform:scale(.96)}.link{color:var(--teal);background:0 0;border:0;padding:0;font-size:.92rem;text-decoration:underline}.gross-knoepfe{grid-template-columns:1fr 1fr;gap:10px;margin:12px 0;display:grid}.gross-knoepfe>*{padding:18px 8px}textarea,input.suche,.feld select,.feld input{border:1px solid var(--linie);background:var(--vn-flaeche);width:100%;box-shadow:var(--vn-mulde);border-radius:12px;padding:11px 12px}.feld{margin:12px 0;font-weight:600;display:block}.feld select,.feld input{margin-top:4px;font-weight:400}.status{font-weight:600}.fehler{color:var(--vn-fehler)}.liste{margin:8px 0;padding:0;list-style:none}.eintrag{border-radius:var(--vn-radius-m);background:var(--vn-flaeche);box-shadow:var(--vn-schatten-1);border:1px solid #0000;gap:10px;margin-bottom:10px;padding:12px 14px;display:flex}.eintrag.aus{opacity:.5}.eintrag.frage{background:var(--frage);border-color:var(--frage-rand)}.eintrag .inhalt{flex:1;min-width:0}.eintrag>.mini{align-self:flex-start}.haken input{width:22px;height:22px;accent-color:var(--akzent);margin-top:6px}.zeile1{align-items:center;gap:8px;display:flex}input.lern,input.bedeutung{border:0;border-bottom:1px dashed var(--linie);background:0 0;width:100%;padding:2px 0}.lern{font-size:1.25rem;font-weight:600}.umschrift{color:var(--teal);font-size:.98rem}.korrektur{margin-top:4px;font-size:.92rem}.rueckfrage{margin-top:6px;font-size:.95rem}.knoepfe{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.leiste{background:var(--vn-grund);gap:8px;padding:8px 0 10px;display:flex;position:sticky;bottom:72px}.leiste .haupt{flex:1}.chip{border:1px solid var(--linie);color:var(--leise);background:var(--vn-flaeche);border-radius:999px;padding:1px 9px;font-size:.78rem;display:inline-block}.lernstand{color:var(--leise);align-items:center;gap:10px;margin:8px 0 2px;font-size:.9rem;display:flex}.lernstand b{color:var(--text);font-size:1.05rem}.bahn{background:var(--flaeche);height:10px;box-shadow:var(--vn-mulde);border-radius:99px;flex:1;position:relative;overflow:hidden}.bahn:before{content:"";background:var(--vn-fluss);position:absolute;inset:0}.bahn>i{background:var(--flaeche);transform-origin:100%;transition:transform .6s var(--vn-kurve);position:absolute;inset:0}.buehne{isolation:isolate;margin-top:10px;padding-bottom:20px;position:relative}.buehne:before,.buehne:after{content:"";z-index:-1;border-radius:var(--vn-radius-l);background:var(--vn-flaeche);box-shadow:var(--vn-schatten-1);transform-origin:50% 100%;opacity:0;position:absolute;inset:0 0 20px}.buehne.stapel-1:after,.buehne.stapel-2:after{opacity:.85;transform:translateY(10px)scale(.94)}.buehne.stapel-2:before{opacity:.55;transform:translateY(20px)scale(.88)}.karten-auf{perspective:1100px;animation:vn-auf .3s var(--vn-kurve)}.karteikarte{background:var(--vn-flaeche);border-radius:var(--vn-radius-l);text-align:center;min-height:260px;box-shadow:var(--vn-schatten-3), var(--vn-kante);backface-visibility:hidden;cursor:pointer;flex-direction:column;justify-content:center;gap:6px;padding:24px 16px 18px;display:flex;position:relative}.karteikarte.offen{cursor:default;background:var(--vn-fluss) top / 100% 6px no-repeat, var(--vn-flaeche);justify-content:flex-start}.karteikarte .vorne{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.gross{font-size:2.1rem;line-height:var(--vn-zeile-lern)}.karteikarte .lern.gross{padding-block:.06em;font-size:2.5rem}.hinten{gap:6px;margin-top:10px;display:grid}.beispiel{text-align:left;background:var(--flaeche);border-radius:12px;margin-top:6px;padding:10px 12px;line-height:1.6}.hinweis{text-align:left;margin-top:10px;font-size:.95rem}.bewertung{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:6px;display:grid}.note{--c:var(--vn-note-1);border:1px solid var(--linie);background:var(--vn-flaeche);box-shadow:0 3px 0 var(--c), var(--vn-schatten-1);transition:transform var(--vn-dauer-kurz) var(--vn-kurve);border-radius:14px;flex-direction:column;align-items:center;gap:6px;padding:11px 2px 10px;font-size:.95rem;font-weight:650;display:flex}.note:active{box-shadow:none;transform:translateY(3px)}.note[data-n="2"]{--c:var(--vn-note-2)}.note[data-n="3"]{--c:var(--vn-note-3)}.note[data-n="4"]{--c:var(--vn-note-4)}.stufen{align-items:flex-end;gap:2px;height:16px;display:flex}.stufen i{background:var(--linie);border-radius:2px;width:4px}.stufen i:first-child{height:5px}.stufen i:nth-child(2){height:8px}.stufen i:nth-child(3){height:12px}.stufen i:nth-child(4){height:16px}.note[data-n="1"] i:nth-child(-n+1),.note[data-n="2"] i:nth-child(-n+2),.note[data-n="3"] i:nth-child(-n+3),.note[data-n="4"] i{background:var(--c)}.bewertung button.vorschlag{outline:3px solid var(--akzent);outline-offset:2px}@keyframes vn-auf{0%{opacity:.5;transform:translateY(16px)scale(.95)}}@keyframes vn-weg{to{transform:rotateY(90deg)scale(.97)}}@keyframes vn-her{0%{transform:rotateY(-90deg)scale(.97)}}@keyframes vn-raus{to{opacity:0;transform:translate(70%,-36px)rotate(9deg)}}@keyframes vn-zurueck{to{opacity:0;transform:translateY(30px)scale(.9)}}.karteikarte.weg{animation:.17s cubic-bezier(.5,0,.9,.5) forwards vn-weg}.karteikarte.her{animation:vn-her .34s var(--vn-kurve-feder)}.karteikarte.raus{animation:vn-raus .34s var(--vn-kurve) forwards}.karteikarte.zurueck{animation:vn-zurueck .32s var(--vn-kurve) forwards}.richtung{background:var(--flaeche);box-shadow:var(--vn-mulde);border-radius:14px;grid-template-columns:repeat(3,1fr);gap:4px;margin:8px 0;padding:4px;display:grid}.richtung.zwei{grid-template-columns:1fr 1fr}.richtung button{box-shadow:none;color:var(--leise);background:0 0;border:0;border-radius:10px;padding:9px 4px;font-size:.88rem}.richtung button.aktiv{background:var(--vn-flaeche);color:var(--text);box-shadow:var(--vn-schatten-1), var(--vn-kante)}.tabs{z-index:10;background:var(--vn-flaeche);box-shadow:0 -1px 0 var(--linie), var(--vn-schatten-2);padding:6px 2px calc(8px + env(safe-area-inset-bottom));grid-template-columns:repeat(5,1fr);display:grid;position:fixed;bottom:0;left:0;right:0}.tabs button{color:var(--leise);background:0 0;border:0;flex-direction:column;align-items:center;gap:3px;padding:2px 0;font-size:.8rem;font-weight:600;display:flex}.tabs .ico{border-radius:99px;place-items:center;width:52px;height:30px;display:grid}.tabs svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px}.tabs button.aktiv{color:var(--text);font-weight:750}.tabs button.aktiv .ico{color:var(--akzent);background:linear-gradient(115deg,#2f78b72e,#6fbf8e33 60%,#f2b70538)}.ok{color:var(--vn-erfolg)}.diktat{gap:8px;margin:8px 0;display:flex}.diktat button{flex:1}.diktat button.an{background:var(--vn-fehler);color:#fff;border-color:var(--vn-fehler)}.fortschritt{margin-top:12px}.balken{background:var(--flaeche);border-radius:3px;height:6px;overflow:hidden}.balken .lauf{background:var(--vn-fluss);border-radius:3px;width:35%;height:100%;animation:1.2s ease-in-out infinite lauf}@keyframes lauf{0%{transform:translate(-100%)}to{transform:translate(290%)}}.vorschau{margin:6px 0;padding:0;font-size:.95rem;list-style:none}.vorschau li{border-bottom:1px solid var(--linie);padding:4px 0}input.umschrift-feld{border:0;border-bottom:1px dashed var(--linie);width:100%;color:var(--teal);background:0 0;padding:2px 0;font-size:.95rem}select.typ{border:1px solid var(--linie);background:var(--vn-flaeche);border-radius:8px;margin-top:6px;padding:2px 6px;font-size:.85rem}.sprachsteuerung{border-radius:var(--vn-radius-m);background:var(--vn-flaeche);box-shadow:var(--vn-schatten-1);gap:8px;margin-top:12px;padding:12px;font-size:.92rem;display:grid}.treffer{margin-top:8px;font-weight:600}.form .feld input,.form .feld select,.form .feld textarea{width:100%}.hinweis-klein{color:var(--leise);margin:10px 0 0;font-size:.9rem}.chip.register{margin:4px 4px 0 0}.chip.register.formell,.chip.register.schriftlich{border-color:var(--vn-warmgold);color:var(--vn-warnung)}.chip.register.umgangssprachlich,.chip.register.slang{border-color:var(--teal);color:var(--teal)}.schalter{align-items:center;gap:10px;margin:8px 0;font-weight:600;display:flex}.schalter input{width:22px;height:22px;accent-color:var(--akzent)}.mini.haupt-mini{background:var(--akzent);color:var(--akzent-text);border-color:var(--akzent);white-space:nowrap}.stimmtest{background:var(--flaeche);border-radius:12px;margin:10px 0;padding:10px 12px}.fragefeld{text-align:left;margin-top:12px}.fragefeld input{border:1px solid var(--linie);background:var(--vn-flaeche);box-shadow:var(--vn-mulde);border-radius:12px;flex:1;padding:9px 11px}h4{margin:16px 0 4px;font-size:.98rem}.willkommen .sprachwahl{justify-content:flex-end;gap:6px;display:flex}.willkommen .punkte{margin:8px 0 4px;padding-left:1.2rem}.willkommen .punkte li{margin:4px 0}.code-gross{letter-spacing:.06em;text-align:center;background:var(--flaeche);word-break:break-all;border-radius:12px;margin:8px 0;padding:10px;font:600 1.45rem/1.3 ui-monospace,Consolas,monospace}.datenschutz{background:var(--flaeche);border-radius:12px;margin:12px 0;padding:4px 12px 8px;font-size:.9rem}.datenschutz ul{margin:6px 0;padding-left:1.1rem}.datenschutz li{margin:4px 0}.bericht{background:var(--flaeche);border-radius:12px;margin:8px 0;padding:8px 12px}.liste-klein{margin:6px 0;padding:0;font-size:.95rem;list-style:none}.liste-klein li{border-bottom:1px solid var(--linie);padding:5px 0}details{margin:12px 0}summary{cursor:pointer;color:var(--teal)}.gefahr{background:var(--vn-fehler);color:#fff;box-shadow:none}a.knopf.haupt{color:var(--akzent-text);text-decoration:none;display:block}.admin .tabelle{border-collapse:collapse;width:100%;margin:6px 0;font-size:.85rem}.admin .tabelle th,.admin .tabelle td{border-bottom:1px solid var(--linie);text-align:left;vertical-align:top;padding:4px}.admin .zeile1 input{border:1px solid var(--linie);background:var(--vn-flaeche);border-radius:8px;flex:1;padding:8px}.admin{max-width:960px}.tasche{z-index:1000;color:#555;text-align:center;touch-action:none;background:#000;flex-direction:column;justify-content:center;align-items:center;padding:24px;font-size:.9rem;display:flex;position:fixed;inset:0}.tasche .treffer{color:#444;background:0 0}.podcast .wahl{grid-template-columns:1fr 1fr;gap:6px;margin:6px 0;display:grid}.podcast .wahl.drei{grid-template-columns:repeat(3,1fr)}.podcast .wahl button{text-align:left;flex-direction:column;gap:2px;padding:10px 8px;font-size:.95rem;display:flex}.podcast .wahl button .leise{font-size:.8rem;font-weight:400}.podcast .wahl button.aktiv{background:var(--akzent);color:var(--akzent-text);border-color:var(--akzent);box-shadow:var(--vn-akzent-sockel)}.podcast .wahl button.aktiv .leise{color:var(--akzent-text)}.podcast input.zahl{border:1px solid var(--linie);background:var(--vn-flaeche);border-radius:8px;width:4.5em;padding:4px 6px}.podcast input[type=range]{width:100%;accent-color:var(--akzent)}.podcast .gross-start{padding:18px;font-size:1.1rem}.podcast .frage-kasten{background:var(--frage);border:1px solid var(--frage-rand);border-radius:12px;padding:10px 12px}.podcast .jetzt{flex-direction:column;justify-content:center;gap:6px;min-height:160px;display:flex}.podcast .steuerung{grid-template-columns:1fr 2fr 1fr;gap:8px;margin:10px 0;display:grid}.podcast .steuerung button{padding:16px 4px;font-size:1.1rem}.podcast .signale{grid-template-columns:repeat(3,1fr);gap:6px;margin:8px 0;display:grid}.podcast .signale button{padding:12px 4px;font-size:.9rem}.mitlesen{margin:12px 0;padding-left:1.4rem}.mitlesen li{border-bottom:1px solid var(--linie);padding:5px 0}.mitlesen li.aktiv{background:var(--flaeche);border-radius:8px}.mitlesen li.ueberschrift{margin-left:-1.4rem;padding-top:12px;font-weight:700;list-style:none}.mitlesen .lern-text{font-size:1.1rem;line-height:var(--vn-zeile-lern)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
