/* ============================================================
   拾货集 · 新中式纸感主题（hkwajc.biz 专属）
   在页面内联样式之后加载，用于整体覆盖视觉层，不影响任何 JS 逻辑
   ============================================================ */

:root{
  --paper:#F6F2E8;          /* 宣纸底 */
  --paper-2:#EFE8D9;        /* 次级纸 */
  --ink:#171310;            /* 墨 */
  --ink-2:#2C2620;
  --muted:#7A7161;          /* 淡墨 */
  --line:#D9CFB9;           /* 纸线 */
  --line-2:#C4B79B;
  --card:#FCFAF4;           /* 卡片纸白 */
  --green:#A62B22;          /* 朱砂（替换原主色） */
  --green-deep:#7E1C15;
  --green-bright:#C0392B;
  --gold:#B08B4F;
  --dark:#14110E;           /* 墨黑 */
  --dark2:#1D1915;
  --deal:#A62B22;
  --serif:'Noto Serif SC',serif;
  --sans:'Noto Sans SC',sans-serif;
  --mono:'IBM Plex Mono',monospace;
  --r:2px;
}

/* ---------- 纸面基底 ---------- */
html,body{
  background-color:var(--paper);
}
body{
  color:var(--ink);
  font-family:var(--sans);
  background-image:
    radial-gradient(1200px 600px at 12% -8%, rgba(166,43,34,.05), transparent 60%),
    radial-gradient(900px 500px at 92% 4%, rgba(176,139,79,.07), transparent 62%),
    repeating-linear-gradient(0deg, rgba(23,19,16,.022) 0 1px, transparent 1px 28px),
    repeating-linear-gradient(90deg, rgba(23,19,16,.022) 0 1px, transparent 1px 28px);
  background-attachment:fixed;
}
::selection{background:var(--green);color:#FBF7EE}

h1,h2,h3,h4,h5,.logo,.foot-logo,.panel h3{
  font-family:var(--serif);
  letter-spacing:.02em;
}
a{transition:color .18s,opacity .18s}

/* 链接默认朱红 */
a:hover{color:var(--green)}

/* ---------- 跑马灯 ---------- */
.ticker{
  background:var(--green);
  color:#F8F1E4;
  height:32px;
  border-bottom:1px solid var(--green-deep);
  letter-spacing:.06em;
}
.ticker b{color:#FBE9C9;font-weight:600}
.ticker .dot{color:rgba(255,255,255,.45)}

/* ---------- 头部 ---------- */
header.site{
  background:rgba(246,242,232,.94);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-2);
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset, 0 6px 18px -14px rgba(23,19,16,.35);
}
.nav{height:72px}
.logo{
  font-weight:900;
  font-size:23px;
  letter-spacing:.08em;
  gap:11px;
}
.logo i{
  width:32px;height:32px;
  border-radius:2px;
  background:var(--green);
  color:#FBF5E9;
  font-size:15px;
  box-shadow:0 0 0 1px var(--green-deep) inset, 3px 3px 0 rgba(166,43,34,.16);
}
.logo small{
  font-family:var(--mono);
  font-size:9.5px;
  color:var(--muted);
  letter-spacing:.18em;
  margin-top:12px;
}
.nav-links{gap:2px}
.nav-links a{
  position:relative;
  padding:9px 15px;
  border-radius:0;
  color:var(--ink-2);
  font-size:14px;
  letter-spacing:.04em;
}
.nav-links a::after{
  content:"";
  position:absolute;left:15px;right:15px;bottom:4px;height:1px;
  background:var(--green);
  transform:scaleX(0);transform-origin:left;
  transition:transform .22s;
}
.nav-links a:hover{background:transparent;color:var(--green)}
.nav-links a:hover::after,.nav-links a.on::after{transform:scaleX(1)}
.nav-links a.on{background:transparent;color:var(--green);font-weight:700}

.search{
  border:1px solid var(--line-2);
  border-radius:0;
  background:var(--card);
  height:40px;
  box-shadow:2px 2px 0 rgba(23,19,16,.05);
}
.search:focus-within{border-color:var(--green);box-shadow:2px 2px 0 rgba(166,43,34,.15)}
.search button{
  background:var(--ink);
  border-radius:0;
  width:32px;height:28px;
}
.search button:hover{background:var(--green)}

.btn-user{
  background:var(--ink);
  color:#F8F2E6;
  border-radius:0;
  padding:10px 18px;
  letter-spacing:.06em;
  box-shadow:3px 3px 0 rgba(166,43,34,.18);
  transition:.18s;
}
.btn-user:hover{background:var(--green);color:#fff;box-shadow:1px 1px 0 rgba(166,43,34,.3)}

.mobile-menu{background:var(--paper);border-bottom:1px solid var(--line-2)}
.mobile-menu a{border-bottom:1px dashed var(--line)}

/* ---------- Hero ---------- */
.hero{
  padding:64px 0 56px;
  border-bottom:1px solid var(--line);
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute;
  right:-120px;top:-120px;
  width:420px;height:420px;
  border:1px solid var(--line);
  border-radius:50%;
  opacity:.5;
  pointer-events:none;
}
.eyebrow{
  font-family:var(--mono);
  font-size:11.5px;
  color:var(--green);
  letter-spacing:.28em;
}
.eyebrow::before{width:34px;height:1px;background:var(--green)}
.hero h1{
  font-weight:900;
  letter-spacing:.03em;
  line-height:1.3;
}
.hero h1 em{
  color:var(--green);
  border-bottom:0;
  background:linear-gradient(transparent 62%, rgba(166,43,34,.16) 62%);
  padding-bottom:2px;
}
.hero p.lead{
  color:var(--muted);
  line-height:1.9;
  letter-spacing:.01em;
}
.hero-stats{
  border-top:1px solid var(--line);
  gap:40px;
}
.hero-stats b{
  font-family:var(--serif);
  font-weight:900;
  font-size:26px;
  color:var(--ink);
}
.hero-stats b span{color:var(--green)}
.hero-stats small{letter-spacing:.06em}

.hero-card{
  border:1px solid var(--line-2);
  border-radius:0;
  background:var(--card);
  transform:none;
  box-shadow:6px 6px 0 rgba(23,19,16,.06), 0 0 0 6px var(--card), 0 0 0 7px var(--line);
}
.hero-card:hover{transform:none;box-shadow:10px 10px 0 rgba(166,43,34,.1), 0 0 0 6px var(--card), 0 0 0 7px var(--line-2)}
.hero-card .tag{
  border-radius:0;
  background:var(--green);
  font-family:var(--sans);
  letter-spacing:.16em;
  padding:5px 12px;
  transform:rotate(-2deg);
  box-shadow:2px 2px 0 rgba(126,28,21,.35);
}
.hero-card h3{font-weight:900}
.price{color:var(--green);font-family:var(--mono)}

/* ---------- 按钮 ---------- */
.btn{
  border-radius:0;
  letter-spacing:.06em;
  padding:12px 24px;
  font-weight:500;
}
.btn-green{
  background:var(--green);
  color:#FBF5E9;
  box-shadow:3px 3px 0 rgba(126,28,21,.22);
}
.btn-green:hover{background:var(--green-deep);transform:translate(1px,1px);box-shadow:1px 1px 0 rgba(126,28,21,.3)}
.btn-ghost{
  border:1px solid var(--ink);
  color:var(--ink);
  background:transparent;
}
.btn-ghost:hover{background:var(--ink);color:var(--paper)}

/* ---------- 分类 / 排序 ---------- */
.cats{padding:38px 0 6px;gap:8px}
.cats .label{letter-spacing:.2em;color:var(--muted)}
.pill{
  border:1px solid var(--line-2);
  background:transparent;
  border-radius:0;
  padding:8px 18px;
  color:var(--ink-2);
  letter-spacing:.04em;
  transition:.18s;
}
.pill:hover{border-color:var(--green);color:var(--green);background:rgba(166,43,34,.04)}
.pill.on{
  background:var(--ink);
  border-color:var(--ink);
  color:#F8F2E6;
  font-weight:500;
}
.sort select{
  border-radius:0;
  border:1px solid var(--line-2);
  background:var(--card);
}

/* ---------- 商品卡 ---------- */
.grid{gap:24px}
.card{
  border:1px solid var(--line-2);
  border-radius:0;
  background:var(--card);
  box-shadow:4px 4px 0 rgba(23,19,16,.045);
  transition:.22s;
}
.card:hover{
  transform:translate(-2px,-2px);
  box-shadow:8px 8px 0 rgba(166,43,34,.12);
  border-color:var(--green);
}
.card .cover img{filter:saturate(.94) contrast(1.02)}
.card .cat-tag{
  border-radius:0;
  background:var(--green);
  letter-spacing:.12em;
  padding:4px 10px;
  box-shadow:2px 2px 0 rgba(126,28,21,.3);
}
.card .body{padding:17px 18px 20px}
.card h3{font-weight:700;letter-spacing:.01em}
.card h3 a:hover{color:var(--green)}
.card .desc{color:var(--muted);line-height:1.75}
.kws span{
  border-radius:0;
  background:rgba(23,19,16,.04);
  color:var(--muted);
  border:1px solid var(--line);
  letter-spacing:.04em;
}
.card .foot{border-top:1px dashed var(--line-2)}
.card .foot .price{font-size:20px}
.empty{color:var(--muted)}
.empty b{font-weight:900}

/* ---------- 分页 ---------- */
.pager button{
  border-radius:0;
  border:1px solid var(--line-2);
  background:var(--card);
  color:var(--ink);
}
.pager button:hover:not(:disabled){border-color:var(--green);color:var(--green)}
.pager button.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}

/* ---------- 保障带 ---------- */
.assure{
  background:var(--dark);
  color:#E8E0D0;
  position:relative;
  border-top:3px double var(--gold);
  border-bottom:3px double var(--gold);
}
.assure h2{color:#F8F2E6;letter-spacing:.06em}
.assure .sub{color:#9C927F}
.a-item .ic{
  border-radius:0;
  background:rgba(176,139,79,.14);
  border:1px solid rgba(176,139,79,.32);
  color:var(--gold);
}
.a-item h4{color:#F4ECDC;letter-spacing:.05em}
.a-item p{color:#9C927F;line-height:1.85}

/* ---------- 页脚 ---------- */
footer{
  background:var(--dark);
  color:#9C927F;
  border-top:1px solid rgba(176,139,79,.25);
}
.foot-grid h5{color:#E8DCC4;letter-spacing:.1em}
.foot-grid a:hover{color:var(--gold)}
.foot-logo{
  font-weight:900;
  color:#F4ECDC;
  letter-spacing:.12em;
}
.copy{
  border-top:1px solid rgba(255,255,255,.08);
  color:#7B7263;
  letter-spacing:.05em;
}

/* ---------- 通用：面包屑 / 侧栏卡 / 标签 ---------- */
.crumb{color:var(--muted);letter-spacing:.04em}
.crumb a:hover{color:var(--green)}
.side-card,.panel,.card-keys,.success-card,.form-card,.contact-card,.side{
  border-radius:0;
  border:1px solid var(--line-2);
  background:var(--card);
  box-shadow:4px 4px 0 rgba(23,19,16,.04);
}
.side-card h3,.side h3{letter-spacing:.06em}
.chip,.lv-tag,.secure-tag,.cat-tag{border-radius:0}
.c-ok{background:rgba(166,43,34,.09);color:var(--green)}
.c-wait{background:#F3E7CE;color:#8A6A22}
.c-off{background:#EDE7D9;color:var(--muted)}
.c-close{background:rgba(166,43,34,.1);color:var(--green)}
.mono{font-family:var(--mono)}

/* ---------- 表单 ---------- */
input,select,textarea,.field input,.field select,.field textarea,.toolbar input,.toolbar select{
  border-radius:0;
  border:1px solid var(--line-2);
  background:var(--card);
  color:var(--ink);
}
input:focus,select:focus,textarea:focus,.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--green);
  box-shadow:0 0 0 3px rgba(166,43,34,.1);
}
.field label{color:var(--muted);letter-spacing:.04em}

/* ---------- 表格 ---------- */
table{border:1px solid var(--line)}
th{
  background:var(--paper-2);
  color:var(--ink-2);
  letter-spacing:.06em;
  border-bottom:1px solid var(--line-2);
}
td{border-bottom:1px solid var(--line)}
tr:hover td{background:rgba(166,43,34,.025)}
.t-link{color:var(--green)}

/* ---------- 价格 / 徽标 ---------- */
.price,.price-now,.g-price,.pay-amount-row .amt{
  color:var(--green);
  font-family:var(--mono);
}

/* ---------- 标签页 ---------- */
.tabs{border-bottom:1px solid var(--line-2)}
.tab,.step-tabs .tab{
  border-radius:0;
  letter-spacing:.04em;
}
.tab.on,.step-tabs .tab.on{
  color:var(--green);
  border-color:var(--green);
}

/* ---------- 弹窗 ---------- */
.modal,.modal-mask .modal{
  border-radius:0;
  border:1px solid var(--line-2);
  background:var(--card);
  box-shadow:8px 8px 0 rgba(23,19,16,.12);
}
.drawer-mask{backdrop-filter:blur(2px)}

/* ---------- 用户中心 ---------- */
.side{
  background:var(--card);
}
.side .avatar,.avatar{
  border-radius:0;
  background:var(--ink);
  color:var(--paper);
}
.side .menu a{border-radius:0;letter-spacing:.04em}
.side .menu a.on,.side .menu a.active{
  background:var(--ink);
  color:var(--paper);
}
.lv-badge,.me-tag{border-radius:0}
.progress{background:var(--paper-2);border-radius:0}
.progress i,.progress .bar{background:var(--green);border-radius:0}
.tier{border-radius:0;border:1px solid var(--line-2);background:var(--card)}
.tier.on,.tier.active{border-color:var(--green);box-shadow:4px 4px 0 rgba(166,43,34,.12)}
.switch i{border-radius:0}
.switch i::before{border-radius:0}
.switch input:checked+i{background:var(--green)}

/* ---------- 收银台 ---------- */
.pay-panel,.bill,.panel{
  border-radius:0;
}
.qr-box,.qr-zone,.qr-mask{border-radius:0}
.qr-box{border:1px solid var(--line-2);box-shadow:6px 6px 0 rgba(23,19,16,.06)}
.ok-ring{border-color:rgba(166,43,34,.35)}
.spinner{border-color:rgba(166,43,34,.2);border-top-color:var(--green)}
.warn-box{border-radius:0;border-left:3px solid var(--green);background:rgba(166,43,34,.06)}
.tips{color:var(--muted)}
.chain.on,.chain-row .chain.on{border-color:var(--green);color:var(--green)}

/* ---------- 订单页 ---------- */
.status-banner{
  border-radius:0;
  border:1px solid var(--line-2);
  background:var(--card);
  box-shadow:4px 4px 0 rgba(23,19,16,.04);
}
.timeline .tl-item.done .dot,.tl-item.done .dot{background:var(--green);border-color:var(--green)}
.key-item{border-radius:0;border:1px solid var(--line-2);background:var(--paper-2)}

/* ---------- 帮助中心 ---------- */
.help-hero{border-bottom:1px solid var(--line)}
.big-search input{border-radius:0}
.a-card,.hot-item,.rel-item{
  border-radius:0;
  border:1px solid var(--line-2);
  background:var(--card);
  transition:.2s;
}
.a-card:hover,.hot-item:hover,.rel-item:hover{
  border-color:var(--green);
  transform:translate(-2px,-2px);
  box-shadow:6px 6px 0 rgba(166,43,34,.08);
}

/* ---------- 文章页 ---------- */
.art-body{
  font-size:16px;
  line-height:2;
  color:var(--ink-2);
}
.art-body h2,.art-body h3{letter-spacing:.03em;border-left:3px solid var(--green);padding-left:12px}
.art-body blockquote{border-left:3px solid var(--line-2);background:rgba(23,19,16,.03);border-radius:0}
.toc-wrap{border-radius:0;border:1px solid var(--line-2);background:var(--card)}
.toc-wrap-inner a.on,.toc-wrap-inner a:hover{color:var(--green)}

/* ---------- 登录注册 ---------- */
.form-card{border-radius:0}
.auth .form-card{
  box-shadow:6px 6px 0 rgba(23,19,16,.06), 0 0 0 6px var(--card), 0 0 0 7px var(--line);
}
.auth .tabs .tab.on{color:var(--green);border-color:var(--green)}
.auth .submit,.form-card .submit{
  border-radius:0;
  background:var(--green);
  color:#FBF5E9;
  letter-spacing:.1em;
  box-shadow:3px 3px 0 rgba(126,28,21,.2);
}
.auth .submit:hover{background:var(--green-deep)}
.reg-gift{border-radius:0;border:1px dashed var(--line-2)}
.perk .ic{border-radius:0}

/* ---------- TG 页 ---------- */
.phone,.tg-app{border-radius:0}
.tg-app{border:1px solid var(--line-2);box-shadow:8px 8px 0 rgba(23,19,16,.06)}
.tg-head{background:var(--ink);color:var(--paper)}
.tg-body{background:var(--paper-2)}
.msg.bot{background:var(--card);border-radius:0;border:1px solid var(--line)}
.tg-input .tg-open{
  border-radius:0;
  background:var(--green);
  color:#FBF5E9;
  letter-spacing:.06em;
}
.date-chip{border-radius:0;background:rgba(23,19,16,.06);color:var(--muted)}
.flow-item .n{border-radius:0;background:var(--ink);color:var(--paper)}

/* ---------- 商品详情 ---------- */
.pd-cover,.oc-card{border-radius:0;border:1px solid var(--line-2)}
.buy-panel{border-radius:0;border:1px solid var(--line-2);background:var(--card);box-shadow:6px 6px 0 rgba(23,19,16,.05)}
.qty{border-radius:0}
.qty button{border-radius:0}
.tab-bar{border-bottom:1px solid var(--line-2)}
.tab-bar .tab.on{border-color:var(--green);color:var(--green)}
.lv-table th{background:var(--paper-2)}
.stock,.safe{color:var(--muted)}

/* ---------- 适配 ---------- */
@media (max-width:900px){
  .hero{padding:40px 0 34px}
  .hero-card{transform:none}
  .grid{gap:16px}
  .assure-grid{gap:22px}
}