:root{
  --jd-red:#e1251b; --jd-red-d:#c41a12; --jd-red-soft:#fff0ed;
  --bg:#f4f4f5; --surface:#fff; --surface-2:#f7f7f8;
  --border:#eee; --text:#262626; --muted:#999;
  --price:#e1251b; --ok:#52c41a;
  --r:10px; --rs:6px;
  --sd:0 1px 3px rgba(0,0,0,.06);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg);color:var(--text);line-height:1.55;font-size:14px;-webkit-font-smoothing:antialiased}
a{color:var(--text);text-decoration:none}
a:hover{color:var(--jd-red)}

/* ====== JD-style RED TOP NAV ====== */
.topbar{background:var(--jd-red);height:32px;line-height:32px;color:rgba(255,255,255,.82);font-size:12px}
.tb-inner{max-width:1200px;margin:0 auto;padding:0 16px;display:flex;justify-content:space-between}
.tb-l a,.tb-r a{color:rgba(255,255,255,.85);margin-right:16px}
.tb-l a:hover,.tb-r a:hover{color:#fff}

.nav{background:#fff;border-bottom:2px solid var(--jd-red);position:sticky;top:0;z-index:50}
.n-inner{max-width:1200px;margin:0 auto;padding:8px 16px;display:flex;align-items:center;gap:18px}
.logo{font-size:22px;font-weight:800;color:var(--jd-red);display:flex;align-items:center;gap:6px;white-space:nowrap}
.logo .li{width:34px;height:34px;background:var(--jd-red);border-radius:6px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px}
.search{flex:1;max-width:520px}
.search input{width:100%;padding:9px 14px 9px 36px;border:2px solid var(--jd-red);border-radius:0;font-size:13px;outline:none;background:#f5f5f5}
.search{position:relative}
.search::before{content:"🔍";position:absolute;left:11px;top:50%;transform:translateY(-50%);font-size:14px;z-index:1}
.search input:focus{background:#fff}
.nav .nl{display:flex;align-items:center;gap:14px;white-space:nowrap;font-size:13px}
.nav .nl a{color:var(--text)}
.nav .nl a:hover{color:var(--jd-red)}

/* 横向导航栏 */
.navbar{background:#fff;border-bottom:1px solid var(--border);box-shadow:0 1px 3px rgba(0,0,0,.03)}
.nb-inner{max-width:1200px;margin:0 auto;padding:0 8px;display:flex;align-items:stretch;
  overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.nb-inner::-webkit-scrollbar{display:none}
.nb-item{position:relative;display:inline-flex;align-items:center;gap:5px;padding:0 16px;line-height:46px;
  font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;transition:color .15s}
.nb-item::after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:2px;background:var(--jd-red);
  transform:scaleX(0);transform-origin:center;transition:transform .18s}
.nb-item:hover{color:var(--jd-red)}
.nb-item:hover::after{transform:scaleX(1)}
.nb-item.nb-hot{color:var(--jd-red)}
.nb-badge{font-style:normal;font-size:10px;font-weight:700;color:#fff;background:var(--jd-red);
  border-radius:3px;padding:0 4px;line-height:15px;transform:translateY(-1px)}
@media(max-width:600px){
  .nb-item{padding:0 12px;line-height:42px;font-size:13px}
  .nb-item::after{left:12px;right:12px}
}
/* 锚点跳转时避开吸顶导航 */
#allgoods,#quickcats{scroll-margin-top:96px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;background:var(--jd-red);color:#fff;
  border:none;padding:8px 18px;border-radius:0;font-size:13px;cursor:pointer;font-weight:600;transition:background .15s}
.btn:hover{background:var(--jd-red-d)}
.btn-ghost{background:#fff;color:var(--jd-red);border:1px solid var(--jd-red)}
.btn-ghost:hover{background:var(--jd-red-soft)}
.btn-sm{padding:5px 12px;font-size:12px}
.btn-block{width:100%}

.container{max-width:1200px;margin:0 auto;padding:16px 16px 48px}

/* flash */
.flash{background:#fff7e6;border:1px solid #ffd591;color:#ad6800;padding:10px 14px;border-radius:var(--rs);margin:12px 0;font-size:13px}
.flash.ok{background:#f6ffed;border-color:#b7eb8c;color:#389e0d}

/* ====== MAIN LAYOUT: left sidebar + right content ====== */
.main{display:flex;gap:14px;align-items:flex-start}
.sidebar{width:190px;flex-shrink:0;background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--sd);position:sticky;top:94px}
.sb-head{background:var(--jd-red);color:#fff;padding:12px 14px;font-weight:700;font-size:15px}
.sb-list{list-style:none;padding:0;margin:0}
.sb-list li{border-bottom:1px solid var(--border)}
.sb-list li a{display:block;padding:10px 14px;font-size:13px;color:var(--text);transition:.12s}
.sb-list li a:hover{background:var(--jd-red-soft);color:var(--jd-red);padding-left:18px}
.sb-list li a.on{background:var(--jd-red-soft);color:var(--jd-red);font-weight:600}

.content{flex:1;min-width:0}

/* banner 区（侧边栏右侧：大banner + 竖排推广位） */
.banner-row{display:grid;grid-template-columns:1fr 230px;gap:12px;margin-bottom:12px}
.banner{background:linear-gradient(135deg,#e1251b,#ff6a00);color:#fff;border-radius:var(--r);padding:30px 34px;position:relative;overflow:hidden}
.banner::after{content:"";position:absolute;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.1);right:-40px;top:-50px}
.banner h1{font-size:25px;font-weight:800;margin:0 0 6px}
.banner p{font-size:14px;opacity:.92;margin:0 0 12px;max-width:520px}
.banner .tag{display:inline-block;background:rgba(255,255,255,.2);padding:5px 14px;border-radius:999px;font-size:12px;font-weight:600}
/* 自定义底图：加 with-bg 类时铺图 + 压暗蒙层保证文字可读 */
.banner.with-bg,.promo.with-bg{background-size:cover;background-position:center;background-repeat:no-repeat}
.banner.with-bg::after,.promo.with-bg::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.38);border-radius:0;width:auto;height:auto}
.banner.with-bg>*,.promo.with-bg>*{position:relative;z-index:1}
.promo{border-radius:var(--r);padding:16px 18px;color:#fff;position:relative;overflow:hidden;cursor:pointer;
  display:flex;flex-direction:column;justify-content:center;box-shadow:var(--sd);transition:transform .15s}
.promo-col{display:flex;flex-direction:column;gap:12px}
.promo:hover{transform:translateY(-2px)}
.promo h3{font-size:16px;font-weight:800;margin:0 0 3px}
.promo p{font-size:12px;opacity:.92;margin:0 0 8px}
.promo .go{font-size:11px;font-weight:600;background:rgba(255,255,255,.24);padding:4px 12px;border-radius:999px;align-self:flex-start}
.promo.p1{background:linear-gradient(135deg,#6a5cff,#3f8cff);flex:1}
.promo.p2{background:linear-gradient(135deg,#00b884,#009e74);flex:1}
.promo-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}
.promo-row .promo{padding:14px 16px}
.promo-row .promo h3{font-size:14px}
@media(max-width:920px){
  .banner-row{grid-template-columns:1fr}
  .promo-col{flex-direction:row}
  .promo-row{grid-template-columns:1fr}
}

/* filter */
.fbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:10px 14px;margin-bottom:14px}
.fbar input{flex:1;min-width:160px;padding:8px 12px;border:1px solid var(--border);border-radius:var(--rs);font-size:13px;outline:none}
.fbar input:focus{border-color:var(--jd-red)}
.fbar select{padding:8px 10px;border:1px solid var(--border);border-radius:var(--rs);font-size:13px}
.fbar .cnt{color:var(--muted);font-size:12px}

/* ====== PRODUCT GRID — JD card style ====== */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.pcard{background:#fff;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;transition:transform .15s,box-shadow .15s;cursor:pointer;display:flex;flex-direction:column;text-decoration:none;color:inherit}
.pcard:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.10);border-color:var(--jd-red)}
.pc-img{height:150px;background:linear-gradient(135deg,#fff0ed,#ffe8d6);display:flex;align-items:center;justify-content:center;font-size:46px;position:relative}
.pc-img .pc-tag{position:absolute;top:8px;left:8px;background:var(--jd-red);color:#fff;font-size:11px;padding:2px 8px;border-radius:999px;font-weight:600}
.pc-body{padding:12px;display:flex;flex-direction:column;gap:5px;flex:1}
.pc-body h3{font-size:13px;font-weight:500;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:38px;color:var(--text)}
.pc-tags{display:flex;flex-wrap:wrap;gap:4px}
.pc-tag{background:var(--surface-2);color:var(--muted);font-size:11px;padding:2px 7px;border-radius:999px}
.pc-desc{color:var(--muted);font-size:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:34px;flex:1}
.pc-foot{display:flex;align-items:center;justify-content:space-between;margin-top:8px;padding-top:8px;border-top:1px dashed var(--border)}
.pc-price{color:var(--price);font-weight:800;font-size:18px}
.pc-price small{font-size:11px;font-weight:500;color:var(--muted)}
.pc-btn{font-size:12px;color:var(--jd-red);font-weight:600;white-space:nowrap}

/* ====== 类型卡片：同一类型的多个国家已合并，一个国家不再占一张卡 ====== */
.gcard{background:#fff;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;
  transition:transform .15s,box-shadow .15s;cursor:pointer;display:flex;flex-direction:column;
  text-decoration:none;color:inherit;content-visibility:auto;contain-intrinsic-size:270px}
.gcard:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.10);border-color:var(--jd-red)}
.gcard.soldout{opacity:.55;filter:grayscale(.85)}
.gcard.soldout .gc-price{color:var(--muted)}
.gcard.soldout .gc-btn{visibility:hidden}
.gc-img{height:132px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.gc-emoji{font-size:46px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.12));transition:transform .2s}
.gcard:hover .gc-emoji{transform:scale(1.1) rotate(-4deg)}
.gc-cat{position:absolute;top:8px;left:8px;background:rgba(0,0,0,.42);color:#fff;font-size:11px;
  padding:2px 8px;border-radius:999px;font-weight:600;max-width:68%;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.gc-body{padding:12px;display:flex;flex-direction:column;gap:6px;flex:1}
.gc-body h3{font-size:13.5px;font-weight:600;line-height:1.45;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:39px;color:var(--text)}
.gc-chips{display:flex;flex-wrap:wrap;gap:4px;flex:1;align-content:flex-start}
.gc-chip{background:var(--surface-2);color:var(--muted);font-size:11px;padding:2px 7px;border-radius:999px}
.gc-chip b{color:var(--jd-red);font-weight:700}
.gc-foot{display:flex;align-items:center;justify-content:space-between;margin-top:8px;
  padding-top:8px;border-top:1px dashed var(--border);gap:6px}
.gc-price{color:var(--price);font-weight:800;font-size:18px;white-space:nowrap}
.gc-price small{font-size:11px;font-weight:500;color:var(--muted)}
.gc-price em{font-size:11px;font-weight:500;color:var(--muted);font-style:normal}
.gc-price.np{font-size:13px;color:var(--muted);font-weight:600}
.gc-btn{font-size:12px;color:var(--jd-red);font-weight:600;white-space:nowrap}

/* detail */
.detail{display:grid;grid-template-columns:340px 1fr;gap:24px}
@media(max-width:768px){.detail{grid-template-columns:1fr};.main{flex-direction:column}.sidebar{width:100%;position:static}}
.dthumb{height:240px;border-radius:var(--r);background:linear-gradient(135deg,#fff0ed,#ffd6b3);display:flex;align-items:center;justify-content:center;font-size:72px}
.panel{background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:24px;box-shadow:var(--sd)}
.panel h2{font-size:21px;margin:0 0 4px}
.pbuy{margin-top:20px;border-top:1px dashed var(--border);padding-top:18px}
.pqty input{width:80px;padding:9px 11px;border:1px solid var(--border);border-radius:var(--rs);font-size:15px}

/* accounts */
.acard{background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;margin-bottom:12px;box-shadow:var(--sd)}
.acard-hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.acard-name{font-weight:600;font-size:14px}
.acard-time{font-size:12px;color:var(--muted)}
.abody{background:var(--surface-2);border:1px dashed var(--border);border-radius:var(--rs);padding:12px 14px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;word-break:break-all;font-size:13px;color:#334155}
.acopy{background:none;border:1px solid var(--border);border-radius:var(--rs);padding:4px 10px;font-size:12px;cursor:pointer;color:var(--muted)}
.acopy:hover{border-color:var(--jd-red);color:var(--jd-red)}

/* auth */
.auth-w{max-width:400px;margin:36px auto}
.auth-w h2{text-align:center;margin-bottom:18px;font-size:20px}
.af{margin-bottom:14px}
.af label{display:block;font-size:13px;color:var(--muted);margin-bottom:5px}
.af input{width:100%;padding:11px 13px;border:1px solid var(--border);border-radius:var(--rs);font-size:15px;outline:none}
.af input:focus{border-color:var(--jd-red)}
.afoot{text-align:center;color:var(--muted);font-size:13px;margin-top:16px}

/* table */
.tbl{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--sd)}
.tbl th,.tbl td{padding:11px 13px;text-align:left;border-bottom:1px solid var(--border);font-size:13px}
.tbl th{background:var(--surface-2);color:var(--muted);font-weight:600;font-size:12px}
.st{font-size:11px;padding:2px 8px;border-radius:999px;font-weight:700}
.st.pending{background:#fffbe6;color:#d48806}
.st.paid{background:#e6f7ff;color:#1890ff}
.st.fulfilled{background:#f6ffed;color:#52c41a}
.st.failed{background:#fff2f0;color:#cf1322}

.empty{text-align:center;color:var(--muted);padding:64px 20px}
.empty .big{font-size:44px;margin-bottom:10px}

.page-head{display:flex;align-items:flex-end;justify-content:space-between;margin:4px 0 14px;flex-wrap:wrap;gap:10px}
.page-head h1{font-size:22px;margin:0}
.page-head .sub{color:var(--muted);font-size:13px}

/* footer */
.footer{background:#1a1d29;color:rgba(255,255,255,.78);margin-top:48px}
.fi{max-width:1200px;margin:0 auto;padding:44px 20px 10px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px}
.fb{font-size:20px;color:#fff;font-weight:800;display:flex;align-items:center;gap:8px;margin-bottom:12px}
.fi p{font-size:13px;line-height:1.8;margin:0;color:rgba(255,255,255,.65)}
.fi h4{color:#fff;font-size:15px;margin:0 0 14px;font-weight:700;letter-spacing:1px}
.fi a{color:rgba(255,255,255,.72);font-size:13px;display:block;margin-bottom:9px;transition:color .15s}
.fi a:hover{color:var(--jd-red)}
.fc{grid-column:1/-1;text-align:center;font-size:12px;color:rgba(255,255,255,.55);padding:20px 20px 22px;border-top:1px solid rgba(255,255,255,.12);margin-top:26px}
@media(max-width:720px){.fi{grid-template-columns:1fr 1fr;gap:24px}}

/* ====== 后台管理 ====== */
.admin-nav{display:flex;gap:6px;background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:8px 10px;margin-bottom:16px;box-shadow:var(--sd);flex-wrap:wrap}
.admin-nav a{padding:7px 16px;border-radius:var(--rs);font-size:13px;color:var(--text)}
.admin-nav a.on{background:var(--jd-red);color:#fff;font-weight:600}
.admin-nav a:hover:not(.on){background:var(--surface-2);color:var(--jd-red)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
.stat{background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;box-shadow:var(--sd)}
.stat .sv{font-size:22px;font-weight:800;color:var(--text)}
.stat .sl{font-size:12px;color:var(--muted)}
.stat.red .sv{color:var(--jd-red)}
@media(max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}}
.frm{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.frm input,.frm select{padding:7px 10px;border:1px solid var(--border);border-radius:var(--rs);font-size:13px;background:var(--surface-2)}
.frm input:focus,.frm select:focus{border-color:var(--jd-red);outline:none;background:#fff}
.frm .w-s{width:70px}.frm .w-m{width:130px}
.inline-form{display:inline}

/* 后台：导航栏设置表格 */
.ntbl-wrap{overflow-x:auto}
.ntbl{width:100%;border-collapse:collapse;min-width:720px}
.ntbl th{text-align:left;font-size:12px;font-weight:600;color:var(--muted);
  padding:0 8px 8px;border-bottom:1px solid var(--border);white-space:nowrap}
.ntbl td{padding:7px 8px;border-bottom:1px solid var(--border);vertical-align:middle}
.ntbl tr:last-child td{border-bottom:none}
.ntbl input,.ntbl select{padding:7px 9px;border:1px solid var(--border);border-radius:var(--rs);
  font-size:13px;background:var(--surface-2);width:100%;font-family:inherit}
.ntbl input:focus,.ntbl select:focus{border-color:var(--jd-red);outline:none;background:#fff}
.ntbl .nurl{display:flex;gap:6px}
.ntbl .nurl select{flex:0 0 132px}
.nmv{border:1px solid var(--border);background:#fff;border-radius:var(--rs);cursor:pointer;
  width:28px;height:28px;font-size:13px;line-height:1;color:var(--text);padding:0;margin-right:2px}
.nmv:hover{border-color:var(--jd-red);color:var(--jd-red)}
.nmv.ndel:hover{border-color:var(--jd-red);background:var(--jd-red);color:#fff}
.pager{display:flex;gap:8px;justify-content:center;align-items:center;margin:18px 0}
.pager a,.pager span{padding:6px 13px;border:1px solid var(--border);border-radius:var(--rs);font-size:13px;background:#fff;color:var(--text)}
.pager a:hover{border-color:var(--jd-red);color:var(--jd-red)}
.pager .cur{background:var(--jd-red);color:#fff;border-color:var(--jd-red)}
.muted-s{font-size:12px;color:var(--muted)}
/* 无货商品：灰色置底 */
.pcard.soldout{opacity:.55;filter:grayscale(.85)}
.pcard.soldout .pc-price{color:var(--muted)}
.pcard.soldout .pc-btn{visibility:hidden}
.pc-out{position:absolute;top:8px;right:8px;background:#8a8a8e;color:#fff;font-size:12px;padding:2px 8px;border-radius:4px;z-index:2}

/* ====== 首页美化（参考账号星球：信任条/分类入口/图片化卡片） ====== */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;background:#fff;border-radius:var(--r);
  padding:14px 16px;margin-bottom:12px;box-shadow:var(--sd)}
.trust .tr{display:flex;align-items:center;gap:10px;min-width:0}
.trust .tr i{font-style:normal;font-size:20px;width:38px;height:38px;flex-shrink:0;border-radius:10px;
  background:var(--jd-red-soft);display:flex;align-items:center;justify-content:center}
.trust .tr b{display:block;font-size:13px;font-weight:700}
.trust .tr small{display:block;font-size:11px;color:var(--muted);line-height:1.4}
@media(max-width:920px){.trust{grid-template-columns:repeat(2,1fr)}}

.quickcats{background:#fff;border-radius:var(--r);padding:14px 16px;margin-bottom:12px;box-shadow:var(--sd)}
.qc-title{font-size:14px;font-weight:700;margin-bottom:12px;display:flex;align-items:baseline;gap:8px}
.qc-title span{font-size:12px;color:var(--muted);font-weight:400}
.qc-list{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.qc{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px;border-radius:var(--rs);
  border:1px solid transparent;transition:.15s;text-align:center}
.qc:hover{border-color:var(--jd-red);background:var(--jd-red-soft);transform:translateY(-2px)}
.qc-ico{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-size:24px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.04)}
.qc b{font-size:12px;font-weight:600;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qc small{font-size:11px;color:var(--muted)}
@media(max-width:920px){.qc-list{grid-template-columns:repeat(3,1fr)}}

.sec-head{display:flex;align-items:baseline;gap:10px;margin:16px 0 10px}
.sec-head h2{font-size:18px;margin:0;font-weight:800}
.sec-head h2::before{content:"";display:inline-block;width:4px;height:16px;background:var(--jd-red);
  border-radius:2px;margin-right:8px;vertical-align:-2px}

/* 卡片：图片区更像商品图 */
.pc-img{height:170px}
.pc-emoji{font-size:56px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.12));transition:transform .2s}
.pcard:hover .pc-emoji{transform:scale(1.08) rotate(-3deg)}
.pc-hot{position:absolute;top:8px;right:8px;background:linear-gradient(135deg,#ff4d2e,#e1251b);color:#fff;
  font-size:11px;font-weight:800;letter-spacing:.5px;padding:2px 8px;border-radius:999px;z-index:2}
.pcard .pc-img .pc-tag{background:rgba(255,255,255,.92);color:var(--jd-red);font-weight:700;
  backdrop-filter:blur(2px);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.pc-foot .pc-btn{opacity:0;transition:opacity .15s}
.pcard:hover .pc-foot .pc-btn{opacity:1}

.guarantee{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:22px;background:#fff;
  border-radius:var(--r);padding:18px 20px;box-shadow:var(--sd)}
.guarantee b{display:block;font-size:13px;margin-bottom:3px}
.guarantee small{font-size:12px;color:var(--muted)}
@media(max-width:920px){.guarantee{grid-template-columns:repeat(2,1fr)}}

/* 长列表性能：跳过屏幕外卡片的渲染 */
.pcard{content-visibility:auto;contain-intrinsic-size:300px}
.pc-price.np{font-size:13px;color:var(--muted);font-weight:600}

/* ====== 商品详情页（参考账号星球购买页） ====== */
.crumb{font-size:13px;color:var(--muted);margin:4px 0 12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.crumb a{color:var(--muted)}
.crumb a:hover{color:var(--jd-red)}
.crumb span{color:#ccc}
.crumb em{font-style:normal;color:var(--text);font-weight:600;max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 第二列用 minmax(0,1fr)：默认的 1fr 是 min-width:auto，右侧内容（规格/国家长列表）
   会把整列撑破容器，导致价格被挤出屏幕边缘。 */
.buywrap{display:grid;grid-template-columns:340px minmax(0,1fr);gap:22px;background:#fff;border-radius:var(--r);
  padding:22px;box-shadow:var(--sd);align-items:start}
.binfo{min-width:0}
@media(max-width:860px){.buywrap{grid-template-columns:1fr}}

.bhero-img{height:300px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  position:relative;font-size:96px}
.bhero-img .bhero-cat{position:absolute;left:12px;top:12px;font-style:normal;font-size:12px;font-weight:700;
  background:rgba(255,255,255,.92);color:var(--jd-red);padding:3px 10px;border-radius:999px}
.bhero-badges{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.bd{font-size:12px;padding:4px 10px;border-radius:999px;font-weight:600}
.bd-official{background:#f6ffed;color:#389e0d}
.bd-fast{background:#fff7e6;color:#d48806}
.bd-after{background:#e6f4ff;color:#1677ff}

.binfo h1{font-size:23px;line-height:1.45;margin:0 0 8px;font-weight:800}
.bdesc{color:var(--muted);font-size:13px;margin:0 0 14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

.bguar{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;background:var(--surface-2);border-radius:8px;
  padding:12px 14px;margin-bottom:16px}
.bguar b{display:block;font-size:13px;color:var(--text)}
.bguar small{font-size:11px;color:var(--muted)}

.bprice{background:linear-gradient(135deg,#fff4f0,#ffe9e0);border-radius:10px;padding:16px 18px;
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.bp-label{font-size:13px;color:var(--muted)}
.bp-now{font-size:34px;font-weight:800;color:var(--price);line-height:1}
.bp-now.np{font-size:20px;color:var(--muted)}
.bp-unit{font-size:13px;color:var(--muted)}
.bp-tip{font-size:12px;color:var(--muted);margin-left:auto}

/* 类型页价格块：上面一行显示所选地区，下面一行价格 */
.bprice.vprice{display:block}
.bprice.vprice .bp-label{display:block;margin-bottom:6px}
.bprice.vprice .bp-label b{color:var(--text);font-weight:700}
.bprice.vprice .bp-row{display:flex;align-items:baseline;gap:8px}
.bprice.vprice .bp-tip{display:block;margin-left:0;margin-top:6px}

/* ====== 国家 / 地区 选择器（类型页） ====== */
.vsel{border:1px solid var(--border);border-radius:10px;padding:14px;margin-bottom:16px;background:#fff}
.vsel-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.vsel-lab{font-size:13px;font-weight:700;white-space:nowrap}
.vsel-head input{flex:1;min-width:150px;padding:8px 12px;border:1px solid var(--border);
  border-radius:var(--rs);font-size:13px;background:var(--surface-2);outline:none;font-family:inherit}
.vsel-head input:focus{border-color:var(--jd-red);background:#fff}
.vsel-cnt{font-size:12px;color:var(--muted);white-space:nowrap}
.vwall{display:flex;flex-wrap:wrap;gap:7px;max-height:280px;overflow-y:auto;padding-right:2px}
.vtag{display:inline-flex;align-items:center;gap:6px;background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--rs);padding:6px 10px;font-size:13px;cursor:pointer;font-family:inherit;
  color:var(--text);transition:border-color .15s,background .15s,color .15s;line-height:1.2}
.vtag b{font-weight:600}
.vtag span{font-size:11px;color:var(--muted);font-weight:600}
.vtag:hover:not(:disabled){border-color:var(--jd-red);color:var(--jd-red)}
.vtag:hover:not(:disabled) span{color:var(--jd-red)}
.vtag.on{background:var(--jd-red);border-color:var(--jd-red);color:#fff}
.vtag.on span{color:rgba(255,255,255,.85)}
.vtag.off{opacity:.5;cursor:not-allowed;text-decoration:line-through}
.vtag.np{cursor:not-allowed;background:#fafafa}
.vtag.np b{color:var(--muted)}
.vempty{font-size:13px;color:var(--muted);padding:10px 2px}
.vsel-more{margin-top:11px;text-align:center}

.bbuy{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.bqty{display:flex;align-items:center;gap:8px}
.bqty>label{font-size:13px;color:var(--muted)}
.qty-stepper{display:flex;align-items:center;border:1px solid var(--border);border-radius:var(--rs);overflow:hidden}
.qty-stepper button{width:34px;height:36px;border:none;background:var(--surface-2);cursor:pointer;font-size:16px;color:var(--text)}
.qty-stepper button:hover{background:var(--jd-red-soft);color:var(--jd-red)}
.qty-stepper input{width:62px;height:36px;border:none;text-align:center;font-size:15px;font-weight:600;outline:none}
.bbtn{background:linear-gradient(135deg,#ff5a3c,var(--jd-red));color:#fff;border:none;padding:13px 46px;
  border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 6px 16px rgba(225,37,27,.28);
  transition:transform .12s,box-shadow .12s;display:inline-flex;align-items:center;gap:6px}
.bbtn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 20px rgba(225,37,27,.36)}
.bbtn:disabled{cursor:not-allowed;box-shadow:none;color:#fff}

.bpay{display:flex;align-items:center;gap:10px;padding-top:12px;border-top:1px dashed var(--border);flex-wrap:wrap}
.bpay span{font-size:12px;color:var(--muted)}
.bpay i{font-style:normal;font-size:11px;border:1px solid var(--border);border-radius:4px;padding:3px 9px;color:#555;background:#fafafa}
.bpay em{font-style:normal;font-size:11px;color:var(--ok);margin-left:auto}

.bnotice{background:#fff8e6;border:1px solid #ffe1a8;border-radius:8px;padding:11px 13px;font-size:13px;
  color:#8a5b00;margin-top:14px;line-height:1.7}

.spectbl{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--r);overflow:hidden;
  box-shadow:var(--sd);margin-bottom:6px;table-layout:fixed}
.spectbl th,.spectbl td{padding:12px 14px;font-size:13px;border-bottom:1px solid var(--border);text-align:left;vertical-align:middle}
.spectbl th{background:var(--surface-2);color:var(--muted);font-weight:600;width:110px}
.spectbl td{width:calc(50% - 110px);color:var(--text);word-break:break-word}
.spectbl tr:last-child th,.spectbl tr:last-child td{border-bottom:none}

.bdetail p{font-size:14px;line-height:1.9;color:#444;margin:0 0 12px}
.bdetail h4{font-size:15px;margin:18px 0 8px;font-weight:700}
.bdetail ul{margin:0 0 12px;padding-left:22px}
.bdetail li{font-size:13.5px;line-height:2;color:#555}
@media(max-width:600px){.spectbl th{width:92px}.spectbl td{width:auto}}

/* LOGO：用户上传的**两张原图**直出（logo_star.png 星标 + logo_text.png 文字），
   不抠底、不裁切、不合成。两张图自带透明底。 */
.brand{display:inline-flex;align-items:center;gap:9px;font-size:21px;font-weight:800;
  color:var(--jd-red);white-space:nowrap;text-decoration:none}
.brand-txt{letter-spacing:.5px}
/* 页头：星标 + 文字图都是 **70px 高**（用户指定），高度对齐、width 自动。
   文字图 2172x724 ≈ 3:1，70px 高时宽约 210px，与星标(81px)合计约 300px。 */
.logo-star{height:70px;width:auto;object-fit:contain;display:inline-block;vertical-align:middle}
.logo-text{height:70px;width:auto;object-fit:contain;display:inline-block;vertical-align:middle}
/* 页脚：同一组图，稍小 */
.fb .logo-star{height:56px}
.fb .logo-text{height:56px}
@media(max-width:600px){
  .brand{font-size:18px;gap:7px}
  .logo-star{height:46px}
  .logo-text{height:46px}
  .fb .logo-star{height:40px}
  .fb .logo-text{height:40px}
}

/* ===== 平台专区 /c/<slug> ===== */
.platwrap{display:block}
.crumb{font-size:12px;color:var(--muted);margin-bottom:12px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.crumb a{color:var(--muted)}
.crumb a:hover{color:var(--jd-red)}
.crumb b{color:var(--text);font-weight:600}

/* 大类 Hero */
.phero{position:relative;display:flex;align-items:center;gap:18px;background:#fff;border-radius:var(--r);
  padding:20px 22px;box-shadow:var(--sd);overflow:hidden;margin-bottom:14px}
.phero::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent,#e1251b)}
.ph-ico{width:72px;height:72px;flex-shrink:0;border-radius:18px;display:flex;align-items:center;justify-content:center;
  font-size:36px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}
.ph-txt{flex:1;min-width:0}
.ph-txt h1{font-size:22px;font-weight:800;margin:0 0 5px}
.ph-txt p{font-size:13px;color:var(--muted);margin:0 0 9px;line-height:1.6}
.ph-badges{display:flex;gap:7px;flex-wrap:wrap}
.ph-badges i{font-style:normal;font-size:11.5px;color:#5a5a5a;background:var(--surface-2);
  border:1px solid var(--border);border-radius:999px;padding:3px 10px}
.ph-stats{display:flex;gap:20px;flex-shrink:0;text-align:center}
.ph-stats b{display:block;font-size:20px;font-weight:800;color:var(--price);line-height:1.2}
.ph-stats small{font-size:11px;color:var(--muted)}

/* 「类型」tab 行（吸顶，横向可滚动）—— 已弃用：落地页改成「全部类型同页铺开」，
   见下方 .secnav / .sec-block。这里保留是因为后台/历史页面还在引用 .ptabs 的类名。
   （全站 templates 已无 .ptabs/.ptab 引用） */
.ptabs-wrap{background:#fff;border-radius:var(--r);box-shadow:var(--sd);margin-bottom:12px;
  position:sticky;top:70px;z-index:40}
.ptabs{display:flex;gap:4px;overflow-x:auto;padding:8px 10px;scroll-behavior:smooth}
.ptabs::-webkit-scrollbar{height:0}
.ptabs{scrollbar-width:none}
.ptab{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;cursor:pointer;
  font-family:inherit;font-size:13.5px;font-weight:600;color:var(--text);background:transparent;
  border:1px solid transparent;border-radius:999px;padding:7px 14px;transition:.15s}
.ptab i{font-style:normal;font-size:11px;font-weight:700;color:var(--muted);background:var(--surface-2);
  border-radius:999px;padding:1px 7px;min-width:20px;text-align:center}
.ptab:hover{background:var(--jd-red-soft);color:var(--jd-red)}
.ptab:hover i{color:var(--jd-red)}
.ptab.on{background:var(--jd-red);border-color:var(--jd-red);color:#fff;box-shadow:0 4px 12px rgba(225,37,27,.25)}
.ptab.on i{background:rgba(255,255,255,.24);color:#fff}

/* ===== 落地页：类型区块 + 快速定位锚点条 =====
   所有类型的规格都铺在同一页，锚点条只负责滚动定位（吸顶，横向可滚动）。 */
.secnav{position:sticky;top:70px;z-index:40;display:flex;align-items:center;gap:8px;
  background:#fff;border-radius:var(--r);box-shadow:var(--sd);padding:8px 12px;margin-bottom:14px}
.sn-lead{flex:0 0 auto;font-size:12.5px;font-weight:700;color:var(--muted);white-space:nowrap}
.sn-scroll{display:flex;gap:6px;overflow-x:auto;scroll-behavior:smooth;min-width:0}
.sn-scroll::-webkit-scrollbar{height:0}
.sn-scroll{scrollbar-width:none}
.sn-chip{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  font-size:12.5px;font-weight:600;color:var(--text);background:var(--surface-2);
  border:1px solid var(--border);border-radius:999px;padding:5px 12px;transition:.15s}
.sn-chip i{font-style:normal;font-size:10.5px;font-weight:700;color:var(--muted);background:#fff;
  border-radius:999px;padding:1px 6px;min-width:18px;text-align:center}
.sn-chip:hover{background:var(--jd-red-soft);border-color:var(--jd-red);color:var(--jd-red)}
.sn-chip:hover i{color:var(--jd-red)}
.sec-block{margin-bottom:6px}
.sec-block .sec-head{margin-top:18px}
/* 锚点跳转时别被吸顶的导航压住标题 */
.sec-block{scroll-margin-top:132px}

.grid.loading{opacity:.45;pointer-events:none;transition:opacity .15s}

/* 其它平台 / 平台索引卡片 */
.pchips{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;
  background:#fff;border-radius:var(--r);padding:14px;box-shadow:var(--sd);margin-bottom:18px}
.pchip{display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--border);
  border-radius:var(--rs);transition:.15s;min-width:0}
.pchip:hover{border-color:var(--jd-red);background:var(--jd-red-soft);transform:translateY(-2px)}
.pc-ico{width:34px;height:34px;flex-shrink:0;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:17px}
.pchip b{font-size:13px;font-weight:600;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pchip small{font-size:11px;color:var(--muted)}

.pflist{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.pfcard{position:relative;display:flex;align-items:center;gap:14px;background:#fff;border-radius:var(--r);
  padding:16px;box-shadow:var(--sd);overflow:hidden;transition:transform .15s,box-shadow .15s}
.pfcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent,#e1251b)}
.pfcard:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.10)}
.pf-ico{width:54px;height:54px;flex-shrink:0;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:26px}
.pf-b{flex:1;min-width:0}
.pf-b h3{font-size:15px;font-weight:700;margin:0 0 4px}
.pf-b p{font-size:12px;color:var(--muted);margin:0 0 8px;line-height:1.55}
.pf-m{display:flex;gap:12px;flex-wrap:wrap;font-size:11.5px;color:var(--muted)}
.pf-m b{color:var(--jd-red);font-weight:700}
.pf-go{font-size:12px;font-weight:700;color:var(--jd-red);white-space:nowrap;flex-shrink:0}

/* 侧栏平台项计数 */
.sb-n{float:right;font-size:11px;color:var(--muted);font-weight:600}
.sb-list li a.on .sb-n{color:var(--jd-red)}
.sidebar{max-height:calc(100vh - 110px);overflow-y:auto}

/* 侧栏相关样式（.sidebar/.sb-*）与「热门分类」(.quickcats/.qc-*) 目前前台已不再使用，
   保留是因为后台/历史页面还有可能引用；新增的分类导航请用 .catnav（上方）。 */

@media(max-width:768px){
  .phero{flex-wrap:wrap;gap:14px;padding:16px}
  .ph-ico{width:56px;height:56px;font-size:28px;border-radius:14px}
  .ph-txt h1{font-size:19px}
  .ph-stats{width:100%;justify-content:flex-start;gap:26px;border-top:1px dashed var(--border);padding-top:12px}
  .ptabs-wrap{top:0}
  .secnav{top:0;padding:8px 10px}
  .sec-block{scroll-margin-top:64px}
  .pflist{grid-template-columns:1fr}
}

/* ===== 顶部分类导航条：7 大类平铺，点击直达落地页 /c/<slug> =====
   （原「平台→类型→规格」三级悬浮菜单已下线，改为这一条平铺导航） */
.catnav{background:#fff;border-bottom:1px solid var(--border);box-shadow:0 1px 3px rgba(0,0,0,.03);position:relative;z-index:40}
.cn-inner{max-width:1200px;margin:0 auto;padding:0 16px;display:flex;align-items:stretch;gap:2px;overflow-x:auto}
.cn-inner::-webkit-scrollbar{height:0}
.cn-lead{flex:0 0 auto;display:flex;align-items:center;padding-right:12px;font-size:13px;font-weight:700;
  color:var(--muted);white-space:nowrap}
.cn-item{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:0 15px;line-height:46px;
  font-size:13.5px;font-weight:600;white-space:nowrap;color:var(--text);
  border-bottom:2px solid transparent;transition:color .15s,background .15s,border-color .15s}
.cn-item:hover,.cn-item.on{color:var(--jd-red);background:var(--jd-red-soft);border-bottom-color:var(--jd-red)}
.cn-ico{width:20px;height:20px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;
  font-size:12px;line-height:1;flex-shrink:0}
.cn-hub{margin-left:auto;flex:0 0 auto;display:inline-flex;align-items:center;padding:0 4px 0 14px;line-height:46px;
  font-size:12.5px;color:var(--muted);white-space:nowrap}
.cn-hub:hover{color:var(--jd-red)}

@media(max-width:920px){
  .cn-lead,.cn-hub{display:none}
  .cn-item{padding:0 10px;font-size:13px}
}

/* ===== 详情页两级选项：类型 / 规格 ===== */
.optsel{border:1px solid var(--border);border-radius:10px;padding:10px 12px;margin-bottom:10px;background:#fff}
.optsel-head{display:flex;align-items:baseline;gap:10px;margin-bottom:7px;flex-wrap:wrap}
.opts{display:flex;flex-wrap:wrap;gap:6px}
/* 类型一多就别换行占半屏，做成单行横滚（和平台页的类型 tab 一致） */
.opts-line{flex-wrap:nowrap;overflow-x:auto;padding-bottom:2px}
.opts-line::-webkit-scrollbar{height:0}
.opts-line{scrollbar-width:none}
.opts-line .opt{flex:0 0 auto}
.opt{display:inline-flex;align-items:center;gap:5px;background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--rs);padding:5px 10px;font-size:12.5px;color:var(--text);transition:.13s;line-height:1.35}
.opt>i{font-style:normal;font-size:10.5px;font-weight:700;color:var(--muted);background:#fff;
  border-radius:999px;padding:1px 6px;flex-shrink:0}
.opt:hover{border-color:var(--jd-red);color:var(--jd-red);background:var(--jd-red-soft)}
.opt.on{background:var(--jd-red);border-color:var(--jd-red);color:#fff}
.opt.on>i{background:rgba(255,255,255,.25);color:#fff}
.opt.off{opacity:.55}

/* 规格项：一行一个，左边名称右边价格；超过约 5 行就内部滚动，避免把购买按钮顶下去 */
.opts-spec{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;
  max-height:172px;overflow-y:auto;padding-right:3px}
.opts-spec .opt{justify-content:space-between;min-width:0;padding:5px 9px;font-size:12px}
.opts-spec .opt>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.opts-spec .opt>em{font-style:normal;font-weight:700;color:var(--price);white-space:nowrap;font-size:12px}
.opts-spec .opt>em.np{color:var(--muted);font-size:11px;font-weight:500}
.opts-spec .opt.on>em{color:#fff}
.opts-spec .opt.on>em.np{color:rgba(255,255,255,.82)}
@media(max-width:600px){.opts-spec{grid-template-columns:1fr;max-height:220px}}