/* Boulevard SEO pages: articles, product pages, AI artists, songs.
   Same brand as the homepage: dark canvas, gold accent, Fraunces + Inter. */
:root{--bg:#0a0a0c;--bg2:#0e0e12;--s1:#141419;--s2:#1b1b22;--s3:#24242c;--tx:#fff;--mu:rgba(255,255,255,.7);--di:rgba(255,255,255,.48);
--fa:rgba(255,255,255,.28);--bd:rgba(255,255,255,.08);--bd2:rgba(255,255,255,.16);--gold:#c8ae7a;--gold-hi:#e3cb98;--gold-lo:rgba(200,174,122,.14);
--good:#9fd7a7;--bad:#f0a0a0;--serif:"Fraunces",ui-serif,Georgia,serif;--sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
--r:16px;--r2:22px;--ease:cubic-bezier(.22,1,.36,1)}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold);color:#111;padding:8px 14px;border-radius:8px;z-index:99}
.skip:focus{left:12px}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 32px}
@media(max-width:640px){.wrap{padding:0 16px}}

/* nav */
.nav{position:sticky;top:0;z-index:40;background:rgba(10,10,12,.82);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--bd)}
.nav-in{max-width:1180px;margin:0 auto;padding:0 32px;height:64px;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.02em}
.bm{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--gold);color:#16120a;font:600 18px/1 var(--serif)}
.bw{font-size:17px}
.nav-links{display:flex;gap:22px;margin-left:12px;font-size:14px;color:var(--mu)}
.nav-links a:hover,.nav-lang:hover{color:var(--tx)}
.nav-lang{margin-left:auto;font-size:13px;color:var(--di);border:1px solid var(--bd2);padding:6px 10px;border-radius:999px}
.nav-cta{background:var(--gold);color:#16120a;font-weight:700;font-size:14px;padding:9px 16px;border-radius:999px;white-space:nowrap}
.nav-cta:hover{background:var(--gold-hi)}
@media(max-width:920px){.nav-links{display:none}.nav-in{padding:0 16px;gap:12px}}

/* hero */
.hero{position:relative;padding:56px 0 40px;border-bottom:1px solid var(--bd);background:radial-gradient(900px 420px at 85% 10%,rgba(200,174,122,.12),transparent 60%)}
.hero-in{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr);gap:48px;align-items:center}
.crumb{font-size:13px;color:var(--di);margin-bottom:18px;display:flex;flex-wrap:wrap;gap:4px}
.crumb a{color:var(--mu)}.crumb a:hover{color:var(--gold)}.crumb .sep{color:var(--fa);margin:0 6px}
.chip{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--gold);background:var(--gold-lo);border:1px solid rgba(200,174,122,.25);padding:4px 10px;border-radius:999px}
.hero h1{font:600 clamp(34px,5vw,56px)/1.06 var(--serif);letter-spacing:-.015em;margin:16px 0 18px;text-wrap:balance}
.hero h1 em{font-style:italic;color:var(--gold)}
.deck{font-size:clamp(17px,2vw,20px);line-height:1.55;color:var(--mu);margin:0 0 20px;max-width:680px}
.deck a{color:var(--gold)}
.meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--di)}
.meta a{color:var(--mu);text-decoration:underline;text-decoration-color:var(--fa)}
.hero-art{position:relative;height:380px}
.hero-art img{position:absolute;border-radius:18px;box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06);object-fit:cover;background:var(--s1)}
.hero-art .h0{width:min(300px,72%);height:auto;aspect-ratio:1;right:9%;top:28px;z-index:3}
.hero-art .h1{width:min(150px,36%);height:auto;aspect-ratio:1;right:0;top:0;transform:rotate(7deg);z-index:2;opacity:.92}
.hero-art .h2{width:min(160px,38%);height:auto;aspect-ratio:1;left:0;top:178px;transform:rotate(-8deg);z-index:4}
.hero-art .h3{width:min(120px,28%);height:auto;aspect-ratio:1;right:3%;top:262px;transform:rotate(-4deg);z-index:2;opacity:.85}
.hero-art.solo{height:auto}.hero-art.solo img{position:static;width:100%;max-width:400px;height:auto;aspect-ratio:1;margin-left:auto}
@media(max-width:900px){.hero{padding:28px 0 28px}.hero-in{grid-template-columns:1fr;gap:24px}.hero-art{height:230px;order:-1;max-width:420px;width:100%;margin:0 auto}
.hero-art .h0{width:190px;left:50%;right:auto;margin-left:-95px;top:10px}.hero-art .h1{width:110px;right:2%;top:0}
.hero-art .h2{width:112px;left:2%;top:100px}.hero-art .h3{display:none}
.hero-art.solo img{max-width:280px;margin:0 auto}}

/* layout */
.layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:56px;padding-top:40px;padding-bottom:40px}
.layout.single{grid-template-columns:minmax(0,1fr);max-width:860px}
.layout:not(:has(.toc)){grid-template-columns:minmax(0,1fr);max-width:860px}
.toc{position:sticky;top:88px;align-self:start;font-size:14px;max-height:calc(100vh - 110px);overflow:auto}
.toc summary{font-weight:700;color:var(--mu);cursor:pointer;margin-bottom:10px;list-style:none}
.toc summary::-webkit-details-marker{display:none}
.toc ol{list-style:none;margin:0;padding:0;border-left:1px solid var(--bd)}
.toc li a{display:block;padding:6px 0 6px 14px;color:var(--di);margin-left:-1px;border-left:2px solid transparent;line-height:1.35}
.toc li a:hover,.toc li a.on{color:var(--tx);border-left-color:var(--gold)}
@media(max-width:1020px){.layout{grid-template-columns:minmax(0,1fr);gap:0;max-width:860px}.toc{position:static;max-height:none;margin-bottom:24px;background:var(--s1);border:1px solid var(--bd);border-radius:var(--r);padding:14px 16px}
.toc details:not([open]) summary{margin:0}}
.body{min-width:0;font-size:17.5px}
.body>p,.body .legacy p{color:rgba(255,255,255,.84);margin:0 0 18px}
.body h2{font:600 clamp(26px,3vw,34px)/1.18 var(--serif);letter-spacing:-.01em;margin:52px 0 16px;text-wrap:balance}
.body h3{font-size:20px;line-height:1.3;margin:32px 0 10px}
.body a:not(.btn):not(.btn-ghost):not(.sc-art):not(.sc-title):not(.sc-artist):not(.v-link):not(.tp-go){color:var(--gold-hi);text-decoration:underline;text-decoration-color:rgba(200,174,122,.4);text-underline-offset:3px}
.body strong{color:#fff}
.lst,.legacy ul,.legacy ol{padding-left:22px;margin:0 0 20px;color:rgba(255,255,255,.84)}
.lst li,.legacy li{margin:6px 0}
.lst li::marker{color:var(--gold)}
.legacy h2{font:600 clamp(26px,3vw,34px)/1.18 var(--serif);margin:48px 0 14px}
.legacy table{width:100%;border-collapse:collapse;margin:20px 0;font-size:15px;display:block;overflow-x:auto}
.legacy th,.legacy td{border-bottom:1px solid var(--bd);padding:10px 12px;text-align:left;vertical-align:top}
.legacy th{color:var(--gold);font-weight:600}
.legacy blockquote{border-left:3px solid var(--gold);margin:22px 0;padding:4px 0 4px 18px;color:var(--mu);font-style:italic}
.kicker{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.blk-title{font-size:19px!important;margin:0 0 14px!important}
.blk-note{font-size:13px;color:var(--di);margin:10px 0 0}
.blk-note a{color:var(--mu)!important}

/* takeaways */
.takeaways{background:linear-gradient(180deg,rgba(200,174,122,.09),rgba(200,174,122,.03));border:1px solid rgba(200,174,122,.25);border-radius:var(--r2);padding:22px 24px 14px;margin:0 0 36px}
.tk-h{font:700 13px/1 var(--sans)!important;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);margin:0 0 12px!important}
.takeaways ul{list-style:none;margin:0;padding:0}
.takeaways li{position:relative;padding:0 0 10px 30px;color:rgba(255,255,255,.88);font-size:16.5px}
.takeaways li::before{content:"";position:absolute;left:2px;top:6px;width:16px;height:16px;border-radius:50%;background:var(--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z' fill='%2316120a'/%3E%3C/svg%3E") center/12px no-repeat}

/* answer */
.answer{background:var(--s1);border:1px solid var(--bd2);border-left:4px solid var(--gold);border-radius:var(--r);padding:20px 22px;margin:26px 0}
.answer h3{margin:0 0 8px!important;font-size:19px}
.answer p{margin:0;color:rgba(255,255,255,.88)}

/* stats */
.stats{list-style:none;padding:0;margin:28px 0;display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.stats li{background:var(--s1);border:1px solid var(--bd);border-radius:var(--r);padding:20px;display:flex;flex-direction:column;gap:6px}
.stats strong{font:600 38px/1 var(--serif);color:var(--gold-hi);letter-spacing:-.02em}
.stats span{font-size:15px;color:var(--mu);line-height:1.45}
.stats .src{font-size:12px;color:var(--di)!important;text-decoration:none!important;margin-top:auto;font-style:normal}

/* chart */
.chart{margin:30px 0;background:var(--s1);border:1px solid var(--bd);border-radius:var(--r);padding:20px 22px}
.chart figcaption{font-weight:700;margin-bottom:14px}
.chart ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.chart li{display:grid;grid-template-columns:minmax(80px,30%) 1fr auto;gap:12px;align-items:center;font-size:14px}
.chart .cl{color:var(--mu);line-height:1.25}
.chart .cb{height:12px;background:var(--s3);border-radius:999px;overflow:hidden}
.chart .cb i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,rgba(200,174,122,.45),rgba(200,174,122,.7))}
.chart li.hi .cb i{background:linear-gradient(90deg,var(--gold),var(--gold-hi))}
.chart li.hi .cl,.chart li.hi .cv{color:var(--gold-hi);font-weight:700}
.chart .cv{font-variant-numeric:tabular-nums;color:var(--tx);font-weight:600;min-width:52px;text-align:right}

/* table */
.tbl{margin:28px 0;overflow-x:auto;border:1px solid var(--bd);border-radius:var(--r);-webkit-overflow-scrolling:touch}
.tbl table{width:100%;border-collapse:collapse;font-size:15px;min-width:520px}
.tbl caption{text-align:left;padding:14px 16px 4px;font-weight:700;color:var(--mu);caption-side:top}
.tbl th,.tbl td{padding:12px 16px;border-bottom:1px solid var(--bd);text-align:left;vertical-align:top}
.tbl thead th{font-size:13px;letter-spacing:.03em;color:var(--di);font-weight:700;background:var(--s1)}
.tbl tbody th{font-weight:600;color:var(--mu)}
.tbl .hl{background:var(--gold-lo);color:#fff}
.tbl thead .hl{color:var(--gold-hi)}
.tbl tr:last-child th,.tbl tr:last-child td{border-bottom:0}

/* verdict */
.verdict{background:var(--s1);border:1px solid var(--bd);border-radius:var(--r2);padding:22px;margin:22px 0}
.verdict.ours{border-color:rgba(200,174,122,.45);background:linear-gradient(180deg,rgba(200,174,122,.08),var(--s1))}
.verdict header{display:flex;gap:18px;justify-content:space-between;align-items:flex-start}
.verdict h3{margin:0 0 6px!important;font:600 24px/1.2 var(--serif)!important;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.verdict header p{margin:0;color:var(--mu);font-size:16px}
.badge-ours{font:700 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;background:var(--gold);color:#16120a;padding:5px 8px;border-radius:6px}
.ring{--p:70;flex:none;width:76px;height:76px;border-radius:50%;display:grid;place-items:center;align-content:center;background:conic-gradient(var(--gold) calc(var(--p)*1%),var(--s3) 0);position:relative}
.ring::before{content:"";position:absolute;inset:6px;border-radius:50%;background:var(--s1)}
.ring span,.ring small{position:relative;line-height:1}
.ring span{font:600 24px var(--serif)}.ring small{font-size:11px;color:var(--di)}
.v-facts{display:flex;flex-wrap:wrap;gap:8px 28px;margin:16px 0;font-size:14px}
.v-facts dt{color:var(--di);font-size:12px;text-transform:uppercase;letter-spacing:.05em}.v-facts dd{margin:2px 0 0;color:var(--tx)}
.pc{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pc h4{margin:0 0 6px;font-size:13px;text-transform:uppercase;letter-spacing:.06em}
.pros h4{color:var(--good)}.cons h4{color:var(--bad)}
.pc ul{list-style:none;padding:0;margin:0;font-size:15px;color:var(--mu)}
.pc li{padding:4px 0 4px 22px;position:relative}
.pros li::before{content:"✓";position:absolute;left:0;color:var(--good);font-weight:700}
.cons li::before{content:"✕";position:absolute;left:0;color:var(--bad);font-weight:700}
.v-link{display:inline-block;margin-top:14px;font-weight:700;color:var(--gold-hi)!important;font-size:15px}
.disclosure{font-size:13.5px;color:var(--di);border-top:1px solid var(--bd);padding-top:14px;margin-top:28px}
@media(max-width:640px){.pc{grid-template-columns:1fr}.verdict{padding:18px}.ring{width:64px;height:64px}}

/* timeline */
.timeline{list-style:none;margin:30px 0;padding:0 0 0 22px;border-left:2px solid var(--bd2)}
.timeline li{position:relative;padding:0 0 22px 18px}
.timeline li::before{content:"";position:absolute;left:-30px;top:6px;width:14px;height:14px;border-radius:50%;background:var(--bg);border:3px solid var(--gold)}
.timeline time{font-size:13px;font-weight:700;color:var(--gold);letter-spacing:.03em}
.timeline h4{margin:2px 0 4px;font-size:17px}
.timeline h4 a{color:var(--tx)!important;text-decoration:none!important}
.timeline p{margin:0;color:var(--mu);font-size:15.5px}

/* debate */
.debate{margin:32px 0;border:1px solid var(--bd);border-radius:var(--r2);overflow:hidden;background:var(--s1)}
.debate>h3{margin:0!important;padding:18px 22px;border-bottom:1px solid var(--bd);font:600 21px/1.3 var(--serif)!important}
.d-cols{display:grid;grid-template-columns:1fr 1fr}
.d-cols>div{padding:18px 22px}
.d-cols .yes{border-right:1px solid var(--bd)}
.d-cols h4{margin:0 0 10px;font-size:14px;text-transform:uppercase;letter-spacing:.06em}
.d-cols .yes h4{color:var(--good)}.d-cols .no h4{color:var(--bad)}
.d-cols ul{margin:0;padding-left:18px;color:var(--mu);font-size:15.5px}
.d-cols li{margin:6px 0}
.d-verdict{padding:18px 22px;border-top:1px solid var(--bd);background:var(--gold-lo)}
.d-verdict p{margin:0;color:#fff}
@media(max-width:700px){.d-cols{grid-template-columns:1fr}.d-cols .yes{border-right:0;border-bottom:1px solid var(--bd)}}

/* steps */
.steps{margin:30px 0}
.steps ol{list-style:none;counter-reset:st;margin:0;padding:0;display:grid;gap:12px}
.steps li{counter-increment:st;position:relative;background:var(--s1);border:1px solid var(--bd);border-radius:var(--r);padding:16px 18px 16px 64px}
.steps li::before{content:counter(st);position:absolute;left:16px;top:15px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:#16120a;font:700 15px var(--sans)}
.steps h4{margin:0 0 4px;font-size:17px}.steps p{margin:0;color:var(--mu);font-size:15.5px}

/* callout + quote */
.callout{border-radius:var(--r);padding:16px 18px;margin:24px 0;background:var(--s1);border:1px solid var(--bd)}
.callout strong{display:block;margin-bottom:4px}.callout p{margin:0;color:var(--mu);font-size:15.5px}
.callout.tip{border-color:rgba(159,215,167,.3);background:rgba(159,215,167,.06)}.callout.tip strong{color:var(--good)}
.callout.warn{border-color:rgba(240,160,160,.3);background:rgba(240,160,160,.06)}.callout.warn strong{color:var(--bad)}
.callout.note strong{color:var(--gold)}
.pull{margin:34px 0;padding:6px 0 6px 22px;border-left:3px solid var(--gold)}
.pull blockquote{margin:0;font:italic 500 clamp(22px,2.6vw,28px)/1.35 var(--serif)}
.pull figcaption{margin-top:8px;font-size:14px;color:var(--di)}
.pull figcaption a{color:var(--mu)!important}

/* songs */
.songs{margin:30px 0}
.sc-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px}
.sc{display:flex;flex-direction:column;min-width:0}
.sc-art{position:relative;display:block;border-radius:14px;overflow:hidden;background:var(--s2);aspect-ratio:1;box-shadow:0 14px 30px rgba(0,0,0,.4)}
.sc-art img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.sc-art:hover img{transform:scale(1.05)}
.sc-play{position:absolute;right:10px;bottom:10px;width:42px;height:42px;border-radius:50%;background:var(--gold);display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.45);transition:transform .2s var(--ease)}
.sc-play svg{width:20px;height:20px;fill:#16120a;margin-left:2px}
.sc-art:hover .sc-play{transform:scale(1.08)}
.sc-title{margin-top:10px;font-weight:700;font-size:15px;line-height:1.3;color:#fff!important;text-decoration:none!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sc-artist{font-size:14px;color:var(--mu)!important;text-decoration:none!important}
.sc-meta{font-size:12.5px;color:var(--di)}
@media(max-width:640px){.sc-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}}

/* artists */
.artists{margin:30px 0}
.ac-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px}
.ac a{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;text-decoration:none!important;color:var(--tx)!important}
.ac img{width:132px;height:132px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px var(--bd2),0 14px 30px rgba(0,0,0,.45);margin-bottom:8px;transition:transform .3s var(--ease)}
.ac a:hover img{transform:scale(1.04)}
.ac strong{font-size:16px}.ac span{font-size:13px;color:var(--di);line-height:1.35}
@media(max-width:640px){.ac-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ac img{width:110px;height:110px}}

/* cta */
.cta{display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:center;margin:40px 0;padding:24px;border-radius:var(--r2);border:1px solid rgba(200,174,122,.3);background:radial-gradient(600px 220px at 0% 0%,rgba(200,174,122,.16),transparent 70%),var(--s1)}
.cta-art{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cta-art img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px}
.cta h3{font:600 26px/1.15 var(--serif)!important;margin:0 0 6px!important}
.cta p{margin:0 0 14px;color:var(--mu)}
.cta-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:#16120a!important;font-weight:800;padding:13px 22px;border-radius:999px;text-decoration:none!important;font-size:15.5px}
.btn:hover{background:var(--gold-hi)}
.btn-ghost{display:inline-flex;align-items:center;border:1px solid var(--bd2);color:var(--tx)!important;padding:12px 18px;border-radius:999px;font-weight:600;font-size:14.5px;text-decoration:none!important}
.btn-ghost:hover{border-color:var(--gold)}
.cta-ios{font-size:12.5px!important;color:var(--di)!important;margin:12px 0 0!important}
@media(max-width:640px){.cta{grid-template-columns:1fr;padding:18px}.cta-art{grid-template-columns:repeat(4,1fr)}}

/* tapper + bpm scale */
.tapper{display:grid;grid-template-columns:150px 1fr;gap:22px;align-items:center;margin:30px 0;padding:22px;background:var(--s1);border:1px solid var(--bd2);border-radius:var(--r2)}
.tp-read{width:150px;height:150px;border-radius:50%;display:grid;place-items:center;align-content:center;background:radial-gradient(circle at 50% 40%,rgba(200,174,122,.25),rgba(200,174,122,.05));border:2px solid rgba(200,174,122,.5)}
.tp-read.pulse{animation:pulse .18s ease-out}
@keyframes pulse{0%{transform:scale(1.06)}100%{transform:scale(1)}}
.tp-n{font:600 46px/1 var(--serif);color:var(--gold-hi);font-variant-numeric:tabular-nums}
.tp-u{font-size:12px;letter-spacing:.1em;color:var(--di)}
.tp-body h3{margin:0 0 4px!important}.tp-body p{margin:0 0 14px;color:var(--mu);font-size:15px}
.tp-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.tp-btn{font:800 18px var(--sans);background:var(--gold);color:#16120a;border:0;border-radius:999px;padding:14px 34px;cursor:pointer;touch-action:manipulation;user-select:none}
.tp-btn:active{transform:scale(.97)}
.tp-reset{font:600 14px var(--sans);background:none;color:var(--mu);border:1px solid var(--bd2);border-radius:999px;padding:12px 16px;cursor:pointer}
.tp-go{font-weight:700;color:var(--gold-hi);font-size:15px}
@media(max-width:640px){.tapper{grid-template-columns:1fr;justify-items:center;text-align:center}.tp-row{justify-content:center}}
.bpmscale{margin:30px 0 34px}
.bs-track{position:relative;height:56px;margin:0 24px;border-bottom:2px solid var(--bd2)}
.bs-track ul{list-style:none;margin:0;padding:0}
.bs-track li{position:absolute;bottom:-9px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center}
.bs-track li::after{content:"";width:16px;height:16px;border-radius:50%;background:var(--s3);border:2px solid var(--bd2);order:2}
.bs-track li span,.bs-track li a{order:1;font-weight:700;font-size:15px;color:var(--mu)!important;margin-bottom:8px;text-decoration:none!important}
.bs-track li.hi::after{background:var(--gold);border-color:var(--gold-hi);box-shadow:0 0 0 6px var(--gold-lo)}
.bs-track li.hi span,.bs-track li.hi a{color:var(--gold-hi)!important;font-size:19px}
.bpmscale figcaption{text-align:center;font-size:12px;letter-spacing:.12em;color:var(--di);margin-top:16px}

/* faq, sources, author */
.faq{margin-top:56px}
.faq details{border-bottom:1px solid var(--bd);padding:4px 0}
.faq summary{cursor:pointer;list-style:none;padding:16px 36px 16px 0;font-weight:700;font-size:17px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:12px;font-size:24px;color:var(--gold);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 16px;color:var(--mu)}
.sources{margin-top:48px}
.sources h2{font-size:22px!important;margin-top:0!important}
.sources ol{padding-left:20px;margin:0;font-size:14.5px;color:var(--di)}
.sources li{margin:8px 0}
.sources a{color:var(--mu)!important}
.sources span{display:block;font-size:13px;color:var(--fa)}
.author{display:flex;gap:16px;align-items:flex-start;margin-top:40px;padding:20px;background:var(--s1);border:1px solid var(--bd);border-radius:var(--r)}
.author .bm{flex:none;width:44px;height:44px;font-size:24px;border-radius:12px}
.author p{margin:6px 0 0;font-size:14.5px;color:var(--mu)}
.author em{color:var(--di)}

/* related + hubs */
.related{padding:20px 32px 60px}
.related h2,.hub-sec h2{font:600 28px/1.2 var(--serif);margin:10px 0 20px}
.rel-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}
.rel-grid a{display:flex;flex-direction:column;gap:8px;height:100%;background:var(--s1);border:1px solid var(--bd);border-radius:var(--r);padding:12px 12px 16px;transition:border-color .2s,transform .2s var(--ease)}
.rel-grid a:hover{border-color:rgba(200,174,122,.5);transform:translateY(-2px)}
.rel-grid img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px}
.rel-grid .chip{align-self:flex-start;font-size:11px}
.rel-grid strong{font-size:16.5px;line-height:1.3}
.rel-grid .sub{font-size:14px;color:var(--di);line-height:1.45}
.hub .hero{padding:56px 0 36px}.hub .hero h1{max-width:900px}
.hub-sec{padding:28px 0 8px}
@media(max-width:640px){.related{padding:10px 16px 40px}}

/* artist + song pages */
.bio p{font-size:18px;color:rgba(255,255,255,.88)}
.tags{list-style:none;padding:0;margin:14px 0;display:flex;flex-wrap:wrap;gap:8px}
.tags li{font-size:13.5px;padding:6px 12px;border-radius:999px;border:1px solid rgba(200,174,122,.35);color:var(--gold-hi)}
.tags.soft li{border-color:var(--bd2);color:var(--mu)}
.tags li a{color:inherit}
.facts{display:flex;flex-wrap:wrap;gap:10px 26px;margin:6px 0 22px}
.facts dt{font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--di)}
.facts dd{margin:2px 0 0;font-weight:600;text-transform:capitalize}
.lyrics{margin:36px 0;padding:26px;background:var(--s1);border:1px solid var(--bd);border-radius:var(--r2)}
.lyrics h2{margin-top:0!important}
.lyrics p{font-size:17px;line-height:1.75;color:rgba(255,255,255,.88);margin:0 0 18px}
.ly-h{font:700 12px/1 var(--sans)!important;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin:22px 0 8px!important}

/* footer */
.foot{border-top:1px solid var(--bd);padding:48px 0 28px;margin-top:20px;background:var(--bg2)}
.foot-in{display:flex;flex-wrap:wrap;gap:40px;justify-content:space-between}
.foot-brand{max-width:300px}.foot-brand p{color:var(--di);font-size:14px}
.play-badge{display:inline-block;margin-top:6px;font-size:13px;font-weight:700;border:1px solid var(--bd2);padding:8px 12px;border-radius:10px;color:var(--mu)}
.foot-cols{display:flex;flex-wrap:wrap;gap:48px}
.foot-cols h4{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--di);margin:0 0 12px}
.foot-cols a{display:block;font-size:14px;color:var(--mu);padding:4px 0}
.foot-cols a:hover{color:var(--gold)}
.foot-bot{margin-top:30px;font-size:13px;color:var(--fa)}
@media(max-width:640px){.foot-cols{gap:28px}.foot-cols>div{min-width:40%}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}