:root {
  --aspect: 4/3;
}

#main_canvas_container {
  max-width: 70%;
  height: 100%;

  aspect-ratio: var(--aspect);
}

#viewport {
  width: 100%;
  max-height: 100%;
  
  aspect-ratio: var(--aspect);
}

#controls_left, #controls_right {
  width: 15%;
}

@media (max-width: 500px) {
  #controls_contrainer {
    height: 100%;
    width: 100%;
  }

  #main_canvas_container {
    width: 100%;
    max-width: none;
    height: 60%;
  }

  #viewport {
    width: 100%;
    max-height: 100%;
  }

  #controls_right, #controls_left {
    width: 50%;
    height: 40%;
  }
}