/* =========================================================
   Game Card
========================================================= */

.es-game-card {
  border: 1px solid rgba(var(--bs-body-color-rgb), .12);
  border-radius: .75rem;
  overflow: hidden;
  transition: transform .15s ease;
}

.es-game-card:hover {
  transform: translateY(-2px);
}


/* =========================================================
   Thumbnail (Clickable Image)
========================================================= */

.es-game-thumbBtn {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
}

.es-game-thumbBtn:focus-visible {
  outline: 3px solid rgba(var(--bs-warning-rgb), .55);
  outline-offset: -3px;
}

.es-game-thumbImg {
  width: 100%;
  aspect-ratio: 16 / 9;      /* Consistent card height */
  object-fit: contain;       /* Show full image, no cropping */
  display: block;
  background: var(--bs-tertiary-bg);
}


/* =========================================================
   How-To Modal Image Frame
========================================================= */

.es-howto-frame {
  background: var(--bs-tertiary-bg);
  border-radius: .75rem;
  overflow: hidden;
  border: 1px solid rgba(var(--bs-body-color-rgb), .12);
}