/* =============================================================
 * kk-image-fixes.css — force uniform card height on /home
 * discover grid (and any other route that renders .discover-card).
 *
 * The current build has a deliberate brick-pattern layout
 * (odd cards 180px, even cards 240px) — see the existing
 *   .discover-card:nth-child(2n+1) .photo-button { height: 180px !important; }
 *   .discover-card:nth-child(2n)   .photo-button { height: 240px !important; }
 *   .photo-button                   { height: 200px !important; }
 * rules. User wants a tidy uniform grid like the legacy
 * front-end, so we flatten the alternating pattern.
 * Deployed as a new shim with ?v=1 — register in index.html.
 * ============================================================= */

.discover-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 14px;
  align-items: stretch;
}

.discover-card {
  min-width: 0;
}

/* Kill the alternating heights and the base 200px — uniform. */
.discover-card .photo-button,
.discover-card:nth-child(2n+1) .photo-button,
.discover-card:nth-child(2n)   .photo-button,
.photo-button {
  height: 220px !important;
  aspect-ratio: auto !important;
  width: 100% !important;
}

.discover-card .photo-button img,
.photo-button img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
