.rsp-player{box-sizing:border-box;display:flex;align-items:center;gap:20px;background:#14251f;color:#fff;font-family:system-ui,-apple-system,sans-serif;padding:24px;border:1px solid #ffffff20;line-height:1.45;text-align:left}
.rsp-player *{box-sizing:border-box}.rsp-card{border-radius:18px;max-width:100%;flex-wrap:wrap}.rsp-brand{width:60px;height:60px;display:grid;place-items:center;flex:0 0 auto;background:var(--rsp-accent);color:#14251f;font-size:30px;border-radius:14px}.rsp-info{display:flex;flex-direction:column;flex:1 1 180px;min-width:0;gap:2px}.rsp-eyebrow{font-size:10px;letter-spacing:2px;color:#d9e7df}.rsp-name{font-size:20px;color:#fff}.rsp-track{font-size:14px;overflow-wrap:anywhere}.rsp-status{font-size:12px;color:#c1d2c9}.rsp-player .rsp-toggle{border:0;border-radius:100px;padding:13px 22px;background:var(--rsp-accent);color:#101b16;font:700 14px system-ui;cursor:pointer;min-height:46px;flex-shrink:0}.rsp-player .rsp-toggle:hover{background:#fff;color:#14251f}.rsp-player .rsp-toggle:disabled{opacity:.5;cursor:wait}.rsp-player :focus-visible{outline:3px solid #fff;outline-offset:4px}.rsp-volume{font-size:12px;display:flex;flex-direction:column;gap:6px;width:100px;color:#d9e7df}.rsp-volume input{width:100%;min-height:24px;margin:0;accent-color:var(--rsp-accent)}.rsp-player a.rsp-popout{color:#fff;font-size:12px;text-decoration:underline;text-underline-offset:4px}.rsp-sticky{position:fixed;z-index:9990;left:0;right:0;bottom:0;padding:14px max(20px,calc((100vw - 1200px)/2));padding-bottom:calc(14px + env(safe-area-inset-bottom));gap:18px}.rsp-sticky .rsp-brand{width:44px;height:44px;font-size:24px}.rsp-sticky .rsp-name{font-size:16px}.rsp-has-sticky{padding-bottom:var(--rsp-footer-space,150px)!important}.rsp-player[data-state=error] .rsp-status{color:#ffd6ba}.rsp-listen-page{margin:0;background:#edf3ed;color:#14251f;font-family:system-ui,sans-serif;min-height:100vh;display:grid;place-items:center;padding:24px}.rsp-listen-page main{width:min(780px,100%)}.rsp-listen-page h1{font-size:36px;letter-spacing:-1px}.rsp-listen-page main>p{font-size:14px;line-height:1.6}
@media(max-width:600px){.rsp-player{gap:12px;padding:18px}.rsp-brand{width:44px;height:44px;font-size:24px}.rsp-name{font-size:18px}.rsp-card .rsp-info{flex-basis:calc(100% - 60px)}.rsp-sticky{flex-wrap:wrap;padding:10px 14px calc(10px + env(safe-area-inset-bottom))}.rsp-sticky .rsp-brand,.rsp-sticky .rsp-volume{display:none}.rsp-sticky .rsp-info{flex:1 1 55%;max-width:calc(100% - 110px)}.rsp-sticky .rsp-track{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rsp-sticky .rsp-popout{margin-left:auto}.rsp-sticky .rsp-toggle{padding:10px 15px}.rsp-sticky .rsp-eyebrow{display:none}}

/* Pulse concept inspired by Rojo Salas: https://codepen.io/rojo_salas/pen/BaKKaav
   Radio control and two-part play/pause morph implemented for Radio Station Player. */
.rsp-button-wrap{display:inline-flex;position:relative;align-items:center;justify-content:center;padding:24px;vertical-align:middle;line-height:1;isolation:isolate}
.rsp-button-wrap .rsp-pulse-button{appearance:none;box-sizing:border-box;position:relative;display:grid;place-items:center;width:80px;height:80px;min-width:80px;padding:0;margin:0;border:0;border-radius:50%;background:var(--rsp-button-color,#ff4c60);color:#fff;cursor:pointer;overflow:visible;box-shadow:none;transition:background-color .2s;touch-action:manipulation}
.rsp-button-wrap .rsp-pulse-button::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--rsp-button-pulse,var(--rsp-button-color,#ff4c60));transition:background-color .2s;animation:rsp-pulse-ring 1.5s ease-out infinite;pointer-events:none}
.rsp-button-wrap .rsp-pulse-button:hover{background:var(--rsp-button-hover,#f1ad34)}
.rsp-button-wrap .rsp-pulse-button:hover::before{background:var(--rsp-button-pulse-hover,var(--rsp-button-pulse,var(--rsp-button-color,#ff4c60)))}
.rsp-button-wrap .rsp-pulse-button[aria-pressed=true]{background:var(--rsp-button-active,var(--rsp-button-color,#ff4c60))}
.rsp-button-wrap .rsp-pulse-button[aria-pressed=true]::before{background:var(--rsp-button-active-pulse,var(--rsp-button-active,var(--rsp-button-color,#ff4c60)))}
.rsp-button-wrap .rsp-pulse-button[aria-pressed=true]:hover{background:var(--rsp-button-active-hover,var(--rsp-button-hover,#f1ad34))}
.rsp-button-wrap .rsp-pulse-button[aria-pressed=true]:hover::before{background:var(--rsp-button-active-pulse-hover,var(--rsp-button-active-pulse,var(--rsp-button-active,var(--rsp-button-color,#ff4c60))))}

.rsp-button-wrap .rsp-pulse-button:focus-visible{outline:3px solid currentColor;outline-offset:6px;box-shadow:0 0 0 9px #222}
.rsp-button-wrap .rsp-pulse-button:disabled{opacity:.5;cursor:wait}
.rsp-pulse-button .rsp-morph-icon{position:relative;width:32px;height:44px;display:block;transform:translateX(3px);transition:transform .3s ease;pointer-events:none}
.rsp-morph-icon>span{position:absolute;inset:0;display:block;background:#fff;transition:clip-path .3s cubic-bezier(.4,0,.2,1)}
.rsp-morph-icon>span:first-child{clip-path:polygon(0 0,50% 25%,50% 75%,0 100%)}
.rsp-morph-icon>span:last-child{clip-path:polygon(50% 25%,100% 50%,100% 50%,50% 75%)}
.rsp-pulse-button[aria-pressed=true] .rsp-morph-icon{transform:translateX(0)}
.rsp-pulse-button[aria-pressed=true] .rsp-morph-icon>span:first-child{clip-path:polygon(0 0,34% 0,34% 100%,0 100%)}
.rsp-pulse-button[aria-pressed=true] .rsp-morph-icon>span:last-child{clip-path:polygon(66% 0,100% 0,100% 100%,66% 100%)}
.rsp-pulse-button[data-state=loading] .rsp-morph-icon{opacity:.65}
.rsp-button-status{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.rsp-button-status.rsp-button-error{top:100%;left:50%;transform:translateX(-50%);width:220px;max-width:80vw;height:auto;margin:4px 0 0;overflow:visible;clip:auto;white-space:normal;font:13px/1.5 system-ui,sans-serif;text-align:center;color:inherit}
@keyframes rsp-pulse-ring{from{transform:scale(1);opacity:.8}to{transform:scale(1.5);opacity:0}}
@media(prefers-reduced-motion:reduce){.rsp-button-wrap .rsp-pulse-button::before{animation:none;opacity:0}.rsp-pulse-button .rsp-morph-icon,.rsp-morph-icon>span{transition:none}}