/* ===== 配色严格对照截图 ===== */
:root{
  --bg:#0a0b0a;            /* 页面近黑背景 */
  --surface:#161816;       /* 卡片底 */
  --surface2:#1e211e;      /* 图标块底 */
  --line:#242824;
  --green:#5ce62e;         /* 主荧光绿 */
  --green-hi:#7bee45;
  --green-deep:#2fb61f;
  --green-dark:#0e1c0b;    /* 绿底上的深色文字/按钮 */
  --text:#f3f5f2;
  --muted:#8f978d;
  --red:#ff5a5a;
  --amber:#ffc24d;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{font-size:16px}
body{
  background:var(--bg);color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  max-width:480px;margin:0 auto;min-height:100vh;padding-bottom:96px;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none}
input,select,textarea{font-family:inherit}

/* ===== 顶栏 ===== */
.topbar{display:flex;justify-content:space-between;align-items:center;padding:14px 14px 8px}
.pill{
  display:inline-flex;align-items:center;gap:6px;
  background:#121412;border:1px solid #1f231f;border-radius:22px;
  color:var(--green);font-weight:700;font-size:.95rem;padding:10px 20px;
}
.pill.small{padding:7px 14px;font-size:.82rem;font-weight:600;border:1px solid #2c3c28}
.pill .dot{width:8px;height:8px;border-radius:50%;background:var(--green)}

/* ===== 公告跑马灯 ===== */
.notice{
  margin:8px 12px;background:#121412;border-radius:10px;
  display:flex;align-items:center;gap:8px;padding:10px 12px;overflow:hidden;
  font-size:.85rem;color:#cfd6cc;
}
.notice .spk{color:var(--green);flex:none}
.marquee{white-space:nowrap;overflow:hidden;flex:1}
.marquee span{display:inline-block;padding-left:100%;animation:mq 14s linear infinite}
@keyframes mq{to{transform:translateX(-100%)}}

/* ===== 资产卡（绿色渐变）===== */
.asset{
  margin:10px 12px;border-radius:18px;padding:16px;
  background:linear-gradient(135deg,#6fe93c 0%,#3ecb22 60%,#2eb51c 100%);
  color:var(--green-dark);position:relative;overflow:hidden;
}
.asset::after{ /* 右侧淡纹理光斑 */
  content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;
  background:radial-gradient(circle,rgba(255,255,255,.28),transparent 70%);
}
.asset .row1{display:flex;justify-content:space-between;align-items:center}
.asset .label{display:flex;align-items:center;gap:6px;font-size:.8rem;font-weight:800;letter-spacing:.06em;color:#123a0c}
.badge-pro{
  background:rgba(10,30,7,.85);color:var(--green);font-size:.66rem;font-weight:800;
  letter-spacing:.08em;padding:5px 10px;border-radius:8px;
}
.asset .amount{font-size:1.9rem;font-weight:900;margin:14px 0 4px;display:flex;align-items:center;gap:10px;color:#0c2a08}
.asset .amount .eye{background:none;font-size:1.1rem;color:#12400c;opacity:.75}
.asset .row2{display:flex;justify-content:flex-end;gap:10px;margin-top:2px;position:relative;z-index:1}
.btn-ghost{
  background:rgba(255,255,255,.28);color:#0c2a08;font-weight:700;font-size:.82rem;
  border-radius:10px;padding:9px 14px;display:inline-flex;align-items:center;gap:5px;
}
.btn-black{
  background:#0c130b;color:#fff;font-weight:700;font-size:.82rem;
  border-radius:10px;padding:9px 18px;
}

/* ===== 功能图标行 ===== */
.feats{display:flex;justify-content:space-between;padding:14px 22px 4px}
.feat{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:.74rem;color:#c9d1c6;background:none;border:none;padding:0}
.feat .ic{
  width:56px;height:56px;border-radius:16px;background:#161a15;
  display:flex;align-items:center;justify-content:center;font-size:1.35rem;color:#5ce62e;
}
.feat .ic svg{width:27px;height:27px;stroke-width:2.2}

/* ===== Reward 横幅 ===== */
.reward{
  margin:14px 12px;border-radius:16px;padding:14px 16px;
  background:linear-gradient(90deg,#61e532 0%,#37c41d 100%);
  display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--green-dark);
}
.reward .amt{font-size:1.5rem;font-weight:900;line-height:1;color:#0c2a08}
.reward .amt small{display:block;font-size:.6rem;font-weight:800;letter-spacing:.14em;margin-top:4px}
.reward .mid{flex:1;padding-left:12px}
.reward .mid b{font-size:1.05rem;font-weight:900;letter-spacing:.02em;color:#0c2a08}
.reward .mid p{font-size:.72rem;font-weight:600;color:#1d4a15;margin-top:2px}
.btn-claim{
  background:#0c130b;color:#fff;font-weight:800;font-size:.85rem;
  border-radius:22px;padding:11px 20px;display:inline-flex;align-items:center;gap:6px;flex:none;
}
.btn-claim .arr{color:var(--green)}

/* ===== 成交播报 ===== */
.live{
  margin:0 12px;background:#121412;border-radius:12px;padding:12px 14px;
  display:flex;justify-content:space-between;align-items:center;font-size:.85rem;overflow:hidden;
}
.live .who{color:#aeb6ab}.live .who b{color:#e8ece6;font-weight:600}
.live .val{color:var(--green);font-weight:800}
.live .tag{display:flex;align-items:center;gap:5px;font-size:.62rem;color:var(--green);font-weight:800;letter-spacing:.1em;margin-bottom:3px;justify-content:flex-end}
.live .tag .dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green)}

/* ===== Marketplace ===== */
.mkt-head{display:flex;justify-content:space-between;align-items:center;padding:18px 14px 10px}
.mkt-head h2{font-size:1.15rem;font-weight:800;display:flex;align-items:center;gap:8px}
.mkt-head h2::before{content:"";width:4px;height:18px;border-radius:2px;background:var(--green)}
.tabs{display:flex;background:#121412;border-radius:20px;padding:3px;gap:2px}
.tab{padding:6px 13px;border-radius:17px;font-size:.78rem;color:#a7afa4;font-weight:600;background:none}
.tab.on{background:#fff;color:#0b0d0a}

.card-list{padding:4px 12px}
.card-item{
  background:var(--surface);border-radius:16px;padding:16px 14px;margin-bottom:12px;
  display:flex;align-items:center;gap:12px;
}
.card-item .fav{color:#3a403a;font-size:1.15rem;background:none}
.card-icon{
  width:52px;height:52px;border-radius:12px;background:#fff;flex:none;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  font-weight:900;font-size:1.3rem;color:#111;
}
.card-icon img{width:100%;height:100%;object-fit:contain;padding:6px}
.card-item .info{flex:1}
.card-item .info b{font-size:1.02rem;font-weight:800}
.card-item .info p{font-size:.8rem;color:var(--muted);margin-top:4px}
.btn-sell{
  background:linear-gradient(135deg,#6fe93c,#3ecb22);color:#0c2a08;font-weight:800;
  font-size:.9rem;border-radius:22px;padding:10px 20px;display:inline-flex;align-items:center;gap:4px;
}

/* ===== 底部导航 ===== */
.bottomnav{
  position:fixed;bottom:0;left:50%;transform:translateX(-50%);
  width:100%;max-width:480px;background:#0d0f0d;border-top:1px solid #181b18;
  display:flex;justify-content:space-around;align-items:flex-end;
  padding:10px 0 14px;z-index:50;
}
.bn-item{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.62rem;font-weight:800;letter-spacing:.08em;color:#5d655b;width:80px}
.bn-item .i{font-size:1.25rem}
.bn-item.on{color:var(--green)}
.bn-sell{
  width:76px;height:76px;border-radius:50%;margin-top:-38px;
  background:radial-gradient(circle at 35% 30%,#8bf158,#46d426 55%,#2eb51c);
  color:#0c2a08;font-weight:900;font-size:1rem;letter-spacing:.04em;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 26px rgba(92,230,46,.55),0 0 60px rgba(92,230,46,.25);
  border:5px solid #0d0f0d;
}

/* ===== 通用页面 ===== */
.page{padding:16px 14px}
.page h1{font-size:1.3rem;font-weight:800;margin-bottom:16px;display:flex;align-items:center;gap:10px}
.back{color:var(--green);font-size:1.2rem}
.panel{background:var(--surface);border-radius:16px;padding:16px;margin-bottom:14px}
.field{margin-bottom:14px}
.field label{display:block;font-size:.8rem;color:var(--muted);margin-bottom:7px;font-weight:600}
.field input,.field select,.field textarea{
  width:100%;background:#101210;border:1px solid #232723;border-radius:12px;
  color:var(--text);padding:13px 14px;font-size:.95rem;outline:none;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green)}
.field textarea{min-height:90px;resize:vertical}
.btn-main{
  width:100%;background:linear-gradient(135deg,#6fe93c,#3ecb22);color:#0c2a08;
  font-weight:900;font-size:1rem;border-radius:26px;padding:15px;margin-top:6px;
}
.btn-line{width:100%;background:none;border:1px solid #2c332b;color:#cfd6cc;font-weight:700;border-radius:26px;padding:13px;margin-top:10px;display:block;text-align:center}
.hint{font-size:.78rem;color:var(--muted);margin-top:8px;line-height:1.5}
.est{
  background:#12200e;border:1px solid #1e3a17;border-radius:12px;padding:13px;
  display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;
}
.est b{color:var(--green);font-size:1.2rem;font-weight:900}

/* ===== 列表/订单 ===== */
.o-item{background:var(--surface);border-radius:14px;padding:14px;margin-bottom:10px}
.o-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.o-top b{font-size:.95rem}
.status{font-size:.7rem;font-weight:800;padding:4px 10px;border-radius:12px;letter-spacing:.03em}
.st-pending{background:#332a10;color:var(--amber)}
.st-approved{background:#14300e;color:var(--green)}
.st-rejected{background:#331414;color:var(--red)}
.st-paid{background:#14300e;color:var(--green)}
.o-row{display:flex;justify-content:space-between;font-size:.82rem;color:var(--muted);margin-top:4px}
.o-row .v{color:#dfe4dc}
.o-row .v.green{color:var(--green);font-weight:800}
.empty{text-align:center;color:var(--muted);padding:56px 0;font-size:.9rem}
.empty .big{font-size:2.2rem;margin-bottom:10px}

/* ===== flash 提示 ===== */
.flashes{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:99;width:calc(100% - 40px);max-width:440px}
.flash{padding:12px 16px;border-radius:12px;font-size:.87rem;font-weight:600;margin-bottom:8px;animation:fadein .25s}
.flash.ok{background:#14300e;color:var(--green);border:1px solid #1e4a15}
.flash.err{background:#331414;color:#ff8a8a;border:1px solid #4a1e1e}
@keyframes fadein{from{opacity:0;transform:translateY(-8px)}to{opacity:1}}

/* ===== 登录/注册（按设计图）===== */
.auth{padding:20px 24px 40px;min-height:100vh}
.back-circle{
  width:42px;height:42px;border-radius:50%;background:#1d201d;
  display:inline-flex;align-items:center;justify-content:center;
  color:#fff;font-size:1.15rem;
}
.back-text{color:#9aa298;font-size:.9rem;display:inline-flex;align-items:center;gap:5px;padding:8px 0}
.auth-logo{
  width:100px;height:100px;border-radius:26px;margin:34px auto 22px;
  background:#0e120d;border:1px solid #2e5424;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 30px rgba(92,230,46,.12);
}
.auth-logo .mark{
  width:62px;height:62px;border-radius:16px;background:#000;
  display:flex;align-items:center;justify-content:center;
  color:var(--green);font-weight:900;font-size:1.7rem;letter-spacing:-.05em;
}
.auth-h1{text-align:center;font-size:1.65rem;font-weight:800}
.auth-sub{text-align:center;color:var(--muted);font-size:.88rem;margin:9px 0 34px}
.lbl{display:block;color:var(--green);font-size:.72rem;font-weight:800;letter-spacing:.08em;margin-bottom:9px}
.inp{position:relative;margin-bottom:20px}
.inp .ic{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:#69716a;font-size:1rem;pointer-events:none}
.inp input{
  width:100%;background:#15181a;border:1px solid #24282b;border-radius:13px;
  color:var(--text);padding:16px 46px 16px 44px;font-size:.95rem;outline:none;
}
.inp input:focus{border-color:var(--green)}
.inp .eye2{position:absolute;right:13px;top:50%;transform:translateY(-50%);background:none;color:#69716a;font-size:1.05rem}
.auth-row{display:flex;justify-content:space-between;align-items:center;margin:2px 0 26px;font-size:.83rem}
.chk{display:flex;align-items:center;gap:8px;color:#cfd6cc}
.chk input{width:18px;height:18px;accent-color:var(--green)}
.auth-row a{color:#cfd6cc}
.btn-big{
  width:100%;background:#4fdc26;color:#08290a;border-radius:15px;
  padding:17px;font-weight:800;font-size:1.08rem;letter-spacing:.03em;
}
.auth .alt{text-align:center;margin-top:20px;font-size:.86rem;color:var(--muted)}
.auth .alt a{color:var(--green);font-weight:700}
.code-row{display:flex;gap:10px;margin-bottom:20px}
.code-row .inp{flex:1;margin-bottom:0}
.code-row .inp input{padding-left:16px;text-align:left}
.btn-send{
  background:#252b33;color:#8b95a3;border-radius:13px;padding:0 26px;
  font-weight:700;font-size:.9rem;flex:none;
}
.btn-send:disabled{opacity:.55}
.agree{font-size:.72rem;color:var(--muted);text-align:center;margin:6px 0 18px;line-height:1.6}
.agree a{color:var(--green);font-weight:700}

/* ===== TRADE CONSOLE 卖卡页（按设计图）===== */
.tc-head{display:flex;align-items:center;justify-content:center;position:relative;padding:20px 14px}
.tc-head .back{position:absolute;left:14px;color:#fff;font-size:1.4rem}
.tc-head h1{font-size:1.15rem;font-weight:800;letter-spacing:.06em;margin:0}
.tc{padding:0 14px 40px}
.tc-selects{display:flex;gap:12px;margin-bottom:14px}
.tc-sel{
  flex:1;background:#14171a;border:1px solid #23272b;border-radius:14px;
  padding:12px 14px;cursor:pointer;position:relative;min-width:0;
}
.tc-sel .cap{color:#8b93a0;font-size:.66rem;font-weight:700;letter-spacing:.06em;margin-bottom:8px}
.tc-sel .val{display:flex;align-items:center;gap:8px;font-weight:800;font-size:1rem;min-width:0}
.tc-sel .val .txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tc-sel .val .chev{margin-left:auto;color:var(--green);font-size:.8rem;flex:none}
.tc-sel .brand-ic{width:30px;height:30px;border-radius:8px;background:#fff;flex:none;display:flex;align-items:center;justify-content:center;overflow:hidden;font-weight:900;color:#111;font-size:.9rem}
.tc-sel .brand-ic img{width:100%;height:100%;object-fit:contain;padding:3px}
.tc-sel .rcode{font-size:1.15rem;font-weight:900;color:#fff;flex:none}
.tc-sel .rname{color:#8b93a0;font-size:.82rem;font-weight:500;border-left:1px solid #333;padding-left:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.tc-forms{background:#0c0e10;border:1px solid #1c1f22;border-radius:14px;padding:5px;display:flex;gap:4px;margin-bottom:22px}
.tc-form-btn{flex:1;padding:12px;border-radius:11px;background:none;color:#c7cdd4;font-weight:800;font-size:.9rem}
.tc-form-btn.on{background:#4fdc26;color:#08290a}

.tc-cardval-lbl{text-align:center;color:var(--green);font-size:.82rem;font-weight:800;letter-spacing:.08em;margin-bottom:12px}
.tc-amount{
  background:#0c0e10;border:1px solid #1c1f22;border-radius:14px;
  display:flex;align-items:center;padding:20px;margin-bottom:22px;
}
.tc-amount input{
  flex:1;background:none;border:none;outline:none;color:#fff;
  font-size:1.6rem;font-weight:900;text-align:center;min-width:0;
}
.tc-amount input::placeholder{color:#4a5058;font-weight:700;font-size:1.15rem}
.tc-amount .cur{color:#5a616a;font-weight:800;font-size:.95rem;flex:none}

.tc-qty{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:22px}
.tc-qty .lbl{color:#c7cdd4;font-weight:800;font-size:.85rem;letter-spacing:.05em}
.tc-qty .box{display:flex;align-items:center;background:#0c0e10;border:1px solid #1c1f22;border-radius:12px;overflow:hidden}
.tc-qty .box button{width:44px;height:44px;background:#161a1e;color:#fff;font-size:1.3rem;font-weight:700}
.tc-qty .box button:active{background:#4fdc26;color:#08290a}
.tc-qty .box .n{width:56px;text-align:center;font-weight:800;font-size:1.05rem}

.tc-summary{background:#0c0e10;border:1px solid #1c1f22;border-radius:16px;padding:16px;margin-bottom:20px}
.tc-summary .st{color:#8b93a0;font-size:.72rem;font-weight:800;letter-spacing:.08em;margin-bottom:12px}
.tc-summary .body{background:#121519;border-radius:11px;padding:13px 14px;display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.tc-summary .body .lines{font-size:.85rem;line-height:1.7}
.tc-summary .body .lines b{color:#e8ece6;font-weight:700}
.btn-coupon{background:#252b33;color:#8b95a3;border-radius:9px;padding:9px 12px;font-size:.78rem;font-weight:600;display:inline-flex;align-items:center;gap:5px}
.btn-coupon:disabled{opacity:.7;cursor:not-allowed}
.tc-receive{display:flex;justify-content:space-between;align-items:center}
.tc-receive span{color:#8b93a0;font-size:.85rem;font-weight:600}
.tc-receive b{color:var(--green);font-size:1.8rem;font-weight:900}

.tc-upload{display:flex;gap:12px;margin-bottom:20px}
.tc-up-card{
  flex:1;background:#161a20;border:1px solid #222831;border-radius:14px;
  padding:22px 12px;text-align:center;cursor:pointer;
}
.tc-up-card .ic{font-size:1.5rem;color:#c7cdd4;margin-bottom:10px;display:block}
.tc-up-card b{font-size:.9rem;font-weight:700}
.tc-up-card.filled{border-color:var(--green);background:#12210d}
.tc-code-box{margin-bottom:20px}
.tc-code-box .lbl{display:block;color:var(--green);font-size:.72rem;font-weight:800;letter-spacing:.06em;margin-bottom:10px}
.tc-code-box textarea{
  width:100%;background:#0c0e10;border:1px solid #1c1f22;border-radius:12px;
  color:#fff;padding:14px;font-size:.9rem;min-height:90px;resize:vertical;outline:none;
}
.tc-code-box textarea:focus{border-color:var(--green)}
.tc-preview{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.tc-preview img{width:70px;height:70px;object-fit:cover;border-radius:9px;border:1px solid #2a2f28}

.tc-tips{background:#0c0e10;border:1px solid #1c1f22;border-radius:14px;padding:15px;margin-bottom:10px}
.tc-tips b{font-size:.92rem;display:flex;align-items:center;gap:7px;margin-bottom:10px}
.tc-tips ul{list-style:none;font-size:.82rem;color:#9aa199;line-height:1.9}
.tc-tips li{padding-left:14px;position:relative}
.tc-tips li::before{content:"•";position:absolute;left:0;color:var(--green)}

.tc-bottom{
  position:fixed;bottom:0;left:50%;transform:translateX(-50%);
  width:100%;max-width:480px;background:#0d0f0d;border-top:1px solid #181b18;
  display:flex;align-items:center;gap:12px;padding:12px 14px;z-index:50;
}
.tc-bottom .support{width:52px;height:52px;border-radius:14px;background:#161a1e;color:var(--green);display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex:none;border:none}
.tc-bottom .sellnow{flex:1;background:#161a1e;color:#7d858c;border-radius:14px;padding:16px;font-weight:800;font-size:1.05rem;letter-spacing:.05em;text-align:center;border:none}
.tc-bottom .sellnow.ready{background:#4fdc26;color:#08290a}

.tc-sheet-mask{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:80;display:none}
.tc-sheet-mask.show{display:block}
.tc-sheet{
  position:fixed;left:50%;bottom:0;transform:translateX(-50%);
  width:100%;max-width:480px;background:#0f1114;border-radius:20px 20px 0 0;
  max-height:78vh;overflow-y:auto;padding:8px 14px 28px;z-index:81;
}
.tc-sheet h3{text-align:center;padding:16px 0;font-size:1rem;font-weight:800}
.tc-opt{
  display:flex;align-items:center;gap:14px;background:#161a20;border:1px solid #222831;
  border-radius:14px;padding:15px;margin-bottom:10px;cursor:pointer;
}
.tc-opt.sel{border-color:var(--green);box-shadow:0 0 0 1px var(--green)}
.tc-opt .code{color:var(--green);font-weight:900;font-size:1.05rem;width:42px;flex:none}
.tc-opt .nm{flex:1;font-weight:700;font-size:.95rem}
.tc-opt .cur{color:#8b93a0;font-size:.82rem;font-weight:600}
.tc-opt .bic{width:38px;height:38px;border-radius:9px;background:#fff;flex:none;display:flex;align-items:center;justify-content:center;overflow:hidden;font-weight:900;color:#111}
.tc-opt .bic img{width:100%;height:100%;object-fit:contain;padding:4px}

/* ===== 客服聊天弹窗 ===== */
.chat-mask{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:90;display:none}
.chat-mask.show{display:block}
.chat-panel{
  position:fixed;left:50%;bottom:0;transform:translateX(-50%);
  width:100%;max-width:480px;height:82vh;background:#101310;
  border-radius:20px 20px 0 0;z-index:91;display:flex;flex-direction:column;
}
.chat-head{display:flex;align-items:center;gap:10px;padding:14px}
.chat-close{background:#1d201d;color:#cfd6cc;width:36px;height:36px;border-radius:50%;font-size:.95rem;flex:none}
.chat-title{
  display:flex;align-items:center;gap:10px;background:#f4f5f3;border-radius:26px;
  padding:7px 18px 7px 8px;color:#111;
}
.chat-logo{
  width:34px;height:34px;border-radius:50%;background:#000;color:var(--green);
  display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.85rem;flex:none;
}
.chat-title b{font-size:.9rem;display:block}
.chat-title p{font-size:.68rem;color:#666;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-body{flex:1;overflow-y:auto;padding:10px 14px}
.cmsg{display:flex;gap:8px;margin-bottom:12px}
.cmsg.user{justify-content:flex-end}
.cavatar{
  width:32px;height:32px;border-radius:50%;background:#000;color:var(--green);
  display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.8rem;flex:none;
}
.cbubble{
  max-width:75%;padding:11px 14px;border-radius:14px;font-size:.88rem;line-height:1.5;
  word-break:break-word;white-space:pre-wrap;
}
.cmsg.admin .cbubble{background:#fff;color:#1a1a1a;border-top-left-radius:4px}
.cmsg.user .cbubble{background:#4fdc26;color:#08290a;border-top-right-radius:4px}
.ctime{font-size:.66rem;color:#999;margin-top:5px;text-align:right}
.cmsg.user .ctime{color:#1d4a15}
.cquick{
  background:#fff;border-radius:14px;padding:10px;margin:0 0 12px 40px;max-width:75%;
  display:flex;flex-direction:column;gap:8px;
}
.cquick button{
  background:#f0f1ef;color:#333;border-radius:8px;padding:10px;font-size:.82rem;font-weight:600;
}
.cquick button:active{background:#dfe3dd}
.chat-input{
  display:flex;gap:10px;padding:12px 14px 20px;align-items:center;
}
.chat-input input{
  flex:1;background:#1a1d1a;border:1px solid #262a26;border-radius:24px;
  color:var(--text);padding:13px 18px;font-size:.9rem;outline:none;
}
.chat-input input:focus{border-color:var(--green)}
.chat-send{
  width:46px;height:46px;border-radius:50%;background:#2a2e2a;color:#9aa298;
  font-size:1rem;flex:none;
}
.chat-send:active{background:var(--green);color:#08290a}

/* ===== 个人抽屉（左滑） ===== */
.drawer-mask{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:95;display:none}
.drawer-mask.show{display:block}
.drawer{
  position:fixed;top:0;left:0;height:100vh;width:84%;max-width:340px;
  background:#0d100d;z-index:96;overflow-y:auto;padding:18px 16px 30px;
  transform:translateX(-105%);transition:transform .25s ease;
}
.drawer.open{transform:translateX(0)}
.drawer-close{
  position:absolute;top:16px;right:14px;background:none;color:#9aa298;font-size:1.15rem;
}
.drawer-head{display:flex;gap:12px;align-items:center;margin-bottom:16px;padding-right:36px}
.drawer-avatar{
  width:52px;height:52px;border-radius:50%;background:#000;border:1.5px solid var(--green);
  color:var(--green);display:flex;align-items:center;justify-content:center;
  font-weight:900;font-size:1rem;flex:none;
}
.drawer-head b{font-size:1.15rem;font-weight:800;display:block}
.drawer-head p{font-size:.78rem;color:var(--muted);margin:3px 0}
.verified{display:inline-flex;align-items:center;gap:5px;color:var(--green);font-size:.72rem;font-weight:700}
.verified i{width:7px;height:7px;border-radius:50%;background:var(--green);display:inline-block}

.invite-card{
  background:#111611;border:1px solid #223820;border-radius:14px;
  padding:13px;margin-bottom:16px;
}
.invite-card .ic-cap{color:var(--green);font-size:.7rem;font-weight:800;letter-spacing:.08em;margin-bottom:9px}
.invite-card input{
  width:100%;background:#0a0c0a;border:1px solid #1e241d;border-radius:9px;
  color:#cfd6cc;padding:11px 12px;font-size:.8rem;outline:none;margin-bottom:10px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.ic-copy{
  width:100%;background:#4fdc26;color:#08290a;font-weight:800;font-size:.92rem;
  border-radius:10px;padding:12px;
}

.drawer-menu{display:flex;flex-direction:column}
.drawer-menu a,.drawer-menu button{
  display:flex;align-items:center;gap:13px;padding:15px 4px;
  color:#e6eae4;font-size:.92rem;font-weight:600;text-align:left;
  background:none;border:none;border-bottom:1px solid #161a16;cursor:pointer;width:100%;
}
.drawer-menu a:last-child,.drawer-menu button:last-child{border-bottom:none}
.drawer-menu .dm-ic{width:22px;height:22px;color:var(--green);flex:none;display:flex}
.drawer-menu .dm-ic svg{width:100%;height:100%}
.drawer-menu i{margin-left:auto;font-style:normal;color:#5d655b;font-size:1.05rem}
.dm-logout{color:#e6eae4}

/* ===== Legal & Policies ===== */
.legal-wrap{padding:6px 16px 40px}
.legal-intro{color:#9aa199;font-size:.88rem;line-height:1.6;margin-bottom:18px}
.legal-panel{background:#101310;border:1px solid #1c201c;border-radius:16px;overflow:hidden}
.legal-row{
  display:flex;align-items:center;gap:14px;padding:18px 16px;
  border-bottom:1px solid #181c18;
}
.legal-row:last-child{border-bottom:none}
.legal-row b{flex:1;font-size:1rem;font-weight:700}
.legal-row i{font-style:normal;color:#5d655b;font-size:1.1rem}
.legal-ic{
  width:42px;height:42px;border-radius:12px;flex:none;
  display:flex;align-items:center;justify-content:center;
}
.legal-ic svg{width:22px;height:22px}
.ic-green{background:#0f2818;color:var(--green)}
.ic-blue{background:#101d33;color:#4d8dff}
.legal-doc{
  background:#101310;border:1px solid #1c201c;border-radius:16px;
  padding:18px 16px;font-size:.9rem;line-height:1.8;color:#d6dcd3;
  white-space:pre-wrap;word-break:break-word;
}

/* ===== Order History ===== */
.oh-wrap{padding:6px 16px 40px}
.oh-title{font-size:1.4rem;font-weight:800;margin:6px 0 16px}
.oh-tabs{
  display:flex;background:#111411;border:1px solid #1c201c;border-radius:12px;
  padding:5px;gap:4px;margin-bottom:18px;
}
.oh-tab{
  flex:1;padding:11px 6px;border-radius:9px;font-size:.78rem;font-weight:700;
  letter-spacing:.03em;color:#8f978d;background:none;transition:all .15s;
}
.oh-tab.on{background:#4fdc26;color:#08290a}
.oh-card{
  background:#101310;border:1px solid #1c201c;border-radius:14px;
  padding:14px;margin-bottom:12px;
}
.oh-c-top{display:flex;align-items:center;gap:11px;margin-bottom:12px}
.oh-ic{
  width:40px;height:40px;border-radius:10px;flex:none;overflow:hidden;
  display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.95rem;
}
.oh-ic img{width:100%;height:100%;object-fit:cover}
.oh-c-name{flex:1;display:flex;flex-direction:column}
.oh-c-name b{font-size:.95rem}
.oh-c-name .muted{font-size:.75rem}
.oh-badge{font-size:.72rem;font-weight:700;padding:4px 11px;border-radius:20px}
.b-processing{background:#2a2410;color:#e8c34a}
.b-successful{background:#0f2818;color:#4fdc26}
.b-failed{background:#2a1414;color:#ff6b6b}
.oh-c-row{display:flex;justify-content:space-between;font-size:.82rem;padding:5px 0;color:#8f978d}
.oh-c-row .v{color:#d6dcd3;font-weight:600;text-align:right;max-width:65%;word-break:break-all}
.oh-c-row .v.green{color:#4fdc26}
.oh-c-row .v.red{color:#ff6b6b}
.oh-empty{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:70px 20px;color:#5d655b;text-align:center;
}
.oh-empty svg{width:56px;height:56px;margin-bottom:16px;opacity:.5}
.oh-empty b{font-size:1.05rem;color:#8f978d;margin-bottom:6px}
.oh-empty p{font-size:.85rem;color:#5d655b}

/* ===== Partner Program ===== */
.pt-wrap{padding:6px 16px 40px;display:flex;flex-direction:column;gap:14px}
.pt-banner{
  background:linear-gradient(135deg,#3d1470,#1a0533);border:1px solid #4d2b85;
  border-radius:16px;padding:22px 16px;text-align:center;
}
.pt-b-ic{
  width:46px;height:46px;border-radius:50%;background:#7b3fd4;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:10px;
}
.pt-banner b{display:block;font-size:1.15rem;margin-bottom:4px}
.pt-banner p{color:#c9b3ec;font-size:.78rem}
.pt-card{background:#101310;border:1px solid #1c201c;border-radius:16px;padding:16px}
.pt-cap{color:var(--green);font-size:.72rem;font-weight:800;letter-spacing:.08em;margin-bottom:12px}
.pt-cap .zap{background:#0f2818;border-radius:6px;padding:2px 5px;margin-right:4px}
.pt-row{display:flex;align-items:center;justify-content:space-between}
.pt-lbl{color:#8f978d;font-size:.7rem;font-weight:700;letter-spacing:.06em;margin-bottom:5px}
.pt-amt{font-size:1.7rem;font-weight:900}
.pt-btn-green{
  background:#4fdc26;color:#08290a;font-weight:800;font-size:.85rem;
  border-radius:22px;padding:11px 24px;
}
.pt-btn-dark{
  background:#1a1d1a;border:1px solid #262a26;color:#cfd6cc;font-weight:700;
  font-size:.78rem;border-radius:22px;padding:10px 16px;
}
.pt-locked{
  display:inline-block;background:#241d08;border:1px solid #4d3d12;color:#e8c34a;
  border-radius:8px;padding:5px 10px;font-size:.85rem;font-weight:700;
}
.pt-stats{display:flex;gap:14px}
.pt-stat{flex:1;background:#101310;border:1px solid #1c201c;border-radius:16px;padding:14px 16px}
.pt-stat p{color:#8f978d;font-size:.68rem;font-weight:700;letter-spacing:.05em;margin-bottom:8px}
.pt-stat b{font-size:1.25rem}
.pt-stat .g{color:var(--green)}
.pt-stat .y{color:#e8c34a}
.pt-bar{height:5px;background:#1c201c;border-radius:3px;margin-top:12px;overflow:hidden}
.pt-bar i{display:block;height:100%;background:var(--green);border-radius:3px}
.pt-link{display:flex;gap:8px;margin-top:12px}
.pt-link input{
  flex:1;background:#0a0c0a;border:1px solid #1e241d;border-radius:9px;
  color:#cfd6cc;padding:11px 12px;font-size:.78rem;outline:none;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pt-link button{background:#1a1d1a;border:1px solid #2c322a;color:#fff;border-radius:9px;padding:0 18px;font-weight:700;font-size:.82rem}
.pt-qr{display:flex;justify-content:center;margin-top:16px}
.pt-qr > div{background:#fff;padding:10px;border-radius:12px}
.pt-h-row{display:flex;justify-content:space-between;font-size:.84rem;padding:9px 0;border-bottom:1px solid #161a16}
.pt-h-row:last-child{border-bottom:none}
.pt-h-row .g{color:var(--green);font-weight:700}

/* ===== Task Center ===== */
.tk-wrap{padding:6px 16px 40px}
.tk-banner{
  background:linear-gradient(135deg,#3fd414,#1f7a08);border-radius:16px;
  padding:16px;color:#04210a;margin-bottom:20px;
}
.tk-b-top{display:flex;justify-content:space-between;font-size:.78rem;font-weight:800;letter-spacing:.05em}
.tk-b-top a{color:#04210a;text-decoration:underline;font-weight:700}
.tk-b-row{display:flex;justify-content:space-between;align-items:center;margin-top:10px}
.tk-b-row b{font-size:1.9rem;font-weight:900}
.tk-wd{background:#0a0c0a;color:#fff;font-weight:800;font-size:.8rem;border-radius:22px;padding:11px 22px}
.tk-cap{color:var(--green);font-size:.82rem;font-weight:800;letter-spacing:.06em;margin-bottom:12px}
.tk-card{
  background:#101310;border:1px solid #1c201c;border-radius:14px;
  padding:14px;margin-bottom:12px;display:flex;align-items:center;gap:14px;
}
.tk-amt{
  color:var(--green);font-weight:900;font-size:1.05rem;flex:none;min-width:64px;
  border-right:1.5px dashed #2a2f29;padding-right:12px;
}
.tk-mid{flex:1;display:flex;flex-direction:column;gap:4px}
.tk-mid b{font-size:.92rem}
.tk-hint{color:#b8963f;font-size:.75rem}
.tk-mid .muted{font-size:.75rem}
.tk-btn{
  background:#1a1d1a;border:1px solid #2c322a;color:#cfd6cc;font-weight:700;
  font-size:.78rem;border-radius:9px;padding:10px 18px;flex:none;
}
.tk-btn.claim{background:#4fdc26;border-color:#4fdc26;color:#08290a}
.tk-btn.done{background:none;border-color:#2a2f29;color:#5d655b;display:inline-block}
.tk-h-row{display:flex;justify-content:space-between;gap:10px;font-size:.82rem;padding:8px 0;border-bottom:1px solid #161a16}
.tk-h-row:last-child{border-bottom:none}
.tk-bind{
  position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:97;
  display:none;align-items:center;justify-content:center;padding:24px;
}
.tk-bind-card{
  background:#101310;border:1px solid #262a26;border-radius:16px;
  padding:20px;width:100%;max-width:340px;display:flex;flex-direction:column;gap:14px;
}
.tk-bind-card input{
  background:#0a0c0a;border:1px solid #1e241d;border-radius:9px;width:100%;
  color:var(--text);padding:12px;font-size:.9rem;outline:none;margin-bottom:12px;
}
.tk-bind-card input:focus{border-color:var(--green)}

/* ===== Daily Check-in ===== */
.ck-mask{position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:98;display:none}
.ck-mask.show{display:block}
.ck-modal{
  position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);
  width:88%;max-width:360px;background:#0c0f0c;border:2px solid #2f8a14;
  border-radius:20px;padding:28px 20px 22px;z-index:99;
  display:none;flex-direction:column;align-items:center;gap:14px;
}
.ck-close{position:absolute;top:12px;right:14px;background:none;color:#8f978d;font-size:1rem}
.ck-ic{
  width:74px;height:74px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#4fdc26,#1f7a08);
  display:flex;align-items:center;justify-content:center;color:#04210a;
}
.ck-ic svg{width:34px;height:34px}
.ck-modal h3{font-size:1.3rem;font-weight:800}
.ck-msg{color:var(--green);font-size:.85rem;font-weight:700}
.ck-streak{width:100%;background:#101310;border:1px solid #1c201c;border-radius:12px;padding:13px 14px}
.ck-s-top{display:flex;justify-content:space-between;font-size:.82rem;color:#8f978d;margin-bottom:9px}
.ck-s-top b{color:#fff}
.ck-bar{height:9px;background:#1c221b;border-radius:5px;overflow:hidden}
.ck-bar i{display:block;height:100%;background:var(--green);border-radius:5px}
.ck-btn{
  width:100%;background:#4fdc26;color:#08290a;font-weight:800;font-size:.95rem;
  border-radius:12px;padding:15px;margin-top:4px;
}
.ck-modal form{width:100%}


/* ===== My Coupons (ticket style) ===== */
.cpn-wrap{padding:6px 16px 40px}
.cpn-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:.85rem;color:#c9d1c6}
.cpn-top a{color:var(--green);font-weight:700}
.cpn-card{
  display:flex;border-radius:16px;overflow:hidden;margin-bottom:14px;
  background:linear-gradient(120deg,#49d41f,#1e8f0a);position:relative;
}
.cpn-card.dim{opacity:.45;filter:grayscale(.4)}
.cpn-left{
  width:112px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:4px;color:#062b04;border-right:2px dashed rgba(6,43,4,.35);position:relative;
}
.cpn-left b{font-size:1.5rem;font-weight:900}
.cpn-left span{font-size:.62rem;font-weight:800;letter-spacing:.08em}
/* 打孔效果 */
.cpn-card::before,.cpn-card::after{
  content:'';position:absolute;left:104px;width:16px;height:16px;border-radius:50%;
  background:var(--bg,#0a0b0a);z-index:1;
}
.cpn-card::before{top:-8px}
.cpn-card::after{bottom:-8px}
.cpn-right{flex:1;padding:13px 14px;color:#04210a;position:relative}
.cpn-right > b{font-size:1.05rem;font-weight:900;display:block}
.cpn-right p{font-size:.72rem;font-weight:600;color:#0b3a08;margin-top:3px}
.cpn-ticket{position:absolute;top:10px;right:12px;font-size:1.2rem;opacity:.5}
.cpn-foot{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:8px}
.cpn-date{
  background:rgba(255,255,255,.75);color:#1a3d12;font-size:.68rem;font-weight:700;
  border-radius:14px;padding:5px 10px;
}
.cpn-use{background:#0a0c0a;color:#fff;font-size:.75rem;font-weight:800;border-radius:16px;padding:9px 14px}
.cpn-state{color:#062b04;font-size:.72rem;font-weight:900}
.cpn-card.lock{
  background:linear-gradient(120deg,#3a4238,#242923);
}
.cpn-card.lock .cpn-left{color:#aab3a8;border-right-color:rgba(170,179,168,.3)}
.cpn-card.lock .cpn-right{color:#c3cabf}
.cpn-card.lock .cpn-right p{color:#8f978d}
.cpn-card.lock .cpn-date{background:rgba(255,255,255,.12);color:#c3cabf}
.cpn-use.locked{background:#151815;color:#8f978d;border:1px solid #2a2f29}
.cpn-empty{
  border:1.5px dashed #2a2f36;border-radius:14px;padding:36px 20px;margin-top:8px;
  display:flex;flex-direction:column;align-items:center;text-align:center;color:#5d655b;
}
.cpn-empty .zap{font-size:1.5rem;opacity:.5;margin-bottom:10px}
.cpn-empty b{font-size:.92rem;color:#8f978d;margin-bottom:4px}
.cpn-empty p{font-size:.8rem}
.btn-coupon.active{background:#0f2818;color:#4fdc26;border:1px solid #2f8a14;opacity:1}

/* toast */
#toast{
  position:fixed;bottom:120px;left:50%;transform:translateX(-50%);
  background:#1c1f1b;color:#e8ece6;padding:11px 20px;border-radius:22px;
  font-size:.85rem;opacity:0;pointer-events:none;transition:opacity .25s;z-index:99;white-space:nowrap;
}
#toast.show{opacity:1}

@media (prefers-reduced-motion: reduce){
  .marquee span{animation:none;padding-left:0}
}