Fix grid viewer: overlay label on image so zoom doesn't shrink images

Label is now absolutely positioned at the bottom of the cell with a
gradient background. Cell is square via aspect-ratio, nothing outside it.

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

public/style.css

@@ -1344,17 +1344,16 @@ nav {
 }
 
 .grid-cell {
-	display: flex;
-	flex-direction: column;
-	gap: 2px;
-}
-
-.grid-cell-img-wrap {
 	position: relative;
 	width: 100%;
 	aspect-ratio: 1;
 }
 
+.grid-cell-img-wrap {
+	position: absolute;
+	inset: 0;
+}
+
 .grid-cell-img {
 	width: 100%;
 	height: 100%;
@@ -1398,10 +1397,18 @@ nav {
 }
 
 .grid-cell-label {
+	position: absolute;
+	bottom: 0;
+	left: 0;
+	right: 0;
 	font-size: 0.65rem;
-	color: var(--text-faint);
+	color: #fff;
 	text-align: center;
 	font-family: var(--font-mono);
+	background: linear-gradient(transparent, rgba(0,0,0,0.55));
+	border-radius: 0 0 3px 3px;
+	padding: 6px 2px 2px;
+	pointer-events: none;
 }
 
 /* ===== GRID TYPE PILL ===== */