/* ============================================================
   百宝袋官网 · 设计系统（2026-09-05 重构，全站去原生样式）
   - 设计令牌对齐客户端 src/styles/global.css（docs/03 §2 光色主题）：
     白底 / 靛蓝 #4F46E5 / Inter 系统栈 / 相同的圆角与阴影阶
   - 版式参考 GLM 官网营销页：大留白 Hero / 渐变标题 / 胶囊按钮 / 卡片栅格
   - 隐私纪律：零第三方资源（不加载任何外部字体/脚本/图片）
   - 全站无浏览器原生外观：按钮、输入框、单选、表格、列表、提示全部自绘
   ============================================================ */

:root {
  --bg: #ffffff;
  --bg2: #f6f7f9;
  --bg3: #eef0f4;
  --border: rgba(0, 0, 0, .08);
  --border-strong: rgba(0, 0, 0, .14);
  --t1: #18181b;
  --t2: #52525b;
  --t3: #9ca3af;
  --pri: #4f46e5;
  --prih: #4338ca;
  --pri-soft: rgba(79, 70, 229, .09);
  --violet: #7c3aed;
  --ok: #16a34a;
  --ok-soft: rgba(22, 163, 74, .1);
  --ok-border: rgba(22, 163, 74, .38);
  --warn: #b45309;
  --warn-bg: #fdf6ea;
  --warn-border: rgba(217, 119, 6, .32);
  --err: #dc2626;
  --grad: linear-gradient(120deg, var(--pri), var(--violet));
  --r-card: 16px;
  --r-input: 10px;
  --sh-sm: 0 1px 2px rgba(16, 24, 40, .05);
  --sh-md: 0 4px 14px rgba(16, 24, 40, .07), 0 1px 3px rgba(16, 24, 40, .05);
  --sh-lg: 0 20px 50px rgba(16, 24, 40, .12), 0 4px 12px rgba(16, 24, 40, .06);
  --sh-pri: 0 8px 24px rgba(79, 70, 229, .26);
  --max: 1120px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  background: var(--bg);
  color: var(--t1);
  font: 15px/1.75 "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
}
::selection { background: rgba(79, 70, 229, .18); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, .16); border: 2px solid transparent; border-radius: 6px; background-clip: content-box; }
::-webkit-scrollbar-track { background: transparent; }

a { color: var(--pri); text-decoration: none; transition: color .12s; }
a:hover { color: var(--prih); }
code, .mono {
  font-family: "JetBrains Mono", Consolas, monospace; font-size: .88em;
  background: var(--bg2); border: 1px solid var(--border); border-radius: 6px; padding: 1px 7px;
}
b, strong { font-weight: 600; }
button { font-family: inherit; }
:focus-visible { outline: 2px solid var(--pri); outline-offset: 2px; border-radius: 4px; }

/* ── 导航 ── */
.nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(14px) saturate(1.6); -webkit-backdrop-filter: blur(14px) saturate(1.6);
  border-bottom: 1px solid var(--border);
}
.nav-inner { max-width: var(--max); margin: 0 auto; padding: 0 24px; height: 62px; display: flex; align-items: center; gap: 26px; }
.logo { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 16.5px; color: var(--t1); letter-spacing: .2px; flex: none; }
.logo:hover { color: var(--t1); }
/* 官方 LOGO（与客户端图标同源：src-tauri/icons/icon.png → assets/logo.png） */
.logo-mark { width: 30px; height: 30px; border-radius: 8px; flex: none; box-shadow: 0 1px 5px rgba(16, 24, 40, .22); }
.nav-links { display: flex; gap: 4px; margin-left: auto; align-items: center; overflow-x: auto; scrollbar-width: none; }
.nav-links::-webkit-scrollbar { display: none; }
.nav-links a { color: var(--t2); font-size: 14px; padding: 7px 13px; border-radius: 999px; white-space: nowrap; transition: color .12s, background .12s; }
.nav-links a:not(.nav-cta):hover { color: var(--t1); background: var(--bg2); }
/* site.js 会给当前页所有同 href 链接加 .on（含 CTA），CTA 必须保持实心靛蓝 */
.nav-links a.on:not(.nav-cta), .nav-links a.on:not(.nav-cta):hover { color: var(--pri); background: var(--pri-soft); font-weight: 600; }
.nav-cta { background: var(--pri); color: #fff !important; padding: 8px 18px !important; font-weight: 600; margin-left: 8px; box-shadow: var(--sh-pri); }
.nav-cta:hover { background: var(--prih) !important; }

/* ── 版式 ── */
.wrap { max-width: var(--max); margin: 0 auto; padding: 56px 24px 24px; }
.wrap.narrow { max-width: 800px; }
.page-head { margin-bottom: 34px; }
.page-head.center { text-align: center; }
.page-head.center .page-sub { margin-left: auto; margin-right: auto; }
.page-title { font-size: clamp(26px, 3.4vw, 34px); font-weight: 800; letter-spacing: .2px; line-height: 1.3; }
.page-sub { color: var(--t2); margin-top: 10px; font-size: 15px; max-width: 720px; }
h2.sec { font-size: 21px; font-weight: 700; margin: 48px 0 18px; padding-left: 13px; position: relative; }
h2.sec::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 4px; border-radius: 2px; background: var(--grad); }
h3 { font-size: 16px; margin: 24px 0 10px; }
p.lead { color: var(--t2); }
ul.plain { list-style: none; color: var(--t2); }
ul.plain li { margin: 8px 0; padding-left: 20px; position: relative; }
ul.plain li::before { content: ""; position: absolute; left: 4px; top: .78em; width: 6px; height: 6px; border-radius: 50%; background: var(--pri); }
.small { font-size: 13px; color: var(--t3); }

/* ── 首页 Hero ── */
.hero { position: relative; text-align: center; padding: 84px 0 40px; }
.hero::before, .hero::after { content: ""; position: absolute; z-index: -1; border-radius: 50%; filter: blur(90px); pointer-events: none; }
.hero::before { width: 520px; height: 520px; left: -140px; top: -180px; background: radial-gradient(circle, rgba(79, 70, 229, .16), transparent 70%); }
.hero::after { width: 460px; height: 460px; right: -120px; top: -140px; background: radial-gradient(circle, rgba(124, 58, 237, .13), transparent 70%); }
.badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--pri-soft); color: var(--pri);
  border: 1px solid rgba(79, 70, 229, .22);
  font-size: 13px; font-weight: 600; padding: 6px 16px; border-radius: 999px; margin-bottom: 26px;
}
.badge-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); animation: pulse 2.2s infinite; }
@keyframes pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(22, 163, 74, .4); } 50% { box-shadow: 0 0 0 5px rgba(22, 163, 74, 0); } }
.hero h1 { font-size: clamp(34px, 5vw, 52px); line-height: 1.18; font-weight: 800; letter-spacing: .5px; }
.hero h1 em { font-style: normal; white-space: nowrap; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-sub { color: var(--t2); font-size: 17px; margin: 20px auto 36px; max-width: 620px; }

/* ── 按钮（胶囊，全站自绘） ── */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 13px 30px; border-radius: 999px;
  font-weight: 600; font-size: 15px; border: 1px solid transparent; cursor: pointer;
  user-select: none; transition: transform .15s, box-shadow .15s, background .15s, border-color .15s, color .15s;
}
.btn-pri { background: var(--pri); color: #fff; box-shadow: var(--sh-pri); }
.btn-pri:hover { background: var(--prih); color: #fff; transform: translateY(-1px); }
.btn-ghost { background: #fff; color: var(--t1); border-color: var(--border-strong); }
.btn-ghost:hover { border-color: var(--pri); color: var(--pri); transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn[aria-busy="true"], .btn:disabled { opacity: .55; pointer-events: none; }
.btn-row { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.btn-row.start { justify-content: flex-start; }

/* ── 统计行 ── */
.stats-row { display: flex; justify-content: center; margin-top: 54px; flex-wrap: wrap; row-gap: 18px; }
.stat-b { text-align: center; padding: 0 44px; }
.stat-b + .stat-b { border-left: 1px solid var(--border); }
.stat-b b {
  font-size: 32px; font-weight: 800; display: block; line-height: 1.3;
  background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.stat-b span { color: var(--t3); font-size: 13px; }

/* ── 产品截图（真实客户端界面）── */
.shot-frame {
  margin: 52px auto 0; max-width: 960px; background: #fff;
  border: 1px solid var(--border); border-radius: 16px; overflow: hidden;
  box-shadow: 0 24px 60px -18px rgba(24, 24, 27, .22), 0 6px 18px -8px rgba(24, 24, 27, .12);
  text-align: left;
}
.shot-bar { display: flex; align-items: center; gap: 7px; padding: 11px 14px; border-bottom: 1px solid var(--border); background: var(--bg2); }
.shot-bar i { width: 10px; height: 10px; border-radius: 50%; }
.shot-bar i:nth-child(1) { background: #f87171; }
.shot-bar i:nth-child(2) { background: #fbbf24; }
.shot-bar i:nth-child(3) { background: #34d399; }
.shot-bar span { margin-left: 8px; font-size: 12px; color: var(--t3); }
.shot-frame img { display: block; width: 100%; height: auto; }

/* ── 营销区块 ── */
.section { padding: 34px 0 8px; }
.sec-head { text-align: center; max-width: 640px; margin: 0 auto 42px; }
.eyebrow { display: inline-block; font-size: 12.5px; font-weight: 700; letter-spacing: 2.5px; color: var(--pri); margin-bottom: 12px; }
.sec-head h2 { font-size: clamp(24px, 3.2vw, 32px); font-weight: 800; }
.sec-head p { color: var(--t2); margin-top: 12px; }

/* ── 卡片栅格 ── */
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; }
.card {
  background: #fff; border: 1px solid var(--border); border-radius: var(--r-card);
  padding: 26px; box-shadow: var(--sh-sm);
  transition: transform .18s, box-shadow .18s, border-color .18s;
}
.card:hover { transform: translateY(-3px); box-shadow: var(--sh-md); border-color: rgba(79, 70, 229, .3); }
.ico-box {
  width: 44px; height: 44px; border-radius: 12px; background: var(--pri-soft); color: var(--pri);
  display: flex; align-items: center; justify-content: center; margin-bottom: 14px;
}
.ico-box svg { fill: currentColor; }
.ico-box.t-violet { background: rgba(124, 58, 237, .09); color: #7c3aed; }
.ico-box.t-green { background: rgba(22, 163, 74, .09); color: #16a34a; }
.ico-box.t-sky { background: rgba(2, 132, 199, .10); color: #0284c7; }
.card .ico { font-size: 26px; }
.card h3 { margin: 0 0 8px; font-size: 16.5px; }
.card p { color: var(--t2); font-size: 13.5px; line-height: 1.7; }
.promise-num {
  font-size: 28px; font-weight: 800; line-height: 1; margin-bottom: 14px;
  background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ── CTA 横幅 ── */
.cta-band {
  margin: 72px 0 24px; border-radius: 22px; background: var(--grad);
  padding: 60px 32px; text-align: center; color: #fff;
  position: relative; overflow: hidden; box-shadow: var(--sh-lg);
}
.cta-band::before {
  content: ""; position: absolute; width: 420px; height: 420px; border-radius: 50%;
  right: -140px; top: -200px; background: radial-gradient(circle, rgba(255, 255, 255, .18), transparent 70%);
  pointer-events: none;
}
.cta-band h2 { font-size: clamp(24px, 3vw, 32px); font-weight: 800; }
.cta-band p { color: rgba(255, 255, 255, .85); margin: 14px auto 30px; max-width: 520px; }
.cta-band .btn-pri { background: #fff; color: var(--pri); box-shadow: 0 8px 24px rgba(0, 0, 0, .18); }
.cta-band .btn-pri:hover { background: #f1f2ff; color: var(--prih); }
.cta-band .btn-ghost { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .45); color: #fff; }
.cta-band .btn-ghost:hover { background: rgba(255, 255, 255, .22); color: #fff; border-color: rgba(255, 255, 255, .7); }

/* ── 表格（卡片容器，无原生网格线） ── */
.tbl-wrap { border: 1px solid var(--border); border-radius: 14px; overflow-x: auto; box-shadow: var(--sh-sm); margin: 4px 0 8px; }
table.tbl { width: 100%; border-collapse: collapse; font-size: 14px; background: #fff; }
.cmp-wrap .tbl { min-width: 620px; }
.tbl th, .tbl td { padding: 12px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); }
.tbl th { background: var(--bg2); color: var(--t2); font-weight: 600; font-size: 13px; white-space: nowrap; }
.tbl td { color: var(--t2); }
.tbl td:first-child { color: var(--t1); font-weight: 500; }
.tbl tr:last-child td { border-bottom: 0; }
.tbl tr:hover td { background: #fafbfe; }
.tbl .hl { color: var(--ok); font-weight: 600; }
.tbl .dim { color: var(--t3); }
.cmp-wrap { margin-top: 4px; }

/* ── 定价卡（两行铺开：上行 3 张 ¥0/¥1/¥9.9，下行 2 张宽卡 ¥69/¥169） ── */
.plans { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; align-items: stretch; }
.plans .plan { grid-column: span 2; }
.plans .plan.wide { grid-column: span 3; }
.plan {
  background: #fff; border: 1px solid var(--border); border-radius: 18px;
  padding: 30px 28px; position: relative; display: flex; flex-direction: column;
  box-shadow: var(--sh-sm); transition: transform .18s, box-shadow .18s;
}
.plan:hover { transform: translateY(-3px); box-shadow: var(--sh-md); }
.plan.hot { border: 1.5px solid var(--pri); box-shadow: 0 16px 44px rgba(79, 70, 229, .16); }
.plan .tag {
  position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
  background: var(--grad); color: #fff; font-size: 12px; font-weight: 600;
  padding: 3px 14px; border-radius: 999px; box-shadow: var(--sh-pri); white-space: nowrap;
}
.plan h3 { margin: 0 0 2px; font-size: 17px; }
.plan .price { font-size: 38px; font-weight: 800; margin: 12px 0 2px; letter-spacing: -.5px; }
.plan .price small { font-size: 14px; color: var(--t3); font-weight: 400; }
.plan .bill-note { min-height: 24px; color: var(--t3); font-size: 13px; }
.plan ul { list-style: none; margin-top: 16px; flex: 1; }
.plan li { color: var(--t2); font-size: 13.5px; padding: 6px 0 6px 24px; position: relative; }
.plan li::before { content: "✓"; position: absolute; left: 0; color: var(--ok); font-weight: 700; }
.plan li.no { color: var(--t3); }
.plan li.no::before { content: "—"; color: var(--t3); font-weight: 400; }
.plan .btn { width: 100%; margin-top: 22px; }

/* ── 分段选择器（下载页版本选择，iOS 式自绘） ── */
.edition-pick {
  display: inline-flex; gap: 4px; padding: 4px;
  background: var(--bg3); border: 1px solid var(--border); border-radius: 999px;
}
.edition-pick button {
  background: transparent; color: var(--t2); border: 0; cursor: pointer;
  padding: 9px 24px; border-radius: 999px; font-size: 14px; font-weight: 600;
  white-space: nowrap; transition: background .15s, color .15s, box-shadow .15s;
}
.edition-pick button:hover { color: var(--t1); }
.edition-pick button.on { background: #fff; color: var(--pri); box-shadow: var(--sh-md); }
.edition-pick { margin: 4px 0 6px; }
.pay-note { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; align-items: center; color: var(--t3); font-size: 13px; margin-top: 32px; }
.pay-chip {
  display: inline-flex; align-items: center; gap: 6px;
  background: #fff; border: 1px solid var(--border); border-radius: 999px;
  padding: 5px 15px; color: var(--t2); font-size: 12.5px; box-shadow: var(--sh-sm);
}
.pay-foot-note { margin-top: 18px; text-align: center; }

/* ── 下载 / 版本卡片 ── */
.rel-box {
  background: #fff; border: 1px solid var(--border); border-radius: var(--r-card);
  padding: 26px 28px; margin-top: 22px; box-shadow: var(--sh-sm);
}
.rel-box .ver { font-size: 20px; font-weight: 700; }
.rel-box .meta { color: var(--t3); font-size: 13px; margin: 6px 0 12px; }
.rel-box h3 { margin-top: 18px; }
.rel-notes { color: var(--t2); font-size: 14px; white-space: pre-wrap; }
.rel-actions { display: flex; gap: 12px; margin-top: 18px; flex-wrap: wrap; }
.ver-badge {
  display: inline-block; font-size: 12px; font-weight: 600; vertical-align: middle;
  color: var(--pri); background: var(--pri-soft); border-radius: 999px; padding: 2px 12px; margin-left: 10px;
}
.notice {
  background: var(--warn-bg); border: 1px solid var(--warn-border); color: var(--warn);
  border-radius: 12px; padding: 14px 18px; font-size: 13.5px; margin: 16px 0;
}
.empty-box {
  border: 1.5px dashed var(--border-strong); border-radius: var(--r-card);
  padding: 30px 26px; text-align: center; color: var(--t3); font-size: 14px; background: var(--bg2);
}

/* ── 表单（全自绘，无原生外观） ── */
.form-card {
  background: #fff; border: 1px solid var(--border); border-radius: var(--r-card);
  padding: 28px; box-shadow: var(--sh-sm);
}
.field { margin: 18px 0; }
.field:first-child { margin-top: 0; }
.field label { display: block; font-size: 13.5px; font-weight: 600; color: var(--t2); margin-bottom: 8px; }
.field input, .field textarea {
  width: 100%; background: #fff; border: 1px solid var(--border-strong); color: var(--t1);
  border-radius: var(--r-input); padding: 12px 14px; font-size: 14px; outline: none;
  font-family: "JetBrains Mono", Consolas, monospace;
  transition: border-color .12s, box-shadow .12s; resize: vertical;
}
.field input::placeholder, .field textarea::placeholder { color: var(--t3); }
.field input:focus, .field textarea:focus { border-color: var(--pri); box-shadow: 0 0 0 3.5px var(--pri-soft); }
.form-msg { margin-top: 16px; font-size: 14px; }
.form-msg:empty { display: none; }
.form-msg.ok { color: var(--ok); }
.form-msg.err { color: var(--err); }
.result-box {
  background: var(--bg2); border: 1px solid var(--border); border-radius: 12px;
  padding: 18px; margin-top: 14px; word-break: break-all;
}

/* ── 步骤列表 ── */
.steps { list-style: none; counter-reset: step; display: grid; gap: 12px; }
.steps li {
  counter-increment: step; display: flex; gap: 14px; align-items: flex-start;
  background: #fff; border: 1px solid var(--border); border-radius: 12px;
  padding: 16px 18px; color: var(--t2); font-size: 14px; box-shadow: var(--sh-sm);
}
.steps li::before {
  content: counter(step); flex: none; width: 26px; height: 26px; border-radius: 50%;
  background: var(--pri-soft); color: var(--pri); font-weight: 700; font-size: 13px;
  display: flex; align-items: center; justify-content: center; margin-top: 2px;
}
.steps li b { color: var(--t1); }

/* ── 收银台 ── */
.ck-card { background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 32px; box-shadow: var(--sh-md); }
.ck-rows { margin-bottom: 8px; }
.ck-row { display: flex; justify-content: space-between; gap: 18px; padding: 11px 0; border-bottom: 1px solid var(--border); font-size: 14px; }
.ck-row:last-child { border-bottom: 0; }
.ck-row .k { color: var(--t3); flex: none; }
.ck-row .v { color: var(--t1); text-align: right; word-break: break-all; font-weight: 500; }
.ck-row .v.price { font-size: 22px; font-weight: 800; color: var(--pri); }
.ck-status {
  display: inline-block; font-size: 12px; font-weight: 600; padding: 3px 12px;
  border-radius: 999px; border: 1px solid var(--border-strong); color: var(--t3);
}
.ck-status.paid { color: var(--ok); border-color: var(--ok-border); background: var(--ok-soft); }
.ch-pick { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 20px 0 6px; }
.ch-item {
  display: flex; align-items: center; gap: 12px; cursor: pointer;
  background: #fff; border: 1px solid var(--border-strong); border-radius: 12px;
  padding: 15px 18px; font-size: 14.5px; font-weight: 500; color: var(--t2);
  transition: border-color .12s, background .12s;
}
.ch-item:hover { border-color: var(--pri); }
/* 支付渠道单选：自绘圆点，不用原生控件外观 */
.ch-item input {
  appearance: none; -webkit-appearance: none;
  width: 18px; height: 18px; margin: 0; flex: none; cursor: pointer;
  border: 2px solid var(--border-strong); border-radius: 50%; background: #fff;
  transition: border .12s, box-shadow .12s;
}
.ch-item input:checked { border: 5.5px solid var(--pri); }
.ch-item input:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--pri-soft); }
.ch-item.on { border-color: var(--pri); color: var(--t1); background: var(--pri-soft); }
.ch-ico { font-size: 20px; }
#ck-qrcode {
  width: 150px; height: 150px; background: var(--bg2);
  border: 1.5px dashed var(--border-strong); border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  color: var(--t3); font-size: 12px; text-align: center; flex: none; line-height: 1.9;
}
.ck-grid { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; margin-top: 16px; }
#ck-pay { min-width: 200px; }
.ck-note { margin-top: 12px; max-width: 300px; font-size: 12.5px; color: var(--t3); }
.ck-code-box { margin-top: 22px; background: var(--ok-soft); border: 1px solid var(--ok-border); border-radius: 14px; padding: 22px; }
.ck-code-title { font-size: 13.5px; color: var(--ok); margin-bottom: 12px; }
#ck-code-text {
  font-size: 21px; letter-spacing: 1px; user-select: all;
  background: #fff; border: 1px dashed var(--ok-border); border-radius: 10px;
  padding: 12px 18px; display: inline-block;
}
.ck-code-actions { margin-top: 16px; display: flex; gap: 10px; flex-wrap: wrap; }
.ck-code-help { margin-top: 18px; font-size: 13px; color: var(--t2); line-height: 1.9; }
.ck-guide-shot {
  margin-top: 14px; width: 100%; max-width: 560px; height: auto; display: block;
  border: 1px solid var(--border); border-radius: 10px; box-shadow: var(--sh-sm);
}

/* ── 页脚 ── */
footer { border-top: 1px solid var(--border); margin-top: 84px; background: var(--bg2); }
.foot-inner {
  max-width: var(--max); margin: 0 auto; padding: 44px 24px 48px;
  display: grid; grid-template-columns: 1.6fr 1fr 1fr auto; gap: 36px;
  color: var(--t3); font-size: 13px;
}
.foot-inner .brand { display: flex; gap: 10px; align-items: flex-start; color: var(--t2); font-size: 14px; }
.foot-h { font-weight: 600; color: var(--t2); margin-bottom: 10px; }
.foot-col a { display: block; color: var(--t3); margin-bottom: 8px; }
.foot-col a:hover { color: var(--pri); }
.foot-copy { text-align: right; }

/* ── 页内 toast（替代原生 alert，B81 全站去原生样式） ── */
#site-toast {
  position: fixed; left: 50%; bottom: 36px; z-index: 999;
  transform: translateX(-50%) translateY(14px);
  max-width: min(520px, calc(100vw - 40px));
  background: #18181b; color: #f4f4f5;
  border: 1px solid rgba(255, 255, 255, .1); border-left: 3px solid #fbbf24;
  border-radius: 12px; padding: 13px 18px; font-size: 13.5px; line-height: 1.6;
  box-shadow: var(--sh-lg);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .18s, transform .18s, visibility .18s;
}
#site-toast.show { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }

/* ── 响应式 ── */
@media (max-width: 1080px) {
  .plans { grid-template-columns: repeat(2, 1fr); }
  .plans .plan { grid-column: auto; padding: 30px 28px; }
  .plans .plan.wide { grid-column: auto; }
  .plans .plan .price { font-size: 38px; }
  .plans .plan li { font-size: 13.5px; padding: 6px 0 6px 24px; }
  .plans .plan:last-child { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .plans { grid-template-columns: 1fr; max-width: 460px; margin-left: auto; margin-right: auto; }
  .foot-inner { grid-template-columns: 1fr 1fr; }
  .foot-copy { grid-column: 1 / -1; text-align: left; }
}
@media (max-width: 640px) {
  .nav-inner { gap: 12px; padding: 0 16px; }
  .wrap { padding: 40px 18px 16px; }
  .hero { padding: 56px 0 28px; }
  .stat-b { padding: 0 24px; }
  .ch-pick { grid-template-columns: 1fr; }
  .ck-card { padding: 22px; }
  .btn { padding: 12px 24px; }
  .foot-inner { grid-template-columns: 1fr; gap: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto; }
}