@font-face{font-family:Fredoka;src:url(../fonts/fredoka.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:swap}:root{--display:"Fredoka","Trebuchet MS",Verdana,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:#0d1b2a;color:#fff;font-family:Trebuchet MS,Verdana,sans-serif;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;overflow:hidden;overscroll-behavior:none}*,*:before,*:after{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}img{-webkit-user-drag:none;user-drag:none}.app{position:relative;width:100%;height:100dvh;overflow:hidden;--pad-top:env(safe-area-inset-top,0px);--pad-bot:env(safe-area-inset-bottom,0px);--pad-left:env(safe-area-inset-left,0px);--pad-right:env(safe-area-inset-right,0px)}@media (min-width:520px) and (min-height:700px) and (orientation:portrait){.app{width:min(440px,100%);height:min(96dvh,782px);aspect-ratio:9/16;border-radius:22px;box-shadow:0 20px 50px #0000008c;--pad-top:0px;--pad-bot:0px}}@media (orientation:landscape){.app{width:min(100%,200dvh);height:100dvh;margin-inline:auto;border-radius:0}}.phone{position:absolute;inset:0}.screen{position:relative;width:100%;height:100%;overflow:hidden;touch-action:none;cursor:none}.screen canvas{display:block;width:100%;height:100%}.chip{font-family:var(--display);display:inline-flex;align-items:center;gap:5px;background:#0916268c;border:2px solid rgba(255,255,255,.22);border-radius:999px;padding:3px 11px 3px 4px;font-size:14px;font-weight:700;line-height:1;box-shadow:0 3px #00000047;backdrop-filter:blur(4px)}.chip img{width:20px;height:20px;display:block;object-fit:contain}.chip.coin span{color:#ffd257}.chip.heart span{color:#ff8090}.chip.timer span{font-size:12px;letter-spacing:.02em;color:#ffb0bc}.play-btn{font-family:var(--display);position:relative;border:0;cursor:pointer;font-size:22px;font-weight:700;letter-spacing:.02em;color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.32);padding:16px 46px;border-radius:999px;background:linear-gradient(180deg,#5fd85c,#37b23c 55%,#2a8f31);box-shadow:0 0 0 5px #f5c33c,0 0 0 7px #b8862a,0 9px 0 -1px #1e6b25,0 16px 22px #00000059;transition:transform .06s,box-shadow .06s}.play-btn:after{content:"";position:absolute;left:14%;right:14%;top:7px;height:32%;border-radius:999px;background:#ffffff47;pointer-events:none}.play-btn:active{transform:translateY(7px);box-shadow:0 0 0 5px #f5c33c,0 0 0 7px #b8862a,0 2px 0 -1px #1e6b25,0 6px 12px #0000004d}.play-btn.small{font-size:17px;padding:13px 34px}.play-btn.cost{display:inline-flex;align-items:center;gap:9px}.play-btn.cost img{width:26px;height:26px;object-fit:contain}.play-btn[disabled]{filter:grayscale(1) brightness(.72);cursor:default;pointer-events:none}.ghost-btn{font-family:var(--display);font-size:14px;font-weight:600;color:#4a6b8a;background:transparent;border:2px solid #cfdcea;border-radius:999px;padding:9px 20px;cursor:pointer}.ghost-btn:active{transform:translateY(2px)}.ghost-btn.link{display:inline-block;text-decoration:none;text-align:center}.home{position:absolute;inset:0;z-index:40;display:flex;flex-direction:column;align-items:center;padding:calc(14px + var(--pad-top)) calc(18px + var(--pad-right)) calc(26px + var(--pad-bot)) calc(18px + var(--pad-left));background:radial-gradient(circle at 50% 38%,#eaf4ff,#cfe6ff 52%,#a9d3ff)}.home[hidden]{display:none}.home:before{content:"";position:absolute;inset:0;z-index:0;background:url(../icons/background-lobby.png) center/cover no-repeat;opacity:0;transition:opacity .45s ease-out;pointer-events:none}.home.ready:before{opacity:1}.home-counters,.home-logo,.home-play{position:relative;z-index:1}.home-counters{align-self:flex-end;display:flex;gap:8px}.home-counters .chip{background:#ffffffb8;border-color:#1c4a7c40;color:#1c4a7c;box-shadow:0 3px #1c4a7c2e}.home-counters .chip.coin span{color:#c98a10}.home-counters .chip.heart span{color:#d63b52}.home-counters .chip.timer span{color:#a8465a}.home-logo{flex:1;display:flex;align-items:flex-start;justify-content:center;width:100%;padding-top:6%;animation:bob 3.4s ease-in-out infinite}.home-logo img{width:min(78%,340px);height:auto;display:block;filter:drop-shadow(0 16px 18px rgba(28,74,124,.32))}@keyframes bob{0%,to{transform:translateY(-9px)}50%{transform:translateY(9px)}}@media (prefers-reduced-motion:reduce){.home-logo{animation:none}}.home-play{display:flex;flex-direction:column;align-items:center;gap:14px}.home-hint{font-family:var(--display);font-size:12px;font-weight:700;color:#fff;letter-spacing:.04em;text-shadow:0 1px 3px rgba(10,32,58,.75),0 0 10px rgba(10,32,58,.45)}.hud{position:absolute;inset:0;pointer-events:none;z-index:10}.balls{position:absolute;top:calc(14px + var(--pad-top));left:calc(14px + var(--pad-left));background:#fdf6e3;border:3px solid #9c2b3a;border-radius:12px;padding:2px 4px 5px;min-width:78px;text-align:center;box-shadow:0 4px #00000040}.balls .lb{font-family:var(--display);font-weight:700;display:block;background:#c0392b;color:#fff;border-radius:7px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:2px 8px;margin:-6px -1px 3px;border:2px solid #9c2b3a}.balls .n{font-family:var(--display);display:block;font-size:26px;font-weight:700;color:#c0392b;line-height:1}.counters{position:absolute;top:calc(14px + var(--pad-top));right:calc(14px + var(--pad-right));display:flex;align-items:center;gap:7px;pointer-events:auto}.cog{width:34px;height:34px;flex:none;padding:0;cursor:pointer;display:grid;place-items:center;background:#0916268c;border:2px solid rgba(255,255,255,.22);border-radius:50%;box-shadow:0 3px #00000047}.cog svg{width:19px;height:19px;fill:#e6eef8}.cog:active{transform:translateY(2px);box-shadow:0 1px #00000047}.who{font-family:var(--display);position:absolute;top:calc(58px + var(--pad-top));right:calc(14px + var(--pad-right));font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#ffffffbf;text-shadow:0 2px 0 rgba(0,0,0,.3);text-align:right}.reticle{position:absolute;z-index:55;pointer-events:none;width:30px;height:30px;margin:-15px 0 0 -15px;border:2px solid rgba(255,255,255,.85);border-radius:50%;box-shadow:0 0 0 2px #00000040,inset 0 0 0 2px #00000026;opacity:0;transition:opacity .15s}.reticle:after{content:"";position:absolute;inset:12px;background:#fff;border-radius:50%}.banner{font-family:var(--display);position:absolute;left:0;right:0;top:34%;text-align:center;font-size:26px;font-weight:700;letter-spacing:.02em;text-shadow:0 3px 0 rgba(0,0,0,.35);opacity:0;transition:opacity .25s}.banner.show{opacity:1}.hint{position:absolute;left:12px;right:12px;top:52%;font-family:var(--display);font-size:17px;font-weight:700;text-align:center;color:#fff;text-shadow:0 2px 5px rgba(8,24,44,.85),0 0 14px rgba(8,24,44,.6);opacity:0;transform:translateY(6px);transition:opacity .18s ease-out,transform .18s ease-out;pointer-events:none}.hint.show{opacity:1;transform:translateY(0)}.chip .roll{position:relative;display:inline-block;overflow:hidden;height:1.05em;min-width:1.1em;vertical-align:top;text-align:left}.chip .roll .d{display:block;white-space:nowrap;line-height:1.05}.chip.bump{animation:chipBump .18s ease-out}@keyframes chipBump{0%{transform:scale(1)}45%{transform:scale(1.16)}to{transform:scale(1)}}.flying-coin{position:absolute;left:0;top:0;z-index:70;object-fit:contain;pointer-events:none;filter:drop-shadow(1px 0 0 #000) drop-shadow(-1px 0 0 #000) drop-shadow(0 1px 0 #000) drop-shadow(0 -1px 0 #000)}@media (prefers-reduced-motion:reduce){.flying-coin{display:none}}.volley-btn{position:absolute;right:calc(16px + var(--pad-right));bottom:calc(96px + var(--pad-bot));z-index:20;width:64px;height:64px;padding:0;border:0;border-radius:50%;cursor:pointer;background:radial-gradient(circle at 35% 28%,#e05a4a,#c0392b 58%,#9c2b3a);box-shadow:0 0 0 4px #f5c33c,0 0 0 6px #b8862a,0 6px 0 -1px #00000059,0 10px 18px #00000059;transition:transform .07s,box-shadow .07s,filter .15s}.volley-btn img{width:44px;height:44px;object-fit:contain;pointer-events:none}.volley-btn:active{transform:translateY(4px);box-shadow:0 0 0 4px #f5c33c,0 0 0 6px #b8862a,0 2px 0 -1px #00000059,0 5px 10px #0000004d}.volley-btn.on{box-shadow:0 0 0 4px #6fe3ff,0 0 0 7px #1b8fd0,0 0 26px 8px #5ac8ffbf,0 6px 0 -1px #00000059,0 10px 18px #00000059;animation:volleyPulse 1.1s ease-in-out infinite}@keyframes volleyPulse{0%,to{box-shadow:0 0 0 4px #6fe3ff,0 0 0 7px #1b8fd0,0 0 20px 5px #5ac8ff99,0 6px 0 -1px #00000059,0 10px 18px #00000059}50%{box-shadow:0 0 0 4px #a8f0ff,0 0 0 7px #2ba6e8,0 0 34px 12px #78d7ffe6,0 6px 0 -1px #00000059,0 10px 18px #00000059}}@media (prefers-reduced-motion:reduce){.volley-btn.on{animation:none}}.volley-btn.spent{animation:none;background:radial-gradient(circle at 35% 28%,#9aa3ab,#79828b 70%,#5c646c);box-shadow:0 0 0 4px #8a8378,0 0 0 6px #5d5850,0 6px 0 -1px #0000004d,0 10px 18px #0000004d;cursor:pointer}.volley-btn.spent img{filter:grayscale(1) brightness(.75)}.volley-btn.spent:active{transform:translateY(4px);box-shadow:0 0 0 4px #8a8378,0 0 0 6px #5d5850,0 2px 0 -1px #0000004d,0 5px 10px #00000047}.volley-btn .count{font-family:var(--display);position:absolute;top:-4px;right:-4px;min-width:23px;height:23px;padding:0 5px;display:grid;place-items:center;background:#c0392b;color:#fff;border:2px solid #fff;border-radius:999px;font-size:12px;font-weight:700;line-height:1;box-shadow:0 2px 4px #00000059}.volley-btn.spent .count{background:linear-gradient(180deg,#4fd06a,#2e9e4f);border-color:#fff;font-size:15px;box-shadow:0 2px 4px #00000059,0 0 10px #46dc6e8c}.volley-btn.locked{animation:none;filter:grayscale(1) brightness(.6);background:radial-gradient(circle at 35% 28%,#9aa3ab,#79828b 70%,#5c646c);box-shadow:0 0 0 4px #8a8378,0 0 0 6px #5d5850,0 4px 0 -1px #0000004d;cursor:default;pointer-events:none}.volley-btn.locked .count{display:none}.volley-btn .lock{display:none;font-family:var(--display);position:absolute;left:50%;bottom:-9px;transform:translate(-50%);min-width:23px;height:21px;padding:0 7px;place-items:center;white-space:nowrap;background:#5c646c;color:#fff;border:2px solid #fff;border-radius:999px;font-size:11px;font-weight:700;line-height:1;letter-spacing:.02em;box-shadow:0 2px 4px #00000059}.volley-btn.locked .lock{display:grid}.overlay{position:absolute;inset:0;z-index:60;display:flex}.overlay[hidden]{display:none}.overlay.dim{align-items:center;justify-content:center;padding:20px calc(20px + var(--pad-right)) 20px calc(20px + var(--pad-left));background:#142c4a8c;backdrop-filter:blur(3px);animation:fadeIn .18s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{width:100%;max-width:320px;text-align:center;max-height:100%;overflow-y:auto;background:linear-gradient(180deg,#fff,#f2f7fd);border:3px solid #ffffff;border-radius:22px;padding:22px 20px;color:#173a5e;box-shadow:0 18px 40px #0c284a61;display:flex;flex-direction:column;align-items:center;gap:13px}.modal h2{font-family:var(--display);font-size:25px;font-weight:700;letter-spacing:.01em;color:#12395f}.modal-sub{font-size:13px;color:#5b7893;line-height:1.45}.modal-note{font-size:11px;color:#d1435a;font-weight:700;min-height:0}.modal-note:empty{display:none}.lose-modal{position:relative;padding-top:26px;gap:15px}.modal-x{position:absolute;top:9px;right:9px;z-index:2;width:32px;height:32px;padding:0;display:grid;place-items:center;background:transparent;border:0;border-radius:50%;cursor:pointer;color:#8fa8bf}.modal-x svg{width:19px;height:19px;fill:currentColor}.modal-x:active{transform:translateY(1px);color:#5b7893}.lose-heart{position:relative;width:64px;height:64px;display:grid;place-items:center;margin:6px 0 2px}.lose-heart img{position:relative;z-index:1;width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(160,30,55,.42))}.pinwheel{position:absolute;left:50%;top:50%;width:105px;height:105px;margin:-52.5px 0 0 -52.5px;border-radius:50%;pointer-events:none;background:repeating-conic-gradient(from 0deg,#ff688066 0deg 15deg,#ffb0c01f 15deg 30deg);-webkit-mask:radial-gradient(circle,#000 26%,rgba(0,0,0,.85) 48%,transparent 72%);mask:radial-gradient(circle,#000 26%,rgba(0,0,0,.85) 48%,transparent 72%);animation:pinspin 14s linear infinite}@keyframes pinspin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.pinwheel{animation:none}}.lose-warn{font-family:var(--display);font-size:15px;font-weight:700;line-height:1.35;color:#12395f;max-width:15em}.play-btn.cost #continuePrice,.play-btn.cost #volleyPrice{margin-left:-3px;color:#ffe89a}.shop-modal{position:relative;padding-top:26px;gap:12px}.shop-ball{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin:6px 0 0;background:radial-gradient(circle at 35% 28%,#e05a4a,#c0392b 58%,#9c2b3a);box-shadow:0 0 0 4px #f5c33c,0 0 0 6px #b8862a,0 6px 14px #0c284a4d}.shop-ball img{width:44px;height:44px;object-fit:contain}.row{width:100%;display:flex;align-items:center;justify-content:space-between;font-family:var(--display);font-size:16px;font-weight:600;color:#1d4670;padding:9px 2px;border-bottom:1px solid rgba(23,58,94,.1)}.toggle{width:52px;height:29px;flex:none;padding:0;cursor:pointer;background:#c2d2e2;border:0;border-radius:999px;position:relative;transition:background .16s}.toggle i{position:absolute;top:3px;left:3px;width:23px;height:23px;background:#fff;border-radius:50%;transition:transform .16s;box-shadow:0 1px 3px #0c284a59}.toggle[aria-checked=true]{background:#37b23c}.toggle[aria-checked=true] i{transform:translate(23px)}.overlay.win{flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:20px calc(20px + var(--pad-right)) calc(28px + var(--pad-bot)) calc(20px + var(--pad-left));background:radial-gradient(circle at 50% 40%,#eaf4ff,#cfe6ff 55%,#a9d3ff);perspective:1000px}.win-stage{position:relative;width:min(86%,380px);aspect-ratio:1;flex:none}.win-layer{position:absolute;inset:0;width:100%;height:100%;display:block;user-select:none;pointer-events:none;opacity:0}.tut{position:absolute;inset:0;z-index:50;pointer-events:none;animation:fadeIn .22s ease-out}.tut[hidden]{display:none}.tut.block{pointer-events:auto}.tut-veil{position:absolute;inset:0;background:radial-gradient(circle var(--r,120px) at var(--x,50%) var(--y,50%),rgba(6,18,34,0) 0%,rgba(6,18,34,0) 62%,rgba(6,18,34,.55) 84%,rgba(6,18,34,.78) 100%)}.tut-finger{position:absolute;left:calc(var(--x,50%) + var(--fx,0px));top:var(--y,50%);animation:tutFloat 1.35s ease-in-out infinite}.tut-finger img{display:block;width:58px;height:auto;margin:2px 0 0 -14px;filter:drop-shadow(0 6px 12px rgba(4,14,28,.6))}@keyframes tutFloat{0%,to{transform:translateY(0)}50%{transform:translateY(11px)}}@media (prefers-reduced-motion:reduce){.tut-finger{animation:none}}.tut-tip{position:absolute;left:14px;right:14px;top:var(--tip-y,60%);text-align:center}.tut-tip span{display:inline-block;max-width:19em;font-family:var(--display);font-size:15px;font-weight:700;line-height:1.3;color:#12395f;background:#fff;border:3px solid #8ecdf5;border-radius:15px;padding:9px 15px;box-shadow:0 8px 22px #040e1c6b}@media (orientation:landscape){.balls{top:calc(10px + var(--pad-top));left:calc(10px + var(--pad-left))}.counters{top:calc(10px + var(--pad-top));right:calc(10px + var(--pad-right))}.who{top:calc(50px + var(--pad-top));right:calc(10px + var(--pad-right))}.volley-btn{right:calc(16px + var(--pad-right));bottom:calc(18px + var(--pad-bot))}.banner{top:7%}.hint{top:20%}}@media (orientation:landscape){.home{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"logo play";align-items:center;padding:calc(12px + var(--pad-top)) calc(20px + var(--pad-right)) calc(12px + var(--pad-bot)) calc(20px + var(--pad-left))}.home-counters{position:absolute;top:calc(12px + var(--pad-top));right:calc(20px + var(--pad-right));z-index:2}.home-logo{grid-area:logo;flex:none;align-items:center;padding-top:0}.home-logo img{width:min(88%,320px)}.home-play{grid-area:play;padding-top:26px;gap:12px}}@media (orientation:landscape) and (max-height:520px){.balls{min-width:66px;padding:2px 4px 4px}.balls .lb{font-size:9px;padding:2px 7px}.balls .n{font-size:21px}.chip{font-size:13px;padding:2px 9px 2px 3px}.chip img{width:17px;height:17px}.cog{width:30px;height:30px}.cog svg{width:17px;height:17px}.who{top:calc(44px + var(--pad-top));font-size:10px}.volley-btn{width:54px;height:54px}.volley-btn img{width:37px;height:37px}.volley-btn .count{min-width:20px;height:20px;font-size:11px}.volley-btn .lock{height:19px;font-size:10px;bottom:-8px}.banner{font-size:20px;top:6%}.hint{font-size:14px;top:19%}.home-logo img{width:min(94%,270px)}.play-btn{font-size:19px;padding:13px 38px}.home-hint{font-size:11px}.modal{max-width:296px;padding:16px;gap:10px}.lose-modal,.shop-modal{padding-top:22px}.modal h2{font-size:21px}.modal-sub{font-size:12px}.play-btn.small{font-size:15px;padding:10px 26px}.play-btn.cost img{width:22px;height:22px}.lose-heart{width:46px;height:46px;margin:2px 0 0}.lose-heart img{width:46px;height:46px}.pinwheel{width:78px;height:78px;margin:-39px 0 0 -39px}.lose-warn{font-size:14px}.shop-ball{width:48px;height:48px;margin:2px 0 0}.shop-ball img{width:33px;height:33px}.row{font-size:15px;padding:6px 2px}.toggle{width:46px;height:26px}.toggle i{width:20px;height:20px}.toggle[aria-checked=true] i{transform:translate(20px)}.tut-tip span{font-size:13px;padding:7px 12px;max-width:22em}.tut-finger img{width:48px}}@media (orientation:landscape){.win-stage{width:auto;height:min(84%,380px);aspect-ratio:1}}