.song-page-body{background:radial-gradient(circle at 78% 18%,rgba(200,154,80,.15),transparent 30rem),var(--ink)}
.song-page-header{position:static;background:rgba(9,8,6,.96);border-bottom:1px solid var(--line)}
.song-page-nav{min-height:5rem}
.song-page-back{color:#c7bdae;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;transition:.2s}
.song-page-back:hover{color:var(--gold-bright);transform:translateX(-3px)}
.song-detail{padding:5rem 0 8rem}
.song-detail-grid{display:grid;grid-template-columns:minmax(16rem,25rem) 1fr;gap:clamp(3rem,8vw,8rem);align-items:center}
.song-canvas{position:relative;aspect-ratio:9/16;overflow:hidden;background:#12100d;box-shadow:0 30px 90px rgba(0,0,0,.5)}
.song-canvas img,.song-canvas video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.song-canvas video{z-index:2}.song-canvas img{z-index:1}.song-canvas:after{content:"";position:absolute;z-index:3;inset:0;box-shadow:inset 0 0 70px rgba(9,8,6,.24);pointer-events:none}
.song-detail-copy h1{max-width:10ch;font-size:clamp(4rem,9vw,8.5rem);line-height:.88}
.song-release-state{margin:1.5rem 0;color:var(--gold-bright);font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.song-detail-copy>.song-description{max-width:40rem;margin:1.6rem 0;color:#b6ac9f;font-size:1rem}
.detail-actions{display:flex;flex-wrap:wrap;gap:1.4rem;margin-top:1.8rem}
.detail-player{max-width:38rem;margin-top:2.4rem;padding:1.2rem;border:1px solid var(--line);background:#0e0d0b}
.detail-player-row{display:grid;grid-template-columns:3.3rem 1fr;align-items:center;gap:1rem}
.detail-play{width:3.3rem;height:3.3rem;display:grid;place-items:center;border:1px solid var(--gold);border-radius:50%;color:var(--ink);background:var(--gold-bright);cursor:pointer}.detail-play:disabled{color:#71675a;border-color:#544a3c;background:#211e19;cursor:not-allowed}.detail-play svg{width:1rem;height:1rem;fill:currentColor}
.detail-progress{width:100%;accent-color:var(--gold-bright)}.detail-time{display:flex;justify-content:space-between;color:#81796f;font-size:.68rem}.detail-status{margin:.8rem 0 0;color:#8f867a;font-size:.75rem}
.song-reading{padding-top:0}
.song-reading-grid{display:grid;grid-template-columns:.82fr 1.18fr;border:1px solid var(--line);background:#0f0e0c}
.song-reading section{padding:clamp(2rem,5vw,4.5rem)}
.song-reading section+section{border-left:1px solid var(--line)}
.song-reading h2{font-size:clamp(2.7rem,5vw,4.8rem)}
.song-reading p{color:var(--muted)}
.song-reading .about-text{color:#c7bdae;font:clamp(1.25rem,2.4vw,1.85rem)/1.55 "Libre Caslon Display",Georgia,serif}
.detail-lyrics{max-height:28rem;overflow:auto;margin-top:2rem}
.detail-lyrics .lyrics-empty{font-size:clamp(1.25rem,2.4vw,1.85rem)}
.song-page-footer .footer-grid{grid-template-columns:1fr auto}
@media(max-width:840px){.song-detail{padding-top:3rem}.song-detail-grid,.song-reading-grid{grid-template-columns:1fr}.song-canvas{width:min(100%,20rem);margin:auto}.song-reading section+section{border-left:0;border-top:1px solid var(--line)}}
@media(max-width:620px){.song-page-header .brand{font-size:.88rem}.song-page-back{font-size:.62rem}.song-page-footer .footer-grid{grid-template-columns:1fr}.song-detail-copy h1{font-size:clamp(3.6rem,19vw,5.6rem)}}
