/* Shared storefront and merchant design tokens: Beiming platinum / electric. */
:root {
  --bm-paper:#F5F6F1;
  --bm-ink:#20251F;
  --bm-muted:#62675E;
  --bm-soft:#E9ECE3;
  --bm-field:#F1F3EC;
  --bm-selected:#EBF7C8;
  --bm-white:#FFFFFF;
  --bm-line:#DFE3D9;
  --bm-dark:#242923;
  --bm-dark-soft:#30372E;
  --bm-dark-border:#42493E;
  --bm-dark-hover:#343E2E;
  --bm-on-dark:#E6E9DF;
  --bm-muted-dark:#ADB6A5;
  --bm-accent:#D2FA41;
  --bm-accent-hover:#C1EB2B;
  --bm-focus:#526923;
  --bm-link:#3F4B31;
  --bm-font:'DM Sans','Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif;
  --paper:var(--bm-paper);
  --ink:var(--bm-ink);
  --muted:var(--bm-muted);
  --soft:var(--bm-soft);
  --selected:var(--bm-selected);
  --line:var(--bm-line);
  --charcoal:var(--bm-dark);
  --on-dark:var(--bm-on-dark);
  --accent:var(--bm-focus);
  --accent-hover:var(--bm-link);
  --electric:var(--bm-accent);
  --electric-hover:var(--bm-accent-hover);
}

/* Shared size roles: public shop and merchant console use the same scale. */
:root{
 --bm-text-body:16px;
 --bm-text-title:28px;
 --bm-text-section:17px;
 --bm-text-label:16px;
 --bm-text-note:14px;
 --bm-text-action:16px;
 --bm-radius:4px;
 --bm-button-height:46px;
 --bm-control-height:46px;
 --bm-panel-padding:24px;
 --bm-control-fill:#EDF0E7;
}
body{font-family:var(--bm-font);font-size:var(--bm-text-body)}
body:not(.merchant-admin) .button{font-size:var(--bm-text-action);border-radius:var(--bm-radius)!important}
body:not(.merchant-admin) .panel{padding:var(--bm-panel-padding);border-radius:var(--bm-radius)!important}
body:not(.merchant-admin) .field>span{font-size:var(--bm-text-label)}
body:not(.merchant-admin) .field small{font-size:var(--bm-text-note)}
body:not(.merchant-admin) .field :is(input:not([type=checkbox]):not([type=radio]),select,textarea){font-size:var(--bm-text-label);min-height:var(--bm-control-height);background:var(--bm-control-fill)!important;border-radius:var(--bm-radius)!important}
body:not(.merchant-admin) .seller-shop .catalogue-title h2{font-size:var(--bm-text-title)}
@media(max-width:800px){:root{--bm-panel-padding:20px}body:not(.merchant-admin) .field :is(input:not([type=checkbox]):not([type=radio]),select,textarea){font-size:16px}}

/* Readable commerce scale, including public utility text and purchase flows. */
body:not(.merchant-admin){font-size:var(--bm-text-body)!important}
body:not(.merchant-admin) :is(.small,.notice,.status,.announcement,.store-announcement,.store-ticker,.store-announcement a,.store-ticker .button,.electric-store-note,.electric-filter-summary,.electric-list-head,.footer,.footer-copy,.footer-right,.captcha-status,.checkout-draft-note,.order-edit-link,.purchase-cost-note,.purchase-guide dt,.purchase-guide dd,.service-tags span,.service-spec dl>div,.order-product-text .small,.order-reference span,.order-next-step,.email-notify-option){font-size:var(--bm-text-note);line-height:1.7}
body:not(.merchant-admin) :is(.account-login,.user-link,.hero-secondary,.store-category-rail h2,.catalogue-controls,.catalogue-controls .button,.display-controls .button,.seller-filter,.seller-filter select,.shop-search-form .button,.purchase-guide summary,.order-steps strong){font-size:var(--bm-text-label)}
body:not(.merchant-admin) .electric-categories small{font-size:var(--bm-text-note)}
body:not(.merchant-admin) .shop-search-form{height:46px}
body:not(.merchant-admin) .shop-search-form input{font-size:16px}
body:not(.merchant-admin) .button{min-height:var(--bm-button-height);line-height:1.5}
body:not(.merchant-admin) .button.compact{min-height:40px}
body:not(.merchant-admin) .catalogue-controls select{font-size:14px;min-height:40px;max-width:170px}
body:not(.merchant-admin) :is(.catalogue-controls .button,.display-controls .button){min-height:40px}
body:not(.merchant-admin) :is(.store-grid-card>.grid-product-description,.compact-product-info p){font-size:14px;line-height:1.7}
body:not(.merchant-admin) :is(.grid-product-bottom .button,.compact-product-buy .button){font-size:16px;min-height:44px}
body:not(.merchant-admin) .compact-product-row{min-height:96px}
body:not(.merchant-admin) .compact-product-price strong{font-size:22px}
body:not(.merchant-admin) :is(.compact-product-price small,.grid-product-bottom small){font-size:14px}
body:not(.merchant-admin) .grid-product-bottom>strong{font-size:26px}
body:not(.merchant-admin) .grid-product-meta{line-height:1.7}
body:not(.merchant-admin) .order-product-text h3{font-size:17px;line-height:1.6}
body:not(.merchant-admin) :is(.panel h3,.auth-box h2){font-size:20px}
body:not(.merchant-admin) .order-product-price{font-size:20px}
body:not(.merchant-admin) :is(th,td){font-size:16px;padding:15px 14px}
body:not(.merchant-admin) .hero-actions .button{font-size:16px;min-height:46px}
body:not(.merchant-admin) .carousel-slide p{font-size:16px}
body:not(.merchant-admin) .carousel-controls .button{font-size:14px;min-height:36px}
body:not(.merchant-admin) .order-steps span{font-size:14px}
body:not(.merchant-admin) .checkout-columns>.panel:last-child .field:has(.check){font-size:14px}
@media(max-width:720px){
 body:not(.merchant-admin) :is(.store-grid-card h3,.compact-product-info h3){font-size:16px;line-height:1.6}
 body:not(.merchant-admin) .store-grid-card{padding:14px;gap:12px}
 body:not(.merchant-admin) .compact-product-row{grid-template-columns:32px minmax(0,1fr) 68px 72px!important;gap:8px!important;padding:14px 9px!important;min-height:96px}
 body:not(.merchant-admin) .compact-product-price strong{font-size:18px}
 body:not(.merchant-admin) .compact-product-buy .button{font-size:15px;width:72px}
 body:not(.merchant-admin) .grid-product-bottom>strong{font-size:24px}
 body:not(.merchant-admin) .page-title h1{font-size:26px}
 body:not(.merchant-admin) .carousel-controls{flex-wrap:wrap;padding:6px 8px}
 body:not(.merchant-admin) .captcha-row{flex-wrap:wrap}
 body:not(.merchant-admin) .captcha-row>input{flex-basis:120px}
 body:not(.merchant-admin) .store-announcement{flex-wrap:wrap}
 body:not(.merchant-admin) .store-announcement p{flex-basis:60%}
}
@media(max-width:380px){
 body:not(.merchant-admin) .compact-product-row{grid-template-columns:28px minmax(0,1fr) 64px!important;gap:7px!important}
 body:not(.merchant-admin) .compact-product-icon{grid-column:1;grid-row:1;width:28px;height:28px}
 body:not(.merchant-admin) .compact-product-info{grid-column:2;grid-row:1}
 body:not(.merchant-admin) .compact-product-price{grid-column:3;grid-row:1}
 body:not(.merchant-admin) .compact-product-buy{grid-column:2/-1}
 body:not(.merchant-admin) .compact-product-buy .button{width:100%}
}


/* A single compact notification, with readable full text and explicit playback. */
body:not(.merchant-admin) .store-ticker{gap:14px;padding:14px 0;font-size:14px;min-width:0}
.ticker-actions{display:flex;align-items:center;gap:14px;flex:none}
body:not(.merchant-admin) .store-ticker .button{font-size:14px;min-height:36px;white-space:nowrap}
.notification-full{font-size:16px;line-height:1.85;white-space:pre-wrap;overflow-wrap:anywhere;max-height:60vh;overflow-y:auto}
@media(max-width:720px){body:not(.merchant-admin) .store-ticker{gap:10px}.ticker-actions{gap:10px}}
@media(prefers-reduced-motion:reduce){.store-ticker .ticker-track{padding-left:0;white-space:nowrap;animation:none!important}.store-ticker .ticker-window{overflow:hidden}.store-ticker [data-action="ticker-pause"]{display:none}}

.slider-scene{width:100%;aspect-ratio:300/144;position:relative;overflow:hidden;margin:14px 0;background:var(--bm-soft);border-radius:4px}
.slider-background{display:block;width:100%;height:100%;object-fit:fill}
.slider-piece{position:absolute;width:16%;height:33.333%;filter:drop-shadow(0 1px 2px #0008);pointer-events:none}
.auth-captcha .slider-range{width:100%;height:46px;min-height:46px;accent-color:var(--bm-focus);touch-action:pan-y;cursor:ew-resize;padding:0!important;background:var(--bm-soft)!important}
.auth-captcha.verified .slider-range{opacity:.5}
.auth-captcha.verified .captcha-status{color:var(--bm-focus)}
.auth-captcha .captcha-status{font-size:14px;line-height:1.7}

:root{--bm-on-accent:#20251F;--bm-accent-icon:brightness(0)}
.button.primary,button[type=submit].primary,.electric-categories .button.active,.carousel-controls .button.active,.sku-options .button.selected{color:var(--bm-on-accent)!important}
.button.primary .icon{filter:var(--bm-accent-icon)!important}
.compact-product-row:hover{background:var(--bm-selected)}
.compact-product-row:nth-child(2n){background:var(--bm-soft)}

:root{--bm-highlight:var(--bm-accent)}
body:not(.merchant-admin) .buy-panel .sku-options .button.selected{color:var(--bm-on-accent)!important}
body:not(.merchant-admin) .electric-categories .active small{color:inherit}
body:not(.merchant-admin) .buy-panel .price,body:not(.merchant-admin) .checkout-columns>.panel:last-child .totals.final{color:var(--bm-highlight)!important}
.auth-captcha .captcha-status{flex:1;min-width:0}
.auth-captcha [data-action="slider-verify"]{flex:none;min-width:88px;white-space:nowrap;align-self:flex-start}
body:not(.merchant-admin) .auth-tabs a.active{color:var(--bm-on-accent)}

/* One store identity at legible, stable sizes across the shop. */
.store-portrait{display:block;object-fit:cover;aspect-ratio:1;border-radius:4px;flex:none}
body:not(.merchant-admin) .brand{font-size:27px!important;letter-spacing:-.5px;gap:12px!important}
body:not(.merchant-admin) .brand .brand-logo{width:44px!important;height:44px!important;border-radius:4px}
body:not(.merchant-admin) .topbar.shell{gap:36px}
.store-auth-avatar.auth-symbol{width:72px;height:72px;margin:22px auto 18px;background:transparent}
.store-auth-avatar .store-portrait{width:72px;height:72px}
.store-contact-brand{display:flex;align-items:center;gap:14px}
.store-contact-brand .store-portrait{width:48px;height:48px}
.store-contact-brand span{font-size:14px;color:var(--bm-muted)}
@media(max-width:1100px){body:not(.merchant-admin) .topbar.shell{gap:24px}body:not(.merchant-admin) .brand small{display:none}}
@media(max-width:800px){body:not(.merchant-admin) .brand{font-size:24px!important}body:not(.merchant-admin) .brand .brand-logo{width:38px!important;height:38px!important}body:not(.merchant-admin) .topbar.shell{gap:14px}}

/* Tablet: keep the real icon, title, price and action in separate columns. */
@media(min-width:721px) and (max-width:800px){
 .store-carousel .electric-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .carousel-media{height:360px}
 body:not(.merchant-admin) .compact-product-row{grid-template-columns:42px minmax(0,1fr) 88px 94px!important;gap:14px!important;padding:16px!important}
 body:not(.merchant-admin) .compact-product-icon{width:42px;height:42px}
 body:not(.merchant-admin) .compact-product-buy .button{width:94px;white-space:nowrap}
 .electric-list-head{grid-template-columns:minmax(0,1fr) 88px 94px;gap:14px;padding-left:16px;padding-right:16px}
}

/* The default carousel shows current store merchandise; uploaded banners retain priority. */
.hero-service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;height:360px;padding:24px;background:var(--bm-dark-soft);align-self:stretch;min-width:0}
.hero-service-item{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:7px;min-width:0;min-height:0;padding:14px 18px;background:var(--bm-field);color:var(--bm-ink);overflow:hidden}
.hero-service-image{display:flex;align-items:center;justify-content:flex-start;width:100%;height:72px;min-width:0;min-height:36px;flex:1;max-height:100px}
.hero-service-image img{display:block;width:100%;height:100%;object-fit:contain;object-position:left center}
.hero-service-image .icon{width:56px;height:56px}
.hero-service-item strong{font-size:17px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hero-service-info{font-size:14px;line-height:1.5;color:var(--bm-muted)}
.hero-service-item:hover{background:var(--bm-selected)}
.hero-service-feature{grid-template-columns:minmax(0,1fr)}
.hero-service-feature .hero-service-image{height:230px;max-height:230px;justify-content:center}
.hero-service-feature .hero-service-image img{object-position:center}
.hero-service-feature .hero-service-item{align-items:center;text-align:center}
.hero-service-grid:has(>.hero-service-item:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr));align-content:center}
.hero-service-grid:has(>.hero-service-item:nth-child(2):last-child) .hero-service-image{height:150px;max-height:150px}
@media(min-width:1600px){.hero-service-grid{height:380px}}
@media(max-width:1100px){.hero-service-grid{padding:18px;gap:10px}.hero-service-item{padding:12px}.hero-service-item strong{font-size:16px}.hero-service-image{height:64px}}
@media(max-width:720px){
 .store-carousel .electric-hero:has(.hero-service-grid){grid-template-columns:minmax(0,1fr)}
 .hero-service-grid{grid-template-columns:repeat(var(--hero-items),minmax(0,1fr));height:auto;padding:12px;gap:8px;min-height:128px}
 .hero-service-item{padding:10px 7px;gap:6px;justify-content:flex-start}
 .hero-service-image{height:44px;justify-content:center;flex:none}
 .hero-service-image img{object-position:center}
 .hero-service-image .icon{width:40px;height:40px}
 .hero-service-item strong{font-size:12px;line-height:1.5;-webkit-line-clamp:2}
 .hero-service-info{display:none}
 .hero-service-feature .hero-service-item{flex-direction:row;align-items:center;gap:18px;text-align:left;padding:8px 14px}
 .hero-service-feature .hero-service-image{width:45%;height:92px;flex:none}
 .hero-service-feature .hero-service-item strong{font-size:17px}
 .hero-service-grid:has(>.hero-service-item:nth-child(2):last-child) .hero-service-item{flex-direction:row;align-items:center;gap:10px}
 .hero-service-grid:has(>.hero-service-item:nth-child(2):last-child) .hero-service-image{width:45%;height:72px;flex:none}
}