/* 全局变量定义 */
:root {
    --primary:#2563eb;
    --primary-2:#38bdf8;
    --accent:#06b6d4;
    --grad:linear-gradient(90deg,#2563eb,#06b6d4);
    --ok:#16a34a;
    --warn:#f59e0b;
    --err:#ef4444;
    --bg:#eef2f8;
    --bg-2:#ffffff;
    --card:#ffffff;
    --card-2:#f1f5fb;
    --ink:#0f172a;
    --muted:#64748b;
    --line:#e2e8f0;
    --radius:14px;
    --shadow:0 6px 24px rgba(30,64,175,.08);
    --font:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
:root[data-theme="dark"] {
    --primary-2:#22d3ee;
    --accent:#22d3ee;
    --bg:#0a1220;
    --bg-2:#0f1a2e;
    --card:#101b30;
    --card-2:#17233b;
    --ink:#e6edf7;
    --muted:#8b98ad;
    --line:rgba(148,184,255,.14);
    --shadow:0 8px 26px rgba(0,0,0,.45);
}
:root[data-theme="ocean"] {
    --primary:#0e7490;
    --primary-2:#22d3ee;
    --accent:#0891b2;
    --grad:linear-gradient(90deg,#0e7490,#22d3ee);
    --bg:#ecfeff;
    --bg-2:#ffffff;
    --card:#ffffff;
    --card-2:#e6f7fb;
    --ink:#134e5e;
    --muted:#5f8a94;
    --line:#cdeef4;
    --shadow:0 6px 24px rgba(14,116,144,.10);
}
:root[data-theme="sunset"] {
    --primary:#ea580c;
    --primary-2:#f59e0b;
    --accent:#f97316;
    --grad:linear-gradient(90deg,#ea580c,#f59e0b);
    --bg:#fff7ed;
    --bg-2:#ffffff;
    --card:#ffffff;
    --card-2:#ffedd5;
    --ink:#431407;
    --muted:#9a6b4f;
    --line:#fed7aa;
    --shadow:0 6px 24px rgba(234,88,12,.10);
}
:root[data-theme="forest"] {
    --primary:#15803d;
    --primary-2:#22c55e;
    --accent:#16a34a;
    --grad:linear-gradient(90deg,#15803d,#22c55e);
    --bg:#f0fdf4;
    --bg-2:#ffffff;
    --card:#ffffff;
    --card-2:#dcfce7;
    --ink:#14532d;
    --muted:#5f8a6a;
    --line:#bbf7d0;
    --shadow:0 6px 24px rgba(21,128,61,.10);
}
:root[data-theme="midnight"] {
    --primary:#818cf8;
    --primary-2:#a5b4fc;
    --accent:#818cf8;
    --grad:linear-gradient(90deg,#6366f1,#a5b4fc);
    --bg:#0f0f1e;
    --bg-2:#151527;
    --card:#1a1a2e;
    --card-2:#232341;
    --ink:#e0e7ff;
    --muted:#8b8fa8;
    --line:rgba(129,140,248,.16);
    --shadow:0 8px 26px rgba(0,0,0,.45);
}
:root[data-theme="ruby"] {
    --primary:#be123c;
    --primary-2:#fb7185;
    --accent:#e11d48;
    --grad:linear-gradient(90deg,#be123c,#fb7185);
    --bg:#fff1f2;
    --bg-2:#ffffff;
    --card:#ffffff;
    --card-2:#ffe4e6;
    --ink:#4c0519;
    --muted:#a15a68;
    --line:#fecdd3;
    --shadow:0 6px 24px rgba(190,18,60,.10);
}
:root[data-theme="grape"] {
    --primary:#7c3aed;
    --primary-2:#a78bfa;
    --accent:#8b5cf6;
    --grad:linear-gradient(90deg,#7c3aed,#a78bfa);
    --bg:#f5f3ff;
    --bg-2:#ffffff;
    --card:#ffffff;
    --card-2:#ede9fe;
    --ink:#2e1065;
    --muted:#7a6a9e;
    --line:#ddd6fe;
    --shadow:0 6px 24px rgba(124,58,237,.10);
}
:root[data-theme="cyber"] {
    --primary:#06b6d4;
    --primary-2:#22d3ee;
    --accent:#00e5ff;
    --grad:linear-gradient(90deg,#0891b2,#06b6d4);
    --bg:#020617;
    --bg-2:#0a1128;
    --card:#0b1633;
    --card-2:#122043;
    --ink:#d8f8ff;
    --muted:#7ca2bd;
    --line:rgba(34,211,238,.16);
    --shadow:0 8px 26px rgba(0,0,0,.45);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
    font-family:var(--font);
    background:
        radial-gradient(900px 500px at 85% -5%, rgba(6,182,212,.10), transparent 60%),
        var(--bg);
    color:var(--ink); line-height:1.6; min-height:100vh; overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
/* ---------- 背景特效 ---------- */
#particle-canvas, #mouseRippleCanvas, #mouseGlow { position:fixed; inset:0; pointer-events:none; z-index:0; }
#mouseGlow { width:520px; height:520px; margin:-260px 0 0 -260px; border-radius:50%; background:radial-gradient(circle, rgba(6,182,212,.10), transparent 60%); z-index:0; }
#scroll-progress-bar {
    position:fixed; top:0; left:0; height:3px; width:0;
    background:var(--grad); z-index:1200; box-shadow:0 0 8px rgba(56,189,248,.6);
}
/* ---------- 顶部导航 ---------- */
.topbar {
    position:sticky; top:0; z-index:1100;
    backdrop-filter:saturate(140%) blur(12px);
    background:rgba(255,255,255,.01);
    border-bottom:0px solid var(--line);
    transition:box-shadow .3s;
}
[data-theme="dark"] .topbar { background:rgba(10,18,32,.01); }
[data-theme="midnight"] .topbar { background:rgba(15,15,30,.01); }
[data-theme="cyber"] .topbar { background:rgba(2,6,23,.01); }
.topbar.scrolled { box-shadow:0 4px 22px rgba(30,64,175,.10); }
.topbar-inner {
    width:100%;
    max-width:1690px;
    margin:0 auto;
    padding:0px 41px;
    display:flex; align-items:center; gap:10px; height:95px;
    box-sizing:border-box;
}
.logo { display:flex; align-items:center; gap:12px; }
.logo-mark {
    width:42px; height:42px; border-radius:12px; display:flex; align-items:center; justify-content:center;
    background:var(--grad); color:#fff; font-size:20px; box-shadow:0 4px 14px rgba(37,99,235,.35);
}
.logo-name { font-size:20px; font-weight:800; letter-spacing:1px; color:var(--ink); }
.logo-name b { background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.logo-sub { font-size:11px; color:var(--muted); letter-spacing:2px; }
.topbar-spacer { flex:1; }
.topbar-actions { display:flex; align-items:center; gap:9px; }
.tb-btn {
    display:inline-flex; align-items:center; gap:6px;
    padding:8px 14px; border-radius:10px;
    border:1px solid var(--line); background:var(--card); color:var(--ink);
    font-size:13px; cursor:pointer; transition:.2s; position:relative; overflow:hidden;
}
.tb-btn:hover { border-color:var(--primary); color:var(--primary); }
.tb-btn.primary { background:var(--grad); color:#fff; border:none; font-weight:700; box-shadow:0 4px 14px rgba(37,99,235,.3); }
.tb-btn.primary:hover { filter:brightness(1.08); color:#fff; }
.tb-btn.disabled-btn { opacity:.5; cursor:not-allowed; }
/* ---------- 布局容器 ---------- */
.wrap { width:100%;max-width:1610px; margin:0 auto;}
/* ---------- 公告 ---------- */
.notice {
    display:flex; align-items:center; gap:10px;
    padding:12px 16px; border-radius:var(--radius);
    background:linear-gradient(90deg, rgba(37,99,235,.06), rgba(6,182,212,.06));
    border:1px solid var(--line); font-size:13.5px; color:var(--ink); margin-bottom:18px;
}
.notice i { color:var(--primary); font-size:16px; }
.notice b { color:var(--primary); }
/* ---------- 首屏 Hero ---------- */
.hero {
    position:relative; border-radius:20px; overflow:hidden;
    background:var(--grad); color:#fff; padding:36px 34px; margin-bottom:20px;
    box-shadow:0 14px 40px rgba(37,99,235,.28);
    display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px;
}
.hero::after {
    content:""; position:absolute; inset:0; pointer-events:none;
    background:radial-gradient(500px 260px at 90% 0%, rgba(255,255,255,.20), transparent 60%);
}
.hero-left { position:relative; z-index:1; }
.hero h1 { font-size:30px; font-weight:900; letter-spacing:1px; margin-bottom:8px; }
.hero p { font-size:15px; opacity:.92; }
.hero-tags { display:flex; gap:8px; margin-top:14px; flex-wrap:wrap; }
.hero-tags span {
    font-size:12px; padding:5px 14px; border-radius:20px;
    background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.35);
}
.hero-stats { display:flex; gap:14px; position:relative; z-index:1; flex-wrap:wrap; }
.hstat {
    background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28);
    border-radius:20px; padding:14px 22px; text-align:center; min-width:120px;
    backdrop-filter:blur(4px);
}
.hstat b { display:block; font-size:24px; font-weight:800; }
.hstat span { font-size:12px; opacity:.9; }
/* ---------- 布局容器（筛选栏已上移到列表上方，改为上下排列） ---------- */
.layout { display:block; }
/* ---------- 左侧筛选栏（现位于列表上方，横向排列） ---------- */
.sidebar { display:flex; flex-wrap:wrap; gap:16px; width:100%; margin-bottom:18px; }
.sidebar .sbox { flex:1 1 0; min-width:220px; }
.sidebar .sbox-wide { flex:0 0 100%; }
.sbox {
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    padding:18px; box-shadow:var(--shadow);
}
.sbox-title {
    font-size:14px; font-weight:800; margin-bottom:13px; display:flex; align-items:center; gap:8px;
}
.sbox-title::before { content:""; width:4px; height:16px; border-radius:2px; background:var(--grad); }
.sbox-search { display:flex; }
.sbox-search input {
    flex:1; padding:10px 12px; border-radius:10px 0 0 10px; border:1px solid var(--line);
    background:var(--card-2); color:var(--ink); font-size:13px; outline:none;
}
.sbox-search input:focus { border-color:var(--primary); }
.sbox-search button {
    padding:0 14px; border:none; border-radius:0 10px 10px 0; cursor:pointer;
    background:var(--grad); color:#fff; font-size:14px;
}
.sbox-search button:hover { filter:brightness(1.07); }
.pill-list { display:flex; flex-wrap:wrap; gap:8px; }
.s-pill {
    padding:6px 13px; border-radius:8px; font-size:12.5px;
    border:1px solid var(--line); background:var(--card-2); color:var(--muted); cursor:pointer; transition:.16s;
}
.s-pill:hover { color:var(--primary); border-color:var(--primary); }
.s-pill.active { background:var(--grad); color:#fff; border-color:transparent; font-weight:700; box-shadow:0 4px 12px rgba(37,99,235,.3); }
/* ---------- 内容区 ---------- */
.main { min-width:0; }
.toolbar {
    display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px;
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    padding:14px 18px; margin-bottom:16px; box-shadow:var(--shadow);
}
.page-title { font-size:17px; font-weight:800; display:flex; align-items:center; gap:10px; }
.page-title::before { content:""; width:4px; height:18px; border-radius:2px; background:var(--grad); }
.count-tip { font-size:13px; color:var(--muted); font-weight:400; }
.view-switch { display:flex; gap:8px; }
.view-btn {
    padding:8px 15px; border-radius:9px; border:1px solid var(--line);
    background:var(--card-2); color:var(--muted); font-size:13px; cursor:pointer; transition:.16s; overflow:hidden; position:relative;
}
.view-btn.active { background:var(--grad); color:#fff; border-color:transparent; font-weight:700; }
/* 空状态 */
.empty-tip {
    text-align:center; color:var(--muted); padding:70px 20px; font-size:15px;
    border:1px dashed var(--line); border-radius:var(--radius); background:var(--card);
}
/* ---------- 横排信息卡片（默认视图） ---------- */
.list-view { display:flex; flex-direction:column; gap:12px; }
.list-card {
    display:flex; gap:16px; background:var(--card); border:1px solid var(--line);
    border-radius:var(--radius); padding:14px; transition:.2s; box-shadow:var(--shadow);
}
.list-card:hover { border-color:var(--primary); transform:translateY(-2px); box-shadow:0 12px 30px rgba(37,99,235,.12); }
.list-thumb { width:210px; min-width:210px; border-radius:10px; overflow:hidden; background:var(--card-2); position:relative; aspect-ratio:16/9; }
.list-thumb img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.list-card:hover .list-thumb img { transform:scale(1.05); }
.list-thumb .noimg { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:var(--muted); font-size:13px; }
.list-body { flex:1; min-width:0; display:flex; flex-direction:column; gap:9px; }
.list-title { font-size:16px; font-weight:800; line-height:1.4; }
.list-title a:hover { color:var(--primary); }
.list-tags { display:flex; flex-wrap:wrap; gap:6px; }
.etag,.cetag,.ctag { font-size:11px; padding:3px 9px; border-radius:6px; font-weight:700; }
.etag { background:rgba(6,182,212,.12); color:var(--accent); border:1px solid rgba(6,182,212,.25); }
.cetag { background:rgba(37,99,235,.12); color:var(--primary); border:1px solid rgba(37,99,235,.25); }
.ctag  { background:rgba(22,163,74,.12); color:var(--ok); border:1px solid rgba(22,163,74,.25); }
.list-src { font-size:13px; color:var(--muted); }
.list-foot { margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.perm-tag {
    display:inline-flex; align-items:center; gap:6px;
    padding:7px 15px; border-radius:9px; font-size:13px; font-weight:700; cursor:pointer; transition:.18s;
    position:relative; overflow:hidden;
}
.perm-basic { background:var(--card-2); color:var(--ink); border:1px solid var(--line); }
.perm-basic:hover { border-color:var(--primary); color:var(--primary); }
.perm-vip   { background:var(--grad); color:#fff; border:none; box-shadow:0 4px 12px rgba(37,99,235,.28); }
.perm-vip:hover   { filter:brightness(1.08); }
.perm-svip  { background:linear-gradient(90deg,#7b2ff7,#c455ff); color:#fff; border:none; }
.perm-svip:hover  { filter:brightness(1.1); }
/* ---------- 图文网格视图 ---------- */
.grid-view { display:none; grid-template-columns:repeat(4,1fr); gap:16px; }
.grid-card {
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    overflow:hidden; display:flex; flex-direction:column; transition:.2s; box-shadow:var(--shadow);
}
.grid-card:hover { transform:translateY(-4px); border-color:var(--primary); }
.grid-img { aspect-ratio:16/9; background:var(--card-2); overflow:hidden; position:relative; }
.grid-img img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.grid-card:hover .grid-img img { transform:scale(1.06); }
.grid-img .noimg { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:var(--muted); font-size:13px; }
.grid-body { padding:13px 14px; display:flex; flex-direction:column; gap:9px; flex:1; }
.grid-title { font-size:14.5px; font-weight:800; line-height:1.45; }
.grid-title a:hover { color:var(--primary); }
.grid-tags { display:flex; flex-wrap:wrap; gap:6px; }
.grid-foot { margin-top:auto; display:flex; align-items:center; justify-content:space-between; padding-top:10px; border-top:1px solid var(--line); }
.grid-src { font-size:12px; color:var(--muted); }
/* ---------- 加载更多 ---------- */
.loadmore-wrap { text-align:center; padding:26px 0 10px; }
#loadMoreBtn {
    padding:11px 36px; border-radius:11px; border:none; cursor:pointer; font-size:14px; font-weight:800;
    background:var(--grad); color:#fff; box-shadow:0 6px 18px rgba(37,99,235,.28); transition:.2s;
}
#loadMoreBtn:hover { filter:brightness(1.07); }
#loadMoreBtn:disabled { opacity:.55; cursor:not-allowed; }
/* ---------- 页脚 ---------- */
.footer {
    margin-top:36px; padding:26px 20px; text-align:center; font-size:13px; color:var(--muted);
    border-top:1px solid var(--line);
}
.footer a { color:var(--primary); }
/* ---------- 弹窗 ---------- */
.pop-layer {
    position:fixed; inset:0; z-index:2000; display:none; align-items:center; justify-content:center;
    background:rgba(15,23,42,.5); backdrop-filter:blur(5px); padding:0px;
}
.pop-layer.show-pop { display:flex; }
.pop-content {
    background:var(--card); border:1px solid var(--line); border-radius:0;
    max-width:100%; width:100%; max-height:100%; overflow:auto;
    padding:10px 50px 0px 50px; box-shadow:0 rgba(15,23,42,.4);
    animation:popIn .24s cubic-bezier(.2,.7,.3,1);
    position:relative;
}
@keyframes popIn { from{opacity:0; transform:translateY(14px) scale(.98);} to{opacity:1; transform:none;} }
.pop-close {
    position:absolute; top:10px; right:20px; width:34px; height:34px; border-radius:0%;z-index: 9999;
    border:1px solid var(--line); background:var(--card-2); color:var(--muted);
    font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.18s;
}
.pop-close:hover { color:var(--err); border-color:var(--err); }
.pop-title { font-size:19px; font-weight:800; margin-bottom:16px; text-align:center; }
.pop-body { font-size:14.5px; color:var(--ink); margin-bottom:16px; }
.pop-gold-tip {
    font-size:13px; color:var(--primary); text-align:center; margin-bottom:14px;
    background:rgba(37,99,235,.08); border:1px dashed rgba(37,99,235,.4);
    padding:9px 12px; border-radius:8px;
}
.pop-btn-group { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.btn {
    padding:10px 22px; border-radius:9px; border:none; cursor:pointer; font-size:14px; font-weight:700; transition:.18s;
    position:relative; overflow:hidden;
}
.btn-outline { background:var(--card-2); color:var(--ink); border:1px solid var(--line); }
.btn-outline:hover { border-color:var(--primary); color:var(--primary); }
.btn-primary { background:var(--grad); color:#fff; }
.btn-primary:hover { filter:brightness(1.07); }
.warn-icon {
    width:46px; height:46px; border-radius:50%; margin:0 auto 12px; display:none;
    align-items:center; justify-content:center; font-size:26px; font-weight:900;
    background:rgba(245,158,11,.15); color:var(--warn); border:2px solid var(--warn);
}
.pop-detail-html { text-align:left; line-height:1.9; font-size:14.5px; }
.pop-detail-html img { width:auto; max-width:100%; height:auto; margin:0 auto; display:block; }
.watermark-wrap { position:relative; display:block; width:100%; max-width:100%; margin:0 auto 0; border-radius:0; overflow:hidden; }
.watermark {
    position:absolute; bottom:12px; left:50%; transform:translateX(-50%);
    display:flex; align-items:center; gap:8px; background:rgba(0,0,0,.55); color:#fff;
    padding:6px 12px; border-radius:6px; font-size:13px; pointer-events:none; z-index:2;
}
.watermark img { height:46px; width:auto; }
/* ---------- 悬浮按钮 ---------- */
.fab {
    position:fixed; z-index:1200; display:flex; align-items:center; justify-content:center; gap:8px;
    width:52px; height:52px; border-radius:50%; border:1px solid var(--primary);
    background:var(--card); color:var(--primary); cursor:pointer; box-shadow:var(--shadow);
    transition:.25s; opacity:0; visibility:hidden; transform:translateY(10px);
}
.fab.show { opacity:1; visibility:visible; transform:none; }
.fab:hover { background:var(--grad); color:#fff; }
#backTop { right:22px; bottom:26px; font-size:13px; font-weight:800; }
#historyBtn { right:22px; bottom:90px; }
.history-badge {
    position:absolute; top:-4px; right:-4px; min-width:18px; height:18px; border-radius:9px;
    background:var(--err); color:#fff; font-size:11px; display:none; align-items:center; justify-content:center; padding:0 5px;
}
.history-badge.show { display:flex; }
/* ---------- 浏览历史 ---------- */
.pop-history-box { max-width:1040px; }
.history-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.history-item-row { display:flex; align-items:center; gap:12px; padding:11px 6px; border-bottom:1px solid var(--line); }
.history-item-row:last-child { border-bottom:none; }
.history-title { flex:1; font-size:14px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.history-click { font-size:12px; color:var(--muted); white-space:nowrap; }
/* ---------- 大图预览 ---------- */
.img-preview-wrap { position:relative; width:100%; max-width:1040px; display:flex; flex-direction:column; align-items:center; }
.img-preview-close { position:absolute; right:-54px; top:-25px; color:#fff; font-size:34px; cursor:pointer; z-index:10; line-height:1; }
.img-nav-btn {
    position:absolute; top:50%; transform:translateY(-50%);
    background:rgba(255,255,255,.16); color:#fff; border:none; font-size:30px;
    width:50px; height:50px; border-radius:50%; cursor:pointer; z-index:10; transition:.2s;
}
.img-nav-btn:hover { background:var(--grad); color:#fff; }
.img-nav-btn:disabled { opacity:.3; cursor:not-allowed; }
.img-prev { left:-64px; } .img-next { right:-64px; }
.img-preview-box { width:100%; display:flex; justify-content:center; align-items:center; }
.img-preview-box img { max-width:100%; max-height:100%; border-radius:0; border:0px solid var(--primary); }
.img-index { text-align:center; color:#fff; margin-top:14px; font-size:15px; }
/* ---------- 入场动画 ---------- */
.fade-in-item { opacity:0; transform:translateY(16px); transition:opacity .5s, transform .5s; }
.fade-in-item.show-in { opacity:1; transform:none; }
/* ---------- 响应式 ---------- */
@media (max-width: 1024px) {
    .sidebar { flex-direction:column; }
}
@media (max-width: 760px) {
    .hero { flex-direction:column; align-items:flex-start; }
    .hero h1 { font-size:24px; }
    .list-card { flex-direction:column; }
    .list-thumb { width:100%; min-width:0; }
    .grid-view { grid-template-columns:1fr; }
    .hstat { min-width:100px; padding:10px 16px; }
    .topbar-inner { padding:0 14px; }
    .pop-content { padding:20px 18px; }
    .img-prev { left:4px; } .img-next { right:4px; }
    .logo-sub { display:none; }
}
@media (max-width: 420px) {
    .tb-btn span.lbl { display:none; }
}
/* ===== 主题下拉菜单 ===== */
.theme-drop{ position:relative; }
.theme-drop-menu{
    position:absolute; top:calc(100% + 8px); right:0; z-index:1300;
    min-width:145px; padding:8px; border-radius:12px;
    background:var(--card); border:1px solid var(--line);
    box-shadow:var(--shadow); display:none;
}
.theme-drop-menu.open{ display:block; animation:dropIn .16s ease; }
@keyframes dropIn{ from{opacity:0; transform:translateY(-6px);} to{opacity:1; transform:none;} }
.theme-drop-item{
    display:flex; align-items:center; gap:10px; width:100%;
    padding:8px 10px; border-radius:8px; border:none; background:transparent;
    font-size:13px; color:var(--ink); cursor:pointer; transition:.15s; text-align:left;
    position:relative; overflow:hidden;
}
.theme-drop-item:hover{ background:var(--card-2); }
.theme-drop-item.active{ background:rgba(37,99,235,.10); color:var(--ink); font-weight:700; }
.theme-drop-item > span{ color:var(--ink) !important; }
.theme-dot{
    width:16px; height:16px; border-radius:50%; flex-shrink:0;
    border:1px solid rgba(0,0,0,.12); box-shadow:inset 0 0 0 2px rgba(255,255,255,.6);
}
.theme-drop-item .tick{ margin-left:auto; opacity:0; color:var(--primary); }
.theme-drop-item.active .tick{ opacity:1; }
.tp-ad-text1 {width: 100%;padding-top:0px;box-sizing: border-box;overflow: hidden;margin: 0 auto;}
.tp-ad-text1 a {font-size: 14px;line-height:45px;text-align: center;border: 1px dashed rgba(31, 116, 230,.22);padding: 0px;box-sizing: border-box;float: left;width: 20%;height:45px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;margin: 0 auto;text-decoration: none;transition: all .6s;font-weight: bold;}
.tp-ad-text1 a:hover {font-weight: bold;color:#fff!important;background:#7fba00;transition: all .6s;}
.tp-ad-text1 a:nth-child(2n):hover {background:#f74e1e;border-color: #f74e1e;}
.tp-ad-text1 a:nth-child(3n):hover {background:#00a4ef;border-color: #00a4ef;}
.tp-ad-text1 a:nth-child(4n):hover {background:#FEC076;border-color: #FEBD73;}
.tp-ad-text1 a:nth-child(5n):hover {background:#601165;border-color: #601165;}
.tp-ad-text1 a:nth-child(6n):hover {background:#0e7168;border-color: #0e7168;}
.tp-ad-text1 a:nth-child(7n):hover {background:#762790;border-color: #762790;}
.tp-ad-text1 a:nth-child(8n):hover {background:#f78005;border-color: #f78005;}
.tp-ad-text1 a:nth-child(9n):hover {background:#272d39;border-color: #272d39;}
.tp-ad-text1 a:nth-child(10n):hover {background:#bb1fef;border-color: #bb1fef;}
.tp-ad-text1 a:nth-child(11n):hover {background:#f74e1e;border-color: #f74e1e;}
.tp-ad-text1 a:nth-child(12n):hover {background:#0e7168;border-color: #0e7168;}
.tp-ad-text1 a:nth-child(13n):hover {background:#272d39;border-color: #272d39;}
.tp-ad-text1 a:nth-child(14n):hover {background:#f74e1e;border-color: #f74e1e;}
.tp-ad-text1 a:nth-child(15n):hover {background:#7fba00;border-color: #7fba00;}
.tp-ad-text1 a:nth-child(16n):hover {background:#0fc317;border-color: #0fc317;}
.tp-ad-text1 a:nth-child(17n):hover {background:#FEC076;border-color: #FEBD73;}
.tp-ad-text1 a:nth-child(18n):hover {background:#bb1fef;border-color: #bb1fef;}
.tp-ad-text1 a:nth-child(19n):hover {background:#1e75b9;border-color: #1e75b9;}
.tp-ad-text1 a:nth-child(20n):hover {background:#f74e1e;border-color: #f74e1e;}
.index_header {
    position: fixed;
    box-shadow: 1px rgba(0, 0, 0,.01);
    height:60px; line-height:65px; margin:0 auto; color:#fff; background: linear-gradient(to bottom,#Ffffff,#929293);
    z-index: 1000;
	
}
.index_header a{color: var(--color1); /* 初始颜色 */
    transition: color 0.5s ease; /* 颜色变化的过渡效果 */ }
.index_header a:hover{color: var(--color1); /* 初始颜色 */
    transition: color 0.5s ease; /* 颜色变化的过渡效果 */ }
.index_header ul li a:hover{ background: linear-gradient(to bottom,#F77A25,#F77A25); }
:root {
    --color1: white;
    --color2: blue;
    --color3: green;
    --color4: purple;
    --color5: red;
}