:root{display:block;width:100%;box-sizing:border-box;--accent: #f51054;font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial}.player-wrap{position:relative;width:100%;min-height:220px;overflow:hidden;height:100vh}#debug-size{position:fixed;bottom:6px;left:6px;padding:4px 8px;background:#0000008c;color:#fff;font-size:11px;border-radius:6px;z-index:9999;pointer-events:none;font-family:monospace}.bg{position:fixed;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;filter:blur(30px) brightness(.6);opacity:0;transition:opacity .8s ease,background-image 1s ease;z-index:-1}.bg.animate{opacity:1}@keyframes kenburns{0%{transform:scale(1)}50%{transform:scale(1.06)}to{transform:scale(1)}}.bg:after{content:"";position:absolute;inset:0;background:linear-gradient(#08080866,#0808088c)}.card{position:relative;z-index:2;margin:18px auto;box-sizing:border-box;background:#1414146b;backdrop-filter:blur(6px) saturate(1.05);border-radius:16px;padding:18px;width:100%;max-width:1100px;color:#fff;box-shadow:0 18px 45px #0009}.header{display:flex;align-items:center;justify-content:space-between;gap:12px}.station{font-weight:700;font-size:18px;letter-spacing:.2px}.live{display:flex;align-items:center;gap:8px;font-size:13px;color:#ffd6e6}.dot{width:10px;height:10px;border-radius:50%;background:green;box-shadow:0 0 10px #ff005a73}.main{display:flex;gap:18px;align-items:center;margin-top:14px;flex-wrap:nowrap;justify-content:space-around}.artwork{width:250px;height:250px;flex:0 0 250px;border-radius:14px;overflow:hidden;position:relative;background:linear-gradient(180deg,#222,#171717);box-shadow:0 20px 40px #0009}.fg{position:absolute;inset:0;background-size:cover;background-position:center;transition:opacity .42s ease,transform .42s ease;opacity:0;transform:scale(.98)}.fg.show{opacity:1;transform:scale(1)}.placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#9aa0a6;font-size:44px}.meta{height:300px;min-width:220px;display:flex;padding:8px 12px;gap:12px;position:relative;z-index:2;align-content:center;flex-wrap:wrap;justify-content:center;align-items:stretch;flex-direction:column;border:none;border-radius:12px;background:#14141461;backdrop-filter:blur(8px) saturate(1.05);box-shadow:0 6px 18px #00000059;overflow:hidden;max-width:460px;margin:0 auto}.title{font-weight:700;font-size:18px;white-space:nowrap;overflow:hidden;min-height:24px;width:auto;text-align:center;max-width:450px;margin:0 auto}.marquee{display:inline-block;padding-left:100%;animation:marquee 12s linear infinite}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-100%)}}.controls-wrap{position:relative;display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center;width:450px;max-width:450px;margin:0 auto;align-content:center;flex-direction:column-reverse}.visualizer{position:absolute;inset:0;z-index:-1;border-radius:12px;pointer-events:none;width:100%}.play{padding-bottom:5px;width:70px;height:70px;border-radius:50%;border:none;background:var(--accent);color:#fff;font-size:24px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 14px 34px #0000008c;transition:transform .2s ease,box-shadow .2s ease;z-index:12}.play:hover{box-shadow:0 18px 40px #ff005a8c;transform:scale(1.05)}.play:active{transform:scale(.98)}.vol-icon{cursor:pointer;font-size:20px;z-index:2;display:flex;align-items:center}.vol{width:260px;accent-color:var(--accent);cursor:pointer;z-index:2}.status{font-size:13px;color:#d0d0d0;margin:6px;z-index:2}.footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;flex-wrap:wrap;z-index:3;position:relative}.meta-version{z-index:4;position:relative;font-weight:600}.socials{display:flex;gap:12px}.socials a{color:#d0d0d0;text-decoration:none;font-size:14px}.speaker-wrapper{width:250px;height:250px;flex:0 0 250px;border-radius:14px;overflow:hidden;position:relative;background:linear-gradient(180deg,#222,#171717);box-shadow:0 20px 40px #0009}.speaker{position:relative;aspect-ratio:1/1;top:50%;left:50%;transform:translate(-50%,-50%);background-size:contain}.speaker.center{position:absolute;width:31%;background-image:url(/speaker-3.webp);filter:blur(.2vmin);top:50%;left:50%;transform:translate(-50%,-50%)}.speaker.center.animating{animation-name:center;animation-duration:50ms;animation-iteration-count:infinite;animation-timing-function:linear}.speaker.border{position:absolute;width:90%;background-image:url(/speaker-1.webp);filter:blur(.1vmin)}.speaker.inside{position:relative;width:66%;top:50%;left:50%;transform:translate(-50%,-50%);background-image:url(/speaker-2.webp);background-size:contain;background-repeat:no-repeat;transition:transform .05s ease-out}.speaker.inside2{position:absolute;width:26%;top:50%;border-radius:50%;border-style:solid;border-width:40px;border-color:#830d5c44;left:50%;transform:translate(-50%,-50%);transition:transform .05s ease-out}@keyframes centerMove{0%{transform:translate(-50.5%,-49.5%) scale(1.05)}to{transform:translate(-49.5%,-50.5%) scale(1.052)}}@keyframes center{0%{transform:translate(-51%,-49%)}to{transform:translate(-49%,-51%)}}@keyframes border{0%{transform:translate(-50.2%,-49.8%)}to{transform:translate(-49.8%,-50.2%)}}@media(max-width:980px){.card{max-width:100%}.artwork{width:200px;height:200px;border-radius:12px;box-shadow:0 14px 28px #00000073}.speaker-wrapper{width:200px;height:200px;flex:0 0 200px}.main{flex-wrap:nowrap;align-items:center;gap:16px}.play{width:64px;height:64px;font-size:20px}.vol{width:200px}.title{max-width:200px}}@media(max-width:640px)and (orientation:landscape){.card{padding:10px;max-width:90%}.main{flex-direction:row;flex-wrap:nowrap;gap:8px}.artwork,.speaker-wrapper{width:150px;height:150px;flex:0 0 150px}.meta{max-width:200px;height:180px;padding:6px 10px}.title{font-size:15px;max-width:200px}.controls-wrap{width:200px;gap:6px;flex-direction:column-reverse}.play{width:52px;height:52px;font-size:18px}.vol{width:140px}.status{font-size:12px}}@media(max-width:640px)and (orientation:portrait){.card{padding:10px 12px;border-radius:10px;max-width:100%;margin:0 auto;box-shadow:0 10px 25px #00000073}.player-wrap{height:auto;min-height:100vh}.main{flex-direction:column;align-items:center;gap:8px}.controls-wrap{width:220px;max-width:100%;gap:6px}.title{max-width:220px;width:100%;font-size:16px;text-align:center;margin-bottom:4px}.artwork,.speaker-wrapper{width:220px;height:220px}.play{width:60px;height:60px;font-size:18px}.vol{width:140px}.status{font-size:12px}.footer{gap:6px;justify-content:center;margin-top:8px}.socials a{font-size:13px}}@media(max-height:500px)and (orientation:landscape){.main{flex-direction:row;justify-content:space-between;align-items:center;gap:10px;flex-wrap:nowrap}.artwork,.speaker-wrapper{width:200px;height:200px;flex:0 0 200px}.meta{max-width:220px;height:220px}.controls-wrap{width:250px}.vol{width:140px}.title{width:220px}.card{padding:10px;margin:8px auto;width:100%}}