:root{--bg:#0a0b10;--card:#13151d;--line:#232633;--tx:#e8eaf2;--mu:#8b90a3;--a:#7c5cff;--b:#22d3ee}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
a{color:inherit}section{max-width:1100px;margin:0 auto;padding:56px 20px}h2{font-size:1.7rem;margin:0 0 20px}
.nav{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:14px 20px;background:#0a0b10cc;backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav nav a{margin-left:18px;text-decoration:none;color:var(--mu)}.logo{font-weight:800;font-size:1.3rem;text-decoration:none}.logo span,.grad{background:linear-gradient(90deg,var(--a),var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero{text-align:center;padding-top:90px;background:radial-gradient(600px 300px at 50% 0,#7c5cff33,transparent)}
.hero h1{font-size:clamp(2.3rem,6vw,4.2rem);line-height:1.05;margin:16px 0}.sub{color:var(--mu);max-width:620px;margin:0 auto 28px;font-size:1.15rem}
.pill{display:inline-block;border:1px solid var(--line);border-radius:99px;padding:4px 14px;color:var(--mu);font-size:.85rem}
.btn{display:inline-block;background:linear-gradient(90deg,var(--a),#5b8cff);color:#fff!important;border:0;border-radius:10px;padding:12px 20px;font-weight:700;text-decoration:none;cursor:pointer;font-size:1rem}
.btn.ghost{background:transparent;border:1px solid var(--line)}.btn.sm{padding:7px 14px;font-size:.9rem}.cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.stats{color:var(--mu);margin-top:22px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.rel .date{color:var(--b);font-size:.8rem;font-weight:700}.rel h3{margin:6px 0}.muted{color:var(--mu);font-size:.9rem}
.controls{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}input{background:var(--card);border:1px solid var(--line);color:var(--tx);border-radius:10px;padding:12px 14px;font-size:1rem;width:100%}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{background:var(--card);border:1px solid var(--line);color:var(--mu);border-radius:99px;padding:6px 12px;cursor:pointer}.chip.on{border-color:var(--a);color:#fff;background:#7c5cff22}
.cat{margin-bottom:30px}.cat h3{margin:0 0 10px}.row{display:flex;gap:14px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}
.rank{font-weight:800;width:34px;height:34px;border-radius:8px;display:grid;place-items:center;background:#1c1f2b;flex:none}.r1{background:linear-gradient(135deg,#f5c542,#f59e0b);color:#111}.r2{background:#c0c6d4;color:#111}.r3{background:#c58a52;color:#111}
.row .info{flex:1}.row a.name{font-weight:700;text-decoration:none}.tag{font-size:.75rem;border:1px solid var(--line);border-radius:6px;padding:2px 7px;color:var(--mu);white-space:nowrap}
.quiz .opts{display:grid;gap:10px;margin-top:14px}.quiz .opt{text-align:left;background:#1a1d28;border:1px solid var(--line);color:var(--tx);padding:12px;border-radius:10px;cursor:pointer;font-size:1rem}.quiz .opt:hover{border-color:var(--a)}
.bar{height:4px;background:var(--line);border-radius:4px;margin-bottom:14px}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--a),var(--b));border-radius:4px}
.digest{text-align:center;margin:40px auto;max-width:700px}.digest form{display:flex;gap:10px;max-width:460px;margin:16px auto}
footer{text-align:center;color:var(--mu);padding:30px;font-size:.85rem;border-top:1px solid var(--line)}
@media(max-width:600px){.nav nav a:not(.btn){display:none}.digest form{flex-direction:column}.row .tag{display:none}}

.banner{max-width:1200px;margin:16px auto 0;padding:0 20px}.banner img{display:block;width:100%;height:auto;border-radius:16px}.banner+.hero{padding-top:40px}@media(max-width:600px){.banner{padding:0 12px}.banner img{border-radius:10px}}

.logo{display:inline-flex;align-items:center;gap:8px}.logo .mark{width:28px;height:28px;object-fit:contain}
.logo .wm{font-weight:800;color:#fff;font-style:normal}.logo .wm i{font-style:normal;background:linear-gradient(90deg,#818cf8,#ec4899);-webkit-background-clip:text;background-clip:text;color:transparent}