/* Desktop sections share one grid instead of waiting below a tall left column. */
@media (min-width: 901px) {
    .homepage-layout {
        grid-template-columns: minmax(0, 1fr) 320px;
        grid-template-areas:
            "live breaking"
            "engagement breaking"
            "playlist playlist"
            "live-ad live-ad"
            "reports reports"
            "popular popular"
            "breaking-ad breaking-ad";
        gap: 16px 20px;
        align-items: start;
    }
    .homepage-layout > .content,
    .homepage-layout > aside {
        display: contents;
    }
    .homepage-layout #live { grid-area: live; }
    .homepage-layout .engagement-live {
        grid-area: engagement;
        background: #fff;
        margin-top: -16px;
        padding-bottom: 8px;
    }
    .homepage-layout .breaking-spotlight,
    .homepage-layout .channel-welcome {
        grid-area: breaking;
        margin: 0;
        min-height: 0;
        align-self: stretch;
    }
    .homepage-layout .breaking-spotlight {
        display: flex;
        flex-direction: column;
    }
    .homepage-layout .spotlight-stories {
        flex: 1;
        display: flex;
    }
    .homepage-layout .spotlight-story:not([hidden]) {
        flex: 1;
        min-height: 0;
        padding: 16px 18px;
    }
    .homepage-layout .breaking-spotlight h3 {
        font-size: 22px;
        line-height: 1.45;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
        overflow: hidden;
    }
    .homepage-layout .breaking-spotlight p {
        font-size: 14px;
        line-height: 1.6;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
    }
    .homepage-layout .spotlight-controls { margin-top: auto; }
    .homepage-layout .news-playlist { grid-area: playlist; }
    .homepage-layout [data-ad-slot="after_live"] { grid-area: live-ad; }
    .homepage-layout [data-ad-slot="after_breaking"] { grid-area: breaking-ad; }
    .homepage-layout .homepage-video-reports {
        grid-area: reports;
        background: #fff;
        padding: 16px;
    }
    .homepage-layout .homepage-video-reports .news-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 20px;
    }
    .homepage-layout .popular {
        grid-area: popular;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
    .homepage-layout .popular h2 { grid-column: 1 / -1; }
    .homepage-layout .popular article {
        min-width: 0;
        border-right: 1px solid var(--line);
        gap: 8px;
    }
    .homepage-layout .popular article:last-child { border-right: 0; }
    .homepage-layout .popular article b { font-size: 22px; }
    .homepage-layout .popular article p {
        font-size: 14px;
        line-height: 1.5;
        overflow-wrap: anywhere;
    }
}