*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#080c14;color:#d9e8ef;font-family:monospace}body{min-height:100dvh;display:grid;place-items:center}button{font:inherit;color:inherit;background:#111d2ce6;border:1px solid #3d6579;cursor:pointer;padding:12px}button:focus-visible{outline:2px solid #59e7f2}main{width:min(1200px,100%);padding:18px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}h1{font-size:30px;letter-spacing:4px;margin:5px 0}h1 span{color:#f34496}.eyebrow,footer{font-size:10px;letter-spacing:2px;color:#8aabbc}.stage{position:relative;background:#080c14;border:1px solid #293d50;aspect-ratio:2}canvas{width:100%;height:100%;display:block;image-rendering:pixelated}.hud{position:absolute;inset:20px 24px auto;display:flex;justify-content:space-between;pointer-events:none}.hud>div{width:28%;text-shadow:0 2px 3px #000}.hud strong,.hud small{display:block;font-size:11px;letter-spacing:2px}.hud small{font-size:10px;margin-top:5px}.enemy-hud{text-align:right}progress{width:100%;height:8px;appearance:none;border:0;background:#1d2836;margin-top:8px}progress::-webkit-progress-bar{background:#1d2836}progress::-webkit-progress-value{background:#62dce9}progress::-moz-progress-bar{background:#62dce9}.enemy-hud progress::-webkit-progress-value{background:#ef4e91}.enemy-hud progress::-moz-progress-bar{background:#ef4e91}#message{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px;background:#070d19db}#message[hidden]{display:none}h2{letter-spacing:4px}footer{display:flex;justify-content:space-between;gap:15px;padding:15px 0}footer b{color:#a3c7d6;font-weight:normal}.touch{display:flex;justify-content:space-between;align-items:center}.touch>div{display:flex;gap:12px}.touch button{min-width:65px;min-height:55px;touch-action:none;user-select:none}.touch button.held{background:#23516c}.spear{border-color:#ec4285!important;min-width:130px!important}.spear small{display:block;color:#b58ca2;margin-top:5px}body,canvas{overscroll-behavior:none}#game:fullscreen{background:#080c14;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center}.stage{flex-shrink:1;min-height:0} @media(max-height:600px) and (orientation:landscape){main{padding:5px;width:min(100%,calc((100dvh - 75px)*2))}header{margin-bottom:3px}h1{font-size:17px;margin:0}.eyebrow{font-size:8px}header button{padding:5px}footer{padding:4px 0;font-size:8px;letter-spacing:0}.touch{position:fixed;inset:auto 14px 12px;pointer-events:none}.touch button{pointer-events:auto;opacity:.8}.hud{inset:10px 14px auto}}@media(orientation:portrait){main{padding:10px}h1{font-size:22px}header button{font-size:9px}.hud strong{font-size:8px}.hud{inset:10px}footer{letter-spacing:0;font-size:8px}.touch{margin-top:20px}}