.product-tabs{margin-top:48px}
.product-tabbar{display:flex;overflow-x:auto;position:sticky;top:0;z-index:4;background:#fff;border-bottom:1px solid var(--line);scrollbar-width:none}
.product-tabbar::-webkit-scrollbar{display:none}
.product-tabbar button{flex:0 0 auto;border:0;border-bottom:2px solid transparent;background:none;min-height:52px;padding:0 18px;font-size:15px;font-weight:600;color:var(--muted);white-space:nowrap}
.product-tabbar button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--accent)}
.product-tabbar button:hover{color:var(--ink)}
.product-tabpanel{display:none;padding:28px 0 8px}
.product-tabpanel.is-active{display:block}
/* Without the script a hash link still opens its panel; once the script runs, the selected tab decides (pushState never moves :target). */
.product-tabs:not(.is-ready):has(.product-tabpanel:target) .product-tabpanel{display:none}
.product-tabs:not(.is-ready):has(.product-tabpanel:target) .product-tabpanel:target{display:block}
.product-copy{max-width:900px;margin:0 auto}
.product-copy h2,.product-tabs .reviews h2,.product-tabs .questions h2{font-size:18px;margin-bottom:12px}
.product-copy p{font-size:14px;line-height:1.75}
/* The shared top/bottom frame never renders wider than the Tmall detail images (790px). */
.product-tabpanel .product-frame{max-width:790px;margin:0 auto 16px}
.product-tabpanel .detail-images,.product-tabpanel .product-rich-content{max-width:900px;margin:0 auto 16px}
.product-tabs .reviews,.product-tabs .questions{max-width:900px;margin:0 auto;padding-top:28px;border-top:0}
.product-policy section{margin-top:32px}
.product-policy section:first-child{margin-top:0}
.product-policy h2{font-size:18px;margin:0 0 10px}
.product-policy h3{font-size:15px;margin:20px 0 8px}
.product-policy p,.product-policy li{font-size:14px;line-height:1.75}
.product-policy ul{padding-left:20px;margin:0 0 12px}
.product-policy li{margin-bottom:6px}
.product-policy a{text-decoration:underline;text-underline-offset:3px}
.info-table{width:100%;border-collapse:collapse;font-size:13px;margin:8px 0 16px}
.info-table th,.info-table td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top;line-height:1.7}
.info-table th{background:var(--surface);font-weight:600;white-space:nowrap}
.table-scroll{overflow-x:auto}
.pending{color:var(--subtle)}
.qa-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.qa-toolbar h2{margin:0}
.qa-count{font-size:13px}
.qa-toolbar .button{margin-left:auto;min-height:36px;padding:0 14px;font-size:13px}
.qa-login{margin:0 0 0 auto}
.qa-list{border-top:1px solid var(--line)}
.qa-row{border-bottom:1px solid var(--line)}
.qa-line{display:flex;align-items:center;gap:8px 12px;width:100%;min-height:52px;padding:10px 2px;border:0;background:transparent;text-align:left;color:inherit;font:inherit}
.qa-line:hover{background:var(--surface)}
.qa-status{flex:0 0 auto;min-width:64px;font-size:12px;font-weight:700}
.qa-status.is-done{color:#147a3d}
.qa-status.is-wait{color:var(--subtle)}
.qa-preview{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.qa-who,.qa-line time{flex:0 0 auto;font-size:12px;color:var(--muted)}
.qa-line::after{content:'';width:7px;height:7px;border-right:1.5px solid var(--subtle);border-bottom:1.5px solid var(--subtle);transform:rotate(45deg);flex:0 0 auto}
.qa-line[aria-expanded=true]::after{transform:rotate(-135deg);margin-top:4px}
.qa-body{padding:0 8px 14px 76px}
.question-dialog{width:min(480px,calc(100% - 32px))}
.question-dialog textarea{height:96px;min-height:96px;max-height:140px}
.question-dialog label{margin:12px 0}
.question-dialog .button{min-height:42px}
@media(max-width:768px){
.product-tabs{margin-top:32px}
.product-tabbar button{min-height:48px;padding:0 14px;font-size:14px}
.qa-line{flex-wrap:wrap;align-items:center}
.qa-preview{flex:1 1 calc(100% - 92px)}
.qa-who,.qa-line time{margin-left:76px}
.qa-line time{margin-left:0}
.qa-body{padding-left:8px}
}
