*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;font-family:Arial,sans-serif;background:#10172d;color:#fff}canvas{display:block}#hud{position:fixed;z-index:2;top:0;left:0;width:100%;padding:18px 22px;display:flex;gap:24px;align-items:center;background:linear-gradient(#080d1dcc,transparent);pointer-events:none}#hud b{font-size:20px;letter-spacing:2px;color:#79e8ff}#hud span{font-weight:700;text-shadow:0 2px 5px #000}#help{margin-left:auto;font-size:12px;opacity:.8}#crosshair{position:fixed;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);font-size:28px;color:#fff;text-shadow:0 0 8px #51dfff;pointer-events:none}#menu{position:fixed;z-index:3;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,#253c62dd,#080d1dee);text-align:center}#menu h1{font-size:clamp(42px,8vw,86px);letter-spacing:5px;margin:0;color:#7beaff;text-shadow:0 0 25px #1688c9}#menu p{color:#d2e4ff;margin:12px 0 30px}button{border:0;border-radius:9px;padding:16px 34px;background:linear-gradient(90deg,#18a8dc,#5866e8);color:#fff;font-weight:900;font-size:16px;letter-spacing:1px;cursor:pointer}button:hover{filter:brightness(1.15)}@media(max-width:650px){#hud{gap:10px;padding:12px;font-size:12px;flex-wrap:wrap}#help{width:100%;margin:0}}