/* ============================================================
   BestNav 官网 · 正式设计语言（Emerald / Paper）
   双主题（Paper Light / Emerald Dark）· 自包含、可维护
   资源统一位于 assets/，由 build.cjs 的 SKIP 列表保护不被重建
   ============================================================ */

/* ===== Light (Paper) ===== */
[data-theme="light"]{
  --bg:#ffffff; --surface:#f7f8fa; --card:#ffffff; --border:#e6e8ec;
  --text:#0f172a; --sub:#475569; --muted:#94a3b8;
  --accent:#10b981; --accent2:#059669; --glow:rgba(16,185,129,.18);
  --amber:#d97706; --radius:16px;
  --shadow:0 1px 2px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.06);
  --nav-bg:rgba(255,255,255,.82); --nav-border:var(--border);
  --card-grad:linear-gradient(180deg,#fff,var(--surface));
  --card-hover-shadow:0 18px 40px rgba(15,23,42,.1);
  --card-hover-border:rgba(16,185,129,.4);
  --dl-bg:linear-gradient(135deg,#f0fdf4,#ecfeff);
  --dl-border:rgba(16,185,129,.25);
  --shot-bg:#fff; --shot-border:var(--border);
  --shot-shadow:0 24px 60px rgba(15,23,42,.12);
  --cap-bg:rgba(255,255,255,.9); --dot-color:#cbd5e1;
  --btn-nav-bg:rgba(255,255,255,.92); --btn-nav-color:var(--sub);
  --code-bg:#0d1117; --code-text:#e6edf3; --code-border:var(--border);
  --top-bar:linear-gradient(90deg,#10b981,#34d399,#10b981);
  --foot-border:var(--border);
  --tag-bg:rgba(16,185,129,.08); --tag-border:rgba(16,185,129,.28);
  /* 悬浮菜单（顶栏「更多」下拉）：必须完全不透明 + 明确的描边，
     否则叠在首页截图/卡片这类杂乱背景上时文字读不清 */
  --menu-bg:#ffffff; --menu-border:rgba(15,23,42,.14);
}
/* ===== Dark (Emerald) ===== */
[data-theme="dark"]{
  --bg:#06080f; --surface:#0d1117; --card:#141b25; --card2:#1a2331;
  --border:rgba(255,255,255,.07); --text:#e6edf3; --sub:#8b949e; --muted:#5b6470;
  --accent:#10b981; --accent2:#34d399; --glow:rgba(16,185,129,.22);
  --amber:#f59e0b; --radius:18px;
  --shadow:none;
  --nav-bg:rgba(6,8,15,.72); --nav-border:var(--border);
  --card-grad:linear-gradient(180deg,var(--card),var(--surface));
  --card-hover-shadow:0 18px 40px rgba(0,0,0,.4);
  --card-hover-border:rgba(16,185,129,.35);
  --dl-bg:linear-gradient(135deg,rgba(16,185,129,.12),rgba(16,185,129,.03));
  --dl-border:rgba(16,185,129,.25);
  --shot-bg:#141b25; --shot-border:var(--border);
  --shot-shadow:0 24px 60px rgba(0,0,0,.35);
  --cap-bg:rgba(20,27,37,.92); --dot-color:#3d4654;
  --btn-nav-bg:rgba(20,27,37,.88); --btn-nav-color:var(--sub);
  --code-bg:#0a0e16; --code-text:#c9d4e3; --code-border:var(--border);
  --top-bar:none;
  --foot-border:var(--border);
  --tag-bg:rgba(16,185,129,.12); --tag-border:rgba(16,185,129,.3);
  /* 用比 --card 亮一档的 --card2，浮层在暗色页面上才「浮」得起来 */
  --menu-bg:#1a2331; --menu-border:rgba(255,255,255,.14);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg);color:var(--text);line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  transition:background .3s,color .3s}

.glow-bg{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .4s}
[data-theme="dark"] .glow-bg{opacity:1;
  background:
    radial-gradient(60% 50% at 15% 0%, var(--glow), transparent 60%),
    radial-gradient(50% 40% at 90% 10%, rgba(52,211,153,.10), transparent 60%)}
/* 顶部贯穿霓虹条：桌面端已移除，仅移动端保留（需求 2026-09-12）。
   暗色主题下 --top-bar 为 none，本来就不可见，这里再显式 display:none 兜底。 */
.top-fade{display:none;position:fixed;top:0;left:0;right:0;height:5px;z-index:60;background:var(--top-bar)}
[data-theme="dark"] .top-fade{display:none}
@media(max-width:860px){.top-fade{display:block}}

.wrap{max-width:1120px;margin:0 auto;padding:0 24px;position:relative;z-index:1}

/* ===== Nav ===== */
nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:13px 24px;backdrop-filter:blur(16px);background:var(--nav-bg);border-bottom:1px solid var(--nav-border);
  transition:background .3s,border-color .3s}
nav .wrap2{max-width:1120px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;width:100%}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;text-decoration:none;color:inherit}
.logo-img{height:30px;width:auto;border-radius:8px;object-fit:contain}
.links{display:flex;gap:28px}
.links a{position:relative;color:var(--sub);text-decoration:none;font-size:14px;font-weight:600;transition:color .2s}
.links a:hover{color:var(--text)}
/* 当前页选中态：主题色文字 + 底部渐变指示条 */
.links a.active{color:var(--accent);font-weight:700}
.links a.active::after{content:'';position:absolute;left:0;right:0;bottom:-10px;height:2.5px;border-radius:2px;
  background:linear-gradient(90deg,var(--accent),var(--accent2))}
.nav-right{display:flex;align-items:center;gap:12px}
.theme-btn{width:38px;height:38px;border-radius:11px;border:1px solid var(--border);background:var(--card);
  color:var(--sub);cursor:pointer;display:grid;place-items:center;transition:color .2s,border-color .2s,background .3s;flex-shrink:0;position:relative;overflow:hidden}
.theme-btn:hover{color:var(--accent);border-color:var(--card-hover-border)}
.theme-btn .ic-sun,.theme-btn .ic-moon{position:absolute;grid-area:1/1}
.is-dark .theme-btn .ic-sun{opacity:0}
.is-dark .theme-btn .ic-moon{opacity:1}
.theme-btn .ic-moon{opacity:0}
.lang-btn{height:38px;min-width:38px;padding:0 12px;border-radius:11px;border:1px solid var(--border);background:var(--card);
  color:var(--sub);font-size:13px;font-weight:600;cursor:pointer;display:grid;place-items:center;transition:color .2s,border-color .2s;flex-shrink:0}
.lang-btn:hover{color:var(--accent);border-color:var(--card-hover-border)}
.search-btn{height:38px;min-width:38px;padding:0 12px;border-radius:11px;border:1px solid var(--border);background:var(--card);
  color:var(--sub);cursor:pointer;display:grid;grid-auto-flow:column;align-items:center;gap:8px;transition:color .2s,border-color .2s;flex-shrink:0}
.search-btn:hover{color:var(--accent);border-color:var(--card-hover-border)}
.search-btn .search-keys{display:flex;gap:3px}
.search-btn kbd{font-family:inherit;font-size:10px;line-height:1;color:var(--muted);background:var(--surface);
  border:1px solid var(--border);border-radius:5px;padding:3px 4px;min-width:15px;text-align:center}
.search-btn:hover kbd{color:var(--accent);border-color:var(--card-hover-border)}
.mobile-search-btn{margin-top:6px;width:100%;font-size:15px;padding:12px}

/* ===== Buttons ===== */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:11px;font-weight:600;font-size:14px;
  text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .2s,border-color .2s;
  border:1px solid transparent;line-height:1.3}
.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;box-shadow:0 8px 20px var(--glow)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px var(--glow)}
.btn-ghost{background:var(--card);color:var(--text);border-color:var(--border);box-shadow:var(--shadow)}
.btn-ghost:hover{border-color:var(--card-hover-border)}
.btn-secondary{background:var(--card);color:var(--accent);border:1px solid var(--accent);box-shadow:var(--shadow)}
.btn-secondary:hover{background:var(--surface);border-color:var(--accent2);transform:translateY(-2px);box-shadow:0 10px 22px var(--glow)}
/* 下载页三按钮：居中排列，自然宽度（不加宽） */
.dl-cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.dl-cta .btn{justify-content:center}
.btn-sm{padding:8px 16px;font-size:13px}

/* ===== Hero (home) ===== */
.hero{padding:72px 0 56px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.hero-copy{text-align:left}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;font-size:13px;
  color:var(--accent2);background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.25);margin-bottom:22px}
.pill .dot{width:7px;height:7px;border-radius:50%;background:var(--accent)}
h1{font-size:clamp(38px,5.4vw,62px);font-weight:850;letter-spacing:-.03em;line-height:1.07;color:var(--text)}
h1 .hl{background:linear-gradient(120deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.lead{margin:20px 0 0;max-width:520px;color:var(--sub);font-size:18px}
.hero .cta{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap}
.stats{display:flex;gap:36px;margin-top:44px;flex-wrap:wrap}
.stats .s b{display:block;font-size:22px;font-weight:800;color:var(--text)}
.stats .s span{color:var(--muted);font-size:13px}
/* 价格格：整块可点（跳订阅页），副标题为促销红 */
.stats .s.s-link{text-decoration:none;transition:transform .18s}
.stats .s.s-link:hover{transform:translateY(-2px)}
.stats .s.s-link:hover b{color:var(--accent)}
.stats .s span.hot{color:#e8543b;font-weight:700}

/* ===== 社会证明条（hero 内，按钮下方；与 .stats 分层：这里是"谁在用"，stats 是产品指标） ===== */
.social-proof{display:inline-flex;align-items:center;gap:12px;margin-top:26px;padding:9px 18px 9px 11px;
  border-radius:999px;background:var(--card-grad);border:1px solid var(--border);box-shadow:var(--shadow);
  font-size:13.5px;color:var(--sub);flex-wrap:wrap}
.social-proof b{font-weight:800;font-size:15px;background:linear-gradient(120deg,var(--accent),var(--accent2));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.social-proof .sep{width:1px;height:16px;background:var(--border)}
/* 头像堆叠：纯 CSS 装饰，让数字"像真人"；首字母色块，不涉及任何真实用户信息 */
.avatars{display:inline-flex;align-items:center}
.avatars i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:10px;font-weight:700;
  color:#fff;border:2px solid var(--bg);margin-left:-8px;font-style:normal;line-height:1}
.avatars i:first-child{margin-left:0}
.avatars i:nth-child(1){background:linear-gradient(135deg,#34d399,#059669)}
.avatars i:nth-child(2){background:linear-gradient(135deg,#60a5fa,#2563eb)}
.avatars i:nth-child(3){background:linear-gradient(135deg,#fbbf24,#d97706)}
.avatars i:nth-child(4){background:linear-gradient(135deg,#f472b6,#db2777)}
.avatars em{font-size:11px;color:var(--muted);margin-left:7px;font-style:normal;font-weight:600}

/* ===== Screenshot Carousel ===== */
.shot{position:relative;border-radius:20px;background:var(--shot-bg);border:1px solid var(--shot-border);
  box-shadow:var(--shot-shadow);overflow:hidden;aspect-ratio:4/3}
.shot-frame{position:relative;width:100%;height:100%}
.shot-slide{position:absolute;inset:0;opacity:0;transform:scale(1.02);transition:opacity .5s,transform .5s;pointer-events:none}
.shot-slide.active{opacity:1;transform:scale(1);pointer-events:auto}
.shot-slide svg{width:100%;height:100%;display:block}
.shot-slide img{width:100%;height:100%;object-fit:cover;display:block}
.shot-cap{position:absolute;left:14px;bottom:14px;z-index:3;background:var(--cap-bg);backdrop-filter:blur(6px);
  border:1px solid var(--border);border-radius:10px;padding:6px 12px;font-size:13px;font-weight:600;color:var(--text)}
.shot-dots{position:absolute;right:14px;bottom:16px;z-index:3;display:flex;gap:7px}
.shot-dots button{width:8px;height:8px;border-radius:50%;border:none;background:var(--dot-color);cursor:pointer;padding:0;transition:background .2s,transform .2s}
.shot-dots button.active{background:var(--accent);transform:scale(1.25)}
.shot-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:34px;height:34px;border-radius:50%;
  border:1px solid var(--border);background:var(--btn-nav-bg);color:var(--btn-nav-color);font-size:16px;cursor:pointer;
  display:grid;place-items:center;box-shadow:var(--shadow);transition:color .2s,border-color .2s}
.shot-nav:hover{color:var(--accent2);border-color:var(--card-hover-border)}
.shot-nav.prev{left:12px}.shot-nav.next{right:12px}

/* ===== Page Hero (inner pages) ===== */
.page-hero{padding:96px 0 40px;text-align:center}
.page-hero .pill{margin-bottom:18px}
.page-hero h1{font-size:clamp(34px,5vw,52px)}
.page-hero p.lead{max-width:640px;margin:18px auto 0;text-align:center}
/* Pro 板块：压缩 Hero 与内容区间距，避免空旷断层感 */
.pro-theme .page-hero{padding:76px 0 18px}
.pro-theme .section{padding:34px 0}
.pro-theme .doc-layout{padding-top:0}

/* ===== Section ===== */
.section{padding:64px 0}
.sec-head{text-align:center;margin-bottom:44px}
.sec-head h2{font-size:32px;font-weight:800;letter-spacing:-.02em}
.sec-head p{color:var(--sub);margin-top:10px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:26px;
  box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s,border-color .2s}
.card:hover{transform:translateY(-4px);border-color:var(--card-hover-border);box-shadow:var(--card-hover-shadow)}
.card .ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:20px;margin-bottom:16px;
  background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.2)}
.card h3{font-size:18px;margin-bottom:8px}
.card p{color:var(--sub);font-size:14px}
.pro-tag{font-size:11px;color:var(--amber);border:1px solid rgba(245,158,11,.35);border-radius:6px;padding:1px 7px;margin-left:8px;vertical-align:middle}

/* ===== Download page ===== */
.dl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.dl-card{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:24px;
  box-shadow:var(--shadow);transition:transform .2s,border-color .2s;display:flex;flex-direction:column}
.dl-card:hover{transform:translateY(-3px);border-color:var(--card-hover-border)}
.dl-card .dc-icon{font-size:34px;margin-bottom:12px;display:block}
.dl-card h4{font-size:17px;font-weight:600;margin-bottom:8px}
.dl-card .dc-desc{font-size:13px;color:var(--sub);margin-bottom:16px;flex:1;line-height:1.7}
.dl-card .dc-meta{font-size:12px;color:var(--muted);margin-bottom:14px}
.arch-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;justify-content:center}
.arch-chip{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;background:var(--surface);
  border:1px solid var(--border);border-radius:999px;font-size:13px;color:var(--sub)}
.arch-chip .ac-dot{width:8px;height:8px;border-radius:50%;background:var(--accent)}

/* code block */
.code-block{position:relative;background:var(--code-bg);color:var(--code-text);border:1px solid var(--code-border);
  border-radius:12px;padding:18px 20px;margin:14px 0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:13px;line-height:1.8;overflow-x:auto;white-space:pre-wrap;word-break:break-all}
.code-block .cm-label{display:block;font-size:11px;color:#6b7785;margin-bottom:8px}
.copy-btn{position:absolute;top:12px;right:12px;background:rgba(255,255,255,.08);color:var(--code-text);
  border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:4px 12px;font-size:12px;cursor:pointer;transition:.2s}
.copy-btn:hover{background:rgba(255,255,255,.16)}
.copy-btn.copied{color:var(--accent)}

/* tip / warn */
.tip,.warn{padding:14px 16px;border-radius:12px;font-size:14px;margin-top:16px;line-height:1.7}
.tip{background:rgba(16,185,129,.08);border:1px solid rgba(16,185,129,.22);color:var(--sub)}
.warn{background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.25);color:var(--sub)}
.tip strong,.warn strong{color:var(--text)}

/* ===== Pro pricing ===== */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.price-card{background:var(--card-grad);border:1px solid var(--border);border-radius:20px;padding:30px;
  box-shadow:var(--shadow);display:flex;flex-direction:column;position:relative;transition:transform .2s,border-color .2s}
.price-card:hover{transform:translateY(-4px)}
.price-card.featured{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 18px 50px var(--glow)}
.price-card .badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;font-size:12px;font-weight:700;padding:4px 14px;border-radius:999px}
.price-card h3{font-size:20px;font-weight:700;margin-bottom:6px}
.price-card .pdesc{font-size:13px;color:var(--sub);margin-bottom:18px}
.price-card .amount{font-size:40px;font-weight:850;letter-spacing:-.02em}
.price-card .amount .cur{font-size:22px;vertical-align:top;color:var(--sub)}
.price-card .amount .per{font-size:14px;color:var(--muted);font-weight:500}
.price-card .price-original{font-size:14px;color:var(--muted);text-decoration:line-through;margin:4px 0 0}
.price-card ul{list-style:none;margin:20px 0;flex:1}
.price-card ul li{font-size:14px;color:var(--sub);padding:7px 0;display:flex;gap:10px;align-items:flex-start}
.price-card ul li::before{content:"✓";color:var(--accent);font-weight:700;flex-shrink:0}
.price-card .btn{justify-content:center;margin-top:8px}
/* 限时优惠横幅 + 角标 */
.promo-banner{display:flex;align-items:center;justify-content:center;gap:12px;max-width:640px;margin:0 auto 30px;
  padding:12px 22px;border-radius:999px;background:linear-gradient(135deg,rgba(255,107,53,.14),rgba(245,71,122,.14));
  border:1px solid rgba(245,71,122,.35);color:#e8543b;font-weight:700;font-size:14px;box-shadow:0 8px 24px rgba(245,71,122,.12)}
.promo-banner-icon{font-size:16px}
.promo-banner-countdown{font-variant-numeric:tabular-nums;letter-spacing:.04em;background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;padding:3px 12px;border-radius:999px;font-size:14px;font-weight:800;min-width:88px;text-align:center}
.price-card .badge-promo{position:absolute;top:-12px;right:18px;background:linear-gradient(135deg,#ff6b35,#f5477a);
  color:#fff;font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;box-shadow:0 4px 12px rgba(245,71,122,.3)}
.price-card.featured .badge-promo{right:18px;left:auto}
.price-card .price-original{font-size:14px;color:var(--muted);text-decoration:line-through;margin:6px 0 0}

/* ===== Legal doc ===== */
.legal-doc{max-width:780px;margin:0 auto}
.legal-section{margin-bottom:32px}
.legal-section h2{font-size:21px;font-weight:700;margin-bottom:12px;color:var(--text)}
.legal-section p{color:var(--sub);margin-bottom:10px}
.legal-updated{font-size:13px;color:var(--muted);margin-top:12px}

/* ===== CTA band ===== */
.cta-band{margin:40px 0 80px;background:var(--dl-bg);border:1px solid var(--dl-border);border-radius:24px;padding:48px;text-align:center}
.cta-band h2{font-size:28px;font-weight:800}
.cta-band p{color:var(--sub);margin-top:10px}
.cta-band .cta{margin-top:26px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ===== 优秀项目（友链互推 · 单行横滑，方案 A） =====
   位于首页 CTA 之下、footer 之上；一屏约 7 个 + 第 8 个半露（天然的"还有更多"提示） */
/* ⚠ 本区块额外挂在 .wrap 上（max-width + margin:0 auto + padding:0 24px），
   因此只能用"方向明确"的属性（margin-bottom / padding-bottom），
   一旦写成 margin / padding 简写就会覆盖 .wrap 的水平居中与左右内边距，导致整体贴左。 */
.al-band{margin-bottom:26px;padding-bottom:8px}
/* 堆叠在 CTA 之下时收窄 CTA 底部间距（只作用于首页那一处，不影响其它页面的 .cta-band） */
.cta-band--stack{margin-bottom:36px}
.al-head{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.al-head h2{font-size:20px;font-weight:800;letter-spacing:-.01em;display:flex;align-items:center;gap:10px}
.al-head h2 .dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--glow)}
.al-head .al-sub{color:var(--sub);font-size:13.5px}
.al-head .sp{flex:1}
.al-apply{font-size:12.5px;font-weight:600;color:var(--sub);background:var(--card);border:1px solid var(--border);
  border-radius:999px;padding:8px 15px;white-space:nowrap;text-decoration:none;
  transition:border-color .18s,color .18s}
.al-apply:hover{border-color:var(--card-hover-border);color:var(--text)}
.al-railwrap{position:relative}
.al-rail{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding:4px 2px 12px;scrollbar-width:none;-ms-overflow-style:none}
.al-rail::-webkit-scrollbar{display:none}
.al-railwrap::before,.al-railwrap::after{content:"";position:absolute;top:0;bottom:12px;width:52px;pointer-events:none;
  z-index:2;opacity:0;transition:opacity .2s}
.al-railwrap::before{left:0;background:linear-gradient(90deg,var(--bg),transparent)}
.al-railwrap::after{right:0;background:linear-gradient(270deg,var(--bg),transparent)}
.al-railwrap:not(.at-start)::before{opacity:1}
.al-railwrap:not(.at-end)::after{opacity:1}
.al-nav{position:absolute;top:calc(50% - 6px);transform:translateY(-50%);z-index:3;width:34px;height:34px;
  border-radius:50%;border:1px solid var(--border);background:var(--card);color:var(--text);cursor:pointer;
  font-size:15px;line-height:1;box-shadow:var(--shadow);
  transition:opacity .2s,visibility .2s,border-color .18s,color .18s}
.al-nav:hover{border-color:var(--card-hover-border);color:var(--accent2)}
.al-nav.l{left:-14px}.al-nav.r{right:-14px}
/* 不可用的一端整体隐藏（而非半透明留位）：左箭头仅在已向右滚动后出现 */
.al-nav[disabled]{opacity:0;visibility:hidden;cursor:default;pointer-events:none}
.al-card{flex:0 0 139px;scroll-snap-align:start;height:64px;display:flex;align-items:center;gap:10px;
  background:var(--card-grad);border:1px solid var(--border);border-radius:12px;padding:10px 12px;
  color:inherit;text-decoration:none;
  transition:transform .18s,box-shadow .18s,border-color .18s;position:relative;overflow:hidden}
a.al-card:hover{transform:translateY(-2px);border-color:var(--card-hover-border);box-shadow:var(--card-hover-shadow)}
.al-card .lg{width:32px;height:32px;border-radius:9px;flex-shrink:0;display:grid;place-items:center;
  font-size:17px;background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.18)}
.al-card .tx{min-width:0}
.al-card .nm{display:block;font-size:12.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.al-card .ds{display:block;font-size:10.5px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 飞牛 fnOS 品牌字标（纯 CSS 字标，不引入第三方位图，规避版权风险） */
.al-card .lg.fn{background:linear-gradient(135deg,#ff6a3d,#e23a3a);border-color:transparent;color:#fff;
  font-weight:800;font-size:12.5px;letter-spacing:.5px}
/* 虚位以待占位卡 */
.al-card.empty{border-style:dashed;background:transparent;cursor:default}
.al-card.empty .lg{background:transparent;border-color:var(--border);color:var(--muted);font-size:15px}
.al-card.empty .nm{color:var(--sub);font-weight:600}
.al-card.empty .ds{color:var(--muted)}
a.al-card.apply{border-style:dashed;background:transparent}
a.al-card.apply .lg{background:rgba(16,185,129,.1);border-color:rgba(16,185,129,.25);color:var(--accent2);font-size:15px}
a.al-card.apply .nm{color:var(--accent2)}
.al-foot{margin-top:2px;font-size:11.5px;color:var(--muted)}

/* ===== Footer ===== */
footer{border-top:1px solid var(--foot-border);padding:40px 0 32px;color:var(--muted);font-size:13px}
footer .f-grid{max-width:1120px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1.1fr;gap:32px}
footer .f-logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:17px;color:var(--text);margin-bottom:12px}
footer .f-logo .logo-img{height:26px}
footer .foot-mail{margin-top:10px;font-size:13px;color:var(--sub)}
footer .foot-mail a{color:var(--accent);text-decoration:none}
footer .foot-mail a:hover{text-decoration:underline}
footer .f-col h4{font-size:14px;color:var(--text);margin-bottom:12px;font-weight:600}
/* 微信交流群列：二维码白底卡片，避免暗色主题下透明底影响扫码 */
footer .f-col.f-wx h4{margin-bottom:10px}
/* 二维码：图片铺满卡片（width:100% 撑满内框），卡片本身限宽，避免在列里显得过大 */
footer .f-wx-img{display:block;width:100%;max-width:140px;height:auto;background:#fff;padding:6px;border-radius:12px;
  border:1px solid var(--foot-border);box-shadow:var(--shadow)}
footer .f-wx-tip{margin-top:10px;font-size:12px;line-height:1.6;color:var(--muted)}
footer .f-col a{display:block;color:var(--muted);text-decoration:none;padding:5px 0;font-size:13px;transition:color .2s}
footer .f-col a:hover{color:var(--accent)}
footer .f-bottom{text-align:center;margin-top:32px;padding-top:20px;border-top:1px solid var(--foot-border);color:var(--muted)}
footer .f-bottom a{color:var(--muted);text-decoration:none}
footer .f-bottom a:hover{color:var(--accent)}

/* ===== Breadcrumb ===== */
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:18px}
.breadcrumb a{color:var(--sub);text-decoration:none}
.breadcrumb a:hover{color:var(--accent)}
.breadcrumb .sep{opacity:.5}
.breadcrumb .cur{color:var(--text)}

/* ===== Trust / logo wall ===== */
.trust{text-align:center;padding:8px 0 4px}
.trust p{font-size:13px;color:var(--muted);margin-bottom:22px;letter-spacing:.04em}
.logo-wall{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:18px 40px}
.logo-wall .lw{display:flex;align-items:center;gap:9px;color:var(--muted);font-weight:600;font-size:15px;opacity:.75;transition:opacity .2s,color .2s}
.logo-wall .lw:hover{opacity:1;color:var(--text)}
.logo-wall .lw img{height:24px;width:auto;border-radius:5px}

/* ===== Steps ===== */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:step}
.step{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:28px 24px;
  box-shadow:var(--shadow);position:relative;transition:transform .2s,border-color .2s}
.step:hover{transform:translateY(-4px);border-color:var(--card-hover-border)}
.step .num{counter-increment:step;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
  font-weight:800;font-size:16px;color:var(--accent);background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.25);margin-bottom:16px}
.step .num::before{content:counter(step)}
.step h3{font-size:17px;margin-bottom:8px}
.step p{font-size:14px;color:var(--sub);line-height:1.7}
.step .mini{margin-top:14px;font-size:13px}
.step .mini code{background:var(--code-bg);color:var(--code-text);padding:3px 8px;border-radius:6px;font-size:12px}

/* ===== Feature big blocks (alternating) ===== */
.feat-block{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding:36px 0}
.feat-block.reverse .fb-text{order:2}
.fb-text h3{font-size:24px;font-weight:800;letter-spacing:-.01em;margin-bottom:12px}
.fb-text p{color:var(--sub);font-size:15px;line-height:1.8;margin-bottom:14px}
.fb-text ul{list-style:none;margin:14px 0}
.fb-text ul li{font-size:14px;color:var(--sub);padding:6px 0;display:flex;gap:10px;align-items:flex-start}
.fb-text ul li::before{content:"✓";color:var(--accent);font-weight:700;flex-shrink:0}
.fb-visual{background:var(--card-grad);border:1px solid var(--border);border-radius:18px;padding:20px;box-shadow:var(--shadow);min-height:220px;display:flex;align-items:center;justify-content:center}
.fb-visual svg{width:100%;height:auto;border-radius:12px}

/* ===== Testimonials ===== */
.quotes{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.quote{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.quote .stars{color:var(--amber);font-size:14px;margin-bottom:10px;letter-spacing:2px}
.quote p{font-size:14px;color:var(--text);line-height:1.75;margin-bottom:0}
.quote .ico{font-size:22px;margin-bottom:10px}
.quote h3{font-size:16px;font-weight:700;color:var(--text);margin:0 0 8px}
.quote .who{display:flex;align-items:center;gap:10px}
.quote .avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;display:grid;place-items:center;font-weight:700;font-size:14px;flex-shrink:0}
.quote .who .name{font-size:13px;font-weight:600}
.quote .who .role{font-size:12px;color:var(--muted)}

/* ===== FAQ ===== */
.faq{max-width:760px;margin:0 auto}
.faq-item{border:1px solid var(--border);border-radius:14px;margin-bottom:12px;background:var(--card-grad);overflow:hidden;transition:border-color .2s}
.faq-item.open{border-color:var(--card-hover-border)}
.faq-q{width:100%;text-align:left;background:none;border:none;color:var(--text);font-size:15px;font-weight:600;
  padding:18px 20px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;font-family:inherit}
.faq-q .ic{transition:transform .25s;color:var(--accent);font-size:18px;flex-shrink:0}
.faq-item.open .faq-q .ic{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;color:var(--sub);font-size:14px;line-height:1.8}
.faq-a .inner{padding:0 20px 18px}

/* ===== Compare table ===== */
.compare{width:100%;border-collapse:collapse;margin-top:8px;font-size:14px;border:1px solid var(--border);border-radius:14px;overflow:hidden}
.compare th,.compare td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--border)}
.compare thead th{background:var(--surface);font-size:14px}
.compare thead th.feat{width:40%}
.compare thead th.col-pro{color:var(--accent2)}
.compare tbody tr:last-child td{border-bottom:none}
.compare td.yes{color:var(--accent);font-weight:700}
.compare td.no{color:var(--muted)}
.compare .row-head{font-weight:600;color:var(--text)}

/* ===== Tabs ===== */
.tabs{display:flex;gap:8px;justify-content:center;margin-bottom:36px;flex-wrap:wrap}
.tab{padding:9px 20px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--sub);
  font-size:14px;font-weight:600;cursor:pointer;transition:.2s;font-family:inherit}
.tab:hover{border-color:var(--card-hover-border)}
.tab.active{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;border-color:transparent}

/* ===== More list (features) ===== */
.more-list{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:8px}
.more-list span{padding:10px 18px;border-radius:12px;border:1px solid var(--border);background:var(--card);
  color:var(--text);font-size:14px;font-weight:500;transition:.2s}
.more-list span:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}

/* ===== Legal TOC ===== */
.legal-layout{display:grid;grid-template-columns:200px 1fr;gap:40px;align-items:start}
.legal-toc{position:sticky;top:90px}
.legal-toc a{display:block;color:var(--sub);text-decoration:none;font-size:13px;padding:7px 12px;border-radius:8px;
  border-left:2px solid transparent;transition:.2s}
.legal-toc a:hover,.legal-toc a.active{color:var(--accent);border-left-color:var(--accent);background:rgba(16,185,129,.06)}

/* ===== Scroll reveal ===== */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ===== Mobile menu ===== */
.hamburger{display:none;width:38px;height:38px;border-radius:11px;border:1px solid var(--border);background:var(--card);
  color:var(--text);font-size:18px;cursor:pointer;align-items:center;justify-content:center}
/* 移动端专属元素（桌面隐藏）：顶栏右侧 订阅+更多 / 更多下拉菜单 / 底部固定导航栏（参照旧官网形态） */
.nav-m-actions{display:none;align-items:center;gap:8px}
.nav-m-buy{display:inline-flex;align-items:center;background:var(--accent);color:#fff;font-size:12px;font-weight:700;
  padding:7px 12px;border-radius:8px;text-decoration:none;white-space:nowrap;box-shadow:0 4px 14px var(--glow);transition:transform .15s}
.nav-m-buy:active{transform:scale(.96)}
.nav-more-btn{width:34px;height:34px;border-radius:9px;border:1px solid var(--border);background:var(--card);
  color:var(--sub);cursor:pointer;display:grid;place-items:center;transition:color .2s,border-color .2s;flex-shrink:0}
.nav-more-btn:hover,.nav-more-btn.active{color:var(--accent);border-color:var(--card-hover-border)}
.nav-more-menu{display:none}
.nav-bottom{display:none}
.mobile-menu{display:none;flex-direction:column;gap:2px;padding:10px 16px 16px;background:var(--nav-bg);
  border-bottom:1px solid var(--border);backdrop-filter:blur(16px)}
.mobile-menu a{color:var(--sub);text-decoration:none;font-size:15px;font-weight:600;padding:12px 6px;border-bottom:1px solid var(--border)}
.mobile-menu a.active{color:var(--accent);font-weight:700;position:relative}
.mobile-menu a.active::before{content:'';position:absolute;left:-16px;top:12px;bottom:12px;width:3px;border-radius:2px;
  background:linear-gradient(180deg,var(--accent),var(--accent2))}
.mobile-menu a:last-child{border-bottom:none}
.mobile-menu.show{display:flex}

/* ===== Doc / Pro layout ===== */
.doc-layout{display:grid;grid-template-columns:230px 1fr;gap:40px;align-items:start;padding-top:8px}
.doc-toc{position:sticky;top:90px;max-height:calc(100vh - 110px);overflow:auto}
.doc-toc .toc-title{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.doc-toc a{display:block;color:var(--sub);text-decoration:none;font-size:13.5px;padding:7px 12px;border-radius:8px;
  border-left:2px solid transparent;transition:.2s;line-height:1.4}
.doc-toc a:hover,.doc-toc a.active{color:var(--accent);border-left-color:var(--accent);background:rgba(16,185,129,.06)}
.doc-content{min-width:0}
.doc-content h2{font-size:26px;font-weight:800;letter-spacing:-.01em;margin:36px 0 14px;scroll-margin-top:84px}
.doc-content h2:first-child{margin-top:0}
.doc-content h3{font-size:18px;font-weight:700;margin:24px 0 10px;color:var(--text);scroll-margin-top:84px}
.doc-content p{color:var(--sub);margin-bottom:12px;line-height:1.85}
.doc-content ul.doclist{list-style:none;margin:10px 0 16px}
.doc-content ul.doclist li{font-size:14.5px;color:var(--sub);padding:6px 0;display:flex;gap:10px;align-items:flex-start;line-height:1.75}
.doc-content ul.doclist li::before{content:"▹";color:var(--accent);font-weight:700;flex-shrink:0}

/* chapter card grid (docs / pro index) */
.chapter-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
/* docs 索引：单列自适应流式布局，避免单卡组右半留白（报告 P3-12） */
.docs-chapter-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.chapter-card{position:relative;display:flex;gap:16px;align-items:flex-start;background:var(--card-grad);border:1px solid var(--border);
  border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);transition:transform .2s,border-color .2s,box-shadow .2s;overflow:hidden;
  text-decoration:none;color:inherit}
.chapter-card::before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(180deg,var(--accent),var(--accent2));opacity:0;transition:opacity .2s}
.chapter-card:hover{transform:translateY(-3px);border-color:var(--card-hover-border);box-shadow:var(--card-hover-shadow)}
.chapter-card:hover::before{opacity:1}
.chapter-card .cc-ico{width:48px;height:48px;border-radius:14px;flex-shrink:0;display:grid;place-items:center;
  background:linear-gradient(135deg,rgba(16,185,129,.14),rgba(16,185,129,.06));border:1px solid rgba(16,185,129,.22);box-shadow:0 4px 12px rgba(16,185,129,.08)}
.chapter-card .cc-ico svg{width:24px;height:24px;color:var(--accent)}
.chapter-card .cc-tag{font-size:11px;color:var(--accent2);font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.chapter-card h3{font-size:17px;font-weight:700;margin:4px 0 6px;color:var(--text)}
.chapter-card p{font-size:13.5px;color:var(--sub);line-height:1.65;margin:0}
.chapter-card::after{content:"→";position:absolute;right:18px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:18px;opacity:0;transition:opacity .2s,transform .2s}
.chapter-card:hover::after{opacity:1;transform:translate(3px,-50%)}
.chapter-card:hover h3{color:var(--accent)}
.chapter-card .cc-body{flex:1;min-width:0}
.chapter-card .cc-arrow{margin-left:auto;align-self:center;color:var(--muted);font-size:18px;opacity:.5;transition:opacity .2s,transform .2s;flex-shrink:0}
.chapter-card:hover .cc-arrow{opacity:1;transform:translateX(3px);color:var(--accent)}
/* 分组目录 */
.doc-group{margin-bottom:38px}
.doc-group:last-child{margin-bottom:0}
.doc-group-head{display:flex;align-items:center;gap:14px;margin:0 0 16px}
.doc-group-tag{font-size:13px;font-weight:800;letter-spacing:.04em;color:var(--accent);background:var(--tag-bg);border:1px solid var(--tag-border);padding:4px 14px;border-radius:999px;white-space:nowrap}
.doc-group-line{flex:1;height:1px;background:linear-gradient(90deg,var(--border),transparent)}
/* 文档首页：标题区 + 搜索 + 快捷入口 */
.page-hero-docs .docs-search{position:relative;display:flex;align-items:center;max-width:520px;margin:22px auto 0}
.page-hero-docs .docs-search input{width:100%;padding:13px 16px 13px 44px;border-radius:999px;border:1px solid var(--border);
  background:var(--card-grad);color:var(--text);font-size:14px;box-shadow:var(--shadow);outline:none;transition:border-color .2s,box-shadow .2s}
.page-hero-docs .docs-search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(16,185,129,.16)}
.page-hero-docs .docs-search-ico{position:absolute;left:16px;font-size:15px;opacity:.6;pointer-events:none}
.quick-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:16px}
.quick-chip{font-size:13px;font-weight:600;color:var(--sub);text-decoration:none;background:var(--card-grad);
  border:1px solid var(--border);padding:8px 16px;border-radius:999px;transition:border-color .2s,color .2s,transform .2s}
.quick-chip:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}
.quick-chip{display:inline-flex;align-items:center;gap:7px}
.quick-chip .qc-ico{display:inline-flex;width:16px;height:16px;color:var(--accent)}
.quick-chip .qc-ico svg{width:16px;height:16px}
/* Pro 章节标题 */
.sec-title{text-align:center;font-size:28px;font-weight:800;margin-bottom:8px;color:var(--text)}
.sec-sub{text-align:center;color:var(--sub);font-size:14px;margin-bottom:30px}
@media (max-width:720px){
  .chapter-grid,.docs-chapter-grid{grid-template-columns:1fr}
  .chapter-card::after{display:none}
}

/* config table (docs) */
.config-table{width:100%;border-collapse:collapse;margin:14px 0 18px;font-size:13.5px;border:1px solid var(--border);border-radius:12px;overflow:hidden}
.config-table th,.config-table td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--border);vertical-align:top}
.config-table thead th{background:var(--surface);font-weight:600;color:var(--text)}
.config-table tbody tr:last-child td{border-bottom:none}
.config-table td .k{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;color:var(--accent2)}
.config-table code{background:var(--code-bg);color:var(--code-text);padding:2px 7px;border-radius:6px;font-size:12px}

/* step list */
.step-list{counter-reset:st;list-style:none;margin:12px 0 18px}
.step-list li{counter-increment:st;position:relative;padding:10px 0 10px 40px;color:var(--sub);font-size:14.5px;line-height:1.75;border-bottom:1px dashed var(--border)}
.step-list li:last-child{border-bottom:none}
.step-list li::before{content:counter(st);position:absolute;left:0;top:10px;width:26px;height:26px;border-radius:50%;
  background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.3);color:var(--accent);font-weight:700;font-size:13px;
  display:grid;place-items:center}
.step-list li b{color:var(--text)}

/* badges */
.badge-pro,.badge-free,.badge-int{display:inline-block;font-size:11px;font-weight:700;padding:2px 9px;border-radius:6px;vertical-align:middle;margin-left:6px}
.badge-pro{color:var(--amber);border:1px solid rgba(245,158,11,.4);background:rgba(245,158,11,.08)}
.badge-free{color:#3b82f6;border:1px solid rgba(59,130,246,.4);background:rgba(59,130,246,.08)}
.badge-int{color:#8b5cf6;border:1px solid rgba(139,92,246,.4);background:rgba(139,92,246,.08)}

/* 404 页（报告 P2-9） */
.nf-section{min-height:56vh;display:flex;align-items:center}
.nf-wrap{text-align:center;max-width:560px}
.nf-code{display:block;font-size:110px;font-weight:900;line-height:1;letter-spacing:-.04em;
  background:linear-gradient(135deg,var(--accent),#34d399);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:12px}
.nf-title{font-size:28px;font-weight:800;margin-bottom:10px}
.nf-sub{color:var(--sub);font-size:15px;margin-bottom:28px}

/* pager */
.doc-pager{display:flex;justify-content:space-between;gap:16px;margin:48px 0 0;flex-wrap:wrap}
.doc-pager a{display:flex;flex-direction:column;gap:4px;padding:14px 18px;border:1px solid var(--border);border-radius:12px;
  text-decoration:none;color:var(--sub);font-size:13px;min-width:160px;transition:.2s;background:var(--card-grad)}
.doc-pager a:hover{border-color:var(--card-hover-border);color:var(--text)}
.doc-pager a .pg-dir{font-size:11px;color:var(--muted)}
.doc-pager a .pg-title{font-weight:600;color:var(--text)}
.doc-pager a.next{text-align:right;align-items:flex-end}

/* Pro 页：统一使用全站绿色品牌色（报告 P3-14，移除琥珀橙独立主题，仅保留类名供布局钩子使用） */

/* market categories */
.market-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.market-cat{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);transition:.2s}
.market-cat:hover{transform:translateY(-3px);border-color:var(--card-hover-border)}
.market-cat .mc-ico{font-size:26px;margin-bottom:10px}
.market-cat h3{font-size:16px;margin-bottom:6px}
.market-cat p{font-size:13px;color:var(--sub);line-height:1.6}
.reward-tier{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px}
.reward-card{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.reward-card.bronze{border-top:3px solid #b45309}
.reward-card.silver{border-top:3px solid #94a3b8}
.reward-card.gold{border-top:3px solid #f59e0b}
.reward-card h3{font-size:16px;margin-bottom:8px}
.reward-card p{font-size:13px;color:var(--sub);line-height:1.7}
.leaderboard{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:8px;overflow:hidden}
.leader-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--border);font-size:13.5px}
.leader-row:last-child{border-bottom:none}
.leader-row .rank{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:12px;background:rgba(16,185,129,.12);color:var(--accent)}
.leader-row .lname{flex:1;font-weight:600;color:var(--text)}
.leader-row .lcount{color:var(--muted)}

/* lottery */
.lt-wrap{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.lt-box{background:var(--card-grad);border:1px solid var(--border);border-radius:20px;padding:32px;box-shadow:var(--shadow);text-align:center}
.lt-box .lt-prize{font-size:40px;font-weight:850;color:var(--amber);margin:8px 0}
.lt-box .lt-prize-sub{font-size:15px;font-weight:600;color:var(--text);min-height:20px}
.lt-box .lt-prize-desc{font-size:12.5px;color:var(--muted);min-height:18px}
.lt-box .lt-prob{font-size:12px;color:var(--muted);min-height:16px;margin-top:2px}
.lt-box .lt-form{display:flex;flex-direction:column;gap:12px;max-width:320px;margin:20px auto 0;text-align:left}
.lt-privacy-note{font-size:11px;color:var(--muted);line-height:1.6;margin:2px 0 0}
.lt-privacy-note a{color:var(--accent);text-decoration:none}
.lt-privacy-note a:hover{text-decoration:underline}
.lt-box input{width:100%;padding:11px 14px;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:14px;outline:none}
.lt-box input:focus{border-color:var(--accent)}
.lt-winners{background:var(--card-grad);border:1px solid var(--border);border-radius:20px;padding:24px;box-shadow:var(--shadow);height:100%}
.lt-winners h3{font-size:16px;margin-bottom:12px}
.lt-info{list-style:none;margin-top:6px}
.lt-info li{font-size:13.5px;color:var(--sub);padding:8px 0;border-bottom:1px dashed var(--border);display:flex;gap:10px}
.lt-info li::before{content:"•";color:var(--accent)}

/* downloads table */
.dl-file-table{width:100%;border-collapse:collapse;margin:14px 0;border:1px solid var(--border);border-radius:12px;overflow:hidden;font-size:14px}
.dl-file-table th,.dl-file-table td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--border)}
.dl-file-table thead th{background:var(--surface);font-weight:600}
.dl-file-table tbody tr:last-child td{border-bottom:none}
.dl-file-table .fname{font-weight:600;color:var(--text)}
.dl-file-table .fbtn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:9px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;font-size:13px;font-weight:600;text-decoration:none}

/* generic page note */
.note-line{font-size:13px;color:var(--muted);margin-top:10px}

/* ===== Responsive ===== */
@media(max-width:860px){
  .wrap{padding:0 16px}
  .hero{padding:48px 0 36px}
  .hero-grid{grid-template-columns:1fr;gap:36px}.shot{aspect-ratio:16/11}
  .page-hero{padding:56px 0 26px}
  .section{padding:48px 0}
  .grid,.price-grid,.steps,.quotes{grid-template-columns:1fr}
  .links{display:none}
  /* 移动端导航形态（参照旧官网）：顶栏只留 logo + 订阅 + 更多；主导航移到底部固定栏 */
  nav{padding:10px 16px}
  .logo{gap:8px;font-size:17px}
  .logo-img{height:26px}
  .nav-right{display:none}
  .nav-m-actions{display:flex}
  /* 更多下拉菜单（顶栏右侧浮层，带淡入下滑动画） */
  /* 下拉窗：完全不透明 + 明显描边 + 更重的投影。
     ★ 刻意不使用 backdrop-filter，也不用任何带 alpha 的背景色 ——
       浮层要保证「背景再乱也不影响文字」，半透明毛玻璃做不到这一点。 */
  .nav-more-menu{display:none;position:fixed;top:56px;right:8px;z-index:1001;min-width:190px;padding:6px;
    background:var(--menu-bg);border:1px solid var(--menu-border);border-radius:12px;
    box-shadow:0 18px 44px rgba(0,0,0,.5),0 2px 8px rgba(0,0,0,.28)}
  .nav-more-menu.open{display:block;animation:moreMenuIn .18s ease-out}
  @keyframes moreMenuIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  @media(prefers-reduced-motion:reduce){.nav-more-menu.open{animation:none}}
  .nav-more-menu a,.nav-more-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:11px 14px;font-size:14px;
    font-family:inherit;color:var(--text);font-weight:500;text-decoration:none;background:transparent;border:none;border-radius:8px;
    cursor:pointer;text-align:left;transition:background .15s,color .15s}
  .nav-more-menu svg{width:16px;height:16px;flex-shrink:0}
  .nav-more-menu a:active,.nav-more-menu a:hover,
  .nav-more-menu button:active,.nav-more-menu button:hover{background:var(--tag-bg);color:var(--accent)}
  /* 底部固定导航栏：5 项平均排布，替代汉堡菜单 */
  /* 底栏高度只此一处定义：.nav-bottom 的 height、body 的下内边距、
     回到顶部按钮的抬高量全部从 --navbar-h 派生，避免三处各写一个 56px 改一处漏两处 */
  :root{--navbar-h:56px}
  /* ★ top:auto 与 border-bottom:none 必须显式写：
     本元素是 <nav>，会被上方 nav{position:sticky;top:0;border-bottom:…} 这条元素选择器命中。
     只覆盖 position/bottom 而不清掉 top 的话，top:0 与 bottom:0 同时存在 → 高度已定，
     属于「过约束」，浏览器取 top → 底栏被钉在页面顶部（既有 bug，2026-09-12 修复）。 */
  .nav-bottom{position:fixed;top:auto;left:0;right:0;bottom:0;z-index:1000;display:flex;gap:8px;
    justify-content:space-around;align-items:stretch;
    background:var(--nav-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
    border-top:1px solid var(--nav-border);border-bottom:none;
    padding:6px 10px calc(6px + env(safe-area-inset-bottom,0px));
    height:calc(var(--navbar-h) + env(safe-area-inset-bottom,0px))}
  /* 图标在上、文字在下的标签栏：选中项加一层品牌淡底 + 图标/文字变品牌色。
     56px − 上下各 6px 内边距 = 每项 44px；图标 20 + 间距 3 + 文字 13.8 ≈ 37px，留有余量。 */
  .nav-bottom a{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:3px;color:var(--sub);font-size:11.5px;font-weight:700;line-height:1.2;
    text-decoration:none;padding:5px 2px;min-width:0;border-radius:11px;
    transition:color .15s,background .15s}
  /* 文字过长时省略号截断（span 需能收缩，故给 max-width） */
  .nav-bottom a span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .nav-bottom a svg{width:20px;height:20px;flex-shrink:0}
  .nav-bottom a:active,.nav-bottom a:hover{color:var(--accent)}
  .nav-bottom a.active{color:var(--accent);font-weight:800;background:var(--tag-bg)}
  body{padding-bottom:calc(var(--navbar-h) + env(safe-area-inset-bottom,0px))}
  .feat-block{grid-template-columns:1fr;gap:24px}
  .feat-block.reverse .fb-text{order:0}
  .legal-layout{grid-template-columns:1fr}
  .legal-toc{display:none}
  /* Footer 移动端：品牌占满一行，产品|资源、法律|微信 两两并排（不再纵向堆叠） */
  footer .f-grid{grid-template-columns:1fr 1fr;gap:28px 20px}
  footer .f-grid>.f-brand{grid-column:1/-1}
  .compare{font-size:13px}
  .compare th,.compare td{padding:10px 12px}
  .doc-layout{grid-template-columns:1fr}
  .doc-toc{display:none}
  .chapter-grid,.market-grid,.reward-tier{grid-template-columns:1fr}
  .lt-wrap{grid-template-columns:1fr}
}
/* 极窄屏底栏：缩小字号与左右内边距，保证「灵感集市」不被省略号截断。
   ★ 刻意写成顶层 @media 而不是嵌在 860 块里 —— 嵌套 @media 依赖 CSS Nesting，
     旧版 Safari(<16.5) 会整条丢弃，导致这里静默失效。 */
@media(max-width:400px){
  .nav-bottom{gap:6px;padding-left:6px;padding-right:6px}
  .nav-bottom a{font-size:11px;padding:5px 1px}
  .nav-bottom a svg{width:19px;height:19px}
}
/* ---------- 小屏（≤560px）：单列布局里的细节收敛 ---------- */
@media(max-width:560px){
  /* 社会证明条：窄屏放不下一行时，999px 胶囊会被折成异形，
     改为「头像行 + 文案行」的左对齐卡片，并隐藏换行后残留的竖线 */
  .social-proof{display:flex;width:100%;align-items:flex-start;border-radius:14px;padding:12px 14px;
    gap:8px 12px;font-size:13px;line-height:1.6}
  .social-proof .sep{display:none}
  .social-proof>span:last-child{flex:1 1 100%}
  /* 指标行：窄屏 4 项 flex 换行会出现「3+1」的不平衡排布，改为 2×2 网格 */
  .stats{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px;margin-top:32px}
  /* CTA 区块内边距收敛，小屏正文区更宽 */
  .cta-band{padding:30px 20px;border-radius:18px}
  /* 友链横滑条：移动端手势即可滑动，隐藏左右箭头以免遮挡卡片 */
  .al-nav{display:none}
  /* 集市详情弹窗：收敛内边距，内容区更宽 */
  .mk-modal-content{padding:22px 18px;max-height:88vh}
  /* 抽奖动画卡：收敛内边距 */
  .lt-anim{padding:30px 22px}
  /* 轮播圆点：视觉仍是圆点，但把点击热区扩到 26px（原 8px 基本点不中）；
     间距同步放大到 16px，保证相邻热区不重叠 */
  .shot-dots{right:12px;bottom:14px;gap:16px}
  .shot-dots button{position:relative;width:10px;height:10px}
  .shot-dots button::after{content:"";position:absolute;inset:-8px;border-radius:50%}
  /* 面包屑链接：补足纵向点击热区，且标题过长时允许换行 */
  .breadcrumb{flex-wrap:wrap}
  .breadcrumb a{padding:5px 0}
}
/* footer 两列在 ≤520px 继续保留（产品|资源、法律|微信 成对并排），仅收紧间距与二维码宽度 */
@media(max-width:520px){
  footer .f-grid{gap:24px 16px}
}
/* ≤360px：列再收窄一点，让「扫码进群 答疑与更新通知」不出现单字掉行 */
@media(max-width:360px){
  footer .f-grid{gap:22px 12px}
  footer .f-wx-tip{font-size:11.5px}
}

/* ---------- 宽表格：窄屏改为横向滚动，避免单元格被压成多行 ---------- */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
@media(max-width:640px){
  .dl-file-table{min-width:520px;font-size:13px}
  .dl-file-table th,.dl-file-table td{padding:10px 12px;white-space:nowrap}
}

/* ===== 站内搜索弹层（自包含，无 pagefind 依赖） ===== */
.search-modal{position:fixed;inset:0;z-index:2000;display:none;align-items:flex-start;justify-content:center;
  background:rgba(2,6,23,.55);backdrop-filter:blur(6px);padding:9vh 16px 16px}
.search-modal.open{display:flex}
.search-modal-inner{position:relative;width:100%;max-width:720px;background:var(--bg,#0d1117);border:1px solid var(--border);
  border-radius:18px;padding:18px;box-shadow:0 30px 80px rgba(0,0,0,.55)}
.search-close{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:9px;border:1px solid var(--border);
  background:var(--card);color:var(--sub);font-size:15px;cursor:pointer;display:grid;place-items:center;z-index:5;transition:.2s}
.search-close:hover{color:var(--accent);border-color:var(--card-hover-border)}
.bn-search-box{position:relative}
.bn-search-input{width:100%;border-radius:11px;padding:13px 44px 13px 44px;border:1px solid var(--border);
  background:var(--card);color:var(--text);font-size:15px;outline:none;transition:border-color .2s,box-shadow .2s;font-family:inherit}
.bn-search-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--glow)}
.bn-search-ic{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
.bn-search-clear{position:absolute;right:14px;top:50%;transform:translateY(-50%);border:none;background:none;color:var(--muted);
  cursor:pointer;font-size:15px;display:none;padding:4px;line-height:1}
.bn-search-clear.show{display:block}
.bn-search-results{max-height:60vh;overflow:auto;margin-top:8px}
.bn-search-empty{color:var(--muted);font-size:13px;padding:18px 2px;text-align:center}
.bn-search-group{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:14px 2px 8px}
.bn-search-item{display:block;text-decoration:none;margin-top:8px;border:1px solid var(--border);border-radius:12px;padding:13px 16px;
  background:var(--card);transition:border-color .2s,transform .15s,box-shadow .2s}
.bn-search-item:hover{border-color:var(--card-hover-border);transform:translateY(-2px);box-shadow:var(--shadow)}
.bn-search-item .bi-title{font-size:15px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px}
.bn-search-item .bi-tag{font-size:11px;color:var(--accent2);border:1px solid rgba(16,185,129,.35);border-radius:6px;padding:1px 7px}
.bn-search-item .bi-desc{color:var(--sub);font-size:13.5px;line-height:1.7;margin-top:4px}
.bn-search-item .bi-desc mark{background:rgba(16,185,129,.22);color:var(--accent2);border-radius:4px;padding:0 2px}
.bn-search-hint{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.bn-search-hint a{font-size:12.5px;color:var(--sub);text-decoration:none;padding:6px 12px;border:1px solid var(--border);border-radius:999px;transition:.2s}
.bn-search-hint a:hover{color:var(--accent);border-color:var(--card-hover-border)}

/* ===== 灵感集市：布局卡片网格 ===== */
.market-toolbar{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:34px}
.mt-tab{padding:9px 18px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--sub);
  font-size:14px;font-weight:600;cursor:pointer;transition:.2s;font-family:inherit}
.mt-tab:hover{border-color:var(--card-hover-border)}
.mt-tab.active{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;border-color:transparent}
.layout-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.layout-card{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow);transition:transform .2s,border-color .2s,box-shadow .2s;display:flex;flex-direction:column}
.layout-card:hover{transform:translateY(-4px);border-color:var(--card-hover-border);box-shadow:var(--card-hover-shadow)}
.layout-shot{height:130px;background:linear-gradient(135deg,rgba(16,185,129,.14),rgba(52,211,153,.05));
  display:grid;place-items:center;font-size:40px;border-bottom:1px solid var(--border);position:relative}
.layout-shot .lk-fav{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:8px;border:1px solid var(--border);
  background:var(--card);color:var(--muted);cursor:pointer;font-size:14px;display:grid;place-items:center;transition:.2s}
.layout-shot .lk-fav:hover{color:var(--amber);border-color:rgba(245,158,11,.4)}
.layout-shot .lk-fav.on{color:var(--amber)}
.layout-body{padding:18px;flex:1;display:flex;flex-direction:column}
.layout-body h3{font-size:16px;margin-bottom:6px;display:flex;align-items:center;gap:8px}
.layout-body .lk-author{font-size:12px;color:var(--muted);margin-bottom:10px}
.layout-body p{font-size:13px;color:var(--sub);line-height:1.6;flex:1}
.layout-meta{display:flex;align-items:center;justify-content:space-between;margin-top:14px}
.layout-meta .lk-stats{font-size:12px;color:var(--muted)}
.btn-import{padding:8px 16px;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;
  font-size:13px;font-weight:600;text-decoration:none;border:none;cursor:pointer;transition:transform .15s,box-shadow .2s}
.btn-import:hover{transform:translateY(-2px);box-shadow:0 8px 18px var(--glow)}
.btn-import.copied{background:var(--surface);color:var(--accent);border:1px solid var(--card-hover-border);box-shadow:none}
.layout-shot{overflow:hidden}
.layout-thumb{width:100%;height:100%;object-fit:cover;display:block}
.layout-thumb-placeholder{font-size:40px}
.layout-shot.noimg .layout-thumb-placeholder{display:grid;place-items:center;width:100%;height:100%}
.layout-shot.noimg{background:linear-gradient(135deg,rgba(16,185,129,.14),rgba(52,211,153,.05))}
.market-note{margin:0 0 18px;padding:10px 14px;border:1px dashed var(--card-hover-border);border-radius:10px;font-size:13px;color:var(--muted);background:rgba(245,158,11,.06)}
.market-empty{grid-column:1/-1;padding:40px;text-align:center;color:var(--muted);font-size:14px}
.market-state{grid-column:1/-1;padding:60px 20px;text-align:center;color:var(--muted);font-size:14px;display:flex;flex-direction:column;align-items:center;gap:12px}
.mk-spinner{width:34px;height:34px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:mkspin .8s linear infinite}
@keyframes mkspin{to{transform:rotate(360deg)}}
.layout-shot .mk-featured-badge{position:absolute;top:10px;left:10px;z-index:2;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;font-size:11px;font-weight:600;padding:3px 9px;border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.25);pointer-events:none}
.lk-rating .lk-rate-num{font-size:12px;color:var(--muted);margin-left:4px}
/* 集市页新增样式 */
.mk-nas-bar{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:20px;margin-bottom:28px}
.mk-nas-bar label{font-size:14px;font-weight:600;display:block;margin-bottom:8px}
.mk-nas-row{display:flex;gap:10px;align-items:center}
.mk-nas-row input{flex:1;padding:10px 14px;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:14px;outline:none}
.mk-nas-row input:focus{border-color:var(--accent)}
.mk-nas-tip{display:block;font-size:12px;color:var(--muted);margin-top:6px}
.mk-filter-row{display:flex;gap:10px;flex-wrap:wrap;width:100%;margin-bottom:12px}
.mk-select{padding:8px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:13px;outline:none;cursor:pointer;font-family:inherit}
.mk-select:focus{border-color:var(--accent)}
.mk-search{flex:1;min-width:180px;padding:8px 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:13px;outline:none;font-family:inherit}
.mk-search:focus{border-color:var(--accent)}
.mt-tabs{display:flex;flex-wrap:wrap;gap:6px;width:100%}
.mk-pagination{display:flex;gap:6px;justify-content:center;align-items:center;margin-top:28px;flex-wrap:wrap}
.mk-page{padding:7px 14px;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--text);font-size:13px;cursor:pointer;transition:.2s;font-family:inherit}
.mk-page:hover{border-color:var(--accent);color:var(--accent)}
.mk-page.active{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;border-color:transparent;cursor:default}
.mk-page-dots{color:var(--muted);padding:0 4px;font-size:13px}
/* 集市详情弹窗 */
.mk-modal{position:fixed;inset:0;z-index:998;display:flex;align-items:center;justify-content:center;padding:20px}
.mk-modal.hidden{display:none}
.mk-modal-overlay{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(4px)}
.mk-modal-content{position:relative;background:var(--card-bg);border:1px solid var(--border);border-radius:20px;max-width:720px;width:100%;max-height:85vh;overflow-y:auto;padding:32px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.mk-modal-close{position:absolute;top:14px;right:18px;font-size:26px;background:none;border:none;color:var(--muted);cursor:pointer;z-index:1;line-height:1}
.mk-modal-close:hover{color:var(--text)}
.mk-detail-layout{display:flex;gap:20px;flex-wrap:wrap}
.mk-detail-thumb{width:200px;height:140px;object-fit:cover;border-radius:12px;cursor:pointer;border:1px solid var(--border);flex-shrink:0}
.mk-detail-icon{width:200px;height:140px;display:grid;place-items:center;font-size:60px;background:linear-gradient(135deg,rgba(16,185,129,.1),rgba(52,211,153,.05));border-radius:12px;flex-shrink:0}
.mk-detail-info{flex:1;min-width:200px}
.mk-detail-info h2{font-size:20px;margin-bottom:6px}
.mk-detail-author{font-size:13px;color:var(--muted);margin-bottom:8px}
.mk-detail-rating{color:var(--amber);font-size:14px;margin-bottom:8px}
.mk-detail-info p{font-size:13.5px;color:var(--sub);line-height:1.7;margin-bottom:12px}
.mk-detail-meta{display:flex;gap:16px;font-size:12px;color:var(--muted);margin-bottom:14px}
.mk-detail-install{width:100%;justify-content:center}
.mk-detail-tip{font-size:12px !important;color:var(--muted);text-align:center;margin-top:12px !important}
.mk-detail-shots{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.mk-detail-shots img{width:calc(50% - 5px);border-radius:10px;cursor:pointer;border:1px solid var(--border);transition:opacity .2s;max-height:200px;object-fit:cover}
.mk-detail-shots img:hover{opacity:.85}
/* 大图预览 */
.mk-preview{position:fixed;inset:0;z-index:999;display:flex;align-items:center;justify-content:center;padding:20px}
.mk-preview.hidden{display:none}
.mk-preview-overlay{position:absolute;inset:0;background:rgba(0,0,0,.75);backdrop-filter:blur(8px)}
.mk-preview-close{position:absolute;top:18px;right:24px;font-size:32px;background:none;border:none;color:#fff;cursor:pointer;z-index:1;line-height:1;opacity:.7}
.mk-preview-close:hover{opacity:1}
.mk-preview img{position:relative;max-width:90vw;max-height:85vh;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.6);object-fit:contain}
/* 使用指南 */
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.guide-card{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);transition:transform .2s,border-color .2s}
.guide-card:hover{transform:translateY(-3px);border-color:var(--card-hover-border)}
.guide-num{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:15px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;margin-bottom:14px}
.guide-card h3{font-size:15px;margin-bottom:8px}
.guide-card p{font-size:13px;color:var(--sub);line-height:1.65}
.lk-rating{color:var(--amber);font-size:12px;margin-bottom:4px}
@media(max-width:768px){.guide-grid{grid-template-columns:1fr}
.mk-detail-thumb,.mk-detail-icon{width:100%;height:120px}
.mk-detail-shots img{width:100%}
}

/* ===== 抽奖转盘 ===== */
.lt-wheel-wrap{display:flex;justify-content:center;align-items:center;gap:40px;flex-wrap:wrap;margin-bottom:8px}
.lt-wheel{position:relative;width:300px;height:300px;flex-shrink:0}
.lt-wheel svg{width:100%;height:100%;transition:transform 3.5s cubic-bezier(.17,.67,.2,1)}
.lt-pointer{position:absolute;top:-6px;left:50%;transform:translateX(-50%);z-index:3;
  width:0;height:0;border-left:14px solid transparent;border-right:14px solid transparent;border-top:26px solid var(--amber);
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.4))}
.lt-spin{margin-top:18px}
.lt-result{margin-top:14px;min-height:22px;font-size:14px;color:var(--amber);font-weight:600;text-align:center}
.lt-win-list{max-height:300px;overflow:auto}
.lt-win-list .lt-win-row{display:flex;align-items:center;gap:12px;padding:11px 14px;border-bottom:1px solid var(--border);font-size:13.5px}
.lt-win-list .lt-win-row:last-child{border-bottom:none}
.lt-win-list .lt-win-row .w-ava{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;display:grid;place-items:center;font-weight:700;font-size:13px;flex-shrink:0}
.lt-win-list .lt-win-row .w-name{flex:1;font-weight:600;color:var(--text)}
.lt-win-list .lt-win-row .w-prize{color:var(--amber);font-size:12.5px}
.lt-win-list .lt-win-empty,.lt-win-empty{padding:18px;text-align:center;color:var(--muted);font-size:13px}
.lt-wheel{box-shadow:0 18px 50px rgba(0,0,0,.45);border-radius:50%;border:8px solid rgba(255,255,255,.08)}
.lt-wheel::after{content:"";position:absolute;top:50%;left:50%;width:54px;height:54px;border-radius:50%;
  transform:translate(-50%,-50%);background:linear-gradient(135deg,var(--accent),var(--accent2));z-index:2;
  box-shadow:0 4px 14px rgba(0,0,0,.4);border:3px solid #fff}
.lt-confetti{position:absolute;top:-10px;width:8px;height:14px;border-radius:2px;animation:ltFall 2.6s linear forwards;z-index:5;pointer-events:none}
@keyframes ltFall{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(360px) rotate(540deg);opacity:0}}
/* 抽奖页状态容器 */
.lt-state-box{padding:32px 16px;text-align:center;color:var(--sub);font-size:14px}
.lt-state-box.hidden{display:none}
.lt-state-box h3{font-size:18px;color:var(--text);margin-bottom:8px}
.lt-state-box p{color:var(--muted);font-size:13.5px}
.captcha-q{font-size:12px;color:var(--accent);margin-left:6px;border:1px dashed var(--border);padding:2px 10px;border-radius:6px;transition:background .2s}
.captcha-q:hover{background:var(--accent-15)}
.verify-row{display:flex;gap:8px;align-items:center}
.verify-row input{flex:1;min-width:0}
.verify-row .btn-sm{white-space:nowrap;padding:8px 14px;font-size:12.5px;border-radius:8px;flex-shrink:0}
.lt-msg{min-height:22px;font-size:13px;margin-top:10px;transition:opacity .2s}
.lt-msg.err{color:var(--red)}
.lt-msg.ok{color:var(--green)}
.lt-rules{font-size:12px;color:var(--muted);line-height:1.9;margin-top:16px;padding-top:14px;border-top:1px dashed var(--border)}
.lt-rules b{color:var(--text)}
/* 抽取动画覆盖层 */
.lt-draw-overlay{position:fixed;inset:0;z-index:999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.65);backdrop-filter:blur(5px)}
.lt-draw-overlay.hidden{display:none}
/* 老版本抽奖动画：🎁 盒子晃动 + 文案 + emoji 彩带行 */
.lt-anim{text-align:center;padding:40px 56px;border-radius:24px;background:var(--card-bg);border:1px solid var(--border);box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lt-anim .box{display:inline-block;font-size:64px;line-height:1;animation:ltShake 1.1s infinite}
.lt-anim .txt{color:var(--sub);font-size:14px;margin:18px 0 10px}
.lt-anim .emo{font-size:20px;letter-spacing:6px;color:#8b949e}
@keyframes ltShake{0%,100%{transform:rotate(0) scale(1)}25%{transform:rotate(-12deg) scale(1.08)}50%{transform:rotate(0) scale(1.15)}75%{transform:rotate(12deg) scale(1.08)}}
.lt-result{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;min-height:190px;justify-content:center}
.lt-result-icon{font-size:48px;margin-bottom:12px}
/* 人机验证（算术题） */
.lt-captcha-row{display:flex;gap:10px;align-items:center}
.lt-captcha-row .captcha-q{flex:none;min-width:86px;text-align:center}
.lt-captcha-row input{flex:1;min-width:0}
/* 中奖名单滚动 */
#winList{overflow:hidden;max-height:340px;position:relative}
#winList .lt-winempty{padding:24px;text-align:center;color:var(--muted);font-size:13px}
#winList.anim{animation:scrollWin var(--lt-dur,20s) linear infinite}
#winList.anim:hover{animation-play-state:paused}
#winList .lt-winitem{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border);font-size:13px}
#winList .lt-winitem .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0}
#winList .lt-winitem .em{flex:1;font-weight:600;color:var(--text)}
#winList .lt-winitem .pz{color:var(--amber);font-size:12px}
@keyframes scrollWin{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}

/* ===== 订阅无感跳转页 ===== */
.buy-redirect{min-height:60vh;display:grid;place-items:center;padding:40px 20px}
.buy-redirect-inner{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:40px 48px;box-shadow:var(--shadow)}
.buy-redirect-inner p{margin:0;color:var(--sub);font-size:15px}
.buy-spinner{width:28px;height:28px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ===== 下载页（新版） ===== */
.dl-hero{padding:88px 0 56px}
.dl-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
.dl-hero-copy .lead{max-width:520px}
/* 首屏双 CTA（报告 P0-2）：FPK 主按钮 + Docker 次按钮，次按钮锚定 compose 卡片 */
.dl-cta{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}
.dl-cta-meta{margin-top:10px;font-size:12.5px;color:var(--sub)}
#composeCard{scroll-margin-top:96px}
.dl-version{display:flex;align-items:center;gap:10px;margin-top:20px;font-size:13px;color:var(--sub)}
.dl-version-label{font-weight:500}
.dl-version-tag{background:var(--accent-15);color:var(--accent);font-weight:700;padding:5px 12px;border-radius:999px;border:1px solid rgba(16,185,129,.25)}
.dl-hero-card{background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.dl-card-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:18px}
.dl-card-head .dc-icon{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:#fff;border:1px solid var(--border);box-shadow:0 4px 12px rgba(0,0,0,.05);flex-shrink:0}
.dl-card-head .dc-icon img{width:30px;height:30px;object-fit:contain;display:block}
.dl-card-head h4{font-size:17px;margin:0 0 3px}
.dl-card-head p{font-size:13px;color:var(--sub);margin:0}

.platform-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:10px}
.platform-card{position:relative;display:flex;align-items:center;gap:14px;background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);transition:transform .2s,border-color .2s,box-shadow .2s;
  text-decoration:none;color:inherit}
.platform-card:hover{transform:translateY(-3px);border-color:var(--card-hover-border);box-shadow:var(--card-hover-shadow)}
.pf-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#fff;border:1px solid var(--border);flex-shrink:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.03)}
.pf-icon img{width:26px;height:26px;object-fit:contain;display:block}
.pf-body{flex:1;min-width:0}
.pf-body h4{font-size:15px;margin:0 0 4px;color:var(--text)}
.pf-body p{font-size:12.5px;color:var(--sub);margin:0;line-height:1.55}
.pf-arrow{color:var(--muted);font-size:18px;transition:transform .2s,color .2s}
.platform-card:hover .pf-arrow{color:var(--accent);transform:translateX(3px)}
.platform-card:hover h4{color:var(--accent)}
.platform-all{display:flex;justify-content:center;margin-top:24px}

.archive-card{display:flex;align-items:center;justify-content:space-between;gap:20px;background:var(--card-grad);border:1px solid var(--border);border-radius:var(--radius);padding:22px 26px;box-shadow:var(--shadow);flex-wrap:wrap}
.archive-info{display:flex;align-items:center;gap:16px;flex:1;min-width:220px}
.archive-ico{font-size:30px;width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(99,102,241,.12),rgba(99,102,241,.05));border:1px solid rgba(99,102,241,.2);flex-shrink:0}
.archive-info h4{font-size:16px;margin:0 0 3px}
.archive-info p{font-size:13px;color:var(--sub);margin:0}

@media (max-width:920px){
  .dl-hero-grid{grid-template-columns:1fr}
  .platform-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .platform-grid{grid-template-columns:1fr}
  .archive-card{flex-direction:column;align-items:flex-start}
}

/* ===== 回到顶部（全站浮窗按钮） =====
   - 默认 opacity/visibility 隐藏，由 site.js 判断滚动距离后加 .show 才出现
   - z-index 900：低于底部导航栏(1000)与站内搜索弹层(2000)，
     搜索弹层打开时其遮罩会自然盖住本按钮，无需额外联动 */
.to-top{position:fixed;right:22px;bottom:26px;z-index:900;width:44px;height:44px;padding:0;
  border-radius:50%;border:1px solid var(--border);background:var(--card);color:var(--sub);
  cursor:pointer;display:grid;place-items:center;box-shadow:var(--shadow);
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .22s ease,visibility .22s ease,transform .22s ease,color .18s,border-color .18s}
.to-top.show{opacity:1;visibility:visible;transform:none}
.to-top:hover{color:var(--accent);border-color:var(--card-hover-border)}
.to-top:active{transform:scale(.94)}
.to-top svg{width:20px;height:20px}
/* 移动端：抬到底部固定导航栏之上（高度取 --navbar-h，与底栏同源），并叠加安全区内边距 */
@media(max-width:860px){
  .to-top{right:14px;bottom:calc(var(--navbar-h, 56px) + 16px + env(safe-area-inset-bottom,0px));width:42px;height:42px}
}
@media(prefers-reduced-motion:reduce){
  .to-top{transition:none}
  html{scroll-behavior:auto} /* 尊重「减弱动态效果」：回到顶部不做平滑滚动 */
}