:root {
  --halfSide: calc((100vw - ((100vh / 57) * 104)) / 2);
  --halfHeight: calc((100vh - ((100vw / 104) * 57)) / 2);
}
body {
  overflow: hidden;
}
#wrapper {
}
#gamecontainer {
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
  height: 100vh;
  width: calc(100vh / 57 * 104);
  max-width: calc(900px / 57 * 104);
  max-height: 900px;
  position: absolute;
  left: calc(50vw - clamp(10px, calc(100vh / 57 * 52), 900px));
  top: 0;
}
#canvasPlayground {
  width: 100%;
  height: 100%;
  background: gray;
}
@media only screen and (min-aspect-ratio: 10 / 6) {
  #gamecontainer {
    margin: 0 auto;
    padding: 0;
    width: calc(100vh / 57 * 104);
    max-width: 100vw;
    height: calc(100vw / 104 * 57);
    max-height: 100vh;
    position: absolute;
    top: clamp(0px, var(--halfHeight), 1000px);
    left: clamp(0px, var(--halfSide), 1000px);
    overflow: hidden;
  }
}
