:root{
  --bg:#f4f5f9; --card:#fff; --ink:#14151b; --muted:#6a707c;
  --line:#e8eaf1; --accent:#5a2ee6; --accent-soft:#efeafe;
  --up:#11a054; --up-soft:#e3f6ec; --down:#e5484d;
  --amber:#b5751a;
  --shadow:0 1px 2px rgba(20,20,45,.05), 0 12px 30px -16px rgba(30,25,70,.22);
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;font-feature-settings:"tnum" 1}
a{color:inherit;text-decoration:none}
.num{font-variant-numeric:tabular-nums;letter-spacing:-.02em}
h1,h2{letter-spacing:-.02em}

/* topbar + search */
.topbar{background:rgba(255,255,255,.85);backdrop-filter:saturate(1.4) blur(8px);
  border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.topbar .in{max-width:960px;margin:0 auto;padding:13px 20px;display:flex;align-items:center;gap:16px}
.logo{font-weight:800;font-size:18px;letter-spacing:-.03em}
.logo b{color:var(--accent)}
.search{margin-left:auto;flex:1;max-width:400px;position:relative}
.search input{width:100%;border:1px solid var(--line);background:#fbfbfe;border-radius:11px;
  padding:10px 12px 10px 36px;font-size:14px;color:var(--ink);outline:none}
.search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);opacity:.5}
.ac{position:absolute;top:110%;left:0;right:0;background:#fff;border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--shadow);overflow:hidden;z-index:30}
.ac a,.ac .msg{display:flex;align-items:center;gap:10px;padding:10px 12px;font-size:14px}
.ac a:hover{background:#f6f6fb}
.ac img,.ac .ph{width:28px;height:28px;border-radius:8px;object-fit:cover;flex:none;background:var(--accent-soft)}
.ac .s{margin-left:auto;color:var(--muted);font-size:12.5px}
.ac .msg{color:var(--muted);justify-content:center}

.wrap{max-width:960px;margin:0 auto;padding:24px 20px 64px;display:block}
.crumb{font-size:12.5px;color:var(--muted);margin-bottom:18px}
.crumb b{color:var(--ink)}
.card{background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow)}
.block{margin:0 0 34px}
.block-head{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}
.block-head h2{margin:0;font-size:17px}
.block-head span{color:var(--muted);font-size:13px}
.block.empty p,.seo p{color:var(--muted)}
.sub{color:var(--muted);font-size:13px}

/* home hero */
.home-hero{position:relative;padding:44px 0 10px;overflow:hidden}
.home-hero .radar{position:absolute;top:-170px;right:-150px;width:400px;height:400px;pointer-events:none;z-index:0;
  background:repeating-radial-gradient(circle at center, rgba(90,46,230,.09) 0 1.5px, transparent 1.5px 34px);
  -webkit-mask-image:radial-gradient(circle at center,#000 30%,transparent 68%);
  mask-image:radial-gradient(circle at center,#000 30%,transparent 68%)}
.hero-eyebrow,.home-hero h1,.home-hero .lede,.home-hero .find-strip{position:relative;z-index:1}
.hero-eyebrow{display:inline-block;font:700 11.5px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.2em;text-transform:uppercase;color:var(--accent);background:var(--accent-soft);
  padding:7px 11px;border-radius:7px;margin-bottom:20px}
.home-hero h1{font-size:clamp(34px,6vw,62px);line-height:1.0;letter-spacing:-.035em;margin:0 0 20px;font-weight:800;max-width:none}
.lede{font-size:clamp(16px,1.7vw,19px);line-height:1.55;color:#3a3e48;margin:0 0 32px;max-width:none}
.find-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:760px){.find-strip{grid-template-columns:repeat(2,1fr)}}
.fc{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px 18px 20px;box-shadow:var(--shadow);position:relative}
.fc:before{content:"";position:absolute;left:18px;top:18px;width:22px;height:3px;border-radius:2px;background:var(--accent)}
.fc b{display:block;margin-top:16px;font-size:14.5px}
.fc span{display:block;margin-top:6px;font-size:12.5px;color:var(--muted);line-height:1.5}

/* language tabs */
.lang-bar{display:flex;align-items:center;gap:14px;margin:38px 0 18px;flex-wrap:wrap}
.lang-lbl{font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.lang-tabs{display:inline-flex;gap:4px;background:#eceef4;padding:4px;border-radius:12px}
.lang-tabs a{padding:8px 15px;border-radius:9px;font-weight:700;font-size:13px;color:#4b515d;transition:.12s}
.lang-tabs a.on{background:#fff;color:var(--accent);box-shadow:0 1px 2px rgba(0,0,0,.1)}
.lang-tabs a:hover:not(.on){color:var(--ink)}

/* empty state */
.empty-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--shadow)}
.empty-card p{margin:0 0 8px}

/* top10 */
.top-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:640px){.top-grid{grid-template-columns:1fr}}
.tc{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);
  border-radius:14px;padding:12px 14px;box-shadow:var(--shadow);transition:transform .1s}
.tc:hover{transform:translateY(-1px)}
.tc-rank{font-weight:800;color:var(--muted);width:22px;text-align:center;font-variant-numeric:tabular-nums}
.tc-ava{width:40px;height:40px;border-radius:12px;object-fit:cover;flex:none}
.tc-ava.ph{display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-weight:800}
.tc-body{display:flex;flex-direction:column;min-width:0}
.tc-name{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tc-subs{font-size:12.5px;color:var(--muted)}
.tc-delta{margin-left:auto;color:var(--up);background:var(--up-soft);font-weight:700;font-size:12px;padding:3px 8px;border-radius:999px;white-space:nowrap}

/* risers */
.rise-row{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}
.rc{flex:0 0 auto;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;box-shadow:var(--shadow);min-width:150px}
.rc-name{display:block;font-weight:700;font-size:14px;margin-bottom:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.rc-delta{color:var(--up);font-weight:800;font-size:18px}
.rc-subs{display:block;color:var(--muted);font-size:12.5px;margin-top:2px}

/* categories */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.cat{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;box-shadow:var(--shadow)}
.cat-name{display:block;font-weight:700;font-size:14px}
.cat-count{color:var(--muted);font-size:12.5px}

/* seo block */
.seo{max-width:none;border-top:1px solid var(--line);padding-top:34px}
.seo h2{font-size:clamp(22px,3vw,30px);margin:0 0 20px;letter-spacing:-.02em;max-width:22ch}
.seo-cols{columns:2;column-gap:42px}
@media(max-width:720px){.seo-cols{columns:1}}
.seo-cols p{margin:0 0 15px;line-height:1.75;color:#3a3e48;break-inside:avoid}

/* channel hero */
.hero{padding:26px;margin-bottom:18px;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,var(--accent),#8b5cf6 60%,#c4b5fd)}
.head{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.ava{width:76px;height:76px;border-radius:22px;flex:none;object-fit:cover;box-shadow:var(--shadow)}
.ava.ph{display:grid;place-items:center;background:linear-gradient(135deg,#7c3aed,#4f2ec2);color:#fff;font-weight:800;font-size:30px}
.id h1{margin:0;font-size:24px}
.handle{color:var(--muted);font-size:14px;margin-top:2px}
.chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.chip{font-size:12px;font-weight:600;padding:5px 10px;border-radius:999px;background:#f3f4f9;color:#4b515d}
.chip.cat{background:var(--accent-soft);color:var(--accent)}
.chip.nl{background:#eef2ff;color:#3b4a8a}
.counter{margin:22px 0 6px;display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}
.bignum{font-size:clamp(46px,10vw,74px);font-weight:800;line-height:.92}
.counter .lab{color:var(--muted);font-size:15px;font-weight:600;padding-bottom:9px}
.livedot{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--up);
  background:var(--up-soft);padding:5px 10px;border-radius:999px;margin-bottom:11px}
.livedot i{width:8px;height:8px;border-radius:50%;background:var(--up);animation:pulse 1.6s infinite}
.upd{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--muted);
  background:#f2f3f8;padding:5px 10px;border-radius:999px;margin-bottom:11px}
.upd i{width:8px;height:8px;border-radius:50%;background:var(--up);flex:none}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(17,160,84,.5)}70%{box-shadow:0 0 0 7px rgba(17,160,84,0)}100%{box-shadow:0 0 0 0 rgba(17,160,84,0)}}
.subline{display:flex;gap:22px;flex-wrap:wrap;color:var(--muted);font-size:13.5px;margin-top:6px}
.subline b{color:var(--ink)}
.hero-note{font-size:11.5px;color:var(--muted);margin:12px 0 0}

/* stat grid */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
@media(max-width:720px){.grid{grid-template-columns:repeat(2,1fr)}}
.stat{padding:16px}
.stat .k{font-size:12.5px;color:var(--muted);font-weight:600}
.stat .v{font-size:22px;font-weight:800;margin-top:7px}
.delta{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;margin-top:8px;padding:3px 8px;border-radius:999px}
.delta.up{color:var(--up);background:var(--up-soft)}
.delta.down{color:var(--down);background:#fdeaea}
.stat.earn .v{color:var(--amber)}
.stat.earn{background:linear-gradient(180deg,#fffdf8,#fff)}

.section{padding:22px;margin-bottom:18px}
.section h2{margin:0 0 4px;font-size:16px}
.section p.sub{margin:0 0 16px}
.charthead{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.toggle{display:inline-flex;background:#f2f3f8;border-radius:10px;padding:3px;margin-left:auto}
.toggle button{border:none;background:none;padding:6px 13px;border-radius:8px;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer}
.toggle button[aria-pressed="true"]{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}

.desc{font-size:15px;line-height:1.7;color:#2b2e37}
.btn-ai{border:none;border-radius:10px;padding:11px 18px;font-weight:800;font-size:14px;cursor:pointer;background:var(--accent);color:#fff}
.btn-ai:hover{filter:brightness(1.05)}
.btn-refresh{border:none;border-radius:999px;padding:5px 12px;font-weight:700;font-size:12px;cursor:pointer;background:#f2f3f8;color:var(--ink);margin-bottom:11px;margin-left:2px}
.btn-refresh:hover{background:#e7e9f2}
.btn-ai:disabled,.btn-refresh:disabled{opacity:.6;cursor:default}
.loading{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;padding:4px 0}
.spin{width:16px;height:16px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}
.admin-tools{margin-top:16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.btn-admin{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 14px;font-weight:700;font-size:13px;cursor:pointer}
.btn-admin:hover{background:#f7f7fb}
.btn-admin:disabled{opacity:.6;cursor:default}
.admin-status{color:var(--muted);font-size:12.5px}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:0 26px}
@media(max-width:640px){.facts{grid-template-columns:1fr}}
.facts>div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding:11px 0}
.facts span{color:var(--muted);font-size:13.5px}
.facts b{font-weight:800}
.inj{background:var(--accent-soft);color:var(--accent);font-weight:700;border-radius:5px;padding:0 5px;white-space:nowrap}

.earnrow{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.earnbig{font-size:30px;font-weight:800;color:var(--amber)}
.earnbar{height:10px;border-radius:999px;background:linear-gradient(90deg,#f0d9a8,#c98f2a);margin:16px 0 8px;position:relative}
.earnbar .mid{position:absolute;top:-4px;bottom:-4px;width:2px;background:#8a6216;left:46%}
.earnscale{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}

.embed{background:#14151b;color:#e7e8ee;border-radius:14px;padding:14px 16px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;overflow:auto;line-height:1.6;word-break:break-all}
.embed-opt{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:10px;cursor:pointer}
.embed-opt input{accent-color:var(--accent)}
.copy{margin-top:12px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 14px;font-weight:700;font-size:13px;cursor:pointer}
.copy:hover{background:#f7f7fb}

/* leaderboard */
.lb{display:flex;flex-direction:column;gap:2px}
.lb a{display:flex;align-items:center;gap:12px;padding:11px 8px;border-radius:11px}
.lb a:hover{background:#f6f6fb}
.lb.big a{padding:12px 10px}
.rank{width:26px;font-weight:800;color:var(--muted);text-align:center;font-variant-numeric:tabular-nums}
.lb .nm{font-weight:600;font-size:14px}
.lb-ava{width:34px;height:34px;border-radius:10px;object-fit:cover}
.lb .sc{margin-left:auto;color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
.lb-delta{color:var(--up);background:var(--up-soft);font-weight:700;font-size:12px;padding:2px 7px;border-radius:999px}
.lb .me{background:var(--accent-soft)}
.lb .me .rank{color:var(--accent)}

/* footer */
.site-foot{border-top:1px solid var(--line);background:#fff}
.site-foot .in{max-width:960px;margin:0 auto;padding:22px 20px;display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;font-size:12.5px;color:#3a3e48}
.site-foot .muted{color:var(--muted)}

@media (prefers-reduced-motion:reduce){.livedot i{animation:none}}