html,body{background:#8fd3ff;height:100%;margin:0;font-family:Trebuchet MS,sans-serif;overflow:hidden}canvas{display:block}#hud{pointer-events:none;color:#fff;position:fixed;inset:0}#cross{background:#fff;border-radius:50%;width:8px;height:8px;margin:-4px;position:absolute;top:50%;left:50%;box-shadow:0 0 0 2px #0008}#hit{opacity:0;border:4px solid #ff3b3b;width:30px;height:30px;margin:-15px;transition:opacity .25s;position:absolute;top:50%;left:50%;transform:rotate(45deg)}#hit.on{opacity:1;transition:none}#hurt{opacity:0;background:radial-gradient(#0000 40%,#f00c);transition:opacity .4s;position:absolute;inset:0}#hurt.on{opacity:1;transition:none}#bots{text-shadow:0 3px #0007;font-size:28px;font-weight:700;position:absolute;top:16px;right:20px}#life{background:#0006;border:4px solid #fff;border-radius:8px;width:280px;height:26px;position:absolute;bottom:20px;left:20px;overflow:hidden}#lifebar{background:#52e04a;width:100%;height:100%;transition:width .15s}#screen{color:#fff;text-align:center;cursor:pointer;background:#0a1a3acc;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#screen.hidden{display:none}#title{text-shadow:0 5px #0007;margin:0 0 12px;font-size:64px}#sub{white-space:pre-line;font-size:24px;line-height:1.6}