@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700;800&family=Nunito:wght@600;700;800;900&display=swap');
:root{--ink:#1c2140;--cream:#fffaf0;--pink:#ff5f8f;--purple:#7857ff;--blue:#35b9ff;--yellow:#ffd84d;--mint:#48dfbd;--red:#ff5c5c}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Nunito,system-ui,sans-serif;color:var(--ink)}
body{background:linear-gradient(145deg,#5e4eff 0%,#9a5dff 42%,#ff78b1 100%);overflow-x:hidden}
button,a{-webkit-tap-highlight-color:transparent}.topbar{max-width:1180px;margin:auto;padding:24px 24px 0;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:3}
.brand{text-decoration:none;line-height:.8;display:flex;flex-direction:column;transform:rotate(-2deg);filter:drop-shadow(0 4px 0 rgba(29,20,85,.18))}
.brand span{font:800 30px/25px "Baloo 2",sans-serif;letter-spacing:-1px}.brand-squish{color:#fff}.brand-stack{color:var(--yellow)}
.volume{font-size:12px;font-weight:900;letter-spacing:2px;color:white;background:#ffffff25;border:1px solid #ffffff45;padding:8px 12px;border-radius:99px}
.home-main{max-width:1180px;margin:auto;padding:20px 24px 40px;position:relative;z-index:2}.hero{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;min-height:310px}
.eyebrow{font-size:13px;font-weight:900;letter-spacing:3px;color:#fff9a8;margin-bottom:7px}.hero h1{font:800 clamp(58px,8vw,104px)/.78 "Baloo 2";letter-spacing:-5px;color:white;margin:0;text-shadow:0 8px 0 #4936bd33}.hero h1 span{color:var(--yellow)}
.hero p{color:#fff;max-width:530px;font-size:18px;font-weight:700;opacity:.94}.mascot-stage{height:280px;position:relative}.squish{position:absolute;border-radius:48% 52% 45% 55%/56% 50% 50% 44%;box-shadow:inset -12px -15px 0 #00000012,0 18px 30px #3b207544;animation:float 3s ease-in-out infinite}
.squish:before,.squish:after{content:"";position:absolute;width:12%;height:16%;background:#20213a;border-radius:50%;top:38%}.squish:before{left:29%}.squish:after{right:29%}.squish i{position:absolute;width:26%;height:12%;border-bottom:5px solid #20213a;border-radius:50%;left:37%;top:51%}.squish b{position:absolute;width:20%;height:11%;border-radius:50%;background:#fff8;left:18%;top:15%;transform:rotate(-25deg)}
.squish.big{width:180px;height:170px;right:70px;top:42px}.squish.med{width:112px;height:105px;left:35px;bottom:22px;animation-delay:-1s}.squish.small{width:84px;height:80px;right:5px;top:5px;animation-delay:-2s}.pink{background:var(--pink)}.blue{background:var(--blue)}.yellow{background:var(--yellow)}
@keyframes float{50%{transform:translateY(-12px) rotate(2deg)}}.game-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.game-card{min-height:280px;background:#fff;border-radius:30px;text-decoration:none;color:var(--ink);overflow:hidden;display:grid;grid-template-columns:.9fr 1.1fr;box-shadow:0 18px 45px #39227755;border:3px solid #ffffff77;transition:.2s transform,.2s box-shadow}
.game-card:hover{transform:translateY(-7px) rotate(-.3deg);box-shadow:0 25px 55px #39227777}.card-art{min-height:280px;position:relative;overflow:hidden}.stack-art{background:linear-gradient(160deg,#55d9ff,#7868ff)}
.mini-squish{position:absolute;width:125px;height:68px;border-radius:48% 52% 42% 46%;left:50%;transform:translateX(-50%);box-shadow:inset -8px -8px #0001,0 8px 12px #20307022}.mini-squish:before,.mini-squish:after{content:"";position:absolute;width:9px;height:11px;border-radius:50%;background:#272944;top:24px}.mini-squish:before{left:43px}.mini-squish:after{right:43px}.mini-squish.a{background:#ffd84d;bottom:25px;width:160px}.mini-squish.b{background:#ff668f;bottom:87px;width:145px}.mini-squish.c{background:#5aefbd;bottom:149px;width:130px}
.match-art{background:linear-gradient(150deg,#ffca58,#ff718f);display:grid;grid-template-columns:78px 78px;grid-auto-rows:78px;gap:10px;place-content:center}.match-tile{background:#fff;border-radius:22px;display:grid;place-items:center;font:900 38px "Baloo 2";color:#ff668f;box-shadow:0 7px 0 #cb4d6c55}.match-tile.ghost{background:#694de8;color:#fff}
.card-copy{padding:32px 28px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.pill{font-size:10px;font-weight:900;letter-spacing:1.5px;background:#e8e5ff;color:#624be0;padding:6px 9px;border-radius:99px}.pill.new{background:#e3fff4;color:#009d76}.card-copy h2{font:800 34px/1 "Baloo 2";margin:12px 0 7px}.card-copy p{font-size:14px;font-weight:700;color:#667;line-height:1.45;margin:0 0 20px}.play{font-size:13px;font-weight:900;color:#6d50ee;letter-spacing:.5px}.play strong{font-size:20px;margin-left:5px}.footer-note{text-align:center;color:#fff;opacity:.8;font-size:12px;font-weight:800;margin:28px}
.bg-bubbles:before,.bg-bubbles:after{content:"";position:fixed;border-radius:50%;filter:blur(2px);background:#ffffff10}.bg-bubbles:before{width:480px;height:480px;left:-200px;top:120px}.bg-bubbles:after{width:650px;height:650px;right:-280px;bottom:-260px}
.game-page{min-height:100vh;background:linear-gradient(160deg,#5b49ee,#9a62ff 55%,#ff74ae);display:flex;flex-direction:column}.game-head{width:min(920px,100%);margin:0 auto;padding:18px 18px 8px;display:flex;align-items:center;justify-content:space-between}.back{color:#fff;text-decoration:none;font-weight:900;background:#ffffff22;border:1px solid #ffffff35;padding:9px 13px;border-radius:14px}.game-title{font:800 26px "Baloo 2";color:#fff}.game-shell{width:min(920px,calc(100% - 24px));margin:8px auto 28px;background:#fffaf4;border-radius:30px;box-shadow:0 20px 50px #2c1d7566;overflow:hidden;min-height:650px;position:relative}.hud{display:flex;justify-content:space-between;gap:8px;padding:16px;background:#fff;border-bottom:1px solid #eee}.stat{flex:1;text-align:center}.stat small{display:block;font-size:10px;font-weight:900;letter-spacing:1px;color:#9896aa}.stat strong{font:900 24px "Baloo 2";color:#2a2942}.game-area{position:relative;min-height:570px;overflow:hidden}.overlay{position:absolute;inset:0;z-index:20;background:#ffffffee;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center}.overlay.hidden{display:none}.panel{max-width:520px}.panel h1{font:800 50px/.9 "Baloo 2";margin:0 0 12px;color:#5b49e9}.panel p{font-weight:700;color:#66677b;line-height:1.5}.primary{border:0;background:linear-gradient(135deg,#6c54f6,#9b5cff);color:#fff;font:900 18px "Nunito";padding:15px 26px;border-radius:18px;box-shadow:0 7px 0 #4d39bd;cursor:pointer}.primary:active{transform:translateY(4px);box-shadow:0 3px 0 #4d39bd}
@media(max-width:760px){.hero{grid-template-columns:1fr;min-height:auto;padding:45px 0 15px}.mascot-stage{height:170px}.squish.big{width:130px;height:120px;right:22%;top:20px}.squish.med{left:14%;bottom:5px}.game-grid{grid-template-columns:1fr}.game-card{grid-template-columns:.8fr 1.2fr;min-height:220px}.card-art{min-height:220px}.hero h1{font-size:68px}.hero p{font-size:15px}.card-copy{padding:24px 18px}.card-copy h2{font-size:29px}.mini-squish{transform:translateX(-50%) scale(.8)}.match-art{grid-template-columns:62px 62px;grid-auto-rows:62px}.match-tile{font-size:30px;border-radius:17px}.game-shell{min-height:calc(100vh - 88px);border-radius:24px}.game-area{min-height:calc(100vh - 175px)}}

.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.game-card{display:flex;flex-direction:column}.card-art{min-height:210px}.card-copy{flex:1;padding:25px}.card-copy p{flex:1}.catch-art{background:linear-gradient(145deg,#8aebff,#65efbc)}.catch-art img{position:absolute;width:84px;height:84px;object-fit:contain;left:18%;top:15px;transform:rotate(-16deg)}.catch-art img+img{left:59%;top:44px;transform:rotate(17deg)}.basket-art{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);width:125px;border-radius:10px 10px 28px 28px;background:#ffd84d;border-bottom:9px solid #d79b25;text-align:center;font-size:35px;color:#98602a}.install-tip{max-width:700px;margin:30px auto 0;color:white;text-align:center;font-size:14px;line-height:1.6}.install-tip strong{display:block;font-size:18px}a:focus-visible,button:focus-visible{outline:3px solid #ffcb35;outline-offset:4px}.app-status{text-align:center;color:white;font-size:12px;padding:10px;margin:0}.app-status button{margin-left:8px;padding:8px;border-radius:8px;border:0;cursor:pointer}@media(max-width:860px){.game-grid{grid-template-columns:1fr}.game-card{display:grid;grid-template-columns:.8fr 1.2fr}.card-copy{padding:24px 18px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
