@font-face{font-family:Nunito;font-style:normal;font-display:swap;font-weight:600;src:url(./nunito-cyrillic-600-normal-DJGQ2h05.woff2) format("woff2"),url(./nunito-cyrillic-600-normal-BUjmtIuu.woff) format("woff")}@font-face{font-family:Nunito;font-style:normal;font-display:swap;font-weight:800;src:url(./nunito-cyrillic-800-normal-D3igD7Kl.woff2) format("woff2"),url(./nunito-cyrillic-800-normal-DymMgApb.woff) format("woff")}@font-face{font-family:Nunito;font-style:normal;font-display:swap;font-weight:600;src:url(./nunito-latin-600-normal-Br8yIETf.woff2) format("woff2"),url(./nunito-latin-600-normal-Cd0eNu1l.woff) format("woff")}@font-face{font-family:Nunito;font-style:normal;font-display:swap;font-weight:800;src:url(./nunito-latin-800-normal-Dz8SOQK_.woff2) format("woff2"),url(./nunito-latin-800-normal-D-J0wlBY.woff) format("woff")}@font-face{font-family:Rubik;font-style:normal;font-display:swap;font-weight:800;src:url(./rubik-cyrillic-800-normal-wonQiwhm.woff2) format("woff2"),url(./rubik-cyrillic-800-normal-DocVmW4N.woff) format("woff")}@font-face{font-family:Rubik;font-style:normal;font-display:swap;font-weight:800;src:url(./rubik-latin-800-normal-BtaGuVpR.woff2) format("woff2"),url(./rubik-latin-800-normal-Dq1miTTj.woff) format("woff")}:root{--bg1: #1a0b3d;--bg2: #3b1a78;--bg3: #0d2a5c;--text: #fff9ef;--muted: #cbbcf3;--gold: #ffe066;--glass: rgba(255, 255, 255, .09);--glass-border: rgba(255, 255, 255, .18);--weak: #ff5d73;--mid: #ffb547;--strong: #3ee6a0}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:Nunito,system-ui,sans-serif;font-weight:600;color:var(--text);background:radial-gradient(ellipse at 20% 0%,var(--bg2),transparent 60%),radial-gradient(ellipse at 90% 100%,var(--bg3),transparent 60%),var(--bg1);background-attachment:fixed;overflow-x:hidden;-webkit-tap-highlight-color:transparent}button{font-family:inherit;cursor:pointer}.sky{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0}.star{position:absolute;border-radius:50%;background:#fff;animation:twinkle ease-in-out infinite}@keyframes twinkle{0%,to{opacity:.2;transform:scale(.8)}50%{opacity:1;transform:scale(1.3)}}.moon{position:absolute;top:6%;right:7%;width:90px;height:90px;border-radius:50%;background:#fff4c4;box-shadow:0 0 60px 20px #fff0b459,inset -18px -10px #f1dc93}.fullscreen{position:fixed;top:14px;left:14px;z-index:10;width:44px;height:44px;border-radius:12px;border:1px solid var(--glass-border);background:var(--glass);color:var(--text);font-size:22px;opacity:.5}.fullscreen:hover{opacity:1}.screen{position:relative;z-index:1;max-width:1280px;margin:0 auto;padding:24px 16px 48px;display:flex;flex-direction:column;align-items:center;gap:26px}.hero{display:flex;align-items:center;gap:24px;flex-wrap:wrap;justify-content:center}.hero__text{display:flex;flex-direction:column;gap:14px;max-width:620px}.title{margin:0;font-family:Rubik,Nunito,sans-serif;font-weight:800;font-size:clamp(38px,6vw,72px);line-height:1;letter-spacing:.5px;text-shadow:0 4px 0 #2a1060,0 0 30px rgba(255,224,102,.4)}.title span{background:linear-gradient(90deg,#ffe066,#ff8fd8,#8ff0ff);-webkit-background-clip:text;background-clip:text;color:transparent}.bubble{position:relative;background:#fff;color:#2a1747;border-radius:24px;padding:16px 22px;font-size:clamp(18px,2vw,24px);line-height:1.35;box-shadow:0 10px 30px #0000004d;animation:pop .4s cubic-bezier(.2,1.6,.4,1);max-width:640px}.bubble:before{content:"";position:absolute;left:-14px;top:30px;border:10px solid transparent;border-right:16px solid #fff;border-left:0}@keyframes pop{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.wizard{overflow:visible;filter:drop-shadow(0 12px 24px rgba(0,0,0,.35));flex-shrink:0}.wizard__body{animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.wizard--happy .wizard__body{animation:hop .6s ease-in-out infinite}@keyframes hop{0%,to{transform:translateY(0)}40%{transform:translateY(-16px)}}.wizard__eyes{transform-box:fill-box;transform-origin:center;animation:blink 4s infinite}@keyframes blink{0%,94%,to{transform:scaleY(1)}97%{transform:scaleY(.1)}}.wizard__arm{transform-box:view-box;transform-origin:130px 145px;animation:wave 2.4s ease-in-out infinite}.wizard--casting .wizard__arm{animation:wave .5s ease-in-out infinite alternate}@keyframes wave{0%,to{transform:rotate(-6deg)}50%{transform:rotate(10deg)}}.wizard__glow{animation:glow 1.2s ease-in-out infinite;transform-box:fill-box;transform-origin:center}@keyframes glow{0%,to{opacity:.6;transform:scale(.85)}50%{opacity:1;transform:scale(1.2)}}.wizard__tip{transform-box:fill-box;transform-origin:center;animation:spin 3s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.wizard__spark{animation:spark 1.3s ease-out infinite;opacity:0}@keyframes spark{0%{transform:translate(0) scale(.4);opacity:1}to{transform:translate(var(--dx),var(--dy)) scale(1.2);opacity:0}}.wizard--casting .wizard__mouth{animation:chant .35s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}@keyframes chant{to{transform:scaleY(.4)}}.alphabet{display:flex;flex-direction:column;align-items:center;gap:12px}.alphabet__label{color:var(--muted);font-size:18px}.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.chip{display:flex;align-items:center;gap:10px;padding:10px 18px;border-radius:999px;border:2px solid var(--glass-border);background:var(--glass);color:var(--text);font-size:17px;font-weight:800;text-align:left;transition:transform .15s,background .2s,border-color .2s}.chip small{display:block;font-size:13px;color:var(--muted);font-weight:600}.chip__emoji{font-size:26px}.chip:hover{transform:translateY(-2px)}.chip--on{background:linear-gradient(135deg,#ffe0664d,#ff8fd84d);border-color:var(--gold);box-shadow:0 0 20px #ffe06659}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;width:100%}@media (max-width: 900px){.cards{grid-template-columns:1fr}}.card{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;padding:26px 18px 22px;border-radius:28px;background:var(--glass);border:2px solid var(--glass-border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 0 0 0 var(--glow);transition:box-shadow .3s,border-color .3s,transform .3s;min-width:0}.card:focus-within{border-color:var(--accent);box-shadow:0 0 34px 2px var(--glow);transform:translateY(-4px)}.card__mascot{font-size:64px;line-height:1;animation:float 3s ease-in-out infinite}.card__title{font-family:Rubik,sans-serif;font-weight:800;font-size:28px;color:var(--accent)}.card__sub{color:var(--muted);font-size:18px;margin-top:-6px}.card__combos{color:var(--muted);font-size:16px}.card__combos b{color:var(--text)}.card__actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.mini{border:0;border-radius:999px;padding:8px 14px;background:#ffffff24;color:var(--text);font-size:15px;font-weight:800}.mini:hover{background:#ffffff3d}.cells{position:relative;display:flex;gap:8px;justify-content:center;flex-wrap:nowrap;padding:6px;cursor:text;max-width:100%}.cells__input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;opacity:0;font-size:16px;border:0;caret-color:transparent}.cell{width:clamp(36px,4.2vw,52px);height:clamp(48px,5.6vw,66px);border-radius:14px;background:#0a041e73;border:3px solid rgba(255,255,255,.2);display:grid;place-items:center;font-family:Rubik,monospace;font-weight:800;font-size:clamp(22px,2.6vw,32px);color:#fff;transition:border-color .2s,transform .15s,background .2s;flex-shrink:1;min-width:0}.cell--filled{border-color:var(--accent);background:#ffffff1f;animation:pop .25s cubic-bezier(.2,1.6,.4,1)}.cell--active{border-color:#fff;box-shadow:0 0 16px var(--glow);animation:pulse 1s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.07)}}.start{font-family:Rubik,sans-serif;font-weight:800;font-size:clamp(22px,3vw,32px);padding:18px 44px;border-radius:999px;border:0;color:#6b6386;background:#ffffff26;cursor:not-allowed;transition:transform .15s}.start--ready{cursor:pointer;color:#2a1747;background:linear-gradient(90deg,#ffe066,#ffb547,#ff8fd8,#ffe066);background-size:300% 100%;box-shadow:0 8px #9b4f8a,0 0 40px #ffe06680;animation:shimmer 4s linear infinite,pulse 1.6s ease-in-out infinite}.start--ready:active{transform:translateY(6px);box-shadow:0 2px #9b4f8a}@keyframes shimmer{to{background-position:300% 0}}.hero--result .bubble{max-width:720px}.speed-note{color:var(--muted);font-size:18px;padding:8px 18px;border-radius:999px;background:var(--glass);text-align:center}.speed-note b{color:var(--gold)}.result{opacity:0;transform:translateY(40px) scale(.92);transition:opacity .6s,transform .6s cubic-bezier(.2,1.4,.4,1)}.result--shown{opacity:1;transform:none;border-color:var(--accent);box-shadow:0 0 34px 2px var(--glow)}.dots{display:flex;gap:6px;color:var(--gold);font-size:22px}.result--shown .dots span{animation:pop .4s backwards}.formula{font-family:Rubik,monospace;font-weight:800;color:var(--muted);font-size:17px;text-align:center;word-break:break-word}.big-number{font-family:Rubik,sans-serif;font-weight:800;font-size:clamp(28px,3.4vw,44px);color:var(--accent);line-height:1;text-shadow:0 0 20px var(--glow);text-align:center;word-break:break-word}.big-number__label{color:var(--muted);margin-top:-6px}.time{width:100%;display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:6px}.time__label{font-size:15px;color:var(--muted);text-align:center}.time__value{font-family:Rubik,sans-serif;font-weight:800;font-size:clamp(22px,2.4vw,30px);text-align:center}.bar{width:100%;height:16px;border-radius:999px;background:#00000059;overflow:hidden}.bar__fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--strong),var(--mid),var(--weak));background-size:300px 100%;transition:width 1.4s cubic-bezier(.3,1.2,.4,1) .3s}.result--weak .bar__fill{background:var(--weak)}.result--mid .bar__fill{background:linear-gradient(90deg,var(--weak),var(--mid))}.result--strong .bar__fill{background:linear-gradient(90deg,var(--weak),var(--mid),var(--strong))}.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;border-radius:999px;font-weight:800;font-size:20px;color:#1a0b3d;margin-top:4px}.badge__icon{font-size:24px}.badge--weak{background:var(--weak)}.badge--mid{background:var(--mid)}.badge--strong{background:var(--strong)}.result--shown .badge{animation:pop .5s cubic-bezier(.2,1.6,.4,1) .9s backwards}.result--shown.result--weak .badge__icon{animation:wiggle .5s ease-in-out 1.4s 3}@keyframes wiggle{25%{transform:rotate(-15deg)}75%{transform:rotate(15deg)}}.compare{text-align:center;font-size:17px;line-height:1.35;min-height:46px}.lesson{width:100%;max-width:900px;padding:24px 28px;border-radius:28px;background:linear-gradient(135deg,#ffe06629,#8ff0ff1f);border:2px solid rgba(255,224,102,.5);opacity:0;transform:translateY(30px);transition:opacity .7s 1s,transform .7s 1s}.lesson--shown{opacity:1;transform:none}.lesson h2{margin:0 0 8px;font-family:Rubik,sans-serif;font-size:28px;color:var(--gold)}.lesson__main{font-size:22px;margin:0 0 12px}.lesson__main b{color:var(--gold)}.lesson ul{margin:0;padding-left:0;list-style:none;display:grid;gap:10px;font-size:18px;line-height:1.4}@media (max-width: 600px){.moon{width:56px;height:56px}.bubble:before{display:none}.cells{gap:5px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
