/* ===== v5 WOW: glitter, chrome, vinyl. Delete wow.css + wow.js (and their tags) to roll back. ===== */
body{background:radial-gradient(60% 45% at 85% -8%,rgba(255,63,168,.26),transparent 70%),radial-gradient(50% 40% at -5% 105%,rgba(140,150,255,.12),transparent 70%),var(--bg);background-attachment:fixed}
#fxc{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
/* chrome headline with a travelling pink flare */
.cs-tx h1,.hero h1{background:linear-gradient(100deg,#fff 0,#9a9dac 22%,#ff8ccc 44%,#fff 52%,#7d808e 74%,#fafbff 100%)!important;background-size:260% 100%!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;animation:sw 7s ease-in-out infinite alternate!important;filter:drop-shadow(0 0 30px rgba(255,63,168,.38))}
@keyframes sw{to{background-position:100% 0}}
/* marquee is back, as outlined giant type */
.mq{display:block!important;border:0;margin:0 0 44px;padding:6px 0}.mq div{animation-duration:34s}
.mq span{font-size:clamp(30px,3.6vw,54px);color:transparent;-webkit-text-stroke:1px rgba(214,216,224,.55);padding-right:40px}
.mq span:nth-child(even){color:var(--tx);-webkit-text-stroke:0}.mq span i{-webkit-text-stroke:0;color:var(--pk);margin-left:40px;text-shadow:0 0 18px var(--pk)}
/* vinyl: grooves on every disc, the cover-story disc always spins and slides far out */
.dsc::after{content:"";position:absolute;inset:0;border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 2px,rgba(0,0,0,.24) 2px 3px);-webkit-mask:radial-gradient(circle,transparent 15%,#000 16%);mask:radial-gradient(circle,transparent 15%,#000 16%)}
.cs-art .dsc,#full .cw.big .dsc{transform:translateX(46%)}.cs-art .dsc::before{animation-play-state:running;animation-duration:5s;box-shadow:0 0 60px rgba(255,63,168,.45),inset 0 0 0 1px rgba(255,255,255,.25)}
/* 3D tilt with a specular glint that follows the pointer */
.cw.t3{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .25s var(--ease);will-change:transform}
.cd:not(.ar) .cw::after,.cs-art .cw::after,.dh .cw:not(.rd)::after{content:"";display:block;position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:var(--r1);opacity:0;transition:opacity .3s;background:radial-gradient(circle at var(--gx,50%) var(--gy,30%),rgba(255,255,255,.5),transparent 55%);mix-blend-mode:soft-light}
.cw.t3:hover::after{opacity:1}
/* gloss sweep on primary buttons, pulsing sparkle on the K */
.btn.p{position:relative;overflow:hidden}.btn.p::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.7) 50%,transparent 65%);transform:translateX(-120%);transition:transform .7s var(--ease)}.btn.p:hover::after{transform:translateX(120%)}
.hero img,.sig img,.brand img{animation:tw 3.2s ease-in-out infinite}
@keyframes tw{50%{filter:drop-shadow(0 0 36px rgba(255,63,168,.95)) brightness(1.18)}}
/* player: a light runs around the bar while music plays */
@property --a{syntax:'<angle>';initial-value:0deg;inherits:false}
#bar.on-air::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;background:conic-gradient(from var(--a),transparent 0 50%,var(--pk) 80%,#fff 92%,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:ro 3.5s linear infinite}
@keyframes ro{to{--a:360deg}}
#full.on-air::before{content:"";position:fixed;z-index:-1;left:50%;top:38%;width:80vmin;height:80vmin;margin:-40vmin 0 0 -40vmin;border-radius:50%;background:radial-gradient(closest-side,rgba(255,63,168,.4),transparent);animation:breathe 2.4s ease-in-out infinite;pointer-events:none}
/* full player: centre the sleeve+disc pair, keep volume inside the column, stronger glow */
#full .cw.big{transform:translateX(-19%)}
#full .vl{width:min(460px,100%)}
#full.on-air::before{background:radial-gradient(closest-side,rgba(255,63,168,.55),rgba(255,63,168,.12) 60%,transparent)}