/* ============================================
   响应式断点系统
   ============================================ */

/* 平板 */
@media (max-width: 1024px) {
    .card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* 移动横屏 / 小平板 — 侧边栏折叠为顶部水平导航 */
@media (max-width: 768px) {
    .app-shell {
        grid-template-columns: 1fr;
    }

    .sidebar {
        position: static;
        height: auto;
        border-right: none;
        border-bottom: 1px solid var(--border-base);
        padding: var(--space-lg);
    }

    .brand {
        margin-bottom: var(--space-lg);
    }

    .nav-list {
        flex-direction: row;
        overflow-x: auto;
        gap: var(--space-sm);
        padding-bottom: var(--space-sm);
        -webkit-overflow-scrolling: touch;
    }

    .nav-link {
        white-space: nowrap;
        flex-shrink: 0;
    }

    .app-main {
        padding: var(--space-lg);
    }

    .card-grid,
    .form-grid {
        grid-template-columns: 1fr;
    }

    .inline-actions {
        flex-direction: column;
    }

    .pagination-bar {
        align-items: stretch;
    }

    .pagination-nav {
        width: 100%;
    }

    .checkbox-grid {
        grid-template-columns: 1fr 1fr;
    }

    .asset-upload-panel {
        grid-template-columns: 1fr;
    }

    .asset-section,
    .asset-upload-panel {
        padding: var(--space-lg);
    }

    .asset-upload-trigger {
        width: 100%;
    }

    .asset-section-header {
        flex-direction: column;
    }

    .detail-grid {
        grid-template-columns: 1fr;
    }
}

/* 移动竖屏 */
@media (max-width: 480px) {
    .app-main {
        padding: var(--space-md);
    }

    .card,
    .stat-card {
        padding: var(--space-lg);
    }

    .login-card {
        padding: var(--space-lg);
    }

    .page-hero h1 {
        font-size: 24px;
    }

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

    .data-table th,
    .data-table td {
        padding: var(--space-sm) var(--space-md);
        font-size: 13px;
    }

    .checkbox-grid {
        grid-template-columns: 1fr;
    }

    .asset-grid {
        grid-template-columns: 1fr;
    }

    .asset-card .asset-thumb {
        height: 180px;
    }
}

/* 打印 */
@media print {
    .sidebar,
    .inline-actions,
    .btn {
        display: none !important;
    }

    .app-shell {
        grid-template-columns: 1fr;
    }

    .card {
        box-shadow: none;
        border: 1px solid #ddd;
        backdrop-filter: none;
    }

    body {
        background: white;
        color: black;
        background-image: none;
    }
}