diff --git a/public/styles/main.css b/public/styles/main.css
index 783e7c7..073eb84 100644
--- a/public/styles/main.css
+++ b/public/styles/main.css
@@ -4581,66 +4581,14 @@ html {
 .nodes-grid {
     display: grid;
     gap: 1rem;
-    /* Default desktop grid shows 5 items per row */
-    grid-template-columns: repeat(5, 1fr);
+    /* Responsive grid: fit as many cards as possible with min-width constraint */
+    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
     flex: 1;
     min-height: 0;
     overflow-y: auto;
 }
 
-/* Dynamic grid layouts based on number of items */
-.nodes-grid[data-item-count="1"] {
-    grid-template-columns: 1fr;
-    grid-template-rows: 1fr;
-    justify-items: center;
-}
-
-.nodes-grid[data-item-count="2"] {
-    grid-template-columns: repeat(2, 1fr);
-    grid-template-rows: 1fr;
-}
-
-.nodes-grid[data-item-count="3"] {
-    grid-template-columns: repeat(3, 1fr);
-    grid-template-rows: 1fr;
-}
-
-.nodes-grid[data-item-count="4"] {
-    grid-template-columns: repeat(2, 1fr);
-    grid-template-rows: repeat(2, 1fr);
-}
-
-.nodes-grid[data-item-count="5"],
-.nodes-grid[data-item-count="6"] {
-    grid-template-columns: repeat(5, 1fr);
-}
-
-.nodes-grid[data-item-count="7"],
-.nodes-grid[data-item-count="8"] {
-    grid-template-columns: repeat(5, 1fr);
-}
-
-.nodes-grid[data-item-count="9"] {
-    grid-template-columns: repeat(5, 1fr);
-}
-
-.nodes-grid[data-item-count="10"],
-.nodes-grid[data-item-count="11"],
-.nodes-grid[data-item-count="12"] {
-    grid-template-columns: repeat(5, 1fr);
-}
-
-/* For more than 12 items, use auto-fit with reasonable minimum */
-.nodes-grid[data-item-count="13"],
-.nodes-grid[data-item-count="14"],
-.nodes-grid[data-item-count="15"],
-.nodes-grid[data-item-count="16"] {
-    grid-template-columns: repeat(5, 1fr);
-}
-
-.nodes-grid[data-item-count="17"] {
-    grid-template-columns: repeat(5, 1fr);
-}
+/* Responsive grid handles all item counts automatically */
 
 .node-card {
     background: var(--bg-tertiary);
@@ -4648,6 +4596,8 @@ html {
     padding: 1.25rem;
     border: 1px solid var(--border-primary);
     transition: all 0.2s ease;
+    min-width: 280px;
+    width: 100%;
 }
 
 .node-card:hover {
@@ -4982,29 +4932,14 @@ html {
         grid-template-columns: 1fr;
     }
     
-    /* Mobile grid layouts - simplified for smaller screens but still maximize vertical space */
-    .nodes-grid[data-item-count="1"] {
-        grid-template-columns: 1fr;
-        grid-template-rows: 1fr;
-        justify-items: center;
+    /* Mobile grid layouts - use responsive grid with smaller min-width */
+    .nodes-grid {
+        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
     }
     
-    .nodes-grid[data-item-count="2"] { grid-template-columns: repeat(2, 1fr); grid-template-rows: 1fr; }
-    .nodes-grid[data-item-count="3"],
-    .nodes-grid[data-item-count="4"] { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); }
-    .nodes-grid[data-item-count="5"],
-    .nodes-grid[data-item-count="6"],
-    .nodes-grid[data-item-count="7"],
-    .nodes-grid[data-item-count="8"],
-    .nodes-grid[data-item-count="9"],
-    .nodes-grid[data-item-count="10"],
-    .nodes-grid[data-item-count="11"],
-    .nodes-grid[data-item-count="12"],
-    .nodes-grid[data-item-count="13"],
-    .nodes-grid[data-item-count="14"],
-    .nodes-grid[data-item-count="15"],
-    .nodes-grid[data-item-count="16"],
-    .nodes-grid[data-item-count="17"] { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(auto-fit, 1fr); }
+    .node-card {
+        min-width: 240px;
+    }
     
     .monitoring-header {
         flex-direction: column;