
#sb-radio-root, #sb-radio-root * { box-sizing: border-box; }
#sb-radio-root {
  --sb-black:#020306; --sb-panel:rgba(8,10,14,.88); --sb-silver:#d8e0e4;
  --sb-silver-soft:rgba(216,224,228,.68); --sb-gold:#f2b84b; --sb-white:#f8fbff;
  --sb-line:rgba(216,224,228,.18); --sb-shadow:0 18px 60px rgba(0,0,0,.62);
  position:relative; display:grid; place-items:center; width:100%; min-height:min(78vh,740px);
  overflow:hidden; isolation:isolate; color:var(--sb-white); border-radius:22px;
  background:radial-gradient(circle at 50% 42%, rgba(242,184,75,.18), transparent 20rem),radial-gradient(circle at 50% 45%, rgba(216,224,228,.16), transparent 28rem),linear-gradient(180deg,#040506,#000 70%);
  padding:clamp(20px,4vw,48px) 12px; font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; touch-action:pan-y;
}
#sb-radio-root.sb-radio-mini{min-height:420px}.sb-radio-mini .sb-radio-headline,.sb-radio-mini .sb-radio-drawer-toggle,.sb-radio-mini .sb-radio-drawer{display:none!important}
#sb-radio-root:before{content:"";position:absolute;inset:-20%;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(circle,#000,transparent 70%);z-index:-1}
.sb-radio-stage{position:relative;width:min(100%,760px);display:grid;place-items:center;gap:16px;z-index:2}.sb-radio-headline{text-align:center;pointer-events:none}.sb-radio-title{font-size:clamp(18px,4vw,34px);letter-spacing:.18em;font-weight:800;color:var(--sb-silver);text-shadow:0 0 24px rgba(216,224,228,.35)}.sb-radio-powered{margin-top:5px;color:var(--sb-gold);letter-spacing:.28em;text-transform:uppercase;font-size:11px}.sb-radio-tagline{margin-top:8px;color:var(--sb-silver-soft);font-size:13px}
.sb-radio-onair{display:inline-flex;align-items:center;gap:9px;padding:8px 15px;border:1px solid rgba(216,224,228,.2);border-radius:999px;background:rgba(4,5,7,.78);box-shadow:0 10px 34px rgba(0,0,0,.35), inset 0 0 18px rgba(255,255,255,.03);letter-spacing:.22em;text-transform:uppercase;font-size:11px;font-weight:850;color:rgba(216,224,228,.62)}
.sb-radio-onair-dot{width:11px;height:11px;border-radius:999px;background:rgba(216,224,228,.25);box-shadow:0 0 0 0 rgba(216,224,228,0)}
#sb-radio-root.sb-radio-on-air .sb-radio-onair{border-color:rgba(242,184,75,.55);color:#fff3c8;text-shadow:0 0 12px rgba(242,184,75,.75);box-shadow:0 10px 34px rgba(0,0,0,.38),0 0 24px rgba(242,184,75,.18)}
#sb-radio-root.sb-radio-on-air .sb-radio-onair-dot{background:#ffce57;box-shadow:0 0 12px rgba(242,184,75,.95),0 0 26px rgba(242,184,75,.45);animation:sbOnAirPulse 1.25s ease-in-out infinite}
@keyframes sbOnAirPulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.28);opacity:1}}
.sb-radio-object-wrap{position:relative;display:grid;place-items:center;width:var(--sb-controller-size, min(78vw,430px));aspect-ratio:1;border:0;background:transparent;padding:0;cursor:grab;touch-action:none;user-select:none;transform:translate3d(var(--sb-x,0px),var(--sb-y,0px),0) scale(var(--sb-scale,1));transition:filter .18s ease,transform .18s cubic-bezier(.2,1,.2,1);will-change:transform}.sb-radio-object-wrap:active{cursor:grabbing}.sb-radio-object-wrap.sb-radio-forward{transform:translate3d(var(--sb-x,0px),calc(var(--sb-y,0px) - 8px),0) scale(calc(var(--sb-scale,1) * 1.075));filter:drop-shadow(0 0 28px var(--sb-gold)) drop-shadow(0 0 44px rgba(216,224,228,.35))}.sb-radio-object{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 24px 44px rgba(0,0,0,.82)) drop-shadow(0 0 18px rgba(216,224,228,.18))}.sb-radio-playing .sb-radio-object{animation:sbRadioPulse 1.85s ease-in-out infinite}@keyframes sbRadioPulse{0%,100%{transform:scale(1);filter:drop-shadow(0 24px 44px rgba(0,0,0,.82)) drop-shadow(0 0 20px rgba(242,184,75,.34))}50%{transform:scale(1.025);filter:drop-shadow(0 24px 44px rgba(0,0,0,.82)) drop-shadow(0 0 34px rgba(242,184,75,.68))}}
.sb-radio-ripple-layer{position:absolute;inset:16%;border-radius:999px;pointer-events:none}.sb-radio-ripple-layer:before,.sb-radio-ripple-layer:after{content:"";position:absolute;inset:20%;border-radius:999px;border:1px solid transparent;opacity:0}.sb-radio-object-wrap.sb-radio-ripple .sb-radio-ripple-layer:before{animation:sbRadioRipple 760ms ease-out}.sb-radio-object-wrap.sb-radio-ripple .sb-radio-ripple-layer:after{animation:sbRadioRipple 760ms ease-out 90ms}@keyframes sbRadioRipple{0%{opacity:.95;transform:scale(.48);border-color:rgba(242,184,75,.82);box-shadow:0 0 18px rgba(242,184,75,.38)}65%{opacity:.55;border-color:rgba(216,224,228,.55)}100%{opacity:0;transform:scale(2.55);border-color:transparent;box-shadow:0 0 0 transparent}}
.sb-radio-now{width:min(92vw,520px);text-align:center;padding:12px 16px;border:1px solid var(--sb-line);border-radius:18px;background:var(--sb-panel);box-shadow:var(--sb-shadow);backdrop-filter:blur(14px)}.sb-radio-track{display:block;font-size:15px;color:var(--sb-white);letter-spacing:.14em;text-transform:uppercase}.sb-radio-meta{display:block;margin-top:3px;font-size:12px;color:var(--sb-silver-soft)}.sb-radio-controls{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:9px}.sb-radio-btn,.sb-radio-close{appearance:none;border:1px solid rgba(216,224,228,.24);background:rgba(8,10,14,.78);color:var(--sb-silver);border-radius:999px;padding:10px 14px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;box-shadow:0 8px 30px rgba(0,0,0,.34)}.sb-radio-btn:hover,.sb-radio-close:hover{border-color:var(--sb-gold);color:var(--sb-gold)}.sb-radio-effect{border-color:rgba(242,184,75,.38);color:var(--sb-gold)}
.sb-radio-volume-wrap{display:flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid rgba(216,224,228,.2);border-radius:999px;background:rgba(8,10,14,.78);color:var(--sb-silver);font-size:11px;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 8px 30px rgba(0,0,0,.34)}.sb-radio-volume{width:min(34vw,150px);accent-color:var(--sb-gold)}
.sb-radio-drawer{position:absolute;z-index:5;right:clamp(8px,3vw,28px);top:clamp(8px,3vw,28px);bottom:clamp(8px,3vw,28px);width:min(430px,calc(100% - 16px));transform:translateX(calc(100% + 40px));transition:transform .32s cubic-bezier(.2,1,.2,1);background:rgba(3,4,6,.94);border:1px solid rgba(216,224,228,.18);border-radius:22px;box-shadow:var(--sb-shadow);backdrop-filter:blur(18px);padding:16px;overflow:hidden;display:flex;flex-direction:column}#sb-radio-root.sb-radio-drawer-open .sb-radio-drawer{transform:translateX(0)}.sb-radio-drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--sb-line)}.sb-radio-drawer-title{font-weight:800;letter-spacing:.16em;color:var(--sb-silver);text-transform:uppercase}.sb-radio-drawer-subtitle{margin-top:3px;font-size:12px;color:var(--sb-silver-soft)}.sb-radio-close{width:36px;height:36px;padding:0;font-size:24px;line-height:1}.sb-radio-list{overflow:auto;padding:12px 2px 2px}.sb-radio-row{width:100%;display:grid;grid-template-columns:30px 1fr auto;gap:8px;align-items:center;text-align:left;padding:10px 8px;margin-bottom:6px;border:1px solid transparent;border-radius:14px;background:rgba(255,255,255,.025);color:var(--sb-white);cursor:default}.sb-radio-row.sb-radio-active{border-color:rgba(242,184,75,.62);background:rgba(242,184,75,.1)}.sb-radio-num{color:var(--sb-gold);font-size:12px}.sb-radio-name{font-size:13px;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sb-radio-detail{margin-top:2px;color:var(--sb-silver-soft);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sb-radio-duration{color:var(--sb-gold);font-size:11px}.sb-radio-missing{display:inline-block;margin-top:4px;color:rgba(242,184,75,.75);font-size:10px}@media(max-width:720px){#sb-radio-root{min-height:650px;border-radius:0}.sb-radio-object-wrap{width:var(--sb-controller-size, min(88vw,420px))}.sb-radio-volume{width:116px}.sb-radio-drawer{top:auto;left:8px;right:8px;bottom:8px;height:min(78vh,560px);width:auto;transform:translateY(calc(100% + 24px))}#sb-radio-root.sb-radio-drawer-open .sb-radio-drawer{transform:translateY(0)}}
