/* ==========================================================================
   星际导航 · 前台样式（视觉体系与后台 admin.css 保持一致）
   靛蓝紫 · 浅色卡片 · 白底柔和阴影 · 三端自适应
   ========================================================================== */
:root{
  /* 与后台同源的靛蓝紫色板 */
  --bg:#f4f5f7;
  --bg-2:#ffffff;
  --panel:#ffffff;
  --panel-solid:#ffffff;
  --surface:#ffffff;
  --surface-2:#f7f8fb;
  --border:#e6e8ef;
  --card-border:#eceef4;
  --text:#1c1f27;
  --text-2:#5b6270;
  --muted:#9aa2ae;
  --accent:#6366f1;
  --accent-2:#8b5cf6;
  --primary-light:#eef2ff;
  --grad:linear-gradient(135deg,#6366f1,#8b5cf6);
  --hero-grad:linear-gradient(120deg,#4338ca 0%,#6366f1 38%,#8b5cf6 68%,#d946ef 100%);
  --glow-1:rgba(99,102,241,.10);
  --glow-2:rgba(139,92,246,.08);
  --ok:#22c55e;
  --ok-fg:#15803d;--ok-bg:#ecfdf3;--ok-border:#c7f0d8;
  --warn:#f59e0b;
  --danger:#f43f5e;
  --radius:14px;
  --radius-sm:9px;
  --shadow:0 8px 24px rgba(28,31,39,.10);
  --shadow-sm:0 1px 3px rgba(28,31,39,.06);
  --shadow-lg:0 18px 44px rgba(28,31,39,.14);
  --blur:blur(14px);
  --maxw:96%;
  --top:56px;
  --side:208px;
  --srail:216px;
  --rail:380px;
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Segoe UI",sans-serif;
}
/* 主题：极光蓝 */
html[data-theme="ocean"]{
  --bg:#f3f7fb;--accent:#0ea5e9;--accent-2:#22d3ee;--primary-light:#e8f6ff;
  --grad:linear-gradient(135deg,#0ea5e9,#22d3ee);
  --hero-grad:linear-gradient(120deg,#0369a1 0%,#0ea5e9 38%,#22d3ee 68%,#67e8f9 100%);
  --glow-1:rgba(14,165,233,.12);--glow-2:rgba(34,211,238,.10);
}
/* 主题：玫瑰红 */
html[data-theme="rose"]{
  --bg:#fdf5f6;--accent:#f43f5e;--accent-2:#fb7185;--primary-light:#ffeef2;
  --grad:linear-gradient(135deg,#f43f5e,#fb7185);
  --hero-grad:linear-gradient(120deg,#9f1239 0%,#f43f5e 38%,#fb7185 68%,#fda4af 100%);
  --glow-1:rgba(244,63,94,.12);--glow-2:rgba(251,113,133,.10);
}
/* 主题：森野绿 */
html[data-theme="emerald"]{
  --bg:#f2faf6;--accent:#10b981;--accent-2:#34d399;--primary-light:#e7faf2;
  --grad:linear-gradient(135deg,#10b981,#34d399);
  --hero-grad:linear-gradient(120deg,#065f46 0%,#10b981 38%,#34d399 68%,#6ee7b7 100%);
  --glow-1:rgba(16,185,129,.12);--glow-2:rgba(52,211,153,.10);
}
/* 主题：落日橙 */
html[data-theme="amber"]{
  --bg:#fdf8f1;--accent:#f59e0b;--accent-2:#fb923c;--primary-light:#fff4e3;
  --grad:linear-gradient(135deg,#f59e0b,#fb923c);
  --hero-grad:linear-gradient(120deg,#92400e 0%,#f59e0b 38%,#fb923c 68%,#fcd34d 100%);
  --glow-1:rgba(245,158,11,.14);--glow-2:rgba(251,146,60,.10);
}
/* 主题：暗夜黑（夜间模式） */
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0f1117;--bg-2:#151821;--panel:#151821;--panel-solid:#151821;
  --surface:#191d27;--surface-2:#1f2430;
  --border:#2a2f3b;--card-border:#262b37;
  --text:#e7e9ef;--text-2:#aab2c0;--muted:#737c8c;
  --ok-fg:#4ade80;--ok-bg:rgba(34,197,94,.14);--ok-border:rgba(34,197,94,.28);
  --primary-light:rgba(99,102,241,.16);
  --shadow:0 8px 24px rgba(0,0,0,.45);
  --shadow-sm:0 1px 3px rgba(0,0,0,.38);
  --shadow-lg:0 18px 44px rgba(0,0,0,.55);
  --glow-1:rgba(99,102,241,.16);--glow-2:rgba(139,92,246,.12);
  --hcard-bg:rgba(25,29,39,.94);--hcard-bg-hover:rgba(31,36,48,.98);
  --hcard-border:rgba(255,255,255,.12);
  --hcard-text:#e7e9ef;--hcard-sub:rgba(255,255,255,.62);
}
html[data-theme="dark"] .topbar{background:rgba(15,17,23,.88)}
html[data-theme="dark"] .topbar.scrolled{background:rgba(15,17,23,.96)}
html[data-theme="dark"] .tsearch{background:rgba(255,255,255,.06)}
html[data-theme="dark"] .tsearch input{color:var(--text)}
html[data-theme="dark"] .tsearch input::placeholder{color:var(--muted)}
html[data-theme="dark"] .tsearch:focus-within{background:rgba(255,255,255,.10)}
html[data-theme="dark"] .cat-item em,
html[data-theme="dark"] .cat-sub a em,
html[data-theme="dark"] .tagbar .tg em,
html[data-theme="dark"] .fgroup .sec-head em,
html[data-theme="dark"] .qs em{background:rgba(255,255,255,.08);color:var(--text-2);border-color:transparent}
html[data-theme="dark"] .cat-item:hover i{background:rgba(255,255,255,.10);border-color:var(--border)}
html[data-theme="dark"] .side-card{background:linear-gradient(150deg,rgba(124,109,255,.20),rgba(139,92,246,.10));border-color:rgba(139,124,255,.26);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
html[data-theme="dark"] .side-card b{color:var(--text)}
html[data-theme="dark"] .side-card:hover{background:linear-gradient(150deg,rgba(124,109,255,.30),rgba(139,92,246,.16));border-color:rgba(167,150,255,.5)}
html[data-theme="dark"] .dock{background:rgba(25,29,39,.94);border-color:var(--border)}
html[data-theme="dark"] .dock a,html[data-theme="dark"] .dock button{background:rgba(255,255,255,.07)}
html[data-theme="dark"] .hero-sinput{background:rgba(20,23,32,.72);border-color:rgba(255,255,255,.16)}
html[data-theme="dark"] .hero-sinput input{color:#fff}
html[data-theme="dark"] .hero-sinput input::placeholder{color:rgba(255,255,255,.6)}
html[data-theme="dark"] .hero-search .engines button{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.24);color:rgba(255,255,255,.86)}
html[data-theme="dark"] .hero-search .engines button.on{background:#fff;color:var(--accent)}
html[data-theme="dark"] .hcard{background:var(--hcard-bg);color:var(--hcard-text);border-color:var(--hcard-border)}
html[data-theme="dark"] .hcard:hover{background:var(--hcard-bg-hover)}
html[data-theme="dark"] .hcard b{color:var(--hcard-text)}
html[data-theme="dark"] .hcard em{color:var(--hcard-sub)}
html[data-theme="dark"] .hico{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.10)}
html[data-theme="dark"] .badge{background:rgba(255,255,255,.08);color:var(--text-2);border-color:var(--border)}
html[data-theme="dark"] .badge.vip{background:rgba(245,158,11,.16);color:#fbbf24;border-color:rgba(245,158,11,.30)}
html[data-theme="dark"] .badge.hot{background:rgba(244,63,94,.16);color:#fb7185;border-color:rgba(244,63,94,.30)}
html[data-theme="dark"] .site-tip-pop{background:rgba(20,23,32,.96);color:#e7e9ef;border-color:rgba(255,255,255,.10)}
html[data-theme="dark"] .md code{background:rgba(255,255,255,.09)}
html[data-theme="dark"] .md pre{background:#0b0d13}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;color:var(--text);background:var(--bg);font:14px/1.75 var(--font);
  overflow-x:clip;
  background-image:
    radial-gradient(900px 520px at 12% -10%,rgba(99,102,241,.10),transparent 60%),
    radial-gradient(760px 460px at 92% 0%,rgba(139,92,246,.08),transparent 62%);
  background-attachment:fixed;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:rgba(99,102,241,.22)}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:rgba(28,31,39,.16);border-radius:9px}
::-webkit-scrollbar-thumb:hover{background:rgba(28,31,39,.28)}
/* 页面主滚动条隐藏（手机 / 电脑统一），滚动功能不受影响 */
html{scrollbar-width:none;-ms-overflow-style:none}
html::-webkit-scrollbar,body::-webkit-scrollbar{width:0;height:0;display:none}

/* 阅读进度条 */
.prog{position:fixed;top:0;left:0;right:0;height:3px;z-index:120;background:transparent}
.prog i{display:block;height:100%;width:0;background:var(--grad);transition:width .1s linear}

/* 顶栏（白底 sticky，与后台 admin-header 同风格） */
.topbar{
  position:sticky;top:0;z-index:100;height:var(--top);display:flex;align-items:center;gap:14px;
  padding:0 18px;background:rgba(255,255,255,.88);backdrop-filter:var(--blur);
  border-bottom:1px solid var(--border);
}
.topbar.scrolled{background:var(--surface);box-shadow:var(--shadow-sm)}
.tnav{display:flex;align-items:center;gap:4px;flex:1;min-width:0;overflow:hidden}
.tnav:hover{overflow:visible}
.tnav a{padding:6px 12px;border-radius:9px;color:var(--text-2);font-size:13.5px;white-space:nowrap;font-weight:500;transition:all .2s ease}
.tnav a:hover{color:var(--accent);background:var(--primary-light)}
.tnav a.on{color:#fff;background:var(--grad);box-shadow:0 6px 16px rgba(99,102,241,.26)}
/* 顶部菜单：图标 / 角标 / 二级下拉 */
.tnav-item{position:relative;display:flex;align-items:center;flex:none}
.tnav-item>a,.tnav>a{display:inline-flex;align-items:center;gap:5px}
.tnav .tni{display:inline-flex;align-items:center;justify-content:center;font-size:13px;line-height:1;font-style:normal}
.tnav .tni img{width:15px;height:15px;border-radius:4px;object-fit:cover;display:block}
.tnav .tnb{font-style:normal;font-size:9.5px;font-weight:700;line-height:1;padding:2px 5px;border-radius:5px;
  background:var(--primary-light);color:var(--accent)}
.tnav a.on .tnb{background:rgba(255,255,255,.22);color:#fff}
.tnav .tnd{font-size:10px;opacity:.7;transition:transform .2s ease}
.tnav-item:hover .tnd{transform:rotate(180deg)}
.tnav-sub{position:absolute;top:calc(100% + 8px);left:0;z-index:80;min-width:190px;
  display:flex;flex-direction:column;gap:2px;padding:6px;background:var(--panel-solid);
  border:1px solid var(--border);border-radius:12px;box-shadow:0 18px 40px -18px rgba(20,24,40,.35);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s ease,transform .18s ease,visibility .18s}
.tnav-item:hover .tnav-sub{opacity:1;visibility:visible;transform:translateY(0)}
.tnav-sub a{display:flex;align-items:center;gap:7px;padding:8px 10px;border-radius:8px;font-size:12.5px;color:var(--text-2)}
.tnav-sub a:hover{background:var(--primary-light);color:var(--accent)}
.tnav-sub a.on{color:#fff;background:var(--grad);box-shadow:none}
.tsearch{
  display:flex;align-items:center;gap:8px;flex:0 1 320px;height:36px;padding:0 6px 0 14px;
  border-radius:999px;background:var(--bg);border:1px solid var(--border);transition:all .2s ease;
}
.tsearch:focus-within{background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,.12)}
.tsearch input{flex:1;min-width:0;border:0;background:transparent;outline:none;font-size:13.5px}
.tsearch button{width:28px;height:28px;border:0;border-radius:50%;background:var(--grad);cursor:pointer;color:#fff;display:grid;place-items:center}
.tacts{display:flex;align-items:center;gap:8px;flex:none}
.tbtn{
  height:34px;padding:0 14px;border-radius:9px;border:1px solid var(--border);
  background:var(--surface);color:var(--text-2);cursor:pointer;font-size:13px;font-weight:500;
  display:inline-flex;align-items:center;gap:6px;transition:all .2s ease;
}
.tbtn:hover{border-color:var(--accent);color:var(--accent)}
.tbtn.primary{background:var(--grad);border:0;color:#fff;box-shadow:0 6px 16px rgba(99,102,241,.26)}
.burger{display:grid;place-items:center;width:36px;height:36px;border-radius:9px;border:1px solid var(--border);background:var(--surface);cursor:pointer;color:var(--text-2);flex:none;transition:all .2s ease}
.burger:hover{border-color:var(--accent);color:var(--accent);background:var(--primary-light)}

/* 顶栏下品牌紫带（对齐截图） */
.topband{height:24px;background:var(--grad);box-shadow:0 4px 14px rgba(99,102,241,.22)}

/* 布局：桌面端左侧栏常驻、整屏高度；移动端收为抽屉 */
.app{
  max-width:var(--maxw);margin:0 auto;padding:18px;
  display:grid;grid-template-columns:minmax(0,1fr) var(--rail);gap:18px;align-items:start;
}

/* 左侧站点分类：浅色玻璃质感导航，与右侧内容同色系衔接，桌面端固定在最左侧铺满整屏高度 */
.side{
  display:none;flex-direction:column;gap:4px;
  padding:16px 12px 14px;color:var(--text-2);
  background:
    radial-gradient(130% 40% at 0% 0%,var(--glow-1),transparent 62%),
    radial-gradient(120% 40% at 100% 100%,var(--glow-2),transparent 60%),
    linear-gradient(180deg,var(--surface) 0%,var(--bg) 100%);
  border-right:1px solid var(--border);
  overflow-y:auto;overscroll-behavior:contain;
  /* 左侧分类栏（含手机抽屉）隐藏滚动条，滑动/滚轮照常可用 */
  scrollbar-width:none;-ms-overflow-style:none;
}
.side::-webkit-scrollbar{display:none;width:0;height:0}
.slogo{position:relative;display:flex;align-items:center;gap:11px;padding:6px 8px 15px;margin-bottom:9px;border:0;min-width:0}
.slogo::after{content:"";position:absolute;left:8px;right:8px;bottom:0;height:1px;background:linear-gradient(90deg,rgba(28,31,39,.10),rgba(28,31,39,0))}
.slogo i{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-style:normal;font-size:18px;flex:none;
  background:linear-gradient(135deg,#6d6ff5,#a06bff);color:#fff;
  box-shadow:0 8px 20px -10px rgba(124,109,255,.8),inset 0 1px 0 rgba(255,255,255,.32)}
.slogo em{font-style:normal;font-size:14.5px;font-weight:800;color:var(--text);letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.snav-label{font-size:10px;font-weight:800;letter-spacing:.16em;color:var(--muted);padding:6px 10px 5px}
.snav{display:flex;flex-direction:column;gap:3px}
.cat-row{position:relative;display:flex;align-items:center}
.cat-item{
  position:relative;display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:11px;
  color:var(--text-2);min-width:0;flex:1;
  transition:background .18s,color .18s,transform .18s;
}
.cat-row .cat-item{padding-right:30px}
.cat-item:hover{background:rgba(99,102,241,.08);color:var(--accent);transform:translateX(2px)}
.cat-item:hover i{background:var(--surface);border-color:#e3e4f5}
.cat-item.on{background:var(--grad);color:#fff;
  box-shadow:0 10px 24px -12px rgba(99,102,241,.85),inset 0 1px 0 rgba(255,255,255,.2)}
.cat-item.on::before{content:"";position:absolute;left:-6px;top:50%;width:3px;height:18px;border-radius:3px;
  background:#a5b4fc;box-shadow:0 0 10px rgba(129,140,248,.75);transform:translateY(-50%)}
.cat-item i{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-style:normal;font-size:15px;flex:none;
  background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.cat-item.on i{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.24);box-shadow:none}
.cat-item b{font-weight:500;font-size:13px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cat-item em{display:inline-flex;align-items:center;justify-content:center;min-width:24px;margin-left:6px;padding:1px 7px;
  border-radius:999px;font-style:normal;font-size:10.5px;line-height:1.6;
  color:var(--muted);background:#eef0f7}
.cat-item.on em{color:#fff;background:rgba(255,255,255,.22)}
/* 分类展开按钮 + 二级子菜单 */
.cat-exp{
  position:absolute;right:4px;top:50%;transform:translateY(-50%);width:22px;height:22px;padding:0;
  display:grid;place-items:center;border:0;border-radius:7px;background:transparent;
  color:var(--muted);font-size:11px;cursor:pointer;transition:all .18s ease;
}
.cat-exp i{transition:transform .22s ease}
.cat-exp:hover{background:rgba(99,102,241,.12);color:var(--accent)}
.cat-row.open .cat-exp{color:var(--accent)}
.cat-row.open .cat-exp i{transform:rotate(180deg)}
.cat-item.on+.cat-exp{color:rgba(255,255,255,.8)}
.cat-sub{display:none;flex-direction:column;gap:1px;margin:2px 0 5px 15px;padding:2px 0 2px 10px;
  border-left:1px solid rgba(99,102,241,.18)}
.cat-sub.open{display:flex}
.cat-sub a{display:flex;align-items:center;gap:8px;min-width:0;padding:5px 8px;border-radius:8px;
  font-size:12.5px;color:var(--text-2);transition:all .16s ease}
.cat-sub a:hover{background:rgba(99,102,241,.08);color:var(--accent)}
.cat-sub a.on{color:var(--accent);background:var(--primary-light);font-weight:600}
.cat-sub a b{font-weight:inherit;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cat-sub a em{font-style:normal;font-size:10.5px;color:var(--muted);background:#eef0f7;border-radius:999px;padding:0 6px;line-height:1.7}
.side-card{margin-top:auto;margin-bottom:2px;padding:14px 12px;border-radius:14px;text-align:center;
  background:linear-gradient(150deg,#eef2ff,#f6f1ff);
  border:1px solid #e4e1fb;box-shadow:inset 0 1px 0 #fff;
  transition:all .2s ease}
.side-card:hover{transform:translateY(-1px);border-color:#c7bffa;
  background:linear-gradient(150deg,#e8edff,#f1eaff)}
.side-card i{display:block;font-size:19px;color:var(--accent)}
.side-card b{display:block;font-size:12.5px;font-weight:700;color:var(--text);margin-top:3px}
.side-card em{font-style:normal;font-size:10.5px;color:var(--muted)}

/* 矮屏（如 1366×768）自动紧凑，保证分类与赞助墙同屏 */
@media(max-height:860px){
  .side{padding:12px 10px 10px}
  .slogo{padding-bottom:11px;margin-bottom:7px}
  .snav{gap:2px}
  .cat-item{padding:7px 9px}
  .cat-item i{width:27px;height:27px;font-size:14px}
  .side-card{padding:11px 10px}
}

/* 桌面端：左侧栏常驻，从屏幕最顶端铺到最底部，顶栏/内容整体让出左侧宽度 */
@media(min-width:1024px){
  body{padding-left:var(--srail)}
  body.rail-off{padding-left:0}
  .side{
    display:flex;position:fixed;left:0;top:0;bottom:0;width:var(--srail);z-index:130;
    border-radius:0;box-shadow:10px 0 28px -26px rgba(28,31,39,.35);
  }
  body.rail-off .side{display:none}
}

.main{min-width:0;display:flex;flex-direction:column;gap:18px}
.rail{
  align-self:start;
  position:sticky;top:calc(var(--top) + 18px);
  max-height:calc(100vh - var(--top) - 36px);
  overflow:hidden;
}
/* 右侧栏内容独立滚动，收缩按钮留在 .rail 上不随内容滚动 */
.rail-scroll{display:flex;flex-direction:column;gap:14px;max-height:inherit;
  overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-color:#c9cde0 transparent}
.rail-scroll::-webkit-scrollbar{width:6px}
.rail-scroll::-webkit-scrollbar-thumb{background:#c9cde0;border-radius:3px}
.rail-scroll::-webkit-scrollbar-track{background:transparent}
.rail-scroll>*{flex:none}
/* 抽屉专用元素：标题栏与遮罩只在窄屏抽屉模式下出现，电脑/平板端不渲染 */
.rail-hd,.rail-mask{display:none}
/* 手机端右侧栏的收起按钮（贴在抽屉左边框中线），桌面/平板不渲染 */
.rail-collapse{display:none}


/* 右侧栏顶部图片卡（头图 + 头像） */
.panel.rail-hero{padding:0;overflow:hidden}
.rh-cover{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--bg)}
.rh-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s cubic-bezier(.22,.61,.36,1)}
.rail-hero:hover .rh-cover img{transform:scale(1.05)}
.rh-body{position:relative;padding:0 14px 15px;text-align:center}
.rh-avatar{
  display:block;width:64px;height:64px;margin:-32px auto 10px;border-radius:50%;
  padding:3px;background:var(--panel);box-shadow:0 10px 24px rgba(99,102,241,.28);
}
.rh-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.rh-body b{display:block;font-size:15px;font-weight:700;letter-spacing:-.2px}
.rh-body em{display:block;font-style:normal;font-size:11.5px;color:var(--muted);margin-top:5px;line-height:1.55}

/* 右侧栏图片卡片 */
.rail-pics{display:flex;flex-direction:column;gap:10px}
.rail-pic{position:relative;display:block;border-radius:12px;overflow:hidden;border:1px solid var(--card-border);aspect-ratio:4/3;background:var(--bg)}
.rail-pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s cubic-bezier(.22,.61,.36,1)}
.rail-pic:hover img{transform:scale(1.06)}
.rail-pic::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,20,32,0) 38%,rgba(17,20,32,.76));pointer-events:none}
.rail-pic .rp-b{position:absolute;left:12px;right:12px;bottom:10px;z-index:1;color:#fff;min-width:0}
.rail-pic .rp-b b{display:block;font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rail-pic .rp-b em{display:block;font-style:normal;font-size:11px;opacity:.85;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 站点数据 · 8 宫格 */
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.st{display:flex;align-items:center;gap:8px;padding:8px 9px;border-radius:10px;background:var(--bg);border:1px solid var(--card-border);min-width:0;transition:border-color .2s,transform .2s}
.st:hover{border-color:rgba(99,102,241,.35);transform:translateY(-1px)}
.st-ic{width:27px;height:27px;border-radius:8px;flex:none;display:grid;place-items:center;font-size:12.5px;color:#fff}
.st-ic.i1{background:linear-gradient(135deg,#6366f1,#8b5cf6)}
.st-ic.i2{background:linear-gradient(135deg,#0ea5e9,#38bdf8)}
.st-ic.i3{background:linear-gradient(135deg,#f59e0b,#fbbf24)}
.st-ic.i4{background:linear-gradient(135deg,#22c55e,#4ade80)}
.st-ic.i5{background:linear-gradient(135deg,#ec4899,#f472b6)}
.st-ic.i6{background:linear-gradient(135deg,#14b8a6,#2dd4bf)}
.st-ic.i7{background:linear-gradient(135deg,#a855f7,#c084fc)}
.st-ic.i8{background:linear-gradient(135deg,#f43f5e,#fb7185)}
.st-tx{min-width:0}
.st-tx b{display:block;font-size:15px;font-weight:800;line-height:1.15;letter-spacing:-.3px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-tx em{display:block;font-style:normal;font-size:10px;color:var(--muted);margin-top:2px;white-space:nowrap}
.stat-foot{margin-top:10px;padding-top:9px;border-top:1px dashed var(--card-border);display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10.5px;color:var(--muted)}
.stat-foot b{color:var(--accent);font-weight:700}
.stat-foot i{font-size:10px}

.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow-sm)}
.panel h3{margin:0 0 12px;font-size:14px;display:flex;align-items:center;gap:8px;font-weight:700;letter-spacing:-.2px}
.panel h3 span{font-size:11px;color:var(--muted);font-weight:400}

/* Hero（白卡 + 淡靛蓝渐变） */
.hero{
  position:relative;overflow:hidden;border-radius:20px;padding:38px 34px;
  border:1px solid var(--card-border);
  background:linear-gradient(135deg,#eef2ff 0%,#f5f3ff 52%,#ffffff 100%);
  box-shadow:var(--shadow-sm);
}
.hero::after{
  content:"";position:absolute;right:-120px;top:-120px;width:360px;height:360px;border-radius:50%;
  background:radial-gradient(circle,rgba(139,92,246,.16),transparent 65%);filter:blur(6px);
}
.hero h1{margin:0 0 10px;font-size:clamp(24px,3.4vw,38px);line-height:1.25;letter-spacing:-.4px;font-weight:800}
.hero p{margin:0 0 20px;color:var(--text-2);font-size:14.5px;max-width:640px}
.searchbox{display:flex;flex-direction:column;gap:10px;max-width:720px;position:relative;z-index:2}
.engines{display:flex;gap:6px;flex-wrap:wrap}
.engines button{
  height:28px;padding:0 12px;border-radius:999px;border:1px solid var(--border);
  background:var(--surface);color:var(--text-2);font-size:12.5px;cursor:pointer;transition:all .2s ease;
}
.engines button:hover{border-color:var(--accent);color:var(--accent)}
.engines button.on{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 4px 12px rgba(99,102,241,.24)}
.sinput{display:flex;align-items:center;gap:10px;height:48px;padding:0 8px 0 18px;border-radius:999px;
  background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-sm);transition:all .2s ease}
.sinput:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,.12)}
.sinput input{flex:1;min-width:0;border:0;background:transparent;outline:none;font-size:15px}
.sinput .go{height:36px;padding:0 22px;border:0;border-radius:999px;background:var(--grad);color:#fff;cursor:pointer;font-weight:600;box-shadow:0 6px 16px rgba(99,102,241,.26)}
.sinput .go:active{transform:scale(.97)}
/* 搜索框一键清空 */
.sinput .clear{flex:none;display:none;place-items:center;width:26px;height:26px;padding:0;border:0;border-radius:50%;
  background:transparent;color:#98a0ad;font-size:11px;line-height:1;cursor:pointer;transition:all .16s ease}
.sinput .clear.show{display:grid}
.sinput .clear:hover{background:rgba(28,31,39,.09);color:#1c1f27}
.suggest{
  position:absolute;left:0;right:0;top:calc(100% + 6px);background:var(--panel-solid);border:1px solid var(--border);
  border-radius:12px;box-shadow:var(--shadow);overflow:hidden;display:none;z-index:30;color:var(--text);
}
.suggest.on{display:block}
.suggest a{display:flex;align-items:center;gap:10px;padding:9px 14px;font-size:13.5px;color:var(--text)}
.suggest a:hover,.suggest a.on{background:var(--primary-light);color:var(--accent)}
.suggest a i{font-style:normal;opacity:.85}
.suggest .empty{padding:10px 14px;color:var(--text-2);font-size:12.5px}

/* 公告滚动条 */
.noticebar{display:flex;align-items:center;gap:10px;margin-top:16px;padding:8px 12px;border-radius:999px;
  background:var(--surface);border:1px solid var(--border);max-width:720px;font-size:12.5px;color:var(--text-2)}
.noticebar i{font-style:normal;flex:none;color:var(--accent)}
.noticebar .track{flex:1;min-width:0;overflow:hidden;white-space:nowrap;position:relative}
.noticebar .track span{display:inline-block;padding-left:0;animation:marquee 26s linear infinite}
.noticebar .track:hover span{animation-play-state:paused}
.noticebar button{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:14px}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* 分类快捷入口 */
.quick{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 8px;scrollbar-width:none}
.quick::-webkit-scrollbar{display:none}
.quick .q{
  flex:none;width:92px;padding:12px 8px;border-radius:var(--radius);text-align:center;background:var(--panel);
  border:1px solid var(--border);box-shadow:var(--shadow-sm);transition:transform .18s,border-color .18s,box-shadow .18s;
}
.quick .q:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:var(--shadow)}
.quick .q i{display:grid;place-items:center;width:40px;height:40px;margin:0 auto 8px;border-radius:12px;font-style:normal;font-size:19px;background:var(--bg)}
.quick .q b{display:block;font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quick .q em{font-style:normal;font-size:11px;color:var(--muted)}

/* 区块标题 */
.sec-head{display:flex;align-items:center;gap:10px;margin:2px 0 -4px}
.sec-head h2{margin:0;font-size:16px;letter-spacing:-.2px;font-weight:800}
.sec-head em{font-style:normal;font-size:12px;color:var(--muted)}
.sec-head .more{margin-left:auto;font-size:12.5px;color:var(--muted);display:inline-flex;align-items:center;gap:4px}
.sec-head .more:hover{color:var(--accent)}

/* 精选大卡 */
.feat{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.fcard{
  position:relative;overflow:hidden;border-radius:var(--radius);min-height:190px;padding:16px;display:flex;flex-direction:column;justify-content:flex-end;
  border:1px solid var(--border);background:linear-gradient(150deg,#eef2ff,#f7f4ff 60%,#fff);
  box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s,border-color .2s;
}
.fcard:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#dfe2f5}
.fcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.30;transition:opacity .3s}
.fcard:hover img{opacity:.42}
.fcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.78))}
.fcard .fbody{position:relative;z-index:2}
.fcard h4{margin:0 0 4px;font-size:15px;font-weight:700}
.fcard p{margin:0;font-size:12px;color:var(--text-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.badge{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;font-size:11px;font-weight:600}
.badge.free{background:var(--ok-bg);color:var(--ok-fg);border:1px solid var(--ok-border)}
.badge.vip{background:#fffbeb;color:#b45309;border:1px solid #fde4b3}
.badge.hot{background:#fef2f4;color:#be123c;border:1px solid #fbd0da}

/* 站点卡片（对齐截图：左图标 + 名称/描述 + 右侧圆形箭头） */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.card{
  display:flex;align-items:center;gap:10px;padding:10px 12px;min-height:64px;
  border-radius:12px;background:var(--surface);border:1px solid var(--card-border);
  box-shadow:0 1px 2px rgba(28,31,39,.05);
  transition:transform .18s,border-color .18s,box-shadow .18s;
}
.card:hover{transform:translateY(-2px);border-color:#d9ddf5;box-shadow:0 10px 24px rgba(28,31,39,.09)}
.card .ico{
  width:36px;height:36px;border-radius:10px;flex:none;display:grid;place-items:center;font-size:17px;
  background:var(--bg);overflow:hidden;border:1px solid var(--card-border);
}
.card .ico img{width:100%;height:100%;object-fit:cover;border-radius:9px}
.card .cbody{flex:1;min-width:0;display:block}
.card .name{display:flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;line-height:1.35;min-width:0}
.card .name>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card .badge{flex:none;height:16px;padding:0 5px;font-size:10px}
.card .desc{display:block;margin-top:3px;font-size:11px;color:var(--muted);line-height:1.4;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card .go{
  width:24px;height:24px;border-radius:50%;flex:none;display:grid;place-items:center;
  border:1px solid var(--border);color:#bcc2d0;font-size:11px;transition:all .2s ease;
}
.card:hover .go{background:var(--accent);border-color:transparent;color:#fff}

/* 文章 */
.art-list{display:flex;flex-direction:column;gap:10px}
.art-item{display:flex;gap:14px;padding:13px 14px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-sm);transition:border-color .18s,transform .18s,box-shadow .18s}
.art-item:hover{border-color:#c7ccf5;transform:translateX(3px);box-shadow:var(--shadow)}
.art-item .thumb{width:96px;height:64px;border-radius:10px;flex:none;overflow:hidden;background:var(--bg)}
.art-item .thumb img{width:100%;height:100%;object-fit:cover}
.art-item .txt{min-width:0;flex:1}
.art-item h4{margin:0 0 4px;font-size:14px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;font-weight:700}
.art-item p{margin:0;font-size:12px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.art-item .m{margin-top:6px;font-size:11px;color:var(--muted);display:flex;gap:10px;flex-wrap:wrap}
.art-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.arcard{border-radius:var(--radius);overflow:hidden;background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-sm);transition:transform .18s,border-color .18s,box-shadow .18s;display:flex;flex-direction:column}
.arcard:hover{transform:translateY(-4px);border-color:#c7ccf5;box-shadow:var(--shadow)}
.arcard .cover{position:relative;aspect-ratio:16/9;background:var(--bg);overflow:hidden}
.arcard .cover img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.arcard:hover .cover img{transform:scale(1.04)}
/* 封面角标：置顶在左上、浏览量在右上（不随 hover 缩放） */
.arcard .cover em{position:absolute;top:7px;z-index:2;display:inline-flex;align-items:center;
  height:20px;padding:0 7px;border-radius:6px;font-style:normal;font-size:11px;
  font-weight:700;line-height:1;white-space:nowrap;pointer-events:none}
.arcard .a-top{left:7px;color:#be123c;background:rgba(255,255,255,.94);
  border:1px solid #fbd0da;box-shadow:0 2px 8px rgba(190,18,60,.18)}
.arcard .a-views{right:7px;gap:4px;color:#fff;background:rgba(17,24,39,.55);
  border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.arcard .a-views i{font-size:11px;opacity:.9}
.arcard .body{padding:12px 14px 14px}
.arcard h4{margin:0 0 6px;font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:700}
.arcard p{margin:0;font-size:12px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.arcard .m{display:flex;gap:10px;margin-top:10px;font-size:11px;color:var(--muted)}

/* 筛选栏 */
.filter{display:flex;gap:8px;overflow-x:auto;padding:2px 0 6px}
.filter::-webkit-scrollbar{display:none}
.filter a{
  flex:none;height:32px;padding:0 14px;border-radius:999px;border:1px solid var(--border);
  background:var(--surface);color:var(--text-2);font-size:12.5px;display:inline-flex;align-items:center;cursor:pointer;transition:all .2s ease;
}
.filter a:hover{border-color:var(--accent);color:var(--accent)}
.filter a.on{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 4px 12px rgba(99,102,241,.22)}

/* 分页 */
.pager{display:flex;gap:8px;justify-content:center;align-items:center;padding:8px 0 4px;flex-wrap:wrap}
.pager a,.pager span{
  min-width:34px;height:34px;padding:0 12px;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--border);background:var(--surface);font-size:12.5px;color:var(--text-2);font-weight:600;transition:all .2s ease;
}
.pager a:hover{border-color:var(--accent);color:var(--accent)}
.pager .cur{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 4px 12px rgba(99,102,241,.24)}
.pager .dis{opacity:.4;pointer-events:none}

.btn{
  height:38px;padding:0 20px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);
  color:var(--text-2);display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;font-weight:600;transition:all .2s ease;
}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn.primary{background:var(--grad);border:0;color:#fff;box-shadow:0 6px 16px rgba(99,102,241,.26)}
.btn:active{transform:scale(.97)}
.kv{display:flex;gap:22px;flex-wrap:wrap;margin-top:16px;font-size:12.5px;color:var(--muted)}
.kv b{color:var(--text);font-weight:700}

/* 文章正文 */
.article{max-width:840px;margin:0 auto}
.article .head{margin-bottom:18px}
.article h1{margin:8px 0 10px;font-size:clamp(22px,3.4vw,34px);line-height:1.35;font-weight:800;letter-spacing:-.4px}
.article .am{display:flex;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:12.5px;align-items:center}
.article .cover{width:100%;aspect-ratio:16/8;object-fit:cover;border-radius:var(--radius);margin:18px 0;border:1px solid var(--border)}
.md{font-size:15.5px;line-height:1.9;color:var(--text)}
.md-h{margin:30px 0 12px;line-height:1.4;scroll-margin-top:72px;font-weight:800;letter-spacing:-.2px}
.md-h1{font-size:1.6em}.md-h2{font-size:1.38em}.md-h3{font-size:1.2em}.md-h4{font-size:1.08em}
.md-p{margin:12px 0}
.md-list{margin:12px 0 12px 1.4em;padding:0}
.md-list li{margin:6px 0}
.md-quote{margin:16px 0;padding:12px 16px;border-left:3px solid var(--accent);
  background:var(--primary-light);border-radius:0 10px 10px 0;color:var(--text-2)}
.md-pre{margin:16px 0;padding:14px 16px;border-radius:12px;background:#1f2330;border:1px solid #2b3142;overflow:auto}
.md-pre code{font-family:ui-monospace,Consolas,monospace;font-size:13px;color:#d8e6ff}
.md code{padding:2px 6px;border-radius:6px;background:var(--bg);border:1px solid var(--card-border);font-family:ui-monospace,Consolas,monospace;font-size:.88em}
.md-table{overflow:auto;margin:16px 0}
.md-table table{width:100%;border-collapse:collapse;font-size:13.5px}
.md-table th,.md-table td{border:1px solid var(--border);padding:8px 12px;text-align:left}
.md-table th{background:var(--bg);font-weight:700}
.md img{border-radius:12px;margin:8px 0}
.md a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.md hr{border:0;border-top:1px solid var(--border);margin:22px 0}
.md-task{margin-right:4px}
.toc{position:sticky;top:calc(var(--top) + 18px);font-size:12.5px}
.toc a{display:block;padding:5px 0;color:var(--muted);border-left:2px solid transparent;padding-left:10px}
.toc a:hover{color:var(--text-2)}
.toc a.lv3{padding-left:22px;font-size:12px}
.toc a.on{color:var(--accent);border-left-color:var(--accent);font-weight:600}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.tags span{padding:3px 10px;border-radius:999px;background:var(--bg);border:1px solid var(--card-border);font-size:12px;color:var(--text-2)}
.nx{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}
.nx a{padding:12px 14px;border-radius:12px;background:var(--panel);border:1px solid var(--border);font-size:13px;box-shadow:var(--shadow-sm)}
.nx a:hover{border-color:var(--accent);color:var(--accent)}
.nx a em{display:block;font-style:normal;font-size:11px;color:var(--muted);margin-bottom:4px}

/* 时间线 */
.timeline{position:relative;padding-left:20px}
.timeline::before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:var(--border)}
.tl{position:relative;margin-bottom:14px;padding:14px 16px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.tl::before{content:"";position:absolute;left:-19px;top:20px;width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,.16)}
.tl.warn::before{background:var(--warn);box-shadow:0 0 0 3px rgba(245,158,11,.18)}
.tl.danger::before{background:var(--danger);box-shadow:0 0 0 3px rgba(244,63,94,.18)}
.tl h4{margin:0 0 6px;font-size:14px;font-weight:700}
.tl p{margin:0;font-size:12.5px;color:var(--text-2)}
.tl time{display:block;margin-top:8px;font-size:11px;color:var(--muted)}

/* 赞助墙 */
.wall{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.sp{display:flex;align-items:center;gap:12px;padding:14px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.sp .av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:20px;background:var(--bg);border:1px solid var(--card-border);flex:none}
.sp b{display:block;font-size:13.5px;font-weight:700}
.sp em{font-style:normal;font-size:11.5px;color:#b45309;font-weight:600}
.rank{display:flex;flex-direction:column;gap:10px}
.rank .r{display:flex;align-items:center;gap:10px;font-size:12.5px}
.rank .r .no{width:20px;height:20px;border-radius:6px;display:grid;place-items:center;background:var(--bg);font-size:11px;flex:none;font-weight:700;color:var(--text-2)}
.rank .r:nth-child(1) .no{background:var(--grad);color:#fff}
.rank .r .bar{flex:1;height:6px;border-radius:6px;background:var(--bg);overflow:hidden}
.rank .r .bar i{display:block;height:100%;border-radius:6px;background:var(--grad)}
.rank .r b{font-size:12px;color:#b45309;font-weight:700}

/* 空状态 */
.empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:40px 16px;color:var(--muted);text-align:center}
.empty .em{font-size:40px;opacity:.85;color:#c9ced9}

/* Dock / 回到顶部 / 弹窗 */
/* 统一使用固定像素间距：不再叠加 env(safe-area-inset-bottom)，
   避免 iPhone（home 指示条 34px）等浏览器把 Dock 顶得离底部很远 */
.dock{
  position:fixed;left:50%;bottom:18px;transform:translateX(-50%);
  display:flex;gap:4px;padding:6px;border-radius:999px;background:rgba(255,255,255,.94);border:1px solid var(--border);
  backdrop-filter:var(--blur);box-shadow:var(--shadow);z-index:90;
}
.dock a,.dock button{
  width:42px;height:42px;border-radius:50%;border:0;background:var(--bg);color:var(--text-2);
  display:grid;place-items:center;cursor:pointer;font-size:17px;position:relative;transition:all .2s ease;
}
.dock a:hover,.dock button:hover{background:var(--grad);color:#fff}
.dock .tip{
  position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);white-space:nowrap;
  padding:4px 9px;border-radius:8px;background:rgba(24,27,34,.94);border:1px solid rgba(255,255,255,.12);
  font-size:11px;color:#fff;opacity:0;pointer-events:none;transition:opacity .15s;
}
.dock a:hover .tip,.dock button:hover .tip{opacity:1}
.backtop{
  position:fixed;right:20px;bottom:calc(78px + env(safe-area-inset-bottom));width:42px;height:42px;border-radius:50%;
  border:1px solid var(--border);background:var(--surface);color:var(--text-2);cursor:pointer;z-index:88;box-shadow:var(--shadow);
  opacity:0;transform:scale(.8);pointer-events:none;transition:.2s;display:grid;place-items:center;
}
.backtop:hover{color:var(--accent);border-color:var(--accent)}
.backtop.on{opacity:1;transform:none;pointer-events:auto}
/* 主题切换（右下角悬浮） */
.theme-dock{position:fixed;right:20px;bottom:22px;z-index:95}
.theme-btn{
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  border:1px solid var(--border);background:var(--surface);color:var(--accent);font-size:17px;
  box-shadow:var(--shadow);transition:all .2s ease;
}
.theme-btn:hover{color:#fff;background:var(--grad);border-color:transparent;transform:translateY(-2px)}
.theme-btn.on{color:#fff;background:var(--grad);border-color:transparent}
.theme-pop{
  position:absolute;right:0;bottom:calc(100% + 12px);width:214px;padding:12px;border-radius:16px;
  background:var(--surface);border:1px solid var(--card-border);box-shadow:var(--shadow-lg);
  opacity:0;transform:translateY(8px) scale(.97);pointer-events:none;transition:all .18s ease;
}
.theme-pop.on{opacity:1;transform:none;pointer-events:auto}
.theme-hd{display:flex;align-items:baseline;gap:6px;padding:1px 3px 9px;border-bottom:1px solid var(--border);margin-bottom:8px}
.theme-hd b{font-size:12.5px;font-weight:800}
.theme-hd em{font-style:normal;font-size:10.5px;color:var(--muted)}
.theme-list{display:flex;flex-direction:column;gap:2px}
.th{
  display:flex;align-items:center;gap:9px;width:100%;padding:7px 8px;border:0;border-radius:9px;
  background:transparent;cursor:pointer;font-size:12.5px;color:var(--text-2);transition:all .16s ease;
}
.th:hover{background:var(--primary-light);color:var(--text)}
.th-dot{width:18px;height:18px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 2px 6px rgba(28,31,39,.16)}
.th b{flex:1;text-align:left;font-weight:600}
.th i{opacity:0;color:var(--accent);font-size:13px}
.th.on{background:var(--primary-light);color:var(--text);font-weight:700}
.th.on i{opacity:1}
/* 自定义主题 */
.theme-pop{width:238px}
.theme-cs{margin-top:10px;padding-top:9px;border-top:1px solid var(--border)}
.theme-hd.sub{padding:0 3px 8px;margin-bottom:2px;border-bottom:0}
.cs-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:5px 3px;font-size:12.5px;color:var(--text-2);cursor:pointer}
.cs-row input[type="color"]{width:46px;height:25px;padding:0;border:1px solid var(--border);border-radius:7px;background:none;cursor:pointer}
.cs-row input[type="color"]::-webkit-color-swatch-wrapper{padding:2px}
.cs-row input[type="color"]::-webkit-color-swatch{border:0;border-radius:5px}
.cs-bg{display:inline-flex;align-items:center;gap:6px}
.cs-auto{height:25px;padding:0 8px;border:1px solid var(--border);border-radius:7px;background:none;
  color:var(--muted);font-size:11px;font-weight:600;cursor:pointer;transition:all .18s}
.cs-auto:hover{color:var(--accent);border-color:var(--accent)}
.cs-auto.on{color:var(--accent);border-color:var(--accent);background:var(--primary-light)}
.cs-switch{position:relative;display:inline-block;width:34px;height:19px;flex:none}
.cs-switch input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.cs-switch i{position:absolute;inset:0;border-radius:999px;background:#d7dbe6;transition:all .2s ease}
.cs-switch i::after{content:"";position:absolute;left:2px;top:2px;width:15px;height:15px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.22);transition:all .2s ease}
.cs-switch input:checked+i{background:var(--accent)}
.cs-switch input:checked+i::after{transform:translateX(15px)}
.cs-apply{width:100%;margin-top:8px;height:32px;border:0;border-radius:9px;background:var(--grad);color:#fff;font-size:12.5px;font-weight:700;cursor:pointer;transition:opacity .2s ease;box-shadow:0 8px 18px -10px rgba(28,31,39,.5)}
.cs-apply:hover{opacity:.9}
/* 顶栏主题图标（替代原右下角悬浮按钮） */
.theme-dock-top{position:relative;right:auto;bottom:auto;z-index:auto}
.theme-dock-top .theme-btn{width:34px;height:34px;font-size:15px;box-shadow:none}
.theme-dock-top .theme-pop{top:calc(100% + 12px);bottom:auto;right:-4px}
html[data-theme="dark"] .cs-switch i{background:rgba(255,255,255,.18)}
.modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:20px;
  background:rgba(17,20,32,.46);backdrop-filter:blur(6px)}
.modal.on{display:flex}
.modal .box{width:100%;max-width:340px;background:var(--surface);border:1px solid var(--card-border);border-radius:18px;padding:22px;text-align:center;position:relative;box-shadow:var(--shadow-lg)}
.modal .box h3{margin:0 0 12px;font-size:15px;font-weight:800}
.modal .box img{width:100%;border-radius:12px;background:#fff;padding:8px;border:1px solid var(--border)}
.modal .box p{color:var(--text-2);font-size:12.5px;margin:10px 0 0}
.modal .box>.close{position:absolute;right:10px;top:10px;width:30px;height:30px;border-radius:50%;border:1px solid var(--border);background:var(--surface);color:var(--text-2);cursor:pointer;display:grid;place-items:center}
.modal .box>.close:hover{color:var(--danger);border-color:var(--danger);background:#fef2f4}

/* Toast */
.toast{
  position:fixed;right:18px;top:68px;z-index:300;padding:10px 16px;border-radius:10px;font-size:13px;
  background:rgba(24,27,34,.94);border:1px solid rgba(255,255,255,.10);color:#fff;box-shadow:var(--shadow);
  opacity:0;transform:translateY(-8px);transition:.22s;pointer-events:none;
}
.toast.on{opacity:1;transform:none}

/* 页脚 */
.foot{max-width:var(--maxw);margin:0 auto;padding:20px 18px 90px;color:var(--muted);font-size:12px;text-align:center;line-height:2}
.foot a{color:var(--text-2)}
.foot a:hover{color:var(--accent)}

/* 入场动画（位移 + 轻微缩放，统一缓动） */
.rise{opacity:0;transform:translateY(22px) scale(.988);will-change:opacity,transform}
.rise.in{opacity:1;transform:none;transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}

/* 响应式补充类 */
.kx{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}
.kx>div{padding:10px 4px;border-radius:10px;background:var(--bg)}
.kn{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--text);letter-spacing:-.5px}
.kl{font-size:11.5px;color:var(--muted)}
.panel h3 .more{margin-left:auto;font-size:11.5px;color:var(--muted);font-weight:400}
.rail-list{display:flex;flex-direction:column;gap:9px}
.rail-list a{display:block;padding:6px 8px;border-radius:8px;transition:all .2s ease}
.rail-list a:hover{background:var(--primary-light)}
.rl-t{font-size:12.5px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.rl-m{font-size:11px;color:var(--muted);margin-top:2px}
.rank .rw{flex:1;min-width:0}
.rank .rt{display:flex;justify-content:space-between;gap:8px;margin-bottom:3px}
.rank .rt span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.panel.center{text-align:center}
.panel h3.center{justify-content:center}
.qr{width:150px;border-radius:10px;background:#fff;padding:6px;cursor:zoom-in;border:1px solid var(--border)}
.qr-tip{margin:8px 0 0;font-size:11.5px;color:var(--muted)}
.card .cbody{flex:1;min-width:0;display:block}
.card .meta .ml{margin-left:auto}
.cat-head{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.cat-ico{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:24px;background:var(--surface);border:1px solid var(--card-border);box-shadow:var(--shadow-sm)}
.ch-body{flex:1;min-width:200px}
.ch-body h1{margin:0;font-size:20px;font-weight:800;letter-spacing:-.3px}
.ch-body p{margin:4px 0 0;color:var(--muted);font-size:12.5px}
/* ===== 站点详情页（沉浸式主视觉 + 窗口预览 + 信息栏） ===== */
.page-site .main{gap:14px}
.sd-hero{
  position:relative;overflow:hidden;border-radius:20px;padding:18px 20px;
  border:1px solid var(--card-border);box-shadow:var(--shadow-sm);
  display:flex;gap:20px;align-items:stretch;
  background:
    radial-gradient(120% 150% at 100% 0%,var(--primary-light),transparent 55%),
    linear-gradient(135deg,var(--primary-light),var(--panel) 52%,var(--panel));
}
.sd-hero::before{
  content:'';position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2) 42%,transparent 78%);
  opacity:.75;
}
.sd-hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;opacity:.45;
  background-image:linear-gradient(var(--card-border) 1px,transparent 1px),linear-gradient(90deg,var(--card-border) 1px,transparent 1px);
  background-size:28px 28px;
  -webkit-mask-image:radial-gradient(120% 100% at 96% 0%,#000,transparent 62%);
  mask-image:radial-gradient(120% 100% at 96% 0%,#000,transparent 62%);
}
.sd-glow{position:absolute;border-radius:50%;pointer-events:none;filter:blur(2px)}
.sd-glow.g1{width:240px;height:240px;right:-70px;top:-110px;background:radial-gradient(circle,var(--primary-light),transparent 68%)}
.sd-glow.g2{width:180px;height:180px;right:120px;bottom:-120px;background:radial-gradient(circle,var(--primary-light),transparent 68%)}
/* 左栏：图标 + 三个纵向操作按钮 */
.sd-hero-l{position:relative;z-index:1;flex:none;width:168px;display:flex;flex-direction:column;gap:8px}
.sd-logo{
  width:100%;height:104px;border-radius:14px;display:grid;place-items:center;overflow:hidden;
  font-size:34px;font-weight:800;line-height:1;color:var(--text-2);
  background:linear-gradient(160deg,var(--surface),var(--surface-2));
  border:1px solid var(--card-border);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65),0 12px 24px -20px rgba(24,32,56,.65);
}
.sd-logo img{width:100%;height:100%;object-fit:cover}
.sd-acts{display:flex;flex-direction:column;gap:8px}
.sd-abtn{
  display:flex;align-items:center;justify-content:center;gap:6px;height:37px;padding:0 12px;
  border:0;border-radius:11px;font-size:12.5px;font-weight:700;color:#fff;
  text-decoration:none;cursor:pointer;transition:transform .16s ease,filter .16s ease;
  -webkit-tap-highlight-color:transparent;
}
.sd-abtn i{font-size:13.5px}
.sd-abtn em{font-style:normal;opacity:.92;font-variant-numeric:tabular-nums}
.sd-abtn:hover{transform:translateY(-1px);filter:brightness(1.06)}
.sd-abtn.go{background:linear-gradient(135deg,#16a34a,#22c55e);box-shadow:0 10px 20px -14px rgba(22,163,74,.9)}
.sd-abtn.like{background:linear-gradient(135deg,#2563eb,#3b82f6);box-shadow:0 10px 20px -14px rgba(37,99,235,.9)}
.sd-abtn.copy{background:linear-gradient(135deg,#e11d48,#f43f5e);box-shadow:0 10px 20px -14px rgba(225,29,72,.9)}
.sd-abtn.liked,.sd-abtn.on{background:linear-gradient(135deg,#0d9488,#14b8a6);box-shadow:none;cursor:default}
.sd-abtn.liked:hover,.sd-abtn.on:hover{transform:none;filter:none}
/* 右栏：标题 + 描述 + 标签 + 数据网格 */
.sd-hero-r{position:relative;z-index:1;flex:1;min-width:0;display:flex;flex-direction:column}
.sd-title{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.sd-title h1{margin:0;font-size:clamp(19px,2.3vw,25px);font-weight:800;letter-spacing:-.4px;line-height:1.25}
.sd-desc{margin:6px 0 0;color:var(--text-2);font-size:13px;line-height:1.65;max-width:70ch}
.sd-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.sd-tag{
  display:inline-flex;align-items:center;gap:5px;height:25px;padding:0 9px;border-radius:8px;
  font-size:11.5px;color:var(--text-2);background:var(--surface);border:1px solid var(--card-border);
  transition:color .16s,border-color .16s,background .16s;
}
.sd-tag i{font-size:11.5px;color:var(--accent)}
.sd-tag:hover{border-color:var(--accent);color:var(--accent)}
.sd-tag.soft{background:transparent;border-color:transparent;color:var(--muted);padding:0 4px}
.sd-cells{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 22px;margin-top:auto;padding-top:12px}
.sd-cell{display:flex;align-items:baseline;gap:2px;min-width:0;padding:6px 0;border-bottom:1px dashed var(--border);font-size:12px}
.sd-cell span{flex:none;color:var(--muted);font-size:11.5px}
.sd-cell b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;font-weight:800;letter-spacing:-.2px;color:var(--text);font-variant-numeric:tabular-nums}
.sd-cell b i{font-style:normal;font-size:10.5px;font-weight:600;color:var(--muted);margin-left:1px}
.sd-cell b.dt{font-size:11.5px;font-weight:700;color:var(--text-2)}

/* 左右两栏等高：两侧都拉伸到同一高度，内容按需撑满 */
.sd-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:14px;align-items:stretch}
.page-site .panel.sd-shot{display:flex;flex-direction:column;padding:10px}
.sd-shot-frame{flex:1;min-height:0;display:flex;flex-direction:column;border-radius:14px;overflow:hidden;border:1px solid var(--border);background:var(--surface)}
.sd-shot-bar{display:flex;align-items:center;gap:9px;height:34px;padding:0 11px;background:var(--surface-2);border-bottom:1px solid var(--border)}
.sd-dots{display:flex;gap:5px;flex:none}
.sd-dots i{width:8px;height:8px;border-radius:50%;background:#ff5f57}
.sd-dots i:nth-child(2){background:#febc2e}
.sd-dots i:nth-child(3){background:#28c840}
.sd-shot-url{
  flex:1;min-width:0;display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px;border-radius:7px;
  background:var(--bg);color:var(--muted);font-size:11px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.sd-shot-url i{font-size:10.5px}
.sd-shot-live{display:inline-flex;align-items:center;gap:4px;flex:none;font-size:10.5px;font-weight:700;color:var(--ok-fg)}
.sd-shot-body{flex:1;min-height:250px;background:linear-gradient(160deg,var(--surface-2),var(--bg))}
.sd-shot-body img{width:100%;height:100%;object-fit:cover;display:block}
.sd-shot-ph{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--muted)}
.sd-shot-ph em{font-style:normal;font-size:42px;font-weight:800;line-height:1;color:var(--text-2)}
.sd-shot-ph span{font-size:12.5px;font-weight:600;max-width:80%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sd-shot-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 2px 0}
.sd-shot-meta,.sd-shot-stats{display:none}
.sd-shot-tip{flex:1;min-width:140px;font-size:11px;color:var(--muted);line-height:1.5}
.sd-shot-acts{display:flex;gap:8px;flex-wrap:wrap}
.sd-shot-acts .btn{height:34px;padding:0 14px;font-size:12.5px}

.page-site .panel.sd-info{display:flex;flex-direction:column;padding:15px 16px}
.sd-info-hd{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.sd-info-hd b{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:800;letter-spacing:-.2px}
.sd-info-hd b i{color:var(--accent);font-size:14.5px}
.sd-info-badge{
  display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:999px;
  font-size:10.5px;font-weight:700;color:var(--accent);background:var(--primary-light);
}
.sd-list{margin:4px 0 0;display:flex;flex-direction:column}
.sd-list>div{display:grid;grid-template-columns:56px minmax(0,1fr);gap:10px;padding:6.5px 0;border-bottom:1px dashed var(--border);font-size:12.5px}
.sd-list>div:last-child{border-bottom:0;padding-bottom:2px}
.sd-list dt{margin:0;color:var(--muted);font-size:11.5px}
.sd-list dd{margin:0;color:var(--text-2);min-width:0;word-break:break-word;line-height:1.55}
.sd-list dd a{color:var(--accent)}
.sd-list dd.mono{font-family:ui-monospace,Consolas,monospace;font-size:11.5px;color:var(--muted)}
.dtag{display:inline-block;margin:0 4px 3px 0;padding:0 6px;border-radius:6px;font-size:11px;color:var(--accent);background:var(--primary-light)}
.sd-seo{margin-top:auto;padding-top:11px;border-top:1px solid var(--border)}
.sd-seo-t{display:flex;align-items:center;gap:6px;margin-bottom:8px;font-size:11.5px;font-weight:700;color:var(--text-2)}
.sd-seo-t i{color:var(--accent)}
.sd-seo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.sd-seo-grid a{
  display:flex;align-items:center;gap:6px;height:30px;padding:0 9px;border-radius:8px;
  font-size:11.5px;color:var(--text-2);background:var(--bg);border:1px solid var(--card-border);
  transition:all .16s ease;
}
.sd-seo-grid a i{font-size:12px;color:var(--accent)}
.sd-seo-grid a:hover{border-color:var(--accent);color:var(--accent);background:var(--surface)}

.page-site .sd-benefit{padding:15px 18px}
.sd-benefit-hd{display:flex;align-items:center;gap:10px;justify-content:space-between;margin-bottom:10px}
.sd-benefit-hd b{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:800;letter-spacing:-.2px}
.sd-benefit-hd b i{color:var(--accent);font-size:14.5px}
.sd-benefit-hd span{font-size:11px;color:var(--muted)}
.sd-blist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 20px}
.sd-blist li{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:var(--text-2);line-height:1.55}
.sd-blist li i{
  flex:none;margin-top:2px;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;
  font-size:9px;color:var(--ok-fg);background:var(--ok-bg);border:1px solid var(--ok-border);
}
.sd-friend{margin-top:12px;padding-top:11px;border-top:1px dashed var(--border)}
.sd-friend p{margin:0 0 8px;font-size:11.5px;color:var(--muted)}
.sd-code{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sd-code code{
  flex:1;min-width:220px;padding:8px 11px;border-radius:8px;font-size:11.5px;
  font-family:ui-monospace,Consolas,monospace;color:var(--text-2);
  background:var(--bg);border:1px dashed var(--card-border);overflow-x:auto;white-space:nowrap;
}
.sd-code .btn{height:34px;padding:0 12px;font-size:12px}
.sd-related .grid{margin-top:10px;gap:11px}
.page-site .md{font-size:15px;line-height:1.85}
.page-site .adzone{margin-top:8px}
.page-site .fixads{margin-top:10px}

@media(max-width:880px){
  .sd-grid{grid-template-columns:minmax(0,1fr)}
  .sd-shot-body{min-height:210px}
}
@media(max-width:900px){
  .sd-hero{flex-direction:column;gap:12px;padding:16px}
  .sd-hero-l{width:100%;display:grid;grid-template-columns:72px minmax(0,1fr);gap:8px;align-items:center}
  .sd-logo{height:72px;font-size:26px}
  .sd-acts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .sd-cells{margin-top:10px;padding-top:0}
  .sd-blist{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:560px){
  .sd-hero{padding:14px 12px;border-radius:16px;gap:10px}
  .sd-logo{height:56px;border-radius:12px;font-size:22px}
  .sd-abtn{height:34px;font-size:11.5px;padding:0 6px;gap:4px}
  .sd-abtn i{font-size:12px}
  .sd-shot-body{min-height:160px}
  .sd-shot-live{display:none}
  .sd-shot-foot{flex-direction:column;align-items:stretch}
  .sd-shot-acts .btn{flex:1;justify-content:center}
  .sd-cells{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
  .sd-seo-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .sd-seo-grid a{height:28px;padding:0 6px;gap:4px;font-size:10.5px;justify-content:center}
  .sd-seo-grid a i{font-size:11px}
}

/* 站点详情：手机端 Hero 左右布局（左：图标 + 站名 + 三个按钮，右：描述；标签横向滑动） */
@media(max-width:640px){
  .sd-hero{
    display:grid;grid-template-columns:104px minmax(0,1fr);align-items:start;
    column-gap:10px;row-gap:8px;padding:14px 12px;border-radius:16px;
  }
  .sd-hero-l,.sd-hero-r{display:contents}
  .sd-logo{grid-column:1;grid-row:1;width:64px;height:64px;border-radius:14px;font-size:26px}
  .sd-title{grid-column:1;grid-row:2;justify-content:center;gap:4px}
  .sd-title h1{font-size:14px;letter-spacing:-.2px;line-height:1.3;text-align:center;word-break:break-word}
  .sd-title .badge{height:16px;padding:0 4px;font-size:9px}
  .sd-acts{grid-column:1;grid-row:3;display:flex;flex-direction:column;gap:5px;margin-top:0}
  .sd-abtn{height:26px;padding:0 4px;gap:3px;font-size:10px;border-radius:8px;justify-content:center;white-space:nowrap}
  .sd-abtn i{font-size:11px}
  .sd-desc{grid-column:2;grid-row:1/4;margin:0;max-width:none;font-size:12px;line-height:1.6}
  /* 标签：横向一行，超出屏幕横向滑动 */
  .sd-tags{grid-column:1/-1;grid-row:4;margin-top:0;gap:5px;min-width:0;
    flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;
    -webkit-overflow-scrolling:touch;padding-bottom:1px}
  .sd-tags::-webkit-scrollbar{display:none}
  .sd-tag{flex:none;height:22px;padding:0 8px;gap:4px;font-size:10.5px;border-radius:7px}
  .sd-tag i{font-size:10.5px}
  .sd-cells{grid-column:1/-1;grid-row:5;margin-top:0;padding-top:4px;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 12px}
  /* 三个点击数据移到封面卡片，Hero 只留收录日期 / 收录天数 / 点赞数 */
  .sd-hero .sd-cells .sd-cell:nth-child(-n+3){display:none}
  /* 封面卡片：封面图 + 图标站名 + 三个点击数据 */
  .page-site .sd-shot-meta{display:flex;align-items:center;gap:8px;padding:10px 2px 0}
  .sd-shot-ico{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;overflow:hidden;background:var(--surface-2);font-size:18px}
  .sd-shot-ico img{width:100%;height:100%;object-fit:cover;display:block}
  .sd-shot-name{flex:1;min-width:0;font-size:13.5px;font-weight:800;letter-spacing:-.2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .sd-shot-meta .badge{height:16px;padding:0 4px;font-size:9px}
  .page-site .sd-shot-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 10px;margin-top:2px}
  .sd-shot-stats .sd-cell{font-size:11px;padding:6px 0}
  .sd-shot-stats .sd-cell span{font-size:10.5px}
  .sd-shot-stats .sd-cell b{font-size:11.5px}
}

.list-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.lh-body{flex:1;min-width:200px}
.lh-body h1{margin:0;font-size:20px;font-weight:800;letter-spacing:-.3px}
.lh-body p{margin:4px 0 0;color:var(--muted);font-size:12.5px}
.lh-search{display:flex;max-width:300px;width:100%}
.art-item h4 .top,.arcard h4 .top{font-size:11px;color:#be123c;background:#fef2f4;border:1px solid #fbd0da;border-radius:5px;padding:0 4px;margin-right:5px;font-weight:600;vertical-align:1px}
.arcard .cover .ph{display:grid;place-items:center;height:100%;font-size:34px;opacity:.45;color:#b9c0cf}
.art-cards{margin-top:12px}
.grid{margin-top:12px}
.art-list{margin-top:12px}
.art-wrap{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:18px;align-items:start}
.article .head .lbl{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.toc-h{margin:0 0 8px;font-size:12.5px;color:var(--muted);font-weight:600}
.nx .nx-empty{display:block}
.s-h1{margin:0 0 12px;font-size:19px;font-weight:800;letter-spacing:-.2px}
.s-meta{margin:12px 0 0;color:var(--muted);font-size:12.5px}
.sinput-inline{max-width:640px;margin:0}
.spb{min-width:0;flex:1}
.spn{font-size:11px;color:var(--muted)}
.nf{padding:60px 16px}
.nf h1{margin:8px 0 4px;font-size:20px;font-weight:800}
.nf p{margin:0;color:var(--muted);font-size:13px}
.nf-act{display:flex;gap:10px;margin-top:16px}
.modal .box-search{max-width:420px;text-align:left}
.modal .box-search h3{margin-bottom:12px}
.mrow{display:flex;gap:8px}
.mrow .inp{flex:1;height:40px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);padding:0 12px;outline:none;transition:all .2s ease}
.mrow .inp:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,.12)}

/* 图标（bootstrap-icons）统一尺寸 */
.bi{line-height:1}
.tbtn .bi,.tnav .bi{font-size:14px}

/* ---------------- 首页复刻 codernav 的模块 ---------------- */
.hero-cats{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;position:relative;z-index:2}
.hero-cats a{
  height:30px;padding:0 14px;border-radius:999px;background:var(--surface);border:1px solid var(--border);
  color:var(--text-2);font-size:12.5px;display:inline-flex;align-items:center;transition:all .2s ease;
}
.hero-cats a:hover{border-color:var(--accent);color:var(--accent)}
.hero-cats a:first-child{background:var(--grad);border-color:transparent;color:#fff}

.promo{
  display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--radius);
  background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-sm);
}
.promo-head{
  flex:none;display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;
  color:var(--accent);padding-right:12px;border-right:1px solid var(--border);
}
.promo-list{display:flex;gap:10px;overflow-x:auto;flex:1;min-width:0;scrollbar-width:none}
.promo-list::-webkit-scrollbar{display:none}
.pm{
  flex:none;display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:10px;
  background:var(--bg);border:1px solid transparent;transition:all .2s ease;
}
.pm:hover{background:var(--primary-light);border-color:#d9ddfb}
.pmi{
  width:28px;height:28px;border-radius:8px;display:grid;place-items:center;overflow:hidden;flex:none;
  background:var(--surface);border:1px solid var(--card-border);font-size:14px;font-weight:700;color:var(--accent);
}
.pmi img{width:100%;height:100%;object-fit:cover}
.pmb{display:flex;flex-direction:column;line-height:1.3}
.pmb b{font-size:12.5px;font-weight:600;white-space:nowrap}
.pmb em{font-style:normal;font-size:10.5px;color:var(--muted)}

.statbar{
  display:grid;grid-template-columns:repeat(6,1fr);gap:0;padding:6px 0;border-radius:var(--radius);
  background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-sm);
}
.statbar .st{text-align:center;padding:12px 6px;border-right:1px dashed var(--border)}
.statbar .st:last-child{border-right:0}
.statbar .st b{display:block;font-size:22px;font-weight:800;letter-spacing:-.6px;font-variant-numeric:tabular-nums;color:var(--text)}
.statbar .st span{font-size:11.5px;color:var(--muted)}

/* 首页顶部：分类快捷条 + 精选 banner（与顶部导航同宽） */
.home-top{max-width:var(--maxw);margin:0 auto;padding:12px 18px 0}
.qstrip{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:10px;margin-top:10px}
.qs{
  position:relative;display:flex;align-items:center;gap:7px;min-width:0;padding:9px 10px;border-radius:12px;
  background:var(--surface);border:1px solid var(--card-border);box-shadow:var(--shadow-sm);
  transition:transform .18s,border-color .18s,box-shadow .18s;
}
/* 分类快捷条右上角数量 */
.qs em{
  position:absolute;top:3px;right:5px;min-width:16px;height:16px;padding:0 4px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;border:1px solid #fff;background:#eef0ff;color:#5b5ef0;
  font-style:normal;font-size:9.5px;font-weight:700;line-height:1;
  box-shadow:0 2px 6px rgba(60,63,120,.18);font-variant-numeric:tabular-nums;
}
.qs:hover{transform:translateY(-2px);border-color:#d9ddf5;box-shadow:var(--shadow)}
.qsi{width:30px;height:30px;border-radius:9px;flex:none;display:grid;place-items:center;font-size:16px;background:var(--bg)}
.qs b{min-width:0;font-size:11.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.banners{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:10px}
.bn{
  position:relative;display:flex;align-items:center;gap:10px;height:104px;padding:14px;border-radius:14px;
  overflow:hidden;color:#fff;box-shadow:0 10px 24px rgba(28,31,39,.10);
  transition:transform .2s,box-shadow .2s;
}
.bn::after{content:"";position:absolute;right:-40px;bottom:-40px;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.16)}
.bn:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(28,31,39,.16)}
.bn-1{background:linear-gradient(135deg,#6366f1,#8b5cf6)}
.bn-2{background:linear-gradient(135deg,#0ea5e9,#22d3ee)}
.bn-3{background:linear-gradient(135deg,#f43f5e,#fb7185)}
.bn-4{background:linear-gradient(135deg,#f59e0b,#fbbf24)}
.bn-5{background:linear-gradient(135deg,#10b981,#34d399)}
.bn-6{background:linear-gradient(135deg,#8b5cf6,#ec4899)}
.bni{
  position:relative;z-index:1;width:36px;height:36px;border-radius:10px;flex:none;display:grid;place-items:center;
  background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.35);font-size:18px;overflow:hidden;
}
.bni img{width:100%;height:100%;object-fit:cover;border-radius:9px}
.bnb{position:relative;z-index:1;min-width:0;flex:1}
.bnb b{display:block;font-size:13.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bnb em{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-style:normal;font-size:10.5px;line-height:1.45;color:rgba(255,255,255,.86);margin-top:3px;
}
.bngo{
  position:relative;z-index:1;width:22px;height:22px;border-radius:50%;flex:none;display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.5);font-size:10px;color:#fff;
}
.main>.noticebar{max-width:none;margin-top:0}

.grid5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:12px}
.grid5 .card{padding:9px 11px;min-height:60px}

.fgroup .sec-head{margin-bottom:2px}
.fgroup .sec-head h2{display:flex;align-items:center;gap:8px;font-size:16.5px}
.gico{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-size:15px;background:var(--primary-light);flex:none;overflow:hidden}
/* 分类 / 标签图标：内置图标、emoji、上传图片三种统一铺满容器 */
.cat-item i,.qsi,.gico,.cat-ico,.bs-cats a i{overflow:hidden}
.cat-item i img,.qsi img,.gico img,.cat-ico img,.bs-cats a i img,.cat-item i .ico-img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
/* 标签图标：前端标签胶囊 / 侧栏二级标签 */
.tagbar .tg i,.cat-sub a i{width:16px;height:16px;flex:none;display:inline-grid;place-items:center;
  font-style:normal;font-size:13px;line-height:1;overflow:hidden;border-radius:4px}
.cat-sub a i{width:15px;height:15px;font-size:12px}
.tagbar .tg i img,.cat-sub a i img{width:100%;height:100%;object-fit:cover;display:block;border-radius:4px}
.fgroup .sec-head em{background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:2px 9px;font-size:11px}

.flinks-panel{padding:14px 16px}
.flinks{display:flex;gap:8px;flex-wrap:wrap}
.flinks a{
  height:30px;padding:0 12px;border-radius:999px;background:var(--bg);border:1px solid var(--border);
  color:var(--text-2);font-size:12px;display:inline-flex;align-items:center;transition:all .2s ease;
}
.flinks a:hover{color:var(--accent);border-color:var(--accent);background:var(--surface)}

.engines-label{font-size:11.5px;color:var(--muted);align-self:center;margin-right:2px}
.sinput > .bi{color:var(--muted);font-size:16px;flex:none}

/* ==========================================================================
   首页 2.0 · 高级视觉：渐变 Hero / 浮动卡片 / 精选宫格 / 排行与最新收录
   ========================================================================== */

/* Hero：动态 mesh 渐变 + 流光 + 玻璃搜索 */
.hero-xl{padding-top:2px}
.hero-in{
  position:relative;overflow:hidden;border-radius:24px;padding:40px 42px;
  display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:center;color:#fff;
  background:var(--hero-grad);
  background-size:200% 200%;animation:meshMove 20s ease infinite;
  box-shadow:0 30px 60px -24px rgba(79,70,229,.55),inset 0 1px 0 rgba(255,255,255,.20);
}
.hero-in::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(560px 300px at 88% 12%,rgba(255,255,255,.22),transparent 62%),
    radial-gradient(420px 260px at 6% 96%,rgba(255,255,255,.14),transparent 62%);
}
.hero-in::before{
  content:"";position:absolute;left:-10%;right:-10%;top:-60%;height:120%;pointer-events:none;
  background:linear-gradient(100deg,transparent 38%,rgba(255,255,255,.14) 50%,transparent 62%);
  animation:shineMove 9s linear infinite;
}
@keyframes meshMove{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes shineMove{0%{transform:translateX(-40%)}100%{transform:translateX(40%)}}

.hero-copy{position:relative;z-index:2;min-width:0}
.hero-tag{
  display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 12px;border-radius:999px;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.34);font-size:12px;backdrop-filter:blur(6px);
}
.hero-xl h1{margin:16px 0 8px;font-size:clamp(28px,3.4vw,44px);line-height:1.16;letter-spacing:-1px;font-weight:800;color:#fff}
.hero-xl h1 .grad-text{
  background:linear-gradient(120deg,#fff 10%,#ded6ff 55%,#fff 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.hero-sub{margin:0 0 20px;font-size:14px;line-height:1.7;color:rgba(255,255,255,.82);max-width:540px}
.hero-search{max-width:600px;gap:9px;position:relative}
.hero-sinput{
  height:52px;border-radius:14px;background:#fff;border:0;padding-left:16px;
  box-shadow:0 16px 34px -14px rgba(23,16,64,.55);
}
.hero-sinput:focus-within{box-shadow:0 0 0 3px rgba(255,255,255,.28),0 16px 34px -14px rgba(23,16,64,.55)}
.hero-sinput .go{height:38px;padding:0 22px;border-radius:11px}
.hero-sinput input{color:#1c1f27}
.hero-sinput input::placeholder{color:#98a0ad}
.hero-search .engines-label{color:rgba(255,255,255,.74)}
.hero-search .engines button{
  background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.30);color:#fff;backdrop-filter:blur(6px);
}
.hero-search .engines button:hover{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.55);color:#fff}
.hero-search .engines button.on{background:#fff;border-color:transparent;color:var(--accent);box-shadow:0 6px 16px rgba(23,16,64,.30)}
/* 搜索分区：常用 / 搜索 / 工具 / 社区 / 生活 */
.stabs{display:flex;align-items:center;gap:22px;margin-bottom:-2px}
.stabs button{
  position:relative;padding:1px 1px 9px;border:0;background:transparent;cursor:pointer;
  color:rgba(255,255,255,.70);font-size:13.5px;font-weight:600;letter-spacing:.3px;
  transition:color .18s ease;
}
.stabs button::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:2px;border-radius:2px;
  background:#fff;transform:translateX(-50%);transition:width .22s ease}
.stabs button:hover{color:#fff}
.stabs button.on{color:#fff}
.stabs button.on::after{width:22px}
.squick{display:none;align-items:center;gap:18px;flex-wrap:wrap;padding-top:3px}
.squick.on{display:flex}
.squick button{
  position:relative;padding:1px 0 6px;border:0;background:transparent;cursor:pointer;
  color:rgba(255,255,255,.72);font-size:12.5px;transition:color .18s ease;
}
.squick button:hover{color:#fff}
.squick button.on{color:#fff;font-weight:700}
.squick button.on::before{content:"";position:absolute;left:50%;top:-7px;margin-left:-4px;width:0;height:0;
  border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid rgba(255,255,255,.9)}
.squick button.on::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:#fff}
.hero-nums{display:flex;gap:24px;margin-top:16px;font-size:12px;color:rgba(255,255,255,.72)}
.hero-nums b{font-size:19px;font-weight:800;color:#fff;margin-right:4px;font-variant-numeric:tabular-nums}

.hero-cards{position:relative;height:300px;z-index:2}
.hcard{
  position:absolute;width:160px;padding:10px 11px;border-radius:14px;display:flex;align-items:center;gap:9px;
  background:rgba(255,255,255,.94);color:var(--text);border:1px solid rgba(255,255,255,.7);
  box-shadow:0 22px 42px -18px rgba(20,14,60,.60);backdrop-filter:blur(10px);
  transform:rotate(var(--rot,0deg));
  animation:floaty var(--dur,16s) ease-in-out infinite;
  animation-delay:var(--delay,0s);
  transition:box-shadow .3s,background .3s,transform .3s;
}
/* 鼠标进入该区域：所有卡片停住，方便阅读与点击 */
.hero-cards:hover .hcard{animation-play-state:paused}
.hero-cards .hcard:hover{background:#fff;z-index:12;transform:rotate(0deg) scale(1.04);animation-play-state:paused;
  box-shadow:0 28px 56px -18px rgba(20,14,60,.72)}
.hcard:nth-child(1){top:0;left:0;--rot:-6deg;--dur:17s;--delay:-1s;--dx:8px;--dy:-13px;--sway:2deg;z-index:3}
.hcard:nth-child(2){top:2%;left:32%;--rot:3deg;--dur:20s;--delay:-6s;--dx:-7px;--dy:-11px;--sway:-2.5deg;z-index:2}
.hcard:nth-child(3){top:0;right:0;--rot:5deg;--dur:16s;--delay:-9s;--dx:6px;--dy:-15px;--sway:3deg;z-index:3}
.hcard:nth-child(4){top:33%;left:8%;--rot:4deg;--dur:18s;--delay:-3s;--dx:-8px;--dy:-12px;--sway:-2deg;z-index:4}
.hcard:nth-child(5){top:31%;left:44%;--rot:-3deg;--dur:22s;--delay:-12s;--dx:7px;--dy:-14px;--sway:2.5deg;z-index:3}
.hcard:nth-child(6){top:35%;right:0;--rot:6deg;--dur:19s;--delay:-5s;--dx:-6px;--dy:-16px;--sway:-3deg;z-index:2}
.hcard:nth-child(7){bottom:2%;left:0;--rot:-4deg;--dur:21s;--delay:-8s;--dx:9px;--dy:-12px;--sway:2deg;z-index:2}
.hcard:nth-child(8){bottom:0;left:32%;--rot:2deg;--dur:16s;--delay:-11s;--dx:-7px;--dy:-13px;--sway:-2.5deg;z-index:4}
.hcard:nth-child(9){bottom:4%;right:0;--rot:-5deg;--dur:18s;--delay:-2s;--dx:5px;--dy:-9px;--sway:1.5deg;z-index:3}
.hcard:nth-child(10){top:20%;left:62%;--rot:7deg;--dur:23s;--delay:-7s;--dx:-6px;--dy:-10px;--sway:-3deg;z-index:1}
@keyframes floaty{
  0%,100%{transform:rotate(var(--rot,0deg)) translate3d(0,0,0)}
  50%{transform:rotate(calc(var(--rot,0deg) + var(--sway,2deg))) translate3d(var(--dx,7px),var(--dy,-14px),0)}
}
@media(prefers-reduced-motion:reduce){.hcard{animation:none}}
.hico{width:32px;height:32px;border-radius:9px;flex:none;display:grid;place-items:center;font-size:16px;
  background:var(--bg);border:1px solid var(--card-border);overflow:hidden}
.hico img{width:100%;height:100%;object-fit:cover;border-radius:8px}
.hb{flex:1;min-width:0}
.hb b{display:block;font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb em{display:block;font-style:normal;font-size:10px;color:var(--hcard-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.hgo{font-size:11px;color:#c0c6d4;flex:none}

/* 区块标题：左侧渐变竖条 */
.sec-head{margin:4px 0 -2px}
.sec-head h2{position:relative;padding-left:11px}
.sec-head h2::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:17px;
  border-radius:3px;background:var(--grad);box-shadow:0 2px 8px rgba(99,102,241,.35);
}
.fgroup .sec-head h2{padding-left:0}
.fgroup .sec-head h2::before{display:none}

/* 首页广告位（推广） */
.adzone{margin-top:14px}
.adzone-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;
  font-size:11.5px;color:var(--muted);letter-spacing:.4px}
.adzone-hd span{display:inline-flex;align-items:center;gap:5px;font-weight:600}
.adzone-hd i{font-size:12px;color:var(--accent)}
.adzone-hd a{display:inline-flex;align-items:center;gap:4px;color:var(--muted);transition:color .2s}
.adzone-hd a:hover{color:var(--accent)}
.ad-card{
  position:relative;display:flex;align-items:center;min-height:84px;padding:14px 18px;border-radius:16px;
  overflow:hidden;isolation:isolate;text-decoration:none;color:#fff;
  background:linear-gradient(120deg,#4f46e5 0%,#7c3aed 46%,#0ea5e9 100%);
  box-shadow:0 14px 34px rgba(79,70,229,.24);
  transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s;
}
.ad-card[style*="--ad-theme"]{background:linear-gradient(120deg,var(--ad-theme) 0%,#111827 120%)}
.ad-list{display:grid;grid-template-columns:repeat(var(--acols,1),minmax(0,1fr));align-items:stretch;gap:10px}
/* 手机端专属补位卡（桌面隐藏） */
.ad-list .ad-card.fx-m{display:none}
.ad-list .ad-card{margin-top:0}
.ad-list .ad-card + .ad-card{margin-top:0}
.ad-list[data-cols="2"] .ad-card,
.ad-list[data-cols="3"] .ad-card,
.ad-list[data-cols="4"] .ad-card{height:78px;padding:12px 14px;border-radius:14px}
.ad-list[data-cols="3"] .ad-title,
.ad-list[data-cols="4"] .ad-title{font-size:14.5px}
.ad-list[data-cols="4"] .ad-eyebrow,
.ad-list[data-cols="4"] .ad-sub{display:none}
.ad-list[data-cols="4"] .ad-cta{padding:4px 10px;font-size:11.5px}
/* 横幅位无广告时的招募占位：默认背景图 + 深色蒙层，文字与正式广告一致用白字 */
.ad-card.ad-empty{background:var(--surface);border:1.5px dashed rgba(255,255,255,.42);box-shadow:none;color:#fff}
.ad-card.ad-empty .ad-title{color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.45)}
.ad-card.ad-empty .ad-sub{color:rgba(255,255,255,.88);opacity:1;text-shadow:0 1px 8px rgba(0,0,0,.4)}
.ad-card.ad-empty .ad-cta{background:var(--grad);color:#fff;box-shadow:0 8px 20px rgba(99,102,241,.28)}
.ad-card.ad-empty:hover{border-color:var(--accent);box-shadow:0 14px 30px rgba(99,102,241,.14)}
@media(max-width:900px){
  .ad-list[data-cols="3"],.ad-list[data-cols="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.ad-card + .ad-card{margin-top:10px}
.ad-card:hover{transform:translateY(-2px);box-shadow:0 20px 44px rgba(79,70,229,.32)}
.ad-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .6s cubic-bezier(.22,.61,.36,1)}
.ad-card:hover .ad-bg{transform:scale(1.04)}
.ad-shade{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(96deg,rgba(17,20,32,.86) 6%,rgba(17,20,32,.52) 54%,rgba(17,20,32,.10) 100%)}
.ad-body{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 12px;max-width:100%;min-width:0}
.ad-eyebrow{display:flex;align-items:center;gap:6px}
.ad-tag,.ad-badge{display:inline-flex;align-items:center;font-style:normal;font-size:10px;letter-spacing:.6px;
  padding:2px 7px;border-radius:6px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.24);color:#fff}
.ad-tag{background:rgba(255,255,255,.22);font-weight:700}
.ad-title{font-size:16px;font-weight:700;letter-spacing:-.2px;line-height:1.35;flex:none;
  text-shadow:0 2px 12px rgba(0,0,0,.30);display:block;max-width:360px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-sub{font-size:12px;opacity:.82;line-height:1.45;display:block;flex:1 1 180px;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  text-shadow:0 1px 8px rgba(0,0,0,.28)}
.ad-cta{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;
  padding:5px 12px;border-radius:999px;background:#fff;color:#1f2430;
  box-shadow:0 6px 16px rgba(0,0,0,.18);transition:transform .2s,gap .2s}
.ad-card:hover .ad-cta{transform:translateX(2px);gap:9px}
.panel h3 .more + .more{margin-left:8px}
.panel h3 .ad-more{color:var(--accent)}

/* 今日精选大卡 */
.pick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.pick{
  position:relative;display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;background:var(--surface);
  border:1px solid var(--card-border);box-shadow:var(--shadow-sm);overflow:hidden;
  transition:transform .25s cubic-bezier(.22,.61,.36,1),box-shadow .25s,border-color .25s;
}
.pick::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:16px;
  background:linear-gradient(120deg,rgba(99,102,241,.10),rgba(139,92,246,.02) 55%,transparent);
  opacity:0;transition:opacity .25s;
}
.pick:hover{transform:translateY(-3px);border-color:#d6daf3;box-shadow:0 18px 36px -14px rgba(28,31,39,.20)}
.pick:hover::after{opacity:1}
.pick-ico{
  position:relative;z-index:1;width:46px;height:46px;border-radius:13px;flex:none;display:grid;place-items:center;
  font-size:21px;background:var(--bg);border:1px solid var(--card-border);overflow:hidden;
  transition:transform .25s cubic-bezier(.22,.61,.36,1);
}
.pick:hover .pick-ico{transform:scale(1.06) rotate(-3deg)}
.pick-ico img{width:100%;height:100%;object-fit:cover;border-radius:12px}
.pick-b{position:relative;z-index:1;flex:1;min-width:0}
.pick-b b{display:block;font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick-b em{display:block;margin-top:3px;font-style:normal;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick-go{
  position:relative;z-index:1;width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;
  border:1px solid var(--border);color:#bcc2d0;font-size:11px;transition:all .25s;
}
.pick:hover .pick-go{background:var(--grad);border-color:transparent;color:#fff;transform:translateX(2px)}

/* 数据条：渐变数字 */
.statbar{overflow:hidden}
.statbar .st b{
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}

/* 人气排行 / 最近收录（右侧栏） */
.rank-panel,.latest-panel{padding:14px 12px 10px;min-width:0}
.toplist{display:flex;flex-direction:column;gap:1px}
.tlrow{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:10px;transition:background .2s,transform .2s}
.tlrow:hover{background:var(--primary-light);transform:translateX(3px)}
.tlrow .no{
  width:21px;height:21px;border-radius:7px;background:var(--bg);font-size:11px;font-weight:800;
  color:var(--text-2);display:grid;place-items:center;flex:none;
}
.tlrow .no.hit{background:var(--grad);color:#fff;box-shadow:0 4px 10px rgba(99,102,241,.28)}
.tlrow .tico{
  width:28px;height:28px;border-radius:8px;flex:none;display:grid;place-items:center;font-size:14px;
  background:var(--bg);border:1px solid var(--card-border);overflow:hidden;
}
.tlrow .tico img{width:100%;height:100%;object-fit:cover;border-radius:7px}
.tlrow .tinfo{flex:1;min-width:0}
.tlrow .tinfo b{display:block;font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tlrow .tinfo em{display:block;font-style:normal;font-size:10.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tlrow .tv{flex:none;display:flex;align-items:center;gap:3px;font-size:10.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.latest-list{display:flex;flex-direction:column;gap:2px;min-width:0}
.lt{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:10px;min-width:0;transition:background .2s,transform .2s}
.lt:hover{background:var(--primary-light);transform:translateX(3px)}
.lti{
  width:30px;height:30px;border-radius:9px;flex:none;display:grid;place-items:center;font-size:14px;
  background:var(--bg);border:1px solid var(--card-border);overflow:hidden;
}
.lti img{width:100%;height:100%;object-fit:cover;border-radius:8px}
.ltb{flex:1;min-width:0}
.ltb b{display:flex;align-items:center;gap:6px;min-width:0;font-size:12.5px;font-weight:600;white-space:nowrap}
.ltb b>span.ltt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.ltbadge{
  flex:none;font-size:9.5px;font-weight:700;padding:1px 6px;border-radius:6px;
  background:var(--primary-light);color:var(--accent);
}
.ltb em{display:block;font-style:normal;font-size:10.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.ltgo{
  flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:10px;
  background:var(--bg);color:var(--muted);opacity:0;transform:translateX(-4px);
  transition:opacity .2s,transform .2s,background .2s,color .2s;
}
.lt:hover .ltgo{opacity:1;transform:none;background:var(--grad);color:#fff;border-color:transparent}

/* 卡片微动效：扫光 + 图标弹动 */
.card{position:relative;overflow:hidden}
.card::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 32%,rgba(99,102,241,.10) 50%,transparent 68%);
  transform:translateX(-130%);transition:transform .65s ease;
}
.card:hover::before{transform:translateX(130%)}
.card .ico,.card .cbody,.card .go{position:relative;z-index:1}
.card .ico{transition:transform .25s cubic-bezier(.22,.61,.36,1)}
.card:hover .ico{transform:scale(1.07)}

/* Banner 扫光 */
.bn::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.24) 50%,transparent 65%);
  transform:translateX(-120%);transition:transform .75s ease;
}
.bn:hover::before{transform:translateX(120%)}

/* 面板轻微悬浮 */
.panel{transition:box-shadow .3s,border-color .3s}
.panel:hover{border-color:#dfe2f5;box-shadow:0 14px 34px -18px rgba(28,31,39,.22)}

/* 二级标签栏（分类下的标签筛选） */
.tagbar{
  display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:9px 0 2px;
  padding:11px 10px 8px;border-radius:11px;background:var(--surface);border:1px solid var(--card-border);
}
.tagbar .tg{
  display:inline-flex;align-items:center;gap:5px;height:27px;padding:0 11px;border-radius:999px;
  border:1px solid var(--border);background:var(--bg);color:var(--text-2);
  font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease;
}
.tagbar .tg{position:relative;padding-right:13px}
/* 数量指标：胶囊右上角小徽标 */
.tagbar .tg em{
  position:absolute;top:-7px;right:-6px;min-width:17px;height:17px;padding:0 4px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;border:1px solid #fff;background:#eef0ff;color:#5b5ef0;
  font-style:normal;font-size:9.5px;font-weight:700;line-height:1;
  box-shadow:0 2px 6px rgba(60,63,120,.18);font-variant-numeric:tabular-nums;
}
.tagbar .tg:hover{border-color:var(--accent);color:var(--accent);background:var(--primary-light);transform:translateY(-1px)}
.tagbar .tg.on{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 5px 14px rgba(99,102,241,.28)}
.tagbar .tg.on em{background:#fff;color:#5b5ef0;border-color:rgba(255,255,255,.7)}
.fgroup.is-filter .card{display:none}
.fgroup.is-filter .card.show{display:flex;animation:tagIn .32s cubic-bezier(.22,.61,.36,1) both}
@keyframes tagIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
.fgroup .tag-empty{display:none;padding:18px;text-align:center;color:var(--muted);font-size:12.5px}
.fgroup.is-filter .tag-empty.on{display:block}

/* 首页分类：超出首屏上限的站点先隐藏（桌面 20 / 手机 15），选中二级标签后按筛选结果展示，
   保证标签角标数量与筛选出的卡片数量一致 */
.fgroup .grid5>.card.bx-d{display:none}
.fgroup.is-filter .grid5>.card.bx-d.show{display:flex}
@media(max-width:640px){
  .fgroup .grid5>.card.bx-m{display:none}
  .fgroup.is-filter .grid5>.card.bx-m.show{display:flex}
}

/* 分类筛选栏：横向滑动 + 更多 */
.tagbar-wrap{position:relative;display:flex;align-items:stretch;gap:10px;margin:9px 0 2px}
.tagbar-wrap>.tagbar{flex:1 1 auto;min-width:0;margin:0}
.tag-more,.tagpanel{display:none}

/* 响应式 */
@media(max-width:1279px){
  .app{grid-template-columns:minmax(0,1fr)}
  /* 右侧栏改为抽屉：默认收起，点顶栏按钮从右往左滑出 */
  .rail{
    align-self:auto;
    position:fixed;top:0;right:0;bottom:0;width:min(340px,88vw);
    max-height:none;height:auto;
    padding:0;
    overflow:hidden;overscroll-behavior:contain;
    background:var(--bg);z-index:170;
    border-left:1px solid var(--card-border);
    box-shadow:-20px 0 50px -32px rgba(18,14,45,.6);
    transform:translateX(105%);visibility:hidden;
    transition:transform .34s cubic-bezier(.22,.61,.36,1),visibility .34s;
  }
  .rail.open{transform:translateX(0);visibility:visible}
  /* 内层滚动：抽屉本体不滚动，收缩按钮才能稳在左边框垂直中线 */
  .rail-scroll{
    display:flex;flex-direction:column;gap:12px;height:100%;
    padding:14px 12px 24px;
    overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;
  }
  .rail-scroll::-webkit-scrollbar{display:none;width:0;height:0}
  .rail-hd{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:2px 2px 10px;border-bottom:1px solid var(--border);flex:none;
  }
  .rail-hd b{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:800;letter-spacing:.2px}
  .rail-hd b i{color:var(--accent);font-size:15px}
  .rail-mask{
    display:block;
    position:fixed;inset:0;background:rgba(17,20,32,.46);z-index:165;
    opacity:0;pointer-events:none;transition:opacity .3s ease;
  }
  .rail-mask.on{opacity:1;pointer-events:auto}
  body.rail-drawer-open{overflow:hidden}
  .grid{grid-template-columns:repeat(3,1fr)}
  .feat{grid-template-columns:repeat(2,1fr)}
  .grid5{grid-template-columns:repeat(4,minmax(0,1fr))}
  .qstrip{grid-template-columns:repeat(6,minmax(0,1fr))}
  .banners{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bn{height:96px}
  .hero-in{padding:32px 28px}
  .hero-cards{height:280px}
  .hcard{width:148px}
}
@media(max-width:1023px){
  .app{grid-template-columns:minmax(0,1fr)}
  .grid5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hero-in{grid-template-columns:1fr;padding:28px 24px}
  .hero-cards{display:none}
  .pick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .statbar{grid-template-columns:repeat(3,1fr)}
  .statbar .st:nth-child(3n){border-right:0}
  .statbar .st:nth-child(-n+3){border-bottom:1px dashed var(--border)}
  .promo{flex-direction:column;align-items:stretch;gap:8px}
  .promo-head{padding-right:0;border-right:0;border-bottom:1px solid var(--border);padding-bottom:8px}
  .grid{grid-template-columns:repeat(2,1fr)}
  .art-cards{grid-template-columns:repeat(2,1fr)}
  .wall{grid-template-columns:repeat(2,1fr)}
  .tnav{display:none}
  .tsearch{flex:1}
  .side.open{
    display:flex;position:fixed;left:0;top:0;bottom:0;width:228px;z-index:160;
    min-height:0;max-height:none;height:auto;
    padding:18px 12px 14px;overflow:auto;
    border-radius:0;border-right:1px solid rgba(255,255,255,.07);
    box-shadow:18px 0 48px -30px rgba(18,14,45,.75);
  }
  .side.open .snav-label{padding-top:4px}
  .side.open .cat-item b{font-size:13px}
  .side.open .cat-item i{width:26px;height:26px;font-size:14px}
  .side.open .side-card b{font-size:12px}
  .side.open .side-card em{font-size:11px}
  .side-mask{position:fixed;inset:0;background:rgba(17,20,32,.46);z-index:155;display:none}
  .side-mask.on{display:block}
}
@media(max-width:640px){
  :root{--top:52px}
  .app{padding:12px;gap:14px}
  .home-top{padding:10px 12px 0}
  .qstrip{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
  .qs{flex-direction:column;justify-content:center;gap:4px;padding:8px 4px;text-align:center}
  .qsi{width:26px;height:26px;font-size:14px;border-radius:8px}
  .qs b{font-size:11px;max-width:100%}
  .qs em{top:2px;right:3px;min-width:14px;height:14px;padding:0 3px;font-size:8px;border-width:1px}
  .banners{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .bn{height:60px;padding:7px 5px;gap:3px;flex-direction:column;justify-content:center;text-align:center;border-radius:11px}
  .bn::after{width:72px;height:72px;right:-24px;bottom:-24px}
  .bni{width:24px;height:24px;font-size:12px;border-radius:7px}
  .bni img{border-radius:7px}
  .bnb{flex:none;width:100%}
  .bnb b{font-size:11px;line-height:1.2}
  .bnb em{display:none}
  .bngo{display:none}
  .hero-in{padding:24px 20px;border-radius:18px}
  .hero-xl h1{font-size:28px}
  .hero-sinput{height:46px;padding-left:12px}
  .hero-nums{gap:16px}
  .pick-grid{grid-template-columns:1fr}
  .hero{padding:24px 18px;border-radius:16px}
  .hero p{font-size:13px}
  .sinput{height:44px;padding-left:14px}
  .sinput input{font-size:16px}
  .grid,.feat,.art-cards,.wall{grid-template-columns:1fr}
  .feat{grid-template-columns:1fr}
  .grid5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .statbar{grid-template-columns:repeat(2,1fr)}
  .statbar .st{border-right:1px dashed var(--border)!important;border-bottom:1px dashed var(--border)}
  .statbar .st:nth-child(2n){border-right:0!important}
  .statbar .st:nth-last-child(-n+2){border-bottom:0}
  .statbar .st b{font-size:19px}
  .tsearch{display:none}
  .tacts .tbtn.ghost{display:none}
  .article .cover{aspect-ratio:16/10}
  .nx{grid-template-columns:1fr}
  .dock a,.dock button{width:38px;height:38px;font-size:15px}
  .foot{padding-bottom:84px}
}

/* 手机端站点列表（首页分类 / 分类页 / 站点详情相关推荐）：统一一行三个，样式同首页（图标 + 站名 + 点击/点赞，去掉描述与箭头） */
@media(max-width:640px){
  .page-home .grid5,
  .page-category .grid,
  .page-site .sd-related .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .page-home .grid5{margin-top:9px}
  .page-home .grid5 .card,
  .page-category .grid .card,
  .page-site .sd-related .grid .card{gap:6px;padding:7px 6px;min-height:0;border-radius:11px}
  .page-home .grid5 .card .ico,
  .page-category .grid .card .ico,
  .page-site .sd-related .grid .card .ico{width:26px;height:26px;border-radius:8px;font-size:13px}
  .page-home .grid5 .card .name,
  .page-category .grid .card .name,
  .page-site .sd-related .grid .card .name{font-size:10.5px;gap:2px;line-height:1.25}
  .page-home .grid5 .card .desc,
  .page-category .grid .card .desc,
  .page-site .sd-related .grid .card .desc{display:none}
  .page-home .grid5 .card .badge,
  .page-category .grid .card .badge,
  .page-site .sd-related .grid .card .badge{height:13px;padding:0 3px;font-size:7.5px}
  .page-home .grid5 .card .lk-badge,
  .page-category .grid .card .lk-badge,
  .page-site .sd-related .grid .card .lk-badge{width:13px;height:13px;font-size:8px}
  .page-home .grid5 .card .cmeta,
  .page-category .grid .card .cmeta,
  .page-site .sd-related .grid .card .cmeta{gap:5px;margin-top:2px;font-size:9px}
  .page-home .grid5 .card .cmeta .cm .bi,
  .page-category .grid .card .cmeta .cm .bi,
  .page-site .sd-related .grid .card .cmeta .cm .bi{font-size:9.5px}
  .page-home .grid5 .card .cmeta .cm-like,
  .page-category .grid .card .cmeta .cm-like,
  .page-site .sd-related .grid .card .cmeta .cm-like{margin-left:0;padding:0}
  .page-home .grid5 .card .go,
  .page-category .grid .card .go,
  .page-site .sd-related .grid .card .go{display:none}
}

/* 手机端站点列表：点赞只作展示，点它直接进入站点详情页（不触发点赞） */
@media(max-width:640px){
  .card .cmeta .cm-like{pointer-events:none;cursor:inherit}
  /* 已点赞：只换实心图标，文字仍显示数量 */
  .card .cmeta .cm-like.on em{display:none}
  .card .cmeta .cm-like.on::after{content:attr(data-likes);font-style:normal;white-space:nowrap}
}

@media(hover:none){
  .card:hover,.quick .q:hover,.fcard:hover,.arcard:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .rise{opacity:1;transform:none}
}

/* 站点卡片：点击量 / 点赞记录 */
.card .cmeta{
  display:flex;align-items:center;gap:10px;margin-top:4px;
  font-size:10.5px;color:var(--muted);line-height:1.4;font-variant-numeric:tabular-nums;
}
.card .cmeta .cm{display:inline-flex;align-items:center;gap:3px;min-width:0}
.card .cmeta .cm .bi{font-size:11px}
.card .cmeta .cm-like{
  margin-left:auto;padding:1px 6px;border-radius:999px;cursor:pointer;
  transition:color .2s,background .2s,transform .2s;
}
.card .cmeta .cm-like em{font-style:normal}
.card .cmeta .cm-like:hover{color:var(--accent);background:var(--primary-light);transform:translateY(-1px)}
.card .cmeta .cm-like:active{transform:scale(.94)}

/* 站点悬停提示（后台「站点悬停提示」开关开启时启用） */
.site-tip-pop{
  position:fixed;z-index:9999;max-width:300px;min-width:160px;
  padding:11px 14px;border-radius:12px;background:#1f2430;color:#fff;
  font-size:12.5px;line-height:1.75;letter-spacing:.2px;word-break:break-word;
  box-shadow:0 18px 42px -12px rgba(15,18,30,.55);
  pointer-events:none;opacity:0;transform:translate(-50%,6px) scale(.97);
  transition:opacity .18s ease,transform .18s ease;
}
.site-tip-pop.on{opacity:1;transform:translate(-50%,0) scale(1)}
.site-tip-pop::before{
  content:"";position:absolute;left:50%;top:-5px;width:10px;height:10px;
  background:#1f2430;border-radius:2px;transform:translateX(-50%) rotate(45deg);
}
.site-tip-pop.above::before{top:auto;bottom:-5px}

/* ===== 博客：文章列表 / 文章详情 ===== */
/* 博客页面使用自身两栏，隐藏外层右栏，主区通栏 */
.app.page-articles,.app.page-article{grid-template-columns:minmax(0,1fr)}
.app.page-articles .rail,.app.page-article .rail{display:none}
.blog-wrap{display:grid;grid-template-columns:minmax(0,1fr) 272px;gap:20px;align-items:start;min-width:0}
.blog-main{display:flex;flex-direction:column;gap:16px;min-width:0}

/* 列表页 Hero */
.blog-hero{position:relative;overflow:hidden;padding:28px 30px 24px;border-radius:20px;
  background:linear-gradient(150deg,var(--primary-light),var(--panel) 62%);
  border:1px solid var(--card-border);box-shadow:var(--shadow-sm)}
.blog-hero::before{content:"";position:absolute;right:-70px;top:-110px;width:300px;height:300px;border-radius:50%;
  background:radial-gradient(circle,var(--glow-1),transparent 68%);pointer-events:none}
.blog-hero::after{content:"";position:absolute;left:-50px;bottom:-130px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,var(--glow-2),transparent 70%);pointer-events:none}
.bh-copy{position:relative;z-index:1}
.bh-tag{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px;border-radius:999px;
  font-size:11.5px;font-weight:700;letter-spacing:.3px;color:var(--accent);
  background:var(--surface);border:1px solid var(--card-border)}
.blog-hero h1{margin:12px 0 6px;font-size:clamp(24px,3vw,34px);font-weight:800;letter-spacing:-.7px;line-height:1.25}
.blog-hero p{margin:0;font-size:13.5px;color:var(--text-2)}
.blog-hero p b{color:var(--accent);font-weight:800}
.bh-search{position:relative;z-index:1;display:flex;align-items:center;gap:9px;max-width:520px;height:46px;
  margin-top:20px;padding:0 6px 0 15px;border-radius:999px;background:var(--surface);
  border:1px solid var(--card-border);box-shadow:var(--shadow-sm);transition:border-color .2s,box-shadow .2s}
.bh-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px var(--glow-1)}
.bh-search>i{color:var(--muted);font-size:15px}
.bh-search input{flex:1;min-width:0;height:100%;border:0;background:none;outline:none;color:var(--text);font-size:13.5px}
.bh-search input::placeholder{color:var(--muted)}
.bh-search button{flex:none;height:34px;padding:0 19px;border:0;border-radius:999px;background:var(--grad);
  color:#fff;font-size:12.5px;font-weight:700;cursor:pointer;box-shadow:0 6px 16px -8px rgba(99,102,241,.8);transition:transform .16s}
.bh-search button:active{transform:scale(.96)}
.bh-stats{position:relative;z-index:1;display:flex;gap:26px;flex-wrap:wrap;margin-top:20px}
.bh-stats span{display:flex;flex-direction:column;gap:1px;font-size:11px;color:var(--muted)}
.bh-stats b{font-size:19px;font-weight:800;letter-spacing:-.5px;color:var(--text);font-variant-numeric:tabular-nums}

/* 分类筛选 */
.blog-filter{display:flex;gap:8px;flex-wrap:wrap;padding:2px 0}
.blog-filter a{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 13px;border-radius:999px;
  background:var(--surface);border:1px solid var(--border);color:var(--text-2);font-size:12.5px;font-weight:600;
  transition:color .18s,border-color .18s,background .18s}
.blog-filter a i{font-style:normal;font-size:13px}
.blog-filter a em{font-style:normal;font-size:10.5px;color:var(--muted);font-weight:600}
.blog-filter a:hover{border-color:var(--accent);color:var(--accent)}
.blog-filter a.on{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 6px 16px -8px rgba(99,102,241,.85)}
.blog-filter a.on em{color:rgba(255,255,255,.82)}

/* 列表 */
.post-list{display:flex;flex-direction:column;gap:14px}
.post-feat{position:relative;display:block;overflow:hidden;border-radius:18px;padding:26px 28px;min-height:200px;
  color:#fff;background:var(--hero-grad);box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}
.post-feat::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,rgba(12,14,24,.62),rgba(12,14,24,.18) 72%)}
.post-feat:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.pf-ico{position:absolute;right:18px;bottom:-34px;z-index:0;font-size:170px;line-height:1;color:rgba(255,255,255,.13)}
.pf-body{position:relative;z-index:1;display:block;max-width:660px}
.pf-badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pf-badges b,.pf-badges i{font-style:normal;display:inline-flex;align-items:center;height:22px;padding:0 9px;
  border-radius:6px;font-size:11px;font-weight:700;letter-spacing:.2px}
.pf-badges b{background:#fff;color:#4f46e5}
.pf-badges i{background:rgba(255,255,255,.22);color:#fff;border:1px solid rgba(255,255,255,.3)}
.pf-badges em{font-style:normal;font-size:11.5px;color:rgba(255,255,255,.8)}
.post-feat h2{margin:11px 0 8px;font-size:clamp(19px,2.2vw,24px);font-weight:800;line-height:1.4;letter-spacing:-.3px}
.pf-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-size:13px;line-height:1.75;color:rgba(255,255,255,.82)}
.pf-meta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:16px;font-size:11.5px;color:rgba(255,255,255,.76)}
.pf-meta i{margin-right:4px}
.pf-more{margin-left:auto;font-style:normal;font-weight:700;color:#fff;display:inline-flex;align-items:center;gap:5px}
.pf-more i{transition:transform .2s}
.post-feat:hover .pf-more i{transform:translateX(4px)}

.post-card{display:grid;grid-template-columns:224px minmax(0,1fr);gap:18px;padding:13px;border-radius:16px;
  background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-sm);
  transition:transform .2s,border-color .2s,box-shadow .2s}
.post-card:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:var(--shadow)}
.pc-cover{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;flex-direction:column;
  aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:var(--bg);border:1px solid var(--card-border)}
.pc-cover img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.22,.61,.36,1)}
.post-card:hover .pc-cover img{transform:scale(1.05)}
.pc-cover.ph{background:linear-gradient(150deg,var(--primary-light),var(--surface-2))}
.pc-cover.ph>i{font-size:34px;color:var(--accent);opacity:.9}
.pc-cover.ph>em{font-style:normal;font-size:11.5px;font-weight:700;letter-spacing:.6px;color:var(--text-2)}
.pc-bdg{position:absolute;left:8px;top:8px;z-index:1;display:inline-flex;align-items:center;height:20px;padding:0 8px;
  border-radius:6px;background:#f43f5e;color:#fff;font-size:10.5px;font-weight:700;box-shadow:0 4px 10px -4px rgba(244,63,94,.9)}
.pc-body{display:flex;flex-direction:column;min-width:0;padding:2px 4px 2px 0}
.pc-cat{align-self:flex-start;display:inline-flex;align-items:center;height:23px;padding:0 9px;border-radius:6px;
  font-size:11px;font-weight:700;color:var(--accent);background:var(--primary-light);border:1px solid transparent}
.pc-body h2{margin:8px 0 6px;font-size:17px;font-weight:800;line-height:1.45;letter-spacing:-.2px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--text)}
.post-card:hover .pc-body h2{color:var(--accent)}
.pc-desc{font-size:12.5px;line-height:1.7;color:var(--muted);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pc-meta{margin-top:auto;padding-top:10px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  font-size:11px;color:var(--muted)}
.pc-meta i{margin-right:4px}
.pc-more{margin-left:auto;font-style:normal;font-weight:700;color:var(--accent);display:inline-flex;align-items:center;gap:5px}
.pc-more i{transition:transform .2s}
.post-card:hover .pc-more i{transform:translateX(3px)}

/* 博客侧栏 */
.blog-side{position:sticky;top:calc(var(--top) + 18px);display:flex;flex-direction:column;gap:14px;
  max-height:calc(100vh - var(--top) - 36px);overflow-y:auto;overflow-x:hidden;
  scrollbar-width:none;-ms-overflow-style:none}
.blog-side::-webkit-scrollbar{display:none}
.bs-card{position:relative;border-radius:16px;background:var(--panel);border:1px solid var(--border);
  padding:14px 15px;box-shadow:var(--shadow-sm)}
.bs-hd{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.bs-hd b{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:800;letter-spacing:-.2px}
.bs-hd b i{color:var(--accent);font-size:14px}
.bs-hd em{font-style:normal;font-size:10.5px;color:var(--muted)}

.bs-author{text-align:center;padding:20px 16px 16px;
  background:linear-gradient(160deg,var(--primary-light),var(--panel) 72%)}
.bs-ava{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 10px;border-radius:50%;
  font-size:28px;line-height:1;background:var(--grad);color:#fff;overflow:hidden;
  box-shadow:0 12px 26px -14px rgba(99,102,241,.95)}
.bs-ava img{width:100%;height:100%;object-fit:cover}
.bs-author>b{display:block;font-size:15px;font-weight:800;letter-spacing:-.2px}
.bs-author>em{display:block;margin-top:5px;font-style:normal;font-size:11.5px;line-height:1.7;color:var(--muted);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bs-nums{display:flex;justify-content:center;gap:20px;margin-top:13px;padding-top:12px;border-top:1px dashed var(--border)}
.bs-nums span{display:flex;flex-direction:column;gap:1px;font-size:10.5px;color:var(--muted)}
.bs-nums b{font-size:15px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums}

.bs-rank{display:flex;flex-direction:column;gap:2px}
.bs-rank a{display:flex;align-items:center;gap:9px;padding:7px 5px;border-radius:8px;font-size:12.5px;
  color:var(--text-2);transition:background .18s,color .18s}
.bs-rank a:hover{background:var(--primary-light);color:var(--accent)}
.bs-rank .rk{flex:none;width:18px;height:18px;border-radius:6px;display:grid;place-items:center;
  font-style:normal;font-size:10.5px;font-weight:800;color:var(--muted);background:var(--surface-2)}
.bs-rank .rk.hit{background:var(--grad);color:#fff}
.bs-rank .rt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bs-rank em{font-style:normal;font-size:10.5px;color:var(--muted)}

.bs-new a{display:block;padding:8px 5px;border-radius:8px;transition:background .18s}
.bs-new a:hover{background:var(--primary-light)}
.bs-new a+a{border-top:1px dashed var(--border)}
.bs-new b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-size:12.5px;font-weight:600;line-height:1.6;color:var(--text-2)}
.bs-new em{display:block;margin-top:3px;font-style:normal;font-size:10.5px;color:var(--muted)}

.bs-cats{display:flex;flex-wrap:wrap;gap:7px}
.bs-cats a{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 10px;border-radius:999px;
  background:var(--bg);border:1px solid var(--card-border);font-size:12px;color:var(--text-2);transition:all .18s}
.bs-cats a i{font-style:normal;font-size:12px}
.bs-cats a em{font-style:normal;font-size:10.5px;color:var(--muted)}
.bs-cats a:hover{color:var(--accent);border-color:var(--accent);background:var(--primary-light)}
.bs-cats a.on{color:#fff;background:var(--grad);border-color:transparent}
.bs-cats a.on em{color:rgba(255,255,255,.82)}

.bs-cta{text-align:center;background:linear-gradient(150deg,var(--primary-light),var(--panel) 72%)}
.bs-cta>i{font-size:22px;color:var(--accent)}
.bs-cta>b{display:block;margin-top:5px;font-size:13.5px}
.bs-cta>em{display:block;margin:4px 0 11px;font-style:normal;font-size:11px;line-height:1.6;color:var(--muted)}
.bs-cta .btn{width:100%;justify-content:center}
.bs-toc .toc{position:static;top:auto}

/* 文章详情 */
.post-detail{padding:30px 34px 26px;border-radius:18px;background:var(--panel);
  border:1px solid var(--border);box-shadow:var(--shadow-sm);overflow:hidden}
.pd-crumb{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:11.5px;color:var(--muted)}
.pd-crumb a{color:var(--muted);display:inline-flex;align-items:center;gap:4px}
.pd-crumb a:hover{color:var(--accent)}
.pd-crumb i{font-size:9.5px;opacity:.55}
.pd-badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:16px}
.pd-cat{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 10px;border-radius:6px;
  font-size:11px;font-weight:700;color:var(--accent);background:var(--primary-light)}
.pd-top{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:6px;
  font-size:11px;font-weight:700;color:#be123c;background:#fef2f4;border:1px solid #fbd0da}
.pd-title{margin:11px 0 16px;font-size:clamp(23px,3.2vw,33px);font-weight:800;line-height:1.38;
  letter-spacing:-.7px;color:var(--text)}
.pd-meta{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin-bottom:22px;padding-bottom:18px;border-bottom:1px dashed var(--border)}
.pd-author{display:flex;align-items:center;gap:10px;min-width:0}
.pda{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  font-size:14px;font-weight:800;color:#fff;background:var(--grad);
  box-shadow:0 8px 20px -12px rgba(99,102,241,.95)}
.pd-author b{display:block;font-size:12.5px;font-weight:700;color:var(--text)}
.pd-author em{display:block;margin-top:1px;font-style:normal;font-size:11px;color:var(--muted)}
.pd-nums{display:flex;align-items:center;gap:15px;font-size:11.5px;color:var(--muted)}
.pd-nums i{margin-right:4px}
.pd-cover{width:100%;aspect-ratio:16/7;object-fit:cover;border-radius:14px;
  margin:0 0 22px;border:1px solid var(--card-border);background:var(--bg)}
.pd-lead{position:relative;margin:0 0 24px;padding:15px 18px 15px 48px;border-radius:12px;
  background:var(--primary-light);border:1px solid var(--card-border);
  font-size:13.5px;line-height:1.85;color:var(--text-2)}
.pd-lead>i{position:absolute;left:15px;top:10px;font-size:24px;color:var(--accent);opacity:.65}
.pd-lead p{margin:0}

/* 正文排版 */
.pd-body{font-size:15.5px;line-height:1.95;color:var(--text)}
.pd-body h1,.pd-body h2,.pd-body h3,.pd-body h4{margin:32px 0 13px;line-height:1.45;
  font-weight:800;letter-spacing:-.3px;color:var(--text)}
.pd-body h2{font-size:22px;padding-left:13px;border-left:3px solid var(--accent);border-radius:2px}
.pd-body h3{font-size:18px}
.pd-body h4{font-size:16px}
.pd-body p{margin:14px 0}
.pd-body ul,.pd-body ol{margin:14px 0 14px 1.5em;padding:0}
.pd-body li{margin:9px 0}
.pd-body li::marker{color:var(--accent);font-weight:700}
.pd-body a{color:var(--accent);font-weight:600;text-decoration:none;border-bottom:1px solid transparent;
  transition:border-color .18s}
.pd-body a:hover{border-bottom-color:var(--accent)}
.pd-body img{max-width:100%;height:auto;border-radius:12px;margin:12px 0;border:1px solid var(--card-border)}
.pd-body blockquote,.pd-body .md-quote{margin:18px 0;padding:13px 18px;border-radius:0 12px 12px 0;
  border-left:3px solid var(--accent);background:var(--primary-light);color:var(--text-2)}
.pd-body blockquote p{margin:0}
.pd-body code{padding:2px 6px;border-radius:6px;background:var(--bg);border:1px solid var(--card-border);
  font-family:ui-monospace,Consolas,monospace;font-size:.86em}
.pd-body pre,.pd-body .md-pre{margin:18px 0;padding:15px 17px;border-radius:12px;overflow:auto;
  background:#1f2330;border:1px solid #2b3142}
.pd-body pre code{padding:0;border:0;background:none;color:#d8e6ff;font-size:13px}
.pd-body hr{border:0;border-top:1px dashed var(--border);margin:26px 0}
.pd-body table{width:100%;border-collapse:collapse;font-size:13.5px;margin:16px 0}
.pd-body th,.pd-body td{border:1px solid var(--border);padding:9px 13px;text-align:left}
.pd-body th{background:var(--bg);font-weight:700}
.pd-body strong{color:var(--text)}

.pd-tags{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:26px;padding-top:20px;
  border-top:1px dashed var(--border)}
.pd-tags>span{font-size:11.5px;color:var(--muted);display:inline-flex;align-items:center;gap:4px}
.pd-tags a{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:999px;
  font-size:11.5px;color:var(--text-2);background:var(--bg);border:1px solid var(--card-border);transition:all .18s}
.pd-tags a:hover{color:var(--accent);border-color:var(--accent);background:var(--primary-light)}

.pd-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.pd-actions .btn.like{color:#be123c;background:#fef2f4;border-color:#fbd0da}
.pd-actions .btn.like em{font-style:normal;font-weight:800}
.pd-actions .btn.like:hover{color:#fff;background:#f43f5e;border-color:#f43f5e}
.pd-actions .btn.like.on,.pd-actions .btn.like.is-liked{color:#fff;background:#f43f5e;border-color:#f43f5e}

/* 上一篇 / 下一篇 */
.pd-nx{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pd-nx .pn{display:block;min-width:0;padding:14px 17px;border-radius:14px;background:var(--panel);
  border:1px solid var(--border);box-shadow:var(--shadow-sm);transition:transform .2s,border-color .2s,box-shadow .2s}
.pd-nx .pn:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:var(--shadow)}
.pd-nx .pn em{display:flex;align-items:center;gap:5px;font-style:normal;font-size:10.5px;color:var(--muted);margin-bottom:5px}
.pd-nx .pn.next em{justify-content:flex-end}
.pd-nx .pn b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-size:13px;font-weight:700;line-height:1.55;color:var(--text-2)}
.pd-nx .pn:hover b{color:var(--accent)}
.pd-nx .pn.dis{opacity:.5;pointer-events:none;box-shadow:none}

/* 相关推荐 */
.rel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.rel-card{display:flex;gap:12px;padding:12px;border-radius:14px;background:var(--panel);
  border:1px solid var(--border);box-shadow:var(--shadow-sm);transition:transform .2s,border-color .2s,box-shadow .2s;min-width:0}
.rel-card:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:var(--shadow)}
.rc-cover{flex:none;width:88px;height:68px;border-radius:10px;overflow:hidden;display:grid;place-items:center;
  font-size:24px;color:var(--accent);background:linear-gradient(150deg,var(--primary-light),var(--surface-2));
  border:1px solid var(--card-border)}
.rc-cover img{width:100%;height:100%;object-fit:cover}
.rc-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.rc-body em{font-style:normal;font-size:10.5px;font-weight:700;color:var(--accent)}
.rc-body b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-size:13px;font-weight:700;line-height:1.5;color:var(--text)}
.rc-body span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 暗色下的红色系徽标（置顶 / 点赞） */
html[data-theme="dark"] .pd-top{color:#fb7185;background:rgba(244,63,94,.14);border-color:rgba(244,63,94,.28)}
html[data-theme="dark"] .pd-actions .btn.like{color:#fb7185;background:rgba(244,63,94,.14);border-color:rgba(244,63,94,.28)}
html[data-theme="dark"] .pd-body pre{background:#141821;border-color:#252b38}

@media(max-width:1100px){
  .blog-wrap{grid-template-columns:minmax(0,1fr)}
  .blog-side{position:static;max-height:none;overflow:visible;padding-right:0}
}
@media(max-width:760px){
  .blog-hero{padding:22px 18px 20px;border-radius:16px}
  .post-feat{padding:20px;min-height:0}
  .pf-ico{font-size:120px;bottom:-24px;right:6px}
  .pf-meta .pf-more{margin-left:0}
  .post-card{grid-template-columns:minmax(0,1fr);gap:13px;padding:12px}
  .pc-cover{aspect-ratio:auto;height:150px}
  .post-detail{padding:22px 18px 20px}
  .pd-nx,.rel-grid{grid-template-columns:minmax(0,1fr)}
  .pd-nums{gap:12px}
  .pd-actions .btn{flex:1;justify-content:center}
}


/* ===== 公告中心（.nt-*） ===== */
.nt-wrap{display:flex;flex-direction:column;gap:18px;min-width:0}

.nt-hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 240px;align-items:center;gap:20px;
  overflow:hidden;padding:34px 34px 30px;border-radius:22px;
  background:linear-gradient(140deg,var(--primary-light),var(--panel) 58%);
  border:1px solid var(--card-border);box-shadow:var(--shadow-sm)}
.nt-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(760px 320px at 88% 12%,var(--glow-1),transparent 70%),
             radial-gradient(520px 260px at 6% 96%,var(--glow-2),transparent 72%)}
.nt-hero-copy{position:relative;z-index:1;min-width:0}
.nt-eyebrow{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 12px;border-radius:999px;
  font-size:11.5px;font-weight:700;letter-spacing:.4px;color:var(--accent);
  background:var(--surface);border:1px solid var(--card-border)}
.nt-eyebrow i{animation:nt-blink 2.4s ease-in-out infinite}
.nt-hero h1{margin:14px 0 8px;font-size:clamp(25px,3.4vw,38px);line-height:1.24;font-weight:800;letter-spacing:-1px}
.nt-hero h1 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.nt-hero p{margin:0;max-width:56ch;font-size:13.5px;line-height:1.8;color:var(--text-2)}
.nt-stats{display:flex;gap:30px;flex-wrap:wrap;margin-top:22px}
.nt-stats .n{display:flex;flex-direction:column;gap:2px}
.nt-stats b{font-size:22px;font-weight:800;letter-spacing:-.6px;font-variant-numeric:tabular-nums;color:var(--text)}
.nt-stats span{font-size:11px;color:var(--muted)}

.nt-signal{position:relative;justify-self:center;width:210px;height:210px;flex:none}
.nt-signal .core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:74px;height:74px;border-radius:50%;display:grid;place-items:center;font-size:30px;color:#fff;
  background:var(--grad);box-shadow:0 16px 34px -14px rgba(99,102,241,.9);z-index:2}
.nt-signal .core::after{content:"";position:absolute;inset:-10px;border-radius:50%;
  background:var(--grad);opacity:.22;filter:blur(14px);z-index:-1;animation:nt-breathe 3.6s ease-in-out infinite}
.nt-signal .ring{position:absolute;left:50%;top:50%;border-radius:50%;border:1px solid var(--accent);
  opacity:0;transform:translate(-50%,-50%) scale(.55);animation:nt-ripple 4.2s cubic-bezier(.22,.61,.36,1) infinite}
.nt-signal .r1{width:74px;height:74px}
.nt-signal .r2{width:74px;height:74px;animation-delay:1.4s}
.nt-signal .r3{width:74px;height:74px;animation-delay:2.8s}
@keyframes nt-ripple{
  0%{opacity:.55;transform:translate(-50%,-50%) scale(.85)}
  70%{opacity:.12}
  100%{opacity:0;transform:translate(-50%,-50%) scale(2.7)}
}
@keyframes nt-breathe{0%,100%{opacity:.16;transform:scale(1)}50%{opacity:.34;transform:scale(1.14)}}
@keyframes nt-blink{0%,100%{opacity:1}50%{opacity:.35}}

/* 吸顶筛选 + 滚动进度 */
.nt-bar{position:sticky;top:calc(var(--top) + 10px);z-index:6;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:10px 12px;border-radius:14px;
  background:color-mix(in srgb,var(--panel) 82%,transparent);
  border:1px solid var(--border);box-shadow:var(--shadow-sm);
  backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3)}
@supports not (background:color-mix(in srgb,#fff 50%,transparent)){.nt-bar{background:var(--panel)}}
.nt-filters{display:flex;gap:7px;flex-wrap:wrap;min-width:0}
.nt-filters button{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:999px;
  border:1px solid var(--border);background:var(--surface);color:var(--text-2);
  font-size:12.5px;font-weight:600;cursor:pointer;transition:all .18s}
.nt-filters button em{font-style:normal;font-size:10.5px;font-weight:700;color:var(--muted);
  padding:0 5px;border-radius:999px;background:var(--bg)}
.nt-filters button:hover{color:var(--accent);border-color:var(--accent)}
.nt-filters button.on{color:#fff;border-color:transparent;background:var(--grad);
  box-shadow:0 8px 18px -10px rgba(99,102,241,.9)}
.nt-filters button.on em{color:#fff;background:rgba(255,255,255,.24)}
.nt-progress{flex:1 1 120px;height:4px;border-radius:999px;background:var(--bg);overflow:hidden}
.nt-progress i{display:block;width:0;height:100%;border-radius:999px;background:var(--grad);
  transition:width .12s linear}

/* 时间线 */
.nt-list{position:relative;display:flex;flex-direction:column;gap:13px;padding-left:46px}
.nt-list::before{content:"";position:absolute;left:20px;top:8px;bottom:8px;width:2px;border-radius:2px;
  background:linear-gradient(180deg,transparent,var(--accent) 12%,var(--accent-2,var(--accent)) 88%,transparent);
  opacity:.34}
.nt-item{position:relative;display:block;opacity:0;transform:translateY(16px)}
.nt-item.in{animation:nt-in .55s cubic-bezier(.22,.61,.36,1) forwards;animation-delay:calc(min(var(--i,1),8)*45ms)}
.nt-item.hide{display:none}
@keyframes nt-in{to{opacity:1;transform:none}}
.nt-node{position:absolute;left:-46px;top:18px;width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;font-size:15px;z-index:1;
  color:var(--accent);background:var(--panel);border:1px solid var(--card-border);
  box-shadow:0 0 0 4px var(--bg),0 8px 18px -12px rgba(28,31,39,.5);transition:transform .2s}
.nt-item:hover .nt-node{transform:scale(1.08)}
.nt-card{position:relative;overflow:hidden;padding:17px 20px 18px;border-radius:15px;
  background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-sm);
  transition:transform .22s,border-color .22s,box-shadow .22s}
.nt-card::after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);opacity:.85}
.nt-item:hover .nt-card{transform:translateY(-2px);border-color:var(--accent);box-shadow:var(--shadow)}
.nt-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:11.5px;color:var(--muted)}
.nt-badge{display:inline-flex;align-items:center;height:21px;padding:0 9px;border-radius:6px;
  font-size:10.5px;font-weight:700;letter-spacing:.3px;
  color:var(--accent);background:var(--primary-light);border:1px solid transparent}
.nt-date i{margin-right:4px}
.nt-no{margin-left:auto;font-family:ui-monospace,Consolas,monospace;font-size:10.5px;letter-spacing:.6px;opacity:.7}
.nt-card h2{margin:9px 0 0;font-size:16.5px;font-weight:800;line-height:1.5;letter-spacing:-.2px;color:var(--text)}
.nt-card p{margin:8px 0 0;font-size:13px;line-height:1.9;color:var(--text-2);white-space:normal}

/* 类型配色 */
.nt-item.warn .nt-card::after{background:var(--warn)}
.nt-item.warn .nt-badge{color:#b45309;background:#fff7ed;border-color:#fde3bd}
.nt-item.warn .nt-node{color:#d97706;background:#fff7ed;border-color:#fde3bd}
.nt-item.danger .nt-card::after{background:var(--danger)}
.nt-item.danger .nt-badge{color:#be123c;background:#fef2f4;border-color:#fbd0da}
.nt-item.danger .nt-node{color:#e11d48;background:#fef2f4;border-color:#fbd0da}
.nt-item.success .nt-card::after{background:var(--ok)}
.nt-item.success .nt-badge{color:var(--ok-fg);background:var(--ok-bg);border-color:var(--ok-border)}
.nt-item.success .nt-node{color:var(--ok-fg);background:var(--ok-bg);border-color:var(--ok-border)}
html[data-theme="dark"] .nt-item.warn .nt-badge,
html[data-theme="dark"] .nt-item.warn .nt-node{color:#fbbf24;background:rgba(245,158,11,.14);border-color:rgba(245,158,11,.28)}
html[data-theme="dark"] .nt-item.danger .nt-badge,
html[data-theme="dark"] .nt-item.danger .nt-node{color:#fb7185;background:rgba(244,63,94,.14);border-color:rgba(244,63,94,.28)}

.nt-none{display:flex;flex-direction:column;align-items:center;gap:8px;padding:44px 20px;
  border-radius:16px;border:1px dashed var(--border);color:var(--muted);font-size:13px}
.nt-none[hidden]{display:none}
.nt-none i{font-size:26px;opacity:.55}

@media(max-width:860px){
  .nt-hero{grid-template-columns:minmax(0,1fr);padding:24px 20px 22px;border-radius:18px}
  .nt-signal{display:none}
  .nt-bar{top:calc(var(--top) + 6px);padding:9px 10px;gap:10px}
  .nt-progress{display:none}
  .nt-list{padding-left:36px}
  .nt-list::before{left:15px}
  .nt-node{left:-36px;width:30px;height:30px;font-size:13px}
  .nt-card{padding:14px 15px 15px}
  .nt-card h2{font-size:15px}
  .nt-no{display:none}
}

/* ===== 赞助墙（.sw-*） ===== */
.sw-wrap{display:flex;flex-direction:column;gap:18px;min-width:0}

.sw-hero{position:relative;overflow:hidden;padding:36px 34px 32px;border-radius:22px;
  background:var(--hero-grad);color:#fff;box-shadow:var(--shadow)}
.sw-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(680px 300px at 82% 6%,rgba(255,255,255,.20),transparent 68%),
             linear-gradient(115deg,rgba(12,14,24,.42),rgba(12,14,24,.12) 70%)}
.sw-hero-copy{position:relative;z-index:1;max-width:640px}
.sw-eyebrow{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 12px;border-radius:999px;
  font-size:11.5px;font-weight:700;letter-spacing:.4px;
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32);color:#fff}
.sw-eyebrow i{animation:sw-twinkle 2.8s ease-in-out infinite}
.sw-hero h1{margin:14px 0 8px;font-size:clamp(25px,3.4vw,38px);line-height:1.24;font-weight:800;letter-spacing:-1px}
.sw-hero h1 em{font-style:normal;color:#fff;text-shadow:0 6px 26px rgba(255,255,255,.45);
  border-bottom:2px dashed rgba(255,255,255,.5);padding-bottom:1px}
.sw-hero p{margin:0;font-size:13.5px;line-height:1.8;color:rgba(255,255,255,.85)}
.sw-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.sw-btn{border-radius:999px}
.sw-btn.ghost{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.34);color:#fff}
.sw-btn.ghost:hover{background:rgba(255,255,255,.26)}

.sw-nums{position:relative;z-index:1;display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}
.sw-nums .n{min-width:132px;padding:12px 16px;border-radius:14px;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.sw-nums b{display:block;font-size:21px;font-weight:800;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.sw-nums span{display:block;margin-top:2px;font-size:11px;color:rgba(255,255,255,.76)}

.sw-orbit{position:absolute;right:-40px;top:50%;transform:translateY(-50%);width:330px;height:330px;pointer-events:none}
.sw-orbit .o{position:absolute;left:50%;top:50%;border-radius:50%;border:1px solid rgba(255,255,255,.22);
  transform:translate(-50%,-50%)}
.sw-orbit .o1{width:150px;height:150px}
.sw-orbit .o2{width:230px;height:230px;border-style:dashed;animation:sw-spin 26s linear infinite}
.sw-orbit .o3{width:310px;height:310px;animation:sw-spin 40s linear infinite reverse}
.sw-orbit .o::after{content:"";position:absolute;left:50%;top:-4px;width:8px;height:8px;margin-left:-4px;
  border-radius:50%;background:#fff;box-shadow:0 0 14px 3px rgba(255,255,255,.8)}
.sw-orbit .heart{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-size:38px;color:#fff;opacity:.92;animation:sw-thump 2.6s ease-in-out infinite}
@keyframes sw-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes sw-thump{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.12)}}
@keyframes sw-twinkle{0%,100%{transform:rotate(0) scale(1);opacity:1}50%{transform:rotate(12deg) scale(.86);opacity:.7}}

/* 星光滚动墙 */
.sw-marquee{position:relative;overflow:hidden;padding:14px 0;border-radius:16px;
  background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.sw-marquee::before,.sw-marquee::after{content:"";position:absolute;top:0;bottom:0;width:64px;z-index:2;pointer-events:none}
.sw-marquee::before{left:0;background:linear-gradient(90deg,var(--panel),transparent)}
.sw-marquee::after{right:0;background:linear-gradient(270deg,var(--panel),transparent)}
.sw-track{display:flex;align-items:center;gap:10px;width:max-content;padding:0 12px;
  animation:sw-marquee 38s linear infinite}
.sw-marquee:hover .sw-track{animation-play-state:paused}
.sw-chip{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 15px 0 6px;border-radius:999px;
  background:var(--bg);border:1px solid var(--card-border);white-space:nowrap;transition:all .2s}
.sw-chip:hover{border-color:var(--accent);background:var(--primary-light);transform:translateY(-2px)}
.sw-chip .av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:14px;font-style:normal;
  background:var(--surface);border:1px solid var(--card-border)}
.sw-chip b{font-size:12.5px;font-weight:700;color:var(--text-2)}
.sw-chip em{font-style:normal;font-size:11px;font-weight:700;color:var(--accent)}
@keyframes sw-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* 排行榜 */
.sw-board{padding:18px 20px 14px;border-radius:18px;background:var(--panel);
  border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.sw-rows{display:flex;flex-direction:column;margin-top:4px}
.sw-row{display:flex;align-items:center;gap:12px;padding:11px 8px;border-radius:11px;
  opacity:0;transform:translateY(10px);transition:background .18s}
.sw-row.in{animation:nt-in .5s cubic-bezier(.22,.61,.36,1) forwards;
  animation-delay:calc(min(var(--i,1),9)*60ms)}
.sw-row:hover{background:var(--primary-light)}
.sw-row + .sw-row{border-top:1px dashed var(--border)}
.sw-rank{flex:none;width:30px;text-align:center;font-size:12px;font-weight:800;color:var(--muted);
  font-family:ui-monospace,Consolas,monospace;font-style:normal}
.sw-row.podium .sw-rank{font-size:16px}
.sw-row.p1 .sw-rank{color:#f59e0b}
.sw-row.p2 .sw-rank{color:#94a3b8}
.sw-row.p3 .sw-rank{color:#d97706}
.sw-av{flex:none;width:40px;height:40px;border-radius:13px;display:grid;place-items:center;font-size:18px;
  background:var(--surface-2);border:1px solid var(--card-border)}
.sw-row.p1 .sw-av{background:linear-gradient(140deg,#fde68a,#fbbf24);border-color:#f5c56a;
  box-shadow:0 10px 22px -14px rgba(245,158,11,.95)}
.sw-row.p2 .sw-av{background:linear-gradient(140deg,#eef2f7,#cbd5e1);border-color:#cfd8e3}
.sw-row.p3 .sw-av{background:linear-gradient(140deg,#fed7aa,#fdba74);border-color:#f6c69b}
.sw-name{flex:none;max-width:32%;min-width:0;font-size:13px;font-weight:700;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sw-name a{color:inherit}
.sw-name a:hover{color:var(--accent)}
.sw-meter{flex:1 1 auto;min-width:60px;height:7px;border-radius:999px;background:var(--bg);overflow:hidden}
.sw-meter i{display:block;width:0;height:100%;border-radius:999px;background:var(--grad);
  transition:width 1s cubic-bezier(.22,.61,.36,1)}
.sw-row.in .sw-meter i{width:var(--w,0%)}
.sw-row.p1 .sw-meter i{background:linear-gradient(90deg,#fbbf24,#f97316)}
.sw-row.p2 .sw-meter i{background:linear-gradient(90deg,#cbd5e1,#94a3b8)}
.sw-row.p3 .sw-meter i{background:linear-gradient(90deg,#fdba74,#ea580c)}
.sw-amt{flex:none;min-width:70px;text-align:right;font-size:14px;font-weight:800;letter-spacing:-.3px;
  color:var(--accent);font-variant-numeric:tabular-nums}

/* 致谢 */
.sw-thanks{border-radius:18px;border:1px dashed var(--card-border);background:var(--panel);
  padding:22px 24px}
.sw-thanks-in{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.sw-thanks-in>i{font-size:26px;color:var(--accent);opacity:.5}
.sw-thanks-in p{margin:0;max-width:56ch;font-size:13px;line-height:1.9;color:var(--text-2)}

@media(max-width:860px){
  .sw-hero{padding:24px 20px 24px;border-radius:18px}
  .sw-orbit{display:none}
  .sw-nums .n{flex:1 1 0;min-width:0;padding:10px 12px}
  .sw-nums b{font-size:18px}
  .sw-name{max-width:38%}
  .sw-board{padding:14px 13px 10px}
  .sw-row{gap:9px;padding:10px 4px}
  .sw-meter{display:none}
  .sw-amt{min-width:56px;font-size:13px}
}

/* ===== 赞助墙 Buy Me a Coffee（.bmc-*） ===== */
.bmc-wrap{position:relative;display:flex;flex-direction:column;gap:16px;min-width:0}
.bmc-wrap>*:not(.bmc-snow):not(.bmc-float):not(.bmc-fab){position:relative;z-index:1}

/* 雪花层：用赞助者「图标 + 站点名」做成小胶囊飘落粒子（fixed，不挡点击） */
.bmc-snow{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:2}
.bmc-flake{position:absolute;top:-16vh;display:inline-flex;align-items:center;gap:.4em;
  max-width:12em;padding:.24em .6em .24em .28em;border-radius:999px;
  background:rgba(255,255,255,.78);border:1px solid rgba(99,102,241,.14);
  box-shadow:0 6px 18px rgba(28,31,39,.05);white-space:nowrap;
  font-style:normal;line-height:1;color:var(--accent);
  will-change:transform;animation:bmc-fall var(--dur,24s) linear var(--delay,0s) infinite}
.bmc-fl-ico{display:inline-grid;place-items:center;flex:none;width:1.75em;height:1.75em;
  border-radius:50%;overflow:hidden;background:rgba(99,102,241,.1);font-style:normal;font-size:1em;
  animation:bmc-flspin 9s linear infinite}
.bmc-fl-ico img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.bmc-fl-t{font-size:.92em;font-weight:700;font-style:normal;color:var(--text-2);
  letter-spacing:.1px;min-width:0;overflow:hidden;text-overflow:ellipsis}
@keyframes bmc-fall{
  0%{transform:translate3d(0,-16vh,0) rotate(0)}
  100%{transform:translate3d(var(--drift,20px),112vh,0) rotate(10deg)}
}
@keyframes bmc-flspin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* Hero */
.bmc-hero{position:relative;display:flex;align-items:center;gap:26px;overflow:hidden;
  padding:32px 34px;border-radius:22px;background:linear-gradient(125deg,#4f46e5,#7c3aed 46%,#db2777);
  box-shadow:0 22px 54px rgba(79,70,229,.28)}
.bmc-hero::after{content:"";position:absolute;inset:auto -60px -120px auto;width:340px;height:340px;
  border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.26),transparent 68%);pointer-events:none}
.bmc-hero-tx{position:relative;z-index:1;flex:1 1 auto;min-width:0}
.bmc-tag{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 12px;border-radius:999px;
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);
  color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.2px}
.bmc-hero h1{margin:13px 0 8px;font-size:clamp(26px,3.4vw,40px);line-height:1.2;font-weight:800;
  letter-spacing:-1.2px;color:#fff}
.bmc-hero h1 em{font-style:normal;color:#ffe9a8;text-shadow:0 6px 24px rgba(255,214,102,.45)}
.bmc-hero p{margin:0;max-width:56ch;font-size:13.5px;line-height:1.8;color:rgba(255,255,255,.86)}
.bmc-hero p.bmc-note{margin-top:7px;max-width:62ch;font-size:12.5px;line-height:1.75;color:rgba(255,255,255,.72)}

/* 咖啡杯插画 */
.bmc-cup{position:relative;flex:0 0 132px;width:132px;height:132px;display:grid;place-items:center}
.cup-body{position:relative;z-index:2;display:grid;place-items:center;width:96px;height:96px;border-radius:26px;
  background:linear-gradient(160deg,rgba(255,255,255,.96),rgba(255,255,255,.78));
  box-shadow:0 18px 40px rgba(15,23,42,.28),inset 0 0 0 1px rgba(255,255,255,.9);
  font-size:42px;color:#6d28d9}
.cup-saucer{position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:104px;height:12px;
  border-radius:50%;background:rgba(255,255,255,.34);filter:blur(1px)}
.steam{position:absolute;top:-6px;width:8px;height:26px;border-radius:8px;
  background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,0));
  animation:bmc-steam 3.4s ease-in-out infinite;opacity:.75}
.steam.s1{left:38px;animation-delay:0s}
.steam.s2{left:58px;animation-delay:.9s}
.steam.s3{left:78px;animation-delay:1.7s}
@keyframes bmc-steam{
  0%{transform:translateY(6px) scaleY(.7);opacity:0}
  35%{opacity:.8}
  100%{transform:translateY(-22px) scaleY(1.15);opacity:0}
}
.spark{position:absolute;color:rgba(255,255,255,.8);font-size:13px;animation:bmc-twinkle 3s ease-in-out infinite}
.spark.p1{top:6px;right:6px}
.spark.p2{bottom:26px;left:0;font-size:10px;animation-delay:1s}
.spark.p3{top:44px;right:-4px;font-size:9px;animation-delay:1.8s}
@keyframes bmc-twinkle{0%,100%{opacity:.25;transform:scale(.9)}50%{opacity:1;transform:scale(1.15)}}

/* 悬浮赞助卡：电脑端贴右上角（top:84px / right:24px），手机端由下方媒体查询改为全宽 */
.bmc-float{position:fixed;top:84px;right:24px;left:auto;margin:0;z-index:130;display:flex;flex-direction:column;
  width:670px;max-width:calc(100vw - 48px);height:545px;max-height:calc(100vh - 104px);
  border-radius:18px;background:var(--panel);border:1px solid var(--card-border);
  box-shadow:0 24px 64px rgba(15,23,42,.22);overflow:hidden}
.bmc-float[hidden]{display:none}
.bmc-float-hd{flex:none;display:flex;align-items:center;gap:10px;padding:12px 14px 12px 18px;
  border-bottom:1px solid var(--border);background:linear-gradient(120deg,rgba(99,102,241,.09),rgba(219,39,119,.06))}
.bmc-float-hc{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:7px}
.bmc-float-hc i{color:var(--accent);font-size:15px}
.bmc-float-hc b{font-size:14px;font-weight:800;color:var(--text)}
.bmc-float-hc em{font-style:normal;font-size:11.5px;color:var(--muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bmc-float-x{flex:none;display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--border);
  border-radius:9px;background:var(--bg);color:var(--text-2);font-size:11px;cursor:pointer;
  transition:all .16s ease}
.bmc-float-x:hover{border-color:var(--accent);color:var(--accent)}
.bmc-float-b{flex:1 1 auto;min-height:0;overflow-y:auto;scrollbar-width:none;padding:14px 18px 18px}
.bmc-float-b::-webkit-scrollbar{display:none}
/* 「赞助支持」悬浮按钮：渐变流光 + 呼吸光圈 + 高光扫过 + 咖啡杯摇动 */
.bmc-fab{position:fixed;top:84px;right:24px;z-index:131;display:inline-flex;align-items:center;gap:7px;
  height:44px;padding:0 20px 0 18px;border:0;border-radius:999px;
  background:linear-gradient(115deg,#6366f1 0%,#8b5cf6 32%,#d946ef 62%,#6366f1 100%);
  background-size:260% 100%;color:#fff;font-size:13px;font-weight:800;letter-spacing:.3px;
  cursor:pointer;font-family:inherit;overflow:hidden;isolation:isolate;
  box-shadow:0 12px 28px rgba(99,102,241,.42),0 2px 8px rgba(217,70,239,.3);
  animation:bmcFabFlow 8s linear infinite,bmcFabFloat 3.6s ease-in-out infinite,bmcFabGlow 2.9s ease-in-out infinite;
  transition:transform .2s ease,box-shadow .24s ease}
.bmc-fab[hidden]{display:none!important}
.bmc-fab>i,.bmc-fab>span{position:relative;z-index:2}
.bmc-fab>i{font-size:15px;transform-origin:50% 88%;animation:bmcFabCup 3.2s ease-in-out infinite}
/* 高光扫过：周期性的白色斜向流光（在内层，被圆角裁切） */
.bmc-fab::after{content:"";position:absolute;top:-45%;left:-70%;width:42%;height:190%;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
  transform:rotate(16deg);animation:bmcFabShine 5.2s ease-in-out infinite}
.bmc-fab:hover{transform:translateY(-2px) scale(1.035);
  box-shadow:0 18px 40px rgba(99,102,241,.52),0 4px 12px rgba(217,70,239,.36)}
.bmc-fab:focus-visible{outline:2px solid #fff;outline-offset:2px}
@keyframes bmcFabFlow{to{background-position:260% 0}}
@keyframes bmcFabFloat{0%,100%{translate:0 0}50%{translate:0 -4px}}
/* 呼吸光晕：用 filter 做外发光，避免被按钮的 overflow:hidden 裁掉 */
@keyframes bmcFabGlow{0%,100%{filter:drop-shadow(0 0 0 rgba(168,85,247,0))}
  50%{filter:drop-shadow(0 0 12px rgba(168,85,247,.62))}}
@keyframes bmcFabShine{0%,72%{left:-70%}86%,100%{left:130%}}
@keyframes bmcFabCup{0%,66%,100%{transform:rotate(0) translateY(0)}
  74%{transform:rotate(-14deg) translateY(-3px)}
  82%{transform:rotate(10deg) translateY(-2px)}
  90%{transform:rotate(-6deg) translateY(0)}}
@media(prefers-reduced-motion:reduce){
  .bmc-fab,.bmc-fab::after,.bmc-fab>i{animation:none}
}

/* 申请赞助：左站点信息 + 右金额与说明（悬浮卡内两列） */
.bmc-apply{display:grid;grid-template-columns:minmax(0,1fr) 252px;gap:16px;align-items:start}
.bmc-form{display:flex;flex-direction:column;gap:4px;min-width:0}
.bmc-fh{display:flex;align-items:center;gap:7px;margin-bottom:6px;font-size:13.5px;font-weight:800;color:var(--text)}
.bmc-fh i{color:var(--accent);font-size:14px}
.bmc-fl{margin-top:6px;font-size:11.5px;font-weight:600;color:var(--text-2)}
.bmc-form .sb-input{width:100%}
.bmc-form textarea.sb-input{resize:none;min-height:58px;font-family:inherit;line-height:1.6}
.bmc-err{margin:6px 0 0;font-size:11.5px;line-height:1.6;color:#ef4444}
.bmc-err[hidden]{display:none}
.bmc-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bmc-two>div{min-width:0}
.bmc-urln{display:flex;gap:6px}
.bmc-urln .sb-input{flex:1 1 auto;min-width:0}
.bmc-fetch{flex:none;display:inline-flex;align-items:center;gap:5px;height:38px;padding:0 11px;
  border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--text-2);
  font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap;
  transition:all .16s ease}
.bmc-fetch:hover{border-color:var(--accent);color:var(--accent)}
.bmc-fetch:disabled{opacity:.6;cursor:default}
.bmc-fetch-tip{margin-top:5px;font-size:10.5px;line-height:1.6;color:var(--muted)}
.bmc-fetch-tip.bad{color:#ef4444}
/* 站点分类选择按钮（打开分类弹窗） */
.bmc-pick{display:flex;align-items:center;gap:6px;width:100%;height:38px;padding:0 11px;
  border-radius:9px;border:1px solid var(--border);background:var(--bg);color:var(--text);
  font-family:inherit;font-size:12.5px;cursor:pointer;text-align:left;transition:border-color .16s ease}
.bmc-pick:hover{border-color:var(--accent)}
.bmc-pick>span{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bmc-pick>i{flex:none;font-size:11px;color:var(--muted)}

.bmc-paycard{display:flex;flex-direction:column;gap:11px;min-width:0;padding-left:16px;
  border-left:1px solid var(--border)}
.bmc-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.bmc-chips button{height:36px;border-radius:9px;border:1px solid var(--border);background:var(--bg);
  color:var(--text-2);font-size:12.5px;font-weight:700;cursor:pointer;font-family:inherit;
  transition:all .16s ease}
.bmc-chips button:hover{border-color:var(--accent);color:var(--accent)}
.bmc-chips button.on{background:var(--grad);border-color:transparent;color:#fff;
  box-shadow:0 6px 16px rgba(99,102,241,.28)}
.bmc-custom{width:100%;height:38px}
.bmc-custom[hidden]{display:none}
/* 永久收录价签：蓝色描边 + 右上角勾选角标（与后台设置预览一致） */
.bmc-forever{position:relative;display:flex;flex-direction:column;gap:6px;cursor:pointer;user-select:none}
.bmc-forever>input{position:absolute;width:0;height:0;opacity:0}
.bmc-fv-tag{position:relative;display:inline-flex;align-items:center;gap:7px;align-self:flex-start;
  padding:6px 24px 6px 14px;border-radius:11px;border:2px solid #4a90ff;background:#f6f9ff;
  color:#f43f5e;font-weight:800;font-size:12.5px;transition:background .2s ease,box-shadow .2s ease}
.bmc-fv-name{font-size:12.5px;letter-spacing:.2px}
.bmc-fv-now{font-size:15px;color:#f43f5e;font-variant-numeric:tabular-nums}
.bmc-fv-old{font-size:11.5px;font-weight:600;color:#f08a9d;text-decoration:line-through}
.bmc-fv-ck{position:absolute;right:-9px;top:-9px;width:20px;height:20px;border-radius:50%;
  background:#4a90ff;color:#fff;display:grid;place-items:center;font-size:10px;font-style:normal;
  border:2px solid #fff;box-shadow:0 3px 8px rgba(74,144,255,.4);
  opacity:0;transform:scale(.55);transition:opacity .18s ease,transform .18s ease}
.bmc-forever>input:checked+.bmc-fv-tag{background:#eef6ff;box-shadow:0 6px 16px rgba(74,144,255,.2)}
.bmc-forever>input:checked+.bmc-fv-tag .bmc-fv-ck{opacity:1;transform:scale(1)}
.bmc-fv-note{font-style:normal;font-size:10.5px;line-height:1.55;color:var(--text-2)}
.bmc-sumadd{background:transparent;padding:0 4px}
.bmc-sumadd b{font-size:13.5px;color:#4a90ff}
.bmc-totalrow{background:rgba(99,102,241,.09);border:1px solid rgba(99,102,241,.18)}
.bmc-rules{list-style:none;margin:0;padding:9px 11px;border-radius:12px;background:var(--bg);
  border:1px dashed var(--border);display:flex;flex-direction:column;gap:5px;counter-reset:bmcr}
.bmc-rules li{position:relative;padding-left:14px;font-size:11px;line-height:1.55;color:var(--text-2)}
.bmc-rules li::before{content:"";position:absolute;left:0;top:6px;width:5px;height:5px;border-radius:50%;
  background:var(--accent);opacity:.7}
.bmc-rules li em{font-style:normal;font-weight:700;color:var(--text)}
/* 金额三栏横向排布（赞助金额 / 永久收录加价 / 应付合计） */
.bmc-sums{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:6px}
.bmc-sumrow{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:1px;
  min-width:0;padding:7px 10px;border-radius:10px;background:rgba(99,102,241,.07)}
.bmc-sumrow[hidden]{display:none}
.bmc-sumrow span{font-size:10.5px;line-height:1.3;color:var(--text-2);white-space:nowrap}
.bmc-sumrow b{font-size:16px;line-height:1.15;font-weight:800;letter-spacing:-.4px;color:var(--accent);
  font-variant-numeric:tabular-nums}
.bmc-cta{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:42px;padding:0 18px;
  border:0;border-radius:12px;background:var(--grad);color:#fff;font-size:13.5px;font-weight:700;
  cursor:pointer;font-family:inherit;box-shadow:0 10px 26px rgba(99,102,241,.3);
  transition:transform .18s ease,box-shadow .18s ease;text-decoration:none}
.bmc-cta:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(99,102,241,.36)}
.bmc-cta i{font-size:13px}
.bmc-cta.full{width:100%}
.bmc-off{margin:0;font-size:12px;color:var(--muted);text-align:center}
.bmc-qr{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px;border-radius:13px;
  background:var(--bg);border:1px dashed var(--border)}
.bmc-qr img{width:132px;height:132px;object-fit:contain;border-radius:8px;background:#fff}
.bmc-qr span{font-size:10.5px;color:var(--muted)}

/* 榜单区块 */
.bmc-sec{padding:18px 20px 16px;border-radius:18px;background:var(--panel);
  border:1px solid var(--card-border);box-shadow:var(--shadow)}
.bmc-sh{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:13px}
.bmc-sh h2{margin:0;display:flex;align-items:center;gap:7px;font-size:15.5px;font-weight:800;color:var(--text)}
.bmc-sh h2 i{color:var(--accent);font-size:15px}
.bmc-sh em{font-style:normal;font-size:11.5px;color:var(--muted)}
/* 赞助卡片：电脑端 / 平板一行 6 个，手机一行 2 个 */
.bmc-sgrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.bmc-scard{position:relative;overflow:hidden;display:flex;align-items:center;
  height:92px;padding:10px 12px;border-radius:14px;
  background:var(--panel);border:1px solid var(--border);color:inherit;text-decoration:none;cursor:pointer;
  transition:background .45s ease,border-color .45s ease,box-shadow .35s ease}
.bmc-scard:hover{background:#81d742;border-color:#81d742;
  box-shadow:0 12px 28px rgba(129,215,66,.34)}
/* 图标：高度始终等于右侧内容高度；hover 只顺时针旋转并滑到右侧，尺寸不变 */
.bmc-sico{position:absolute;left:10px;top:10px;bottom:10px;z-index:1;display:grid;place-items:center;
  width:auto;height:auto;aspect-ratio:1/1;border-radius:50%;overflow:hidden;
  border:1px solid var(--card-border);background:linear-gradient(140deg,#eef2ff,#e0e7ff);
  font-size:19px;font-style:normal;color:#4f46e5;
  animation:bmcSpin 7s linear infinite;
  transition:left .7s cubic-bezier(.22,.61,.36,1),
             opacity .5s ease,border-color .5s ease,background .5s ease}
.bmc-sico img{width:100%;height:100%;object-fit:cover;background:#fff}
.bmc-scard:hover .bmc-sico{left:calc(100% - 82px);opacity:.5;
  border-color:transparent;background:rgba(255,255,255,.16)}
.bmc-sgrid> :nth-child(6n+2) .bmc-sico{background:linear-gradient(140deg,#fef3c7,#fde68a);color:#b45309}
.bmc-sgrid> :nth-child(6n+3) .bmc-sico{background:linear-gradient(140deg,#dcfce7,#bbf7d0);color:#15803d}
.bmc-sgrid> :nth-child(6n+4) .bmc-sico{background:linear-gradient(140deg,#fee2e2,#fecaca);color:#b91c1c}
.bmc-sgrid> :nth-child(6n+5) .bmc-sico{background:linear-gradient(140deg,#e0f2fe,#bae6fd);color:#0369a1}
.bmc-sgrid> :nth-child(6n) .bmc-sico{background:linear-gradient(140deg,#f3e8ff,#e9d5ff);color:#7e22ce}
.bmc-sb{position:relative;z-index:2;flex:1 1 auto;min-width:0;display:flex;flex-direction:column;
  justify-content:center;gap:2px;margin-left:74px;
  transition:margin-left .55s cubic-bezier(.22,.61,.36,1)}
/* hover：图标移到右侧后，标题与描述撑满整行宽度 */
.bmc-scard:hover .bmc-sb{margin-left:0}
.bmc-sn{display:flex;align-items:center;gap:5px;min-width:0}
.bmc-sn a,.bmc-sn b{flex:0 1 auto;min-width:0;font-size:12px;font-weight:700;color:var(--text);text-decoration:none;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .3s ease}
.bmc-sn a:hover{color:var(--accent)}
/* hover 时追加的「（赞助18元/1次）」，单行不换行，卡片高度不变 */
.bmc-hm{display:none;flex:0 1 auto;min-width:0;font-size:10.5px;font-weight:700;color:#fff;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bmc-scard:hover .bmc-sn a,.bmc-scard:hover .bmc-sn b{color:#fff;flex:1 1 auto}
.bmc-scard:hover .bmc-hm{display:inline}
.bmc-rk{flex:none;display:grid;place-items:center;width:16px;height:16px;border-radius:6px;
  background:#f59e0b;color:#fff;font-size:10px;font-weight:800;font-style:normal;
  transition:opacity .3s ease}
.bmc-sgrid> :nth-child(1) .bmc-rk{background:linear-gradient(140deg,#fbbf24,#f59e0b)}
.bmc-sgrid> :nth-child(2) .bmc-rk{background:linear-gradient(140deg,#cbd5e1,#94a3b8)}
.bmc-sgrid> :nth-child(3) .bmc-rk{background:linear-gradient(140deg,#fdba74,#f97316)}
.bmc-sdesc{margin:0;font-size:10.5px;line-height:1.55;color:var(--text-2);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  transition:color .3s ease}
.bmc-scard:hover .bmc-sdesc{color:rgba(255,255,255,.94)}
.bmc-smeta{font-size:10px;color:var(--muted);transition:opacity .3s ease}
.bmc-scard:hover .bmc-rk,
.bmc-scard:hover .bmc-smeta{opacity:0}
/* hover 文字从右往左滑入 */
@keyframes bmcCardIn{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:translateX(0)}}
.bmc-scard:hover .bmc-sn{animation:bmcCardIn .45s cubic-bezier(.22,.61,.36,1) both}
.bmc-scard:hover .bmc-sdesc{animation:bmcCardIn .45s cubic-bezier(.22,.61,.36,1) .06s both}
@media(prefers-reduced-motion:reduce){
  .bmc-scard:hover .bmc-sn,.bmc-scard:hover .bmc-sdesc{animation:none}
  .bmc-sico,.bmc-twm>img,.bmc-twm>i,.bmc-fl-ico,.bmc-flake{animation:none!important}
}

/* 图标默认顺时针旋转：赞助列表卡片、榜上有名水印共用 */
@keyframes bmcSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* 榜上有名：图片在上、标题+描述在下，站点图标做右下角水印 */
.bmc-tgrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.bmc-tcard{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:14px;
  background:var(--panel);border:1px solid var(--border);color:inherit;text-decoration:none;cursor:pointer;
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.bmc-tcard:hover{transform:translateY(-4px);border-color:rgba(129,215,66,.6);
  box-shadow:0 16px 34px rgba(28,31,39,.16)}
.bmc-tcover{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-soft)}
.bmc-tcover img{width:100%;height:100%;display:block;object-fit:cover;
  transition:transform .6s cubic-bezier(.22,.61,.36,1),filter .38s ease}
.bmc-tcard:hover .bmc-tcover img{transform:scale(1.07);filter:brightness(.7) saturate(.85)}
.bmc-tinfo{--tb:13px;position:relative;z-index:2;flex:1 1 auto;min-height:92px;
  padding:11px 13px var(--tb);overflow:visible;
  transition:background .3s ease,margin-top .42s cubic-bezier(.22,.61,.36,1),
             padding-bottom .42s cubic-bezier(.22,.61,.36,1),box-shadow .42s ease}
/* hover：信息区整体上移并增高，压住封面底部约 20%（封面高 = 卡宽 × 62.5%，其 20% 即卡宽 × 12.5%）；
   被负 margin 拿掉的高度用等量 padding-bottom 补回，卡片总高度不变，网格不会跳动 */
.bmc-tcard:hover .bmc-tinfo{margin-top:-12.5%;padding-bottom:calc(var(--tb) + 12.5%);
  background:#81d742;border-radius:13px 13px 0 0;box-shadow:0 -10px 22px rgba(28,31,39,.16)}
.bmc-tname{position:relative;z-index:2;display:block;font-size:14px;font-weight:800;color:var(--text);
  text-align:center;
  line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .3s ease}
.bmc-tdesc{position:relative;z-index:2;margin:5px 0 0;font-size:11.5px;line-height:1.65;color:var(--text-2);
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;transition:color .3s ease}
.bmc-tcard:hover .bmc-tname,.bmc-tcard:hover .bmc-tdesc{color:#fff}
/* 站点图标水印：默认完整贴右下角内侧，hover 时从右往左滑到左下角内侧，全程不被卡片裁切 */
.bmc-twm{position:absolute;right:8px;bottom:8px;z-index:1;display:grid;place-items:center;
  width:64px;height:64px;border-radius:50%;overflow:hidden;pointer-events:none;
  background:rgba(99,102,241,.12);color:var(--accent);font-style:normal;font-size:26px;
  opacity:.2;transition:opacity .32s ease,transform .5s cubic-bezier(.22,.61,.36,1),
             right .62s cubic-bezier(.22,.61,.36,1)}
.bmc-twm img{width:100%;height:100%;object-fit:cover;display:block}
.bmc-twm>img,.bmc-twm>i{animation:bmcSpin 8s linear infinite}
.bmc-twm>i{display:block;font-style:normal}
.bmc-tcard:hover .bmc-twm{right:calc(100% - 74px);opacity:.5;
  background:rgba(255,255,255,.2);transform:rotate(-10deg) scale(1.06)}
@media(max-width:1100px){
  .bmc-tgrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
}
@media(max-width:760px){
  .bmc-tgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .bmc-tcard{border-radius:12px}
  .bmc-tinfo{--tb:11px;min-height:82px;padding:9px 11px var(--tb)}
  .bmc-tcard:hover .bmc-tinfo{border-radius:11px 11px 0 0}
  .bmc-tname{font-size:12.5px}
  .bmc-tdesc{font-size:10.5px;-webkit-line-clamp:2}
  .bmc-twm{width:54px;height:54px;font-size:22px}
  .bmc-tcard:hover .bmc-twm{right:calc(100% - 64px)}
}
/* 右下角赞助播报：两条彩色胶囊，颜色不相同，每 3 秒上移替换 */
.bmc-pop{position:fixed;right:18px;bottom:calc(150px + env(safe-area-inset-bottom));z-index:999;
  max-width:min(460px,92vw);pointer-events:none}
.bmc-pop-track{display:flex;flex-direction:column;align-items:flex-end;gap:9px}
.bmc-pop-item{pointer-events:auto;display:flex;align-items:center;gap:9px;max-width:100%;
  padding:8px 16px 8px 8px;border-radius:999px;color:#fff;text-decoration:none;
  box-shadow:0 12px 30px rgba(6,10,24,.26);
  opacity:0;transform:translateY(16px);
  transition:opacity .4s ease,transform .4s cubic-bezier(.22,.61,.36,1),filter .2s ease}
.bmc-pop-item.in{opacity:1;transform:none}
.bmc-pop-item.out{opacity:0;transform:translateY(-14px);transition-duration:.22s}
.bmc-pop-item[href]{cursor:pointer}
.bmc-pop-item[href]:hover{filter:brightness(1.08)}
/* 六套配色，按顺序轮换，相邻两条永远不同色 */
.bmc-pop-item.c0{background:linear-gradient(135deg,#7c3aed,#a855f7)}
.bmc-pop-item.c1{background:linear-gradient(135deg,#0ea5e9,#22c55e)}
.bmc-pop-item.c2{background:linear-gradient(135deg,#f97316,#f43f5e)}
.bmc-pop-item.c3{background:linear-gradient(135deg,#0f766e,#14b8a6)}
.bmc-pop-item.c4{background:linear-gradient(135deg,#2563eb,#6366f1)}
.bmc-pop-item.c5{background:linear-gradient(135deg,#db2777,#f472b6)}
.bmc-pop-av{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  overflow:hidden;background:rgba(255,255,255,.24);font-size:13px;font-weight:800;color:#fff}
.bmc-pop-av img{width:100%;height:100%;object-fit:cover;background:#fff}
.bmc-pop-t{min-width:0;font-size:12.5px;line-height:1.35;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.bmc-pop-t b{font-weight:800}

/* 站点分类弹窗（站点分类 + 标签分类搜索） */
.bmc-catmask{position:fixed;inset:0;z-index:140;display:grid;place-items:center;padding:16px;
  background:rgba(15,23,42,.52);backdrop-filter:blur(3px)}
.bmc-catmask[hidden]{display:none}
.bmc-catbox{width:min(560px,100%);max-height:min(620px,88vh);display:flex;flex-direction:column;
  border-radius:18px;background:var(--panel);border:1px solid var(--card-border);
  box-shadow:0 24px 64px rgba(6,10,24,.28);overflow:hidden;animation:bmcCatIn .22s ease}
@keyframes bmcCatIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
.bmc-cathd{display:flex;align-items:flex-start;gap:10px;padding:16px 16px 12px;border-bottom:1px solid var(--border)}
.bmc-cathc{flex:1 1 auto;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:7px}
.bmc-cathc i{color:var(--accent);font-size:15px}
.bmc-cathc b{font-size:14.5px;color:var(--text)}
.bmc-cathc em{flex:0 0 100%;font-style:normal;font-size:10.5px;color:var(--muted)}
.bmc-catx{flex:none;width:28px;height:28px;border:0;border-radius:9px;background:rgba(127,140,160,.12);
  color:var(--muted);font-size:11px;cursor:pointer;display:grid;place-items:center}
.bmc-catx:hover{background:var(--primary-light);color:var(--accent)}
.bmc-catq{position:relative;display:flex;align-items:center;gap:7px;margin:12px 16px 0;padding:0 10px;
  height:38px;border-radius:10px;border:1px solid var(--border);background:var(--bg)}
.bmc-catq>i{color:var(--muted);font-size:12px}
.bmc-catq .sb-input{flex:1 1 auto;min-width:0;height:32px;padding:0;border:0;background:transparent;
  box-shadow:none;font-size:12.5px}
.bmc-catq .sb-input:focus{box-shadow:none}
.bmc-qx{flex:none;border:0;background:none;color:var(--muted);font-size:12px;cursor:pointer;padding:0 2px}
.bmc-qx:hover{color:var(--accent)}
.bmc-qx[hidden]{display:none}
.bmc-catbody{flex:1 1 auto;min-height:0;overflow-y:auto;padding:12px 16px 14px;scrollbar-width:thin}
.bmc-cath{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:12px 0 8px}
.bmc-cath:first-child{margin-top:0}
.bmc-cath span{font-size:11.5px;font-weight:700;color:var(--text-2)}
.bmc-cath em{font-style:normal;font-size:10.5px;color:var(--accent);max-width:55%;overflow:hidden;
  white-space:nowrap;text-overflow:ellipsis}
.bmc-catchips,.bmc-tagchips{display:flex;flex-wrap:wrap;gap:6px}
.bmc-chip{height:30px;padding:0 11px;border-radius:9px;border:1px solid var(--border);background:var(--bg);
  color:var(--text-2);font-family:inherit;font-size:12px;font-weight:600;cursor:pointer;
  transition:border-color .15s ease,background .15s ease,color .15s ease}
.bmc-chip:hover{border-color:var(--accent);color:var(--accent)}
.bmc-chip.on{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 4px 12px rgba(99,102,241,.28)}
.bmc-chip-tag{padding:0 10px;font-weight:500;font-size:11.5px}
.bmc-chip-tag.on{background:#059669;box-shadow:0 4px 12px rgba(5,150,105,.26)}
.bmc-catempty{margin:10px 0 0;font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:6px}
.bmc-catempty[hidden]{display:none}
.bmc-catfoot{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px 16px;border-top:1px solid var(--border);background:var(--bg)}
.bmc-catfoot .bmc-cta{margin:0;height:36px;padding:0 18px}
.bmc-catclear{border:0;background:none;color:var(--muted);font-family:inherit;font-size:12px;cursor:pointer;padding:6px 4px}
.bmc-catclear:hover{color:#ef4444}

/* 弹窗 */
.bmc-box{width:min(452px,94vw);max-height:90vh;overflow-y:auto;scrollbar-width:none;padding:22px 22px 20px}
.bmc-box::-webkit-scrollbar{display:none}
.bmc-box h3{display:flex;align-items:center;gap:8px;margin:0;font-size:17px;color:var(--text)}
.bmc-box h3 i{color:var(--accent);font-size:16px}
.bmc-sub{margin:6px 0 0;font-size:11.5px;line-height:1.6;color:var(--muted)}
.bmc-sub b{color:var(--text-2);font-variant-numeric:tabular-nums}
.bmc-box .bmc-cta{margin-top:14px}
.bmc-methods{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.bmc-method{display:flex;align-items:center;gap:9px;width:100%;padding:10px 12px;border-radius:12px;
  border:1px solid var(--border);background:var(--bg);cursor:pointer;text-align:left;font-family:inherit;
  transition:border-color .16s ease,background .16s ease}
.bmc-method:hover{border-color:var(--accent)}
.bmc-method i{font-size:17px;color:var(--accent)}
.bmc-method b{font-size:12.5px;color:var(--text)}
.bmc-method em{margin-left:auto;font-style:normal;font-size:10.5px;color:var(--muted)}
.bmc-qrbox{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:14px;padding:12px;
  border-radius:14px;background:var(--bg);border:1px dashed var(--border)}
.bmc-qrbox[hidden],.bmc-wait[hidden],.bmc-manual[hidden]{display:none}
.bmc-qrimg{display:grid;place-items:center;width:200px;height:200px;background:#fff;border-radius:10px;padding:4px}
.bmc-qrbox span{font-size:11.5px;color:var(--muted)}
.bmc-manual{margin-top:12px}
.bmc-qrimgs{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.bmc-qrimgs figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:5px}
.bmc-qrimgs img{width:112px;height:112px;object-fit:contain;background:#fff;border-radius:9px;
  border:1px solid var(--border);padding:3px}
.bmc-qrimgs figcaption{font-size:10.5px;color:var(--muted)}
.bmc-trade{display:flex;gap:8px;margin-top:10px}
.bmc-trade .sb-input{flex:1 1 auto;min-width:0;height:38px;min-height:38px}
.bmc-trade .bmc-cta{flex:none;height:38px;margin-top:0;padding:0 14px;font-size:12px;box-shadow:none}
.bmc-wait{display:flex;align-items:center;justify-content:center;gap:6px;margin:12px 0 0;
  font-size:11.5px;color:var(--muted)}
.bmc-wait i{animation:sw-spin 1.6s linear infinite}
.bmc-done{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px 4px;text-align:center}
.bmc-done i{font-size:44px;color:#10b981}
.bmc-done h3{margin:0;font-size:18px}
.bmc-done p{margin:0;font-size:12px;color:var(--muted)}
.bmc-done .bmc-cta{margin-top:8px}

/* 弹窗：覆盖 .modal .box 的默认样式（优先级需高于 .modal .box） */
body.bmc-open{overflow:hidden}
.modal .bmc-box{max-width:452px;width:min(452px,94vw);text-align:left;padding:22px 22px 20px}
.modal .bmc-box h3{display:flex;align-items:center;gap:8px;margin:0;font-size:17px;color:var(--text)}
.modal .bmc-box p.bmc-sub{margin:6px 0 0;font-size:11.5px;line-height:1.6;color:var(--muted)}
.modal .bmc-box .bmc-qrimgs img{width:112px;height:112px;object-fit:contain;padding:3px;
  border:1px solid var(--border);border-radius:9px;background:#fff}
.modal .bmc-box .bmc-qrimg img{width:100%;height:100%;padding:0;border:0;border-radius:0;background:transparent}
.modal .bmc-box .bmc-done p{margin:0;font-size:12px;color:var(--muted)}

/* 响应式 */
@media(max-width:1100px){
  .bmc-float{top:78px;right:14px;left:auto;margin:0;width:min(670px,calc(100vw - 28px));max-width:none;height:545px;
    max-height:calc(100vh - 96px)}
  .bmc-fab{top:78px;right:14px}
  /* 平板仍保持一行 6 个，仅收紧内边距与字号 */
  .bmc-sgrid{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
  .bmc-scard{height:66px;padding:8px;border-radius:11px}
  .bmc-sb{margin-left:62px}
  .bmc-sico{left:8px;top:8px;bottom:8px;font-size:13px}
  .bmc-scard:hover .bmc-sico{left:calc(100% - 58px)}
  .bmc-sn a,.bmc-sn b{font-size:11px}
  .bmc-sdesc{font-size:9px}
}
@media(max-width:880px){
  .bmc-apply{grid-template-columns:minmax(0,1fr)}
  .bmc-paycard{padding-left:0;border-left:0;border-top:1px solid var(--border);padding-top:12px}
}
@media(max-width:760px){
  .bmc-hero{padding:22px 18px 20px;border-radius:18px;gap:14px}
  .bmc-hero h1{font-size:23px;margin:10px 0 6px}
  .bmc-hero p{font-size:12.5px;line-height:1.7}
  .bmc-cup{display:none}
  .bmc-float{top:68px;left:10px;right:10px;width:auto;max-height:calc(100vh - 88px);border-radius:15px}
  .bmc-fab{top:68px;right:10px}
  .bmc-float-hd{padding:10px 10px 10px 14px}
  .bmc-float-b{padding:12px 13px 14px}
  .bmc-two{grid-template-columns:minmax(0,1fr);gap:0}
  .bmc-urln{flex-direction:column}
  .bmc-fetch{width:100%;justify-content:center}
  .bmc-sec{padding:14px 13px 12px;border-radius:15px}
  .bmc-sh{margin-bottom:10px}
  /* 手机一行 2 个 */
  .bmc-sgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .bmc-scard{height:84px;padding:9px 10px;border-radius:12px}
  .bmc-sb{margin-left:64px}
  .bmc-sico{left:8px;top:16px;bottom:16px;font-size:13px}
  .bmc-scard:hover .bmc-sico{left:calc(100% - 58px)}
  .bmc-sn a,.bmc-sn b{font-size:12px}
  .bmc-sdesc{font-size:10.5px;-webkit-line-clamp:2}
  .bmc-pop{right:12px;bottom:calc(140px + env(safe-area-inset-bottom));max-width:calc(100vw - 24px)}
  .bmc-pop-t{font-size:11.5px}
  .modal .bmc-box{padding:18px 16px 16px}
}

.rank-tabs{display:flex;gap:3px;margin:0 0 9px;padding:3px;border-radius:10px;
  background:var(--bg);border:1px solid var(--border)}
.rt-tab{flex:1 1 0;min-width:0;height:26px;padding:0;border:0;border-radius:8px;background:transparent;
  color:var(--muted);font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;
  transition:all .18s ease;font-family:inherit}
.rt-tab:hover{color:var(--accent)}
.rt-tab.on{background:var(--panel);color:var(--accent);box-shadow:0 2px 8px rgba(20,24,40,.1)}
.tl-empty{padding:16px 8px;text-align:center;font-size:11.5px;color:var(--muted)}
.rank-panel .toplist[hidden]{display:none!important}

/* ==========================================================================
 * 人气排行榜页面 /rank
 * ======================================================================== */
.rk-wrap{display:flex;flex-direction:column;gap:18px;min-width:0}
.rk-hero{position:relative;overflow:hidden;padding:34px 32px 30px;border-radius:22px;
  background:var(--hero-grad);color:#fff;box-shadow:var(--shadow)}
.rk-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(680px 300px at 82% 6%,rgba(255,255,255,.2),transparent 68%),
             linear-gradient(115deg,rgba(12,14,24,.4),rgba(12,14,24,.1) 70%)}
.rk-hero-copy{position:relative;z-index:1;max-width:640px}
.rk-eyebrow{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 12px;border-radius:999px;
  font-size:11.5px;font-weight:700;letter-spacing:.4px;background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.32);color:#fff}
.rk-eyebrow i{animation:sw-twinkle 2.8s ease-in-out infinite}
.rk-hero h1{margin:14px 0 8px;font-size:clamp(25px,3.4vw,38px);line-height:1.24;
  font-weight:800;letter-spacing:-1px}
.rk-hero h1 em{font-style:normal;border-bottom:2px dashed rgba(255,255,255,.5);padding-bottom:1px;
  text-shadow:0 6px 26px rgba(255,255,255,.42)}
.rk-hero p{margin:0;font-size:13.5px;line-height:1.8;color:rgba(255,255,255,.85)}
.rk-nums{position:relative;z-index:1;display:flex;gap:13px;flex-wrap:wrap;margin-top:24px}
.rk-nums span{min-width:126px;padding:11px 15px;border-radius:14px;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.rk-nums b{display:block;font-size:20px;font-weight:800;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.rk-nums em{display:block;margin-top:2px;font-style:normal;font-size:11px;color:rgba(255,255,255,.76)}
.rk-orbit{position:absolute;right:-30px;top:50%;transform:translateY(-50%);width:300px;height:300px;pointer-events:none}
.rk-orbit .o{position:absolute;left:50%;top:50%;border-radius:50%;border:1px solid rgba(255,255,255,.22);
  transform:translate(-50%,-50%)}
.rk-orbit .o1{width:130px;height:130px}
.rk-orbit .o2{width:210px;height:210px;border-style:dashed;animation:sw-spin 26s linear infinite}
.rk-orbit .o3{width:290px;height:290px;animation:sw-spin 40s linear infinite reverse}
.rk-orbit .o::after{content:"";position:absolute;left:50%;top:-4px;width:8px;height:8px;margin-left:-4px;
  border-radius:50%;background:#fff;box-shadow:0 0 14px 3px rgba(255,255,255,.8)}
.rk-orbit .core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-size:34px;color:#fff;opacity:.92;animation:sw-thump 2.6s ease-in-out infinite}

.rk-toolbar{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border-radius:16px;
  background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.rk-tabs{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rk-tab{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 15px;border-radius:999px;
  background:var(--bg);border:1px solid var(--border);color:var(--text-2);font-size:13px;font-weight:600;
  transition:all .2s ease}
.rk-tab i{font-style:normal;font-size:10.5px;font-weight:700;color:var(--muted);
  background:var(--surface);border-radius:999px;padding:1px 6px}
.rk-tab:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}
.rk-tab.on{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 8px 20px -12px rgba(99,102,241,.95)}
.rk-tab.on i{background:rgba(255,255,255,.24);color:#fff}
.rk-cats{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;cursor:grab;
  scrollbar-width:none;-ms-overflow-style:none}
.rk-cats::-webkit-scrollbar{display:none}
.rk-cats.dragging{cursor:grabbing;scroll-behavior:auto;user-select:none}
.rk-cats a{flex:none;display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 12px;
  border-radius:999px;background:var(--bg);border:1px solid var(--border);
  font-size:12px;color:var(--text-2);transition:all .18s ease;white-space:nowrap;user-select:none;-webkit-user-drag:none}
.rk-cats a i{font-size:12px}
.rk-cats a img{width:14px;height:14px;object-fit:cover;border-radius:4px;display:block;pointer-events:none;-webkit-user-drag:none}
.rk-cats a:hover{border-color:var(--accent);color:var(--accent)}
.rk-cats a.on{background:var(--primary-light);border-color:var(--accent);color:var(--accent);font-weight:700}

.rk-tip{display:flex;align-items:center;gap:8px;padding:11px 15px;border-radius:12px;font-size:12.5px;
  color:var(--text-2);background:var(--primary-light);border:1px dashed var(--card-border)}
.rk-tip i{color:var(--accent)}

.rk-podium{display:grid;grid-template-columns:1fr 1.18fr 1fr;gap:12px;align-items:end}
.rk-pod{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;
  padding:26px 16px 18px;border-radius:20px;background:var(--panel);border:1px solid var(--border);
  box-shadow:var(--shadow-sm);overflow:hidden;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.rk-pod::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.6;
  background:radial-gradient(200px 110px at 50% -10%,rgba(255,255,255,.55),transparent 72%)}
.rk-pod:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:var(--shadow)}
.rk-pod.p2{order:1;padding-top:22px}
.rk-pod.p1{order:2;border-color:#f6cd7a;box-shadow:0 18px 40px -28px rgba(245,158,11,.9)}
.rk-pod.p3{order:3;padding-top:22px}
.rk-pod-crown{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;
  font-size:11px;font-weight:800;background:var(--bg);color:var(--muted);border:1px solid var(--border)}
.rk-pod-crown em{font-style:normal;font-family:ui-monospace,Consolas,monospace}
.rk-pod.p1 .rk-pod-crown{background:linear-gradient(135deg,#fde68a,#fbbf24);border-color:#f3c46a;color:#7c4a03}
.rk-pod.p2 .rk-pod-crown{background:linear-gradient(135deg,#eef2f7,#cbd5e1);color:#5b6577}
.rk-pod.p3 .rk-pod-crown{background:linear-gradient(135deg,#fed7aa,#fdba74);color:#8a3f0c}
.rk-pod-ico{position:relative;width:56px;height:56px;border-radius:18px;display:grid;place-items:center;
  font-size:26px;background:var(--surface-2);border:1px solid var(--card-border);overflow:hidden}
.rk-pod-ico img,.rk-pod-ico .ico-img{width:100%;height:100%;object-fit:cover;display:block}
.rk-pod.p1 .rk-pod-ico{width:66px;height:66px;border-radius:20px;font-size:30px;
  background:linear-gradient(140deg,#fde68a,#fbbf24);border-color:#f5c56a;
  box-shadow:0 14px 30px -20px rgba(245,158,11,.95)}
.rk-pod.p2 .rk-pod-ico{background:linear-gradient(140deg,#eef2f7,#cbd5e1);border-color:#cfd8e3}
.rk-pod.p3 .rk-pod-ico{background:linear-gradient(140deg,#fed7aa,#fdba74);border-color:#f6c69b}
.rk-pod b{max-width:100%;font-size:14.5px;font-weight:800;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk-pod.p1 b{font-size:16px}
.rk-pod-desc{max-width:100%;font-size:11.5px;line-height:1.6;color:var(--muted);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rk-pod-v{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:800;
  color:var(--accent);font-variant-numeric:tabular-nums}
.rk-pod-v i{color:#f97316}
.rk-pod-v em{font-style:normal;font-size:10.5px;font-weight:500;color:var(--muted)}

.rk-board{padding:16px 18px 10px;border-radius:18px;background:var(--panel);
  border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.rk-board-hd{display:flex;align-items:center;gap:8px;padding-bottom:10px;border-bottom:1px dashed var(--border)}
.rk-board-hd b{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700}
.rk-board-hd b i{color:var(--accent)}
.rk-board-hd em{margin-left:auto;font-style:normal;font-size:11.5px;color:var(--muted)}
.rk-rows{display:flex;flex-direction:column;margin-top:2px}
.rk-row{display:flex;align-items:center;gap:11px;padding:10px 6px;border-radius:11px;
  transition:background .18s ease,transform .18s ease}
.rk-row + .rk-row{border-top:1px solid var(--border)}
.rk-row:hover{background:var(--primary-light);transform:translateX(3px)}
.rk-no{flex:none;width:26px;text-align:center;font-size:12px;font-weight:800;color:var(--muted);
  font-family:ui-monospace,Consolas,monospace}
.rk-ico{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;
  font-size:17px;background:var(--surface-2);border:1px solid var(--card-border);overflow:hidden}
.rk-ico img,.rk-ico .ico-img{width:100%;height:100%;object-fit:cover;display:block}
.rk-info{flex:1 1 auto;min-width:0}
.rk-info b{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk-badge{flex:none;font-style:normal;font-size:10px;font-weight:700;padding:1px 6px;border-radius:999px;
  background:var(--primary-light);color:var(--accent)}
.rk-info em{display:block;margin-top:2px;font-style:normal;font-size:11px;color:var(--muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk-meter{flex:0 0 132px;height:6px;border-radius:999px;background:var(--bg);overflow:hidden}
.rk-meter i{display:block;width:0;height:100%;border-radius:999px;background:var(--grad);
  transition:width .9s cubic-bezier(.22,.61,.36,1)}
.rk-row.in .rk-meter i{width:var(--w,0%)}
.rk-val{flex:none;min-width:64px;text-align:right;font-size:13px;font-weight:800;color:var(--accent);
  font-variant-numeric:tabular-nums}

.rk-note{border-radius:18px;border:1px dashed var(--card-border);background:var(--panel);padding:18px 20px}
.rk-note-in{display:flex;align-items:flex-start;gap:14px}
.rk-note-in > i{flex:none;margin-top:2px;font-size:22px;color:var(--accent);opacity:.6}
.rk-note-in b{font-size:13.5px;color:var(--text)}
.rk-note-in p{margin:6px 0 0;font-size:12.5px;line-height:1.85;color:var(--text-2)}
.rk-note-btn{margin-left:auto;flex:none;border-radius:999px}

@media (max-width:980px){
  .rk-podium{grid-template-columns:1fr 1.1fr 1fr;gap:9px}
  .rk-pod{padding:20px 12px 14px}
  .rk-pod.p1 .rk-pod-ico{width:58px;height:58px;font-size:26px}
  .rk-pod b,.rk-pod.p1 b{font-size:13px}
  .rk-pod-desc{-webkit-line-clamp:1}
}
@media (max-width:860px){
  .rk-hero{padding:24px 20px;border-radius:18px}
  .rk-orbit{display:none}
  .rk-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .rk-tabs::-webkit-scrollbar{display:none}
  .rk-tab{flex:none}
  .rk-nums span{flex:1 1 0;min-width:0;padding:9px 11px}
  .rk-nums b{font-size:17px}
  .rk-podium{grid-template-columns:1fr;gap:10px}
  .rk-pod,.rk-pod.p2,.rk-pod.p3{padding:16px 14px;border-radius:16px}
  .rk-pod.p1{order:0}
  .rk-pod-desc{-webkit-line-clamp:2}
  .rk-meter{display:none}
  .rk-board{padding:14px 13px 8px}
  .rk-note-in{flex-wrap:wrap}
  .rk-note-btn{margin-left:0}
}

/* ===== 申请收录（.sb-*） ===== */
.app.page-submit{grid-template-columns:minmax(0,1fr)}
.app.page-submit .rail{display:none}
/* 赞助墙：电脑端 / 平板端隐藏右侧栏，主内容占满整行；
   手机端（≤640px）不隐藏，改为抽屉：点顶栏「站点信息」按钮从右滑出 */
.app.page-sponsor{grid-template-columns:minmax(0,1fr)}
@media(min-width:641px){
  .app.page-sponsor .rail{display:none}
}
/* 抽屉展开时收起右下角播报与悬浮按钮，避免压住右侧栏 */
@media(max-width:640px){
  body.rail-drawer-open .bmc-fab,body.rail-drawer-open .bmc-pop{opacity:0;pointer-events:none}
}
.sb-wrap{display:flex;flex-direction:column;gap:16px;min-width:0}
.sb-crumb{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
.sb-crumb a:hover{color:var(--accent)}
.sb-crumb i{font-size:9px;opacity:.6}

.sb-hero{position:relative;overflow:hidden;padding:34px 32px;border-radius:22px;
  background:var(--hero-grad);color:#fff;box-shadow:var(--shadow)}
.sb-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(620px 280px at 84% 4%,rgba(255,255,255,.22),transparent 68%),
             linear-gradient(115deg,rgba(12,14,24,.44),rgba(12,14,24,.1) 72%)}
.sb-hero-in{position:relative;z-index:1;max-width:640px}
.sb-eyebrow{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 12px;border-radius:999px;
  font-size:11.5px;font-weight:700;letter-spacing:.4px;
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.32);color:#fff}
.sb-hero h1{margin:14px 0 8px;font-size:clamp(24px,3.2vw,36px);line-height:1.26;font-weight:800;letter-spacing:-1px}
.sb-hero h1 em{font-style:normal;color:#fff;text-shadow:0 6px 26px rgba(255,255,255,.45);
  border-bottom:2px dashed rgba(255,255,255,.5);padding-bottom:1px}
.sb-hero p{margin:0;font-size:13.5px;line-height:1.8;color:rgba(255,255,255,.86)}
.sb-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.sb-chips>span{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 12px;border-radius:999px;
  font-size:11.5px;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.26)}
.sb-chips b{font-weight:800}
.sb-orbit{position:absolute;right:34px;top:50%;transform:translateY(-50%);width:132px;height:132px;
  pointer-events:none;opacity:.6}
.sb-orbit span{position:absolute;inset:0;border-radius:50%;border:1px dashed rgba(255,255,255,.42)}
.sb-orbit .o1{animation:sb-spin 22s linear infinite}
.sb-orbit .o2{inset:20px;border-style:solid;border-color:rgba(255,255,255,.26);animation:sb-spin 16s linear infinite reverse}
.sb-orbit .o3{inset:42px;border-color:rgba(255,255,255,.18)}
.sb-orbit i{position:absolute;inset:0;margin:auto;width:26px;height:26px;font-size:26px;color:#fff;
  animation:sw-twinkle 3s ease-in-out infinite}
@keyframes sb-spin{to{transform:rotate(360deg)}}

.sb-off{padding:34px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
.sb-off>i{font-size:34px;color:var(--muted)}
.sb-off>b{font-size:16px}
.sb-off p{margin:0;font-size:13px;line-height:1.8;color:var(--muted);max-width:46ch}
.sb-off .btn{margin-top:8px}

.sb-grid{display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:18px;align-items:start}
.sb-card{padding:22px 24px 18px;display:flex;flex-direction:column;gap:6px}
.sb-sec{display:flex;align-items:center;gap:10px;margin:14px 0 10px}
.sb-sec:first-child{margin-top:0}
.sb-step{flex:none;width:26px;height:26px;border-radius:9px;display:grid;place-items:center;
  font-size:11.5px;font-weight:800;color:#fff;background:var(--grad);box-shadow:0 6px 14px -8px rgba(99,102,241,.9)}
.sb-sec b{font-size:13.5px;font-weight:700}
.sb-sec em{margin-left:8px;font-style:normal;font-size:11.5px;color:var(--muted)}
.sb-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sb-f{display:flex;flex-direction:column;gap:6px;min-width:0}
.sb-f.span2{grid-column:1/-1}
.sb-f>span{font-size:12.5px;font-weight:600;color:var(--text-2)}
.sb-input{width:100%;min-height:40px;padding:9px 12px;border-radius:11px;border:1px solid var(--border);
  background:var(--surface);color:var(--text);font-size:13px;line-height:1.6;outline:none;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
textarea.sb-input{resize:vertical}
select.sb-input{height:40px;padding:0 10px;cursor:pointer}
.sb-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,.13);background:var(--panel)}
.sb-input::placeholder{color:var(--muted)}
.sb-inline{display:flex;gap:9px;align-items:stretch}
.sb-inline .sb-input{flex:1;min-width:0}
.sb-mini{flex:none;height:40px;padding:0 14px;border-radius:11px;border:1px solid var(--border);
  background:var(--primary-light);color:var(--accent);font-size:12.5px;font-weight:700;
  display:inline-flex;align-items:center;gap:6px;cursor:pointer;transition:all .18s ease}
.sb-mini:hover{border-color:var(--accent);transform:translateY(-1px)}
.sb-mini.ghost{background:var(--surface);color:var(--text-2)}
.sb-hint{font-size:11.5px;line-height:1.7;color:var(--muted)}
/* 图标输入框左侧预览块：随输入框高度拉伸，宽度略窄 */
.sb-icoprev{flex:none;width:42px;align-self:stretch;border-radius:11px;border:1px solid var(--border);
  background:var(--surface-2);display:grid;place-items:center;overflow:hidden;
  font-size:19px;font-weight:700;color:var(--text-2);line-height:1}
.sb-icoprev img{width:100%;height:100%;object-fit:cover;display:block}
.sb-icon-prev{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;overflow:hidden;
  font-size:24px;background:var(--surface-2);border:1px solid var(--card-border);margin-top:2px}
.sb-icon-prev img{width:100%;height:100%;object-fit:cover;display:block}
.sb-shot{margin-top:4px;border-radius:12px;overflow:hidden;border:1px solid var(--card-border);
  background:var(--surface-2);max-height:220px}
.sb-shot img{display:block;width:100%;max-height:220px;object-fit:cover}

.sb-md{border:1px solid var(--border);border-radius:13px;overflow:hidden;background:var(--surface)}
.sb-md-bar{display:flex;align-items:center;gap:2px;flex-wrap:wrap;padding:6px 8px;border-bottom:1px solid var(--border);
  background:var(--bg)}
.sb-md-bar button{height:28px;min-width:28px;padding:0 8px;border:0;border-radius:7px;background:transparent;
  color:var(--text-2);font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;
  gap:4px;cursor:pointer;transition:all .16s ease}
.sb-md-bar button:hover{background:var(--primary-light);color:var(--accent)}
.sb-md-bar .sb-md-eye{margin-left:auto;font-weight:600;color:var(--muted)}
.sb-md-bar .sb-md-eye.on{background:var(--primary-light);color:var(--accent)}
.sb-md .sb-input{border:0;border-radius:0;background:transparent;min-height:190px;font-family:ui-monospace,Consolas,monospace;font-size:12.5px}
.sb-md .sb-input:focus{box-shadow:none;background:transparent}
.sb-md-preview{padding:14px 16px;border-top:1px dashed var(--border);font-size:13px;line-height:1.85;color:var(--text-2);max-height:420px;overflow:auto}
.sb-md-preview h1,.sb-md-preview h2,.sb-md-preview h3,.sb-md-preview h4{margin:12px 0 6px;font-size:14.5px;font-weight:700;color:var(--text)}
.sb-md-preview p{margin:0 0 8px}
.sb-md-preview ul{margin:0 0 8px;padding-left:20px}
.sb-md-preview blockquote{margin:0 0 8px;padding:6px 12px;border-left:3px solid var(--accent);background:var(--primary-light);border-radius:0 8px 8px 0}
.sb-md-preview pre{margin:0 0 8px;padding:10px 12px;border-radius:9px;background:var(--bg);overflow:auto;font-size:12px}
.sb-md-preview code{padding:1px 5px;border-radius:5px;background:var(--bg);font-size:12px}
.sb-md-preview img{max-width:100%;border-radius:10px}
.sb-md-preview table{width:100%;border-collapse:collapse;margin:0 0 8px;font-size:12.5px}
.sb-md-preview th,.sb-md-preview td{border:1px solid var(--border);padding:6px 9px;text-align:left}
.sb-md-preview th{background:var(--bg)}
.sb-md-empty{margin:0;color:var(--muted)}

.sb-agree{display:flex;align-items:flex-start;gap:8px;margin:14px 0 4px;font-size:12.5px;line-height:1.7;color:var(--text-2);cursor:pointer}
.sb-agree input{margin:3px 0 0;accent-color:var(--accent);width:15px;height:15px}
.sb-agree a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.sb-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.sb-actions .btn{height:42px;border-radius:12px;font-size:13.5px}
.sb-result{margin-top:12px;padding:11px 14px;border-radius:11px;font-size:12.5px;line-height:1.7;
  display:flex;align-items:center;gap:8px}
.sb-result.ok{background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.34);color:#0f9d75}
.sb-result.err{background:rgba(244,63,94,.1);border:1px solid rgba(244,63,94,.3);color:#e11d48}

.sb-side{display:flex;flex-direction:column;gap:14px;position:sticky;top:calc(var(--top) + 18px)}
.sb-note{padding:16px 18px}
.sb-note h3{display:flex;align-items:center;gap:7px;margin:0 0 10px;font-size:13px;font-weight:700}
.sb-note h3 i{color:var(--accent)}
.sb-note-list{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:8px;
  font-size:12px;line-height:1.75;color:var(--text-2)}
.sb-note-list li::marker{color:var(--accent);font-weight:700}
.sb-note-list b{color:var(--accent)}
.sb-faq details{border-top:1px dashed var(--border);padding:9px 0}
.sb-faq details:first-of-type{border-top:0;padding-top:0}
.sb-faq summary{font-size:12.5px;font-weight:600;color:var(--text);cursor:pointer;list-style:none;
  display:flex;align-items:center;gap:6px}
.sb-faq summary::-webkit-details-marker{display:none}
.sb-faq summary::before{content:"\F64D";font-family:"bootstrap-icons";color:var(--muted);font-size:11px;transition:transform .2s ease}
.sb-faq details[open] summary::before{transform:rotate(90deg);color:var(--accent)}
.sb-faq p{margin:7px 0 0;font-size:11.5px;line-height:1.8;color:var(--muted)}

html[data-theme="dark"] .sb-md-preview blockquote{background:rgba(99,102,241,.14)}
html[data-theme="dark"] .sb-result.ok{color:#4ade80}
html[data-theme="dark"] .sb-result.err{color:#fb7185}

@media(max-width:1100px){
  .sb-grid{grid-template-columns:minmax(0,1fr)}
  .sb-side{position:static;order:-1}
  .sb-orbit{display:none}
}
@media(max-width:760px){
  .sb-hero{padding:24px 20px;border-radius:18px}
  .sb-card{padding:18px 16px 14px}
  .sb-fields{grid-template-columns:minmax(0,1fr)}
  .sb-inline{flex-wrap:wrap}
  .sb-mini{height:36px;flex:1;justify-content:center}
  .sb-chips>span{font-size:11px;height:26px;padding:0 10px}
}

/* 广告入驻：套餐选择与横幅预览 */
.ad-hero .sb-hero-in{max-width:680px}
.ad-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:4px 0 2px}
.ad-plan{position:relative;cursor:pointer;display:block}
.ad-plan input{position:absolute;opacity:0;pointer-events:none}
.ad-plan-in{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px 15px;border-radius:16px;
  background:var(--bg);border:1.5px solid var(--card-border);transition:border-color .22s,transform .22s,box-shadow .22s;min-height:132px}
.ad-plan:hover .ad-plan-in{transform:translateY(-2px);border-color:rgba(99,102,241,.34);box-shadow:var(--shadow-sm)}
.ad-plan input:checked + .ad-plan-in{border-color:var(--accent);box-shadow:0 10px 26px rgba(99,102,241,.20);
  background:linear-gradient(180deg,rgba(99,102,241,.07),transparent 68%)}
.ad-plan input:checked + .ad-plan-in::after{content:"";position:absolute;inset:0;border-radius:16px;
  border:1px solid rgba(99,102,241,.24);pointer-events:none}
.ad-plan-in b{font-size:14px;font-weight:700;letter-spacing:-.2px}
.ad-plan-price{display:flex;align-items:baseline;gap:2px;font-size:24px;font-weight:800;letter-spacing:-1px;
  font-variant-numeric:tabular-nums;color:var(--accent)}
.ad-plan-price i{font-style:normal;font-size:15px;font-weight:700}
.ad-plan-price small{font-size:11px;font-weight:500;color:var(--muted);letter-spacing:0}
.ad-plan-desc{font-size:11.5px;color:var(--muted);line-height:1.6}
.ad-plan-gift{font-size:11px;color:#16a34a;font-weight:600}
.ad-plan-badge{position:absolute;right:12px;top:-9px;font-style:normal;font-size:10px;font-weight:700;
  padding:2px 8px;border-radius:999px;color:#fff;background:linear-gradient(135deg,#f59e0b,#f97316);
  box-shadow:0 4px 12px rgba(249,115,22,.35)}
.ad-sum{margin:12px 0 2px;font-size:12px;color:var(--accent);font-weight:600}
.ad-shot{aspect-ratio:4/1}
.ad-color{height:42px;padding:4px;cursor:pointer}
/* 封面图默认图：横向缩略图条（素材来自 static/images/bizhi，加图即生效） */
.ad-presets{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;padding:2px 2px 4px;margin:2px -2px 0;
  scrollbar-width:none;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 10px,#000 calc(100% - 10px),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 10px,#000 calc(100% - 10px),transparent)}
.ad-presets::-webkit-scrollbar{display:none;width:0;height:0}
.ad-preset{flex:0 0 auto;width:72px;height:52px;padding:0;border-radius:11px;cursor:pointer;
  border:2px solid transparent;background-size:cover;background-position:center;background-color:var(--surface-2);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.05);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
  -webkit-tap-highlight-color:transparent}
.ad-preset:hover{transform:translateY(-2px);box-shadow:0 8px 16px rgba(24,32,56,.16)}
.ad-preset.active{border-color:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,.16)}
@media(max-width:760px){
  .ad-plans{grid-template-columns:minmax(0,1fr)}
  .ad-plan-in{min-height:0}
  .adzone-hd{font-size:11px}
  /* 横幅广告：手机端一行两个，不足两个的坑位用「虚位以待」补齐 */
  .ad-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ad-list .ad-card.fx-m{display:flex}
  .ad-list .ad-card.fx-d{display:none}
  .ad-card{min-height:92px;padding:14px;border-radius:14px}
  .ad-eyebrow{display:none}
  .ad-title{font-size:15px;max-width:100%}
  .ad-sub{display:none}
  .ad-cta{padding:4px 10px;font-size:11.5px}
}
.ad-contact{font-size:13px;font-weight:600;color:var(--accent);margin:0;word-break:break-all}

/* 广告支付页 */
.pay-wrap .pay-hero .sb-hero-in{max-width:720px}
.pay-od{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:14px;
  background:linear-gradient(135deg,rgba(99,102,241,.09),rgba(168,85,247,.06));border:1px solid rgba(99,102,241,.18)}
.pay-od-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.pay-od-main b{font-size:15px;font-weight:800;letter-spacing:-.2px}
.pay-od-sub{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pay-od-money{flex:none;display:flex;align-items:baseline;gap:2px;font-size:28px;font-weight:800;
  letter-spacing:-1px;color:var(--accent);font-variant-numeric:tabular-nums}
.pay-od-money em{font-style:normal;font-size:15px;font-weight:700}
.pay-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;margin:14px 0 4px;padding:12px 0;
  border-top:1px dashed var(--border);border-bottom:1px dashed var(--border)}
.pay-meta>div{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;min-width:0}
.pay-meta span{color:var(--muted);flex:none}
.pay-meta b{font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pay-meta b.st{color:var(--accent)}
.pay-state{display:flex;gap:12px;padding:14px 16px;border-radius:13px;background:var(--bg);
  border:1px solid var(--card-border);margin-top:14px}
.pay-state>i{font-size:22px;color:var(--accent);flex:none}
.pay-state.ok>i{color:#16a34a}
.pay-state.bad>i{color:#e11d48}
.pay-state b{display:block;font-size:13.5px;font-weight:700}
.pay-state p{margin:4px 0 0;font-size:12px;line-height:1.75;color:var(--muted);word-break:break-word}
.pay-sec{display:flex;align-items:center;gap:10px;margin:16px 0 10px}
.pay-sec b{font-size:13.5px;font-weight:700}
.pay-sec em{margin-left:8px;font-style:normal;font-size:11.5px;color:var(--muted)}
.pay-methods{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.pay-m{position:relative;cursor:pointer;display:block}
.pay-m input{position:absolute;opacity:0;pointer-events:none}
.pay-m-in{display:flex;flex-direction:column;gap:3px;padding:13px 14px;border-radius:13px;
  border:1.5px solid var(--card-border);background:var(--surface);min-height:84px;
  transition:border-color .2s,transform .2s,box-shadow .2s,background .2s}
.pay-m-in i{font-size:19px;color:var(--accent)}
.pay-m-in b{font-size:13px;font-weight:700}
.pay-m-in em{font-style:normal;font-size:11px;color:var(--muted)}
.pay-m:hover .pay-m-in{transform:translateY(-2px);border-color:rgba(99,102,241,.34);box-shadow:var(--shadow-sm)}
.pay-m input:checked + .pay-m-in{border-color:var(--accent);box-shadow:0 10px 26px rgba(99,102,241,.18);
  background:linear-gradient(180deg,rgba(99,102,241,.07),transparent 70%)}
.pay-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}
.pay-actions .btn{height:44px;border-radius:12px;font-size:14px;padding:0 22px}
.pay-tip{font-size:11.5px;color:var(--muted)}
.pay-box{margin-top:14px;padding:16px;border-radius:14px;border:1px dashed var(--card-border);background:var(--bg)}
.pay-qr{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.pay-qr-img{width:208px;height:208px;padding:8px;border-radius:12px;background:#fff;box-shadow:var(--shadow-sm)}
.pay-qr-img img,.pay-qr-img canvas{display:block;width:100%;height:100%}
.pay-qr b{font-size:13px}
.pay-qr p{margin:0;font-size:11.5px;color:var(--muted);max-width:36ch;line-height:1.7}
.pay-qr-list{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.pay-qr-list figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:6px}
.pay-qr-list img{width:168px;height:168px;object-fit:contain;border-radius:10px;background:#fff;
  padding:6px;border:1px solid var(--card-border)}
.pay-qr-list figcaption{font-size:11.5px;color:var(--muted)}
.pay-manual-note{margin:12px 0;font-size:12px;color:var(--text-2);line-height:1.75;text-align:center}
.pay-manual-form{display:flex;gap:9px;flex-wrap:wrap;justify-content:center}
.pay-manual-form .sb-input{flex:1 1 220px;max-width:320px}
.pay-manual-form .btn{height:40px;border-radius:11px;flex:none}
.pay-err{margin-top:12px;padding:10px 13px;border-radius:11px;background:rgba(244,63,94,.1);
  border:1px solid rgba(244,63,94,.3);color:#e11d48;font-size:12.5px;line-height:1.7}
.pay-help{margin-top:16px;padding-top:12px;border-top:1px dashed var(--border);font-size:12px;
  color:var(--muted);display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.pay-help i{color:var(--accent)}
.pay-help b{color:var(--accent);font-weight:700}
.sb-pay-link{display:inline-flex;align-items:center;gap:5px;margin-left:8px;padding:3px 10px;border-radius:999px;
  background:linear-gradient(135deg,#10b981,#059669);color:#fff !important;font-weight:700;text-decoration:none;font-size:12px}
html[data-theme="dark"] .pay-qr-img{background:#fff}
@media(max-width:760px){
  .pay-wrap .sb-side{order:0}
  .pay-meta{grid-template-columns:minmax(0,1fr)}
  .pay-methods{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pay-od{flex-direction:column;align-items:flex-start;gap:8px}
  .pay-actions .btn{width:100%}
}

/* ---------------- 站点访问密码页 ---------------- */
.lock-wrap{min-height:calc(100vh - 300px);display:grid;place-items:center;padding:36px 16px 60px}
.lock-card{position:relative;overflow:hidden;width:min(440px,100%);padding:38px 32px 26px;border-radius:24px;text-align:center;
  background:linear-gradient(165deg,var(--panel),var(--surface));border:1px solid var(--border);
  box-shadow:0 30px 80px -32px rgba(79,70,229,.5);
  display:flex;flex-direction:column;align-items:center;gap:8px}
.lock-shade{position:absolute;inset:-42% -30% auto;height:220px;pointer-events:none;
  background:radial-gradient(closest-side,rgba(99,102,241,.34),transparent 72%);filter:blur(6px)}
.lock-badge{position:relative;display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 12px;border-radius:999px;
  background:rgba(99,102,241,.12);color:var(--accent);font-size:11.5px;font-weight:700;letter-spacing:.3px}
.lock-ico{position:relative;width:72px;height:72px;border-radius:20px;display:grid;place-items:center;margin-top:10px;
  background:linear-gradient(135deg,rgba(99,102,241,.16),rgba(14,165,233,.12));border:1px solid var(--border);
  font-size:30px;color:var(--accent);box-shadow:0 14px 32px -14px rgba(99,102,241,.55);overflow:hidden}
.lock-ico img{width:100%;height:100%;object-fit:cover}
.lock-card h1{position:relative;margin:6px 0 0;font-size:22px;font-weight:800;letter-spacing:-.4px;word-break:break-word}
.lock-desc{position:relative;margin:2px 0 0;font-size:12.5px;color:var(--muted);max-width:34ch;line-height:1.7}
.lock-sub{position:relative;margin:4px 0 12px;font-size:12.5px;color:var(--text-2);line-height:1.75;max-width:36ch}
.lock-form{position:relative;width:100%;display:flex;flex-direction:column;gap:10px}
.lock-in{display:flex;align-items:center;gap:9px;height:46px;padding:0 8px 0 14px;border-radius:14px;
  border:1px solid var(--border);background:var(--surface);transition:.2s}
.lock-in:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px rgba(99,102,241,.13)}
.lock-in>i{color:var(--muted);font-size:14px}
.lock-in input{flex:1;min-width:0;height:100%;border:0;outline:none;background:transparent;color:var(--text);font-size:14px}
.lock-eye{flex:none;width:32px;height:32px;border:0;border-radius:9px;background:transparent;color:var(--muted);
  cursor:pointer;display:grid;place-items:center;transition:.18s}
.lock-eye:hover{background:rgba(99,102,241,.1);color:var(--accent)}
.lock-btn{height:46px;border:0;border-radius:14px;cursor:pointer;font-size:14px;font-weight:700;color:#fff;
  background:linear-gradient(135deg,#6366f1,#8b5cf6 60%,#0ea5e9);box-shadow:0 14px 30px -12px rgba(99,102,241,.7);
  display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.2s}
.lock-btn:hover{transform:translateY(-1px);box-shadow:0 18px 36px -12px rgba(99,102,241,.8)}
.lock-btn:disabled{opacity:.65;cursor:not-allowed;transform:none}
.lock-msg{display:flex;align-items:center;justify-content:center;gap:7px;font-size:12.5px;line-height:1.7;
  padding:9px 12px;border-radius:11px}
.lock-msg.err{background:rgba(244,63,94,.1);border:1px solid rgba(244,63,94,.3);color:#e11d48}
.lock-msg.ok{background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.3);color:#059669}
.lock-foot{position:relative;display:flex;align-items:center;gap:8px;margin-top:16px;font-size:12px;color:var(--muted)}
.lock-foot a{color:var(--muted);text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.lock-foot a:hover{color:var(--accent)}
.lk-badge{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:6px;
  background:rgba(99,102,241,.14);color:var(--accent);font-size:10px;margin-left:5px;vertical-align:middle}
@media(max-width:760px){
  .lock-wrap{padding:18px 12px 42px;min-height:auto}
  .lock-card{padding:30px 22px 22px;border-radius:20px}
  .lock-card h1{font-size:20px}
}


/* ==========================================================================
   友情链接 / 页脚图标 / 底部 Dock 自定义入口
   ========================================================================== */
.foot-links{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;align-items:flex-start}
.foot-links a{display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.foot-ic{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;font-size:12px;flex:none}
.foot-ic img{width:100%;height:100%;object-fit:cover;border-radius:4px}
.foot-tx{display:inline-flex;align-items:baseline;gap:6px}
.foot-tx em{font-style:normal;font-size:11px;color:var(--muted)}
.foot-links a:hover .foot-tx em{color:var(--accent)}

.dock .dock-it{position:relative}
.dock .dock-ic{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;font-size:17px;line-height:1}
.dock .dock-ic img{width:100%;height:100%;object-fit:cover;border-radius:7px}
.dock .dock-num{
  position:absolute;top:1px;right:0;min-width:15px;height:15px;padding:0 4px;border-radius:999px;
  background:var(--accent);color:#fff;font-size:9.5px;font-style:normal;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;
}

.flinks a{gap:8px;height:auto;min-height:34px;padding:4px 12px 4px 6px;border-radius:12px}
.fl-ic{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;font-size:16px;flex:none}
.fl-ic img{width:100%;height:100%;object-fit:cover;border-radius:6px}
.fl-tx{display:inline-flex;flex-direction:column;line-height:1.25}
.fl-tx b{font-weight:600;font-size:12.5px}
.fl-tx em{font-style:normal;font-size:11px;color:var(--muted)}
.flinks a:hover .fl-tx em{color:var(--accent)}

.flinks .muted{font-size:12px;color:var(--muted)}
.fl-mini{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.fl-mini a{display:flex;align-items:center;gap:7px;padding:6px 8px;border-radius:9px;background:var(--bg);
  border:1px solid var(--border);color:var(--text-2);font-size:12px;text-decoration:none;transition:all .2s}
.fl-mini a:hover{color:var(--accent);border-color:var(--accent)}
.fl-mini-ico{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;font-size:14px;flex:none}
.fl-mini-ico img{width:100%;height:100%;object-fit:cover;border-radius:5px}
.fl-mini b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.friend-hero .sb-orbit i{font-size:44px}
@media(max-width:760px){
  .fl-mini{grid-template-columns:minmax(0,1fr)}
  .foot-links{gap:6px 10px}
  .foot-tx em{display:none}
}

/* ===== 首页品牌固定位（一行坑位，未满用招募占位补齐） ===== */
.fixads{margin-top:18px;padding:16px 18px;border-radius:18px;
  background:var(--panel);border:1px solid var(--card-border);backdrop-filter:blur(12px)}
.fixads-hd{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.fixads-hd b{display:inline-flex;align-items:center;gap:7px;font-size:15px;font-weight:700;letter-spacing:-.2px}
.fixads-hd b i{color:var(--accent);font-size:16px}
.fixads-hd em{font-style:normal;font-size:11.5px;color:var(--muted)}
.fixads-in{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;
  padding:6px 13px;border-radius:999px;background:var(--grad);color:#fff;text-decoration:none;
  box-shadow:0 8px 20px rgba(99,102,241,.28);transition:transform .2s,box-shadow .2s}
.fixads-in:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(99,102,241,.36)}
.fixads-grid{display:grid;grid-template-columns:repeat(var(--fcols,4),minmax(0,1fr));gap:12px}
/* 手机端专属坑位：桌面端不渲染 */
.fixads-grid .fx-m{display:none}
.fixcard{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:3px;
  min-height:92px;padding:13px 14px;border-radius:14px;overflow:hidden;isolation:isolate;
  text-decoration:none;color:#fff;background:linear-gradient(135deg,#4f46e5,#7c3aed 60%,#0ea5e9);
  box-shadow:0 10px 24px rgba(79,70,229,.20);transition:transform .28s cubic-bezier(.22,.61,.36,1),box-shadow .28s}
.fixcard:hover{transform:translateY(-3px);box-shadow:0 16px 32px rgba(79,70,229,.30)}
.fixcard[style*="--fix-theme"]{background:linear-gradient(135deg,var(--fix-theme),#111827 130%)}
/* 封面图作为卡片背景（仅当有封面时才叠加），无封面保持主题色渐变底 */
.fixcard.has-bg{background:linear-gradient(135deg,#1f2937,#0f172a)}
.fixcard.has-bg[style*="--fix-theme"]{background:linear-gradient(135deg,var(--fix-theme),#0f172a 130%)}
.fixc-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:1;
  transition:transform .6s cubic-bezier(.22,.61,.36,1)}
.fixcard:hover .fixc-bg{transform:scale(1.05)}
/* 有封面时压一层暗色遮罩，保证文字可读 */
.fixcard.has-bg::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(115deg,rgba(9,12,22,.82) 0%,rgba(9,12,22,.52) 58%,rgba(9,12,22,.18) 100%)}
.fixcard .fixc-ico,.fixcard b,.fixcard em{position:relative;z-index:2}
.fixc-tx{display:contents}
.fixc-ico{width:32px;height:32px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:700;color:#fff;overflow:hidden}
.fixc-ico img{width:100%;height:100%;object-fit:cover;border-radius:9px}
.ad-ico{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:6px;
  border-radius:6px;background:rgba(255,255,255,.22);font-size:12px;font-style:normal;vertical-align:-3px;overflow:hidden}
.ad-ico img{width:100%;height:100%;object-fit:cover}
.fixcard b{font-size:13.5px;font-weight:700;line-height:1.35;max-width:100%;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 8px rgba(0,0,0,.28)}
.fixcard em{font-style:normal;font-size:11.5px;line-height:1.45;opacity:.84;max-width:100%;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fixc-mark{position:absolute;top:8px;right:8px;z-index:3;font-style:normal;font-size:9.5px;letter-spacing:.4px;
  padding:1px 5px;border-radius:5px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.22)}
.fixcard.empty{background:transparent;border:1.5px dashed var(--border);box-shadow:none;color:var(--muted);
  align-items:center;justify-content:center;text-align:center;gap:2px}
.fixcard.empty:hover{border-color:var(--accent);color:var(--accent);background:var(--primary-light);transform:translateY(-3px)}
.fixcard.empty .fixc-ico{background:transparent;border:1.5px dashed currentColor;color:inherit;box-shadow:none}
.fixcard.empty b{font-size:12.5px;color:inherit;text-shadow:none}
.fixcard.empty em{font-size:11px;opacity:.8}

/* 固定位入驻弹窗 */
.modal .box.box-fixad{width:100%;max-width:620px;text-align:left;
  max-height:calc(100vh - 40px);overflow-y:auto;overscroll-behavior:contain;padding:20px 22px 22px}
.fx-hd{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding-right:38px}
.fx-hd h3{margin:0;font-size:16.5px;font-weight:800;letter-spacing:.2px;display:inline-flex;align-items:center;gap:8px}
.fx-hd h3 i{font-size:15px;color:var(--accent)}
.fx-price{margin-left:auto;font-size:12px;font-weight:700;padding:4px 11px;border-radius:999px;
  background:var(--primary-light);color:var(--accent);white-space:nowrap}
.fx-sub{margin:6px 0 0;font-size:12.5px;line-height:1.65;color:var(--muted)}

/* 表单分区：每组字段独立卡片，层次清晰 */
.fx-form{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.fx-sec{padding:14px 14px 15px;border:1px solid var(--card-border);border-radius:14px;background:var(--surface-2)}
.fx-sec-hd{display:flex;align-items:center;gap:9px;margin-bottom:12px}
.fx-sec-n{flex:none;width:20px;height:20px;border-radius:7px;display:grid;place-items:center;
  font-size:11px;font-weight:800;color:#fff;background:var(--grad);box-shadow:0 4px 10px rgba(99,102,241,.28)}
.fx-sec-t{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;min-width:0}
.fx-sec-t b{font-size:13px;font-weight:700;color:var(--text)}
.fx-sec-t em{font-style:normal;font-size:11.5px;color:var(--muted)}
.fx-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.fx-f{display:flex;flex-direction:column;gap:6px;min-width:0}
.fx-f.span2,.fx-agree.span2,.fx-act.span2,.fx-result.span2{grid-column:1 / -1}
.fx-f>span{display:inline-flex;align-items:center;gap:2px;font-size:12px;font-weight:600;color:var(--text-2);text-align:left}
.fx-req{font-style:normal;font-weight:700;color:#ef4444}
.fx-f .inp{display:block;width:100%;max-width:100%;box-sizing:border-box;height:42px;padding:0 13px;
  border:1px solid var(--border);border-radius:11px;background:var(--surface);color:var(--text);
  font-size:13px;outline:none;transition:border-color .18s,box-shadow .18s}
.fx-f .inp:hover{border-color:#cbd5e6}
.fx-f .inp::placeholder{color:var(--muted)}
.fx-f .inp:focus{border-color:var(--accent);box-shadow:0 0 0 3.5px rgba(99,102,241,.13)}

/* 输入框左侧的前缀块（链接图标 / 图标预览） */
.fx-inline{display:flex;gap:8px;align-items:center;min-width:0}
.fx-inline .inp{flex:1 1 auto;min-width:0}
.fx-lead{flex:none;width:42px;height:42px;border:1px solid var(--border);border-radius:11px;
  display:grid;place-items:center;overflow:hidden;background:var(--surface-2);
  color:var(--muted);font-size:15px;line-height:1}
.fx-lead.fx-icoprev{font-size:19px;font-weight:700;color:var(--text-2)}
.fx-icoprev img{width:100%;height:100%;object-fit:cover;display:block}

/* 行内小按钮 */
.fx-mini{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:5px;height:42px;padding:0 14px;
  border:1px solid transparent;border-radius:11px;background:var(--grad);color:#fff;font-size:12.5px;
  font-weight:700;cursor:pointer;white-space:nowrap;box-shadow:0 6px 14px rgba(99,102,241,.22);
  transition:transform .18s,box-shadow .18s,opacity .18s}
.fx-mini:hover{transform:translateY(-1px);box-shadow:0 9px 20px rgba(99,102,241,.3)}
.fx-mini:active{transform:none;box-shadow:0 4px 10px rgba(99,102,241,.2)}
.fx-mini:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}
.fx-mini.ghost{background:var(--surface);color:var(--text-2);border-color:var(--border);box-shadow:none;font-weight:600}
.fx-mini.ghost:hover{border-color:#cbd5e6;color:var(--text);box-shadow:0 4px 12px rgba(24,32,56,.08)}
.fx-hint{font-size:11.5px;line-height:1.55;color:var(--muted)}

/* 封面预览：与推荐尺寸 4:1 一致，限制最大高度避免过高 */
.fx-shot{margin-top:2px;aspect-ratio:4/1;max-height:118px;border-radius:12px;overflow:hidden;
  border:1px solid var(--border);background:var(--surface)}
.fx-shot img{width:100%;height:100%;object-fit:cover;display:block}

/* 主题色：色块 + 十六进制输入，比整条色条更紧凑 */
.fx-color-row{display:flex;gap:8px;align-items:center;min-width:0}
.fx-swatch{flex:none;width:42px;height:42px;padding:0;border:1px solid var(--border);border-radius:11px;
  background:var(--surface);cursor:pointer;-webkit-appearance:none;appearance:none;overflow:hidden}
.fx-swatch::-webkit-color-swatch-wrapper{padding:0}
.fx-swatch::-webkit-color-swatch{border:none;border-radius:9px}
.fx-swatch::-moz-color-swatch{border:none;border-radius:9px}
.fx-hex{flex:1 1 auto;min-width:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.4px;text-transform:lowercase}

.fx-agree{display:flex;align-items:flex-start;gap:9px;padding:1px;font-size:12px;color:var(--muted);line-height:1.6;text-align:left}
.fx-agree input{margin:2px 0 0;flex:none;width:16px;height:16px;accent-color:var(--accent);cursor:pointer}
.fx-agree a{color:var(--accent);font-weight:600}
.fx-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:2px}
.fx-act .btn{flex:1 1 auto;justify-content:center}
.fx-result{padding:9px 12px;border-radius:10px;font-size:12.5px;line-height:1.6;text-align:left}
.fx-result.ok{background:rgba(16,185,129,.12);color:#0f9d63}
.fx-result.err{background:rgba(239,68,68,.12);color:#dc2626}
.fx-go{margin-left:6px;font-weight:700;color:var(--accent);text-decoration:none}

.fx-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:9px}
.fx-plan{position:relative;display:block;cursor:pointer;min-width:0}
.fx-plan input{position:absolute;opacity:0;pointer-events:none}
.fx-plan-in{position:relative;display:flex;flex-direction:column;gap:3px;padding:11px 13px;
  border:1.5px solid var(--border);border-radius:12px;background:var(--surface);transition:.18s}
.fx-plan:hover .fx-plan-in{border-color:#cbd5e6}
.fx-plan-in b{font-size:13px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-plan-in em{font-style:normal;font-size:12px;font-weight:700;color:var(--accent)}
.fx-plan input:checked + .fx-plan-in{border-color:var(--accent);background:var(--primary-light);
  box-shadow:0 6px 18px rgba(99,102,241,.16)}
.fx-plan input:focus-visible + .fx-plan-in{box-shadow:0 0 0 3px rgba(99,102,241,.2)}
.fx-plan-b{position:absolute;top:-7px;right:8px;font-style:normal;font-size:10px;font-weight:700;
  padding:1px 6px;border-radius:999px;background:var(--grad);color:#fff}
.fx-total{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 5px;margin-top:10px;padding:10px 12px;
  border-radius:11px;font-size:12px;line-height:1.5;color:var(--text-2);
  background:var(--primary-light);border:1px solid rgba(99,102,241,.18)}
.fx-total b{font-size:14.5px;font-weight:800;color:var(--accent)}
.fx-total em{flex-basis:100%;font-style:normal;font-size:11px;color:var(--muted)}
.fx-total:empty{display:none}
@media(max-width:560px){
  .modal .box.box-fixad{padding:18px 14px 18px;border-radius:16px}
  .fx-grid{grid-template-columns:minmax(0,1fr)}
  .fx-sec{padding:12px}
}
@media(max-width:1200px){
  .fixads-grid[data-cols="5"],.fixads-grid[data-cols="6"],
  .fixads-grid[data-cols="7"],.fixads-grid[data-cols="8"],
  .fixads-grid[data-cols="9"]{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:900px){
  .fixads-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:760px){
  .fixads{padding:13px 14px;border-radius:15px}
  .fixads-hd em{display:none}
  .fixcard{min-height:84px;padding:11px 12px}
  .fx-form{grid-template-columns:minmax(0,1fr)}
  .modal .box.box-fixad{padding:18px 16px;border-radius:16px}
  .fx-hd h3{font-size:15px}
  .fx-price{margin-left:0}
  .fx-act{flex-direction:column}
  .fx-act .btn{width:100%}
}

/* 广告入驻页：位置选择 */
.ad-pos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}
.ad-pos-it{position:relative;display:block;cursor:pointer}
.ad-pos-it input{position:absolute;opacity:0;pointer-events:none}
.ad-pos-in{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:12px;
  border:1.5px solid var(--border);background:var(--surface);transition:.2s}
.ad-pos-in b{font-size:13px;font-weight:700;display:inline-flex;align-items:center;gap:6px}
.ad-pos-in b i{color:var(--accent)}
.ad-pos-in em{font-style:normal;font-size:11.5px;color:var(--muted)}
.ad-pos-price{font-style:normal;margin-top:2px;font-size:12px;font-weight:700;color:var(--accent)}
.ad-pos-it input:checked + .ad-pos-in{border-color:var(--accent);background:var(--primary-light);
  box-shadow:0 6px 18px rgba(99,102,241,.18)}
.ad-plans[hidden]{display:none !important}
@media(max-width:760px){
  .ad-pos{grid-template-columns:minmax(0,1fr)}
}

/* 工具箱 /tools */
.tl-wrap{display:flex;flex-direction:column;gap:16px;min-width:0}
.tl-hero{padding:34px 32px 30px}
.tl-orbit{position:absolute;right:38px;top:50%;transform:translateY(-50%);width:148px;height:148px;pointer-events:none;opacity:.55}
.tl-orbit span{position:absolute;inset:0;border-radius:50%;border:1px dashed rgba(255,255,255,.4)}
.tl-orbit .o1{animation:sb-spin 26s linear infinite}
.tl-orbit .o2{inset:26px;border-style:solid;border-color:rgba(255,255,255,.24);animation:sb-spin 18s linear infinite reverse}
.tl-orbit i{position:absolute;inset:0;margin:auto;width:26px;height:26px;font-size:26px;color:#fff;
  animation:sw-twinkle 3s ease-in-out infinite}
.tl-search{position:relative;display:flex;align-items:center;gap:10px;margin-top:18px;height:46px;padding:0 13px;
  max-width:520px;border-radius:14px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.32);
  backdrop-filter:blur(8px);transition:border-color .2s,background .2s}
.tl-search:focus-within{background:rgba(255,255,255,.24);border-color:rgba(255,255,255,.6)}
.tl-search>i{font-size:14px;color:rgba(255,255,255,.82);flex:none}
.tl-search input{flex:1;min-width:0;border:0;background:none;outline:none;color:#fff;font-size:13.5px}
.tl-search input::placeholder{color:rgba(255,255,255,.66)}
.tl-search button{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;
  border:0;border-radius:7px;background:rgba(255,255,255,.18);color:#fff;cursor:pointer;font-size:10px}
.tl-search kbd{flex:none;min-width:20px;height:20px;padding:0 5px;border-radius:5px;font:600 11px/20px ui-monospace,monospace;
  text-align:center;color:rgba(255,255,255,.82);background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3)}

.tl-filter{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.tl-chips{display:flex;gap:8px;overflow-x:auto;padding:2px;scrollbar-width:none;-ms-overflow-style:none}
.tl-chips::-webkit-scrollbar{display:none}
.tl-chips button{flex:none;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:11px;
  border:1px solid var(--border);background:var(--panel);color:var(--text-2);font-size:12.5px;cursor:pointer;
  transition:background .2s,color .2s,border-color .2s,box-shadow .2s}
.tl-chips button i{font-size:12px;opacity:.8}
.tl-chips button em{font-style:normal;font-size:10.5px;padding:1px 6px;border-radius:999px;
  background:var(--surface-2);color:var(--muted);transition:.2s}
.tl-chips button:hover{border-color:var(--accent);color:var(--accent)}
.tl-chips button.on{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 8px 20px var(--glow-1)}
.tl-chips button.on em{background:rgba(255,255,255,.24);color:#fff}
.tl-count{font-size:12px;color:var(--muted);flex:none}

.tl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:12px}
.tl-card{position:relative;display:flex;align-items:flex-start;gap:12px;padding:15px 16px;border-radius:16px;
  background:var(--panel);border:1px solid var(--border);overflow:hidden;
  transition:transform .25s cubic-bezier(.22,.61,.36,1),border-color .25s,box-shadow .25s}
.tl-card::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .25s;
  background:radial-gradient(240px 130px at 6% 0%,var(--glow-1),transparent 72%)}
.tl-card:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 14px 30px rgba(15,23,42,.12)}
.tl-card:hover::before{opacity:1}
.tl-card.hide{display:none}
.tl-ico{position:relative;z-index:1;flex:none;width:42px;height:42px;border-radius:13px;
  display:inline-flex;align-items:center;justify-content:center;font-size:19px;color:#fff;
  background:linear-gradient(140deg,var(--tc) 0%,var(--tc) 52%,rgba(9,12,22,.62) 100%);
  box-shadow:0 7px 16px rgba(15,23,42,.16)}
.tl-b{position:relative;z-index:1;display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.tl-b b{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:var(--text)}
.tl-badge{flex:none;font-style:normal;font-size:9.5px;font-weight:700;padding:1px 6px;border-radius:999px;
  background:var(--primary-light);color:var(--accent)}
.tl-b span{font-size:12px;line-height:1.6;color:var(--muted);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tl-go{position:relative;z-index:1;flex:none;font-size:13px;color:var(--muted);transition:transform .25s,color .25s}
.tl-card:hover .tl-go{color:var(--accent);transform:translate(2px,-2px)}

.tl-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:5px;padding:48px 20px;
  border-radius:16px;border:1px dashed var(--border);background:var(--panel);text-align:center}
.tl-empty i{font-size:26px;color:var(--muted)}
.tl-empty b{font-size:14px;color:var(--text-2)}
.tl-empty span{font-size:12px;color:var(--muted)}
/* 插件卡片用 emoji 图标 */
.tl-card .tl-emoji{font-style:normal;font-size:21px;line-height:1}
/* 外链工具用图片图标（后台新增插件时填写的图标地址） */
.tl-card .tl-logo{width:22px;height:22px;object-fit:contain;border-radius:5px;display:block}
/* .tl-empty / 清空按钮自带 display，会盖掉 [hidden] 的浏览器默认隐藏，这里强制生效 */
.tl-wrap [hidden]{display:none!important}
/* 完全没有工具时的空数据块 */
.tl-none{display:flex;flex-direction:column;align-items:center;gap:8px;padding:46px 20px;border-radius:18px;
  background:var(--panel);border:1px dashed var(--border);text-align:center}
.tl-none>i{font-size:30px;color:var(--muted)}
.tl-none b{font-size:14.5px;color:var(--text-2)}
.tl-none span{font-size:12.5px;color:var(--muted)}

.tl-tip{display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:16px;
  background:var(--panel);border:1px solid var(--border)}
.tl-tip>i{flex:none;font-size:18px;color:var(--accent)}
.tl-tip div{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.tl-tip b{font-size:13px}
.tl-tip span{font-size:12px;color:var(--muted)}
.tl-tip a{flex:none;font-size:12.5px;color:var(--accent);white-space:nowrap}

@media(max-width:960px){
  .tl-orbit{display:none}
}
@media(max-width:760px){
  .tl-hero{padding:26px 20px 22px}
  .tl-search{max-width:none}
  .tl-search kbd{display:none}
  .tl-grid{grid-template-columns:minmax(0,1fr)}
  .tl-tip{flex-wrap:wrap;align-items:flex-start}
  .tl-tip a{white-space:normal}
}

/* ==========================================================================
   手机端（≤640px）：顶栏品牌化 + Hero 居中搜索布局
   桌面端与平板端保持原有样式
   ========================================================================== */
/* 手机端专属元素：桌面端不渲染 */
.mbrand,.macts,.h1-brand,.mgo-ico,.m-noticebar{display:none}

@media(max-width:640px){
  :root{--top:54px}

  /* 顶栏：左侧品牌，右侧操作图标，与 Hero 紫色连成一体 */
  .topbar{
    height:54px;padding:0 12px;gap:8px;justify-content:space-between;
    background:var(--hero-grad);border-bottom:0;box-shadow:none;
  }
  .topbar.scrolled{background:var(--hero-grad);box-shadow:0 8px 22px -16px rgba(15,8,45,.65)}
  html[data-theme="dark"] .topbar,
  html[data-theme="dark"] .topbar.scrolled{background:var(--hero-grad)}
  .topbar>.burger,
  .topbar .tnav,
  .topbar .tsearch,
  .topbar .tacts{display:none}
  .topband{display:none}

  .mbrand{display:flex;align-items:center;gap:9px;flex:1;min-width:0}
  .mblogo{
    width:34px;height:34px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:17px;
    background:linear-gradient(135deg,#ffd75e,#ffa41b);
    box-shadow:0 4px 12px rgba(20,0,40,.28);
  }
  .mblogo img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
  .mbtx{display:flex;flex-direction:column;line-height:1.16;min-width:0}
  .mbtx b{
    font-size:15px;font-weight:800;letter-spacing:.3px;color:#86ff57;
    text-shadow:0 1px 2px rgba(0,0,0,.28);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .mbtx em{
    font-style:normal;font-size:9px;color:#ff9db0;margin-top:2px;max-width:170px;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .macts{display:flex;align-items:center;gap:1px;flex:none;margin-left:auto}
  .mact{
    display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:9px;
    background:transparent;color:#fff;font-size:19px;line-height:1;cursor:pointer;
    transition:background .18s ease;
  }
  .mact:active{background:rgba(255,255,255,.18)}
  .macts .burger{width:32px;height:32px;border:0;background:transparent;color:#fff;box-shadow:none}
  .macts .burger:hover{background:rgba(255,255,255,.18);color:#fff}

  /* Hero：通栏紫色，居中标题 / 分类页签 / 深色搜索胶囊 / 引擎页签 / 公告条 */
  .home-top{max-width:100%;padding:0}
  .hero-xl{padding-top:0}
  .hero-in{padding:14px 14px 16px;border-radius:0 0 22px 22px;grid-template-columns:1fr;gap:0}
  .hero-copy{text-align:center}
  .hero-tag,.hero-sub,.hero-nums{display:none}
  .hero-xl h1{margin:2px 0 14px;font-size:clamp(24px,7.2vw,32px);letter-spacing:1px;line-height:1.2}
  .h1-tag{display:none}
  .h1-brand{display:inline}
  .hero-search{max-width:none;gap:9px;margin:0 auto}

  .stabs{justify-content:center;gap:20px;margin-bottom:2px}
  .stabs button{font-size:14px;padding-bottom:8px;letter-spacing:.5px}

  .hero-sinput{
    height:48px;border-radius:999px;padding:0 7px 0 18px;
    background:rgba(46,4,92,.42);border:1px solid rgba(255,255,255,.18);
    box-shadow:0 14px 28px -16px rgba(15,0,45,.65);backdrop-filter:blur(8px);
  }
  html[data-theme] .hero-sinput{background:rgba(46,4,92,.42);border-color:rgba(255,255,255,.18)}
  .hero-sinput:focus-within{
    box-shadow:0 0 0 3px rgba(255,255,255,.16),0 14px 28px -16px rgba(15,0,45,.65);
  }
  .hero-sinput > .bi{display:none}
  .hero-sinput input{font-size:16px;color:#fff}
  html[data-theme] .hero-sinput input{color:#fff}
  .hero-sinput input::placeholder{color:rgba(255,255,255,.62)}
  html[data-theme] .hero-sinput input::placeholder{color:rgba(255,255,255,.62)}
  .hero-sinput .go{
    width:36px;height:36px;padding:0;border-radius:50%;background:transparent;box-shadow:none;
    display:grid;place-items:center;color:#fff;
  }
  .hero-sinput .go:active{transform:scale(.94)}
  .mgo-ico{display:block;font-size:20px}
  .mgo-tx{display:none}

  .squick{justify-content:center;gap:20px;padding-top:4px}
  .squick button{font-size:13.5px}

  .m-noticebar{
    display:flex;margin:5px 0 0;padding:5px 9px;border-radius:10px;max-width:none;
    background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);color:#fff;
    backdrop-filter:blur(8px);
  }
  .m-noticebar i{color:#fff}
  .m-noticebar button{color:rgba(255,255,255,.8)}
  .main>.noticebar{display:none}

  /* 顶栏/ Hero 通栏后，其余首页模块补回左右间距 */
  .qstrip{margin:10px 12px 0}
  .banners{margin:10px 12px 0}
  .fixads{margin:18px 12px 0}

  /* 横幅广告：手机端压缩高度 */
  .adzone{margin-top:10px}
  .adzone-hd{margin-bottom:6px}
  .ad-list[data-cols] .ad-card{height:auto;min-height:54px;padding:8px 12px;border-radius:12px;background: #e4d6d6;}
  .ad-title{font-size:13.5px;line-height:1.3}
  .ad-body{gap:3px 10px}
  .ad-cta{padding:3px 9px;font-size:11px;border-radius:8px}

  /* 固定广告：手机端一行三个，紧凑高度 */
  .fixads{padding:12px;border-radius:14px}
  .fixads-hd{margin-bottom:9px}
  .fixads-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px}
  .fixcard{
    flex-direction:column;align-items:center;justify-content:center;gap:3px;text-align:center;
    min-height:60px;padding:6px 4px;border-radius:11px;
  }
  .fixc-ico{width:26px;height:26px;border-radius:7px;font-size:13px;flex:none}
  .fixc-tx{display:flex;flex-direction:column;align-items:center;min-width:0;width:100%;flex:none;gap:1px;padding-right:0}
  .fixcard b{font-size:11px;line-height:1.2}
  .fixcard em{display:none}
  .fixc-mark{top:4px;right:4px;font-size:7.5px;padding:0 3px}
  .fixcard.empty{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px;min-height:60px}
  .fixcard.empty .fixc-ico{width:26px;height:26px}
  .fixcard.empty b{font-size:11px}
  /* 手机端不出空行：桌面专属坑位隐藏，手机专属坑位按 3 列补满整行 */
  .fixads-grid .fx-d{display:none}
  .fixads-grid .fx-m{display:flex}

  /* 今日精选：隐藏副标题，站点一行三个 */
  .pick-sec .sec-head em{display:none}
  .pick-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
  .pick{flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:10px 6px;text-align:center;border-radius:12px}
  .pick-ico{width:32px;height:32px;border-radius:9px;font-size:16px}
  .pick-b{flex:none;width:100%}
  .pick-b b{font-size:11.5px}
  .pick-b em{display:none}
  .pick-go{display:none}

  /* 最新文章：一行两个，卡片高度压缩 */
  .art-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
  .arcard .cover{aspect-ratio:16/8}
  .arcard .cover .ph{font-size:22px}
  .arcard .cover em{top:4px;height:16px;padding:0 4px;border-radius:4px;font-size:9px;gap:3px}
  .arcard .a-top{left:4px}
  .arcard .a-views{right:4px}
  .arcard .a-views i{font-size:9px}
  .arcard .body{padding:5px 2px 5px}
  .arcard h4{font-size:12.5px;margin-bottom:4px}
  .arcard p{display:none}
  .arcard .m{margin-top:6px;gap:4px 8px;font-size:10px;flex-wrap:wrap}

  /* 分类筛选：整行白色标签横向滑动，右侧箭头展开全部 */
  .tagbar-wrap{gap:0;margin:10px 0 2px;align-items:stretch}
  .tagbar{
    flex:1 1 auto;width:auto;
    flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
    padding:7px 28px 3px 2px;gap:6px;border-radius:0;background:transparent;border:0;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;touch-action:pan-x;
  }
  .tagbar::-webkit-scrollbar{display:none}
  .tagbar .tg{
    flex:none;height:30px;padding:0 7px;border-radius:6px;
    border:0;background:var(--surface);color:var(--text);
    font-size:12.5px;font-weight:500;
    box-shadow:0 1px 2px rgba(24,28,60,.06);
  }
  .tagbar .tg em{
    top:-6px;right:-4px;min-width:16px;height:16px;padding:0 4px;
    background:#eef0ff;color:#5b5ef0;border-color:var(--surface);font-size:9px;
    box-shadow:0 2px 6px rgba(60,63,120,.16);
  }
  .tagbar .tg:hover{transform:none;background:var(--surface);border-color:transparent;color:var(--text)}
  .tagbar .tg.on{
         background: #b39898;
        border-color: transparent;
        color: #fff;
        box-shadow: none;
      
  }
  .tagbar .tg.on em{background:#fff;color:#5b5ef0}
  .tag-more{
    position:absolute;right:-3px;top:0;bottom:0;width:32px;
    display:flex;align-items:center;justify-content:flex-end;
    padding:0;border:0;cursor:pointer;
    background:linear-gradient(90deg,rgba(255,255,255,0),var(--bg) 58%);
    color:var(--text-2);font-size:18px;line-height:1;
  }
  .tag-more b,.tag-more .bi-grid-3x3-gap{display:none}
  .tag-more .bi-chevron-down{display:inline-block;font-size:15px;font-weight:700;transform:rotate(-90deg);transition:transform .2s ease}
  .tag-more.on{color:var(--accent)}
  .tag-more.on .bi-chevron-down{transform:rotate(0)}
  .tagpanel{
    position:absolute;top:calc(100% + 6px);left:0;z-index:80;
    display:flex;width:100%;max-height:250px;overflow-y:auto;padding:10px;
    flex-wrap:wrap;gap:8px;align-items:flex-start;
    background:var(--surface);border:1px solid var(--card-border);border-radius:12px;
    box-shadow:0 18px 40px -18px rgba(20,16,50,.45);
    animation:tagPanelIn .18s ease both;
  }
  .tagpanel[hidden]{display:none}
  .tagpanel.up{top:auto;bottom:calc(100% + 6px);animation-name:tagPanelUp}
  .tagpanel .tg{
    display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 12px;
    border-radius:10px;border:0;background:var(--bg);
    color:var(--text);font-size:12px;font-weight:500;
  }
  .tagpanel .tg em{font-style:normal;font-size:9px;padding:1px 4px;border-radius:999px;background:#eef0ff;color:#5b5ef0;font-weight:700}
  .tagpanel .tg.on{background:var(--primary-light);color:var(--accent)}
  .tagpanel .tg.on em{background:#fff;color:#5b5ef0}
  .tagpanel .tg i{width:16px;height:16px;display:inline-grid;place-items:center;flex:none}
  @keyframes tagPanelIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  @keyframes tagPanelUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
}

/* ===== 站内插件工作台（/plugins/*）：插件自带 .modal-mask 结构，这里补齐基础定位 ===== */
.modal-mask{position:fixed;inset:0;z-index:800;background:transparent;backdrop-filter:none;
  display:none;align-items:center;justify-content:center;padding:8px}
.modal-mask.show{display:flex}
/* 弹窗面板骨架（对齐纯净版 main.css）：纵向 flex + 裁切，内容区自行滚动。
   缺少这段时插件 .modal-body 的 flex:1 失效，内容会撑出固定高度的面板。 */
.modal-panel{display:flex;flex-direction:column;overflow:hidden}
.modal-head{flex-shrink:0}
.modal-body{flex:1 1 auto;min-height:0;overflow-y:auto}
body.cvp-modal-open,body.wmw-modal-open,body.m3u8-modal-open{overflow:hidden}

/* ===== 分类页（/c/:slug）：紧凑布局，手机 / 电脑自适应 ===== */
/* 区块之间统一压缩到 12px，广告位与站点网格不再额外叠加外边距 */
.page-category .main{gap:12px}
.page-category .cat-head{
  padding:14px 16px;gap:12px;
  background:
    radial-gradient(120% 140% at 100% 0%,var(--primary-light),transparent 60%),
    var(--panel);
}
.page-category .cat-ico{width:44px;height:44px;border-radius:12px;font-size:20px;flex:none}
.page-category .ch-body{min-width:0;flex:1}
.page-category .ch-body h1{font-size:18px;line-height:1.25}
.page-category .ch-body p{margin-top:3px;font-size:12px}
.page-category .adzone,
.page-category .fixads,
.page-category .grid{margin-top:0}
.page-category .grid{gap:10px}
.page-category .pager{padding:2px 0 0}
.page-category .pager a,
.page-category .pager span{height:30px;min-width:30px;padding:0 10px;font-size:12px}

/* 筛选卡片：二级标签 + 排序合并到一张卡，上下间距压到最小 */
.page-category .cat-filter{display:flex;flex-direction:column;gap:8px;padding:10px 12px}
.page-category .cat-filter .tagbar{margin:0;padding:6px 0 0;gap:8px;background:transparent;border:0;border-radius:0}
.page-category .cat-filter .tagbar .tg{height:26px;font-size:11.5px}
.cf-sort{display:flex;align-items:center;gap:8px;min-width:0}
.cf-label{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--muted);flex:none}
.cs-seg{display:flex;gap:2px;padding:2px;border-radius:999px;background:var(--bg);border:1px solid var(--card-border);flex:none}
.cs-seg a{
  display:inline-flex;align-items:center;justify-content:center;
  height:26px;min-width:58px;padding:0 12px;border-radius:999px;
  font-size:12px;font-weight:600;color:var(--text-2);
  transition:background .2s,color .2s,box-shadow .2s;
}
.cs-seg a:hover{color:var(--accent)}
.cs-seg a.on{background:var(--grad);color:#fff;box-shadow:0 3px 10px rgba(99,102,241,.22)}

@media(max-width:640px){
  .page-category .main{gap:9px}
  .page-category .cat-head{padding:12px 13px;gap:10px}
  .page-category .cat-ico{width:40px;height:40px;border-radius:11px;font-size:19px}
  .page-category .ch-body h1{font-size:17px}
  .page-category .ch-body p{margin-top:2px;font-size:11.5px}
  .page-category .cat-filter{padding:8px 10px 9px;gap:7px}
  /* 标签一行横滑（给角标留出上内边距，避免数量徽标被裁切） */
  .page-category .cat-filter .tagbar{padding:8px 0 2px;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:6px}
  .page-category .cat-filter .tagbar .tg{height:28px;font-size:12px}
  .cf-sort{gap:6px}
  .cf-label{display:none}
  .cs-seg{flex:1}
  .cs-seg a{flex:1;min-width:0;height:28px;padding:0}
  /* 广告区高度同步压缩 */
  .page-category .adzone-hd{margin-bottom:5px}
  .page-category .fixads{padding:11px 12px;border-radius:14px}
  .page-category .fixads-hd{margin-bottom:7px}
  .page-category .fixcard{min-height:54px}
  .page-category .fixcard.empty{min-height:54px}
}

/* ===== 工具箱（tools.html）：手机端一行两个，卡片压缩为小方块，平板/电脑保持原样 ===== */
@media(max-width:640px){
  .tl-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .tl-card{gap:7px;padding:9px 9px;border-radius:12px;align-items:center}
  .tl-ico{width:30px;height:30px;border-radius:9px;font-size:14px;box-shadow:0 4px 10px rgba(15,23,42,.14)}
  .tl-card .tl-emoji{font-size:15px}
  .tl-card .tl-logo{width:16px;height:16px;border-radius:4px}
  .tl-b{gap:3px}
  .tl-b b{font-size:11.5px;gap:3px;line-height:1.3;flex-wrap:wrap}
  .tl-badge{font-size:8px;padding:0 4px}
  /* 卡片太窄，隐藏描述与右下箭头，只保留图标 + 名称 */
  .tl-b span{display:none}
  .tl-go{display:none}
  .tl-empty{padding:32px 16px}
  /* 底部提示条：只保留一行摘要 + 一行小链接，隐藏冗长说明 */
  .tl-tip{flex-wrap:wrap;align-items:center;gap:6px 8px;padding:11px 13px;border-radius:14px}
  .tl-tip>i{font-size:15px}
  .tl-tip div{flex:0 0 calc(100% - 23px);min-width:0;gap:0}
  .tl-tip b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
    font-size:12px;line-height:1.45;overflow:hidden}
  .tl-tip span{display:none}
  .tl-tip a{flex:0 0 100%;text-align:right;font-size:11.5px;line-height:1.4;
    white-space:normal;padding-top:2px;border-top:1px solid var(--border)}
  /* 顶部 Hero 瘦身：隐藏长描述，压缩标题、标签与搜索框 */
  .tl-hero{padding:19px 15px 17px;border-radius:16px}
  .tl-hero .sb-eyebrow{height:22px;padding:0 9px;font-size:10.5px;gap:4px}
  .tl-hero h1{margin:9px 0 0;font-size:20px;letter-spacing:-.3px;line-height:1.3}
  .tl-hero p{display:none}
  .tl-hero .sb-chips{margin-top:10px;gap:6px}
  .tl-hero .sb-chips>span{height:23px;padding:0 9px;font-size:10.5px;gap:4px}
  /* 只保留「工具数」「全部免费」两个标签，第三条说明隐藏 */
  .tl-hero .sb-chips>span:nth-child(3){display:none}
  .tl-hero .tl-search{margin-top:11px;height:42px;border-radius:12px}
  .tl-wrap{gap:12px}
}

/* ===== 手机端右侧栏抽屉：去掉标题栏，改用左边框中线的收缩按钮 ===== */
@media(max-width:640px){
  .rail-hd{display:none}
  .rail-collapse{
    display:grid;place-items:center;
    position:fixed;left:0;top:50%;transform:translateY(-50%);
    width:20px;height:58px;padding:0;cursor:pointer;
    border:1px solid var(--card-border);border-left:0;border-radius:0 11px 11px 0;
    background:var(--panel);color:var(--muted);z-index:2;
    box-shadow:8px 0 20px -12px rgba(18,14,45,.55);
    transition:width .22s ease,background .22s ease,color .22s ease;
  }
  .rail-collapse:hover,.rail-collapse:focus-visible{width:26px;background:var(--accent);color:#fff}
  .rail-collapse i{font-size:12px}
}

/* 悬浮赞助卡位置兜底：电脑端一律贴右上角（防止上方基础规则被回滚覆盖） */
@media(min-width:1101px){
  .bmc-float{left:auto !important;right:24px !important;margin:0 !important}
}
