/* Homepage-only rendering budget. Card sizes, colors, glass and hover stay intact. */
.zf-home .content-section {
    opacity: 1;
    transform: none;
    will-change: auto;
    transition: none;
}
/* Hundreds of retained forwards-fill card/image animations used to keep layers
   alive. Native lazy loading + async decoding can reveal the same artwork directly. */
.zf-home .content-section.zf-visible .movie-card,
.zf-home .content-section.zf-visible .section-title,
.zf-home .movie-card .card-img {
    animation: none;
}
.zf-home .movie-card .card-img { opacity: 1; }
/* The horizontal shelf clips overflow. Keep the outer card in its original
   footprint: the old translateY/scale cut off its top and first/last edges.
   Image zoom, information reveal, border highlight and shadow remain intact. */
@media (hover: hover) and (pointer: fine) {
    html.zf-desktop .zf-home .movie-card:hover { transform: none; }
}
.zf-home .zf-studio-placeholder { pointer-events: none; animation: none; box-shadow: none; }
/* Unseen shelves stand in at the real poster height (measured in index.php) instead of the
   fixed 340px guess: at 1440px each one was ~100px too tall, so the page shrank under the
   visitor after a jump and the studio tabs ran off the screen (CLAUDE.md 5.83). */
@media (min-width: 701px) and (hover: hover) {
    .zf-home .content-section .movie-row { contain-intrinsic-size: auto var(--zf-shelf-ch, 340px); }
    .zf-home .content-section .movie-row.zf-rank-row { contain-intrinsic-size: auto var(--zf-rank-ch, 340px); }
}
/* These shelves already defer their DOM via IntersectionObserver. A generic
   340px skipped-row estimate would override the correctly-sized placeholder. */
.zf-home .studio-section .movie-row,
.zf-home .zf-studio-hub .movie-row {
    content-visibility: visible;
    contain-intrinsic-size: none;
}