From 72e1e43a2443630b9ce416ff3ae4be4d73c192f1 Mon Sep 17 00:00:00 2001
From: Myron Blair <myronblair@outlook.com>
Date: Tue, 21 Jul 2026 18:45:20 -0500
Subject: [PATCH] Switch dashboard grid to masonry-style columns for adjustable
 card heights

---
 index.html | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index 6c52bfc..9b26eac 100644
--- a/index.html
+++ b/index.html
@@ -54,9 +54,8 @@
   }
 
   .grid {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
-    gap: 1.25rem;
+    columns: 320px;
+    column-gap: 1.25rem;
     max-width: 1400px;
     margin: 0 auto;
   }
@@ -67,6 +66,8 @@
     border-radius: var(--radius);
     overflow: hidden;
     transition: border-color 0.2s, transform 0.2s;
+    break-inside: avoid;
+    margin-bottom: 1.25rem;
   }
   .card:hover { border-color: var(--accent); transform: translateY(-2px); }
 
@@ -180,7 +181,7 @@
 
   @media (max-width: 600px) {
     body { padding: 1rem; }
-    .grid { grid-template-columns: 1fr; }
+    .grid { columns: 1; }
   }
 </style>
 </head>