Cards are compacter now, aligning to content size

Guestlist/wwwroot/app.css

@@ -21,21 +21,39 @@ a, .btn-link {
     padding-top: 1.1rem;
 }
 
-.guest-card-grid,
+.guest-card-grid {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 1rem;
+    align-items: flex-start;
+}
+
 .admin-panel-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
     gap: 1rem;
-    align-items: stretch;
+    align-items: start;
 }
 
-.guest-card-grid > .card,
 .admin-panel-grid > .card {
     border-radius: 8px;
 }
 
+.guest-card-grid > .card {
+    flex: 0 1 auto;
+    width: fit-content;
+    min-width: min(100%, 14rem);
+    max-width: min(100%, 22rem);
+    border-radius: 8px;
+}
+
 .guest-card-grid .card-body {
-    min-height: 220px;
+    min-height: auto;
+}
+
+.guest-card-grid .card-title,
+.guest-card-grid .card-text {
+    overflow-wrap: anywhere;
 }
 
 .auth-shell {
@@ -60,6 +78,13 @@ a, .btn-link {
     }
 }
 
+@media (max-width: 575.98px) {
+    .guest-card-grid > .card {
+        width: 100%;
+        max-width: none;
+    }
+}
+
 h1:focus {
     outline: none;
 }