/* SafeWave 4.0 Sprint 3 — Album Experience
   Visual/metadata enhancement only. Stable playback remains in script.js. */

.v4-album-detail{
  max-width:1450px;
  margin:0 auto;
  padding:48px clamp(22px,6vw,96px) 150px;
}
.v4-album-back{
  appearance:none;border:0;background:transparent;color:#8fa1af;
  padding:12px 0;margin-bottom:36px;font-size:13px;font-weight:750;
}
.v4-album-back:hover{color:#fff}

.v4-album-hero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(300px,470px) minmax(0,1fr);
  gap:clamp(50px,7vw,110px);
  align-items:center;
  padding:12px 0 88px;
  border-bottom:1px solid rgba(255,255,255,.09);
}
.v4-album-art-wrap{position:relative;isolation:isolate}
.v4-album-art-wrap>img{
  position:relative;z-index:2;width:100%;aspect-ratio:1;object-fit:cover;
  border-radius:30px;box-shadow:0 34px 90px rgba(0,0,0,.42);
}
.v4-album-art-glow{
  position:absolute;z-index:0;inset:10%;border-radius:36px;
  background:linear-gradient(135deg,rgba(57,224,208,.28),rgba(77,124,255,.24));
  filter:blur(70px);opacity:.65;
}
.v4-album-copy{max-width:760px}
.v4-album-copy .kicker{color:#6f8393}
.v4-album-copy h1{
  margin:10px 0 13px;
  font-size:clamp(58px,7vw,104px);line-height:.91;letter-spacing:-.072em;
}
.v4-album-copy .album-detail-artist{
  color:#d4dde5;font-size:16px;font-weight:750;margin-bottom:28px;
}
.v4-album-description{
  max-width:670px;color:#9babb8;font-size:18px;line-height:1.65;
}
.v4-album-copy .album-detail-tags{display:flex;gap:7px;flex-wrap:wrap;margin:24px 0 0}
.v4-album-copy .album-detail-tags span{
  padding:7px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.085);
  background:rgba(255,255,255,.035);color:#91a4b2;font-size:11px;
}
.v4-album-stats{
  display:flex;gap:0;margin-top:34px;border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.v4-album-stats>div{min-width:130px;padding:19px 28px 19px 0}
.v4-album-stats>div+div{padding-left:28px;border-left:1px solid rgba(255,255,255,.08)}
.v4-album-stats strong{display:block;font-size:18px;letter-spacing:-.02em;color:#edf5f7}
.v4-album-stats span{
  display:block;margin-top:3px;color:#6f8494;text-transform:uppercase;
  letter-spacing:.12em;font-size:9px;
}
.v4-album-actions{display:flex;gap:10px;margin-top:30px}
.v4-album-actions button{min-height:52px;border-radius:15px;padding:0 22px;font-weight:800}
.v4-album-actions .pill-primary{
  color:#04121a;background:linear-gradient(100deg,#39e0d0,#46baf5 55%,#647cff)
}

.v4-tracklist-section{padding:82px 0 40px}
.v4-tracklist-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:28px;
}
.v4-tracklist-head h2{
  margin-top:7px;font-size:clamp(36px,4vw,58px);letter-spacing:-.055em;
}
.v4-tracklist-head>span,.v4-tracklist-head>a{color:#778b9a;font-size:13px}
.v4-tracklist-head>a:hover{color:#fff}

.v4-album-track-list{
  overflow:hidden;border:1px solid rgba(255,255,255,.085);
  border-radius:24px;background:#091620;
}
.v4-album-track-list .album-track-row{
  display:grid;
  grid-template-columns:48px 54px minmax(0,1fr) 100px 72px 52px;
  align-items:center;gap:14px;min-height:78px;padding:10px 15px;
  border-bottom:1px solid rgba(255,255,255,.065);
  transition:background .18s ease;
}
.v4-album-track-list .album-track-row:last-child{border-bottom:0}
.v4-album-track-list .album-track-row:hover{background:rgba(255,255,255,.035)}
.v4-album-track-list .album-track-row>span:first-child{
  color:#657b8a;font-size:11px;font-variant-numeric:tabular-nums;text-align:center;
}
.v4-album-track-list .album-track-row img{
  width:48px;height:48px;border-radius:10px;object-fit:cover;
}
.v4-album-track-list .album-track-row>div{min-width:0}
.v4-album-track-list .album-track-row strong{
  display:block;color:#edf3f6;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.v4-album-track-list .album-track-row small{
  display:block;color:#778b99;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.v4-album-track-list .album-track-row>span:nth-of-type(2),
.v4-album-track-list .album-track-row>span:nth-of-type(3){
  color:#718594;font-size:11px;text-align:right;
}
.v4-album-track-list .album-track-row>button{
  width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.035);color:#e8f1f4;
}
.v4-album-track-list .album-track-row>button:hover{
  border-color:rgba(57,224,208,.28);background:#e8f8f6;color:#06111a;
}

.v4-album-related{padding-top:82px}
.v4-album-related .album-related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.v4-album-related .album-related-card{
  display:grid;grid-template-columns:150px minmax(0,1fr);align-items:center;gap:24px;
  min-height:170px;padding:10px;border:1px solid rgba(255,255,255,.085);
  border-radius:22px;background:#091620;cursor:pointer;transition:.24s ease;
}
.v4-album-related .album-related-card:hover{
  transform:translateY(-3px);border-color:rgba(57,224,208,.2);
}
.v4-album-related .album-related-card img{
  width:150px;height:150px;object-fit:cover;border-radius:15px;
}
.v4-album-related .album-related-card strong{
  display:block;font-size:24px;letter-spacing:-.035em;margin-bottom:6px;
}
.v4-album-related .album-related-card small{color:#788c9b}

@media(max-width:950px){
  .v4-album-hero{grid-template-columns:minmax(250px,360px) minmax(0,1fr);gap:44px}
  .v4-album-copy h1{font-size:clamp(52px,8vw,76px)}
  .v4-album-stats>div{min-width:100px}
}
@media(max-width:760px){
  .v4-album-detail{padding-top:28px}
  .v4-album-back{margin-bottom:18px}
  .v4-album-hero{grid-template-columns:1fr;padding-bottom:58px;gap:36px}
  .v4-album-art-wrap{max-width:520px;width:100%}
  .v4-album-copy h1{font-size:clamp(52px,14vw,78px)}
  .v4-tracklist-section,.v4-album-related{padding-top:60px}
  .v4-album-track-list .album-track-row{
    grid-template-columns:34px 48px minmax(0,1fr) 44px;gap:10px;min-height:72px;padding:10px;
  }
  .v4-album-track-list .album-track-row>span:nth-of-type(2),
  .v4-album-track-list .album-track-row>span:nth-of-type(3){display:none}
  .v4-album-related .album-related-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
  .v4-album-detail{padding-left:20px;padding-right:20px;padding-bottom:120px}
  .v4-album-art-wrap>img{border-radius:23px}
  .v4-album-description{font-size:16px}
  .v4-album-stats{display:grid;grid-template-columns:repeat(3,1fr)}
  .v4-album-stats>div{min-width:0;padding:15px 10px 15px 0}
  .v4-album-stats>div+div{padding-left:12px}
  .v4-album-stats strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .v4-album-actions{display:grid;grid-template-columns:1fr}
  .v4-tracklist-head{align-items:flex-start}
  .v4-tracklist-head h2{font-size:38px}
  .v4-tracklist-head>span,.v4-tracklist-head>a{display:none}
  .v4-album-track-list{margin-left:-4px;margin-right:-4px;border-radius:18px}
  .v4-album-track-list .album-track-row{grid-template-columns:28px 44px minmax(0,1fr) 40px}
  .v4-album-track-list .album-track-row img{width:44px;height:44px}
  .v4-album-related .album-related-card{
    grid-template-columns:100px minmax(0,1fr);min-height:120px;gap:16px;
  }
  .v4-album-related .album-related-card img{width:100px;height:100px}
  .v4-album-related .album-related-card strong{font-size:20px}
}