.socials a svg{width:21px;height:21px;fill:currentColor}
.player .volume-button{width:30px;height:30px;color:rgba(255,255,255,.48);background:transparent}
.player .volume-button:hover{color:#fff}
.music-frame{overflow:hidden}
.scene{--mx:50%;--my:50%;--px:0px;--py:0px;background:radial-gradient(circle 420px at var(--mx) var(--my),rgba(124,0,14,.48),transparent 72%),radial-gradient(circle at 50% 42%,#351014 0,#110708 36%,#030303 72%)}
.grid-lines{transform:translate(calc(var(--px)*-.16),calc(var(--py)*-.16));transition:transform .12s linear}
.light-one{transform:translate(calc(var(--px)*.42),calc(var(--py)*.42))}.light-two{transform:translate(calc(var(--px)*-.28),calc(var(--py)*-.28))}.light{transition:transform .14s linear}
.avatar-rain{position:fixed;z-index:4;width:26px;height:26px;object-fit:cover;border:1px solid rgba(255,80,92,.75);border-radius:50%;pointer-events:none;box-shadow:0 0 15px rgba(225,25,45,.7);animation:avatarFall var(--fall-time) cubic-bezier(.22,.5,.45,1) forwards}
@keyframes avatarFall{0%{opacity:.95;transform:translate(-50%,-50%) scale(.65) rotate(0deg)}20%{opacity:1;transform:translate(calc(-50% + var(--drift)*.25),12px) scale(1) rotate(calc(var(--spin)*.2))}100%{opacity:0;transform:translate(calc(-50% + var(--drift)),180px) scale(.55) rotate(var(--spin))}}
@media(pointer:coarse){.avatar-rain{display:none}}
.scene{perspective:1100px}
.profile-card{--card-rx:0deg;--card-ry:0deg;--shine-x:50%;--shine-y:30%;--shadow-x:0px;--shadow-y:32px;transform-style:preserve-3d;will-change:transform;transition:transform .16s cubic-bezier(.2,.7,.2,1),box-shadow .2s ease}
.profile-card.profile-visible{transform:perspective(950px) rotateX(var(--card-rx)) rotateY(var(--card-ry)) translateZ(0)!important;box-shadow:var(--shadow-x) var(--shadow-y) 95px rgba(0,0,0,.78),0 0 60px rgba(200,15,32,.16),inset 0 1px 0 rgba(255,255,255,.13)}
.profile-card:before{content:"";position:absolute;z-index:-1;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle 210px at var(--shine-x) var(--shine-y),rgba(255,115,125,.16),transparent 68%),linear-gradient(125deg,rgba(255,255,255,.07),transparent 28%,transparent 72%,rgba(255,40,58,.08));mix-blend-mode:screen}
.profile-card:after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;padding:1px;background:linear-gradient(120deg,rgba(255,126,136,.65),rgba(255,255,255,.05) 28%,rgba(255,255,255,.03) 68%,rgba(220,20,38,.62));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.72}
.profile-card>*{transform:translateZ(18px)}.profile-card .avatar-wrap{transform:translateZ(42px)}.profile-card .player{transform:translateZ(25px)}
.avatar{animation:avatarPulse 4.5s ease-in-out infinite}.status i{animation:statusPulse 1.7s ease-in-out infinite}
@keyframes avatarPulse{50%{box-shadow:0 0 0 7px rgba(205,30,45,.08),0 16px 50px rgba(235,25,43,.52)}}@keyframes statusPulse{50%{box-shadow:0 0 18px #ff3347;transform:scale(1.25)}}
@media(pointer:coarse){.profile-card.profile-visible{transform:none!important}.profile-card>*{transform:none}.avatar{animation:none}}
