:root {
    --purchase-accent: #ef2f4f;
    --purchase-accent-dark: #d92141;
    --purchase-accent-soft: #fff0f3;
    --purchase-ink: #251b1f;
    --purchase-muted: #7b7075;
    --purchase-line: #eadfe3;
    --purchase-surface: #ffffff;
    --purchase-canvas: #f5f5f5;
    --purchase-success: #168568;
    --purchase-radius: 14px;
    --purchase-shadow: 0 18px 50px rgba(77, 35, 48, .11);
}

/* Prevent iOS browsers from auto-zooming focused form fields and leaving the
   storefront horizontally panned after login, search, or checkout input. */
@media (max-width: 768px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
    select,
    textarea {
        font-size: 16px !important;
    }
}

* { box-sizing: border-box; }
html.purchase-restoring-scroll,
html.purchase-restoring-scroll body,
html.purchase-restoring-scroll body * { overflow-anchor: none !important; }
body.xsh-body {
    min-height: 100dvh;
    margin: 0;
    color: var(--purchase-ink);
    background-color: var(--purchase-canvas) !important;
    font-family: "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
}
body.xsh-body::before {
    content: none;
}
a, button, input { font: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible {
    outline: 3px solid rgba(239, 47, 79, .2);
    outline-offset: 2px;
}

/* Existing header, recomposed into a calm store masthead. */
.top {
    width: 100% !important;
    height: 38px !important;
    min-width: 0 !important;
    padding: 0 max(24px, calc((100vw - 1600px) / 2)) !important;
    border: 0 !important;
    background: rgba(255, 255, 255, .92) !important;
    color: var(--purchase-muted) !important;
    opacity: 1 !important;
    line-height: 38px !important;
}
.top .right { cursor: pointer; font-size: 12px !important; }
.purchase-header-shell {
    width: min(1800px, calc(100% - 48px));
    margin: 18px auto 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(234, 223, 227, .92);
    border-radius: var(--purchase-radius);
    background: #fff;
    box-shadow: var(--purchase-shadow);
    opacity: 1 !important;
}
.banner {
    order: 1;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 84px;
    margin: 0 !important;
    padding: 22px 26px 16px !important;
    display: flex;
    align-items: center;
    gap: 18px;
    border: 0;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none;
    opacity: 1 !important;
}
.banner .xsh-logo {
    width: 64px !important;
    height: 64px !important;
    margin: 0 !important;
    object-fit: contain;
    border-radius: 12px;
}
.banner .seller_content {
    flex: 0 1 auto;
    width: auto;
    min-width: 150px;
    max-width: min(28vw, 420px);
    margin: 0 !important;
    overflow: hidden;
}
.banner .seller_name {
    display: block;
    width: 100%;
    height: auto !important;
    padding: 0 !important;
    color: var(--purchase-ink) !important;
    background: transparent !important;
    font-size: 20px !important;
    font-weight: 750;
    line-height: 1.35 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.banner .gd {
    position: static !important;
    float: none !important;
    display: block !important;
    width: 100%;
    min-width: 0;
    flex: 1 1 320px;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 16px;
    border-radius: 10px;
    color: #6d5e64;
    background: #fff6f8;
    line-height: 44px;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    transform: none;
}
.banner .gd .spp {
    position: static !important;
    display: inline-block !important;
    min-width: 100%;
    padding-left: 100%;
    box-sizing: content-box;
    animation: purchase-welcome-marquee 14s linear infinite;
}
.banner .gd:hover .spp { animation-play-state: paused; }
@keyframes purchase-welcome-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-100%); }
}
.banner > div:not(.seller_content):not(.gd):not(.clear) {
    float: none !important;
    flex: 0 0 auto;
    margin: 0 !important;
}
+
/* Mobile purchase redesign */
.mobile-store-header { display: none; }

@media (max-width: 768px) {
    html { background: #f5f5f5; }
    body.mobile-purchase-body {
        min-height: 100dvh;
        padding-bottom: calc(92px + env(safe-area-inset-bottom));
        background: #f5f5f5 !important;
        background-image: none !important;
    }

    .mobile-store-header {
        display: block;
        margin: 0;
        padding: 16px 14px 12px;
        border-bottom: 1px solid #e8e1e4;
        background: #fff;
    }
    .mobile-store-heading {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 12px;
    }
    .mobile-store-title { min-width: 0; flex: 1; }
    .mobile-store-title h1 {
        margin: 0;
        overflow: hidden;
        color: var(--purchase-ink);
        font-size: 20px;
        font-weight: 750;
        line-height: 1.35;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .mobile-store-title p {
        margin: 5px 0 0;
        overflow: hidden;
        color: var(--purchase-muted);
        font-size: 12px;
        line-height: 18px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .mobile-buyer-avatar {
        flex: 0 0 42px;
        width: 42px;
        height: 42px;
        padding: 0;
        overflow: hidden;
        border: 1px solid #e5dce0;
        border-radius: 50%;
        background: #fff;
    }
    .mobile-buyer-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }

    .mobile-store-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        margin-top: 14px;
    }
    .mobile-store-actions button {
        min-height: 42px;
        padding: 0 12px;
        border: 1px solid #e8dce0;
        border-radius: 10px;
        color: #4d4146;
        background: #fff;
        font-size: 13px;
        font-weight: 650;
    }
    .mobile-store-actions #protocol { border-color: #b7daf7; color: #1377ba; background: #f4faff; }
    .mobile-store-actions #notice { border-color: #ffd3c8; color: #d84c2d; background: #fff8f5; }
    .mobile-store-actions .toLogin { border-color: #b9dfc5; color: #168044; background: #f6fcf8; }
    .mobile-store-actions .toRegister { border-color: #26a653; color: #fff; background: #26a653; }
    .mobile-store-actions .mobile-buyer-center { grid-column: 1 / -1; border-color: #b9dfc5; color: #168044; background: #f6fcf8; }

    .mobile-account-summary {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        margin-top: 10px;
    }
    .mobile-account-summary > span {
        padding: 9px 10px;
        border-radius: 9px;
        color: #657080;
        background: #f2f6fb;
        font-size: 11px;
    }
    .mobile-account-summary > span:nth-child(2) { color: #327153; background: #eef9f2; }
    .mobile-account-summary strong { display: block; margin-top: 2px; font-size: 13px; }
    .mobile-account-summary .vipInfo {
        grid-column: 1 / -1;
        min-height: 36px;
        border: 0;
        border-radius: 9px;
        color: #fff;
        background: #ff5b35;
        font-size: 12px;
        font-weight: 700;
    }

    .mobile-more-services { margin-top: 10px; }
    .mobile-more-services summary {
        min-height: 40px;
        padding: 0 12px;
        border: 1px solid #e8e1e4;
        border-radius: 10px;
        color: #61555a;
        background: #fafafa;
        font-size: 13px;
        line-height: 40px;
        text-align: center;
        cursor: pointer;
        list-style-position: inside;
    }
    .mobile-more-services nav {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
        padding-top: 8px;
    }
    .mobile-more-services a,
    .mobile-more-services nav button {
        display: flex;
        min-width: 0;
        min-height: 40px;
        padding: 6px 8px;
        align-items: center;
        justify-content: center;
        border: 1px solid #e8e1e4;
        border-radius: 9px;
        color: #5f5358;
        background: #fff;
        font-size: 12px;
        text-align: center;
    }

    .purchase-catalog--mobile {
        width: 100% !important;
        padding: 10px 10px 18px !important;
    }
    .purchase-catalog--mobile .products-panel {
        padding: 0;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none;
    }
    .purchase-catalog--mobile .products-toolbar {
        position: sticky;
        top: 0;
        z-index: 35;
        gap: 10px;
        margin: 0 0 10px;
        padding: 13px;
        border: 1px solid #e8e1e4;
        border-radius: 13px;
        background: rgba(255, 255, 255, .98);
        box-shadow: 0 8px 24px rgba(64, 40, 48, .08);
    }
    .purchase-catalog--mobile .products-toolbar h2 {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 8px;
        font-size: 18px;
    }
    .purchase-catalog--mobile .products-toolbar h2 small { white-space: nowrap; }
    .purchase-catalog--mobile .products-search { grid-template-columns: minmax(0, 1fr) 68px; gap: 7px; }
    .purchase-catalog--mobile .products-search input,
    .purchase-catalog--mobile .products-search button { height: 42px; }

    .purchase-catalog--mobile .category-tabs {
        margin: 0 0 10px !important;
        padding: 0 !important;
        overflow: visible !important;
    }
    .purchase-catalog--mobile .category-tabs ul {
        display: grid !important;
        width: 100%;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 7px;
        padding: 0 !important;
    }
    .purchase-catalog--mobile .category-tabs ul li {
        width: 100% !important;
        min-height: 40px;
        padding: 9px 8px !important;
        border-color: #e2d8dc !important;
        background: #fff !important;
        white-space: normal;
    }
    .purchase-catalog--mobile .category-tabs ul li.select {
        border-color: #ef9eae !important;
        color: var(--purchase-accent-dark) !important;
        background: #fff0f3 !important;
    }

    .purchase-catalog--mobile .goods #LAY_demo1 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 8px;
        grid-auto-flow: row dense;
        gap: 8px;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li {
        width: 100% !important;
        min-height: 0;
        max-height: none !important;
        padding: 0 !important;
        border-radius: 12px !important;
        background: #fff !important;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li.has-image {
        grid-row: span 16;
        height: 248px !important;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li.no-image {
        grid-row: span 9;
        height: 136px !important;
        justify-content: stretch;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li .goods-info {
        display: flex;
        min-height: 0;
        padding: 9px 10px 10px;
        flex: 1;
        flex-direction: column;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li .goods-bottom {
        display: flex;
        margin-top: auto;
        align-items: flex-end;
        justify-content: space-between;
        gap: 6px;
    }
    .purchase-catalog--mobile .goods-thumb { flex: 0 0 auto; aspect-ratio: 4 / 3; }
    .purchase-catalog--mobile .no-image .goods-thumb { display: none; }
    .purchase-catalog--mobile .goods-thumb img { width: 100%; height: 100%; object-fit: cover; }
    .purchase-catalog--mobile .goods-zoom {
        right: 8px;
        bottom: 8px;
        display: grid;
        width: 34px;
        height: 34px;
    }
    .purchase-catalog--mobile .goods-zoom svg { width: 17px; height: 17px; }
    .purchase-catalog--mobile .goods-name {
        display: -webkit-box;
        flex: 0 0 40px;
        height: 40px !important;
        margin: 0 0 6px !important;
        overflow: hidden;
        font-size: 13px !important;
        line-height: 20px !important;
        text-overflow: ellipsis;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
    .purchase-catalog--mobile .goods-price { margin: 0 !important; font-size: 17px !important; }
    .purchase-catalog--mobile .goods-meta {
        margin: 0;
        align-items: flex-end;
        flex: 1;
        flex-direction: column;
        justify-content: flex-end;
    }
    .purchase-catalog--mobile .goods-badges { align-self: flex-end; }
    .purchase-catalog--mobile .goods .stock { align-self: flex-end; font-size: 10px; }
    .purchase-catalog--mobile .no-image .goods-name { flex-basis: 40px; }
    .purchase-catalog--mobile .goods-load-actions { padding-top: 14px; }

    .purchase-catalog--mobile .goods #LAY_demo1 > li.goods-inline-slot {
        grid-column: 1 / -1;
        height: auto !important;
    }
    .purchase-catalog--mobile .goods-inline-detail { gap: 8px; }
    .purchase-catalog--mobile .desc,
    .purchase-catalog--mobile .pick_box {
        margin-top: 0 !important;
        padding: 14px !important;
        border-radius: 12px !important;
        background: #fff !important;
    }
    .purchase-catalog--mobile .pick-pagination { align-items: stretch; flex-wrap: wrap; }
    .purchase-catalog--mobile .pick-pagination button { flex: 1; min-width: 88px; }
    .purchase-catalog--mobile .pick-desc { flex: 0 0 100%; font-size: 12px; }
    .purchase-catalog--mobile .pick-search-row { margin-top: 8px; }

    .mobile-order-summary {
        left: 8px;
        right: 8px;
        bottom: calc(8px + env(safe-area-inset-bottom));
        min-height: 70px;
        padding: 10px 112px 10px 12px;
        border-radius: 14px;
        background: #fff;
    }
    .mobile-summary-copy { min-width: 0; }
    .mobile-summary-copy > span {
        display: block;
        color: var(--purchase-muted);
        font-size: 10px;
        line-height: 14px;
    }
    .mobile-summary-copy strong {
        display: block;
        overflow: hidden;
        color: #40343a;
        font-size: 13px;
        line-height: 20px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .mobile-summary-copy b {
        display: block;
        color: var(--purchase-accent-dark);
        font-size: 15px;
        line-height: 18px;
    }
    .mobile-checkout-trigger { top: 12px; height: 46px; }

    body.mobile-checkout-open { overflow: hidden; }
    .checkout-panel--mobile {
        display: none;
        max-height: 88dvh;
        padding: 0 14px calc(14px + env(safe-area-inset-bottom)) !important;
        overscroll-behavior: contain;
        border-radius: 20px 20px 0 0 !important;
    }
    body.mobile-checkout-open .checkout-panel--mobile { display: block; }
    .checkout-panel--mobile .checkout-panel__head {
        top: 0;
        margin: 0 -14px 12px;
        padding: 16px 54px 14px 16px;
        align-items: flex-start;
        background: #fff;
    }
    .checkout-panel--mobile .checkout-panel__head > span { font-size: 17px; }
    .checkout-panel--mobile .checkout-panel__head small { display: block; margin-top: 3px; }
    #closeMobileCheckout {
        position: absolute;
        top: 11px;
        right: 12px;
        width: 36px;
        height: 36px;
        padding: 0;
        border: 1px solid #eadfe3;
        border-radius: 50%;
        color: #6d5e64;
        background: #fff;
        font-size: 24px;
        line-height: 32px;
    }
    .mobile-checkout-selection {
        padding: 12px;
        border: 1px solid #eadfe3;
        border-radius: 12px;
        background: #fffafa;
    }
    .mobile-checkout-selection > div:first-child {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 10px;
    }
    .mobile-checkout-selection > div:first-child span { color: var(--purchase-muted); font-size: 11px; }
    .mobile-checkout-selection .goodsName {
        overflow: hidden;
        font-size: 13px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .mobile-quantity-row {
        display: grid;
        grid-template-columns: 1fr 38px 50px 38px auto;
        gap: 6px;
        margin-top: 10px;
        align-items: center;
    }
    .mobile-quantity-row > span:first-child { color: var(--purchase-muted); font-size: 11px; }
    .mobile-quantity-row button {
        width: 38px;
        height: 36px;
        padding: 0;
        border: 1px solid #e5d9de;
        border-radius: 8px;
        color: #4c4045;
        background: #fff;
        font-size: 18px;
    }
    .mobile-quantity-row .buyNum {
        width: 50px;
        height: 36px;
        border: 1px solid #e5d9de;
        border-radius: 8px;
        text-align: center;
    }
    .mobile-quantity-row .stock_str { color: var(--purchase-success); font-size: 10px; text-align: right; }
    .mobile-checkout-selection > .goodsInfo { margin: 8px 0 0; color: var(--purchase-muted); font-size: 11px; line-height: 17px; }

    .checkout-panel--mobile .layui-form-label {
        float: none;
        width: 100%;
        padding: 0 0 6px;
        color: #65595e;
        line-height: 20px;
    }
    .checkout-panel--mobile .layui-input-block { margin-left: 0; }
    .checkout-panel--mobile .layui-input-inline { width: 100% !important; }
    .checkout-panel--mobile .layui-input { min-height: 44px; }
    .checkout-panel--mobile .payType.has-methods { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .checkout-panel--mobile .payType li {
        width: 100% !important;
        min-height: 54px;
        margin: 0 !important;
    }
    .checkout-panel--mobile #toPay {
        position: sticky;
        bottom: 0;
        z-index: 4;
        margin: 14px 0 0 !important;
        box-shadow: 0 -8px 20px rgba(255, 255, 255, .96), 0 8px 24px rgba(217, 33, 65, .2);
    }

    .goods-original-layer { border-radius: 16px !important; }
    .goods-original-layer .layui-layer-content { padding: 16px; touch-action: pinch-zoom; }
    .goods-original-preview { overflow: auto; touch-action: pinch-zoom; }
    .goods-original-preview img { max-width: 100%; max-height: 100%; }

    .purchase-login-layer .layui-layer-setwin,
    .purchase-sign-layer .layui-layer-setwin {
        top: 10px !important;
        right: 10px !important;
    }
}

/* Mobile purchase refinements: content completeness and stable one-hand controls. */
.purchase-benefit-popover {
    position: fixed;
    z-index: 2147483000;
    box-sizing: border-box;
    max-width: min(340px, calc(100vw - 28px));
    padding: 12px 14px;
    border-radius: 10px;
    color: #fff;
    background: #262126;
    box-shadow: 0 12px 30px rgba(35, 23, 29, .24);
    font-size: 13px;
    line-height: 1.7;
}

@media (max-width: 768px) {
    .mobile-store-title p { display: none; }
    .mobile-welcome {
        position: relative;
        width: 100%;
        height: 38px;
        margin-top: 12px;
        overflow: hidden;
        border: 1px solid #f1e3e6;
        border-radius: 10px;
        color: #df314f;
        background: #fff7f8;
        font-size: 13px;
        font-weight: 650;
        line-height: 36px;
        text-align: center;
        white-space: nowrap;
    }
    .mobile-welcome span { display: inline-block; min-width: 100%; padding: 0 12px; box-sizing: border-box; }
    .mobile-welcome.is-overflowing span {
        min-width: auto;
        padding-left: 100%;
        animation: mobile-welcome-marquee 28s linear infinite;
    }
    @keyframes mobile-welcome-marquee {
        from { transform: translateX(0); }
        to { transform: translateX(-100%); }
    }

    .mobile-store-header { margin-bottom: 14px; }
    .purchase-catalog--mobile { padding-top: 0 !important; }

    .purchase-catalog--mobile .goods #LAY_demo1 > li.has-image {
        grid-row: span 18;
        height: 280px !important;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li .goods-info {
        box-sizing: border-box;
        padding: 10px 10px 11px;
    }
    .purchase-catalog--mobile .goods-name {
        flex: 0 0 42px;
        height: 42px !important;
        margin-bottom: 7px !important;
        line-height: 21px !important;
    }
    .purchase-catalog--mobile .goods-bottom { min-height: 24px; }
    .purchase-catalog--mobile .goods-price { flex: 0 0 auto; line-height: 24px !important; }

    .purchase-catalog--mobile .desc .goodsContent {
        box-sizing: border-box;
        width: 100% !important;
        max-width: none !important;
        padding: 4px 2px 2px 0 !important;
        overflow-x: hidden;
        overflow-y: auto;
    }

    body.mobile-image-preview-open { overflow: hidden; }
    .mobile-image-preview {
        position: fixed;
        inset: 0;
        z-index: 2147483000;
        display: flex;
        padding: 56px 16px 24px;
        box-sizing: border-box;
        align-items: center;
        justify-content: center;
        background: rgba(18, 28, 45, .78);
        touch-action: pinch-zoom;
    }
    .mobile-image-preview img {
        display: block;
        width: auto;
        height: auto;
        max-width: 100%;
        max-height: calc(100dvh - 96px);
        border-radius: 8px;
        object-fit: contain;
        box-shadow: 0 12px 34px rgba(0, 0, 0, .24);
        touch-action: pinch-zoom;
    }
    .mobile-image-preview__close {
        position: fixed;
        top: calc(12px + env(safe-area-inset-top));
        right: 14px;
        width: 40px;
        height: 40px;
        padding: 0;
        border: 1px solid rgba(255,255,255,.62);
        border-radius: 50%;
        color: #fff;
        background: rgba(44, 50, 60, .74);
        font-size: 26px;
        line-height: 36px;
    }

    .mobile-order-summary {
        left: 8px !important;
        right: 8px !important;
        bottom: calc(8px + env(safe-area-inset-bottom)) !important;
        width: auto !important;
        height: 74px !important;
        min-height: 74px !important;
        margin: 0 !important;
        padding: 9px 106px 9px 10px !important;
        box-sizing: border-box;
    }
    body.has-selected-goods .mobile-order-summary {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 8px;
        align-items: center;
    }
    .mobile-summary-copy strong {
        display: -webkit-box;
        max-height: 36px;
        line-height: 18px;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
    .mobile-summary-quantity {
        display: grid;
        grid-template-columns: 28px 30px 28px;
        align-items: center;
        justify-content: end;
    }
    .mobile-summary-quantity button {
        width: 28px;
        height: 32px;
        padding: 0;
        border: 1px solid #eadde2;
        color: #44383d;
        background: #fff;
        font-size: 17px;
        line-height: 30px;
    }
    .mobile-summary-quantity button:first-child { border-radius: 8px 0 0 8px; }
    .mobile-summary-quantity button:last-child { border-radius: 0 8px 8px 0; }
    .mobile-summary-quantity button:disabled { color: #b7adb1; background: #f5f2f3; }
    .mobile-summary-quantity-value {
        height: 32px;
        border-top: 1px solid #eadde2;
        border-bottom: 1px solid #eadde2;
        box-sizing: border-box;
        color: #3f3439;
        background: #fff;
        font-size: 13px;
        line-height: 30px;
        text-align: center;
    }
    .mobile-checkout-trigger { top: 14px !important; right: 10px !important; width: 88px !important; }

    .checkout-panel--mobile #activity,
    .checkout-panel--mobile #activity + .layui-form-item {
        display: grid;
        grid-template-columns: 76px minmax(0, 1fr);
        column-gap: 8px;
        align-items: center;
    }
    .checkout-panel--mobile #activity[style*="display:none"],
    .checkout-panel--mobile #activity[style*="display: none"] { display: none !important; }
    .checkout-panel--mobile #activity[style*="display: block"] { display: grid !important; }
    .checkout-panel--mobile #activity .layui-form-label,
    .checkout-panel--mobile #activity + .layui-form-item .layui-form-label {
        width: auto;
        padding: 0;
        line-height: 38px;
    }
    .checkout-panel--mobile #activity .layui-input-block,
    .checkout-panel--mobile #activity + .layui-form-item .layui-input-block {
        display: flex;
        min-width: 0;
        margin: 0;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
    }
    .checkout-panel--mobile #activity .layui-badge { margin: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .mobile-welcome.is-overflowing span { padding-left: 12px; animation: none; }
}


@media (prefers-reduced-motion: reduce) {
    .banner .gd .spp { padding-left: 0; animation: none; }
}
.banner > .clear { display: none !important; }
.banner .layui-btn {
    min-width: 96px;
    height: 34px;
    margin: 0 0 0 8px !important;
    padding: 0 14px;
    border-radius: 9px;
    line-height: 34px;
}
.banner-account {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: 8px;
    padding-left: 12px;
    border-left: 1px solid var(--purchase-line);
    vertical-align: middle;
}
.banner-account__login,
.banner-account__register,
.banner-account__orders {
    min-width: 96px;
    height: 34px;
    padding: 0 14px;
    border: 0;
    border-radius: 8px;
    color: #62555b;
    background: transparent;
    font-size: 12px;
    line-height: 32px;
    cursor: pointer;
}
.banner-account__login,
.banner-account__register { border: 1px solid #26a653; font-weight: 700; }
.banner-account__login { color: #178b3f; background: #fff; }
.banner-account__register { color: #fff; background: #26a653; }
.banner-account__login.backstage {
    border-color: #ef9bad;
    color: var(--purchase-accent-dark);
    background: #fff;
}
.banner-account__balance {
    padding-left: 4px;
    color: #766970;
    font-size: 12px;
    white-space: nowrap;
}
.banner-account__balance strong { color: var(--purchase-accent-dark); font-size: 13px; }
.banner-balance {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 34px;
    padding: 0 14px;
    border-radius: 7px;
    font-size: 12px;
    white-space: nowrap;
}
.banner-balance strong { font-size: 13px; }
.banner-balance--system { color: #1d5fc7; background: #e7f0ff; }
.banner-balance--store { color: #168044; background: #e8f9ee; }
.banner-vip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 26px;
    padding: 0 9px;
    border-radius: 5px;
    color: #fff;
    background: #ff5b35;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}
.banner-avatar {
    width: 40px;
    height: 40px;
    margin-left: 2px;
    padding: 0;
    overflow: hidden;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #f2eaed;
    box-shadow: 0 0 0 1px #eadfe3;
    cursor: pointer;
}
.banner-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.banner-avatar:hover { box-shadow: 0 0 0 2px rgba(239, 47, 79, .24); }
.banner-account__login:hover,
.banner-account__orders:hover { color: #126f34; background: #eefaf2; }
.banner-account__register:hover { border-color: #16883d; background: #16883d; }
.banner-account__login.backstage:hover { border-color: var(--purchase-accent); color: var(--purchase-accent-dark); background: var(--purchase-accent-soft); }
.sinfo {
    order: 2;
    position: static !important;
    width: auto;
    margin: 0 26px !important;
    padding: 12px 0 16px;
    border-top: 1px solid var(--purchase-line);
    opacity: 1 !important;
    z-index: 10 !important;
}
.sinfo .link {
    display: flex;
    align-items: center;
    gap: 22px;
    overflow-x: auto;
    padding: 0 2px;
    scrollbar-width: thin;
}
.sinfo .link li {
    flex: 0 0 auto;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}
.sinfo .link a {
    display: block;
    padding: 5px 0;
    color: #65585e !important;
    font-size: 12px;
    line-height: 1;
}
.sinfo .link a:hover { color: var(--purchase-accent-dark) !important; }

/* Catalog */
.purchase-page-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 350px;
    align-items: start;
    gap: 18px;
    width: min(1800px, calc(100% - 48px));
    margin: 0 auto 70px;
}
.purchase-catalog {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    opacity: 1 !important;
}
.catalog-layout {
    display: grid;
    grid-template-columns: 176px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}
.category-panel, .products-panel, .checkout-panel, .desc, .pick_box {
    border: 1px solid rgba(234, 223, 227, .94) !important;
    border-radius: var(--purchase-radius) !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 12px 34px rgba(77, 35, 48, .08);
}
.category-panel { position: sticky; top: 14px; overflow: hidden; }
.category-panel__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    padding: 18px 16px 14px;
    border-bottom: 1px solid var(--purchase-line);
    font-size: 16px;
    font-weight: 750;
}
.category-panel__head small { color: var(--purchase-muted); font-size: 11px; font-weight: 400; }
.category-panel__head strong { color: var(--purchase-accent); }
.cat { height: auto !important; margin: 0 !important; padding: 8px !important; overflow: visible !important; }
.cat ul { display: grid !important; gap: 4px; margin: 0 !important; padding: 0 !important; }
.cat ul li {
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 11px 12px !important;
    border: 0 !important;
    border-radius: 9px !important;
    color: #665a60 !important;
    background: transparent !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    text-align: left !important;
    cursor: pointer;
}
.cat ul li:hover { background: #fff5f7 !important; }
.cat ul li.select {
    color: var(--purchase-accent-dark) !important;
    background: var(--purchase-accent-soft) !important;
    font-weight: 700;
}
.products-panel { min-width: 0; height: auto !important; padding: 22px; overflow: visible !important; }
.purchase-catalog[data-has-background="1"] .products-panel {
    padding: 0;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none;
}
.purchase-catalog[data-has-background="1"] .products-toolbar {
    padding: 18px 20px;
    border: 1px solid rgba(234, 223, 227, .94);
    border-radius: var(--purchase-radius);
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 12px 34px rgba(77, 35, 48, .08);
}
.products-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}
.products-toolbar__eyebrow { margin: 0 0 4px; color: var(--purchase-accent); font-size: 12px; font-weight: 700; }
.products-toolbar h2 { margin: 0; color: var(--purchase-ink); font-size: 21px; font-weight: 750; line-height: 1.25; }
.products-toolbar h2 small { color: var(--purchase-muted); font-size: 12px; font-weight: 400; }
.products-search { display: grid; grid-template-columns: minmax(180px, 260px) auto; gap: 8px; }
.products-search input {
    width: 100%;
    height: 40px;
    padding: 0 13px;
    border: 1px solid #dfd3d7;
    border-radius: 9px;
    color: var(--purchase-ink);
    background: #fff;
}
.products-search button, .goods-load-actions button, .pick_box button {
    height: 40px;
    padding: 0 18px;
    border: 0;
    border-radius: 9px;
    color: #fff;
    background: var(--purchase-accent);
    cursor: pointer;
    font-weight: 700;
}
.products-search button:active, .goods-load-actions button:active { transform: translateY(1px); }
.goods { position: relative !important; float: none !important; display: block !important; width: 100% !important; height: auto !important; min-height: 260px; margin: 0 !important; overflow: visible !important; }
.goods #LAY_demo1 {
    position: relative !important;
    float: none !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    grid-auto-rows: 148px;
    grid-auto-flow: row dense;
    align-items: start;
    gap: 12px;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    overflow: visible !important;
    padding: 0 !important;
}
.goods #LAY_demo1 > li {
    position: relative !important;
    float: none !important;
    display: flex !important;
    flex-direction: column;
    width: auto !important;
    height: auto !important;
    min-height: 244px;
    margin: 0 !important;
    padding: 0 0 8px !important;
    overflow: hidden;
    border: 1px solid var(--purchase-line) !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: none !important;
    cursor: pointer;
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.goods #LAY_demo1 > li:hover { transform: translateY(-2px); border-color: #efb7c2 !important; box-shadow: 0 10px 24px rgba(87, 39, 53, .1) !important; }
.goods #LAY_demo1 > li.select { border: 2px solid var(--purchase-accent) !important; box-shadow: 0 0 0 3px rgba(239, 47, 79, .1) !important; }
.goods #LAY_demo1 > li.select .goods-name { color: #3c3035 !important; }
.goods #LAY_demo1 > li.select .goods-price { color: var(--purchase-accent-dark) !important; }
.goods #LAY_demo1 > li.select .stock { color: var(--purchase-success) !important; }
.goods #LAY_demo1 > li.select .stock.is-empty { color: #c64646 !important; }
.goods-thumb {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: linear-gradient(145deg, #fff1f4, #f7e8ed);
}
.goods-thumb img { position: relative; z-index: 1; width: 100%; height: 100%; display: block; object-fit: cover; cursor: pointer; }
.goods-thumb__fallback { position: absolute; inset: 0; z-index: 0; display: grid; place-items: center; color: #b78391; font-size: 12px; font-weight: 700; pointer-events: none; }
.goods-zoom {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 2;
    display: grid;
    width: 38px;
    height: 38px;
    padding: 0;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .82);
    border-radius: 50%;
    color: #fff;
    background: rgba(18, 58, 119, .9);
    box-shadow: 0 8px 20px rgba(26, 42, 76, .22);
    cursor: zoom-in;
    transition: transform .16s ease, background-color .16s ease;
}
.goods-zoom svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}
.goods-zoom:hover { transform: scale(1.06); background: #ef2f4f; }
.goods-thumb img:not([src]), .goods-thumb img[src=""] { display: none; }
.goods-info, .goods-bottom { display: contents; }
.goods-name { height: 20px !important; margin: 10px 12px 3px !important; overflow: hidden; color: #3c3035 !important; font-size: 14px !important; font-weight: 650; line-height: 20px !important; text-align: left !important; text-overflow: ellipsis; white-space: nowrap; }
.goods-price { margin: 0 12px !important; color: var(--purchase-accent-dark) !important; font-size: 17px !important; font-weight: 750; line-height: 24px; text-align: left !important; }
.goods-price span { font-size: 12px !important; }
.goods-meta { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin: 4px 12px 0; }
.goods-badges { display: flex; gap: 3px; min-height: 18px; }
.goods-badge { min-width: 18px; padding: 2px 4px; border-radius: 4px; color: #9d354b; background: #fff0f3; font-size: 10px; text-align: center; }
.goods .stock { color: var(--purchase-success) !important; font-size: 11px; white-space: nowrap; }
.goods .stock.is-empty { color: #c64646 !important; }
@media (min-width: 769px) {
    .goods #LAY_demo1 > li .goods-info {
        display: flex;
        flex: 1;
        flex-direction: column;
        min-height: 0;
        padding: 10px 12px 9px;
    }
    .goods #LAY_demo1 > li .goods-bottom {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-top: auto;
    }
    .goods #LAY_demo1 > li .goods-name,
    .goods #LAY_demo1 > li .goods-price,
    .goods #LAY_demo1 > li .goods-meta { margin-left: 0 !important; margin-right: 0 !important; }
    .goods #LAY_demo1 > li .goods-meta { align-items: center; flex-direction: row; flex-wrap: wrap; justify-content: flex-end; gap: 5px; margin-top: 0; }
    .goods #LAY_demo1 > li.has-image {
        grid-column: span 2;
        grid-row: span 3;
        height: 468px !important;
        min-height: 468px;
    }
    .goods #LAY_demo1 > li.has-image .goods-thumb {
        display: flex;
        align-items: center;
        justify-content: center;
        aspect-ratio: 16 / 10;
    }
    .goods #LAY_demo1 > li.has-image .goods-thumb img {
        width: 100%;
        height: 100%;
        max-width: none;
        max-height: none;
        margin: 0;
        object-fit: cover;
        object-position: center;
        background: transparent;
    }
    .goods #LAY_demo1 > li.has-image.image-portrait,
    .goods #LAY_demo1 > li.has-image.image-square {
        grid-column: span 1;
    }
    .goods #LAY_demo1 > li.has-image.image-portrait .goods-thumb {
        height: 350px;
        aspect-ratio: auto;
    }
    .goods #LAY_demo1 > li.has-image.image-square .goods-thumb {
        height: 300px;
        aspect-ratio: auto;
    }
    .goods #LAY_demo1 > li.has-image .goods-info { min-height: 96px; }
    .goods #LAY_demo1 > li.has-image .goods-name {
        display: -webkit-box;
        flex: 0 0 40px;
        height: 40px !important;
        overflow: hidden;
        line-height: 20px !important;
        text-overflow: ellipsis;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
    .goods #LAY_demo1 > li.no-image {
        grid-row: span 1;
        height: 138px !important;
        min-height: 138px;
        padding: 0 !important;
        justify-content: flex-start;
    }
    .goods #LAY_demo1 > li.no-image .goods-thumb { display: none; }
    .goods #LAY_demo1 > li.no-image .goods-name {
        height: 40px !important;
        margin: 0 0 6px !important;
        font-size: 14px !important;
        line-height: 20px !important;
        text-overflow: clip;
        white-space: normal;
    }
    .goods #LAY_demo1 > li.no-image .goods-price { font-size: 18px !important; }
    .goods #LAY_demo1 > li.no-image .goods-info { padding-top: 14px; padding-bottom: 10px; }
}
.goods-original-layer .layui-layer-content {
    display: flex !important;
    align-items: center;
    justify-content: center;
    overflow: auto !important;
    box-sizing: border-box;
    padding: 24px;
    background: radial-gradient(circle at center, #2b2b2e 0, #171719 72%);
}
.goods-original-preview { display: flex; width: 100%; height: 100%; min-height: 0; align-items: center; justify-content: center; }
.goods-original-preview img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; box-shadow: 0 16px 44px rgba(0, 0, 0, .38); }
body.mobile-image-preview-open { overflow: hidden; }
.mobile-image-preview {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: flex;
    padding: 56px 16px 24px;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    background: rgba(18, 28, 45, .78);
    touch-action: pinch-zoom;
}
.mobile-image-preview img {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: calc(100dvh - 96px);
    border-radius: 8px;
    object-fit: contain;
    box-shadow: 0 12px 34px rgba(0, 0, 0, .24);
    touch-action: pinch-zoom;
}
.mobile-image-preview__close {
    position: fixed;
    top: calc(12px + env(safe-area-inset-top));
    right: 14px;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .62);
    border-radius: 50%;
    color: #fff;
    background: rgba(44, 50, 60, .74);
    font-size: 26px;
    line-height: 36px;
    cursor: pointer;
}
.mobile-image-preview__close:focus-visible {
    outline: 3px solid rgba(255, 255, 255, .9);
    outline-offset: 3px;
}
@media (min-width: 769px) {
    .mobile-image-preview { padding: 64px 48px 40px; }
    .mobile-image-preview__close { top: 20px; right: 24px; }
}
.goods-load-actions { position: static !important; float: none !important; z-index: 5; clear: both; width: 100%; padding: 20px 0 2px; background: transparent; text-align: center; }
.goods-load-actions[hidden] { display: none !important; }
.goods-load-actions button { min-width: 220px; background: #fff; border: 1px solid #e7c7cf; color: var(--purchase-accent-dark); }
.goods-load-actions button[disabled] { opacity: .6; cursor: default; }
.goods-load-actions p { min-height: 18px; margin: 7px 0 0; color: var(--purchase-muted); font-size: 11px; }
.goods-detail-home { display: none; }
.goods #LAY_demo1 > li.goods-inline-slot {
    grid-column: 1 / -1;
    width: 100% !important;
    height: auto !important;
    min-height: 0;
    padding: 0 !important;
    overflow: visible;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    cursor: default;
    transform: none !important;
}
.goods-inline-detail { display: flex; align-items: stretch; flex-direction: column; gap: 12px; width: 100%; }
.goods-inline-detail > .desc,
.goods-inline-detail > .pick_box { min-width: 0; flex: 0 0 auto; margin-top: 0 !important; }
.goods-inline-detail > .pick_box { order: 1; }
.goods-inline-detail > .desc { order: 2; }
.desc, .pick_box { margin-top: 16px !important; padding: 18px !important; }
.desc h3 { margin: 0 0 10px; font-size: 15px; }
.goodsContent { color: #655a5f; line-height: 1.75; }
.goodsContent img { max-width: 100%; height: auto; }
.pick-search-row { display: flex; gap: 8px; }
.pick-search-row input { min-width: 0; flex: 1; height: 40px; padding: 0 12px; border: 1px solid var(--purchase-line); border-radius: 9px; }
.pick-pagination { display: flex; align-items: center; gap: 8px; margin-top: 10px; }

/* Checkout */
.checkout-panel {
    position: sticky;
    top: 18px;
    right: auto;
    bottom: auto;
    width: 100% !important;
    min-width: 0 !important;
    height: fit-content !important;
    max-height: calc(100vh - 36px);
    margin: 0 !important;
    padding: 20px !important;
    overflow-x: hidden;
    overflow-y: auto;
    isolation: isolate;
    opacity: 1 !important;
    z-index: 20;
}
.checkout-panel__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--purchase-line); }
.checkout-panel__head > span { font-size: 18px; font-weight: 750; }
.checkout-panel__head small { color: var(--purchase-muted); font-size: 11px; }
.checkout-panel .layui-elem-field { margin: 14px 0 8px !important; border: 0 !important; }
.checkout-panel .layui-field-title legend { margin: 0 !important; padding: 0 !important; color: #4c4045; font-size: 13px; font-weight: 700; }
.checkout-panel .layui-form-item { margin-bottom: 10px; }
.checkout-panel .layui-form-label { width: 88px; padding-left: 0; color: var(--purchase-muted); text-align: left; }
.checkout-panel .layui-input-block { margin-left: 88px; }
.checkout-panel .layui-input-inline { width: 100% !important; margin: 0 !important; }
.checkout-panel .layui-input { border-color: var(--purchase-line); border-radius: 9px !important; }
.checkout-panel .payInfo-inner,
.checkout-panel .jsq,
.checkout-panel .proName { position: relative !important; left: auto !important; width: 100% !important; max-width: 100% !important; }
.payInfo-inner { border: 1px solid var(--purchase-line); border-radius: 10px; background: #fffafa; }
.payment-placeholder { display: grid; min-height: 74px; place-items: center; padding: 14px; border: 1px dashed #ddcbd1; border-radius: 10px; color: #8e7e84; background: #fffafb; font-size: 12px; text-align: center; }
.payType { display: none; width: 100% !important; height: auto !important; min-height: 0 !important; gap: 8px; margin: 0 !important; padding: 0 !important; }
.payType.has-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.payType li { display: grid; min-height: 52px; place-items: center; margin: 0 !important; padding: 7px !important; border: 1px solid var(--purchase-line) !important; border-radius: 9px; background: #fff; }
.payType li.paySelect { border-color: var(--purchase-accent) !important; box-shadow: 0 0 0 2px rgba(239, 47, 79, .09); }
.payType li img { max-width: 100%; height: 34px !important; object-fit: contain; }
#toPay {
    display: flex;
    min-height: 48px;
    height: auto;
    padding: 10px 14px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    line-height: 24px;
    white-space: normal;
    border-radius: 10px;
    background: var(--purchase-accent) !important;
}
#toPay #fee_str { flex: 0 0 100%; line-height: 18px; text-align: center !important; }
#toPay:hover { background: var(--purchase-accent-dark) !important; }
.purchase-input-shake { border-color: var(--purchase-accent) !important; animation: purchase-input-shake .34s ease-in-out; }
@keyframes purchase-input-shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-6px); }
    50% { transform: translateX(6px); }
    75% { transform: translateX(-3px); }
}
.mobile-order-summary, .mobile-checkout-trigger, #closeMobileCheckout { display: none; }

/* Layer dialogs are intentionally smaller than the purchase surface. */
.layui-layer { border-radius: 14px !important; overflow: hidden; }
.layui-layer-title { background: #fff !important; border-bottom-color: var(--purchase-line) !important; color: var(--purchase-ink) !important; font-weight: 700; }
.purchase-lottery-layer {
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fffaf0 !important;
    box-shadow: 0 22px 70px rgba(0, 0, 0, .72) !important;
}
.purchase-lottery-layer .layui-layer-content,
.purchase-lottery-layer iframe {
    height: 100% !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fffaf0 !important;
}
.layui-layer-btn .layui-layer-btn0 { border-color: var(--purchase-accent) !important; background-color: var(--purchase-accent) !important; }
.purchase-login-layer .layui-layer-setwin,
.purchase-sign-layer .layui-layer-setwin {
    top: 12px !important;
    right: 12px !important;
    z-index: 5;
}
.purchase-login-layer .layui-layer-setwin .layui-layer-close2,
.purchase-sign-layer .layui-layer-setwin .layui-layer-close2 {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    border: 1px solid #f0d7dd;
    border-radius: 50%;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 5px 14px rgba(65, 33, 43, .12);
}
.purchase-login-layer .layui-layer-setwin .layui-layer-close2::before,
.purchase-sign-layer .layui-layer-setwin .layui-layer-close2::before {
    content: "×";
    position: absolute;
    inset: 0;
    color: #7c6870;
    font-size: 22px;
    font-weight: 400;
    line-height: 29px;
    text-align: center;
}
.purchase-login-layer .layui-layer-setwin .layui-layer-close2:hover,
.purchase-sign-layer .layui-layer-setwin .layui-layer-close2:hover {
    border-color: #ef9bac;
    background: #fff2f5 !important;
}

@media (max-width: 1180px) and (min-width: 769px) {
    .purchase-page-shell { grid-template-columns: minmax(0, 1fr) 330px; }
    .catalog-layout { grid-template-columns: 160px minmax(0, 1fr); }
    .checkout-panel { width: 100% !important; }
    .goods #LAY_demo1 { grid-template-columns: repeat(auto-fill, minmax(145px, 1fr)); }
    .products-toolbar { align-items: stretch; flex-direction: column; }
}

@media (max-width: 768px) {
    body.xsh-body { padding-bottom: 84px; }
    .top { height: 34px !important; padding: 0 14px !important; line-height: 34px !important; }
    .top .right { float: none !important; text-align: right; }
    .sinfo { position: static !important; width: 100%; padding: 8px 12px 0; }
    .sinfo .link { gap: 6px; }
    .sinfo .link a { padding: 8px 11px; }
    .banner {
        width: calc(100% - 24px) !important;
        min-height: 78px;
        margin: 8px 12px 10px !important;
        padding: 14px !important;
        gap: 12px;
    }
    .banner .xsh-logo { width: 48px !important; height: 48px !important; }
    .banner .seller_name { font-size: 17px !important; }
    .banner .gd, .banner > div:last-of-type { display: none !important; }
    .purchase-catalog, .purchase-catalog--mobile {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 12px 18px !important;
    }
    .purchase-page-shell { display: block; width: 100%; margin: 0; }
    .products-panel { padding: 15px; }
    .products-toolbar { align-items: stretch; flex-direction: column; gap: 12px; margin-bottom: 12px; }
    .products-toolbar__eyebrow { display: none; }
    .products-toolbar h2 { font-size: 18px; }
    .products-search { grid-template-columns: minmax(0, 1fr) 68px; }
    .category-tabs { margin: 0 0 14px !important; padding: 0 !important; overflow: visible !important; }
    .category-tabs ul { display: grid !important; width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
    .category-tabs ul li { width: 100% !important; padding: 9px 8px !important; border: 1px solid var(--purchase-line) !important; white-space: normal; }
    .category-tabs ul li.select { border-color: #efb9c3 !important; }
    .goods #LAY_demo1 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    .goods #LAY_demo1 { grid-auto-rows: auto; grid-auto-flow: row; }
    .goods #LAY_demo1 > li { min-height: 210px; }
    .goods-thumb { aspect-ratio: 4 / 3; }
    .goods-thumb img { cursor: pointer; }
    .goods-zoom { display: none; }
    .goods-name { height: 40px !important; margin: 9px 9px 3px !important; font-size: 13px !important; line-height: 20px !important; text-overflow: clip; white-space: normal; }
    .goods-price { margin: 0 9px !important; font-size: 17px !important; }
    .goods-meta { align-items: flex-end; flex-direction: column; margin: 7px 9px 0; }
    .goods-badges { align-self: flex-start; }
    .goods .stock { align-self: flex-start; }
    .goods-load-actions button { width: 100%; min-width: 0; }
    .mobile-order-summary {
        display: none;
        position: fixed;
        left: 10px;
        right: 10px;
        bottom: 10px;
        z-index: 80;
        min-height: 66px;
        padding: 10px 112px 8px 12px;
        border: 1px solid rgba(234, 223, 227, .96);
        border-radius: 14px;
        background: rgba(255, 255, 255, .97);
        box-shadow: 0 14px 36px rgba(61, 24, 35, .2);
    }
    body.has-selected-goods .mobile-order-summary { display: block; }
    .mobile-order-summary .layui-elem-field, .mobile-order-summary .jsq { display: none; }
    .mobile-order-summary .proName p { height: auto !important; margin: 0 !important; line-height: 1.5 !important; }
    .mobile-checkout-trigger {
        display: block;
        position: absolute;
        top: 10px;
        right: 10px;
        width: 94px;
        height: 46px;
        border: 0;
        border-radius: 10px;
        color: #fff;
        background: var(--purchase-accent);
        font-weight: 700;
    }
    .checkout-panel--mobile {
        display: none;
        position: fixed !important;
        inset: auto 0 0 !important;
        z-index: 100;
        width: 100% !important;
        max-height: 86dvh;
        margin: 0 !important;
        padding: 18px 16px 26px !important;
        overflow-y: auto;
        border-radius: 18px 18px 0 0 !important;
        box-shadow: 0 -18px 46px rgba(56, 27, 36, .22);
    }
    body.mobile-checkout-open::after { content: ""; position: fixed; inset: 0; z-index: 90; background: rgba(37, 27, 31, .45); }
    body.mobile-checkout-open .checkout-panel--mobile { display: block; }
    #closeMobileCheckout { display: block; border: 0; color: var(--purchase-accent); background: transparent; font-size: 12px; cursor: pointer; }
    .checkout-panel__head { position: sticky; top: -18px; z-index: 2; padding: 14px 0; background: #fff; }
    .payType.has-methods { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .layui-layer { max-width: calc(100vw - 20px) !important; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* The merchant-controlled agreement may contain oversized rich-text images. */
.purchase-protocol-content {
    box-sizing: border-box;
    padding: 18px 20px 24px;
    color: #3f3a3a;
    font-size: 14px;
    line-height: 1.75;
    overflow-wrap: anywhere;
}
.purchase-protocol-content img,
.purchase-protocol-content video,
.purchase-protocol-content iframe {
    display: block;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 42vh;
    margin: 12px auto;
    object-fit: contain;
    border-radius: 10px;
}
.layui-layer .purchase-protocol-content {
    max-height: calc(72vh - 108px);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.purchase-protocol-layer {
    overflow: hidden;
}
.purchase-protocol-layer .layui-layer-content {
    position: absolute;
    inset: 43px 0 58px;
    height: auto !important;
    overflow-y: auto;
}
.purchase-protocol-layer .layui-layer-btn {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    box-sizing: border-box;
    height: 58px;
    padding: 10px 16px;
    background: #fff;
    border-top: 1px solid #f1e7e7;
}
.purchase-protocol-layer .layui-layer-btn a {
    position: absolute;
    top: 10px;
    right: 16px;
    float: none !important;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 118px;
    height: 36px;
    padding: 0 18px !important;
    line-height: 1 !important;
    margin: 0 !important;
    border: 0;
    border-radius: 9px;
    background: #e8435a;
    color: #fff;
    text-align: center;
}

@media (max-width: 768px) {
    .purchase-protocol-content {
        padding: 14px 14px 20px;
        font-size: 13px;
    }
    .purchase-protocol-content img,
    .purchase-protocol-content video,
    .purchase-protocol-content iframe {
        max-height: 34vh;
    }
    .layui-layer .purchase-protocol-content {
        max-height: calc(72vh - 104px);
    }
    .purchase-protocol-layer .layui-layer-content {
        inset: 43px 0 56px;
    }
    .purchase-protocol-layer .layui-layer-btn {
        height: 56px;
        padding: 10px 14px;
    }
    .purchase-protocol-layer {
        right: 10px !important;
        bottom: auto !important;
        left: 10px !important;
        width: auto !important;
        border-radius: 18px !important;
    }

    .purchase-notice-layer {
        right: 10px !important;
        bottom: auto !important;
        left: 10px !important;
        width: auto !important;
        border-radius: 18px !important;
        overflow: hidden;
    }

    .purchase-lottery-layer {
        top: 0 !important;
        right: 0 !important;
        bottom: auto !important;
        left: 0 !important;
        width: 100% !important;
        max-width: none !important;
        height: 100% !important;
        border-radius: 0 !important;
        overflow: hidden;
    }

    .purchase-lottery-layer .layui-layer-content,
    .purchase-lottery-layer iframe {
        border-radius: 0 !important;
    }

    body.has-selected-goods .mobile-order-summary {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 8px;
        align-items: center;
    }

    .purchase-catalog--mobile .goods #LAY_demo1 > li .goods-name {
        display: -webkit-box;
        flex: 0 0 52px;
        width: 100%;
        height: 52px !important;
        max-height: 52px;
        margin: 0 0 7px !important;
        overflow: hidden;
        line-height: 22px !important;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li.no-image .goods-name { flex-basis: 52px; }

    .purchase-catalog--mobile .desc .goodsContent {
        width: 100% !important;
        max-width: none !important;
        max-height: min(48dvh, 420px) !important;
        padding: 4px 4px 4px 0 !important;
    }

    .checkout-panel--mobile #receive_div { margin-top: 4px; }
    .checkout-panel--mobile #receive_div .layui-inline {
        display: block;
        width: 100%;
        margin: 0 !important;
    }
    .checkout-panel--mobile #receive_div .layui-form-label {
        display: block;
        width: 100%;
        padding: 0 0 7px;
        box-sizing: border-box;
        line-height: 20px;
    }
    .checkout-panel--mobile #receive_div .layui-input-inline {
        display: block;
        width: 100% !important;
        margin: 0 !important;
    }
    .checkout-panel--mobile #sms_receive {
        display: block;
        width: 100%;
        margin: 0 !important;
        box-sizing: border-box;
        position: static !important;
        left: auto !important;
        transform: none !important;
    }
    .checkout-panel--mobile #sms_tip {
        display: block;
        margin: 7px 2px 0 !important;
        line-height: 20px !important;
    }

    .purchase-payment-loading {
        position: fixed !important;
        top: 50% !important;
        left: 50% !important;
        z-index: 2147483001 !important;
        width: 68px !important;
        height: 68px !important;
        margin: 0 !important;
        overflow: visible !important;
        border: 1px solid rgba(255, 255, 255, .78);
        border-radius: 16px !important;
        background: rgba(255, 255, 255, .97) !important;
        box-shadow: 0 14px 40px rgba(36, 22, 29, .28) !important;
        animation: none !important;
        -webkit-animation: none !important;
        transform: translate(-50%, -50%) !important;
    }
    .purchase-payment-loading .layui-layer-content {
        width: 32px !important;
        height: 32px !important;
        margin: 15px !important;
        padding: 0 !important;
        border: 4px solid #f4c8d0;
        border-top-color: var(--purchase-accent);
        border-radius: 50%;
        background: none !important;
        animation: purchase-payment-spin .75s linear infinite;
    }
    .purchase-payment-loading-shade { z-index: 2147483000 !important; }
}

@keyframes purchase-payment-spin {
    to { transform: rotate(360deg); }
}

/* Mobile neutral surface: remove the accumulated rose tint without weakening brand actions. */
@media (max-width: 768px) {
    html,
    body.mobile-purchase-body {
        background-color: #f5f6f8 !important;
        background-image: none !important;
    }
    body.mobile-purchase-body {
        --purchase-canvas: #f5f6f8;
        --purchase-line: #e3e6ea;
    }
    .mobile-store-header,
    .purchase-catalog--mobile .products-toolbar,
    .purchase-catalog--mobile .goods #LAY_demo1 > li,
    .purchase-catalog--mobile .desc,
    .purchase-catalog--mobile .pick_box,
    .mobile-order-summary,
    .checkout-panel--mobile,
    .mobile-checkout-selection,
    .payInfo-inner,
    .payment-placeholder {
        background-color: #fff !important;
    }
    .mobile-store-header,
    .purchase-catalog--mobile .products-toolbar,
    .purchase-catalog--mobile .goods #LAY_demo1 > li,
    .purchase-catalog--mobile .desc,
    .purchase-catalog--mobile .pick_box,
    .mobile-order-summary,
    .mobile-checkout-selection {
        border-color: #e3e6ea !important;
    }
    .purchase-catalog--mobile .products-toolbar {
        box-shadow: 0 8px 24px rgba(30, 41, 59, .07);
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li {
        box-shadow: 0 5px 16px rgba(30, 41, 59, .045) !important;
    }
    .mobile-order-summary {
        box-shadow: 0 14px 36px rgba(30, 41, 59, .16) !important;
    }
    .checkout-panel--mobile {
        box-shadow: 0 -18px 46px rgba(30, 41, 59, .18) !important;
    }

    .purchase-catalog--mobile .goods #LAY_demo1 > li.has-image.image-landscape {
        grid-column: 1 / -1;
        grid-row: span 20;
        height: 312px !important;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li.has-image.image-landscape .goods-thumb {
        height: 210px;
        aspect-ratio: auto;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li.has-image.image-portrait {
        grid-column: span 1;
        grid-row: span 27;
        height: 424px !important;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li.has-image.image-portrait .goods-thumb {
        height: 322px;
        aspect-ratio: auto;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li.has-image.image-square {
        grid-column: span 1;
        grid-row: span 18;
        height: 280px !important;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li.has-image.image-square .goods-thumb {
        height: 178px;
        aspect-ratio: auto;
    }
    .purchase-catalog--mobile .goods #LAY_demo1 > li.has-image .goods-thumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}