/**
 * adaptive/desktop.css — @media from style.css (C.4).
 * 1:1 move. Overrides pages-adaptive-* не трогались в этом шаге.
 */

@media (max-width: 1280px) and (min-width: 901px) {
    .app-header {
        flex-wrap: wrap;
        row-gap: var(--space-2);
    }

    .app-header-start {
        flex: 1 1 auto;
        min-width: 0;
    }

    .nav-links {
        order: 3;
        flex: 1 1 100%;
        display: flex;
        flex-wrap: wrap;
        gap: 4px 10px;
        align-items: center;
        max-width: 100%;
    }

    .nav-links a {
        margin: 0;
        white-space: nowrap;
        font-size: 0.88rem;
        padding: 4px 2px;
    }

    .user-area {
        margin-left: auto;
        flex-wrap: nowrap;
    }
}

@media (min-width: 1920px) {
    .main-content {
        max-width: 1680px;
    }

    .game-grid {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    }
}

@media (min-width: 2560px) {
    .main-content {
        max-width: 1880px;
    }

    .discord-layout.discord-layout-wide {
        grid-template-columns: 72px 280px 1fr 280px;
    }
}

@media (min-width: 2560px) and (min-aspect-ratio: 21/9) {
    .main-content {
        max-width: 2100px;
    }

    .game-grid {
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    }
}