/* Relay Radio — Listener Spotlight / layout-safe repair (Nov 13, 2026).
   The home player is an existing grid with dozens of responsive overrides.
   IMPORTANT: never alter .rv-player-info or .rv-player-controls here.  JS
   moves #rrListenerSpotlight just AFTER .rv-player-panel, not inside the grid. */
.rr-listener-spotlight[hidden],
.rr-listener-spotlight-panel[hidden],
.rr-listener-spotlight-toggle[hidden] { display:none!important; }
/* A small, aligned footer ticker under the player. No floating card, no overlap,
   no duplicate title when a requested track is already shown above it. */
#slider.rv-hero-with-player .rv-hero-player-overlay > .rr-listener-spotlight {
    display:flex;
    align-items:center;
    flex-wrap:nowrap;
    gap:8px;
    box-sizing:border-box;
    min-width:0;
    width:100%;
    margin:0;
    padding:6px 18px 8px;
    border:0;
    border-top:1px solid rgba(117,192,229,.16);
    border-radius:0;
    background:transparent;
    box-shadow:none;
    color:#bacddc;
    line-height:1.4;
    font-size:11px;
}
#slider.rv-hero-with-player .rr-listener-spotlight.is-on-air {
    border-top-color:rgba(112,215,177,.26);
}
#slider.rv-hero-with-player .rr-listener-spotlight.is-dedication {
    border-top-color:rgba(236,157,208,.24);
}
.rr-listener-spotlight-symbol {
    color:#73c9e9;
    font-size:13px;
    font-weight:850;
    flex:0 0 auto;
}
.rr-listener-spotlight.is-on-air .rr-listener-spotlight-symbol { color:#83e0bf; }
.rr-listener-spotlight.is-dedication .rr-listener-spotlight-symbol { color:#f4aad7; }
.rr-listener-spotlight-label {
    color:#8bd7ef;
    flex:0 0 auto;
    font-size:10px;
    letter-spacing:.03em;
    font-weight:850;
    text-transform:uppercase;
    white-space:nowrap;
}
.rr-listener-spotlight.is-on-air .rr-listener-spotlight-label { color:#96e7cc; }
.rr-listener-spotlight.is-dedication .rr-listener-spotlight-label { color:#f3afd8; }
.rr-listener-spotlight-separator { color:rgba(205,232,249,.35);flex:0 0 auto; }
.rr-listener-spotlight-summary {
    display:block;
    flex:1 1 auto;
    min-width:0;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    color:rgba(216,232,243,.81);
    font-size:11px;
    font-weight:500;
}
/* This is a footer-only strip: never animate or position over audio buttons. */
@media (max-width:767.98px) {
    #slider.rv-hero-with-player .rv-hero-player-overlay > .rr-listener-spotlight {
        margin:0;
        padding:6px 12px 8px;
        gap:5px;
    }
    .rr-listener-spotlight-label { font-size:9px; letter-spacing:0; }
    .rr-listener-spotlight-summary { font-size:10px; }
}
@media (max-width:380px) {
    .rr-listener-spotlight-separator { display:none; }
    .rr-listener-spotlight-label { max-width:117px; overflow:hidden; text-overflow:ellipsis; }
}

.rr-listener-spotlight-toggle{display:inline-flex;align-items:center;gap:5px;min-width:0;min-height:34px;flex:0 0 auto;padding:5px 9px;border:1px solid rgba(227,131,191,.38);border-radius:11px;background:linear-gradient(145deg,rgba(104,49,103,.3),rgba(22,49,72,.65));color:#ffb8df;white-space:nowrap;font-size:11px;font-weight:850;cursor:pointer}
.rr-listener-spotlight-toggle:hover,.rr-listener-spotlight-toggle[aria-expanded="true"]{border-color:#ff99ce;background:rgba(100,56,99,.55);color:#fff}
.rr-listener-spotlight-toggle.is-on-air{border-color:rgba(104,237,180,.55);color:#9effcf;background:rgba(25,105,77,.28)}
.rr-listener-spotlight-toggle:focus-visible,.rr-listener-spotlight-panel button:focus-visible{outline:2px solid #68dfff;outline-offset:2px}
.rr-listener-spotlight-count[hidden]{display:none!important}
.rr-listener-spotlight-count{display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:rgba(255,255,255,.16);font-size:10px}
.rr-listener-spotlight-panel{position:absolute;z-index:15;bottom:calc(100% + 11px);right:clamp(12px,calc((100vw - 1140px)/2),500px);width:min(430px,calc(100vw - 24px));max-height:min(65vh,510px);display:flex;flex-direction:column;overflow:hidden;border:1px solid rgba(119,207,234,.3);border-radius:18px;background:linear-gradient(155deg,#111d30,#151629 90%);box-shadow:0 20px 58px rgba(0,0,0,.62);color:#fff}
.rr-listener-spotlight-panel>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 17px;border-bottom:1px solid rgba(125,200,234,.15)}
.rr-listener-spotlight-panel header small{display:block;color:#63d7f8;font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.rr-listener-spotlight-panel header h3{margin:2px 0 0;font-size:18px;line-height:1.2;color:#fff}
.rr-listener-spotlight-panel header button{display:grid;place-items:center;width:32px;height:32px;border:1px solid rgba(255,255,255,.13);border-radius:9px;background:rgba(255,255,255,.04);color:#b9cad9;cursor:pointer}
.rr-listener-spotlight-items{overflow:auto;overscroll-behavior:contain;padding:8px 15px 12px;min-height:0}
.rr-listener-spotlight-entry{padding:11px 2px;border-bottom:1px solid rgba(255,255,255,.075)}
.rr-listener-spotlight-entry:last-child{border-bottom:0}
.rr-listener-spotlight-entry>small{display:flex;align-items:center;gap:6px;margin-bottom:4px;color:#70dfff;font-size:10px;font-weight:900;letter-spacing:.05em;text-transform:uppercase}
.rr-listener-spotlight-entry.is-dedication>small{color:#ffabdb}
.rr-listener-spotlight-entry.is-on-air>small{color:#90f7cb}
.rr-listener-spotlight-entry strong{display:block;font-size:13px;line-height:1.35;overflow-wrap:anywhere}
.rr-listener-spotlight-entry .rr-listener-spotlight-by{display:block;margin-top:3px}
.rr-listener-spotlight-entry p{margin:6px 0 0;padding-left:8px;border-left:2px solid rgba(241,146,210,.55);color:#f8d8ed;font-size:12px;line-height:1.45;white-space:pre-line;overflow-wrap:anywhere}
.rr-listener-spotlight-empty{padding:14px 0;color:#b2c3d0;font-size:13px}
.rr-listener-spotlight-footnote{margin:0;padding:9px 17px 14px;border-top:1px solid rgba(255,255,255,.075);color:#91a6b7;font-size:11px;line-height:1.35}
@media(max-width:700px){.rr-listener-spotlight-toggle{width:34px;min-width:34px;height:34px;padding:4px;display:inline-flex;justify-content:center;gap:3px}.rr-listener-spotlight-toggle .rr-listener-spotlight-label{display:none}.rr-listener-spotlight-panel{right:10px}.rr-listener-spotlight-toggle .rr-listener-spotlight-count{font-size:9px;min-width:13px;padding:0 2px}}
@media(max-width:390px){.rr-listener-spotlight-toggle{min-width:29px;width:29px;height:31px;font-size:10px}.rr-listener-spotlight-toggle .rr-listener-spotlight-count{min-width:10px;font-size:9px}.rr-persistent-player .rr-persistent-controls{gap:3px}}
@media(prefers-reduced-motion:reduce){.rr-listener-spotlight.rr-spotlight-just-on-air{animation:none}}

/* Persistent (footer) player — thin full-width request/dedication ticker.
   This is a SIBLING of the existing controls grid, not a grid cell.
   It never changes or overlaps play/volume/track controls. */
#rrPersistentPlayer > .rr-persistent-spotlight[hidden] {display:none!important;}
#rrPersistentPlayer > .rr-persistent-spotlight {
    position:relative;
    display:block;
    width:100%;
    margin:0;
    padding:0;
    border:0;
    border-bottom:1px solid rgba(91,195,231,.18);
    border-radius:0;
    background:linear-gradient(90deg,rgba(7,43,60,.94),rgba(20,27,45,.96) 68%,rgba(44,25,45,.95));
    color:#dbeef7;
    text-align:left;
    font:inherit;
    cursor:pointer;
}
#rrPersistentPlayer > .rr-persistent-spotlight.is-on-air {
    border-bottom-color:rgba(106,221,177,.3);
    background:linear-gradient(90deg,rgba(10,57,55,.95),rgba(15,33,43,.96) 68%,rgba(27,37,52,.95));
}
#rrPersistentPlayer > .rr-persistent-spotlight.is-dedication {
    border-bottom-color:rgba(235,143,207,.27);
    background:linear-gradient(90deg,rgba(53,26,57,.96),rgba(25,27,47,.96) 68%,rgba(32,25,46,.95));
}
#rrPersistentPlayer > .rr-persistent-spotlight:focus-visible {
    outline:2px solid #69dfff;
    outline-offset:-3px;
}
.rr-persistent-spotlight-content {
    width:calc(100% - 20px);
    max-width:1140px;
    margin:auto;
    box-sizing:border-box;
    display:flex;
    align-items:center;
    gap:8px;
    min-height:25px;
    padding:3px 0;
    white-space:nowrap;
    min-width:0;
    line-height:1.4;
}
.rr-persistent-spotlight-symbol {
    flex:none;
    color:#71d6f4;
    font-size:12px;
}
.rr-persistent-spotlight-status {
    flex:none;
    color:#98e5f6;
    font-size:10px;
    font-weight:850;
    letter-spacing:.04em;
    text-transform:uppercase;
}
.rr-persistent-spotlight.is-on-air .rr-persistent-spotlight-status,
.rr-persistent-spotlight.is-on-air .rr-persistent-spotlight-symbol { color:#95e7c7; }
.rr-persistent-spotlight.is-dedication .rr-persistent-spotlight-status,
.rr-persistent-spotlight.is-dedication .rr-persistent-spotlight-symbol { color:#f5aedc; }
.rr-persistent-spotlight-separator {flex:none;color:rgba(208,232,240,.35);}
.rr-persistent-spotlight-message {
    flex:1 1 auto;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    color:rgba(227,240,249,.85);
    font-size:11px;
}
.rr-persistent-spotlight-more {
    flex:none;
    margin-left:auto;
    color:rgba(174,219,241,.78);
    font-size:10px;
    font-weight:700;
}
#rrPersistentPlayer > .rr-persistent-spotlight:hover .rr-persistent-spotlight-more{color:#fff;}
/* A dock with an extra line needs room below page content; never obscures
   navigation or the last line of content while the sticky player is visible. */
body.rr-persistent-player-visible.rr-spotlight-footer-active {padding-bottom:121px;}
@media(max-width:760px){
    .rr-persistent-spotlight-content {gap:5px;min-height:24px;}
    .rr-persistent-spotlight-status {font-size:9px;letter-spacing:0;}
    .rr-persistent-spotlight-message {font-size:10px;}
    .rr-persistent-spotlight-more {display:none;}
    body.rr-persistent-player-visible.rr-spotlight-footer-active {padding-bottom:108px;}
}
@media(max-width:380px){
    .rr-persistent-spotlight-status {max-width:118px;overflow:hidden;text-overflow:ellipsis;}
    .rr-persistent-spotlight-separator {display:none;}
}
