/* Scoped radio studio, shared by lobby, room and rules. */
body #radioBtn{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));z-index:1000;display:grid;place-items:center;width:52px;height:52px;min-width:0;padding:0;border:1px solid #536845;border-radius:50%;background:#c1f379;color:#182719;box-shadow:0 5px 18px #0005;cursor:pointer;font:inherit}
body #radioBtn:hover{background:#d5ffa2}#radioBtn .radio-dock-icon{display:grid;place-items:center;font:27px/1 system-ui,sans-serif}#radioBtn .radio-playing-dot{position:absolute;right:0;top:0;width:11px;height:11px;border:2px solid #142137;border-radius:50%;background:#7fde93;display:none}#radioBtn[data-state="playing"] .radio-playing-dot{display:block}
body #radioPanel{--radio-bg:#131f32;--radio-soft:#1b2b43;--radio-line:#304059;--radio-text:#f2f6fb;--radio-dim:#a6b7cd;position:fixed;right:20px;bottom:92px;z-index:1001;width:390px;max-width:calc(100vw - 24px);height:620px;max-height:calc(100dvh - 112px);display:flex;flex-direction:column;overflow:hidden;background:var(--radio-bg);color:var(--radio-text);border:1px solid var(--radio-line);border-radius:24px;box-shadow:0 20px 80px #0007;text-align:left;transform:none;opacity:1;pointer-events:auto}
body #radioPanel[hidden],#radioPanel [hidden]{display:none!important}
html:not([data-theme="dark"]) body #radioPanel{--radio-bg:#fff;--radio-soft:#f0f4f6;--radio-line:#dce4ea;--radio-text:#1b2c3d;--radio-dim:#5b6d81}
#radioPanel *{box-sizing:border-box}#radioPanel button{cursor:pointer;min-width:44px;min-height:44px;padding:8px;border:0;background:transparent;border-radius:12px;color:inherit;font:inherit}#radioPanel button:hover{background:var(--radio-soft)}#radioPanel button:disabled{opacity:.45;cursor:default}#radioPanel button:focus-visible,#radioBtn:focus-visible{outline:3px solid #91c44e;outline-offset:-3px}
#radioPanel .radio-heading{display:flex;align-items:center;justify-content:space-between;padding:18px 18px 10px;flex-shrink:0}#radioPanel .radio-eyebrow{font:600 9px/1.4 var(--font-ui);letter-spacing:2px;color:var(--radio-dim)}#radioPanel h2{font-size:18px;margin:4px 0 0}#radioPanel .radio-now{display:flex;align-items:center;gap:12px;margin:6px 16px 0;padding:16px 12px;border:1px solid var(--radio-line);border-radius:18px;background:linear-gradient(115deg,var(--radio-soft),var(--radio-bg));flex-shrink:0}
#radioPanel .radio-art{display:flex;align-items:center;justify-content:center;gap:3px;flex-shrink:0;width:45px;height:50px;border-radius:13px;background:linear-gradient(140deg,#c7f581,#709656);transform:rotate(-7deg);box-shadow:0 4px 0 #44612e,0 8px 16px #0003}#radioPanel .radio-art span{width:4px;height:14px;border-radius:5px;background:#243b21}#radioPanel .radio-art span:nth-child(2n){height:25px}#radioPanel .radio-art span:nth-child(3){height:34px}#radioPanel[data-state="playing"] .radio-art span{animation:radioWave 900ms ease-in-out infinite alternate}#radioPanel .radio-art span:nth-child(2n){animation-delay:-400ms}#radioPanel .radio-track{flex:1;min-width:0}#radioTrack{display:block;font-size:14px;line-height:1.6;overflow-wrap:anywhere}#radioState{display:block;font-size:11px;line-height:1.5;color:var(--radio-dim);margin-top:3px}#radioPanel[data-state="error"] #radioState,#radioPanel[data-state="timeout"] #radioState{color:#e99e81}
#radioPanel #radioPlayBtn{flex-shrink:0;width:48px;height:48px;border-radius:50%;background:#c1f379;color:#1b3018;font-size:18px}
#radioPanel .radio-browse{padding:12px 16px 10px;flex-shrink:0}#radioPanel .radio-search-row{display:flex;gap:6px}#radioPanel input:not([type="range"]){width:100%;min-width:0;border:1px solid var(--radio-line);background:var(--radio-soft);color:var(--radio-text);border-radius:11px;padding:10px 12px;font-family:inherit;font-size:16px;line-height:1.4;min-height:44px}#radioPanel #radioSearch{flex:1;font-size:14px}#radioPanel .radio-tabs{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}#radioPanel .radio-tabs button{flex:1;font-size:12px;min-height:40px;border:1px solid transparent}#radioPanel .radio-tabs [aria-pressed="true"]{background:var(--radio-soft);border-color:var(--radio-line);font-weight:600}
#radioPanel #radioList{flex:1;min-height:80px;overflow:auto;overscroll-behavior:contain;padding:0 10px 10px;scrollbar-width:thin}#radioPanel .radio-station{display:flex;align-items:center;gap:2px;border-radius:13px;border:1px solid transparent;margin:3px 0;padding:0;opacity:1}#radioPanel .radio-station.is-current{background:var(--radio-soft);border-color:#6f9361}#radioPanel .radio-select{display:flex;align-items:center;gap:10px;flex:1;min-width:0;min-height:64px;text-align:left;padding:10px 8px}#radioPanel .radio-row-icon{display:grid;place-items:center;width:30px;height:30px;flex-shrink:0;color:#86b666;font-size:13px;border:1px solid var(--radio-line);border-radius:9px}#radioPanel .radio-select>span:last-child{min-width:0}#radioPanel .radio-select b{display:block;font-weight:500;font-size:13px;line-height:1.5;overflow-wrap:anywhere}#radioPanel .radio-select small{display:block;font-size:10px;color:var(--radio-dim);margin-top:3px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:220px}#radioPanel .radio-fav{font-size:22px;flex-shrink:0}#radioPanel .radio-fav[aria-pressed="true"]{color:#e5a6b3}#radioPanel .radio-delete{min-width:30px;font-size:20px}#radioPanel .radio-empty{padding:32px 18px;text-align:center;font-size:13px;color:var(--radio-dim)}#radioPanel #radioNotice{font-size:11px;line-height:1.6;padding:8px 16px;margin:0;color:var(--radio-dim);background:var(--radio-soft)}#radioPanel .radio-credit{display:flex;align-items:center;justify-content:space-between;padding:10px 18px;border-top:1px solid var(--radio-line);font-size:10px;color:var(--radio-dim);flex-shrink:0}#radioPanel .radio-credit a{color:inherit}
#radioPanel #radioAddForm{padding:12px 16px;overflow:auto;background:var(--radio-soft);flex-shrink:0;max-height:250px}#radioPanel #radioAddForm label{display:block;font-size:11px;margin-bottom:8px}#radioPanel #radioAddForm label span{display:block;margin-bottom:4px}#radioPanel #radioAddForm>div{display:flex;gap:8px}#radioPanel #radioSave{background:#c1f379;color:#203019}#radioPanel #radioFormError{font-size:12px;color:#d58165;margin:6px 0}
@keyframes radioWave{to{transform:scaleY(.45)}}
@media(max-width:600px){body #radioBtn{right:max(12px,env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom));width:48px;height:48px}body #radioPanel{right:12px;bottom:calc(72px + env(safe-area-inset-bottom));max-height:calc(100dvh - 84px - env(safe-area-inset-bottom));border-radius:20px}#radioPanel #radioSearch{font-size:16px}}
@media(prefers-reduced-motion:reduce){#radioPanel .radio-art span{animation:none!important}}

#radioPanel .radio-tabs button{min-width:48px;padding:6px 5px}