html, body { padding: 0; margin: 0; background: #231F20 }
#unity-container { position: absolute }
#unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) }
#unity-container.unity-mobile { position: fixed; top: 0; left: 0; width: 100%; height: 100%; height: 100dvh }
#unity-canvas { background: #231F20 }
.unity-mobile #unity-canvas { display: block; width: 100%; height: 100%; touch-action: none }
#unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -60%); display: none }
#unity-logo { width: 154px; height: 130px; background: url('unity-logo-dark.png') no-repeat center }
#unity-progress-bar-empty { width: 141px; height: 18px; margin-top: 10px; margin-left: 6.5px; background: url('progress-bar-empty-dark.png') no-repeat center }
#unity-progress-bar-full { width: 0%; height: 18px; margin-top: 10px; background: url('progress-bar-full-dark.png') no-repeat center }
#unity-footer { position: relative }
.unity-mobile #unity-footer { display: none }
.unity-mobile #unity-links { display: none }
#unity-webgl-logo { float:left; width: 204px; height: 38px; background: url('webgl-logo.png') no-repeat center }
#unity-build-title { float: right; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px }
#unity-fullscreen-button { float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center }
#unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }

/* The desktop canvas is a fixed 960 by 600 - the size in Player Settings - written
   straight onto the element by the loader, and the container is then centred on the
   page. In any window narrower than that the canvas hangs off both sides, and since
   the game keeps its menu in the bottom right corner, the menu is the first thing to
   go. Marked important because it is an inline style being overridden, which is the
   one case where a stylesheet needs it.

   Height leaves room for the footer strip and the links under it, so the page itself
   never has to scroll. The engine matches its render target to the element's size on
   its own, so resizing the window re-renders at the new size with nothing else to do. */
.unity-desktop #unity-container { left: 0 !important; top: 0 !important; transform: none !important }
.unity-desktop #unity-canvas { width: 100vw !important; height: calc(100vh - 90px) !important }
html, body { overflow-x: hidden }