:root{--bg-0:#050505;--bg-1:#0a0a0a;--bg-2:#111;--bg-3:#161616;--bg-4:#1c1c1c;--text-0:#f2ede6;--text-1:#c4bfb8;--text-2:#7a756f;--red:#ff2d46;--gold:#f5c542;--cyan:#00e5ff;--green:#2ee87a;--border:#1e1e1e}
*{margin:0;padding:0;box-sizing:border-box}body{background:var(--bg-1);color:var(--text-0);font-family:'DM Sans',sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--cyan);text-decoration:none}a:hover{text-decoration:underline}
header{position:fixed;top:0;left:0;right:0;z-index:100;padding:.55rem 1.5rem;display:flex;justify-content:space-between;align-items:center;backdrop-filter:blur(14px);background:rgba(5,5,5,.88);border-bottom:1px solid var(--border)}
.logo{font-family:'Bebas Neue',sans-serif;font-size:1.35rem;letter-spacing:3px;color:var(--text-0);text-decoration:none}.logo:hover{text-decoration:none}.logo .dot{color:var(--red)}
nav{display:flex;gap:1.2rem}nav a{color:var(--text-2);text-decoration:none;font-size:.58rem;letter-spacing:2px;text-transform:uppercase;font-weight:600}nav a:hover{color:var(--text-0);text-decoration:none}nav a.active{color:var(--text-0)}
.page-top{margin-top:2.6rem;padding:1rem 1.5rem .5rem}.page-title{font-family:'Bebas Neue',sans-serif;font-size:2.2rem;letter-spacing:3px;line-height:1}.page-sub{font-size:.6rem;color:var(--text-2);margin-top:.15rem}
.hero{margin-top:2.6rem;padding:2rem 1.5rem;text-align:center}.hero-title{font-family:'Bebas Neue',sans-serif;font-size:2.8rem;letter-spacing:3px;line-height:1.1}.hero-title .accent{color:var(--red)}.hero-sub{font-size:.65rem;color:var(--text-2);margin-top:.3rem}
.hero-btns{display:flex;gap:.5rem;justify-content:center;margin-top:.8rem}
.btn{padding:.4rem .8rem;font-size:.5rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;text-decoration:none;transition:all .15s}.btn-primary{background:var(--red);color:#fff}.btn-primary:hover{background:#e0263d;text-decoration:none}.btn-secondary{border:1px solid var(--border);color:var(--text-0)}.btn-secondary:hover{border-color:var(--text-2);text-decoration:none}
.section{padding:.6rem 1.5rem}.section-title{font-family:'Bebas Neue',sans-serif;font-size:1.2rem;letter-spacing:2px;border-bottom:1px solid var(--border);padding-bottom:.2rem;margin-bottom:.4rem}
.trending-list{display:flex;flex-direction:column;gap:2px}.trending-row{display:flex;align-items:center;gap:.5rem;padding:.3rem .5rem;text-decoration:none;color:var(--text-0);transition:background .12s}.trending-row:hover{background:var(--bg-3);text-decoration:none}
.tr-rank{font-family:'Bebas Neue',sans-serif;font-size:.85rem;color:var(--text-2);width:20px;text-align:center}.tr-flag{font-size:.6rem}.tr-name{font-weight:700;font-size:.65rem;flex:1}.tr-streams{font-family:'JetBrains Mono',monospace;font-size:.45rem;color:var(--gold)}
.artist-list{padding:0 1.5rem}.al-row{display:grid;grid-template-columns:35px 1fr 70px 100px 30px;gap:.4rem;align-items:center;padding:.3rem .5rem;text-decoration:none;color:var(--text-0);border-bottom:1px solid rgba(255,255,255,.02);transition:filter .12s}.al-row:hover{filter:brightness(1.2);text-decoration:none}
.al-rank{font-family:'Bebas Neue',sans-serif;font-size:.8rem;color:var(--text-2);text-align:center}.al-name{font-size:.7rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.al-meta{font-size:.38rem;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.al-streams{font-family:'JetBrains Mono',monospace;font-size:.48rem;color:var(--gold);text-align:right}.al-genre{font-size:.38rem;color:var(--text-2)}.al-region{font-size:.55rem;text-align:center}
.chart-list{padding:0 1.5rem}.ch-row{display:grid;grid-template-columns:35px 30px 1fr 70px;gap:.4rem;align-items:center;padding:.3rem .5rem;border-bottom:1px solid rgba(255,255,255,.02)}
.ch-pos{font-family:'Bebas Neue',sans-serif;font-size:.85rem;color:var(--text-2);text-align:center}.ch-move{font-size:.42rem;font-weight:700;text-align:center}.ch-move.up{color:var(--green)}.ch-move.down{color:var(--red)}.ch-move.new{color:var(--gold)}.ch-move.same{color:var(--text-2)}
.ch-name{font-size:.7rem;font-weight:700}.ch-streams{font-family:'JetBrains Mono',monospace;font-size:.48rem;color:var(--gold);text-align:right}
.region-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.5rem;padding:0 1.5rem}
.region-card{display:flex;align-items:center;gap:.4rem;padding:.5rem .6rem;background:var(--bg-3);border:1px solid var(--border);text-decoration:none;color:var(--text-0);transition:border-color .15s}.region-card:hover{border-color:var(--red);text-decoration:none}
.rc-flag{font-size:1.2rem}.rc-name{font-weight:700;font-size:.6rem;flex:1}.rc-count{font-size:.4rem;color:var(--text-2)}
.artist-hero{margin-top:2.6rem;padding:1.5rem;border-bottom:1px solid var(--border)}.ah-name{font-family:'Bebas Neue',sans-serif;font-size:2.5rem;letter-spacing:3px;line-height:1}.ah-real{font-size:.55rem;color:var(--text-2);margin-top:.1rem}
.ah-meta{display:flex;gap:.8rem;font-size:.5rem;color:var(--text-2);margin-top:.4rem;flex-wrap:wrap}
.ah-stats{display:flex;gap:1.5rem;margin-top:.6rem}.stat-val{font-family:'Bebas Neue',sans-serif;font-size:1.4rem;line-height:1}.stat-label{font-size:.35rem;color:var(--text-2);letter-spacing:1px;text-transform:uppercase}
.ah-genres{font-size:.45rem;color:var(--text-2);margin-top:.4rem}
.track-row{display:flex;justify-content:space-between;padding:.2rem 0;border-bottom:1px solid rgba(255,255,255,.03);font-size:.5rem}.track-name{font-weight:600}.track-album{color:var(--text-2)}
.muted{color:var(--text-2);font-size:.55rem;padding:.5rem 0}
footer{padding:1.2rem 1.5rem;display:flex;justify-content:space-between;align-items:center;font-size:.48rem;color:var(--text-2);letter-spacing:2px;text-transform:uppercase;border-top:1px solid var(--border);margin-top:1rem}.fl{display:flex;gap:1rem}.fl a{color:var(--text-2);text-decoration:none}.fl a:hover{color:var(--text-0)}
@media(max-width:768px){nav{gap:.6rem}nav a{font-size:.45rem}.hero-title{font-size:1.8rem}.al-row{grid-template-columns:30px 1fr 60px}.al-genre,.al-region{display:none}.ah-stats{flex-wrap:wrap;gap:.8rem}.region-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}}
