.radio-page{min-height:100vh;background:#120d0a;color:#fff}.radio-header{position:absolute;background:linear-gradient(180deg,rgba(12,8,6,.9),transparent);border:0}.header-links{display:flex;align-items:center;gap:2rem}.back-link{display:flex;align-items:center;gap:.75rem;text-transform:uppercase;letter-spacing:.14em;font-size:.68rem;font-weight:700}.back-link span{color:var(--orange);font-size:1.1rem}
.radio-main{position:relative;min-height:calc(100vh - 110px);display:grid;place-items:center;padding:9rem clamp(1.25rem,6vw,6rem) 5rem;overflow:hidden;background:#17100c url('assets/arena-hero.png') center/cover fixed}.radio-atmosphere{position:absolute;inset:0;background:radial-gradient(circle at 76% 45%,rgba(159,60,21,.18),transparent 32%),linear-gradient(90deg,rgba(13,8,6,.96) 0%,rgba(19,11,8,.84) 48%,rgba(13,8,6,.68)),linear-gradient(0deg,#100b08 0%,transparent 40%)}
.radio-console{position:relative;z-index:2;width:min(1280px,100%);display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:clamp(3rem,7vw,8rem)}.on-air{display:flex;align-items:center;gap:.8rem;margin:0 0 1.5rem;color:#f0a079;text-transform:uppercase;letter-spacing:.22em;font-size:.66rem;font-weight:700}.on-air span{width:9px;height:9px;border-radius:50%;background:#ef4e24;box-shadow:0 0 0 7px rgba(239,78,36,.15);animation:pulse 1.7s infinite}.radio-copy h1{margin:0;font:800 clamp(5rem,9vw,9rem)/.77 var(--display);text-transform:uppercase;letter-spacing:-.04em}.radio-copy h1 em{color:var(--orange)}.radio-intro{max-width:540px;margin:2rem 0;color:#cbbdb3;font-size:1rem}.now-playing{display:flex;gap:1.2rem;align-items:center;padding:1.3rem 0;border-top:1px solid rgba(255,255,255,.15);border-bottom:1px solid rgba(255,255,255,.15)}.now-playing>div:last-child{display:flex;flex-direction:column}.now-playing small{text-transform:uppercase;letter-spacing:.16em;color:#9f8f83;font-size:.58rem}.now-playing strong{font:700 1.65rem/1.2 var(--display);text-transform:uppercase}.now-playing span{font-size:.75rem;color:#af9e93}.equalizer{height:42px;width:48px;display:flex;align-items:end;justify-content:center;gap:3px}.equalizer i{display:block;width:4px;height:20%;background:var(--orange)}.radio-page.playing .equalizer i{animation:bars .7s ease-in-out infinite alternate}.equalizer i:nth-child(2){animation-delay:-.25s}.equalizer i:nth-child(3){animation-delay:-.5s}.equalizer i:nth-child(4){animation-delay:-.12s}.equalizer i:nth-child(5){animation-delay:-.36s}
.radio-controls{display:flex;align-items:center;gap:2rem;margin-top:1.7rem}.radio-play{min-width:190px;height:58px;padding:0 1.4rem;display:flex;align-items:center;justify-content:center;gap:.9rem;border:0;background:var(--orange);color:#fff;cursor:pointer;text-transform:uppercase;letter-spacing:.11em;font-size:.68rem}.radio-play:disabled{opacity:.55;cursor:wait}.play-icon{font-size:.85rem}.volume-control{display:flex;flex-direction:column;gap:.35rem;color:#9f8f83;text-transform:uppercase;letter-spacing:.12em;font-size:.55rem}.volume-control input{width:130px;accent-color:var(--orange)}.radio-status{min-height:1.5rem;color:#9f8f83;font-size:.7rem;margin-top:1rem}.radio-status.error{color:#ff9d77}
.radio-visual{min-width:0}.radio-frame{position:relative;aspect-ratio:16/9;padding:9px;background:#2a1d16;border:1px solid rgba(222,157,106,.32);box-shadow:0 30px 80px rgba(0,0,0,.52)}#youtube-player,.radio-frame iframe{display:block;width:100%;height:100%}.frame-label{position:absolute;z-index:3;left:1.2rem;bottom:1.2rem;display:flex;align-items:center;gap:.8rem;pointer-events:none}.frame-label span{padding:.35rem .55rem;background:#e84320;font-size:.56rem;font-weight:700;letter-spacing:.1em}.frame-label small{padding:.3rem .5rem;background:rgba(0,0,0,.7);text-transform:uppercase;letter-spacing:.1em;font-size:.52rem}.radio-visual>p{color:#84766c;font-size:.65rem;max-width:560px;margin:1rem auto 0;text-align:center}.radio-footer{background:#0e0a08}
@keyframes pulse{50%{box-shadow:0 0 0 11px rgba(239,78,36,0)}}@keyframes bars{to{height:100%}}
@media(max-width:900px){.radio-main{background-attachment:scroll}.radio-console{grid-template-columns:1fr;padding-top:2rem}.radio-copy{max-width:660px}.radio-visual{width:100%}}
@media(max-width:560px){.header-links{gap:1rem}.header-links .back-link:first-child{display:none}.radio-main{padding:7rem 1rem 4rem}.radio-console{gap:3rem}.radio-copy h1{font-size:4.6rem}.radio-controls{align-items:flex-start;flex-direction:column;gap:1rem}.radio-play{width:100%}.volume-control,.volume-control input{width:100%}.radio-frame{padding:5px}.frame-label{left:.7rem;bottom:.7rem}.radio-footer>p:not(.copyright){display:none}}
@media(prefers-reduced-motion:reduce){.on-air span,.radio-page.playing .equalizer i{animation:none}}