/* One global mobile preference, scoped to video cards only. AJAX cards inherit it. */
@media (max-width: 767px) {
    .hstv-mobile-video-cols-1 .main-flex > .hstv-video-card {
        flex-basis: 100%;
    }
    .hstv-mobile-video-cols-2 .main-flex > .hstv-video-card {
        flex-basis: calc((100% - 20px) / 2);
    }
    .hstv-mobile-video-cols-1 .profile-saved-grid,
    .hstv-mobile-video-cols-1 .profile-video-grid {
        grid-template-columns: minmax(0, 1fr);
    }
    .hstv-mobile-video-cols-2 .profile-saved-grid,
    .hstv-mobile-video-cols-2 .profile-video-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .hstv-mobile-video-cols-2 .hstv-video-card .title,
    .hstv-mobile-video-cols-2 .hstv-video-card h3 {
        font-size: min(var(--card-title-size), 16px);
        overflow-wrap: anywhere;
    }
    .hstv-mobile-video-cols-2 .hstv-video-card .group,
    .hstv-mobile-video-cols-2 .hstv-video-card .profile-video-card-meta {
        flex-wrap: wrap;
        row-gap: 4px;
    }
    .hstv-mobile-video-cols-2 .hstv-video-card .group > time,
    .hstv-mobile-video-cols-2 .hstv-video-card .profile-video-card-meta > time {
        flex-basis: 100%;
        font-size: 12px;
    }
    .hstv-mobile-video-cols-2 .hstv-video-card .list {
        font-size: 12px;
        gap: 6px;
    }
    .hstv-mobile-video-cols-2 .hstv-video-card .duration,
    .hstv-mobile-video-cols-2 .hstv-video-card .profile-video-duration {
        font-size: 12px;
        padding: 3px 6px;
    }
}
