:root{--ink:#1d1033;--cream:#fff6e6;--sun:#ffd65a;--orange:#ff8a1f;--pink:#ff5d8f;--purple:#2d1b69;--green:#2ecc71;--red:#ff4d4d;--display:"Lilita One", "Arial Rounded MT Bold", system-ui, sans-serif;--score:"Bungee", "Lilita One", system-ui, sans-serif;--body:"Nunito", system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior:none;touch-action:manipulation;-webkit-touch-callout:none}html,body{height:100%;color:var(--ink);font-family:var(--body);overscroll-behavior:none;-webkit-tap-highlight-color:transparent;background:#0d0820;margin:0;overflow:hidden}[hidden]{display:none!important}#stage{width:min(100vw,75vh);width:min(100vw,75dvh);height:100vh;font-size:clamp(11px,min(4.1vw,2.05vh),20px);-webkit-user-select:none;user-select:none;height:100dvh;margin:0 auto;font-size:clamp(11px,min(4.1cqw,2.05cqh),20px);position:relative;overflow:hidden;container-type:size}#game,#game canvas{touch-action:none;width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0}#hud{padding:calc(.6em + env(safe-area-inset-top)) 4em 0;pointer-events:none;flex-direction:column;align-items:center;gap:.35em;display:flex;position:absolute;top:0;left:0;right:0}.scorebug{border:3px solid var(--ink);box-shadow:0 5px 0 var(--ink), 0 8px 24px #00000059;border-radius:.9em;align-items:stretch;display:flex;overflow:hidden}.scorebug .team{align-items:center;gap:.45em;padding:.25em .7em;display:flex}.scorebug .you{background:var(--sun);color:var(--ink)}.scorebug .star{background:var(--star,var(--pink));color:#fff}.scorebug .star .num,.scorebug .star .who{-webkit-text-stroke:1.5px var(--ink);paint-order:stroke fill}.scorebug .who{font-family:var(--display);letter-spacing:.04em;text-overflow:ellipsis;white-space:nowrap;max-width:6.5em;font-size:.85em;overflow:hidden}.scorebug .num{font-family:var(--score);text-align:center;min-width:1.6ch;font-size:1.75em;line-height:1.1}.scorebug .num.bump{animation:.45s cubic-bezier(.3,1.8,.5,1) bump}@keyframes bump{0%{transform:scale(1.6)}}.need{background:var(--ink);min-width:4.6em;color:var(--cream);font-family:var(--display);text-align:center;text-transform:uppercase;place-items:center;padding:0 .6em;font-size:.8em;line-height:1.05;display:grid}.need b{font-family:var(--score);color:var(--cream);font-size:1.5em;font-weight:400;display:block}.need.ahead b{color:var(--green)}.chips{pointer-events:auto;gap:.4em;display:flex}.chips:before{content:"SHOOT:";font-family:var(--display);color:var(--cream);text-shadow:0 2px 0 var(--ink);align-self:center;font-size:.75em}#btn-home{top:calc(.6em + env(safe-area-inset-top));pointer-events:auto;position:absolute;left:.6em}.chip{font-family:var(--display);cursor:pointer;min-width:3.6em;min-height:40px;color:var(--cream);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#1d1033b8;border:2px solid #fff6e680;border-radius:999px;padding:.05em .6em;font-size:.95em}.chip b{color:var(--sun)}.chip.next{background:var(--sun);color:var(--ink);border-color:var(--ink)}.chip.next b{color:var(--ink)}.chip.empty{opacity:.4}.icon-btn{border:3px solid var(--ink);background:var(--cream);cursor:pointer;min-width:44px;min-height:44px;box-shadow:0 3px 0 var(--ink);border-radius:50%;place-items:center;padding:0;font-size:1.1em;display:grid}#btn-mute{top:calc(.6em + env(safe-area-inset-top));z-index:30;position:absolute;right:.6em}.screen{z-index:20;padding:calc(1em + env(safe-area-inset-top)) 16px calc(.8em + env(safe-area-inset-bottom));background:linear-gradient(#140b26ed,#1d1033d1 60%,#140b26f0);flex-direction:column;justify-content:center;align-items:center;gap:.7em;animation:.25s ease-out fade-in;display:flex;position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden auto}@keyframes fade-in{0%{opacity:0}}.logo{font-family:var(--display);color:var(--sun);text-align:center;-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;text-shadow:0 6px 0 var(--ink);white-space:nowrap;align-items:center;gap:.18em;margin:0;font-size:2.7em;font-weight:400;line-height:1;display:flex;transform:rotate(-3deg)}.logo span{color:var(--pink);font-size:.55em}.puzzle-num{color:var(--cream);font-family:var(--display);opacity:.9;margin:0;font-size:1.05em}.card{background:var(--cream);border:4px solid var(--ink);width:100%;max-width:26em;box-shadow:0 6px 0 var(--ink);border-radius:1.1em;padding:.8em 1em}.star-card{border-top:.9em solid var(--accent,var(--pink));text-align:center}.star-card p{margin:.25em 0}.kicker{font-family:var(--display);text-transform:uppercase;letter-spacing:.08em;color:#6b4fa0}.star-name{font-family:var(--display);margin:.05em 0;font-size:1.9em;font-weight:400;line-height:1.05}.game-meta{color:#5a4a72;font-weight:700}.stat-line{font-family:var(--display);background:var(--ink);color:var(--cream);border-radius:.5em;padding:.3em .5em;font-size:1.1em}.shots{font-weight:700}.goal b{color:var(--pink);font-size:1.15em}.btn{font-family:var(--display);min-height:48px;color:var(--ink);background:var(--sun);border:4px solid var(--ink);box-shadow:0 6px 0 var(--ink);cursor:pointer;border-radius:.8em;padding:.35em 1.2em;font-size:1.4em;transition:transform 60ms,box-shadow 60ms}.btn.big{width:100%;max-width:13em;min-height:52px;font-size:1.75em}.btn:active{box-shadow:0 2px 0 var(--ink);transform:translateY(4px)}.btn:focus-visible{outline:3px solid var(--pink);outline-offset:3px}.link:focus-visible{outline:3px solid var(--pink);outline-offset:3px}.icon-btn:focus-visible{outline:3px solid var(--pink);outline-offset:3px}.links{gap:1.2em;display:flex}.link{color:var(--cream);font-family:var(--display);text-underline-offset:3px;cursor:pointer;background:0 0;border:none;min-height:44px;padding:0 .4em;font-size:1.1em;text-decoration:underline}.foot{color:var(--cream);opacity:.7;margin:0;font-size:.8em}.banner{font-family:var(--display);-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;text-shadow:0 6px 0 var(--ink);text-align:center;margin:.2em 0 0;font-size:3em;font-weight:400;animation:.5s cubic-bezier(.3,1.6,.5,1) pop;transform:rotate(-3deg)}.banner.win{color:var(--green)}.banner.loss{color:var(--red)}@keyframes pop{0%{transform:scale(.2)rotate(-12deg)}}.sub{color:var(--cream);text-align:center;margin:0;font-size:1.15em;font-weight:700}.sub b{color:var(--sun)}.final-score{font-family:var(--score);color:var(--cream);text-shadow:0 4px 0 var(--ink);gap:.25em;font-size:2.6em;display:flex}.final-score .you{color:var(--sun)}.final-score .star{color:var(--pink)}.breakdown{flex-direction:column;gap:.7em;display:flex}.row-head{justify-content:space-between;align-items:baseline;gap:.5em;font-size:.95em;display:flex}.row-head b{font-family:var(--display);font-size:1.2em;font-weight:400}.dots{flex-wrap:wrap;gap:4px;margin-top:.3em;display:flex}.dots i{border:2px solid var(--ink);border-radius:50%;width:.9em;height:.9em}.dots .make{background:var(--green)}.dots .miss{background:var(--red)}.result-meta{gap:1em;width:100%;max-width:26em;display:flex}.result-meta>div{background:var(--ink);color:var(--cream);border:3px solid var(--cream);text-align:center;border-radius:.8em;flex-direction:column;flex:1;padding:.4em;display:flex}.result-meta .label{opacity:.8;font-size:.8em}.result-meta b{font-family:var(--score);font-size:1.3em;font-weight:400}.modal{z-index:40;background:#170c33b3;place-items:center;padding:16px;animation:.2s fade-in;display:grid;position:absolute;top:0;bottom:0;left:0;right:0}.modal-card{text-align:center;max-height:100%;position:relative;overflow-y:auto}.modal-card h2{font-family:var(--display);margin:.1em 0 .5em;font-size:1.9em;font-weight:400}.modal-card>.icon-btn{position:absolute;top:.5em;right:.5em}.panels{text-align:left;flex-direction:column;gap:.7em;margin:0 0 1em;padding:0;list-style:none;display:flex}.panels li{border:3px solid var(--ink);background:#fff;border-radius:.8em;align-items:flex-start;gap:.7em;padding:.6em;display:flex}.panels p{margin:.2em 0 0;font-size:.92em}.panel-icon{flex:none;width:2.6em;height:2.6em}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(5.5em,1fr));gap:.6em;display:grid}.stat{border:3px solid var(--ink);background:#fff;border-radius:.8em;flex-direction:column;padding:.5em .2em;display:flex}.stat b{font-family:var(--score);font-size:1.6em;font-weight:400}.stat span{font-size:.8em;font-weight:700}#toast{z-index:50;opacity:0;pointer-events:none;background:var(--ink);color:var(--cream);font-family:var(--display);border:3px solid var(--cream);border-radius:999px;padding:.5em 1em;transition:opacity .2s,transform .2s;position:absolute;bottom:2em;left:50%;transform:translate(-50%,1em)}#toast.show{opacity:1;transform:translate(-50%)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.view-toggle{background:var(--ink);border:3px solid var(--cream);border-radius:999px;gap:3px;padding:3px;display:flex}.view-toggle button{min-width:7em;min-height:44px;color:var(--cream);font-family:var(--display);cursor:pointer;background:0 0;border:none;border-radius:999px;font-size:1.05em}.view-toggle button[aria-pressed=true]{background:var(--sun);color:var(--ink)}.view-toggle span{vertical-align:super;color:var(--pink);font-size:.65em}.view-toggle button[aria-pressed=true] span{color:var(--ink)}#game canvas{display:block}.spot-label{left:50%;bottom:calc(1.4em + env(safe-area-inset-bottom));font-family:var(--display);color:var(--cream);white-space:nowrap;border:3px solid var(--cream);pointer-events:none;background:#1d1033bf;border-radius:999px;padding:.2em .9em;font-size:1.15em;position:absolute;transform:translate(-50%)}.spot-label.three{color:var(--sun)}.spot-label:empty{display:none}.drag-hint{left:0;right:0;bottom:calc(4.6em + env(safe-area-inset-bottom));text-align:center;font-family:var(--display);color:var(--cream);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;text-shadow:0 4px 0 var(--ink);pointer-events:none;opacity:0;font-size:1.6em;transition:opacity .3s;position:absolute}.drag-hint small{font-size:.55em;display:block}.drag-hint.show{opacity:1;animation:1.2s ease-in-out infinite hint-bob}@keyframes hint-bob{50%{transform:translateY(8px)}}.power-meter{background:var(--ink);border:3px solid var(--cream);opacity:0;pointer-events:none;border-radius:999px;width:22px;height:34%;transition:opacity .15s;position:absolute;top:36%;left:16px;overflow:hidden}.power-meter.show{opacity:1}.power-meter b{border-top:2px solid var(--green);border-bottom:2px solid var(--green);background:#2ecc7173;position:absolute;left:0;right:0}.power-meter b[data-heat=heating]{background:#ffb34780;border-color:#ffb347}.power-meter b[data-heat=fire]{background:#ff7a008c;border-color:#fff200}.power-meter i{background:var(--sun);border-radius:999px;position:absolute;bottom:0;left:4px;right:4px}.power-meter i[data-level=zone]{background:var(--green);box-shadow:0 0 8px var(--green)}.power-meter i[data-level=over]{background:var(--red)}.pop3d{text-align:center;font-family:var(--display);color:#fff;-webkit-text-stroke:4px var(--ink);paint-order:stroke fill;text-shadow:0 5px 0 var(--ink);pointer-events:none;font-size:3em;animation:1.5s ease-out forwards pop3d;position:absolute;top:22%;left:0;right:0}.pop3d.small{font-size:2em;top:32%}.pop3d small{color:var(--cream);font-size:.5em;display:block}.pop3d.gold{color:var(--sun)}.pop3d.cyan{color:#7df9ff}.pop3d.orange{color:#ff9a3c}.pop3d.fire{color:#ff5d2e}.pop3d.grey{color:#c9c9d6;top:30%}@keyframes pop3d{0%{opacity:1;transform:scale(0)rotate(-6deg)}20%{transform:scale(1.12)rotate(-3deg)}30%{transform:scale(1)rotate(-3deg)}70%{opacity:1;transform:translateY(0)rotate(-3deg)}to{opacity:0;transform:translateY(-40px)rotate(-3deg)}}body.menu-open .spot-label,body.menu-open .power-meter,body.menu-open .drag-hint{display:none}body[data-view="2d"] #game{background:#0d0820}@media (max-aspect-ratio:9/16){body[data-view="2d"] #game{background:linear-gradient(#07040f 0 50%,#c98f52 50% 100%)}}.other-view{color:var(--cream);align-items:center;gap:.6em;font-size:.95em;font-weight:700;display:flex}.btn.small{min-height:44px;box-shadow:0 4px 0 var(--ink);padding:.2em .9em;font-size:1.05em}body[data-view="2d"] .other-view [data-view="2d"],body[data-view="3d"] .other-view [data-view="3d"]{display:none}.icon-btn svg{width:1.45em;height:1.45em;display:block}#btn-home{font-size:1.1em}.league-toggle{top:calc(.6em + env(safe-area-inset-top));background:var(--ink);border:3px solid var(--cream);z-index:2;border-radius:999px;gap:2px;padding:3px;display:flex;position:absolute;left:.6em}.league-toggle button{min-width:3.6em;min-height:40px;color:var(--cream);font-family:var(--display);cursor:pointer;background:0 0;border:none;border-radius:999px;font-size:1em}.league-toggle button[aria-pressed=true]{background:var(--sun);color:var(--ink)}.league-toggle button:focus-visible{outline:3px solid var(--pink);outline-offset:2px}body.no-3d [data-view="3d"],body.no-3d .other-view{display:none}#rotate{z-index:100;color:var(--cream);font-family:var(--display);text-align:center;background:#1d1033;place-items:center;padding:16px;font-size:22px;display:none;position:fixed;top:0;bottom:0;left:0;right:0}#rotate span{margin-bottom:8px;font-size:48px;display:block}@media (pointer:coarse) and (orientation:landscape) and (max-height:500px){#rotate{display:grid}}#screen-loading{background:#0d0820;justify-content:center;gap:1.6em}.loading-ball{border:4px solid var(--ink);background:linear-gradient(90deg, transparent 47%, var(--ink) 47% 53%, transparent 53%), linear-gradient(0deg, transparent 47%, var(--ink) 47% 53%, transparent 53%), var(--orange);width:3.2em;height:3.2em;box-shadow:0 0 0 3px var(--cream);border-radius:50%;animation:.7s cubic-bezier(.5,.05,.5,1) infinite alternate ball-bounce}@keyframes ball-bounce{0%{transform:translateY(-1.2em)rotate(0)}to{transform:translateY(.6em)rotate(160deg)}}.loading-text{color:var(--cream);font-family:var(--display);opacity:.85;margin:0;font-size:1.2em}.pop3d.long{animation-duration:2.8s}.heat-badge{font-family:var(--display);border:2.5px solid var(--ink);box-shadow:0 3px 0 var(--ink);border-radius:999px;padding:.2em .8em;font-size:.9em;animation:.5s cubic-bezier(.3,1.8,.5,1) heat-in}.heat-badge.heating{color:var(--ink);background:#ffb347}.heat-badge.fire{color:var(--ink);background:linear-gradient(90deg,#ff4d00,#ffa200,#fff200);animation:.5s cubic-bezier(.3,1.8,.5,1) heat-in,1s ease-in-out infinite alternate heat-glow}@keyframes heat-in{0%{opacity:0;transform:translate(-50%)scale(.3)}}@keyframes heat-glow{to{box-shadow:0 3px 0 var(--ink), 0 0 14px #ff7a00}}.league-toggle{z-index:30;display:none}body.menu-open .league-toggle{display:flex}body:has(#screen-loading:not([hidden])) .league-toggle{display:none}#hud-heat{left:50%;bottom:calc(4.4em + env(safe-area-inset-bottom));white-space:nowrap;pointer-events:none;z-index:5;position:absolute;transform:translate(-50%)}body.menu-open #hud-heat{display:none}
