:root{
  --bg:#f6f2ee;--paper:#fffdfa;--paper2:#f0e7e1;--ink:#191715;--muted:#716a65;--line:#e6ddd6;
  --accent:#77584d;--accent2:#d8beb1;--dark:#181513;--good:#37684f;--warn:#8a6235;--bad:#8a4e4e;
  --radius:22px;--radius-lg:34px;--shadow:0 18px 60px rgba(53,37,31,.10);--shadow-sm:0 10px 30px rgba(53,37,31,.07)
}

*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--ink)}
body.lock{overflow:hidden}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{color:inherit}.wrap{width:min(1180px,calc(100% - 32px));margin:auto}
.topbar{background:var(--dark);color:#fff;text-align:center;padding:9px 16px;font-size:12px;letter-spacing:.03em}
header{position:sticky;top:0;z-index:40;background:rgba(246,242,238,.93);backdrop-filter:blur(18px);border-bottom:1px solid rgba(119,88,77,.10)}
.nav{height:72px;display:flex;align-items:center;gap:24px}.logo{font-size:20px;font-weight:850;letter-spacing:.18em;white-space:nowrap}.navlinks{display:flex;gap:24px;font-size:14px;flex:1;justify-content:center}.navlinks a{color:#4b4541}.actions{display:flex;align-items:center;gap:8px}.btn,.iconbtn{border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:10px 15px;cursor:pointer;transition:.18s}.btn:hover,.iconbtn:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.btn.primary{background:var(--dark);color:#fff;border-color:var(--dark)}.btn.ghost{background:transparent}.btn.small{padding:8px 12px;font-size:13px}.iconbtn{width:42px;height:42px;padding:0;display:grid;place-items:center;position:relative}.count{position:absolute;right:-2px;top:-4px;background:var(--dark);color:#fff;border-radius:999px;min-width:18px;height:18px;font-size:10px;display:grid;place-items:center;padding:0 5px}
.menuBtn{display:none}.hero{padding:48px 0 24px}.heroGrid{display:grid;grid-template-columns:1.08fr .92fr;gap:24px}.heroCopy,.heroArt{min-height:570px;border-radius:var(--radius-lg);box-shadow:var(--shadow)}.heroCopy{background:linear-gradient(145deg,#f1e7e0,#fffaf6);padding:62px;display:flex;justify-content:center;flex-direction:column}.eyebrow{font-size:12px;letter-spacing:.17em;text-transform:uppercase;color:var(--accent);font-weight:800}.hero h1{font-size:clamp(44px,6vw,76px);line-height:1.01;letter-spacing:-.045em;margin:18px 0}.lead{font-size:18px;line-height:1.8;color:var(--muted);max-width:630px}.heroCta{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.trustline{display:flex;gap:17px;flex-wrap:wrap;margin-top:30px;color:#534c47;font-size:12px}.heroArt{position:relative;overflow:hidden;background:radial-gradient(circle at 28% 18%,#fff2ea 0,#e7d3c9 26%,#bea296 55%,#7e655b 78%,#4c3c36 100%)}
.orb{position:absolute;border-radius:999px}.orb.a{width:280px;height:280px;background:#f7ede7;left:34px;top:55px}.orb.b{width:170px;height:330px;background:#211d1b;right:58px;bottom:34px;border-radius:90px}.orb.c{width:120px;height:290px;background:#d8b9ad;left:185px;bottom:32px;border-radius:70px}.orb.d{width:92px;height:92px;background:#fff8f3;right:78px;top:76px}.artTag{position:absolute;left:30px;bottom:28px;background:rgba(255,255,255,.76);backdrop-filter:blur(8px);padding:12px 16px;border-radius:16px;font-size:12px}
section{padding:42px 0}.sectionHead{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:22px}.sectionHead h2{font-size:34px;letter-spacing:-.03em;margin:5px 0 0}.sectionHead p{margin:0;color:var(--muted);line-height:1.7;max-width:540px;font-size:14px}.cards4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.moodCard{background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:22px;min-height:152px;display:flex;flex-direction:column;justify-content:space-between;transition:.18s}.moodCard:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm)}.moodCard strong{font-size:18px}.moodCard span{color:var(--muted);font-size:13px;line-height:1.55}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:14px 0 24px}.filter{border:1px solid var(--line);background:transparent;padding:9px 13px;border-radius:999px;cursor:pointer}.filter.active{background:var(--dark);color:#fff;border-color:var(--dark)}.toolbar .spacer{flex:1}.sort{border:1px solid var(--line);background:var(--paper);padding:9px 12px;border-radius:12px}
.products{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.productCard{background:var(--paper);border:1px solid var(--line);border-radius:25px;overflow:hidden;transition:.18s;position:relative}.productCard:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.productVisual{aspect-ratio:1/1;background:linear-gradient(145deg,#eee3dc,#ccb5aa);display:grid;place-items:center;position:relative;overflow:hidden;cursor:pointer}.device{width:36%;height:64%;border-radius:50px;background:linear-gradient(180deg,#faf8f6,#bda49a);box-shadow:0 18px 30px rgba(60,42,35,.17);transform:rotate(10deg)}.device.round{height:42%;width:42%;border-radius:50%}.device.slim{width:25%;height:72%;border-radius:70px;transform:rotate(-8deg)}.device.dark{background:linear-gradient(180deg,#4c423d,#1d1917)}.badge{position:absolute;left:13px;top:13px;background:rgba(255,255,255,.86);border-radius:999px;padding:7px 10px;font-size:10px;font-weight:800}.wish{position:absolute;right:12px;top:12px;width:36px;height:36px;border:0;background:rgba(255,255,255,.88);border-radius:50%;cursor:pointer}.wish.active{background:var(--dark);color:#fff}.cardBody{padding:17px}.meta{font-size:11px;color:var(--muted);letter-spacing:.08em}.productName{font-size:17px;font-weight:800;margin-top:5px;cursor:pointer}.productDesc{font-size:13px;color:var(--muted);line-height:1.55;margin:7px 0 12px;min-height:40px}.miniSpecs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}.chip{font-size:10px;border:1px solid var(--line);padding:5px 7px;border-radius:999px;color:#655d58}.priceRow{display:flex;justify-content:space-between;align-items:center;gap:8px}.price{font-size:18px;font-weight:850}.compare{font-size:11px;color:var(--muted)}
.banner{background:var(--dark);color:#fff;padding:44px;border-radius:32px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}.banner h3{font-size:31px;margin:0 0 8px}.banner p{margin:0;color:#cfc6c1;line-height:1.7}.banner .privacyCta{background:#fff;color:var(--dark);border-color:#fff;font-weight:700}.banner .privacyCta:hover{background:#f4ece7;color:var(--dark);border-color:#f4ece7}.features{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.feature{border-top:1px solid var(--line);padding:22px 8px}.feature b{display:block;margin-bottom:8px}.quiz{display:grid;grid-template-columns:.78fr 1fr;gap:34px;align-items:center;background:#eee3dc;border-radius:32px;padding:42px}.quiz>div:first-child{align-self:center;padding:0 6px}.quiz h3{font-size:32px;margin:5px 0 10px}.quiz .guideTitle{max-width:390px;margin:9px 0 14px;line-height:1.16;letter-spacing:-.025em}.quiz .guideTitle span{display:block;font:inherit;color:inherit;letter-spacing:inherit}.quiz .guideTitle span+span{margin-top:6px}.quiz p{color:var(--muted);line-height:1.7}.quizBox{background:var(--paper);border:1px solid #ded0c7;padding:22px;border-radius:23px}.formField{margin-bottom:13px}.formField label{display:block;font-size:12px;color:var(--muted);margin-bottom:7px}.formField select,.formField input,.formField textarea{width:100%;border:1px solid var(--line);background:#fff;padding:12px 13px;border-radius:13px;outline:none}.formField input:focus,.formField select:focus,.formField textarea:focus{border-color:#aa8d80;box-shadow:0 0 0 3px rgba(119,88,77,.08)}.quizResult{padding:13px 0 0;font-size:13px;line-height:1.7}
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.review{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:20px}.stars{letter-spacing:.04em;font-size:12px;font-weight:800;color:var(--accent)}.review p{color:#524b46;line-height:1.7;font-size:13px}.review small{color:var(--muted)}.faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}.faq details{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:18px}.faq summary{font-weight:750;cursor:pointer}.faq p{font-size:13px;color:var(--muted);line-height:1.7}
footer{border-top:1px solid var(--line);padding:46px 0 70px;margin-top:30px}.footerGrid{display:grid;grid-template-columns:1.25fr repeat(3,1fr);gap:26px}.footerGrid h4{margin:0 0 12px}.footerGrid a,.footerGrid p{display:block;font-size:12px;color:var(--muted);line-height:1.9}.footNote{border-top:1px solid var(--line);margin-top:30px;padding-top:18px;font-size:11px;color:#8a817c;line-height:1.6}
.overlay{position:fixed;inset:0;background:rgba(18,14,12,.42);z-index:70;display:none}.overlay.show{display:block}.drawer{position:fixed;right:0;top:0;height:100%;width:min(440px,94vw);background:var(--paper);z-index:80;transform:translateX(105%);transition:.22s;box-shadow:-22px 0 60px rgba(0,0,0,.13);display:flex;flex-direction:column}.drawer.open{transform:none}.drawerHead{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;border-bottom:1px solid var(--line)}.drawerBody{padding:6px 22px;overflow:auto;flex:1}.drawerFoot{border-top:1px solid var(--line);padding:18px 22px;background:#fffaf6}.cartItem{display:grid;grid-template-columns:58px 1fr auto;gap:12px;padding:15px 0;border-bottom:1px solid var(--line);align-items:center}.thumb{width:58px;height:58px;border-radius:14px;background:linear-gradient(145deg,#eee3dc,#ccb5aa);display:grid;place-items:center}.thumb .device{width:34%;height:62%}.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden;margin-top:7px}.qty button{border:0;background:transparent;width:28px;height:26px;cursor:pointer}.qty span{width:28px;text-align:center;font-size:12px}.remove{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:11px}.summaryRow{display:flex;justify-content:space-between;margin:8px 0;font-size:13px}.summaryRow.total{font-size:19px;font-weight:850;margin-top:14px}.shipProgress{background:#eee4de;border-radius:999px;height:7px;overflow:hidden;margin:8px 0 6px}.shipProgress>div{height:100%;background:var(--dark);width:0;transition:.2s}.shipText{font-size:11px;color:var(--muted)}
.modal{position:fixed;inset:0;z-index:90;display:none;place-items:center;padding:20px}.modal.show{display:grid}.modalCard{width:min(980px,100%);max-height:92vh;overflow:auto;background:var(--paper);border-radius:28px;box-shadow:0 30px 90px rgba(0,0,0,.23);position:relative}.modalClose{position:sticky;top:14px;float:right;margin:14px 14px 0 0;z-index:3}.productDetail{display:grid;grid-template-columns:.92fr 1.08fr}.detailVisual{min-height:620px;background:linear-gradient(145deg,#f1e7e0,#c6ada1);display:grid;place-items:center;border-radius:28px 0 0 28px}.detailVisual .device{height:53%;width:30%}.detailCopy{padding:44px}.detailCopy h2{font-size:38px;margin:7px 0 8px}.detailPrice{font-size:24px;font-weight:850;margin:10px 0}.rating{font-size:12px;color:#5b524d}.detailText{font-size:14px;color:var(--muted);line-height:1.8}.specGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.spec{border:1px solid var(--line);border-radius:14px;padding:12px}.spec b{display:block;font-size:12px}.spec span{font-size:11px;color:var(--muted)}.variantRow{display:flex;gap:8px;flex-wrap:wrap}.variant{border:1px solid var(--line);background:#fff;padding:9px 12px;border-radius:999px;cursor:pointer}.variant.active{background:var(--dark);color:#fff;border-color:var(--dark)}.detailActions{display:flex;gap:10px;margin-top:18px}.detailActions .btn{flex:1}.accordion details{border-top:1px solid var(--line);padding:14px 0}.accordion summary{font-weight:750;cursor:pointer}.accordion p{font-size:12px;color:var(--muted);line-height:1.7}
.searchPanel{position:fixed;inset:0;z-index:95;background:rgba(246,242,238,.98);display:none}.searchPanel.show{display:block}.searchWrap{width:min(900px,calc(100% - 32px));margin:90px auto}.searchBar{display:flex;gap:10px}.searchBar input{flex:1;padding:17px 18px;border:1px solid var(--line);border-radius:16px;background:#fff;font-size:18px}.searchResults{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px}.searchHit{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:15px;cursor:pointer}.searchHit b{display:block}.searchHit span{font-size:12px;color:var(--muted)}
.age{position:fixed;inset:0;z-index:120;background:rgba(18,14,12,.68);display:grid;place-items:center;padding:20px}.ageCard{width:min(520px,100%);background:var(--paper);border-radius:28px;padding:32px;text-align:center;box-shadow:0 30px 90px rgba(0,0,0,.25)}.ageCard h3{font-size:29px;margin:7px 0 10px}.ageCard p{font-size:13px;color:var(--muted);line-height:1.7}.ageActions{display:flex;gap:10px;margin-top:18px}.ageActions>*{flex:1}.note{font-size:11px;color:#8d837d;line-height:1.6;margin-top:10px}
.consentRow{display:flex!important;align-items:center;gap:8px;margin:2px 0 0!important;color:var(--muted);line-height:1.5}.consentRow input[type="checkbox"]{width:16px!important;height:16px!important;min-width:16px;margin:0;flex:0 0 16px;accent-color:var(--dark)}.consentRow span{display:inline;min-width:0}.consentRow a{display:inline}
.checkoutShell{width:min(1060px,calc(100% - 32px));margin:36px auto 80px;display:grid;grid-template-columns:1.1fr .9fr;gap:24px}.checkoutCard{background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:24px}.checkoutCard h2,.checkoutCard h3{margin-top:0}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.payOption{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:15px;padding:14px;margin:8px 0;cursor:pointer}.payOption.active{border-color:#8e7165;background:#faf4ef}.orderLines{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:8px 0}.orderLine{display:flex;justify-content:space-between;gap:14px;padding:9px 0;font-size:13px}.privacyBox{background:#f2e9e3;border-radius:15px;padding:13px;font-size:11px;color:#655d58;line-height:1.6}.checkoutPrivacy{margin-top:-4px;margin-bottom:20px}.success{width:min(680px,calc(100% - 32px));margin:70px auto;text-align:center;background:var(--paper);border:1px solid var(--line);border-radius:30px;padding:48px;box-shadow:var(--shadow)}.successMark{width:70px;height:70px;border-radius:50%;background:var(--dark);color:#fff;margin:0 auto 18px;display:grid;place-items:center;font-size:30px}.trackBox{display:flex;gap:8px;margin-top:18px}.trackBox input{flex:1;border:1px solid var(--line);padding:12px;border-radius:12px}.timeline{margin-top:22px;text-align:left}.step{display:grid;grid-template-columns:20px 1fr;gap:10px;padding:8px 0}.dot{width:12px;height:12px;border-radius:50%;background:#cab9b0;margin-top:3px}.step.done .dot{background:var(--dark)}.step b{font-size:13px}.step span{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.pageHero{padding:54px 0 14px}.pageHero h1{font-size:48px;letter-spacing:-.04em;margin:9px 0}.pageHero p{color:var(--muted);max-width:660px;line-height:1.7}.policy{background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:30px;margin:20px auto 70px;line-height:1.8}.policy h2{margin-top:28px}.policy p,.policy li{font-size:13px;color:#5f5752}
.policyHero{padding:42px 0 12px}.policyHeroCard{background:linear-gradient(145deg,#efe3dc,#fffaf6 66%);border:1px solid var(--line);border-radius:32px;padding:46px 48px;box-shadow:var(--shadow-sm)}.policyKicker{display:inline-flex;align-items:center;height:28px;padding:0 11px;border:1px solid rgba(119,88,77,.18);border-radius:999px;background:rgba(255,255,255,.52);font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--accent)}.policyHero h1{font-size:clamp(36px,5vw,54px);letter-spacing:-.045em;line-height:1.08;margin:15px 0 10px}.policyHero p{margin:0;color:var(--muted);font-size:14px;line-height:1.75;max-width:660px}.policyQuickNav{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}.policyQuickNav a{display:inline-flex;align-items:center;min-height:36px;padding:0 13px;background:rgba(255,255,255,.72);border:1px solid var(--line);border-radius:999px;font-size:12px;color:#524b46;transition:.18s}.policyQuickNav a:hover{background:var(--dark);color:#fff;border-color:var(--dark);transform:translateY(-1px)}
.policyList{padding:0;margin:22px auto 72px;overflow:hidden}.policySection{display:grid;grid-template-columns:58px 1fr;gap:22px;padding:30px 32px;border-bottom:1px solid var(--line);scroll-margin-top:96px}.policySection:last-child{border-bottom:0}.policyNo{font-size:11px;letter-spacing:.12em;color:#a49389;font-weight:800;padding-top:7px}.policyContent h2{font-size:21px;letter-spacing:-.02em;margin:0 0 11px}.policyContent p,.policyContent li{font-size:13px;color:#5f5752;line-height:1.85}.policyContent p{margin:0 0 10px}.policyContent p:last-child{margin-bottom:0}.policyContent ul{margin:8px 0 0;padding-left:20px}.policyContent li+li{margin-top:6px}.mobileNav{display:none}
@media(max-width:960px){.navlinks{display:none}.menuBtn{display:grid}.heroGrid,.quiz,.checkoutShell,.productDetail{grid-template-columns:1fr}.heroCopy{min-height:auto;padding:44px}.heroArt{min-height:430px}.products{grid-template-columns:repeat(2,1fr)}.cards4,.features{grid-template-columns:repeat(2,1fr)}.reviews{grid-template-columns:1fr}.footerGrid{grid-template-columns:1fr 1fr}.detailVisual{min-height:420px;border-radius:28px 28px 0 0}.detailVisual .device{height:55%;width:22%}.mobileNav{position:fixed;left:0;right:0;top:72px;z-index:39;background:var(--paper);border-bottom:1px solid var(--line);padding:14px 16px;display:none}.mobileNav.show{display:block}.mobileNav a{display:block;padding:12px 4px;border-bottom:1px solid var(--line)}}
@media(max-width:560px){.wrap{width:min(100% - 22px,1180px)}.topbar{font-size:10px}.actions .desktopOnly{display:none}.hero{padding-top:24px}.heroCopy{padding:28px}.heroCopy h1{font-size:42px}.heroArt{min-height:340px}.products{grid-template-columns:1fr 1fr;gap:10px}.cardBody{padding:13px}.productDesc,.miniSpecs{display:none}.sectionHead{align-items:start;flex-direction:column}.sectionHead h2{font-size:29px}.cards4,.features{grid-template-columns:1fr 1fr}.benefitStrip{padding:8px 0 10px}.compactFeatures .feature{min-height:58px;padding:12px 6px}.moodCard{min-height:128px;padding:17px}.banner,.quiz{padding:26px}.banner{grid-template-columns:1fr}.faq{grid-template-columns:1fr}.footerGrid{grid-template-columns:1fr}.searchResults{grid-template-columns:1fr}.detailCopy{padding:27px}.detailCopy h2{font-size:31px}.specGrid{grid-template-columns:1fr 1fr}.detailActions{flex-direction:column}.grid2{grid-template-columns:1fr}.consentRow{display:flex!important;align-items:center;gap:8px;margin:2px 0 0!important;color:var(--muted);line-height:1.5}.consentRow input[type="checkbox"]{width:16px!important;height:16px!important;min-width:16px;margin:0;flex:0 0 16px;accent-color:var(--dark)}.consentRow span{display:inline;min-width:0}.consentRow a{display:inline}
.checkoutShell{width:min(100% - 20px,1060px)}.pageHero h1{font-size:39px}.policyHero{padding-top:22px}.policyHeroCard{padding:28px 22px;border-radius:24px}.policyHero h1{font-size:36px}.policyQuickNav{gap:6px;margin-top:18px}.policyQuickNav a{font-size:11px;min-height:34px;padding:0 11px}.policyList{padding:0}.policySection{grid-template-columns:1fr;gap:6px;padding:24px 22px}.policyNo{padding-top:0}.policyContent h2{font-size:19px}.ageActions{flex-direction:column}.orb.a{left:-40px}.orb.c{left:120px}.orb.b{right:25px}}

/* Compact benefit strip: title-only cards */
.benefitStrip{padding:12px 0 14px}
.compactFeatures .feature{min-height:66px;display:flex;align-items:center;padding:15px 8px}
.compactFeatures .feature b{margin:0;line-height:1.35}

/* Feature tiles are title-only. */
.features .feature > span{display:none!important}

/* Hero layout refinement: preserve copy, improve hierarchy and balance */
.heroGrid{grid-template-columns:1.04fr .96fr;gap:22px}
.heroCopy{padding:56px 58px 46px;justify-content:flex-start}
.heroCopy .eyebrow{margin-bottom:14px}
.hero h1{font-size:clamp(48px,5.35vw,68px);line-height:1.045;max-width:650px;margin:0 0 22px}
.heroCopy .lead{font-size:16px;line-height:1.78;max-width:570px;margin:0;color:#6d655f}
.heroCta{margin-top:28px;gap:12px}
.heroCta .btn{min-height:44px;padding:11px 19px;display:inline-flex;align-items:center;justify-content:center}
.trustline{margin-top:auto;padding-top:28px;border-top:1px solid rgba(119,88,77,.14);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px;color:#514943;font-size:12px;line-height:1.5}
.trustline span{display:flex;align-items:center;gap:7px;white-space:nowrap}

@media(max-width:960px){
  .heroCopy{padding:46px 44px 40px}
  .hero h1{font-size:clamp(46px,8vw,64px)}
  .trustline{margin-top:30px}
}
@media(max-width:560px){
  .heroCopy{padding:30px 26px 26px}
  .hero h1{font-size:42px;line-height:1.06;margin-bottom:18px}
  .heroCopy .lead{font-size:15px;line-height:1.7}
  .heroCta{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .heroCta .btn{padding:10px 12px;font-size:13px}
  .trustline{grid-template-columns:1fr 1fr;gap:10px 14px;padding-top:22px;margin-top:24px;font-size:11px}
  .trustline span{white-space:normal}
}



/* Refined Chinese hero headline: quieter scale, looser rhythm, no crowding */
.hero .heroTitle{
  font-size:clamp(42px,4.55vw,56px);
  line-height:1.16;
  letter-spacing:-.012em;
  font-weight:720;
  max-width:590px;
  margin:0 0 24px;
  text-wrap:balance;
}
.hero .heroTitle span{display:block;white-space:nowrap}
.hero .heroTitle span+span{margin-top:5px}

@media(max-width:960px){
  .hero .heroTitle{font-size:clamp(42px,6.2vw,54px);line-height:1.16;max-width:none}
}
@media(max-width:560px){
  .hero .heroTitle{font-size:36px;line-height:1.18;letter-spacing:-.006em;margin-bottom:18px}
  .hero .heroTitle span+span{margin-top:4px}
}
@media(max-width:360px){
  .hero .heroTitle{font-size:33px}
}


/* Keep HELP ME CHOOSE layout stable when recommendation results appear */
@media (min-width:961px){
  .quizResult{min-height:96px}
}

/* Order system */
.orderLookupCard{max-width:820px;margin-bottom:70px}.trackFields{display:grid;grid-template-columns:minmax(0,1fr) 180px auto;gap:10px;align-items:end;margin-top:6px}.trackFields .formField{margin:0}.trackSubmit{height:43px}.errorNote{padding:14px 0;color:#795b50}.orderSummaryGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}.orderSummaryGrid>div,.adminGrid>div{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fffdfb}.orderSummaryGrid span,.adminGrid span{display:block;font-size:10px;color:var(--muted);margin-bottom:5px}.orderSummaryGrid b,.adminGrid b{font-size:13px;overflow-wrap:anywhere}.orderPrivacy{margin:10px 0 18px}.orderTimeline{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;margin-bottom:16px}.orderInfoBlock{border:1px solid var(--line);border-radius:15px;padding:14px;margin:14px 0}.orderInfoBlock>b{font-size:13px}.supportPanel{margin-top:16px;border:1px solid var(--line);border-radius:15px;padding:13px}.supportPanel summary{cursor:pointer;font-weight:750;font-size:13px}.supportPanel .formField{margin-top:12px}.orderSupportState{margin-top:16px}.adminWrap{max-width:1060px;margin-bottom:70px}.adminLogin{max-width:620px;margin-bottom:18px;display:flex;gap:10px;align-items:end}.adminLogin .formField{flex:1;margin:0}.adminOrder{margin:14px 0}.adminOrderHead{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}.adminOrderHead span{display:block;font-size:11px;color:var(--muted);margin-top:4px}.adminGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}.adminItems{margin-top:12px;border-top:1px solid var(--line);padding-top:12px}.adminItems summary{cursor:pointer;font-size:12px;font-weight:750}
@media(max-width:760px){.trackFields{grid-template-columns:1fr 130px}.trackSubmit{grid-column:1/-1}.orderSummaryGrid{grid-template-columns:1fr 1fr}.adminLogin{display:block}.adminLogin .btn{width:100%;margin-top:10px}.adminGrid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.trackFields{grid-template-columns:1fr}.shortVerify,.trackSubmit{grid-column:auto}.orderSummaryGrid,.adminGrid{grid-template-columns:1fr}}

/* Automatic logistics tracking */
.shippingAdminBox{border:1px solid var(--line);background:#fffaf7;border-radius:17px;padding:15px;margin:6px 0 13px}.shippingAdminTitle{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px}.shippingAdminTitle b{font-size:13px}.shippingAdminTitle span,.logisticsAdminMeta,.logisticsUpdated{font-size:11px;color:var(--muted);line-height:1.6}.adminSave{margin:2px 0 12px}.adminLogisticsBadge{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;border:1px solid var(--line);font-size:11px;background:#fff}.goodBadge{color:var(--good);border-color:rgba(55,104,79,.22);background:rgba(55,104,79,.06)}.warnBadge{color:var(--warn);border-color:rgba(138,98,53,.22);background:rgba(138,98,53,.06)}.mutedBadge{color:var(--muted)}
.logisticsWaiting{margin-top:12px;border-top:1px solid var(--line);padding-top:12px}.logisticsWaiting b{display:block;font-size:12px}.logisticsWaiting span{display:block;font-size:11px;color:var(--muted);margin-top:4px;line-height:1.6}.logisticsDetails{margin-top:13px;border-top:1px solid var(--line);padding-top:12px}.logisticsDetails summary{cursor:pointer;font-size:12px;font-weight:780}.logisticsList{margin-top:13px}.logisticsEvent{display:grid;grid-template-columns:18px 1fr;gap:10px;position:relative;padding:0 0 18px}.logisticsEvent:not(:last-child):before{content:"";position:absolute;left:5px;top:12px;bottom:0;width:1px;background:var(--line)}.logisticsDot{width:11px;height:11px;margin-top:3px;border-radius:50%;background:#cdbdb5;position:relative;z-index:1}.logisticsEvent.latest .logisticsDot{background:var(--dark)}.logisticsEvent b{font-size:12px;line-height:1.55;display:block;font-weight:650}.logisticsEvent span{font-size:10px;color:var(--muted);display:block;margin-top:4px;line-height:1.5}.logisticsMini{display:grid;grid-template-columns:150px 1fr;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}.logisticsMini:last-child{border-bottom:0}.logisticsMini span{font-size:10px;color:var(--muted)}.logisticsMini b{font-size:11px;font-weight:600;line-height:1.5}
@media(max-width:560px){.shippingAdminTitle{display:block}.shippingAdminTitle span{display:block;margin-top:4px}.logisticsMini{grid-template-columns:1fr;gap:3px}}

/* Payment */
.payShell{max-width:1080px;margin:42px auto 70px;padding:0 24px;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:22px;align-items:start}.payMain h1{font-size:clamp(32px,5vw,48px);margin:8px 0 10px}.payIntro{color:var(--muted);line-height:1.75;max-width:620px}.payAmount{display:flex;justify-content:space-between;align-items:end;padding:22px 0 18px;margin-top:10px;border-bottom:1px solid var(--line)}.payAmount span{color:var(--muted)}.payAmount b{font-size:32px;letter-spacing:-.02em}.payMethods{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0 14px}.payMethod{appearance:none;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:var(--ink);font:inherit;transition:.18s ease}.payMethod:hover{transform:translateY(-1px);border-color:#bfb8b2}.payMethod.active{border-color:#262220;box-shadow:0 0 0 1px #262220 inset}.payMethod.disabled{opacity:.38;cursor:not-allowed;transform:none}.payBrand{display:inline-flex;align-items:center;gap:8px;min-width:0;font-weight:700}.paymentBrandIcon{display:block;width:22px;height:22px;flex:0 0 22px}.paymentResultNotice{display:flex;align-items:center;justify-content:center;min-height:48px;text-align:center}.payNow{width:100%;padding:15px 18px;font-size:16px}.payHint{text-align:center;margin-top:12px;min-height:22px}.payQrWrap{margin-top:20px}.payQrCard{border:1px solid var(--line);border-radius:22px;padding:22px;text-align:center;background:#faf9f7}.payQrCard img{width:220px;height:220px;display:block;margin:0 auto 14px;border-radius:12px}.payQrCard b,.payQrCard span{display:block}.payQrCard span{color:var(--muted);font-size:13px;margin-top:7px;line-height:1.5}.payWaiting{margin-top:16px;border-radius:16px;background:#f6f4f2;padding:13px 15px;display:flex;align-items:center;gap:12px}.payWaiting small{display:block;color:var(--muted);margin-top:2px}.payPulse{width:10px;height:10px;border-radius:99px;background:currentColor;animation:payPulse 1.25s infinite ease-in-out}@keyframes payPulse{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}.paySide{position:sticky;top:22px}@media(max-width:760px){.payShell{grid-template-columns:1fr;margin-top:24px;padding:0 16px}.paySide{position:static}.payMethods{grid-template-columns:1fr}.payQrWrap{display:none!important}.payMain h1{font-size:36px}}

.continuePayBox{display:flex;justify-content:flex-end;margin:16px 0 4px}


/* Context-aware return flow for purchase policy */
.policyContextLink{
  display:inline-flex;
  margin-top:14px;
  font-size:13px;
  font-weight:700;
  text-decoration:none;
  color:var(--ink);
  opacity:.78;
}
.policyContextLink:hover{opacity:1}
.policyReturnArea{padding-top:0;padding-bottom:56px}
.policyReturnCard{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:22px 24px;
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--paper);
}
.policyReturnCard span{font-size:14px;color:var(--muted)}
@media(max-width:640px){
  .policyReturnArea{padding-bottom:34px}
  .policyReturnCard{align-items:stretch;flex-direction:column}
  .policyReturnCard .btn{width:100%;justify-content:center}
}


@media(max-width:640px){
  .hero-heart-mark{
    margin-top:8px;
    font-size:21px;
    opacity:.32;
  }
}





/* Refined hero title with subtle themed hearts */
.hero h1{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
}
.hero-line-top{
  display:flex;
  align-items:flex-end;
  gap:14px;
  white-space:nowrap;
}
.hero-line-text{
  display:inline-block;
}
.hero-line-bottom{
  display:block;
}
.hero-hearts{
  display:inline-flex;
  align-items:center;
  gap:6px;
  transform:translateY(-2px);
}
.hero-hearts span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:Georgia,"Times New Roman",serif;
  font-size:.62em;
  line-height:1;
  font-weight:400;
  color:#d8cdc3;
  opacity:.95;
  letter-spacing:-0.02em;
  text-shadow:
    0 0 0.5px rgba(255,255,255,0.35),
    0 0 0 rgba(0,0,0,0);
}
.hero-hearts span:nth-child(2){transform:translateY(-3px)}
.hero-hearts span:nth-child(3){transform:translateY(1px)}
@media(max-width:640px){
  .hero h1{gap:8px}
  .hero-line-top{
    gap:10px;
    white-space:normal;
    flex-wrap:wrap;
  }
  .hero-hearts{
    gap:4px;
    transform:translateY(-1px);
  }
  .hero-hearts span{
    font-size:.58em;
  }
}


/* Force hearts to stay inline on the right of "把亲密" without changing hero height */
.hero .heroTitle{
  display:block;
}
.hero .heroTitle .hero-line-top{
  display:inline-flex !important;
  align-items:center;
  gap:10px;
  white-space:nowrap;
}
.hero .heroTitle .hero-line-top .hero-line-text{
  display:inline-block !important;
}
.hero .heroTitle .hero-line-top .hero-hearts{
  display:inline-flex !important;
  align-items:center;
  gap:5px;
  white-space:nowrap;
  vertical-align:middle;
  transform:translateY(-1px);
}
.hero .heroTitle .hero-line-top .hero-hearts span{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:auto;
  margin:0 !important;
  font-family:Georgia,"Times New Roman",serif;
  font-size:.56em;
  line-height:1;
  color:#ddd2c9;
  opacity:.96;
}
.hero .heroTitle .hero-line-top .hero-hearts span + span{
  margin-left:0 !important;
}
.hero .heroTitle .hero-line-bottom{
  display:block !important;
}
@media(max-width:560px){
  .hero .heroTitle .hero-line-top{
    gap:8px;
  }
  .hero .heroTitle .hero-line-top .hero-hearts{
    gap:4px;
  }
  .hero .heroTitle .hero-line-top .hero-hearts span{
    font-size:.52em;
  }
}



/* =========================================================
   LOOMI · MOBILE-FIRST COMMERCE REFINEMENT
   Only affects screens <= 640px. Desktop is intentionally unchanged.
   ========================================================= */
@media (max-width:640px){

  html{
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
    overflow-x:hidden;
  }
  body{
    overflow-x:hidden;
    font-size:15px;
    line-height:1.62;
  }
  .wrap{
    width:calc(100% - 28px);
    max-width:none;
  }
  section{padding:34px 0}
  .topbar{
    padding:8px 12px;
    font-size:10.5px;
    line-height:1.35;
    letter-spacing:.01em;
  }

  /* Header */
  .nav{
    min-height:60px;
    gap:10px;
  }
  .logo{
    font-size:18px;
    letter-spacing:.15em;
  }
  .actions{gap:6px}
  .actions .btn{
    min-height:40px;
    padding:9px 12px;
    font-size:12px;
  }
  .iconbtn{
    width:40px;
    height:40px;
  }
  .mobileNav{
    padding:8px 14px 12px !important;
    max-height:calc(100svh - 60px);
    overflow:auto;
  }
  .mobileNav a{
    padding:13px 4px !important;
    font-size:14px;
  }

  /* Hero */
  .hero{padding:14px 0 18px}
  .heroGrid{gap:14px}
  .heroCopy{
    min-height:0 !important;
    padding:27px 20px 24px !important;
    border-radius:24px;
  }
  .heroCopy>.eyebrow{
    font-size:9.5px;
    line-height:1.35;
    letter-spacing:.14em;
    margin-bottom:11px;
  }
  .hero .heroTitle{
    font-size:34px !important;
    line-height:1.13 !important;
    letter-spacing:-.012em !important;
    max-width:none !important;
    margin:0 0 17px !important;
  }
  .hero .heroTitle .hero-line-top{
    display:inline-flex !important;
    align-items:center !important;
    flex-wrap:nowrap !important;
    white-space:nowrap !important;
    gap:7px !important;
  }
  .hero .heroTitle .hero-line-top .hero-line-text{
    display:inline-block !important;
  }
  .hero .heroTitle .hero-line-top .hero-hearts{
    display:inline-flex !important;
    flex-wrap:nowrap !important;
    white-space:nowrap !important;
    align-items:center !important;
    gap:3px !important;
    transform:translateY(-1px) !important;
  }
  .hero .heroTitle .hero-line-top .hero-hearts span{
    display:inline-flex !important;
    flex:0 0 auto;
    font-size:.46em !important;
    margin:0 !important;
  }
  .hero .heroTitle .hero-line-bottom{
    display:block !important;
    margin-top:3px !important;
  }
  .heroCopy .lead{
    max-width:none;
    font-size:14.5px !important;
    line-height:1.72 !important;
    color:#675f5a;
  }
  .heroCta{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:9px !important;
    margin-top:20px !important;
  }
  .heroCta .btn{
    min-height:48px;
    padding:12px 15px;
    font-size:14px;
    font-weight:720;
  }
  .trustline{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px 12px !important;
    margin-top:20px !important;
    padding-top:17px;
    font-size:11px !important;
    line-height:1.45;
  }
  .heroArt{
    min-height:255px !important;
    border-radius:24px;
  }
  .artTag{
    left:15px;
    bottom:14px;
    padding:9px 11px;
    font-size:10px;
  }

  /* Universal section typography */
  .eyebrow{
    font-size:9.5px;
    line-height:1.35;
    letter-spacing:.14em;
  }
  .sectionHead{
    display:block !important;
    margin-bottom:16px;
  }
  .sectionHead h2{
    margin:5px 0 0;
    font-size:25px !important;
    line-height:1.24;
    letter-spacing:-.025em;
  }
  .sectionHead p{
    margin:8px 0 0 !important;
    max-width:none !important;
    font-size:13.5px;
    line-height:1.68;
  }

  /* Scene cards */
  .cards4{
    grid-template-columns:1fr 1fr !important;
    gap:9px !important;
  }
  .moodCard{
    min-height:116px !important;
    padding:15px 13px !important;
    border-radius:18px;
  }
  .moodCard strong{
    font-size:15px;
    line-height:1.38;
  }
  .moodCard span{
    font-size:11px;
    line-height:1.5;
  }

  /* Shop controls */
  .toolbar{
    gap:7px;
    margin:10px 0 15px;
    align-items:center;
  }
  .filter{
    min-height:38px;
    padding:8px 10px;
    font-size:11.5px;
    white-space:nowrap;
  }
  .toolbar .spacer{display:none}
  .toolbar .compare{
    margin-left:auto;
    font-size:10.5px;
  }
  .sort{
    min-height:40px;
    max-width:142px;
    padding:8px 10px;
    font-size:12px;
  }

  /* Product grid */
  .products{
    grid-template-columns:1fr 1fr !important;
    gap:9px !important;
  }
  .productCard{
    border-radius:18px;
  }
  .productVisual{
    aspect-ratio:1/1.03;
  }
  .badge{
    top:8px;
    left:8px;
    padding:5px 7px;
    font-size:8.5px;
  }
  .wish{
    top:8px;
    right:8px;
    width:32px;
    height:32px;
  }
  .cardBody{
    padding:11px 10px 12px !important;
  }
  .meta{
    font-size:8.5px;
    letter-spacing:.055em;
  }
  .productName{
    margin-top:4px;
    min-height:38px;
    font-size:13.5px;
    line-height:1.4;
  }
  .productDesc,
  .miniSpecs{
    display:none !important;
  }
  .priceRow{
    gap:5px;
    margin-top:8px;
    align-items:end;
  }
  .price{
    font-size:16px;
    line-height:1.05;
  }
  .priceRow .compare{
    display:block;
    margin-top:4px;
    font-size:8.5px;
    line-height:1.35;
  }
  .priceRow .btn.small{
    min-width:50px;
    min-height:36px;
    padding:7px 8px;
    font-size:10.5px;
  }

  /* Privacy banner */
  .banner{
    grid-template-columns:1fr !important;
    gap:17px;
    padding:23px 19px !important;
    border-radius:22px;
  }
  .banner h3{
    margin:0 0 8px;
    font-size:22px;
    line-height:1.32;
  }
  .banner p{
    font-size:13px;
    line-height:1.72;
  }
  .banner .privacyCta{
    display:flex;
    width:100%;
    min-height:46px;
    align-items:center;
    justify-content:center;
    font-size:13px;
  }

  /* Benefits */
  .benefitStrip{padding:5px 0 8px !important}
  .features{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }
  .compactFeatures .feature{
    min-height:60px !important;
    padding:11px 8px !important;
  }
  .compactFeatures .feature b{
    font-size:12px;
    line-height:1.42;
  }

  /* Help me choose */
  .quiz{
    grid-template-columns:1fr !important;
    gap:17px !important;
    padding:23px 17px !important;
    border-radius:22px;
  }
  .quiz>div:first-child{
    padding:0 !important;
  }
  .quiz .guideTitle,
  .quiz h3{
    max-width:none;
    margin:7px 0 0;
    font-size:24px !important;
    line-height:1.25 !important;
    letter-spacing:-.02em;
  }
  .quiz .guideTitle span+span{
    margin-top:3px !important;
  }
  .quizBox{
    padding:16px 14px;
    border-radius:18px;
  }
  .formField{
    margin-bottom:13px;
  }
  .formField label{
    margin-bottom:6px;
    font-size:12.5px;
    line-height:1.4;
  }
  .formField input,
  .formField select,
  .formField textarea{
    min-height:48px;
    padding:12px 13px;
    border-radius:12px;
    font-size:16px !important;
    line-height:1.4;
  }
  .quizBox .btn.primary{
    min-height:48px;
    font-size:14px;
  }
  .quizResult{
    min-height:106px;
    padding-top:12px;
    font-size:13px;
    line-height:1.68;
  }
  .quizResult .btn{
    min-height:38px;
    margin-top:9px !important;
  }

  /* Reviews / FAQ */
  .reviews{
    grid-template-columns:1fr !important;
    gap:9px !important;
  }
  .review{
    padding:16px 15px;
    border-radius:17px;
  }
  .stars{
    font-size:13px;
    letter-spacing:.04em;
  }
  .review p{
    margin:8px 0 10px;
    font-size:13.5px;
    line-height:1.72;
  }
  .review small{font-size:10.5px}
  .faq{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
  .faq details{
    padding:15px 14px;
    border-radius:16px;
  }
  .faq summary{
    font-size:14px;
    line-height:1.48;
  }
  .faq p{
    margin-bottom:0;
    font-size:13px;
    line-height:1.75;
  }

  /* Footer */
  footer{
    margin-top:14px;
    padding:36px 0 max(46px,env(safe-area-inset-bottom));
  }
  .footerGrid{
    grid-template-columns:1fr 1fr !important;
    gap:23px 17px !important;
  }
  .footerGrid>div:first-child{
    grid-column:1/-1;
  }
  .footerGrid h4{
    margin-bottom:7px;
    font-size:12.5px;
  }
  .footerGrid a,
  .footerGrid p{
    font-size:12px;
    line-height:1.75;
  }
  .footNote{
    margin-top:22px;
    padding-top:15px;
    font-size:10.5px;
    line-height:1.65;
  }

  /* Cart */
  .drawer{
    width:100vw;
    max-width:none;
  }
  .drawerHead{
    padding:15px 15px;
  }
  .drawerHead b{font-size:15.5px}
  .drawerBody{
    padding:3px 15px;
  }
  .drawerFoot{
    padding:14px 15px calc(14px + env(safe-area-inset-bottom));
  }
  .cartItem{
    grid-template-columns:54px minmax(0,1fr) auto;
    gap:10px;
    padding:13px 0;
  }
  .thumb{
    width:54px;
    height:54px;
  }
  .cartItem b{
    font-size:12.5px;
    line-height:1.42;
  }
  .summaryRow{font-size:12.5px}
  .summaryRow.total{font-size:17px}
  #checkoutBtn{
    min-height:48px;
    font-size:14px;
  }

  /* Search */
  .searchWrap{
    width:calc(100% - 28px);
    margin:72px auto 24px;
  }
  .searchBar{
    gap:7px;
  }
  .searchBar input{
    min-width:0;
    padding:13px 14px;
    border-radius:13px;
    font-size:16px;
  }
  .searchBar .btn{
    min-height:46px;
    padding:10px 13px;
  }
  .searchResults{
    grid-template-columns:1fr !important;
    gap:8px;
    margin-top:12px;
  }
  .searchHit{
    padding:13px;
    border-radius:14px;
  }
  .searchHit b{font-size:13.5px}
  .searchHit span{font-size:11px}

  /* Product detail: mobile bottom sheet */
  .modal{
    padding:0 !important;
    place-items:end stretch !important;
  }
  .modalCard{
    width:100% !important;
    max-height:94svh;
    border-radius:24px 24px 0 0 !important;
    padding-bottom:env(safe-area-inset-bottom);
  }
  .productDetail{
    grid-template-columns:1fr !important;
  }
  .detailVisual{
    min-height:245px !important;
    border-radius:24px 24px 0 0 !important;
  }
  .detailCopy{
    padding:19px 17px 23px !important;
  }
  .detailCopy h2{
    font-size:26px !important;
    line-height:1.22;
  }
  .detailPrice{font-size:21px}
  .detailText{
    font-size:13px;
    line-height:1.72;
  }
  .specGrid{
    grid-template-columns:1fr 1fr !important;
    gap:7px;
    margin:14px 0;
  }
  .spec{
    padding:9px;
    border-radius:12px;
  }
  .spec b{font-size:11px}
  .spec span{font-size:10px}
  .variant{
    min-height:40px;
    padding:9px 10px;
    font-size:11.5px;
  }
  .detailActions{
    flex-direction:column !important;
    gap:8px;
  }
  .detailActions .btn{
    min-height:48px;
  }
  .accordion summary{font-size:13.5px}
  .accordion p{
    font-size:12.5px;
    line-height:1.7;
  }

  /* Age gate */
  .age{padding:15px}
  .ageCard{
    padding:25px 19px 19px;
    border-radius:22px;
  }
  .ageCard h3{
    margin:6px 0 9px;
    font-size:24px;
    line-height:1.28;
  }
  .ageCard p{
    font-size:13px;
    line-height:1.7;
  }
  .ageActions{
    flex-direction:column !important;
    gap:8px;
  }
  .ageActions>*{
    min-height:48px;
  }
  .note{
    font-size:10.5px;
    line-height:1.6;
  }

  /* Checkout */
  .checkoutShell{
    width:calc(100% - 28px) !important;
    margin:18px auto 46px !important;
    grid-template-columns:1fr !important;
    gap:11px !important;
  }
  .checkoutCard{
    padding:18px 16px !important;
    border-radius:19px;
  }
  .checkoutCard h2{
    font-size:26px;
    line-height:1.22;
    margin-bottom:15px;
  }
  .checkoutCard h3{
    font-size:16.5px;
    line-height:1.4;
    margin-bottom:11px;
  }
  .grid2{
    grid-template-columns:1fr !important;
    gap:0 !important;
  }
  .payOption{
    padding:12px 13px;
    border-radius:13px;
    font-size:13px;
  }
  .privacyBox{
    padding:11px 12px;
    border-radius:12px;
    font-size:11.5px;
    line-height:1.65;
  }
  .consentRow{
    align-items:flex-start !important;
    gap:8px;
    font-size:11.5px;
    line-height:1.6 !important;
  }
  .consentRow input[type="checkbox"]{
    margin-top:2px;
  }
  .orderLine{
    gap:10px;
    padding:9px 0;
    font-size:12px;
  }
  .checkoutCard .btn.primary{
    min-height:49px;
    font-size:14px;
  }

  /* Payment */
  .payShell{
    width:calc(100% - 28px);
    margin:18px auto 46px !important;
    padding:0 !important;
    grid-template-columns:1fr !important;
    gap:11px !important;
  }
  .payMain h1{
    font-size:28px !important;
    line-height:1.2;
    margin:7px 0 8px;
  }
  .payIntro{
    font-size:13px;
    line-height:1.68;
  }
  .payAmount{
    padding:17px 0 14px;
    margin-top:7px;
  }
  .payAmount span{font-size:12px}
  .payAmount b{font-size:26px}
  .payMethods{
    grid-template-columns:1fr !important;
    gap:8px;
    margin:16px 0 12px;
  }
  .payMethod{
    min-height:52px;
    padding:13px 14px;
    border-radius:14px;
    font-size:13.5px;
  }
  .payNow{
    min-height:50px;
    padding:13px 15px;
    font-size:14px;
  }
  .payHint{
    margin-top:9px;
    min-height:18px;
    font-size:11.5px;
    line-height:1.55;
  }
  .payWaiting{
    padding:11px 12px;
    border-radius:13px;
    gap:9px;
    font-size:12px;
  }
  .payWaiting small{font-size:10.5px}
  .paySide{position:static}
  .policyContextLink{
    margin-top:12px;
    font-size:12px;
  }

  /* Track / order lookup */
  .pageHero{
    padding:30px 0 10px;
  }
  .pageHero h1{
    margin:6px 0;
    font-size:30px;
    line-height:1.2;
    letter-spacing:-.025em;
  }
  .pageHero p{
    font-size:13px;
    line-height:1.68;
  }
  .orderLookupCard{
    margin-bottom:46px;
  }
  .trackFields{
    grid-template-columns:1fr !important;
    gap:9px;
  }
  .trackSubmit{
    width:100%;
    height:auto;
    min-height:48px;
  }
  .orderSummaryGrid{
    grid-template-columns:1fr 1fr !important;
    gap:7px;
  }
  .orderSummaryGrid>div{
    padding:10px;
    border-radius:12px;
  }
  .orderSummaryGrid span{font-size:9.5px}
  .orderSummaryGrid b{
    font-size:12px;
    line-height:1.45;
  }
  .orderInfoBlock,
  .supportPanel{
    padding:12px;
    border-radius:13px;
  }
  .orderInfoBlock>b,
  .supportPanel summary{
    font-size:12.5px;
  }
  .timeline{margin-top:17px}
  .step{
    grid-template-columns:18px 1fr;
    gap:9px;
    padding:7px 0;
  }
  .step b{font-size:12.5px}
  .step span{
    font-size:10.5px;
    line-height:1.5;
  }
  .continuePayBox{
    justify-content:stretch;
    margin:13px 0 3px;
  }
  .continuePayBox .btn{
    width:100%;
    min-height:46px;
  }
  .logisticsEvent b{
    font-size:11.5px;
    line-height:1.55;
  }
  .logisticsEvent span{
    font-size:10px;
    line-height:1.55;
  }

  /* Success */
  .success{
    width:calc(100% - 28px);
    margin:32px auto 46px;
    padding:30px 18px;
    border-radius:23px;
  }
  .successMark{
    width:58px;
    height:58px;
    margin-bottom:15px;
    font-size:25px;
  }
  .success h1,
  .success h2{
    font-size:25px;
    line-height:1.25;
  }
  .success p{
    font-size:13px;
    line-height:1.7;
  }
  .success .btn{
    min-height:46px;
  }

  /* Policy */
  .policyHero{
    padding:25px 0 9px;
  }
  .policyHeroCard{
    padding:27px 19px;
    border-radius:23px;
  }
  .policyKicker{
    height:26px;
    padding:0 9px;
    font-size:9.5px;
  }
  .policyHero h1{
    margin:11px 0 8px;
    font-size:29px;
    line-height:1.18;
    letter-spacing:-.025em;
  }
  .policyHero p{
    font-size:13px;
    line-height:1.7;
  }
  .policyQuickNav{
    gap:6px;
    margin-top:17px;
  }
  .policyQuickNav a{
    min-height:34px;
    padding:0 10px;
    font-size:10.5px;
  }
  .policyList{
    margin:14px auto 46px;
    border-radius:20px;
  }
  .policySection{
    grid-template-columns:1fr !important;
    gap:6px;
    padding:21px 17px;
  }
  .policyNo{
    padding-top:0;
    font-size:9.5px;
  }
  .policyContent h2{
    margin:0 0 8px;
    font-size:18px;
    line-height:1.35;
  }
  .policyContent p,
  .policyContent li{
    font-size:12.5px;
    line-height:1.78;
  }
  .policyReturnArea{padding-bottom:31px}
  .policyReturnCard{
    flex-direction:column;
    align-items:stretch;
    gap:12px;
    padding:17px;
    border-radius:15px;
  }
  .policyReturnCard span{
    font-size:12px;
  }
  .policyReturnCard .btn{
    width:100%;
    min-height:46px;
    justify-content:center;
  }

  /* Admin: mobile usability only */
  .adminWrap{
    margin-bottom:46px;
  }
  .adminLogin{
    display:block;
  }
  .adminLogin .btn{
    width:100%;
    min-height:46px;
    margin-top:8px;
  }
  .adminOrder{
    margin:10px 0;
  }
  .adminOrderHead{
    align-items:flex-start;
    gap:8px;
    margin-bottom:11px;
  }
  .adminOrderHead b{font-size:13px}
  .adminOrderHead span{font-size:10px}
  .adminGrid{
    grid-template-columns:1fr 1fr !important;
    gap:7px;
  }
  .adminGrid>div{
    padding:10px;
    border-radius:12px;
  }
  .adminGrid span{font-size:9.5px}
  .adminGrid b{font-size:11.5px}
  .shippingAdminBox{
    padding:12px;
    border-radius:14px;
  }
  .shippingAdminTitle{
    display:block;
    margin-bottom:9px;
  }
  .shippingAdminTitle b{font-size:12.5px}
  .shippingAdminTitle span{
    display:block;
    margin-top:3px;
    font-size:10px;
  }
}

/* Extra-small phones only */
@media (max-width:380px){
  .hero .heroTitle{
    font-size:32px !important;
  }
  .wrap,
  .checkoutShell,
  .payShell,
  .success,
  .searchWrap{
    width:calc(100% - 24px) !important;
  }
  .heroCopy{
    padding-left:17px !important;
    padding-right:17px !important;
  }
  .productName{
    font-size:13px;
  }
  .price{
    font-size:15px;
  }
  .hero .heroTitle .hero-line-top .hero-hearts span{
    font-size:.42em !important;
  }
}

/* =========================================================
   LOOMI · MOBILE TYPOGRAPHY / COMPONENT REFINEMENT v2
   Screens <= 640px only. Colors and desktop layout untouched.
   ========================================================= */
@media (max-width:640px){

  /* Overall mobile rhythm */
  body{
    font-size:14px;
    line-height:1.58;
  }
  section{padding:29px 0}
  .wrap{width:calc(100% - 30px)}

  /* Header: reduce visual weight */
  .nav{
    min-height:54px !important;
    padding-top:0;
    padding-bottom:0;
  }
  .logo{
    font-size:16px !important;
    letter-spacing:.16em;
  }
  .actions{gap:7px}
  .actions .btn{
    min-height:38px !important;
    padding:8px 13px !important;
    border-radius:999px;
    font-size:11.5px !important;
  }
  .iconbtn{
    width:38px !important;
    height:38px !important;
  }

  /* Announcement bar */
  .topbar{
    padding:7px 10px !important;
    font-size:10px !important;
  }

  /* Hero: screenshot currently feels oversized */
  .hero{padding:12px 0 14px}
  .heroCopy{
    padding:24px 18px 21px !important;
    border-radius:22px !important;
  }
  .heroCopy>.eyebrow{
    margin-bottom:9px !important;
    font-size:9px !important;
    letter-spacing:.13em !important;
  }
  .hero .heroTitle{
    font-size:30px !important;
    line-height:1.16 !important;
    margin:0 0 14px !important;
    font-weight:700 !important;
  }
  .hero .heroTitle .hero-line-bottom{
    margin-top:2px !important;
  }
  .hero .heroTitle .hero-hearts{
    gap:2px !important;
    margin-left:1px !important;
  }
  .hero .heroTitle .hero-hearts span{
    font-size:.40em !important;
    opacity:.66 !important;
  }
  .heroCopy .lead{
    font-size:13.5px !important;
    line-height:1.66 !important;
  }

  /* Keep CTAs compact and balanced instead of oversized */
  .heroCta{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    margin-top:17px !important;
  }
  .heroCta .btn{
    min-height:43px !important;
    padding:10px 8px !important;
    font-size:12px !important;
    white-space:nowrap;
  }
  .trustline{
    gap:8px 10px !important;
    margin-top:17px !important;
    padding-top:14px !important;
    font-size:10.5px !important;
  }

  /* Section labels / titles */
  .eyebrow{
    font-size:9px !important;
    letter-spacing:.13em !important;
  }
  .sectionHead{
    margin-bottom:14px !important;
  }
  .sectionHead h2{
    font-size:22px !important;
    line-height:1.28 !important;
    letter-spacing:-.018em !important;
  }
  .sectionHead p{
    margin-top:7px !important;
    font-size:12.5px !important;
    line-height:1.65 !important;
  }

  /* Scene cards */
  .cards4{gap:8px !important}
  .moodCard{
    min-height:104px !important;
    padding:13px 12px !important;
    border-radius:16px !important;
  }
  .moodCard strong{
    font-size:13.5px !important;
    line-height:1.35 !important;
  }
  .moodCard span{
    font-size:10px !important;
    line-height:1.45 !important;
  }

  /* Product grid */
  .products{gap:8px !important}
  .cardBody{padding:10px 9px 11px !important}
  .meta{font-size:8px !important}
  .productName{
    min-height:35px !important;
    font-size:12.5px !important;
    line-height:1.38 !important;
  }
  .price{font-size:15px !important}
  .priceRow .btn.small{
    min-width:47px !important;
    min-height:34px !important;
    padding:6px 7px !important;
    font-size:10px !important;
  }
  .filter{
    min-height:36px !important;
    padding:7px 9px !important;
    font-size:10.5px !important;
  }
  .sort{
    min-height:38px !important;
    font-size:11px !important;
  }

  /* Privacy module: currently too dominant in screenshot */
  .banner{
    gap:13px !important;
    padding:19px 17px !important;
    border-radius:20px !important;
  }
  .banner h3{
    margin-bottom:7px !important;
    font-size:19px !important;
    line-height:1.38 !important;
    letter-spacing:-.01em;
  }
  .banner p{
    font-size:12px !important;
    line-height:1.66 !important;
  }
  .banner .privacyCta{
    min-height:42px !important;
    font-size:12px !important;
  }

  /* Four benefits: smaller and more editorial */
  .features{gap:7px !important}
  .compactFeatures .feature{
    min-height:55px !important;
    padding:9px 7px !important;
  }
  .compactFeatures .feature b{
    font-size:11px !important;
    line-height:1.4 !important;
    font-weight:650 !important;
  }

  /* Help me choose */
  .quiz{
    gap:14px !important;
    padding:19px 15px !important;
    border-radius:20px !important;
  }
  .quiz .guideTitle,
  .quiz h3{
    font-size:21px !important;
    line-height:1.28 !important;
  }
  .quizBox{
    padding:14px 12px !important;
    border-radius:16px !important;
  }
  .formField label{
    font-size:11.5px !important;
  }
  .formField input,
  .formField select,
  .formField textarea{
    min-height:46px !important;
    font-size:16px !important;
  }
  .quizBox .btn.primary{
    min-height:44px !important;
    font-size:12.5px !important;
  }
  .quizResult{
    min-height:96px !important;
    font-size:12px !important;
    line-height:1.62 !important;
  }

  /* Reviews: screenshot is far too large and airy */
  .reviews{gap:8px !important}
  .review{
    padding:14px 13px !important;
    border-radius:15px !important;
  }
  .stars{
    font-size:11.5px !important;
  }
  .review p{
    margin:7px 0 8px !important;
    font-size:12.25px !important;
    line-height:1.66 !important;
  }
  .review small{
    font-size:9.5px !important;
  }

  /* FAQ */
  .faq{gap:7px !important}
  .faq details{
    padding:13px 12px !important;
    border-radius:14px !important;
  }
  .faq summary{
    font-size:12.5px !important;
    line-height:1.48 !important;
  }
  .faq p{
    font-size:11.5px !important;
    line-height:1.68 !important;
  }

  /* Footer: much shorter / denser */
  footer{
    padding:28px 0 max(34px,env(safe-area-inset-bottom)) !important;
  }
  .footerGrid{
    grid-template-columns:1fr 1fr 1fr !important;
    gap:20px 12px !important;
  }
  .footerGrid>div:first-child{
    grid-column:1/-1 !important;
  }
  .footerGrid>div:first-child p{
    max-width:310px;
  }
  .footerGrid h4{
    margin-bottom:6px !important;
    font-size:11.5px !important;
  }
  .footerGrid a,
  .footerGrid p{
    font-size:10.5px !important;
    line-height:1.68 !important;
  }
  .footNote{
    margin-top:17px !important;
    padding-top:12px !important;
    font-size:9.5px !important;
  }

  /* Drawer */
  .drawerHead{padding:13px 14px !important}
  .drawerHead b{font-size:14px !important}
  .drawerBody{padding:2px 14px !important}
  .drawerFoot{padding:12px 14px calc(12px + env(safe-area-inset-bottom)) !important}
  .cartItem{
    grid-template-columns:50px minmax(0,1fr) auto !important;
    gap:9px !important;
    padding:11px 0 !important;
  }
  .thumb{width:50px !important;height:50px !important}
  .cartItem b{font-size:11.5px !important}
  .summaryRow{font-size:11.5px !important}
  .summaryRow.total{font-size:15.5px !important}
  #checkoutBtn{
    min-height:45px !important;
    font-size:12.5px !important;
  }

  /* Product detail */
  .detailVisual{min-height:225px !important}
  .detailCopy{padding:17px 15px 20px !important}
  .detailCopy h2{
    font-size:23px !important;
  }
  .detailPrice{font-size:19px !important}
  .detailText{
    font-size:12px !important;
    line-height:1.66 !important;
  }
  .spec b{font-size:10px !important}
  .spec span{font-size:9px !important}
  .variant{font-size:10.5px !important}
  .detailActions .btn{
    min-height:44px !important;
    font-size:12px !important;
  }

  /* Checkout / payment / track / policy */
  .checkoutCard{
    padding:16px 14px !important;
    border-radius:17px !important;
  }
  .checkoutCard h2{
    font-size:23px !important;
  }
  .checkoutCard h3{
    font-size:15px !important;
  }
  .checkoutCard .btn.primary{
    min-height:46px !important;
    font-size:12.5px !important;
  }

  .payMain h1{
    font-size:25px !important;
  }
  .payIntro{
    font-size:12px !important;
  }
  .payAmount b{font-size:23px !important}
  .payMethod{
    min-height:48px !important;
    font-size:12.5px !important;
  }
  .payNow{
    min-height:46px !important;
    font-size:12.5px !important;
  }

  .pageHero h1{
    font-size:27px !important;
  }
  .pageHero p{
    font-size:12px !important;
  }
  .trackSubmit{
    min-height:45px !important;
    font-size:12px !important;
  }

  .policyHeroCard{
    padding:23px 17px !important;
  }
  .policyHero h1{
    font-size:26px !important;
  }
  .policyHero p{
    font-size:12px !important;
  }
  .policySection{
    padding:18px 15px !important;
  }
  .policyContent h2{
    font-size:16.5px !important;
  }
  .policyContent p,
  .policyContent li{
    font-size:11.5px !important;
    line-height:1.72 !important;
  }

  /* Success */
  .success{
    padding:26px 16px !important;
  }
  .success h1,
  .success h2{
    font-size:23px !important;
  }
  .success p{
    font-size:12px !important;
  }
}

@media (max-width:380px){
  .hero .heroTitle{
    font-size:28px !important;
  }
  .heroCta .btn{
    font-size:11.5px !important;
  }
  .sectionHead h2{
    font-size:21px !important;
  }
  .footerGrid{
    gap:18px 8px !important;
  }
}


/* Mobile header alignment refinement: keep controls on the far right */
@media (max-width:640px){
  .nav{
    gap:0 !important;
  }
  .nav .actions{
    margin-left:auto !important;
    justify-content:flex-end !important;
    flex:0 0 auto !important;
  }
  .nav .logo{
    margin-right:12px !important;
  }
}


/* VEIL 11 · purchase-side preview + sticky mobile buy bar */
.productVisual .productPhoto{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}
.productCard:hover .productPhoto{transform:scale(1.015)}
.productVisual .badge,.productVisual .wish{z-index:2}
.thumb{overflow:hidden}
.cartPhoto{width:100%;height:100%;object-fit:cover;display:block}

.modalCard.apparelModal{
  width:min(1260px,calc(100% - 28px));
  max-height:94vh;
  border-radius:26px;
}
.apparelDetail{
  display:grid;
  grid-template-columns:minmax(0,1.22fr) minmax(370px,.78fr);
  align-items:start;
  background:var(--paper);
  position:relative;
}
.apparelDetailPane{
  min-width:0;
  background:#fff;
  border-right:1px solid var(--line);
  padding:26px 22px 40px;
}
.apparelDetailFocus{
  width:min(74%,620px);
  margin:0 auto 22px;
  padding:14px 14px 16px;
  border:1px solid rgba(189,167,157,.34);
  border-radius:20px;
  background:linear-gradient(180deg,#fdf9f7 0%,#fff 100%);
  box-shadow:0 10px 26px rgba(40,24,18,.05);
}
.apparelDetailFocusHead{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:10px;
  margin-bottom:10px;
}
.apparelDetailFocusHead b{
  font-size:12px;
  line-height:1.3;
}
.apparelDetailFocusHead span{
  font-size:10px;
  color:var(--muted);
  line-height:1.4;
  text-align:right;
}
.apparelDetailFocusImage{
  display:block;
  width:100%;
  height:auto;
  border-radius:14px;
  background:#fff;
}
.apparelDetailImageWrap{
  display:flex;
  justify-content:center;
  align-items:flex-start;
}
.apparelLongDetail{
  display:block;
  width:min(47%,456px);
  height:auto;
  margin:0 auto;
  border-radius:18px;
  box-shadow:0 8px 24px rgba(30,18,14,.055);
  image-rendering:auto;
}

.apparelPurchase{
  position:sticky;
  top:0;
  align-self:start;
  max-height:94vh;
  overflow:auto;
  padding:58px 34px 34px;
  background:var(--paper);
  scrollbar-width:thin;
}
.apparelPurchase h2{
  font-size:34px;
  line-height:1.16;
  letter-spacing:-.03em;
  margin:8px 0 6px;
}
.apparelSubtitle{
  margin:0 0 10px;
  color:var(--muted);
  font-size:12.5px;
  line-height:1.6;
}
.apparelPurchase .detailPrice{
  font-size:27px;
  margin:8px 0 14px;
}

.apparelPreviewShell{margin:0 0 15px}
.apparelPreviewHead{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:8px;
}
.apparelPreviewHead span{
  font-size:10.5px;
  color:var(--muted);
}
.apparelPreviewHead b{
  font-size:11px;
  line-height:1.4;
  color:var(--ink);
}
.apparelPreviewCard{
  border:1px solid var(--line);
  border-radius:17px;
  background:linear-gradient(180deg,#fcf8f6 0%,#fff 100%);
  padding:10px;
  overflow:hidden;
}
.apparelVariantPreview{
  display:block;
  width:100%;
  aspect-ratio:1/1;
  height:auto;
  object-fit:cover;
  object-position:center;
  margin:0 auto;
  border-radius:14px;
  background:#f7f2ef;
}

.apparelBundle{
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding:12px 13px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fffaf7;
  margin:0 0 12px;
}
.apparelBundle b{font-size:11.5px}
.apparelBundle span{
  font-size:11px;
  color:var(--muted);
  text-align:right;
}
.apparelPurchase .detailText{
  font-size:12px;
  line-height:1.62;
}
.apparelMiniSpecs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin:13px 0 15px;
}
.apparelMiniSpecs>div{
  border:1px solid var(--line);
  border-radius:13px;
  padding:9px 10px;
}
.apparelMiniSpecs span{
  display:block;
  font-size:9.5px;
  color:var(--muted);
  margin-bottom:3px;
}
.apparelMiniSpecs b{
  font-size:10.5px;
  line-height:1.42;
}

.apparelVariantField{margin-top:2px}
.apparelVariantField>label{
  display:block;
  margin-bottom:7px;
  font-size:11.5px;
}
.apparelVariants{
  display:grid;
  grid-template-columns:1fr;
  gap:7px;
}
.apparelVariants .apparelVariantCard{
  width:100%;
  min-height:62px;
  display:grid;
  grid-template-columns:46px minmax(0,1fr) 18px;
  gap:10px;
  align-items:center;
  text-align:left;
  padding:7px 9px;
  border-radius:14px;
  position:relative;
}
.variantThumb{
  width:46px;
  height:46px;
  border-radius:10px;
  overflow:hidden;
  background:#f5f1ee;
  border:1px solid var(--line);
}
.variantThumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.variantText{
  min-width:0;
  display:block;
}
.variantText b{
  display:block;
  font-size:11.5px;
  line-height:1.35;
}
.variantText small{
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:9.5px;
  line-height:1.35;
}
.variantCheck{
  opacity:0;
  font-size:13px;
  text-align:center;
}
.apparelVariantCard.active .variantCheck{opacity:1}

.apparelDesktopActions{margin-top:13px}
.apparelPrivacy{margin-top:12px}
.apparelNotice{
  margin-top:9px;
  font-size:10px;
  color:var(--muted);
  line-height:1.58;
}
.apparelMobileBar{display:none}

@media(max-width:960px){
  .modalCard.apparelModal{
    width:min(820px,100%);
    max-height:94svh;
  }
  .apparelDetail{grid-template-columns:1fr}
  .apparelPurchase{
    order:1;
    position:static;
    max-height:none;
    overflow:visible;
    padding:54px 28px 25px;
  }
  .apparelDetailPane{
    order:2;
    border-right:0;
    border-top:1px solid var(--line);
    padding:18px 18px 34px;
  }
  .apparelPreviewCard{
    max-width:460px;
  }
  .apparelVariantPreview{
    aspect-ratio:1/1;
    height:auto;
  }
  .apparelDetailFocus{
    width:min(78%,560px);
    margin-bottom:18px;
    padding:12px 12px 14px;
  }
  .apparelDetailFocusHead b{font-size:11.5px}
  .apparelDetailFocusHead span{font-size:9.5px}
  .apparelLongDetail{
    width:min(55%,420px);
  }
}

@media(max-width:640px){
  .modalCard.apparelModal{
    width:100%!important;
    border-radius:24px 24px 0 0!important;
    padding-bottom:calc(72px + env(safe-area-inset-bottom));
  }
  .apparelPurchase{padding:52px 16px 20px}
  .apparelPurchase h2{
    font-size:23px;
    line-height:1.24;
  }
  .apparelSubtitle{font-size:11px}
  .apparelPurchase .detailPrice{
    font-size:21px;
    margin:7px 0 12px;
  }
  .apparelPreviewShell{margin-bottom:13px}
  .apparelPreviewHead{margin-bottom:7px}
  .apparelPreviewCard{
    max-width:none;
    padding:9px;
    border-radius:15px;
  }
  .apparelVariantPreview{
    aspect-ratio:1/1;
    height:auto;
    border-radius:12px;
  }
  .apparelBundle{
    padding:10px 11px;
    margin-bottom:10px;
  }
  .apparelBundle b,.apparelBundle span{
    font-size:10px;
  }
  .apparelPurchase .detailText{
    font-size:11.5px!important;
    line-height:1.62!important;
  }
  .apparelMiniSpecs{
    margin:11px 0 13px;
  }
  .apparelMiniSpecs>div{padding:8px 9px}
  .apparelMiniSpecs b{font-size:10px}
  .apparelVariants{
    grid-template-columns:1fr 1fr 1fr;
    gap:6px;
  }
  .apparelVariants .apparelVariantCard{
    min-height:0;
    display:block;
    padding:6px;
    text-align:center;
  }
  .variantThumb{
    width:100%;
    height:auto;
    aspect-ratio:1/1;
    margin-bottom:6px;
  }
  .variantText b{
    font-size:10px;
    white-space:nowrap;
  }
  .variantText small{display:none}
  .variantCheck{
    position:absolute;
    top:7px;
    right:7px;
    width:20px;
    height:20px;
    border-radius:50%;
    line-height:20px;
    background:rgba(255,255,255,.92);
    box-shadow:0 1px 5px rgba(0,0,0,.08);
  }
  .apparelDesktopActions{
    display:none!important;
  }
  .apparelPrivacy{
    font-size:10px!important;
    margin-top:12px;
  }
  .apparelDetailPane{
    padding:14px 10px 28px;
  }
  .apparelDetailFocus{
    width:min(92%,420px);
    margin-bottom:16px;
    padding:11px 11px 13px;
    border-radius:16px;
  }
  .apparelDetailFocusHead{
    display:block;
    margin-bottom:8px;
  }
  .apparelDetailFocusHead span{
    display:block;
    margin-top:3px;
    text-align:left;
    font-size:9px;
  }
  .apparelLongDetail{
    width:min(60%,300px);
    border-radius:13px;
  }

  .apparelMobileBar{
    display:flex;
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:80;
    align-items:center;
    gap:10px;
    padding:9px 12px calc(9px + env(safe-area-inset-bottom));
    background:rgba(252,249,247,.97);
    backdrop-filter:blur(14px);
    border-top:1px solid var(--line);
    box-shadow:0 -8px 22px rgba(35,24,20,.08);
  }
  .apparelMobileBarInfo{
    min-width:0;
    flex:1;
  }
  .apparelMobileBarInfo b{
    display:block;
    font-size:16px;
    line-height:1.15;
  }
  .apparelMobileBarInfo span{
    display:block;
    margin-top:2px;
    font-size:9.5px;
    color:var(--muted);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .apparelMobileBarInfo em{
    font-style:normal;
    color:var(--ink);
  }
  .apparelMobileBar .btn{
    min-width:112px;
    min-height:43px;
    font-size:11.5px;
  }
}

/* VEIL 11 · desktop scroll repair — preserve approved V3 layout */
@media (min-width:961px){
  /* The modal card is the ONLY vertical scroll container on desktop. */
  .modalCard.apparelModal{
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
  }

  /* Keep the approved purchase layout, but never create a second scrollbar. */
  .apparelPurchase{
    position:sticky;
    top:0;
    max-height:none;
    overflow:visible;
    scrollbar-width:auto;
  }

  /* Preserve the approved vertical variant layout and text treatment. */
  .apparelVariants{
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
  }
  .apparelVariants .apparelVariantCard{
    width:100%;
    min-height:62px;
    display:grid;
    grid-template-columns:46px minmax(0,1fr) 18px;
    gap:10px;
    align-items:center;
    text-align:left;
    padding:7px 9px;
  }
  .apparelVariants .variantText b{
    white-space:normal;
    overflow-wrap:normal;
    word-break:keep-all;
  }
  .apparelVariants .variantText small{
    display:block;
    white-space:normal;
  }

  /* Close control floats independently and no longer steals column width. */
  .modalCard.apparelModal .modalClose{
    position:absolute;
    top:14px;
    right:14px;
    margin:0;
    float:none;
    z-index:12;
  }
}

/* Keep the close button out of document flow on mobile/tablet as well. */
@media (max-width:960px){
  .modalCard.apparelModal .modalClose{
    position:absolute;
    top:12px;
    right:12px;
    margin:0;
    float:none;
    z-index:12;
  }
}


/* Product detail: independent desktop scroll areas + LOOMI themed scrollbars */
@media (min-width:961px){
  .modalCard.apparelModal{
    max-height:94vh;
    overflow:hidden !important;
  }

  .apparelDetail{
    height:94vh;
    max-height:94vh;
    overflow:hidden;
    align-items:stretch;
  }

  .apparelDetailPane{
    height:94vh;
    max-height:94vh;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:#bda79d #f4ece8;
  }

  .apparelPurchase{
    position:relative !important;
    top:auto !important;
    align-self:stretch;
    height:94vh;
    max-height:94vh;
    overflow-y:auto !important;
    overflow-x:hidden;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:#bda79d #f4ece8;
  }

  .apparelDetailPane::-webkit-scrollbar,
  .apparelPurchase::-webkit-scrollbar{
    width:8px;
  }

  .apparelDetailPane::-webkit-scrollbar-track,
  .apparelPurchase::-webkit-scrollbar-track{
    background:#f4ece8;
    border-radius:999px;
  }

  .apparelDetailPane::-webkit-scrollbar-thumb,
  .apparelPurchase::-webkit-scrollbar-thumb{
    background:#bda79d;
    border-radius:999px;
    border:2px solid #f4ece8;
  }

  .apparelDetailPane::-webkit-scrollbar-thumb:hover,
  .apparelPurchase::-webkit-scrollbar-thumb:hover{
    background:#9f877c;
  }

  .apparelDetailPane::-webkit-scrollbar-corner,
  .apparelPurchase::-webkit-scrollbar-corner{
    background:transparent;
  }
}

/* Mobile/tablet keep one natural page scroll and hide cosmetic scrollbars */
@media (max-width:960px){
  .modalCard.apparelModal{
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }

  .apparelDetail{
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }

  .apparelDetailPane,
  .apparelPurchase{
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    scrollbar-width:none;
  }

  .apparelDetailPane::-webkit-scrollbar,
  .apparelPurchase::-webkit-scrollbar{
    display:none;
  }
}


/* VEIL 11 · final layout unification */
.modalCard.apparelModal .modalClose{
  position:absolute;
  top:14px;
  right:14px;
  margin:0;
  float:none;
  z-index:20;
}

.apparelDetailCard{
  border:1px solid rgba(189,167,157,.34);
  border-radius:18px;
  background:linear-gradient(180deg,#fdf9f7 0%,#fff 100%);
  box-shadow:0 10px 26px rgba(40,24,18,.05);
  padding:12px;
}
.apparelDetailCardHead{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:10px;
  margin-bottom:10px;
}
.apparelDetailCardHead b{
  font-size:12px;
  line-height:1.3;
  color:var(--ink);
}
.apparelDetailCardHead span{
  font-size:10px;
  line-height:1.4;
  color:var(--muted);
  text-align:right;
}
.apparelDetailFocusImage,
.apparelLongDetail{
  display:block;
  width:100%;
  height:auto;
  background:#fff;
}
.apparelDetailFocusImage{border-radius:14px;}
.apparelLongDetail{border-radius:14px; box-shadow:none;}
.apparelDetailImageWrap{display:block;}

@media (min-width:961px){
  .modalCard.apparelModal{
    width:min(1320px,calc(100% - 36px));
    max-height:94vh;
    overflow:hidden !important;
  }
  .apparelDetail{
    display:grid;
    grid-template-columns:minmax(0,52%) minmax(480px,48%) !important;
    height:94vh;
    max-height:94vh;
    overflow:hidden;
    align-items:stretch;
  }
  .apparelDetailPane{
    min-width:0;
    height:94vh;
    max-height:94vh;
    overflow-y:auto;
    overflow-x:hidden;
    padding:24px 14px 30px;
    border-right:1px solid var(--line);
    background:#fff;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:#bda79d #f4ece8;
  }
  .apparelDetailStack{
    width:min(100%,428px);
    margin:0 auto;
    display:flex;
    flex-direction:column;
    gap:18px;
  }
  .apparelDetailCard{padding:12px;}
  .apparelDetailCardHead{margin-bottom:10px;}
  .apparelPurchase{
    position:relative !important;
    top:auto !important;
    align-self:stretch;
    height:94vh;
    max-height:94vh;
    overflow-y:auto !important;
    overflow-x:hidden;
    padding:56px 42px 34px;
    background:var(--paper);
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:#bda79d #f4ece8;
  }
  .apparelPreviewShell{width:min(100%,280px); margin:0 auto 16px;}
  .apparelPreviewCard{padding:10px;}
  .apparelPurchase h2{font-size:34px;}
  .apparelVariantField>label{font-size:12px;}

  .apparelDetailPane::-webkit-scrollbar,
  .apparelPurchase::-webkit-scrollbar{width:8px;}
  .apparelDetailPane::-webkit-scrollbar-track,
  .apparelPurchase::-webkit-scrollbar-track{background:#f4ece8; border-radius:999px;}
  .apparelDetailPane::-webkit-scrollbar-thumb,
  .apparelPurchase::-webkit-scrollbar-thumb{background:#bda79d; border-radius:999px; border:2px solid #f4ece8;}
  .apparelDetailPane::-webkit-scrollbar-thumb:hover,
  .apparelPurchase::-webkit-scrollbar-thumb:hover{background:#9f877c;}
}

@media (max-width:960px){
  .modalCard.apparelModal{
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
  .apparelDetail{
    grid-template-columns:1fr !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }
  .apparelPurchase{
    order:1;
    position:static !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    padding:54px 24px 24px;
    scrollbar-width:none;
  }
  .apparelDetailPane{
    order:2;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    padding:18px 18px 32px;
    border-right:0;
    border-top:1px solid var(--line);
    scrollbar-width:none;
  }
  .apparelDetailStack{
    width:min(100%,520px);
    margin:0 auto;
    display:flex;
    flex-direction:column;
    gap:16px;
  }
  .apparelDetailCard{padding:11px; border-radius:16px;}
  .apparelDetailCardHead b{font-size:11.5px;}
  .apparelDetailCardHead span{font-size:9.5px;}
  .apparelLongDetail{max-width:100%;}
  .apparelDetailPane::-webkit-scrollbar,
  .apparelPurchase::-webkit-scrollbar{display:none;}
}

@media (max-width:640px){
  .modalCard.apparelModal{
    width:100%!important;
    border-radius:24px 24px 0 0!important;
    padding-bottom:calc(72px + env(safe-area-inset-bottom));
  }
  .modalCard.apparelModal .modalClose{top:12px; right:12px;}
  .apparelPurchase{padding:52px 16px 20px !important;}
  .apparelDetailPane{padding:14px 10px 28px !important;}
  .apparelDetailStack{width:min(100%,420px); gap:14px;}
  .apparelDetailCard{padding:10px; border-radius:15px;}
  .apparelDetailCardHead{display:block; margin-bottom:8px;}
  .apparelDetailCardHead span{display:block; margin-top:3px; text-align:left; font-size:9px;}
  .apparelPreviewShell{margin:0 auto 13px;}
}

/* LOOMI product detail · phone-first final tuning (desktop untouched) */
@media (max-width:640px){
  .modalCard.apparelModal{
    max-height:94svh;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    scroll-behavior:smooth;
  }

  /* Purchase area: compact first screen and consistent vertical rhythm. */
  .apparelPurchase{
    display:flex;
    flex-direction:column;
    padding:48px 14px 18px !important;
  }
  .apparelPurchase>.eyebrow{order:1;margin-bottom:3px}
  .apparelPurchase>h2{order:2;margin:4px 0 4px;font-size:22px;line-height:1.22}
  .apparelPurchase>.apparelSubtitle{order:3;margin:0 0 5px;font-size:10.5px;line-height:1.45}
  .apparelPurchase>.detailPrice{order:4;margin:4px 0 10px;font-size:21px}
  .apparelPurchase>.apparelPreviewShell{order:5}
  .apparelPurchase>.apparelVariantField{order:6}
  .apparelPurchase>.apparelBundle{order:7}
  .apparelPurchase>.apparelMiniSpecs{order:8}
  .apparelPurchase>.detailText{order:9}
  .apparelPurchase>.apparelDesktopActions{order:10}
  .apparelPurchase>.apparelPrivacy{order:11}
  .apparelPurchase>.apparelNotice{order:12}

  /* Main preview: visible, but no longer dominates the first screen. */
  .apparelPreviewShell{
    width:min(72vw,268px) !important;
    margin:0 auto 11px !important;
  }
  .apparelPreviewHead{
    margin-bottom:6px !important;
  }
  .apparelPreviewHead span{font-size:9.5px}
  .apparelPreviewHead b{font-size:10px}
  .apparelPreviewCard{
    width:100%;
    max-width:none !important;
    padding:7px !important;
    border-radius:15px !important;
  }
  .apparelVariantPreview{
    width:100%;
    aspect-ratio:1/1;
    height:auto !important;
    border-radius:12px !important;
  }

  /* Variants appear immediately after the preview. */
  .apparelVariantField{margin:0 0 11px !important}
  .apparelVariantField>label{
    margin-bottom:6px;
    font-size:10.5px;
  }
  .apparelVariants{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:6px !important;
  }
  .apparelVariants .apparelVariantCard{
    min-width:0;
    min-height:0;
    display:block !important;
    padding:6px !important;
    text-align:center !important;
    border-radius:12px !important;
  }
  .variantThumb{
    width:100% !important;
    height:auto !important;
    aspect-ratio:1/1;
    margin:0 0 5px !important;
    border-radius:9px !important;
  }
  .variantText b{
    font-size:9.7px !important;
    line-height:1.25;
    white-space:nowrap !important;
  }
  .variantText small{display:none !important}
  .variantCheck{
    top:6px !important;
    right:6px !important;
    width:18px !important;
    height:18px !important;
    line-height:18px !important;
    font-size:11px !important;
  }

  /* Secondary product information is compact and consistent. */
  .apparelBundle{
    margin:0 0 9px !important;
    padding:9px 10px !important;
    border-radius:12px !important;
  }
  .apparelBundle b,.apparelBundle span{font-size:9.7px !important}
  .apparelMiniSpecs{
    margin:0 0 9px !important;
    gap:6px !important;
  }
  .apparelMiniSpecs>div{
    padding:8px 9px !important;
    border-radius:11px !important;
  }
  .apparelMiniSpecs span{font-size:8.8px !important}
  .apparelMiniSpecs b{font-size:9.7px !important}
  .apparelPurchase>.detailText{
    margin:0 0 10px !important;
    font-size:11px !important;
    line-height:1.6 !important;
  }
  .apparelPrivacy{
    margin:0 0 7px !important;
    font-size:9.7px !important;
    line-height:1.55 !important;
  }
  .apparelNotice{
    margin:0 !important;
    font-size:9.2px !important;
    line-height:1.55 !important;
  }

  /* Detail area: restore readable width on phones; both cards use one system. */
  .apparelDetailPane{
    padding:16px 10px 30px !important;
  }
  .apparelDetailStack{
    width:min(92vw,430px) !important;
    margin:0 auto !important;
    gap:14px !important;
  }
  .apparelDetailCard{
    width:100%;
    box-sizing:border-box;
    padding:10px !important;
    border-radius:15px !important;
  }
  .apparelDetailCardHead{
    display:flex !important;
    align-items:flex-end !important;
    justify-content:space-between !important;
    gap:8px !important;
    margin-bottom:8px !important;
  }
  .apparelDetailCardHead b{font-size:10.8px !important}
  .apparelDetailCardHead span{
    display:block !important;
    margin:0 !important;
    max-width:58%;
    font-size:8.8px !important;
    line-height:1.35 !important;
    text-align:right !important;
  }
  .apparelDetailFocusImage,
  .apparelLongDetail{
    width:100% !important;
    max-width:none !important;
    height:auto !important;
    border-radius:12px !important;
  }

  /* Fixed action remains available while reading the long detail image. */
  .apparelMobileBar{
    min-height:62px;
    padding:8px 11px calc(8px + env(safe-area-inset-bottom)) !important;
  }
  .apparelMobileBarInfo b{font-size:15px !important}
  .apparelMobileBarInfo span{font-size:9px !important}
  .apparelMobileBar .btn{
    min-width:108px !important;
    min-height:42px !important;
  }
}

/* Favorites drawer / mobile sheet */
.wishDrawer .drawerHead{align-items:flex-start}
.wishDrawer .drawerHead h3{margin:3px 0 0;font-size:22px}
.wishDrawerBody{padding-top:8px}
.wishDrawerFoot{border-top:1px solid var(--line);padding:14px 22px 18px;color:var(--muted);font-size:10.5px;background:#fffaf6}
.wishItem{display:grid;grid-template-columns:88px minmax(0,1fr);gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.wishItemVisual{width:88px;height:88px;padding:0;border:0;border-radius:17px;overflow:hidden;background:linear-gradient(145deg,#eee3dc,#ccb5aa);display:grid;place-items:center;cursor:pointer}
.wishItemVisual .device{width:30%;height:62%}
.wishItemImage{width:100%;height:100%;object-fit:cover;display:block}
.wishItemCopy{min-width:0}
.wishItemCopy>b{display:block;margin:3px 0 4px;font-size:14px;line-height:1.35}
.wishItemCopy>span{display:block;font-weight:850;font-size:14px}
.wishItemActions{display:flex;align-items:center;gap:9px;margin-top:9px}
.wishItemActions .btn{min-height:32px;padding:6px 10px;font-size:10.5px}
.wishRemove{border:0;background:transparent;padding:6px 2px;color:var(--muted);font-size:10.5px;cursor:pointer}
.wishRemove:hover{color:var(--ink)}
.wishEmpty{text-align:center;padding:60px 12px;color:var(--muted)}
.wishEmptyHeart{font-size:42px;line-height:1;color:#bda79d;margin-bottom:12px}
.wishEmpty b{display:block;color:var(--ink);font-size:15px}
.wishEmpty p{font-size:11.5px;line-height:1.65;margin:8px auto 16px;max-width:250px}
.loomiToast{position:fixed;left:50%;bottom:28px;z-index:120;transform:translate(-50%,12px);opacity:0;pointer-events:none;background:rgba(40,31,27,.92);color:#fff;border-radius:999px;padding:9px 14px;font-size:11px;box-shadow:0 12px 30px rgba(0,0,0,.16);transition:.18s ease}
.loomiToast.show{opacity:1;transform:translate(-50%,0)}
.mobileFavLink{display:none}

@media(max-width:960px){
  .mobileFavLink{display:flex;width:100%;align-items:center;justify-content:space-between;padding:12px 4px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
  .wishDrawer{top:auto;bottom:0;right:0;left:0;width:100%;height:min(72svh,640px);border-radius:24px 24px 0 0;transform:translateY(105%);box-shadow:0 -22px 60px rgba(0,0,0,.13)}
  .wishDrawer.open{transform:translateY(0)}
  .wishDrawer .drawerHead{padding:15px 16px 12px!important}
  .wishDrawerBody{padding:4px 16px!important}
  .wishDrawerFoot{padding:12px 16px calc(12px + env(safe-area-inset-bottom))}
  .wishItem{grid-template-columns:74px minmax(0,1fr);gap:12px;padding:12px 0}
  .wishItemVisual{width:74px;height:74px;border-radius:15px}
  .wishItemCopy>b{font-size:13px}
  .wishItemActions{margin-top:7px}
  .loomiToast{bottom:calc(82px + env(safe-area-inset-bottom));font-size:10.5px}
}

/* VEIL 11 · larger current-set preview (clearer purchase-side visual) */
@media (min-width:961px){
  .apparelPreviewShell{
    width:min(100%,392px) !important;
    margin:0 auto 18px !important;
  }
  .apparelPreviewHead{
    margin-bottom:9px !important;
  }
  .apparelPreviewHead span{
    font-size:11px !important;
  }
  .apparelPreviewHead b{
    font-size:12px !important;
    line-height:1.45 !important;
  }
  .apparelPreviewCard{
    width:100%;
    max-width:none !important;
    padding:12px !important;
    border-radius:18px !important;
  }
  .apparelVariantPreview{
    width:100% !important;
    aspect-ratio:1/1 !important;
    border-radius:16px !important;
  }
}

@media (max-width:960px){
  .apparelPreviewShell{
    width:min(100%,430px) !important;
    margin:0 auto 14px !important;
  }
  .apparelPreviewHead{
    margin-bottom:8px !important;
  }
  .apparelPreviewCard{
    width:100%;
    max-width:none !important;
    padding:10px !important;
    border-radius:16px !important;
  }
  .apparelVariantPreview{
    width:100% !important;
    aspect-ratio:1/1 !important;
    border-radius:14px !important;
  }
}

@media (max-width:640px){
  .apparelPreviewShell{
    width:100% !important;
    max-width:none !important;
    margin:0 0 12px !important;
  }
  .apparelPreviewHead span{
    font-size:10px !important;
  }
  .apparelPreviewHead b{
    font-size:11px !important;
    line-height:1.4 !important;
  }
  .apparelPreviewCard{
    padding:10px !important;
    border-radius:16px !important;
  }
  .apparelVariantPreview{
    border-radius:14px !important;
  }
}

/* Favorite toggle UX — instant, reversible product-detail state */
.productWishToggle{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease !important;
}
.productWishToggle .wishBtnIcon{
  display:inline-block;
  width:1em;
  text-align:center;
  font-size:1.05em;
  line-height:1;
}
.productWishToggle.active{
  background:#f3e8e4 !important;
  border-color:#c9aaa0 !important;
  color:#5a3f37 !important;
}
.productWishToggle.active:hover{
  background:#eee0db !important;
  border-color:#b9958a !important;
}

/* theme-colored selected state for apparel package cards */
.apparelVariantCard.active{
  background:#f4ebe5 !important;
  border-color:#b89484 !important;
  color:#5b4036 !important;
  box-shadow:0 0 0 1px rgba(184,148,132,.16), 0 8px 20px rgba(119,88,77,.08) !important;
}
.apparelVariantCard.active:hover{
  background:#f2e7e0 !important;
  border-color:#ad8879 !important;
}
.apparelVariantCard.active .variantThumb{
  background:#fff9f5 !important;
  border-color:#d8c3b8 !important;
}
.apparelVariantCard.active .variantText b,
.apparelVariantCard.active .variantText small{
  color:#5b4036 !important;
}
.apparelVariantCard.active .variantCheck{
  opacity:1;
  color:#fff !important;
  background:var(--accent) !important;
  box-shadow:0 4px 10px rgba(119,88,77,.18) !important;
}
@media (max-width:960px){
  .apparelVariantCard.active{
    box-shadow:0 0 0 1px rgba(184,148,132,.14), 0 6px 14px rgba(119,88,77,.07) !important;
  }
}


/* consumer-facing detail cleanup: internal labels removed */
.apparelDetailCardFocus,
.apparelDetailCardFull{
  padding:10px !important;
}
@media (max-width:640px){
  .apparelDetailCardFocus,
  .apparelDetailCardFull{padding:8px !important;}
}

/* Mobile floating cart — draggable, edge-snapping, theme-aligned */
.floatingCartBtn{display:none}
@media (max-width:640px){
  .floatingCartBtn{
    display:flex;
    position:fixed;
    left:auto;
    right:14px;
    top:50%;
    bottom:auto;
    transform:translateY(-50%);
    width:52px;
    height:52px;
    padding:0;
    align-items:center;
    justify-content:center;
    z-index:96;
    border:1px solid rgba(255,255,255,.42);
    border-radius:50%;
    background:var(--accent);
    color:#fff;
    box-shadow:0 10px 26px rgba(72,49,41,.24),0 2px 8px rgba(72,49,41,.14);
    cursor:grab;
    touch-action:none;
    -webkit-user-select:none;
    user-select:none;
    -webkit-tap-highlight-color:transparent;
    transition:left .20s ease,top .20s ease,opacity .16s ease,transform .16s ease,box-shadow .16s ease;
  }
  .floatingCartBtn:hover{
    transform:translateY(-1px);
    box-shadow:0 13px 30px rgba(72,49,41,.27),0 3px 9px rgba(72,49,41,.14);
  }
  .floatingCartBtn:active{transform:scale(.97)}
  .floatingCartBtn.dragging{
    cursor:grabbing;
    transition:none !important;
    transform:scale(1.035);
    box-shadow:0 15px 34px rgba(72,49,41,.30);
  }
  .floatingCartBtn.isHidden{
    opacity:0;
    pointer-events:none;
    transform:scale(.88);
  }
  .floatingCartIcon{
    width:24px;
    height:24px;
    display:block;
    pointer-events:none;
  }
  .floatingCartCount{
    position:absolute;
    right:-3px;
    top:-4px;
    min-width:19px;
    height:19px;
    padding:0 5px;
    display:grid;
    place-items:center;
    border:2px solid var(--paper);
    border-radius:999px;
    background:#fff7f2;
    color:var(--accent);
    font-size:10px;
    line-height:1;
    font-weight:850;
    box-shadow:0 3px 8px rgba(72,49,41,.12);
    pointer-events:none;
  }
  .floatingCartCount[hidden]{display:none !important}
}



/* Mobile product-detail UX refinement:
   keep the home page visually stationary behind the product sheet,
   add a visible favorite action, and use a non-blocking cart confirmation. */
@media (max-width:640px){
  /* Product-only backdrop is transparent: the frozen home page remains visible instead of turning black. */
  .overlay.productBackdropClear{
    background:transparent !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
  #productModal.modal{
    padding:0 !important;
    place-items:end center !important;
    background:transparent !important;
    overscroll-behavior:none !important;
  }
  #productModal .modalCard.apparelModal{
    width:100% !important;
    max-height:96svh !important;
    height:auto !important;
    margin:0 !important;
    border-radius:24px 24px 0 0 !important;
    background:var(--paper) !important;
    overscroll-behavior-y:contain !important;
    -webkit-overflow-scrolling:touch;
    box-shadow:0 -12px 42px rgba(72,49,41,.13) !important;
  }
  #productModal .apparelDetail,
  #productModal .apparelPurchase,
  #productModal .apparelDetailPane{
    background:var(--paper) !important;
  }

  /* Sticky mobile action bar: price + favorite + cart. */
  .apparelMobileBar{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:8px !important;
    min-height:66px !important;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom)) !important;
    background:rgba(255,253,250,.96) !important;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-top:1px solid rgba(119,88,77,.12) !important;
    box-shadow:0 -8px 22px rgba(72,49,41,.07) !important;
  }
  .apparelMobileActions{
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
    min-width:0 !important;
  }
  .apparelMobileBar .mobileWishAction{
    min-width:72px !important;
    height:42px !important;
    min-height:42px !important;
    padding:0 10px !important;
    border-radius:999px !important;
    font-size:10.5px !important;
    white-space:nowrap !important;
    background:#fffaf7 !important;
  }
  .apparelMobileBar .mobileWishAction.active{
    background:#f3e8e4 !important;
    border-color:#c9aaa0 !important;
    color:#5a3f37 !important;
  }
  .apparelMobileBar .mobileAddCartAction{
    min-width:106px !important;
    height:42px !important;
    min-height:42px !important;
    padding:0 13px !important;
    border-radius:999px !important;
    font-size:11px !important;
    white-space:nowrap !important;
  }

  /* Adding to cart should confirm without forcing the shopper out of the product page. */
  .mobileCartAddedNotice{
    position:fixed;
    left:14px;
    right:14px;
    bottom:calc(78px + env(safe-area-inset-bottom));
    z-index:125;
    display:grid;
    grid-template-columns:32px minmax(0,1fr) auto;
    gap:10px;
    align-items:center;
    padding:11px 12px;
    border:1px solid rgba(119,88,77,.13);
    border-radius:16px;
    background:rgba(255,253,250,.98);
    color:var(--ink);
    box-shadow:0 16px 38px rgba(72,49,41,.16);
    opacity:0;
    transform:translateY(12px);
    pointer-events:none;
    transition:opacity .18s ease,transform .18s ease;
  }
  .mobileCartAddedNotice.show{
    opacity:1;
    transform:translateY(0);
    pointer-events:auto;
  }
  .mobileCartAddedCheck{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#eee1db;
    color:var(--accent);
    font-size:15px;
    font-weight:850;
  }
  .mobileCartAddedCopy{
    min-width:0;
  }
  .mobileCartAddedCopy b{
    display:block;
    font-size:12px;
    line-height:1.25;
  }
  .mobileCartAddedCopy span{
    display:block;
    margin-top:3px;
    color:var(--muted);
    font-size:9.5px;
    line-height:1.3;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .mobileCartAddedView{
    border:0;
    background:transparent;
    color:var(--accent);
    padding:8px 2px 8px 8px;
    font-size:10.5px;
    font-weight:760;
    cursor:pointer;
    white-space:nowrap;
  }
}

@media (max-width:360px){
  .apparelMobileBar .mobileWishAction{
    min-width:44px !important;
    width:44px !important;
    padding:0 !important;
  }
  .apparelMobileBar .mobileWishAction span:last-child{
    display:none !important;
  }
  .apparelMobileBar .mobileAddCartAction{
    min-width:100px !important;
  }
}


/* Mobile copy cleanup */
@media (max-width:640px){
  .mobileHideSectionCopy{display:none !important;}
}



/* Mobile product-detail scroll stability */
@media (max-width:640px){
  #productModal .modalCard.apparelModal{
    scroll-behavior:auto !important;
    overflow-anchor:none !important;
    touch-action:pan-y !important;
  }

  /* Native touch scrolling is already smooth; avoid continuous backdrop re-rasterization. */
  .apparelMobileBar{
    background:#fffdfa !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  .apparelDetailFocusImage,
  .apparelLongDetail,
  .apparelVariantPreview,
  .apparelVariants .variantThumb img{
    image-rendering:auto;
  }

  /* Keep space reserved while the long detail image decodes/loads. */
  .apparelDetailFocusImage,
  .apparelLongDetail{
    aspect-ratio:auto !important;
  }
}



/* Mobile homepage hero — clearer text/image separation */
.heroLeadMobile{display:none;}

@media (max-width:640px){
  .hero{
    padding:12px 0 18px !important;
  }
  .heroGrid{
    grid-template-columns:1fr !important;
    gap:22px !important;
  }

  .heroCopy{
    padding:25px 19px 23px !important;
    border-radius:22px !important;
  }

  .heroCopy>.eyebrow{
    margin-bottom:10px !important;
  }

  .hero .heroTitle{
    font-size:30px !important;
    line-height:1.13 !important;
    margin:0 0 15px !important;
    letter-spacing:-.018em !important;
  }
  .hero .heroTitle .hero-line-top{
    gap:7px !important;
  }
  .hero .heroTitle .hero-line-bottom{
    margin-top:4px !important;
  }

  /* Mobile keeps the three-heart title compact. */
  .hero .heroTitle .hero-hearts span{
    font-size:.39em !important;
    opacity:.62 !important;
  }

  .heroLeadDesktop{
    display:none !important;
  }
  .heroLeadMobile{
    display:block !important;
  }
  .heroCopy .lead{
    width:min(100%,340px) !important;
    max-width:340px !important;
    margin:0 !important;
    font-size:13.2px !important;
    line-height:1.72 !important;
    color:#675f5a !important;
  }

  .heroCta{
    margin-top:19px !important;
    gap:9px !important;
  }

  .trustline{
    margin-top:18px !important;
    padding-top:15px !important;
  }

  /* Treat the visual as a separate block instead of letting it feel attached to the copy card. */
  .heroArt{
    min-height:245px !important;
    margin:0 !important;
    border-radius:22px !important;
    box-shadow:0 14px 38px rgba(53,37,31,.08) !important;
  }
}

@media (max-width:380px){
  .heroGrid{
    gap:19px !important;
  }
  .hero .heroTitle{
    font-size:28px !important;
  }
  .heroCopy .lead{
    font-size:12.8px !important;
  }
  .heroArt{
    min-height:228px !important;
  }
}

/* Mobile product sheet close rail — persistent, premium, and never visually overlaps content */
.modalCloseRail{display:contents;}

@media (max-width:640px){
  #productModal .modalCard.apparelModal{
    max-height:96svh !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }

  #productModal .modalCard.apparelModal > .modalCloseRail{
    position:sticky !important;
    top:0 !important;
    z-index:80 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    width:100% !important;
    min-height:54px !important;
    padding:8px 12px 7px !important;
    margin:0 !important;
    background:#fffdfa !important;
    border-bottom:1px solid rgba(119,88,77,.08) !important;
    box-shadow:0 5px 16px rgba(72,49,41,.035) !important;
  }

  #productModal .modalCard.apparelModal .modalClose{
    position:relative !important;
    inset:auto !important;
    top:auto !important;
    right:auto !important;
    float:none !important;
    flex:0 0 40px !important;
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    min-height:40px !important;
    margin:0 !important;
    padding:0 !important;
    display:grid !important;
    place-items:center !important;
    border:1px solid rgba(119,88,77,.14) !important;
    border-radius:50% !important;
    background:#f8f1ed !important;
    color:#665047 !important;
    font-size:22px !important;
    font-weight:400 !important;
    line-height:1 !important;
    box-shadow:0 5px 14px rgba(72,49,41,.07) !important;
    transform:none !important;
  }
  #productModal .modalCard.apparelModal .modalClose:active{
    transform:scale(.96) !important;
    background:#f2e7e1 !important;
  }

  /* The close rail owns its space, so the first product block no longer needs a fake top gap. */
  #productModal .apparelPurchase{
    padding-top:18px !important;
  }

  /* Keep scrolling content visually below the rail, never behind a floating close icon. */
  #productModal #productModalContent{
    position:relative !important;
    z-index:1 !important;
  }
}

/* Homepage hero carousel — curated eight-product toy set, main-image ratio protected */
.heroCarousel{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:#eee3dc;
}
.heroCarouselTrack{
  width:100%;
  height:100%;
  display:flex;
  transition:transform .48s cubic-bezier(.22,.75,.2,1);
  will-change:transform;
}
.heroSlide{
  position:relative;
  flex:0 0 100%;
  width:100%;
  height:100%;
  min-width:0;
  overflow:hidden;
}
button.heroSlide{
  appearance:none;
  border:0;
  padding:0;
  margin:0;
  background:#eee3dc;
  color:inherit;
  text-align:left;
  cursor:pointer;
  font:inherit;
}
.heroProductImage{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transform:none !important;
}
.heroProductCaption{
  position:absolute;
  left:18px;
  right:18px;
  bottom:18px;
  z-index:3;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  padding:13px 15px;
  border:1px solid rgba(255,255,255,.5);
  border-radius:17px;
  background:rgba(255,253,250,.84);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 10px 30px rgba(42,29,24,.12);
}
.heroProductCaption span{min-width:0;}
.heroProductCaption small{
  display:block;
  margin-bottom:4px;
  color:var(--accent);
  font-size:9.5px;
  font-weight:760;
  letter-spacing:.06em;
}
.heroProductCaption b{
  display:block;
  font-size:13px;
  line-height:1.3;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.heroProductCaption strong{
  flex:0 0 auto;
  font-size:17px;
  line-height:1;
}
.heroBrandSlide{
  background:radial-gradient(circle at 28% 18%,#fff2ea 0,#e7d3c9 26%,#bea296 55%,#7e655b 78%,#4c3c36 100%);
}
.heroCarouselNav{
  position:absolute;
  top:50%;
  z-index:5;
  width:38px;
  height:38px;
  margin-top:-19px;
  border:1px solid rgba(255,255,255,.5);
  border-radius:50%;
  background:rgba(255,253,250,.78);
  color:#4e403a;
  display:grid;
  place-items:center;
  padding:0;
  font-size:25px;
  line-height:1;
  cursor:pointer;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 8px 20px rgba(42,29,24,.1);
}
.heroCarouselNav.prev{left:12px;}
.heroCarouselNav.next{right:12px;}
.heroCarouselDots{
  position:absolute;
  left:50%;
  bottom:8px;
  z-index:6;
  display:flex;
  gap:6px;
  transform:translateX(-50%);
}
.heroCarouselDots button{
  width:6px;
  height:6px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.58);
  box-shadow:0 0 0 1px rgba(52,38,32,.08);
  cursor:pointer;
  transition:width .18s ease,background .18s ease;
}
.heroCarouselDots button.active{
  width:18px;
  background:#fffdfa;
}

@media (max-width:640px){
  /* Main product images are 800x800. Keep the carousel itself square on phones. */
  .heroArt.heroCarousel{
    width:100% !important;
    min-height:0 !important;
    height:auto !important;
    aspect-ratio:1 / 1 !important;
    border-radius:22px !important;
  }
  .heroCarouselTrack,
  .heroSlide{
    height:100% !important;
  }
  .heroProductImage{
    width:100% !important;
    height:100% !important;
    aspect-ratio:1 / 1 !important;
    object-fit:cover !important;
    object-position:center !important;
  }
  .heroProductCaption{
    left:10px;
    right:10px;
    bottom:13px;
    padding:10px 11px;
    border-radius:14px;
    gap:8px;
  }
  .heroProductCaption small{font-size:8.5px;}
  .heroProductCaption b{font-size:11px;}
  .heroProductCaption strong{font-size:15px;}
  .heroCarouselNav{
    width:32px;
    height:32px;
    margin-top:-16px;
    font-size:21px;
    opacity:.86;
  }
  .heroCarouselNav.prev{left:8px;}
  .heroCarouselNav.next{right:8px;}
  .heroCarouselDots{bottom:5px;}
}

@media (prefers-reduced-motion:reduce){
  .heroCarouselTrack{transition:none !important;}
}


/* Mobile privacy banner copy cleanup */
.privacyTitleMobile{display:none;}
@media (max-width:640px){
  #privacy .privacyTitleDesktop{display:none !important;}
  #privacy .privacyTitleMobile{display:inline !important;}
  #privacy .privacyBannerDesc{display:none !important;}
}



/* Product detail: use the original full long image once — no cropping, no duplicated people. */
.apparelDetailStackSingle{
  gap:0 !important;
}
.apparelDetailStackSingle .apparelDetailCardFull{
  padding:10px !important;
}
.apparelDetailStackSingle .apparelLongDetail{
  display:block !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
  object-position:center top !important;
}

@media (max-width:640px){
  .apparelDetailStackSingle .apparelDetailCardFull{
    padding:8px !important;
  }
}


/* center privacy packaging note in product detail areas */
.apparelPrivacy, .productDetail .privacyBox{ text-align:center !important; }


/* Mobile: simplify reviews section heading */
@media (max-width:640px){
  .reviewsIntro{display:none !important;}
}

/* variable-price product cue */
.priceFrom{display:inline-block;margin-left:3px;font-size:10px;font-weight:650;color:var(--muted);vertical-align:1px}


/* Sale/reference pricing — restrained gray strike-through */
.apparelPriceLine{
  display:flex;
  align-items:baseline;
  gap:9px;
}
.apparelOldPrice{
  color:var(--muted);
  font-size:12px;
  font-weight:500;
  opacity:.76;
  text-decoration-thickness:1px;
}
.mobilePricePair{
  display:flex;
  align-items:baseline;
  gap:6px;
}
.mobileSelectedOldPrice{
  color:var(--muted);
  font-size:10px;
  font-weight:500;
  opacity:.72;
  text-decoration-thickness:1px;
}
.heroProductPrice{
  flex:0 0 auto;
  display:flex;
  align-items:baseline;
  gap:6px;
  white-space:nowrap;
}
.heroProductPrice strong{
  font-size:17px;
  line-height:1;
}
.heroProductPrice s{
  color:var(--muted);
  font-size:10px;
  font-weight:500;
  opacity:.74;
  text-decoration-thickness:1px;
}
@media(max-width:640px){
  .heroProductPrice{gap:5px;}
  .heroProductPrice strong{font-size:15px;}
  .heroProductPrice s{font-size:9px;}
}

/* Desktop hero carousel hover — restrained premium interaction */
@media (min-width:641px) and (hover:hover) and (pointer:fine){
  .heroArt.heroCarousel{
    transition:box-shadow .38s ease, transform .38s ease;
  }
  .heroArt.heroCarousel:hover{
    box-shadow:0 22px 58px rgba(72,49,41,.18);
  }
  .heroProductImage{
    transition:transform .42s cubic-bezier(.22,.72,.24,1), filter .42s ease;
    will-change:transform;
  }
  .heroCarousel:hover .heroSlide.active.heroProductSlide .heroProductImage{
    transform:scale(1.028) !important;
  }
  .heroProductSlide::after{
    content:"查看详情 →";
    position:absolute;
    right:20px;
    bottom:92px;
    z-index:4;
    padding:7px 10px;
    border:1px solid rgba(255,255,255,.48);
    border-radius:999px;
    background:rgba(255,253,250,.82);
    color:#5b463e;
    box-shadow:0 8px 20px rgba(42,29,24,.10);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    font-size:10px;
    font-weight:700;
    letter-spacing:.03em;
    line-height:1;
    opacity:0;
    transform:translateY(5px);
    transition:opacity .26s ease, transform .32s cubic-bezier(.22,.72,.24,1);
    pointer-events:none;
  }
  .heroCarousel:hover .heroSlide.active.heroProductSlide::after{
    opacity:1;
    transform:translateY(0);
  }
}

@media (prefers-reduced-motion:reduce){
  .heroArt.heroCarousel,
  .heroProductImage,
  .heroProductSlide::after{
    transition:none !important;
  }
  .heroCarousel:hover .heroSlide.active.heroProductSlide .heroProductImage{
    transform:none !important;
  }
}

/* Mobile checkout age-consent alignment */
@media (max-width:640px){
  .checkoutCard .consentRow{
    display:flex !important;
    align-items:flex-start !important;
    gap:8px !important;
  }
  .checkoutCard .consentRow input[type="checkbox"]{
    width:16px !important;
    height:16px !important;
    min-width:16px !important;
    flex:0 0 16px !important;
    margin:1px 0 0 !important;
    align-self:flex-start !important;
  }
  .checkoutCard .consentRow > span{
    display:block !important;
    min-width:0 !important;
    line-height:1.55 !important;
  }
}

/* Mobile privacy banner title — centered without affecting desktop */
@media (max-width:640px){
  #privacy .banner > div:first-child{
    width:100% !important;
    text-align:center !important;
  }
  #privacy .banner h3{
    width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
  }
  #privacy .privacyTitleMobile{
    display:block !important;
    width:100% !important;
    text-align:center !important;
  }
}

/* Guide recommendation copy: centered on desktop and mobile */
.quizResult{
  text-align:center !important;
}
/* HELP ME CHOOSE — canonical centered result layout */
#guide .quizBox #quizResult.quizResult,
#guide .quizBox #quizResult .quizResultInner{
  display:block;
  width:100%;
  max-width:none;
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
  text-align:center;
}
#guide .quizBox #quizResult .quizResultInner{padding:0}
#guide .quizBox #quizResult .quizResultBtn{
  display:flex;
  width:max-content;
  margin:8px auto 0;
  justify-content:center;
  align-items:center;
}
/* Mobile shop category bar — keep pill sizing, left align and tighten only the gaps */
@media (max-width:640px){
  #shop .toolbar{
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:100% !important;
    column-gap:5px !important;
    row-gap:10px !important;
  }

  #shop .toolbar .filter{
    order:1 !important;
    flex:0 0 auto !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
    padding-left:10px !important;
    padding-right:10px !important;
  }

  /* Force count/sort metadata onto a clean second row. */
  #shop .toolbar .spacer{
    order:2 !important;
    display:block !important;
    flex:0 0 100% !important;
    width:100% !important;
    height:0 !important;
    margin:0 !important;
    padding:0 !important;
  }
  #shop .toolbar .sort{
    order:3 !important;
    margin:0 !important;
  }
  #shop .toolbar .compare{
    order:4 !important;
    margin-left:auto !important;
    margin-right:0 !important;
    text-align:right !important;
  }
}

/* Mobile checkout consent — fixed checkbox column + text column for exact alignment */
@media (max-width:640px){
  .checkoutCard .consentRow{
    display:grid !important;
    grid-template-columns:18px minmax(0,1fr) !important;
    column-gap:13px !important;
    align-items:start !important;
    width:100% !important;
    margin:3px 0 0 !important;
    padding:0 !important;
    font-size:11.5px !important;
    line-height:18px !important;
  }
  .checkoutCard .consentCheckSlot{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:18px !important;
    height:18px !important;
    margin:0 !important;
    padding:0 !important;
  }
  .checkoutCard .consentCheckSlot input[type="checkbox"]{
    box-sizing:border-box !important;
    width:16px !important;
    height:16px !important;
    min-width:16px !important;
    margin:0 !important;
    padding:0 !important;
    flex:none !important;
    align-self:auto !important;
    accent-color:var(--dark) !important;
    vertical-align:middle !important;
  }
  .checkoutCard .consentRow > .consentText{
    display:block !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    line-height:18px !important;
    text-align:left !important;
  }
  .checkoutCard .consentRow > .consentText a{
    display:inline !important;
  }
}

/* LOOMI guide selector upgrade */
.quizBox{
  background:rgba(255,255,255,.72);
  border:1px solid rgba(164,126,91,.16);
  border-radius:28px;
  padding:26px;
  box-shadow:0 18px 50px rgba(65,45,30,.08);
  backdrop-filter:blur(10px);
}
.formField label{
  color:var(--ink);
  font-weight:600;
  letter-spacing:.02em;
  margin-bottom:12px;
}
.formField select{
  appearance:none;
  width:100%;
  border-radius:18px;
  border:1px solid rgba(164,126,91,.22);
  background:linear-gradient(180deg,#fff,#fbf7f1);
  color:var(--ink);
  min-height:54px;
  padding:0 18px;
  font-size:15px;
  transition:.2s ease;
}
.formField select:focus{
  outline:none;
  border-color:rgba(164,126,91,.6);
  box-shadow:0 0 0 4px rgba(164,126,91,.12);
}
.quizBox .btn.primary{
  border-radius:18px;
  min-height:54px;
  letter-spacing:.04em;
}
.quizResult{
  border-radius:18px;
  background:rgba(164,126,91,.06);
  border:1px solid rgba(164,126,91,.12);
}

.guideChoices{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.guideChoice{appearance:none;text-align:left;border:1px solid rgba(164,126,91,.18);background:#fff;border-radius:18px;padding:16px;cursor:pointer;color:var(--ink);transition:.2s;min-height:72px}
.guideChoice b{display:block;font-size:15px;margin-bottom:5px}
.guideChoice span{font-size:12px;color:var(--muted)}
.guideChoice:hover,.guideChoice.active{border-color:rgba(164,126,91,.7);background:linear-gradient(180deg,#fff,#f8f0e7);box-shadow:0 8px 24px rgba(80,50,25,.08)}
.guideChoices.compact{grid-template-columns:1fr 1fr}
@media(max-width:640px){.guideChoices{gap:10px}.guideChoice{padding:13px 12px;min-height:64px}}

/* Premium guide dropdown */
.quizBox{
  background:rgba(255,255,255,.82);
  border:1px solid rgba(164,126,91,.15);
  border-radius:30px;
  padding:30px;
  box-shadow:0 20px 60px rgba(45,30,20,.08);
}
.selectPremium{
  position:relative;
}
.selectPremium:after{
  content:"⌄";
  position:absolute;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  color:rgba(110,80,55,.65);
  pointer-events:none;
  font-size:18px;
}
.selectPremium select{
  width:100%;
  height:58px;
  appearance:none;
  border-radius:20px;
  border:1px solid rgba(164,126,91,.2);
  background:linear-gradient(180deg,#fff,#faf5ee);
  padding:0 48px 0 20px;
  font-size:15px;
  color:var(--ink);
  cursor:pointer;
  transition:.25s;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.selectPremium select:hover{
  border-color:rgba(164,126,91,.45);
}
.selectPremium select:focus{
  outline:none;
  border-color:rgba(164,126,91,.75);
  box-shadow:0 0 0 5px rgba(164,126,91,.12);
}

/* Refined dropdown option appearance */
.selectPremium select{
  background:
    linear-gradient(180deg,rgba(255,255,255,.98),rgba(250,244,236,.98));
  color:#3f3329;
}

.selectPremium select option{
  background:#fbf6ef;
  color:#3f3329;
  padding:14px;
}

.formField{
  position:relative;
}

.formField label{
  letter-spacing:.04em;
}

.quizBox .formField + .formField{
  margin-top:20px;
}

/* LOOMI luxury dropdown */
.luxDropdown{position:relative}
.luxTrigger{
 width:100%;height:58px;border-radius:20px;
 border:1px solid rgba(164,126,91,.22);
 background:linear-gradient(180deg,#fff,#f8f0e7);
 color:var(--ink);padding:0 20px;
 display:flex;justify-content:space-between;align-items:center;
 font-size:15px;cursor:pointer;
 transition:.25s;
}
.luxTrigger:hover,.luxDropdown.open .luxTrigger{
 border-color:rgba(164,126,91,.65);
 box-shadow:0 10px 30px rgba(80,50,25,.12);
}
.luxMenu{
 position:absolute;z-index:30;top:calc(100% + 10px);left:0;right:0;
 padding:10px;
 border-radius:24px;
 background:rgba(255,250,244,.96);
 border:1px solid rgba(164,126,91,.18);
 box-shadow:0 20px 50px rgba(60,40,20,.16);
 opacity:0;transform:translateY(-8px) scale(.98);
 pointer-events:none;
 transition:.22s ease;
 backdrop-filter:blur(16px);
}
.luxDropdown.open .luxMenu{
 opacity:1;transform:none;pointer-events:auto;
}
.luxMenu button{
 width:100%;border:0;background:transparent;
 padding:13px 16px;border-radius:16px;
 color:var(--ink);text-align:left;
 cursor:pointer;transition:.18s;
}
.luxMenu button:hover{
 background:rgba(164,126,91,.12);
 color:#6b4b32;
}

/* Mobile luxury dropdown stability */
.luxDropdown{
  position:relative;
  z-index:20;
}
.luxDropdown.open{
  z-index:100;
}
.luxMenu{
  max-height:min(260px,45vh);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  transform-origin:top center;
}
.luxDropdown.open .luxMenu{
  animation:luxDropIn .22s ease forwards;
}
@keyframes luxDropIn{
  from{
    opacity:0;
    transform:translateY(-10px) scale(.985);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}
@media(max-width:640px){
  .luxMenu{
    position:absolute;
    left:0;
    right:0;
    width:100%;
    margin-top:8px;
    box-shadow:0 18px 45px rgba(55,35,20,.18);
  }
  .luxMenu button{
    min-height:48px;
    padding:14px 16px;
  }
  .quizBox{
    overflow:visible;
  }
}

/* product variant single line layout */
.apparelVariants .variantBtn,
.variantRow .variantBtn{
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
}

.variantPriceInline{
  margin-left:8px;
  font-size:13px;
  font-weight:600;
  color:inherit;
}
.variantText>b,
.variantPriceInline{
  white-space:nowrap;
}

.apparelLongDetail{display:block;width:100%;border-radius:0!important;margin:0;padding:0;}
.apparelDetailImageWrap{line-height:0;}

/* mobile cart drawer scroll stability */
@media (max-width:640px){
  .drawer{
    height:100dvh;
    max-height:100dvh;
    overscroll-behavior:contain;
  }
  .drawerBody{
    min-height:0;
    flex:1 1 auto;
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:contain;
    touch-action:pan-y;
  }
  .drawerFoot{
    flex-shrink:0;
  }
}

/* mobile cart footer should stay outside scrolling area */
@media (max-width:640px){
  .drawer{
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }
  .drawerBody{
    flex:1 1 auto;
    height:0;
    overflow-y:auto;
    overflow-x:hidden;
    touch-action:pan-y;
  }
  .drawerFoot{
    position:relative;
    flex:0 0 auto;
    z-index:2;
    touch-action:none;
  }
  .drawerFoot button,
  .drawerFoot a{
    touch-action:manipulation;
  }
}

/* wish icon active state */
.wish.active .wishBtnIcon,
.wishBtn.active .wishBtnIcon{
  color:#000;
  -webkit-text-stroke:0;
}
.wishBtnIcon{
  display:inline-block;
  line-height:1;
}

/* product detail wish instant state */
.productWishToggle.active .wishBtnIcon,
.mobileWishAction.active .wishBtnIcon{
  color:#000 !important;
  opacity:1 !important;
  font-weight:900;
}
.productWishToggle .wishBtnIcon{
  transition:color .2s ease, transform .2s ease;
}
.productWishToggle.active .wishBtnIcon{
  transform:scale(1.08);
}

/* homepage product card favorite active */
.wish button.active,
.wish.active{
  color:#000 !important;
  background:#fff !important;
}
.wish button.active::first-letter{
  color:#000 !important;
}

/* mobile detail wish button ripple stays inside circle */
@media (max-width:640px){
  .mobileWishAction,
  .productWishToggle{
    overflow:hidden !important;
    border-radius:999px !important;
    isolation:isolate;
  }
  .mobileWishAction::before,
  .productWishToggle::before{
    border-radius:inherit;
    overflow:hidden;
  }
}

.wish.active{
  color:#000 !important;
  background:rgba(255,255,255,.95);
}
.wish{
  font-size:20px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
}

.wish.active{
  color:#000 !important;
  font-weight:900;
}

/* mobile cart drawer lock background scroll */
@media (max-width:640px){
  body.cart-lock{
    overflow:hidden;
    position:fixed;
    width:100%;
  }

  .drawer.open + .overlay{
    touch-action:none;
  }

  .drawer{
    overscroll-behavior:contain;
  }

  .drawerBody{
    overscroll-behavior:contain;
  }
}

/* mobile luxury dropdown expansion stability */
@media (max-width:640px){
  .luxDropdown{
    position:relative;
  }

  .luxTrigger{
    min-height:58px;
    transition:none;
  }

  .luxMenu{
    transform-origin:top center;
    will-change:height;
    overflow:hidden;
  }

  .luxOption{
    min-height:48px;
    display:flex;
    align-items:center;
  }

  .quizBox .formField{
    position:relative;
  }

  .quizBox{
    overflow:visible;
  }
}

/* LOOMI MOBILE UX FINAL V08 - close button rebuild */
@media(max-width:640px){

  /* detach close button from content flow */
  .apparelModal .modalClose,
  .modalCard.apparelModal .modalClose,
  #productModal .modalClose{
    position:fixed !important;
    top:calc(env(safe-area-inset-top) + 18px) !important;
    right:16px !important;
    left:auto !important;
    margin:0 !important;
    transform:none !important;
    z-index:100000 !important;

    width:42px !important;
    height:42px !important;
    border-radius:50% !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    background:rgba(246,242,238,.9) !important;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }

  /* prevent clipping by modal container */
  .apparelModal,
  .modalCard.apparelModal{
    overflow:visible !important;
  }
}

/* LOOMI MOBILE UX FINAL V14 - carousel touch optimization */
@media(max-width:640px){

  .carousel,
  .swiper,
  .productCarousel,
  .heroCarousel{
    touch-action:pan-y;
    -webkit-user-select:none;
    user-select:none;
    overscroll-behavior-x:none;
  }

  .carouselTrack,
  .swiper-wrapper,
  .productCarouselTrack{
    touch-action:pan-x;
    will-change:transform;
  }

  .carousel img,
  .swiper-slide img,
  .productCarousel img{
    -webkit-user-drag:none;
    user-select:none;
  }
}

/* LOOMI MOBILE UX FINAL V15 - native like carousel gesture */
@media(max-width:640px){
  .carousel,
  .heroCarousel,
  .productCarousel,
  .swiper{
    touch-action: pan-y pinch-zoom;
  }

  .carouselTrack,
  .productCarouselTrack,
  .swiper-wrapper{
    touch-action: pan-x;
    transition-timing-function:cubic-bezier(.22,.61,.36,1);
  }

  .carousel img,
  .heroCarousel img,
  .productCarousel img,
  .swiper-slide img{
    pointer-events:none;
  }
}

/* LOOMI MOBILE UX FINAL V16 - checkout checkbox alignment */
@media(max-width:640px){
  .agreement-row,
  .checkout-agreement,
  .policy-check,
  label:has(input[type="checkbox"]){
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
  }

  .agreement-row input[type="checkbox"],
  .checkout-agreement input[type="checkbox"],
  .policy-check input[type="checkbox"],
  label input[type="checkbox"]{
    flex:0 0 auto !important;
    margin:0 !important;
    transform:none !important;
  }
}

/* LOOMI MOBILE UX FINAL V19 - help choose recommendation card */
@media(max-width:640px){

  .helpResult,
  .recommendResult,
  .choiceResult{
    padding:18px 20px !important;
    min-height:0 !important;
  }

  .helpResult .recommendText,
  .recommendResult .recommendText{
    line-height:1.5 !important;
    margin-bottom:12px !important;
  }

  .helpResult .recommendProducts,
  .recommendResult .recommendProducts{
    font-weight:600;
    line-height:1.55;
  }

  .helpResult .recommendAction,
  .recommendResult .recommendAction{
    margin-top:12px !important;
  }
}

/* V56 · consolidated current overrides */
.srOnly{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

:where(a,button,input,select,textarea):focus-visible{
  outline:3px solid rgba(119,88,77,.32);
  outline-offset:3px;
}

.searchHit{width:100%;text-align:left}

.hero .heroTitle .hero-hearts{
  display:inline-flex !important;
  align-items:flex-start !important;
  gap:4px !important;
  margin-left:2px !important;
  transform:translateY(-1px) !important;
}
.hero .heroTitle .hero-hearts span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  margin:0 !important;
  color:#cc748f !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:.68em !important;
  line-height:1 !important;
  opacity:1 !important;
  text-shadow:none !important;
}
.hero .heroTitle .hero-hearts span:nth-child(1){transform:translateY(0) !important}
.hero .heroTitle .hero-hearts span:nth-child(2){transform:translateY(-1px) !important}
.hero .heroTitle .hero-hearts span:nth-child(3){transform:translateY(0) !important}

#guide .quizResult{min-height:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important}
#guide .quizResult:empty{display:none!important}
.recommendCards{display:flex;flex-direction:column;gap:10px;margin:0}
.recommendRow{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 12px;background:linear-gradient(180deg,#fff,#fffaf7);border:1px solid rgba(119,88,77,.16);border-radius:20px;box-shadow:0 8px 22px rgba(53,37,31,.05);transition:.18s ease}
.recommendRow:hover{transform:translateY(-1px);border-color:rgba(119,88,77,.28);box-shadow:0 11px 28px rgba(53,37,31,.08)}
.recommendMain{min-width:0;width:100%;padding:0;border:0;background:transparent;display:grid;grid-template-columns:82px minmax(0,1fr);gap:14px;align-items:center;text-align:left;cursor:pointer}
.recommendThumb{width:82px;height:82px;border-radius:15px;background:#f7f2ee;display:grid;place-items:center;overflow:hidden}
.recommendThumb img{width:100%;height:100%;object-fit:cover;display:block}
.recommendCopy{min-width:0;display:block;text-align:left}
.recommendCopy strong{display:block;margin:0 0 5px;font-size:14px;line-height:1.4;color:var(--ink);overflow-wrap:anywhere}
.recommendCopy>span{display:-webkit-box;color:var(--muted);font-size:11.5px;line-height:1.55;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.recommendAction{justify-self:end;white-space:nowrap;margin:0;border-radius:999px;padding:8px 12px;font-size:11px}

@media(max-width:640px){
  .hero .heroTitle .hero-hearts{gap:3px !important;margin-left:1px !important}
  .hero .heroTitle .hero-hearts span{font-size:.60em !important}
  .recommendCards{gap:8px}
  .recommendRow{gap:8px;padding:9px;border-radius:17px}
  .recommendMain{grid-template-columns:68px minmax(0,1fr);gap:10px}
  .recommendThumb{width:68px;height:68px;border-radius:13px}
  .recommendCopy strong{font-size:12.5px;margin-bottom:3px}
  .recommendCopy>span{font-size:10.5px;line-height:1.45}
  .recommendAction{padding:7px 9px;font-size:10px}
}

@media(max-width:380px){
  .recommendMain{grid-template-columns:62px minmax(0,1fr);gap:8px}
  .recommendThumb{width:62px;height:62px}
  .recommendCopy>span{-webkit-line-clamp:1}
  .recommendAction{padding:7px 8px;font-size:9.5px}
}

/* V56.1 · centered order lookup and administration */
.trackPage .pageHero .wrap,
.adminPage .pageHero .wrap{
  text-align:center;
}
.trackPage .pageHero p,
.adminPage .pageHero p{
  margin-left:auto;
  margin-right:auto;
}
.trackPage .orderLookupCard{
  max-width:760px;
  margin:8px auto 70px;
  padding:30px;
  text-align:center;
}
.trackPage .trackFields{
  grid-template-columns:minmax(280px,450px) 116px;
  justify-content:center;
  align-items:center;
  gap:12px;
  max-width:590px;
  margin:0 auto;
}
.trackPage .trackFields input{
  min-height:50px;
  padding:13px 18px;
  border-radius:16px;
  text-align:center;
  font-size:16px;
  letter-spacing:.08em;
}
.trackPage .trackFields input::placeholder{
  color:#9a8f88;
  letter-spacing:0;
  opacity:1;
}
.trackPage .trackSubmit{min-height:50px;font-weight:750}
.trackPage .trackResults:empty{display:none}
.trackPage .trackResults>.errorNote{
  margin:0;
  padding:12px 0 0;
  text-align:left;
}
.trackPage .lookupCount{
  margin:22px 0 4px;
  color:var(--muted);
  font-size:12px;
}
.trackPage .trackOrderResult{
  margin-top:16px;
  padding:20px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fffdfb;
}
.trackPage .timeline,
.trackPage .orderSummaryGrid>div,
.trackPage .orderInfoBlock,
.trackPage .supportPanel{
  text-align:center;
}
.trackPage .step{
  grid-template-columns:14px minmax(0,280px);
  justify-content:center;
  text-align:center;
}
.trackPage .summaryRow{
  justify-content:center;
  gap:28px;
}
.trackPage .continuePayBox{justify-content:center}
.trackPage .logisticsEvent{
  grid-template-columns:18px minmax(0,520px);
  justify-content:center;
  text-align:center;
}
.trackPage .supportPanel .formField label,
.trackPage .supportPanel input,
.trackPage .supportPanel select,
.trackPage .supportPanel textarea{
  text-align:center;
}
.adminPage .adminWrap{margin-left:auto;margin-right:auto}
.adminPage .adminLogin{
  margin:0 auto 20px;
  text-align:center;
}
.adminPage #adminNote,
.adminPage .adminOrder,
.adminPage .adminGrid>div,
.adminPage .shippingAdminBox,
.adminPage .adminItems{
  text-align:center;
}
.adminPage .adminOrderHead{
  flex-direction:column;
  justify-content:center;
}
.adminPage .adminGrid,
.adminPage .grid2{
  justify-content:center;
}
.adminPage .formField label,
.adminPage .formField input,
.adminPage .formField select{
  text-align:center;
}
.adminPage .shippingAdminTitle{
  align-items:center;
  justify-content:center;
}
.adminPage .adminSave{
  display:block;
  margin:8px auto 12px;
}
.adminPage .summaryRow{
  justify-content:center;
  gap:28px;
}
.adminPage .logisticsMini{
  grid-template-columns:minmax(120px,180px) minmax(0,520px);
  justify-content:center;
  text-align:center;
}

@media(min-width:761px){
  .trackPage .trackResults{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(280px,450px) 12px 116px minmax(0,1fr);
  }
  .trackPage .trackResults>.errorNote{grid-column:2}
  .trackPage .trackResults>.lookupCount,
  .trackPage .trackResults>.trackOrderResult{grid-column:1/-1}
}

@media(max-width:760px){
  .trackPage .trackFields{
    grid-template-columns:1fr !important;
    max-width:520px;
    gap:10px;
  }
  .trackPage .trackSubmit{grid-column:auto}
  .trackPage .orderLookupCard{padding:20px 16px}
  .trackPage .trackResults{max-width:520px;margin:0 auto}
  .trackPage .trackResults>.errorNote{padding-top:10px}
  .trackPage .trackOrderResult{padding:14px}
  .adminPage .adminLogin{max-width:620px}
}

@media(max-width:560px){
  .adminPage .shippingAdminTitle{align-items:center}
  .adminPage .logisticsMini{grid-template-columns:1fr}
}

/* V56.2 · production order management center */
.adminPage{min-height:100vh;background:#f7f2ee}
.adminPage .nav{justify-content:space-between}
.adminHeaderLabel{flex:1;text-align:center;font-size:10px;font-weight:800;letter-spacing:.18em;color:var(--muted)}
.adminMain{padding-bottom:70px}
.adminPage .adminHero{padding:48px 0 22px}
.adminPage .adminHero h1{margin-bottom:10px}
.adminPage .adminWrap{width:min(1120px,calc(100% - 32px));max-width:1120px;margin:0 auto}
.adminLoginPanel{width:min(520px,100%);margin:8px auto 0;padding:34px;text-align:center;box-shadow:0 18px 55px rgba(63,45,37,.08)}
.adminLoginPanel[hidden],.adminDashboard[hidden]{display:none!important}
.adminLockIcon{display:grid;place-items:center;width:54px;height:54px;margin:0 auto 16px;border-radius:18px;background:var(--dark);color:#fff;font-size:25px;line-height:1;transform:rotate(-18deg)}
.adminLoginPanel h2{margin:8px 0 9px;font-size:28px;letter-spacing:-.03em}
.adminLoginPanel>p{max-width:380px;margin:0 auto 22px;color:var(--muted);font-size:12px;line-height:1.7}
.adminLoginPanel form{max-width:390px;margin:0 auto}
.adminPasswordField{margin:0;text-align:left!important}
.adminPage .adminPasswordField label{text-align:left}
.adminPasswordControl{position:relative}
.adminPage .adminPasswordControl input{min-height:52px;padding-right:66px;text-align:left;font-size:17px;letter-spacing:.12em}
.adminPage .adminPasswordControl input::placeholder{letter-spacing:0}
.adminPasswordToggle{position:absolute;right:7px;top:50%;min-width:48px;height:36px;transform:translateY(-50%);border:0;border-radius:10px;background:#f2ebe6;color:#62564f;font-size:11px;font-weight:750;cursor:pointer}
.adminLoginButton{width:100%;min-height:50px;margin-top:13px;border-radius:15px;font-weight:800}
.adminNotice{min-height:20px;margin-top:10px;color:var(--muted);font-size:11px;line-height:1.6;text-align:center}
.adminNotice:empty{display:none}
.adminNotice.error{color:#9a493f}
.adminNotice.success{color:var(--good)}
.adminNotice.warning{color:var(--warn)}
.adminNotice.loading{color:#6c5b52}

.adminDashboard{display:grid;gap:14px}
.adminDashboardHead{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:22px 24px;text-align:left!important}
.adminDashboardHead h2{margin:5px 0 4px;font-size:25px}
.adminDashboardHead p{margin:0;color:var(--muted);font-size:11px}
.adminDashboardActions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.adminDashboardActions .btn{min-height:42px}
.adminLogoutButton{color:#74564d}
.adminStats{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.adminStat{min-height:105px;padding:18px;border:1px solid var(--line);border-radius:20px;background:var(--paper);text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 8px 30px rgba(63,45,37,.035)}
.adminStat{font:inherit;appearance:none;cursor:pointer;position:relative;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}
.adminStat span{font-size:11px;color:var(--muted)}
.adminStat b{display:block;margin-top:6px;font-size:30px;line-height:1;color:var(--ink)}
.adminStat small{display:block;margin-top:7px;color:#9b8f87;font-size:9px;line-height:1;font-weight:700}
.adminStat small i{font-style:normal;margin-left:2px}
.adminStat:hover{transform:translateY(-2px);border-color:#bda99e;box-shadow:0 12px 32px rgba(63,45,37,.09)}
.adminStat:focus-visible{outline:3px solid rgba(119,88,77,.18);outline-offset:2px}
.adminStat.active{transform:translateY(-2px);border-color:#b88f80;background:#eadbd4;box-shadow:0 12px 32px rgba(101,67,56,.12),inset 0 0 0 1px rgba(255,255,255,.35)}
.adminStats .adminStat.active span{color:#72584f}
.adminStats .adminStat.active b{color:#5d4037}
.adminStats .adminStat.active small{color:#7c655c;opacity:1}
.adminStat.pending b{color:#9a6a35}
.adminStat.packing b{color:#765f9c}
.adminStat.shipped b{color:#416e8a}
.adminStat.aftersales b{color:#98574e}

.adminToolbar{display:grid;grid-template-columns:minmax(280px,2fr) minmax(150px,1fr) minmax(150px,1fr);gap:12px;align-items:end;padding:18px 20px}
.adminToolbar .formField{margin:0}
.adminPage .adminToolbar label{text-align:center}
.adminPage .adminToolbar input,.adminPage .adminToolbar select{min-height:46px;text-align:center}
.adminListMeta{min-height:20px;padding:3px 2px;color:var(--muted);font-size:11px;text-align:center}
.adminOrders{display:grid;gap:14px}
.adminPage .adminOrder{margin:0;padding:24px;box-shadow:0 10px 34px rgba(63,45,37,.045)}
.adminPage .adminOrderHead{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px;padding-top:6px;text-align:left}
.adminOrderIdentity{text-align:left}
.adminOrderIdentity h3{margin:7px 0 2px;font-size:18px;letter-spacing:.01em}
.adminOrderIdentity>span{display:block;color:var(--muted);font-size:11px}
.adminOrderBadges{display:flex;align-items:center;min-height:28px;gap:6px;flex-wrap:wrap}
.adminStateBadge{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:0 9px;border-radius:999px;background:#f0e9e4;color:#655950;font-size:10px;font-weight:750}
.adminPage .adminOrderHead>.adminLogisticsBadge{flex:0 0 auto;align-self:flex-start;margin-top:0}
.state-packing{background:#f0eaf7;color:#6a5287}
.state-shipped{background:#e9f2f7;color:#3d6983}
.state-delivered,.pay-paid{background:#e8f3ec;color:#38694f}
.state-aftersales{background:#f8eae7;color:#914c43}
.state-cancelled,.pay-refunded{background:#ece9e7;color:#746b66}
.pay-pending{background:#f7efe3;color:#90632f}
.adminPage .adminGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-bottom:14px}
.adminPage .adminGrid>div{min-height:76px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.adminPage .adminGrid b{line-height:1.5}
.adminOrderControls{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:11px;margin:10px 0 14px}
.adminOrderControls .formField{margin:0}
.adminPage .adminOrderControls label,.adminPage .adminOrderControls input,.adminPage .adminOrderControls select{text-align:center}
.adminPage .shippingAdminBox{margin:0;padding:17px;background:#fffaf7;text-align:center}
.adminPage .shippingAdminTitle{display:block;margin-bottom:13px}
.adminPage .shippingAdminTitle b{display:block;margin-bottom:4px;font-size:14px}
.adminPage .shippingAdminTitle span{display:block;font-size:11px;color:var(--muted)}
.adminPage .shippingAdminBox .grid2{max-width:760px;margin:0 auto}
.adminPage .shippingAdminBox .formField{margin:0}
.adminPage .shippingAdminBox label,.adminPage .shippingAdminBox input,.adminPage .shippingAdminBox select{text-align:center}
.adminPage .logisticsAdminMeta{margin-top:10px;text-align:center}
.adminSupportAlert{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:13px;padding:13px;border:1px solid rgba(152,87,78,.22);border-radius:15px;background:#fff4f1;text-align:center}
.adminSupportAlert b{font-size:12px;color:#884d45}
.adminSupportAlert span{font-size:11px;color:#725d58;line-height:1.5}
.adminSaveBar{display:flex;flex-direction:column;align-items:center;margin-top:14px}
.adminPage .adminSave{min-width:200px;min-height:44px;margin:0 auto}
.adminSaveBar .adminNotice{max-width:620px;margin-top:8px}
.adminDetailsGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
.adminPage .adminItems{margin:0;padding:13px 15px;border:1px solid var(--line);border-radius:15px;background:#fffdfb;text-align:center}
.adminPage .adminItems summary{list-style-position:inside}
.adminPage .adminItems .summaryRow{padding:9px 0;border-bottom:1px solid rgba(216,202,193,.55)}
.adminPage .adminItems .summaryRow:last-child{border-bottom:0}
.adminItemRow{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid rgba(216,202,193,.55);text-align:left}
.adminItemRow:last-child{border-bottom:0}
.adminItemThumb{display:block;width:48px;height:48px;border:1px solid rgba(216,202,193,.72);border-radius:10px;background:#f3ebe6;object-fit:cover}
.adminItemThumbFallback{display:grid;place-items:center;color:#9a8176;font-size:8px;font-weight:800;letter-spacing:.08em}
.adminItemCopy{display:flex;min-width:0;flex-direction:column;align-items:flex-start;gap:4px;text-align:left}
.adminItemCopy strong,.adminItemCopy small{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adminItemCopy strong{color:#211b18;font-size:12px;line-height:1.35}
.adminItemCopy small{color:var(--muted);font-size:10px;line-height:1.4}
.adminItemAmount{justify-self:end;color:#211b18;font-size:12px;white-space:nowrap}
.adminHistoryRow{display:grid;grid-template-columns:130px 1fr;gap:3px 10px;padding:8px 0;border-bottom:1px solid rgba(216,202,193,.55);font-size:11px;text-align:left}
.adminHistoryRow:last-child{border-bottom:0}
.adminHistoryRow span{color:var(--muted)}
.adminHistoryRow small{grid-column:2;color:var(--muted);line-height:1.5}
.adminLogisticsEvents{margin-top:12px!important}
.adminEmpty{padding:42px;text-align:center}
.adminEmpty b{font-size:16px}
.adminEmpty p{margin-bottom:0;color:var(--muted);font-size:12px}

@media(max-width:900px){
  .adminStats{grid-template-columns:repeat(5,minmax(100px,1fr));overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
  .adminStat{min-width:105px}
  .adminPage .adminGrid{grid-template-columns:1fr 1fr}
  .adminOrderControls{grid-template-columns:1fr 1fr}
  .adminOrderControls .formField:last-child{grid-column:1/-1}
}

@media(max-width:700px){
  .adminHeaderLabel{display:none}
  .adminPage .adminHero{padding:30px 0 14px}
  .adminPage .adminHero h1{font-size:36px}
  .adminPage .adminWrap{width:min(100% - 20px,1120px)}
  .adminLoginPanel{padding:28px 18px;border-radius:22px}
  .adminDashboardHead{display:block;text-align:center!important}
  .adminDashboardHead>div:first-child{text-align:center}
  .adminDashboardActions{margin-top:16px}
  .adminToolbar{grid-template-columns:1fr 1fr;padding:16px}
  .adminSearchField{grid-column:1/-1}
  .adminPage .adminOrder{padding:17px 14px;border-radius:20px}
  .adminPage .adminOrderHead{flex-direction:column;align-items:center;padding-top:5px;text-align:center}
  .adminPage .adminOrderHead>.adminLogisticsBadge{align-self:center}
  .adminOrderIdentity{text-align:center}
  .adminOrderBadges{justify-content:center}
  .adminOrderControls{grid-template-columns:1fr}
  .adminOrderControls .formField:last-child{grid-column:auto}
  .adminDetailsGrid{grid-template-columns:1fr}
}

@media(max-width:480px){
  .adminPage .nav .btn{padding:8px 10px;font-size:10px}
  .adminPage .adminHero h1{font-size:32px}
  .adminStats{grid-template-columns:repeat(5,92px);gap:8px}
  .adminStat{min-width:92px;min-height:92px;padding:13px}
  .adminStat b{font-size:26px}
  .adminStat small{margin-top:6px;font-size:8.5px}
  .adminToolbar{grid-template-columns:1fr}
  .adminSearchField{grid-column:auto}
  .adminPage .adminGrid{grid-template-columns:1fr}
  .adminPage .shippingAdminBox .grid2{grid-template-columns:1fr}
  .adminSupportAlert{display:block}
  .adminSupportAlert span{display:block;margin-top:5px}
  .adminHistoryRow{grid-template-columns:1fr;text-align:center}
  .adminHistoryRow small{grid-column:auto}
}

/* V56.2.2 · concise mobile checkout consent */
.checkoutPage .checkoutPayOption{
  min-height:74px;
  align-items:center;
  gap:13px;
  padding:14px 16px;
  border-radius:17px;
}
.checkoutPage .checkoutPayOption>input{
  width:18px;
  height:18px;
  margin:0;
  flex:0 0 18px;
  accent-color:var(--dark);
}
.checkoutPage .payOptionCopy{min-width:0}
.checkoutPage .payOptionCopy b{display:block;font-size:14px;line-height:1.35}
.checkoutPage .payOptionCopy .note{margin:3px 0 0;font-size:11px;line-height:1.35}
.checkoutPage .checkoutConsent{margin:15px 0 17px}
.checkoutPage .checkoutCard .consentRow{
  position:relative;
  display:grid!important;
  grid-template-columns:21px minmax(0,1fr)!important;
  align-items:center!important;
  justify-content:start;
  gap:10px!important;
  width:100%!important;
  max-width:none;
  margin:0!important;
  padding:2px 0!important;
  color:var(--ink);
  font-size:13px!important;
  font-weight:700;
  line-height:1.4!important;
  cursor:pointer;
}
.checkoutPage .checkoutCard .consentRow>input[type="checkbox"]{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  min-width:1px!important;
  margin:0!important;
  opacity:0;
  pointer-events:none;
}
.checkoutPage .consentBox{
  position:relative;
  box-sizing:border-box;
  display:block;
  width:21px;
  height:21px;
  border:1.5px solid #81766f;
  border-radius:6px;
  background:#fff;
  transition:.15s ease;
}
.checkoutPage .consentRow>input:checked+.consentBox{
  border-color:var(--dark);
  background:var(--dark);
}
.checkoutPage .consentRow>input:checked+.consentBox::after{
  content:'';
  position:absolute;
  left:50%;
  top:50%;
  box-sizing:border-box;
  width:6px;
  height:10px;
  border:solid #fff;
  border-width:0 2px 2px 0;
  transform:translate(-50%,-62%) rotate(45deg);
  transform-origin:center;
}
.checkoutPage .consentRow>input:focus-visible+.consentBox{box-shadow:0 0 0 3px rgba(119,88,77,.16)}
.checkoutPage .checkoutCard .consentText{
  display:block!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  text-align:left!important;
  line-height:1.4!important;
}
.checkoutPage .consentText a{color:inherit;white-space:nowrap}
.checkoutPage #placeBtn{min-height:52px;border-radius:15px}
.checkoutPage #errorText{text-align:center}

@media(max-width:560px){
  .checkoutPage .checkoutPayOption{min-height:68px;padding:12px 14px}
  .checkoutPage .payOptionCopy b{font-size:13.5px}
  .checkoutPage .payOptionCopy .note{font-size:10.5px}
  .checkoutPage .checkoutConsent{margin:14px 0 16px}
  .checkoutPage .checkoutCard .consentRow{
    grid-template-columns:20px minmax(0,1fr)!important;
    gap:9px!important;
    font-size:12px!important;
  }
  .checkoutPage .consentBox{width:20px;height:20px;border-radius:5px}
}

/* V56.2.4 · retained refund and cancellation records */
.adminModalOpen{overflow:hidden}
.adminActionOverlay[hidden]{display:none!important}
.adminActionOverlay{
  position:fixed;
  z-index:1000;
  inset:0;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(30,24,21,.55);
  backdrop-filter:blur(5px);
}
.adminActionModal{
  width:min(100%,500px);
  margin:0;
  padding:30px;
  border-radius:24px;
  box-shadow:0 24px 70px rgba(26,19,16,.24);
  text-align:center;
}
.adminActionModal h3{margin:7px 0 8px;font-size:25px}
.adminActionModal>p{max-width:410px;margin:0 auto 20px;color:var(--muted);font-size:12px;line-height:1.65}
.adminActionModal .formField{margin:0;text-align:left}
.adminActionModal textarea{min-height:96px;resize:vertical;text-align:left}
.adminActionButtons{display:grid;grid-template-columns:1fr 1.45fr;gap:10px;margin-top:18px}
.adminActionButtons .btn{width:100%;min-height:46px}
.adminActionConfirm{border-color:#9c5149!important;background:#9c5149!important;color:#fff!important}
.adminActionConfirm:hover{border-color:#87443e!important;background:#87443e!important}
.adminPrimaryActions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px}
.adminPage .adminDangerAction,.adminPage .adminCancelAction{min-height:44px;margin:0}
.adminPage .adminDangerAction{border-color:rgba(156,81,73,.5);background:#fff7f5;color:#91473f}
.adminPage .adminDangerAction:hover{border-color:#9c5149;background:#fcebe8;color:#7e3933}
.adminPage .adminCancelAction{border-color:var(--line);background:#fffdfb;color:#695b54}
.adminClosedState{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:44px;padding:9px 16px;border:1px solid var(--line);border-radius:14px;background:#f5f1ee;text-align:center}
.adminClosedState b{font-size:12px;color:#594b45}
.adminClosedState span{margin-top:2px;color:var(--muted);font-size:10px;line-height:1.45}
.adminOrder.closed{border-color:#d8cec8;background:#fbf9f7}
.adminOrder.closed .adminOrderControls select:disabled,.adminOrder.closed .adminOrderControls input:disabled,.adminOrder.closed .shippingAdminBox select:disabled,.adminOrder.closed .shippingAdminBox input:disabled{opacity:.7;cursor:not-allowed}

@media(max-width:560px){
  .adminActionModal{padding:25px 18px;border-radius:21px}
  .adminActionModal h3{font-size:22px}
  .adminActionButtons{grid-template-columns:1fr}
  .adminActionConfirm{grid-row:1}
  .adminPrimaryActions{width:100%;flex-direction:column}
  .adminPage .adminPrimaryActions .btn,.adminClosedState{width:100%}
}

/* V56.2.6 · compact mobile-only order administration */
.adminMobileOrderSummary,.adminShippingSummary{display:none}
.adminOrderBody,.adminShippingBody{display:contents}

@media(max-width:700px){
  .adminPage details.adminOrder{
    overflow:hidden;
    padding:0;
  }
  .adminMobileOrderSummary{
    position:relative;
    display:block;
    padding:14px;
    list-style:none;
    background:#fffdfb;
    text-align:left;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .adminMobileOrderSummary::-webkit-details-marker,.adminShippingSummary::-webkit-details-marker{display:none}
  .adminMobileOrderSummary::marker,.adminShippingSummary::marker{content:''}
  .adminMobileOrderSummary:focus-visible,.adminShippingSummary:focus-visible{outline:3px solid rgba(119,88,77,.18);outline-offset:-3px}
  .adminOrder[open]>.adminMobileOrderSummary{border-bottom:1px solid rgba(216,202,193,.72)}
  .adminOrder.closed>.adminMobileOrderSummary{background:#f8f5f2}
  .adminMobileSummaryTop{display:flex;align-items:center;justify-content:space-between;gap:10px}
  .adminMobileSummaryTop .adminOrderBadges{min-height:24px;gap:5px}
  .adminMobileSummaryTop .adminStateBadge,.adminMobileSummaryTop .adminLogisticsBadge{min-height:24px;padding:0 8px;font-size:9px}
  .adminMobileSummaryOrder{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:9px}
  .adminMobileSummaryOrder strong{min-width:0;overflow-wrap:anywhere;font-size:14px;line-height:1.3;letter-spacing:.01em}
  .adminMobileSummaryOrder b{flex:0 0 auto;font-size:15px}
  .adminMobileSummaryMeta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px;color:var(--muted);font-size:9.5px;line-height:1.45}
  .adminMobileSummaryMeta>span{min-width:0}
  .adminMobileSummaryMeta em{display:inline-flex;align-items:center;flex:0 0 auto;gap:3px;color:#725f55;font-size:9.5px;font-style:normal;font-weight:750}
  .adminMobileSummaryMeta i{font-style:normal;transition:transform .16s ease}
  .summaryOpenLabel{display:none}
  .adminOrder[open] .summaryClosedLabel{display:none}
  .adminOrder[open] .summaryOpenLabel{display:inline}
  .adminOrder[open] .adminMobileSummaryMeta i{transform:rotate(180deg)}
  .adminOrderBody{display:block;padding:12px 14px 15px}
  .adminPage .adminOrderHead{display:none}

  .adminPage .adminGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    margin-bottom:10px;
  }
  .adminPage .adminGrid>div{min-height:58px;padding:8px;border-radius:12px}
  .adminPage .adminGrid span{margin-bottom:3px;font-size:9px;line-height:1.3}
  .adminPage .adminGrid b{font-size:11px;line-height:1.4}

  .adminOrderControls{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px 8px;
    margin:7px 0 10px;
  }
  .adminOrderControls .formField{margin:0}
  .adminOrderControls .formField:nth-child(3){grid-column:1/-1}
  .adminPage .adminOrderControls label,.adminPage .adminShippingBody label{
    margin:0 0 4px;
    font-size:10.5px;
    line-height:1.25;
  }
  .adminPage .adminOrderControls input,.adminPage .adminOrderControls select,
  .adminPage .adminShippingBody input,.adminPage .adminShippingBody select{
    min-height:44px;
    padding:8px 10px;
    border-radius:12px;
    font-size:16px;
    line-height:1.2;
    text-align:center;
    text-align-last:center;
  }

  .adminPage .adminShippingDetails{
    overflow:hidden;
    margin:0 0 10px;
    padding:0;
    border-radius:14px;
  }
  .adminShippingSummary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:58px;
    padding:11px 13px;
    list-style:none;
    text-align:left;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .adminShippingSummary>span{min-width:0}
  .adminShippingSummary b{display:block;font-size:12px;line-height:1.3}
  .adminShippingSummary small{display:block;overflow:hidden;margin-top:3px;color:var(--muted);font-size:9.5px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}
  .adminShippingSummary i{flex:0 0 auto;color:#77665d;font-size:14px;font-style:normal;transition:transform .16s ease}
  .adminShippingDetails[open]>.adminShippingSummary{border-bottom:1px solid rgba(216,202,193,.7)}
  .adminShippingDetails[open]>.adminShippingSummary i{transform:rotate(180deg)}
  .adminShippingBody{display:block;padding:11px}
  .adminPage .adminShippingBody .shippingAdminTitle{display:none}
  .adminPage .adminShippingBody .grid2{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0}
  .adminPage .adminShippingBody .formField{margin:0}
  .adminPage .adminShippingBody .logisticsAdminMeta{margin-top:7px;font-size:9.5px;line-height:1.45}

  .adminSupportAlert{display:flex!important;flex-direction:column;gap:3px;margin-top:8px;padding:10px;border-radius:13px}
  .adminSupportAlert b{font-size:11px}
  .adminSupportAlert span{margin-top:0!important;font-size:10px;line-height:1.4}
  .adminSaveBar{margin-top:10px}
  .adminSaveBar .adminNotice{margin-top:5px}
  .adminDetailsGrid{gap:8px;margin-top:7px}
  .adminPage .adminItems{padding:10px 11px;border-radius:12px}
  .adminPage .adminItems summary{font-size:11px}
  .adminItemRow{grid-template-columns:42px minmax(0,1fr) auto;gap:8px;padding:8px 0}
  .adminItemThumb{width:42px;height:42px;border-radius:9px}
  .adminItemCopy{gap:2px}
  .adminItemCopy strong{font-size:10.5px}
  .adminItemCopy small{font-size:9px}
  .adminItemAmount{font-size:10.5px}
  .adminPage .adminPrimaryActions .btn{min-height:44px}
  .adminClosedState{min-height:42px;padding:8px 12px}
}

@media(max-width:370px){
  .adminMobileSummaryMeta{align-items:flex-start;flex-direction:column;gap:4px}
  .adminOrderControls{grid-template-columns:1fr}
  .adminOrderControls .formField:nth-child(3){grid-column:auto}
  .adminPage .adminShippingBody .grid2{grid-template-columns:1fr}
}

/* V56.2.8 · desktop badge optical centering only */
@media(min-width:701px){
  .adminPage .adminStateBadge,.adminPage .adminOrderHead>.adminLogisticsBadge{height:28px;min-height:28px;justify-content:center;line-height:1}
  .adminPage .adminOrderHead .adminBadgeText{display:block;line-height:1;transform:translateY(1px)}
}

/* V56.2.9 · desktop horizontal order accordion */
@media(max-width:700px){
  .adminMobileOrderSummary{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "badges logistics"
      "identity amount"
      "customer toggle";
    align-items:center;
    gap:8px 10px;
  }
  .adminSummaryBadges{grid-area:badges;min-width:0}
  .adminSummaryBadges .adminOrderBadges{min-height:24px;gap:5px}
  .adminSummaryBadges .adminStateBadge,.adminSummaryLogistics .adminLogisticsBadge{min-height:24px;padding:0 8px;font-size:9px}
  .adminSummaryIdentity{grid-area:identity;display:flex;min-width:0;flex-direction:column;align-items:flex-start}
  .adminSummaryIdentity strong{overflow-wrap:anywhere;font-size:14px;line-height:1.3}
  .adminSummaryIdentity small{margin-top:2px;color:var(--muted);font-size:9px;line-height:1.35}
  .adminSummaryCustomer{grid-area:customer;display:flex;min-width:0;align-items:baseline;gap:6px}
  .adminSummaryCustomer strong{overflow:hidden;font-size:11px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}
  .adminSummaryCustomer small{flex:0 0 auto;color:var(--muted);font-size:9px}
  .adminSummaryAmount{grid-area:amount;display:flex;flex-direction:column;align-items:flex-end}
  .adminSummaryAmount strong{font-size:14px;line-height:1.2}
  .adminSummaryAmount small{margin-top:2px;color:var(--muted);font-size:9px}
  .adminSummaryLogistics{grid-area:logistics;justify-self:end}
  .adminSummaryToggle{grid-area:toggle;display:inline-flex;align-items:center;justify-self:end;gap:3px;color:#725f55;font-size:9.5px;font-weight:750}
  .adminSummaryToggle i{font-style:normal;transition:transform .16s ease}
  .adminOrder[open] .adminSummaryToggle i{transform:rotate(180deg)}
}

@media(min-width:701px){
  .adminPage details.adminOrder{overflow:hidden;padding:0;transition:border-color .16s ease,box-shadow .16s ease}
  .adminPage .adminMobileOrderSummary{
    display:grid;
    grid-template-columns:minmax(170px,1.15fr) minmax(205px,1.35fr) minmax(130px,.9fr) 90px minmax(100px,.75fr) 92px;
    grid-template-areas:"badges identity customer amount logistics toggle";
    align-items:center;
    gap:10px;
    min-height:86px;
    padding:15px 18px;
    list-style:none;
    background:#fffdfb;
    text-align:left;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .adminPage .adminMobileOrderSummary::-webkit-details-marker{display:none}
  .adminPage .adminMobileOrderSummary::marker{content:''}
  .adminPage .adminMobileOrderSummary:focus-visible{outline:3px solid rgba(119,88,77,.18);outline-offset:-3px}
  .adminPage .adminOrder[open]{border-color:#b88f80;box-shadow:0 14px 38px rgba(93,64,55,.1)}
  .adminPage .adminOrder[open]>.adminMobileOrderSummary{border-bottom:1px solid #dfcec6;background:#fcf6f3}
  .adminPage .adminOrder.closed>.adminMobileOrderSummary{background:#f8f5f2}
  .adminPage .adminOrderBody{display:block;padding:18px 24px 24px}
  .adminPage .adminOrderHead{display:none}
  .adminSummaryBadges{grid-area:badges;min-width:0}
  .adminSummaryBadges .adminOrderBadges{align-items:center;min-height:28px;gap:6px}
  .adminSummaryIdentity{grid-area:identity;display:flex;min-width:0;flex-direction:column;align-items:flex-start}
  .adminSummaryIdentity strong{overflow-wrap:anywhere;font-size:14px;line-height:1.3;letter-spacing:.01em}
  .adminSummaryIdentity small{margin-top:3px;color:var(--muted);font-size:9.5px;line-height:1.35}
  .adminSummaryCustomer{grid-area:customer;display:flex;min-width:0;flex-direction:column;align-items:flex-start}
  .adminSummaryCustomer strong{max-width:100%;overflow:hidden;font-size:12px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}
  .adminSummaryCustomer small{margin-top:3px;color:var(--muted);font-size:9.5px;line-height:1.35}
  .adminSummaryAmount{grid-area:amount;display:flex;flex-direction:column;align-items:center;text-align:center}
  .adminSummaryAmount strong{font-size:15px;line-height:1.2}
  .adminSummaryAmount small{margin-top:3px;color:var(--muted);font-size:9.5px;line-height:1.35}
  .adminSummaryLogistics{grid-area:logistics;justify-self:center}
  .adminSummaryToggle{grid-area:toggle;display:inline-flex;align-items:center;justify-content:center;justify-self:end;gap:5px;min-height:34px;padding:0 11px;border:1px solid var(--line);border-radius:999px;background:#fff;color:#6d574e;font-size:10px;font-weight:800;white-space:nowrap}
  .adminSummaryToggle i{font-style:normal;transition:transform .16s ease}
  .adminSummaryToggle .summaryOpenLabel{display:none}
  .adminOrder[open] .adminSummaryToggle .summaryClosedLabel{display:none}
  .adminOrder[open] .adminSummaryToggle .summaryOpenLabel{display:inline}
  .adminOrder[open] .adminSummaryToggle{border-color:#c7a99d;background:#eadbd4;color:#5d4037}
  .adminOrder[open] .adminSummaryToggle i{transform:rotate(180deg)}
  .adminPage .adminMobileOrderSummary .adminBadgeText{display:block;line-height:1;transform:translateY(1px)}
}

@media(min-width:701px) and (max-width:980px){
  .adminPage .adminMobileOrderSummary{
    grid-template-columns:minmax(170px,1.1fr) minmax(190px,1.25fr) 90px 92px;
    grid-template-areas:
      "badges identity amount toggle"
      "logistics customer customer toggle";
    min-height:108px;
    row-gap:8px;
  }
  .adminSummaryLogistics{justify-self:start}
}

/* V56.2.11 · compact mobile filter rows */
@media(max-width:700px){
  .adminPage .adminSummaryBadges{justify-self:start}
  .adminPage .adminSummaryBadges .adminOrderBadges{justify-content:flex-start}
  .adminPage .adminStats{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;overflow:visible;padding:2px 1px 1px}
  .adminPage .adminStat{box-sizing:border-box;min-width:0;min-height:82px;padding:10px 3px;border-radius:15px}
  .adminPage .adminStat:hover,.adminPage .adminStat.active{transform:none}
  .adminPage .adminStat span{font-size:9.5px;line-height:1.2;white-space:nowrap}
  .adminPage .adminStat b{margin-top:6px;font-size:23px}
  .adminPage .adminStat small{display:none}
  .adminPage .adminToolbar{grid-template-columns:1fr;gap:8px;padding:12px 14px;border-radius:18px}
  .adminPage .adminToolbar .formField{display:grid;grid-template-columns:76px minmax(0,1fr);align-items:center;gap:10px;min-width:0;margin:0}
  .adminPage .adminToolbar .adminSearchField{grid-column:auto}
  .adminPage .adminToolbar .formField label{margin:0;color:#302723;font-size:11.5px;font-weight:800;line-height:1.25;text-align:left;white-space:nowrap}
  .adminPage .adminToolbar input,.adminPage .adminToolbar select{width:100%;min-width:0;min-height:44px;padding:8px 12px;border-radius:12px;font-size:16px;line-height:1.2;text-align:left;text-align-last:left}
  .adminPage .adminToolbar input::placeholder{color:#aaa09a;font-size:11.5px}
}

@media(max-width:370px){
  .adminPage .adminStats{gap:4px}
  .adminPage .adminStat{min-height:74px;padding:8px 2px;border-radius:13px}
  .adminPage .adminStat span{font-size:8.5px}
  .adminPage .adminStat b{font-size:21px}
  .adminPage .adminToolbar{padding:11px 12px}
  .adminPage .adminToolbar .formField{grid-template-columns:68px minmax(0,1fr);gap:8px}
  .adminPage .adminToolbar .formField label{font-size:10.5px}
  .adminPage .adminToolbar input::placeholder{font-size:10.5px}
}

/* V56.2.14 · compact mobile purchase-notice header */
@media(max-width:700px){
  .policyHero{padding:14px 0 7px}
  .policyHeroCard{
    padding:18px 16px 17px!important;
    border-radius:20px;
    box-shadow:0 10px 26px rgba(63,47,40,.06);
  }
  .policyKicker{
    height:24px;
    padding:0 9px;
    font-size:9px;
  }
  .policyHero h1{
    margin:10px 0 6px;
    font-size:27px!important;
    line-height:1.15;
  }
  .policyHero p{
    max-width:none;
    font-size:12px!important;
    line-height:1.55;
  }
  .policyQuickNav{display:none}
  .policyList{margin-top:10px}
}

/* V56.2.20 · centered checkout privacy notices */
.checkoutPage .checkoutCard>.privacyBox{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

/* V56.2.21 · one centered axis for the mobile order right column */
@media(max-width:700px){
  .adminPage .adminMobileOrderSummary{
    grid-template-columns:minmax(0,1fr) 84px;
  }
  .adminPage .adminSummaryLogistics,
  .adminPage .adminSummaryAmount,
  .adminPage .adminSummaryToggle{
    width:100%;
    justify-self:stretch;
    justify-content:center;
    align-items:center;
    text-align:center;
  }
  .adminPage .adminSummaryLogistics{display:flex}
}

/* V56.2.22 · aligned mobile logistics key-value rows */
@media(max-width:700px){
  .trackPage .orderInfoBlock .summaryRow{
    display:grid;
    grid-template-columns:64px minmax(0,1fr);
    align-items:start;
    justify-content:stretch;
    gap:12px;
    width:min(100%,300px);
    margin:8px auto;
    text-align:left;
  }
  .trackPage .orderInfoBlock .summaryRow>span{
    min-width:0;
    text-align:left;
  }
  .trackPage .orderInfoBlock .summaryRow>span:last-child{
    overflow-wrap:anywhere;
    word-break:break-word;
  }
}

/* V56.2.24 · compact sticky mobile order and cart shortcuts */
.mobileHeaderShortcut,
.mobileHeaderShortcutBody{display:none}
.mobileMenuIcon{width:21px;height:21px;display:block}
@media(max-width:640px){
  .homePage header .nav{
    height:70px!important;
    min-height:70px!important;
    gap:0!important;
  }
  .homePage header .nav .logo{
    margin-right:auto!important;
    font-size:15px!important;
    letter-spacing:.16em;
  }
  .homePage header .actions{gap:6px}
  .homePage .mobileHeaderShortcut,
  .homePage .mobileHeaderCart{
    position:relative;
    box-sizing:border-box;
    width:54px!important;
    height:56px!important;
    min-height:56px!important;
    padding:0!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    background:rgba(255,253,250,.92)!important;
    color:var(--ink)!important;
    box-shadow:0 6px 18px rgba(53,37,31,.055)!important;
    -webkit-tap-highlight-color:transparent;
  }
  .homePage .mobileHeaderShortcut{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    font-size:10px;
    font-weight:700;
    line-height:1;
  }
  .homePage .mobileHeaderShortcutBody{
    display:flex;
    width:100%;
    height:100%;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    font-size:10px;
    font-weight:700;
    line-height:1;
  }
  .homePage .mobileHeaderIcon{display:block;width:20px;height:20px}
  .homePage .desktopCartLabel{display:none}
  .homePage .mobileCartBadge{
    position:absolute;
    top:3px;
    right:3px;
    min-width:17px;
    height:17px;
    padding:0 4px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1.5px solid var(--paper);
    border-radius:999px;
    background:var(--dark);
    color:#fff;
    font-size:8.5px;
    font-weight:850;
    line-height:1;
    text-align:center;
    font-variant-numeric:tabular-nums;
  }
  .homePage .mobileCartBadgeValue{
    display:block;
    min-width:0;
    line-height:1;
    text-align:center;
    transform:translateY(.5px);
  }
  .homePage .mobileCartBadge[hidden]{display:none!important}
  .homePage .menuBtn{
    width:44px!important;
    height:44px!important;
    margin-left:0;
    border-radius:50%!important;
    background:rgba(255,253,250,.92);
    box-shadow:0 6px 18px rgba(53,37,31,.045);
  }
  .homePage .mobileHeaderShortcut:hover,
  .homePage .mobileHeaderCart:hover,
  .homePage .menuBtn:hover{transform:none!important}
  .homePage .mobileHeaderShortcut:active,
  .homePage .mobileHeaderCart:active,
  .homePage .menuBtn:active{transform:scale(.96)!important}
  .homePage .mobileNav{
    position:absolute!important;
    top:100%!important;
    max-height:calc(100svh - 70px)!important;
  }
}
@media(max-width:360px){
  .homePage header .actions{gap:4px}
  .homePage .mobileHeaderShortcut,
  .homePage .mobileHeaderCart{width:51px!important}
  .homePage header .nav .logo{
    margin-right:7px!important;
    font-size:14px!important;
  }
}

/* V56.2.23 · matching desktop logistics key-value rows */
@media(min-width:701px){
  .trackPage .orderInfoBlock .summaryRow{
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    align-items:start;
    justify-content:stretch;
    gap:16px;
    width:min(100%,360px);
    margin:8px auto;
    text-align:left;
  }
  .trackPage .orderInfoBlock .summaryRow>span{
    min-width:0;
    text-align:left;
  }
  .trackPage .orderInfoBlock .summaryRow>span:last-child{
    overflow-wrap:anywhere;
    word-break:break-word;
  }
}

/* V56.2.26 · unmistakable tap feedback for the two mobile header shortcuts */
@media(max-width:640px){
  .homePage .mobileHeaderShortcut,
  .homePage .mobileHeaderCart{
    transform-origin:center;
    will-change:transform;
    transition:transform .16s cubic-bezier(.2,.8,.2,1),background-color .14s ease,border-color .14s ease,box-shadow .14s ease!important;
  }
  .homePage .mobileHeaderShortcut .mobileHeaderIcon,
  .homePage .mobileHeaderCart .mobileHeaderIcon{
    transition:transform .16s cubic-bezier(.2,.8,.2,1);
    transform-origin:center;
  }
  .homePage .mobileHeaderShortcut:active,
  .homePage .mobileHeaderCart:active,
  .homePage .mobileHeaderShortcut.isTapFeedback,
  .homePage .mobileHeaderCart.isTapFeedback{
    transform:scale(.91)!important;
    background:#efe2db!important;
    border-color:#c8aa9d!important;
    box-shadow:0 2px 7px rgba(72,49,41,.12)!important;
  }
  .homePage .mobileHeaderShortcut.isTapFeedback .mobileHeaderIcon,
  .homePage .mobileHeaderCart.isTapFeedback .mobileHeaderIcon{
    transform:translateY(1px) scale(.88);
  }
}
@media(max-width:640px) and (prefers-reduced-motion:reduce){
  .homePage .mobileHeaderShortcut,
  .homePage .mobileHeaderCart{
    transition:background-color .01s linear,border-color .01s linear,box-shadow .01s linear!important;
  }
  .homePage .mobileHeaderShortcut.isTapFeedback,
  .homePage .mobileHeaderCart.isTapFeedback,
  .homePage .mobileHeaderShortcut.isTapFeedback .mobileHeaderIcon,
  .homePage .mobileHeaderCart.isTapFeedback .mobileHeaderIcon{
    transform:none!important;
  }
}

/* V56.2.27 · pulse-only feedback for the original floating cart */
@media(max-width:640px){
  .floatingCartBtn.loomiCartPulse{
    animation:loomiFloatingCartPulse .36s cubic-bezier(.22,.61,.36,1);
  }
}
@keyframes loomiFloatingCartPulse{
  0%{scale:1}
  45%{scale:1.12}
  100%{scale:1}
}
@media(prefers-reduced-motion:reduce){
  .floatingCartBtn.loomiCartPulse{animation:none}
}

/* V56.2.28 · breathing room between stacked mobile shipping fields */
@media(max-width:370px){
  .adminPage .adminShippingBody .grid2{
    row-gap:16px;
  }
}

/* V56.2.34 · single-line guide heading on every screen */
.quiz .guideTitle{
  max-width:none!important;
  white-space:nowrap!important;
}
@media(max-width:640px){
  .quiz .guideTitle{
    font-size:clamp(16px,5.3vw,21px)!important;
    letter-spacing:-.03em!important;
  }
}

/* V56.2.42 · invisible mobile navigation dismissal surface */
.mobileNavBackdrop{display:none}
@media(max-width:960px){
  .homePage .mobileNavBackdrop{
    position:fixed;
    inset:0;
    z-index:38;
    display:block;
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    appearance:none;
    -webkit-appearance:none;
    background:none!important;
    background-color:transparent!important;
    background-image:none!important;
    color:transparent;
    box-shadow:none!important;
    filter:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    opacity:1;
    visibility:hidden;
    pointer-events:none;
    transition:none;
    -webkit-tap-highlight-color:transparent;
    touch-action:none;
  }
  .homePage .mobileNavBackdrop.show{
    visibility:visible;
    pointer-events:auto;
  }
  .homePage.mobileNavOpen{
    overflow:hidden;
    overscroll-behavior:none;
  }
}
@media(max-width:640px){
  .trackPage .orderTimeline .step>.dot{
    position:relative;
    align-self:center;
    margin-top:0;
  }
  .trackPage .orderTimeline .step.complete>.dot::after{
    content:"";
    position:absolute;
    left:3.5px;
    top:2px;
    width:3px;
    height:5px;
    border:solid #fff;
    border-width:0 1.4px 1.4px 0;
    transform:rotate(45deg);
  }
  .trackPage .orderTimeline .step.current>.dot{
    background:var(--dark);
    box-shadow:0 0 0 4px #eee2dc;
  }
  .trackPage .orderTimeline .step.pending b,
  .trackPage .orderTimeline .step.pending span{
    color:#a79d97;
  }
  .trackPage .orderTimeline .step.current b{
    position:relative;
    display:inline-block;
  }
  .trackPage .orderTimeline .step.current b::after{
    content:"当前";
    position:absolute;
    left:calc(100% + 7px);
    top:50%;
    transform:translateY(-50%);
    padding:2px 6px;
    border-radius:999px;
    background:#f0e3dd;
    color:#76584d;
    font-size:8px;
    font-weight:800;
    line-height:1.25;
    white-space:nowrap;
  }
  .homePage .mobileNav{
    padding-bottom:14px!important;
    border-bottom:1px solid var(--line)!important;
    border-radius:0 0 20px 20px!important;
    overflow:hidden;
    background:var(--paper)!important;
    box-shadow:none!important;
  }
  .homePage .mobileNav>a:last-child{
    min-height:50px;
    padding:14px 4px 16px!important;
    border-bottom:0!important;
  }
  .homePage .mobileTrackShortcut.isLoading>span{
    color:var(--accent);
    font-size:8.5px;
    white-space:nowrap;
  }
  .homePage .quiz .guideTitle{
    width:100%;
    margin-left:auto!important;
    margin-right:auto!important;
    text-align:center;
  }
  .homePage .quiz>div:first-child{
    text-align:center;
  }
  .homePage .quiz>div:first-child>.eyebrow,
  .homePage .quiz>div:first-child>.guideTitle{
    display:block;
    width:100%;
    text-align:center!important;
  }
}
/* V56.2.38 · visually remove repeated administrator shipping labels */
.adminPage .adminShippingFieldLabel{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  margin:-1px!important;
  padding:0!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  border:0!important;
  white-space:nowrap!important;
}

/* V56.2.39 · semantic order progress + homepage brand lockup */
.homePage .homeBrand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:max-content;
  letter-spacing:normal;
}
.homePage .homeBrandName{
  color:var(--ink);
  font-size:20px;
  font-weight:850;
  line-height:1;
  letter-spacing:.18em;
}
.homePage .homeBrandDivider{
  width:1px;
  height:18px;
  flex:0 0 1px;
  background:rgba(119,88,77,.28);
}
.homePage .homeBrandTagline{
  color:#81756e;
  font-size:10.5px;
  font-weight:500;
  line-height:1;
  letter-spacing:.06em;
  white-space:nowrap;
}
@media(min-width:641px){
  .homePage .homeBrandTagline{
    color:#756a64;
    font-size:11px;
    font-weight:600;
  }
}
.trackPage .orderProgress{
  margin:0 0 16px;
  padding:16px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.trackPage .orderProgress .orderTimeline{
  width:min(100%,340px);
  margin:0 auto;
  padding:0;
  border:0;
  list-style:none;
}
.trackPage .orderProgress .orderStep{
  position:relative;
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  align-items:center;
  gap:13px;
  min-height:58px;
  padding:0;
  text-align:left;
}
.trackPage .orderProgress .orderStep:not(:last-child)::after{
  content:"";
  position:absolute;
  z-index:0;
  top:50%;
  left:10px;
  width:2px;
  height:100%;
  transform:translateX(-50%);
  background:#ddd2cb;
}
.trackPage .orderProgress .orderStep.is-complete::after{
  background:var(--dark);
}
.trackPage .orderProgress .orderStepMarker{
  position:relative;
  z-index:1;
  display:grid;
  place-items:center;
  width:14px;
  height:14px;
  margin:0 auto;
  border:2px solid #c7bbb4;
  border-radius:50%;
  background:#fffdfb;
  color:#fff;
  font-size:9px;
  font-weight:900;
  line-height:1;
}
.trackPage .orderProgress .orderStep.is-complete .orderStepMarker{
  border-color:var(--dark);
  background:var(--dark);
}
.trackPage .orderProgress .orderStep.is-current .orderStepMarker{
  border-color:var(--dark);
  background:#fffdfb;
  box-shadow:0 0 0 4px #eee2dc;
}
.trackPage .orderProgress .orderStep.is-current .orderStepMarker::after{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--dark);
}
.trackPage .orderProgress .orderStep.is-upcoming .orderStepMarker{
  border-color:#cfc3bc;
  background:#fffdfb;
}
.trackPage .orderProgress .orderStep.is-cancelled .orderStepMarker{
  border-color:var(--bad);
  background:var(--bad);
  font-size:11px;
}
.trackPage .orderProgress .orderStepCopy{
  min-width:0;
  text-align:left;
}
.trackPage .orderProgress .orderStepTitleRow{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.trackPage .orderProgress .orderStepTitleRow b{
  color:var(--ink);
  font-size:13px;
  font-weight:800;
  line-height:1.35;
}
.trackPage .orderProgress .orderStepBadge{
  display:inline-flex;
  align-items:center;
  min-height:19px;
  padding:0 7px;
  border-radius:999px;
  background:#f0e3dd;
  color:#76584d;
  font-size:8.5px;
  font-style:normal;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
}
.trackPage .orderProgress .orderStepNote{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:11px;
  line-height:1.45;
}
.trackPage .orderProgress .orderStep.is-upcoming .orderStepTitleRow b,
.trackPage .orderProgress .orderStep.is-upcoming .orderStepNote{
  color:#a79d97;
}
.trackPage .orderProgress.is-cancelled .orderTimeline{
  width:min(100%,300px);
}
.trackPage .orderProgress.is-cancelled .orderStepBadge{
  background:#f3e3e3;
  color:var(--bad);
}
@media(max-width:640px){
  .homePage .homeBrand{
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:3px;
    margin-right:auto!important;
  }
  .homePage .homeBrandName{
    align-self:stretch;
    display:flex;
    justify-content:space-between;
    width:100%;
    font-size:15px;
    letter-spacing:0;
  }
  .homePage .homeBrandName>span{
    display:block;
    flex:0 0 auto;
  }
  .homePage .homeBrandDivider{display:none}
  .homePage .homeBrandTagline{
    color:#81756e;
    font-size:9px;
    font-weight:500;
    letter-spacing:.06em;
  }
  .trackPage .orderProgress{
    padding:14px 0;
  }
  .trackPage .orderProgress .orderTimeline{
    width:min(100%,300px);
  }
  .trackPage .orderProgress .orderStep{
    grid-template-columns:20px minmax(0,1fr);
    gap:10px;
    min-height:56px;
  }
  .trackPage .orderProgress .orderStep:not(:last-child)::after{
    left:9px;
  }
  .trackPage .orderProgress .orderStepCopy{
    text-align:center;
  }
  .trackPage .orderProgress .orderStepTitleRow{
    justify-content:center;
  }
  .homePage .heroCopy .trustline>span{
    justify-self:start;
  }
}
@media(max-width:360px){
  .homePage .homeBrandName{font-size:14px}
  .homePage .homeBrandTagline{font-size:8.5px}
}

/* V56.2.61 · preserve the light safe area in browser and installed-app modes */
@media(max-width:960px){
  html{background:var(--bg)}
  body{padding-top:env(safe-area-inset-top,0px)}
  body>.topbar{
    padding-top:9px;
    padding-right:max(16px,env(safe-area-inset-right,0px));
    padding-left:max(16px,env(safe-area-inset-left,0px));
  }
  header>.wrap{
    padding-right:env(safe-area-inset-right,0px);
    padding-left:env(safe-area-inset-left,0px);
  }
  header .mobileNav{
    padding-right:max(14px,env(safe-area-inset-right,0px))!important;
    padding-left:max(14px,env(safe-area-inset-left,0px))!important;
  }
}
/* V56.2.48 · natural-flow mobile header for edge-to-edge scrolling */
@media(max-width:960px){
  header{
    position:relative;
    top:auto;
  }
}

/* V56.2.59 · balanced desktop notification controls with a roomier sound selector */
.adminDashboardActions{align-items:center}
.adminLiveStatus{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:42px;
  padding:7px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fffdfb;
  color:#645850;
  text-align:left;
}
.adminLiveDot{
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:#9d938d;
  box-shadow:0 0 0 4px rgba(157,147,141,.12);
}
.adminLiveCopy{display:flex;min-width:0;flex-direction:column;gap:2px}
.adminLiveCopy b{font-size:10.5px;line-height:1.2;white-space:nowrap}
.adminLiveCopy small{color:var(--muted);font-size:8.5px;line-height:1.2;white-space:nowrap}
.adminLiveStatus[data-state="live"] .adminLiveDot{background:#4d8a68;box-shadow:0 0 0 4px rgba(77,138,104,.13)}
.adminLiveStatus[data-state="loading"] .adminLiveDot{background:#aa7b46;box-shadow:0 0 0 4px rgba(170,123,70,.13);animation:adminLivePulse 1.2s ease-in-out infinite}
.adminLiveStatus[data-state="paused"] .adminLiveDot{background:#9d938d}
.adminLiveStatus[data-state="error"] .adminLiveDot{background:#a65349;box-shadow:0 0 0 4px rgba(166,83,73,.12)}
@keyframes adminLivePulse{0%,100%{opacity:.45}50%{opacity:1}}
.adminSoundControls{display:flex;align-items:stretch;gap:6px}
.adminSoundToggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;white-space:nowrap}
.adminSoundIcon{width:17px;height:17px;fill:currentColor}
.adminSoundWave{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1.7;opacity:.28}
.adminSoundToggle.isOn{border-color:#b8cdbf;background:#eef6f1;color:#3f7255}
.adminSoundToggle.isOn .adminSoundWave{opacity:1}
.adminSoundProfile{
  min-height:42px;
  min-width:104px;
  padding:0 30px 0 11px;
  border:1px solid var(--line);
  border-radius:14px;
  background-color:#fffdfb;
  color:#5f534d;
  font-family:inherit;
  font-size:10px;
  font-weight:750;
  line-height:1.2;
  cursor:pointer;
}
.adminSoundProfile:focus-visible{outline:2px solid rgba(83,115,94,.3);outline-offset:2px}
.adminPushToggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:6px 12px;text-align:left}
.adminPushIcon{width:17px;height:17px;flex:0 0 17px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7}
.adminPushCopy{display:flex;min-width:0;flex-direction:column;gap:2px}
.adminPushCopy b{font-size:10.5px;line-height:1.2;white-space:nowrap}
.adminPushCopy small{color:var(--muted);font-size:8px;font-weight:600;line-height:1.2;white-space:nowrap}
.adminPushToggle[data-state="on"]{border-color:#b8cdbf;background:#eef6f1;color:#3f7255}
.adminPushToggle[data-state="on"] small{color:#678271}
.adminPushToggle[data-state="denied"]{border-color:#d8c4bc;background:#f8f0ec;color:#795b51}
.adminPushToggle[data-state="denied"] small{color:#8b7269}
.adminPushToggle[data-state="error"]{border-color:#d9b7b1;background:#fbefed;color:#8f4e46}
.adminPushToggle:disabled{cursor:not-allowed;opacity:.72}
@media(min-width:701px){
  .adminDashboardHead{gap:16px}
  .adminDashboardHead>div:first-child{flex:0 1 210px;min-width:170px}
  .adminDashboardActions{flex:1 1 auto;min-width:0;flex-wrap:nowrap;justify-content:flex-end;gap:8px}
  .adminLiveStatus{flex:0 1 auto;min-width:0;padding-right:9px;padding-left:9px}
  .adminLiveCopy b,.adminLiveCopy small{display:block;max-width:86px;overflow:hidden;text-overflow:ellipsis}
  .adminSoundControls{flex:0 0 auto;gap:7px;margin-right:2px}
  .adminSoundToggle{padding-right:8px;padding-left:8px}
  .adminSoundProfile{width:108px;min-width:108px;padding-right:30px;padding-left:12px}
  .adminPushToggle{flex:0 1 154px;max-width:154px;padding-right:8px;padding-left:8px}
  .adminPushCopy b,.adminPushCopy small{display:block;max-width:116px;overflow:hidden;text-overflow:ellipsis}
  #adminRefreshButton,#adminLogoutButton{flex:0 0 auto;padding-right:11px;padding-left:11px;white-space:nowrap}
}
@media(min-width:701px) and (max-width:1050px){
  .adminDashboardHead{display:block}
  .adminDashboardHead>div:first-child{text-align:center}
  .adminDashboardActions{margin-top:16px}
}
@media(min-width:701px) and (max-width:820px){
  .adminDashboardActions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .adminLiveStatus,.adminSoundControls,.adminPushToggle{grid-column:1/-1;width:100%;max-width:none;margin-right:0}
  .adminLiveStatus,.adminPushToggle{justify-content:center}
  .adminSoundControls>*{min-width:0;flex:1 1 50%}
  #adminRefreshButton,#adminLogoutButton{width:100%}
}
.adminToastRegion{
  position:fixed;
  z-index:180;
  top:auto;
  right:max(18px,env(safe-area-inset-right,0px));
  bottom:max(18px,calc(env(safe-area-inset-bottom,0px) + 12px));
  display:flex;
  flex-direction:column;
  gap:10px;
  width:min(390px,calc(100% - 36px));
  max-height:calc(100dvh - max(36px,calc(env(safe-area-inset-bottom,0px) + 24px)));
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  pointer-events:none;
  scrollbar-width:thin;
}
.adminToastRegion:empty{display:none}
.adminNewOrderToast{
  display:grid;
  grid-template-columns:40px minmax(0,1fr) auto 28px;
  align-items:center;
  gap:10px;
  padding:12px;
  border:1px solid #c9dace;
  border-radius:18px;
  background:rgba(255,253,251,.97);
  box-shadow:0 18px 52px rgba(55,42,36,.2);
  opacity:0;
  pointer-events:auto;
  transform:translateY(-10px) scale(.98);
  transition:opacity .18s ease,transform .18s ease;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.adminNewOrderToast.show{opacity:1;transform:translateY(0) scale(1)}
.adminNewOrderToastMark{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:#e6f2ea;color:#397052;font-size:18px;font-weight:900}
.adminNewOrderToastCopy{display:flex;min-width:0;flex-direction:column;gap:3px;text-align:left}
.adminNewOrderToastCopy b{font-size:13px;line-height:1.25}
.adminNewOrderToastCopy small{overflow:hidden;color:var(--muted);font-size:10px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}
.adminNewOrderView,.adminNewOrderClose{appearance:none;border:0;cursor:pointer;font:inherit}
.adminNewOrderView{min-height:34px;padding:0 13px;border-radius:11px;background:var(--dark);color:#fff;font-size:10px;font-weight:800}
.adminNewOrderClose{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:transparent;color:#958a84;font-size:18px;line-height:1}
.adminNewOrderClose:hover{background:#f1ebe7;color:#5f534d}
.adminOrder.isNewPaid{border-color:#83aa91!important;box-shadow:0 0 0 3px rgba(93,145,111,.12),0 16px 40px rgba(63,45,37,.1)!important}
@media(max-width:700px){
  .adminDashboardActions{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:8px}
  .adminDashboardActions>*{width:100%;min-width:0}
  .adminLiveStatus,.adminSoundControls,.adminPushToggle{grid-column:1/-1}
  .adminLiveStatus{justify-content:center;padding-right:8px;padding-left:8px}
  .adminLiveCopy b{font-size:9.5px}
  .adminLiveCopy small{font-size:7.8px}
  .adminSoundControls>*{min-width:0;flex:1 1 50%}
  .adminSoundToggle{padding-right:8px;padding-left:8px;font-size:10px}
  .adminSoundProfile{font-size:10px;text-align:center}
  .adminPushToggle{width:100%;padding-right:8px;padding-left:8px}
  .adminToastRegion{
    top:auto;
    right:12px;
    bottom:max(12px,calc(env(safe-area-inset-bottom,0px) + 8px));
    width:calc(100% - 24px);
    max-height:calc(100dvh - max(24px,calc(env(safe-area-inset-bottom,0px) + 16px)));
  }
  .adminNewOrderToast{grid-template-columns:38px minmax(0,1fr) auto 26px;gap:8px;padding:10px;border-radius:16px}
  .adminNewOrderToastMark{width:38px;height:38px;border-radius:12px}
  .adminNewOrderView{padding:0 11px}
}
@media(prefers-reduced-motion:reduce){
  .adminLiveStatus[data-state="loading"] .adminLiveDot{animation:none}
  .adminNewOrderToast{transition:none;transform:none}
}

/* V56.2.62 · exact server-backed sales overview */
.adminSalesCard{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:block;
  min-height:0;
  padding:22px 30px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:24px;
  background:linear-gradient(135deg,#171311 0%,#271d19 55%,#4c342b 150%);
  color:#fffaf7;
  box-shadow:0 18px 46px rgba(47,32,26,.17);
}
.adminSalesCard::before{
  content:'';
  position:absolute;
  z-index:-1;
  top:-150px;
  right:-90px;
  width:360px;
  height:360px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(196,144,119,.24) 0,rgba(196,144,119,0) 68%);
  pointer-events:none;
}
.adminSalesMain{display:flex;min-width:0;flex-direction:column;justify-content:center}
.adminSalesHeader{display:flex;align-items:center;justify-content:space-between;gap:24px}
.adminSalesEyebrow{display:block;color:#caa898;font-size:9px;font-weight:850;letter-spacing:.2em;line-height:1.3}
.adminSalesHeader h3{margin:6px 0 0;color:#fffaf7;font-size:15px;line-height:1.25;letter-spacing:.02em}
.adminSalesPeriods{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;padding:3px;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(255,255,255,.055)}
.adminSalesPeriod{appearance:none;min-width:54px;min-height:31px;padding:0 11px;border:0;border-radius:999px;background:transparent;color:#cbbfba;font-family:inherit;font-size:9.5px;font-weight:760;cursor:pointer;transition:background .16s ease,color .16s ease,box-shadow .16s ease}
.adminSalesPeriod:hover{color:#fff}
.adminSalesPeriod.active{background:#fffaf7;color:#2c211d;box-shadow:0 5px 15px rgba(0,0,0,.15)}
.adminSalesPeriod:focus-visible{outline:2px solid rgba(255,255,255,.72);outline-offset:2px}
.adminSalesBody{display:grid;grid-template-columns:minmax(0,.95fr) minmax(420px,1.05fr);gap:36px;align-items:stretch;margin-top:13px}
.adminSalesAmount{display:block;max-width:100%;margin-top:0;color:#fff;font-size:clamp(42px,4.6vw,56px);font-weight:780;line-height:.98;letter-spacing:-.045em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.adminSalesAmount.isNegative{color:#f3c6bb}
.adminSalesRange{display:block;margin-top:9px;color:#bfb0aa;font-size:9.5px;font-weight:650;line-height:1.4;letter-spacing:.02em}
.adminSalesMetrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;min-height:88px;overflow:hidden;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(255,255,255,.065);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.adminSalesMetrics>div{position:relative;display:flex;min-width:0;flex-direction:column;align-items:center;justify-content:center;padding:13px 14px;text-align:center}
.adminSalesMetrics>div+div::before{content:'';position:absolute;top:27%;bottom:27%;left:0;width:1px;background:rgba(255,255,255,.11)}
.adminSalesMetrics span{color:#bcaea8;font-size:10px;font-weight:680;line-height:1.35;white-space:nowrap}
.adminSalesMetrics b{display:block;max-width:100%;margin-top:7px;color:#fffaf7;font-size:clamp(18px,1.8vw,22px);font-weight:770;line-height:1.15;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.adminSalesMetrics>div:last-child b{color:#edc2b6}

@media(max-width:900px){
  .adminSalesCard{padding:22px 24px}
  .adminSalesBody{grid-template-columns:minmax(0,.85fr) minmax(330px,1.15fr);gap:22px}
  .adminSalesPeriod{min-width:48px;padding:0 8px}
}

@media(max-width:700px){
  .adminSalesCard{display:block;min-height:0;padding:20px 18px;border-radius:22px;text-align:center}
  .adminSalesCard::before{top:-155px;right:-145px;width:330px;height:330px}
  .adminSalesHeader{display:grid;justify-items:center;gap:13px}
  .adminSalesPeriods{width:min(100%,300px)}
  .adminSalesPeriod{min-width:0;min-height:32px}
  .adminSalesBody{grid-template-columns:1fr;gap:18px;margin-top:18px}
  .adminSalesAmount{margin-top:0;font-size:clamp(35px,10.8vw,45px);line-height:1}
  .adminSalesRange{margin-top:10px}
  .adminSalesMetrics{min-height:94px;border-radius:17px}
  .adminSalesMetrics>div{padding:14px 7px}
  .adminSalesMetrics span{font-size:8.5px}
  .adminSalesMetrics b{margin-top:8px;font-size:clamp(12px,3.7vw,17px)}
}

/* V56.2.74 · compact two-level desktop sales hierarchy */

@media(max-width:370px){
  .adminSalesCard{padding:18px 14px}
  .adminSalesMetrics>div{padding-right:4px;padding-left:4px}
  .adminSalesMetrics span{font-size:8px}
  .adminSalesMetrics b{font-size:12px}
}

/* V56.2.63 · align the two-line mobile sales heading */
@media(max-width:700px){
  .adminSalesHeader>div:first-child{text-align:left}
}

/* V56.2.64 · remove the duplicate mobile admin intro after login */
@media(max-width:700px){
  .adminPage.adminSignedIn .adminHero{display:none}
  .adminPage.adminSignedIn .adminWrap{padding-top:14px}
}

/* V56.2.67 · one-line order controls with a compact read-only payment result */
.adminPage .adminOrderControls .adminInlineControl{position:relative;min-width:0}
.adminPage .adminOrderControls .adminInlineControl>label{
  position:absolute;
  z-index:2;
  top:50%;
  left:16px;
  max-width:none;
  margin:0;
  color:#8a7d76;
  font-size:10px;
  font-weight:760;
  line-height:1;
  text-align:left;
  white-space:nowrap;
  pointer-events:none;
  transform:translateY(-50%);
}
.adminPage .adminOrderControls .adminInlineControl>label i{margin-left:5px;color:#b3a7a0;font-style:normal;font-weight:500}
.adminPage .adminOrderControls .adminInlineSelect>select{
  padding-right:30px!important;
  padding-left:30px!important;
  font-weight:400!important;
  text-align:center!important;
  text-align-last:center!important;
}
.adminPage .adminOrderControls .adminInlineNote>input{
  padding-left:82px!important;
  text-align:left!important;
}
.adminPage .adminOrderControls .adminInlineControl>select,
.adminPage .adminOrderControls .adminInlineControl>input{min-height:50px}
.adminPage .adminOrderControls .adminInlineReadOnly{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fffdfb;
  color:var(--ink);
}
.adminPage .adminOrderControls .adminInlineValue{
  display:block;
  max-width:100%;
  padding:0 18px;
  overflow:hidden;
  font-size:14px;
  font-weight:400;
  line-height:1.2;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.adminOrder.closed .adminInlineControl>label{opacity:.7}
.adminOrder.closed .adminInlineValue{opacity:.7}
@media(max-width:700px){
  .adminPage .adminOrderControls .adminInlineControl>label{left:13px;font-size:9.5px}
  .adminPage .adminOrderControls .adminInlineSelect>select{padding-right:28px!important;padding-left:28px!important}
  .adminPage .adminOrderControls .adminInlineNote>input{padding-left:75px!important}
  .adminPage .adminOrderControls .adminInlineControl>select,
  .adminPage .adminOrderControls .adminInlineControl>input{min-height:44px}
  .adminPage .adminOrderControls .adminInlineReadOnly{min-height:44px;border-radius:12px}
  .adminPage .adminOrderControls .adminInlineValue{font-size:16px}
}

/* V56.2.70 · keep the mobile cart title and close button below the device status area */
@media(max-width:640px){
  .homePage #cartDrawer>.drawerHead{
    box-sizing:border-box;
    flex:0 0 auto;
    align-items:center;
    padding-top:calc(13px + env(safe-area-inset-top,0px))!important;
    padding-right:max(14px,env(safe-area-inset-right,0px))!important;
    padding-bottom:13px!important;
    padding-left:max(14px,env(safe-area-inset-left,0px))!important;
  }
  .homePage #cartDrawer>.drawerHead h3{margin:0}
}

/* V56.2.71 · clear comparison pricing without a separate savings slogan */
.cartItemPrice{text-align:right}
.cartItemPrice .cartCurrentPrice{display:block}
.cartItemPrice .remove{display:block;margin-top:8px;margin-left:auto}
.cartOldPrice{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:10.5px;
  font-weight:500;
  line-height:1.1;
  text-decoration-thickness:1px;
}
.checkoutDiscountRow{color:#8b5e50}
.checkoutDiscountRow>span:last-child{font-weight:700}
.checkoutTrustLine,.checkoutPaymentTrust{
  margin-top:10px;
  color:var(--muted);
  font-size:10.5px;
  line-height:1.5;
  text-align:center;
}
.checkoutPaymentTrust{min-height:16px}
@media(max-width:640px){
  .cartOldPrice{font-size:9.5px}
  .checkoutTrustLine,.checkoutPaymentTrust{font-size:9.5px}
}

/* V56.2.75 · responsive official customer service contact */
.loomiServiceRoot{
  --service-ink:#2d211d;
  --service-accent:#9d6d5d;
  --service-pale:#f3e7e1;
  font-family:inherit;
}
.loomiServiceFloat{
  position:fixed;
  z-index:95;
  right:max(22px,env(safe-area-inset-right,0px));
  bottom:max(22px,calc(env(safe-area-inset-bottom,0px) + 16px));
  display:flex;
  box-sizing:border-box;
  align-items:center;
  gap:9px;
  width:126px;
  min-height:52px;
  padding:7px 12px 7px 8px;
  border:1px solid rgba(132,97,83,.25);
  border-radius:18px;
  background:rgba(255,252,249,.95);
  color:var(--service-ink);
  box-shadow:0 13px 34px rgba(59,41,34,.16),0 2px 7px rgba(59,41,34,.07);
  -webkit-backdrop-filter:blur(15px);
  backdrop-filter:blur(15px);
  cursor:pointer;
  font:inherit;
  text-align:left;
  -webkit-tap-highlight-color:transparent;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.loomiServiceFloat:hover{
  border-color:rgba(132,97,83,.42);
  box-shadow:0 16px 38px rgba(59,41,34,.19),0 3px 8px rgba(59,41,34,.08);
  transform:translateY(-2px);
}
.loomiServiceFloat:active{transform:translateY(0) scale(.98)}
.loomiServiceFloat:focus-visible,.loomiServiceClose:focus-visible,.loomiServiceCopy:focus-visible{outline:2px solid #9d6d5d;outline-offset:3px}
.loomiServiceAvatar{
  display:grid;
  flex:0 0 36px;
  width:36px;
  height:36px;
  overflow:hidden;
  place-items:center;
  border:1px solid rgba(157,109,93,.2);
  border-radius:13px;
  background:linear-gradient(145deg,#f5ded8,#e8c2b8);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
.loomiServiceAvatar svg{
  display:block;
  width:29px;
  height:29px;
  fill:none;
  stroke:#87584b;
  stroke-width:2.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.loomiServiceHeadsetDot{fill:#87584b;stroke:none}
.loomiServiceFloatCopy{display:flex;min-width:0;flex-direction:column;gap:2px}
.loomiServiceFloatCopy strong{font-size:12px;font-weight:800;line-height:1.15;white-space:nowrap}
.loomiServiceFloatCopy small{color:#8a7770;font-size:9.5px;font-weight:590;line-height:1.15;letter-spacing:.02em;white-space:nowrap}
.loomiServiceOverlay[hidden]{display:none!important}
.loomiServiceOverlay{
  position:fixed;
  z-index:150;
  inset:0;
  display:grid;
  place-items:center;
  box-sizing:border-box;
  padding:24px;
  overflow:auto;
  background:rgba(28,21,18,.42);
  opacity:0;
  -webkit-backdrop-filter:blur(5px);
  backdrop-filter:blur(5px);
  overscroll-behavior:contain;
  transition:opacity .18s ease;
}
.loomiServiceRoot.isOpen .loomiServiceOverlay{opacity:1}
.loomiServicePanel{
  position:relative;
  box-sizing:border-box;
  width:min(640px,100%);
  max-height:min(760px,calc(100dvh - 48px));
  padding:0;
  overflow:auto;
  border:1px solid rgba(132,97,83,.16);
  border-radius:28px;
  background:#fffdfa;
  box-shadow:0 34px 100px rgba(30,21,18,.28);
  color:var(--service-ink);
  outline:none;
  transform:translateY(12px) scale(.975);
  transition:transform .18s ease;
}
.loomiServiceRoot.isOpen .loomiServicePanel{transform:none}
.loomiServiceGrabber{display:none}
.loomiServiceClose{
  position:absolute;
  z-index:2;
  top:18px;
  right:18px;
  display:grid;
  width:38px;
  height:38px;
  padding:0;
  place-items:center;
  border:1px solid rgba(132,97,83,.18);
  border-radius:13px;
  background:#faf4f0;
  color:#5e4b44;
  cursor:pointer;
  font-family:inherit;
  font-size:24px;
  font-weight:500;
  line-height:1;
}
.loomiServiceHeader{
  position:static;
  top:auto;
  z-index:auto;
  display:block;
  padding:30px 72px 22px 30px;
  border:0;
  border-bottom:1px solid rgba(132,97,83,.13);
  background:linear-gradient(135deg,#fffdfa,#f8eee9);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
.loomiServiceKicker{display:block;color:#9b7162;font-size:9.5px;font-weight:850;line-height:1.2;letter-spacing:.19em}
.loomiServiceHeader h2{margin:7px 0 4px;font-size:27px;font-weight:850;line-height:1.15;letter-spacing:-.025em}
.loomiServiceHeader p{margin:0;color:#88756e;font-size:11px;line-height:1.5}
.loomiServiceBody{display:grid;grid-template-columns:minmax(0,1fr) 246px;gap:24px;align-items:center;padding:26px 30px 30px}
.loomiServiceInfo{min-width:0}
.loomiServiceAvailability{display:flex;align-items:center;gap:11px}
.loomiServiceMiniAvatar{
  display:grid;
  flex:0 0 42px;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:15px;
  background:var(--service-pale);
}
.loomiServiceMiniAvatar svg{width:29px;height:29px;fill:none;stroke:#87584b;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.loomiServiceAvailability>span:last-child{display:flex;min-width:0;flex-direction:column;gap:3px}
.loomiServiceAvailability b{font-size:14px;line-height:1.2}
.loomiServiceAvailability small{color:#76645d;font-size:11px;font-weight:650;line-height:1.3;font-variant-numeric:tabular-nums}
.loomiServiceOffHours{margin:12px 0 0;color:#897a74;font-size:10.5px;line-height:1.6}
.loomiServiceAccount{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:18px;
  padding:13px 13px 13px 15px;
  border:1px solid rgba(132,97,83,.16);
  border-radius:16px;
  background:#fbf7f4;
}
.loomiServiceAccount>span{display:flex;min-width:0;flex-direction:column;gap:3px}
.loomiServiceAccount small{color:#8b7a73;font-size:9px;line-height:1.2}
.loomiServiceAccount strong{overflow:hidden;color:#342621;font-size:14px;font-weight:780;line-height:1.2;letter-spacing:.035em;text-overflow:ellipsis;white-space:nowrap}
.loomiServiceCopy{
  flex:0 0 auto;
  min-height:34px;
  padding:0 12px;
  border:1px solid #342621;
  border-radius:11px;
  background:#342621;
  color:#fff;
  cursor:pointer;
  font-family:inherit;
  font-size:10.5px;
  font-weight:700;
  line-height:1;
  transition:background .16s ease,border-color .16s ease,color .16s ease;
}
.loomiServiceCopy.isCopied{border-color:#789585;background:#eef6f1;color:#426854}
.loomiServiceQr{margin:0;text-align:center}
.loomiServiceQr img{
  display:block;
  box-sizing:border-box;
  width:100%;
  height:auto;
  border:1px solid rgba(132,97,83,.14);
  border-radius:18px;
  background:#fff;
}
.loomiServiceQr figcaption{margin-top:8px;color:#8b7a73;font-size:9.5px;line-height:1.4}
.loomiServiceFloat.isIntroducing{animation:loomiServiceIntroduce 1.15s cubic-bezier(.2,.75,.25,1) .45s both}
@keyframes loomiServiceIntroduce{
  0%{opacity:0;transform:translateY(12px) scale(.94)}
  45%{opacity:1;transform:translateY(-3px) scale(1.02)}
  70%{transform:translateY(0) rotate(-1.2deg)}
  100%{opacity:1;transform:none}
}
body.loomiServiceOpen{overflow:hidden}

/* V56.2.80 · one continuous desktop header gradient behind the QR card */
@media(min-width:641px){
  .loomiServiceHeader{
    position:relative;
    z-index:0;
    border-bottom:0;
    background:transparent;
    overflow:visible;
    isolation:isolate;
  }
  .loomiServiceHeader::before{
    content:'';
    position:absolute;
    z-index:0;
    top:0;
    right:0;
    bottom:-58px;
    left:0;
    border-bottom:1px solid rgba(132,97,83,.11);
    background:linear-gradient(135deg,#fffdfa,#f8eee9);
    pointer-events:none;
  }
  .loomiServiceHeader>*{position:relative;z-index:1}
  .loomiServiceBody{position:relative;z-index:1}
}

@media(max-width:640px){
  body.loomiServiceOpen{
    position:fixed;
    top:var(--loomi-service-scroll-lock,0);
    left:0;
    width:100%;
  }
  .loomiServiceOverlay{align-items:end;padding:0}
  .loomiServicePanel{
    width:min(100%,520px);
    max-height:min(88dvh,760px);
    border-right:0;
    border-bottom:0;
    border-left:0;
    border-radius:27px 27px 0 0;
    transform:translateY(28px);
  }
  .loomiServiceGrabber{display:none}
  .loomiServiceClose{top:16px;right:max(15px,env(safe-area-inset-right,0px));width:36px;height:36px;border-radius:12px;font-size:22px}
  .loomiServiceHeader{padding:21px 62px 17px max(20px,env(safe-area-inset-left,0px))}
  .loomiServiceKicker{font-size:9px;letter-spacing:1.5px}
  .loomiServiceHeader h2{font-size:21px}
  .loomiServiceHeader p{font-size:12px}
  .loomiServiceBody{grid-template-columns:1fr;gap:14px;padding:16px max(20px,env(safe-area-inset-right,0px)) max(18px,calc(env(safe-area-inset-bottom,0px) + 12px)) max(20px,env(safe-area-inset-left,0px))}
  .loomiServiceAvailability{justify-content:flex-start}
  .loomiServiceMiniAvatar{width:32px;height:32px;flex-basis:32px}
  .loomiServiceAvailability b{font-size:13px}
  .loomiServiceAvailability small{font-size:11px}
  .loomiServiceOffHours{margin-top:8px;font-size:11px;line-height:1.6}
  .loomiServiceAccount{margin-top:11px;padding:10px 12px}
  .loomiServiceAccount strong{font-size:15px}
  .loomiServiceCopy{min-height:36px;padding:9px 12px;font-size:11px}
  .loomiServiceQr img{width:min(200px,58vw);margin:0 auto;border-radius:16px}
  .loomiServiceQr figcaption{display:none}
}

@media(max-width:370px){
  .loomiServiceBody{gap:14px;padding-top:16px}
  .loomiServiceQr img{width:min(190px,58vw)}
}

/* V56.2.81 · mobile customer service is available inside order lookup only */
.trackServiceEntry{display:none}
@media(max-width:760px){
  .loomiServiceFloat{display:none}
  .trackPage .trackServiceEntry:not([hidden]){
    display:flex;
    justify-content:center;
    max-width:520px;
    margin:12px auto 0;
  }
  .trackServiceButton{
    display:inline-flex;
    width:100%;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:44px;
    padding:10px 18px;
    border:1px solid rgba(132,97,83,.18);
    border-radius:14px;
    background:#fbf7f4;
    color:#775a4e;
    font:inherit;
    font-size:13px;
    font-weight:650;
    line-height:1.3;
    cursor:pointer;
  }
  .trackServiceButton svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
  .trackServiceButton:active{background:#f3e7e1}
  .trackServiceButton:focus-visible{outline:2px solid #9d6d5d;outline-offset:3px}
}

@media(prefers-reduced-motion:reduce){
  .loomiServiceFloat,.loomiServiceOverlay,.loomiServicePanel{transition:none!important}
  .loomiServiceFloat.isIntroducing{animation:none!important}
}
