* { margin: 0; padding: 0; box-sizing: border-box; user-select: none; -webkit-tap-highlight-color: transparent; }
html, body { width: 100%; height: 100%; overflow: hidden; touch-action: none; }
body { background: #0a0a1a; color: #eee; font-family: system-ui, -apple-system, sans-serif; display: flex; justify-content: center; }
#app { width: 100%; max-width: 420px; height: 100vh; height: 100dvh; display: flex; flex-direction: column; }

#hud {
  display: flex; justify-content: space-around; align-items: center;
  padding: 6px 10px; background: #12122a; font-size: 0.85rem; flex-shrink: 0;
}
#hud #speed-label { font-size: 0.75rem; color: #888; }

canvas { display: block; width: 100%; flex: 1; touch-action: none; }

#overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.75);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  z-index: 10; gap: 12px;
}
#overlay.hidden { display: none; }
#overlay-title { font-size: 1.8rem; font-weight: bold; }
#overlay-sub { font-size: 1rem; color: #aaa; }
#overlay button {
  padding: 14px 48px; border: none; border-radius: 8px;
  background: #e94560; color: #fff; font-size: 1.1rem; font-weight: bold; cursor: pointer;
}