From 0cb7883fc95ff6b6b8031cf5708ee20588618995 Mon Sep 17 00:00:00 2001
From: cliffhall <cliff@futurescale.com>
Date: Mon, 23 Mar 2026 13:25:09 -0400
Subject: [PATCH] fix server cards stretching to fill row height

Add grid-align-start class to SimpleGrid so cards size to their own
content instead of stretching to match the tallest card in the row.
Remove unused card-responsive CSS.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 clients/web/src/App.css                              | 12 +++---------
 .../organisms/ServerListScreen/ServerListScreen.tsx  |  2 +-
 2 files changed, 4 insertions(+), 10 deletions(-)

diff --git a/clients/web/src/App.css b/clients/web/src/App.css
index d8c779d4..dbf54382 100644
--- a/clients/web/src/App.css
+++ b/clients/web/src/App.css
@@ -104,14 +104,8 @@
   animation: inspector-spin 1s linear infinite;
 }
 
-/* ── Responsive card ────────────────────────────────────── */
+/* ── Grid alignment ─────────────────────────────────────── */
 
-.card-responsive {
-  width: 100%;
-}
-
-@media (min-width: 62em) {
-  .card-responsive {
-    width: 50%;
-  }
+.grid-align-start {
+  align-items: start;
 }
diff --git a/clients/web/src/components/organisms/ServerListScreen/ServerListScreen.tsx b/clients/web/src/components/organisms/ServerListScreen/ServerListScreen.tsx
index 2f106621..3822a75d 100644
--- a/clients/web/src/components/organisms/ServerListScreen/ServerListScreen.tsx
+++ b/clients/web/src/components/organisms/ServerListScreen/ServerListScreen.tsx
@@ -40,7 +40,7 @@ export function ServerListScreen({
             No servers configured. Add a server to get started.
           </Text>
         ) : (
-          <SimpleGrid cols={{ base: 1, md: 2 }} spacing="lg">
+          <SimpleGrid cols={{ base: 1, md: 2 }} spacing="lg" className="grid-align-start">
             {servers.map((server) => (
               <ServerCard key={server.name} {...server} />
             ))}