@media (max-width: 900px) {
    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    .site-header {
        width: 100%;
        min-width: 0;
        padding-inline: 12px;
        gap: 8px;
    }

    .site-header .brand {
        min-width: 0;
        flex: 0 1 auto;
    }

    .site-header .brand img {
        width: clamp(126px, 34vw, 154px);
        max-width: 100%;
    }

    .site-header .header-actions {
        min-width: 0;
        margin-left: auto;
        gap: 6px;
    }

    .site-header .hide-mobile,
    .site-header .language {
        display: none !important;
    }

    .site-header .sell-button {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        flex: 0 0 62px;
        width: 62px;
        min-width: 62px;
        height: 38px;
        margin-left: 0;
        padding: 0 10px;
        white-space: nowrap;
    }

    .site-header .round-button,
    .site-header .profile-button,
    .site-header .account-status,
    .site-header .header-logout button {
        flex: 0 0 38px;
        width: 38px;
        height: 38px;
    }

    .site-header .header-signin {
        height: 38px;
        padding-inline: 11px;
        white-space: nowrap;
        line-height: 1;
    }

    .search-hero {
        width: 100%;
        padding-inline: 15px;
    }

    .hero-search {
        width: min(100%, 550px);
        min-width: 0;
    }

    .location-select,
    .search-field,
    .search-field input {
        min-width: 0;
    }

    .market-shell {
        width: 100%;
        max-width: 100%;
        margin-top: 18px;
        padding-inline: 14px;
    }

    .market-content {
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    .quick-links {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        width: 100%;
        overflow: visible;
        margin-bottom: 18px;
    }

    .quick-links a {
        width: 100%;
        min-width: 0;
        height: 42px;
        padding-inline: 8px;
        text-align: center;
        line-height: 1.15;
    }

    .recommendations h2 {
        margin-top: 0;
    }

    .recommendation-strip {
        width: 100%;
        max-width: 100%;
        padding-bottom: 5px;
        scroll-snap-type: x proximity;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
    }

    .recommendation-strip a {
        width: calc((100% - 16px) / 3);
        scroll-snap-align: start;
    }

    .recommendation-strip img {
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
    }

    .mobile-category-grid {
        width: 100%;
        max-width: 560px;
        margin: 24px auto;
    }

    .listing-grid {
        max-width: 100vw;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
    }

    .listing-grid > .listing-card {
        flex: 0 0 calc((100vw - 36px) / 2);
        min-width: 0;
    }

    .listing-grid.compact-grid > .listing-card {
        flex-basis: calc((100vw - 44px) / 2.35);
    }

    .mobile-nav {
        width: 100%;
        max-width: 100vw;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        padding-bottom: env(safe-area-inset-bottom);
    }

    .mobile-nav.has-five-items {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .mobile-nav a,
    .mobile-nav button {
        min-width: 0;
        overflow: hidden;
        white-space: nowrap;
    }
}

@media (max-width: 390px) {
    .site-header {
        padding-inline: 9px;
    }

    .site-header .brand img {
        width: 118px;
    }

    .site-header .round-button {
        display: none;
    }

    .site-header .sell-button {
        flex-basis: 56px;
        width: 56px;
        min-width: 56px;
        padding-inline: 7px;
    }

    .search-hero {
        height: 215px;
        padding-bottom: 22px;
    }

    .hero-search {
        grid-template-columns: 1fr;
        display: grid;
    }

    .location-select > button {
        width: 100%;
    }

    .location-menu {
        width: 100%;
    }

    .quick-links {
        gap: 7px;
    }

    .quick-links a {
        font-size: 10px;
    }

    .recommendation-strip a {
        width: calc((100% - 8px) / 2);
    }

    .listing-grid > .listing-card {
        flex-basis: calc((100vw - 34px) / 2);
    }

    .mobile-category-grid {
        gap-inline: 5px;
    }
}