.rlp-d2280514{display:inline-flex;align-items:center;gap:12px;padding:10px 16px 10px 12px;background:#0047CC;border-radius:4px;line-height:1.1;max-width:100%}
.rlp-d2280514__btn{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:64px;height:64px;border-radius:50%;background:transparent;color:#0047CC;border:0;cursor:pointer;padding:0;transition:opacity .15s ease;--rlp-border-color:#ffffff;--rlp-border-width:3px;--rlp-spin-color:#ff3b3b;--rlp-spin-duration:1.8s;-webkit-tap-highlight-color:transparent}
.rlp-d2280514__btn:hover,
.rlp-d2280514__btn:focus,
.rlp-d2280514__btn:active{background:transparent;outline:none}
.rlp-d2280514__btn:focus-visible{outline:2px solid var(--rlp-border-color);outline-offset:3px}

/* Idle ring: solid color border made from a ring-shaped mask */
.rlp-d2280514__ring{
  position:absolute;inset:0;border-radius:50%;
  background:var(--rlp-border-color);
  z-index:1;pointer-events:none;
  -webkit-mask: radial-gradient(circle, transparent calc(50% - var(--rlp-border-width)), #000 calc(50% - var(--rlp-border-width) + 0.5px));
          mask: radial-gradient(circle, transparent calc(50% - var(--rlp-border-width)), #000 calc(50% - var(--rlp-border-width) + 0.5px));
}

/* Playing ring: spinner arc that rotates around the border */
.rlp-d2280514__btn.is-playing .rlp-d2280514__ring{
  background:conic-gradient(var(--rlp-spin-color) 0deg, var(--rlp-spin-color) 90deg, var(--rlp-border-color) 90deg, var(--rlp-border-color) 360deg);
  animation:rlp-spin-d2280514 var(--rlp-spin-duration) linear infinite;
}
@keyframes rlp-spin-d2280514{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Inner circle holds the icon, perfectly centered */
.rlp-d2280514__btn-inner{
  position:absolute;
  top:var(--rlp-border-width);left:var(--rlp-border-width);
  right:var(--rlp-border-width);bottom:var(--rlp-border-width);
  z-index:2;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;background:#fff;box-sizing:border-box;overflow:hidden;
}
.rlp-d2280514__btn svg{width:50%;height:50%;fill:currentColor;display:block;margin:0}
.rlp-d2280514__btn.is-loading{opacity:.75}

.rlp-d2280514__text{display:flex;flex-direction:column;min-width:0}
.rlp-d2280514__name{color:#fff;font-weight:700;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlp-d2280514__live{display:inline-flex;align-items:center;gap:6px;color:#fff;font-size:.75em;font-weight:600;letter-spacing:1px;margin-top:2px}
.rlp-d2280514__live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#ff3b3b;opacity:.85}
.rlp-d2280514:has(.rlp-d2280514__btn.is-playing) .rlp-d2280514__live-dot{animation:rlp-blink-d2280514 1s ease-in-out infinite}
@keyframes rlp-blink-d2280514{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.85)}}
.rlp-d2280514__audio{display:none}
@media (prefers-reduced-motion: reduce){
  .rlp-d2280514__btn.is-playing .rlp-d2280514__ring,
  .rlp-d2280514__live-dot{animation:none !important}
}