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

@media (max-width: 900px) {
    .detail-top {
        grid-template-columns: 1fr;
    }

    .detail-sidebar-sticky {
        position: static;
    }

    .profile-header-card {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .profile-avatar-lg {
        margin: 0 auto;
    }

    .profile-wallets {
        flex-direction: row;
        justify-content: center;
    }

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

/* @bp-window — 800px */
@media (max-width: 800px) {
    .req-cols {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .detail-layout {
        grid-template-columns: 1fr;
    }

    .library-layout {
        grid-template-columns: 1fr;
    }

    .library-sidebar {
        max-height: 240px;
        border-right: none;
        border-bottom: 1px solid var(--va-border, #2a475e);
    }
}

@media (max-width: 768px) {
    body:not(.mobile-layout) .app-header {
        flex-direction: column;
        gap: 10px;
    }

    .nav-links a {
        margin: 0 8px;
        font-size: 0.9rem;
    }

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

    .library-row {
        flex-wrap: wrap;
    }

    .friends-layout {
        grid-template-columns: 1fr;
    }

    .admin-stats {
        grid-template-columns: 1fr;
    }

    .friends-popup {
        right: 8px;
        left: 8px;
        width: auto;
        max-width: none;
    }
}

@media (max-width: 900px) {
    .profile-bg-split-grids {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .avatar-editor-body {
        flex-direction: column;
        align-items: center;
    }

    .avatar-editor-canvas-wrapper {
        width: min(300px, 100%);
        height: min(300px, 100vw);
    }
}

@media (max-width: 900px) {
    .voice-settings-grid--devices,
    .voice-settings-row-2,
    .voice-processing-grid {
        grid-template-columns: 1fr;
    }
}

/* @bp-window — 800px */
@media (max-width: 800px) {
    .market-sell-layout {
        grid-template-columns: 1fr;
    }
}

/* @bp-window — 800px */
@media (max-width: 800px) {
    .dl-hero-card, .dl-rich-grid, .dl-roadmap { grid-template-columns: 1fr; }
    .dl-rich-block--wide { grid-column: auto; }
}

@media (max-width: 900px) {
    .inv-toolbar {
        grid-template-columns: 1fr;
    }

    .steam-inventory-cats {
        position: static;
        max-height: none;
        overflow: visible;
    }
}

@media (max-width: 900px) {
    .nav-toggle {
        display: inline-flex;
    }

    .app-header {
        padding: 10px 14px;
        position: relative;
    }

    .nav-links {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        flex-direction: column;
        background: var(--va-bg-elevated, #171a21);
        border-bottom: 1px solid var(--va-border, #2a475e);
        padding: 10px 14px 14px;
        z-index: var(--z-overlay-top);
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
        max-height: calc(100vh - 64px);
        overflow-y: auto;
    }

    body.nav-open .nav-links {
        display: flex;
    }

    .nav-links a {
        margin: 0;
        padding: 10px 4px;
        border-bottom: 1px solid rgba(42, 71, 94, 0.45);
    }

    .nav-links a.active {
        border-bottom-color: var(--va-accent, #66c0f4);
    }

    .user-area {
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: var(--space-2);
        margin-left: auto;
    }

    #user-name {
        display: none;
    }

    .game-grid {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: var(--space-3);
    }

    .steam-main-tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .steam-main-tab {
        flex: 0 0 auto;
    }

    .friends-fab {
        bottom: 12px;
        right: 12px;
        left: auto;
        font-size: 0.85rem;
        padding: 10px 14px;
    }

    .friends-popup {
        width: calc(100vw - 16px);
        max-width: none;
        right: 8px;
        left: 8px;
    }

    .voltark-voice-bar {
        min-width: 0;
        width: calc(100vw - 16px);
    }

    .modal-overlay .modal,
    .steam-profile-modal-full {
        width: calc(100vw - 16px);
        max-width: none;
        max-height: calc(100vh - 16px);
    }

    .chat-msg {
        max-width: 85% !important;
    }
}

@media (max-width: 768px) {
    .community-page[data-community-style="vk"] .community-vk-back {
        display: inline-flex;
    }
}

@media (max-width: 768px) {
    .community-page[data-community-style="vk"].vk-chat-active .channels-bar {
        display: none !important;
    }

    .community-page[data-community-style="vk"] .discord-layout.community-layout-root {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas:
            "vk-toolbar"
            "vk-list"
            "vk-chat";
    }

    .community-page[data-community-style="vk"]:not(.vk-show-guilds) .discord-layout.community-layout-root {
        grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas:
            "vk-list"
            "vk-chat";
    }

    .community-page[data-community-style="vk"] .community-chat-area {
        grid-area: vk-chat;
    }

    .community-page[data-community-style="vk"] .channels-bar {
        grid-area: vk-list;
        max-height: none;
        border-right: none;
        border-bottom: 1px solid #d3d9de;
    }
}

@media (max-width: 900px) {
    .community-page.community-compact {
        padding-left: 0;
        padding-right: 0;
    }

    .main-content:has(.community-page.community-compact) {
        padding-left: var(--space-3);
        padding-right: var(--space-3);
    }
}

@media (max-width: 900px) {
    .store-hero-slide {
        grid-template-columns: 1fr;
    }

    .store-hero-slide-panel {
        background: linear-gradient(0deg, rgba(15, 22, 32, 0.95), rgba(15, 22, 32, 0.55));
    }

    .store-tabs-layout {
        grid-template-columns: 1fr;
    }

    .store-tab-preview {
        position: static;
    }
}