#detail{width:min(1080px,calc(100% - 40px));scrollbar-gutter:stable}
.detail-close-bar{position:sticky;top:14px;height:0;z-index:5;display:flex;justify-content:flex-end;padding-right:14px;pointer-events:none}
.detail-close-bar .close{position:static;pointer-events:auto;flex-shrink:0}
#detail .detail-grid{align-items:start;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
#detail .detail-gallery{position:sticky;top:0;padding:40px 24px 24px;border-radius:22px 0 0 0}
#detail-full-image{display:block;cursor:zoom-in;border-radius:12px}
#detail-image{height:420px;max-width:100%}
#photo-caption{min-height:34px;line-height:1.7;margin:14px 0 10px}
#detail-thumbnails{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
#detail-thumbnails button{width:72px;flex:0 0 72px;padding:4px;border:1px solid transparent;border-radius:9px;background:#ffffff80;font-size:10px;line-height:1.4}
#detail-thumbnails button[aria-pressed=true]{border-color:#28685b;background:#fffdf7;box-shadow:0 0 0 1px #28685b}
#detail-thumbnails button img{display:block;width:100%;height:56px;object-fit:contain;border-radius:5px}
#detail-thumbnails button span{display:block;margin-top:4px}
.gallery-hint{font-size:10px;color:#747b70;text-align:center;margin:14px 0 0;line-height:1.6}
.detail-info{min-width:0}
.detail-section{border-top:1px solid #dce0d4;padding:18px 0 0;margin-top:20px}
.detail-section h3{font-size:14px;font-weight:600;margin:0 0 9px}
.detail-section p{font-size:12px;line-height:1.9;margin:0;color:#647469}
.detail-info .detail-source-note{font-size:10px!important;line-height:1.7!important;color:#82877b!important;margin:23px 0 16px}
.detail-size-chart{margin-top:18px;border:1px solid #dce0d4;border-radius:10px;padding:12px}
.detail-size-chart summary{cursor:pointer;font-size:12px;line-height:1.6}
.size-table-scroll{max-width:100%;overflow:auto;margin-top:12px}
.detail-size-chart table{width:100%;border-collapse:collapse;font-size:11px;white-space:nowrap}
.detail-size-chart caption{text-align:left;font-size:10px;color:#747b70;padding-bottom:9px}
.detail-size-chart th,.detail-size-chart td{padding:8px 6px;border-bottom:1px solid #dce0d4;text-align:center;font-weight:400}
.detail-size-chart thead{background:#edf0e8}
.detail-size-chart p{font-size:10px;line-height:1.7;color:#747b70}
#detail .start-area{position:sticky;bottom:0;background:#fbf9f3ed;padding:12px 0;backdrop-filter:blur(8px);z-index:2}
@media(max-width:750px){
 #detail{width:calc(100% - 24px)}
 #detail .detail-grid{grid-template-columns:1fr}
 #detail .detail-gallery{position:static;padding:24px 16px 16px;border-radius:18px 18px 0 0}
 #detail-image{height:clamp(240px,72vw,420px)}
 #detail-thumbnails{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding:3px;scrollbar-width:thin}
 #detail-thumbnails button{width:68px;flex-basis:68px}
 .detail-close-bar{top:10px;padding-right:10px}
 #detail .detail-info{padding:24px 22px}
 #detail .detail-info h2{font-size:26px}
}

#detail-thumbnails[hidden]{display:none}
#detail-colors{margin-top:18px}
#detail-colors .card-colors{border:0;padding:0;margin:0;gap:10px}
#detail-colors .card-colors-label{font-size:13px}
#detail-colors .card-color-choice{width:40px;height:40px;flex-basis:40px}
#detail-colors .card-color-dot{width:24px;height:24px}
#detail-colors[aria-busy=true] .card-colors-label::after{content:' · 换色中…';color:#747b70}
.filters{min-width:0;flex-wrap:wrap}
.card[data-product^=tshirt-] .card-photo img{padding:0;object-fit:contain}
.card[data-product^=tshirt-] .card-color-choice{width:32px;height:32px;flex-basis:32px}
@media(max-width:650px){.filters{flex-wrap:nowrap}.card[data-product^=tshirt-] .card-color-choice{width:36px;height:36px;flex-basis:36px}}
