.artist-profile { display: grid; gap: 1.5rem; }
.artist-profile--with-image { grid-template-columns: minmax(220px, 320px) 1fr; }
.artist-profile__media { min-width: 0; }
.artist-profile__image { background: #191414; border-radius: 8px; display: block; height: auto; width: 100%; }
.artist-profile__spotify-attribution { align-items: center; color: #fff; display: flex; font: 10px/1 "Share Tech Mono", monospace; gap: .75rem; justify-content: space-between; letter-spacing: .1em; margin-top: .75rem; text-decoration: none; }
.artist-profile__spotify-attribution img { height: auto; max-width: 96px; width: 96px; }
.artist-socials { display: flex; flex-wrap: wrap; gap: .5rem; }
.artist-socials a, .artist-bio__toggle { background: #00ff41; border: 1px solid #00ff41; color: #020402; cursor: pointer; font: 11px/1 "Share Tech Mono", monospace; letter-spacing: .08em; padding: .6rem .75rem; text-decoration: none; text-transform: uppercase; }
.artist-socials a:hover, .artist-socials a:focus-visible, .artist-bio__toggle:hover, .artist-bio__toggle:focus-visible { background: transparent; color: #00ff41; outline: none; }
.artist-spotify iframe { border: 0; display: block; min-height: 352px; width: 100%; }
.artist-pagination { align-items: center; border-top: 1px dashed rgba(0,255,65,.25); display: grid; font: 12px/1.3 "Share Tech Mono", monospace; gap: 1rem; grid-template-columns: 1fr auto 1fr; padding-top: 1.25rem; text-transform: uppercase; }
.artist-pagination > div:last-child { text-align: right; }
.artist-pagination a { color: rgba(0,255,65,.72); text-decoration: none; }
.artist-pagination a:hover, .artist-pagination a:focus-visible { color: #00ff41; }
.artist-pagination__index { border: 1px solid rgba(0,255,65,.35); padding: .55rem .7rem; }
.artist-appearance-card { background: rgba(0,0,0,.62); border: 1px solid rgba(0,255,65,.22); overflow: hidden; }
.artist-appearance-card__image { aspect-ratio: 4 / 5; background: #080b09; display: flex; overflow: hidden; text-decoration: none; }
.artist-appearance-card__image img { height: 100%; object-fit: cover; transition: transform .2s ease; width: 100%; }
.artist-appearance-card__image span { align-items: center; color: rgba(0,255,65,.4); display: flex; font-size: 10px; justify-content: center; letter-spacing: .15em; width: 100%; }
.artist-appearance-card__image:hover img, .artist-appearance-card__image:focus-visible img { transform: scale(1.025); }
.artist-appearance-card__info { display: flex; flex-direction: column; gap: .25rem; padding: .75rem; }
.artist-appearance-card__info strong { color: #fff; font-size: .85rem; line-height: 1.25; }
.artist-appearance-card__info time { color: rgba(0,255,65,.62); font-size: .68rem; letter-spacing: .04em; }
.artist-appearance-card__actions { display: grid; gap: 1px; grid-template-columns: 1fr 1fr; }
.artist-appearance-card__actions a { align-items: center; background: #00ff41; border: 1px solid #00ff41; color: #020402; display: flex; font-size: .68rem; justify-content: center; min-height: 42px; padding: .65rem .4rem; text-align: center; text-decoration: none; transition: background .16s ease, color .16s ease; }
.artist-appearance-card__actions a:hover, .artist-appearance-card__actions a:focus-visible { background: transparent; color: #00ff41; outline: none; }
@media (max-width: 767px) { .artist-profile--with-image { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .artist-bio.is-collapsible .artist-bio__content { max-height: 19rem; overflow: hidden; position: relative; }
  .artist-bio.is-collapsible:not(.is-expanded) .artist-bio__content::after { background: linear-gradient(transparent, #050705); bottom: 0; content: ""; height: 5rem; left: 0; pointer-events: none; position: absolute; right: 0; }
  .artist-bio.is-expanded .artist-bio__content { max-height: none; }
  .artist-bio__toggle { margin-top: 1rem; width: 100%; }
  .artist-pagination { grid-template-columns: 1fr 1fr; }
  .artist-pagination__index { display: none; }
}