/* ============================================================
   S-VIP 设计系统 · theme.css
   所有页面共用。改配色 / 圆角 / 阴影只需要动这一个文件。
   类名与原页面完全一致，HTML 结构无需改动。
   ============================================================ */

/* ---------- 1. 令牌 ---------- */
:root{
  /* 底色 */
  --bg:#020617;
  --panel:#0b1222;
  --panel-2:#141d31;
  --panel-3:#1a2438;

  /* 品牌色 */
  --gold:#fbbf24;
  --purple:#6366f1;
  --purple-lt:#818cf8;
  --blue:#0ea5e9;
  --blue-lt:#38bdf8;
  --usdt:#22c55e;
  --danger:#f87171;

  /* 文字 */
  --text:#e8eef8;
  --text-dim:rgba(232,238,248,0.56);
  --text-faint:rgba(232,238,248,0.34);

  /* 描边：统一成三档，不再每处手写 rgba */
  --line:rgba(148,163,184,0.13);
  --line-2:rgba(148,163,184,0.20);
  --line-3:rgba(148,163,184,0.32);

  /* 圆角：只保留 5 档，原来散落着 10/11/12/13/14/16/18/20/24 太碎 */
  --r-sm:10px;
  --r-md:14px;
  --r-lg:20px;
  --r-xl:28px;
  --r-full:100px;

  /* 阴影 */
  --e1:0 2px 8px rgba(0,0,0,0.28);
  --e2:0 8px 24px rgba(0,0,0,0.36);
  --e3:0 18px 48px rgba(0,0,0,0.5);

  /* 字体 */
  --f-display:'Space Grotesk','Noto Sans SC',sans-serif;
  --f-body:'Noto Sans SC',-apple-system,sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,monospace;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth;}

body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--f-body);
  font-size:14px;
  line-height:1.6;
  min-height:100vh;
  overflow-x:hidden;
  /* 刘海屏左右安全区 */
  padding-left:env(safe-area-inset-left);
  padding-right:env(safe-area-inset-right);
  -webkit-font-smoothing:antialiased;
}

.mono{font-family:var(--f-mono);}

/* 所有数字统一等宽，实时刷新时不会左右跳动 */
.price,.n,.val,.timer,.oc-total,.lb-count,.kpi .n,.row-money,.ref-earn,.summary .val{
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum";
}

.wrap{
  position:relative; z-index:1;
  max-width:560px; margin:0 auto;
  padding:0 20px calc(60px + env(safe-area-inset-bottom));
}

/* 背景光晕：各页面可用 body[data-glow] 覆盖，默认三色 */
.bg-glow{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    radial-gradient(circle at 18% -5%, rgba(99,102,241,0.18), transparent 46%),
    radial-gradient(circle at 92% 12%, rgba(14,165,233,0.13), transparent 42%),
    radial-gradient(circle at 30% 102%, rgba(251,191,36,0.07), transparent 40%);
}

/* 键盘可见焦点：原来完全没有，键盘 / 辅助设备用户无法定位 */
a:focus-visible,button:focus-visible,input:focus-visible,
.ticket:focus-visible,.pay-opt:focus-visible,.tab:focus-visible{
  outline:2px solid var(--blue-lt);
  outline-offset:2px;
  border-radius:var(--r-sm);
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* ---------- 2. 导航 ---------- */
.nav-bar{
  position:sticky; top:0; z-index:20;
  padding:calc(14px + env(safe-area-inset-top)) 16px 10px;
  background:linear-gradient(to bottom,var(--bg) 62%,transparent);
}
.nav-pill{
  background:rgba(11,18,34,0.86);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid var(--line-2);
  border-radius:var(--r-full);
  padding:9px 10px 9px 16px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  box-shadow:var(--e2);
}
.brand,.brand-name{
  font-family:var(--f-display); font-weight:900; font-size:15px; letter-spacing:1.2px;
  background:linear-gradient(92deg,var(--gold),#fde68a);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  white-space:nowrap;
}
.back,.back-btn{
  font-size:12.5px; color:var(--text-dim); text-decoration:none; font-weight:700;
  white-space:nowrap; padding:6px 2px; transition:color .15s;
}
.back:hover,.back-btn:hover{color:var(--text);}

.nav-links{
  display:flex; gap:2px; overflow-x:auto;
  -ms-overflow-style:none; scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
.nav-links::-webkit-scrollbar{display:none;}
.nav-links a{
  white-space:nowrap; font-size:11.5px; font-weight:700;
  color:var(--text-dim); text-decoration:none;
  padding:7px 11px; border-radius:var(--r-full);
  transition:color .15s,background .15s;
}
.nav-links a:hover{color:var(--text); background:rgba(148,163,184,0.09);}

.logout{
  font-size:11.5px; font-weight:700; color:var(--text-dim);
  background:transparent; border:1px solid var(--line-2);
  border-radius:var(--r-full); padding:6px 13px; cursor:pointer;
  font-family:var(--f-body); transition:.15s;
}
.logout:hover{color:var(--danger); border-color:rgba(248,113,113,0.45);}

/* ---------- 3. 页头 ---------- */
.hero{padding:32px 0 6px;}
.hero h1{
  font-family:var(--f-display); font-weight:900;
  font-size:27px; line-height:1.3; letter-spacing:-.4px;
}
.hero h1 .a{background:linear-gradient(92deg,var(--blue),#7dd3fc); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero h1 .b{background:linear-gradient(92deg,var(--purple),var(--purple-lt)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero p{margin-top:12px; font-size:13.5px; line-height:1.78; color:var(--text-dim); max-width:44ch;}

.hero-icon{
  width:52px; height:52px; border-radius:17px;
  display:flex; align-items:center; justify-content:center;
  font-size:23px; font-weight:900; margin-bottom:15px;
  background:linear-gradient(140deg,var(--purple),var(--purple-lt));
  box-shadow:0 10px 28px rgba(99,102,241,0.32),inset 0 1px 0 rgba(255,255,255,0.22);
}

.strip{
  margin-top:16px; padding:11px 14px;
  border-radius:var(--r-md);
  background:rgba(251,191,36,0.07);
  border:1px solid rgba(251,191,36,0.22);
  font-size:11.5px; line-height:1.65; color:#fde68a;
}
.strip b{color:var(--gold);}

.sec-title{
  font-family:var(--f-display); font-size:15px; font-weight:700;
  margin-top:38px; letter-spacing:.2px;
}
.sec-title::after{
  content:''; display:block; width:22px; height:2px; margin-top:7px;
  background:linear-gradient(90deg,var(--gold),transparent); border-radius:2px;
}

/* ---------- 4. 数据面板 ---------- */
.stat-panel,.live-stat{
  margin-top:22px;
  background:linear-gradient(150deg,var(--panel-2),var(--panel));
  border:1px solid var(--line);
  border-radius:var(--r-xl);
  padding:20px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  box-shadow:var(--e2);
}
.live-stat{border-radius:var(--r-lg); padding:16px 18px;}
.stat-panel .n{font-family:var(--f-mono); font-size:30px; font-weight:700; color:#fff; line-height:1;}
.live-stat .n{font-family:var(--f-mono); font-size:24px; font-weight:700; color:var(--purple-lt); line-height:1;}
.stat-panel .l,.live-stat .l{font-size:10.5px; color:var(--text-dim); margin-top:5px;}
.stat-div,.live-divider{width:1px; align-self:stretch; min-height:36px; background:var(--line-2);}
.stat-live,.live-feed{flex:1; min-width:0; overflow:hidden;}
.stat-live .tag,.live-feed .tag{
  display:inline-flex; align-items:center; gap:5px;
  font-size:10px; font-weight:700; color:var(--usdt); margin-bottom:4px;
}
.stat-live .dot,.live-feed .tag .dot,.feed-head .dot,.lb-live .dot{
  width:6px; height:6px; border-radius:50%;
  background:var(--usdt); box-shadow:0 0 8px var(--usdt);
  animation:pulse 1.8s ease-in-out infinite; flex-shrink:0;
}
@keyframes pulse{0%,100%{opacity:1; transform:scale(1);} 50%{opacity:.35; transform:scale(.86);}}
.stat-live .txt,.live-feed .txt{
  font-size:12px; color:var(--text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* ---------- 5. 成交墙（招牌模块）---------- */
.feed-box{
  margin-top:16px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  overflow:hidden;
  box-shadow:var(--e1);
}
.feed-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:15px 18px 11px;
  border-bottom:1px solid var(--line);
}
.feed-head .t{font-size:14.5px; font-weight:700; font-family:var(--f-display);}
.feed-head .live{display:flex; align-items:center; gap:6px; font-size:11px; color:var(--usdt); font-weight:700;}
.feed-list{max-height:288px; overflow:hidden; position:relative;}
.feed-list::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:52px;
  pointer-events:none;
  background:linear-gradient(to bottom,rgba(11,18,34,0),var(--panel));
}
.feed-item{
  position:relative;
  display:flex; align-items:center; gap:12px;
  padding:13px 18px 13px 20px;
  animation:feedIn .45s ease;
}
/* 左侧色条按产品线区分，比只看头像更快认出是 TG 还是 X */
.feed-item::before{
  content:''; position:absolute; left:0; top:8px; bottom:8px;
  width:2.5px; border-radius:0 3px 3px 0; background:var(--line-3);
}
.feed-item:has(.av.tg)::before{background:linear-gradient(var(--purple),var(--purple-lt));}
.feed-item:has(.av.x)::before{background:linear-gradient(var(--blue),var(--blue-lt));}
.feed-item + .feed-item{border-top:1px solid rgba(148,163,184,0.07);}
@keyframes feedIn{from{opacity:0; transform:translateY(-8px);} to{opacity:1; transform:none;}}
.feed-item .av{
  width:34px; height:34px; border-radius:11px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:900;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.2);
}
.feed-item .av.tg{background:linear-gradient(140deg,var(--purple),var(--purple-lt)); color:#fff;}
.feed-item .av.x{background:linear-gradient(140deg,var(--blue),var(--blue-lt)); color:#fff;}
.feed-item .body{flex:1; min-width:0;}
.feed-item .who{
  font-size:13.5px; font-weight:700; font-family:var(--f-mono);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.feed-item .what{font-size:11.5px; color:var(--text-dim); margin-top:4px;}
.feed-item .right{text-align:right; flex-shrink:0;}
.feed-item .ok{
  font-size:10.5px; font-weight:700; padding:4px 10px;
  border-radius:var(--r-full); display:inline-block;
  background:rgba(34,197,94,0.13); color:var(--usdt);
  border:1px solid rgba(34,197,94,0.24);
}
.feed-item .when{font-size:10.5px; color:var(--text-faint); margin-top:5px;}
.feed-empty,.recent-empty,.lb-empty,.empty{
  padding:26px 18px; text-align:center;
  font-size:12.5px; color:var(--text-dim);
}

/* ---------- 6. 产品卡 / 横幅 ---------- */
.cards{margin-top:26px; display:flex; flex-direction:column; gap:14px;}
.prod-card{
  display:block; text-decoration:none; color:inherit;
  border-radius:var(--r-xl); padding:24px;
  position:relative; overflow:hidden;
  transition:transform .18s ease,box-shadow .18s ease;
}
.prod-card::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  border-radius:inherit; box-shadow:inset 0 1px 0 rgba(255,255,255,0.07);
}
.prod-card:active{transform:scale(.988);}
.prod-card.blue{
  background:linear-gradient(155deg,rgba(14,165,233,0.15),var(--panel) 62%);
  border:1px solid rgba(14,165,233,0.32);
  box-shadow:0 12px 32px rgba(14,165,233,0.10);
}
.prod-card.purple{
  background:linear-gradient(155deg,rgba(99,102,241,0.17),var(--panel) 62%);
  border:1px solid rgba(99,102,241,0.32);
  box-shadow:0 12px 32px rgba(99,102,241,0.12);
}
.prod-icon{
  width:46px; height:46px; border-radius:15px;
  display:flex; align-items:center; justify-content:center;
  font-size:20px; font-weight:900; margin-bottom:14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.22);
}
.prod-card.blue .prod-icon{background:linear-gradient(140deg,var(--blue),var(--blue-lt)); color:#fff;}
.prod-card.purple .prod-icon{background:linear-gradient(140deg,var(--purple),var(--purple-lt)); color:#fff;}
.prod-card h3{font-family:var(--f-display); font-size:19px; font-weight:700;}
.prod-card p{font-size:12px; color:var(--text-dim); margin-top:7px; line-height:1.65;}
.prod-from{
  font-family:var(--f-mono); font-size:12px; font-weight:700;
  color:var(--usdt); margin-top:15px;
}
.prod-arrow{
  position:absolute; right:22px; top:24px;
  font-size:18px; color:var(--text-faint);
  transition:transform .18s ease,color .18s ease;
}
.prod-card:hover .prod-arrow{transform:translateX(3px); color:var(--text-dim);}

.tg-banner,.ref-banner{
  margin-top:16px; display:flex; align-items:center; gap:12px;
  border-radius:var(--r-lg); padding:17px 20px;
  text-decoration:none; color:inherit;
  transition:transform .18s ease;
}
.tg-banner:active,.ref-banner:active{transform:scale(.99);}
.tg-banner{
  background:linear-gradient(140deg,rgba(14,165,233,0.16),var(--panel) 70%);
  border:1px solid rgba(14,165,233,0.34);
  box-shadow:0 10px 28px rgba(14,165,233,0.10);
}
.ref-banner{
  background:linear-gradient(140deg,rgba(251,191,36,0.13),var(--panel) 70%);
  border:1px solid rgba(251,191,36,0.28);
}
.tg-banner .ic,.ref-banner .ic{
  width:42px; height:42px; border-radius:13px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:19px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.22);
}
.tg-banner .ic{background:linear-gradient(140deg,var(--blue),var(--blue-lt));}
.ref-banner .ic{background:linear-gradient(140deg,var(--gold),#f59e0b);}
.tg-banner .t,.ref-banner .t{font-size:13.5px; font-weight:700;}
.tg-banner .s,.ref-banner .s{font-size:11px; color:var(--text-dim); margin-top:4px; line-height:1.55;}
.tg-banner .go{margin-left:auto; font-size:17px; color:var(--blue); flex-shrink:0;}

/* ---------- 7. 套餐选择 ---------- */
.tabs,.type-tabs{display:flex; gap:8px; margin:26px 0 14px;}
.tab,.type-tab{
  flex:1; text-align:center; min-height:44px;
  padding:12px 6px; border-radius:var(--r-md);
  font-size:13px; font-weight:700; cursor:pointer;
  border:1px solid var(--line-2); color:var(--text-dim);
  background:transparent; font-family:var(--f-body);
  transition:.18s;
}
.tab:hover,.type-tab:hover{color:var(--text); border-color:var(--line-3);}
.tab.active,.type-tab.active{
  background:linear-gradient(140deg,var(--purple),var(--purple-lt));
  color:#fff; border-color:transparent;
  box-shadow:0 6px 20px rgba(99,102,241,0.34);
}
.tier-panel{display:none;}
.tier-panel.active{display:block;}

.tickets{display:flex; flex-direction:column; gap:12px;}
.ticket{
  position:relative; background:var(--panel);
  border-radius:var(--r-lg); padding:18px 20px;
  cursor:pointer; border:1.5px solid var(--line-2);
  transition:border-color .16s,box-shadow .16s,background .16s;
}
.ticket:hover{border-color:var(--line-3);}
/* 选中态：外发光 + 内描边，比单纯换边框色更明确 */
.ticket.selected{
  border-color:var(--purple);
  background:linear-gradient(140deg,rgba(99,102,241,0.10),var(--panel) 70%);
  box-shadow:0 0 0 3px rgba(99,102,241,0.14),0 10px 30px rgba(99,102,241,0.20);
}
.ticket.selected::after{
  content:'✓'; position:absolute; right:18px; bottom:16px;
  width:22px; height:22px; border-radius:50%;
  background:var(--purple); color:#fff;
  font-size:12px; font-weight:900;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 0 12px rgba(99,102,241,0.6);
}
.ticket-row1{display:flex; align-items:center; justify-content:space-between; gap:8px;}
.duration{font-size:13px; font-weight:700; color:var(--text);}
.tag{font-size:10px; font-weight:700; padding:4px 9px; border-radius:var(--r-full); color:#fff;}
.tag.hot{background:linear-gradient(140deg,#f97316,#fb923c);}
.tag.rec{background:linear-gradient(140deg,var(--purple),var(--purple-lt));}
.price-line{display:flex; align-items:baseline; gap:6px; margin-top:10px;}
.price{font-family:var(--f-mono); font-size:27px; font-weight:700; color:#fff; line-height:1;}
.unit{font-size:11px; font-weight:700; color:var(--usdt);}
.strike{font-size:12px; color:var(--text-faint); text-decoration:line-through; margin-left:2px;}
.ref-badge{
  position:absolute; top:-9px; right:16px;
  background:linear-gradient(140deg,var(--gold),#f59e0b); color:#020617;
  font-size:9.5px; font-weight:900; padding:4px 10px;
  border-radius:var(--r-full);
  box-shadow:0 4px 14px rgba(251,191,36,0.45);
}

/* ---------- 8. 表单 / 按钮 ---------- */
.order,.search-card,.ref-card{
  margin-top:26px; background:var(--panel);
  border:1px solid var(--line); border-radius:var(--r-xl);
  padding:22px 20px; box-shadow:var(--e2);
}
.order h3{font-family:var(--f-display); font-size:16px; font-weight:700;}
.field{margin-top:16px;}
.field label{font-size:12px; color:var(--text-dim); display:block; margin-bottom:8px;}
.field input,.lookup-row input{
  width:100%; background:var(--bg);
  border:1px solid var(--line-2); color:var(--text);
  font-size:15px; padding:13px 14px;
  border-radius:var(--r-md); font-family:var(--f-mono);
  transition:border-color .15s,box-shadow .15s;
}
.field input::placeholder,.lookup-row input::placeholder{color:var(--text-faint);}
.field input:focus,.lookup-row input:focus{
  outline:none; border-color:var(--purple);
  box-shadow:0 0 0 3px rgba(99,102,241,0.15);
}
.hint,.tip,.contact-hint{font-size:10.5px; color:var(--text-dim); margin-top:7px; line-height:1.65;}

.pay-grid{display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:8px;}
.pay-opt{
  border:1px solid var(--line-2); border-radius:var(--r-md);
  padding:12px 9px; font-size:12px; text-align:center; cursor:pointer;
  min-height:56px; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  transition:.16s;
}
.pay-opt:hover{border-color:var(--line-3);}
.pay-opt.selected{
  border-color:var(--usdt);
  background:rgba(34,197,94,0.09);
  box-shadow:0 0 0 3px rgba(34,197,94,0.13);
}
.pay-opt .pname{font-weight:700; display:block;}
.pay-opt .psub{font-size:9.5px; color:var(--text-dim); margin-top:3px; display:block;}

.summary{
  margin-top:18px; padding:15px 16px;
  border-radius:var(--r-md); background:var(--bg);
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.summary .label{font-size:11.5px; color:var(--text-dim);}
.summary .val{font-family:var(--f-mono); font-size:20px; font-weight:700; color:var(--usdt);}

.submit-btn,.confirm-btn,.search-btn,.ref-btn,.goto-btn,.lookup-row button,.ex-btn,.copy-btn{
  font-family:var(--f-body); font-weight:700; cursor:pointer;
  border-radius:var(--r-md); transition:filter .16s,transform .1s,opacity .16s;
}
.submit-btn:active,.confirm-btn:active,.search-btn:active,.ref-btn:active{transform:scale(.985);}
.submit-btn:hover,.confirm-btn:hover,.ref-btn:hover{filter:brightness(1.08);}

.submit-btn,.confirm-btn,.ref-btn{
  width:100%; margin-top:15px; padding:16px; border:none;
  background:linear-gradient(140deg,var(--purple),var(--purple-lt));
  color:#fff; font-size:15px; min-height:52px;
  box-shadow:0 10px 28px rgba(99,102,241,0.32);
}
.submit-btn:disabled,.confirm-btn:disabled{opacity:.55; cursor:not-allowed; box-shadow:none;}

.search-btn,.goto-btn{
  width:100%; margin-top:14px; padding:14px; border:none;
  background:linear-gradient(140deg,var(--blue),var(--blue-lt));
  color:#fff; font-size:14px; min-height:48px;
  box-shadow:0 8px 22px rgba(14,165,233,0.28);
}
.goto-btn{display:block; text-align:center; text-decoration:none;}

.lookup-box{
  margin-top:16px; background:var(--panel);
  border:1px solid var(--line); border-radius:var(--r-lg);
  padding:16px 18px;
}
.lookup-box .t{font-size:12.5px; font-weight:700; margin-bottom:11px;}
.lookup-row{display:flex; gap:8px;}
.lookup-row input{flex:1; font-size:13px; padding:11px 13px; border-radius:var(--r-sm);}
.lookup-row button{
  background:var(--panel-3); color:var(--text);
  border:1px solid var(--line-2); border-radius:var(--r-sm);
  padding:0 18px; font-size:12px; min-height:44px; flex-shrink:0;
}
.lookup-row button:hover{background:var(--panel-2); border-color:var(--line-3);}
.lookup-result{margin-top:11px; font-size:12px; color:var(--text-dim); display:none;}
.lookup-result.show{display:block;}

/* ---------- 9. 最近订单列表 ---------- */
.recent-sec,.lb-sec,.ex-sec{margin-top:32px;}
.recent-title,.lb-title,.ex-title{
  font-family:var(--f-display); font-size:15px; font-weight:700; margin-bottom:12px;
}
.recent-list{display:flex; flex-direction:column; gap:8px;}
.recent-row{
  display:flex; align-items:center; gap:10px;
  background:var(--panel); border-radius:var(--r-md);
  padding:12px 14px; border:1px solid var(--line);
}
.recent-avatar{
  width:28px; height:28px; border-radius:9px; flex-shrink:0;
  background:linear-gradient(140deg,var(--purple),var(--purple-lt));
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; color:#fff;
}
.recent-info{flex:1; font-size:11.5px; font-family:var(--f-mono); min-width:0; overflow:hidden; text-overflow:ellipsis;}
.recent-status,.status-badge,.row-badge{
  font-size:9.5px; font-weight:700; padding:4px 9px;
  border-radius:var(--r-full); white-space:nowrap; flex-shrink:0;
}
.recent-status.paid,.status-badge.done,.row-badge.fulfilled{background:rgba(34,197,94,0.14); color:var(--usdt); border:1px solid rgba(34,197,94,0.26);}
.recent-status.pending,.status-badge.pending{background:rgba(251,191,36,0.14); color:var(--gold); border:1px solid rgba(251,191,36,0.26);}
.status-badge.paid,.row-badge.paid{background:rgba(14,165,233,0.14); color:var(--blue-lt); border:1px solid rgba(14,165,233,0.26);}
.status-badge.fail{background:rgba(248,113,113,0.14); color:var(--danger); border:1px solid rgba(248,113,113,0.26);}

/* ---------- 10. 结算页 ---------- */
.tracker{display:flex; align-items:flex-start; margin:30px 0 22px; padding:0 4px;}
.step{flex:1; text-align:center; position:relative; min-width:0;}
.step-dot{
  width:28px; height:28px; border-radius:50%;
  margin:0 auto 9px; position:relative; z-index:2;
  background:var(--panel); border:2px solid var(--line-3);
  display:flex; align-items:center; justify-content:center;
  font-size:11.5px; font-weight:700; color:var(--text-faint);
  transition:.3s;
}
/* 连接线绝对定位在圆点之间，不占布局空间 */
.step-line{
  position:absolute; top:14px; left:-50%; width:100%; height:2px;
  background:var(--line-2); z-index:1;
}
.step:first-child .step-line{display:none;}
.step-label{
  font-size:10px; line-height:1.45; color:var(--text-faint);
  padding:0 2px; word-break:keep-all;
}
.step.active .step-dot{
  border-color:var(--purple); color:#fff;
  background:linear-gradient(140deg,var(--purple),var(--purple-lt));
  box-shadow:0 0 0 5px rgba(99,102,241,0.18);
}
.step.active .step-label{color:var(--text); font-weight:700;}
.step.done .step-dot{background:var(--usdt); border-color:var(--usdt); color:#020617; box-shadow:0 0 10px rgba(34,197,94,0.45);}
.step.done .step-line{background:var(--usdt);}
.step.done .step-label{color:var(--text-dim);}

.order-card,.result-card,.pay-panel,.addr-box,.qr-box,.waiting-box,.success-box,.ex-card,.contact-card{
  background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--e1);
}
.order-card{padding:20px; margin-bottom:16px;}
.oc-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 0; font-size:13px;
}
.oc-row + .oc-row{border-top:1px solid var(--line);}
.oc-row .k{color:var(--text-dim); flex-shrink:0;}
.oc-row .v{font-weight:700; text-align:right; min-width:0; word-break:break-all;}
.oc-total{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  margin-top:14px; padding-top:14px; border-top:1px solid var(--line-2);
}
.oc-total .k{font-size:12.5px; color:var(--text-dim);}
.oc-total .v{
  font-family:var(--f-mono); font-size:25px; font-weight:700; color:var(--usdt);
  font-variant-numeric:tabular-nums;
}

.timer{
  font-family:var(--f-mono); font-weight:700;
  color:var(--gold); letter-spacing:.5px;
}
.amount-warn{
  margin-top:12px; padding:11px 14px; border-radius:var(--r-md);
  background:rgba(251,191,36,0.08); border:1px solid rgba(251,191,36,0.24);
  font-size:11.5px; line-height:1.65; color:#fde68a;
}

.pay-panel{padding:18px; margin-top:16px;}
.pay-net{
  display:inline-block; font-size:10.5px; font-weight:700;
  padding:4px 10px; border-radius:var(--r-full);
  background:rgba(34,197,94,0.13); color:var(--usdt);
  border:1px solid rgba(34,197,94,0.26);
}
.addr-box{
  margin-top:12px; padding:13px 14px;
  display:flex; align-items:center; gap:10px;
  background:var(--bg);
}
.addr-text{
  flex:1; min-width:0; font-family:var(--f-mono); font-size:12px;
  word-break:break-all; line-height:1.55;
}
.copy-btn{
  flex-shrink:0; background:var(--panel-3); color:var(--text);
  border:1px solid var(--line-2); border-radius:var(--r-sm);
  padding:9px 14px; font-size:11.5px; min-height:40px;
}
.copy-btn:hover{background:var(--panel-2);}
.copy-btn.copied{background:rgba(34,197,94,0.16); color:var(--usdt); border-color:rgba(34,197,94,0.4);}

.qr-box{padding:16px; margin-top:12px; text-align:center;}
.qr-box img{max-width:190px; width:100%; border-radius:var(--r-md); background:#fff; padding:8px;}

.waiting-box,.success-box{display:none; padding:22px; margin-top:16px; text-align:center;}
.waiting-box.show,.success-box.show{display:block; animation:feedIn .4s ease;}
.success-box.show{border-color:rgba(34,197,94,0.34); box-shadow:0 0 0 3px rgba(34,197,94,0.10);}
.success-icon{
  width:52px; height:52px; margin:0 auto 14px; border-radius:50%;
  background:linear-gradient(140deg,var(--usdt),#4ade80); color:#020617;
  display:flex; align-items:center; justify-content:center;
  font-size:26px; font-weight:900;
  box-shadow:0 0 24px rgba(34,197,94,0.4);
}
.spinner{
  width:26px; height:26px; margin:0 auto 12px;
  border:2.5px solid var(--line-2); border-top-color:var(--purple);
  border-radius:50%; animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}
.tg-notify{
  margin-top:14px; padding:12px 14px; border-radius:var(--r-md);
  background:rgba(14,165,233,0.09); border:1px solid rgba(14,165,233,0.26);
  font-size:11.5px; line-height:1.65; color:#bae6fd;
}

/* ---------- 11. 返佣页 ---------- */
.ref-link-box{
  margin-top:14px; padding:13px 14px;
  background:var(--bg); border:1px solid var(--line-2);
  border-radius:var(--r-md); display:flex; align-items:center; gap:10px;
}
.ref-link-text{flex:1; min-width:0; font-family:var(--f-mono); font-size:11.5px; word-break:break-all;}
.ref-copy{
  flex-shrink:0; background:var(--panel-3); color:var(--text);
  border:1px solid var(--line-2); border-radius:var(--r-sm);
  padding:9px 14px; font-size:11.5px; font-weight:700; cursor:pointer;
  font-family:var(--f-body); min-height:40px;
}
.ref-result{margin-top:12px; font-size:12px; color:var(--text-dim); display:none;}
.ref-result.show{display:block;}
.ref-earn-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 0; font-size:13px;
}
.ref-earn-row + .ref-earn-row{border-top:1px solid var(--line);}
.ref-earn .v{
  font-family:var(--f-mono); font-size:18px; font-weight:700; color:var(--gold);
  font-variant-numeric:tabular-nums;
}
.ref-card .big{font-family:var(--f-mono); font-size:13px; font-weight:700; color:var(--gold);}
.rule-list{margin-top:14px; display:flex; flex-direction:column; gap:9px;}
.rule-list li{
  list-style:none; font-size:12px; color:var(--text-dim);
  line-height:1.65; padding-left:18px; position:relative;
}
.rule-list li::before{content:'—'; position:absolute; left:0; color:var(--gold);}
.prod-links{display:flex; gap:9px; margin-top:14px; flex-wrap:wrap;}

.lb-list{display:flex; flex-direction:column; gap:8px;}
.lb-row{
  display:flex; align-items:center; gap:12px;
  background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r-md); padding:12px 14px;
}
.lb-row.top{
  background:linear-gradient(140deg,rgba(251,191,36,0.10),var(--panel) 70%);
  border-color:rgba(251,191,36,0.28);
}
.lb-rank{
  width:24px; height:24px; border-radius:8px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--f-mono); font-size:11px; font-weight:700;
  background:var(--panel-3); color:var(--text-dim);
}
.lb-rank.gold{background:linear-gradient(140deg,var(--gold),#f59e0b); color:#020617;}
.lb-name{flex:1; font-size:13px; font-weight:700; min-width:0; overflow:hidden; text-overflow:ellipsis;}
.lb-count{font-family:var(--f-mono); font-size:13px; font-weight:700; color:var(--gold);}
.lb-live{display:flex; align-items:center; gap:6px; font-size:11px; color:var(--usdt); font-weight:700;}

.ex-list{display:flex; flex-direction:column; gap:12px;}
.ex-card{padding:18px 20px;}
.ex-head{display:flex; align-items:center; gap:12px;}
.ex-logo{
  width:40px; height:40px; border-radius:12px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:var(--panel-3);
}
.ex-name{font-family:var(--f-display); font-size:16px; font-weight:700;}
.ex-sub{font-size:11px; color:var(--text-dim); margin-top:3px;}
.ex-tag{
  margin-left:auto; font-size:9.5px; font-weight:900;
  padding:4px 10px; border-radius:var(--r-full);
  background:linear-gradient(140deg,#f97316,#fb923c); color:#fff;
}
.ex-desc{font-size:12px; color:var(--text-dim); margin-top:12px; line-height:1.65;}
.ex-code{
  font-family:var(--f-mono); font-size:13px; font-weight:700;
  color:var(--gold); letter-spacing:1px;
}
.ex-actions{display:flex; gap:9px; margin-top:14px;}
.ex-btn{
  flex:1; text-align:center; text-decoration:none;
  padding:11px; font-size:12.5px; min-height:44px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid transparent;
}
.ex-btn.primary{background:linear-gradient(140deg,var(--gold),#f59e0b); color:#020617; border:none;}
.ex-btn.ghost{background:transparent; color:var(--text); border-color:var(--line-2);}
.ex-btn.ghost:hover{border-color:var(--line-3); background:rgba(148,163,184,0.06);}

/* ---------- 12. 订单查询 ---------- */
.search-card{padding:20px;}
.result{display:none;}
.result.show{display:block; animation:feedIn .4s ease;}
.result-card{padding:18px 20px; margin-top:16px;}
.r-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 0; font-size:13px;
}
.r-row + .r-row{border-top:1px solid var(--line);}
.r-row .k{color:var(--text-dim); flex-shrink:0;}
.r-row .v{
  font-weight:700; font-family:var(--f-mono); font-size:12.5px;
  text-align:right; min-width:0; word-break:break-all;
}
.empty{display:none;}
.empty.show{display:block;}

.contact-grid{display:flex; flex-direction:column; gap:10px; margin-top:14px;}
.contact-card{
  display:flex; align-items:center; gap:12px;
  padding:14px 16px; border-radius:var(--r-md);
  text-decoration:none; color:inherit;
  transition:border-color .16s;
}
.contact-card:hover{border-color:var(--line-3);}
.contact-icon{
  width:36px; height:36px; border-radius:11px; flex-shrink:0;
  background:rgba(148,163,184,0.09);
  display:flex; align-items:center; justify-content:center; font-size:15px;
}
.contact-card .name{font-size:11.5px; color:var(--text-dim);}
.contact-card .val{font-size:13.5px; font-weight:700; margin-top:3px;}

/* ---------- 13. 后台 ---------- */
.head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:22px;}

.auth{
  background:var(--panel); border:1px solid var(--line-2);
  border-radius:var(--r-xl); padding:26px; text-align:center;
  box-shadow:var(--e2);
}
.auth .ic{
  width:52px; height:52px; margin:0 auto 14px; border-radius:16px;
  background:linear-gradient(140deg,var(--gold),#f59e0b);
  display:flex; align-items:center; justify-content:center; font-size:22px;
  box-shadow:0 8px 22px rgba(251,191,36,0.28),inset 0 1px 0 rgba(255,255,255,0.25);
}
.auth h2{font-family:var(--f-display); font-size:17px; font-weight:700;}
.auth p{font-size:11.5px; color:var(--text-dim); margin-top:8px; line-height:1.7;}
.auth input{
  width:100%; margin-top:16px; background:var(--bg);
  border:1px solid var(--line-2); color:var(--text);
  font-size:14px; padding:13px 14px; border-radius:var(--r-md);
  font-family:var(--f-mono); text-align:center; letter-spacing:2px;
  transition:border-color .15s,box-shadow .15s;
}
.auth input:focus{outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(251,191,36,0.15);}
.auth button{
  width:100%; margin-top:14px; padding:15px; border:none;
  border-radius:var(--r-md); min-height:50px;
  background:linear-gradient(140deg,var(--gold),#f59e0b); color:#020617;
  font-size:14px; font-weight:700; cursor:pointer; font-family:var(--f-body);
  box-shadow:0 8px 22px rgba(251,191,36,0.26);
  transition:filter .16s,transform .1s;
}
.auth button:hover{filter:brightness(1.06);}
.auth button:active{transform:scale(.985);}

/* 未授权前必须隐藏，否则大盘骨架会先闪出来 */
.dash{display:none;}
.dash.show{display:block;}

.cost-form{display:flex; gap:7px; margin-top:10px;}
.cost-form input{
  flex:1; min-width:0; background:var(--bg);
  border:1px solid var(--line-2); color:var(--text);
  font-size:12px; padding:10px 11px; border-radius:var(--r-sm);
  font-family:var(--f-mono);
}
.cost-form input:focus{outline:none; border-color:var(--purple);}
.cost-form button{
  background:var(--purple); color:#fff; border:none;
  border-radius:var(--r-sm); padding:0 16px; min-height:40px;
  font-size:11.5px; font-weight:700; cursor:pointer; font-family:var(--f-body);
}
.cost-form button:hover{background:var(--purple-lt);}
.tip{margin-top:20px; font-size:10.5px; color:var(--text-dim); line-height:1.85;}
.kpi-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px;}
.kpi{
  background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r-md); padding:15px 12px;
}
.kpi .k{font-size:10.5px; color:var(--text-dim); font-weight:700;}
.kpi .v{
  font-family:var(--f-mono); font-size:22px; font-weight:700;
  margin-top:6px; line-height:1;
  font-variant-numeric:tabular-nums;
}
.kpi .sub{font-size:10px; color:var(--text-dim); margin-top:5px;}
.kpi .l{font-size:10px; color:var(--text-dim); margin-top:6px;}
.kpi.rev{border-color:rgba(14,165,233,0.28);}
.kpi.rev .v{color:var(--blue-lt);}
.kpi.cost{border-color:rgba(248,113,113,0.26);}
.kpi.cost .v{color:var(--danger);}
.kpi.profit{border-color:rgba(34,197,94,0.28);}
.kpi.profit .v{color:var(--usdt); font-size:28px;}

.auth .err{display:none; margin-top:12px; font-size:12px; color:var(--danger);}
.auth .err.show{display:block;}
.row-money .in{color:var(--text);}
.row-money .out{color:var(--danger);}
.row-money .pf{color:var(--usdt); font-weight:700;}
.row-money .none{color:var(--text-faint);}

.ledger{display:flex; flex-direction:column; gap:8px; margin-top:12px;}
.row{
  background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r-md); padding:13px 15px;
}
.row-top{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.row-user{font-family:var(--f-mono); font-size:12.5px; font-weight:700; min-width:0; overflow:hidden; text-overflow:ellipsis;}
.row-meta{font-size:10.5px; color:var(--text-dim); margin-top:5px;}
.row-money{font-family:var(--f-mono); font-size:13px; font-weight:700; flex-shrink:0;}
.warn{
  display:none; margin-top:12px; padding:11px 14px;
  border-radius:var(--r-md); font-size:12px;
  background:rgba(248,113,113,0.10); border:1px solid rgba(248,113,113,0.28);
  color:#fca5a5;
}
.warn.show{display:block;}

/* ---------- 14. 页脚 ---------- */
footer{margin-top:38px; padding-top:18px; border-top:1px solid var(--line);}
footer p{font-size:10.5px; color:var(--text-faint); line-height:1.85;}

/* ---------- 15. 窄屏 ---------- */
@media (max-width:380px){
  .wrap{padding-left:16px; padding-right:16px;}
  .hero h1{font-size:24px;}
  .price{font-size:24px;}
  .kpi-grid{grid-template-columns:1fr; }
  .pay-grid{grid-template-columns:1fr;}
}

/* 无导航栏的页面（后台）需要自己留出顶部安全区 */
.bg-glow + .wrap{padding-top:calc(26px + env(safe-area-inset-top));}

/* ============================================================
   16. 套餐卡（file 18 样式）
   ============================================================ */

/* 当前页高亮：白色胶囊，和其它导航项拉开层级 */
.nav-links a.on{background:#fff; color:var(--bg);}
.nav-links a.on:hover{background:#fff; color:var(--bg);}

/* logo 在窄屏会被挤成两行，强制单行 */
.brand,.back{white-space:nowrap; flex-shrink:0;}

.tier-card{
  margin-top:18px; padding:22px 20px;
  background:var(--panel); border-radius:var(--r-xl);
  border:1.5px solid var(--line-2);
  box-shadow:var(--e2);
  transition:border-color .18s,box-shadow .18s;
}
.tier-card.accent-blue{
  border-color:rgba(14,165,233,0.34);
  box-shadow:0 0 26px rgba(14,165,233,0.10),var(--e2);
}
.tier-card.accent-purple{
  border-color:rgba(99,102,241,0.34);
  box-shadow:0 0 26px rgba(99,102,241,0.12),var(--e2);
}
.tier-card.accent-gold{
  border-color:rgba(251,191,36,0.32);
  box-shadow:0 0 26px rgba(251,191,36,0.10),var(--e2);
}

.tier-head{display:flex; align-items:center; gap:10px; margin-bottom:16px;}
.tier-mark{
  width:30px; height:30px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:15px; font-weight:900;
}
.tier-mark.blue{background:var(--blue); color:#fff;}
.tier-mark.purple{background:var(--purple); color:#fff;}
.tier-mark.gold{background:transparent; color:var(--gold); font-size:21px;}
.tier-name{font-family:var(--f-display); font-size:20px; font-weight:700;}
.tier-badge{
  margin-left:auto; flex-shrink:0;
  font-size:11px; font-weight:900; letter-spacing:.5px;
  padding:6px 12px; border-radius:var(--r-sm);
}
.tier-badge.hot{background:rgba(99,102,241,0.22); color:var(--purple-lt); border:1px solid rgba(99,102,241,0.4);}
.tier-badge.rec{background:linear-gradient(140deg,var(--gold),#f59e0b); color:#020617;}

/* 权益清单 */
.perks{
  background:var(--bg); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:16px 18px;
  display:flex; flex-direction:column; gap:11px;
}
.perks li{
  list-style:none; position:relative; padding-left:16px;
  font-size:13px; line-height:1.55; color:var(--text);
}
.perks li::before{
  content:''; position:absolute; left:2px; top:8px;
  width:4px; height:4px; border-radius:50%; background:var(--text-faint);
}
.tier-card.accent-blue .perks li::before{background:var(--blue);}
.tier-card.accent-purple .perks li::before{background:var(--purple-lt);}
.tier-card.accent-gold .perks li::before{background:var(--gold);}

/* 三档时长横排 —— 一屏看完，不用滚 */
.dur-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:16px;}
.dur{
  position:relative; cursor:pointer; text-align:center;
  background:var(--bg); border:1.5px solid var(--line-2);
  border-radius:var(--r-lg); padding:16px 6px 18px;
  transition:border-color .16s,box-shadow .16s,background .16s;
}
.dur:hover{border-color:var(--line-3);}
.dur .dur-len{font-size:12px; color:var(--text-dim); margin-bottom:7px;}
.dur .dur-price{
  font-family:var(--f-display); font-size:23px; font-weight:900; color:#fff;
  line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.5px;
}
.dur .dur-price small{font-size:14px; font-weight:700; margin-left:1px;}
.dur.selected{
  border-color:var(--purple); background:rgba(99,102,241,0.09);
  box-shadow:0 0 0 3px rgba(99,102,241,0.14);
}
.dur.selected .dur-price{color:var(--purple-lt);}
.dur .ref-badge{top:-9px; right:auto; left:50%; transform:translateX(-50%);}

/* 底部结算条 —— 选完套餐不用滚回去找按钮 */
body.has-cta{padding-bottom:calc(92px + env(safe-area-inset-bottom));}
.cta-bar{
  position:fixed; z-index:30;
  left:14px; right:14px; bottom:calc(14px + env(safe-area-inset-bottom));
  max-width:532px; margin:0 auto;
  background:rgba(11,18,34,0.92);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid var(--line-2); border-radius:var(--r-lg);
  padding:12px 12px 12px 18px;
  display:flex; align-items:center; gap:12px;
  box-shadow:var(--e3);
}
.cta-info{flex:1; min-width:0;}
.cta-label{font-size:13.5px; font-weight:700; line-height:1.35;}
.cta-sub{font-size:11px; color:var(--text-dim); margin-top:3px;}
.cta-go{
  flex-shrink:0; border:none; cursor:pointer;
  font-family:var(--f-body); font-size:14px; font-weight:700;
  padding:13px 20px; min-height:46px; border-radius:var(--r-md);
  background:var(--panel-3); color:var(--text-faint);
  transition:.18s;
}
.cta-bar.ready .cta-go{
  background:linear-gradient(140deg,var(--purple),var(--purple-lt));
  color:#fff; box-shadow:0 8px 22px rgba(99,102,241,0.34);
}
.cta-bar.ready .cta-go:active{transform:scale(.97);}

/* 首页三条流程说明 */
.guide{margin-top:26px; display:flex; flex-direction:column; gap:13px;}
.guide li{
  list-style:none; display:flex; align-items:flex-start; gap:11px;
  font-size:13.5px; line-height:1.6; color:var(--text);
}
.guide .gi{
  width:22px; flex-shrink:0; text-align:center; font-size:15px; line-height:1.45;
}

@media (max-width:360px){
  .dur{padding:14px 4px 15px;}
  .dur .dur-price{font-size:20px;}
  .cta-go{padding:13px 15px; font-size:13px;}
}

/* 时长格内的划线原价 */
.dur .strike{display:block; margin-top:7px; font-size:10px; text-align:center;}
/* 小格子里不放勾选圆点，太挤 */
.dur.selected::after{display:none;}

/* ============================================================
   17. 最近订单卡片（改为独立卡片式）
   ============================================================ */
.feed-box{background:transparent; border:none; box-shadow:none; border-radius:0; overflow:visible; margin-top:30px;}
.feed-head{
  border-bottom:none; padding:0 2px 14px;
}
.feed-head .t{font-family:var(--f-display); font-size:19px; font-weight:900; letter-spacing:-.3px;}

.feed-list{
  max-height:none; overflow:visible;
  display:flex; flex-direction:column; gap:12px;
}
.feed-list::after{display:none;}

.feed-item{
  display:block; padding:18px 18px 16px;
  background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--e1);
  animation:feedIn .45s ease;
}
.feed-item::before{display:none;}
.feed-item + .feed-item{border-top:1px solid var(--line);}

.feed-r1{display:flex; align-items:center; gap:13px;}
.feed-item .av{
  width:38px; height:38px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:15px; font-weight:900; color:#fff;
  background:linear-gradient(150deg,var(--panel-3),#0f1729);
  border:1px solid var(--line-2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.06);
}
.feed-item .av.tg,.feed-item .av.x{background:linear-gradient(150deg,var(--panel-3),#0f1729);}
.feed-item .who{
  flex:1; min-width:0; font-size:15px; font-weight:500;
  color:var(--text); font-family:var(--f-body);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.feed-item .who b{font-family:var(--f-mono); font-weight:700;}

.feed-r2{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-top:14px;
}
.feed-item .st{
  font-size:12px; font-weight:700;
  padding:7px 15px; border-radius:var(--r-full);
}
.feed-item .st.done{background:rgba(34,197,94,0.08); color:#4ade80; border:1px solid rgba(34,197,94,0.42);}
.feed-item .st.wait{background:rgba(251,191,36,0.08); color:var(--gold); border:1px solid rgba(251,191,36,0.42);}
.feed-item .when{font-size:12.5px; color:var(--text-faint); margin-top:0;}

/* ---------- 页脚政策链接 ---------- */
.foot-links{
  display:flex; align-items:center; justify-content:center;
  flex-wrap:wrap; gap:6px 14px; margin-bottom:16px;
}
.foot-links a{
  font-size:12.5px; color:var(--text-dim);
  text-decoration:none; padding:4px 2px; transition:color .15s;
}
.foot-links a:hover{color:var(--text);}
.foot-links span{color:var(--line-3); font-size:12px;}
.foot-copy{
  text-align:center; font-size:12px;
  color:var(--text-faint); margin-bottom:14px;
}

/* ============================================================
   18. 结算页修正 —— 呼吸感、上一步按钮、TG 通知卡
   ============================================================ */

/* 各块之间拉开距离，原来挤在一起 */
.order-card{padding:22px 20px; margin-bottom:20px;}
.oc-row{padding:13px 0; font-size:13.5px;}
.oc-total{margin-top:16px; padding-top:18px;}
.timer{
  display:block; margin:20px 0; padding:15px 16px;
  border-radius:var(--r-md); text-align:center;
  background:rgba(251,191,36,0.07); border:1px solid rgba(251,191,36,0.24);
  font-size:13px; line-height:1.6; color:#fde68a;
  font-family:var(--f-body); font-weight:500;
}
.timer .t{font-family:var(--f-mono); font-size:16px; font-weight:700; color:var(--gold); letter-spacing:.5px;}
.pay-panel{padding:22px 20px; margin-top:20px;}
.addr-box{padding:14px; margin-top:14px;}
.amount-warn{margin-top:16px; padding:13px 15px; font-size:12px;}
.qr-box{padding:18px; margin-top:14px;}

/* 「上一步」恢复成整宽按钮，与主按钮同等分量 */
.back-btn{
  display:block; width:100%; margin-top:12px;
  padding:16px; min-height:52px;
  border-radius:var(--r-md); text-align:center;
  background:transparent; color:var(--text-dim);
  border:1px solid var(--line-2);
  font-size:14.5px; font-weight:700; text-decoration:none;
  transition:.16s;
}
.back-btn:hover{color:var(--text); border-color:var(--line-3); background:rgba(148,163,184,0.06);}

/* TG 通知卡：原来是裸链接，蓝色下划线 */
.tg-notify{
  display:flex; align-items:center; gap:12px;
  margin-top:18px; padding:15px 16px;
  border-radius:var(--r-lg); text-decoration:none; color:inherit;
  background:linear-gradient(140deg,rgba(99,102,241,0.14),var(--panel) 72%);
  border:1px solid rgba(99,102,241,0.34);
  transition:transform .16s;
}
.tg-notify:active{transform:scale(.99);}
.tg-notify .ic{
  width:38px; height:38px; border-radius:12px; flex-shrink:0;
  background:linear-gradient(140deg,var(--purple),var(--purple-lt));
  display:flex; align-items:center; justify-content:center; font-size:18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.22);
}
.tg-notify .t{font-size:13px; font-weight:700; color:var(--text);}
.tg-notify .s{font-size:11px; color:var(--text-dim); margin-top:4px; line-height:1.55;}
