.af-mobile-close, .af-mobile-backdrop { display: none; }
@media (max-width: 991px) {
    .af-social-home .af-feed-container { grid-template-columns: minmax(0, 1fr); }
    .af-social-home .af-feed-main, .af-social-home .af-right-rail { min-width: 0; }
    .af-social-home .af-right-rail { grid-template-columns: minmax(0, 1fr); }
    .af-social-home .af-new-kids-grid { overflow-x: auto; }
    .af-profile-body .af-main-area { width: 100%; max-width: 100%; }
    [data-af-mobile-trigger] { cursor: pointer; }
    [data-af-mobile-trigger]:focus-visible, .af-mobile-close:focus-visible { outline: 3px solid var(--af-primary); outline-offset: 3px; }
    .af-left-rail[data-af-mobile-drawer] {
        display: flex;
        position: fixed;
        inset: 0 auto 0 0;
        width: min(86vw, 330px);
        height: 100vh;
        height: 100dvh;
        box-sizing: border-box;
        padding: 80px 16px 24px;
        background: var(--af-bg-canvas, var(--af-card, #fff));
        z-index: 1040;
        overflow-y: auto;
        overscroll-behavior: contain;
        transform: translateX(-100%);
        visibility: hidden;
        transition: transform .25s ease, visibility .25s;
    }
    .af-left-rail[data-af-mobile-drawer].open {
        transform: translateX(0);
        visibility: visible;
        box-shadow: 4px 0 24px rgb(0 0 0 / 15%);
    }
    .af-mobile-close {
        display: block;
        align-self: flex-end;
        flex-shrink: 0;
        width: 44px;
        height: 44px;
        border: 0;
        border-radius: 10px;
        background: var(--af-card, #fff);
        color: var(--af-primary);
        font-size: 22px;
        cursor: pointer;
    }
    .af-mobile-backdrop:not([hidden]) {
        display: block;
        position: fixed;
        inset: 0;
        background: rgb(15 23 42 / 45%);
        z-index: 1030;
    }
    .af-mobile-nav-open .af-feed-header, .af-mobile-nav-open .af-navbar { z-index: 1041; }
    .af-mobile-nav-open { overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) {
    .af-left-rail[data-af-mobile-drawer] { transition: none; }
}
@media (max-width: 576px) {
    .af-profile-body .af-user-pill-name, .af-profile-body .af-user-pill-points { display: none; }
    .af-profile-body .af-nav-right { gap: 8px; }
    .af-profile-body .af-navbar-inner { padding-inline: 16px; }
    .af-social-home .af-header-right { gap: 8px; }
    .af-social-home .af-chip-name { max-width: 60px; overflow: hidden; text-overflow: ellipsis; }
}