/* v3 页面移动端布局。仅调整尺寸、排列和溢出，不覆盖现有配色。 */
@media (max-width: 767px) {
    #ad-div,
    .ad-div,
    #ad2-div,
    .ad2-div {
        display: none !important;
    }

    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    main,
    main.mleft {
        width: 100%;
        margin-left: 0;
    }

    headnav {
        display: block;
        padding: 0 56px 0 12px;
    }

    headnav > ul {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    headnav > ul::-webkit-scrollbar,
    .ad-div::-webkit-scrollbar,
    .ad2-div::-webkit-scrollbar {
        display: none;
    }

    headnav > ul > li {
        flex: 0 0 auto;
        float: none;
    }

    headnav > ul > li > a {
        padding: 12px 10px;
        white-space: nowrap;
    }

    .ad-div,
    .ad2-div {
        height: auto !important;
        padding: 0 12px;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 10px;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .ad-item,
    .ad2-item {
        flex: 0 0 84%;
        height: 88px;
        scroll-snap-align: start;
    }

    .ad-item a,
    .ad2-item a {
        display: block;
        width: 100%;
        height: 100%;
    }

    .ad-item img,
    .ad2-item img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .mgoClear,
    .mgoClear2 {
        height: 0;
        margin-top: 16px;
    }

    .menu-card-container {
        margin-top: 20px;
        padding: 0 12px;
    }

    .menu-header {
        margin-bottom: 14px;
    }

    .cards-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .cards-grid > a {
        display: block;
        min-width: 0;
    }

    .card {
        width: 100%;
        height: 76px;
        min-width: 0;
        padding: 10px;
    }

    .card img {
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
    }

    .card-info {
        min-width: 0;
        margin-left: 8px;
        overflow: hidden;
    }

    .card-info h3,
    .card-info p {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .paging {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 6px;
        max-width: 100%;
        padding: 20px 12px 0;
        overflow-wrap: anywhere;
    }

    .header-2 {
        display: none;
        margin-left: 0;
    }

    .container {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        padding: 24px 12px;
    }

    .breadcrumb {
        display: flex;
        flex-wrap: wrap;
        gap: 6px 0;
        margin-bottom: 20px;
        overflow-wrap: anywhere;
    }

    .product-preview {
        flex-direction: column;
        gap: 20px;
        margin-bottom: 32px;
    }

    .product-info {
        order: -1;
        align-items: center;
        text-align: center;
    }

    .product-title {
        font-size: 1.65rem;
        line-height: 1.3;
    }

    .product-desc {
        max-width: 100%;
        margin-bottom: 20px;
        font-size: 1rem;
    }

    .thumbnail-section {
        width: min(100%, 300px);
        height: 240px;
        margin: 0 auto;
    }

    .thumbnail-section img {
        width: 100px;
        height: 100px;
        margin: 70px auto;
    }

    #p-left,
    #p-right {
        float: none;
        width: 100%;
    }

    #p-right {
        display: none;
        padding: 0;
    }

    #p-left .detail-title,
    #p-left .related-section {
        display: none;
    }

    .detail-section {
        margin-bottom: 32px;
        padding: 12px;
        overflow-wrap: anywhere;
    }

    .detail-section img,
    .detail-content img {
        max-width: 100%;
        height: auto;
    }

    .detail-section iframe,
    .detail-section video,
    .detail-content iframe,
    .detail-content video {
        max-width: 100%;
    }

    .detail-section table,
    .detail-content table,
    .detail-section pre,
    .detail-content pre {
        display: block;
        max-width: 100%;
        overflow-x: auto;
    }

    .detail-title {
        font-size: 1.45rem;
    }

    .related-section {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }

    .card-content {
        padding: 14px;
    }

    .right-box {
        width: 100%;
        height: auto;
        margin-top: 20px;
    }

    .right-content {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .hot-item {
        width: 100%;
        min-width: 0;
        margin: 0;
    }

    .right-info {
        min-width: 0;
    }

    .right-info p {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .footer {
        margin-top: 40px;
        padding: 24px 12px;
    }

    .friend-links {
        gap: 10px;
    }
}