style: 3-column main grid with Command History beside Command Console

dashboard/index.html

@@ -33,7 +33,7 @@
         </div>
 
         <main>
-            <div class="main-grid">
+            <div class="main-grid main-grid-3col">
                 <section class="control-panel card">
                     <h3>Command Console</h3>
                     
@@ -118,6 +118,15 @@
                     </div>
                 </section>
 
+                <!-- Command History: 2nd column -->
+                <section class="card" style="display: flex; flex-direction: column; overflow: hidden;">
+                    <h3>Command History</h3>
+                    <div class="history-list" id="activity-log" style="overflow-y: auto; display: flex; flex-direction: column; gap: 0.8rem; padding-right: 0.5rem; flex: 1; margin-top: 0.8rem;">
+                        <!-- items arrive here -->
+                    </div>
+                </section>
+
+                <!-- Your Orders: 3rd column -->
                 <section class="shipment-cart-section">
                     <div class="card full-width h-100">
                         <h3>Your Orders</h3>
@@ -125,15 +134,6 @@
                         </div>
                     </div>
                 </section>
-                
-                <section class="history-section" style="margin-top: 2rem;">
-                    <div class="card full-width" style="height: auto; max-height: 400px; display: flex; flex-direction: column;">
-                        <h3>Command History</h3>
-                        <div class="history-list" id="activity-log" style="overflow-y: auto; display: flex; flex-direction: column; gap: 0.8rem; padding-right: 0.5rem; flex: 1;">
-                            <!-- items arrive here -->
-                        </div>
-                    </div>
-                </section>
             </div>
 
             <section class="metrics-grid">

dashboard/style.css

@@ -192,11 +192,22 @@ header {
     grid-template-columns: 1.6fr 1fr;
     gap: 2rem;
     margin-bottom: 3rem;
-    align-items: start; /* Don't stretch if content is small */
+    align-items: start;
 }
 
+.main-grid-3col {
+    display: grid;
+    grid-template-columns: 1.6fr 1fr 1fr;
+    gap: 2rem;
+    margin-bottom: 3rem;
+    align-items: start;
+}
+
+@media (max-width: 1100px) {
+    .main-grid-3col { grid-template-columns: 1fr 1fr; }
+}
 @media (max-width: 900px) {
-    .main-grid { grid-template-columns: 1fr; }
+    .main-grid, .main-grid-3col { grid-template-columns: 1fr; }
 }
 
 .metrics-grid, .details-section, .log-section, .guide-section {