/* ============================================================
   ZIYUAN · 梓原 — storefront design system
   White paper + wine + aged gold. Serif display, sans body.
   ============================================================ */
:root{
  --ivory:#ffffff;
  --paper:#ffffff;
  --sand:#f7f2ec;
  --ink:#1b1317;
  --ink-2:#2a2023;
  --muted:#6e6161;
  --line:#e8e0d9;
  --gold:#b3894f;
  --gold-soft:#ddc9a4;
  --red:#6d1d2a;          /* 酒红 */
  --red-deep:#4f121d;
  --deep:#150d11;
  --ok:#3f7d55;
  --radius:2px;
  --sh:0 18px 50px -28px rgba(60,18,28,.24);
  --ease:cubic-bezier(.22,.61,.36,1);
  --hdr:64px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden;scroll-padding-top:118px}
body{overflow-x:clip}
body{
  margin:0;background:var(--ivory);color:var(--ink);
  font:16px/1.65 "Helvetica Neue",Helvetica,Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased;overflow-x:clip;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
.serif{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Songti SC",serif}
.wrap{max-width:1360px;margin:0 auto;padding:0 32px}
.tight{max-width:1120px}
.eyebrow{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold)}
.rule{height:1px;background:var(--line);border:0;margin:0}

/* ---------- announcement ---------- */
.announce{background:var(--ink);color:#f2ece1;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.announce .wrap{display:flex;align-items:center;justify-content:center;height:36px;overflow:hidden;white-space:nowrap}
.announce span{opacity:.92}

/* ---------- header ---------- */
header.site{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.9);
  backdrop-filter:blur(14px) saturate(150%);-webkit-backdrop-filter:blur(14px) saturate(150%);
  border-bottom:1px solid var(--line);transition:transform .35s var(--ease)}
header.site.hide{transform:translateY(-100%)}
.hdr{display:flex;align-items:center;justify-content:space-between;height:var(--hdr);gap:20px}
.brand{display:flex;flex-direction:column;line-height:1;text-align:left;flex:0 0 auto;color:#261b1f}
.brand b{font:600 27px/1 "Iowan Old Style",Georgia,serif;letter-spacing:.2em;display:block}
.brand i{font-style:normal;font-size:9.5px;letter-spacing:.46em;color:var(--muted);display:block;margin-top:7px}
.nav-r{display:flex;align-items:center;gap:15px}
.icon-btn{background:none;border:0;padding:8px;color:#2a2023;display:grid;place-items:center;position:relative;cursor:pointer}
.icon-btn svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.5;fill:none}
.icon-btn:hover{color:#6d1d2a}
.icon-btn:focus-visible{outline:1.5px solid #a2938f;outline-offset:2px}
.badge{position:absolute;top:0;right:-2px;min-width:16px;height:16px;border-radius:9px;background:var(--red);color:#fff;
  font-size:9.5px;line-height:16px;text-align:center;padding:0 4px;transform:scale(0);transition:transform .3s var(--ease)}
.badge.on{transform:scale(1)}
/* 第二行：Pandora 式分类条 + 语言/货币入口 */
.navrow{border-bottom:1px solid var(--line)}
.navrow-in{display:flex;align-items:center;justify-content:space-between;height:46px;gap:20px}
.nav-l{display:flex;gap:28px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;flex:0 0 auto}
.nav-l a{position:relative;padding:6px 0;color:#2a2023}
.nav-l a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--ink);transition:right .4s var(--ease)}
.nav-l a:hover::after{right:0}
.nav-util{display:flex;align-items:center;gap:8px;background:none;border:0;font-size:10.5px;letter-spacing:.14em;color:#6e6161;cursor:pointer;white-space:nowrap;padding:6px 0}
.nav-util i{font-style:normal;color:#b6ab97}
.nav-util:hover{color:#261b1f}
/* 搜索浮层 */
.search-ov{position:absolute;left:0;right:0;top:100%;background:#fbf6ec;border-bottom:1px solid var(--line);
  box-shadow:0 24px 48px rgba(30,24,17,.13);z-index:95}
.search-in{padding:24px 32px 28px;max-width:1360px;margin:0 auto}
.search-bar{display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(42,32,35,.26);padding-bottom:12px}
.search-bar svg{width:18px;height:18px;stroke:#7a6f5f;stroke-width:1.5;fill:none;flex:0 0 auto}
#search-q{flex:1;min-width:0;border:0;background:none;font:400 15px/1.5 var(--sans);letter-spacing:.05em;color:#261b1f;outline:none;appearance:none}
#search-q::placeholder{color:#a99e8b}
#search-q::-webkit-search-cancel-button{display:none}
.search-x{background:none;border:0;color:#6e6161;padding:4px;display:grid;place-items:center;cursor:pointer}
.search-x svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.5;fill:none}
.sr-tip{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:#a2938f;margin:16px 0 4px}
.sr-empty{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#8b7e81;padding:18px 2px}
.sr-item{display:flex;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid rgba(42,32,35,.09)}
.sr-item img{width:48px;height:48px;object-fit:cover;background:#efe7d8;flex:0 0 auto}
.sr-item b{font:500 14px/1.35 var(--sans);letter-spacing:.01em;color:#261b1f}
.sr-item span{margin-left:auto;font-size:11.5px;letter-spacing:.1em;color:#6e6161}
.sr-item:hover b{border-bottom:1px solid #2a2023}

/* ---------- hero ---------- */
.hero{display:grid;grid-template-columns:1.02fr 1fr;min-height:calc(100vh - var(--hdr) - 36px);background:var(--paper);padding:0}
.hero-copy{display:flex;flex-direction:column;justify-content:center;padding:40px 56px 40px 48px;gap:22px}
.hero-copy h1{font:400 clamp(34px,4.1vw,58px)/1.06 "Iowan Old Style",Georgia,serif;letter-spacing:-.02em;margin:0}
.hero-copy h1 em{font-style:italic;color:var(--red)}
.hero-copy p{max-width:430px;color:var(--muted);font-size:15.5px;margin:0}
.hero-media{position:relative;background:
  radial-gradient(90% 80% at 62% 12%,#2b1d23 0%,#1a1116 42%,#100809 72%,#080405 100%);
  overflow:hidden;isolation:isolate}
.hero-media::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;z-index:3;pointer-events:none;
  background:linear-gradient(180deg,rgba(179,137,79,0),rgba(179,137,79,.55) 16%,rgba(179,137,79,.55) 84%,rgba(179,137,79,0))}
.stage-glow{position:absolute;inset:-10% -10% 0;z-index:0;pointer-events:none;
  background:radial-gradient(48% 42% at 50% 46%,rgba(232,205,166,.18),rgba(232,205,166,0) 70%)}
.stage-slides{position:absolute;inset:0;z-index:1;perspective:2200px;perspective-origin:50% 46%;
  transform-style:preserve-3d;touch-action:pan-y}
.slide{position:absolute;left:50%;top:calc(50% - var(--stage-ty,0px));width:var(--stage-w,72%);height:var(--stage-h,88%);display:block;
  backface-visibility:hidden;transform-style:preserve-3d;will-change:transform,opacity;
  transform:translate(-50%,-50%) rotateY(0deg) translateZ(0);cursor:grab;
  border:1px solid rgba(226,189,133,.14);box-shadow:0 30px 60px rgba(0,0,0,.45);
  background:#140b0f;overflow:hidden}
.stage-slides.is-dragging .slide{cursor:grabbing}
.slide::before{content:"";position:absolute;inset:0;z-index:0;
  background-image:var(--bg);background-size:cover;background-position:center;
  filter:blur(26px) brightness(.46) saturate(.9)}
.slide img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;display:block;
  transform:scale(1.02);
  user-select:none;-webkit-user-drag:none}
.slide::after{content:"";position:absolute;inset:0;z-index:2;
  background:
    radial-gradient(78% 68% at 50% 44%,rgba(10,5,8,0) 46%,rgba(10,5,8,.5) 100%),
    linear-gradient(180deg,rgba(10,5,8,.35) 0%,rgba(10,5,8,.04) 32%,rgba(10,5,8,.72) 100%)}
.slide:not(.front) .slide-cap{opacity:0;transition:opacity .4s ease}
.slide-cap{opacity:1;transition:opacity .4s ease}
.slide-cap{position:absolute;left:26px;bottom:26px;z-index:3;display:flex;flex-direction:column;gap:6px;
  color:#f4ead9}
.slide-name{font:400 24px/1.15 "Iowan Old Style",Georgia,serif;letter-spacing:.01em}
.slide-cta{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:#d9bb87;
  border-bottom:1px solid rgba(217,187,135,.5);padding-bottom:4px;align-self:flex-start}
.slide:hover .slide-cta{color:#f0d7ad;border-color:#f0d7ad}
.stage-hint{position:absolute;left:22px;top:14px;z-index:6;display:flex;align-items:center;gap:7px;
  padding:8px 12px;border:1px solid rgba(232,205,166,.28);border-radius:999px;
  background:rgba(8,9,12,.42);backdrop-filter:blur(6px);color:rgba(240,226,203,.86);
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;pointer-events:none;
  transition:opacity .35s ease}
.stage-slides.is-dragging ~ .stage-hint{opacity:.35}
/* 影棚外框：渐隐止于正面面板边沿（--vfade 由 JS 按实际面板宽度写入），
   相邻切面从暗场里浮现，不在屏幕边缘被生切成残片 */
.hero-media::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,rgba(10,5,8,.95) 0,rgba(10,5,8,.48) calc(var(--vfade,11%) * .55),
    rgba(10,5,8,0) var(--vfade),rgba(10,5,8,0) calc(100% - var(--vfade)),
    rgba(10,5,8,.48) calc(100% - var(--vfade) * .55),rgba(10,5,8,.95) 100%)}
@media(max-width:1024px){
  .hero{grid-template-columns:1fr;min-height:auto;padding-top:0}
  .hero-media{order:-1;width:100%;min-height:0;height:clamp(420px,min(74vw,68vh),700px)}
  .hero-media::before{display:none}
  .stage-hint{left:14px;top:12px;font-size:9.5px;padding:8px 11px}
  .stage-bar{gap:10px}
  .stage-dots{padding:8px 10px}
  .stage-arrow{width:40px;height:40px;font-size:16px}
  .hero-copy{padding:52px 44px 56px}
}
@media(max-width:1180px){
  .nav-l{gap:18px;font-size:10.5px;letter-spacing:.12em}
  .navrow-in{gap:14px}
}
@media(max-width:760px){.stage-hint{left:12px;top:12px;font-size:9px;padding:7px 10px}}
.stage-bar{position:absolute;left:50%;bottom:var(--stage-bar-b,10px);transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:14px}
.stage-dots{display:flex;align-items:center;gap:7px;background:rgba(14,15,18,.55);border:1px solid rgba(230,205,160,.22);
  padding:9px 12px;backdrop-filter:blur(7px);cursor:pointer}
.stage-dots i{width:16px;height:2px;background:rgba(240,225,200,.35);transition:.4s}
.stage-dots i.on{background:#e2bd85;width:26px}
.stage-arrows{display:flex;gap:8px}
.stage-arrow{width:34px;height:34px;border:1px solid rgba(230,205,160,.25);background:rgba(14,15,18,.55);
  color:#eadbc2;font-size:17px;line-height:1;cursor:pointer;backdrop-filter:blur(7px);transition:.3s}
.stage-arrow:hover{background:rgba(226,189,133,.9);color:#150e12;border-color:#e2bd85}
.hero-badge{position:absolute;right:24px;top:14px;z-index:5;display:flex;align-items:center;gap:8px;
  background:rgba(18,20,23,.62);border:1px solid rgba(230,205,160,.28);padding:8px 13px;
  font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:#e8d8bd;backdrop-filter:blur(8px)}
.hero-badge .dot{width:5px;height:5px;border-radius:50%;background:#d9ab6a;box-shadow:0 0 0 0 rgba(179,137,79,.7);
  animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(179,137,79,.55)}70%{box-shadow:0 0 0 7px rgba(179,137,79,0)}100%{box-shadow:0 0 0 0 rgba(179,137,79,0)}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 30px;
  border:1px solid var(--red);background:var(--red);color:#fbf7ee;font-size:12px;letter-spacing:.18em;
  text-transform:uppercase;border-radius:var(--radius);transition:.35s var(--ease);position:relative;overflow:hidden}
.btn:hover{background:var(--red-deep);border-color:var(--red-deep);letter-spacing:.22em}
.btn.ghost{background:transparent;color:var(--red);border-color:var(--red)}
.btn.ghost:hover{background:var(--red);color:#fbf7ee}
.btn.sm{height:42px;padding:0 20px;font-size:11px}
.btn.block{width:100%}
.btn:disabled{opacity:.45;cursor:not-allowed}

/* ---------- section heads ---------- */
section{padding:86px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:38px}
.sec-head h2{font:400 clamp(26px,2.6vw,38px)/1.16 "Iowan Old Style",Georgia,serif;margin:0;letter-spacing:-.01em}
.sec-head p{margin:6px 0 0;color:var(--muted);max-width:520px;font-size:14.5px}
.link-more{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;border-bottom:1px solid var(--ink);padding-bottom:3px;white-space:nowrap}

/* ---------- category rail ---------- */
.cats-loop{position:relative;overflow:hidden;padding:2px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 28px,#000 calc(100% - 28px),transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 28px,#000 calc(100% - 28px),transparent 100%)}
.cats-track{display:flex;gap:16px;will-change:transform;cursor:grab;touch-action:pan-y;user-select:none}
.cats-track.dragging{cursor:grabbing}
.cats-loop:focus-visible{outline:2px solid var(--gold);outline-offset:6px}
.cats-loop.dragging .cat img{transition:none}
.cats-loop.dragging .cat .lbl{opacity:.92}
.cats-set{display:flex;gap:16px;flex:0 0 auto}
.cat{position:relative;flex:0 0 clamp(240px,23.5vw,400px);aspect-ratio:3/4;overflow:hidden;background:var(--sand);display:block}
.cat img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease),filter .6s}
.cat:hover img{transform:scale(1.06)}
.cat .veil{position:absolute;inset:0;background:linear-gradient(to top,rgba(12,12,10,.62),rgba(12,12,10,.06) 55%)}
.cat .lbl{position:absolute;left:20px;bottom:18px;color:#fff;z-index:2}
.cat .lbl b{display:block;font:400 20px/1.1 "Iowan Old Style",Georgia,serif;letter-spacing:.02em}
.cat .lbl span{font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.8}

/* ---------- product cards ---------- */
.grid-p{display:grid;grid-template-columns:repeat(4,1fr);gap:26px 20px}
.card{position:relative}
.thumb{display:block;position:relative;aspect-ratio:1/1;overflow:hidden;background:#f7f2ec}
.thumb img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.card:hover .thumb img{transform:scale(1.05)}
.ribbon{position:absolute;top:12px;left:12px;background:rgba(255,255,255,.94);padding:4px 9px;
  font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;z-index:2}
.quick{position:absolute;left:10px;right:10px;bottom:10px;transform:translateY(120%);transition:transform .4s var(--ease);
  background:rgba(79,18,29,.92);color:#fbf7ee;border:0;height:40px;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase}
.card:hover .quick{transform:none}
.quick:hover{background:#4f121d}
/* 触摸设备没有 hover：加购按钮常驻在图内底部（不压商品名），保证每个动作都可点 */
@media(hover:none){
  .quick{transform:none;bottom:0;left:0;right:0;height:38px;background:rgba(79,18,29,.88)}
}
.card .meta{padding:14px 2px 0}
.card .meta h3{font:400 17px/1.3 "Iowan Old Style",Georgia,serif;margin:0}
.card .meta .sub{color:var(--muted);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;margin-top:3px}
.card .price{margin-top:7px;font-size:14px;display:flex;gap:9px;align-items:baseline}
.card .price s{color:#a99e9b;font-size:12.5px}
.swatches{display:flex;gap:5px;margin-top:9px}
.sw{width:11px;height:11px;border-radius:50%;border:1px solid rgba(0,0,0,.18)}

/* ---------- editorial band ---------- */
.band{background:var(--deep);color:#f2ece1;padding:0}
.band-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center}
.band-media{aspect-ratio:1/1;overflow:hidden;background:#1a1214}
.band-media img{width:100%;height:100%;object-fit:cover;opacity:.92}
.band-copy{padding:78px 64px}
.band-copy h2{font:400 clamp(26px,2.7vw,40px)/1.14 "Iowan Old Style",Georgia,serif;margin:14px 0 18px}
.band-copy p{color:#c9c2b4;max-width:440px;font-size:15px}
.stats{display:flex;gap:38px;margin-top:34px;flex-wrap:wrap}
.stats div b{display:block;font:400 26px/1 "Iowan Old Style",Georgia,serif;color:var(--gold-soft)}
.stats div span{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:#a49c8c}

/* ---------- gifting trio ---------- */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.trio .cell{background:var(--paper);border:1px solid var(--line);padding:30px 26px;transition:.4s var(--ease)}
.trio .cell:hover{box-shadow:var(--sh);transform:translateY(-3px)}
.trio .cell b{font:400 19px/1.2 "Iowan Old Style",Georgia,serif;display:block;margin-bottom:8px}
.trio .cell p{margin:0;color:var(--muted);font-size:13.5px}
.trio .cell .ico{width:30px;height:30px;margin-bottom:16px;stroke:var(--gold);fill:none;stroke-width:1.4}

/* ---------- reviews ---------- */
.reviews{background:var(--sand);padding:64px 0}
.rev-head{text-align:center;margin-bottom:34px}
.rev-head b{font:400 22px/1 "Iowan Old Style",Georgia,serif;display:block;margin-bottom:6px}
.rev-head .stars{color:var(--gold);letter-spacing:.3em;font-size:14px}
.rev-rail{display:flex;gap:16px;overflow-x:auto;padding-bottom:8px;scrollbar-width:none}
.rev-rail::-webkit-scrollbar{display:none}
.rev{flex:0 0 320px;background:var(--paper);border:1px solid var(--line);padding:24px}
.rev p{font:400 15px/1.6 "Iowan Old Style",Georgia,serif;margin:0 0 14px;color:#2f2a23}
.rev .who{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* ---------- newsletter ---------- */
.news{background:var(--ink);color:#f7f2e7;padding:70px 0}
.news .wrap{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.news h2{font:400 clamp(24px,2.4vw,34px)/1.15 "Iowan Old Style",Georgia,serif;margin:0 0 10px}
.news p{color:#b8b1a2;font-size:14.5px;margin:0}
.field{display:flex;border-bottom:1px solid rgba(255,255,255,.28);align-items:center}
.field input{flex:1;background:none;border:0;color:#fff;padding:14px 2px;font-size:14px;outline:none}
.field input::placeholder{color:#8b8577}
.field button{background:none;border:0;color:var(--gold-soft);font-size:11px;letter-spacing:.2em;text-transform:uppercase;padding:14px 4px}

/* ---------- footer ---------- */
footer{background:var(--paper);border-top:1px solid var(--line);padding:64px 0 34px}
.f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:34px}
.f-brand b{font:600 22px/1 "Iowan Old Style",Georgia,serif;letter-spacing:.22em}
.f-brand i{font-style:normal;display:block;font-size:11px;letter-spacing:.4em;color:var(--muted);margin:8px 0 16px}
.f-brand p{color:var(--muted);font-size:13px;max-width:280px}
.f-col h4{font-size:11px;letter-spacing:.2em;text-transform:uppercase;margin:0 0 14px;color:#3a342b}
.f-col a{display:block;font-size:13.5px;color:var(--muted);padding:5px 0}
.f-col a:hover{color:var(--ink)}
.pay{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap}
.pay span{border:1px solid var(--line);padding:5px 8px;font-size:9.5px;letter-spacing:.08em;color:#4a4338;background:#fff}
.f-low{margin-top:44px;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;
  gap:18px;font-size:12px;color:#8a7e80;flex-wrap:wrap}

/* ---------- cart drawer ---------- */
.drawer-mask{position:fixed;inset:0;background:rgba(15,11,13,.42);backdrop-filter:blur(3px);opacity:0;pointer-events:none;
  transition:opacity .4s var(--ease);z-index:120}
.drawer-mask.on{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(430px,100%);background:var(--paper);z-index:130;
  transform:translateX(102%);transition:transform .45s var(--ease);display:flex;flex-direction:column;box-shadow:-20px 0 60px -30px rgba(0,0,0,.4)}
.drawer.on{transform:none}
.drawer-h{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--line)}
.drawer-h b{font:400 18px/1 "Iowan Old Style",Georgia,serif;letter-spacing:.02em}
.drawer-b{flex:1;overflow-y:auto;padding:8px 24px}
.ci{display:grid;grid-template-columns:74px 1fr;gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}
.ci img{width:74px;height:92px;object-fit:cover}
.ci b{font:400 15px/1.3 "Iowan Old Style",Georgia,serif;display:block}
.ci .sm{font-size:11.5px;color:var(--muted);margin-top:2px}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);margin-top:8px;height:30px}
.qty button{width:28px;height:28px;background:none;border:0;color:var(--ink);font-size:15px;line-height:1}
.qty span{min-width:26px;text-align:center;font-size:12.5px}
.ci .rm{margin-left:12px;font-size:11px;color:#8a7e80;text-decoration:underline;background:none;border:0}
.drawer-f{padding:20px 24px 24px;border-top:1px solid var(--line);background:var(--paper)}
.ship-bar{height:3px;background:var(--line);margin-bottom:8px;overflow:hidden}
.ship-bar i{display:block;height:100%;background:var(--gold);width:0;transition:width .5s var(--ease)}
.ship-note{font-size:11.5px;color:var(--muted);margin-bottom:14px}
.sum-row{display:flex;justify-content:space-between;font-size:13.5px;padding:4px 0}
.sum-row.total{font-size:16px;border-top:1px solid var(--line);margin-top:10px;padding-top:12px}
.empty{text-align:center;color:var(--muted);padding:60px 0;font-size:14px}

/* ---------- collection ---------- */
.page-head{padding:54px 0 26px}
.page-head h1{font:400 clamp(30px,3.6vw,46px)/1.1 "Iowan Old Style",Georgia,serif;margin:0 0 10px}
.crumbs{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:#8a7d80;margin-bottom:14px}
.filters{display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);padding:14px 0;margin-bottom:30px;flex-wrap:wrap}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:none;padding:7px 14px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;border-radius:999px;color:#4a3f42;transition:.25s}
.chip.on,.chip:hover{background:var(--red);color:#fbf7ee;border-color:var(--red)}
.select{border:1px solid var(--line);background:var(--paper);padding:8px 12px;font-size:12.5px;color:#4a3f42}

/* ---------- product detail ---------- */
.pdp{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;padding-top:36px}
.gallery{display:grid;grid-template-columns:74px 1fr;gap:12px;align-items:start}
.thumbs{display:flex;flex-direction:column;gap:10px}
.thumbs img{width:74px;height:92px;object-fit:cover;border:1px solid transparent;cursor:pointer;opacity:.6;transition:.3s}
.thumbs img.on,.thumbs img:hover{opacity:1;border-color:var(--ink)}
.main-img{aspect-ratio:1/1;background:var(--sand);overflow:hidden;position:relative}
.main-img img{width:100%;height:100%;object-fit:cover}
.pdp-info h1{font:400 clamp(26px,2.7vw,36px)/1.14 "Iowan Old Style",Georgia,serif;margin:6px 0 10px}
.pdp-price{font-size:20px;display:flex;gap:12px;align-items:baseline;margin-bottom:4px}
.pdp-price s{color:#a99e9b;font-size:15px}
.pdp-desc{color:var(--muted);font-size:14.5px;margin:14px 0 22px;max-width:460px}
.opt-row{margin:18px 0}
.opt-row label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#5b5346;display:block;margin-bottom:8px}
.opt-btns{display:flex;gap:8px;flex-wrap:wrap}
.opt{border:1px solid var(--line);background:var(--paper);min-width:54px;height:40px;padding:0 14px;font-size:12.5px;transition:.2s}
.opt.on{border-color:var(--red);background:var(--red);color:#fbf7ee}
.acc{border-top:1px solid var(--line);margin-top:26px}
.acc details{border-bottom:1px solid var(--line);padding:14px 0}
.acc summary{list-style:none;display:flex;justify-content:space-between;align-items:center;cursor:pointer;
  font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.acc summary::-webkit-details-marker{display:none}
.acc details p{color:var(--muted);font-size:13.5px;margin:12px 0 0}
.pdp-trust{display:flex;gap:20px;margin-top:22px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);letter-spacing:.08em}
.sticky-buy{position:fixed;left:0;right:0;bottom:0;background:rgba(255,255,255,.96);border-top:1px solid var(--line);
  padding:12px 20px;display:none;align-items:center;gap:14px;z-index:70;backdrop-filter:blur(10px)}
.sticky-buy .t{flex:1;min-width:0}
.sticky-buy b{font:400 15px/1.2 "Iowan Old Style",Georgia,serif;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sticky-buy .p{font:400 16px/1 "Iowan Old Style",Georgia,serif;margin-right:14px;white-space:nowrap}
.sticky-buy span{font-size:11px;color:var(--muted)}

/* ---------- forms / checkout ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.inp{position:relative;border:1px solid var(--line);background:var(--paper);height:60px;display:flex;align-items:center;padding:0 16px;
  transition:border-color .25s,box-shadow .25s}
.inp:focus-within{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.inp.full{grid-column:1/-1}
.inp label{position:absolute;left:16px;top:9px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#8a7d80;pointer-events:none}
.inp input,.inp select{border:0;background:none;outline:none;width:100%;font-size:15px;color:var(--ink);padding-top:15px;font-family:inherit}
.inp select{appearance:none;cursor:pointer}
.inp .chev{position:absolute;right:14px;top:50%;transform:translateY(-50%);pointer-events:none;color:#8a7d80}
.checkout{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;padding:40px 0 90px;align-items:start}
.steps{display:flex;gap:12px;align-items:center;margin-bottom:26px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#a99e9b}
.steps .on{color:var(--ink)}
.steps i{width:26px;height:1px;background:var(--line)}
.block-h{font:400 20px/1.2 "Iowan Old Style",Georgia,serif;margin:0 0 16px}
.pay-opt{border:1px solid var(--line);background:var(--paper);padding:16px;display:flex;gap:12px;align-items:flex-start;cursor:pointer;margin-bottom:10px;transition:.25s}
.pay-opt.on{border-color:var(--ink);background:#fff}
.pay-opt .dot{width:16px;height:16px;border-radius:50%;border:1px solid var(--line);margin-top:2px;position:relative;flex:0 0 auto}
.pay-opt.on .dot{border-color:var(--ink)}
.pay-opt.on .dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--ink)}
.pay-opt b{font-size:13.5px;display:block}
.pay-opt span{font-size:11.5px;color:var(--muted)}
.summary{background:var(--paper);border:1px solid var(--line);padding:24px;position:sticky;top:calc(var(--hdr) + 16px)}
.summary .line{display:grid;grid-template-columns:56px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.summary .line img{width:56px;height:70px;object-fit:cover}
.summary .line b{font:400 14px/1.3 "Iowan Old Style",Georgia,serif;display:block;margin-bottom:3px}
.summary .line span{font-size:11px;color:var(--muted);display:block}

/* ---------- account ---------- */
.auth-card{max-width:470px;margin:70px auto 100px;background:var(--paper);border:1px solid var(--line);padding:40px 36px}
.tabs{display:flex;gap:26px;border-bottom:1px solid var(--line);margin-bottom:26px}
.tab{background:none;border:0;padding:10px 0;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#9a9182;position:relative}
.tab.on{color:var(--ink)}
.tab.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--ink)}
.acct-grid{display:grid;grid-template-columns:220px 1fr;gap:44px;padding:44px 0 90px}
.acct-nav a{display:block;padding:11px 0;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:#6e6161;border-bottom:1px solid var(--line)}
.acct-nav a.on{color:var(--ink);font-weight:600}
.addr{border:1px solid var(--line);background:var(--paper);padding:20px;position:relative}
.addr b{font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.addr p{font-size:13.5px;color:var(--muted);margin:8px 0 0;line-height:1.6}
.addr .acts{margin-top:12px;display:flex;gap:14px}
.addr .acts button{background:none;border:0;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#6e6161;text-decoration:underline}

/* ---------- whatsapp / chat ---------- */
.wa-fab{position:fixed;right:22px;bottom:22px;z-index:110;width:56px;height:56px;border-radius:50%;background:#6d1d2a;
  display:grid;place-items:center;box-shadow:0 12px 30px -10px rgba(31,122,77,.7);border:0;transition:.3s}
.wa-fab:hover{transform:translateY(-2px) scale(1.03)}
.wa-fab svg{width:27px;height:27px;fill:#fff}
.wa-fab .ping{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(109,29,42,.55);animation:ping 2.6s infinite}
@keyframes ping{0%{transform:scale(1);opacity:.7}70%{transform:scale(1.5);opacity:0}100%{opacity:0}}
.chat-panel{position:fixed;right:22px;bottom:90px;z-index:115;width:min(370px,calc(100vw - 32px));background:var(--paper);
  border:1px solid var(--line);box-shadow:0 30px 70px -30px rgba(0,0,0,.5);display:flex;flex-direction:column;
  max-height:min(560px,calc(100vh - 130px));transform:translateY(14px) scale(.98);opacity:0;pointer-events:none;transition:.35s var(--ease)}
.chat-panel.on{transform:none;opacity:1;pointer-events:auto}
.chat-h{background:#0f3d2a;color:#eaf3ec;padding:14px 16px;display:flex;align-items:center;gap:10px}
.chat-h .dot-on{width:8px;height:8px;border-radius:50%;background:#7fe0a6;box-shadow:0 0 0 3px rgba(127,224,166,.2)}
.chat-h b{font-size:13.5px;flex:1}
.chat-h small{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.chat-lang{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.1);padding:4px 8px;border-radius:2px}
.chat-lang select{background:none;border:0;color:#eaf3ec;font-size:11px;outline:none}
.chat-b{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;background:#faf8f3}
.msg{max-width:82%;padding:10px 13px;font-size:13px;line-height:1.5;border-radius:3px}
.msg.them{background:#fff;border:1px solid var(--line);align-self:flex-start}
.msg.me{background:var(--ink);color:#f7f3ea;align-self:flex-end}
.msg small{display:block;font-size:10px;opacity:.55;margin-top:4px}
.chat-f{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line);background:#fff}
.chat-f input{flex:1;border:1px solid var(--line);height:40px;padding:0 10px;font-size:13px;outline:none}
.chat-f button{width:44px;height:40px;border:0;background:var(--ink);color:#fff;display:grid;place-items:center}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);background:var(--ink);color:#f7f3ea;
  padding:12px 20px;font-size:12.5px;letter-spacing:.06em;z-index:200;opacity:0;transition:.35s var(--ease);pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media(max-width:1080px){
  .grid-p{grid-template-columns:repeat(3,1fr)}
  .pdp{grid-template-columns:1fr;gap:30px}
  .checkout{grid-template-columns:1fr;gap:26px}
  .acct-grid{grid-template-columns:1fr;gap:20px}
  .news .wrap,.f-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  :root{--hdr:56px}
  .wrap{padding:0 18px}
  .nav-l{display:none}
  .hdr{grid-template-columns:auto 1fr auto}
  .hdr .select{font-size:10px;letter-spacing:.08em;padding:0;appearance:none;background:none}
  .brand{text-align:left}
  .brand b{font-size:19px;letter-spacing:.18em}
  .brand i{font-size:9px;letter-spacing:.32em}
  section{padding:54px 0}
  .announce .wrap{justify-content:flex-start;font-size:9.5px;letter-spacing:.05em;overflow:hidden}
  .announce .wrap span{display:inline-block;white-space:nowrap;padding-left:14px;animation:marq 17s linear infinite}
  @keyframes marq{from{transform:translateX(0)}to{transform:translateX(-58%)}}
  .hero{padding:0}
  .hero{grid-template-columns:1fr;min-height:auto}
  .hero-media{order:-1;height:clamp(360px,min(54vh,118vw),470px);min-height:0;width:100%}
  .slide-cap{left:16px;bottom:16px;gap:5px}
  .slide-name{font-size:18px}
  .slide-cta{font-size:9.5px;letter-spacing:.16em}
  .stage-bar{right:12px;bottom:12px;gap:8px}
  .stage-dots i{width:12px}
  .stage-dots i.on{width:20px}
  .stage-arrow{width:40px;height:40px;font-size:16px}
  .cat{flex:0 0 68vw}
  .hero-badge{right:14px;top:14px;font-size:8.5px;letter-spacing:.14em;padding:6px 10px}
  .hero-badge .badge-more{display:none}
  .hero-media .tagline{left:14px;bottom:14px;font-size:9.5px;letter-spacing:.16em;padding:8px 11px}
  .hero-copy{padding:30px 20px 40px;gap:16px}
  .hero-copy h1{font-size:clamp(30px,8.4vw,36px)}
  .hero-copy p{font-size:15px}
  .grid-p{grid-template-columns:repeat(2,1fr);gap:20px 12px}
  .band-grid{grid-template-columns:1fr}
  .band-copy{padding:44px 22px}
  .trio{grid-template-columns:1fr}
  .sec-head{flex-direction:column;align-items:flex-start;gap:10px}
  .sticky-buy{display:flex;align-items:center;gap:10px;padding:10px 66px 10px 14px;background:#ffffff}
  .sticky-buy .t{min-width:0}
  .sticky-buy .t span{display:none}
  .sticky-buy .p{font-size:14px;margin-right:0}
  .sticky-buy .btn.sm{height:44px;padding:0 14px;font-size:10.5px;letter-spacing:.1em;white-space:nowrap;flex:0 0 auto}
  .chat-panel{right:12px;bottom:78px}
  .wa-fab{right:14px;bottom:14px;width:50px;height:50px}
  .form-grid{grid-template-columns:1fr}
  .auth-card{margin:26px 14px 40px;padding:28px 20px}
  footer{padding:44px 0 26px}
  .checkout{padding-bottom:100px}
}
@media(prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  .hero-media img{transform:none;transition:none}
  .hero-badge .dot{animation:none}
}

/* ---------- studio notes (vertical danmaku, bottom-left) ---------- */
.dmk{position:fixed;left:30px;bottom:28px;width:300px;height:202px;z-index:125;
  background:none;border:0;box-shadow:none;overflow:hidden;pointer-events:none;
  opacity:1;transition:opacity .45s ease,transform .45s ease}
.dmk.off{opacity:0;transform:translateY(10px);pointer-events:none}
.dmk::before{display:none}
.dmk-cols{position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(255,255,255,.90) 0%,rgba(255,255,255,.86) 56%,rgba(255,255,255,.34) 88%,rgba(255,255,255,0) 100%);
  -webkit-backdrop-filter:blur(4px) saturate(115%);backdrop-filter:blur(4px) saturate(115%);
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 10%,#000 88%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0,#000 10%,#000 88%,transparent 100%)}
.dmk-item{position:absolute;top:0;left:0;white-space:nowrap;font:400 9.6px/1.4 "Helvetica Neue",Arial,sans-serif;
  letter-spacing:.11em;text-transform:uppercase;color:#1b1317;will-change:transform,color;
  text-shadow:0 0 3px rgba(255,255,255,.96),0 0 9px rgba(255,255,255,.85),0 1px 1px rgba(255,255,255,.95);
  transition:opacity .5s ease}
.dmk-item em{display:block;font-style:normal;font-weight:500;letter-spacing:.15em;white-space:normal;line-height:1.3}
.dmk-item span{display:block;font-size:8.6px;letter-spacing:.08em;text-transform:none;opacity:.9;margin-top:2px;line-height:1.35;white-space:normal}
.dmk-x{position:absolute;right:8px;top:8px;width:24px;height:24px;border-radius:50%;border:1px solid rgba(27,19,23,.22);
  background:rgba(255,253,248,.82);color:#1b1317;font:400 13px/1 Arial,sans-serif;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;pointer-events:none;
  opacity:0;transform:scale(.86);transition:opacity .4s ease,transform .4s ease,background .2s}
.dmk.ready .dmk-x{opacity:1;transform:scale(1);pointer-events:auto}
.dmk-x:hover{background:#6d1d2a;color:#ffffff;border-color:#6d1d2a}
/* 平板：两列，尺寸收一档，不压住正文右缘 */
@media(max-width:1100px){
  .dmk{left:20px;bottom:22px;width:268px;height:162px}
  .dmk-item{font-size:10px}
}
/* 手机：收成两块的小玻璃条，常驻左下，避开右下客服浮标与 PDP 购买条 */
@media(max-width:760px){
  .dmk{left:12px;bottom:66px;width:206px;height:56px}
  .dmk-cols{
    background:linear-gradient(158deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.88) 100%);
    -webkit-backdrop-filter:blur(10px) saturate(120%);backdrop-filter:blur(10px) saturate(120%);
    border:1px solid rgba(179,137,79,.30);border-radius:10px;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 86%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 86%,transparent 100%)}
  .dmk-item{font-size:8.8px;letter-spacing:.1em}
  .dmk-item span{font-size:7.6px}
  .dmk-x{width:20px;height:20px;right:6px;top:6px;font-size:11px}
}
/* PDP 底部有常驻购买条时，弹幕整体上抬，不压按钮 */
.dmk.with-buy{bottom:calc(96px + env(safe-area-inset-bottom))}
@media(min-width:761px){.dmk.with-buy{bottom:28px}}
@media(prefers-reduced-motion:reduce){
  .dmk-cols{opacity:.85}
}
/* 旧版把弹幕塞进 hero / 页尾的槽位，现在统一为 fixed 浮层，槽位隐藏避免留白 */
.hero-notes{display:none}
@media(min-width:1081px){
  .hero-copy{justify-content:flex-start;padding-top:76px}
}
body.menu-open .dmk,body.cart-open .dmk{opacity:0;pointer-events:none}

/* ---------- intro shell (homepage only) ---------- */
body.intro-lock{overflow:hidden}
.intro{position:fixed;inset:0;z-index:3000;display:grid;place-items:center;cursor:pointer;
  transition:opacity .62s ease,transform .62s ease}
.intro.gone{opacity:0;transform:scale(1.03);pointer-events:none}

.intro-burst{position:fixed;inset:0;z-index:3002;pointer-events:none;overflow:hidden;perspective:1000px}
.intro.bursting{transition:opacity .34s ease,transform .34s ease}
/* ---------- 大爆炸：深空 / 奇点 / 白光 / 冲击环 / 光刃 / 粒子层 ---------- */
.intro-burst .space{position:absolute;inset:0;z-index:1;opacity:0;
  background:
    radial-gradient(34% 28% at 50% 48%,rgba(158,104,80,.26),rgba(158,104,80,0) 70%),
    radial-gradient(120% 96% at 50% 46%,#1b1320 0%,#0b070e 44%,#030207 100%);
  animation:spaceIn .54s ease-out .02s both}
@keyframes spaceIn{from{opacity:0}to{opacity:1}}
.intro-burst .space::after{content:"";position:absolute;inset:-10%;
  background-image:
    radial-gradient(1.5px 1.5px at 12% 22%,rgba(255,248,236,.9) 50%,rgba(255,248,236,0) 100%),
    radial-gradient(1.1px 1.1px at 27% 68%,rgba(255,248,236,.7) 50%,rgba(255,248,236,0) 100%),
    radial-gradient(1.3px 1.3px at 46% 16%,rgba(206,222,238,.8) 50%,rgba(206,222,238,0) 100%),
    radial-gradient(1px 1px at 63% 78%,rgba(255,248,236,.6) 50%,rgba(255,248,236,0) 100%),
    radial-gradient(1.6px 1.6px at 78% 34%,rgba(255,248,236,.85) 50%,rgba(255,248,236,0) 100%),
    radial-gradient(1px 1px at 88% 66%,rgba(206,222,238,.55) 50%,rgba(206,222,238,0) 100%),
    radial-gradient(1.2px 1.2px at 34% 44%,rgba(255,248,236,.62) 50%,rgba(255,248,236,0) 100%),
    radial-gradient(1px 1px at 58% 52%,rgba(255,248,236,.5) 50%,rgba(255,248,236,0) 100%);
  animation:starDrift 26s linear infinite}
@keyframes starDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-9px,-15px,0)}}
.intro-burst .singularity{position:absolute;left:50%;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;
  border-radius:50%;z-index:3;pointer-events:none;
  background:radial-gradient(closest-side,#fff 0%,#ffeccb 42%,#e0bd85 64%,rgba(224,189,133,0) 82%);
  box-shadow:0 0 18px rgba(255,240,214,.92),0 0 62px rgba(224,189,133,.52),0 0 130px rgba(224,189,133,.2);
  animation:sing .74s cubic-bezier(.4,.05,.55,1) both}
@keyframes sing{
  0%{opacity:0;transform:scale(.35)}
  38%{opacity:1;transform:scale(1)}
  72%{opacity:1;transform:scale(1.38)}
  100%{opacity:1;transform:scale(.5)}
}
.intro-burst .flashbang{position:absolute;inset:0;z-index:6;opacity:0;pointer-events:none;
  background:radial-gradient(40% 36% at 50% 50%,#fff 0%,rgba(255,250,238,.94) 36%,rgba(255,232,188,.44) 62%,rgba(255,206,138,0) 86%)}
.intro-burst .bang-ray{position:absolute;left:50%;top:50%;width:min(168vmax,1900px);aspect-ratio:1;z-index:2;opacity:0;
  transform:translate(-50%,-50%) scale(.24);pointer-events:none;mix-blend-mode:screen;
  background:repeating-conic-gradient(from 0deg,rgba(255,236,198,.5) 0 .68deg,rgba(255,236,198,0) .68deg 8.6deg);
  -webkit-mask-image:radial-gradient(closest-side,rgba(0,0,0,.92) 0 20%,rgba(0,0,0,.5) 44%,transparent 74%);
  mask-image:radial-gradient(closest-side,rgba(0,0,0,.92) 0 20%,rgba(0,0,0,.5) 44%,transparent 74%)}
.intro-burst .shock{position:absolute;left:50%;top:50%;width:min(92vmax,1180px);aspect-ratio:1;z-index:2;
  opacity:0;border-radius:50%;pointer-events:none;
  border:0;
  background:radial-gradient(closest-side,transparent 95%,rgba(255,238,204,.14) 97.2%,rgba(255,238,204,.52) 98.9%,rgba(255,238,204,0) 100%)}
.intro-burst .bang{position:absolute;inset:0;z-index:4;pointer-events:none;mix-blend-mode:screen}
.intro-burst .seed-jewel{position:absolute;left:50%;top:50%;z-index:5;width:19px;height:19px;border-radius:50%;opacity:0;pointer-events:none;
  background:radial-gradient(circle at 40% 32%,#fff,#eaddc0 36%,#bfdcea 64%,rgba(130,175,205,0) 84%);
  box-shadow:0 0 20px rgba(214,238,250,.8),0 0 5px rgba(255,255,255,.95);will-change:transform,opacity}
/* homepage comes alive right after the burst */
body.burst-in .hero{animation:zyHome .84s cubic-bezier(.2,.8,.2,1) both}
body.fly .hero{animation:none}
@keyframes zyHome{from{opacity:.62;transform:scale(1.028)}to{opacity:1;transform:none}}

@media (max-width:520px){
  .intro-slogan{letter-spacing:.12em;font-size:10.5px;line-height:1.9;top:52%}
  .intro-tip{font-size:8.5px;letter-spacing:.2em}
}


/* ---- 手机端折叠菜单（≤760px）：汉堡 + 抽屉，只留账户/购物袋在页头 ---- */
/* 汉堡全端可见（Pandora 式） */
.menu-mask{position:fixed;inset:0;background:rgba(21,13,17,.44);opacity:0;pointer-events:none;transition:opacity .34s ease;z-index:3200}
.menu-mask.on{opacity:1;pointer-events:auto}
.menu{position:fixed;top:0;right:0;bottom:0;width:min(90vw,392px);z-index:3300;display:flex;flex-direction:column;
  background:#ffffff;transform:translateX(103%);transition:transform .44s cubic-bezier(.22,.8,.24,1);
  box-shadow:-18px 0 60px rgba(21,13,17,.2);overflow-y:auto;overflow-x:hidden;padding-bottom:env(safe-area-inset-bottom)}
.menu.on{transform:none}
.menu-h{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 13px 20px;border-bottom:1px solid rgba(42,32,35,.14)}
.menu-h b{font:600 15px/1 "Iowan Old Style",Georgia,serif;letter-spacing:.22em;display:flex;flex-direction:column;gap:5px}
.menu-h b i{font-style:normal;font-size:9px;letter-spacing:.42em;color:#8b7e81}
.menu-nav{padding:6px 0 2px}
.menu-nav a{display:flex;align-items:center;justify-content:space-between;padding:15px 20px 15px 22px;
  font:600 12px/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#1f1b16;
  border-bottom:1px solid rgba(42,32,35,.1)}
.menu-nav a i{font-style:normal;font-size:13px;color:#a2938f;transition:transform .22s ease}
.menu-nav a:active i{transform:translateX(3px)}
.menu-sub{padding:10px 22px 6px;display:flex;flex-direction:column;gap:11px}
.menu-sub a{font-size:11px;letter-spacing:.08em;color:#6f6558}
.menu-set{margin-top:auto;padding:16px 20px 6px;border-top:1px solid rgba(42,32,35,.14);display:grid;grid-template-columns:1fr 1fr;gap:12px}
.menu-set label{display:flex;flex-direction:column;gap:6px}
.menu-set span{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#8b7e81}
.menu-set .select{padding:10px 26px 10px 11px;border:1px solid rgba(42,32,35,.16);background-color:#ffffff;
  font-size:11px;letter-spacing:.1em;color:#2a2023;appearance:none;-webkit-appearance:none;border-radius:0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='9' height='6' viewBox='0 0 9 6'><path d='M1 1l3.5 3.5L8 1' fill='none' stroke='%236e6161' stroke-width='1.2'/></svg>");
  background-repeat:no-repeat;background-position:right 10px center}
.menu-wa{margin:14px 20px 20px;display:flex;align-items:center;justify-content:center;gap:10px;background:#ffffff;color:var(--ink);
  border:1px solid var(--line);padding:12px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;transition:.3s var(--ease)}
.menu-wa:hover{border-color:var(--red);color:var(--red)}
.menu-wa svg{width:17px;height:17px;stroke:#128c5f;fill:none;stroke-width:1.5}
@media(max-width:760px){
  .hdr{gap:6px}
  .brand b{font-size:19px;letter-spacing:.16em}
  .brand i{font-size:8px;letter-spacing:.34em;margin-top:4px}
  .nav-r{gap:2px}
  .icon-btn{padding:7px 6px}
  .icon-btn svg{width:18px;height:18px}
  .navrow{display:none}
  .search-in{padding:16px 16px 20px}
  .sr-item img{width:42px;height:42px}
  .sr-item b{font-size:13px}
}
body.menu-open{overflow:hidden}
body.menu-open .wa-fab,body.menu-open .chat-panel{opacity:0;pointer-events:none;transition:opacity .22s ease}
.wa-fab,.chat-panel{transition:opacity .22s ease,transform .3s ease}

.intro-burst .chipfly.herofly{border:0;border-radius:7px;background:none;
  box-shadow:0 26px 60px rgba(0,0,0,.42),0 0 0 1px rgba(255,248,232,.16);
  filter:saturate(1.04) contrast(1.02);will-change:transform,opacity;transform-origin:50% 50%;
  backface-visibility:hidden}
.stage-sweep-clip{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:3;contain:paint}
.stage-sweep{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(104deg,rgba(255,247,228,0) 30%,rgba(255,247,228,.40) 45%,rgba(255,251,240,.60) 52%,rgba(255,247,228,.34) 59%,rgba(255,247,228,0) 73%);
  will-change:transform,opacity}
.stage-lit{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;
  background:radial-gradient(58% 56% at 50% 48%,rgba(255,246,226,.42),rgba(255,240,214,.10) 54%,rgba(255,238,208,0) 78%)}
.stage-flash{position:absolute;inset:0;z-index:6;pointer-events:none;opacity:0;
  background:radial-gradient(46% 44% at 50% 52%,rgba(255,246,226,.55),rgba(255,240,214,.12) 46%,rgba(255,238,208,0) 72%)}

/* ---------- 40 图改造：卡片边界 + 触摸端加购 ---------- */
/* 白底商品图落在纸白页面上，需要一条极细的内描边才立得住 */
.thumb{box-shadow:inset 0 0 0 1px rgba(60,18,28,.07)}

/* 触摸端没有 hover：加购不再横压图面，收成右下角一枚小方钮（44x40 可点） */
@media(hover:none){
  .quick{left:auto;right:8px;bottom:8px;width:38px;height:38px;padding:0;
    display:grid;place-items:center;font-size:0;letter-spacing:0;border-radius:3px;
    background:rgba(79,18,29,.88);box-shadow:0 4px 14px rgba(40,10,16,.24)}
  .quick::after{content:"+";font-size:16px;line-height:1;color:#fbf7ee}
  .quick:active{background:#4f121d}
}

/* 手机：影棚块抬高一点，3:4 的影棚图不必被压成横条 */
@media(max-width:760px){
  .hero-media{height:clamp(420px,min(64vh,132vw),580px)}
  .stage-dots{padding:7px 9px}
}


/* ---------- 手机端第二轮：影棚条对齐 / 加购钮挪右上 / 弹幕收成实心小卡 ---------- */
@media(max-width:760px){
  /* 影棚控制条：左点右箭头各占一边，不再从正中线往右挤 */
  .stage-bar{left:12px;right:12px;bottom:12px;transform:none;justify-content:space-between}
  .hero-media{height:clamp(400px,min(58vh,122vw),540px)}
}
@media(hover:none){
  .quick{top:8px;right:8px;bottom:auto}
}
@media(max-width:760px){
  /* 弹幕：实心白卡（不再半透明糊字），并做呼吸，读正文时自动让位 */
  .dmk{left:12px;bottom:72px;width:186px;height:40px}
  .dmk-cols{background:rgba(255,255,255,.97);
    border:1px solid rgba(179,137,79,.34);border-radius:9px;
    box-shadow:0 8px 20px rgba(40,18,22,.10);
    -webkit-backdrop-filter:blur(10px) saturate(120%);backdrop-filter:blur(10px) saturate(120%);
    -webkit-mask-image:none;mask-image:none}
  .dmk-item{font-size:8.4px;letter-spacing:.09em}
  .dmk-item span{font-size:7.4px;margin-top:1px}
  .dmk{animation:dmkBreath 9s ease-in-out infinite}
  .dmk.off{animation:none;opacity:0}
  .dmk.with-buy{bottom:calc(104px + env(safe-area-inset-bottom))}
}
@keyframes dmkBreath{0%,26%{opacity:1}33%,80%{opacity:0}87%,100%{opacity:1}}
@media(prefers-reduced-motion:reduce){
  .dmk{animation:none !important}
}


/* ---------- 手机端第三轮：PDP 画廊改为上图下缩略 / 类目卡压暗 / PDP 收弹幕 ---------- */
@media(max-width:760px){
  .gallery{grid-template-columns:1fr;gap:10px}
  .thumbs{order:2;flex-direction:row;gap:8px;overflow-x:auto;padding:2px 0 4px;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .thumbs::-webkit-scrollbar{display:none}
  .thumbs img{flex:0 0 auto;width:72px;height:72px}
  .thumbs img.on{border-color:var(--red)}
  .main-img{order:1}
  .main-img img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;display:block;background:#fff}
  /* PDP 上已有常驻购买条 + 客服浮标，弹幕不再叠加在尺码/按钮上 */
  body:has(.sticky-buy) .dmk{display:none}
}
/* 类目卡：浅底图上的白字要压得住 */
.cat .veil{background:linear-gradient(to top,rgba(12,12,10,.82),rgba(12,12,10,.10) 54%)}
.cat .lbl b,.cat .lbl span{text-shadow:0 1px 10px rgba(0,0,0,.55)}


/* 类目轨两侧溶边：滚动中被切一半的卡片淡出，不再出现半截字 */
.cats-loop{
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 96px,#000 calc(100% - 96px),transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 96px,#000 calc(100% - 96px),transparent 100%)}


/* PDP 手机：客服浮标抬到购买条上方，别压住 ADD TO BAG */
@media(max-width:760px){
  body:has(.sticky-buy) .wa-fab{display:none}
}


/* ---------- 品牌字标：几何无衬线 + 冠冕（图二样式），去掉中文副标 ---------- */
.brand .wm,.f-brand .wm,.menu-h .wm{
  font-family:"Poppins","Montserrat","Futura","Century Gothic","Avenir Next","Segoe UI",system-ui,sans-serif;
  font-weight:700;font-style:normal;text-transform:uppercase;line-height:1.02;
  letter-spacing:.045em;-webkit-font-smoothing:antialiased}
.brand .wm{font-size:clamp(18px,1.8vw,25px);display:inline-block}
.f-brand .wm{font-size:19px;letter-spacing:.09em;display:inline-block}
.menu-h .wm{font-size:15px;letter-spacing:.08em;display:inline-block}
.intro-word{font-family:"Poppins","Montserrat","Futura","Century Gothic","Segoe UI",system-ui,sans-serif;
  font-weight:800;letter-spacing:.16em}
.uc{position:relative;display:inline-block}
.cw{position:absolute;left:50%;top:-.30em;transform:translateX(-50%);width:.82em;height:.38em;
  color:inherit;opacity:1;pointer-events:none}

/* ---------- 详情页：鼠标悬停 / 触摸按住，按落点放大查看 ---------- */
.main-img{position:relative;overflow:hidden;cursor:zoom-in;touch-action:pan-y}
.main-img img{transform-origin:50% 50%;transition:transform .42s cubic-bezier(.22,.61,.36,1);will-change:transform}
.main-img.zoomed img{transform:scale(2.2);transition:transform .12s linear}
.zoom-hint{position:absolute;right:10px;bottom:10px;padding:6px 9px;border-radius:2px;
  background:rgba(255,255,255,.9);border:1px solid rgba(60,18,28,.14);color:#4f121d;
  font:600 9px/1 "Poppins","Segoe UI",system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;
  pointer-events:none;transition:opacity .28s ease}
.main-img:hover .zoom-hint,.main-img.zoomed .zoom-hint{opacity:0}
@media(hover:none){.main-img{cursor:default}}
@media(prefers-reduced-motion:reduce){.main-img img{transition:none}.main-img.zoomed img{transform:scale(2.2)}}


/* ---------- 可读性与触控命中（本轮体检修正） ---------- */
:root{--gold-ink:#8a6238;--muted-strong:#6c5f62}
.eyebrow{color:var(--gold-ink)}
.rev-head .stars{color:var(--gold-ink)}
.crumbs{color:var(--muted-strong)}
.f-brand p,.pdp-trust,.card .meta .sub,.opt-row label,.f-bot,.f-links a{color:var(--muted-strong)}
.card s,.pdp-info s,.price s{color:var(--muted-strong);opacity:.9}
.hdr .select{font-size:11px;letter-spacing:.06em;color:#4a3f42}
.intro-kicker{color:#6c5f62;letter-spacing:.3em}
.intro-line{color:#6c5f62}
@media(max-width:900px){
  .icon-btn{padding:10px;min-width:44px;min-height:44px}
  .announce{font-size:10.5px}
  .announce .wrap span{padding-left:12px}
  .zoom-hint{font-size:9.5px;letter-spacing:.12em;padding:7px 10px}
}

/* ---------- 第二轮：命中剩余低对比与小触控点 ---------- */
.card .price s,.pdp-price s{color:#6c5f62;font-size:13px}
.pdp-price s{font-size:15px}
.f-bot span,.f-bot span span{color:#6c5f62}
.inp label{color:#6c5f62;font-size:10.5px}
.menu-set label span,.menu-set .select{color:#4a3f42;font-size:10.5px}
@media(max-width:760px){
  .quick{width:42px;height:42px}
  .f-links a{display:inline-block;padding:6px 0;font-size:11.5px}
}

/* ---------- 第三轮：首屏转台字幕只在正中那款出现，避免左侧残影被裁成半截字 ---------- */
.slide:not(.front) .slide-cap{visibility:hidden}
.slide.front .slide-cap{visibility:visible;opacity:1 !important}
.slide:not(.front) .slide-name,.slide:not(.front) .slide-cta{visibility:hidden}
.slide-cap{text-shadow:0 1px 14px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.55)}

@media(max-width:760px){
  .dmk{left:12px;bottom:calc(12px + env(safe-area-inset-bottom));width:176px;height:38px}
  .dmk-item{font-size:8.2px}
  .dmk-item span{font-size:7.4px}
}

/* ---------- 第三轮：页脚可读性与触控区 ---------- */
.f-bot span,.f-bot span span{color:#5b4e51}
.f-links a{color:#5b4e51}
@media(max-width:760px){
  .f-links a{display:flex;align-items:center;min-height:40px;padding:10px 0;font-size:12px}
}

/* ---------- 第三轮补：页脚真实容器 .f-low / .f-col ---------- */
.f-low,.f-low span,.f-low a{color:#5b4e51}
.f-col a{color:#5b4e51}
@media(max-width:760px){
  .f-col a{display:flex;align-items:center;min-height:40px;padding:9px 0;font-size:12px}
}

/* ---------- 第四轮：手机端触摸目标统一补齐到 ≥40px ---------- */
@media(max-width:760px){
  .quick{height:44px}
  .chip{min-height:40px;padding:9px 15px}
  .brand{min-height:44px;justify-content:center}
  .f-low a{padding:7px 2px;display:inline-block}
  .link-more{padding:9px 0 6px;display:inline-block}
  .dmk-x{width:26px;height:26px}
  .cards .card a{display:block;padding:4px 0}
}

/* 手机：两列卡片标题占两行高度，价格自然对齐 */
@media(max-width:760px){
  .card .meta h3{min-height:2.6em;line-height:1.3}
}

/* 手机加购钮：44 圆形玻璃扣，柔和不抢图 */
@media(hover:none){
  .quick{width:44px;height:44px;border-radius:50%;background:rgba(251,247,238,.94);
    border:1px solid rgba(79,18,29,.20);box-shadow:0 6px 16px rgba(40,10,16,.16)}
  .quick::after{content:"+";font-size:18px;font-weight:600;color:#4f121d;line-height:1}
  .quick:active{background:#4f121d}
  .quick:active::after{color:#fbf7ee}
}


/* 手机分类轨：去掉两侧渐隐遮罩（会把卡片标题切掉），卡片 76vw 露出下一张的一角 */
@media(max-width:760px){
  .cats-loop{-webkit-mask-image:none;mask-image:none}
  .cat{flex:0 0 76vw}
}

/* 手机：抽屉/页脚/箭头/圆点行等剩余小目标的点击高度 */
@media(max-width:760px){
  .menu-sub a{display:flex;align-items:center;min-height:40px}
  .link-more{display:inline-flex;align-items:center;min-height:40px}
  .stage-dots{padding:11px 4px;height:auto}
  .stage-arrow{width:44px;height:44px}
  .dmk-x{width:28px;height:28px}
  .f-low a{padding:8px 3px}
}

/* 手机详情页主图：改成与实拍同比例的 3:4 满幅，吊坠不再缩在中间一小块 */
@media(max-width:760px){
  .main-img{aspect-ratio:3/4}
  .main-img img{aspect-ratio:3/4;object-fit:cover}
}

/* 循环巡航时卡片会从边缘滑入，两侧渐隐会让“半张卡”看起来像残影，改为硬边裁切更像真实横轨 */
@media(min-width:761px){
  .cats-loop{-webkit-mask-image:none;mask-image:none}
}

/* ---------- 首页分类横轨：循环轮播（≥761px）
   目标：一帧刚好放下四张卡 + 露一点下一张的边（提示“还能往右”），
   卡片宽度按视口给，不再出现“第四张被裁掉大半、标题压边”的帧。
   手机端仍用后面的 76vw 单卡大图。 */
@media (min-width:761px){
.cat{flex:0 0 clamp(215px,21.1vw,360px)}
.cats-loop{-webkit-mask-image:none;mask-image:none}
}

/* 判断：手机一张卡占满可视宽度，平板 3 张 + 露边 */
/* 平板（761–1099）：一帧 3 张 + 明显露一点第 4 张，边缘不再出现“一条窄缝” */
@media (min-width:761px) and (max-width:1099px){
.cat{flex:0 0 clamp(200px,29vw,320px)}
}
/* 手机（≤760）：一张卡正好占满可视宽度，下一张的标题不再被裁掉半截 */
@media (max-width:760px){
.cat{flex:0 0 calc(100vw - 36px)}
}

/* 首屏转台：底部五条小横线（进度条）已撤，只留左右箭头，贴右下 */
.stage-dots{display:none}
.stage-bar{left:auto;right:16px;transform:none;justify-content:flex-end}
@media(min-width:761px){.stage-bar{bottom:calc(var(--stage-bar-b,10px) + 84px)}}
@media(max-width:1000px){.stage-bar{left:auto;right:12px}}
@media(max-width:760px){.stage-bar{left:auto;right:12px;justify-content:flex-end;bottom:var(--stage-bar-b,10px)}}
/* 箭头在深底上再提一档对比，别让人找不着 */
.stage-arrow{color:#e9d7b8;border-color:rgba(230,205,160,.38);background:rgba(14,15,18,.55)}
.stage-arrow:hover{color:#150e12}
/* 手机端两处“看得见但点不准”的目标补到 44px 量级（转台有 3D 缩放，实际渲染约 43px） */
@media(max-width:760px){
  .stage-arrow{width:50px;height:50px;font-size:18px}
  .dmk-x{width:34px;height:34px;right:6px;top:6px}
}
/* 平板（761–1100）转台同样有 3D 缩放，箭头按渲染后约 38–40px 反推 */
@media(min-width:761px) and (max-width:1100px){
  .stage-arrow{width:52px;height:52px;font-size:17px}
}
/* 页脚 Terms / Privacy 在手机上拉出 40px 级点击区（负 margin 抵消视觉位移） */
@media(max-width:760px){
  .f-low a{display:inline-block;padding:11px 4px;margin:-11px -4px}
  .dmk-x{width:40px;height:40px}
}
/* 弹幕关闭钮：视觉仍是 34px，命中区用透明外扩到 46px，不挤文字 */
@media(max-width:760px){
  .dmk-x::after{content:"";position:absolute;inset:-6px;border-radius:50%}
}

/* ---------- 已售数量（卡片 / PDP） ---------- */
.meta .sub .sold{color:#6d1d2a;letter-spacing:.14em;text-transform:uppercase;font-size:10px}
.pdp-sold{display:inline-block;margin-left:10px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:#6d1d2a;border:1px solid rgba(109,29,42,.28);border-radius:999px;padding:3px 9px;background:rgba(109,29,42,.05)}
.pdp-rate{display:inline-flex;align-items:center;gap:6px;margin-left:10px;font-size:11px;letter-spacing:.08em;
  color:#6c5f62;text-decoration:none}
.pdp-rate b{color:#1b1317;font-weight:600}
.pdp-rate .stars{color:#b3894f;letter-spacing:.12em;font-size:12px}
.pdp-rate:hover .stars{color:#6d1d2a}

/* ---------- 评论区 ---------- */
.reviews{padding:64px 0 8px;border-top:1px solid var(--line);margin-top:56px}
.reviews .rv-inner{max-width:none}
.rv-sum{display:flex;align-items:center;gap:9px;font-size:12px;letter-spacing:.08em;color:#6c5f62}
.rv-sum b{font-size:20px;letter-spacing:0;color:#1b1317}
.rv-sum .stars{color:#b3894f;font-size:15px;letter-spacing:.16em}
.rv-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:30px 0 10px}
.rv-card{margin:0;padding:22px 22px 18px;background:#fff;border:1px solid var(--line);border-radius:2px;
  display:flex;flex-direction:column;gap:10px}
.rv-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:11.5px;color:#6c5f62;letter-spacing:.06em}
.rv-top .stars{color:#b3894f;letter-spacing:.14em;font-size:13px}
.rv-top b{color:#1b1317;font-weight:600;letter-spacing:.02em;font-size:12.5px}
.rv-top span{margin-left:auto;font-size:10.5px;color:#8a7c7c}
.rv-card p{margin:0;font-size:13.5px;line-height:1.72;color:#2a2023}
.rv-photo{width:100%;height:190px;object-fit:cover;border-radius:2px;background:var(--sand)}
.rv-tag{font-style:normal;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:#8a7c7c;margin-top:auto}
.rv-empty{padding:34px 0;font-size:13.5px;color:#6c5f62}
.rv-form{margin-top:34px;padding:26px 26px 22px;background:var(--sand);border:1px solid var(--line);border-radius:2px}
.rv-form-h{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap}
.rv-form h3{font-family:"Georgia","Times New Roman",serif;font-size:22px;margin:4px 0 0;font-weight:400}
.rv-stars{display:flex;gap:4px}
.rv-star{background:none;border:0;padding:2px 3px;font-size:22px;line-height:1;color:#b9aec9;
  color:#cbbfae;cursor:pointer;transition:color .18s,transform .18s}
.rv-star.on{color:#b3894f}
.rv-star:hover{transform:translateY(-1px)}
.rv-fields{display:grid;grid-template-columns:1fr;gap:12px;margin-top:18px}
.rv-fields label{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#6c5f62}
.rv-fields input,.rv-fields textarea{display:block;width:100%;margin-top:6px;padding:11px 12px;border:1px solid var(--line);
  background:#fff;font:inherit;font-size:13.5px;color:#1b1317;border-radius:2px;resize:vertical}
.rv-fields input:focus,.rv-fields textarea:focus{outline:2px solid rgba(109,29,42,.28);outline-offset:1px;border-color:#6d1d2a}
.rv-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:16px}
.rv-file{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;
  min-height:42px;padding:0 16px;border:1px solid rgba(109,29,42,.35);color:#6d1d2a;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;cursor:pointer;background:#fff}
.rv-file input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.rv-file:hover{background:#6d1d2a;color:#fff;border-color:#6d1d2a}
.rv-note{font-size:11.5px;color:#6c5f62;letter-spacing:.02em}
.rv-actions .btn{margin-left:auto}

@media(max-width:1100px){
  .rv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rv-photo{height:210px}
}
@media(max-width:760px){
  .reviews{padding-top:44px;margin-top:34px}
  .rv-grid{grid-template-columns:1fr;gap:14px;margin-top:22px}
  .rv-card{padding:18px 16px 16px}
  .rv-photo{height:230px}
  .rv-form{padding:20px 16px 18px;margin-top:26px}
  .rv-stars{gap:8px}
  .rv-star{font-size:26px;padding:4px 6px}
  .rv-actions{gap:12px}
  .rv-actions .btn{margin-left:0;width:100%}
  .rv-file{min-height:46px;flex:1 1 auto}
}

/* ---------- 评论区精修：留白、双列表单、卡片呼吸 ---------- */
.reviews{padding:84px 0 6px;margin-top:64px}
.rv-inner{max-width:1180px}
.rv-grid{gap:18px;margin:32px 0 6px}
.rv-card{padding:24px 24px 20px;gap:12px;background:#fffdfa;
  box-shadow:0 1px 0 rgba(27,19,23,.04);transition:border-color .2s,box-shadow .2s}
.rv-card:hover{border-color:rgba(109,29,42,.28);box-shadow:0 10px 28px -18px rgba(27,19,23,.35)}
.rv-top .stars{font-size:12.5px}
.rv-fields{grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:16px;align-items:start;margin-top:20px}
.rv-fields label.wide{grid-column:auto}
.rv-fields textarea{min-height:112px}
.rv-form{background:#fbf6ef;border-color:#e9dfd2;padding:30px 30px 26px}
.rv-form h3{font-size:24px}
.rv-note{max-width:340px;line-height:1.5}
@media(max-width:1100px){
  .rv-fields{grid-template-columns:1fr}
}
@media(max-width:760px){
  .reviews{padding:54px 0 4px;margin-top:40px}
  .rv-form{padding:22px 16px 20px}
  .rv-fields{margin-top:16px}
}

/* ---------- 评论区底色统一：页面白底 + 砂色表单，去掉大块砂底 ---------- */
.reviews{background:#fff;border-top:1px solid var(--line);padding:84px 0 10px;margin-top:64px}
.rv-inner{max-width:none}
.rv-card{background:#fffdfb}
.rv-form{max-width:none}
@media(max-width:760px){
  .reviews{background:#fff;padding:48px 0 6px;margin-top:36px}
  .rv-form{max-width:none}
  .rv-stars{gap:6px}
  .rv-star{font-size:26px;min-width:44px;min-height:44px;padding:0;display:inline-flex;
    align-items:center;justify-content:center}
}

/* ---------- 导航栏：随滚动白 → 黑磨砂（位置绑定，回滚反向） ---------- */
header.site{
  background:var(--hd-bg,rgba(255,255,255,.92));
  border-bottom:1px solid var(--hd-line,var(--line));
  -webkit-backdrop-filter:blur(var(--hd-blur,14px)) saturate(150%);
  backdrop-filter:blur(var(--hd-blur,14px)) saturate(150%);
  will-change:background-color}
header.site.nav-mid{box-shadow:0 1px 0 rgba(0,0,0,.04)}
header.site.nav-dark{box-shadow:0 14px 40px -26px rgba(0,0,0,.62)}
header.site .brand{color:var(--hd-fg,#261b1f)}
header.site .brand i,header.site .brand .sub{color:var(--hd-fg-soft,#8a7c7c)}
header.site .icon-btn{color:var(--hd-fg,#2a2023)}
header.site .icon-btn:hover{color:var(--hd-accent,#6d1d2a)}
header.site .icon-btn:focus-visible{outline-color:var(--hd-accent,#a2938f)}
header.site .nav-l a{color:var(--hd-fg,#2a2023)}
header.site .nav-l a::after{background:var(--hd-fg,var(--ink))}
header.site .nav-util{color:var(--hd-fg-soft,#6e6161)}
header.site .nav-util i{color:var(--hd-accent,#b6ab97)}
header.site .nav-util:hover{color:var(--hd-fg,#261b1f)}
header.site .navrow{border-bottom-color:var(--hd-line,var(--line))}
header.site .brand,header.site .brand i,header.site .icon-btn,header.site .nav-l a,header.site .nav-util,header.site .nav-util i{transition:color .2s var(--ease)}
header.site .select{color:var(--hd-fg,#2a2023)}
header.site .select option{color:#2a2023;background:#fff}
@media (max-width:760px){html{scroll-padding-top:76px}}

/* ---------- 下单动态：四色磨砂胶囊，自上往下（三端） ---------- */
.dmk{position:fixed;left:22px;right:auto;bottom:22px;width:334px;height:226px;background:none;border:0;
  box-shadow:none;overflow:hidden;pointer-events:none;opacity:1;animation:none;
  transition:opacity .45s ease,transform .45s ease}
.dmk-cols{position:absolute;inset:0;background:none;border:0;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 12%,#000 95%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0,#000 12%,#000 95%,transparent 100%)}
.dmk-item{position:absolute;top:0;left:0;width:max-content;max-width:none;
  padding:9px 15px 10px;border-radius:999px;border:1px solid transparent;
  -webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);
  box-shadow:0 16px 34px -22px rgba(28,16,10,.62),inset 0 1px 0 rgba(255,255,255,.28);
  font:400 9.6px/1.35 "Helvetica Neue",Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;
  color:#1b1317;text-shadow:none;white-space:nowrap;will-change:transform}
.dmk-item em{display:block;font-style:normal;font-weight:500;font-size:9.6px;letter-spacing:.16em;line-height:1.3}
.dmk-item span{display:block;font-size:8.8px;letter-spacing:.04em;text-transform:none;opacity:.86;margin-top:3px;line-height:1.3}
.dmk-item.t-ink{background:rgba(16,12,11,.90);color:#f6efe2;border-color:rgba(246,239,226,.16)}
.dmk-item.t-gold{background:rgba(206,172,112,.97);color:#33270e;border-color:rgba(255,250,238,.62)}
.dmk-item.t-wine{background:rgba(102,24,37,.93);color:#f9ece6;border-color:rgba(249,236,230,.2)}
.dmk-item.t-silver{background:rgba(244,242,238,.96);color:#2b2724;border-color:rgba(255,255,255,.8)}
.dmk-item.t-gold span,.dmk-item.t-silver span{opacity:.74}
.dmk-x{right:0;top:34px;width:20px;height:20px;border-radius:50%;border:1px solid rgba(27,19,23,.14);
  background:rgba(252,248,240,.86);color:#6a5c55;font:400 11px/1 Arial,sans-serif;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer}
.dmk-x:hover{background:#6d1d2a;color:#fff;border-color:#6d1d2a}
body.chat-open .dmk,body.menu-open .dmk,body.cart-open .dmk{opacity:0;pointer-events:none}
@media(max-width:1100px){
  .dmk{left:18px;right:auto;bottom:18px;height:150px}
  .dmk-item{padding:8px 13px 9px}
}
@media(max-width:760px){
  .dmk{left:12px;right:auto;bottom:12px;height:52px}
  .dmk-cols{-webkit-mask-image:none;mask-image:none}
  .dmk-item{padding:8px 13px 9px;font-size:9px}
  .dmk-item em{font-size:8.8px;letter-spacing:.12em}
  .dmk-item span{font-size:8.2px;margin-top:2px}
  .dmk-x{width:22px;height:22px;font-size:11px;top:7px}
  .dmk.with-buy{bottom:calc(96px + env(safe-area-inset-bottom))}
  body:has(.sticky-buy) .dmk{display:block}
}

/* PDP 有常驻购买条时：桌面/平板不改变位置，手机抬到购买条上方 */
@media(min-width:761px){.dmk.with-buy{bottom:24px}}

/* 抽屉菜单：语言/货币收进汉堡菜单后的说明行 */
.menu-note{margin:16px 20px 0;font:400 11px/1.75 "Inter","Helvetica Neue",Arial,sans-serif;color:#8b7e81;letter-spacing:.02em}
@media (prefers-reduced-motion:reduce){.intro,.intro-burst{display:none!important}}

/* 类目 / 二级类目：集合页二级筛选条 + 空类目空状态 */
.chips.sub{margin-top:10px;gap:6px;align-items:center}
.chip.subchip{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;font-size:10.5px;letter-spacing:.08em;
  border-color:transparent;background:rgba(38,27,31,.045);color:#6a5b58}
.chip.subchip:hover{background:rgba(109,29,42,.09);color:#5d1d28;border-color:transparent}
.chip.subchip.on{background:#241a1d;color:#fbf7ee;border-color:transparent}
.chip.subchip i{font-style:normal;font-size:9.5px;letter-spacing:0;opacity:.5}
.chip.subchip.on i{opacity:.7}
.empty-cat{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:66px 24px 74px;text-align:center;border:1px solid var(--line);
  background:radial-gradient(120% 130% at 50% 0,#fffdf8 0,#f8f2e8 62%,#f4ece0 100%)}
.empty-cat .ec-mark{font-size:11px;letter-spacing:.42em;color:#b6a68d;margin-bottom:16px}
.empty-cat h3{font-size:clamp(22px,3vw,30px);line-height:1.18;margin:0 0 12px;color:#241a1d;letter-spacing:-.01em}
.empty-cat p{max-width:470px;margin:0 0 26px;font-size:13px;line-height:1.75;color:#6f6262}
.empty-cat .ec-acts{display:flex;gap:18px;align-items:center;justify-content:center;flex-wrap:wrap}
.empty-cat .btn{height:46px;padding:0 24px;font-size:11px}
@media (max-width:760px){
  .chips.sub{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;padding-bottom:4px;-webkit-overflow-scrolling:touch;
    scrollbar-width:none}
  .chips.sub::-webkit-scrollbar{display:none}
  .chip.subchip{flex:0 0 auto;min-height:34px;padding:6px 12px}
  .empty-cat{padding:46px 16px 52px}
  .empty-cat .ec-acts{gap:14px}
}

/* 集合页筛选区：大类一行、二级一行、右侧计数/排序对齐第一行 */
.filters{display:grid;grid-template-columns:1fr auto;gap:10px 16px;align-items:center}
.filters>.chips:not(.sub){grid-column:1;grid-row:1}
.filters>.chips.sub{grid-column:1/-1;grid-row:2;margin-top:0}
.filters>div:last-child{grid-column:2;grid-row:1;align-self:start;margin-top:1px}
@media (max-width:760px){
  .filters{grid-template-columns:1fr;gap:10px}
  .filters>.chips:not(.sub){flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;padding-bottom:3px;
    scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .filters>.chips:not(.sub)::-webkit-scrollbar{display:none}
  .filters>.chips:not(.sub) .chip{flex:0 0 auto}
  .filters>.chips.sub{grid-row:2}
  .filters>div:last-child{grid-column:1;grid-row:3;justify-content:space-between}
}

/* 平板宽度：大类 chips 单行横滑，别挤成两行 */
@media (min-width: 761px) and (max-width: 1100px){
  .filters{grid-template-columns:1fr}
  .filters > .chips:not(.sub){grid-column:1;grid-row:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
    padding-bottom:3px;scrollbar-width:none}
  .filters > .chips:not(.sub)::-webkit-scrollbar{display:none}
  .filters > .chips:not(.sub) > .chip{flex:0 0 auto}
  .filters > .chips.sub{grid-column:1;grid-row:2}
  .filters > div:last-child{grid-column:1;grid-row:3;justify-content:space-between;align-self:auto;margin-top:0}
}

/* ---------- 星空开场（2026-11-13 重做）：星野 → 收拢奇点 → 炸散乱浮 → GETTING → 逐个归位 ---------- */
html[data-intro="off"] .intro, html[data-intro="off"] .intro-burst{display:none!important}

/* 开场幕布改成深空（信封时代是奶油底） */
.intro{background:
  radial-gradient(34% 30% at 50% 48%,rgba(158,104,80,.22),rgba(158,104,80,0) 72%),
  radial-gradient(120% 96% at 50% 46%,#1b1320 0%,#0b070e 44%,#030207 100%)}

.intro-burst .tw-sky{position:absolute;inset:0;z-index:1;pointer-events:none}
.intro-burst .tw-parts{position:absolute;inset:0;z-index:2;pointer-events:none;mix-blend-mode:screen}

/* 首屏每一块 = 一张"从页面上撕下来的纸片"：白底和页面同色，归位时与真实元素严丝合缝 */
.intro-burst .tw-piece{position:absolute;z-index:3;transform-origin:50% 50%;pointer-events:none;
  background:#fff;box-shadow:0 20px 48px rgba(0,0,0,.46),inset 0 0 0 1px rgba(255,255,255,.6);
  will-change:transform,opacity;backface-visibility:hidden}
.intro-burst .tw-piece.tw-k-media{background:transparent;box-shadow:none;z-index:2}
.intro-burst .tw-piece.tw-k-fab{background:transparent;box-shadow:none}
.intro-burst .tw-drift{position:relative;width:100%;height:100%;will-change:transform}
.intro-burst .tw-shot{width:100%;height:100%;background-size:cover;background-position:50% 42%;
  border-radius:3px;box-shadow:0 26px 66px rgba(0,0,0,.62),0 0 0 1px rgba(255,248,232,.14)}
.intro-burst .tw-k-media .tw-drift::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(9,6,10,.16),rgba(9,6,10,0) 34%,rgba(9,6,10,.28))}

/* 奇点 / 爆炸 */
.intro-burst .tw-halo{position:absolute;left:50%;top:50%;z-index:4;width:min(58vmax,640px);aspect-ratio:1;
  border-radius:50%;pointer-events:none;opacity:0;transform:translate(-50%,-50%);
  background:radial-gradient(closest-side,rgba(255,240,214,.34),rgba(224,189,133,.14) 46%,rgba(224,189,133,0) 76%)}
.intro-burst .tw-core{position:absolute;left:50%;top:50%;z-index:5;width:12px;height:12px;border-radius:50%;
  pointer-events:none;opacity:0;transform:translate(-50%,-50%);
  background:radial-gradient(closest-side,#fff 0%,#ffeccb 40%,#e0bd85 62%,rgba(224,189,133,0) 82%);
  box-shadow:0 0 22px rgba(255,240,214,.95),0 0 78px rgba(224,189,133,.6),0 0 150px rgba(224,189,133,.24)}
.intro-burst .tw-flash{position:absolute;inset:0;z-index:6;pointer-events:none;opacity:0;
  background:radial-gradient(40% 36% at 50% 50%,#fff 0%,rgba(255,250,238,.94) 36%,rgba(255,232,188,.44) 62%,rgba(255,206,138,0) 86%)}
.intro-burst .tw-rays{position:absolute;left:50%;top:50%;z-index:2;width:min(150vmax,1680px);aspect-ratio:1;
  pointer-events:none;opacity:0;transform:translate(-50%,-50%);mix-blend-mode:screen;
  background:repeating-conic-gradient(from 0deg,rgba(255,236,198,.46) 0 .7deg,rgba(255,236,198,0) .7deg 8.4deg);
  -webkit-mask-image:radial-gradient(closest-side,rgba(0,0,0,.9) 0 18%,rgba(0,0,0,.45) 44%,transparent 72%);
  mask-image:radial-gradient(closest-side,rgba(0,0,0,.9) 0 18%,rgba(0,0,0,.45) 44%,transparent 72%)}
.intro-burst .tw-ring{position:absolute;left:50%;top:50%;z-index:4;width:min(78vmax,980px);aspect-ratio:1;
  border-radius:50%;pointer-events:none;opacity:0;transform:translate(-50%,-50%);
  background:radial-gradient(closest-side,transparent 94.2%,rgba(255,238,204,.14) 96.8%,rgba(255,238,204,.46) 98.8%,rgba(255,238,204,0) 100%)}

/* GETTING 徽标：旋转细环 + 字标 + 真实加载进度发丝线 */
.intro-burst .tw-veil{position:absolute;left:50%;top:50%;z-index:7;pointer-events:none;
  width:min(76vmax,760px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);opacity:0;
  background:radial-gradient(closest-side,rgba(8,5,9,.86) 0%,rgba(8,5,9,.7) 42%,rgba(8,5,9,.3) 68%,rgba(8,5,9,0) 100%)}
.intro-burst .tw-badge{position:absolute;left:50%;top:50%;z-index:8;pointer-events:none;
  display:flex;flex-direction:column;align-items:center;gap:11px;padding:22px 30px 20px;
  color:#fbf7ee;text-align:center;border:1px solid rgba(238,224,206,.22);border-radius:2px;
  background:rgba(12,8,12,.42);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  box-shadow:0 22px 60px rgba(0,0,0,.48)}
.intro-burst .tw-badge-ring{width:34px;height:34px;border-radius:50%;
  background:conic-gradient(from 0deg,rgba(224,189,133,0) 0deg,rgba(224,189,133,.92) 190deg,rgba(255,248,236,.9) 250deg,rgba(224,189,133,0) 340deg);
  -webkit-mask:radial-gradient(closest-side,transparent 61%,#000 62%);mask:radial-gradient(closest-side,transparent 61%,#000 62%);
  animation:twSpin 1.15s linear infinite}
@keyframes twSpin{to{transform:rotate(360deg)}}
.intro-burst .tw-badge b{font:400 19px/1 "Iowan Old Style",Georgia,serif;letter-spacing:.4em;text-indent:.4em}
.intro-burst .tw-badge-sub{font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:#c9b99e}
.intro-burst .tw-badge-sub i{font-style:normal;color:#f0e4cd;font-variant-numeric:tabular-nums}
.intro-burst .tw-badge-bar{position:relative;width:132px;height:1px;background:rgba(255,248,236,.2);overflow:hidden}
.intro-burst .tw-badge-bar i{position:absolute;inset:0;transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,#d8b184,#fff8ec);transition:transform .28s ease}

@media (max-width:760px){
  .intro-burst .tw-badge{padding:18px 24px 16px;gap:9px}
  .intro-burst .tw-veil{width:min(86vmax,520px);
    background:radial-gradient(closest-side,rgba(8,5,9,.82) 0%,rgba(8,5,9,.64) 44%,rgba(8,5,9,.24) 70%,rgba(8,5,9,0) 100%)}
  .intro-burst .tw-badge b{font-size:16px}
  .intro-burst .tw-badge-ring{width:28px;height:28px}
  .intro-burst .tw-badge-bar{width:108px}
  .intro-burst .tw-piece{box-shadow:0 12px 30px rgba(0,0,0,.42),inset 0 0 0 1px rgba(255,255,255,.55)}
}
@media (prefers-reduced-motion:reduce){
  .intro-burst .tw-badge-ring{animation:none}
}