*{box-sizing:border-box}
:root{--red:#ef3340;--red2:#ff5260;--text:#151922;--muted:#7d8490;--bg:#f7f8fa;--card:#fff;--line:#eceef2}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Microsoft YaHei",Arial,sans-serif}
body{min-height:100vh}
button{font:inherit;border:0;background:none;color:inherit;cursor:pointer}
.page{max-width:720px;margin:0 auto;padding:16px 16px 100px}
.topbar{height:64px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;background:#fff;position:sticky;top:0;z-index:10;border-bottom:1px solid #f0f1f3}
.tron-logo{width:40px;height:40px;border-radius:8px;object-fit:contain}.brand{display:flex;align-items:center;gap:9px}.brand strong{font-size:23px;letter-spacing:1px}.brand small{display:block;color:#a0a5ad;font-size:9px;margin-top:1px}
.icon-btn{font-size:23px;position:relative}.badge{position:absolute;right:-7px;top:-8px;background:var(--red);color:#fff;border-radius:20px;min-width:18px;height:18px;padding:0 5px;font-size:11px;display:flex;align-items:center;justify-content:center}.hidden{display:none!important}
.hero{margin-top:8px;border-radius:22px;padding:25px 22px;min-height:185px;background:linear-gradient(135deg,#fff0f1,#ffd8dc);display:flex;justify-content:space-between;align-items:center;overflow:hidden}.hero span{font-size:11px;color:#db5a64;font-weight:700;letter-spacing:1px}.hero h1{font-size:27px;line-height:1.3;margin:10px 0 8px}.hero p{margin:0;color:#737985;font-size:13px}.hero-coin{width:92px;height:92px;border-radius:50%;background:linear-gradient(145deg,#ff5c68,#df1827);color:white;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:800;box-shadow:0 14px 35px #e9344440}
.section-head{display:flex;justify-content:space-between;align-items:center;margin:24px 3px 12px}.section-head h2{font-size:20px;margin:0}.section-head span{font-size:13px;color:var(--red)}
.banner-carousel{position:relative;margin:12px 0 20px;border-radius:18px;overflow:hidden;height:180px}.banner-slide{position:absolute;inset:0;opacity:0;transition:opacity .4s ease}.banner-slide.active{opacity:1}.banner-slide img{width:100%;height:100%;object-fit:cover;display:block}
.banner-dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);display:flex;gap:6px}.banner-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.6);cursor:pointer}.banner-dot.active{background:#fff}
.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.product-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 3px 16px #1820330a;cursor:pointer}.product-image-wrap{height:145px;background:#f1f3f7;position:relative}.product-image-wrap img{width:100%;height:100%;object-fit:cover}.tag{position:absolute;left:9px;top:9px;background:var(--red);color:white;padding:4px 8px;border-radius:7px;font-size:10px;font-weight:700}.tag.inline{position:static;display:inline-block}.product-body{padding:11px}.product-body h3{font-size:15px;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-body p{font-size:11px;color:var(--muted);margin:0 0 10px}.product-foot{display:flex;align-items:center;justify-content:space-between}.product-foot strong{font-size:16px;color:var(--red)}.product-foot button{width:31px;height:31px;border-radius:10px;background:var(--red);color:#fff;font-size:21px}

.detail-top{justify-content:flex-start;gap:18px}.detail-top strong{flex:1;text-align:center;margin-right:35px}.back-btn{font-size:35px;line-height:20px}.back-btn-small{font-size:24px;line-height:12px}.detail-page{padding-top:12px}.detail-image{height:300px;background:#eef0f4;border-radius:20px;overflow:hidden}.detail-image img{width:100%;height:100%;object-fit:cover}.detail-info{padding:18px 4px}.detail-info h1{font-size:25px;margin:12px 0 5px}.detail-sub,.detail-desc{color:var(--muted);font-size:14px;line-height:1.7}.detail-price{font-size:25px;color:var(--red);display:block;margin-top:13px}.divider{height:1px;background:var(--line);margin:20px 0}.delivery{padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}.delivery span{color:#17a673;font-weight:800;margin-right:8px}.buy-bar{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);padding:11px max(16px,calc((100vw - 720px)/2 + 16px));display:flex;align-items:center;justify-content:space-between;z-index:20}.buy-bar small{display:block;color:var(--muted);font-size:11px}.buy-bar strong{font-size:18px;color:var(--red)}

.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:68px;background:#fff;border-top:1px solid var(--line);display:flex;justify-content:center;gap:0;z-index:30;padding-bottom:env(safe-area-inset-bottom)}.nav-item{width:33.333%;max-width:240px;color:#8b919c;font-size:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.nav-item span{font-size:22px;line-height:22px}.nav-item.active{color:var(--red);font-weight:700}

.cart-item{display:flex;gap:11px;padding:12px;background:#fff;border-radius:15px;margin-bottom:10px;position:relative}.cart-item img{width:92px;height:92px;border-radius:11px;object-fit:cover}.cart-info{min-width:0;flex:1;padding-right:20px}.cart-info strong{display:block;font-size:15px;margin:3px 0}.cart-info small{display:block;color:var(--muted);font-size:11px;margin-bottom:8px}.cart-info>b{color:var(--red);font-size:15px}.qty{display:flex;align-items:center;gap:12px;margin-top:8px}.qty button{width:25px;height:25px;background:#f0f1f3;border-radius:7px}.delete-btn{position:absolute;right:10px;top:9px;color:#aaa;font-size:21px}.summary{background:#fff;border-radius:16px;padding:16px;margin-top:15px}.summary>div{display:flex;justify-content:space-between;margin-bottom:11px;font-size:14px}.price{color:var(--red);font-size:18px}.primary-btn{background:linear-gradient(135deg,#ef3340,#ff5965);color:#fff;border-radius:13px;padding:13px 24px;font-weight:700;box-shadow:0 7px 18px #ef334030}.primary-btn.full{width:100%;margin-top:7px}.text-btn{color:var(--muted);font-size:13px}.empty{text-align:center;padding:80px 20px;color:var(--muted)}.empty>div{font-size:48px}.empty h2{color:var(--text);font-size:20px;margin:12px}.empty p{font-size:13px;margin-bottom:22px}

.profile-card{background:linear-gradient(135deg,#fff0f1,#fff);border-radius:18px;padding:20px;display:flex;align-items:center;gap:14px;margin-top:8px}.avatar{width:55px;height:55px;border-radius:50%;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800}.profile-card strong{display:block;font-size:18px}.profile-card small{color:var(--muted);font-size:12px}.menu-card{background:#fff;border-radius:17px;margin-top:14px;overflow:hidden}.menu-card button{width:100%;display:flex;align-items:center;text-align:left;gap:13px;padding:17px;border-bottom:1px solid var(--line)}.menu-card button:last-child{border-bottom:0}.menu-card button>span{font-size:21px;width:28px}.menu-card div{flex:1}.menu-card strong{display:block;font-size:14px}.menu-card small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.menu-card b{color:#aaa;font-size:20px}.info-card{background:#fff;border-radius:17px;padding:17px;margin-top:14px}.info-card strong{font-size:14px}.info-card p{color:var(--muted);font-size:12px;line-height:1.7;margin-bottom:0}
.profile-topbar{justify-content:space-between}.profile-header-left{display:flex;align-items:center;gap:12px}
.profile-avatar{width:50px;height:50px;border-radius:50%;object-fit:cover;border:2px solid #f0f1f3}
.profile-info strong{display:block;font-size:16px}.profile-info small{color:var(--muted);font-size:11px}
.wallet-card{position:relative;margin:12px 0;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,#667eea20,#764ba220);border:1px solid var(--line)}
.wallet-bg{position:absolute;inset:0;background:linear-gradient(135deg,#667eea,#764ba2);opacity:.08}
.wallet-content{position:relative;padding:20px}
.wallet-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.wallet-label{color:var(--muted);font-size:13px}
.wallet-amount{font-size:20px;color:#667eea;font-weight:700}
.wallet-actions{display:flex;gap:12px;margin-top:12px}
.wallet-btn{flex:1;background:#667eea;color:#fff;border-radius:10px;padding:8px;font-size:13;font-weight:600}
.order-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0}
.order-item{display:flex;flex-direction:column;align-items:center;gap:4px;background:#fff;border-radius:14px;padding:14px 6px;font-size:11px;color:var(--muted);box-shadow:0 1px 6px #1820330a}
.order-icon{font-size:24px;margin-bottom:2px}
.version-card{background:#fff;border-radius:14px;padding:14px 16px;margin-top:14px;display:flex;justify-content:space-between;color:var(--muted);font-size:11px;border:1px solid var(--line)}
.cart-topbar{justify-content:space-between}
.cart-main{padding-top:8px}
.cart-empty{text-align:center;padding:40px 20px}
.cart-empty .empty-illustration{font-size:56px;margin-bottom:12px}
.cart-empty h2{color:var(--text);font-size:20px;margin:12px 0}
.cart-empty p{color:var(--muted);font-size:13px;margin-bottom:22px}
.cart-item-enhanced{display:flex;align-items:center;gap:10px;background:#fff;border-radius:14px;padding:14px;margin-bottom:10px;border:1px solid var(--line);box-shadow:0 1px 6px #1820330a}
.cart-item-img{width:70px;height:70px;border-radius:8px;object-fit:cover}
.cart-item-info{flex:1;min-width:0;padding:0 8px}
.cart-item-info strong{display:block;font-size:14px;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cart-item-info small{display:block;color:var(--muted);font-size:11px;margin-bottom:6px;line-height:1.3}
.cart-item-tags{display:flex;align-items:center;gap:4px;margin-top:4px}
.cart-item-tags .tag{font-size:9px;padding:2px 6px;background:var(--red);color:#fff;border-radius:4px}
.fav-icon{position:relative;font-size:14px;cursor:pointer;color:#ff9b9b}
.cart-item-price{font-size:14px;color:var(--red);font-weight:600;margin-top:4px}
.cart-qty-control{display:flex;align-items:center;gap:6px}
.cart-qty-control button{width:25px;height:25px;background:#f0f1f3;border-radius:7px;font-size:16px}
.cart-qty-control span{font-size:14px;font-weight:600}
.cart-item-remove{position:absolute;right:8px;top:50%;transform:translateY(-50%);color:#aaa;font-size:18px;padding:2px 6px;border-radius:4px}
.cart-item-remove:hover{color:var(--red)}
.cart-summary{background:#fff;border-radius:16px;padding:16px;margin:16px 0;border:1px solid var(--line);box-shadow:0 1px 6px #1820330a}
.summary-row{display:flex;justify-content:space-between;margin-bottom:8px;font-size:14px}
.summary-divider{height:1px;background:var(--line);margin:10px 0}
.cart-topbar .text-btn{display:inline-block}
.coupon-section{background:#fff;border-radius:16px;padding:14px;margin:12px 0;border:1px solid var(--line);box-shadow:0 1px 6px #1820330a}
.coupon-input-row{display:flex;gap:8px}
.coupon-input{flex:1;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:13px;outline:none;box-sizing:border-box}
.coupon-apply{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-radius:10px;padding:0 16px;font-weight:600;font-size:13px}
.coupon-tip{font-size:12px;color:var(--muted);margin-top:8px}
.coupon-tip a{color:var(--red)}
.recommend-section{margin-top:20px}
.recommend-section .section-head{margin-bottom:12px}

.modal{position:fixed;inset:0;z-index:100}.modal-mask{position:absolute;inset:0;background:#0008}.modal-sheet{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:22px 22px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom));animation:up .2s ease}.sheet-head{display:flex;justify-content:space-between;align-items:center;font-size:18px}.sheet-head button{font-size:27px;color:#999}.muted{color:var(--muted);font-size:12px}.pay-option{width:100%;display:flex;align-items:center;gap:12px;padding:14px 4px;border-top:1px solid var(--line);text-align:left}.pay-option>div{flex:1}.pay-option small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.pay-option>b{font-size:22px;color:#aaa}.coin{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800}.coin.trx{background:#ef3340}.coin.usdt{background:#26a17b}.pay-note{background:#f7f8fa;padding:10px;border-radius:10px;color:#8a9099;font-size:11px}code{font-size:10px}
#toast{position:fixed;left:50%;bottom:88px;transform:translate(-50%,15px);background:#222;color:#fff;padding:10px 15px;border-radius:10px;font-size:12px;opacity:0;pointer-events:none;transition:.2s;z-index:200;white-space:nowrap}#toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes up{from{transform:translateY(100%)}to{transform:translateY(0)}}
@media(max-width:380px){.hero h1{font-size:23px}.hero-coin{width:75px;height:75px}.product-grid{gap:8px}.product-image-wrap{height:125px}}

/* ============ 追加样式: 客服悬浮按钮 / 结算 / 币种换算 ============ */

/* 页面底部留白, 确保内容不被悬浮客服按钮遮挡 */
.page{padding-bottom:134px}

/* ---------- 客服悬浮按钮 (右下角, 位于底部导航之上) ---------- */
.cs-float{position:fixed;right:max(14px,calc((100vw - 720px)/2 + 4px));bottom:78px;z-index:26;display:flex;flex-direction:column;align-items:center;gap:2px;
  background:#fff;border-radius:50%;width:52px;height:52px;justify-content:center;
  box-shadow:0 6px 20px #18203330;border:1px solid var(--line);text-decoration:none;transition:transform .18s,box-shadow .18s}
.cs-float:active{transform:scale(.94)}
.cs-float img{width:34px;height:34px;border-radius:50%;object-fit:cover;display:block}
.cs-float .cs-fallback{font-size:24px;line-height:1}
.cs-float .cs-label{display:none}
.cs-float::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid #ef334033;animation:csPulse 2.4s ease-out infinite}
@keyframes csPulse{0%{transform:scale(.9);opacity:.9}70%{transform:scale(1.25);opacity:0}100%{opacity:0}}

/* ---------- 站点公告条 ---------- */
.site-notice{display:flex;align-items:center;gap:8px;background:linear-gradient(135deg,#fff3f4,#ffe9eb);color:#b3282f;
  border:1px solid #ffd7db;border-radius:12px;padding:10px 13px;font-size:12.5px;margin:10px 0 4px;line-height:1.4}

/* ---------- 商品卡片币种角标 / 收藏 ---------- */
.cur-chip{position:absolute;right:8px;top:9px;background:#ffffffe6;color:#3a4150;border-radius:6px;padding:2px 7px;font-size:10px;font-weight:800;letter-spacing:.5px}
.fav-btn{position:absolute;right:6px;bottom:6px;background:#ffffffe6;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:15px;line-height:1}

/* ---------- 首页底部保障 ---------- */
.home-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0 6px}
.home-foot-item{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 8px;text-align:center;font-size:11.5px;color:var(--muted)}
.home-foot-item b{display:block;font-size:20px;margin-bottom:4px;font-weight:400}

/* ---------- 商品详情: 折算价 ---------- */
.detail-alt{font-size:13px;color:var(--red);margin:4px 0 0}
.detail-alt .muted{color:var(--muted);font-size:11.5px}

/* ---------- 购物车: 币种切换 / 换算说明 ---------- */
.summary-cur{align-items:center}
.cur-switch{display:inline-flex;background:#f0f1f3;border-radius:10px;padding:3px;gap:3px}
.cur-switch button{padding:4px 12px;border-radius:8px;font-size:12px;color:var(--muted);font-weight:600}
.cur-switch button.active{background:#fff;color:var(--red);box-shadow:0 1px 4px #18203318}
.convert-note{font-size:11.5px;color:var(--muted);background:#f7f8fa;border-radius:10px;padding:8px 10px;margin-bottom:10px;line-height:1.5}

/* ---------- 结算弹窗 ---------- */
.pay-option{position:relative}
.pay-option.selected{background:#fff6f7}
.pay-option .pay-amt{font-size:14px;font-weight:800;color:var(--red);margin-right:6px;white-space:nowrap}
.radio{width:20px;height:20px;flex:0 0 20px;border:2px solid #ddd;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;color:transparent}
.radio.checked{border-color:var(--red);color:var(--red)}
.pay-total{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:14px 0 6px;padding:12px 14px;background:#f7f8fa;border-radius:12px}
.pay-total span{font-size:12.5px;color:var(--muted)}
.pay-total strong{font-size:20px;color:var(--red)}
.pay-total small{font-size:11.5px;color:var(--muted)}
.auth-btn{width:100%;background:linear-gradient(135deg,#ef3340,#ff5965);color:#fff;border:none;border-radius:14px;padding:15px;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 5px 20px #ef334030;margin:8px 0}

/* ---------- 购物车空状态 (丰富版) ---------- */
.ce-hero{text-align:center;padding:26px 16px 18px;background:linear-gradient(160deg,#fff5f6,#fff);border:1px solid var(--line);border-radius:20px;margin-bottom:14px}
.ce-illustration{font-size:56px;line-height:1;margin-bottom:8px;filter:drop-shadow(0 8px 14px #ef334033)}
.ce-hero h2{font-size:19px;margin:6px 0}
.ce-hero p{font-size:12.5px;color:var(--muted);margin:0 0 16px}
.ce-hero .ghost-btn{margin-top:9px}
.ghost-btn{background:#fff;border:1px solid var(--line);color:#3a4150;border-radius:12px;padding:11px 20px;font-weight:600;font-size:13.5px;margin-left:8px}
.ghost-btn:active{background:#f7f8fa}
.ce-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.ce-benefit{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 6px;text-align:center}
.ce-benefit b{display:block;font-size:20px;font-weight:400;margin-bottom:4px}
.ce-benefit span{display:block;font-size:12px;font-weight:600}
.ce-benefit small{display:block;font-size:10.5px;color:var(--muted);margin-top:2px}
.ce-block{margin-bottom:18px}
.ce-quick{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ce-quick button{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 6px;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:11.5px;color:var(--muted)}
.ce-quick button b{font-size:21px;font-weight:400}
.ce-help{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:6px}
.ce-help b{font-size:14px}
.ce-help small{color:var(--muted);font-size:12px}
.ce-help .ghost-btn{margin-left:0;align-self:flex-start;margin-top:6px}

/* ---------- 订单页 / 确认订单页 ---------- */
.tag-cur{background:#eef2ff;color:#4338ca;border-radius:6px;padding:2px 7px;font-size:11px;font-weight:700}
.order-summary-list{margin:14px 0}
.pay-line{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:9px}
.pay-line img{width:54px;height:54px;border-radius:10px;object-fit:cover;background:#f1f3f7}
.pay-line>div{flex:1;min-width:0}
.pay-line strong{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pay-line small{color:var(--muted);font-size:11.5px}
.pay-line>b{color:var(--red);font-size:13.5px;white-space:nowrap}

/* ---------- 客服中心页 ---------- */
.service-hero{display:flex;align-items:center;gap:14px;background:linear-gradient(135deg,#fff0f1,#fff);border:1px solid var(--line);border-radius:18px;padding:18px;margin:12px 0 16px}
.service-hero img{width:54px;height:54px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 4px 12px #18203318}
.service-hero-info{flex:1;min-width:0}
.service-hero-info h3{margin:0 0 3px;font-size:15px}
.service-hero-info p{margin:0;color:var(--muted);font-size:11.5px}
.service-hero .primary-btn{padding:10px 16px;font-size:13px}
.info-card{background:#fff;border-radius:17px;padding:17px;margin-top:14px;border:1px solid var(--line)}
.info-card h3{font-size:14.5px;margin:0 0 12px}
.info-card p{color:var(--muted);font-size:12.5px;line-height:1.7;margin:0 0 6px}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.service-btn{background:#f7f8fa;border:1px solid var(--line);border-radius:12px;padding:12px 6px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.service-btn b{font-size:21px;font-weight:400}
.service-btn small{font-size:11.5px;color:var(--muted)}
.faq{font-size:13px;color:var(--muted);line-height:1.8}
.faq details{margin-bottom:8px}
.faq summary{cursor:pointer;font-weight:600;color:var(--text);font-size:13px}
.faq p{margin:8px 0 0;padding-left:14px}

@media(max-width:380px){
  .ce-quick{grid-template-columns:repeat(3,1fr);gap:7px}
  .ce-quick button{padding:11px 4px;font-size:11px}
  .cs-float{right:11px;bottom:74px;width:48px;height:48px}
  .cs-float img{width:31px;height:31px}
}