/* 响应式设计 - 平板设备 */
@media (max-width: 1200px) {
    nav ul {
        gap: 15px;
    }
    
    nav a {
        font-size: 0.95rem;
        padding: 6px 10px;
    }
}

@media (max-width: 992px) {
    .hero h2 {
        font-size: 2.8rem; /* 缩小标题字体 */
    }
    
    #real-time {
        font-size: 2.3rem; /* 缩小时间字体 */
    }
    
    nav ul {
        gap: 10px;
    }
    
    nav a {
        font-size: 0.9rem;
        padding: 5px 8px;
    }
}

/* 响应式设计 - 移动设备 */
@media (max-width: 768px) {
    .nav-container {
        flex-direction: column; /* 垂直布局 */
        gap: 20px;
    }
    
    nav ul {
        flex-wrap: wrap; /* 允许换行 */
        justify-content: center; /* 居中 */
        gap: 10px; /* 减小间距 */
    }
    
    .hero h2 {
        font-size: 2.2rem;
    }
    
    #real-time {
        font-size: 1.8rem;
    }
    
    .section-title {
        font-size: 1.8rem;
    }
    
    .settings-grid {
        grid-template-columns: 1fr; /* 单列布局 */
    }
    
    .footer-content {
        flex-direction: column; /* 垂直布局 */
        text-align: center;
    }
}

/* 响应式设计 - 小屏移动设备 */
@media (max-width: 480px) {
    .hero h2 {
        font-size: 1.8rem;
    }
    
    #real-time {
        font-size: 1.5rem;
    }
    
    .card {
        padding: 20px; /* 减小内边距 */
    }
    
    .rule-list li {
        flex-direction: column; /* 垂直布局 */
        gap: 5px; /* 减小间距 */
    }
    
    .vip-table {
        font-size: 0.85rem;
    }
    
    .vip-table th, .vip-table td {
        padding: 8px 5px;
    }
}