/* 扩展样式 */
@media (max-width: 768px) {
    .video-grid {
        grid-template-columns: 1fr;
    }

    section {
        padding: 1.5rem;
    }

    h1 {
        font-size: 1.5rem;
    }
}

.video-card a {
    display: block;
}

.video-card a:hover {
    color: #1a3d7a;
}

/* UI 风格变体 */
.ui-style-0 .header { background: linear-gradient(135deg, hsl(0, 50%, 45%) 0%, hsl(0, 50%, 30%) 100%); }
.ui-style-1 .header { background: linear-gradient(135deg, hsl(22.5, 50%, 45%) 0%, hsl(22.5, 50%, 30%) 100%); }
.ui-style-2 .header { background: linear-gradient(135deg, hsl(45, 50%, 45%) 0%, hsl(45, 50%, 30%) 100%); }
.ui-style-3 .header { background: linear-gradient(135deg, hsl(67.5, 50%, 45%) 0%, hsl(67.5, 50%, 30%) 100%); }
.ui-style-4 .header { background: linear-gradient(135deg, hsl(90, 50%, 45%) 0%, hsl(90, 50%, 30%) 100%); }
.ui-style-5 .header { background: linear-gradient(135deg, hsl(112.5, 50%, 45%) 0%, hsl(112.5, 50%, 30%) 100%); }
.ui-style-6 .header { background: linear-gradient(135deg, hsl(135, 50%, 45%) 0%, hsl(135, 50%, 30%) 100%); }
.ui-style-7 .header { background: linear-gradient(135deg, hsl(157.5, 50%, 45%) 0%, hsl(157.5, 50%, 30%) 100%); }
.ui-style-8 .header { background: linear-gradient(135deg, hsl(180, 50%, 45%) 0%, hsl(180, 50%, 30%) 100%); }
.ui-style-9 .header { background: linear-gradient(135deg, hsl(202.5, 50%, 45%) 0%, hsl(202.5, 50%, 30%) 100%); }
.ui-style-10 .header { background: linear-gradient(135deg, hsl(225, 50%, 45%) 0%, hsl(225, 50%, 30%) 100%); }
.ui-style-11 .header { background: linear-gradient(135deg, hsl(247.5, 50%, 45%) 0%, hsl(247.5, 50%, 30%) 100%); }
.ui-style-12 .header { background: linear-gradient(135deg, hsl(270, 50%, 45%) 0%, hsl(270, 50%, 30%) 100%); }
.ui-style-13 .header { background: linear-gradient(135deg, hsl(292.5, 50%, 45%) 0%, hsl(292.5, 50%, 30%) 100%); }
.ui-style-14 .header { background: linear-gradient(135deg, hsl(315, 50%, 45%) 0%, hsl(315, 50%, 30%) 100%); }
.ui-style-15 .header { background: linear-gradient(135deg, hsl(337.5, 50%, 45%) 0%, hsl(337.5, 50%, 30%) 100%); }
