#unity-container {
  position: absolute;
}
/* EnjoGames: the game fills the whole screen, in the app too (under the status bar and the home indicator); in the
   app only the UI near the edges moves in, in the app's copy of the data (index.html, dataUrl). */
#unity-container.unity-desktop {
  width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
#unity-container.unity-mobile {
  position: fixed;
  width: 100%;
  height: 100%;
}
#unity-canvas {
  background: #fff6f2; /* the game's loading colour, the brand's light background: the same as Unity's splash and the scenes' loading screens (unity_data.py) */
}
.unity-mobile #unity-canvas {
  width: 100%;
  height: 100%;
}
#unity-warning {
  position: absolute;
  left: 50%;
  top: 5%;
  transform: translate(-50%);
  background: white;
  padding: 10px;
  display: none;
}

/* Remove the default margins for consistency. */
* {
  margin: 0;
}

/* Match the viewport. */
html,
body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}

/* Prevent the canvas from scrolling. */
canvas {
  display: block;
}

/* EnjoGames: the game's sound button (src/platform/game-platform.js): the brand's icon button (coral tile, white glyph,
   solid edge), top left, level with the coin counter; in the app below the status bar (--inset-top). */
#sound-button {
  --inset-top: 0px;
  position: fixed;
  z-index: 10;
  left: 16px;
  top: calc(var(--inset-top) + 21px);
  width: 46px;
  height: 46px;
  padding: 0;
  border: 0;
  border-radius: 15px;
  background: #f6623d;
  box-shadow: 0 4px 0 #b63613;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  outline: none;
}
#sound-button:active {
  transform: translateY(3px);
  box-shadow: 0 1px 0 #b63613;
}
#sound-button svg {
  width: 28px;
  height: 28px;
  display: block;
}