:root{--stage-width:430px;--stage-ratio:.461538;--visible-height:100dvh;--visible-width:100dvw;--water-top:100%}*{box-sizing:border-box;margin:0;padding:0}html,body{touch-action:none;overscroll-behavior:none;background:#111;width:100%;height:100%;overflow:hidden}#stage{width:var(--visible-width);height:var(--visible-height);background:#000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0;overflow:hidden}#renderCanvas{z-index:2;width:var(--visible-width);height:var(--visible-height);touch-action:none;background:url(/assets/plain-background.jpg) 50%/cover no-repeat;outline:none;display:block;position:relative}#waterOverlay{left:0;right:0;top:var(--water-top);z-index:3;pointer-events:none;mix-blend-mode:normal;opacity:.86;background:radial-gradient(at 50% 0,#ffffff80,#0000 24%),linear-gradient(#69e5ff6b 0%,#00a1e09e 30%,#004198d1 100%);position:absolute;bottom:0;overflow:hidden;box-shadow:inset 0 18px 28px #ffffff4d,inset 0 -80px 100px #001c5f42}#waterOverlay:before{content:"";opacity:.44;filter:blur(1.5px);transform:translateY(calc(var(--water-top) * -.01));background:radial-gradient(at 26% 28%,#0000 0 31%,#ffffff59 33%,#0000 38%) 0 0/320px 210px,radial-gradient(at 70% 18%,#0000 0 30%,#ffffff3d 32%,#0000 39%) 0 0/280px 180px,radial-gradient(at 48% 66%,#0000 0 34%,#ffffff3d 36%,#0000 42%) 0 0/360px 230px,repeating-linear-gradient(106deg,#0000 0 82px,#ffffff2e 88px 92px,#0000 100px 172px) 0 0/220px 160px;animation:9s linear infinite causticsDrift;position:absolute;inset:0}#waterOverlay:after{content:"";clip-path:polygon(0 53%,8% 45%,16% 57%,24% 42%,32% 55%,40% 48%,48% 58%,56% 43%,64% 52%,72% 46%,80% 58%,88% 44%,100% 51%,100% 100%,0 100%);filter:drop-shadow(0 4px 3px #0058b473);background:radial-gradient(at 12% 58%,#fffffff2 0 3px,#0000 4px),radial-gradient(at 86% 52%,#ffffffc7 0 2px,#0000 4px),linear-gradient(#ffffffe6,#80eeff94 44%,#0074dd80 100%);height:46px;animation:4.8s ease-in-out infinite alternate waveSlide;position:absolute;top:-16px;left:-5%;right:-5%}@keyframes causticsDrift{0%{background-position:0 0,0 0}to{background-position:320px 210px,-280px 180px,360px -230px,-220px 160px}}@keyframes waveSlide{0%{transform:translate(-2%)translateY(0)}to{transform:translate(2%)translateY(2px)}}#orientationMessage{display:none}#comboHud{left:16px;top:calc(16px + env(safe-area-inset-top,0px));z-index:6;pointer-events:none;opacity:0;flex-direction:column;align-items:flex-start;font-family:ui-rounded,SF Pro Rounded,ui-sans-serif,system-ui,sans-serif;line-height:.9;transition:opacity .18s,transform .18s;display:flex;position:fixed;transform:translateY(-8px)scale(.9)}#comboHud.visible{opacity:1;transform:translateY(0)scale(1)}#comboHud .comboMult{color:#fff;letter-spacing:-1px;text-shadow:0 2px #084084e6,0 0 18px #78e2ffd9;-webkit-text-stroke:2px #072c608c;font-size:56px;font-weight:900}#comboHud .comboLabel{letter-spacing:3px;color:#bdf3ff;text-shadow:0 1px 4px #042450cc;margin-top:2px;font-size:15px;font-weight:800}#comboHud.pulse .comboMult{animation:.34s ease-out comboPop}@keyframes comboPop{0%{color:#fff7b0;transform:scale(1.55)}60%{transform:scale(.94)}to{color:#fff;transform:scale(1)}}#debugHud{z-index:10;color:#e8fbff;pointer-events:none;white-space:pre;background:#08121ec2;border:1px solid #ffffff59;border-radius:6px;padding:8px 10px;font:12px/1.35 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;position:fixed;top:12px;left:12px}@media (hover:hover) and (pointer:fine){#stage{background:#000}#renderCanvas{width:min(var(--stage-width), calc(var(--visible-height) * var(--stage-ratio)));height:min(calc(var(--stage-width) / var(--stage-ratio)), var(--visible-height));border-radius:24px;box-shadow:0 22px 80px #00000075,0 0 0 1px #ffffff2e}#waterOverlay{left:calc((100% - min(var(--stage-width), calc(var(--visible-height) * var(--stage-ratio)))) / 2);right:calc((100% - min(var(--stage-width), calc(var(--visible-height) * var(--stage-ratio)))) / 2);bottom:calc((100% - min(calc(var(--stage-width) / var(--stage-ratio)), var(--visible-height))) / 2);border-bottom-right-radius:24px;border-bottom-left-radius:24px}}@media (hover:none) and (pointer:coarse) and (orientation:landscape){#stage{background:#071d2e}#renderCanvas{visibility:hidden}#waterOverlay{display:none}#orientationMessage{color:#e8fbff;text-align:center;background:radial-gradient(at 50% 30%,#74ccff47,#0000 58%),linear-gradient(#0c3754,#071d2e);place-items:center;padding:24px;font:600 18px/1.35 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:grid;position:fixed;inset:0}}