/* ============================================================
   王牌脚本库 · 深色霓虹潮流风  (短视频创作者弹药库)
   主渐变：电光紫→潮流蓝  点缀：玫红/活力橙/薄荷绿
   ============================================================ */
:root{
  --brand-1:#7C3AED;
  --brand-2:#2563EB;
  --brand:#6D5BFF;
  --brand-deep:#5B3EE6;
  --grad:linear-gradient(135deg,#7C3AED 0%,#2563EB 100%);
  --grad-hot:linear-gradient(135deg,#FF2D55 0%,#FF8A00 100%);
  --hot:#FF2D55;
  --energy:#FF8A00;
  --mint:#00E5A0;

  --bg:#0B0B14;
  --bg-soft:#14141F;
  --bg-elev:#1C1C2B;
  --card:rgba(255,255,255,.045);
  --card-hi:rgba(255,255,255,.08);
  --border:rgba(255,255,255,.09);
  --border-hi:rgba(124,124,255,.55);

  --text:#F4F4FB;
  --text-2:#A6A6C0;
  --text-3:#6E6E8C;

  --radius:18px;
  --radius-sm:12px;
  --shadow:0 18px 50px rgba(0,0,0,.45);
  --glow:0 0 26px rgba(124,58,237,.45);
  --reading-bg:#ffffff;
  --reading-text:#1d1d29;
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
body{
  font-family:"PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:var(--bg); color:var(--text); line-height:1.7; font-size:15px;
  -webkit-font-smoothing:antialiased; min-height:100vh;
}
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
button{ font-family:inherit; }
.container{ max-width:1120px; margin:0 auto; padding:0 18px; }
::selection{ background:rgba(124,58,237,.4); }

/* ---------- 顶部导航 ---------- */
.site-header{ position:sticky; top:0; z-index:100;
  background:rgba(11,11,20,.82); backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border); }
.hd-inner{ max-width:1120px; margin:0 auto; padding:0 18px; height:62px;
  display:flex; align-items:center; gap:20px; }
.logo{ font-size:21px; font-weight:900; display:flex; align-items:center; gap:8px; white-space:nowrap;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.logo .logo-ic{ -webkit-text-fill-color:initial; display:inline-flex; width:30px; height:30px; border-radius:9px;
  background:var(--grad); align-items:center; justify-content:center; box-shadow:var(--glow); }
.logo-badge{ background:var(--grad-hot); color:#fff; font-size:11px; padding:2px 8px; border-radius:20px;
  font-weight:700; line-height:1.5; cursor:pointer; vertical-align:middle; box-shadow:0 4px 12px rgba(255,45,85,.4);
  transition:transform .15s, opacity .15s; }
.logo-badge:hover{ transform:translateY(-1px); opacity:.9; }
.nav{ display:flex; gap:24px; margin-left:6px; }
.nav a{ font-size:15px; color:var(--text-2); position:relative; padding:4px 0; font-weight:500; transition:color .18s; }
.nav a:hover,.nav a.on{ color:var(--text); }
.nav a.on::after{ content:""; position:absolute; left:0; right:0; bottom:-4px; height:3px; border-radius:3px;
  background:var(--grad); box-shadow:var(--glow); }
.hd-right{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.sister-link{ font-size:13px; color:var(--text-2); border:1px solid var(--border); border-radius:20px;
  padding:6px 13px; white-space:nowrap; transition:.18s; }
.sister-link:hover{ color:var(--text); border-color:var(--border-hi); background:var(--card-hi); }
.user-chip{ display:flex; align-items:center; gap:7px; font-size:14px; color:var(--text-2); cursor:pointer;
  border:1px solid var(--border); border-radius:20px; padding:5px 13px; transition:.18s; }
.user-chip:hover{ border-color:var(--border-hi); color:var(--text); }

/* ---------- 按钮 ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:7px; border:none; cursor:pointer;
  border-radius:12px; padding:11px 22px; font-size:15px; font-weight:700; transition:.18s; font-family:inherit;
  text-decoration:none; white-space:nowrap; }
.btn-primary{ background:var(--grad); color:#fff; box-shadow:0 10px 26px rgba(91,62,230,.42); }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 14px 32px rgba(91,62,230,.55); filter:brightness(1.06); }
.btn-hot{ background:var(--grad-hot); color:#fff; box-shadow:0 10px 26px rgba(255,80,60,.38); }
.btn-hot:hover{ transform:translateY(-2px); filter:brightness(1.05); }
.btn-ghost{ background:var(--card-hi); color:var(--text); border:1px solid var(--border); }
.btn-ghost:hover{ border-color:var(--border-hi); background:rgba(255,255,255,.12); }
.btn-lg{ padding:15px 34px; font-size:17px; border-radius:14px; }
.btn-sm{ padding:7px 15px; font-size:13.5px; border-radius:10px; }
.btn-block{ width:100%; }
.btn[disabled]{ opacity:.5; cursor:not-allowed; transform:none !important; }

/* ---------- Hero ---------- */
.hero{ position:relative; overflow:hidden; padding:76px 0 64px;
  background:
    radial-gradient(720px 380px at 12% -8%, rgba(124,58,237,.42), transparent 60%),
    radial-gradient(680px 420px at 92% 0%, rgba(37,99,235,.38), transparent 62%),
    radial-gradient(520px 320px at 78% 88%, rgba(255,45,85,.16), transparent 60%),
    var(--bg); }
.hero::before{ content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:46px 46px; mask-image:radial-gradient(circle at 50% 0%,#000 0%,transparent 72%);
  -webkit-mask-image:radial-gradient(circle at 50% 0%,#000 0%,transparent 72%); }
.hero-inner{ position:relative; text-align:center; max-width:820px; margin:0 auto; }
.hero-pills{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-bottom:22px; }
.hero-pill{ display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--text-2);
  border:1px solid var(--border); background:var(--card); border-radius:20px; padding:6px 15px; }
.hero-pill .dot{ width:7px; height:7px; border-radius:50%; background:var(--mint); box-shadow:0 0 10px var(--mint); }
.hero h1{ font-size:46px; line-height:1.18; font-weight:900; letter-spacing:.5px; margin-bottom:20px; }
.hero h1 .grad{ background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  background-size:200% auto; animation:shine 5s linear infinite; }
@keyframes shine{ to{ background-position:200% center; } }
.hero p.sub{ font-size:17px; color:var(--text-2); max-width:620px; margin:0 auto 30px; }
.hero-btns{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.hero-stats{ display:flex; gap:40px; justify-content:center; margin-top:42px; flex-wrap:wrap; }
.hs-item b{ font-size:30px; font-weight:900; display:block;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.hs-item span{ font-size:13.5px; color:var(--text-3); }

/* 赛道横条 */
.hero-cats-wrap{ position:relative; margin-top:-30px; z-index:3; }
.hero-cats{ max-width:1120px; margin:0 auto; padding:0 18px; }
.hero-cats .hc-box{ background:var(--bg-soft); border:1px solid var(--border); border-radius:20px;
  padding:18px 20px; box-shadow:var(--shadow); display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.hc-label{ font-size:13.5px; font-weight:800; color:var(--text-2); margin-right:4px; display:inline-flex; align-items:center; gap:6px; }
.hc-chip{ display:inline-flex; align-items:center; gap:7px; color:var(--text-2); border:1px solid var(--border);
  border-radius:999px; padding:8px 16px; font-size:13.5px; transition:.18s; background:var(--card); }
.hc-chip .emo{ font-size:15px; }
.hc-chip:hover{ color:#fff; border-color:var(--border-hi); background:var(--grad); transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(91,62,230,.4); }

/* ---------- 通用区块 ---------- */
.section{ padding:54px 0; }
.section.alt{ background:linear-gradient(180deg,rgba(255,255,255,.015),transparent); }
.section-head{ margin-bottom:30px; display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.section-head.center{ text-align:center; justify-content:center; flex-direction:column; align-items:center; }
.section-head h2{ font-size:27px; font-weight:900; display:flex; align-items:center; gap:10px; }
.section-head h2 .bar{ width:6px; height:26px; border-radius:4px; background:var(--grad); box-shadow:var(--glow); }
.section-head p{ color:var(--text-3); font-size:14px; margin-top:7px; }
.more-link{ font-size:13.5px; color:#9f93ff; font-weight:600; }
.more-link:hover{ text-decoration:underline; }

/* ---------- 脚本卡片 ---------- */
.mat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.mat-card{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden;
  display:flex; flex-direction:column; transition:.2s; position:relative; }
.mat-card:hover{ transform:translateY(-5px); border-color:var(--border-hi);
  box-shadow:0 18px 40px rgba(0,0,0,.5), 0 0 0 1px rgba(124,91,255,.35); }
.mat-thumb{ height:96px; position:relative; display:flex; align-items:center; justify-content:center; font-size:40px;
  background:linear-gradient(135deg,var(--c1,#7C3AED),var(--c2,#2563EB)); overflow:hidden; }
.mat-thumb::after{ content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 80% -20%,rgba(255,255,255,.35),transparent 55%); pointer-events:none; }
.mat-badges{ position:absolute; top:9px; left:9px; display:flex; gap:6px; z-index:2; }
.btag{ font-size:10.5px; padding:2px 8px; border-radius:20px; color:#fff; font-weight:700; backdrop-filter:blur(4px); }
.btag.hot{ background:var(--hot); box-shadow:0 3px 10px rgba(255,45,85,.5); }
.btag.free{ background:var(--energy); box-shadow:0 3px 10px rgba(255,138,0,.5); }
.btag.orig{ background:rgba(0,229,160,.92); color:#04231a; }
.mat-catico{ position:absolute; top:8px; right:10px; font-size:12px; color:rgba(255,255,255,.92);
  background:rgba(0,0,0,.22); padding:2px 9px; border-radius:20px; z-index:2; }
.mat-body{ padding:14px 15px 15px; display:flex; flex-direction:column; gap:9px; flex:1; }
.mat-title{ font-size:15px; font-weight:700; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2;
  -webkit-box-orient:vertical; overflow:hidden; min-height:45px; }
.mat-preview{ font-size:12.5px; color:var(--text-3); line-height:1.6; display:-webkit-box; -webkit-line-clamp:2;
  -webkit-box-orient:vertical; overflow:hidden; }
.mat-tags{ display:flex; gap:6px; flex-wrap:wrap; }
.tag-chi{ font-size:11px; color:var(--text-2); background:var(--card-hi); border:1px solid var(--border);
  padding:2px 9px; border-radius:20px; }
.mat-meta{ font-size:12px; color:var(--text-3); display:flex; gap:12px; }
.mat-foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; padding-top:4px; }
.mat-price{ color:#ff7a59; font-weight:900; font-size:19px; }
.mat-price.free{ color:var(--mint); }
.mat-price small{ font-size:12px; font-weight:600; }
.mat-go{ font-size:12.5px; color:#9f93ff; font-weight:700; }

/* ---------- 分类大卡 ---------- */
.cat-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.cat-card{ border:1px solid var(--border); border-radius:var(--radius); padding:22px 10px 18px; text-align:center;
  transition:.2s; background:var(--card); position:relative; overflow:hidden; }
.cat-card::before{ content:""; position:absolute; inset:0; opacity:0; transition:.2s;
  background:linear-gradient(135deg,var(--c1,#7C3AED),var(--c2,#2563EB)); }
.cat-card>*{ position:relative; }
.cat-card:hover{ transform:translateY(-5px); border-color:transparent; box-shadow:0 16px 34px rgba(0,0,0,.45); }
.cat-card:hover::before{ opacity:1; }
.cat-card .cat-ic{ width:52px; height:52px; margin:0 auto 10px; border-radius:15px; display:flex; align-items:center;
  justify-content:center; font-size:26px; background:linear-gradient(135deg,var(--c1,#7C3AED),var(--c2,#2563EB)); }
.cat-card:hover .cat-ic{ background:rgba(255,255,255,.18); }
.cat-card b{ display:block; font-size:14.5px; margin-bottom:2px; }
.cat-card span{ font-size:12px; color:var(--text-3); }
.cat-card:hover span{ color:rgba(255,255,255,.85); }

/* ---------- 版权干净信任条 ---------- */
.trust-band{ border:1px solid var(--border); border-radius:var(--radius); padding:30px;
  background:linear-gradient(135deg,rgba(0,229,160,.08),rgba(37,99,235,.08)); display:grid;
  grid-template-columns:repeat(4,1fr); gap:22px; }
.trust-item{ display:flex; gap:13px; align-items:flex-start; }
.trust-item .ti-ic{ flex:0 0 42px; height:42px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:var(--card-hi); border:1px solid var(--border); }
.trust-item b{ display:block; font-size:15px; margin-bottom:3px; }
.trust-item p{ font-size:12.5px; color:var(--text-3); line-height:1.6; }

/* ---------- 会员定价 ---------- */
.price-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }
.price-card{ border:1px solid var(--border); border-radius:20px; padding:30px 26px; background:var(--card);
  position:relative; display:flex; flex-direction:column; }
.price-card.featured{ border:1px solid transparent; background:
   linear-gradient(var(--bg-soft),var(--bg-soft)) padding-box, var(--grad) border-box;
  border:1.5px solid transparent; box-shadow:0 20px 50px rgba(91,62,230,.4); transform:scale(1.03); }
.price-card .pc-flag{ position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--grad-hot);
  color:#fff; font-size:12px; padding:4px 16px; border-radius:20px; font-weight:800; white-space:nowrap;
  box-shadow:0 6px 16px rgba(255,80,60,.45); }
.price-card h3{ font-size:19px; font-weight:900; text-align:center; }
.price-card .pc-desc{ text-align:center; color:var(--text-3); font-size:13px; margin:7px 0 18px; min-height:40px; }
.price-card .pc-price{ text-align:center; margin-bottom:20px; }
.price-card .pc-price b{ font-size:42px; font-weight:900;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.price-card .pc-price .yuan{ font-size:20px; -webkit-text-fill-color:var(--text-2); }
.price-card .pc-price .old{ font-size:14px; color:var(--text-3); text-decoration:line-through; margin-left:6px; -webkit-text-fill-color:var(--text-3); }
.pc-feats{ list-style:none; display:flex; flex-direction:column; gap:12px; margin-bottom:26px; flex:1; }
.pc-feats li{ font-size:14px; color:var(--text-2); display:flex; gap:9px; align-items:flex-start; line-height:1.5; }
.pc-feats li .ck{ color:var(--mint); flex:0 0 auto; margin-top:2px; }

/* ---------- 库页筛选 ---------- */
.page-head{ padding:34px 0 10px; }
.page-head h1{ font-size:28px; font-weight:900; }
.page-head p{ color:var(--text-3); font-size:14px; margin-top:6px; }
.filter-bar{ position:sticky; top:62px; z-index:40; background:rgba(11,11,20,.9); backdrop-filter:blur(14px);
  border:1px solid var(--border); border-radius:16px; padding:14px 16px; margin:18px 0 26px; display:flex;
  gap:14px; align-items:center; flex-wrap:wrap; }
.fb-group{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.fb-label{ font-size:13px; color:var(--text-3); margin-right:2px; }
.fb-chip{ font-size:13px; padding:6px 14px; border-radius:20px; border:1px solid var(--border); color:var(--text-2);
  cursor:pointer; background:var(--card); transition:.16s; }
.fb-chip.on{ color:#fff; background:var(--grad); border-color:transparent; box-shadow:0 6px 16px rgba(91,62,230,.4); }
.fb-search{ margin-left:auto; display:flex; align-items:center; background:var(--bg-elev); border:1px solid var(--border);
  border-radius:10px; padding:0 12px; min-width:220px; }
.fb-search input{ flex:1; background:transparent; border:none; outline:none; color:var(--text); font-size:14px; padding:9px 8px; }
.fb-search input::placeholder{ color:var(--text-3); }
.empty{ text-align:center; padding:70px 20px; color:var(--text-3); }
.empty .e-ic{ font-size:50px; margin-bottom:14px; }
.pager{ display:flex; gap:8px; justify-content:center; margin-top:36px; }
.pager button{ min-width:38px; height:38px; border-radius:10px; border:1px solid var(--border); background:var(--card);
  color:var(--text-2); cursor:pointer; font-size:14px; }
.pager button.on{ background:var(--grad); color:#fff; border-color:transparent; }
.pager button:disabled{ opacity:.4; cursor:not-allowed; }

/* ---------- 详情（脚本阅读，浅色阅读面） ---------- */
.detail-wrap{ padding:26px 0 60px; display:grid; grid-template-columns:1fr 320px; gap:24px; align-items:start; }
.script-paper{ background:var(--reading-bg); color:var(--reading-text); border-radius:20px; padding:40px 44px;
  box-shadow:var(--shadow); }
.sp-crumb{ font-size:13px; color:#8a8aa0; margin-bottom:18px; }
.sp-crumb a{ color:#6D5BFF; }
.sp-tags{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.sp-tags .tag{ font-size:12px; padding:3px 11px; border-radius:20px; background:#f0eefe; color:#5B3EE6; font-weight:600; }
.sp-tags .tag.hot{ background:#fff0f3; color:#e0274b; }
.sp-tags .tag.free{ background:#fff5e8; color:#d9730a; }
.script-paper h1{ font-size:27px; line-height:1.4; margin-bottom:12px; color:#15151f; }
.sp-meta{ font-size:13px; color:#9a9aae; display:flex; gap:16px; flex-wrap:wrap; padding-bottom:18px;
  border-bottom:1px solid #eee; margin-bottom:24px; }
.sp-body p{ font-size:15.5px; line-height:2; margin-bottom:12px; color:#2b2b38; }
.sp-body p.is-head{ font-weight:800; color:#15151f; margin-top:18px; font-size:16px; }
.sp-body p.scene{ background:#f7f6ff; border-left:3px solid var(--brand); border-radius:0 10px 10px 0;
  padding:10px 14px; margin:8px 0; }
.sp-lock{ border:2px dashed #d8d4ff; border-radius:16px; padding:30px 24px; text-align:center; margin-top:10px;
  background:linear-gradient(135deg,#f6f4ff,#eef3ff); }
.sp-lock .lk-ic{ font-size:38px; margin-bottom:10px; }
.sp-lock h3{ font-size:18px; color:#3a2f8f; margin-bottom:6px; }
.sp-lock p{ color:#7a76a0; font-size:13.5px; margin-bottom:16px; }
.sp-blur{ filter:blur(5px); user-select:none; pointer-events:none; }
.sp-license{ margin-top:28px; padding:16px 18px; border:1px solid #e6e3f7; background:#faf9ff; border-radius:12px;
  font-size:12.5px; color:#6f6f90; line-height:1.8; }
.sp-license b{ color:#3a2f8f; }
.sp-copyline{ margin-top:14px; font-size:12px; color:#b0b0c0; text-align:center; }

/* 详情侧栏 */
.detail-side{ position:sticky; top:84px; display:flex; flex-direction:column; gap:16px; }
.buy-card{ background:var(--bg-soft); border:1px solid var(--border); border-radius:18px; padding:24px 22px; }
.buy-card .bc-price{ font-size:34px; font-weight:900; color:#ff7a59; margin:6px 0 4px; }
.buy-card .bc-price.free{ color:var(--mint); }
.buy-card .bc-hint{ font-size:12.5px; color:var(--text-3); margin-bottom:18px; }
.buy-card .btn{ margin-bottom:10px; }
.bc-orig{ display:flex; gap:9px; align-items:flex-start; font-size:12px; color:var(--text-3); margin-top:14px;
  padding-top:14px; border-top:1px solid var(--border); line-height:1.6; }
.bc-orig .oi{ color:var(--mint); flex:0 0 auto; }
.rel-card{ background:var(--bg-soft); border:1px solid var(--border); border-radius:18px; padding:20px; }
.rel-card h4{ font-size:15px; margin-bottom:12px; }
.rel-item{ display:block; padding:10px 0; border-bottom:1px solid var(--border); font-size:13.5px; color:var(--text-2);
  transition:color .15s; }
.rel-item:last-child{ border:none; }
.rel-item:hover{ color:#a99bff; }
.rel-item .r-price{ color:#ff7a59; font-size:12px; font-weight:700; }

/* ---------- 登录弹窗 ---------- */
.modal-mask{ position:fixed; inset:0; background:rgba(6,6,12,.72); backdrop-filter:blur(6px); z-index:200;
  display:none; align-items:center; justify-content:center; padding:18px; }
.modal-mask.show{ display:flex; }
.modal{ width:100%; max-width:420px; background:var(--bg-soft); border:1px solid var(--border); border-radius:22px;
  padding:30px 28px; position:relative; box-shadow:var(--shadow); max-height:92vh; overflow-y:auto; }
.modal-close{ position:absolute; top:16px; right:16px; width:32px; height:32px; border-radius:50%; border:none;
  background:var(--card-hi); color:var(--text-2); cursor:pointer; font-size:16px; }
.modal h3{ font-size:21px; font-weight:900; margin-bottom:4px; text-align:center; }
.modal .m-sub{ text-align:center; font-size:13px; color:var(--text-3); margin-bottom:20px; }
.auth-tabs{ display:flex; gap:6px; background:var(--bg-elev); border-radius:12px; padding:5px; margin-bottom:20px; }
.auth-tabs button{ flex:1; border:none; background:transparent; color:var(--text-3); font-size:14px; padding:9px 0;
  border-radius:9px; cursor:pointer; font-weight:600; }
.auth-tabs button.on{ background:var(--grad); color:#fff; box-shadow:0 5px 14px rgba(91,62,230,.4); }
.field{ margin-bottom:14px; }
.field label{ display:block; font-size:13px; color:var(--text-2); margin-bottom:6px; }
.field input{ width:100%; background:var(--bg-elev); border:1px solid var(--border); border-radius:11px;
  padding:12px 14px; color:var(--text); font-size:15px; outline:none; transition:border .15s; }
.field input:focus{ border-color:var(--border-hi); }
.code-row{ display:flex; gap:10px; }
.code-row .field{ flex:1; margin:0; }
.code-send{ flex:0 0 auto; align-self:flex-start; margin-top:24px; }
.auth-tip{ font-size:12px; color:var(--text-3); text-align:center; margin-top:14px; line-height:1.7; }
.auth-tip a{ color:#9f93ff; }
.wx-login{ text-align:center; padding:10px 0; }
.wx-qr{ width:200px; height:200px; margin:14px auto; background:#fff; border-radius:14px; padding:12px;
  display:flex; align-items:center; justify-content:center; }
.wx-qr img,.wx-qr canvas{ width:100%; height:100%; }
.form-msg{ font-size:13px; text-align:center; min-height:20px; margin:6px 0 10px; color:var(--hot); }
.form-msg.ok{ color:var(--mint); }

/* ---------- Toast ---------- */
.toast{ position:fixed; left:50%; bottom:60px; transform:translateX(-50%) translateY(20px); background:rgba(28,28,43,.96);
  border:1px solid var(--border-hi); color:var(--text); padding:12px 22px; border-radius:12px; font-size:14px;
  opacity:0; pointer-events:none; transition:.25s; z-index:300; box-shadow:var(--shadow); max-width:88vw; text-align:center; }
.toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

/* ---------- 用户中心 ---------- */
.user-wrap{ padding:30px 0 60px; }
.user-card{ background:linear-gradient(135deg,rgba(124,58,237,.25),rgba(37,99,235,.2)); border:1px solid var(--border);
  border-radius:20px; padding:28px; display:flex; align-items:center; gap:20px; margin-bottom:24px; }
.user-avatar{ width:64px; height:64px; border-radius:50%; background:var(--grad); display:flex; align-items:center;
  justify-content:center; font-size:28px; font-weight:900; color:#fff; }
.user-card h2{ font-size:22px; font-weight:900; }
.user-card p{ color:var(--text-2); font-size:13.5px; }
.user-stat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:26px; }
.ustat{ background:var(--card); border:1px solid var(--border); border-radius:16px; padding:22px; text-align:center; }
.ustat b{ font-size:30px; font-weight:900; display:block;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.ustat span{ font-size:13px; color:var(--text-3); }
.vip-banner{ background:var(--grad); border-radius:16px; padding:20px 24px; display:flex; align-items:center;
  justify-content:space-between; gap:14px; margin-bottom:26px; box-shadow:var(--glow); }
.vip-banner h3{ font-size:18px; font-weight:900; }
.vip-banner p{ font-size:13px; opacity:.9; }
.vip-banner .btn{ background:#fff; color:var(--brand-deep); box-shadow:none; }

/* ---------- 后台 ---------- */
.admin-wrap{ padding:26px 0 60px; }
.admin-login{ max-width:380px; margin:60px auto; background:var(--bg-soft); border:1px solid var(--border);
  border-radius:20px; padding:34px 30px; }
.admin-login h2{ text-align:center; margin-bottom:22px; font-weight:900; }
.tabs-line{ display:flex; gap:22px; border-bottom:1px solid var(--border); margin-bottom:24px; flex-wrap:wrap; }
.tabs-line button{ background:none; border:none; color:var(--text-3); font-size:15px; padding:12px 2px; cursor:pointer;
  font-weight:700; border-bottom:3px solid transparent; }
.tabs-line button.on{ color:var(--text); border-bottom-color:var(--brand); }
.panel-card{ background:var(--bg-soft); border:1px solid var(--border); border-radius:16px; padding:20px; margin-bottom:18px; }
.admin-table{ width:100%; border-collapse:collapse; font-size:13.5px; }
.admin-table th,.admin-table td{ padding:11px 10px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
.admin-table th{ color:var(--text-3); font-weight:600; white-space:nowrap; }
.admin-table .row-act{ display:flex; gap:8px; }
.mini-btn{ font-size:12px; padding:5px 11px; border-radius:8px; border:1px solid var(--border); background:var(--card-hi);
  color:var(--text-2); cursor:pointer; }
.mini-btn.danger{ color:#ff8aa0; border-color:rgba(255,45,85,.4); }
.admin-form{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.admin-form .full{ grid-column:1/-1; }
.admin-form label{ font-size:13px; color:var(--text-2); display:block; margin-bottom:6px; }
.admin-form input,.admin-form select,.admin-form textarea{ width:100%; background:var(--bg-elev); border:1px solid var(--border);
  border-radius:10px; padding:10px 12px; color:var(--text); font-size:14px; outline:none; font-family:inherit; }
.admin-form textarea{ min-height:150px; resize:vertical; line-height:1.7; }
.revenue-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:20px; }

/* ---------- 协议/内容长页（浅色阅读） ---------- */
.doc-wrap{ max-width:860px; margin:0 auto; padding:34px 20px 70px; }
.doc-paper{ background:#fff; color:#222; border-radius:20px; padding:44px 48px; box-shadow:var(--shadow); }
.doc-paper h1{ font-size:26px; text-align:center; margin-bottom:8px; color:#15151f; }
.doc-paper .doc-updated{ text-align:center; color:#999; font-size:13px; margin-bottom:28px; }
.doc-paper h2{ font-size:18px; margin:26px 0 10px; color:#3a2f8f; }
.doc-paper p,.doc-paper li{ font-size:14.5px; line-height:1.95; color:#333; }
.doc-paper ul{ padding-left:22px; margin:8px 0; }
.doc-paper .notice{ background:#f6f4ff; border-left:4px solid var(--brand); padding:14px 16px; border-radius:0 10px 10px 0;
  margin:16px 0; font-size:14px; color:#4a4378; }

/* ---------- 支付结果 / 二维码弹层 ---------- */
.pay-mask{ position:fixed; inset:0; background:rgba(6,6,12,.8); z-index:220; display:none; align-items:center;
  justify-content:center; padding:18px; }
.pay-mask.show{ display:flex; }
.pay-box{ background:var(--bg-soft); border:1px solid var(--border); border-radius:22px; padding:32px 30px;
  text-align:center; max-width:380px; width:100%; position:relative; }
.pay-qr{ width:210px; height:210px; background:#fff; border-radius:14px; padding:12px; margin:18px auto;
  display:flex; align-items:center; justify-content:center; }
.pay-qr img,.pay-qr canvas{ width:100%; height:100%; }
.pay-box .pamt{ font-size:34px; font-weight:900; color:#ff7a59; }
.result-wrap{ max-width:560px; margin:50px auto; text-align:center; background:var(--bg-soft); border:1px solid var(--border);
  border-radius:22px; padding:44px 34px; }
.result-ic{ width:74px; height:74px; border-radius:50%; background:var(--mint); color:#04231a; font-size:38px;
  display:flex; align-items:center; justify-content:center; margin:0 auto 18px; }
.result-ic.fail{ background:var(--hot); color:#fff; }

/* ---------- 页脚 ---------- */
.site-footer{ border-top:1px solid var(--border); background:#08080f; margin-top:30px; padding:44px 0 26px; }
.ft-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1fr; gap:30px; margin-bottom:30px; }
.ft-brand .logo{ margin-bottom:12px; }
.ft-brand p{ font-size:13px; color:var(--text-3); line-height:1.8; }
.ft-col h5{ font-size:14px; color:var(--text); margin-bottom:13px; font-weight:700; }
.ft-col a{ display:block; font-size:13px; color:var(--text-3); margin-bottom:10px; transition:color .15s; }
.ft-col a:hover{ color:#a99bff; }
.ft-line{ display:block; font-size:12px; color:var(--text-3); opacity:.85; margin-bottom:8px; line-height:1.6; }
.ft-copy{ border-top:1px solid var(--border); padding-top:20px; text-align:center; font-size:12.5px; color:var(--text-3);
  line-height:1.9; }
.ft-copy .cr{ color:var(--mint); font-weight:600; }

/* 回到顶部（全站统一，紫色主题，风格对齐其他王牌站点） */
.back-top{ position:fixed; right:22px; bottom:34px; width:44px; height:44px; border-radius:50%;
  background:#fff; color:var(--brand-deep); border:1px solid var(--border);
  box-shadow:0 8px 26px rgba(91,62,230,.22); display:flex; align-items:center; justify-content:center;
  cursor:pointer; z-index:90; opacity:0; visibility:hidden; transform:translateY(12px);
  transition:opacity .22s, transform .22s, visibility .22s; }
.back-top.show{ opacity:1; visibility:visible; transform:translateY(0); }
.back-top:active{ transform:translateY(1px) scale(.96); }
.back-top svg{ width:22px; height:22px; }

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .mat-grid{ grid-template-columns:repeat(2,1fr); }
  .cat-grid{ grid-template-columns:repeat(3,1fr); }
  .trust-band{ grid-template-columns:repeat(2,1fr); }
  .price-grid{ grid-template-columns:1fr; }
  .price-card.featured{ transform:none; }
  .detail-wrap{ grid-template-columns:1fr; }
  .detail-side{ position:static; }
  .ft-grid{ grid-template-columns:1fr 1fr; }
  .hero h1{ font-size:34px; }
  .script-paper{ padding:28px 22px; }
  .nav{ display:none; }
}
@media (max-width:560px){
  .cat-grid{ grid-template-columns:repeat(2,1fr); }
  .trust-band{ grid-template-columns:1fr; }
  .user-stat-grid,.revenue-row{ grid-template-columns:1fr; }
  .admin-form{ grid-template-columns:1fr; }
  .hero{ padding:54px 0 56px; }
  .hero h1{ font-size:29px; }
  .hero-stats{ gap:26px; }
  .sister-link{ display:none; }
  .doc-paper{ padding:30px 20px; }
  .fb-search{ margin-left:0; width:100%; }
  .filter-bar{ top:56px; }
}

/* ============================================================
   追加：新页面类名体系（首页 / 文案库 / 详情 / 会员 / 用户 / 支付结果）
   ============================================================ */
/* Hero 徽章 / 按钮 / 侧卡 */
.hero-badge{ display:inline-flex; align-items:center; gap:8px; padding:7px 16px; border-radius:30px;
  background:var(--card-hi); border:1px solid var(--border-hi); font-size:13px; color:var(--text);
  margin-bottom:22px; backdrop-filter:blur(6px); }
.hero-badge .live{ width:8px; height:8px; border-radius:50%; background:var(--hot);
  box-shadow:0 0 0 0 rgba(255,45,85,.6); animation:pulse 1.8s infinite; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(255,45,85,.55);} 70%{ box-shadow:0 0 0 10px rgba(255,45,85,0);} 100%{ box-shadow:0 0 0 0 rgba(255,45,85,0);} }
.hero-cta{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.glow-btn{ position:relative; background:var(--grad); color:#fff; font-weight:800; padding:15px 32px;
  border-radius:14px; font-size:16px; box-shadow:0 12px 34px rgba(109,91,255,.5); overflow:hidden; }
.glow-btn::after{ content:""; position:absolute; top:0; left:-80%; width:50%; height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent); transform:skewX(-20deg);
  animation:sweep 3.2s ease-in-out infinite; }
@keyframes sweep{ 0%,60%{ left:-80%;} 100%{ left:130%;} }
.glow-btn:hover{ transform:translateY(-2px); filter:brightness(1.07); }
.btn-outline{ display:inline-flex; align-items:center; gap:7px; padding:15px 28px; border-radius:14px;
  border:1.5px solid var(--border-hi); color:var(--text); background:var(--card); font-weight:700; font-size:16px;
  transition:.18s; }
.btn-outline:hover{ border-color:#a99bff; background:var(--card-hi); transform:translateY(-2px); }
.hero-side{ position:relative; }
.hero-phone{ border-radius:26px; overflow:hidden; border:1px solid var(--border-hi);
  box-shadow:0 30px 80px rgba(0,0,0,.6), 0 0 60px rgba(124,58,237,.3); background:var(--bg-soft); }

/* 分区标题（新） */
.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; margin:54px 0 22px; gap:16px; flex-wrap:wrap; }
.sec-head .l h2{ font-size:25px; font-weight:900; display:flex; align-items:center; gap:10px; }
.sec-head .l h2 .ic{ font-size:24px; }
.sec-head .l p{ color:var(--text-3); font-size:13.5px; margin-top:5px; }
.sec-more{ font-size:13.5px; color:#a99bff; white-space:nowrap; }
.sec-more:hover{ text-decoration:underline; }

/* 赛道卡片 */
.chip-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.chip,.scene-card{ position:relative; display:block; border-radius:var(--radius); padding:20px 16px;
  background:var(--card); border:1px solid var(--border); text-align:center; transition:.2s; overflow:hidden; }
.chip:hover,.scene-card:hover{ transform:translateY(-4px); border-color:var(--border-hi);
  background:var(--card-hi); box-shadow:var(--glow); }
.chip .ce,.scene-icon{ width:46px; height:46px; margin:0 auto 10px; border-radius:14px; display:flex;
  align-items:center; justify-content:center; font-size:23px; }
.chip b{ display:block; font-size:14.5px; margin-bottom:3px; }
.chip small{ color:var(--text-3); font-size:12px; }
.scene-card .scene-icon{ background:var(--card-hi); }
.scene-card b{ display:block; font-size:15px; margin:6px 0 3px; }
.scene-card small{ color:var(--text-3); font-size:12px; }

/* 热门卡片（封面式） */
.hot-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.hot-card{ position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--border);
  background:var(--bg-elev); display:flex; flex-direction:column; transition:.2s; min-height:210px; }
.hot-card:hover{ transform:translateY(-4px); border-color:var(--border-hi); box-shadow:var(--shadow); }
.hot-cover{ height:96px; position:relative; display:flex; align-items:center; justify-content:center;
  font-size:40px; }
.hot-cover .ct{ position:absolute; top:10px; left:10px; font-size:11px; padding:2px 9px; border-radius:20px;
  background:rgba(0,0,0,.45); color:#fff; backdrop-filter:blur(4px); }
.lock-mask{ position:absolute; inset:0; background:rgba(8,8,15,.32); display:flex; align-items:center;
  justify-content:center; opacity:0; transition:.2s; }
.hot-card:hover .lock-mask{ opacity:1; }
.hot-body{ padding:13px 14px; display:flex; flex-direction:column; gap:7px; flex:1; }
.hot-body h4{ font-size:14.5px; line-height:1.5; font-weight:700;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hot-meta{ display:flex; align-items:center; gap:10px; font-size:12px; color:var(--text-3); margin-top:auto; }
.hot-meta .price{ margin-left:auto; font-weight:800; font-size:15px; }
.hot-meta .price.free{ color:var(--mint); }
.hot-meta .price.paid{ color:#ffb020; }
.hot-meta .hot-flag{ background:var(--grad-hot); color:#fff; font-size:10.5px; padding:1px 7px; border-radius:6px; font-weight:700; }

/* 标签合集 */
.tag-section{ margin-bottom:26px; }
.tag-section h3{ font-size:16px; margin-bottom:12px; display:flex; align-items:center; gap:8px; }
.tag-list{ display:flex; flex-wrap:wrap; gap:10px; }
.tag-card{ padding:9px 16px; border-radius:30px; background:var(--card); border:1px solid var(--border);
  font-size:13.5px; color:var(--text-2); transition:.16s; }
.tag-card:hover{ color:#fff; border-color:var(--border-hi); background:var(--card-hi); transform:translateY(-2px); }

/* 会员卡片 */
.vip-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }
.vip-card{ position:relative; border-radius:22px; padding:30px 26px; background:var(--card);
  border:1px solid var(--border); display:flex; flex-direction:column; transition:.2s; }
.vip-card:hover{ transform:translateY(-6px); border-color:var(--border-hi); }
.vip-card.featured{ background:linear-gradient(160deg,rgba(124,58,237,.28),rgba(37,99,235,.16));
  border-color:var(--border-hi); box-shadow:var(--glow); }
.vip-flag{ position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--grad-hot);
  color:#fff; font-size:12px; font-weight:800; padding:4px 16px; border-radius:20px; white-space:nowrap; }
.vip-card h3{ font-size:20px; font-weight:900; margin-bottom:6px; }
.vip-card .vd{ color:var(--text-3); font-size:13px; margin-bottom:20px; }
.vip-price{ display:flex; align-items:baseline; gap:6px; margin-bottom:4px; }
.vip-price b{ font-size:42px; font-weight:900;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.vip-price .unit{ color:var(--text-3); font-size:14px; }
.vip-price .old{ color:var(--text-3); text-decoration:line-through; font-size:14px; margin-left:6px; }
.vip-price .perday{ color:var(--mint); font-size:12px; margin-bottom:18px; }
.vip-features{ list-style:none; margin:18px 0 24px; display:flex; flex-direction:column; gap:11px; }
.vip-features li{ font-size:13.5px; color:var(--text-2); display:flex; gap:8px; line-height:1.5; }
.vip-features li::before{ content:"✓"; color:var(--mint); font-weight:900; flex-shrink:0; }
.vip-card .btn{ margin-top:auto; }

/* 文案库筛选 */
.filter-tabs{ display:flex; gap:8px; flex-wrap:wrap; margin:22px 0 18px; }
.chip-row{ display:flex; gap:9px; overflow-x:auto; padding-bottom:8px; margin-bottom:18px; -webkit-overflow-scrolling:touch; }
.chip-row::-webkit-scrollbar{ height:0; }
.cat-chip{ flex-shrink:0; padding:8px 16px; border-radius:30px; background:var(--card); border:1px solid var(--border);
  font-size:14px; color:var(--text-2); white-space:nowrap; transition:.16s; }
.cat-chip.on,.cat-chip:hover{ background:var(--grad); color:#fff; border-color:transparent; }
.lib-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.stat-pill{ display:inline-flex; align-items:center; gap:6px; padding:6px 14px; border-radius:20px;
  background:var(--card); border:1px solid var(--border); font-size:13px; color:var(--text-2); }
.empty-box{ text-align:center; padding:80px 20px; color:var(--text-3); }
.empty-box .big{ font-size:52px; margin-bottom:14px; }

/* 详情页 */
.detail-hero{ border-radius:22px; padding:30px; background:linear-gradient(150deg,rgba(124,58,237,.22),rgba(37,99,235,.1));
  border:1px solid var(--border); margin-bottom:22px; }
.detail-hero .crumbs{ font-size:13px; color:var(--text-3); margin-bottom:14px; }
.detail-hero h1{ font-size:26px; line-height:1.4; margin-bottom:14px; font-weight:900; }
.detail-hero .meta{ display:flex; gap:16px; flex-wrap:wrap; font-size:13px; color:var(--text-2); margin-bottom:16px; }
.detail-hero .tags{ display:flex; gap:8px; flex-wrap:wrap; }
.tag-pill{ font-size:12px; padding:3px 11px; border-radius:20px; background:var(--card-hi); color:var(--text-2); border:1px solid var(--border); }
.license-strip{ display:flex; align-items:center; gap:12px; padding:14px 18px; border-radius:14px;
  background:rgba(0,229,160,.08); border:1px solid rgba(0,229,160,.3); font-size:13px; color:var(--mint); margin:18px 0; }
.doc-copy{ position:relative; }

/* 用户中心 */
.user-hero{ display:flex; align-items:center; gap:18px; padding:28px; border-radius:22px;
  background:linear-gradient(150deg,rgba(124,58,237,.22),rgba(37,99,235,.1)); border:1px solid var(--border); margin-bottom:22px; }
.u-avatar{ width:64px; height:64px; border-radius:50%; background:var(--grad); display:flex; align-items:center;
  justify-content:center; font-size:28px; font-weight:900; color:#fff; flex-shrink:0; }
.u-info h2{ font-size:22px; font-weight:900; }
.u-info p{ color:var(--text-3); font-size:13px; margin-top:3px; }
.vip-badge-mini{ display:inline-block; margin-left:10px; font-size:12px; padding:2px 10px; border-radius:20px;
  background:var(--grad-hot); color:#fff; font-weight:700; vertical-align:middle; }
.info-card{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:22px; margin-bottom:18px; }
.info-card h3{ font-size:16px; margin-bottom:16px; display:flex; align-items:center; gap:8px; }
.info-row{ display:flex; justify-content:space-between; padding:11px 0; border-bottom:1px solid var(--border); font-size:14px; }
.info-row:last-child{ border-bottom:none; }
.info-row .k{ color:var(--text-3); }
.info-row .v{ color:var(--text); font-weight:600; }
.owned-card{ display:flex; align-items:center; gap:14px; padding:14px; border-radius:14px; background:var(--bg-soft);
  border:1px solid var(--border); margin-bottom:10px; }
.owned-card .oc-ic{ font-size:24px; }
.owned-card .oc-t{ flex:1; min-width:0; }
.owned-card .oc-t b{ font-size:14px; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.owned-card .oc-t small{ color:var(--text-3); font-size:12px; }

/* 支付结果 */
.result-wrap{ min-height:60vh; display:flex; align-items:center; justify-content:center; padding:60px 18px; }
.result-card{ text-align:center; max-width:440px; width:100%; background:var(--card); border:1px solid var(--border);
  border-radius:24px; padding:44px 32px; }
.result-ic{ width:84px; height:84px; border-radius:50%; margin:0 auto 22px; display:flex; align-items:center;
  justify-content:center; font-size:44px; }
.result-ic.ok{ background:rgba(0,229,160,.14); color:var(--mint); box-shadow:0 0 40px rgba(0,229,160,.3); }
.result-ic.no{ background:rgba(255,45,85,.14); color:var(--hot); }
.result-card h1{ font-size:24px; margin-bottom:10px; }
.result-card p{ color:var(--text-3); font-size:14px; margin-bottom:26px; }
.pay-step{ display:flex; align-items:center; gap:10px; justify-content:center; font-size:14px; color:var(--text-2);
  margin:16px 0; }
.pay-step .n{ width:24px; height:24px; border-radius:50%; background:var(--grad); color:#fff; display:flex;
  align-items:center; justify-content:center; font-size:13px; font-weight:700; flex-shrink:0; }

/* 通用 modal 兜底（部分页面用 modal-backdrop） */
.modal-backdrop{ position:fixed; inset:0; background:rgba(5,5,12,.7); backdrop-filter:blur(4px);
  z-index:1000; display:flex; align-items:center; justify-content:center; padding:20px; }

/* 文档页增强 */
.doc-paper .notice{ background:rgba(124,58,237,.08); border-left:4px solid var(--brand); padding:14px 18px;
  border-radius:0 10px 10px 0; margin:18px 0; color:#444; font-size:14px; line-height:1.8; }
.doc-paper ul{ padding-left:22px; margin:12px 0; }
.doc-paper ul li{ margin-bottom:8px; line-height:1.8; }

@media (max-width:900px){
  .chip-grid{ grid-template-columns:repeat(3,1fr); }
  .hot-grid{ grid-template-columns:repeat(2,1fr); }
  .vip-grid{ grid-template-columns:1fr; }
  .lib-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
  .chip-grid{ grid-template-columns:repeat(2,1fr); }
  .hot-grid{ grid-template-columns:1fr; }
  .lib-grid{ grid-template-columns:1fr; }
  .sec-head .l h2{ font-size:21px; }
  .detail-hero{ padding:22px 18px; }
  .detail-hero h1{ font-size:21px; }
}

/* 账号设置弹层 */
.st-val{flex:1;font-size:14px;color:var(--text);font-weight:600}
.st-val i{color:var(--text-3);font-style:normal;font-weight:400}

/* ===== 顶部账号下拉（个人中心）统一风格 ===== */
.uc{ position:relative; display:inline-flex; align-items:center; }
.uc-btn{ display:inline-flex; align-items:center; gap:7px; background:none; border:none; padding:0; cursor:pointer; font-family:inherit; border-radius:20px; padding:3px 6px; transition:background .15s; }
.uc-btn:hover{ background:rgba(255,255,255,.10); }
.uc-ava{ width:32px; height:32px; border-radius:50%; background:var(--grad); color:#fff; font-size:14px; font-weight:600; display:inline-flex; align-items:center; justify-content:center; overflow:hidden; flex-shrink:0; }
.uc-ava img{ width:100%; height:100%; object-fit:cover; }
.uc-name{ font-size:14px; font-weight:600; color:var(--text); max-width:88px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.uc-btn:hover .uc-name{ color:#ffffff; }
.uc-caret{ color:var(--text-2); flex-shrink:0; }
.uc-panel{ display:none; position:absolute; top:46px; right:0; width:212px; background:#191926; border:1px solid rgba(255,255,255,.12); border-radius:14px; box-shadow:0 18px 48px rgba(0,0,0,.55); padding:8px; z-index:300; }
.uc-panel.open{ display:block; }
.uc-head{ display:flex; align-items:center; gap:11px; padding:10px 8px 12px; border-bottom:1px solid rgba(255,255,255,.10); margin-bottom:6px; }
.uc-head .uc-ava{ width:40px; height:40px; font-size:17px; }
.uc-meta{ display:flex; flex-direction:column; min-width:0; }
.uc-meta b{ font-size:14px; color:#ffffff; font-weight:600; line-height:1.4; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.uc-meta em{ font-style:normal; font-size:12px; color:var(--text-3); line-height:1.4; }
.uc-row{ display:flex; align-items:center; gap:10px; padding:9px 10px; font-size:14px; color:var(--text-2); border-radius:9px; cursor:pointer; transition:background .15s,color .15s; }
.uc-row:hover{ background:rgba(255,255,255,.10); color:#ffffff; }
.uc-row .uc-ic{ color:var(--text-3); flex-shrink:0; }
.uc-row:hover .uc-ic{ color:#ffffff; }
.uc-sep{ height:1px; background:rgba(255,255,255,.10); margin:6px 2px; }
.uc-row.logout{ color:#ff8a80; }
.uc-row.logout .uc-ic{ color:#ff8a80; }
.uc-row.logout:hover{ background:rgba(255,45,85,.16); color:#ffb4ad; }
.uc-row.logout:hover .uc-ic{ color:#ffb4ad; }
.uc-guest{ display:flex; align-items:center; gap:10px; }
.uc-link{ font-size:14px; font-weight:600; color:var(--text); background:none; border:none; cursor:pointer; padding:5px 10px; border-radius:8px; }
.uc-link:hover{ background:rgba(255,255,255,.10); color:#fff; }
.uc-reg{ background:var(--grad); color:#fff; border-radius:20px; padding:6px 14px; font-size:14px; font-weight:600; border:none; cursor:pointer; }
.uc-reg:hover{ filter:brightness(1.08); }
/* 顶部导航不换行 */
.hd-inner{ flex-wrap:nowrap; }
.nav{ flex-wrap:nowrap; white-space:nowrap; }
.nav a{ white-space:nowrap; }
.hd-right{ white-space:nowrap; }
.uc-ic{display:inline-flex}