/* Secondary customer screens only. The live scene, featured card and player stay untouched. */
body:has(#portal) #portal .sub-title{min-height:44px;margin-bottom:8px;padding:0 44px;}
body:has(#portal) #portal .sub-title>button{top:0;left:0;min-width:44px;min-height:44px;}
body:has(#portal) #portal .mobile-order{margin-block:8px;padding:12px;}
body:has(#portal) #portal .order-card-head{gap:8px;padding-bottom:8px;}
body:has(#portal) #portal .order-product{padding-block:8px;}
body:has(#portal) #portal .order-product p{margin:3px 0;}
body:has(#portal) #portal .order-footer{gap:6px;margin-top:8px;padding-top:8px;}
body:has(#portal) #portal .order-footer :is(button,a){min-height:44px;padding:7px 12px;}
body:has(#portal) #portal .customer-cart-row{grid-template-columns:64px minmax(0,1fr);gap:10px;padding-block:10px;}
body:has(#portal) #portal .customer-cart-thumb{width:64px;height:64px;border-radius:7px;}
body:has(#portal) #portal .customer-cart-sku{margin:3px 0 5px;white-space:normal;overflow-wrap:anywhere;}
body:has(#portal) #portal .customer-cart-actions{gap:8px;margin-top:5px;}
body:has(#portal) #portal .customer-cart-actions :is(input,button){min-height:44px;height:auto;}
body:has(#portal) #portal>.panel:has(#placeOrder){padding:12px;}
body:has(#portal) #portal>.panel:has(#placeOrder)>h2{margin:0 0 6px;font-size:16px;}
body:has(#portal) #portal>.panel:has(#placeOrder)>label{margin-block:8px;}
body:has(#portal) #portal .member-section:has(#newAddress){padding:12px;}
body:has(#portal) #portal .address-fields{column-gap:10px;margin-block:5px 8px;}
body:has(#portal) #portal .address-fields>label{gap:4px;margin-block:4px;}
body:has(#portal) #portal .region-fields{margin-block:4px;}
body:has(#portal) #portal :is(.address-fields input,.region-fields select){min-height:44px;font-size:16px;}
body:has(#portal) #portal .address-card{padding:12px;margin:8px 0;}
body.checkout-view #portal :is(.payment-address,.payment-order){padding:12px;margin-block:9px;}
body.checkout-view #portal .payment-store{padding-bottom:8px;}
body.checkout-view #portal .payment-product{padding-block:6px;}
body.checkout-view #portal .payment-product :is(h3,p){margin-block:3px;}
body.checkout-view #portal .payment-totals{margin-top:8px;padding-top:6px;}
body.checkout-view #portal .payment-totals>div{padding-block:4px;}
body.checkout-view #portal .payment-channel select{min-height:44px;font-size:16px;}

/* 底部只留一层导航空间，避免旧版和新版重复留白。 */
body.lite-customer-shell:has(#portal){padding-bottom:0;}
body.lite-customer-shell:has(#portal) #portal{padding-bottom:calc(128px + env(safe-area-inset-bottom));}
body.lite-customer-shell.member-view:has(#portal) .portal-header{min-height:48px;padding:4px 14px;}
body.lite-customer-shell:has(#portal>.sub-title) #portal{padding-top:12px;padding-inline:12px;}
body.lite-customer-shell:has(#portal>.sub-title) #portal>.member-section{margin:8px 0;padding:12px;}
body:has(#portal) #portal .empty-state{padding:24px 12px;}
body:has(#portal) #portal .empty-state svg{width:40px;height:40px;}
body:has(#portal) #portal .portal-empty p{margin:10px 0 6px;}
body:has(#portal) #portal .portal-empty-actions{margin-top:12px;}
body:has(#portal) #portal :is(#portalAddressStatus,#portalMessageStatus,#portalOrdersStatus):empty{display:none;}

/* 地址和消息里的卡片与其他页面对齐，保留完整文字。 */
body:has(#portal) #portal :is(.feedback-card,.complaint-record){margin:8px 0;padding:12px;}
body:has(#portal) #portal .address-card p{margin:6px 0 0;line-height:1.6;}
body:has(#portal) #portal .feedback-card>p{margin:0 0 6px;line-height:1.6;}
body:has(#portal) #portal .feedback-card>div{margin-top:8px;padding:8px;line-height:1.6;}
body:has(#portal) #portal .member-section:has(#feedbackForm)>.hint{margin:6px 0 8px;line-height:1.6;}
body:has(#portal) #portal #feedbackForm>label{margin:8px 0;}
body:has(#portal) #portal .coupon-card{margin:8px 0;padding:12px;gap:10px;}
body:has(#portal) #portal .coupon-card p{margin:3px 0;line-height:1.6;}
body:has(#portal) #portal .coupon-card small{display:block;margin-top:4px;line-height:1.5;}

/* 设置页统一边距，去掉卡片外面重复的一层空白。 */
body:has(#portal) #portal .member-settings{padding:0;gap:8px;}
body:has(#portal) #portal .member-settings-card{padding:12px;}
body:has(#portal) #portal .member-setting-row{gap:8px;line-height:1.5;}
body:has(#portal) #portal .member-settings #chatSizePreview{margin:6px 0 8px;padding:8px 10px;}
body:has(#portal) #portal .member-settings .page-font-row{padding-top:8px;}
body:has(#portal) #portal .member-switch-account{margin-top:8px;padding-top:6px;}
body:has(#portal) #portal .member-settings .member-switch-account>summary{min-height:44px;padding-block:6px;}
body:has(#portal) #portal .member-switch-account form{gap:8px;margin-top:8px;}

/* 奖励金额、明细和提现操作收紧间距，保留全部内容。 */
body:has(#portal) #portal .member-reward-detail-head{gap:8px;margin-bottom:6px;}
body:has(#portal) #portal .member-reward-detail .vr-wallet{padding:12px;gap:8px;}
body:has(#portal) #portal .member-reward-detail .vr-wallet b{margin-top:4px;}
body:has(#portal) #portal .member-reward-detail .vr-center-footnote{margin:6px 0 10px;line-height:1.6;}
body:has(#portal) #portal .member-reward-detail .vr-history-heading{margin:12px 0 6px;}
body:has(#portal) #portal .member-reward-detail .vr-history{padding:0 10px;}
body:has(#portal) #portal .member-reward-detail .vr-history-row{padding:8px 0;gap:8px;}
body:has(#portal) #portal .member-reward-detail .vr-history-row small{margin-top:2px;line-height:1.5;}
body:has(#portal) #portal .member-reward-detail .vr-withdraw{margin-top:10px;padding:0 12px;}
body:has(#portal) #portal .member-reward-detail .vr-withdraw[open]{padding-bottom:10px;}
body:has(#portal) #portal .member-reward-detail .vr-withdraw>summary{min-height:44px;box-sizing:border-box;padding-block:6px;}
body:has(#portal) #portal .member-reward-detail .vr-withdraw form{grid-template-columns:minmax(88px,.65fr) minmax(0,1.35fr);gap:8px;margin-top:8px;}
body:has(#portal) #portal .member-reward-detail .vr-withdraw form>label{margin:0;line-height:1.5;}
body:has(#portal) #portal .member-reward-detail .vr-hint{margin:6px 0;padding:6px 0;line-height:1.6;}
body:has(#portal) #portal .member-reward-detail .vr-withdraw :is(input,button){min-height:44px;padding:8px 10px;}
body:has(#portal) #portal .member-reward-detail .vr-record{padding-top:8px;gap:4px 8px;}
body:has(#portal) #portal .account-stat p{margin:8px 0 0;}

body:has(#portal) #portal .complaint-record-note{margin:8px 0;line-height:1.6;}
body:has(#portal) #portal .complaint-history-link{display:inline-flex;align-items:center;min-height:44px;margin:6px 0;}
body:has(#portal) #portal .complaint-pending{margin:8px 0;padding:10px 12px;gap:8px;}
body:has(#portal) #portal .complaint-pending button{min-height:44px;}
body:has(#portal) #portal .complaint-record p{margin:6px 0;line-height:1.6;}
body:has(#portal) #portal .complaint-record ol{margin:8px 0;padding-inline-start:20px;}
body:has(#portal) #portal .complaint-reply{padding:8px;line-height:1.6;}

/* A readable body and visible actions, rather than a large empty modal. */
body:has(#portal) #memberDialog{width:min(calc(100vw - 24px),390px);max-height:84dvh;padding:14px;}
body:has(#portal) #memberDialog .info-title{gap:8px;align-items:center;margin-bottom:10px;}
body:has(#portal) #memberDialog .info-title h2{font-size:16px;line-height:1.45;margin:0;}
body:has(#portal) #memberDialog .info-title>button{flex:none;min-width:44px;min-height:44px;padding:0;}
body:has(#portal) #memberDialog .customer-order-status{gap:3px;padding-block:6px;}
body:has(#portal) #memberDialog .customer-order-reference{font-size:11px;line-height:1.5;margin-block:8px;}
body:has(#portal) #memberDialog .customer-order-detail .order-product{gap:10px;padding-block:8px;}
body:has(#portal) #memberDialog .customer-order-detail .order-thumb{width:56px;height:56px;flex-basis:56px;}
body:has(#portal) #memberDialog .customer-order-totals{margin-block:8px;}
body:has(#portal) #memberDialog .customer-order-totals>div{gap:6px;padding-block:4px;}
body:has(#portal) #memberDialog .customer-order-address{margin-block:10px;}
body:has(#portal) #memberDialog .customer-order-address p{margin-block:4px;}
body:has(#portal) #memberDialog #memberForm{margin:0;}
body:has(#portal) #memberDialog #memberForm>label{display:block;margin-block:8px;}
body:has(#portal) #memberDialog #memberForm>button.solid{width:100%;min-height:44px;margin-top:10px;}
body:has(#portal) #memberDialog :is(input:not([type=checkbox]):not([type=radio]),select,textarea){font-size:16px;min-height:44px;}
#viewerProfileEditor{padding:16px;}
#viewerProfileEditor .profile-intro{margin-block:6px 10px;}
#viewerProfileEditor .profile-preview{margin-block:8px;}

/* 头像、昵称和随机按钮从左到右排列；更多选项单独滚动，保存区保持可见。 */
body:has(:is(#portal,.room)) #viewerProfileEditor{
  width:min(calc(100vw - 24px),360px);max-width:calc(100vw - 24px);
  padding:12px 14px;border-radius:12px;overscroll-behavior:contain;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-editor-form{
  display:grid;grid-template-columns:44px minmax(0,1fr) 88px;gap:8px;min-width:0;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-editor-form> *{grid-column:1/-1;min-width:0;}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-editor-form>header{
  position:static;inset:auto;gap:8px;min-height:44px;margin:0;
}
body:has(:is(#portal,.room)) #viewerProfileEditor h2{font-size:17px;line-height:1.4;}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-editor-form>header [data-close]{
  width:44px;height:44px;min-width:44px;min-height:44px;padding:0;flex:none;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-intro{margin:0;font-size:12px;line-height:1.5;}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-secondary-label{padding-top:6px;font-size:12px;}
body:has(:is(#portal,.room)) #viewerProfileEditor:has([data-wechat][hidden]) :is(.profile-intro,.profile-secondary-label){display:none;}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-wechat{margin:0;min-height:44px;}
body:has(:is(#portal,.room)) #viewerProfileEditor [data-anonymous]{margin:0;padding:7px;font-size:11px;}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-preview{
  grid-column:1;display:flex;align-items:center;margin:0;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-preview img{width:44px;height:44px;}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-editor-form>[data-random]{
  grid-column:3;align-self:center;min-width:0;min-height:44px;padding:5px 6px;font-size:12px;line-height:18px;white-space:nowrap;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-nickname{
  grid-column:2;align-self:center;margin:0;font-size:0;line-height:0;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-nickname input{
  width:100%;min-width:0;height:44px;margin:0;padding:7px 8px;font-size:16px;line-height:24px;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-more{margin:0;}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-more>summary{padding:6px 0;line-height:24px;}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-more .profile-name-options{
  flex-wrap:nowrap;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;margin:4px 0;padding:2px;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-more .profile-name-options>[data-name]{
  flex:0 0 auto;min-height:32px;margin:0;padding:3px 8px;font-size:12px;line-height:20px;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-library-count{margin:6px 0 0;font-size:11px;}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-avatar-grid{
  grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;max-height:clamp(56px,calc(82dvh - 322px),154px);overflow-y:auto;
  overscroll-behavior-y:contain;padding:6px 3px;margin:0;scroll-padding:4px;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-avatar-grid button{min-width:0;min-height:0;}
body:has(:is(#portal,.room)) #viewerProfileEditor [data-message]{margin:0;font-size:12px;line-height:18px;}
body:has(:is(#portal,.room)) #viewerProfileEditor [data-message]:empty{display:none;}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-editor-form>footer{
  position:sticky;left:auto;right:auto;bottom:0;z-index:1;display:flex;flex-wrap:nowrap;gap:8px;
  margin:0;padding:8px 0 0;border-top:1px solid #e5ebf2;background:#fff;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-editor-form>footer button{
  height:44px;min-height:44px;margin:0;padding:7px 10px;
}
body:has(:is(#portal,.room)) #viewerProfileEditor .profile-editor-form>footer .profile-save{flex:1;min-width:0;}
#viewerComplaintDialog:not([data-inline=true]){padding:16px;}
#viewerComplaintDialog label{margin-block:8px 5px;}
#viewerComplaintDialog :is(select,textarea){font-size:16px;}

/* Original V1 commerce sheets keep the same controls and images, with content-sized frames. */
body.floating-commerce #sheet.cart-sheet:not(.commerce-list-sheet):not(.commerce-detail-sheet){height:auto;max-height:min(82dvh,660px);}
html body.floating-commerce #sheet.cart-sheet.commerce-list-sheet{height:auto;max-height:min(74dvh,600px);}
html body.floating-commerce #sheet.cart-sheet.commerce-detail-sheet{height:auto;max-height:min(82dvh,660px);}
#sheet.cart-sheet.commerce-detail-sheet #sheetBody{flex:0 1 auto;min-height:0;overflow-y:auto;}
#sheet.cart-sheet:has(.room-commerce) .sheet-head{min-height:44px;margin-bottom:5px;}
#sheet.cart-sheet:has(.room-commerce) .sheet-head #closeSheet{min-width:44px;min-height:44px;}
#sheet.cart-sheet.commerce-list-sheet .commerce-toolbar{padding-block:3px 8px;gap:10px;}
#sheet.cart-sheet.commerce-list-sheet .commerce-toolbar :is(input,a){min-height:44px;box-sizing:border-box;}
#sheet.cart-sheet.commerce-list-sheet .commerce-toolbar a{display:inline-flex;align-items:center;}
#sheet.cart-sheet.commerce-list-sheet .commerce-item{min-height:96px;gap:10px;padding:10px 0;}
#sheet.cart-sheet.commerce-list-sheet .commerce-thumb{width:72px;height:72px;flex:none;}
#sheet.cart-sheet.commerce-list-sheet .commerce-info{min-width:0;}
#sheet.cart-sheet.commerce-list-sheet .commerce-info p{margin-block:4px 6px;}
#sheet.cart-sheet.commerce-list-sheet .commerce-item-bottom{gap:6px;flex-wrap:wrap;}
#sheet.commerce-detail-sheet .commerce-detail-image{width:min(100%,200px);height:auto;aspect-ratio:1;margin-inline:auto;}
#sheet.commerce-detail-sheet .commerce-detail-info{padding:9px 10px;margin-top:7px;}
#sheet.commerce-detail-sheet .commerce-detail-info h3{margin-block:4px;}
#sheet.commerce-detail-sheet>#detailActionbar{padding-block:8px calc(8px + env(safe-area-inset-bottom));}
#sheet.cart-sheet .room-commerce :is(.commerce-primary,.commerce-secondary,.commerce-skus>button){min-height:44px;}
#sheet.cart-sheet .room-commerce .commerce-skus{padding:9px;margin-top:7px;}
#sheet.cart-sheet .room-commerce .commerce-skus>button{padding:8px 10px;margin-block:5px;}
#sheet.cart-sheet .room-commerce .commerce-quantity{padding:8px 10px;margin-top:7px;}
#sheet.cart-sheet .room-commerce .commerce-quantity button{width:44px;height:44px;}
#sheet.cart-sheet .room-commerce #skuQty{width:56px;min-height:44px;font-size:16px;}
#sheet.cart-sheet .room-commerce label :is(input:not([type=checkbox]):not([type=radio]),select){font-size:16px;min-height:44px;}
#sheet.cart-sheet .room-commerce .region-fields select{font-size:16px;height:auto;min-height:44px;}

@media(max-width:360px){
  body:has(#portal) #portal .customer-cart-row{grid-template-columns:56px minmax(0,1fr);gap:8px;}
  body:has(#portal) #portal .customer-cart-thumb{width:56px;height:56px;}
  #sheet.cart-sheet.commerce-list-sheet .commerce-thumb{width:64px;height:64px;}
}
