:root{--sky:#00a8c6;--sky-dark:#0086a0;--sky-soft:#e3f6fa;--gold:#fec50c;--gold-dark:#d9a600;--green:#3cb44b;--green-dark:#2a8f37;--green-soft:#e4f7e6;--red:#e5484d;--red-soft:#fdecec;--amber:#f0a020;--amber-soft:#fff4dc;--bg:#f4fbfd;--card:#fff;--text:#1d2b33;--muted:#6b7c86;--line:#d9e6ea;--shadow:0 2px 0 var(--line);--radius:16px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=dark]{--sky-soft:#10343d;--green-soft:#173a1d;--red-soft:#45191b;--amber-soft:#3f300f;--bg:#0f1a1f;--card:#172630;--text:#e6f0f3;--muted:#8ea2ab;--line:#2a3d47;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Segoe UI,system-ui,-apple-system,Noto Sans,Roboto,sans-serif;line-height:1.45}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}input,select{font:inherit;color:inherit}h1,h2,h3{margin:0 0 .4em;line-height:1.2}p{margin:0 0 .6em}.muted{color:var(--muted)}.small{font-size:.85rem}.center{text-align:center}.grow{flex:1}.btn{border:2px solid var(--line);background:var(--card);letter-spacing:.02em;border-bottom-width:4px;border-radius:14px;padding:.7em 1.2em;font-weight:700;transition:transform 50ms}.btn:active:not(:disabled){border-bottom-width:2px;transform:translateY(2px)}.btn.primary{background:var(--green);border-color:var(--green-dark);color:#fff}.btn.primary:disabled{background:var(--line);border-color:var(--line);color:var(--muted)}.btn.danger{color:var(--red)}.btn.wide{width:100%}.btn-row{flex-wrap:wrap;gap:.5rem;display:flex}.icon-btn{color:var(--muted);background:0 0;border:none;padding:.3rem .5rem;font-size:1.3rem}.link{color:var(--sky-dark);text-align:left;background:0 0;border:none;padding:0;font-weight:600}[data-theme=dark] .link{color:var(--sky)}.badge{background:var(--sky-soft);color:var(--sky-dark);text-transform:uppercase;letter-spacing:.05em;border-radius:999px;padding:.15em .7em;font-size:.8rem;font-weight:700;display:inline-block}[data-theme=dark] .badge{color:var(--sky)}.badge.small{padding:.05em .5em;font-size:.7rem}.app{max-width:760px;min-height:100vh;margin:0 auto;padding-bottom:80px}.topbar{z-index:10;background:var(--bg);border-bottom:2px solid var(--line);justify-content:space-between;align-items:center;padding:.6rem 1rem;display:flex;position:sticky;top:0}.brand{color:var(--sky-dark);align-items:center;gap:.5rem;font-size:1.2rem;font-weight:800;display:flex}[data-theme=dark] .brand{color:var(--sky)}.brand img{width:32px;height:32px}.top-stats{align-items:center;gap:.8rem;font-weight:700;display:flex}.goal-met{color:var(--green)}.due-pill{border:2px solid var(--line);background:var(--card);border-radius:999px;padding:.1em .7em;font-weight:700}.content{padding:1rem}.tabs{z-index:10;background:var(--card);border-top:2px solid var(--line);padding-bottom:env(safe-area-inset-bottom);justify-content:center;display:flex;position:fixed;bottom:0;left:0;right:0}.tabs button{max-width:190px;color:var(--muted);background:0 0;border:none;flex-direction:column;flex:1;align-items:center;padding:.5rem 0 .6rem;font-size:.75rem;font-weight:700;display:flex;position:relative}.tabs button.on{color:var(--sky-dark)}[data-theme=dark] .tabs button.on{color:var(--sky)}.tab-icon{font-size:1.4rem}.dot{background:var(--red);color:#fff;border-radius:999px;min-width:1.4em;padding:0 .4em;font-size:.65rem;position:absolute;top:4px;left:55%}.kk{flex-direction:column;display:inline-flex}.kk-row{align-items:center;gap:.4rem;display:inline-flex}.kk-big{font-size:1.7rem;font-weight:700}.roman{color:var(--muted);font-size:.8em;font-style:italic;font-weight:400}.kk-big .roman{font-size:1rem}.speak{background:var(--sky-soft);border:none;border-radius:10px;padding:.15rem .4rem;font-size:1rem}.cta-row{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.7rem;margin-bottom:1.2rem;display:grid}.cta{text-align:left;border-radius:var(--radius);border:none;border-bottom:4px solid var(--green-dark);background:var(--green);color:#fff;align-items:center;gap:.8rem;padding:.9rem 1rem;display:flex}.cta.review{background:var(--sky);border-color:var(--sky-dark)}.cta b{font-size:1.1rem;display:block}.cta small{opacity:.9}.cta-icon{font-size:2rem}.level{margin-bottom:1.6rem}.level.locked .level-info h2,.level.locked .level-info p{opacity:.55}.level-head{gap:.9rem;margin-bottom:.8rem;display:flex}.level-badge{background:var(--gold);color:#3b2c00;border-bottom:4px solid var(--gold-dark);border-radius:16px;flex:none;place-items:center;width:56px;height:56px;font-size:1.3rem;font-weight:900;display:grid}.level-badge.small{border-bottom-width:3px;border-radius:10px;width:36px;height:36px;font-size:.9rem}.level-info{flex:1;min-width:0}.level-info p{color:var(--muted)}.level-progress{align-items:center;gap:.6rem;display:flex}.level-actions{flex-wrap:wrap;gap:1.2rem;margin-top:.3rem;font-size:.9rem;display:flex}.goals{color:var(--muted);margin:.5rem 0 0;padding-left:1.2rem}.bar{background:var(--line);border-radius:999px;flex:1;height:12px;overflow:hidden}.bar.narrow{flex:0 0 120px}.bar-fill{background:var(--gold);border-radius:999px;height:100%;transition:width .3s}.unit{background:var(--card);border:2px solid var(--line);border-radius:var(--radius);margin-bottom:.8rem;padding:.9rem}.unit.locked{opacity:.6}.unit.complete{border-color:var(--gold)}.unit-head{align-items:flex-start;gap:.7rem;display:flex}.unit-icon{font-size:2rem;line-height:1}.unit-title{flex:1;min-width:0}.unit-title h3{margin-bottom:.15rem;font-size:1.05rem}.unit-title p{color:var(--muted);margin:0;font-size:.9rem}.kk-title{color:var(--sky-dark);margin-left:.3rem;font-weight:600}[data-theme=dark] .kk-title{color:var(--sky)}.unit-practice{border:2px solid var(--line);background:var(--bg);border-radius:12px;flex-direction:column;gap:.25rem;min-width:84px;padding:.3rem .6rem;font-size:.8rem;font-weight:700;display:flex}.nodes{flex-wrap:wrap;align-items:flex-start;gap:.5rem;margin-top:.8rem;display:flex}.node{border:2px solid var(--line);background:var(--bg);border-bottom-width:4px;border-radius:999px;align-items:center;gap:.4rem;padding:.35rem .8rem .35rem .4rem;font-size:.85rem;font-weight:600;display:flex}.node-icon{background:var(--line);border-radius:50%;place-items:center;width:28px;height:28px;font-size:.85rem;display:grid}.node.done .node-icon{background:var(--gold);color:#3b2c00}.node.node-grammar.done .node-icon{background:var(--sky-soft)}.node.next{border-color:var(--green);background:var(--green-soft);animation:2s infinite pulse}.node.next .node-icon{background:var(--green);color:#fff}.node.locked{opacity:.5}.node-label{text-overflow:ellipsis;white-space:nowrap;max-width:220px;overflow:hidden}@keyframes pulse{0%,to{box-shadow:0 0 #3cb44b59}50%{box-shadow:0 0 0 6px #3cb44b00}}.strength{background:var(--line);border-radius:999px;min-width:60px;height:7px;overflow:hidden}.strength-fill{border-radius:999px;height:100%}.strength-fill.good{background:var(--green)}.strength-fill.ok{background:var(--amber)}.strength-fill.weak{background:var(--red)}.panel{background:var(--card);border:2px solid var(--line);border-radius:var(--radius);margin-bottom:1rem;padding:1rem}.big-number{color:var(--sky-dark);font-size:2.6rem;font-weight:900}[data-theme=dark] .big-number{color:var(--sky)}.big-number span{color:var(--muted);font-size:1rem;font-weight:600}.forecast,.xp-chart{align-items:flex-end;gap:.4rem;height:84px;margin:.5rem 0 1rem;display:flex}.fc-col{height:100%;color:var(--muted);flex-direction:column;flex:1;justify-content:flex-end;align-items:center;font-size:.7rem;display:flex}.fc-bar{background:var(--sky);border-radius:6px 6px 2px 2px;width:100%;max-width:34px;min-height:3px}.fc-bar.goal{background:var(--gold)}.weak-list{margin:0 0 1rem;padding:0;list-style:none}.weak-list li{border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr 80px;align-items:center;gap:.6rem;padding:.4rem 0;display:grid}.weak-concept{color:var(--sky-dark);font-weight:700}.weak-meter{background:var(--line);border-radius:999px;height:7px;overflow:hidden}.weak-meter div{background:var(--red);height:100%}.concepts{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.5rem;display:grid}.concept{border:2px solid var(--line);background:var(--bg);text-align:left;border-bottom-width:4px;border-radius:12px;flex-direction:column;gap:.35rem;padding:.6rem;font-size:.9rem;font-weight:600;display:flex}.stats-row{grid-template-columns:repeat(4,1fr);gap:.5rem;margin-bottom:1rem;display:grid}.stat{text-align:center;border:2px solid var(--line);border-radius:12px;flex-direction:column;align-items:center;padding:.5rem .2rem;display:flex}.stat b{font-size:1.25rem}.stat span{color:var(--muted);font-size:.75rem}.level-row{align-items:center;gap:.7rem;padding:.35rem 0;display:flex}.settings label{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:1rem;padding:.55rem 0;display:flex}.settings select{border:2px solid var(--line);background:var(--bg);border-radius:10px;padding:.3rem .5rem}.settings input[type=checkbox]{width:22px;height:22px;accent-color:var(--green);flex:none}.words-head{margin-bottom:.8rem}.search{border:2px solid var(--line);background:var(--card);border-radius:12px;width:100%;margin-bottom:.5rem;padding:.6rem .8rem}.chips{flex-wrap:wrap;align-items:center;gap:.4rem;display:flex}.chip{border:2px solid var(--line);background:var(--card);border-radius:999px;padding:.2rem .8rem;font-size:.85rem;font-weight:700}.chip.on{background:var(--sky);border-color:var(--sky-dark);color:#fff}.chips select{border:2px solid var(--line);background:var(--card);border-radius:10px;margin-left:auto;padding:.25rem}.word-list{margin:0;padding:0;list-style:none}.word-list li{border-bottom:1px solid var(--line)}.word-row{text-align:left;background:0 0;border:none;grid-template-columns:1fr 1fr 70px;align-items:center;gap:.6rem;width:100%;padding:.6rem .2rem;display:grid}.word-kk{font-weight:700}.word-en{color:var(--muted);font-size:.9rem}.word-detail{flex-direction:column;gap:.4rem;padding:0 .2rem .8rem;display:flex}.player{flex-direction:column;max-width:680px;min-height:100vh;margin:0 auto;display:flex}.player-top{align-items:center;gap:.8rem;padding:1rem;display:flex}.player-top .bar{height:16px}.player-top .bar-fill{background:var(--green)}.player-body{flex:1;padding:.5rem 1.2rem 1.5rem;animation:.18s ease-out slidein}@keyframes slidein{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:none}}.ex-title{margin-bottom:1rem;font-size:1.35rem}.prompt{margin-bottom:1.2rem}.prompt-en{font-size:1.4rem;font-weight:600}.prompt-sub{color:var(--muted);margin-top:.4rem;font-size:1.05rem}.hint{color:var(--amber);margin-bottom:.5rem;font-size:.85rem;font-weight:600}.options{gap:.6rem;display:grid}.options.compact{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));margin-top:1rem}.option{text-align:left;border:2px solid var(--line);background:var(--card);border-bottom-width:4px;border-radius:14px;align-items:center;gap:.8rem;padding:.8rem 1rem;font-size:1.05rem;display:flex}.option .key{border:2px solid var(--line);width:26px;height:26px;color:var(--muted);border-radius:8px;flex:none;place-items:center;font-size:.8rem;display:grid}.option.selected{border-color:var(--sky);background:var(--sky-soft)}.option.right{border-color:var(--green);background:var(--green-soft)}.option.wrong{border-color:var(--red);background:var(--red-soft)}.kk-input input{border:2px solid var(--line);background:var(--card);border-radius:14px;width:100%;padding:.9rem 1rem;font-size:1.2rem}.kk-input input:focus{border-color:var(--sky);outline:none}.letters{flex-wrap:wrap;gap:.35rem;margin-top:.5rem;display:flex}.letters button{border:2px solid var(--line);background:var(--card);border-bottom-width:3px;border-radius:10px;min-width:40px;padding:.35rem .5rem;font-size:1.1rem;font-weight:600}.answer-line{border-bottom:2px solid var(--line);flex-wrap:wrap;align-content:flex-start;gap:.4rem;min-height:64px;margin-bottom:1.2rem;padding:.5rem 0;display:flex}.bank{flex-wrap:wrap;justify-content:center;gap:.45rem;display:flex}.tile{border:2px solid var(--line);background:var(--card);border-bottom-width:4px;border-radius:12px;padding:.45rem .8rem;font-size:1.05rem}.tile.used{color:#0000;background:var(--line);border-color:var(--line)}.fill-sentence{font-size:1.45rem;font-weight:600;line-height:1.8}.gap{border-bottom:3px solid var(--sky);text-align:center;min-width:3.5em;color:var(--sky-dark);margin:0 .2em;padding:0 .2em;display:inline-block}[data-theme=dark] .gap{color:var(--sky)}.listen-btns{justify-content:center;gap:.8rem;margin:1rem 0 1.5rem;display:flex}.big-speak,.slow-speak{border:none;border-bottom:4px solid var(--sky-dark);background:var(--sky);border-radius:18px;padding:.6rem 1.4rem;font-size:2.2rem}.slow-speak{font-size:1.4rem}.match{grid-template-columns:1fr 1fr;gap:.8rem;display:grid}.match-col{flex-direction:column;gap:.5rem;display:flex}.match-tile{text-align:center;padding:.8rem .5rem}.match-tile.selected{border-color:var(--sky);background:var(--sky-soft)}.match-tile.done{opacity:.35;border-color:var(--green)}.shake{animation:.35s shake;border-color:var(--red)!important}@keyframes shake{25%{transform:translate(-5px)}75%{transform:translate(5px)}}.intro{flex-direction:column;align-items:flex-start;gap:.7rem;padding-top:1rem;display:flex}.intro .kk-big{font-size:2.3rem}.intro-en{font-size:1.35rem;font-weight:600}.literal{color:var(--muted);font-style:italic}.note{background:var(--amber-soft);border-radius:12px;padding:.6rem .8rem;font-size:.95rem}.player-foot{padding:1rem 1.2rem calc(1rem + env(safe-area-inset-bottom));border-top:2px solid var(--line);background:var(--bg);position:sticky;bottom:0}.player-foot.fb-correct{background:var(--green-soft);border-color:var(--green)}.player-foot.fb-typo{background:var(--amber-soft);border-color:var(--amber)}.player-foot.fb-wrong{background:var(--red-soft);border-color:var(--red)}.fb{margin-bottom:.8rem}.fb-head{font-size:1.2rem;font-weight:800}.fb-correct .fb-head{color:var(--green-dark)}.fb-typo .fb-head{color:#b07000}.fb-wrong .fb-head{color:var(--red)}.fb-answer{margin-top:.2rem;font-size:1.1rem;font-weight:600}.fb-explain{margin-top:.4rem;font-size:.95rem}.fb-wrong .btn.primary{background:var(--red);border-color:#b3373b}.summary{justify-content:center;padding:1.5rem}.summary-card{text-align:center}.big-emoji{font-size:4rem}.empty-session{text-align:center;padding:3rem 1.5rem}.grammar{flex-direction:column;max-width:720px;min-height:100vh;margin:0 auto;display:flex}.grammar-top{align-items:center;gap:.6rem;padding:.8rem 1rem;display:flex}.grammar-body{flex:1;padding:0 1.2rem 2rem}.grammar-body h1{font-size:1.7rem}.grammar-body h2{color:var(--sky-dark);margin-top:1.4rem;font-size:1.2rem}[data-theme=dark] .grammar-body h2{color:var(--sky)}.lead{color:var(--muted);font-size:1.1rem}.table-wrap{margin:.6rem 0;overflow-x:auto}table{border-collapse:collapse;background:var(--card);border-radius:12px;width:100%;font-size:.95rem;overflow:hidden}th,td{border:1px solid var(--line);text-align:left;vertical-align:top;padding:.45rem .6rem}th{background:var(--sky-soft)}.examples{flex-direction:column;gap:.5rem;margin:.6rem 0;padding:0;list-style:none;display:flex}.examples li{background:var(--card);border:2px solid var(--line);border-radius:12px;flex-direction:column;padding:.55rem .8rem;display:flex}.examples .kk{font-weight:600}.ex-en{color:var(--muted);font-size:.92rem}.tip{background:var(--amber-soft);border-radius:12px;gap:.4rem;margin:.6rem 0;padding:.6rem .8rem;display:flex}.tip p:last-child{margin:0}.grammar-foot{background:var(--bg);border-top:2px solid var(--line);padding:1rem 1.2rem;position:sticky;bottom:0}@media (width<=520px){.stats-row{grid-template-columns:repeat(2,1fr)}.kk-big{font-size:1.45rem}.intro .kk-big{font-size:1.9rem}.top-stats{gap:.5rem;font-size:.9rem}.brand span{display:none}.weak-list li,.word-row{grid-template-columns:1fr 1fr 50px}.node-label{max-width:150px}}