fix canvas and buttons on smaller screens

index.html

@@ -54,7 +54,9 @@
                         </div>
                     </div>
 
-                    <button id="run-button">🏃 Run</button>
+                    <div>
+                        <button id="run-button">🏃 Run</button>
+                    </div>
                 </div>
 
                 <section>

style.css

@@ -56,18 +56,18 @@ section *:last-child {
 div#buttons {
     width: 100%;
     display: flex;
+    flex-wrap: wrap;
     flex: row;
-    justify-content: space-between;
-    align-items: flex-start;
     gap: 5px;
 }
 
 div#buttons > * {
-    width: 100%;
+    flex: 1;
 }
 
-div#buttons > * > button {
+div#buttons button {
     width: 100%;
+    white-space: nowrap;
 }
 
 .column {
@@ -78,10 +78,13 @@ div#buttons > * > button {
     align-items: flex-start;
     gap: 32px;
     flex: 1;
+    min-width: 0;
 }
 
 #canvas-area {
     background-color: black;
+    aspect-ratio: 480 / 360;
+    width: 100%;
 }
 
 #console-section {