:root{
  --vip-red:#e60044;
  --vip-pink:#ff2d6f;
  --vip-deep:#c0003a;
  --gold:#ffb800;
  --wa-green:#25d366;
  --wa-dark:#075e54;
  --ink:#1a1a1a;
  --sub:#8a8a8a;
  --bg:#f3f3f6;
  --card:#ffffff;
  --line:#efefef;
  --radius:14px;
  --shadow:0 6px 20px rgba(230,0,68,.10);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{background:#e7e7ec;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink);line-height:1.45;display:flex;justify-content:center;
}
.phone{width:100%;max-width:430px;min-height:100vh;background:var(--bg);position:relative;overflow:hidden;box-shadow:0 0 40px rgba(0,0,0,.12);}

/* ---------- Top bar ---------- */
.topbar{position:sticky;top:0;z-index:30;background:linear-gradient(90deg,var(--vip-deep),var(--vip-red));color:#fff;
  padding:10px 14px;display:flex;align-items:center;gap:10px;}
.topbar .logo{font-weight:800;font-size:16px;letter-spacing:.3px;display:flex;align-items:center;gap:6px;}
.topbar .logo .cn{font-size:10px;font-weight:600;opacity:.85;background:rgba(255,255,255,.18);padding:2px 6px;border-radius:6px;}
.topbar .spacer{flex:1;}
.topbar .mem{font-size:11px;font-weight:700;padding:5px 11px;border-radius:20px;cursor:pointer;border:1px solid rgba(255,255,255,.4);}
.topbar .mem.on{background:var(--gold);color:#5a2c00;border-color:var(--gold);}

/* ---------- Hero ---------- */
.hero{position:relative;color:#fff;padding:20px 18px 24px;overflow:hidden;background:linear-gradient(160deg,var(--vip-red),var(--vip-pink));}
.hero .hero-txt{position:relative;z-index:2;}
.hero-count{display:flex;align-items:center;gap:10px;margin-top:16px;background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.28);border-radius:12px;padding:10px 14px;}
.hero-count .hc-label{font-size:11px;font-weight:800;letter-spacing:1.5px;color:var(--gold);}
.hero-count .clock{display:flex;gap:5px;margin-left:auto;}
.hero-count .clock b{background:#1a1a1a;color:#fff;font-size:22px;font-weight:900;padding:6px 9px;border-radius:7px;min-width:38px;text-align:center;font-variant-numeric:tabular-nums;}
.hero-count .clock i{color:#fff;font-style:normal;font-weight:900;align-self:center;font-size:20px;}
.hero .kicker{font-size:11px;font-weight:700;letter-spacing:2px;opacity:.95;text-transform:uppercase;}
.hero h1{font-size:32px;font-weight:900;margin-top:4px;line-height:1.05;letter-spacing:-.5px;}
.hero h1 .one{color:var(--gold);text-shadow:0 2px 0 rgba(0,0,0,.15);}
.hero .sub{font-size:12.5px;margin-top:8px;opacity:.96;max-width:90%;}
.hero .cn{font-size:12px;margin-top:2px;opacity:.85;}
.hero-badges{display:flex;gap:7px;margin-top:14px;flex-wrap:wrap;}
.hero-badges .b{background:rgba(255,255,255,.92);color:var(--vip-deep);font-size:10.5px;font-weight:700;padding:5px 9px;border-radius:18px;}

/* ---------- Membership banner ---------- */
.mem-banner{margin:14px 12px 0;background:linear-gradient(90deg,#2a0d18,#5a0f2c);border-radius:14px;padding:12px 14px;
  display:flex;align-items:center;gap:10px;color:#fff;position:relative;overflow:hidden;}
.mem-banner::after{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,184,0,.35),transparent 70%);}
.mem-banner .ic{font-size:24px;z-index:2;}
.mem-banner .t{font-weight:800;font-size:13.5px;z-index:2;}
.mem-banner .t small{display:block;font-weight:500;font-size:10.5px;opacity:.8;margin-top:1px;}
.mem-banner .go{margin-left:auto;background:var(--gold);color:#5a2c00;border:none;border-radius:20px;font-weight:800;
  font-size:12px;padding:8px 14px;cursor:pointer;z-index:2;white-space:nowrap;}

/* ---------- Flash countdown ---------- */
.flash{background:#fff;margin:14px 12px 0;position:relative;z-index:5;border-radius:var(--radius);box-shadow:var(--shadow);
  padding:11px 14px;display:flex;align-items:center;gap:12px;}
.flash .lbl{font-weight:800;color:var(--vip-red);font-size:14px;display:flex;flex-direction:column;}
.flash .lbl small{font-size:9.5px;color:var(--sub);font-weight:600;letter-spacing:.4px;}
.flash .clock{display:flex;gap:4px;margin-left:auto;}
.flash .clock b{background:#1a1a1a;color:#fff;font-size:14px;font-weight:800;padding:4px 6px;border-radius:6px;min-width:28px;text-align:center;}
.flash .clock i{color:var(--vip-red);font-style:normal;font-weight:900;align-self:center;}

/* ---------- Section heading ---------- */
.sec-head{display:flex;align-items:center;gap:8px;padding:20px 16px 8px;}
.sec-head h2{font-size:17px;font-weight:800;}
.sec-head .en{font-size:10.5px;color:var(--sub);font-weight:600;}
.sec-head .more{margin-left:auto;font-size:12px;color:var(--vip-red);font-weight:700;}

/* ---------- Chips ---------- */
.chips{display:flex;gap:8px;overflow-x:auto;padding:4px 16px 12px;scrollbar-width:none;}
.chips::-webkit-scrollbar{display:none;}
.chip{flex:0 0 auto;border:1px solid var(--line);background:#fff;color:#555;font-size:12px;font-weight:600;
  padding:7px 13px;border-radius:20px;white-space:nowrap;cursor:pointer;}
.chip.active{background:var(--vip-red);color:#fff;border-color:var(--vip-red);}

/* ---------- Product grid ---------- */
.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 12px 16px;}
.card{background:var(--card);border-radius:var(--radius);overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.05);
  display:flex;flex-direction:column;cursor:pointer;position:relative;}
.card .thumb{position:relative;height:150px;background:#fafafa;}
.card .thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.card .thumb .tag{position:absolute;top:8px;left:8px;background:var(--vip-red);color:#fff;font-size:10px;font-weight:800;padding:3px 7px;border-radius:6px;}
.card .thumb .lock{position:absolute;top:8px;right:8px;background:rgba(0,0,0,.55);color:#fff;font-size:10px;
  font-weight:700;padding:3px 7px;border-radius:6px;display:flex;align-items:center;gap:3px;}
.card .body{padding:10px 11px 12px;display:flex;flex-direction:column;flex:1;}
.card .title{font-size:12.5px;font-weight:600;line-height:1.35;height:34px;overflow:hidden;}
.card .sku-line{font-size:9.5px;color:var(--sub);letter-spacing:.4px;margin-top:2px;opacity:.75;}
.detail-body .sku-line{font-size:11px;color:var(--sub);letter-spacing:.6px;margin:4px 0 2px;opacity:.8;}
.card .price-row{display:flex;align-items:baseline;gap:6px;margin-top:7px;}
.card .price{color:var(--vip-red);font-weight:900;font-size:19px;}
.card .price small{font-size:11px;font-weight:800;}
.card .was{color:var(--sub);font-size:10.5px;text-decoration:line-through;}
.card .grab{margin-top:9px;background:linear-gradient(90deg,var(--vip-red),var(--vip-pink));color:#fff;border:none;
  border-radius:22px;font-weight:800;font-size:12.5px;padding:8px 0;cursor:pointer;width:100%;}
.card .grab:active{transform:scale(.97);}
.card .grab.locked{background:#bbb;}

/* ===== $1 ZONE (prominent hook, visually separated) ===== */
.zone-one{margin:16px 12px 0;border-radius:18px;padding:14px 12px 16px;position:relative;overflow:hidden;
  background:linear-gradient(135deg,#9e002c 0%,#e60044 55%,#ff2d6f 100%);box-shadow:0 10px 28px rgba(230,0,68,.30);}
.zone-one::before{content:"";position:absolute;right:-50px;top:-50px;width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,184,0,.45),transparent 70%);}
.zone-one::after{content:"$1";position:absolute;left:-8px;bottom:-34px;font-size:130px;font-weight:900;color:rgba(255,255,255,.06);line-height:1;}
.zone-head{display:flex;align-items:center;gap:10px;color:#fff;padding:2px 4px 14px;position:relative;z-index:2;}
.zone-head .fire{font-size:24px;}
.zone-title{font-size:21px;font-weight:900;letter-spacing:.5px;line-height:1;}
.zone-title .us{color:var(--gold);}
.zone-sub{font-size:11px;color:#ffe9f0;opacity:.92;margin-top:3px;}
.zone-tag{margin-left:auto;background:var(--gold);color:#5a2c00;font-size:10px;font-weight:900;padding:5px 10px;border-radius:14px;white-space:nowrap;
  animation:pulse 1.4s ease-in-out infinite;}
@keyframes pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.08);}}

/* $1 cards — gold-accented to stand apart */
.zone-one .grid{gap:10px;}
.zone-one .card{border:2px solid var(--gold);}
.zone-one .card .thumb .tag{background:var(--gold);color:#5a2c00;font-size:12px;font-weight:900;padding:4px 9px;
  box-shadow:0 2px 6px rgba(0,0,0,.2);}
.zone-one .card .price{color:#d4003f;}
.zone-one .card .price small{color:#d4003f;}
.zone-one .card .grab{background:linear-gradient(90deg,#ffb800,#ff9500);color:#5a2c00;}
.zone-one .card .grab.locked{background:#caa23f;color:#fff;}

/* divider label between sections */
.sec-divider{display:flex;align-items:center;gap:10px;margin:24px 16px 4px;color:var(--sub);font-size:11px;font-weight:700;letter-spacing:1px;}
.sec-divider::before,.sec-divider::after{content:"";flex:1;height:1px;background:var(--line);}

/* ---------- Membership block ---------- */
.member{margin:8px 12px 18px;background:linear-gradient(160deg,#2a0d18,#5a0f2c);border-radius:18px;padding:22px 18px;
  color:#fff;position:relative;overflow:hidden;}
.member::before{content:"";position:absolute;right:-40px;bottom:-40px;width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,184,0,.35),transparent 70%);}
.member .crown{font-size:12px;font-weight:700;color:var(--gold);letter-spacing:1px;}
.member h3{font-size:22px;font-weight:900;margin-top:4px;line-height:1.15;}
.member .price-big{display:flex;align-items:baseline;gap:6px;margin:13px 0 3px;}
.member .price-big b{font-size:38px;font-weight:900;color:var(--gold);}
.member .price-big span{font-size:13px;opacity:.85;}
.member ul{list-style:none;margin:13px 0 16px;position:relative;z-index:2;}
.member li{font-size:12.5px;padding:5px 0 5px 24px;position:relative;opacity:.95;}
.member li::before{content:"✓";position:absolute;left:0;top:5px;color:var(--gold);font-weight:900;}
.member .cta{background:var(--gold);color:#5a2c00;border:none;border-radius:26px;font-weight:900;font-size:15px;
  padding:13px 0;width:100%;cursor:pointer;}
.member .cta:active{transform:scale(.98);}
.member .wa-note{font-size:10.5px;opacity:.8;text-align:center;margin-top:9px;}

/* ---------- WhatsApp float ---------- */
.wa-float{position:fixed;right:16px;bottom:20px;z-index:40;width:56px;height:56px;border-radius:50%;background:var(--wa-green);
  display:flex;align-items:center;justify-content:center;box-shadow:0 8px 22px rgba(37,211,102,.5);text-decoration:none;}
.wa-float svg{width:30px;height:30px;fill:#fff;}
.wa-float:active{transform:scale(.94);}

/* ---------- Footer ---------- */
footer{background:#fff;padding:22px 16px 40px;text-align:center;color:var(--sub);font-size:11px;line-height:1.7;border-top:1px solid var(--line);}
footer .fbrand{color:var(--vip-red);font-weight:800;font-size:13px;}
.wa-direct{color:#1ebe5d;font-weight:800;text-decoration:none;border-bottom:1px dashed rgba(30,190,93,.55);}
.wa-direct:hover,.wa-direct:active{color:#0f9e4a;}

/* ---------- Toast ---------- */
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%) translateY(20px);background:rgba(0,0,0,.85);
  color:#fff;font-size:13px;padding:10px 18px;border-radius:24px;z-index:80;opacity:0;transition:.25s;pointer-events:none;white-space:nowrap;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* ============ DETAIL PAGE ============ */
.back{display:flex;align-items:center;gap:8px;padding:12px 14px;font-weight:700;font-size:15px;cursor:pointer;background:#fff;border-bottom:1px solid var(--line);}
.back .ar{font-size:18px;}
.detail-hero{background:#000;}
.detail-hero img{width:100%;max-height:340px;object-fit:contain;display:block;background:#fff;}
.detail-mem{background:var(--gold);color:#5a2c00;font-size:11.5px;font-weight:800;text-align:center;padding:6px 0;letter-spacing:.5px;}
.detail-body{padding:16px;background:#fff;}
.detail-body h1{font-size:19px;font-weight:900;line-height:1.25;}
.detail-body .cn{font-size:12.5px;color:var(--sub);margin-top:3px;}
.detail-price{display:flex;align-items:baseline;gap:10px;margin:14px 0;}
.detail-price .now{color:var(--vip-red);font-weight:900;font-size:30px;}
.detail-price .now small{font-size:14px;font-weight:800;}
.detail-price .was{color:var(--sub);font-size:13px;text-decoration:line-through;}
.detail-price .disc{background:var(--vip-red);color:#fff;font-size:11px;font-weight:800;padding:3px 8px;border-radius:6px;}
.detail-desc{font-size:13.5px;color:#444;line-height:1.7;margin-top:6px;}
.spec-title{font-weight:800;font-size:14px;margin:18px 0 8px;}
.spec{display:flex;justify-content:space-between;font-size:13px;padding:10px 0;border-bottom:1px solid var(--line);}
.spec span:first-child{color:var(--sub);}
.spec span:last-child{font-weight:700;}
.buy-bar{position:sticky;bottom:0;z-index:20;display:flex;gap:10px;padding:10px 12px;background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 16px rgba(0,0,0,.06);}
.buy-bar .mem-btn{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:10px;color:#666;width:54px;}
.buy-bar .mem-btn .e{font-size:20px;}
.buy-bar .buy{flex:1;background:linear-gradient(90deg,var(--vip-red),var(--vip-pink));color:#fff;border:none;border-radius:26px;
  font-weight:900;font-size:16px;padding:13px 0;cursor:pointer;}
.buy-bar .buy.locked{background:#bbb;}
.buy-bar .buy:active{transform:scale(.99);}

/* ---------- WhatsApp Join Modal ---------- */
.mask{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:90;display:none;align-items:flex-end;justify-content:center;}
.mask.show{display:flex;}
.wa-card{background:#fff;width:100%;max-width:430px;border-radius:18px 18px 0 0;overflow:hidden;animation:up .25s ease;}
@keyframes up{from{transform:translateY(100%);}to{transform:translateY(0);}}
.wa-head{background:linear-gradient(135deg,#075e54 0%,var(--wa-dark) 60%,#0b3d33 100%);color:#fff;padding:16px;display:flex;align-items:center;gap:12px;}
.wa-head .av{width:48px;height:48px;border-radius:50%;background:var(--wa-green);
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  box-shadow:0 0 0 2px rgba(255,255,255,.25),0 4px 10px rgba(0,0,0,.25);}
.wa-head .av svg{width:27px;height:27px;fill:#fff;}
.wa-head .nm{font-weight:800;font-size:15px;letter-spacing:.3px;display:flex;align-items:center;gap:5px;}
.wa-head .nm .vf{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;
  background:#3ab4f2;color:#fff;font-size:9px;line-height:1;}
.wa-head .st{font-size:11px;opacity:.85;display:flex;align-items:center;gap:5px;margin-top:2px;}
.wa-head .st .dot{width:7px;height:7px;border-radius:50%;background:#4ef07a;display:inline-block;
  box-shadow:0 0 0 0 rgba(78,240,122,.7);animation:pulse 1.8s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(78,240,122,.6);}70%{box-shadow:0 0 0 6px rgba(78,240,122,0);}100%{box-shadow:0 0 0 0 rgba(78,240,122,0);}}
.wa-head .x{margin-left:auto;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.14);
  display:flex;align-items:center;justify-content:center;font-size:15px;cursor:pointer;}
.wa-head .x:active{background:rgba(255,255,255,.28);}
.wa-body{padding:16px;}
.wa-body .lead{font-size:13.5px;color:#333;line-height:1.6;}
.wa-body .lead b{color:var(--vip-red);}
.wa-qr{margin:14px auto;width:auto;height:auto;border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#fff;padding:12px;}
.wa-qr img{width:200px;height:200px;display:block;border-radius:8px;background:#fff;}
.wa-qr span{background:#fff;padding:4px 8px;font-size:11px;color:#0a7d3b;font-weight:700;border-radius:6px;text-align:center;line-height:1.3;}
.wa-add{display:block;width:100%;background:var(--wa-green);color:#fff;border:none;border-radius:26px;font-weight:800;font-size:15px;
  padding:13px 0;cursor:pointer;text-align:center;text-decoration:none;}
.wa-add:active{transform:scale(.99);}
.wa-sec{margin-top:10px;width:100%;background:#f0f0f0;color:#444;border:none;border-radius:26px;font-weight:700;font-size:13px;
  padding:11px 0;cursor:pointer;}
.wa-foot{font-size:10.5px;color:var(--sub);text-align:center;padding:12px 16px 18px;line-height:1.5;}

/* Load more */
.loadmore{display:block;width:calc(100% - 32px);margin:18px auto 6px;background:#fff;color:var(--vip-red);
  border:1.5px solid var(--vip-red);border-radius:26px;font-weight:800;font-size:14px;padding:12px 0;cursor:pointer;}
.loadmore:active{background:var(--vip-red);color:#fff;}
.zone-sub span, .sec-divider span{color:#ffd84d;font-weight:800;}

/* ============================================================
   DETAIL PAGE — refined & precise (YASN GLOBAL)
   ============================================================ */
.pd-top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:10px;
  height:50px;padding:0 12px;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);}
.pd-top .pd-back{font-size:26px;font-weight:300;line-height:1;color:var(--ink);cursor:pointer;width:28px;text-align:center;}
.pd-top .pd-topname{flex:1;font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#222;}
.pd-top .pd-share{font-size:20px;color:#555;cursor:pointer;width:30px;text-align:center;}

/* gallery */
.pd-gallery{position:relative;background:#fff;padding:14px;}
.pd-stage{background:#fafafa;border-radius:18px;overflow:hidden;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line);transition:transform .25s ease;cursor:zoom-in;}
.pd-stage.zoom{transform:scale(1.04);cursor:zoom-out;}
.pd-stage img{width:100%;max-height:330px;object-fit:contain;display:block;}
.pd-cat{position:absolute;top:22px;left:22px;background:rgba(0,0,0,.62);color:#fff;font-size:10.5px;font-weight:700;
  letter-spacing:.6px;padding:4px 10px;border-radius:14px;z-index:3;text-transform:uppercase;}
.pd-ribbon{position:absolute;top:22px;right:22px;display:none;background:linear-gradient(90deg,var(--vip-red),var(--vip-pink));
  color:#fff;font-size:11px;font-weight:900;letter-spacing:.5px;padding:5px 12px;border-radius:14px;z-index:3;
  box-shadow:0 4px 12px rgba(230,0,68,.35);}

/* info block */
.pd-info{background:#fff;padding:16px 16px 8px;}
.pd-crumb{font-size:11px;color:var(--sub);font-weight:600;letter-spacing:.3px;}
.pd-crumb b{color:var(--vip-red);}
.pd-info h1{font-size:21px;font-weight:900;line-height:1.25;margin-top:6px;color:#161616;}
.pd-sku{font-size:11px;color:var(--sub);letter-spacing:.8px;margin-top:5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;}

.pd-price{display:flex;align-items:baseline;gap:10px;margin-top:12px;}
.pd-now{color:var(--vip-red);font-weight:900;font-size:32px;line-height:1;}
.pd-now small{font-size:15px;font-weight:800;margin-right:1px;}
.pd-was{color:var(--sub);font-size:14px;text-decoration:line-through;}
.pd-disc{background:var(--vip-red);color:#fff;font-size:11px;font-weight:800;padding:3px 8px;border-radius:7px;}
.pd-save{font-size:12px;color:#1aa86a;font-weight:700;margin-top:6px;}

.pd-badges{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap;}
.pd-badge{font-size:11px;font-weight:800;padding:5px 11px;border-radius:16px;letter-spacing:.3px;}
.pd-badge.gold{background:linear-gradient(90deg,#ffb800,#ff9500);color:#5a2c00;}
.pd-badge.red{background:rgba(230,0,68,.10);color:var(--vip-red);border:1px solid rgba(230,0,68,.25);}

/* variant + qty */
.pd-variant{margin-top:16px;}
.pd-qty{display:flex;align-items:center;justify-content:space-between;margin-top:16px;}
.pd-vlabel{font-size:12px;font-weight:800;color:#333;letter-spacing:.4px;margin-bottom:9px;}
.pd-chips{display:flex;gap:8px;flex-wrap:wrap;}
.pd-chip{border:1.5px solid var(--line);background:#fff;color:#555;font-size:12.5px;font-weight:700;
  padding:8px 16px;border-radius:20px;cursor:pointer;transition:.15s;}
.pd-chip.on{background:var(--vip-red);color:#fff;border-color:var(--vip-red);box-shadow:0 3px 10px rgba(230,0,68,.25);}
.pd-stepper{display:flex;align-items:center;gap:0;border:1.5px solid var(--line);border-radius:22px;overflow:hidden;}
.pd-stepper button{width:40px;height:38px;border:none;background:#fff;font-size:20px;font-weight:700;color:#444;cursor:pointer;}
.pd-stepper button:active{background:#f3f3f6;}
.pd-stepper input{width:46px;height:38px;border:none;text-align:center;font-size:15px;font-weight:800;color:#161616;background:#fff;}

/* blocks */
.pd-block{background:#fff;margin-top:12px;padding:16px;}
.pd-block-title{font-size:13px;font-weight:900;letter-spacing:1px;color:#222;margin-bottom:12px;
  display:flex;align-items:center;gap:8px;}
.pd-block-title::before{content:"";width:4px;height:14px;background:var(--vip-red);border-radius:2px;}

/* highlights grid */
.pd-highlights{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.pd-hl{background:#faf7f8;border:1px solid #f1e6ea;border-radius:12px;padding:12px;text-align:center;}
.pd-hl-v{font-size:16px;font-weight:900;color:var(--vip-deep);line-height:1.1;}
.pd-hl-l{font-size:10.5px;color:var(--sub);font-weight:600;margin-top:4px;letter-spacing:.4px;text-transform:uppercase;}

/* description */
.pd-desc{font-size:13.5px;color:#444;line-height:1.75;}

/* specs */
.pd-speclist{border-top:1px solid var(--line);}
.pd-spec{display:flex;justify-content:space-between;align-items:center;font-size:13px;padding:11px 2px;border-bottom:1px solid var(--line);}
.pd-spec span{color:var(--sub);font-weight:600;}
.pd-spec b{color:#161616;font-weight:700;text-align:right;}

/* supplier card */
.pd-supplier{background:linear-gradient(160deg,#fff,#fff8f3);border:1px solid #ffe1c7;border-radius:16px;padding:16px;}
.pd-sup-head{font-size:14px;font-weight:800;color:#7a3b00;margin-bottom:12px;}
.pd-sup-row{display:flex;justify-content:space-between;font-size:13px;padding:8px 0;border-bottom:1px dashed #f0d3b8;}
.pd-sup-row span{color:#8a6a4f;font-weight:600;}
.pd-sup-row b{color:#3a2410;}
.pd-sup-note{font-size:11.5px;color:#9a7a5f;line-height:1.6;margin-top:12px;}
.pd-wa-direct{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(135deg,#25d366,#1ebe5d);
  color:#fff;font-weight:800;font-size:13px;padding:11px 16px;border-radius:10px;text-decoration:none;
  box-shadow:0 6px 16px rgba(37,211,102,.35);}
.pd-wa-direct svg{width:18px;height:18px;flex:0 0 auto;}
.pd-wa-direct:active{transform:scale(.97);}

/* trust strip */
.pd-trust{display:flex;gap:6px;padding:16px;background:#fff;margin-top:12px;flex-wrap:wrap;}
.pd-trust-i{flex:1;min-width:100px;background:#f6fdf8;color:#137a45;font-size:11px;font-weight:800;
  padding:10px 8px;border-radius:10px;text-align:center;border:1px solid #d6f0e0;}

/* sticky buy bar */
.pd-buybar{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:430px;z-index:45;
  display:flex;gap:10px;padding:10px 12px;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);
  border-top:1px solid var(--line);box-shadow:0 -6px 18px rgba(0,0,0,.07);}
.pd-join{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  width:62px;border:none;background:transparent;cursor:pointer;color:#25a85a;}
.pd-join .e{font-size:20px;line-height:1;}
.pd-join span{font-size:10px;font-weight:800;}
.pd-buy{flex:1;background:linear-gradient(90deg,var(--vip-red),var(--vip-pink));color:#fff;border:none;border-radius:26px;
  font-weight:900;font-size:16px;padding:14px 0;cursor:pointer;box-shadow:0 6px 18px rgba(230,0,68,.30);}
.pd-buy.locked{background:#c9c9cf;color:#fff;box-shadow:none;}
.pd-buy:active{transform:scale(.99);}