/* ============ Design Tokens ============ */
:root {
  --brand-100: #eef2ff; --brand-300: #a5b4fc; --brand-500: #6366f1; --brand-600: #4f46e5; --brand-700: #4338ca;
  --accent-400: #fb7185; --accent-500: #f43f5e; --accent-600: #e11d48;
  --cyan-400: #22d3ee; --cyan-500: #06b6d4;
  --ink-900: #0f172a; --ink-700: #334155; --ink-500: #64748b; --ink-300: #cbd5e1; --ink-100: #f1f5f9;
  --bg: #ffffff; --bg-soft: #f8fafc; --card-border: #e2e8f0;
  --hero-bg: #0b1020; --hero-bg2: #131a33;
  --radius-sm: 8px; --radius-md: 14px; --radius-lg: 22px; --radius-xl: 32px;
  --shadow-sm: 0 1px 2px rgba(15,23,42,.06);
  --shadow-md: 0 8px 24px -8px rgba(79,70,229,.18);
  --shadow-lg: 0 20px 50px -12px rgba(79,70,229,.28);
  --font-ui: "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Microsoft YaHei UI", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
  --font-en: "Inter", "SF Pro Display", var(--font-ui);
  --font-mono: "JetBrains Mono", "Cascadia Code", Consolas, monospace;
  --transition: 220ms cubic-bezier(.4,0,.2,1);
  --ok: #059669; --ok-bg: #ecfdf5; --ok-bd: #a7f3d0;
  --warn: #92400e; --warn-bg: #fffbeb; --warn-bd: #fde68a;
  --err: #b91c1c; --err-bg: #fef2f2; --err-bd: #fecaca;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family: var(--font-ui); color: var(--ink-900); background: var(--bg); -webkit-font-smoothing: antialiased; line-height: 1.6; }
img { max-width:100%; display:block; }
button, input { font-family: inherit; }
a { color: inherit; text-decoration: none; }

.container { width:100%; max-width:1160px; margin:0 auto; padding:0 24px; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border:none; cursor:pointer; font-weight:600; font-size:15px;
  border-radius: var(--radius-md); padding: 12px 24px;
  transition: all var(--transition); user-select:none;
}
.btn:disabled { opacity:.55; cursor:not-allowed; pointer-events:none; }
.btn:focus-visible { outline:3px solid var(--brand-300); outline-offset:2px; }
.btn-primary { background: linear-gradient(135deg, var(--brand-500), var(--brand-600)); color:#fff; box-shadow: var(--shadow-md); }
.btn-primary:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.btn-accent { background: linear-gradient(135deg, var(--accent-400), var(--accent-600)); color:#fff; box-shadow: 0 8px 24px -8px rgba(244,63,94,.4); }
.btn-accent:hover { transform: translateY(-2px); }
.btn-ghost { background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.35); }
.btn-ghost:hover { border-color:#fff; background:rgba(255,255,255,.08); }
.btn-outline { background:#fff; color:var(--brand-600); border:1.5px solid var(--brand-300); }
.btn-outline:hover { background:var(--brand-100); }
.btn-danger { background:#fff; color:var(--err); border:1.5px solid var(--err-bd); }
.btn-danger:hover { background:var(--err-bg); }
.btn-lg { padding:15px 32px; font-size:17px; border-radius: var(--radius-lg); }
.btn-sm { padding:7px 14px; font-size:13.5px; border-radius:10px; }
.badge { display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--brand-600); background:var(--brand-100); border:1px solid var(--brand-300); padding:5px 14px; border-radius:999px; }
.section-title { font-size: clamp(26px, 3.6vw, 38px); font-weight:800; letter-spacing:-.02em; line-height:1.25; }
.section-sub { color:var(--ink-500); font-size:16px; margin-top:12px; max-width:560px; }
.center { text-align:center; }
.center .section-sub { margin-left:auto; margin-right:auto; }

/* ============ 顶部导航 ============ */
.site-header { position:sticky; top:0; z-index:100; background:rgba(255,255,255,.86); backdrop-filter:blur(14px); border-bottom:1px solid var(--card-border); }
.nav { display:flex; align-items:center; justify-content:space-between; height:64px; }
.logo { display:flex; align-items:center; gap:10px; font-weight:800; font-size:20px; letter-spacing:-.02em; cursor:pointer; }
.logo-mark { width:36px; height:36px; border-radius:10px; flex:none; background: linear-gradient(135deg, var(--brand-500) 0%, var(--cyan-400) 60%, var(--accent-400) 130%); display:grid; place-items:center; color:#fff; font-size:17px; font-weight:900; box-shadow: var(--shadow-md); }
.nav-links { display:flex; gap:6px; list-style:none; align-items:center; }
.nav-links a { padding:8px 16px; border-radius:999px; font-size:15px; font-weight:500; color:var(--ink-700); transition:all var(--transition); cursor:pointer; }
.nav-links a:hover { background:var(--brand-100); color:var(--brand-600); }
.nav-links a.active { background:var(--brand-600); color:#fff; }
.nav-cta { display:flex; gap:10px; align-items:center; }
.nav-cta .btn { padding:9px 20px; font-size:14px; }
.nav-user { display:none; align-items:center; gap:10px; font-size:14px; font-weight:600; color:var(--brand-600); cursor:pointer; padding:7px 14px; border-radius:999px; background:var(--brand-100); border:1px solid var(--brand-300); }
.nav-user.show { display:inline-flex; }
.hamburger { display:none; background:none; border:none; cursor:pointer; padding:8px; }
.hamburger span { display:block; width:22px; height:2.5px; background:var(--ink-900); margin:5px 0; border-radius:2px; }

/* ============ 页面切换 ============ */
.page { display:none; animation:fadeIn .35s ease; }
.page.active { display:block; }
@keyframes fadeIn { from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;} }

/* ============ Hero ============ */
.hero {
  background:
    radial-gradient(900px 500px at 15% -10%, rgba(99,102,241,.45), transparent 60%),
    radial-gradient(700px 420px at 90% 10%, rgba(34,211,238,.25), transparent 60%),
    radial-gradient(600px 400px at 70% 90%, rgba(244,63,94,.22), transparent 60%),
    linear-gradient(160deg, var(--hero-bg), var(--hero-bg2));
  color:#fff; padding: 96px 0 110px; position:relative; overflow:hidden;
}
.hero::after { content:""; position:absolute; inset:0; pointer-events:none;
  background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:44px 44px; mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, #000 40%, transparent 100%); }
.hero .container { position:relative; z-index:1; display:grid; grid-template-columns: 1.05fr .95fr; gap:56px; align-items:center; }
.hero-badge { display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; color:#c7d2fe; background:rgba(99,102,241,.18); border:1px solid rgba(165,180,252,.35); padding:6px 16px; border-radius:999px; margin-bottom:22px; }
.hero-badge .dot { width:8px; height:8px; border-radius:50%; background:var(--cyan-400); box-shadow:0 0 12px var(--cyan-400); animation:pulse 1.8s infinite; }
@keyframes pulse { 0%,100%{opacity:1;} 50%{opacity:.35;} }
.hero h1 { font-size: clamp(34px, 4.8vw, 56px); font-weight:900; line-height:1.18; letter-spacing:-.03em; margin-bottom:20px; }
.hero h1 .grad { background: linear-gradient(90deg, #a5b4fc, #22d3ee 45%, #fb7185); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero p.lead { font-size:18px; color:#cbd5e1; max-width:520px; margin-bottom:34px; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:34px; }
.hero-stats { display:flex; gap:40px; flex-wrap:wrap; }
.hero-stats .num { font-family:var(--font-en); font-size:26px; font-weight:800; }
.hero-stats .lab { font-size:13px; color:#94a3b8; }
.hero-visual { position:relative; }
.phone-mock { width:min(320px, 100%); margin:0 auto; border-radius:40px; background:linear-gradient(160deg,#1e293b,#0f172a); border:1px solid rgba(255,255,255,.14); padding:14px; box-shadow: 0 40px 90px -20px rgba(0,0,0,.6), 0 0 0 6px rgba(99,102,241,.12); transform: rotate(3deg); transition: transform .5s ease; }
.phone-mock:hover { transform: rotate(0deg) translateY(-6px); }
.phone-screen { border-radius:28px; overflow:hidden; aspect-ratio: 9/18; background: linear-gradient(180deg, #1a2240 0%, #2a1f4d 55%, #3b1f3f 100%); position:relative; display:flex; flex-direction:column; padding:18px; }
.ps-top { display:flex; justify-content:space-between; align-items:center; font-size:11px; color:#94a3b8; }
.ps-title { color:#fff; font-weight:700; font-size:14px; margin:16px 0 10px; }
.ps-clip { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:12px; padding:10px 12px; margin-bottom:8px; }
.ps-clip .t { font-size:12px; color:#e2e8f0; font-weight:600; }
.ps-clip .d { font-size:10px; color:#818cf8; margin-top:2px; font-family:var(--font-mono); }
.ps-track { margin-top:auto; height:52px; border-radius:10px; background: repeating-linear-gradient(90deg, rgba(99,102,241,.55) 0 26px, rgba(34,211,238,.55) 26px 40px, rgba(244,63,94,.5) 40px 62px, rgba(255,255,255,.1) 62px 70px); border:1px solid rgba(255,255,255,.16); animation: trackmove 6s linear infinite; }
@keyframes trackmove { to { background-position: 200px 0; } }
.float-chip { position:absolute; background:rgba(15,23,42,.8); backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,.16); border-radius:14px; padding:10px 16px; font-size:13px; font-weight:600; color:#e2e8f0; box-shadow:0 16px 40px rgba(0,0,0,.4); display:flex; align-items:center; gap:8px; animation: floaty 4.5s ease-in-out infinite; }
.float-chip .ico { width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:14px; }
.chip-ai { top:6%; left:-4%; }
.chip-dedup { bottom:14%; right:-6%; animation-delay:1.2s; }
@keyframes floaty { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-12px);} }

.section { padding: 88px 0; }
.section.soft { background:var(--bg-soft); }
.feature-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap:24px; margin-top:52px; }
.fcard { background:#fff; border:1px solid var(--card-border); border-radius:var(--radius-lg); padding:30px 26px; transition:all var(--transition); box-shadow:var(--shadow-sm); position:relative; overflow:hidden; }
.fcard::before { content:""; position:absolute; top:0; left:0; right:0; height:3px; background: linear-gradient(90deg, var(--brand-500), var(--cyan-400)); transform:scaleX(0); transform-origin:left; transition:transform var(--transition); }
.fcard:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:var(--brand-300); }
.fcard:hover::before { transform:scaleX(1); }
.fcard .icon { width:52px; height:52px; border-radius:14px; display:grid; place-items:center; font-size:24px; margin-bottom:18px; }
.icon.i1 { background:linear-gradient(135deg,#eef2ff,#e0e7ff); }
.icon.i2 { background:linear-gradient(135deg,#ecfeff,#cffafe); }
.icon.i3 { background:linear-gradient(135deg,#fff1f2,#ffe4e6); }
.icon.i4 { background:linear-gradient(135deg,#f0fdf4,#dcfce7); }
.icon.i5 { background:linear-gradient(135deg,#fffbeb,#fef3c7); }
.icon.i6 { background:linear-gradient(135deg,#faf5ff,#f3e8ff); }
.fcard h3 { font-size:18px; font-weight:700; margin-bottom:8px; }
.fcard p { font-size:14.5px; color:var(--ink-500); }
.fcard .tag { display:inline-block; margin-top:14px; font-size:12px; font-weight:600; color:var(--brand-600); background:var(--brand-100); padding:3px 10px; border-radius:999px; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:52px; counter-reset:step; }
.step { background:#fff; border:1px solid var(--card-border); border-radius:var(--radius-lg); padding:34px 28px; text-align:center; position:relative; }
.step::before { counter-increment:step; content:"0" counter(step); font-family:var(--font-en); font-size:44px; font-weight:900; display:block; background:linear-gradient(135deg,var(--brand-300),var(--brand-600)); -webkit-background-clip:text; background-clip:text; color:transparent; margin-bottom:10px; }
.step h3 { font-size:18px; margin-bottom:8px; }
.step p { font-size:14px; color:var(--ink-500); }
.stats-band { background:linear-gradient(120deg, var(--brand-700), var(--brand-500) 55%, var(--cyan-500)); border-radius:var(--radius-xl); color:#fff; padding:56px 40px; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:center; box-shadow:var(--shadow-lg); }
.stats-band .num { font-family:var(--font-en); font-size:clamp(26px,3.4vw,40px); font-weight:900; letter-spacing:-.02em; }
.stats-band .lab { font-size:14px; color:rgba(255,255,255,.85); margin-top:6px; }

/* ============ 下载页 ============ */
.download-hero { background:radial-gradient(800px 400px at 50% -20%, rgba(99,102,241,.4), transparent 65%), linear-gradient(160deg,#0b1020,#131a33); color:#fff; padding:80px 0 90px; text-align:center; }
.dl-cards { display:grid; grid-template-columns:repeat(2,minmax(0,420px)); gap:28px; justify-content:center; margin-top:52px; }
.dl-card { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:var(--radius-xl); padding:36px; backdrop-filter:blur(10px); display:flex; gap:26px; align-items:center; text-align:left; transition:all var(--transition); }
.dl-card:hover { transform:translateY(-4px); background:rgba(255,255,255,.1); box-shadow:var(--shadow-lg); }
.dl-card .os-ico { font-size:42px; flex:none; }
.dl-card h3 { font-size:20px; font-weight:800; }
.dl-card .ver { font-size:13px; color:#94a3b8; margin:4px 0 14px; font-family:var(--font-mono); }
.dl-store { display:inline-flex; align-items:center; gap:8px; background:#fff; color:var(--ink-900); font-weight:700; font-size:14.5px; border-radius:12px; padding:10px 18px; transition:transform var(--transition); cursor:pointer; border:none; }
.dl-store:hover { transform:translateY(-2px); }
.dl-store.and { background:linear-gradient(135deg,#34d399,#10b981); color:#fff; }
.qr-box { flex:none; width:96px; height:96px; border-radius:14px; background:#fff; display:grid; place-items:center; position:relative; }
.qr { width:76px; height:76px; background:
    conic-gradient(var(--ink-900) 25%, transparent 0 50%, var(--ink-900) 0 75%, transparent 0) 0 0/12px 12px,
    repeating-linear-gradient(0deg, var(--ink-900) 0 4px, transparent 4px 8px),
    repeating-linear-gradient(90deg, var(--ink-900) 0 4px, #fff 4px 8px);
  mix-blend-mode:multiply; opacity:.9; }
.qr-label { position:absolute; bottom:-24px; left:0; right:0; text-align:center; font-size:12px; color:#94a3b8; white-space:nowrap; }
.dl-note { margin-top:44px; font-size:13.5px; color:#94a3b8; line-height:2; }
.dl-note b { color:#e2e8f0; }
.min-req { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:36px; }
.min-req span { font-size:13px; color:#c7d2fe; background:rgba(99,102,241,.14); border:1px solid rgba(165,180,252,.3); padding:6px 14px; border-radius:999px; }

/* ============ 登录注册页 ============ */
.auth-wrap { min-height: calc(100vh - 64px); display:grid; grid-template-columns: 1fr 1fr; background: linear-gradient(160deg,#0b1020,#131a33); }
.auth-side { position:relative; overflow:hidden; color:#fff; display:flex; flex-direction:column; justify-content:center; padding:64px; }
.auth-side::before { content:""; position:absolute; inset:0; background:
    radial-gradient(600px 400px at 20% 80%, rgba(99,102,241,.5), transparent 60%),
    radial-gradient(500px 350px at 80% 20%, rgba(244,63,94,.3), transparent 60%); }
.auth-side > * { position:relative; }
.auth-side h2 { font-size:34px; font-weight:900; line-height:1.3; letter-spacing:-.02em; margin-bottom:16px; }
.auth-side p { color:#cbd5e1; font-size:15.5px; max-width:380px; }
.auth-side ul { list-style:none; margin-top:32px; display:grid; gap:14px; }
.auth-side li { display:flex; gap:12px; align-items:center; font-size:15px; color:#e2e8f0; }
.auth-side li .ck { width:24px; height:24px; border-radius:50%; flex:none; display:grid; place-items:center; background:rgba(34,211,238,.18); border:1px solid rgba(34,211,238,.4); color:var(--cyan-400); font-size:13px; }
.auth-panel { background:#fff; display:flex; align-items:center; justify-content:center; padding:48px 32px; }
.auth-card { width:100%; max-width:410px; }
.auth-card h1 { font-size:26px; font-weight:800; letter-spacing:-.02em; }
.auth-card .sub { color:var(--ink-500); font-size:14.5px; margin:8px 0 26px; }
.seg { display:grid; grid-template-columns:1fr 1fr; background:var(--ink-100); border-radius:12px; padding:4px; margin-bottom:24px; }
.seg.tri { grid-template-columns:1fr 1fr 1fr; }
.seg button { border:none; background:transparent; padding:9px; border-radius:9px; cursor:pointer; font-size:14.5px; font-weight:600; color:var(--ink-500); transition:all var(--transition); }
.seg button.on { background:#fff; color:var(--brand-600); box-shadow:var(--shadow-sm); }
.field { margin-bottom:16px; }
.field label { display:block; font-size:13.5px; font-weight:600; color:var(--ink-700); margin-bottom:7px; }
.input-group { display:flex; gap:10px; }
.input { width:100%; padding:12px 14px; font-size:15px; color:var(--ink-900); border:1.5px solid var(--card-border); border-radius:12px; background:#fff; transition:all var(--transition); outline:none; }
.input:focus { border-color:var(--brand-500); box-shadow:0 0 0 3.5px rgba(99,102,241,.14); }
.input::placeholder { color:#94a3b8; }
.code-btn { flex:none; border:1.5px solid var(--brand-300); background:var(--brand-100); color:var(--brand-600); font-size:14px; font-weight:600; border-radius:12px; padding:0 16px; cursor:pointer; transition:all var(--transition); white-space:nowrap; }
.code-btn:hover:not(:disabled) { background:#e0e7ff; }
.code-btn:disabled { opacity:.55; cursor:not-allowed; }
.captcha-row { display:flex; gap:10px; align-items:stretch; }
.captcha-img { flex:none; height:50px; border-radius:10px; border:1.5px solid var(--card-border); cursor:pointer; background:var(--ink-100); }
.form-msg { display:none; font-size:13.5px; border-radius:10px; padding:10px 14px; margin-bottom:14px; line-height:1.6; }
.form-msg.show { display:block; }
.form-msg.ok { color:var(--ok); background:var(--ok-bg); border:1px solid var(--ok-bd); }
.form-msg.err { color:var(--err); background:var(--err-bg); border:1px solid var(--err-bd); }
.auth-extra { display:flex; justify-content:space-between; align-items:center; font-size:13.5px; color:var(--ink-500); margin:6px 0 22px; }
.auth-extra a { color:var(--brand-600); font-weight:600; cursor:pointer; }
.agree { display:flex; gap:8px; align-items:flex-start; font-size:12.5px; color:var(--ink-500); margin:18px 0 6px; }
.agree input { margin-top:3px; accent-color:var(--brand-600); }
.auth-switch { text-align:center; font-size:14px; color:var(--ink-500); margin-top:24px; }
.auth-switch a { color:var(--brand-600); font-weight:700; cursor:pointer; }
.third-party { margin-top:30px; text-align:center; }
.third-party .divider { display:flex; align-items:center; gap:14px; color:var(--ink-300); font-size:12.5px; margin-bottom:18px; }
.third-party .divider::before, .third-party .divider::after { content:""; flex:1; height:1px; background:var(--card-border); }
.tp-icons { display:flex; justify-content:center; gap:18px; }
.tp-ico { width:44px; height:44px; border-radius:50%; border:1.5px solid var(--card-border); display:grid; place-items:center; font-size:20px; cursor:pointer; transition:all var(--transition); background:#fff; }
.tp-ico:hover { border-color:var(--brand-300); background:var(--brand-100); transform:translateY(-2px); }
.sms-off-tip { font-size:12.5px; color:var(--warn); background:var(--warn-bg); border:1px solid var(--warn-bd); border-radius:10px; padding:8px 12px; margin-bottom:14px; }

/* ============ 用户中心 ============ */
.account-hero { background:radial-gradient(800px 400px at 50% -20%, rgba(99,102,241,.4), transparent 65%), linear-gradient(160deg,#0b1020,#131a33); color:#fff; padding:48px 0 88px; }
.account-hero .who { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.avatar { width:56px; height:56px; border-radius:50%; background:linear-gradient(135deg,var(--brand-500),var(--cyan-400)); display:grid; place-items:center; font-size:24px; font-weight:900; flex:none; }
.account-hero h1 { font-size:24px; font-weight:800; }
.account-hero .meta { font-size:13.5px; color:#94a3b8; margin-top:2px; }
.plan-pill { font-size:12.5px; font-weight:700; padding:4px 12px; border-radius:999px; background:rgba(34,211,238,.15); border:1px solid rgba(34,211,238,.4); color:var(--cyan-400); }
.credit-tile { display:inline-flex; align-items:baseline; gap:8px; margin-left:auto; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.15); border-radius:16px; padding:10px 20px; }
.credit-tile .n { font-family:var(--font-en); font-size:26px; font-weight:900; color:var(--cyan-400); }
.credit-tile .l { font-size:12.5px; color:#94a3b8; }
.account-body { max-width:960px; margin:-48px auto 0; padding:0 24px 88px; position:relative; z-index:2; }
.atabs { display:flex; gap:8px; background:#fff; border:1px solid var(--card-border); border-radius:16px; padding:6px; box-shadow:var(--shadow-md); margin-bottom:24px; overflow-x:auto; }
.atabs button { flex:1; border:none; background:transparent; padding:11px 16px; border-radius:11px; cursor:pointer; font-size:14.5px; font-weight:600; color:var(--ink-500); white-space:nowrap; transition:all var(--transition); }
.atabs button.on { background:var(--brand-600); color:#fff; }
.apane { display:none; }
.apane.on { display:block; animation:fadeIn .3s ease; }
.panel { background:#fff; border:1px solid var(--card-border); border-radius:var(--radius-xl); padding:28px; box-shadow:var(--shadow-sm); margin-bottom:20px; }
.panel h3 { font-size:17px; font-weight:800; margin-bottom:16px; display:flex; align-items:center; gap:10px; }
.tier-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.tier { border:1.5px solid var(--card-border); border-radius:16px; padding:18px 14px; text-align:center; cursor:pointer; transition:all var(--transition); }
.tier:hover { border-color:var(--brand-500); transform:translateY(-3px); box-shadow:var(--shadow-md); }
.tier .c { font-family:var(--font-en); font-size:22px; font-weight:900; color:var(--brand-600); }
.tier .p { font-size:14px; color:var(--ink-500); margin-top:4px; }
.tbl { width:100%; border-collapse:collapse; font-size:13.5px; }
.tbl th { text-align:left; color:var(--ink-500); font-weight:600; padding:10px 12px; border-bottom:1.5px solid var(--card-border); white-space:nowrap; }
.tbl td { padding:11px 12px; border-bottom:1px solid var(--ink-100); vertical-align:top; }
.tbl tr:last-child td { border-bottom:none; }
.amount-pos { color:var(--ok); font-weight:700; }
.amount-neg { color:var(--err); font-weight:700; }
.token-row { display:flex; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid var(--ink-100); flex-wrap:wrap; }
.token-row:last-child { border-bottom:none; }
.token-mask { font-family:var(--font-mono); font-size:13px; color:var(--ink-700); background:var(--ink-100); border-radius:8px; padding:6px 12px; }
.pill { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; padding:3px 10px; border-radius:999px; }
.pill.ok { color:var(--ok); background:var(--ok-bg); border:1px solid var(--ok-bd); }
.pill.off { color:var(--ink-500); background:var(--ink-100); border:1px solid var(--ink-300); }
.pill.warn { color:var(--warn); background:var(--warn-bg); border:1px solid var(--warn-bd); }
.pay-panel { display:none; border:1.5px solid var(--brand-300); background:var(--brand-100); border-radius:18px; padding:20px; margin-top:16px; }
.pay-panel.show { display:block; }
.pay-qr { width:180px; height:180px; background:#fff; border-radius:12px; display:grid; place-items:center; margin:0 auto; }
.pay-qr img { width:164px; height:164px; }
.empty-tip { color:var(--ink-500); font-size:14px; padding:18px 0; text-align:center; }

/* ============ 页脚 ============ */
.site-footer { background:var(--ink-900); color:#94a3b8; }
.footer-top { display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap:40px; padding:64px 0 48px; }
.footer-brand .logo { color:#fff; margin-bottom:16px; }
.footer-brand p { font-size:14px; max-width:300px; line-height:1.8; }
.socials { display:flex; gap:12px; margin-top:20px; }
.soc { width:38px; height:38px; border-radius:10px; display:grid; place-items:center; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); font-size:17px; cursor:pointer; transition:all var(--transition); }
.soc:hover { background:var(--brand-600); border-color:var(--brand-600); color:#fff; transform:translateY(-2px); }
.footer-col h4 { color:#e2e8f0; font-size:15px; font-weight:700; margin-bottom:18px; }
.footer-col ul { list-style:none; display:grid; gap:11px; }
.footer-col a { font-size:14px; cursor:pointer; transition:color var(--transition); }
.footer-col a:hover { color:#fff; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.08); padding:22px 0; display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; font-size:13px; }
.footer-bottom .links { display:flex; gap:20px; }

/* Toast */
#toast { position:fixed; top:76px; left:50%; transform:translateX(-50%) translateY(-16px); z-index:999; max-width:min(480px, 90vw); padding:12px 22px; border-radius:14px; font-size:14px; font-weight:600; opacity:0; pointer-events:none; transition:all .3s ease; box-shadow:var(--shadow-lg); }
#toast.show { opacity:1; transform:translateX(-50%) translateY(0); }
#toast.ok { background:var(--ok-bg); color:var(--ok); border:1.5px solid var(--ok-bd); }
#toast.err { background:var(--err-bg); color:var(--err); border:1.5px solid var(--err-bd); }
#toast.warn { background:var(--warn-bg); color:var(--warn); border:1.5px solid var(--warn-bd); }

/* ============ 响应式 ============ */
@media (max-width: 1024px) {
  .hero .container { grid-template-columns:1fr; gap:44px; }
  .hero-visual { max-width:380px; margin:0 auto; }
  .feature-grid { grid-template-columns:repeat(2,1fr); }
  .steps { grid-template-columns:1fr; max-width:460px; margin-left:auto; margin-right:auto; }
  .stats-band { grid-template-columns:repeat(2,1fr); }
  .footer-top { grid-template-columns:1fr 1fr; }
  .auth-wrap { grid-template-columns:1fr; }
  .auth-side { display:none; }
  .tier-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 720px) {
  .nav-links { display:none; position:absolute; top:64px; left:0; right:0; background:#fff; border-bottom:1px solid var(--card-border); flex-direction:column; align-items:stretch; padding:12px 20px 20px; gap:4px; box-shadow:var(--shadow-lg); }
  .nav-links.open { display:flex; }
  .nav-links a { padding:12px 16px; border-radius:12px; }
  .hamburger { display:block; }
  .nav-cta .btn-login { display:none; }
  .feature-grid { grid-template-columns:1fr; }
  .dl-cards { grid-template-columns:1fr; }
  .dl-card { flex-direction:column; text-align:center; }
  .qr-label { position:static; margin-top:6px; }
  .stats-band { padding:40px 24px; }
  .hero { padding:64px 0 80px; }
  .hero-stats { gap:24px; }
  .footer-top { grid-template-columns:1fr; gap:32px; }
  .credit-tile { margin-left:0; }
  .tier-grid { grid-template-columns:repeat(2,1fr); }
  .tbl-wrap { overflow-x:auto; }
}