:root{--green: #58cc02;--green-d: #46a302;--blue: #1cb0f6;--blue-d: #1899d6;--orange: #ff9600;--orange-d: #d97f00;--red: #ff4b4b;--yellow: #ffc800;--yellow-d: #e0a800;--purple: #ce82ff;--pink: #ff86d0;--teal: #00cd9c;--bg: #f7f7f7;--card: #ffffff;--text: #3c3c3c;--muted: #777;--faint: #afafaf;--line: #e5e5e5;--line-d: #cecece;--soft: #f1f1f1;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);color-scheme:light dark}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg: #131f24;--card: #1a2b33;--text: #f1f7fb;--muted: #9fb3bd;--faint: #52656d;--line: #2e424c;--line-d: #3b525d;--soft: #22343c}}:root[data-theme=dark]{--bg: #131f24;--card: #1a2b33;--text: #f1f7fb;--muted: #9fb3bd;--faint: #52656d;--line: #2e424c;--line-d: #3b525d;--soft: #22343c}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);overscroll-behavior:none}body{font-family:ui-rounded,SF Pro Rounded,Nunito,system-ui,-apple-system,Segoe UI,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none}input,textarea{-webkit-user-select:text;user-select:text;font-family:inherit}button{font-family:inherit;color:inherit}#root{height:100%}.app{height:100%;display:flex;flex-direction:column;max-width:560px;margin:0 auto;position:relative}.screen{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 16px calc(96px + var(--safe-bottom))}.screen.flush{padding-left:0;padding-right:0}.stats{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:14px;padding:calc(10px + var(--safe-top)) 18px 10px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:2px solid var(--line);font-weight:800;font-size:17px}.stats .grow{flex:1}.stat{display:flex;align-items:center;gap:4px}.tabbar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:560px;z-index:10;display:flex;justify-content:space-around;padding:8px 8px calc(8px + var(--safe-bottom));background:var(--card);border-top:2px solid var(--line)}.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:2px solid transparent;border-radius:14px;padding:6px 0;font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;cursor:pointer}.tab .ico{font-size:24px;line-height:1;filter:grayscale(1) opacity(.65)}.tab.on{color:var(--blue);border-color:color-mix(in srgb,var(--blue) 45%,transparent);background:color-mix(in srgb,var(--blue) 10%,transparent)}.tab.on .ico{filter:none}.btn{--c: var(--green);--cd: var(--green-d);--tc: #fff;width:100%;min-height:52px;border:0;border-radius:16px;background:var(--c);color:var(--tc);font-weight:800;font-size:16px;letter-spacing:.6px;text-transform:uppercase;box-shadow:0 4px 0 var(--cd);cursor:pointer;transition:transform .06s,box-shadow .06s,filter .15s;padding:0 16px}.btn:active:not(:disabled){transform:translateY(4px);box-shadow:0 0 0 var(--cd)}.btn:disabled{--c: var(--line);--cd: var(--line-d);--tc: var(--faint);cursor:default}.btn.blue{--c: var(--blue);--cd: var(--blue-d)}.btn.orange{--c: var(--orange);--cd: var(--orange-d)}.btn.white{--c: #fff;--cd: #d7ffb8;--tc: var(--green-d)}.btn.ghost{--c: var(--card);--cd: var(--line);--tc: var(--blue);border:2px solid var(--line)}.btn.small{min-height:40px;font-size:13px;border-radius:12px;width:auto}.iconbtn{border:0;border-radius:14px;background:var(--blue);color:#fff;box-shadow:0 4px 0 var(--blue-d);cursor:pointer;display:inline-grid;place-items:center;font-size:20px;width:44px;height:44px;flex:none;transition:transform .06s,box-shadow .06s}.iconbtn:active{transform:translateY(4px);box-shadow:none}.iconbtn.big{width:96px;height:96px;border-radius:24px;font-size:40px}.iconbtn.mid{width:60px;height:60px;border-radius:18px;font-size:24px}.tile{min-height:48px;padding:10px 14px;border-radius:14px;border:2px solid var(--line);background:var(--card);box-shadow:0 3px 0 var(--line);font-weight:700;font-size:17px;cursor:pointer;text-align:center;transition:transform .06s,box-shadow .06s,background .15s,border-color .15s;color:var(--text)}.tile:active:not(:disabled){transform:translateY(3px);box-shadow:none}.tile.sel{border-color:var(--blue);background:color-mix(in srgb,var(--blue) 14%,var(--card));box-shadow:0 3px 0 var(--blue);color:var(--blue-d)}.tile.ok{border-color:var(--green);background:color-mix(in srgb,var(--green) 16%,var(--card));box-shadow:0 3px 0 var(--green);color:var(--green-d)}.tile.bad{border-color:var(--orange);background:color-mix(in srgb,var(--orange) 14%,var(--card));box-shadow:0 3px 0 var(--orange);color:var(--orange-d)}.tile.off{opacity:.45}.tile.left{text-align:left}.tile.word{min-height:44px;font-size:17px;padding:8px 12px}.tile.ghosted{visibility:hidden}.card{background:var(--card);border:2px solid var(--line);border-radius:18px;padding:16px}.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.4px}.muted{color:var(--muted)}.faint{color:var(--faint)}.h1{font-size:26px;font-weight:900;margin:0}.h2{font-size:21px;font-weight:900;margin:0}.h3{font-size:17px;font-weight:800;margin:0}.small{font-size:13px}.row{display:flex;align-items:center;gap:10px}.col{display:flex;flex-direction:column;gap:12px}.wrap{display:flex;flex-wrap:wrap;gap:8px}.spacer{flex:1}.center{text-align:center}.stack-lg>*+*{margin-top:18px}.daily{margin:16px 0 6px;padding:18px;border-radius:22px;color:#fff;background:linear-gradient(135deg,var(--green),var(--teal));box-shadow:0 10px 24px color-mix(in srgb,var(--green) 35%,transparent)}.section-h{display:flex;align-items:center;gap:10px;margin:30px 4px 14px}.section-h:before,.section-h:after{content:"";flex:1;height:2px;background:var(--line)}.section-h div{text-align:center}.banner{border-radius:18px;padding:16px;color:#fff;display:flex;align-items:center;gap:12px;margin:22px 0 44px}.banner .guide{width:48px;height:48px;border-radius:14px;border:2px solid rgba(255,255,255,.35);background:#ffffff1f;color:#fff;font-size:22px;cursor:pointer;flex:none}.node-row{position:relative;height:92px;display:flex;justify-content:center}.node{position:relative;width:74px;height:68px;border-radius:50%;border:0;cursor:pointer;font-size:30px;color:#fff;display:grid;place-items:center;transition:transform .08s,box-shadow .08s}.node:active{transform:translateY(6px)}.node:after{content:"";position:absolute;left:18%;right:18%;top:9px;height:12px;border-radius:999px;background:#ffffff38}.node.locked{background:var(--line)!important;box-shadow:0 7px 0 var(--line-d)!important;color:var(--faint)}.node.cp{width:84px;height:76px}.pulse{position:absolute;top:-12px;right:-12px;bottom:-12px;left:-12px;border-radius:50%;border:6px solid;opacity:.35;animation:pulse 1.6s ease-in-out infinite;pointer-events:none}@keyframes pulse{0%,to{transform:scale(.96)}50%{transform:scale(1.07)}}.start-tag{position:absolute;top:-38px;left:50%;transform:translate(-50%);background:var(--card);border:2px solid var(--line);border-radius:12px;padding:5px 12px;font-weight:900;font-size:13px;letter-spacing:.5px;white-space:nowrap;animation:bob 1.4s ease-in-out infinite}@keyframes bob{0%,to{transform:translate(-50%)}50%{transform:translate(-50%,-4px)}}.pop{position:absolute;z-index:4;top:82px;left:50%;transform:translate(-50%);width:min(300px,88vw);border-radius:18px;padding:16px;color:#fff;box-shadow:0 12px 28px #0000002e;animation:popin .18s ease-out}@keyframes popin{0%{opacity:0;transform:translate(-50%,-6px) scale(.96)}}.lesson{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;background:var(--bg);display:flex;flex-direction:column;max-width:560px;margin:0 auto}.lesson-top{display:flex;align-items:center;gap:14px;padding:calc(14px + var(--safe-top)) 18px 10px}.x{background:none;border:0;font-size:26px;color:var(--faint);cursor:pointer;padding:0 4px;line-height:1}.bar{flex:1;height:16px;background:var(--line);border-radius:999px;overflow:hidden}.bar>div{height:100%;background:var(--green);border-radius:999px;transition:width .45s cubic-bezier(.3,1.4,.5,1);position:relative;min-width:16px}.bar>div:after{content:"";position:absolute;left:8px;right:8px;top:3px;height:4px;border-radius:999px;background:#ffffff59}.combo{color:var(--orange);font-weight:900;animation:popin .2s}.lesson-body{flex:1;overflow-y:auto;padding:4px 18px 200px}.ex-title{font-size:22px;font-weight:900;margin:8px 0 14px}.bubble{position:relative;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:14px;font-size:19px;font-weight:700;flex:1}.bubble:before{content:"";position:absolute;left:-10px;bottom:18px;width:16px;height:16px;background:var(--card);border-left:2px solid var(--line);border-bottom:2px solid var(--line);transform:rotate(45deg)}.gap{color:var(--blue-d);text-decoration:underline;text-underline-offset:4px}.gap.empty{color:var(--faint)}.input{width:100%;min-height:64px;border-radius:16px;border:2px solid var(--line);background:var(--soft);color:var(--text);font-size:20px;font-weight:700;padding:14px;outline:none;resize:none}.input:focus{border-color:var(--blue)}.answer-lines{min-height:112px;padding:8px 0;background:repeating-linear-gradient(to bottom,transparent 0 55px,var(--line) 55px 57px)}.feedback{position:fixed;left:50%;transform:translate(-50%);bottom:0;width:100%;max-width:560px;z-index:35;padding:20px 20px calc(24px + var(--safe-bottom));animation:slideup .22s ease-out}@keyframes slideup{0%{transform:translate(-50%,100%)}}.feedback.good{background:color-mix(in srgb,var(--green) 18%,var(--card));color:var(--green-d)}.feedback.soft{background:color-mix(in srgb,var(--orange) 16%,var(--card));color:var(--orange-d)}.checkbar{position:fixed;left:50%;transform:translate(-50%);bottom:0;width:100%;max-width:560px;z-index:32;padding:14px 18px calc(18px + var(--safe-bottom));background:var(--bg);border-top:2px solid var(--line)}.diacritics{display:flex;gap:8px;margin-top:12px}.diacritics .tile{flex:1;padding:8px 0;min-height:44px}.statbox{border:2px solid;border-radius:14px;overflow:hidden;flex:1;text-align:center}.statbox .t{color:#fff;font-size:11px;font-weight:900;text-transform:uppercase;padding:5px 0;letter-spacing:.5px}.statbox .v{font-size:19px;font-weight:900;padding:12px 0;background:var(--card)}.list-row{display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;background:var(--card);border:2px solid var(--line);box-shadow:0 3px 0 var(--line);cursor:pointer;width:100%;text-align:left;transition:transform .06s,box-shadow .06s}.list-row:active{transform:translateY(3px);box-shadow:none}.list-row .ic{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;font-size:26px;flex:none}.sheet-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#00000059;display:flex;align-items:flex-end;justify-content:center;animation:fade .15s}@keyframes fade{0%{opacity:0}}.sheet{width:100%;max-width:560px;max-height:88vh;overflow-y:auto;background:var(--bg);border-radius:22px 22px 0 0;padding:18px 16px calc(24px + var(--safe-bottom));animation:slideup2 .22s ease-out}@keyframes slideup2{0%{transform:translateY(40px);opacity:.6}}.sheet-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.link{background:none;border:0;color:var(--blue);font-weight:800;font-size:16px;cursor:pointer}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.heat{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}.heat div{aspect-ratio:1;border-radius:6px;display:grid;place-items:center;font-size:8px;font-weight:900;color:var(--muted)}.badge{text-align:center}.badge .b{width:64px;height:64px;margin:0 auto 6px;border-radius:50%;display:grid;place-items:center;font-size:30px}.badge.no .b{filter:grayscale(1);opacity:.35;background:var(--line)!important}.week{display:flex;align-items:flex-end;gap:10px;height:130px}.week>div{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;justify-content:flex-end;height:100%}.week .barv{width:100%;border-radius:6px}.serif{font-family:ui-serif,Georgia,Times New Roman,serif;font-size:16px;line-height:1.5;user-select:text;-webkit-user-select:text;white-space:pre-wrap}.timer{font-variant-numeric:tabular-nums;font-weight:900;padding:6px 12px;border-radius:999px;background:var(--card);border:2px solid var(--line)}select,.select{font:inherit;font-weight:700;padding:10px;border-radius:12px;border:2px solid var(--line);background:var(--card);color:var(--text)}.toggle{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:2px solid var(--line);gap:12px}.switch{width:52px;height:32px;border-radius:999px;background:var(--line);position:relative;border:0;cursor:pointer;flex:none;transition:background .2s}.switch:after{content:"";position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 3px #00000040}.switch.on{background:var(--green)}.switch.on:after{transform:translate(20px)}.siil{display:inline-block;flex:none}.siil.bounce{animation:siilBounce 1.8s ease-in-out infinite}.siil.cheer{animation:siilBounce .7s ease-in-out infinite}@keyframes siilBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-6%)}}.siil .eye{animation:blink 4s infinite;transform-origin:center;transform-box:fill-box}@keyframes blink{0%,92%,to{transform:scaleY(1)}95%{transform:scaleY(.1)}}.siil .wavearm{animation:wave 1s ease-in-out infinite;transform-origin:30% 90%;transform-box:fill-box}@keyframes wave{0%,to{transform:rotate(-10deg)}50%{transform:rotate(-45deg)}}.confetti{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:50}.appear{animation:appear .45s cubic-bezier(.3,1.5,.5,1)}@keyframes appear{0%{transform:scale(.4);opacity:0}}.shake{animation:shake .35s}@keyframes shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}
