:root{--c-brand-blue:#4a89f0;--c-brand-indigo:#5e5ff9;--c-brand-violet:#4b3ec2;--c-brand-cyan:#32bce5;--c-brand-sky:#51a7fe;--c-brand-teal:#55cae8;--c-gold:#fbcd19;--c-gold-deep:#e06602;--c-success:#43b18e;--c-danger:#e2453c;--c-star-on:#f5c32b;--c-star-off:#8f9aa6;--c-ink:#0e233b;--c-ink-soft:#384152;--c-slate:#6f7783;--c-muted:#86919d;--c-line:#b2bec3;--c-track:#4b3ec2;--c-surface:#fff;--c-surface-alt:#e7eff8;--c-overlay:#0612269e;--g-app:linear-gradient(180deg, #455df4 0%, #5dbaed 7%, #55cae8 11%, #32bce5 18%, #4a89f0 36%, #5e5ff9 50%, #5d4bf3 71%, #5d3eef 90%);--g-play:linear-gradient(180deg, #0062cb 0%, #00cbff 22%, #0faff4 60%, #1d5cb3 100%);--g-win:linear-gradient(180deg, #1ee7dd 0%, #4c84f0 55%, #43b18e 100%);--g-lose:linear-gradient(180deg, #1ee7dd 0%, #4c84f0 55%, #6f7783 100%);--g-loading:linear-gradient(180deg, #4090f0 0%, #50b0f0 50%, #4060f0 100%);--g-btn-primary:linear-gradient(180deg, #f9d02a 0%, #f5a533 100%);--g-btn-secondary:linear-gradient(180deg, #6ec2ff 0%, #2482fb 100%);--g-btn-success:linear-gradient(180deg, #5fe0a8 0%, #2f9c6f 100%);--g-card:linear-gradient(180deg, #fff 0%, #e9f1fb 100%);--g-tile-locked:linear-gradient(180deg, #b8c3cc 0%, #8f9aa6 100%);--r-xs:6px;--r-sm:10px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-pill:999px;--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-8:32px;--s-10:40px;--e-card:0 4px 0 #0000002e, 0 8px 18px #00000038;--e-btn:0 4px 0 #00000047;--e-btn-pressed:0 1px 0 #00000047;--e-modal:0 16px 40px #00000073;--stroke-dark:2px solid #0e233bd9;--f-display:"Baloo2", "Nunito", system-ui, sans-serif;--f-body:var(--f-display);--t-h1:700 28px/1.15 var(--f-display);--t-h2:700 22px/1.2 var(--f-display);--t-h3:700 18px/1.25 var(--f-display);--t-body:600 15px/1.35 var(--f-body);--t-small:600 13px/1.3 var(--f-body);--t-tiny:700 11px/1.2 var(--f-body);--w-frame:390px;--h-topbar:56px;--h-tabbar:96px;--z-hud:10;--z-tabbar:20;--z-modal:40;--z-toast:60;--m-fast:.12s;--m-base:.2s;--m-slow:.36s;--m-ease:cubic-bezier(.2, .7, .3, 1);--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font:var(--t-body);color:var(--c-surface);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;-webkit-user-select:none;user-select:none;background:#0a1a33}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:0}img{-webkit-user-drag:none;display:block}.app-frame{width:min(100vw, var(--w-frame));background:var(--g-app);height:100dvh;padding-top:var(--safe-top);padding-bottom:var(--safe-bottom);margin:0 auto;position:relative;overflow:hidden}.app-scroll{-webkit-overflow-scrolling:touch;height:100%;padding:var(--s-4);overflow:hidden auto}.app-scroll.has-hud{padding-top:calc(var(--h-topbar) + var(--s-3))}.app-scroll.has-tabs{padding-bottom:calc(var(--h-tabbar) + var(--s-4))}.btn{padding:var(--s-4) var(--s-2);border-radius:var(--r-lg);border:3px solid var(--c-ink);font:var(--t-h2);box-shadow:var(--e-btn);transition:transform var(--m-fast) var(--m-ease), box-shadow var(--m-fast) var(--m-ease)}.btn:active:not(:disabled){box-shadow:var(--e-btn-pressed);transform:translateY(3px)}.btn:disabled{background:var(--g-tile-locked);color:#0e233b8c;text-shadow:none;box-shadow:var(--e-btn-pressed)}.btn--blue{background:var(--g-btn-secondary);color:var(--c-surface);text-shadow:0 2px #0e233b8c}.btn--gold{background:var(--g-btn-primary);color:var(--c-ink)}.boot-fade{width:min(100vw, var(--w-frame));opacity:0;pointer-events:none;transition:opacity var(--m-base) var(--m-ease);z-index:var(--z-toast);background:#000;position:fixed;top:0;bottom:0;left:50%;transform:translate(-50%)}.boot-fade.is-on{opacity:1}@media (prefers-reduced-motion:reduce){*{transition-duration:1ms!important;animation-duration:1ms!important}}.app-overlay{z-index:var(--z-modal);flex-direction:column;display:flex;position:absolute;inset:0}.modal-scrim{padding:var(--s-4);background:var(--c-overlay);animation:fade-in var(--m-base) var(--m-ease);place-items:center;display:grid;position:absolute;inset:0}.modal-card{width:100%;max-width:320px;padding:var(--s-4);border-radius:var(--r-xl);background:var(--g-card);color:var(--c-ink);box-shadow:var(--e-modal)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.stub{place-items:center;gap:var(--s-2);text-align:center;color:#ffffffd9;min-height:50vh;display:grid}.stub__title{font:var(--t-h2)}.stub__note{font:var(--t-small);max-width:26ch}.hud{top:var(--safe-top);height:var(--h-topbar);align-items:center;gap:var(--s-2);padding:0 var(--s-3);z-index:var(--z-hud);pointer-events:none;display:flex;position:absolute;left:0;right:0}.hud>*{pointer-events:auto}.hud__avatar{border-radius:var(--r-pill);background:var(--g-btn-secondary);width:38px;height:38px;box-shadow:var(--e-btn);border:2px solid #ffffffbf;flex:none;overflow:hidden}.hud__avatar img{object-fit:cover;width:100%;height:100%}.pill{align-items:center;gap:var(--s-1);min-width:120px;height:28px;padding:0 var(--s-1) 0 var(--s-2);border-radius:var(--r-pill);background:var(--c-ink);font:var(--t-tiny);color:var(--c-surface);border:1px solid #ffffff2e;flex:none;display:flex}.pill__icon{width:22px;height:22px}.pill__value{text-overflow:ellipsis;white-space:nowrap;text-align:center;flex:auto;min-width:0;overflow:hidden}.pill__add{border-radius:var(--r-pill);background:var(--g-btn-success);width:20px;height:20px;color:var(--c-surface);font:var(--t-tiny);flex:none;place-items:center;line-height:1;display:grid}.pill__add:active{transform:scale(.92)}.tabbar{padding-bottom:var(--safe-bottom);align-items:end;gap:var(--s-1);z-index:var(--z-tabbar);grid-template-columns:repeat(2,1fr);display:grid;position:absolute;bottom:0;left:0;right:0}.tabbar__tab{transition:transform var(--m-fast) var(--m-ease);display:block}.tabbar__tab img{width:100%;height:auto}.tabbar__tab.is-active{transform:translateY(-2px)}.tabbar__tab:not(.is-active){filter:saturate(.75)brightness(.97)}.tabbar__tab:active{transform:translateY(2px)}.play{align-items:center;gap:var(--s-4);flex-direction:column;min-height:100%;display:flex}.play__chapter{margin:var(--s-4) 0 0;font:var(--t-h1);color:var(--c-surface);-webkit-text-stroke:3px var(--c-ink);paint-order:stroke fill;text-shadow:0 4px #0e233b80;font-size:34px}.play__stage{z-index:0;width:100%;height:min(42vh,300px);margin:var(--s-2) 0;flex:none;position:relative}.play__arrow{z-index:1;place-items:center;width:34px;height:44px;display:grid;position:absolute;top:50%;transform:translateY(-50%)}.play__arrow:first-of-type{left:0}.play__arrow:last-of-type{right:0}.play__arrow img{filter:drop-shadow(0 2px 2px #00000080);width:20px}.play__arrow:disabled{opacity:.25}.play__arrow:active:not(:disabled){transform:translateY(-50%)scale(.88)}.play__art{place-items:center;display:grid;position:absolute;inset:0 44px}.play__art>img:first-child{object-fit:contain;filter:drop-shadow(0 14px 20px #0006);width:auto;max-width:100%;height:auto;max-height:100%}.play__art:active:not(:disabled)>img:first-child{transform:scale(.97)}.play__lock{filter:drop-shadow(0 3px 6px #0009);width:72px;max-width:26%;position:absolute}.play__art.is-locked img{filter:grayscale(.85)brightness(.6)}.play__starsCard{z-index:2;justify-content:center;align-items:center;gap:var(--s-2);max-width:100%;padding:var(--s-2) var(--s-5);border-radius:var(--r-pill);background:var(--c-surface);color:var(--c-ink);font:var(--t-h3);text-align:center;box-shadow:var(--e-card);flex-wrap:wrap;flex:none;display:flex;position:relative}.play__starsCard img{width:22px;height:22px}.play__starsCard.is-locked{color:var(--c-slate);font:var(--t-small);background:#ffffffd1}.play__track{border-radius:var(--r-pill);background:var(--c-track);border:3px solid var(--c-ink);width:100%;height:26px;padding:3px;box-shadow:inset 0 2px 6px #00000059}.play__fill{border-radius:var(--r-pill);background:var(--g-btn-primary);min-width:26px;height:100%;transition:width var(--m-slow) var(--m-ease)}.play__actions{gap:var(--s-3);width:100%;margin-top:var(--s-2);grid-template-columns:1fr 1fr;display:grid}.play__clear{padding:var(--s-2);font:var(--t-tiny);color:#ffffff80;margin-top:auto}.levels{padding:var(--s-4);background:var(--c-overlay);place-items:center;display:grid;position:absolute;inset:0}.levels__panel{width:100%;max-height:86%;padding:var(--s-3);gap:var(--s-3);border-radius:var(--r-xl);background:var(--c-surface);box-shadow:var(--e-modal);flex-direction:column;display:flex}.levels__head{padding:var(--s-3);border-radius:var(--r-md);background:var(--c-ink);color:var(--c-surface);font:var(--t-h2);justify-content:center;align-items:center;display:flex;position:relative}.levels__head button{right:var(--s-3);width:28px;height:28px;position:absolute}.levels__head img{width:100%;height:100%}.levels__progress{justify-content:center;align-items:center;gap:var(--s-2);color:var(--c-ink);font:var(--t-h2);display:flex}.levels__progress img{width:26px;height:26px}.levels__grid{gap:var(--s-2);padding:var(--s-2);border-radius:var(--r-md);background:var(--c-line);grid-template-columns:repeat(5,1fr);display:grid;overflow-y:auto;box-shadow:inset 0 2px 8px #00000040}.tile{aspect-ratio:1;border-radius:var(--r-sm);background:var(--g-card);color:var(--c-ink);font:var(--t-h3);box-shadow:var(--e-btn);border:2px solid #0e233b8c;flex-direction:column;justify-content:center;align-items:center;gap:2px;display:flex}.tile:active{box-shadow:var(--e-btn-pressed);transform:translateY(2px)}.tile.is-locked{background:var(--g-tile-locked);box-shadow:none}.tile__lock{opacity:.85;width:42%}.tile__stars{gap:2px;display:flex}.tile__stars i{border-radius:50%;width:7px;height:7px}.tile__stars i.on{background:var(--c-star-on)}.tile__stars i.off{background:var(--c-star-off)}.shop{gap:var(--s-5);flex-direction:column;display:flex}.shop__head{padding:var(--s-3) var(--s-4);border-radius:var(--r-md);color:var(--c-surface);font:var(--t-h3);text-shadow:0 2px #0e233b73;background:#ffffff29;border:1px solid #ffffff38;justify-content:space-between;align-items:center;display:flex}.shop__owned{align-items:center;gap:var(--s-2);display:flex}.shop__owned img{object-fit:contain;width:26px;height:26px}.shop__grid{gap:var(--s-3);margin-top:var(--s-3);grid-template-columns:repeat(2,1fr);display:grid}.shop__card{width:100%;padding:var(--s-2);gap:var(--s-2);border-radius:var(--r-lg);border:3px solid var(--c-ink);background:var(--c-surface);box-shadow:var(--e-card);transition:transform var(--m-fast) var(--m-ease);flex-direction:column;display:flex}.shop__card:active:not(:disabled){transform:translateY(3px)}.shop__card:disabled{filter:saturate(.5)brightness(.92)}.shop__art{aspect-ratio:1/.86;padding:var(--s-3) var(--s-3) var(--s-5);border-radius:var(--r-md);background:linear-gradient(160deg,#ff6a3d 0%,#ffc12b 100%);place-items:center;display:grid;position:relative;overflow:hidden}.shop__art img{object-fit:contain;width:100%;height:100%}.shop__qty{bottom:var(--s-2);font:var(--t-h3);color:var(--c-surface);-webkit-text-stroke:3px var(--c-ink);paint-order:stroke fill;position:absolute}.shop__price{justify-content:center;align-items:center;gap:var(--s-2);padding-bottom:var(--s-1);color:var(--c-ink);font:var(--t-h3);flex-wrap:nowrap;display:flex}.shop__price img{width:22px;height:22px}.shop__desc{margin:var(--s-2) 0 0;max-width:32ch;font:var(--t-small);color:#ffffffd9;text-shadow:0 1px 2px #0e233b80}.confirm{padding:var(--s-4);background:var(--c-overlay);place-items:center;display:grid;position:absolute;inset:0}.confirm__card{width:100%;max-width:320px;padding:var(--s-3);border-radius:var(--r-xl);background:var(--c-surface);color:var(--c-ink);text-align:center;box-shadow:var(--e-modal)}.confirm__art{border-radius:var(--r-md);background:linear-gradient(160deg,#ff6a3d 0%,#ffc12b 100%);place-items:center;height:150px;display:grid;overflow:hidden}.confirm__art img{object-fit:contain;max-width:72%;max-height:92%}.confirm__title{margin:var(--s-4) 0 var(--s-2);font:var(--t-h2)}.confirm__desc{margin:0 0 var(--s-4);font:var(--t-body);color:var(--c-ink-soft)}.confirm__actions{gap:var(--s-3);grid-template-columns:1fr 1fr;display:grid}.confirm__actions .btn{justify-content:center;align-items:center;gap:var(--s-2);font:var(--t-h3);display:flex}.confirm__actions .btn img{width:24px;height:24px}.btn--red{color:var(--c-surface);text-shadow:0 2px #0e233b73;background:linear-gradient(#ff5b52 0%,#e2312a 100%)}.gameHost{width:min(100vw, var(--w-frame));background:linear-gradient(#134498 0% 22%,#3f5ce0 78% 100%);place-items:center;display:grid;position:fixed;top:0;bottom:0;left:50%;overflow:hidden;transform:translate(-50%)}.gameHost canvas{width:100%;height:auto;max-height:100%;display:block}.profile{align-items:center;gap:var(--s-4);flex-direction:column;display:flex}.profile__character{width:46%;max-width:170px;height:auto;margin-top:var(--s-4);filter:drop-shadow(0 12px 16px #00000059)}.profile__badges{gap:var(--s-3);display:flex}.profile__badges img{width:auto;height:38px}.profile__idRow{gap:var(--s-3);width:100%;display:flex}.profile__id{min-width:0;padding:var(--s-3) var(--s-4);border-radius:var(--r-lg);color:var(--c-surface);font:var(--t-h3);text-shadow:0 2px #0e233b73;background:#ffffff2e;border:2px solid #ffffff59;flex:auto;justify-content:center;align-items:center;display:flex}.profile__idActions{gap:var(--s-2);padding:0 var(--s-3);border-radius:var(--r-lg);background:#ffffff2e;border:2px solid #ffffff59;flex:none;display:flex}.profile__idActions button{place-items:center;width:34px;display:grid}.profile__idActions img{width:22px;height:22px}.profile__idActions button:active{transform:scale(.9)}.panel{width:100%;padding:var(--s-3);gap:var(--s-3);border-radius:var(--r-lg);box-shadow:var(--e-card);background:#12243c;flex-direction:column;display:flex}.panel__timer{padding:var(--s-3);border-radius:var(--r-md);color:#4ade6a;font:var(--t-h2);text-align:center;font-variant-numeric:tabular-nums;background:#ffffff0f}.panel__claim{justify-content:space-between;align-items:center;gap:var(--s-3);display:flex}.panel__label{font:var(--t-small);color:var(--c-muted);margin:0}.panel__total{align-items:center;gap:var(--s-2);margin:var(--s-1) 0 0;font:var(--t-h2);color:var(--c-surface);display:flex}.panel__total img{width:24px;height:24px}.panel__claimBtn{align-items:center;gap:var(--s-2);padding:var(--s-3) var(--s-4);font:var(--t-h3);display:flex}.panel__claimBtn img{width:22px;height:22px}.refs{padding:var(--s-2);border-radius:var(--r-md);background:var(--c-surface)}.refs__head{align-items:center;gap:var(--s-3);padding:var(--s-3) var(--s-4);border-radius:var(--r-sm);color:var(--c-surface);font:var(--t-h3);text-shadow:0 2px #0e233b59;background:linear-gradient(#86d16a 0%,#64b34a 100%);display:flex}.refs__tier{opacity:.85}.refs__list{margin:0;padding:0;list-style:none}.refs__row{align-items:center;gap:var(--s-3);padding:var(--s-3) var(--s-4);color:var(--c-ink);font:var(--t-small);grid-template-columns:1fr auto auto;display:grid}.refs__row:nth-child(2n){background:#efe6d2}.refs__state{font:var(--t-tiny);color:var(--c-slate)}.refs__state.is-redeemable{color:#2f9c4a}.refs__state.is-expired{color:var(--c-danger)}.refs__gold{align-items:center;gap:var(--s-1);min-width:58px;font:var(--t-small);justify-content:flex-end;display:flex}.refs__gold img{width:18px;height:18px}.refs__empty{padding:var(--s-4);text-align:center;color:var(--c-slate);font:var(--t-small);margin:0}.profile__invite{width:100%}.profile__note{min-height:18px;font:var(--t-small);color:#ffffffd9;text-align:center;margin:0}.start,.loading{width:min(100vw, var(--w-frame));height:100dvh;margin:0 auto;position:relative;overflow:hidden}.start{background:#111;place-items:center;display:grid}.start img{width:58%;max-width:260px;height:auto}.loading{background-color:#2f5cf0;background-position:50%;background-repeat:no-repeat;background-size:cover}.loading__foot{left:0;right:0;bottom:calc(var(--s-6) + var(--safe-bottom));align-items:center;gap:var(--s-2);padding:0 var(--s-5);flex-direction:column;display:flex;position:absolute}.loading__bar{border-radius:var(--r-pill);border:3px solid var(--c-ink);background:#0612268c;width:100%;height:22px;padding:3px;overflow:hidden}.loading__fill{border-radius:var(--r-pill);background:var(--g-btn-primary);min-width:22px;height:100%}.loading__fill.is-indeterminate{width:32%;animation:loading-slide 1.2s var(--m-ease) infinite}@keyframes loading-slide{0%{transform:translate(-110%)}to{transform:translate(410%)}}.loading__meta{font:var(--t-h3);color:var(--c-surface);text-shadow:0 2px #0e233bb3}.loading__version{font:var(--t-small);color:#ffffffd9;text-shadow:0 2px #0e233bb3}