:root{--color-primary:var(--color-marca-rgb,255,107,0);--color-dark-bg:20,22,30;--color-white:255,255,255;--size-mobile:clamp(240px,58vw,280px);--size-desktop:330px;--border-mobile:3px;--border-desktop:clamp(3px,4vw,14px);--transition-fast:.3s ease;--transition-medium:.6s ease;--transition-slow:.9s cubic-bezier(0.23,1,0.32,1);--blur-glass:28px;--glow-radius:30px}.area-reproductor{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:visible;padding:10px;z-index:5;margin-bottom:10px;flex-shrink:0;perspective:1200px}.pulse-wrapper{position:relative;width:var(--size-mobile);height:var(--size-mobile);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:visible}.live-circle{position:relative;width:100%;aspect-ratio:1 / 1;--shadow-dynamic:var(--shadow-color,rgba(var(--color-primary),0.5));border-radius:50%;overflow:visible;background:#000;box-shadow:0 0 0 var(--border-mobile) rgba(var(--color-primary),0.8),0 0 var(--glow-radius) var(--shadow-dynamic);border:0;display:flex;align-items:center;justify-content:center;z-index:10}.live-circle.playing{animation:subtleSpin 26s linear infinite;box-shadow:0 0 0 var(--border-mobile) rgba(var(--color-primary),1),0 0 50px var(--shadow-dynamic)}.cover-image,#cover,.live-circle img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(1.01);width:100%;height:100%;border-radius:50%;object-fit:cover;z-index:1;margin:0;padding:0}.live-circle::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;z-index:20;background:radial-gradient(circle at top left,rgba(255,255,255,0.2),transparent 60%);box-shadow:none}#locutor-overlay{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.005);z-index:5;pointer-events:none;opacity:0;transition:opacity .8s ease}#locutor-overlay.visible{opacity:1}#play-pause-btn,.btn-control-principal{width:60px;height:60px;min-width:60px;border-radius:50%;background:rgb(var(--color-primary));border:0;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 15px rgba(var(--color-primary),0.4);transition:all .2s ease}#play-pause-btn:active,.btn-control-principal:active{transform:scale(0.95);box-shadow:0 2px 8px rgba(var(--color-primary),0.3)}#play-pause-btn i,.btn-control-principal i{font-size:1.4rem;color:var(--color-white)}.menu-btn,.btn-menu-header{background:transparent;border:0;color:var(--color-white);font-size:1.5rem;cursor:pointer;padding:8px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s}.menu-btn:hover{background:rgba(255,255,255,0.1)}@media(min-width:768px){.area-reproductor{padding:20px;margin-bottom:20px}.pulse-wrapper,.live-circle,#locutor-overlay{width:var(--size-desktop);height:var(--size-desktop)}.live-circle,.live-circle.playing{box-shadow:0 0 0 var(--border-desktop) rgba(var(--color-primary),0.8),0 0 var(--glow-radius) var(--shadow-dynamic)}.pulse-wrapper::before,.pulse-wrapper::after{border-width:9px;inset:-20px;box-shadow:0 0 25px rgba(var(--color-primary),0.45)}}@media(min-width:992px){.area-reproductor{padding:32px;margin-bottom:0}}@media(prefers-reduced-motion:reduce){.live-circle,.live-circle.playing,body.playing .live-circle,.pulse-wrapper::before,.pulse-wrapper::after,.pulse-wrapper.playing::before,.pulse-wrapper.playing::after{animation:none}.live-circle{transition:all var(--transition-fast)}}.live-circle.loading{opacity:.7;cursor:wait}.live-circle.error{border-color:rgba(239,68,68,0.5);box-shadow:inset 0 0 16px rgba(239,68,68,0.4),0 0 var(--glow-radius) rgba(239,68,68,0.3)}@media(prefers-color-scheme:dark){.live-circle{background:rgba(10,12,18,0.85)}}.control-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;z-index:30;cursor:pointer;background:rgba(0,0,0,0);transition:background .4s ease}.control-overlay i{font-size:4.5rem;color:white;opacity:0;transform:scale(0.5) rotate(-20deg);transition:all .5s cubic-bezier(0.175,0.885,0.32,1.275);filter:drop-shadow(0 0 20px rgba(0,0,0,0.4))}.live-circle:hover .control-overlay i{opacity:.95;transform:scale(1) rotate(0)}body:not(.playing) .control-overlay i{opacity:.4;transform:scale(0.9)}