:root{--bg: #0a0918;--bg-2: #141033;--panel: rgba(255, 255, 255, .06);--panel-2: rgba(255, 255, 255, .1);--border: rgba(255, 255, 255, .12);--border-strong: rgba(255, 255, 255, .24);--text: #f2f5ff;--muted: #a7b0d0;--primary: #8b5cf6;--primary-2: #3d7bff;--cyan: #38d6ff;--teal: #2ee6c5;--gold: #ffc83d;--pink: #ff5cc8;--green: #37d67a;--danger: #ff4d5e;--grad: linear-gradient(135deg, #8b5cf6, #3d7bff);--grad-gold: linear-gradient(135deg, #ffd93d, #ff9b34);--grad-cyan: linear-gradient(135deg, #38d6ff, #2ee6c5);--r-sm: 10px;--r: 16px;--r-lg: 24px;--shadow: 0 10px 34px rgba(0, 0, 0, .45);--glow: 0 0 26px rgba(139, 92, 246, .45);--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--btn: clamp(54px, 14.2vw, 72px);--pad-gap: clamp(14px, 4.4vw, 22px);--zone-gap: clamp(20px, 9vw, 72px);--rail-gap: 10px;font-family:Nunito,ui-sans-serif,system-ui,sans-serif;color:var(--text);background:var(--bg)}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{background:radial-gradient(ellipse 70% 45% at 50% -10%,rgba(139,92,246,.5),transparent 65%),radial-gradient(ellipse 60% 40% at 100% 100%,rgba(56,214,255,.22),transparent 60%),linear-gradient(180deg,#0a0918,#141033 60%,#0a0918);background-attachment:fixed;overscroll-behavior:none;user-select:none}h1,h2,h3,h4,.font-display{font-family:Fredoka,Nunito,sans-serif;font-weight:600;letter-spacing:-.01em}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background:#ffffff2e;border-radius:99px}.app{position:relative;height:100%;overflow:hidden}.screen{position:absolute;inset:0;display:flex;flex-direction:column;animation:fadeUp .32s ease both}.scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 14px calc(90px + var(--safe-b))}.glass{background:var(--panel);border:1px solid var(--border);border-radius:var(--r);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow)}.muted{color:var(--muted);font-size:.82rem}.center{display:flex;align-items:center;justify-content:center}.row{display:flex;align-items:center;gap:8px}.between{display:flex;align-items:center;justify-content:space-between;gap:10px}.col{display:flex;flex-direction:column;gap:8px}@keyframes fadeUp{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes shine{0%{background-position:200% 50%}to{background-position:-200% 50%}}@keyframes pop{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border-radius:999px;font-weight:800;font-size:.95rem;transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;min-height:46px}.btn:active{transform:scale(.95)}.btn:disabled{opacity:.45;filter:grayscale(.5)}.btn-primary{background:var(--grad);color:#fff;box-shadow:0 8px 26px #8b5cf673}.btn-gold{background:var(--grad-gold);color:#3a2600;box-shadow:0 8px 26px #ffc83d59}.btn-cyan{background:var(--grad-cyan);color:#062a2a;box-shadow:0 8px 26px #38d6ff59}.btn-ghost{background:var(--panel);border:1px solid var(--border-strong);color:var(--text)}.btn-danger{background:#ff4d5e2e;border:1px solid rgba(255,77,94,.5);color:#ffb3ba}.btn-sm{padding:8px 13px;min-height:36px;font-size:.82rem}.btn-block{width:100%}.btn-lg{padding:17px 26px;font-size:1.1rem;min-height:58px}.icon-btn{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--panel);border:1px solid var(--border);transition:transform .16s,background .16s}.icon-btn:active{transform:scale(.92)}.topbar{display:flex;align-items:center;gap:8px;padding:calc(10px + var(--safe-t)) 14px 10px}.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:#00000059;border:1px solid var(--border);font-weight:800;font-size:.86rem;backdrop-filter:blur(10px)}.chip.gold{color:var(--gold);border-color:#ffc83d66}.chip.crystal{color:var(--cyan);border-color:#38d6ff66}.chip.xp{color:var(--teal);border-color:#2ee6c559}.spacer{flex:1}.bar{height:10px;border-radius:99px;background:#0006;overflow:hidden;border:1px solid var(--border)}.bar>i{display:block;height:100%;border-radius:99px;background:var(--grad);transition:width .4s ease}.bar.gold>i{background:var(--grad-gold)}.bar.cyan>i{background:var(--grad-cyan)}.bar.green>i{background:linear-gradient(135deg,#37d67a,#2ee6c5)}.bar.thin{height:7px}.hero{position:relative;flex:1}.hero-canvas{position:absolute;inset:0;width:100%;height:100%}.hero-title{position:absolute;top:9%;inset-inline:0;text-align:center;pointer-events:none}.hero-title h1{font-size:clamp(2.1rem,11vw,3.4rem);font-weight:700;line-height:1;background:linear-gradient(180deg,#fff,#cbb8ff 60%,#8b5cf6);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 6px 24px rgba(139,92,246,.75))}.hero-title p{color:#d9d2ff;font-weight:700;font-size:.9rem;margin-top:6px;text-shadow:0 2px 10px #000}.menu-actions{position:absolute;inset-inline:0;bottom:calc(12px + var(--safe-b));padding:0 16px;display:flex;flex-direction:column;gap:10px}.menu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.menu-tile{display:flex;flex-direction:column;align-items:center;gap:5px;padding:11px 4px;border-radius:var(--r);background:#0a09189e;border:1px solid var(--border);backdrop-filter:blur(10px);font-size:.72rem;font-weight:800;transition:transform .15s,border-color .15s;position:relative}.menu-tile:active{transform:scale(.94)}.menu-tile .badge-dot{position:absolute;top:6px;inset-inline-end:6px;width:9px;height:9px;border-radius:99px;background:var(--danger);box-shadow:0 0 10px var(--danger)}.menu-tile span{color:var(--text)}.tabs{display:flex;gap:8px;overflow-x:auto;padding:10px 0;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tab{flex:0 0 auto;display:flex;align-items:center;gap:7px;padding:9px 14px;border-radius:999px;background:var(--panel);border:1px solid var(--border);font-weight:800;font-size:.82rem;color:var(--muted);transition:transform .15s,background .2s,color .2s}.tab:active{transform:scale(.95)}.tab.active{background:var(--grad);color:#fff;border-color:transparent;box-shadow:var(--glow)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px}.grid.wide{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.card-item{position:relative;border-radius:var(--r);padding:8px;background:#0c0a20b8;border:1px solid var(--border);overflow:hidden;text-align:center;transition:transform .16s,border-color .16s,box-shadow .16s}.card-item:active{transform:scale(.96)}.card-item.owned{border-color:#2ee6c580}.card-item.equipped{border-color:var(--gold);box-shadow:0 0 0 2px #ffc83d59,var(--glow)}.card-item.locked{opacity:.82}.card-item.r-common{box-shadow:inset 0 -3px #9fb0cc99}.card-item.r-rare{box-shadow:inset 0 -3px #38b6ffcc}.card-item.r-epic{box-shadow:inset 0 -3px #b44bffe6}.card-item.r-legendary{box-shadow:inset 0 -3px #ffb02e,0 0 18px #ffb02e40}.card-item.r-secret{box-shadow:inset 0 -3px #ff4d9d,0 0 18px #ff4d9d59}.thumb{width:100%;aspect-ratio:1;border-radius:12px;background:radial-gradient(circle at 50% 40%,#8b5cf64d,#00000040);display:grid;place-items:center;overflow:hidden}.thumb img{width:100%;height:100%;object-fit:contain}.card-name{font-size:.72rem;font-weight:800;margin-top:6px;line-height:1.25;height:2.4em;overflow:hidden}.price{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;font-weight:800;margin-top:4px}.price.gold{color:var(--gold)}.price.crystal{color:var(--cyan)}.tag{position:absolute;top:6px;inset-inline-start:6px;padding:2px 7px;border-radius:99px;font-size:.6rem;font-weight:900;letter-spacing:.03em}.tag.common{background:#9fb0cc38;color:#d3dcf1}.tag.rare{background:#38b6ff38;color:#8fdcff}.tag.epic{background:#b44bff3d;color:#dcaeff}.tag.legendary{background:#ffb02e38;color:#ffd79a}.tag.secret{background:#ff4d9d38;color:#ffb0d4}.tag.eq{background:#2ee6c538;color:#9ffce9;inset-inline-start:auto;inset-inline-end:6px}.lock-line{font-size:.64rem;color:var(--muted);margin-top:3px;min-height:1.6em}.section-title{display:flex;align-items:center;gap:8px;font-family:Fredoka,sans-serif;font-size:1.05rem;margin:14px 2px 8px}.section-title .line{flex:1;height:1px;background:var(--border)}.overlay{position:absolute;inset:0;z-index:40;display:grid;place-items:center;padding:18px;background:#04030ebd;backdrop-filter:blur(7px);animation:fadeUp .22s ease both}.modal{width:100%;max-width:460px;max-height:88%;overflow-y:auto;padding:18px;border-radius:var(--r-lg);background:linear-gradient(180deg,#191341,#100d2c);border:1px solid var(--border-strong);box-shadow:var(--shadow)}.modal h3{font-size:1.25rem;margin-bottom:4px}.toast-wrap{position:absolute;inset-inline:20%;top:43%;z-index:90;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast{padding:11px 15px;border-radius:14px;font-size:.86rem;font-weight:800;text-align:center;animation:pop .25s ease both;background:#141033f2;border:1px solid var(--border-strong);box-shadow:var(--shadow)}.toast.success{border-color:#37d67a99;color:#b6ffd2}.toast.error{border-color:#ff4d5e99;color:#ffc0c6}.toast.info{border-color:#38d6ff80;color:#c2f0ff}.game-wrap{position:absolute;inset:0;overflow:hidden;touch-action:none}.game-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.hud{position:absolute;inset:0;pointer-events:none;padding:calc(8px + var(--safe-t)) 10px calc(10px + var(--safe-b));display:flex;flex-direction:column}.hud-top{display:flex;align-items:flex-start;gap:6px}.hud-stats{display:flex;flex-direction:column;gap:5px}.hud-row{display:flex;align-items:center;gap:5px}.hearts{display:flex;gap:3px}.heart{width:20px;height:20px}.energy-wrap{width:118px}.level-label{font-size:.68rem;font-weight:800;color:#e8e4ff;text-shadow:0 1px 6px #000}.hud-bottom{position:absolute;inset-inline:0;bottom:calc(14px + var(--safe-b));display:flex;align-items:flex-end;justify-content:space-between;gap:var(--zone-gap);direction:ltr;padding-inline:calc(14px + env(safe-area-inset-left,0px)) calc(14px + env(safe-area-inset-right,0px));pointer-events:none}.hud-bottom.stick-right{flex-direction:row-reverse}.hud-zone{position:relative;display:flex;align-items:flex-end;pointer-events:none;direction:rtl}.stick-zone{flex:0 0 auto}.pad-zone{flex:0 1 auto}.pad{display:grid;grid-template-columns:repeat(3,auto);grid-template-areas:"interact power slide" "jump dash .";gap:var(--pad-gap);align-items:end;justify-items:center;transform:scale(var(--btn-scale, 1));transform-origin:bottom left}.pad.mirror{grid-template-areas:"slide power interact" ". dash jump";transform-origin:bottom right}.pad.no-slide{grid-template-columns:repeat(2,auto);grid-template-areas:"interact power" "jump dash"}.pad.no-slide.mirror{grid-template-areas:"power interact" "dash jump"}.hud-btn{pointer-events:auto;width:var(--btn);height:var(--btn);border-radius:50%;display:grid;place-items:center;gap:2px;font-weight:900;font-size:clamp(.58rem,2.7vw,.7rem);line-height:1;color:#fff;background:radial-gradient(circle at 35% 30%,#ffffff59,#00000040),var(--grad);border:2px solid rgba(255,255,255,.35);box-shadow:0 8px 22px #00000073;transition:transform .1s ease;touch-action:none}.hud-btn span{display:block}.hud-btn:active,.hud-btn.on{transform:scale(.9);filter:brightness(1.25)}.hud-btn.jump{width:calc(var(--btn) * 1.1);height:calc(var(--btn) * 1.1);background:radial-gradient(circle at 35% 30%,#fff6,#0003),var(--grad-cyan);color:#05282a}.hud-btn.dash{background:radial-gradient(circle at 35% 30%,#fff6,#0003),linear-gradient(135deg,#ff5cc8,#8b5cf6)}.hud-btn.slide{width:calc(var(--btn) * .92);height:calc(var(--btn) * .92);background:radial-gradient(circle at 35% 30%,#ffffff59,#00000040),linear-gradient(135deg,#3d7bff,#2ee6c5);color:#04222a}.hud-btn.power{width:calc(var(--btn) * .96);height:calc(var(--btn) * .96);background:radial-gradient(circle at 35% 30%,#ffffff73,#0003),var(--grad-gold);color:#3a2600}.hud-btn.power.ready{animation:floaty 1.1s ease-in-out infinite}.hud-btn.interact{width:calc(var(--btn) * .86);height:calc(var(--btn) * .86);background:radial-gradient(circle at 35% 30%,#ffffff4d,#00000040),#141033e6}.hud-hint{position:absolute;inset-inline:0;top:19%;text-align:center;font-weight:800;color:#fff;text-shadow:0 2px 12px #000;font-size:.95rem}.joystick{width:132px;height:132px;border-radius:50%;pointer-events:auto;touch-action:none;background:radial-gradient(circle,#ffffff1f,#0a09188c);border:2px solid rgba(255,255,255,.22);backdrop-filter:blur(6px);display:grid;place-items:center;position:relative;transform:scale(var(--stick-scale, 1));transform-origin:bottom left;flex:0 0 auto}.hud-bottom.stick-right .joystick{transform-origin:bottom right}.joystick:after{content:"";position:absolute;width:15%;height:15%;border-radius:50%;border:1px dashed rgba(255,255,255,.28);pointer-events:none}.joystick-knob{width:44%;height:44%;border-radius:50%;background:var(--grad);border:2px solid rgba(255,255,255,.5);box-shadow:0 6px 18px #00000080;transition:transform .06s linear}.hud-side{align-items:flex-end;gap:10px;pointer-events:none}.hud-chips{display:flex;flex-direction:column;gap:6px;align-items:flex-end}.hud-rail{display:flex;flex-direction:column;gap:var(--rail-gap);margin-top:4px}.hud-rail .rail-btn{pointer-events:auto}.rail-btn{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;background:#141033d1;border:1px solid var(--border-strong);backdrop-filter:blur(8px);box-shadow:0 6px 18px #0006;transition:transform .14s ease,background .14s ease}.rail-btn:active{transform:scale(.9);background:#8b5cf666}.rail-btn.swap{background:linear-gradient(135deg,#8b5cf699,#2ee6c573);border-color:#ffffff59}.rail-btn.swap:active{background:linear-gradient(135deg,#8b5cf6d9,#2ee6c5a6)}.list{display:flex;flex-direction:column;gap:10px}.row-card{display:flex;align-items:center;gap:11px;padding:12px;border-radius:var(--r);background:var(--panel);border:1px solid var(--border)}.row-card.done{border-color:#37d67a73;background:#37d67a14}.row-card .rc-body{flex:1;min-width:0}.row-card .rc-title{font-weight:800;font-size:.88rem;display:flex;align-items:center;gap:6px}.rc-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#8b5cf633;border:1px solid var(--border);flex:0 0 auto}.reward-pill{display:inline-flex;align-items:center;gap:4px;font-size:.7rem;font-weight:800;padding:3px 8px;border-radius:99px;background:#00000059;border:1px solid var(--border)}.reward-pill.gold{color:var(--gold)}.reward-pill.crystal{color:var(--cyan)}.reward-pill.xp{color:var(--teal)}.world-card{position:relative;display:flex;align-items:center;gap:12px;padding:13px;border-radius:var(--r);border:1px solid var(--border);background:linear-gradient(100deg,#8b5cf638,#0a091899);overflow:hidden}.world-card.locked{filter:grayscale(.7);opacity:.7}.world-orb{width:52px;height:52px;border-radius:16px;flex:0 0 auto;box-shadow:inset 0 0 22px #ffffff59;border:1px solid var(--border-strong)}.stars{display:inline-flex;gap:2px;color:var(--gold)}.level-pill{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;font-weight:900;background:#00000059;border:1px solid var(--border);font-size:.95rem}.level-pill.done{background:#37d67a40;border-color:#37d67a99}.level-pill.locked{opacity:.5}.setting-row{display:flex;flex-direction:column;gap:6px;padding:11px 12px;border-radius:var(--r);background:var(--panel);border:1px solid var(--border)}.setting-row .lab{display:flex;justify-content:space-between;font-size:.82rem;font-weight:800}input[type=range]{width:100%;-webkit-appearance:none;height:22px;background:transparent}input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:99px;background:#ffffff2e}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-7px;border-radius:50%;background:var(--grad);border:2px solid #fff;box-shadow:0 3px 10px #00000080}.switch{width:52px;height:30px;border-radius:99px;background:#ffffff29;border:1px solid var(--border);position:relative;transition:background .2s;flex:0 0 auto}.switch.on{background:var(--grad)}.switch i{position:absolute;top:3px;inset-inline-start:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:inset-inline-start .2s ease}.switch.on i{inset-inline-start:25px}.result-hero{text-align:center;padding:8px 0 4px}.result-hero .big{font-family:Fredoka,sans-serif;font-size:1.9rem}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stat-box{padding:10px 6px;border-radius:14px;background:var(--panel);border:1px solid var(--border);text-align:center}.stat-box b{display:block;font-size:1.15rem;font-family:Fredoka,sans-serif}.badge-stars{display:flex;justify-content:center;gap:10px;margin:10px 0}.badge-stars svg{filter:drop-shadow(0 0 10px rgba(255,200,61,.8))}.cat-preview{position:relative;height:46vh;min-height:260px;border-radius:var(--r-lg);overflow:hidden;background:radial-gradient(circle at 50% 30%,#8b5cf659,#0000004d);border:1px solid var(--border)}.cat-preview canvas{position:absolute;inset:0;width:100%;height:100%}.preview-hint{position:absolute;bottom:8px;inset-inline:0;text-align:center;font-size:.68rem;color:#d5d0ff;pointer-events:none}.color-dots{display:flex;gap:8px;overflow-x:auto;padding:4px 0}.color-dot{width:34px;height:34px;border-radius:50%;border:2px solid rgba(255,255,255,.35);flex:0 0 auto;transition:transform .15s}.color-dot.on{border-color:#fff;transform:scale(1.14);box-shadow:0 0 14px #ffffff80}.empty{text-align:center;padding:26px 10px;color:var(--muted);font-size:.86rem}@media (max-width: 380px){.grid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))}}@media (max-width: 480px){:root{--btn: min(clamp(46px, 13.5vw, 62px), calc((100vw - 196px) / 2.74));--pad-gap: 12px;--zone-gap: 14px}.joystick{width:min(112px,33vw);height:min(112px,33vw)}}@media (max-height: 560px){:root{--btn: min(clamp(44px, 11.5vw, 60px), calc((100vw - 190px) / 2.74));--pad-gap: 12px;--zone-gap: 16px;--rail-gap: 8px}.joystick{width:min(104px,30vw);height:min(104px,30vw)}.hud-rail{flex-direction:row;margin-top:4px}.rail-btn{width:38px;height:38px;border-radius:12px}.hud-chips{flex-direction:row;flex-wrap:wrap;justify-content:flex-end}.toast-wrap{top:32%}}@media (min-width: 760px){.scroll{padding-inline:8%}.grid{grid-template-columns:repeat(auto-fill,minmax(132px,1fr))}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}.skeleton{border-radius:12px;background:linear-gradient(100deg,#ffffff0f 20%,#ffffff29,#ffffff0f 64%);background-size:220% 100%;animation:shimmer 1.4s linear infinite}@keyframes shimmer{0%{background-position:140% 0}to{background-position:-40% 0}}.thumb .skeleton{width:70%;height:70%}.compat{position:fixed;inset:0;display:grid;place-items:center;padding:20px;background:radial-gradient(120% 90% at 50% 0%,#241a52,#0a0b1f 55%,#05060f)}.compat-card{width:100%;max-width:430px;padding:26px 22px;border-radius:22px;background:#ffffff0d;backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.1);box-shadow:0 24px 60px #0000008c;animation:fadeUp .4s ease both}.compat-icon{width:66px;height:66px;margin:0 auto 14px;border-radius:20px;display:grid;place-items:center;color:#e9e4ff;background:var(--grad);box-shadow:0 10px 30px #8b5cf680}.compat-icon.danger{background:linear-gradient(135deg,#ff4d5e,#b44bff);box-shadow:0 10px 30px #ff4d5e73}.compat-card h1{font-size:1.24rem;text-align:center;margin-bottom:10px;line-height:1.5}.compat-card p{text-align:center;font-size:.9rem;line-height:1.7}.compat-tips{margin:16px 0 18px;padding:0;list-style:none;display:grid;gap:9px}.compat-tips li{position:relative;padding:10px 14px;border-radius:13px;font-size:.84rem;line-height:1.6;background:#ffffff0a;border:1px solid rgba(255,255,255,.07);color:#d8d3f2}.compat-tips li:before{content:"◆";color:var(--accent-cyan, #38d6ff);margin-inline-end:8px;font-size:.7rem}.compat-card .btn+.btn{margin-top:10px}.compat-foot{margin-top:14px;font-size:.78rem}