.detail-page{

    display:grid;

    grid-template-rows:56px minmax(0,1fr) auto;

    overflow:hidden;

    padding:0;

    background:#fff;

}

.page-header{

    grid-row:1;

    height:56px;

    display:flex;

    align-items:center;

    border-bottom:1px solid #eee;

    background:#fff;

    z-index:20;

}

.page-back,

.page-header-space{

    width:52px;

    flex:0 0 52px;

}

.page-back{

    display:grid;

    place-items:center;

    font-size:30px;

}

.page-header-title{

    flex:1;

    text-align:center;

    font-size:16px;

    font-weight:850;

}

.detail-scroll{

    grid-row:2;

    min-width:0;

    min-height:0;

    overflow-x:hidden;

    overflow-y:auto;

    overscroll-behavior-y:auto;

    scrollbar-width:none;

    background:#fff;

}

.detail-scroll::-webkit-scrollbar{

    display:none;

}

.detail-loading,

.detail-error{

    display:grid;

    place-items:center;

    min-height:45vh;

    padding:30px;

    color:#999;

    font-size:14px;

    text-align:center;

}

.detail-gallery-wrap{

    position:relative;

    width:100%;

    background:#f4f4f4;

}

.detail-gallery{

    display:flex;

    width:100%;

    overflow-x:auto;

    overflow-y:hidden;

    scroll-snap-type:x mandatory;

    scrollbar-width:none;

    -webkit-overflow-scrolling:touch;

}

.detail-gallery::-webkit-scrollbar{

    display:none;

}

.detail-slide{

    flex:0 0 100%;

    width:100%;

    aspect-ratio:5 / 6;

    scroll-snap-align:start;

    background:#f2f2f2;

}

.detail-slide img{

    display:block;

    width:100%;

    height:100%;

    object-fit:cover;

}

.detail-no-image{

    display:grid;

    place-items:center;

    color:#aaa;

    font-size:13px;

}

.detail-dots{

    position:absolute;

    left:0;

    right:0;

    bottom:12px;

    display:flex;

    justify-content:center;

    gap:6px;

    pointer-events:none;

}

.detail-dot{

    width:6px;

    height:6px;

    border-radius:50%;

    background:rgba(255,255,255,.55);

    box-shadow:0 0 0 1px rgba(0,0,0,.08);

    transition:transform .18s ease,background .18s ease;

}

.detail-dot.active{

    background:#111;

    transform:scale(1.25);

}

.detail-info{

    padding:20px 16px 18px;

}

.detail-brand{

    font-size:12px;

    font-weight:900;

    letter-spacing:.02em;

}

.detail-name{

    margin-top:6px;

    font-size:22px;

    font-weight:850;

    line-height:1.3;

}

.price-block{

    margin-top:14px;

}

.price-main{

    display:flex;

    align-items:baseline;

    gap:7px;

}

.price-discount{

    color:#e53935;

    font-size:21px;

    font-weight:900;

}

.price-sale{

    font-size:21px;

    font-weight:900;

}

.price-old{

    margin-top:4px;

    color:#aaa;

    font-size:12px;

    text-decoration:line-through;

}

.detail-stock{

    display:flex;

    justify-content:space-between;

    gap:12px;

    margin-top:14px;

    padding-top:13px;

    border-top:1px solid #eee;

    color:#666;

    font-size:12px;

}

.detail-stock span{

    color:#aaa;

    text-align:right;

}

.detail-block{

    padding:19px 16px;

    border-top:1px solid #eee;

}

.detail-block h3{

    margin:0 0 12px;

    font-size:15px;

    font-weight:850;

}

.detail-sizes{

    display:flex;

    flex-wrap:wrap;

    gap:8px;

}

.detail-size{

    min-width:62px;

    padding:11px 13px;

    border:1px solid #ddd;

    border-radius:10px;

    text-align:center;

    font-size:12px;

    background:#fff;

}

.detail-size small{

    display:block;

    margin-top:3px;

    font-size:10px;

}

.detail-size.sold{

    color:#bbb;

    text-decoration:line-through;

    background:#fafafa;

}

.detail-text{

    color:#555;

    font-size:13px;

    line-height:1.85;

    white-space:pre-line;

    word-break:break-word;

}

.detail-images{

    border-top:1px solid #eee;

    background:#fff;

}

.detail-images img{

    display:block;

    width:100%;

    height:auto;

}

.detail-official-block{

    padding-bottom:28px;

}

.detail-official-link{

    display:grid;

    place-items:center;

    width:100%;

    height:50px;

    box-sizing:border-box;

    border:1px solid #111;

    border-radius:12px;

    color:#111;

    font-size:14px;

    font-weight:800;

    text-decoration:none;

}

.detail-bottom-actions{

    grid-row:3;

    display:grid;

    grid-template-columns:48px 48px minmax(0,1fr) minmax(0,1fr);

    gap:8px;

    align-items:center;

    padding:8px 10px calc(8px + env(safe-area-inset-bottom));

    border-top:1px solid #eee;

    background:#fff;

    z-index:30;

}

.detail-icon-action{

    height:52px;

    border:0;

    background:#fff;

    color:#111;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    gap:2px;

    font:inherit;

    -webkit-tap-highlight-color:transparent;

}

.detail-icon-action span{

    font-size:20px;

    line-height:1;

}

.detail-icon-action small{

    font-size:10px;

}

.detail-add-cart-button{

    height:52px;

    border:1px solid #111;

    border-radius:12px;

    background:#fff;

    color:#111;

    font-size:13px;

    font-weight:850;

    white-space:nowrap;

    -webkit-tap-highlight-color:transparent;

}

.detail-buy-button{

    height:52px;

    border:0;

    border-radius:12px;

    background:#111;

    color:#fff;

    font-size:15px;

    font-weight:900;

    -webkit-tap-highlight-color:transparent;

}

.detail-icon-action:active,

.detail-add-cart-button:active,

.detail-buy-button:active{

    transform:scale(.98);

}



/* DETAIL_SKU_SELECTION_V1 */

.detail-size{
    appearance:none;
    -webkit-appearance:none;

    cursor:pointer;
    font-family:inherit;

    transition:
        background-color .14s ease,
        color .14s ease,
        border-color .14s ease,
        transform .14s ease;

    -webkit-tap-highlight-color:transparent;
}

.detail-size:not(.sold):active{
    transform:scale(.97);
}

.detail-size.selected{
    border-color:#111;
    background:#111;
    color:#fff;
    font-weight:850;
}

.detail-size.sold,
.detail-size:disabled{
    cursor:not-allowed;
    color:#bbb;
    border-color:#e5e5e5;
    background:#fafafa;
    text-decoration:line-through;
}

.detail-size-message{
    min-height:18px;
    margin-top:10px;

    color:#777;
    font-size:12px;
    line-height:1.5;
}

.detail-add-cart-button:disabled,
.detail-buy-button:disabled{
    opacity:.38;
    cursor:not-allowed;
    transform:none;
}



/* =========================================================

 * DETAIL_BRAND_ENTRY_UI_V1

 * ========================================================= */

/* 顶部：商品详情 + 品牌名，同字号同粗细 */

.detail-page .page-header-title{

    min-width:0;

    display:flex;

    align-items:center;

    justify-content:flex-start;

    gap:12px;

    text-align:left;

    overflow:hidden;

    white-space:nowrap;

}

.detail-page .detail-header-main,

.detail-page .detail-header-brand{

    color:#111;

    font-size:16px;

    line-height:1;

    font-weight:850;

    white-space:nowrap;

}

.detail-page .detail-header-brand{

    min-width:0;

    overflow:hidden;

    text-overflow:ellipsis;

}

/* 正文品牌 + 进入品牌 */

.detail-page .detail-brand-row{

    width:100%;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:12px;

}

.detail-page .detail-brand-row .detail-brand{

    min-width:0;

    overflow:hidden;

    text-overflow:ellipsis;

    white-space:nowrap;

}

.detail-page .detail-enter-brand{

    flex:0 0 auto;

    height:36px;

    min-width:100px;

    padding:0 15px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    box-sizing:border-box;

    border-radius:11px;

    background:#111;

    color:#fff;

    font-size:13px;

    line-height:1;

    font-weight:850;

    text-decoration:none;

    -webkit-tap-highlight-color:transparent;

}

.detail-page .detail-enter-brand:active{

    transform:scale(.98);

}


/* =========================================================

 * CART_SHEET_V1

 * 黑 / 白 / 黄

 * ========================================================= */

.cart-sheet-overlay{

    position:fixed;

    inset:0;

    z-index:9999;

    display:flex;

    align-items:flex-end;

    background:rgba(0,0,0,.42);

    opacity:0;

    transition:opacity .18s ease;

}

.cart-sheet-overlay.open{

    opacity:1;

}

.cart-sheet{

    width:min(720px,100%);

    max-height:82vh;

    margin:0 auto;

    padding:

        20px

        18px

        calc(18px + env(safe-area-inset-bottom));

    box-sizing:border-box;

    overflow-y:auto;

    border-radius:22px 22px 0 0;

    background:#fff;

    color:#111;

    transform:translateY(24px);

    transition:transform .22s ease;

    -webkit-overflow-scrolling:touch;

}

.cart-sheet-overlay.open .cart-sheet{

    transform:translateY(0);

}

.cart-sheet-close{

    position:absolute;

    right:18px;

    width:36px;

    height:36px;

    border:0;

    background:transparent;

    color:#111;

    font-size:28px;

    line-height:1;

}

.cart-sheet-product{

    display:grid;

    grid-template-columns:96px minmax(0,1fr);

    gap:14px;

    padding-right:38px;

}

.cart-sheet-image{

    width:96px;

    aspect-ratio:3/4;

    overflow:hidden;

    display:grid;

    place-items:center;

    border-radius:12px;

    background:#f3f3f3;

    color:#aaa;

    font-size:11px;

}

.cart-sheet-image img{

    width:100%;

    height:100%;

    object-fit:cover;

}

.cart-sheet-product-copy{

    min-width:0;

    display:flex;

    flex-direction:column;

}

.cart-sheet-product-copy strong{

    font-size:13px;

    font-weight:900;

}

.cart-sheet-product-copy p{

    margin:5px 0 7px;

    overflow:hidden;

    color:#666;

    font-size:12px;

    line-height:1.4;

    display:-webkit-box;

    -webkit-line-clamp:2;

    -webkit-box-orient:vertical;

}

.cart-sheet-product-copy b{

    font-size:21px;

    font-weight:900;

}

.cart-sheet-product-copy small{

    margin-top:auto;

    color:#777;

    font-size:11px;

}

.cart-sheet-block{

    margin-top:22px;

}

.cart-sheet-block h3{

    margin:0 0 11px;

    font-size:14px;

    font-weight:900;

}

.cart-sheet-options{

    display:flex;

    flex-wrap:wrap;

    gap:8px;

}

.cart-sheet-option{

    min-width:64px;

    min-height:40px;

    padding:8px 13px;

    border:1px solid #ddd;

    border-radius:10px;

    background:#fff;

    color:#111;

    font:inherit;

    font-size:12px;

    font-weight:700;

}

.cart-sheet-option.selected{

    border-color:#ffd900;

    background:#111;

    color:#fff;

    box-shadow:0 0 0 2px #ffd900;

}

.cart-sheet-option.sold,

.cart-sheet-option:disabled{

    color:#bbb;

    border-color:#eee;

    background:#fafafa;

    text-decoration:line-through;

}

.cart-sheet-option small{

    display:block;

    margin-top:2px;

    font-size:9px;

}

.cart-sheet-quantity{

    margin-top:24px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding-top:18px;

    border-top:1px solid #eee;

}

.cart-sheet-quantity > strong{

    font-size:14px;

    font-weight:900;

}

.cart-sheet-stepper{

    display:grid;

    grid-template-columns:38px 44px 38px;

    align-items:center;

    border:1px solid #ddd;

    border-radius:10px;

    overflow:hidden;

}

.cart-sheet-stepper button{

    height:38px;

    border:0;

    background:#f7f7f7;

    color:#111;

    font-size:18px;

}

.cart-sheet-stepper span{

    display:grid;

    place-items:center;

    height:38px;

    background:#fff;

    font-size:13px;

    font-weight:850;

}

.cart-sheet-message{

    min-height:18px;

    margin-top:10px;

    color:#b42318;

    font-size:12px;

    line-height:1.4;

}

.cart-sheet-submit{

    position:sticky;

    bottom:0;

    width:100%;

    height:52px;

    margin-top:8px;

    border:0;

    border-radius:13px;

    background:#ffd900;

    color:#111;

    font:inherit;

    font-size:15px;

    font-weight:900;

    box-shadow:0 -8px 18px rgba(255,255,255,.92);

}

.cart-sheet-submit:disabled{

    opacity:.42;

}

.cart-sheet-submit:not(:disabled):active{

    transform:scale(.99);

}