/* Radio Player v3.6 — Cross-browser compatible (Chrome, Firefox, Safari, Edge) */

/* Player container */
.rp-player{position:fixed;bottom:0;left:0;right:0;z-index:1000;color:var(--rp-text);font-family:var(--rp-font,'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif);border-top:var(--rp-border-top);box-shadow:var(--rp-shadow);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;overflow:visible;letter-spacing:0.01em;pointer-events:none}
.rp-has-subframe .rp-player{z-index:2147483646}
.rp-has-subframe{padding:0!important;margin:0!important;height:100vh!important;overflow:hidden!important}
body.rp-has-subframe>*:not(#rp_subframe):not(#rp-player){display:none!important}

/* Background layer — real div, not ::before (Edge fix) */
.rp-player-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--rp-bg, var(--rp-surface));opacity:var(--rp-opacity,1);pointer-events:auto;z-index:0}
.rp-theme-light .rp-player-bg,.rp-player.rp-theme-light .rp-player-bg{background:var(--rp-bg, var(--rp-surface-light))}
.rp-theme-light .rp-player,.rp-player.rp-theme-light{color:var(--rp-text-light)}

/* Progress bar at top */
.rp-progress-wrap{width:100%;padding:0;position:relative;z-index:2;pointer-events:auto}
.rp-progress-bg{width:100%;height:3px;background:rgba(255,255,255,0.08);position:relative;cursor:pointer;-webkit-transition:height 0.15s;transition:height 0.15s}
.rp-progress-wrap:hover .rp-progress-bg{height:5px}
.rp-theme-light .rp-progress-bg{background:rgba(0,0,0,0.08)}
.rp-progress-bar{height:100%;background:var(--rp-progress,var(--rp-accent));width:0%;-webkit-transition:width 0.3s linear;transition:width 0.3s linear;border-radius:0 2px 2px 0;position:relative}
.rp-progress-bar::after{content:'';position:absolute;right:-4px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:8px;height:8px;background:var(--rp-progress,var(--rp-accent));border-radius:50%;opacity:0;-webkit-transition:opacity 0.15s;transition:opacity 0.15s}
.rp-progress-wrap:hover .rp-progress-bar::after{opacity:1}
.rp-progress-times{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:0 12px;font-size:10px;color:var(--rp-station-color);line-height:14px;min-height:0;overflow:hidden;max-height:0;-webkit-transition:max-height 0.2s;transition:max-height 0.2s}
.rp-progress-wrap:hover .rp-progress-times{max-height:16px}
.rp-progress-wrap[data-hidden="true"]{display:none}

/* Main bar */
.rp-main{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:var(--rp-bar-height);padding:0 12px;gap:10px;position:relative;z-index:2;overflow:visible;box-sizing:border-box;pointer-events:auto;max-width:var(--rp-max-width,100%);margin-left:auto;margin-right:auto;width:100%}

/* Artwork */
.rp-artwork-wrap{-webkit-box-flex:0;-ms-flex:0 0 var(--rp-art-size);flex:0 0 var(--rp-art-size);width:var(--rp-art-size);height:var(--rp-art-size);position:relative;overflow:hidden;border-radius:var(--rp-art-radius);background:#1a1a2e;margin-top:var(--rp-art-offset,0px);z-index:10;display:block;line-height:0;pointer-events:auto}
.rp-el-cover{overflow:visible;-ms-flex-item-align:end;-webkit-align-self:flex-end;align-self:flex-end;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-flex:0;-ms-flex-negative:0;flex-shrink:0;margin-bottom:0;padding-bottom:0;line-height:0;margin-left:4px}
.rp-artwork{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;display:block;vertical-align:bottom}
.rp-no-art{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:28px;background:-webkit-linear-gradient(315deg,#2d2d44,#1a1a2e);background:linear-gradient(135deg,#2d2d44,#1a1a2e)}
.rp-artwork-wrap[data-hidden="true"]{display:none}

/* Song info */
.rp-info{-webkit-box-flex:1;-ms-flex:1;flex:1;min-width:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:1px}
.rp-title-row{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-width:0;overflow:hidden}
.rp-title{font-size:var(--rp-title-size);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-title.rp-marquee{-webkit-animation:rp-scroll 12s linear infinite;animation:rp-scroll 12s linear infinite}
@-webkit-keyframes rp-scroll{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{-webkit-transform:translateX(-50%);transform:translateX(-50%)}}
@keyframes rp-scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.rp-author-row{min-width:0;overflow:hidden}
.rp-author{font-size:var(--rp-author-size);color:var(--rp-author-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-station-row{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:6px;min-width:0;overflow:hidden}
.rp-station{font-size:var(--rp-station-size,11px);color:var(--rp-station-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-live-dot{width:6px;height:6px;background:var(--rp-live-dot-color,#ff4444);border-radius:50%;-webkit-animation:rp-pulse 1.5s infinite;animation:rp-pulse 1.5s infinite}
.rp-live-dot[data-hidden="true"]{display:none}
@-webkit-keyframes rp-pulse{0%,100%{opacity:1}50%{opacity:0.3}}
@keyframes rp-pulse{0%,100%{opacity:1}50%{opacity:0.3}}

/* EQ bars */
.rp-eq-bars{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;gap:2px;height:14px}
.rp-eq-bars span{width:3px;background:var(--rp-eq-color,var(--rp-accent));border-radius:1px;-webkit-animation:rp-eq 0.8s ease-in-out infinite;animation:rp-eq 0.8s ease-in-out infinite}
.rp-eq-bars span:nth-child(1){height:40%;-webkit-animation-delay:0s;animation-delay:0s}
.rp-eq-bars span:nth-child(2){height:70%;-webkit-animation-delay:0.15s;animation-delay:0.15s}
.rp-eq-bars span:nth-child(3){height:50%;-webkit-animation-delay:0.3s;animation-delay:0.3s}
.rp-eq-bars span:nth-child(4){height:80%;-webkit-animation-delay:0.45s;animation-delay:0.45s}
.rp-eq-bars[data-playing="false"] span{-webkit-animation:none;animation:none;height:3px}
.rp-eq-bars[data-hidden="true"]{display:none}
@-webkit-keyframes rp-eq{0%,100%{height:20%}50%{height:100%}}
@keyframes rp-eq{0%,100%{height:20%}50%{height:100%}}

/* Play button */
.rp-controls{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}
.rp-play-btn{width:var(--rp-play-size);height:var(--rp-play-size);border-radius:var(--rp-play-radius);background:var(--rp-accent);color:#fff;border:none;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-transition:transform 0.15s,box-shadow 0.15s;transition:transform 0.15s,box-shadow 0.15s;opacity:var(--rp-play-opacity,1)}
.rp-play-btn:hover{-webkit-transform:scale(1.08);transform:scale(1.08);box-shadow:0 0 20px var(--rp-accent-glow)}
.rp-spin{-webkit-animation:rp-spin-anim 1s linear infinite;animation:rp-spin-anim 1s linear infinite}
@-webkit-keyframes rp-spin-anim{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}
@keyframes rp-spin-anim{to{transform:rotate(360deg)}}

/* Volume */
.rp-volume-wrap{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:6px}
.rp-volume-wrap[data-hidden="true"]{display:none}
.rp-vol-btn{background:none;border:none;color:var(--rp-vol-color,var(--rp-text));cursor:pointer;padding:4px;opacity:0.7}
.rp-vol-btn:hover{opacity:1}
.rp-vol-slider{width:80px;height:14px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border-radius:2px;outline:none;cursor:pointer;position:relative;z-index:2}
.rp-vol-slider::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--rp-vol-color,var(--rp-accent)) var(--rp-vol-pct,50%),rgba(255,255,255,0.15) var(--rp-vol-pct,50%));border-radius:2px;height:4px;border:none}
.rp-vol-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--rp-vol-color,var(--rp-accent));cursor:pointer;margin-top:-5px;border:none;box-shadow:none}
.rp-vol-slider::-moz-range-track{background:linear-gradient(to right,var(--rp-vol-color,var(--rp-accent)) var(--rp-vol-pct,50%),rgba(255,255,255,0.15) var(--rp-vol-pct,50%));border-radius:2px;height:4px;border:none}
.rp-vol-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--rp-vol-color,var(--rp-accent));cursor:pointer;border:none;box-shadow:none}
.rp-theme-light .rp-vol-slider::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--rp-vol-color,var(--rp-accent)) var(--rp-vol-pct,50%),rgba(0,0,0,0.12) var(--rp-vol-pct,50%))}
.rp-theme-light .rp-vol-slider::-moz-range-track{background:linear-gradient(to right,var(--rp-vol-color,var(--rp-accent)) var(--rp-vol-pct,50%),rgba(0,0,0,0.12) var(--rp-vol-pct,50%))}

/* Duration display */
.rp-duration-display{font-size:var(--rp-time-size,12px);color:var(--rp-time-color,var(--rp-station-color));white-space:nowrap;min-width:40px;text-align:center}
.rp-duration-display[data-hidden="true"]{display:none}

/* Right buttons */
.rp-right-btns{display:-webkit-box;display:-ms-flexbox;display:flex;gap:4px}
.rp-btn{background:none;border:none;color:var(--rp-btn-color,var(--rp-text));cursor:pointer;padding:6px;border-radius:6px;opacity:0.6;-webkit-transition:opacity 0.15s,background 0.15s;transition:opacity 0.15s,background 0.15s}
.rp-btn svg{width:var(--rp-btn-icon-size,20px);height:var(--rp-btn-icon-size,20px)}
.rp-btn:hover{opacity:1;background:rgba(255,255,255,0.08)}
.rp-btn[data-hidden="true"]{display:none}
.rp-theme-light .rp-btn:hover{background:rgba(0,0,0,0.06)}

/* Popups — background via real div, not ::before (Edge fix) */
.rp-popup{position:absolute;bottom:100%;right:8px;width:var(--rp-popup-width,320px);max-height:var(--rp-popup-height,500px);border:1px solid rgba(255,255,255,0.1);border-radius:12px 12px 0 0;box-shadow:0 -8px 30px rgba(0,0,0,0.4);overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;z-index:3;pointer-events:auto}
.rp-popup-history{width:var(--rp-hist-width,320px);max-height:var(--rp-hist-height,500px)}
.rp-popup-bg{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0}
.rp-popup-streams .rp-popup-bg{background:var(--rp-popup-bg,var(--rp-surface));opacity:var(--rp-popup-opacity,1)}
.rp-popup-history .rp-popup-bg{background:var(--rp-popup-bg,var(--rp-surface));opacity:var(--rp-hist-opacity,1)}
.rp-popup-onair .rp-popup-bg{background:var(--rp-onair-bg,var(--rp-surface));opacity:var(--rp-onair-opacity,1)}
.rp-theme-light .rp-popup{border-color:rgba(0,0,0,0.1);box-shadow:0 -8px 30px rgba(0,0,0,0.12)}
.rp-theme-light .rp-popup-bg{background:var(--rp-popup-bg,var(--rp-surface-light))}
.rp-popup-header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,0.08);font-weight:600;font-size:14px;color:var(--rp-popup-text,inherit);position:relative;z-index:1}
.rp-popup-close{background:none;border:none;color:var(--rp-popup-text,var(--rp-text));font-size:22px;cursor:pointer;padding:0 4px;opacity:0.6}
.rp-popup-close:hover{opacity:1}
.rp-popup-body{overflow-y:auto;padding:8px;-webkit-box-flex:1;-ms-flex:1;flex:1;position:relative;z-index:1}

/* Stream item (grid modes) */
.rp-stream-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;cursor:pointer;-webkit-transition:background 0.15s;transition:background 0.15s;color:var(--rp-popup-text,inherit)}
.rp-stream-item:nth-child(even){background:var(--rp-popup-alt-bg,rgba(255,255,255,0.04))}
.rp-stream-item:hover{background:rgba(255,255,255,0.08)}
.rp-stream-item.active{background:var(--rp-popup-active-bg,var(--rp-accent))!important;color:var(--rp-popup-active-text,#fff)}

/* Design 1: Horizontal cards — with subtle background */
.rp-sc{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:12px;padding:10px;border-radius:12px;cursor:pointer;-webkit-transition:all 0.2s;transition:all 0.2s;margin-bottom:6px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.06)}
.rp-sc:hover{background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.12);-webkit-transform:translateX(4px);transform:translateX(4px)}
.rp-sc.active{background:var(--rp-popup-active-bg,var(--rp-accent));color:var(--rp-popup-active-text,#fff);border-color:transparent}
.rp-sc-img{width:80px;height:80px;border-radius:10px;-o-object-fit:cover;object-fit:cover;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}
.rp-sc-noimg{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:rgba(255,255,255,0.06);font-size:24px}
.rp-sc-info{-webkit-box-flex:1;-ms-flex:1;flex:1;min-width:0}
.rp-sc-eq{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;gap:2px;height:18px;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}
.rp-sc-eq span{width:3px;background:var(--rp-popup-active-text,#fff);border-radius:1px;-webkit-animation:rp-eq 0.8s ease-in-out infinite;animation:rp-eq 0.8s ease-in-out infinite}
.rp-sc-eq span:nth-child(1){height:40%;-webkit-animation-delay:0s;animation-delay:0s}
.rp-sc-eq span:nth-child(2){height:70%;-webkit-animation-delay:0.15s;animation-delay:0.15s}
.rp-sc-eq span:nth-child(3){height:50%;-webkit-animation-delay:0.3s;animation-delay:0.3s}

/* Design 2: Strips — taller, richer overlay */
.rp-ss{position:relative;height:100px;border-radius:12px;overflow:hidden;margin-bottom:8px;cursor:pointer;-webkit-transition:transform 0.2s,box-shadow 0.2s;transition:transform 0.2s,box-shadow 0.2s}
.rp-ss:hover{-webkit-transform:scale(1.02);transform:scale(1.02);box-shadow:0 4px 16px rgba(0,0,0,0.3)}
.rp-ss.active{outline:2px solid var(--rp-accent,#6c5ce7);outline-offset:1px}
.rp-ss-bg{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-webkit-filter:brightness(0.45) saturate(1.2);filter:brightness(0.45) saturate(1.2);-webkit-transition:filter 0.3s;transition:filter 0.3s}
.rp-ss:hover .rp-ss-bg{-webkit-filter:brightness(0.55) saturate(1.3);filter:brightness(0.55) saturate(1.3)}
.rp-ss-nobg{background:linear-gradient(135deg,#2d2d44,#1a1a2e)}
.rp-ss-over{position:absolute;bottom:0;left:0;right:0;top:0;padding:0 16px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:12px;background:linear-gradient(90deg,rgba(0,0,0,0.5) 0%,transparent 70%)}
.rp-ss-logo{width:44px;height:44px;border-radius:50%;-o-object-fit:cover;object-fit:cover;border:2px solid rgba(255,255,255,0.3);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;box-shadow:0 2px 8px rgba(0,0,0,0.3)}
.rp-ss-live{position:absolute;top:10px;right:12px;background:#ff4444;color:#fff;font-size:10px;font-weight:700;padding:3px 10px;border-radius:20px;z-index:1;-webkit-animation:rp-pulse 1.5s infinite;animation:rp-pulse 1.5s infinite;box-shadow:0 2px 8px rgba(255,68,68,0.4)}

/* Design 3: Tiles — refined glass */
.rp-st{position:relative;border-radius:12px;overflow:hidden;cursor:pointer;-webkit-transition:transform 0.2s,box-shadow 0.2s;transition:transform 0.2s,box-shadow 0.2s}
.rp-st:hover{-webkit-transform:scale(1.03);transform:scale(1.03);box-shadow:0 6px 20px rgba(0,0,0,0.3)}
.rp-st.active{outline:2px solid var(--rp-accent,#6c5ce7);outline-offset:1px}
.rp-st-bg{width:100%;display:block;-webkit-transition:transform 0.3s;transition:transform 0.3s}
.rp-st:hover .rp-st-bg{-webkit-transform:scale(1.05);transform:scale(1.05)}
.rp-st-nobg{background:linear-gradient(135deg,#2d2d44,#1a1a2e)}
.rp-st-glass{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,0.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:10px 12px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:10px;border-top:1px solid rgba(255,255,255,0.1)}
.rp-st-logo{width:48px;height:48px;border-radius:6px;-o-object-fit:cover;object-fit:cover;border:1px solid rgba(255,255,255,0.25);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}
.rp-st-info{-webkit-box-flex:1;-ms-flex:1;flex:1;min-width:0;overflow:hidden}

/* Design 4: Minimal list — bigger logo */
.rp-sm{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:12px;padding:10px 12px;border-left:3px solid transparent;-webkit-transition:all 0.2s;transition:all 0.2s;cursor:pointer}
.rp-sm:nth-child(even){background:var(--rp-popup-alt-bg,rgba(255,255,255,0.03))}
.rp-sm:hover{background:rgba(255,255,255,0.06)}
.rp-sm.active{border-left-color:var(--rp-accent,#6c5ce7);background:rgba(108,92,231,0.12)}
.rp-sm-logo{width:72px;height:72px;border-radius:50%;-o-object-fit:cover;object-fit:cover;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;border:2px solid rgba(255,255,255,0.08)}
.rp-sm-info{-webkit-box-flex:1;-ms-flex:1;flex:1;min-width:0}
.rp-sm-eq{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;gap:2px;height:16px;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}
.rp-sm-eq span{width:3px;background:var(--rp-accent,#6c5ce7);border-radius:1px;-webkit-animation:rp-eq 0.8s ease-in-out infinite;animation:rp-eq 0.8s ease-in-out infinite}
.rp-sm-eq span:nth-child(1){height:40%;-webkit-animation-delay:0s;animation-delay:0s}
.rp-sm-eq span:nth-child(2){height:70%;-webkit-animation-delay:0.15s;animation-delay:0.15s}
.rp-sm-eq span:nth-child(3){height:50%;-webkit-animation-delay:0.3s;animation-delay:0.3s}

/* Stream card (legacy) */
.rp-stream-card{border-radius:10px;overflow:hidden;cursor:pointer;margin-bottom:8px;border:1px solid rgba(255,255,255,0.06)}
.rp-stream-logo{width:var(--rp-popup-logo-size,40px);height:var(--rp-popup-logo-size,40px);border-radius:var(--rp-popup-logo-radius,6px);-o-object-fit:cover;object-fit:cover;background:#2a2a3e;-webkit-transition:all 0.3s;transition:all 0.3s}
.rp-stream-logo-placeholder{width:var(--rp-popup-logo-size,40px);height:var(--rp-popup-logo-size,40px);border-radius:var(--rp-popup-logo-radius,6px);background:-webkit-linear-gradient(315deg,#2d2d44,#1a1a2e);background:linear-gradient(135deg,#2d2d44,#1a1a2e);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:18px}
.rp-stream-info{-webkit-box-flex:1;-ms-flex:1;flex:1;min-width:0}
.rp-stream-name{font-weight:600;font-size:var(--rp-popup-name-size,14px);color:var(--rp-popup-name,inherit);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-stream-genre{font-size:var(--rp-popup-genre-size,11px);color:var(--rp-popup-genre,var(--rp-station-color));margin-top:1px}
.rp-stream-item.active .rp-stream-name{color:var(--rp-popup-active-text,#fff)}
.rp-stream-item.active .rp-stream-genre{color:rgba(255,255,255,0.7)}

/* History item */
.rp-history-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:10px;padding:8px 12px;border-radius:8px}
.rp-history-art{width:var(--rp-hist-cover-size,36px);height:var(--rp-hist-cover-size,36px);border-radius:var(--rp-hist-cover-radius,4px);-o-object-fit:cover;object-fit:cover;background:#2a2a3e;-webkit-box-flex:0;-ms-flex-negative:0;flex-shrink:0}
.rp-hist-no-art{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:16px}
.rp-history-info{-webkit-box-flex:1;-ms-flex:1;flex:1;min-width:0}
.rp-history-title{font-size:var(--rp-hist-title-size,13px);font-weight:500;color:var(--rp-hist-title,inherit);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-history-artist{font-size:var(--rp-hist-artist-size,11px);color:var(--rp-hist-artist,var(--rp-author-color))}
.rp-history-time{font-size:10px;color:var(--rp-hist-time,var(--rp-station-color))}

/* Layout: 3-zone system */
.rp-zone-left,.rp-zone-center,.rp-zone-right{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:10px;min-width:0}
.rp-zone-left{-webkit-box-flex:1;-ms-flex:1 1 0%;flex:1 1 0%}
.rp-zone-center{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}
.rp-zone-right{-webkit-box-flex:1;-ms-flex:1 1 0%;flex:1 1 0%;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}
.rp-el{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:0;-ms-flex-negative:0;flex-shrink:0}
.rp-el-songinfo{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:60px;-ms-flex-negative:1;flex-shrink:1}
.rp-el-songinfo .rp-info{-webkit-box-flex:1;-ms-flex:1;flex:1;min-width:0}

/* Mobile — no display:contents, use flat layout instead (Edge fix) */
@media(max-width:600px){
    .rp-el-volume{display:none}
    .rp-el-time{display:none}
    .rp-main{padding:0 6px;gap:6px;height:var(--rp-mobile-height,64px);overflow:hidden;-ms-flex-wrap:nowrap;flex-wrap:nowrap;position:relative}
    .rp-zone-left,.rp-zone-center,.rp-zone-right{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:6px;min-width:0}
    .rp-zone-left{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;overflow:hidden}
    .rp-zone-center{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}
    .rp-zone-right{position:absolute;right:6px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}
    .rp-artwork-wrap{-webkit-box-flex:0!important;-ms-flex:0 0 var(--rp-mobile-art,48px)!important;flex:0 0 var(--rp-mobile-art,48px)!important;width:var(--rp-mobile-art,48px)!important;height:var(--rp-mobile-art,48px)!important;margin-top:0!important}
    .rp-play-btn{width:var(--rp-mobile-play,38px)!important;height:var(--rp-mobile-play,38px)!important}
    .rp-play-btn svg{width:20px;height:20px}
    .rp-title{font-size:13px!important}
    .rp-author{font-size:12px!important}
    .rp-el-songinfo{-webkit-box-flex:1!important;-ms-flex:1 1 0%!important;flex:1 1 0%!important;overflow:hidden}
    .rp-station-row{padding-right:80px}
    .rp-right-btns{gap:0px}
    .rp-btn{width:26px;height:26px;padding:4px}
    .rp-popup{width:calc(100vw - 16px);max-width:var(--rp-popup-width,320px);right:8px;left:8px}
    .rp-popup-history{max-width:var(--rp-hist-width,320px)}
    .rp-popup-onair{max-width:var(--rp-onair-width,400px)}
    .rp-popup-wide{max-width:var(--rp-popup-width,560px)}
}

/* Page bottom padding */
body:not(.rp-has-subframe){padding-bottom:calc(var(--rp-bar-height) + 6px)}

/* Page transition progress bar */
#rp-page-progress{pointer-events:none}

/* Current song in history */
.rp-history-current{background:rgba(108,92,231,0.1);border-left:3px solid var(--rp-accent,#6c5ce7)}
.rp-history-current .rp-history-title{color:var(--rp-accent,#6c5ce7);font-weight:600}

/* Now playing in stream selector */
.rp-stream-now{font-size:var(--rp-popup-song-size,11px);margin-top:3px;line-height:1.3;white-space:normal;word-break:break-word}
.rp-snow-title{color:var(--rp-popup-song,var(--rp-accent,#6c5ce7));font-weight:500}
.rp-snow-artist{color:var(--rp-popup-artist,inherit);opacity:0.6;font-weight:400}
.rp-snow-loading{opacity:0.35;font-style:italic}

/* Stream image */
.rp-stream-image-wrap{width:100%;overflow:hidden;margin-bottom:4px}
.rp-stream-image{width:100%;display:block;border-radius:var(--rp-popup-img-radius,8px);-webkit-transition:-webkit-transform 0.2s;transition:transform 0.2s}
.rp-stream-item:hover .rp-stream-image{-webkit-transform:scale(1.03);transform:scale(1.03)}
.rp-stream-item.active .rp-stream-image{outline:2px solid var(--rp-popup-active-bg,var(--rp-accent))}

/* Image-only mode */
.rp-stream-imgonly{padding:0!important;overflow:hidden;border-radius:var(--rp-popup-img-radius,8px);position:relative;gap:0!important}
.rp-stream-imgonly .rp-stream-image{border-radius:0;width:100%;display:block}
.rp-stream-imgonly.active{outline:3px solid var(--rp-popup-active-bg,var(--rp-accent));outline-offset:-3px;box-shadow:0 0 16px var(--rp-accent,#6c5ce7),inset 0 0 0 3px rgba(0,0,0,0.3);position:relative}
.rp-stream-imgonly.active::after{content:'LIVE';position:absolute;top:6px;left:6px;background:var(--rp-accent,#6c5ce7);color:#fff;font-size:9px;font-weight:700;padding:2px 8px;border-radius:4px;letter-spacing:0.05em;z-index:2;-webkit-animation:rp-pulse 1.5s infinite;animation:rp-pulse 1.5s infinite}
.rp-stream-imgonly .rp-stream-now,.rp-stream-imgonly .rp-stream-info,.rp-stream-imgonly .rp-stream-name,.rp-stream-imgonly .rp-stream-genre,.rp-stream-imgonly .rp-stream-logo,.rp-stream-imgonly .rp-stream-logo-placeholder{display:none!important}

/* Grid mode — class .rp-popup-wide added by JS, no :has() needed (Edge fix) */
.rp-stream-grid{display:-ms-grid;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px}
.rp-stream-grid .rp-stream-item{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch;padding:0;gap:0;text-align:center;border-radius:10px;overflow:hidden}
.rp-stream-grid .rp-stream-logo,.rp-stream-grid .rp-stream-logo-placeholder{margin:0 auto}
.rp-stream-grid .rp-stream-info{min-width:0;padding:6px}
.rp-stream-grid .rp-stream-name{font-size:11px;white-space:normal;text-align:center}
.rp-stream-grid .rp-stream-genre{text-align:center}
.rp-stream-grid .rp-stream-now{text-align:center;font-size:10px}
.rp-sb-overlay{position:absolute;bottom:6px;right:6px;background:rgba(0,0,0,0.4);border-radius:50%;padding:2px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.rp-popup-wide{width:var(--rp-popup-width,560px);max-width:90vw}
@media(max-width:600px){
    .rp-stream-grid{grid-template-columns:repeat(2,1fr)}
    .rp-popup-wide{width:calc(100vw - 16px)}
}

/* On Air popup */
.rp-popup-onair{width:var(--rp-onair-width,400px);max-width:90vw}
.rp-popup-onair .rp-popup-header{color:var(--rp-onair-title-color,var(--rp-onair-text,inherit));font-size:var(--rp-onair-title-size,14px);font-family:var(--rp-onair-font,inherit)}
.rp-popup-onair .rp-popup-body{color:var(--rp-onair-text,var(--rp-text));font-family:var(--rp-onair-font,inherit);font-size:var(--rp-onair-text-size,13px)}
.rp-popup-onair .rp-popup-body div,.rp-popup-onair .rp-popup-body span,.rp-popup-onair .rp-popup-body p,.rp-popup-onair .rp-popup-body h3{color:inherit}
.rp-popup-onair .rp-popup-body img{max-width:100%;height:auto;border-radius:8px}
.rp-popup-onair .rp-popup-body iframe{max-width:100%;border-radius:8px}
.rp-popup-onair .rp-popup-close{color:var(--rp-onair-text,var(--rp-text))}
.rp-popup-onair .rp-popup-body a{color:var(--rp-accent,#6c5ce7)}

/* Play on cover mode — animated play button */
.rp-player[data-play-on-cover="true"] .rp-el-play{position:absolute;z-index:5;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
.rp-player[data-play-on-cover="true"] .rp-play-btn{background:rgba(0,0,0,0.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);-webkit-transition:all 0.3s ease;transition:all 0.3s ease;-webkit-animation:rp-cover-pulse 2s ease-in-out infinite;animation:rp-cover-pulse 2s ease-in-out infinite}
.rp-player[data-play-on-cover="true"] .rp-play-btn:hover{background:rgba(0,0,0,0.7);-webkit-transform:scale(1.15);transform:scale(1.15);-webkit-animation:none;animation:none;box-shadow:0 0 25px rgba(255,255,255,0.4)}
@-webkit-keyframes rp-cover-pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,0.3);-webkit-transform:scale(1);transform:scale(1)}50%{box-shadow:0 0 0 10px rgba(255,255,255,0);-webkit-transform:scale(1.06);transform:scale(1.06)}}
@keyframes rp-cover-pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,0.3);transform:scale(1)}50%{box-shadow:0 0 0 10px rgba(255,255,255,0);transform:scale(1.06)}}
.rp-player[data-play-on-cover="true"][data-playing="true"] .rp-el-play{opacity:0;-webkit-transition:opacity 0.25s;transition:opacity 0.25s}
.rp-player[data-play-on-cover="true"][data-playing="true"] .rp-play-btn{-webkit-animation:none;animation:none}
.rp-player[data-play-on-cover="true"][data-playing="true"] .rp-artwork-wrap:hover .rp-el-play{opacity:1}

/* ===== Expanded Panel ===== */
.rp-expanded{position:fixed;bottom:0;left:0;right:0;top:0;z-index:1001;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;color:var(--rp-text);font-family:var(--rp-font,'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif);-webkit-animation:rp-slide-up 0.35s ease;animation:rp-slide-up 0.35s ease;pointer-events:auto}
@-webkit-keyframes rp-slide-up{from{-webkit-transform:translateY(100%);transform:translateY(100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}
@keyframes rp-slide-up{from{transform:translateY(100%)}to{transform:translateY(0)}}
.rp-expanded-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--rp-exp-bg,var(--rp-bg,var(--rp-surface)));opacity:var(--rp-exp-opacity,0.97);pointer-events:none;z-index:0}

/* Close/Controls area */
.rp-exp-controls{position:absolute;top:16px;right:20px;display:-webkit-box;display:-ms-flexbox;display:flex;gap:8px;z-index:5}
.rp-exp-ctrl-btn{background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.1);color:var(--rp-exp-text,var(--rp-text));padding:8px 16px;border-radius:24px;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:6px;font-size:13px;font-weight:500;-webkit-transition:all 0.2s;transition:all 0.2s;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.rp-exp-ctrl-btn:hover{background:rgba(255,255,255,0.15);-webkit-transform:translateY(-1px);transform:translateY(-1px)}
.rp-exp-ctrl-close{padding:8px 12px}
.rp-exp-ctrl-close:hover{background:rgba(255,80,80,0.2);border-color:rgba(255,80,80,0.3)}

/* Mobile tabs */
.rp-exp-tabs{display:none;position:relative;z-index:2;background:rgba(255,255,255,0.04);border-bottom:1px solid rgba(255,255,255,0.08)}
.rp-exp-tab{background:none;border:none;color:var(--rp-exp-text,var(--rp-text));opacity:0.5;padding:14px 0;font-size:15px;font-weight:600;cursor:pointer;border-bottom:3px solid transparent;-webkit-transition:all 0.2s;transition:all 0.2s;-webkit-box-flex:1;-ms-flex:1;flex:1;text-align:center}
.rp-exp-tab.active{opacity:1;border-bottom-color:var(--rp-exp-accent,var(--rp-accent,#6c5ce7))}
.rp-exp-tab:hover{opacity:0.8}

/* 3-column content */
.rp-exp-content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;position:relative;z-index:2;padding:20px}
.rp-exp-col{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:0 20px;overflow-y:auto}
.rp-exp-content .rp-exp-col-now{-webkit-box-flex:0;-ms-flex:0 0 var(--rp-exp-col-left,300px);flex:0 0 var(--rp-exp-col-left,300px);width:var(--rp-exp-col-left,300px);min-width:var(--rp-exp-col-left,300px);max-width:var(--rp-exp-col-left,300px);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-align:center}
.rp-exp-col-timeline{border-left:1px solid rgba(255,255,255,0.08);border-right:1px solid rgba(255,255,255,0.08)}
.rp-exp-content .rp-exp-col-show{-webkit-box-flex:0;-ms-flex:0 0 var(--rp-exp-col-right,300px);flex:0 0 var(--rp-exp-col-right,300px);width:var(--rp-exp-col-right,300px);min-width:var(--rp-exp-col-right,300px);max-width:var(--rp-exp-col-right,300px)}

/* Section titles */
.rp-exp-section-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;opacity:0.4;margin-bottom:16px}

/* Now playing column */
.rp-exp-cover-wrap{width:var(--rp-exp-cover,220px);height:var(--rp-exp-cover,220px);border-radius:var(--rp-exp-cover-r,12px);overflow:hidden;margin-bottom:20px;box-shadow:0 8px 40px rgba(0,0,0,0.4)}
.rp-exp-cover{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;display:block}
.rp-exp-song{font-size:var(--rp-exp-title-size,22px);font-weight:700;margin-bottom:4px;color:var(--rp-exp-text,inherit)}
.rp-exp-artist{font-size:var(--rp-exp-artist-size,16px);opacity:0.7;margin-bottom:8px;color:var(--rp-exp-text,inherit)}
.rp-exp-station{font-size:var(--rp-exp-station-size,12px);opacity:0.4;margin-bottom:20px;color:var(--rp-exp-text,inherit)}
.rp-exp-progress{width:100%;max-width:260px}
.rp-exp-pbar{width:100%;height:4px;background:rgba(255,255,255,0.1);border-radius:2px;overflow:hidden}
.rp-exp-pfill{height:100%;background:var(--rp-accent,#6c5ce7);border-radius:2px;width:0%;-webkit-transition:width 1s linear;transition:width 1s linear}
.rp-exp-times{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;font-size:11px;opacity:0.5;margin-top:4px}

/* Timeline column */
.rp-exp-tl-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,0.05);position:relative}
.rp-exp-tl-item:last-child{border-bottom:none}
.rp-exp-tl-time{-webkit-box-flex:0;-ms-flex:0 0 45px;flex:0 0 45px;font-size:var(--rp-exp-tl-time,12px);opacity:0.4;text-align:right}
.rp-exp-tl-dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,0.15);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;position:relative;z-index:1}
.rp-exp-tl-item:first-child .rp-exp-tl-dot{background:var(--rp-accent,#6c5ce7);box-shadow:0 0 8px var(--rp-accent,#6c5ce7)}
.rp-exp-tl-cover{width:var(--rp-exp-tl-cover,44px);height:var(--rp-exp-tl-cover,44px);border-radius:6px;-o-object-fit:cover;object-fit:cover;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}
.rp-exp-tl-nocover{width:var(--rp-exp-tl-cover,44px);height:var(--rp-exp-tl-cover,44px);border-radius:6px;background:rgba(255,255,255,0.06);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:18px;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}
.rp-exp-tl-info{-webkit-box-flex:1;-ms-flex:1;flex:1;min-width:0}
.rp-exp-tl-title{font-size:var(--rp-exp-tl-title,14px);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-exp-tl-artist{font-size:var(--rp-exp-tl-artist,12px);opacity:0.5}
/* Vertical timeline line */
.rp-exp-timeline-list{position:relative;padding-left:0}

/* Show column */
.rp-exp-show-content img{max-width:100%;border-radius:10px}

/* Mobile */
@media(max-width:1000px){
    .rp-exp-tabs{display:-webkit-box;display:-ms-flexbox;display:flex}
    .rp-exp-content{padding:16px}
    .rp-exp-content .rp-exp-col{display:none!important;padding:0;width:100%!important;min-width:0!important;max-width:100%!important;-webkit-box-flex:1;-ms-flex:1 1 100%;flex:1 1 100%}
    .rp-exp-content .rp-exp-col.rp-exp-active{display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}
    .rp-exp-content .rp-exp-col-now{-webkit-box-align:center;-ms-flex-align:center;align-items:center}
    .rp-exp-col-timeline{border:none}
    .rp-exp-cover-wrap{width:180px;height:180px}
    .rp-exp-controls{top:auto;bottom:16px;right:50%;-webkit-transform:translateX(50%);transform:translateX(50%)}
    .rp-exp-ctrl-btn{background:rgba(0,0,0,0.4);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
}

/* Expand button — transparent by default, configurable via admin */
.rp-btn-expand{opacity:0.6;-webkit-transition:opacity 0.15s,background 0.15s,transform 0.2s;transition:opacity 0.15s,background 0.15s,transform 0.2s}
.rp-btn-expand:hover{opacity:1;-webkit-transform:translateY(-2px);transform:translateY(-2px)}
/* When admin sets a custom button background/size, apply the pill style */
.rp-player[data-exp-btn-styled="true"] .rp-btn-expand{opacity:var(--rp-exp-btn-opacity,1);background:var(--rp-exp-btn-bg);color:var(--rp-exp-btn-icon,#fff);border-radius:50%;width:var(--rp-exp-btn-size,30px);height:var(--rp-exp-btn-size,30px);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
.rp-player[data-exp-btn-styled="true"] .rp-btn-expand:hover{opacity:1}