/* Shared catalogue layout. The homepage does not load this stylesheet. */
@media (min-width: 1600px) and (min-height: 850px) {
  .catalog-no-banner.catalog-compact {
    --poster-width: calc((94vw - 8 * 18px) / 9);
    --poster-height: calc(var(--poster-width) * 1.5);
    --catalog-heading-height: 39.140625px;
    --catalog-pagination-height: 64px;
    --catalog-title-first-row: 70px;
    --catalog-title-second-row: 38px;
    --catalog-reference-height: calc(2 * var(--poster-height) + var(--catalog-title-first-row) + var(--catalog-title-second-row) + 16px);
    /* Center the /filme/ reference block, not the current result set. */
    --catalog-reference-inset: max(0px, calc((100svh - 64px - 28px - var(--catalog-heading-height) - 24px - var(--catalog-pagination-height) - var(--catalog-reference-height)) / 2));
  }
  .catalog-no-banner.catalog-compact .catalog-content {
    padding: 16px 3% 12px;
    grid-template-rows: auto minmax(min-content, 1fr) var(--catalog-pagination-height);
    row-gap: 12px;
  }
  .catalog-no-banner.catalog-compact .catalog-rows {
    grid-row: 2;
    width: 100%;
    max-width: 100%;
    justify-self: start;
    align-self: start;
    margin: var(--catalog-reference-inset) 0 0;
  }
  .catalog-no-banner.catalog-compact .catalog-grid {
    grid-template-columns: repeat(9, var(--poster-width));
    grid-template-rows: minmax(calc(var(--poster-height) + var(--catalog-title-first-row)), auto) minmax(calc(var(--poster-height) + var(--catalog-title-second-row)), auto);
    gap: 16px 18px;
    justify-content: start;
    align-items: start;
  }
  .catalog-no-banner.catalog-compact .catalog-pagination {
    grid-row: 3;
    margin: 0;
    padding: 12px 16px;
  }
  .catalog-no-banner.catalog-compact .catalog-empty {
    grid-row: 2;
    align-self: start;
  }
}

/* Keep the shared 9-column poster size at normal 1080p browser heights.
   At shorter desktop heights, use the existing compact series sizing. */
@media (min-width: 1600px) and (min-height: 850px) and (max-height: 899px) {
  .catalog-no-banner.catalog-compact.catalog-anime-series {
    --poster-width: min(calc((94vw - 8 * 18px) / 9), calc((100svh - 410px) / 3));
  }
}

@media (min-width: 1600px) and (min-height: 900px) and (max-height: 950px) {
  .catalog-no-banner.catalog-compact.catalog-anime-series .catalog-content {
    padding-top: 8px;
    padding-bottom: 4px;
  }
  .catalog-no-banner.catalog-compact.catalog-anime-series .compact-catalog-title {
    transform: translateY(8px);
  }
  .catalog-no-banner.catalog-compact.catalog-anime-series .catalog-rows {
    transform: translateY(8px);
  }
}

/* A 1080p monitor at 125% display scaling exposes about 1536 × 864 CSS pixels.
   Keep the series catalogue in two rows at that effective browser size. */
@media (min-width: 1200px) and (max-width: 1599px) and (min-height: 750px) {
  .catalog-no-banner.catalog-compact.catalog-anime-series {
    --poster-width: min(calc((94vw - 8 * 18px) / 9), calc((100svh - 410px) / 3));
    --poster-height: calc(var(--poster-width) * 1.5);
  }
  .catalog-no-banner.catalog-compact.catalog-anime-series .catalog-content {
    min-height: calc(100svh - 64px);
    padding: 16px 3% 12px;
    grid-template-rows: auto minmax(min-content, 1fr) auto;
    row-gap: 12px;
  }
  .catalog-no-banner.catalog-compact.catalog-anime-series .catalog-rows {
    grid-row: 2;
    align-self: start;
    margin: 0;
  }
  .catalog-no-banner.catalog-compact.catalog-anime-series .catalog-grid {
    grid-template-columns: repeat(9, var(--poster-width));
    gap: 16px 18px;
    justify-content: start;
  }
  .catalog-no-banner.catalog-compact.catalog-anime-series .catalog-art {
    width: var(--poster-width);
    height: var(--poster-height);
  }
  .catalog-no-banner.catalog-compact.catalog-anime-series .catalog-pagination {
    grid-row: 3;
    margin: 0;
    padding: 12px 16px;
  }
}
