Fix browser grid card sizing

- Reduce regular grid icon/thumbnail to 90px fixed
- Cap compact grid columns at 100px max width
- Compact thumbnails fill card width with aspect-ratio
- Reduce grid gap and column min-width

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

media_server/static/css/styles.css

@@ -1858,16 +1858,16 @@
 /* Browser Grid */
 .browser-grid {
     display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
+    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
-    gap: 1rem;
+    gap: 0.75rem;
     margin-bottom: 1.5rem;
     min-height: 200px;
-    align-items: start;
+    align-items: stretch;
 }
 
 /* Compact Grid */
 .browser-grid.browser-grid-compact {
-    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
+    grid-template-columns: repeat(auto-fill, minmax(80px, 100px));
     gap: 0.5rem;
 }
 
@@ -2056,8 +2056,8 @@
 
 /* Thumbnail Display */
 .browser-thumbnail {
-    width: 100%;
+    width: 90px;
-    aspect-ratio: 1;
+    height: 90px;
     object-fit: cover;
     border-radius: 6px;
     background: var(--bg-primary);
@@ -2115,8 +2115,8 @@
 
 /* File/Folder Icons */
 .browser-icon {
-    width: 100%;
+    width: 90px;
-    aspect-ratio: 1;
+    height: 90px;
     display: flex;
     align-items: center;
     justify-content: center;
@@ -2128,6 +2128,7 @@
 .browser-item-info {
     width: 100%;
     text-align: center;
+    margin-top: auto;
 }
 
 .browser-item-name {
@@ -2175,8 +2176,8 @@
 /* Thumbnail Wrapper & Play Overlay */
 .browser-thumb-wrapper {
     position: relative;
-    width: 120px;
+    width: 90px;
-    height: 120px;
+    height: 90px;
     flex-shrink: 0;
 }
 
@@ -2212,8 +2213,8 @@
 
 /* Compact grid overrides */
 .browser-grid-compact .browser-thumb-wrapper {
-    width: 64px;
+    width: 100%;
-    height: 64px;
+    aspect-ratio: 1;
 }
 
 .browser-grid-compact .browser-play-overlay svg {