@font-face{font-family:Fredoka;src:url(fonts/fredoka.woff2) format("woff2");font-weight:300 700;font-display:block}
:root{--s:1;--blue:#1d6ff2;--ink:#1540c9;--ink2:#4a7fe0;--y1:#fff27a;--y2:#ffcc1f;--y3:#ffae00;--safe-t:calc(env(safe-area-inset-top,0px) / var(--s));--safe-b:calc(env(safe-area-inset-bottom,0px) / var(--s));--ease:cubic-bezier(.22,.9,.24,1);--spring:cubic-bezier(.34,1.56,.64,1)}
html.desk{--safe-t:48px;--safe-b:16px}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;background:#0b1d4a;overflow:hidden;overscroll-behavior:none;touch-action:manipulation}
body{font-family:Fredoka,"Baloo 2",system-ui,sans-serif;font-weight:600;color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-text-size-adjust:100%}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;text-align:inherit}
img{display:block;-webkit-user-drag:none;pointer-events:none;max-width:none}
#device{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(120% 80% at 50% 0%,#3d8dff 0%,#1344b8 45%,#081a4a 100%)}
#app{position:relative;flex:none;width:390px;height:844px;overflow:hidden;background:#3aa6ff;isolation:isolate;transform-origin:center center;contain:layout paint}
html.desk #app{border-radius:56px;box-shadow:0 0 0 11px #0d1020,0 0 0 13px #414a60,0 50px 100px rgba(0,0,0,.55)}
html.desk #app::after{content:"";position:absolute;top:11px;left:50%;width:122px;height:35px;margin-left:-61px;border-radius:20px;background:#000;z-index:999;pointer-events:none}
.sbar{display:none;position:absolute;left:0;right:0;top:0;height:48px;z-index:998;pointer-events:none;align-items:center;justify-content:space-between;padding:4px 30px 0 44px;color:#fff;text-shadow:0 1px 2px rgba(0,30,120,.3)}
html.desk .sbar{display:flex}
.sbar b{font-size:16px;font-weight:700;letter-spacing:.2px;font-family:-apple-system,"SF Pro Text",system-ui,sans-serif}
.sbar span{display:flex;align-items:center;gap:6px}.sbar svg{height:12px;fill:#fff}
.batt{width:25px;height:12px;border:1.5px solid rgba(255,255,255,.8);border-radius:4px;padding:1.5px;display:block}.batt i{display:block;height:100%;width:80%;background:#fff;border-radius:1.5px}
.sbar.dark{color:#1d3f9e}.sbar.dark svg{fill:#1d3f9e}.sbar.dark .batt{border-color:#1d3f9e}.sbar.dark .batt i{background:#1d3f9e}
/* screens */
.screen{position:absolute;inset:0;overflow:hidden;visibility:hidden;will-change:transform,opacity;backface-visibility:hidden}
.screen.active{visibility:visible}
.bg{position:absolute;inset:-2px;background-size:cover;background-position:center;z-index:-1}
.bg.kb{animation:kb 20s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1.03)}to{transform:scale(1.1) translateY(-1.5%)}}
.scroll{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:calc(var(--safe-t) + 6px) 16px calc(var(--safe-b) + 116px);overscroll-behavior:contain;scrollbar-width:none}
.scroll::-webkit-scrollbar{display:none}
.page{position:absolute;inset:0;display:flex;flex-direction:column;padding:calc(var(--safe-t) + 6px) 14px calc(var(--safe-b) + 104px)}
.page-fade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(60,150,255,0) 0%,rgba(215,236,255,.45) 34%,rgba(238,247,255,.93) 56%,#eef7ff 100%)}
.page-fade.light{background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(230,245,255,.2) 40%,rgba(236,247,255,.5) 100%)}
.page-fade.profile{background:linear-gradient(180deg,rgba(40,140,255,0) 0%,rgba(120,190,255,.25) 16%,rgba(222,240,255,.94) 32%,#eef7ff 50%)}
.tap{transition:transform .2s var(--spring),filter .2s}
.tap:active,.tap.pressed{transform:scale(.94)}
.fl{position:absolute;pointer-events:none;animation:floaty 3.2s ease-in-out infinite}
.floaty{animation:floaty 3.4s ease-in-out infinite}
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -10px}}
.run-bounce{animation:runB .5s ease-in-out infinite alternate}
@keyframes runB{from{translate:0 0}to{translate:0 -8px}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes rowIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes popIn{0%{opacity:0;transform:scale(.4)}100%{opacity:1;transform:none}}
@keyframes bump{40%{transform:scale(1.12)}}
@keyframes twinkle{50%{transform:scale(1.08) rotate(4deg)}}
/* text */
.bubble{font-weight:700;color:#ffd21c;letter-spacing:.3px;line-height:.98;-webkit-text-stroke:8px #1a5ae6;paint-order:stroke fill;text-shadow:0 5px 0 #0e3cae,0 10px 18px rgba(8,40,130,.35)}
.bubble.white{color:#fff}
.bubble.lg{font-size:40px}.bubble.xl{font-size:50px}.bubble.xxl{font-size:62px;-webkit-text-stroke:10px #1a5ae6;text-shadow:0 7px 0 #0e3cae,0 14px 22px rgba(8,40,130,.4)}
.center{text-align:center}
.title-sub{text-align:center;color:#fff;font-size:20px;font-weight:700;-webkit-text-stroke:5px #1a5ae6;paint-order:stroke fill;text-shadow:0 3px 0 #0e3cae;margin:0 0 12px;letter-spacing:.2px}
/* image buttons */
.btn-img{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;background:url(a/btnYellow.webp) center/100% 100% no-repeat;color:#1740d0;font-weight:700;letter-spacing:.2px;filter:drop-shadow(0 10px 14px rgba(200,110,0,.28));transition:transform .2s var(--spring),filter .2s;padding-bottom:6px;white-space:nowrap}
.btn-img:active{transform:scale(.95) translateY(2px);filter:drop-shadow(0 4px 6px rgba(200,110,0,.3)) brightness(.97)}
.btn-img.xl{height:98px;width:318px;font-size:36px}
.btn-img.lg{height:74px;width:250px;font-size:30px}
.btn-img.md{height:56px;width:180px;font-size:25px}
.btn-img.sm{height:44px;width:112px;font-size:18px;padding-bottom:4px}
.btn-img.disabled{filter:grayscale(.7) opacity(.7)}
.btn-img .arr{width:32px;height:32px;fill:none;stroke:#fff;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 0 rgba(210,120,0,.8))}
.btn-img svg.arrow{width:26px;height:26px;color:#1740d0}
.play-img{display:block;flex:none;transition:transform .2s var(--spring),filter .2s;filter:drop-shadow(0 12px 16px rgba(200,110,0,.3))}
.play-img img{width:100%;height:auto}
.play-img:active{transform:scale(.95) translateY(2px)}
.play-img::after{content:"";position:absolute;inset:0;border-radius:99px;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.55) 45%,transparent 60%);background-size:250% 100%;animation:shine 3.2s ease-in-out infinite;pointer-events:none;inset:9% 4% 16%;mix-blend-mode:soft-light}
@keyframes shine{0%,55%{background-position:150% 0}100%{background-position:-60% 0}}
.btn-blue,.btn-green,.btn-red{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;font-weight:700;transition:transform .16s var(--spring)}
.btn-blue:active,.btn-green:active,.btn-red:active{transform:translateY(4px) scale(.98)}
.btn-blue{background:linear-gradient(180deg,#5cb2ff,#2a7bff 55%,#1557e0);color:#fff;box-shadow:inset 0 2px 0 rgba(255,255,255,.55),0 6px 0 #0e3fb4,0 12px 20px rgba(20,70,200,.35);padding:14px 22px;font-size:19px}
.btn-green{background:url(a/btnGreen.webp) center/100% 100% no-repeat;color:#fff;-webkit-text-stroke:4px #0d8f2e;paint-order:stroke fill;filter:drop-shadow(0 6px 8px rgba(10,120,40,.3));padding-bottom:4px}
.btn-red{background:linear-gradient(180deg,#ff8f9e,#ff4d64 55%,#e62c48);color:#fff;box-shadow:inset 0 2px 0 rgba(255,255,255,.55),0 6px 0 #b0142e,0 12px 18px rgba(200,20,50,.3);padding:14px 22px;font-size:18px}
.btn-lg{font-size:26px;height:66px;padding:0 30px}
.wide{width:100%}
/* SPLASH */
#splash .splash-shade{position:absolute;inset:0;background:radial-gradient(70% 45% at 50% 40%,rgba(255,255,255,.4),rgba(20,90,230,.2) 70%,rgba(10,40,140,.55))}
.splash-logo{position:absolute;left:50%;top:38%;width:300px;margin-left:-150px;translate:0 -50%;animation:logoIn 1s var(--spring) both,breathe 2.4s 1s ease-in-out infinite;filter:drop-shadow(0 14px 22px rgba(10,50,160,.45))}
@keyframes logoIn{from{opacity:0;transform:scale(.3) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes breathe{50%{transform:scale(1.04)}}
.splash-load{position:absolute;left:60px;right:60px;bottom:calc(var(--safe-b) + 90px);text-align:center;color:#fff;font-size:18px;-webkit-text-stroke:4px #1a5ae6;paint-order:stroke fill;font-weight:700}
.splash-load .bar{height:24px;border-radius:14px;background:rgba(10,40,140,.6);padding:4px;box-shadow:inset 0 2px 4px rgba(0,0,0,.35),0 0 0 3px #fff;margin-bottom:10px}
.splash-load i{display:block;height:100%;width:0;border-radius:10px;background:linear-gradient(#fff38a,#ffc414);box-shadow:inset 0 -3px 0 #f29a00;transition:width .25s var(--ease)}
/* ONBOARD */
.ob-track{position:absolute;inset:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior:contain}
.ob-track::-webkit-scrollbar{display:none}
.ob-slide{position:relative;flex:0 0 100%;height:100%;scroll-snap-align:center;overflow:hidden;isolation:isolate}
.ob-glow{position:absolute;left:50%;top:44%;width:520px;height:520px;margin:-260px 0 0 -260px;background:radial-gradient(closest-side,rgba(255,255,255,.55),rgba(255,255,255,0));pointer-events:none}
.ob-logo{position:absolute;left:50%;top:calc(var(--safe-t) + 14px);width:286px;margin-left:-143px;filter:drop-shadow(0 12px 18px rgba(10,50,160,.35));animation:logoIn .9s var(--spring) both}
.ob-fox{position:absolute;left:50%;bottom:calc(var(--safe-b) + 150px);height:calc(var(--H) * .47);max-height:430px;translate:-50% 0;filter:drop-shadow(0 20px 16px rgba(20,40,140,.3))}
.s0 .fl{filter:drop-shadow(0 6px 8px rgba(160,90,0,.35))}
.s0 .c1{left:16px;top:52%;width:62px}.s0 .c2{right:18px;top:40%;width:58px;animation-delay:-1s}.s0 .c3{left:34px;top:41%;width:38px;animation-delay:-2s}.s0 .c4{right:-22px;bottom:calc(var(--safe-b) + 150px);width:118px;animation-delay:-.6s}.s0 .c5{left:66%;top:calc(var(--safe-t) + 250px);width:54px}
.ob-title{position:absolute;left:0;right:0;top:calc(var(--safe-t) + 34px);text-align:center;animation:popIn .7s var(--spring) both}
.ob-sub{position:absolute;left:20px;right:20px;top:calc(var(--safe-t) + 160px);text-align:center;color:#fff;font-size:19px;line-height:1.3;-webkit-text-stroke:5px #1a5ae6;paint-order:stroke fill;text-shadow:0 3px 0 #0e3cae}
.ob-rocket{position:absolute;left:50%;width:360px;margin-left:-180px;bottom:calc(var(--safe-b) + 190px);filter:drop-shadow(0 20px 18px rgba(20,40,140,.3))}
.s1 .c1{left:22px;top:46%;width:56px}.s1 .c3{right:24px;top:40%;width:60px;animation-delay:-1.2s}.s1 .b1{left:26px;bottom:calc(var(--safe-b) + 170px);width:72px;animation-delay:-.5s}.s1 .b2{right:26px;bottom:calc(var(--safe-b) + 200px);width:72px;animation-delay:-1.7s}
.ob-boss{position:absolute;left:50%;width:280px;margin-left:-140px;top:calc(var(--safe-t) + 230px);filter:drop-shadow(0 18px 20px rgba(60,0,120,.35))}
.ob-foxback{position:absolute;left:50%;bottom:calc(var(--safe-b) + 160px);width:130px;margin-left:-65px;filter:drop-shadow(0 16px 12px rgba(0,0,60,.35))}
.ob-bottom{position:absolute;left:0;right:0;bottom:calc(var(--safe-b) + 26px);display:flex;flex-direction:column;align-items:center;gap:14px;z-index:2;pointer-events:none}
.ob-bottom>*{pointer-events:auto}
.ob-dots{display:flex;gap:8px}.ob-dots i{width:10px;height:10px;border-radius:5px;background:rgba(255,255,255,.7);box-shadow:0 2px 4px rgba(10,50,160,.3);transition:width .35s var(--spring),background .3s}.ob-dots i.on{width:30px;background:#ffc81c}
.ob-skip{position:absolute;top:calc(var(--safe-t) + 10px);right:16px;z-index:3;padding:7px 16px;border-radius:20px;background:rgba(255,255,255,.3);color:#fff;font-size:16px;font-weight:700;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.7)}
/* top bar & pills */
.topbar{position:relative;display:flex;align-items:center;justify-content:space-between;height:62px;flex:none;gap:10px}
.logo-sm{height:58px;width:auto;filter:drop-shadow(0 5px 8px rgba(10,50,160,.3))}
.coin-pill{position:relative;display:flex;align-items:center;height:42px;min-width:138px;padding:0 44px 0 50px;border-radius:24px;background:linear-gradient(180deg,#2f86ff,#1354e0);box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 0 0 3px rgba(255,255,255,.55),0 6px 12px rgba(10,50,180,.3);color:#fff;font-size:22px;font-weight:700;cursor:pointer;margin-right:4px}
.coin-pill>img:first-child{position:absolute;left:-10px;top:50%;width:54px;margin-top:-27px;filter:drop-shadow(0 3px 4px rgba(0,0,0,.25))}
.coin-pill .plus{position:absolute;right:3px;top:50%;width:36px;margin-top:-18px}
.coin-pill b{font-variant-numeric:tabular-nums;flex:1;text-align:center}
.coin-pill.bump{animation:bump .35s var(--spring)}
.coin-pill.tr{position:absolute;top:calc(var(--safe-t) + 10px);right:16px;z-index:2;padding-right:20px}
.back{width:52px;height:52px;flex:none;filter:drop-shadow(0 6px 10px rgba(20,60,180,.3))}.back img{width:100%}
.back.sm{width:46px;height:46px}
.icon-btn{width:54px;height:54px;flex:none;filter:drop-shadow(0 6px 10px rgba(20,60,180,.3))}.icon-btn img{width:100%}
/* HOME */
.home-sky{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(40,130,255,.35) 0%,rgba(60,150,255,.08) 30%,rgba(255,255,255,0) 55%,rgba(40,120,255,.28) 100%)}
.home-row{display:flex;gap:8px;align-items:stretch;margin-top:4px;flex:none}
.player-card{flex:1;min-width:0;display:flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;border-radius:40px;background:linear-gradient(180deg,#2f8bff,#1557e6);box-shadow:inset 0 2px 0 rgba(255,255,255,.45),0 0 0 3px rgba(255,255,255,.6),0 8px 16px rgba(10,50,180,.3);height:78px;align-self:center}
.pc-av{width:66px;height:66px;flex:none;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.2)}.pc-av img{width:100%;height:100%;object-fit:contain}
.pc-info{flex:1;min-width:0}
.greet{display:block;color:#fff;font-size:21px;font-weight:700;white-space:nowrap;text-shadow:0 2px 0 rgba(0,40,150,.4);margin-bottom:5px}
.lvl-line{display:flex;align-items:center;gap:6px}
.lv-chip{flex:none;background:linear-gradient(#fff27a,#ffc414);color:#1447d6;font-size:13px;font-weight:700;padding:2px 8px;border-radius:10px;box-shadow:inset 0 -2px 0 #f0a000}
.xpbar{flex:1;height:13px;border-radius:8px;background:#0c3aa8;box-shadow:inset 0 2px 3px rgba(0,0,0,.35);overflow:hidden;min-width:30px}
.xpbar i{display:block;height:100%;width:0;border-radius:8px;background:linear-gradient(#fff27a,#ffc414);box-shadow:inset 0 -3px 0 #f0a000;transition:width .8s var(--ease)}
.sq-card{position:relative;width:84px;height:92px;flex:none;border-radius:22px;background:linear-gradient(180deg,#fff 0%,#e6f1ff 100%);box-shadow:inset 0 0 0 2.5px rgba(255,255,255,.9),inset 0 -5px 0 #c4dafc,0 8px 14px rgba(10,60,200,.22);display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:2px}
.sq-card img{width:56px;height:52px;object-fit:contain;filter:drop-shadow(0 3px 3px rgba(0,0,0,.15))}
.sq-card span{font-size:18px;font-weight:700;color:#1447d6;margin-top:1px}
.dot{position:absolute;top:6px;right:6px;width:15px;height:15px;border-radius:50%;background:#ff2f55;box-shadow:0 0 0 3px #fff;transform:scale(0);transition:transform .3s var(--spring)}
.dot.on{transform:scale(1);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.2)}}
.home-hero{position:relative;flex:1 1 auto;min-height:150px;display:flex;align-items:center;justify-content:center}
.hero-glow{position:absolute;left:50%;top:50%;width:360px;height:360px;margin:-180px 0 0 -180px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.7),rgba(255,255,255,.25) 50%,rgba(255,255,255,0));pointer-events:none}
.hero-fox{position:relative;max-width:112%;max-height:100%;width:auto;height:100%;object-fit:contain;animation:floaty 3s ease-in-out infinite;filter:drop-shadow(0 18px 18px rgba(20,40,140,.28));margin-left:-4%}
.home-hero .fl{filter:drop-shadow(0 5px 6px rgba(160,90,0,.35));z-index:1}
.h1{left:2%;top:34%;width:58px}.h2{right:4%;top:14%;width:56px;animation-delay:-1s}.h3{left:9%;top:8%;width:36px;animation-delay:-2s}.h4{right:10%;top:46%;width:36px;animation-delay:-1.4s}.h5{left:20%;top:70%;width:26px;animation-delay:-.4s}.h6{right:0;bottom:6%;width:56px;animation-delay:-2.2s}
.play-img{position:relative;align-self:center;width:300px;margin:2px 0 6px}
.mode-cards{display:flex;gap:8px;justify-content:space-between;flex:none}
.mc{flex:1;min-width:0;filter:drop-shadow(0 8px 12px rgba(10,60,200,.22))}.mc img{width:100%;height:auto}
/* TAB BAR */
.tabbar{position:absolute;left:12px;right:12px;bottom:calc(var(--safe-b) + 8px);height:80px;border-radius:30px;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(238,245,255,.97));box-shadow:inset 0 0 0 2px rgba(255,255,255,.9),inset 0 -4px 0 #d3e2fb,0 14px 30px rgba(10,50,150,.3);display:flex;z-index:50;transition:transform .45s var(--ease),opacity .3s;will-change:transform;padding:0 4px}
.tabbar.hide{transform:translateY(140%);opacity:0;pointer-events:none}
.tabbar button{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#8792b0;font-size:13.5px;font-weight:600;z-index:1;transition:color .25s}
.ti{position:relative;width:34px;height:34px;display:block;transition:transform .35s var(--spring)}
.ti img{width:100%;height:100%;object-fit:contain;transition:opacity .2s}
.ti::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#5eb4ff,#1d62ee);-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat;opacity:0;transition:opacity .2s}
.tabbar button.on{color:#1a5ae6;font-weight:700}
.tabbar button.on .ti{transform:translateY(-2px) scale(1.12)}
.tabbar button.on .ti img{opacity:0}.tabbar button.on .ti::after{opacity:1}
.tabbar button[data-tab=home].on{color:#f07d00}
.tabbar button[data-tab=home].on .ti::after{background:linear-gradient(180deg,#ffd23a,#ff8a00)}
.tab-ind{position:absolute;left:4px;bottom:9px;width:calc((100% - 8px)/5);height:4px;display:flex;justify-content:center;transition:transform .45s var(--spring);pointer-events:none}
.tab-ind::before{content:"";width:22px;height:4px;border-radius:2px;background:#1a5ae6}
/* GAMES */
.g-title{position:relative;display:flex;justify-content:center;margin-top:-2px}
.g-title>img:first-child{width:250px;filter:drop-shadow(0 10px 14px rgba(10,50,160,.3))}
.gt1{left:-6px;top:24px;width:70px;opacity:.95}.gt2{right:18px;top:0;width:38px}
.featured{position:relative;display:block;height:196px;border-radius:30px;margin:0 0 16px;overflow:hidden;background:linear-gradient(135deg,#46a8ff 0%,#1c6cf2 55%,#1450d8 100%);box-shadow:inset 0 0 0 3px rgba(255,255,255,.75),0 14px 26px rgba(10,60,200,.3)}
.feat-shine{position:absolute;inset:0;background:radial-gradient(120% 90% at 100% 100%,rgba(120,220,255,.45),transparent 60%),repeating-linear-gradient(115deg,rgba(255,255,255,.06) 0 14px,transparent 14px 34px)}
.feat-copy{position:absolute;left:16px;top:14px;bottom:14px;width:62%;z-index:2;display:flex;flex-direction:column;align-items:flex-start}
.chip-feat{display:inline-flex;align-items:center;gap:5px;background:linear-gradient(#2a70ff,#1447d6);color:#fff;font-size:14px;font-weight:700;padding:4px 12px 4px 6px;border-radius:14px;box-shadow:0 0 0 2px rgba(255,255,255,.6)}
.chip-feat img{width:22px}
.feat-title{width:200px;margin:6px 0 2px -4px;filter:drop-shadow(0 4px 4px rgba(0,30,120,.3))}
.feat-copy p{color:#fff;font-size:14.5px;line-height:1.2;font-weight:600;text-shadow:0 1px 2px rgba(0,30,120,.4)}
.feat-copy .play-img{width:146px;margin:auto 0 0 -4px}
.feat-kart{position:absolute;right:-18px;bottom:-8px;width:222px;z-index:1;filter:drop-shadow(-6px 10px 12px rgba(0,20,100,.3));animation:kartB 1.8s ease-in-out infinite;border-radius:0 0 26px 0}
@keyframes kartB{50%{translate:0 -4px}}
.sec-head{display:flex;align-items:center;justify-content:space-between;margin:0 2px 10px}
.sec-head h3{display:flex;align-items:center;gap:8px;font-size:23px;color:#1447d6;font-weight:700}
.sec-head h3 img{width:40px}
.viewall{font-size:16px;color:#2a6ff0;cursor:pointer}
.gm-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.gm{position:relative;aspect-ratio:293/226;border-radius:24px;background-size:100% 100%;filter:drop-shadow(0 8px 12px rgba(10,60,200,.16));padding:0 0 12px 14px;display:flex;flex-direction:column;justify-content:flex-end}
.gm b{font-size:19px;font-weight:700;line-height:1.05}
.gm small{font-size:11.5px;color:#4e6aa8;line-height:1.2;font-weight:600;max-width:64%}
/* ARCADE */
#arcade .back{position:absolute;top:calc(var(--safe-t) + 10px);left:16px;z-index:3}
.arc-title{position:relative;text-align:center;padding-top:26px}
.arc-crown{width:92px;margin:0 auto -20px;position:relative;z-index:1;filter:drop-shadow(0 6px 8px rgba(160,90,0,.35))}
.a1{left:18px;top:74px;width:40px}.a2{right:24px;top:52px;width:34px;animation-delay:-1s}.a3{right:40px;top:150px;width:40px;animation-delay:-2s}
.arc-sub{text-align:center;color:#fff;font-size:19px;line-height:1.25;-webkit-text-stroke:5px #1a5ae6;paint-order:stroke fill;text-shadow:0 3px 0 #0e3cae;margin:10px 0 16px;font-weight:700}
.arc-list{display:flex;flex-direction:column;gap:14px}
.arc-card{position:relative;display:block;width:100%;border-radius:26px;background:rgba(255,255,255,.96);padding:8px 8px 10px;box-shadow:inset 0 0 0 2.5px #fff,inset 0 -5px 0 #cfe0fc,0 12px 22px rgba(10,60,200,.22);animation:rowIn .6s var(--ease) both}
.arc-card:nth-child(2){animation-delay:.07s}.arc-card:nth-child(3){animation-delay:.14s}
.arc-thumb{position:relative;height:122px;border-radius:20px;background-size:cover;background-position:center 60%;overflow:hidden}
.t-fox{position:absolute;left:50%;bottom:-6px;height:118px;translate:-50% 0;filter:drop-shadow(0 6px 6px rgba(0,0,0,.25))}
.t-coin{position:absolute;width:40px;animation:floaty 2.6s ease-in-out infinite}.k1{left:14%;top:30%}.k2{right:16%;top:18%;animation-delay:-1s}.k3{right:30%;bottom:10%;width:30px;animation-delay:-2s}
.t-block{position:absolute;bottom:6px;height:64px}.b1{left:10%}.b2{right:10%}
.t-boss{position:absolute;left:50%;top:4px;height:118px;translate:-50% 0;animation:floaty 3s ease-in-out infinite}
.arc-info{padding:8px 60px 0 8px}.arc-info b{display:block;font-size:21px;color:#1447d6}.arc-info small{font-size:14px;color:#4b76d6}
.arc-card .go{position:absolute;right:14px;bottom:12px;width:44px}
/* TOURNAMENT */
.t-fade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(80,170,255,.2),rgba(255,255,255,0) 30%,rgba(230,244,255,.6) 60%,#eaf4ff 100%)}
.t-head{display:flex;align-items:center;gap:4px;margin-top:6px}
.t-trophy{width:66px;margin-left:2px;filter:drop-shadow(0 6px 8px rgba(160,90,0,.3));animation:twinkle 3s ease-in-out infinite}
.t-tt{display:flex;flex-direction:column;align-items:center;flex:1;min-width:0}
.t-tt img{width:100%;max-width:240px;filter:drop-shadow(0 6px 8px rgba(10,50,160,.25))}
.t-sub{margin-top:2px;background:linear-gradient(#3b8dff,#1a5ae6);color:#fff;font-size:15px;font-weight:700;padding:3px 14px;border-radius:14px;box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 3px 6px rgba(10,50,160,.3)}
.podium{margin:4px -6px -18px;position:relative;z-index:1}.podium img{width:100%;filter:drop-shadow(0 12px 14px rgba(10,50,160,.25));animation:rowIn .7s var(--ease) both}
.lb-panel{position:relative;border-radius:28px;background:rgba(255,255,255,.95);padding:14px 10px 12px;box-shadow:inset 0 0 0 2.5px #fff,0 14px 28px rgba(10,60,200,.2)}
.seg{position:relative;display:flex;height:46px;border-radius:24px;background:#e8f1ff;box-shadow:inset 0 2px 4px rgba(20,70,190,.15);padding:4px;margin-bottom:8px}
.seg button{flex:1;position:relative;z-index:1;font-size:18px;font-weight:700;color:#1d56d8;text-align:center}
.seg-thumb{position:absolute;left:4px;top:4px;bottom:4px;width:calc(50% - 4px);border-radius:20px;background:linear-gradient(#ffe45a,#ffc414);box-shadow:inset 0 -3px 0 #f0a000,0 3px 6px rgba(200,120,0,.3);transition:transform .4s var(--spring)}
.seg.r .seg-thumb{transform:translateX(100%)}
.lb-list{display:flex;flex-direction:column}
.lb-row{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:18px;animation:rowIn .45s var(--ease) both}
.lb-row+.lb-row{border-top:1.5px solid #edf3ff}
.lb-row.me{background:linear-gradient(90deg,#fff6c9,#fffbe8);border-top-color:transparent;box-shadow:0 0 0 2px #ffd43a}
.rank{width:34px;flex:none;text-align:center;font-size:19px;font-weight:700;color:#3a64c8}
.rank img{width:34px}
.lb-av{width:44px;height:44px;flex:none}.lb-av img{width:100%;height:100%;object-fit:contain}
.lb-name{flex:1;min-width:0}.lb-name b{display:block;font-size:16.5px;color:#1447d6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-name small{display:flex;align-items:center;gap:3px;font-size:12px;color:#7d95c9}.lb-name small img{width:13px}
.lb-score{display:flex;align-items:center;gap:5px;font-size:17px;font-weight:700;color:#1447d6;font-variant-numeric:tabular-nums}.lb-score img{width:24px}
.lb-play{display:flex;margin:10px auto 2px}
.confetti-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.confetti-layer i{position:absolute;top:-30px;border-radius:3px;animation:fall linear infinite}
.confetti-layer img{position:absolute;top:-60px;animation:fall linear infinite}
@keyframes fall{0%{transform:translate(0,-20px) rotate(0)}100%{transform:translate(var(--dx),calc(var(--H) + 60px)) rotate(var(--rot))}}
/* DAILY */
#daily .topbar{gap:8px}#daily .logo-sm{margin-right:auto;height:52px}
.daily-title{text-align:center;font-size:46px;font-weight:700;color:#ffd21c;line-height:1;-webkit-text-stroke:9px #1a5ae6;paint-order:stroke fill;text-shadow:0 6px 0 #0e3cae,0 12px 18px rgba(8,40,130,.35);margin-top:4px;letter-spacing:.3px}
.curve-sub{text-align:center;color:#fff;font-size:16px;font-weight:700;-webkit-text-stroke:4px #1a5ae6;paint-order:stroke fill;transform:rotate(-2deg);margin:4px 0 0}
.daily-hero{position:relative;height:200px;display:flex;justify-content:center;margin-bottom:-26px}
.daily-hero .fox{height:210px;position:relative;filter:drop-shadow(0 14px 14px rgba(20,40,140,.3))}
.daily-hero .hero-glow{width:280px;height:280px;margin:-140px 0 0 -140px}
.d1{left:18px;top:70px;width:60px}.d2{right:22px;top:44px;width:62px;animation-delay:-1.2s}.d3{right:70px;top:4px;width:32px;animation-delay:-.6s}
.daily-panel{position:relative;z-index:1;border-radius:30px;background:linear-gradient(180deg,#3b95ff,#1c68ee);padding:10px 10px 12px;box-shadow:inset 0 3px 0 rgba(255,255,255,.4),0 0 0 3px rgba(255,255,255,.7),0 16px 28px rgba(10,50,180,.3)}
.ribbon{display:flex;align-items:center;justify-content:center;gap:8px;color:#fff;font-size:24px;font-weight:700;-webkit-text-stroke:5px #0e3cae;paint-order:stroke fill;padding:2px 0 10px}
.ribbon img{width:28px}
.days{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.day{position:relative;border-radius:18px;background:linear-gradient(#fff,#eaf3ff);padding:6px 4px 6px;text-align:center;box-shadow:inset 0 -4px 0 #c8dbfb,0 4px 8px rgba(0,30,140,.2)}
.day b{display:block;font-size:15px;color:#1447d6}
.dic{height:46px;display:flex;align-items:center;justify-content:center}.dic img{width:42px}
.dic .ck{width:44px}
.amt{display:flex;align-items:center;justify-content:center;gap:3px;font-size:14px;color:#1447d6;font-weight:700}.amt img{width:18px}
.day.done{background:linear-gradient(#f2fff2,#dff7e3);box-shadow:inset 0 -4px 0 #a7e5b4,0 4px 8px rgba(0,30,140,.2)}
.day.cur{box-shadow:inset 0 -4px 0 #f5c542,0 0 0 3px #ffd21c,0 6px 14px rgba(255,180,0,.5);animation:pulseDay 1.6s ease-in-out infinite}
@keyframes pulseDay{50%{transform:scale(1.04)}}
.day:nth-child(7){grid-column:span 2;background:linear-gradient(#ffe3f1,#ffc6e3);box-shadow:inset 0 -4px 0 #f59ac7,0 0 0 3px #ff5fa8,0 4px 8px rgba(0,30,140,.2)}
.day:nth-child(7) .dic{height:54px}.day:nth-child(7) .dic img{width:66px}
.best-tag{position:absolute;top:-12px;right:-6px;width:70px;animation:twinkle 1.8s ease-in-out infinite}
.today{display:flex;align-items:center;gap:6px;margin-top:10px;border-radius:22px;background:linear-gradient(90deg,#1552d8,#2f86ff);padding:8px 10px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)}
.today-chest{width:110px;margin:-6px 0 -6px -4px;filter:drop-shadow(0 6px 6px rgba(0,0,0,.25))}
.today-r{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}
.today-t{display:flex;align-items:center;gap:5px;color:#fff;font-size:20px;-webkit-text-stroke:4px #0e3cae;paint-order:stroke fill}.today-t img{width:18px}
.today-amt{display:flex;align-items:center;gap:6px;color:#fff;font-size:19px;font-weight:700}.today-amt img{width:26px}
/* FRIENDS */
.fr-title{margin-top:-4px}
.invite-card{display:flex;align-items:center;gap:10px;border-radius:26px;background:linear-gradient(135deg,#46a8ff,#1a60ea);padding:12px;margin-bottom:14px;box-shadow:inset 0 0 0 3px rgba(255,255,255,.6),0 12px 24px rgba(10,60,200,.3)}
.inv-chars{display:flex}.inv-chars img{width:46px;margin-right:-14px}.inv-chars img:nth-child(2){width:54px;z-index:1;margin-top:-6px}
.inv-copy{flex:1;padding-left:14px}.inv-copy b{display:block;color:#fff;font-size:19px}.inv-copy small{display:flex;align-items:center;gap:3px;color:#e3f1ff;font-size:14px}.inv-copy small img{width:18px}
.glass-list{display:flex;flex-direction:column;gap:10px}
.fr-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:22px;background:rgba(255,255,255,.96);box-shadow:inset 0 -4px 0 #d3e3fd,0 8px 16px rgba(10,60,200,.12);animation:rowIn .45s var(--ease) both}
.fr-row .lb-av{position:relative;width:52px;height:52px}
.fr-row .st{position:absolute;right:0;bottom:2px;width:14px;height:14px;border-radius:50%;background:#2fd24a;box-shadow:0 0 0 3px #fff}.fr-row .st.off{background:#b9c3d8}
.fr-row .btn-img,.fr-row .btn-blue{height:40px;font-size:15px;width:104px;padding:0 0 3px}
.fr-row .btn-blue{padding:0;box-shadow:inset 0 2px 0 rgba(255,255,255,.55),0 4px 0 #0e3fb4}
/* PROFILE */
#profile .topbar{height:86px;align-items:flex-start}
#profile .logo-sm{height:60px;margin-top:4px}
.pf-castle{position:absolute;left:50%;top:-6px;width:170px;margin-left:-70px;filter:drop-shadow(0 8px 10px rgba(10,50,160,.25))}
#profile .icon-btn{margin-top:8px}
.pf-head{display:flex;align-items:center;gap:10px;margin:-18px 0 12px}
.pf-avatar{position:relative;width:118px;flex:none}
.pf-avatar .crown{position:absolute;left:50%;top:-30px;width:56px;margin-left:-28px;z-index:2;transform:rotate(-8deg);filter:drop-shadow(0 4px 4px rgba(150,80,0,.3))}
.pf-avatar .ring{width:118px;height:118px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px #bfe0ff,0 10px 20px rgba(10,60,200,.3)}
.pf-avatar .ring img{width:100%;height:100%;object-fit:contain}
.pf-info{flex:1;min-width:0}
.pf-name{display:flex;align-items:center;gap:6px;font-size:31px;font-weight:700;color:#fff;-webkit-text-stroke:7px #1a5ae6;paint-order:stroke fill;text-shadow:0 4px 0 #0e3cae;white-space:nowrap;line-height:1.1}
.pf-name span{overflow:hidden;text-overflow:ellipsis;padding:0 2px}
.pen{width:36px;height:36px;flex:none}.pen img{width:100%}
.pf-lvl{display:flex;align-items:center;gap:6px;margin-top:6px}
.lv-pill{flex:none;background:linear-gradient(#3b8dff,#1447d6);color:#fff;font-size:18px;font-weight:700;padding:4px 12px;border-radius:16px;box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 0 0 2.5px #fff,0 4px 8px rgba(10,50,160,.3)}
.xpbar.big{height:18px;box-shadow:inset 0 2px 3px rgba(0,0,0,.35),0 0 0 2.5px #fff}
.xpTxt{display:block;text-align:right;font-size:14px;color:#1d56d8;margin-top:3px;font-weight:700}
.stats-card{display:flex;align-items:center;border-radius:26px;background:rgba(255,255,255,.95);padding:12px 8px;box-shadow:inset 0 0 0 2.5px #fff,inset 0 -5px 0 #d3e3fd,0 10px 22px rgba(10,60,200,.16);margin-bottom:12px}
.stats-card>div{flex:1;display:flex;align-items:center;justify-content:center;gap:8px}
.stats-card img{width:58px}
.stats-card b{display:block;font-size:27px;color:#1447d6;line-height:1}
.stats-card small{font-size:14px;color:#4f86e6}
.vsep{width:2px;height:48px;background:#dce8fb;border-radius:1px}
.ach-card{border-radius:26px;background:rgba(255,255,255,.95);padding:12px 10px;box-shadow:inset 0 0 0 2.5px #fff,0 10px 22px rgba(10,60,200,.16);margin-bottom:12px}
.sec-head.in{margin:0 4px 8px}.sec-head.in h3{font-size:21px}.sec-head.in h3 img{width:30px}
.ach-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.ach{text-align:center;border-radius:18px;background:linear-gradient(#f5f9ff,#e9f2ff);padding:8px 2px 7px;box-shadow:inset 0 0 0 1.5px #dbe8fd}
.ach img{width:58px;margin:0 auto 3px;filter:drop-shadow(0 4px 4px rgba(60,40,160,.2))}
.ach b{display:block;font-size:12.5px;color:#1447d6;line-height:1.1;white-space:nowrap}
.ach small{font-size:10.5px;color:#6a8ccf}
.ach.locked img{filter:grayscale(1) opacity(.45)}.ach.locked b{color:#8a9bc0}
.promo{display:block;width:100%;margin-bottom:12px;filter:drop-shadow(0 10px 16px rgba(10,60,200,.25))}.promo img{width:100%;border-radius:24px}
.glass-row{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border-radius:22px;background:rgba(255,255,255,.95);box-shadow:inset 0 0 0 2px #fff,inset 0 -4px 0 #d3e3fd,0 8px 16px rgba(10,60,200,.12);margin-bottom:10px}
.glass-row>img:first-child{width:44px}
.glass-row div{flex:1}.glass-row b{display:block;font-size:19px;color:#1447d6}.glass-row small{font-size:13px;color:#5a86d9}
.glass-row .chev{width:36px}
/* GAME */
#game{background:#3aa6ff;touch-action:none}
#cv{position:absolute;inset:0;width:100%;height:100%;display:block}
.hud{position:absolute;inset:0;pointer-events:none}
.hud>*{pointer-events:auto}
.hud-top{position:absolute;left:14px;right:14px;top:calc(var(--safe-t) + 6px);display:flex;align-items:center;gap:10px}
.hud-pause{width:62px;height:62px;flex:none}
.hud-pause img{width:100%;height:100%}
.hud-pill{position:relative;flex:1;height:46px;border-radius:24px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#2d86ff,#1350dc);box-shadow:inset 0 2px 0 rgba(255,255,255,.45),0 0 0 3px rgba(120,200,255,.8),0 6px 12px rgba(10,50,180,.35);color:#fff;font-size:24px;font-weight:700;pointer-events:none;padding-left:34px}
.hud-pill img{position:absolute;left:-8px;width:56px;top:50%;margin-top:-28px}
.hud-pill.dist{padding-left:26px}.hud-pill svg{position:absolute;left:12px;width:26px}
.hud-pill b{font-variant-numeric:tabular-nums}
.hud-pill.pop{animation:bump .3s var(--spring)}
.hud-prog{position:absolute;left:14px;top:calc(var(--safe-t) + 78px);display:flex;align-items:center;width:78%;pointer-events:none}
.hp-av{width:70px;height:70px;border-radius:50%;background:radial-gradient(#7fd0ff,#1f74f0);box-shadow:0 0 0 4px #fff,0 0 0 7px #2b7cff;overflow:hidden;z-index:1;flex:none}
.hp-av img{width:100%;height:140%;object-fit:cover}
.hp-bar{flex:1;height:22px;margin-left:-10px;border-radius:0 12px 12px 0;background:#0f3fb8;box-shadow:inset 0 2px 4px rgba(0,0,0,.4),0 0 0 3px rgba(255,255,255,.7);overflow:hidden}
.hp-bar i{display:block;height:100%;width:0;background:linear-gradient(#fff080,#ffc414);box-shadow:inset 0 -4px 0 #f19c00;transition:width .2s linear}
.hp-stars{display:flex;margin-left:4px}.hp-stars img{width:36px;filter:grayscale(1) brightness(1.4) opacity(.6);transition:filter .3s,transform .4s var(--spring)}.hp-stars img.on{filter:none;transform:scale(1.15)}
.hud-boss{position:absolute;left:50%;top:calc(var(--safe-t) + 78px);width:78%;transform:translateX(-50%);display:none;align-items:center;pointer-events:none}
.hud-boss img{width:66px;z-index:1}
.boss-bar{flex:1;height:26px;margin-left:-12px;border-radius:0 14px 14px 0;background:#172a66;box-shadow:inset 0 2px 4px rgba(0,0,0,.4),0 0 0 3px #fff;overflow:hidden}
.boss-bar i{display:block;height:100%;width:100%;background:linear-gradient(#ff8fa6,#ff2e5f 60%,#e0194a);transition:width .35s var(--ease)}
.hud-power{position:absolute;right:14px;top:calc(var(--safe-t) + 164px);display:flex;flex-direction:column;gap:8px;pointer-events:none}
.pw{position:relative;width:58px;height:58px}
.pw img{width:100%}
.pw svg{position:absolute;inset:-4px;width:66px;height:66px;transform:rotate(-90deg)}
.pw circle{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round}
.hud-jet{position:absolute;left:14px;top:calc(var(--safe-t) + 170px);width:64px;display:none;pointer-events:none}
.hud-jet img{width:100%}
.hud-jet i{position:absolute;left:28%;right:28%;bottom:9%;height:0;border-radius:12px;background:linear-gradient(#bff6ff,#35d2ff);box-shadow:0 0 12px #4ae0ff}
.hud-x2{position:absolute;right:10px;top:40%;width:92px;opacity:0;transform:scale(.4);transition:opacity .3s,transform .4s var(--spring);pointer-events:none}
.hud-x2.on{opacity:1;transform:scale(1);animation:twinkle 1.4s ease-in-out infinite}
.countdown{position:absolute;left:0;right:0;top:36%;text-align:center;font-size:120px;font-weight:700;color:#ffd21c;-webkit-text-stroke:10px #1a5ae6;paint-order:stroke fill;text-shadow:0 8px 0 #0e3cae;pointer-events:none;opacity:0}
.countdown.go{animation:cd .8s var(--spring) both}
@keyframes cd{0%{opacity:0;transform:scale(2.2)}30%{opacity:1;transform:scale(1)}75%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.6)}}
.toast-mid{position:absolute;left:0;right:0;top:30%;text-align:center;font-size:40px;font-weight:700;color:#fff;-webkit-text-stroke:7px #1a5ae6;paint-order:stroke fill;text-shadow:0 5px 0 #0e3cae;pointer-events:none;opacity:0}
.toast-mid.show{animation:cd 1.2s var(--spring) both}
.ctrl{position:absolute;bottom:calc(var(--safe-b) + 24px);width:92px;height:92px;border-radius:50%;background:radial-gradient(circle at 50% 35%,rgba(120,150,255,.75),rgba(60,80,220,.7));box-shadow:inset 0 3px 0 rgba(255,255,255,.4),0 0 0 4px rgba(255,255,255,.55),0 10px 20px rgba(20,30,120,.3);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);transition:transform .12s}
.ctrl:active{transform:scale(.9)}
.ctrl::after{content:"";position:absolute;left:50%;top:50%;width:28px;height:28px;border-left:12px solid #fff;border-bottom:12px solid #fff;border-radius:6px;transform:translate(-30%,-50%) rotate(45deg)}
.ctrl.left{left:20px}.ctrl.right{right:20px}.ctrl.right::after{transform:translate(-70%,-50%) rotate(-135deg)}
.hint{position:absolute;left:50%;bottom:calc(var(--safe-b) + 130px);transform:translateX(-50%);white-space:nowrap;background:rgba(10,40,140,.55);color:#fff;font-size:14px;padding:8px 14px;border-radius:20px;pointer-events:none;transition:opacity .6s}
/* COMPLETE */
.rays{position:absolute;left:50%;top:38%;width:180vmax;height:180vmax;margin:-90vmax 0 0 -90vmax;background:repeating-conic-gradient(rgba(255,255,255,.22) 0 8deg,rgba(255,255,255,0) 8deg 20deg);animation:spin 30s linear infinite;-webkit-mask:radial-gradient(closest-side,#000 20%,transparent 70%);mask:radial-gradient(closest-side,#000 20%,transparent 70%)}
@keyframes spin{to{transform:rotate(360deg)}}
.lc-wrap{position:absolute;inset:calc(var(--safe-t) + 74px) 0 calc(var(--safe-b) + 24px);display:flex;flex-direction:column;align-items:center}
.lc-logo{width:92%;filter:drop-shadow(0 10px 14px rgba(10,50,160,.4))}
.lc-over{display:none;font-size:60px}
.lc-stars{display:flex;gap:6px;margin:10px 0 0}
.lc-stars .st{width:92px;filter:grayscale(1) brightness(1.5) opacity(.45);transform:scale(.9)}
.lc-stars .st.s2{margin-top:-18px;width:100px}
.lc-stars .st.on{animation:starPop .6s var(--spring) both;filter:drop-shadow(0 6px 10px rgba(255,170,0,.55))}
@keyframes starPop{0%{transform:scale(0) rotate(-40deg)}100%{transform:scale(1)}}
.lc-hero{position:relative;flex:1;width:100%;min-height:150px}
.lc-pad{position:absolute;left:10%;right:10%;bottom:0;height:70px;border-radius:50%;background:radial-gradient(ellipse at 50% 40%,#fff3a6,#ffcb3a 55%,#e8a100 100%);box-shadow:0 8px 0 #c98600,0 18px 30px rgba(160,100,0,.35)}
.lc-fox{position:absolute;left:50%;bottom:30px;height:96%;transform:translateX(-50%);animation:jumpy 1.1s ease-in-out infinite;filter:drop-shadow(0 16px 14px rgba(20,40,140,.3))}
@keyframes jumpy{0%,100%{transform:translateX(-50%) translateY(0) scale(1,1)}10%{transform:translateX(-50%) translateY(4px) scale(1.04,.95)}50%{transform:translateX(-50%) translateY(-26px) scale(.98,1.03)}}
.lc-card{width:80%;margin-top:14px;padding:12px;border-radius:26px;background:rgba(255,255,255,.95);box-shadow:inset 0 0 0 3px #fff,inset 0 -5px 0 #d4e4ff,0 12px 24px rgba(10,60,200,.2);text-align:center}
.lc-card b{font-size:24px}
.lc-amt{display:flex;align-items:center;justify-content:center;gap:10px;font-size:50px;color:#1447d6;line-height:1.1}
.lc-amt img{width:64px}
.lc-card small{color:var(--ink2);font-size:15px}
.lc-actions{display:flex;align-items:center;gap:14px;margin-top:16px}
.lc-actions .btn-lg{min-width:200px}
/* MODALS & SHEETS */
.scrim{position:absolute;inset:0;background:rgba(8,30,100,.45);opacity:0;pointer-events:none;transition:opacity .3s;z-index:80;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.scrim.on{opacity:1;pointer-events:auto}
.modal{position:absolute;left:0;right:0;z-index:90;display:flex;flex-direction:column;align-items:center;opacity:0;pointer-events:none;transform:scale(.85);transition:transform .45s var(--spring),opacity .25s}
.modal.on{opacity:1;pointer-events:auto;transform:none}
.modal.center{top:0;bottom:0;justify-content:center;padding:20px}
.modal.booster{top:calc(var(--safe-t) + 60px);bottom:calc(var(--safe-b) + 20px);padding:0 16px}
.bm-panel{position:relative;width:100%;border-radius:36px;padding:20px 14px 14px;background:linear-gradient(180deg,#3a98ff,#1c6df0 30%,#1860e8);box-shadow:inset 0 3px 0 rgba(255,255,255,.45),inset 0 -6px 0 rgba(0,30,140,.3),0 0 0 4px rgba(255,255,255,.35),0 24px 40px rgba(5,30,110,.45)}
.bm-title{text-align:center;color:#fff;font-size:28px;padding:0 46px;white-space:nowrap;-webkit-text-stroke:5px #0f45c4;paint-order:stroke fill;text-shadow:0 4px 0 #0b36a0}
.bm-sub{text-align:center;color:#d5ecff;font-size:21px;margin:2px 0 14px}
.x-btn{position:absolute;right:12px;top:12px;width:52px;height:52px;border-radius:50%;background:linear-gradient(#fff,#e1ecff);box-shadow:inset 0 -4px 0 #bcd3ff,0 5px 10px rgba(0,0,0,.2);z-index:2}
.x-btn::before,.x-btn::after{content:"";position:absolute;left:50%;top:50%;width:24px;height:6px;border-radius:3px;background:#1a4fe0;transform:translate(-50%,-50%) rotate(45deg)}
.x-btn::after{transform:translate(-50%,-50%) rotate(-45deg)}
.bm-list{display:flex;flex-direction:column;gap:10px}
.bm-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:26px;background:linear-gradient(#fff,#eef5ff);box-shadow:inset 0 -5px 0 #c9dcff,0 6px 12px rgba(0,30,140,.25);transition:box-shadow .25s,transform .3s var(--spring)}
.bm-item.sel{box-shadow:inset 0 -5px 0 #9fe3a9,0 0 0 4px #2fd24a,0 6px 12px rgba(0,30,140,.25)}
.bm-item>img{width:96px;height:96px;flex:none;filter:drop-shadow(0 6px 6px rgba(0,0,0,.2))}
.bm-info{flex:1;min-width:0}
.bm-info b{font-size:27px;color:#1447d6;display:block;line-height:1.05}
.bm-info small{font-size:16px;color:#3066dc;display:block;margin:2px 0 6px}
.bm-row{display:flex;align-items:center;justify-content:space-between;gap:6px}
.bm-dur{display:flex;align-items:center;gap:5px;font-size:22px;color:#1447d6}
.bm-dur img{width:28px}
.bm-use{height:48px;min-width:108px;font-size:24px;padding:0 14px}
.bm-use small{font-size:14px;display:inline-flex;align-items:center;gap:2px;color:#e8ffe9;-webkit-text-stroke:0}
.bm-use small img{width:16px}
.bm-play{width:78%;margin-top:-8px;z-index:2;height:84px;font-size:50px}
.card-modal{position:relative;width:100%;max-width:360px;border-radius:36px;padding:24px 20px 22px;background:linear-gradient(180deg,#3a98ff,#1c6df0 35%,#1860e8);box-shadow:inset 0 3px 0 rgba(255,255,255,.45),0 0 0 4px rgba(255,255,255,.4),0 24px 40px rgba(5,30,110,.45);display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.pm-fox{height:150px;animation:floaty 3s ease-in-out infinite}
.card-modal .btn-lg{width:100%;font-size:26px;height:64px}
.pm-row{display:flex;gap:10px;width:100%}.pm-row>*{flex:1}
.tgl{padding:10px;border-radius:18px;background:rgba(255,255,255,.18);color:#fff;font-size:16px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.4)}
.tgl.off{opacity:.5;text-decoration:line-through}
.cm-sub{color:#e0f0ff;font-size:18px}
.btn-green img{width:30px}
.cm-timer{width:100%;height:8px;border-radius:4px;background:rgba(0,0,0,.25);overflow:hidden}
.cm-timer i{display:block;height:100%;width:100%;background:#ffd21c}
.sheet{position:absolute;left:0;right:0;bottom:0;z-index:90;max-height:88%;overflow-y:auto;border-radius:34px 34px 0 0;background:linear-gradient(#f6faff,#e9f2ff);padding:10px 18px calc(var(--safe-b) + 24px);box-shadow:0 -10px 40px rgba(5,30,110,.35);transform:translateY(105%);transition:transform .5s var(--ease);will-change:transform}
.sheet.on{transform:none}
.grab{width:48px;height:6px;border-radius:3px;background:#c3d4f3;margin:4px auto 12px}
.sh-title{font-size:30px;text-align:center;color:#173da8}
.sh-sub{text-align:center;color:var(--ink2);font-size:16px;margin-bottom:14px}
.shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.shop-item{border-radius:24px;padding:14px 10px;text-align:center;background:#fff;box-shadow:inset 0 -5px 0 #d4e4ff,0 8px 16px rgba(10,60,200,.12)}
.shop-item img{width:84px;margin:0 auto}
.shop-item b{display:block;font-size:24px;color:#173da8}
.shop-item .btn-sm{margin-top:6px;width:100%}
.set-list{display:flex;flex-direction:column;gap:10px;margin:10px 0 16px}
.set-row{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-radius:20px;background:#fff;font-size:19px;box-shadow:0 4px 10px rgba(10,60,200,.08)}
.set-row input{display:none}
.sw{width:56px;height:32px;border-radius:16px;background:#cdd7ea;position:relative;transition:background .25s}
.sw::after{content:"";position:absolute;left:3px;top:3px;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.25);transition:transform .3s var(--spring)}
.set-row input:checked+.sw{background:#2fd24a}.set-row input:checked+.sw::after{transform:translateX(24px)}
.sheet .btn-blue,.sheet .btn-red{margin-bottom:10px}
.ver{text-align:center;font-size:13px;color:#8ea0c6;margin-top:6px}
.ep-avs{display:flex;justify-content:center;gap:12px;margin:10px 0 18px}
.ep-av{width:92px;height:92px;border-radius:50%;background:radial-gradient(#fff,#d7e8ff);overflow:hidden;box-shadow:0 0 0 3px #cfe0ff;transition:box-shadow .2s,transform .3s var(--spring)}
.ep-av img{width:100%;height:125%;object-fit:cover;object-position:50% 0}
.ep-av.on{box-shadow:0 0 0 5px #ffc414,0 8px 16px rgba(200,130,0,.3);transform:scale(1.06)}
.ep-field{display:block;margin-bottom:18px}
.ep-field span{display:block;font-size:16px;color:var(--ink2);margin:0 0 6px 6px}
.ep-field input{width:100%;height:56px;border-radius:18px;border:3px solid #cfe0ff;background:#fff;padding:0 16px;font:inherit;font-size:22px;color:#173da8;outline:none;-webkit-user-select:text;user-select:text}
.ep-field input:focus{border-color:#2b7cff}
.ach-row{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:20px;background:#fff;box-shadow:0 4px 10px rgba(10,60,200,.08)}
.ach-row img{width:56px}.ach-row div{flex:1}.ach-row b{display:block;font-size:19px}.ach-row small{color:var(--ink2);font-size:14px}
.ach-row.locked img{filter:grayscale(1) opacity(.45)}
.gift-stage{position:relative;height:190px;width:100%;display:flex;align-items:center;justify-content:center}
.gift-rays{position:absolute;inset:-20px;background:repeating-conic-gradient(rgba(255,255,255,.3) 0 10deg,transparent 10deg 24deg);-webkit-mask:radial-gradient(closest-side,#000,transparent);mask:radial-gradient(closest-side,#000,transparent);animation:spin 12s linear infinite}
.gift{width:150px;position:relative;animation:giftWiggle 1.6s ease-in-out infinite}
@keyframes giftWiggle{0%,60%,100%{transform:rotate(0)}70%{transform:rotate(-8deg) scale(1.05)}80%{transform:rotate(8deg) scale(1.05)}90%{transform:rotate(-4deg)}}
.gift.open{animation:giftOpen .7s var(--spring) forwards}
@keyframes giftOpen{40%{transform:scale(1.3)}100%{transform:scale(0);opacity:0}}
.gift-amt{position:absolute;font-size:56px;color:#ffd21c;-webkit-text-stroke:7px #1a5ae6;paint-order:stroke fill;opacity:0}
.gift-amt.on{animation:popIn .6s var(--spring) both;opacity:1}
.toast{position:absolute;left:50%;top:calc(var(--safe-t) + 12px);z-index:200;transform:translate(-50%,-150%);background:rgba(255,255,255,.97);color:#173da8;padding:12px 20px;border-radius:22px;font-size:17px;box-shadow:0 10px 24px rgba(10,50,160,.3);transition:transform .45s var(--spring);white-space:nowrap}
.toast.on{transform:translate(-50%,0)}
.fly-layer{position:absolute;inset:0;pointer-events:none;z-index:300}
.fly-layer img{position:absolute;width:40px;left:0;top:0;will-change:transform}
/* ===== overrides v1.1 ===== */
.hp-av{background:#fff}.hp-av img{height:100%;object-fit:contain}
.hud-pill img{width:54px;margin-top:-27px}
.lc-wrap{inset:calc(var(--safe-t) + 58px) 0 calc(var(--safe-b) + 20px)}
.lc-logo{width:330px;animation:popIn .7s var(--spring) both}
.lc-stars{gap:2px;margin:6px 0 0;align-items:flex-start}
.lc-stars .st{width:88px}.lc-stars .st.s2{width:100px;margin-top:-12px}
.lc-hero{position:relative;flex:1;width:100%;min-height:140px}
.lc-fox{position:absolute;left:50%;bottom:0;height:100%;max-height:360px;width:auto;transform:translateX(-50%);animation:none;filter:drop-shadow(0 16px 16px rgba(20,40,140,.3))}
.lc-card{width:250px;margin-top:-4px;padding:10px 12px 8px;border-radius:24px;background:linear-gradient(#fff,#eaf3ff);box-shadow:inset 0 0 0 3px #cfe3ff,0 12px 24px rgba(10,60,200,.22);position:relative;z-index:1}
.lc-card b{font-size:21px;color:#1447d6}
.lc-amt{font-size:48px}.lc-amt img{width:58px}
.lc-actions{gap:12px;margin-top:14px}
.round-btn{width:66px;height:66px;border-radius:50%;background:linear-gradient(#fff,#e2eeff);box-shadow:inset 0 -5px 0 #bcd4fb,0 0 0 3px #fff,0 8px 16px rgba(10,60,200,.25);display:flex;align-items:center;justify-content:center;transition:transform .2s var(--spring)}
.round-btn:active{transform:scale(.92)}
.round-btn svg{width:32px;height:32px;fill:none;stroke:#1d62ee;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
#lcNext{width:230px}
.rays{width:1400px;height:1400px;margin:-700px 0 0 -700px}
/* booster */
.modal.booster{top:calc(var(--safe-t) + 44px);bottom:auto;padding:0 14px}
.bm-panel{border-radius:34px;padding:18px 12px 16px;background:linear-gradient(180deg,#44a2ff,#1f70f2 22%,#1a62ea);box-shadow:inset 0 4px 0 rgba(255,255,255,.5),inset 0 -8px 0 rgba(0,40,160,.35),0 0 0 3px rgba(255,255,255,.55),0 26px 44px rgba(5,30,110,.45)}
.bm-title{font-size:30px;padding:0 50px;-webkit-text-stroke:6px #0f45c4}
.bm-sub{font-size:19px;color:#e2f2ff;margin:2px 0 12px}
.x-img{position:absolute;right:8px;top:8px;width:50px;height:50px;z-index:3;transition:transform .2s var(--spring)}.x-img img{width:100%}.x-img:active{transform:scale(.9)}
.bm-item{border-radius:24px;padding:10px 12px 10px 8px;background:linear-gradient(#fdfeff,#e8f2ff);box-shadow:inset 0 0 0 2.5px #fff,inset 0 -5px 0 #bcd4fb,0 6px 12px rgba(0,30,140,.28)}
.bm-item>img{width:92px;height:92px}
.bm-info b{font-size:25px}.bm-info small{font-size:15px}
.bm-dur{font-size:20px}.bm-dur img{width:26px}
.bm-use{height:46px;min-width:112px;font-size:22px;padding:0 12px 4px;border-radius:0;box-shadow:none}
.bm-use small{-webkit-text-stroke:0;color:#eaffea;font-size:13px;margin-left:2px}
.bm-play{width:290px;margin-top:-6px;position:relative;z-index:2}
.bm-play.btn-img{height:auto}
.card-modal .x-img{right:10px;top:10px}
.card-modal .btn-img.lg{width:100%;max-width:280px}
.pm-fox{height:150px}
.btn-green.btn-lg{height:64px;width:100%;font-size:22px;padding:0 10px 4px}
.gift{width:160px}
.ep-av{background:#fff}.ep-av img{height:100%;object-fit:contain}
.sheet .btn-img.wide{width:100%;height:70px}
.shop-item .btn-img{width:100%;height:44px;font-size:18px;margin-top:6px}
.ach-row img{width:52px}
.hint{bottom:calc(var(--safe-b) + 132px)}
.toast{white-space:normal;max-width:340px;text-align:center}
@media (max-height:700px){.home-hero{min-height:120px}}
/* fixes 2 */
.ob-fox{left:0;right:0;margin:0 auto;translate:none;height:calc(var(--H) * .43);max-height:400px}
.t-fox,.t-boss{left:0;right:0;margin:0 auto;translate:none}
.greet{font-size:19px}
.player-card{padding-right:10px}
.sq-card{width:80px}
.gm{aspect-ratio:auto;height:auto;min-height:168px;background-size:auto;filter:none;border-radius:24px;padding:10px 12px 12px;display:block;text-align:left;box-shadow:inset 0 0 0 2.5px rgba(255,255,255,.95),inset 0 -5px 0 var(--sh),0 10px 18px rgba(10,60,200,.14)}
.gm::before{content:"";position:absolute;inset:0;border-radius:24px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.35) 0 10px,transparent 10px 22px);-webkit-mask:linear-gradient(200deg,#000,transparent 55%);mask:linear-gradient(200deg,#000,transparent 55%);pointer-events:none}
.gm.blue{background:linear-gradient(160deg,#eaf6ff,#cfe8ff);--c:#1669e8;--sh:#b4d6fb}
.gm.purple{background:linear-gradient(160deg,#f3ecff,#e1d3ff);--c:#7a3fe0;--sh:#cdb8f7}
.gm.green{background:linear-gradient(160deg,#eafbef,#cdf1da);--c:#139a4a;--sh:#a9e3be}
.gm.orange{background:linear-gradient(160deg,#fff6e3,#ffe7bf);--c:#e8750c;--sh:#f7d39a}
.gm .gi{width:84px;height:78px;object-fit:contain;margin:0 0 4px -4px;filter:drop-shadow(0 5px 5px rgba(0,0,0,.15))}
.gm b{display:block;color:var(--c);font-size:20px}
.gm small{display:block;max-width:none;padding-right:44px;font-size:12.5px}
.gm .ga{position:absolute;right:10px;bottom:12px;width:42px;filter:drop-shadow(0 4px 5px rgba(0,0,0,.18))}
.invite-card{gap:8px}.inv-chars img{width:40px;margin-right:-12px}.inv-chars img:nth-child(2){width:48px}
.inv-copy{min-width:0;padding-left:12px}.inv-copy b{font-size:18px;white-space:nowrap}.inv-copy small{white-space:nowrap;font-size:13.5px}
.lc-wrap{inset:calc(var(--safe-t) + 64px) 0 calc(var(--safe-b) + 20px)}
.inv-chars img:nth-child(3){display:none}
.invite-card .btn-img.sm{width:96px;flex:none}
.inv-copy small{font-size:13px}

/* booster v2 */
.bm-ico{position:relative;width:92px;height:92px;flex:none;display:grid;place-items:center}
.bm-ico::before{content:"";position:absolute;inset:-6px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,236,140,.75),rgba(255,236,140,0));opacity:0;transition:opacity .3s}
.bm-item.sel .bm-ico::before{opacity:1;animation:bmPulse 1.4s ease-in-out infinite}
.bm-ico img{position:relative;width:92px;height:92px;object-fit:contain;filter:drop-shadow(0 5px 5px rgba(10,40,140,.22));animation:bmFloat 3s ease-in-out infinite}
.bm-item:nth-child(2) .bm-ico img{animation-delay:-1s}.bm-item:nth-child(3) .bm-ico img{animation-delay:-2s}
.bm-ico .bm-ok{position:absolute;right:-2px;bottom:2px;width:30px;height:30px;border-radius:50%;background:#2fd24a;border:3px solid #fff;display:grid;place-items:center;transform:scale(0);transition:transform .35s var(--spring);box-shadow:0 3px 6px rgba(0,80,20,.3)}
.bm-item.sel .bm-ok{transform:scale(1)}
.bm-ok svg{width:16px;height:16px}
.bm-dur svg{width:24px;height:24px;flex:none}
.bm-use .ci{width:17px;height:17px;vertical-align:-3px}
@keyframes bmFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-4px) rotate(2deg)}}
@keyframes bmPulse{0%,100%{transform:scale(.92)}50%{transform:scale(1.06)}}
.bm-play{margin-top:10px}
