:root{
  --primary:#6C2BD9;--primary-dark:#4A1B9B;--primary-light:#A78BFA;
  --secondary:#0EA5E9;--accent:#22D3EE;
  --dark:#0F0B1E;--dark-secondary:#1E1836;
  --bg:#fbf8fc;--bg2:#f4eef7;--ink:#201424;
  --card-bg:rgba(255,255,255,.04);--header-bg:color-mix(in srgb, var(--dark) 80%, transparent);--menu-bg:#281a2e;--bd:rgba(255,255,255,.12);
}

.nav{transition:transform .3s ease;}
@media(max-width:1023px){
 .nav{position:fixed;top:0;right:0;bottom:0;width:82%;max-width:340px;flex-direction:column;background:var(--menu-bg);padding:5.5rem 1.5rem 2rem;transform:translateX(100%);z-index:60;overflow-y:auto;box-shadow:-20px 0 60px -20px rgba(0,0,0,.4);}
 .nav.active{transform:translateX(0);}
 .menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;visibility:hidden;transition:opacity .3s;z-index:55;}
 .menu-overlay.active{opacity:1;visibility:visible;}
 body.menu-open{overflow:hidden;}
}
.faq-answer{max-height:0;overflow:hidden;opacity:0;transition:max-height .3s ease,opacity .3s ease;}
.faq-icon{transition:transform .25s ease;}
.back-to-top{opacity:0;visibility:hidden;transition:opacity .3s;}
.back-to-top.visible{opacity:1;visibility:visible;}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.cat-tab.active{font-weight:800;}
@media print{header,footer,nav,.no-print{display:none!important}}

.font-mono-cn{font-family:"JetBrains Mono","Maple Mono",ui-monospace,monospace;}
body{background:linear-gradient(transparent 95%,rgba(255,255,255,.04) 95%) 0 0/100% 28px,linear-gradient(90deg,transparent 95%,rgba(255,255,255,.04) 95%) 0 0/28px 100%,#000;}
.neon-text{text-shadow:0 0 8px var(--primary),0 0 24px color-mix(in srgb,var(--primary) 60%,transparent);}
.neon-card{transition:box-shadow .25s,transform .25s;}
.neon-card:hover{transform:translateY(-3px);box-shadow:0 0 24px -4px var(--primary);border-color:var(--primary);}
::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:var(--primary)}

html{scroll-behavior:smooth}
.announce{background:var(--primary);color:#fff}
.site-header{backdrop-filter:blur(12px)}
.header-bar{background:var(--header-bg);border-bottom:1px solid var(--bd)}
.logo-badge{display:inline-flex;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;font-size:1.1rem;border-radius:.7rem;background:var(--primary);color:#fff}
.nav-link.is-active{background:var(--primary);color:#fff;opacity:1}
.search-box{background:rgba(255,255,255,.06);border:1px solid var(--bd)}
.search-box-lg{background:var(--card-bg);border:1px solid var(--bd);box-shadow:0 12px 40px -24px rgba(0,0,0,.4)}
.burger{width:2.6rem;height:2.6rem;display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;border:1px solid var(--bd);border-radius:.6rem;background:var(--card-bg)}
.hero-wrap{position:relative}
.alt-section{position:relative}
.alt-section{background:rgba(255,255,255,.03)}
.hero-deco{position:absolute;inset:0;background:radial-gradient(60% 80% at 85% -10%,color-mix(in srgb,var(--primary) 34%,transparent),transparent),radial-gradient(50% 60% at 0% 100%,color-mix(in srgb,var(--secondary) 28%,transparent),transparent);pointer-events:none}
.hero-blob-1{position:absolute;width:22rem;height:22rem;background:var(--primary);top:-4rem;right:-4rem}
.hero-blob-2{position:absolute;width:18rem;height:18rem;background:var(--secondary);bottom:-3rem;left:-3rem}
.hero-title{}
.hero-media{box-shadow:0 30px 70px -30px rgba(0,0,0,.5);border:1px solid var(--bd)}
.play-btn{width:4.5rem;height:4.5rem;border-radius:9999px;display:inline-flex;align-items:center;justify-content:center;font-size:1.4rem;background:var(--primary);color:#fff;box-shadow:0 0 0 8px rgba(255,255,255,.25)}
.play-tag{background:var(--accent);color:#111}
.stat-box{background:var(--card-bg);border:1px solid var(--bd);padding:.85rem 1rem;text-align:left}
.cat-tab{background:var(--card-bg);border:1px solid var(--bd);transition:all .2s}
.cat-tab.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.step-num{position:absolute;top:-.9rem;left:1.2rem;width:2.4rem;height:2.4rem;border-radius:9999px;display:flex;align-items:center;justify-content:center;font-weight:900;background:var(--primary);color:#fff}
.avatar-char{width:2.8rem;height:2.8rem;border-radius:9999px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;background:var(--primary);color:#fff}
.stars{color:var(--accent)}
.accent-num{color:var(--primary)}
.tick{color:var(--primary);font-weight:900}
.rank-badge{width:2.6rem;height:2.6rem;border-radius:.8rem;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1.1rem;background:var(--primary);color:#fff;flex:none}
.live-badge{position:absolute;top:.5rem;left:.5rem;font-size:.7rem;font-weight:800;padding:.1rem .4rem;border-radius:.3rem;background:#ef4444;color:#fff}
.tag-chip{background:var(--card-bg);border:1px solid var(--bd);opacity:.85;transition:.2s}
.tag-chip:hover{background:var(--primary);color:#fff;border-color:var(--primary);opacity:1}
.page-hero{background:rgba(255,255,255,.03);border-bottom:1px solid var(--bd)}
.site-footer{background:#1a101e;color:#e7e7e7}
.footer-col-title{color:var(--primary-light)}
.social-ico{background:rgba(255,255,255,.08)}
.social-ico:hover{background:var(--primary)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1)}
.back-to-top{background:var(--primary);color:#fff;box-shadow:0 8px 20px -8px var(--primary)}
.load-more{cursor:pointer}
