/* Candidate 2.7.2 — open homepage composition and narrow-phone containment. */

/* Keep the accepted content guides, but remove the large paper panel that
   made the hero read as a card nested inside another card. */
#yr-homepage-reference-v2 .hr2-frame {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  block-size: auto !important;
  min-block-size: 0 !important;
  max-block-size: none !important;
  grid-template-rows: calc(var(--page-w) * .083333) auto auto auto;
  padding-bottom: calc(var(--page-w) * .020833);
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

#yr-homepage-reference-v2 .hr2-frame::before,
#yr-homepage-reference-v2 .hr2-frame::after {
  content: none;
}

#yr-homepage-reference-v2 .hr2-mountains-frame {
  display: none;
}

/* The duplicate mark beneath the top bar is removed from the home DOM. This
   alignment also keeps the points capsule stable if old cached markup flashes. */
#yr-homepage-reference-v2 .hr2-account-row {
  justify-content: flex-end;
}

#yr-homepage-reference-v2 .hr2-account-row .hr2-mini-mark {
  display: none;
}

/* A taller, slightly narrower portrait reveals substantially more of the
   character without enlarging the surrounding paper panel. */
#yr-homepage-reference-v2 .hr2-hero {
  height: calc(var(--page-w) * 1.25);
  min-height: calc(var(--page-w) * 1.25);
}

#yr-homepage-reference-v2 .hr2-carousel {
  min-height: calc(var(--page-w) * .78);
}

#yr-homepage-reference-v2 .hr2-card-main {
  width: calc(var(--page-w) * .49);
  max-width: none;
  aspect-ratio: .64;
}

#yr-homepage-reference-v2 .hr2-card-main img,
#yr-homepage-reference-v2 .hr2-card-main video {
  object-position: center 22%;
  transform: none;
}

#yr-homepage-reference-v2 .hr2-dots {
  top: calc(var(--page-w) * .77);
}

/* The old circular treatment subtracted padding from an already-small box,
   leaving less than the width of two digits. Give "10" a real content box. */
#yr-homepage-reference-v2 .hr2-draw-btn.is-ten > span {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  padding: 0;
  font-size: 15px;
  line-height: 1;
  white-space: nowrap;
}

#yr-homepage-reference-v2 .hr2-draw-btn i {
  flex: 1 1 auto;
}

/* Prevent the mine summary from growing to its labels' min-content width.
   Every card owns exactly one third of the available panel width. */
#yr-homepage-reference-v2 .hr2-mine-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(7px, 2vw, 10px);
}

#yr-homepage-reference-v2 .hr2-mine-stats > div {
  min-width: 0;
  grid-template-columns: clamp(26px, 7.2vw, 31px) minmax(0, 1fr);
  column-gap: 3px;
  padding: 15px clamp(5px, 2vw, 10px);
  overflow: hidden;
}

#yr-homepage-reference-v2 .hr2-mine-stats > div > span {
  width: clamp(26px, 7.2vw, 31px);
  height: clamp(26px, 7.2vw, 31px);
  padding: 7px;
}

#yr-homepage-reference-v2 .hr2-mine-stats small {
  min-width: 0;
  font-size: clamp(10px, 2.7vw, 11.5px);
  white-space: nowrap;
}

#yr-homepage-reference-v2 .hr2-mine-stats b {
  min-width: 0;
  padding-left: clamp(5px, 1.8vw, 9px);
  font-size: clamp(27px, 7.2vw, 30px);
}

@media (max-width: 374px) {
  #yr-homepage-reference-v2 .hr2-illustration-entry {
    height: 408px;
  }

  #yr-homepage-reference-v2 .hr2-reward-entry {
    height: 310px;
  }

  #yr-homepage-reference-v2 .hr2-collection-card footer {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: end;
    row-gap: 3px;
  }

  #yr-homepage-reference-v2 .hr2-collection-card footer > span {
    grid-column: 1;
    grid-row: 1;
    font-size: 11.5px;
  }

  #yr-homepage-reference-v2 .hr2-collection-card footer > span b {
    font-size: 26px;
  }

  #yr-homepage-reference-v2 .hr2-collection-card footer > small {
    display: block;
    grid-column: 1 / 4;
    grid-row: 2;
    min-width: 0;
    margin-left: 0;
    overflow: hidden;
    font-size: 10px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #yr-homepage-reference-v2 .hr2-collection-card footer > em {
    grid-column: 3;
    grid-row: 1;
    font-size: 10.5px;
  }

  #yr-homepage-reference-v2 .hr2-mine-stats {
    gap: 6px;
  }

  #yr-homepage-reference-v2 .hr2-mine-stats > div {
    column-gap: 2px;
    padding-inline: 5px;
  }
}