@import "https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap";:root{--bg:#f4edf1;--surface:#fff;--surface2:#f0f1f8;--ink:#182559;--muted:#7d87ab;--line:#18255917;--blue:#2b50d8;--blue-soft:#e3e9fc;--navy:#141f4b;--navy-ink:#fff;--pink:#f7d7e3;--pink-ink:#b93f6e;--coral:#ee6352;--coral-bg:#fde5e1;--coral-ink:#c14434;--yellow-bg:#fbeec9;--yellow-ink:#8a6a10;--yellow:#f0bd3a;--teal:#54c1ac;--teal-bg:#dcf2ed;--teal-ink:#1e7d6b;--purple:#7857f0;--purple-bg:#e9e3fd;--purple-ink:#5636c9;--shadow:0 4px 14px #1825590f, 0 1px 3px #1825590d}[data-theme=dark]{--bg:#0b102b;--surface:#151c40;--surface2:#1d2652;--ink:#edf0fc;--muted:#8d98c6;--line:#edf0fc1a;--blue:#5d7ef7;--blue-soft:#22306c;--navy:#26336e;--navy-ink:#fff;--pink:#4a2740;--pink-ink:#f2a9c6;--coral:#f27a69;--coral-bg:#48231f;--coral-ink:#f5a396;--yellow-bg:#453714;--yellow-ink:#f5cf6b;--yellow:#f0bd3a;--teal:#5fd3bc;--teal-bg:#16413a;--teal-ink:#78dfc9;--purple:#8b74f7;--purple-bg:#2c2359;--purple-ink:#b3a4fb;--shadow:0 4px 14px #00000038, 0 1px 3px #0003}*{box-sizing:border-box}html,body,#root{height:100%}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}html,body{max-width:100%;overflow-x:hidden}body{background:var(--bg);color:var(--ink);margin:0;font-family:Manrope,system-ui,sans-serif;transition:background .3s}input,select,textarea,button{font-family:inherit}@keyframes vcbUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes vcbSpin{to{transform:rotate(360deg)}}@keyframes vcbZoom{0%{opacity:0;transform:perspective(1400px)translateY(40px)scale(.55)rotateY(-75deg)}55%{opacity:1}to{opacity:1;transform:perspective(1400px) none}}@keyframes vcbPop{0%{opacity:0;transform:scale(.4)}60%{transform:scale(1.15)}to{opacity:1;transform:scale(1)}}@keyframes vcbRing{0%{stroke-dashoffset:358.14px}}@keyframes vcbBackdrop{0%{opacity:0}to{opacity:1}}@keyframes vcbPopIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes vcbIconIn{0%{opacity:0;transform:scale(.8)}55%{opacity:1;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes vcbWave{0%,60%,to{transform:rotate(0)}10%{transform:rotate(15deg)}20%{transform:rotate(-9deg)}30%{transform:rotate(15deg)}40%{transform:rotate(-5deg)}50%{transform:rotate(11deg)}}@keyframes vcbConfettiFall{0%{opacity:1;transform:translateY(-12vh)rotate(0)}85%{opacity:1}to{transform:translate3d(var(--drift,0), 112vh, 0) rotate(var(--spin,540deg));opacity:0}}@keyframes tpScrim{0%{opacity:0}to{opacity:1}}@keyframes tpDialog{0%{opacity:0;transform:translateY(24px)scale(.94)}60%{opacity:1}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes trophyPop{0%{opacity:0;transform:scale(.2)translateY(24px)rotate(-14deg)}55%{opacity:1;transform:scale(1.14)translateY(-6px)rotate(3deg)}72%{transform:scale(.96)translateY(2px)rotate(-1.5deg)}86%{transform:scale(1.03)translateY(0)rotate(.5deg)}to{opacity:1;transform:scale(1)translateY(0)rotate(0)}}@keyframes glowIn{0%{opacity:0;transform:scale(.3)}60%{opacity:.95}to{opacity:.8;transform:scale(1)}}@keyframes glowPulse{0%,to{opacity:.6;transform:scale(1)}50%{opacity:.9;transform:scale(1.06)}}@keyframes cardPop{0%{opacity:0;transform:translate(-40%,30px)scale(.4)rotate(-16deg)}60%{opacity:1;transform:translateY(-6px)scale(1.08)rotate(-6deg)}80%{transform:translateY(2px)scale(.98)rotate(-8deg)}to{opacity:1;transform:translate(0)scale(1)rotate(-7deg)}}@keyframes sparkPop{0%{opacity:0;transform:scale(0)rotate(-40deg)}60%{opacity:1;transform:scale(1.25)rotate(8deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes twinkle{0%,to{opacity:.35;transform:scale(.82)}50%{opacity:1;transform:scale(1.1)}}@keyframes floatY{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes riseIn{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes iconPop{0%{opacity:0;transform:scale(0)rotate(-30deg)}60%{opacity:1;transform:scale(1.18)rotate(6deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes cfL{0%{opacity:0;transform:translateY(0)rotate(0)}6%{opacity:1}to{opacity:1;transform:translateY(124vh)translate(-46px)rotate(560deg)}}@keyframes cfR{0%{opacity:0;transform:translateY(0)rotate(0)}6%{opacity:1}to{opacity:1;transform:translateY(124vh)translate(46px)rotate(-560deg)}}.lesson-scroll::-webkit-scrollbar{width:8px}.lesson-scroll::-webkit-scrollbar-track{background:var(--surface2);border-radius:8px}.lesson-scroll::-webkit-scrollbar-thumb{background:var(--muted);border:2px solid var(--surface2);border-radius:8px}.lesson-scroll::-webkit-scrollbar-thumb:hover{background:var(--ink)}.tile-gfx{transform-origin:100% 100%;will-change:transform;transition:transform .5s cubic-bezier(.32,.72,0,1)}[data-tile]:hover .tile-gfx{transform:scale(1.14)rotate(-5deg)}[data-tile]:active .tile-gfx{transition:transform .12s;transform:scale(.9)rotate(2deg)}.vcb-hover-lift{transition:transform .35s cubic-bezier(.32,.72,0,1)}.vcb-hover-lift:hover{transform:translateY(-2px)}.vcb-ring-anim{transition:stroke-dashoffset .6s;animation:1.1s cubic-bezier(.32,.72,0,1) both vcbRing}@keyframes nudgePulse{0%,to{opacity:.95;transform:translateY(0)scale(1)}50%{opacity:1;transform:translateY(-2px)scale(1.02)}}.btn{cursor:pointer;color:#fff;background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 84%, #fff), var(--accent));box-shadow:0 5px 12px -7px color-mix(in srgb, var(--accent) 32%, transparent), inset 0 1px 0 #fff6;border:none;border-radius:16px;justify-content:center;align-items:center;gap:8px;padding:13px 28px;font-size:14px;font-weight:800;transition:transform .28s cubic-bezier(.32,.72,0,1),box-shadow .28s;display:inline-flex}.btn:hover{box-shadow:0 9px 18px -9px color-mix(in srgb, var(--accent) 42%, transparent), inset 0 1px 0 #ffffff80;transform:translateY(-3px)}.btn:active{box-shadow:0 3px 7px -6px color-mix(in srgb, var(--accent) 34%, transparent), inset 0 2px 6px #00000038;transform:translateY(0)}.btn--dark-ink{color:#5a4408}.btn:disabled{opacity:.5;cursor:default;transform:none!important}.btn-neutral{cursor:pointer;background:linear-gradient(180deg, color-mix(in srgb, var(--surface2) 90%, var(--ink) 3%), var(--surface2));color:var(--ink);border:none;border-radius:16px;justify-content:center;align-items:center;gap:8px;padding:14px 28px;font-size:14px;font-weight:800;transition:transform .28s cubic-bezier(.32,.72,0,1),box-shadow .28s,background .2s;display:inline-flex;box-shadow:0 5px 14px -9px #090d2180}.btn-neutral:hover{background:linear-gradient(180deg, color-mix(in srgb, var(--surface2) 84%, var(--ink) 6%), var(--surface2));transform:translateY(-3px);box-shadow:0 10px 20px -10px #090d218c}.btn-neutral:active{transform:translateY(0);box-shadow:inset 0 2px 6px #0000002e}.lift-sm{transition:transform .35s cubic-bezier(.32,.72,0,1),color .2s}.lift-sm:hover{transform:translateY(-1px)}.lift-x{transition:transform .35s cubic-bezier(.32,.72,0,1),color .2s,background .15s}.lift-x:hover{background:var(--surface2);transform:translate(3px)}.lift-x-back{transition:transform .35s cubic-bezier(.32,.72,0,1),color .2s}.lift-x-back:hover{color:var(--ink);transform:translate(-3px)}.lift-scale{transition:transform .35s cubic-bezier(.32,.72,0,1),background .2s}.lift-scale:hover{transform:scale(1.1)}.lift-up{transition:transform .35s cubic-bezier(.32,.72,0,1)}.lift-up:hover{transform:translateY(-2px)}.quiz-option{transition:transform .35s cubic-bezier(.32,.72,0,1),background .15s,border-color .15s}.quiz-option:hover:not(:disabled){border-color:var(--blue);transform:translateY(-1px)}.tile{cursor:pointer;text-align:left;border:none;flex-direction:column;justify-content:space-between;transition:transform .3s cubic-bezier(.32,.72,0,1),box-shadow .3s;display:flex;position:relative}.tile:hover{transform:translateY(-3px)}.tile-clip{border-radius:inherit;pointer-events:none;position:absolute;inset:0;overflow:hidden}.tile-navy{background:linear-gradient(160deg, color-mix(in srgb, var(--navy) 86%, #fff), var(--navy));color:var(--navy-ink);box-shadow:0 8px 18px -14px #090d218c,inset 0 1px #ffffff2e}.tile-navy:hover{box-shadow:0 22px 40px -20px #141c3c99,0 6px 14px -8px #141c3c3d,inset 0 1px #ffffff38}.tile-coral{background:linear-gradient(160deg, color-mix(in srgb, var(--coral) 88%, #fff), var(--coral));color:#fff;box-shadow:0 8px 18px -14px #090d2166,inset 0 1px #ffffff47}.tile-coral:hover{box-shadow:0 22px 38px -18px color-mix(in srgb, var(--coral) 62%, transparent), 0 6px 14px -8px #141c3c33, inset 0 1px 0 #ffffff57}.tile-yellow{background:linear-gradient(160deg, color-mix(in srgb, var(--yellow) 90%, #fff), var(--yellow));color:#5a4408;box-shadow:0 8px 18px -14px #090d2159,inset 0 1px #ffffff80}.tile-yellow:hover{box-shadow:0 22px 38px -18px color-mix(in srgb, var(--yellow) 68%, transparent), 0 6px 14px -8px #141c3c2e, inset 0 1px 0 #fff9}.tile-teal{background:linear-gradient(160deg, color-mix(in srgb, var(--teal) 90%, #fff), var(--teal));color:#0c3f36;box-shadow:0 8px 18px -14px #090d2159,inset 0 1px #ffffff59}.tile-teal:hover{box-shadow:0 22px 38px -18px color-mix(in srgb, var(--teal) 62%, transparent), 0 6px 14px -8px #141c3c2e, inset 0 1px 0 #ffffff73}.tile-purple{background:linear-gradient(160deg, color-mix(in srgb, var(--purple) 84%, #fff), var(--purple));color:#fff;box-shadow:0 8px 18px -14px #090d2166,inset 0 1px #ffffff47}.tile-purple:hover{box-shadow:0 22px 38px -18px color-mix(in srgb, var(--purple) 62%, transparent), 0 6px 14px -8px #141c3c33, inset 0 1px 0 #ffffff57}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media (width<=1024px){.vocalize-container,.grammar-container,.flashcards-container,.smart-review-container{min-height:auto!important}}@media (width>=680px) and (width<=1024px){.dashboard-container{height:calc(100vh - 152px)!important;min-height:auto!important}.dashboard-grid{grid-template-columns:minmax(0,1.25fr) minmax(280px,1fr)!important;gap:16px!important}.tiles-grid{grid-template-rows:1.2fr 1fr 1fr!important;align-self:stretch!important;height:100%!important}.vocalize-container,.grammar-container,.flashcards-container,.smart-review-container{height:calc(100vh - 152px)!important}}@media (width<=679px){.dashboard-container{height:auto!important;min-height:auto!important}.dashboard-grid{grid-template-columns:1fr!important;gap:16px!important}.tiles-grid{grid-template-rows:auto!important;align-self:start!important;height:auto!important}.vocalize-container,.grammar-container,.flashcards-container,.smart-review-container{height:auto!important}}@media (width<=580px){.stats-grid{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}.tiles-grid{grid-template-columns:1fr!important;gap:12px!important}}@media (width>=680px){.lessons-card{max-height:560px!important}.tiles-grid{grid-template-rows:1.2fr 1fr 1fr!important;max-height:766px!important}}@media (width<=679px){.lessons-card,.tiles-grid{max-height:none!important}}
