:root{
  --bg:#f4f6fb; --card:#fff; --ink:#1c2333; --muted:#6b7488; --line:#e6e9f0;
  --blue:#2563eb; --blue-d:#1d4ed8; --green:#16a34a; --amber:#d97706; --red:#dc2626;
  --radius:14px; --shadow:0 1px 3px rgba(20,30,60,.06),0 6px 20px rgba(20,30,60,.05);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font:16px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--blue);text-decoration:none}
.wrap{max-width:900px;margin:0 auto;padding:16px}

/* 顶栏 */
.topbar{display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.brand{font-weight:700;font-size:18px;color:var(--ink);display:inline-flex;align-items:center;gap:8px}
.logo{color:var(--blue)}
.brand-logo{height:30px;width:auto;display:block}
.brand-name{line-height:1}
.topbar nav a{margin-left:16px;color:var(--muted);font-size:15px}

/* hero */
.hero{padding:22px 4px 6px}
.hero-logo{height:64px;width:auto;display:block;margin:0 0 12px}
.hero h1{font-size:22px;margin:0 0 6px}
.hero-sub{color:var(--muted);margin:0 0 12px;font-size:14px}
.badges{display:flex;gap:8px;flex-wrap:wrap}
.tb{background:#eef2ff;color:var(--blue-d);font-size:12px;padding:4px 10px;border-radius:999px}

/* 公告 */
.announce-top{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;
  padding:10px 14px;border-radius:10px;margin:12px 0;font-size:14px}
.announce{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin:12px 0;box-shadow:var(--shadow)}
.announce summary{padding:12px 16px;cursor:pointer;font-weight:600;list-style:none}
.announce summary::-webkit-details-marker{display:none}
.announce-body{padding:0 16px 16px;color:#3a4256;font-size:14px}
.announce-body h3{margin:12px 0 6px;font-size:15px}

/* tabs */
.tabs{display:flex;gap:8px;overflow-x:auto;padding:8px 0;margin:6px 0;-webkit-overflow-scrolling:touch}
.tab{flex:0 0 auto;border:1px solid var(--line);background:var(--card);color:var(--muted);
  padding:8px 16px;border-radius:999px;font-size:14px;cursor:pointer}
.tab.active{background:var(--blue);color:#fff;border-color:var(--blue)}

/* 商品栅格 */
.cat-block.hidden{display:none}
.cat-title{font-size:16px;margin:12px 0 8px}
.grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:560px){.grid{grid-template-columns:1fr 1fr}}
@media(min-width:820px){.grid{grid-template-columns:1fr 1fr 1fr}}
.card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px}
.card.paused{opacity:.7}
.card-head{display:flex;align-items:center;gap:10px}
.card-icon{width:44px;height:44px;border-radius:10px;object-fit:cover;background:#f1f5f9;flex:0 0 auto;display:block}
.cur-img{margin:6px 0;font-size:13px;color:#9fb0d0}
.badge{position:absolute;top:10px;right:10px;background:#fee2e2;color:var(--red);
  font-size:11px;padding:2px 8px;border-radius:999px}
.badge.sm{position:static;display:inline-block}
.card-name{font-weight:600;font-size:15px;padding-right:40px}
.card-sub{color:var(--muted);font-size:13px;min-height:18px}
.card-foot{display:flex;align-items:flex-end;justify-content:space-between;margin-top:4px}
.price{font-size:18px;font-weight:700;color:var(--ink)}
.price-usdt{display:block;font-size:12px;color:var(--muted);font-weight:400}
.sold{font-size:12px;color:var(--muted)}
.buy{display:block;text-align:center;background:var(--blue);color:#fff;padding:10px;border-radius:10px;font-weight:600;margin-top:4px}
.buy:active{background:var(--blue-d)}
.buy.disabled{background:#e5e7eb;color:#9ca3af}
.empty{text-align:center;color:var(--muted);padding:40px}

/* 面板 / 表单 */
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px;box-shadow:var(--shadow);margin-top:12px}
.panel.center{text-align:center}
.panel h2{margin:0 0 14px;font-size:18px}
.back{display:inline-block;margin-top:12px;color:var(--muted)}
.order-item{background:#f8fafc;border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:16px}
.oi-name{font-weight:600}
.oi-sub{color:var(--muted);font-size:13px;margin:4px 0}
.oi-price{font-size:18px;font-weight:700;margin-top:6px}
.form label{display:block;margin:12px 0;font-size:14px;color:#3a4256}
.form input[type=text],.form input[type=email],.form textarea,.aform input,.aform textarea,.aform select{
  width:100%;margin-top:6px;padding:12px;border:1px solid var(--line);border-radius:10px;
  font-size:16px;background:#fff;color:var(--ink)}
.req{color:var(--red)}
.unit{font-size:13px;color:var(--muted);font-weight:400}
.stepper{display:inline-flex !important;align-items:stretch;width:auto;max-width:170px;margin-top:6px;
  border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.stepper .step{flex:0 0 46px;width:46px;height:46px;border:0;background:#f6f8fc;font-size:22px;font-weight:500;
  color:var(--blue-d);cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;padding:0;margin:0;-webkit-appearance:none;appearance:none}
.stepper .step:hover{background:#eef2ff}
.stepper .step:active{background:#dfe7ff}
.stepper input#qty{flex:1 1 auto;width:58px;min-width:0;height:46px;text-align:center;border:0;
  border-left:1px solid var(--line);border-right:1px solid var(--line);font-size:17px;font-weight:600;
  margin:0 !important;padding:0 !important;background:#fff;color:var(--ink);border-radius:0}
.pay-single{margin:14px 0 4px;font-size:14px;color:#3a4256}
.pay-single b{color:var(--ink)}
.switch-line{display:flex !important;align-items:center;gap:8px;font-size:14px;color:#c7d2e8}
.switch-line input{width:auto !important;margin:0 !important}
.pay-total{margin:14px 0 4px;font-size:15px;color:#3a4256}
.pay-total b{font-size:20px;color:var(--red);margin-left:6px}
.pay-choose{display:flex;gap:10px;margin:14px 0}
.pm{flex:1;border:1px solid var(--line);border-radius:10px;padding:12px;cursor:pointer;font-size:14px}
.pm em{display:block;color:var(--muted);font-style:normal;font-size:12px;margin-top:2px}
.pm input{margin-right:6px}
.submit{display:block;width:100%;text-align:center;background:var(--blue);color:#fff;border:0;
  padding:14px;border-radius:10px;font-size:16px;font-weight:600;cursor:pointer;margin-top:8px}
.submit:active{background:var(--blue-d)}
.submit.sm{width:auto;display:inline-block;padding:8px 16px;font-size:14px;margin-left:10px}
.note,.hint{color:var(--muted);font-size:13px;text-align:center;margin-top:10px}
.cf-turnstile{margin:12px 0}

/* 确认下单：手机先付款，再看条款与开通流程 */
.order-wrap{max-width:1120px}
.order-page .back{margin:10px 0 14px}
.checkout-product{display:flex;align-items:center;gap:14px;margin:0 0 18px;min-width:0}
.checkout-product-icon{width:58px;height:58px;flex:0 0 58px;object-fit:cover;border:1px solid var(--line);border-radius:14px;background:#fff}
.checkout-product h1{font-size:22px;line-height:1.35;margin:0;overflow-wrap:anywhere}
.checkout-product p{display:inline;color:var(--muted);font-size:14px;margin:3px 8px 0 0}
.checkout-badge{display:inline-block;background:#edf7ef;color:#15713c;border-radius:999px;padding:2px 9px;font-size:12px}
.checkout-layout{display:flex;flex-direction:column;gap:14px}
.checkout-card,.checkout-info-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);min-width:0}
.checkout-card h2,.checkout-info-card h2{font-size:18px;line-height:1.4;margin:0 0 12px}
.checkout-unit{font-size:14px;color:var(--muted);padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:14px}
.checkout-unit strong{display:inline-block;font-size:25px;line-height:1.35;color:var(--ink);margin:0 0 0 8px}
.checkout-unit .unit{display:inline-block}
.checkout-card .form label{margin:14px 0}
.checkout-card .form input[type=text],.checkout-card .form input[type=email]{border-color:#dce2eb}
.checkout-card .stepper{display:flex !important}
.checkout-card .pay-total{padding:12px 0;border-top:1px solid var(--line);margin:16px 0 4px}
.checkout-card .pay-total b{font-size:23px}
.checkout-card .note{line-height:1.6}
.checkout-info{display:flex;flex-direction:column;gap:14px;min-width:0}
.terms-list{margin:0}
.terms-row{padding:14px 0;border-top:1px solid var(--line);font-size:14px}
.terms-row:first-child{border-top:0;padding-top:3px}
.terms-row:last-child{padding-bottom:2px}
.terms-row dt{font-weight:600;color:var(--ink);margin-bottom:5px}
.terms-row dd{margin:0;color:#3a4256;white-space:pre-line;overflow-wrap:anywhere;line-height:1.7}
.activation-steps{margin:0;padding:2px 0 0;list-style:none;display:grid;gap:16px}
.activation-steps li{display:flex;align-items:flex-start;gap:10px;font-size:14px;min-width:0}
.step-number{flex:0 0 24px;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:#eef2ff;color:var(--blue-d);font-weight:700;font-size:13px}
.activation-steps strong{font-size:14px}
.activation-steps p{color:var(--muted);margin:5px 0 0;line-height:1.6}
.activation-help{margin-top:20px;padding-top:14px;border-top:1px solid var(--line);font-size:14px}
.activation-help summary{cursor:pointer;color:#334155;list-style:none;display:inline-flex;align-items:center;gap:8px;font-weight:600}
.activation-help summary::-webkit-details-marker{display:none}
.activation-help summary::before{content:'›';display:inline-block;color:var(--blue);font-size:20px;line-height:1;transition:transform .15s}
.activation-help[open] summary::before{transform:rotate(90deg)}
.activation-help-body{padding:4px 0 0 20px;color:#3a4256}
.activation-help-body ol{padding-left:18px;margin:6px 0 12px}
.activation-help-body li{margin:8px 0;line-height:1.6}
.guide-demo-open{font:inherit;border:1px solid #cbd6f8;border-radius:8px;background:#eef2ff;color:var(--blue-d);padding:8px 12px;cursor:pointer}
.guide-modal{width:min(92vw,720px);max-height:85vh;border:1px solid #333;border-radius:16px;padding:16px;background:#1d1d1d;color:#fff;box-shadow:0 24px 65px rgba(12,25,55,.28)}
.guide-modal::backdrop{background:rgba(10,19,38,.62)}
.guide-modal-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px}
.guide-modal-head h2{font-size:18px;margin:0}
.guide-modal-close{border:0;background:#303030;border-radius:8px;font-size:25px;line-height:1;width:36px;height:36px;cursor:pointer;color:#fff}
.guide-modal video{display:block;width:100%;max-height:70vh;background:#101827;border-radius:10px}
.guide-video-placeholder{aspect-ratio:16/9;display:grid;place-items:center;border-radius:10px;background:#101010;color:#cbd5e1;font-size:16px}
@media(min-width:820px){
  .checkout-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.9fr);gap:24px;align-items:start}
  .checkout-info{grid-column:1;grid-row:1;gap:18px}
  .checkout-card{grid-column:2;grid-row:1}
  .terms-row{display:grid;grid-template-columns:116px minmax(0,1fr);gap:10px}
  .terms-row dt{margin:0}
  .activation-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
}
@media(max-width:559px){
  .checkout-card,.checkout-info-card{padding:16px}
  .checkout-product h1{font-size:19px}
  .checkout-product-icon{width:48px;height:48px;flex-basis:48px}
  .checkout-card .pay-choose{flex-direction:column}
}

/* 付款页 */
.pay-meta{font-size:14px;color:#3a4256;margin-bottom:14px}
.pay-meta b{color:var(--ink)}
.countdown{margin-top:8px;color:var(--amber);font-weight:600}
.pay-box{background:#f8fafc;border:1px solid var(--line);border-radius:12px;padding:16px;text-align:center}
.pay-amt{font-size:16px;margin-bottom:6px}
.amt{color:var(--red);font-size:22px}
.warn{color:var(--red);font-size:13px;margin:8px 0}
.addr-line{display:flex;flex-direction:column;gap:6px;align-items:center;margin:10px 0}
.addr-line code{word-break:break-all;background:#fff;border:1px solid var(--line);padding:8px;border-radius:8px;font-size:13px;width:100%}
.chain{font-size:13px;color:var(--muted)}
.qr{width:180px;height:180px;margin:12px auto;display:block;border:1px solid var(--line);border-radius:10px;background:#fff}
.copy{background:#eef2ff;color:var(--blue-d);border:0;padding:6px 12px;border-radius:8px;font-size:13px;cursor:pointer}
.copy.big{margin-top:10px;padding:10px 20px;font-size:15px}
.review-note{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0;border-radius:10px;padding:12px;margin-top:12px;font-size:14px}
.form.tight{margin-top:14px;text-align:left}

/* 完成页 */
.panel.success{text-align:center}
.ok-icon{width:56px;height:56px;line-height:56px;border-radius:50%;background:#dcfce7;color:var(--green);
  font-size:30px;margin:0 auto 10px}
.secret-box{background:#f0f7ff;border:1px dashed var(--blue);border-radius:12px;padding:18px;margin:16px 0}
.secret-label{font-size:13px;color:var(--muted);margin-bottom:8px}
.secret{font-size:22px;font-weight:700;letter-spacing:1px;font-family:ui-monospace,Menlo,Consolas,monospace;word-break:break-all}
.next{text-align:left;background:#f8fafc;border:1px solid var(--line);border-radius:10px;padding:14px;margin:14px 0}
.im-btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.im-btn{background:var(--blue);color:#fff;padding:8px 14px;border-radius:8px;font-size:14px}
.guide{text-align:left;margin-top:16px}
.guide h3{font-size:15px}
.order-tip{font-size:13px;color:var(--muted);margin-top:16px}

/* 查单 */
.or{text-align:center;color:var(--muted);margin:6px 0}
.result-list .result{margin-top:14px;border:1px solid var(--line);border-radius:12px;padding:16px;background:#fafbff}
.result{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}
.sm-btn{margin-top:12px}
.r-row{display:flex;justify-content:space-between;padding:6px 0;font-size:14px}
.r-row span{color:var(--muted)}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace}
.timeline{display:flex;justify-content:space-between;margin:18px 0;position:relative}
.tl{flex:1;text-align:center;font-size:12px;color:var(--muted)}
.tl .dot{display:block;width:12px;height:12px;border-radius:50%;background:#d1d5db;margin:0 auto 6px}
.tl.on{color:var(--blue-d)}
.tl.on .dot{background:var(--blue)}
.st{font-weight:600}
.st-done{color:var(--green)} .st-paid{color:var(--blue)} .st-pending{color:var(--amber)}
.st-awaiting_review{color:var(--amber)} .st-refunded{color:var(--muted)} .st-expired{color:var(--muted)}
.msg-body{color:#3a4256}

/* 页脚 */
.foot{max-width:900px;margin:24px auto;padding:16px;color:var(--muted);font-size:13px}
.foot-contact strong{color:var(--ink)}
.im-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px}
.foot-links{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap}

/* ============ 后台 ============ */
body.admin{background:#0f1420;color:#e5e9f0}
.admin-bar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:12px 20px;background:#161c2c;border-bottom:1px solid #263049}
.admin-bar .brand{color:#fff}
.admin-bar nav{display:flex;gap:14px;flex-wrap:wrap}
.admin-bar nav a{color:#9fb0d0;font-size:14px}
.admin-wrap{max-width:1000px;margin:0 auto;padding:20px}
.admin h1{font-size:20px;margin:6px 0 16px}
.admin h2{font-size:15px;margin:20px 0 6px;color:#c7d2e8}
.stat-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(min-width:640px){.stat-row{grid-template-columns:repeat(4,1fr)}}
.stat{background:#161c2c;border:1px solid #263049;border-radius:12px;padding:18px;text-align:center;color:#e5e9f0}
.stat b{display:block;font-size:26px}
.stat span{color:#9fb0d0;font-size:13px}
.stat.warn b{color:#fbbf24}.stat.hot b{color:#60a5fa}.stat.ok b{color:#34d399}
.tips{color:#9fb0d0;font-size:13px;margin-top:16px;background:#161c2c;border:1px solid #263049;padding:12px;border-radius:10px}
.tips code{background:#0f1420;padding:2px 6px;border-radius:6px}
.saved{background:#064e3b;color:#a7f3d0;padding:10px 14px;border-radius:10px;margin-bottom:14px}
.aform{background:#161c2c;border:1px solid #263049;border-radius:12px;padding:18px;max-width:640px}
.aform.inline{display:flex;gap:10px;flex-wrap:wrap;align-items:center;max-width:none}
.aform label{display:block;margin:10px 0;font-size:14px;color:#c7d2e8}
.aform input,.aform textarea,.aform select{background:#0f1420;border:1px solid #263049;color:#e5e9f0}
.admin-demo-video{display:block;width:100%;max-width:500px;border-radius:10px;background:#000;margin:10px 0}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tbl{width:100%;border-collapse:collapse;background:#161c2c;border:1px solid #263049;border-radius:12px;overflow:hidden;font-size:14px}
.tbl th,.tbl td{padding:10px 12px;border-bottom:1px solid #263049;text-align:left;vertical-align:top}
.tbl th{color:#9fb0d0;font-weight:600;background:#1a2135}
.tbl .muted{color:#6b7488;text-align:center}
.tbl .t{color:#6b7488;font-size:12px;margin-top:2px}
.tbl.orders td.contact{max-width:160px;word-break:break-all}
.mini{background:#233150;color:#cdd9f0;border:0;padding:6px 10px;border-radius:8px;font-size:13px;cursor:pointer;margin:2px 0;display:inline-block}
.mini.ok{background:#065f46;color:#d1fae5}
.mini.danger{background:#7f1d1d;color:#fecaca}
.ops form{display:inline}
.chip{display:inline-block;padding:6px 12px;border-radius:999px;background:#161c2c;border:1px solid #263049;color:#9fb0d0;font-size:13px;margin:0 6px 6px 0}
.chip.on{background:var(--blue);color:#fff;border-color:var(--blue)}
.filter{margin-bottom:12px}
.status-form select{padding:6px 8px;border-radius:8px}
.icon-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.icon-form input[type=file]{font-size:12px;color:#9fb0d0;max-width:200px}
.muted{color:#6b7488}
.sm{font-size:12px}