@import "https://fonts.googleapis.com/css2?family=Aldrich&family=Source+Code+Pro:wght@400;600&display=swap";:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--sky:#daecff;--sky-2:#c5def5;--win:linear-gradient(90deg, #fafbfb 0%, #f7f7f7 50%, #fafbfb 100%);--inner:linear-gradient(90deg, #fff 0%, #fafafb 50%, #fff 100%);--border:#c9c9c9;--text:#5a6573;--muted:#9da7b3;--accent:#74a4db;--accent-hot:#81a1c8;--accent-soft:#93bdec;--good:#6aa88a;--good-dim:#6aa88a24;--bad:#d36a6a;--bad-dim:#d36a6a24;--gold:#74a4db;--gold-dim:#74a4db24;--line:#d5dbe3;--font-ui:Aldrich, "Segoe UI", Verdana, sans-serif;--font-de:"Source Code Pro", Consolas, monospace;--radius:22px;--fade:.18s ease}*{box-sizing:border-box}html,body,#root{height:100dvh;max-height:100dvh;overflow:hidden}html{scrollbar-color:#b8c7d8 #eef5fc;scrollbar-width:thin}body{font-family:var(--font-ui);color:var(--text);cursor:default;margin:0;line-height:1.5}::selection{color:#fff;background:#8bb4ff}button,input,a{font:inherit}a{color:var(--accent);text-decoration:none}a:hover{color:#a9c6f0}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}.sky{z-index:0;pointer-events:none;background:radial-gradient(50% 40% at 20% 10%, #ffffffd9, transparent 60%), radial-gradient(40% 50% at 80% 80%, #8bb4ff59, transparent 60%), var(--sky);animation:18s ease-in-out infinite alternate sky-drift;position:fixed;inset:0}@keyframes sky-drift{0%{filter:hue-rotate()}to{filter:hue-rotate(12deg)}}.desktop{z-index:1;height:100%;max-height:100dvh;padding:12px;padding-bottom:max(12px, env(safe-area-inset-bottom));grid-template-rows:minmax(0,1fr);grid-template-columns:168px minmax(0,1fr) 180px;gap:12px;display:grid;position:relative}.win{background-image:var(--win);border:1.5px solid var(--border);border-radius:var(--radius);flex-direction:column;min-height:0;display:flex;overflow:hidden;box-shadow:inset 0 -5px 5px -4px #dadada,0 0 8px #d5e4f3}.win-toolbar{letter-spacing:1px;color:#fff;text-shadow:0 0 3px #5670a0;background:linear-gradient(90deg,#8bb4ff 0%,#e2fafb 78%,#0000 100%);flex:none;justify-content:space-between;align-items:center;padding:7px 12px 6px;font-family:Source Code Pro,monospace;font-size:13px;display:flex}.win-toolbar-end{align-items:center;gap:8px;display:flex}.sfx-toggle{min-height:0;box-shadow:none;color:#fff;letter-spacing:1px;text-transform:lowercase;text-shadow:0 0 3px #5670a0;background:0 0;border:none;padding:0 2px;font-family:Source Code Pro,monospace;font-size:11px}.sfx-toggle:hover{color:#eef7ff;background:0 0}.win-x{background:radial-gradient(circle at 35% 30%,#fff,#d7dde6 55%,#b8c0cb);border:1px solid #c9c9c9;border-radius:50%;width:14px;height:14px;box-shadow:inset 0 -1px 1px #fff}.win-footer{color:var(--muted);border-top:1px solid #e4e8ee;flex:none;padding:6px 12px;font-size:11px}.navi-brand{padding:10px 12px 4px}.navi-title{letter-spacing:2px;transform-origin:0;color:#0000;background:linear-gradient(#a7d5ff 45%,#81a1c8 100%);-webkit-background-clip:text;background-clip:text;font-size:28px;line-height:.9;transform:scaleY(.85)}.navi-sub{color:#c9cfd6;letter-spacing:3px;margin-top:2px;font-size:13px}.navi-links{flex-direction:column;gap:0;padding:6px 14px 8px;display:flex}.navi-links a{text-align:right;color:#9da7b3;letter-spacing:1px;border-top:1px solid #0000;padding:7px 4px;display:block;box-shadow:0 -1px #e3e8ef}.navi-links a.active,.navi-links a:hover{color:#81a1c8}.navi-credit{color:var(--muted);margin-top:auto;padding:8px 12px 12px;font-size:10px}.dock-inner{padding:14px 14px 16px;font-size:13px}.dock-inner p{justify-content:space-between;margin:0 0 10px;display:flex}.dock-inner b{color:var(--accent-hot)}.navi,.dock,.main-win{min-width:0;height:100%}.page-slot,.fade-wrap,.fade-in,.fade-in.fill,.step-grow{flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}main{flex-direction:column;flex:1;gap:8px;min-height:0;padding:12px;display:flex;overflow:hidden}.step-screen{flex-direction:column;flex:1;gap:8px;min-height:0;display:flex;overflow:hidden}.pane{flex:1;min-height:0}.pane.scroll{overflow:auto}.screen-actions{flex-direction:column;flex:none;gap:8px;display:flex}.screen-actions>.primary-btn,.screen-actions>.secondary-btn{width:100%}.hero{flex-direction:column;flex:1;min-height:0;display:flex;overflow:auto}.hero>.step-label,.hero>.page-title,.hero>.lede,.hero>.muted,.hero>.stat-row{flex-shrink:0}.hero .screen-actions{margin-top:auto;padding-top:8px}.card,.stat,.option,.text-input,.flashcard-face,.vocab-card,.unit-card,.result-card,.remember,.example,.install-banner{background-image:var(--inner);border:1.5px solid var(--border);border-radius:18px;box-shadow:inset 0 0 5px #cacaca,0 -3px 5px -3px #bbb,0 4px 1px -3px #fff}.card{padding:14px}.hero h1,.page-title{color:#6d7a88;letter-spacing:.5px;margin:0 0 6px;font-size:clamp(1.2rem,3vw,1.7rem);line-height:1.2}.page-title.tight{margin-bottom:2px}.lede{color:#7b828b;margin:0 0 6px}.muted{color:var(--muted)}.stat-row{grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0;display:grid}.stat{padding:10px}.stat.compact{padding:8px;font-size:.8rem}.stat strong{color:var(--accent-hot);font-size:1.2rem;display:block}.cta-row{flex-direction:column;gap:8px;display:flex}.ghost-btn,.primary-btn,.secondary-btn{letter-spacing:.6px;text-transform:uppercase;border:1px solid #c9d1dd;border-radius:20px;justify-content:center;align-items:center;min-height:40px;padding:8px 14px;font-size:13px;display:inline-flex}.primary-btn{color:#5d7ea8;background:radial-gradient(75% 50% at 50% 0,#f4f8ff,#fff),radial-gradient(75% 50% at 50% 70%,#fff,#fff);box-shadow:inset 0 -2px 4px #b0b3b8}.secondary-btn,.ghost-btn{color:#8b939c;background:linear-gradient(#fff,#f4f6f9);box-shadow:inset 0 -2px 3px #d5d8de}.primary-btn:hover,.secondary-btn:hover,.ghost-btn:hover:not(:disabled){color:#81a1c8;background:#eef3f9}.lesson-meta{flex:none;justify-content:space-between;align-items:center;gap:12px;display:flex}.progress-track{border:1.5px solid var(--border);background:#eef3f8;border-radius:99px;flex:none;height:8px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#8bb4ff,#cde8ff);width:0;height:100%;transition:width .28s}.step-label{letter-spacing:.12em;text-transform:uppercase;color:var(--accent-soft);font-size:.75rem}.vocab-card{text-align:center;flex-direction:column;flex:1;justify-content:center;min-height:0;padding:16px;display:flex}.vocab-card .de{font-family:var(--font-de);color:var(--accent-hot);margin:8px 0 6px;font-size:clamp(1.6rem,4vw,2.3rem)}.hint{color:var(--muted);font-size:.95rem}.dot-row{flex:none;justify-content:center;gap:6px;display:flex}.dot{background:#d5dbe3;border-radius:50%;width:8px;height:8px}.dot.on{background:var(--accent)}.grammar-point{margin-bottom:14px}.grammar-point h3{color:var(--accent-hot);margin:0 0 6px;font-size:1rem}.example{text-align:left;width:100%;color:inherit;margin:8px 0;padding:10px 12px;display:block}button.example:hover{border-color:var(--accent)}.example .de{font-family:var(--font-de);color:#4f5b68}.remember{padding:12px 14px}.remember h3{color:var(--accent-hot);margin:0 0 6px}.remember ul{margin:0;padding-left:18px}.quiz-prompt{white-space:pre-line;margin:0 0 10px;font-size:1.05rem}.options{gap:8px;display:grid}.option,.text-input{text-align:left;width:100%;color:var(--text);padding:10px 12px}.text-input:focus{border-color:var(--accent);outline:none}.option:hover:not(:disabled){border-color:var(--accent);color:var(--accent-hot)}.option.selected{border-color:var(--accent);box-shadow:0 0 0 2px #74a4db40}.option.correct,.feedback.good{background:var(--good-dim);border-color:var(--good);color:var(--good)}.option.wrong,.feedback.bad{background:var(--bad-dim);border-color:var(--bad);color:var(--bad)}.feedback{border:1.5px solid var(--border);animation:fade-in var(--fade);border-radius:16px;margin:10px 0 0;padding:10px 12px}.feedback p{margin:4px 0 0}.unit-list{gap:8px;display:grid}.unit-card{padding:10px 12px}.unit-head{align-items:baseline;gap:10px;display:flex}.unit-card h2{margin:0;font-size:.95rem}.lesson-dots{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.lesson-dot{border:1.5px solid var(--border);min-width:36px;height:36px;color:var(--text);background:#fff;border-radius:12px;place-items:center;font-weight:700;display:grid}.lesson-dot.done{background:var(--good-dim);border-color:var(--good);color:var(--good)}.lesson-dot.current{color:#fff;background:#8bb4ff;border-color:#8bb4ff}.lesson-dot.locked{opacity:.4;cursor:not-allowed}.toast{border:1.5px solid var(--border);color:var(--accent-hot);z-index:60;background:#fff;border-radius:18px;padding:10px 14px;animation:.22s fade-in;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.install-banner{flex:none;justify-content:space-between;align-items:center;gap:12px;margin:0;padding:8px 10px;display:flex}.install-banner p{margin:0;font-size:.8rem}.missed{margin:8px 0 0;padding:0;list-style:none}.missed li{border-bottom:1px solid var(--line);margin:0 0 8px;padding-bottom:8px}.direction-toggle{flex:none;gap:8px;display:flex}.flashcard-scene{perspective:1200px;flex:1;width:100%;min-height:0}.flashcard{width:100%;height:100%;min-height:0;box-shadow:none;transform-style:preserve-3d;-webkit-user-select:none;user-select:none;background:0 0;border:none;padding:0;transition:transform .42s;position:relative}.flashcard.is-flipped{transform:rotateY(180deg)}.flashcard-face{text-align:center;backface-visibility:hidden;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:14px;display:flex;position:absolute;inset:0;overflow:auto}.flashcard-face.back{transform:rotateY(180deg)}.grade-row{grid-template-columns:1fr 1fr;gap:8px;width:100%;display:grid}.grade-btn{letter-spacing:.6px;text-transform:uppercase;border-radius:20px;justify-content:center;align-items:center;min-height:40px;padding:8px 14px;font-size:13px;display:inline-flex}.grade-btn.correct{color:var(--good);border:1px solid var(--good);background:var(--good-dim);box-shadow:inset 0 -2px 3px #6aa88a40}.grade-btn.wrong{color:var(--bad);border:1px solid var(--bad);background:var(--bad-dim);box-shadow:inset 0 -2px 3px #d36a6a40}.grade-btn.correct:hover{background:#6aa88a3d}.grade-btn.wrong:hover{background:#d36a6a3d}.flash-word{font-size:clamp(1.6rem,4vw,2.4rem);line-height:1.2}.flash-word.de{font-family:var(--font-de);color:var(--accent-hot)}.flash-word.sentence{overflow-wrap:break-word;max-width:40rem;font-size:clamp(1.05rem,2.8vw,1.45rem);line-height:1.35}.flash-nav{justify-content:center;gap:8px;display:flex}.result-card{flex-direction:column;flex:1;min-height:0;display:flex}.exit-link{color:var(--muted);text-align:center;flex:none;font-size:.8rem}.reset-link{align-self:flex-start;min-height:32px;padding:4px 8px;font-size:.75rem}.fade-in{animation:.22s fade-in}@keyframes fade-in{0%{opacity:0}to{opacity:1}}a,button,input,.card,.stat,.option,.lesson-dot,.dot,.toast,.primary-btn,.secondary-btn,.ghost-btn,.grade-btn{transition:color var(--fade), background-color var(--fade), border-color var(--fade), box-shadow var(--fade), opacity var(--fade)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}@media (width<=960px){.desktop{grid-template-rows:auto minmax(0,1fr);grid-template-columns:1fr}.dock{display:none}.navi{flex-direction:row;align-items:center;height:auto;padding-bottom:4px}.navi .win-toolbar,.navi-brand,.navi-credit{display:none}.navi-links{flex-direction:row;justify-content:space-around;width:100%;padding:4px 8px}.navi-links a{text-align:center;box-shadow:none;padding:8px 6px;font-size:12px}}@media (height<=720px){.install-banner,.win-footer{display:none}}.verb-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.verb-list .example{flex:none;margin:0}.conjugate-pane{text-align:center;flex-direction:column;justify-content:center;gap:8px;display:flex}.conjugate-hint{margin:0}.conjugate-infinitive{font-family:var(--font-de);color:var(--accent-hot);margin:0;font-size:clamp(1.8rem,5vw,2.6rem);line-height:1.15}.conjugate-en{color:#7b828b;margin:0 0 8px}.conjugate-person{font-family:var(--font-de);color:#4f5b68;justify-content:center;align-items:baseline;gap:10px;margin:0 0 10px;font-size:1.35rem;display:flex}.drive-note{margin:10px 0 0;font-size:.85rem}.drive-main{gap:8px}.drive-stage{flex-direction:column;flex:1;gap:10px;min-height:0;display:flex;overflow:auto}.drive-prompt{white-space:pre-line;color:#4f5b68;margin:0;font-size:clamp(1.25rem,4.4vw,1.9rem);line-height:1.3}.drive-options{gap:8px;margin:0;padding:0;list-style:none;display:grid}.drive-options li{border:1.5px solid var(--border);background:#fff;border-radius:14px;align-items:baseline;gap:10px;padding:8px 10px;display:flex}.drive-letter{font-family:var(--font-de);color:var(--accent-hot);flex:none;font-weight:600}.drive-mic{border:2px solid #d5dbe3;border-radius:50%;place-items:center;width:28px;height:28px;margin:4px auto 0;display:grid}.drive-mic span{background:#d5dbe3;border-radius:50%;width:10px;height:10px}.drive-mic.is-on{border-color:var(--accent)}.drive-mic.is-on span{background:var(--accent);animation:1.1s ease-in-out infinite mic-pulse}.drive-heard{text-align:center;min-height:1.4em;color:var(--muted);margin:0;font-size:.9rem}.drive-type{flex:none;grid-template-columns:minmax(0,1fr) auto;gap:8px;display:grid}button.drive-mic{min-height:28px;box-shadow:none;text-transform:none;background:0 0;padding:0}@keyframes mic-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.65;transform:scale(1.35)}}