@import"https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&display=swap";:root{color-scheme:light;--tone-0: #0f380f;--tone-1: #306230;--tone-2: #8bac0f;--tone-3: #9bbc0f;--shadow: rgba(15, 56, 15, .25);--ui-button-art: url(/watergame/ui/burst-button.webp);--ui-screen-art: url(/watergame/ui/screen-bezel.webp);--ui-panel-art: url(/watergame/ui/status-panel.webp);font-family:Silkscreen,monospace}*{box-sizing:border-box}html,body,#app{margin:0;min-height:100%}html{background:#10180c}body{min-height:100svh;background:radial-gradient(circle at top,rgba(155,188,15,.15),transparent 32%),linear-gradient(180deg,#182510,#10180c);color:var(--tone-0);overscroll-behavior:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}button{font:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.app-shell{min-height:100svh;display:grid;place-items:center;width:100%;padding:calc(.65rem + env(safe-area-inset-top)) calc(.8rem + env(safe-area-inset-right)) calc(.8rem + env(safe-area-inset-bottom)) calc(.8rem + env(safe-area-inset-left))}.pocket{width:min(100%,35rem);display:grid;gap:.55rem;padding:.8rem;background:linear-gradient(180deg,var(--tone-3),var(--tone-2));border:4px solid var(--tone-0);border-radius:1.4rem 1.4rem 2.8rem;box-shadow:0 .95rem #0f380f52,inset 0 0 0 4px #9bbc0f3d}.title-row,.status-row{display:flex;justify-content:space-between;gap:.55rem}.title-row{align-items:center}.status-row{align-items:stretch}.meta-column{min-width:7rem;display:grid;gap:.35rem}.stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem}.title-block h1{margin:0;font-size:clamp(.88rem,3.5vw,1.2rem);line-height:1.1}.system-label,.score-label,.display-header{letter-spacing:.05em;font-size:.5rem;line-height:1.4}.system-label{display:inline-block}.reset-button{border:3px solid var(--tone-0);border-radius:.9rem;padding:.56rem .8rem;min-width:5rem;line-height:1;color:var(--tone-3);background:linear-gradient(#0f380fc2,#0f380feb),var(--ui-panel-art) center / 145% 190%;box-shadow:0 .35rem #0f380f33;cursor:pointer}.status-line{flex:1;margin:0;padding:.45rem .6rem;min-height:2.2rem;border:3px solid var(--tone-0);border-radius:.9rem;background:linear-gradient(#9bbc0fd1,#8bac0fad),var(--ui-panel-art) center / 122% 185%;font-size:.54rem;line-height:1.45}.status-line[data-variant=celebrate]{background:var(--tone-0);color:var(--tone-3)}.score-box{min-width:5.7rem;padding:.45rem .6rem;text-align:right;border:3px solid var(--tone-0);border-radius:.9rem;background:linear-gradient(#9bbc0fd6,#8bac0fad),var(--ui-panel-art) center / 150% 195%}.score-box strong{display:block;margin-top:.2rem;font-size:.82rem;line-height:1.2}.score-box-points strong{font-size:.74rem}.score-sub{display:block;margin-top:.16rem;font-size:.42rem;line-height:1.35}.mode-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.28rem}.mode-chip{min-height:2rem;border:2px solid var(--tone-0);border-radius:.65rem;background:linear-gradient(#9bbc0fb8,#8bac0f85),var(--ui-panel-art) center / 150% 190%;color:var(--tone-0);font-size:.52rem;line-height:1;cursor:pointer}.mode-chip.is-active{background:linear-gradient(#0f380fd6,#0f380ff0),var(--ui-panel-art) center / 150% 190%;color:var(--tone-3);box-shadow:inset 0 0 0 1px #9bbc0f47}.progress-meter{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:.24rem}.progress-cell{height:.54rem;border:2px solid var(--tone-0);border-radius:.2rem;background:#0f380f14;opacity:.3}.progress-cell.is-active{opacity:1}.progress-cell.is-lit{background:var(--tone-1)}.combo-row{display:grid;gap:.2rem}.combo-head{display:flex;justify-content:space-between;align-items:baseline;gap:.4rem;color:var(--tone-0)}.combo-head strong{font-size:.82rem;line-height:1}.combo-award{font-size:.48rem;line-height:1.3}.combo-track{height:.7rem;border:2px solid var(--tone-0);border-radius:999px;overflow:hidden;background:#0f380f1f}.combo-fill{display:block;width:0%;height:100%;background:linear-gradient(90deg,var(--tone-1) 0%,var(--tone-0) 60%,var(--tone-1) 100%);transition:width 80ms linear}.display-panel{padding:.5rem;border:4px solid var(--tone-0);border-radius:1rem 1rem 2.2rem;background:linear-gradient(#306230a8,#0f380f80),var(--ui-screen-art) center / cover,var(--tone-1)}.display-header{display:flex;justify-content:space-between;gap:.5rem;margin-bottom:.35rem;color:var(--tone-3)}.screen-frame{--tilt-shift: 0;position:relative;aspect-ratio:4 / 4.5;overflow:hidden;border:4px solid var(--tone-0);border-radius:.8rem;background:var(--tone-3);box-shadow:inset 0 0 0 4px var(--tone-2);touch-action:none;transform-origin:center center;transition:transform .05s linear;cursor:grab}.screen-frame:active{cursor:grabbing}.scene-root,.screen-overlay{position:absolute;inset:0}.screen-frame:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,rgba(155,188,15,.55) 0%,rgba(155,188,15,.22) 34%,transparent 66%);opacity:0;mix-blend-mode:screen;pointer-events:none}.tilt-overlay{position:absolute;inset:auto 0 0;display:flex;justify-content:space-between;gap:.75rem;padding:.45rem .65rem .55rem;color:var(--tone-0);font-size:.55rem;letter-spacing:.05em;opacity:0;transform:translateY(.35rem);transition:opacity .14s ease,transform .14s ease;pointer-events:none}.tilt-overlay.is-visible{opacity:1;transform:translateY(0)}.scene-root canvas{width:100%;height:100%;display:block;image-rendering:pixelated;image-rendering:crisp-edges}.screen-overlay{pointer-events:none;opacity:calc(.86 + var(--tilt-shift, 0) * .16);background:linear-gradient(180deg,rgba(155,188,15,.08),transparent 24%,rgba(15,56,15,.1) 100%),repeating-linear-gradient(90deg,rgba(15,56,15,.045) 0,rgba(15,56,15,.045) 1px,transparent 1px,transparent 4px),repeating-linear-gradient(180deg,rgba(15,56,15,.05) 0,rgba(15,56,15,.05) 1px,transparent 1px,transparent 4px);mix-blend-mode:multiply}.controls{touch-action:none}.burst-button{width:100%;border:4px solid var(--tone-0);border-radius:1rem;min-height:5rem;display:grid;place-items:center;padding:1rem;position:relative;overflow:hidden;background:linear-gradient(to top,var(--tone-1) calc(var(--charge, 0) * 100% - 1px),var(--tone-0) calc(var(--charge, 0) * 100% - 1px),var(--tone-0) calc(var(--charge, 0) * 100%),var(--tone-2) calc(var(--charge, 0) * 100%));box-shadow:0 .35rem 0 var(--shadow),inset 0 0 calc(.4rem + var(--charge, 0) * 1.8rem + var(--surge, 0) * .8rem) #9bbc0f6b,0 0 calc(var(--charge, 0) * 1.5rem + var(--surge, 0) * 1.2rem) #9bbc0f47;touch-action:none;cursor:pointer;transition:transform .1s ease,box-shadow .1s ease}.burst-button:before{content:"";position:absolute;inset:0;z-index:0;background:var(--ui-button-art) center / 102% 100% no-repeat;opacity:.82;mix-blend-mode:multiply;pointer-events:none}.burst-meter{position:absolute;inset:auto 0 0;z-index:1;height:calc(var(--charge, 0) * 100%);background:linear-gradient(180deg,#9bbc0f14,#9bbc0f5c);mix-blend-mode:screen;pointer-events:none}.burst-button.is-pressed{transform:translateY(.25rem);box-shadow:none}.burst-button.is-charging{animation:charge-denied .24s steps(2,end)}.burst-label{position:relative;z-index:2;font-size:1.1rem;line-height:1;color:var(--tone-3);text-shadow:1px 0 0 var(--tone-0),-1px 0 0 var(--tone-0),0 1px 0 var(--tone-0),0 -1px 0 var(--tone-0)}.pocket.is-complete .progress-cell.is-lit{background:var(--tone-0)}.pocket.is-surging .combo-fill{background:linear-gradient(90deg,var(--tone-0) 0%,var(--tone-3) 35%,var(--tone-0) 100%)}.pocket.is-surging .burst-button{box-shadow:0 .35rem 0 var(--shadow),inset 0 0 calc(.8rem + var(--charge, 0) * 2rem + var(--surge, 0) * 1.5rem) #9bbc0f8c,0 0 calc(.4rem + var(--surge, 0) * 1.8rem) #9bbc0f6b}.pocket.is-hit .screen-frame,.pocket.is-big-hit .screen-frame{box-shadow:inset 0 0 0 4px var(--tone-2),0 0 calc(.5rem + var(--tilt-shift, 0) * .5rem) #9bbc0f47}.pocket.is-hit .screen-frame:after{animation:lcd-flash .18s steps(4,end)}.pocket.is-big-hit .screen-frame:after{animation:lcd-flash-strong .32s steps(6,end)}.pocket.is-hit .combo-track,.pocket.is-big-hit .combo-track{box-shadow:0 0 .45rem #0f380f2e}.combo-award.is-popping{animation:award-pop .26s steps(3,end)}@keyframes lcd-flash{0%{opacity:.56}to{opacity:0}}@keyframes lcd-flash-strong{0%{opacity:.82}45%{opacity:.32}to{opacity:0}}@keyframes award-pop{0%{transform:translateY(0)}40%{transform:translateY(-.08rem) scale(1.12)}to{transform:translateY(0) scale(1)}}@keyframes charge-denied{0%{transform:translate(0);filter:none}30%{transform:translate(-.18rem);filter:contrast(1.18)}60%{transform:translate(.18rem);filter:contrast(1.18)}to{transform:translate(0);filter:none}}button:focus-visible{outline:3px solid var(--tone-0);outline-offset:2px}@media(max-width:720px){.title-row,.status-row{flex-direction:column}.score-box{text-align:left}.meta-column{min-width:0}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(pointer:coarse),(hover:none)and (max-width:720px){.app-shell{place-items:start center;padding-top:calc(.35rem + env(safe-area-inset-top));padding-bottom:0}.pocket{gap:.4rem;padding:.55rem;padding-bottom:calc(4.5rem + max(.75rem,env(safe-area-inset-bottom)));width:min(100%,34rem)}.controls{position:fixed;left:calc(.75rem + env(safe-area-inset-left));right:calc(.75rem + env(safe-area-inset-right));bottom:max(.75rem,env(safe-area-inset-bottom));z-index:10}.burst-button{min-height:4rem;box-shadow:0 .35rem 0 var(--shadow),0 .8rem 1.5rem #0000004d}}@media(max-width:480px){.pocket{padding:.5rem;gap:.4rem}.status-line,.score-box{padding:.38rem .52rem}.display-panel{padding:.42rem}.display-header{margin-bottom:.25rem}.title-block h1{font-size:clamp(.78rem,3.1vw,1.02rem)}.reset-button{padding:.48rem .65rem;min-width:4.5rem}}@media(max-height:760px)and (pointer:coarse){.pocket{gap:.4rem}.status-line{min-height:2.4rem;padding:.4rem .6rem}.score-box{padding:.4rem .6rem}.score-box strong{margin-top:.2rem}.progress-cell{height:.55rem}.display-panel{padding:.4rem}.display-header{margin-bottom:.3rem}.burst-button{min-height:3.5rem;padding:.7rem}}