html, body { margin: 0; height: 100%; background: #000; overflow: hidden; touch-action: none;
  -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; }
canvas#screen { display: block; position: fixed; inset: 0; image-rendering: pixelated; }
#touch { position: fixed; inset: 0; pointer-events: none; }
#touch button { pointer-events: auto; position: relative; width: 76px; height: 76px; margin: 6px; border-radius: 50%;
  border: 2px solid rgba(120, 255, 240, 0.35); background: rgba(120, 255, 240, 0.08); color: rgba(160, 255, 245, 0.8);
  font: 22px/1 monospace; touch-action: none; }
#touch button.on { background: rgba(120, 255, 240, 0.3); border-color: rgba(160, 255, 245, 0.8); }
#touch .tl { position: absolute; left: max(10px, env(safe-area-inset-left)); bottom: max(14px, env(safe-area-inset-bottom)); display: flex; }
#touch .tr { position: absolute; right: max(10px, env(safe-area-inset-right)); bottom: max(14px, env(safe-area-inset-bottom)); }
#touch .jump { width: 92px; height: 92px; }
#touch .pause { position: absolute; top: max(8px, env(safe-area-inset-top)); right: max(8px, env(safe-area-inset-right));
  width: 44px; height: 44px; font-size: 14px; }