:root{--song-panel:#15131b;--song-panel-soft:#211722;--song-gold:#f2bd54;--song-gold-soft:#ffe3a0;--song-text:#fff8e8;--song-muted:#d7cbbb;--song-line:rgba(242,189,84,.28)}
.song-hero{min-height:440px;display:grid;align-items:end;padding:clamp(4rem,10vw,8rem) clamp(1rem,8vw,8rem);background:linear-gradient(90deg,rgba(7,7,12,.95),rgba(20,12,22,.74)),url('../images/hero-sunrise.webp') center/cover no-repeat;border-bottom:1px solid var(--song-line)}
.song-hero-copy{max-width:880px}.song-hero h1{margin:.2rem 0;font-size:clamp(3rem,8vw,7rem);line-height:.95}.song-hero h2{margin:.7rem 0;color:var(--song-gold-soft);font-size:clamp(1.4rem,3vw,2.4rem)}.song-hero p{max-width:780px;color:var(--song-muted)}
.song-shell{max-width:1260px;margin:auto;padding:clamp(3rem,7vw,6rem) 1rem}.song-intro{display:grid;grid-template-columns:1.3fr .7fr;gap:1rem;margin-bottom:1.2rem}.song-panel{border:1px solid var(--song-line);border-radius:22px;background:linear-gradient(145deg,var(--song-panel),#0e0e15);padding:1.35rem}.song-panel h2,.song-panel h3{margin-top:0}.song-boundary strong{display:block;color:var(--song-gold);font-size:1.1rem}.song-boundary p{margin:.4rem 0 0;color:var(--song-muted)}
.song-controls{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:.75rem;align-items:end;margin:1rem 0}.song-controls label{display:grid;gap:.35rem;font-family:system-ui,sans-serif;font-size:.82rem;color:var(--song-muted)}.song-controls input,.song-controls select,.song-controls button{min-height:48px;border:1px solid var(--song-line);border-radius:12px;background:#0e1118;color:var(--song-text);padding:.75rem}.song-controls button{cursor:pointer;color:#24170b;background:var(--song-gold);font-weight:800}.song-controls button:hover,.song-controls button:focus-visible{background:var(--song-gold-soft)}
.song-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:1rem 0}.song-stat{border:1px solid var(--song-line);border-radius:16px;background:var(--song-panel);padding:1rem}.song-stat strong{display:block;color:var(--song-gold);font-size:1.65rem}.song-stat span{color:var(--song-muted);font-family:system-ui,sans-serif;font-size:.82rem}
.song-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.song-card{display:flex;flex-direction:column;min-height:330px;border:1px solid var(--song-line);border-radius:20px;background:linear-gradient(160deg,var(--song-panel-soft),var(--song-panel) 44%,#0d1016);padding:1.25rem}.song-card h3{margin:.55rem 0 .1rem;color:var(--song-gold-soft);font-size:1.45rem}.song-card .song-en{margin:0 0 .6rem;font-weight:700}.song-card .song-summary{color:var(--song-muted);flex:1}.song-meta{display:flex;flex-wrap:wrap;gap:.35rem}.song-pill{display:inline-flex;align-items:center;border:1px solid var(--song-line);border-radius:999px;padding:.25rem .55rem;color:var(--song-gold-soft);font-family:system-ui,sans-serif;font-size:.7rem}.song-state{background:rgba(242,189,84,.1)}.song-formats{display:flex;flex-wrap:wrap;gap:.35rem;margin:.8rem 0}.song-format{font-family:system-ui,sans-serif;font-size:.68rem;color:#e7ddcf}.song-card a{align-self:flex-start;margin-top:.7rem;border-radius:999px;background:var(--song-gold);color:#23170d;padding:.65rem .85rem;text-decoration:none;font-family:system-ui,sans-serif;font-weight:800}.song-card a:hover,.song-card a:focus-visible{background:var(--song-gold-soft)}
.song-empty{grid-column:1/-1;text-align:center}.song-roadmap{margin-top:2rem}.song-roadmap ol{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;padding:0;list-style:none;counter-reset:steps}.song-roadmap li{counter-increment:steps;border:1px solid var(--song-line);border-radius:16px;padding:1rem;background:var(--song-panel)}.song-roadmap li::before{content:counter(steps);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;margin-bottom:.6rem;background:var(--song-gold);color:#24170b;font-weight:800}
@media(max-width:980px){.song-grid{grid-template-columns:1fr 1fr}.song-controls{grid-template-columns:1fr 1fr}.song-intro{grid-template-columns:1fr}.song-roadmap ol{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.song-hero{min-height:380px;padding-top:6rem}.song-grid,.song-stats,.song-controls,.song-roadmap ol{grid-template-columns:1fr}.song-card{min-height:auto}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}