/* Vector interface graphics stay consistent on phones and desktops. */
.icon{display:inline-block;width:1em;height:1em;flex-shrink:0;vertical-align:-.12em;overflow:visible;pointer-events:none}
.button>.icon{width:20px;height:20px}.text-link>.icon{width:18px;height:18px}
.track-play .icon{width:14px;height:14px}.card-play .icon{width:17px;height:17px}.artist-plus .icon{width:23px;height:23px}
.dialog-close .icon,#image-dialog-close .icon{width:20px;height:20px}.dialog-close,#image-dialog-close{display:grid;place-items:center}
.search-box>span:first-child .icon{width:21px;height:21px}.track-heading .icon{width:11px;height:11px;margin-left:3px}
.footer-top>div a,.footer-bottom>a,.mobile-nav>.button{display:inline-flex;align-items:center;gap:8px}
.footer-top .icon,.footer-bottom>a .icon{width:13px;height:13px}.mobile-nav>a>.icon{width:25px;height:25px}
.sleeve-star,.next-star,.contact-star{display:inline-flex}.sleeve-star .icon{stroke:var(--ink);stroke-width:.4px}
.ticker b .icon{display:block}.hero-actions{display:flex;align-items:center;gap:18px}.mobile-slogan{display:none}

/* A compact brand poster replaces the duplicate playlist shortcut. */
.hero-announcement{display:flex;align-items:center;justify-content:space-between;gap:22px;position:relative;isolation:isolate;min-height:88px;width:310px;padding:14px 20px;background:var(--orange);color:var(--ink);border:1px solid #ffb18c;box-shadow:4px 4px 0 #b799ef;transform:rotate(-1deg)}
.hero-announcement:before,.hero-announcement:after{content:'';position:absolute;width:27px;height:9px;background:#f4f0e8;opacity:.9;top:-5px;transform:rotate(-14deg)}
.hero-announcement:before{left:19px}.hero-announcement:after{right:19px;transform:rotate(12deg)}
.announcement-copy{min-width:0}.announcement-copy>span{display:block;font:700 7px/1.4 var(--editorial);letter-spacing:.11em;margin-bottom:6px}
.hero-announcement h2{font-family:var(--editorial);font-size:25px;font-weight:800;line-height:.94;letter-spacing:-.035em;margin:0;white-space:nowrap}
.announcement-shirt{width:57px;height:63px;flex-shrink:0;transform:rotate(8deg)}

@media(max-width:900px){
 .desktop-slogan{display:none!important}.mobile-slogan{display:block;flex:0 0 88px;width:88px;animation:slogan-float 8s ease-in-out infinite alternate;pointer-events:none}.mobile-slogan img{display:block;width:100%;height:auto;filter:drop-shadow(0 3px 8px rgba(0,0,0,.2))}
 .hero-announcement{width:290px}.hero-bottom{padding-top:25px;padding-bottom:29px}
}
@media(max-width:620px){
 .hero-content{display:block;min-height:0;padding-top:28px}.hero-copy{padding:0;width:100%}.hero-actions{gap:16px;min-height:76px;width:100%}.mobile-slogan{flex-basis:82px;width:82px}
 .hero-visual{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:calc(100% + 44px);height:355px;margin:20px -22px 0;z-index:0}.hero-photo{object-position:50% 43%}.hero-visual:after{background:linear-gradient(0deg,#08080b 1%,transparent 24%,transparent 76%,#08080b 99%)}
 .hero-bottom{gap:20px;padding:25px 0 28px}.hero-announcement{width:auto;flex:1;min-width:0;min-height:90px;padding:13px 15px;gap:12px}.hero-announcement h2{font-size:22px}.announcement-copy>span{font-size:6px;letter-spacing:.06em}.announcement-shirt{width:42px;height:48px}.hero-announcement:before,.hero-announcement:after{width:21px;height:8px}
 .scroll-cue{flex-shrink:0;width:66px;flex-direction:column;align-items:flex-end;gap:8px;line-height:1.7;text-align:right;font-size:7px;letter-spacing:.03em}.scroll-cue .icon{width:21px;height:21px}
}
@media(max-width:360px){
 .hero-actions{gap:13px;min-height:70px}.mobile-slogan{flex-basis:72px;width:72px}.hero .button{min-width:176px}.hero-visual{height:310px;margin-top:19px}.hero-bottom{gap:16px}.hero-announcement{padding:13px 11px;gap:8px}.hero-announcement h2{font-size:19px}.announcement-copy>span{font-size:5px}.announcement-shirt{width:33px;height:39px}.scroll-cue{width:53px;font-size:6px}
}
@media(prefers-reduced-motion:reduce){.mobile-slogan{animation:none}}
[data-motion=off] .mobile-slogan{animation:none}

/* Preserve the complete event flyer and each shared photo's proportions. */
.experience-image{min-height:0;aspect-ratio:2/1;background:#110c1c;display:block;align-self:center}
.experience-image img{height:auto;aspect-ratio:2/1;object-fit:contain}
.experience-detail-image{height:auto;aspect-ratio:2/1;max-height:none;background:#110c1c;object-fit:contain}
.collective-photos{display:block;column-count:4;column-gap:20px}
.collective-photo,.collective-photo:first-child{display:inline-block;width:100%;margin:0 0 20px;break-inside:avoid;vertical-align:top;background:#18101f}
.collective-photo>img,.collective-photo:first-child>img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
@media(max-width:1100px){.collective-photos{column-count:3;column-gap:16px}.collective-photo,.collective-photo:first-child{margin-bottom:16px}}
@media(max-width:620px){.collective-photos{column-count:2;column-gap:12px}.collective-photo,.collective-photo:first-child{margin-bottom:12px}.experience-image,.experience-image img{aspect-ratio:2/1}}

/* Keep enlarged photos inside their frame and captions in a separate footer. */
.image-dialog{height:min(94svh,1100px);overflow:hidden}
.image-dialog[open]{display:flex;flex-direction:column}
.image-dialog-picture{flex:1 1 0;min-height:0;height:auto;max-height:none;display:flex;align-items:center;justify-content:center;padding:54px 24px 20px;overflow:hidden}
.image-dialog-picture>img{display:block;width:100%;height:100%;min-height:0;max-width:100%;max-height:100%;object-fit:contain}
.image-dialog-footer{position:relative;z-index:1;display:flex;flex:0 0 auto;max-height:40%;overflow-y:auto;background:#0a070e;align-items:center}
.image-dialog-footer>div{flex:1;min-width:0}
.image-dialog-footer h2{max-width:none;overflow-wrap:anywhere}
.image-dialog-footer>button{flex:0 0 auto;width:auto;max-width:none;margin-top:0}
@media(max-width:620px){.image-dialog-picture{padding:54px 8px 14px}.image-dialog-footer{gap:14px;padding:16px}.image-dialog-footer h2{font-size:17px}.image-dialog-footer>button{font-size:9px;padding:10px 12px;gap:8px}}
@media(max-height:500px){.image-dialog-picture{padding:12px 55px}.image-dialog-footer{padding:12px 16px}.image-dialog-footer h2{font-size:16px}}

/* MV CLUB begins with a simple community invitation. */
.club-section{display:grid;grid-template-columns:.9fr 1fr;align-items:center;gap:clamp(40px,7vw,110px);background:radial-gradient(ellipse at 0 100%,rgba(156,106,238,.11),transparent 65%),#18101f;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.club-brand>.eyebrow{color:var(--lilac);font-size:9px;margin-bottom:25px}
.club-brand h2{font-family:var(--editorial);font-weight:800;font-size:clamp(76px,7.3vw,118px);line-height:.85;letter-spacing:-.055em}
.club-brand h2>span{color:var(--lilac)}
.club-tagline{margin-top:29px;font-size:9px;line-height:1.6;letter-spacing:.11em;color:#bcadc8;font-weight:600}
.club-status{font-size:8px;letter-spacing:.09em;border-color:#5d4271;color:#f4f0e8}
.club-invite>p{max-width:430px;font-size:15px;line-height:1.9;color:#cfc4d6;margin:23px 0 0}
.club-invite>p+p{margin-top:12px}.club-invite>.button{margin-top:27px;gap:28px;min-width:210px}
.club-invite>p.club-note{font-size:10px;line-height:1.7;color:#a899b3;margin-top:14px}
@media(max-width:900px){.club-section{gap:40px}.club-invite>p{font-size:14px}}
@media(max-width:620px){.club-section{grid-template-columns:1fr;gap:35px;padding-top:64px;padding-bottom:64px}.club-brand h2{font-size:82px}.club-brand>.eyebrow{font-size:8px;margin-bottom:24px}.club-tagline{font-size:8px;margin-top:24px}.club-invite>p{font-size:14px;max-width:100%;line-height:1.85}.club-invite>.button{min-width:0;width:100%;padding:16px 21px}.club-invite>p.club-note{font-size:10px}}
@media(max-width:360px){.club-brand h2{font-size:74px}.club-tagline{font-size:7px;letter-spacing:.08em}}
.site-header a.nav-club,.site-header a.nav-club[aria-current]{color:var(--orange)}
.site-header a.nav-club:hover,.site-header a.nav-club:focus-visible{color:#ff9b70}
.site-header a.nav-club>span{color:#ff9b70}
