*{box-sizing:border-box}body{margin:0;background:#111c28;color:#d9eee8;font:14px ui-monospace,SFMono-Regular,monospace;overflow:hidden}canvas{display:block;width:100vw;height:100vh}main{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(420px,92vw);padding:30px;background:#101c25e8;border:1px solid #699f97;box-shadow:0 10px 90px #0009}small{color:#7baca1;letter-spacing:3px}h1{font-size:32px;margin:12px 0}p{line-height:1.6;color:#99b9b4}label{display:flex;align-items:center;justify-content:space-between;margin:18px 0}input,select,button,a{font:inherit;color:inherit;background:#203c44;border:1px solid #64928e;padding:10px}input{width:190px}button,a{cursor:pointer}main button,main a{display:block;width:100%;text-align:center;text-decoration:none;margin-top:14px}main button{background:#6ddbba;color:#102e2c;font-weight:bold}#error{color:#ffb8a4}#hud{position:absolute;inset:0;pointer-events:none}article{position:absolute;padding:16px;background:linear-gradient(#122c39a0,transparent);width:100%;color:#b9f0e6;text-shadow:0 1px 2px black}article b{display:block;letter-spacing:2px}article span{display:block;font-size:12px;margin-top:6px}#status{position:absolute;bottom:18px;left:18px;color:#b9d9d2;font-size:12px}#leave{position:absolute;right:12px;bottom:12px;background:#17323b99}#touch{position:absolute;bottom:66px;left:14px;right:14px;display:flex;align-items:end;justify-content:space-between;gap:8px}#touch button{touch-action:none;min-width:48px;min-height:55px;background:#163a43a8}#touchActions{display:flex;gap:6px}#touchActions button{font-size:11px}#touch[hidden],main[hidden],button[hidden]{display:none}
canvas{touch-action:none}.crosshair{position:absolute;width:10px;height:10px;border:1px solid #b9f0e6b0;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 2px #000;pointer-events:none}#touchActions{max-width:60vw;overflow:auto;flex-wrap:wrap;justify-content:center}#touchActions button{min-height:40px;min-width:52px;font-size:9px}

#mute{position:absolute;right:90px;bottom:12px;background:#17323b99;font-size:11px;padding:12px}

canvas[hidden]{display:none}

.confirmed-hit{border:0;border-radius:0;width:22px;height:22px;background:linear-gradient(45deg,transparent 45%,#fff2bc 46% 54%,transparent 55%),linear-gradient(-45deg,transparent 45%,#fff2bc 46% 54%,transparent 55%);opacity:var(--hit,1)}.hurt-indicator{position:absolute;box-shadow:inset 0 0 75px 25px #9c203399;pointer-events:none}

[hidden]{display:none!important}