/* Shared styling for the three artist pages.
   Same palette, type scale, radii and border treatment as the rest of the site:
   the artist pages should read as original design, not an embedded music widget.
   Accent gradients a1/a2/a3 mirror the homepage project cards. */

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ---- compact artist header ---- */
.artist-head{
  display:flex;align-items:center;gap:22px;
  margin:0 0 8px;padding:0 0 26px;border-bottom:1px solid var(--line);
}
.ah-art{
  flex:none;width:120px;height:120px;border-radius:12px;overflow:hidden;
  display:grid;place-items:center;position:relative;border:1px solid var(--line);
}
.ah-art.a1{background:linear-gradient(135deg,#7a4a1e,#2a1a0e)}
.ah-art.a2{background:linear-gradient(135deg,#6a2f3a,#241016)}
.ah-art.a3{background:linear-gradient(135deg,#2f4a5a,#101c22)}
.ah-glyph{
  font-family:var(--font-display);font-size:52px;font-style:italic;
  color:rgba(239,231,216,.9);line-height:1;
}
.ah-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ah-body{min-width:0}
.ah-genre{
  font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);margin:0 0 6px;
}
.ah-name{
  font-family:var(--font-display);font-weight:500;letter-spacing:-.01em;
  font-size:clamp(28px,5vw,42px);line-height:1.05;margin:0;
}
.ah-tagline{color:var(--muted);font-size:15px;margin:8px 0 0}
.ah-bio{color:#d8cdb9;font-size:14.5px;line-height:1.6;margin:12px 0 0;max-width:60ch}
.ah-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.ah-links a{
  font-size:11.5px;font-weight:600;color:var(--gold);text-decoration:none;
  border:1px solid var(--gold-soft,#7a5a2a);border-radius:999px;padding:5px 12px;transition:.2s;
}
.ah-links a:hover,.ah-links a:focus-visible{
  border-color:var(--gold);background:rgba(224,169,74,.08);text-decoration:none;
}

/* ---- discography ---- */
.disco-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  margin:34px 0 14px;
}
.disco-head h2{font-family:var(--font-display);font-weight:500;font-size:22px;margin:0}
.disco-status{color:var(--muted);font-size:12.5px;margin:0}
.disco-status a{color:var(--gold)}

.disco{list-style:none;margin:0;padding:0}
.rel{
  padding:10px 12px;border:1px solid transparent;border-radius:10px;
  transition:background .18s ease,border-color .18s ease;
}
.rel + .rel{margin-top:2px}
.rel:hover{background:rgba(224,169,74,.045);border-color:var(--line)}
.rel:focus-within{border-color:var(--gold-soft,#7a5a2a)}
.rel-head{display:flex;align-items:center;gap:14px}

.rel-cover{position:relative;flex:none;width:60px;height:60px}
.rel-art{
  width:60px;height:60px;border-radius:7px;object-fit:cover;display:block;
  background:var(--panel);border:1px solid var(--line);
}
.rel-art-fallback{display:block;background:var(--panel);border:1px solid var(--line);border-radius:7px}
.rel-main{flex:1;min-width:0}
.rel-title{
  font-family:var(--font-body);font-size:14.5px;font-weight:600;color:var(--ink);
  margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.rel-meta{color:var(--muted);font-size:12px;margin:3px 0 0}

/* ---- track list under each release ---- */
.trklist{list-style:none;margin:8px 0 0 74px;padding:0}
.trk{
  display:flex;align-items:center;gap:11px;min-height:34px;
  padding:2px 8px 2px 0;border-radius:7px;
  color:#d8cdb9;font-size:13.5px;
}
.trk:hover{background:rgba(224,169,74,.05)}
.trk-loading,.trk-empty{color:var(--muted);font-size:12.5px;padding-left:4px}
.trk-play{
  flex:none;display:grid;place-items:center;
  width:26px;height:26px;margin:0;padding:0;
  border:1px solid transparent;border-radius:50%;
  background:transparent;color:var(--gold);cursor:pointer;
  font:inherit;line-height:1;box-shadow:none;
  transition:border-color .18s ease,background .18s ease;
}
.trk-play svg{width:15px;height:15px}
.trk:hover .trk-play{border-color:var(--gold-soft,#7a5a2a)}
.trk-play:hover,.trk-play.playing{border-color:var(--gold);background:rgba(224,169,74,.1)}
.trk-play:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.trk-play[disabled]{color:var(--muted);border-color:transparent;background:none;cursor:default}
/* a track with no preview keeps its slot so the column stays aligned */
.trk-num{
  flex:none;width:26px;text-align:center;
  color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums;
}
.trk-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trk-time{flex:none;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}
.trk-note{flex:none;color:var(--muted);font-size:11px}
.trk-noplay .trk-name{color:var(--muted)}

/* ---- responsive: collapse without horizontal scrolling ---- */
@media(max-width:640px){
  .artist-head{gap:16px;padding-bottom:20px}
  .ah-art{width:88px;height:88px}
  .ah-glyph{font-size:38px}
  .rel{padding:10px 8px}
  .rel-head{gap:11px}
  .rel-title{white-space:normal;overflow:visible}
  /* pull the track list back under the artwork so names keep their width */
  .trklist{margin-left:0;padding-left:8px;border-left:1px solid var(--line)}
  .trk{min-height:40px}          /* comfortable tap target on touch */
}
@media(max-width:440px){
  .artist-head{flex-direction:column;align-items:flex-start;gap:14px}
  .trk-time{display:none}        /* name first when space is tight */
}

@media(prefers-reduced-motion:reduce){
  .rel,.trk-play,.ah-links a{transition:none}
}