@font-face{font-family:Fredoka;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/fredoka.woff2) format("woff2")}@font-face{font-family:Nunito;font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/nunito.woff2) format("woff2")}:root{--bg1: #fff2f7;--bg2: #eef2ff;--bg3: #ecfdf5;--card: rgba(255, 255, 255, .82);--card-solid: #ffffff;--ink: #362f4d;--ink-soft: #5b5478;--muted: #9a93b6;--line: #efe9f7;--brand: #ff77aa;--brand-dark: #f2478a;--brand-soft: #ffe6f1;--accent: #ffb347;--grape: #9d7bf5;--sky: #4cc4f2;--mint: #3fd6a3;--danger: #ff6b8a;--shadow: 0 14px 34px -12px rgba(140, 100, 190, .32), 0 4px 10px -4px rgba(140, 100, 190, .18);--shadow-sm: 0 6px 16px -6px rgba(140, 100, 190, .28);--radius: 26px;--radius-sm: 16px;--font-display: "Fredoka", "Nunito", -apple-system, "PingFang SC", sans-serif;--font-body: "Nunito", -apple-system, BlinkMacSystemFont, "PingFang SC", "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{margin:0;font-family:var(--font-body);color:var(--ink);line-height:1.55;background:#fbf8ff;overflow-x:hidden}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;background:radial-gradient(46% 34% at 88% -4%,var(--bg1),transparent 70%),radial-gradient(42% 30% at 4% 8%,var(--bg2),transparent 72%),radial-gradient(60% 40% at 50% 108%,var(--bg3),transparent 70%),linear-gradient(180deg,#fdfbff,#f7f3ff)}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;background:none;border:none;color:inherit;padding:0;margin:0}.app{max-width:560px;margin:0 auto;min-height:100%;position:relative;padding-bottom:96px}.topbar{padding:24px 22px 6px}.hi{font-size:13.5px;color:var(--muted);font-weight:700}.hi b{color:var(--brand-dark)}.h1{font-family:var(--font-display);font-size:27px;font-weight:700;margin:4px 0 0;letter-spacing:.2px;display:flex;align-items:center;gap:8px}.h2{font-size:17px;font-weight:800;margin:24px 2px 13px;display:flex;align-items:center;gap:9px}.h2:before{content:"";width:5px;height:18px;border-radius:3px;background:linear-gradient(var(--brand),var(--grape))}.page{padding:0 16px 16px}.card{background:var(--card);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);border:1px solid rgba(255,255,255,.7);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;margin-bottom:15px;animation:pop-in .5s cubic-bezier(.2,.8,.3,1.05) both;position:relative}.card.tight{padding:13px 15px}.progress{height:12px;background:#9a93b62e;border-radius:999px;overflow:hidden}.progress>i{display:block;height:100%;border-radius:999px;transition:width .6s cubic-bezier(.2,.8,.3,1);background:linear-gradient(90deg,var(--mint),var(--sky),var(--grape));background-size:220% 100%;animation:shimmer 3s linear infinite}.task{display:flex;align-items:center;gap:14px;padding:14px 4px;border-bottom:1px solid rgba(154,147,182,.12)}.task:last-child{border-bottom:none}.task .ico{width:50px;height:50px;border-radius:17px;flex:none;display:grid;place-items:center;font-size:24px;background:var(--brand-soft);box-shadow:0 8px 16px -8px #8c64be80,inset 0 1px #fff9;transition:transform .18s cubic-bezier(.2,.8,.3,1.4)}.task .ico:active{transform:scale(.86) rotate(-7deg)}.task .ico.vocab{background:linear-gradient(145deg,#f3ecff,#e6dcff)}.task .ico.listening{background:linear-gradient(145deg,#e6f5ff,#d6ecfe)}.task .ico.reading{background:linear-gradient(145deg,#fff2e0,#ffe6cc)}.task .ico.speaking{background:linear-gradient(145deg,#ffe9ef,#ffd8e3)}.task .ico.writing{background:linear-gradient(145deg,#e3f9ef,#d2f4e3)}.task .ico.course{background:linear-gradient(145deg,#e5f8fb,#d3f1f7)}.task .ico.custom{background:linear-gradient(145deg,#fff2d6,#ffe8b8)}.task .mid{flex:1;min-width:0}.task .t-label{font-weight:800;font-size:15.5px;letter-spacing:.2px}.task .t-detail{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:1px}.task .check{width:31px;height:31px;border-radius:50%;border:2.5px solid rgba(154,147,182,.3);display:grid;place-items:center;color:#fff;font-size:16px;flex:none;background:#ffffff80;transition:transform .12s}.task .check:active{transform:scale(.82)}.task.done .check{background:linear-gradient(135deg,var(--mint),var(--sky));border-color:transparent;box-shadow:0 6px 14px -5px var(--mint);animation:check-pop .4s cubic-bezier(.2,.9,.3,1.5)}.task.done .t-label{color:var(--muted);text-decoration:line-through}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;color:#fff;font-weight:800;font-size:15.5px;letter-spacing:.3px;padding:15px 18px;border-radius:17px;width:100%;background:linear-gradient(135deg,#ff9cc2,var(--brand) 45%,var(--brand-dark));box-shadow:0 12px 22px -10px #f2478ab3,inset 0 1px #fff6;transition:transform .12s,box-shadow .12s,filter .12s}.btn:active{transform:translateY(2px) scale(.985);box-shadow:0 6px 14px -8px #f2478ab3}.btn.ghost{background:#ff77aa21;color:var(--brand-dark);box-shadow:none}.btn.line{background:#ffffffb3;border:1.5px solid var(--line);color:var(--ink);box-shadow:var(--shadow-sm)}.btn.sm{width:auto;padding:10px 15px;font-size:14px;border-radius:13px}.btn:disabled{opacity:.42;box-shadow:none}.row{display:flex;gap:10px}.opt{display:block;width:100%;text-align:left;background:#ffffffc7;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1.5px solid rgba(154,147,182,.2);border-radius:var(--radius-sm);padding:15px;font-size:15.5px;margin-bottom:11px;color:var(--ink);font-weight:600;box-shadow:var(--shadow-sm);transition:transform .1s,border-color .18s,background .18s,box-shadow .18s}.opt:active{transform:scale(.985)}.opt.correct{border-color:var(--mint);background:linear-gradient(135deg,#e9fbf3,#dff7ef);box-shadow:0 10px 20px -12px var(--mint);animation:check-pop .4s}.opt.wrong{border-color:var(--danger);background:linear-gradient(135deg,#fff0f3,#ffe6ec);animation:shake .38s}.wordcard{text-align:center;padding:32px 16px;overflow:hidden}.wordcard:before{content:"";position:absolute;top:-40px;left:50%;transform:translate(-50%);width:200px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(255,119,170,.14),transparent 70%)}.wordcard .word{font-family:var(--font-display);font-size:42px;font-weight:700;letter-spacing:.5px;background:linear-gradient(120deg,var(--brand-dark),var(--grape) 60%,var(--sky));-webkit-background-clip:text;background-clip:text;color:transparent;position:relative}.wordcard .phon{color:var(--muted);margin:10px 0 2px;font-weight:700}.pill{display:inline-block;font-size:11px;padding:5px 12px;border-radius:999px;background:linear-gradient(135deg,var(--brand-soft),#f3ecff);color:var(--brand-dark);font-weight:800;box-shadow:inset 0 0 0 1px #fff9}.tabbar{position:fixed;left:14px;right:14px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:20;max-width:520px;margin:0 auto;background:#ffffffb8;backdrop-filter:blur(24px) saturate(1.6);-webkit-backdrop-filter:blur(24px) saturate(1.6);border:1px solid rgba(255,255,255,.85);border-radius:26px;display:grid;grid-template-columns:repeat(5,1fr);gap:2px;padding:8px;box-shadow:0 18px 40px -14px #8c64be66,0 4px 12px -6px #8c64be33,inset 0 1px #ffffffb3}.tab{display:grid;place-items:center;gap:3px;padding:8px 0 7px;border-radius:17px;color:var(--muted);font-size:10.5px;font-weight:700;position:relative;transition:transform .14s,background .2s,color .2s}.tab .ti{font-size:21px;line-height:1;transition:transform .25s cubic-bezier(.2,.8,.3,1.5);filter:grayscale(.3) opacity(.6)}.tab:active{transform:scale(.92)}.tab.active{color:var(--brand-dark);background:linear-gradient(160deg,#ff77aa29,#9d7bf524);box-shadow:inset 0 0 0 1px #ffffff80}.tab.active .ti{transform:translateY(-2px) scale(1.16);filter:none;animation:bounce .55s}.muted{color:var(--muted)}.small{font-size:12.5px}.center{text-align:center}.prose p{margin:0 0 12px}.prose{white-space:pre-wrap;font-size:15px;color:var(--ink-soft)}.tag{display:inline-block;font-size:11px;padding:3px 9px;border-radius:8px;background:#9a93b624;color:var(--muted);margin:0 6px 6px 0;font-weight:700}.kpt{background:linear-gradient(135deg,#fff6fbe6,#f3ecffe6);border:1px solid rgba(157,123,245,.18);border-left:4px solid var(--grape);padding:12px 14px;border-radius:14px;margin:8px 0;font-size:13.5px;color:var(--ink-soft)}textarea,input{width:100%;border:1.5px solid rgba(154,147,182,.25);border-radius:var(--radius-sm);padding:14px;font-family:inherit;font-size:15.5px;color:var(--ink);background:#fffc;resize:vertical;transition:border-color .15s,box-shadow .15s}textarea:focus,input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px #ff77aa26}.badge-num{font-family:var(--font-display);font-size:32px;font-weight:700}.stat{display:flex;gap:14px}.stat .box{flex:1;text-align:center}.hero{color:#fff;border-radius:var(--radius);padding:22px 20px;background:linear-gradient(135deg,#ff9ec4,#ff6fa8 42%,#a074f0);box-shadow:0 22px 44px -18px #a064dc99,inset 0 1px #ffffff4d;position:relative;overflow:hidden;animation:pop-in .55s cubic-bezier(.2,.8,.3,1.05) both}.hero-blob{position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}.hero-blob.b1{width:160px;height:160px;right:-46px;top:-60px;background:#ffffff2e}.hero-blob.b2{width:110px;height:110px;left:-34px;bottom:-50px;background:#ffffff1f}.hero-blob.b3{width:14px;height:14px;right:40px;top:30px;background:#ffffff80;filter:none}.hero-blob.b4{width:8px;height:8px;right:70px;top:64px;background:#fff6;filter:none}.hero-top{display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:1}.hero-greet{font-family:var(--font-display);font-size:20px;font-weight:600}.hero-sub{font-size:12.5px;color:#ffffffd1;font-weight:700;margin-top:2px}.hero-streak{display:grid;place-items:center;background:#fff3;border-radius:15px;padding:8px 12px;font-family:var(--font-display);font-weight:700;font-size:20px;line-height:1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:inset 0 0 0 1px #ffffff40}.hero-streak span{font-size:10px;font-weight:700;color:#ffffffd9;margin-top:3px;letter-spacing:1px}.hero-main{display:flex;align-items:center;gap:18px;margin-top:18px;position:relative;z-index:1}.hero-ring-center b{font-family:var(--font-display);font-size:22px;font-weight:700;display:block}.hero-ring-center span{font-size:10px;color:#ffffffd9;font-weight:700}.hero-mini{flex:1;display:grid;gap:8px}.hero-mini-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700}.hero-mini-row .v{font-family:var(--font-display);font-weight:700}.hero .badge-num{color:#fff}.hero .small{color:#ffffffe6}.link{color:var(--grape);font-weight:800}.divider{height:1px;background:#9a93b629;margin:15px 0}.back{font-size:14px;color:var(--muted);padding:12px 4px;display:inline-block;font-weight:700}.back:active{color:var(--brand)}.result-big{font-family:var(--font-display);font-size:50px;font-weight:700;text-align:center}.mascot{font-size:56px;display:inline-block;animation:float 3.4s ease-in-out infinite;filter:drop-shadow(0 8px 12px rgba(160,120,200,.35))}.wiggle{display:inline-block;animation:wiggle 1.4s ease-in-out infinite}.kbd-tip{font-size:11px;color:var(--brand-dark);background:linear-gradient(135deg,var(--brand-soft),#f3ecff);padding:5px 11px;border-radius:999px;white-space:nowrap;font-weight:800;box-shadow:inset 0 0 0 1px #fff9}.opt-key{display:flex;align-items:center;gap:13px}.keyhint{width:28px;height:28px;border-radius:9px;background:#9a93b629;color:var(--muted);font-family:var(--font-display);font-weight:600;font-size:14px;display:grid;place-items:center;flex:none;box-shadow:inset 0 -2px #9a93b62e}.opt.correct .keyhint{background:var(--mint);color:#fff;box-shadow:none}.opt.wrong .keyhint{background:var(--danger);color:#fff;box-shadow:none}.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px 2px}.cal-head{text-align:center;font-size:11px;color:var(--muted);font-weight:800;padding-bottom:4px}.cal-cell{display:grid;place-items:center;padding:3px 0;position:relative;cursor:pointer}.cal-day-num{position:absolute;font-family:var(--font-display);font-size:11px;font-weight:600;color:var(--ink)}.cal-cell.dim .cal-day-num{color:#d8d3e6}.cal-cell.today:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;box-shadow:0 0 0 2.5px var(--brand)}.ring-full{filter:drop-shadow(0 2px 8px rgba(63,214,163,.5))}@keyframes pop-in{0%{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}@keyframes shimmer{to{background-position:220% 0}}@keyframes float{0%,to{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-11px) rotate(4deg)}}@keyframes wiggle{0%,to{transform:rotate(-9deg)}50%{transform:rotate(9deg)}}@keyframes bounce{0%,to{transform:translateY(-3px) scale(1.18)}40%{transform:translateY(-7px) scale(1.28)}}@keyframes check-pop{0%{transform:scale(.4)}60%{transform:scale(1.16)}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}@keyframes confetti-fall{to{transform:translateY(110vh) rotate(720deg);opacity:.9}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important}}