/* AEYSA refinement preview. Existing art, links and player behavior retained. */
:root{color-scheme:dark;--muted:rgba(255,255,255,.74);--faint:rgba(255,255,255,.68)}
.content{max-width:26rem}
.tagline{font-size:.76rem;line-height:1.65;letter-spacing:.17em}
.eyebrow{font-size:.72rem;letter-spacing:.17em;color:var(--muted);margin-top:2.4rem}
.player{min-height:78px;padding:.9rem .35rem}
.track-title{font-size:1.2rem;letter-spacing:.16em;font-weight:400}
.track-meta{font-size:.72rem;line-height:1.6;letter-spacing:.07em;margin-top:.45rem}
.btn{min-height:54px;font-size:.8rem;letter-spacing:.1em}
.btn[href="/presale/"]{margin-top:1.4rem;min-height:58px;background:#d7dce3;color:#0a0e16;border:1px solid #d7dce3;border-radius:3px;font-weight:400;letter-spacing:.12em}
.btn[href="/presale/"]:hover,.btn[href="/presale/"]:focus-visible{background:#e8ecf1;border-color:#e8ecf1;color:#05070c}
.social{margin-top:1.5rem}
.social a{color:rgba(255,255,255,.68)}
.cue,.more{font-size:.74rem;letter-spacing:.14em;color:var(--muted)}
.kicker{font-size:.75rem;letter-spacing:.2em;color:var(--muted)}
.name p{font-size:1rem;line-height:1.85}
.name .close{font-size:.78rem;letter-spacing:.13em}
.foot{font-size:.75rem;color:rgba(255,255,255,.65);letter-spacing:.08em}
@media(max-width:900px){
  .page{grid-template-rows:clamp(220px,32dvh,320px) auto}
  .portrait{min-height:0}
  .panel{padding:1.5rem max(1.35rem,env(safe-area-inset-right)) 1.25rem max(1.35rem,env(safe-area-inset-left))}
  .content{max-width:28rem}
  h1{width:210px}
  .tagline{margin-top:1rem;font-size:.72rem}
  .eyebrow{margin:1.5rem 0 .55rem}
  .player{min-height:70px}
  .btn{min-height:48px}
  .btn[href="/presale/"]{margin-top:1rem;min-height:56px}
  .social{margin-top:1.05rem}
  .cue{margin-top:.6rem}
  .name{padding-top:3.75rem;padding-bottom:3rem}
}
@media(max-width:380px){
  .btn{font-size:.75rem;letter-spacing:.075em}
  .track-meta{font-size:.67rem;letter-spacing:.045em}
}
@media(max-height:520px) and (orientation:landscape){
  .page{grid-template-columns:minmax(0,.8fr) minmax(300px,1.2fr);grid-template-rows:auto}
  .portrait{min-height:100dvh}
  .panel{padding:1.6rem}
}

/* Keep the complete existing square portrait visible on portrait-orientation phones.
   Desktop, tablet and short landscape layouts retain their established framing. */
@media(max-width:600px) and (orientation:portrait){
  .page{grid-template-rows:auto auto;align-content:start}
  .portrait{width:100%;height:auto;min-height:0;aspect-ratio:1/1;align-self:start}
  .portrait img{object-fit:contain;object-position:center}
  .portrait::after{background:linear-gradient(180deg,transparent 72%,rgba(5,7,12,.18) 88%,rgba(10,14,22,.92) 100%)}
}