html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: #0e0e12;
  overflow: hidden;
  font-family: system-ui, sans-serif;
}

#game {
  width: 100vw;
  height: 100vh;
}

/* Phaser injects its <canvas> here; FIT-scaling centres it for us. */
#game canvas {
  display: block;
  margin: 0 auto;
  /* Let Phaser own touch drags instead of the browser scrolling/zooming. */
  touch-action: none;
}

/* Shown by the loader (src/boot.js) only if the game can't be loaded. */
.load-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  gap: 1rem;
  color: #dddddd;
  font-size: 1rem;
  text-align: center;
}

.load-error button {
  padding: 0.5rem 1rem;
  font-size: 1rem;
  cursor: pointer;
}