#global-radio{position:fixed;z-index:120;--radio-edge:16px;--radio-safe-bottom:env(safe-area-inset-bottom,0px);right:max(16px,env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom) + var(--site-suggestion-height,0px));width:304px;max-width:calc(100vw - 32px);font:600 var(--site-text-ui)/1.4 var(--site-font-body);color:var(--site-text-primary);border:1px solid var(--site-border-strong);border-radius:var(--site-radius-panel);background:var(--site-surface-floating);box-shadow:var(--site-shadow-floating);backdrop-filter:blur(var(--site-blur))}
#global-radio[hidden],#global-radio [hidden]{display:none!important}#global-radio button{font:inherit;color:inherit;cursor:pointer;border:0;background:transparent}#global-radio button:focus-visible,#global-radio a:focus-visible,#global-radio input:focus-visible{outline:2px solid #ff63ad;outline-offset:3px}#global-radio button:hover{background:var(--site-hover)}.radio-dock{display:flex;align-items:center;gap:var(--site-space-2);min-height:64px;padding:var(--site-space-3);box-sizing:border-box}.radio-drag{display:flex;align-items:center;justify-content:center;width:20px;min-height:var(--site-hit-target);padding:0;flex:none;border-radius:var(--site-radius-control);color:#b8adbf!important;cursor:grab!important;touch-action:none;user-select:none;font-size:20px!important}#global-radio[data-dragging=true],#global-radio[data-dragging=true] .radio-drag{cursor:grabbing!important}#global-radio[data-dragging=true]{user-select:none}.radio-toggle{display:flex;align-items:center;gap:var(--site-space-2);flex:1;min-width:0;text-align:left;border-radius:var(--site-radius-control);padding:var(--site-space-2);min-height:var(--site-hit-target);box-sizing:border-box}.radio-symbol{touch-action:none;user-select:none;cursor:grab;color:#ff63ad;font-size:22px}.radio-toggle [data-radio-name]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.radio-toggle [data-radio-chevron]{margin-left:auto;color:var(--site-text-secondary)}.radio-play{width:var(--site-hit-target);height:var(--site-hit-target);flex-shrink:0;border-radius:var(--site-radius-circle);background:linear-gradient(135deg,#b65aff,#ff4e9b)!important;color:white!important}.radio-play span{font-size:16px}#radio-panel{padding:var(--site-space-4);border-top:1px solid var(--site-border);max-height:calc(100dvh - 152px - var(--site-suggestion-height,0px));overflow:auto;overscroll-behavior:contain}.radio-panel-heading{display:flex;align-items:center;justify-content:space-between;font-size:18px}.radio-panel-heading button{width:var(--site-hit-target);height:var(--site-hit-target);font-size:24px!important;border-radius:var(--site-radius-control)}.radio-preview{font-size:var(--site-text-meta);color:var(--site-text-secondary);margin:var(--site-space-1) 0 var(--site-space-4)}.radio-stations{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--site-space-2)}#global-radio .radio-station{display:flex;flex-direction:column;align-items:center;gap:var(--site-space-2);padding:var(--site-space-2);border:1px solid var(--site-border);border-radius:var(--site-radius-control);font-size:11px;line-height:1.3;min-width:0}.radio-station img{width:52px;height:52px;object-fit:contain}.radio-station span{overflow-wrap:anywhere}.radio-station[aria-pressed=true]{border-color:var(--site-border-strong)!important;background:var(--site-selected)!important}.radio-status{font-size:var(--site-text-meta);min-height:18px;color:var(--site-text-secondary);margin:var(--site-space-4) 0 var(--site-space-2)}.radio-volume{display:flex;align-items:center;gap:var(--site-space-2)}.radio-volume button{width:var(--site-hit-target);height:var(--site-hit-target);padding:0;white-space:nowrap;border-radius:var(--site-radius-control)}.radio-volume label{flex:1;display:flex}.radio-volume input{width:100%;accent-color:#ff63ad}.radio-source{display:inline-block;margin-top:var(--site-space-3);color:var(--site-text-secondary);font-size:var(--site-text-meta)}#global-radio[data-playing=true] .radio-symbol{touch-action:none;user-select:none;cursor:grab;color:#ff94ce}body:has(#global-radio:not([hidden])) .site-footer{padding-bottom:88px}@media(max-width:600px){#global-radio{width:288px;--radio-edge:12px;right:max(12px,env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom) + var(--site-suggestion-height,0px))}.radio-station img{width:44px;height:44px}#radio-panel{max-height:calc(100dvh - 180px - var(--site-suggestion-height,0px))}}
@media(max-width:800px){body:has(.check-jump) #global-radio{bottom:calc(72px + env(safe-area-inset-bottom) + var(--site-suggestion-height,0px))}body:has(.check-jump) #radio-panel{max-height:calc(100dvh - 240px - var(--site-suggestion-height,0px))}}
.music-card button[data-radio-station]{display:inline-flex;align-items:center;justify-content:center;gap:var(--site-space-2);min-height:var(--site-hit-target);padding:var(--site-space-2) var(--site-space-4);border:1px solid var(--site-border-strong);border-radius:var(--site-radius-pill);background:var(--site-hover);color:inherit;font:700 var(--site-text-ui)/1.3 var(--site-font-body);cursor:pointer}.music-card button[data-radio-station]:hover,.music-card button[data-radio-station][aria-pressed=true]{background:var(--site-selected)}.music-card button[data-radio-station]:focus-visible{outline:2px solid #ff63ad;outline-offset:3px}.music-card button[data-radio-station]::before{content:'▶';font-size:var(--site-text-meta)}.music-card button[data-radio-station][aria-pressed=true]::before{content:'♫'}
/* Keep the short-screen home controls visible; the compact music button expands. */
@media(max-width:600px) and (max-height:600px){
#global-radio:has([data-radio-expand][aria-expanded=false]){width:52px}
#global-radio:has([data-radio-expand][aria-expanded=false]) .radio-dock{padding:3px;min-height:46px;gap:0}
#global-radio:has([data-radio-expand][aria-expanded=false]) .radio-toggle{padding:0;width:44px;height:44px;justify-content:center;flex:none}
#global-radio:has([data-radio-expand][aria-expanded=false]) [data-radio-name],#global-radio:has([data-radio-expand][aria-expanded=false]) [data-radio-drag],#global-radio:has([data-radio-expand][aria-expanded=false]) [data-radio-chevron],#global-radio:has([data-radio-expand][aria-expanded=false]) [data-radio-play]{display:none}

}
/* Leaflet controls use layers up to 1000 inside the map workspace. */
body[data-page=map] #global-radio{z-index:1200}

.radio-station[data-radio-station="afrobank"] img{box-sizing:border-box;background:#f6df9e;padding:3px;border-radius:var(--site-radius-control)}

/* Hover feedback has eight pixels of breathing room around the text group. */
#global-radio .radio-toggle:hover{background:var(--site-hover)}
#global-radio .radio-toggle:hover [data-radio-chevron]{color:var(--site-text-primary)}
