:root {
  color-scheme: dark;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  background: #100b18;
  touch-action: none;
}

* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  overscroll-behavior: none;
  background:
    radial-gradient(circle at 50% 30%, #2a1734 0, #100b18 46%, #07050b 100%);
}

body {
  min-height: 100dvh;
  user-select: none;
  -webkit-user-select: none;
}

#game {
  display: block;
  width: 100vw;
  height: 100dvh;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  touch-action: none;
  outline: 0;
}

#dev {
  position: fixed;
  z-index: 3;
  top: max(8px, env(safe-area-inset-top));
  left: max(8px, env(safe-area-inset-left));
  padding: 6px 8px;
  color: #bfffe5;
  border: 1px solid #4bc99c;
  background: rgb(5 11 14 / 86%);
  font: 11px/1.5 ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  white-space: pre;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  #game {
    scroll-behavior: auto;
  }
}