add sounds and textures

css/style.css

@@ -20,10 +20,12 @@ canvas {
 }
 
 .maze-layout {
-  width: min(1100px, calc(100vw - 24px));
+  width: min(1200px, calc(100vw - 24px));
   margin: 12px auto 20px;
   display: grid;
-  gap: 12px;
+  grid-template-columns: 2fr 1fr;
+  gap: 16px;
+  align-items: start;
 }
 
 .panel {
@@ -45,7 +47,7 @@ canvas {
 
 #renderCanvas {
   width: 100%;
-  height: min(62vh, 680px);
+  height: min(76vh, 820px);
 }
 
 .canvas-hud {
@@ -78,6 +80,28 @@ canvas {
   text-shadow: 0 0 12px rgba(121, 174, 242, 0.35);
 }
 
+.canvas-hud-row {
+  display: flex;
+  justify-content: space-between;
+  gap: 14px;
+  margin-top: 8px;
+  padding-top: 8px;
+  border-top: 1px solid rgba(255, 255, 255, 0.08);
+  font-size: 11px;
+  color: #dbe6f2;
+}
+
+.canvas-hud-row span {
+  color: #93a4b8;
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+}
+
+.canvas-hud-row strong {
+  color: #79aef2;
+  font-weight: 600;
+}
+
 .control-panel {
   padding: 16px;
   overflow-y: auto;
@@ -223,6 +247,7 @@ canvas {
   .maze-layout {
     width: calc(100vw - 16px);
     margin: 8px auto 16px;
+    grid-template-columns: 1fr;
   }
 
   #renderCanvas {