/* CardReactor Set overview: fixed left rail + full remaining thumbnail mainframe. */

.crf-set-grid-layout {
  grid-template-columns: minmax(220px, 25%) minmax(0, 1fr);
}

.crf-set-grid-layout > .crf-col-left,
.crf-set-grid-layout > .crf-col-main {
  min-width: 0;
}

.crf-set-grid-layout > .crf-col-main {
  width: 100%;
}

.crf-set-card-grid-shell,
.crf-set-card-grid {
  width: 100%;
  min-width: 0;
}

/* Every Set tile uses the same trading-card image geometry.
 * The image is contained, never cropped, so all label rows start at
 * exactly the same vertical position without reintroducing large padding. */
.crf-set-card-grid .crf-home-card__visual {
  display: flex;
  width: 100%;
  height: auto;
  aspect-ratio: 5 / 7;
  align-items: center;
  justify-content: center;
  padding: 0;
  overflow: hidden;
  background: #fff;
}

.crf-set-card-grid .crf-home-card__visual img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.crf-set-card-grid .crf-home-card__label {
  min-height: 0;
  padding: 6px 7px 7px;
}

.crf-set-card-grid .crf-home-card__indicators {
  min-height: 0;
  padding: 3px 6px;
}

.crf-set-grid-loading {
  width: 100%;
}

.crf-set-grid-sentinel {
  display: block;
  width: 100%;
  height: 1px;
}

.crf-set-grid-sentinel[hidden] {
  display: none !important;
}

@media (max-width: 767px) {
  .crf-set-grid-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .crf-set-grid-layout > .crf-col-left,
  .crf-set-grid-layout > .crf-col-main {
    grid-column: 1;
  }
}