:root {
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  color-scheme: dark;
  background: #111410;
  color: #e5eadc;
}
* {
  box-sizing: border-box;
}
html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  background: #111410;
  overflow: hidden;
}
main {
  width: 100%;
  height: 100dvh;
}
canvas {
  display: block;
  width: 100%;
  height: 100%;
  touch-action: manipulation;
}
#controls {
  position: fixed;
  inset: 0;
  pointer-events: none;
}
#controls button {
  position: absolute;
  border: 0;
  margin: 0;
  padding: 0;
  opacity: 0;
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
}
#controls button:disabled {
  cursor: default;
  pointer-events: none;
}
.screen-reader {
  position: fixed;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
noscript {
  position: fixed;
  inset: 20px;
  padding: 20px;
  background: #111410;
  color: #e5eadc;
  font: 18px/1.6 monospace;
}
