Fix execution steps layout overflow - make UI more compact and user-friendly

Co-authored-by: 0xrinegade <101195284+0xrinegade@users.noreply.github.com>

Author: Copilot

docs/orderbook-visualizer.html

@@ -601,10 +601,10 @@
         }
 
         .algorithm-steps {
-            margin: 0.3rem 0;
-            flex: 1;
+            margin: 0.2rem 0;
+            flex: 0 0 auto;
             min-height: 0;
-            max-height: 240px;
+            max-height: 140px;
             overflow: hidden;
             display: flex;
             flex-direction: column;
@@ -614,27 +614,27 @@
             background: rgba(255, 255, 255, 0.5);
             border: 1px solid rgba(0, 0, 0, 0.1);
             border-radius: 6px;
-            padding: 0.3rem;
-            min-height: 120px;
-            max-height: 200px;
+            padding: 0.2rem;
+            min-height: 80px;
+            max-height: 100px;
             overflow-y: auto;
-            font-size: 0.7rem;
-            line-height: 1.2;
+            font-size: 0.65rem;
+            line-height: 1.1;
             flex: 1;
         }
 
         .execution-step {
             display: flex;
             align-items: center;
-            padding: 0.15rem 0.2rem;
-            margin: 0.05rem 0;
+            padding: 0.1rem 0.15rem;
+            margin: 0.02rem 0;
             background: rgba(255, 255, 255, 0.8);
             border-radius: 3px;
             border-left: 2px solid var(--accent-blue);
             animation: stepAppear 0.5s ease-out;
-            font-size: 0.65rem;
-            line-height: 1.1;
-            min-height: 18px;
+            font-size: 0.6rem;
+            line-height: 1.0;
+            min-height: 16px;
             transition: all 0.3s ease;
         }
 
@@ -709,8 +709,8 @@
         }
 
         .skip-list-visualization {
-            margin: 0.3rem 0;
-            flex: 1;
+            margin: 0.2rem 0;
+            flex: 2;
             min-height: 0;
             overflow: hidden;
             display: flex;
@@ -996,8 +996,8 @@
 
         /* Data Structure Specific Visualizations */
         .data-structure-viz {
-            margin: 0.3rem 0;
-            flex: 1;
+            margin: 0.2rem 0;
+            flex: 2;
             min-height: 0;
         }
 
@@ -1006,8 +1006,8 @@
             border: 1px solid rgba(0, 0, 0, 0.1);
             border-radius: 6px;
             padding: 0.3rem;
-            min-height: 60px;
-            max-height: 120px;
+            min-height: 100px;
+            max-height: 200px;
             overflow: auto;
         }