/* Explicit image frames also work on Chromium 68 (without aspect-ratio/:has). */
.catalog-grid{align-items:start}
.catalog-grid .media-tile{min-width:0;display:flex;flex-direction:column;align-self:start;gap:.5rem}
.catalog-grid .media-card{display:flex;flex-direction:column;flex:0 0 auto;width:100%;min-width:0;height:auto;align-items:stretch;justify-content:flex-start}
.catalog-grid .poster{position:relative;display:block;flex:0 0 auto;width:100%;height:0;padding-top:150%;aspect-ratio:auto}
.catalog-grid .poster:before{display:none!important}
.catalog-grid.live-grid .poster{padding-top:56.25%}
.catalog-grid .poster>img{position:absolute;top:0;left:0;right:0;bottom:0;display:block;width:100%;height:100%;object-fit:cover}
.catalog-grid .poster.poster-live>img{object-fit:contain;padding:1.5rem}
.catalog-grid .poster-fallback{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;padding:1.25rem;font-size:1.2rem;line-height:1.35;overflow:hidden}
.catalog-grid .poster.image-loaded .poster-fallback{visibility:hidden}
.catalog-grid .card__body{display:flex;flex-direction:column;flex:0 0 auto;justify-content:flex-start;width:100%;height:7rem;min-height:7rem;padding:1rem;gap:.4rem;overflow:hidden}
.catalog-grid .card-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;flex:0 0 auto;height:2.7em;max-height:2.7em;font-size:1.05rem;line-height:1.35;white-space:normal;overflow:hidden;overflow-wrap:break-word}
.catalog-grid .card-meta{display:block;flex:0 0 auto;height:1.5em;line-height:1.5;font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.catalog-grid .favorite-button{flex:0 0 auto;display:block;width:100%;height:3rem;min-height:3rem;max-height:3rem;padding:.5rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.catalog-grid .play-on-hover{top:50%;left:50%;margin-top:-24px;margin-left:-24px}
.tv-mode .catalog-grid .media-card:focus{border-color:#62b2ff;box-shadow:none}
@media(min-width:1024px){.tv-mode .catalog-grid .card-title{font-size:1.15rem}.tv-mode .catalog-grid .card-meta{font-size:.95rem}}

.epg-channel{min-height:8rem;align-items:stretch}
.epg-channel>button{min-height:8rem;overflow:hidden;overflow-wrap:break-word}
.epg-programs{min-width:0;align-items:stretch}
.epg-program{height:8rem;min-height:8rem;overflow:hidden}
.epg-program strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-height:1.35;max-height:4.05em;overflow:hidden;overflow-wrap:break-word}

/* Chromium 68 also applies align-items to the anonymous button container. */
.catalog-grid .poster>img{opacity:0}
.catalog-grid .poster.image-loaded>img{opacity:1}
.poster-fallback{background:#10233a url("assets/brand/artwork-placeholder.svg") center/cover no-repeat}
.catalog-grid .poster-fallback{flex-direction:column;justify-content:flex-end;padding:2rem 1rem;color:#c4d9ee;text-shadow:0 2px 8px #000;font-size:1.05rem}
.catalog-grid .poster.poster-live .poster-fallback{padding:1rem;font-size:1rem}