/* 响应式样式 */

/* 平板设备 */
@media (max-width: 768px) {
    .login-container {
        padding: 30px;
    }

    .stats-container {
        grid-template-columns: repeat(3, 1fr);
    }

    .stat-item {
        padding: 12px;
    }

    .stat-value {
        font-size: 18px;
    }
}

/* 手机设备 */
@media (max-width: 480px) {
    .login-container {
        padding: 24px;
        width: 95%;
    }

    .logo img {
        width: 48px;
        height: 48px;
    }

    .logo h1 {
        font-size: 20px;
    }

    .primary-btn, .secondary-btn {
        width: 100%;
    }

    #main-page {
        padding: 16px;
    }

    .logo-small img {
        width: 24px;
        height: 24px;
    }

    .logo-small h2 {
        font-size: 16px;
    }

    .stats-container {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .stat-item {
        padding: 10px;
    }

    .stat-icon {
        width: 24px;
        height: 24px;
    }

    .stat-value {
        font-size: 16px;
    }

    .video-info h3 {
        font-size: 14px;
    }

    .info-label, .info-value {
        font-size: 12px;
    }

    #history-page header h2 {
        font-size: 16px;
    }

    .history-title {
        font-size: 14px;
    }
}

/* 小型手机设备 */
@media (max-width: 320px) {
    .stats-container {
        grid-template-columns: repeat(2, 1fr);
    }
}