:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{background:#241435;width:100%;height:100dvh;margin:0;padding:0;overflow:hidden}canvas{touch-action:none}.controls{z-index:10;flex-direction:column;align-items:center;gap:10px;display:flex;position:absolute;bottom:20px}.controls-right{right:20px}.controls-left{left:20px}.controls-top-right{top:calc(20px + env(safe-area-inset-top));bottom:auto;right:20px}.ctrl-btn{color:#f4c9c2;cursor:pointer;-webkit-tap-highlight-color:transparent;background:#241435d9;border:1px solid #ffffff40;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;padding:0;font-size:20px;line-height:1;transition:background .18s,border-color .18s,transform .12s;display:flex}.ctrl-btn:active{transform:scale(.92)}.ctrl-btn.active{color:#fff;background:#e8517f;border-color:#ffd9ea}.view-menu{flex-direction:column;gap:10px;margin-bottom:4px;display:flex}@keyframes bubble-pop{0%{opacity:0;transform:translateY(14px)scale(0)}70%{opacity:1;transform:translateY(-2px)scale(1.12)}to{opacity:1;transform:translateY(0)scale(1)}}.bubble-btn{animation:.32s cubic-bezier(.34,1.56,.64,1) both bubble-pop}.dpad{grid-template-rows:repeat(3,42px);grid-template-columns:repeat(3,42px);gap:4px;display:grid}.dpad .up{grid-area:1/2}.dpad .left{grid-area:2/1}.dpad .right{grid-area:2/3}.dpad .down{grid-area:3/2}@media (width<=640px),(pointer:coarse){.controls{bottom:calc(18px + env(safe-area-inset-bottom));gap:12px}.controls-right{right:calc(16px + env(safe-area-inset-right))}.controls-left{left:calc(16px + env(safe-area-inset-left))}.controls-top-right{top:calc(14px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right))}.ctrl-btn{width:54px;height:54px;font-size:24px}.view-menu{gap:12px}.dpad{grid-template-rows:repeat(3,54px);grid-template-columns:repeat(3,54px);gap:5px}}