* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background: #0a0a0a;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

#game-container {
  position: relative;
  flex: 1;
  min-height: 0;
  width: 100%;
  overflow: hidden;
  touch-action: none;
}

.game-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 12px;
  color: #eeeeee;
  background: #151117;
  font: 12px/1.4 system-ui, sans-serif;
}

.game-toolbar p { margin-right: auto; }
.game-toolbar button {
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid #66596c;
  border-radius: 5px;
  background: #251e29;
  color: #ffffff;
  font: inherit;
  cursor: pointer;
}
.game-toolbar button:focus-visible { outline: 3px solid #ffcc66; outline-offset: 2px; }
.game-toolbar button:disabled { opacity: 0.5; cursor: default; }
#game-container:focus-visible { outline: 2px solid #ffcc66; outline-offset: -2px; }
.embedded .game-toolbar { display: none; }
noscript { color: white; font: 16px system-ui, sans-serif; padding: 16px; }

canvas {
  display: block;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}