html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #e8976a;
  /* Dressed letterbox backdrop for the areas outside the 3:4 stage:
     warm sand below, sky band + distant mesa stripes above. */
  background-image:
    radial-gradient(140px 90px at 12% 78%, rgba(214, 116, 84, 0.55) 0%, rgba(214, 116, 84, 0) 70%),
    radial-gradient(180px 110px at 88% 70%, rgba(214, 116, 84, 0.5) 0%, rgba(214, 116, 84, 0) 70%),
    radial-gradient(120px 80px at 25% 30%, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0) 72%),
    radial-gradient(160px 100px at 74% 22%, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 72%),
    linear-gradient(to bottom,
      #59c3f0 0%, #59c3f0 26%,
      #a9c6dd 26%, #a9c6dd 31%,
      #e8a274 31%, #e8a274 33%,
      #f0b981 33%, #eeab76 100%);
  background-repeat: no-repeat;
}

#app {
  position: absolute;
  margin: 0;
  padding: 0;
  border: 0;
  box-shadow: 0 0 44px rgba(58, 31, 20, 0.38);
}

#app > canvas {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
  background: transparent;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}