/* Keep native button contents at the top, even when a neighbour has more text. */
.anime-grid > button.anime-card {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
}
.anime-grid > button.anime-card > * { min-width: 0; width: 100%; }
.anime-grid > button.anime-card .anime-poster { flex-shrink: 0; }
.anime-grid > button.anime-card > h3 { min-height: 3.2em; overflow-wrap: anywhere; }
.anime-grid > button.anime-card > .submeta { min-height: 2.9em; line-height: 1.45; overflow-wrap: anywhere; }
.anime-grid > button.anime-card > .progress-label { gap: 8px; align-items: flex-start; }
.anime-grid > button.anime-card > .progress-label > :first-child { min-width: 0; overflow-wrap: anywhere; }
.anime-grid > button.anime-card > .progress-label > :last-child { flex: none; white-space: nowrap; }

/* Share each content row across neighbouring cards without truncating titles. */
@supports (grid-template-rows: subgrid) and selector(:has(*)) {
  .anime-grid:has(> button.anime-card) { --anime-row-gap: 24px; row-gap: 0; }
  .anime-page .anime-grid:has(> button.anime-card) { --anime-row-gap: 40px; }
  .anime-grid > button.anime-card {
    display: grid;
    grid-row: span 6;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: subgrid;
    gap: 0;
    align-content: start;
    margin-bottom: var(--anime-row-gap);
  }
  .anime-grid > button.anime-card > * { grid-column: 1; align-self: start; }
  .anime-grid > button.anime-card > .anime-poster { grid-row: 1; }
  .anime-grid > button.anime-card > h3 { grid-row: 2; min-height: 0; }
  .anime-grid > button.anime-card > .submeta { grid-row: 3; min-height: 0; }
  .anime-grid > button.anime-card > .progress-label { grid-row: 4; }
  .anime-grid > button.anime-card > .progress-track { grid-row: 5; }
  .anime-grid > button.anime-card > .anime-review { grid-row: 6; }
  @media (max-width: 760px) {
    .anime-grid:has(> button.anime-card) { --anime-row-gap: 25px; }
    .anime-page .anime-grid:has(> button.anime-card) { --anime-row-gap: 30px; }
  }
}
