/* RADIO (signals wow, 10/13): persistent mini player + RADIO DIAL block in the SIGNALS tab. Desktop: one 33px bar in the footer zone, left, just
 * above the status line (below every side panel, so nothing overlaps). Phone: above the RESET / INCIDENTS / NEWS WIRE row, hidden under sheets. */
#rp{position:fixed;z-index:8;left:calc(var(--railw) + var(--g) + 8px);bottom:calc(var(--botb) + 29px);height:33px;max-width:min(640px,calc(100vw - var(--railw) - 2 * var(--g) - 16px));display:flex;align-items:center;gap:8px;padding:0 4px 0 8px;background:var(--glass);border:1px solid var(--line);color:var(--cy2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);overflow:hidden;font-size:10px;letter-spacing:.08em}
#rp[hidden]{display:none}
#rp.on{border-color:color-mix(in srgb,var(--m-radio) 55%,transparent)}#rp.err{border-color:var(--red)}
#rp .rp-viz{width:44px;height:21px;flex:none;opacity:.95}
#rp .rp-info{flex:1 1 auto;min-width:80px;max-width:230px;display:flex;flex-direction:column;justify-content:center;gap:0;text-align:left;padding:0;background:none;border:0;color:inherit;cursor:pointer;line-height:1.15}
#rp .rp-name{font:700 12px/1.1 var(--hd);letter-spacing:.1em;color:var(--m-hi);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#rp .rp-sub{font-size:10px;letter-spacing:.1em;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#rp.on .rp-sub{color:var(--m-radio)}#rp.err .rp-sub{color:var(--red2)}
#rp button{font:inherit}
#rp .rp-btns,#rp .rp-more{display:flex;align-items:center;gap:3px;flex:none}
#rp .rp-btns button,#rp .rp-more button,#rp .rp-x,#rp .rp-tog{display:inline-flex;align-items:center;justify-content:center;gap:4px;height:25px;min-width:25px;padding:0 6px;background:color-mix(in srgb,var(--cy) 6%,transparent);border:1px solid var(--line2);color:var(--cy2);cursor:pointer;font-size:10px;letter-spacing:.12em}
#rp .rp-btns button:hover,#rp .rp-more button:hover,#rp .rp-x:hover,#rp .rp-tog:hover{border-color:var(--cy);color:var(--m-hi);background:color-mix(in srgb,var(--cy) 20%,transparent)}
#rp button:focus-visible,#rp input:focus-visible{outline:2px solid var(--cy2);outline-offset:1px}
#rp .rp-btns .main{border-color:color-mix(in srgb,var(--m-radio) 50%,transparent);color:var(--m-radio)}
#rp svg{width:13px;height:13px;flex:none}
#rp [data-a=scan].on{background:color-mix(in srgb,var(--m-radio) 22%,transparent);border-color:var(--m-radio);color:var(--m-hi)}
#rp .sec{min-width:34px}
#rp .rp-vol{display:flex;align-items:center;width:78px;margin-left:2px}#rp .rp-vol input{width:100%;accent-color:var(--m-radio);height:14px}
#rp .rp-tog{display:none}
#rp .rp-x{border-color:transparent;background:none}
#rp .rp-scanbar{position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--m-radio);transform-origin:left;transform:scaleX(0);pointer-events:none}
@keyframes rpscan{from{transform:scaleX(0)}to{transform:scaleX(1)}}
/* a time scrubber in the footer shares this strip: squeeze to the essentials */
body:has(#scrub:not([hidden])) #rp,body:has(#wxx-fc:not([hidden])) #rp{max-width:300px}
body:has(#scrub:not([hidden])) #rp .rp-more,body:has(#scrub:not([hidden])) #rp .rp-viz,body:has(#wxx-fc:not([hidden])) #rp .rp-more,body:has(#wxx-fc:not([hidden])) #rp .rp-viz{display:none} /* CJ 10/13 polish: the forecast bar shares the strip too */
@media (max-width:1100px) and (min-width:761px){#rp .rp-vol{width:56px}#rp .rp-more button span{display:none}}

/* INSPECT card for a station */
.rd-ins{border:1px solid var(--line);background:color-mix(in srgb,var(--m-radio) 5%,transparent);padding:10px;margin-bottom:8px}
.rd-ins-s{font-size:11px;letter-spacing:.14em;color:var(--cy2);min-height:16px;overflow-wrap:anywhere}
/* style.css has a global .live badge (position:absolute); undo it for the station card and the dial status (tabs-c 10/13: the card floated over the INSPECT tabs once a station was playing) */
.rd-ins.live,.rd-np .live{position:static;z-index:auto;pointer-events:auto;display:block;padding:10px;font-size:inherit;letter-spacing:inherit}
.rd-ins.live{background:color-mix(in srgb,var(--m-radio) 5%,transparent);border:1px solid var(--line)}
.rd-np .live{display:inline;padding:0;background:none;border:0}
.rd-ins.live .rd-ins-s{color:var(--m-radio)}.rd-ins.err .rd-ins-s{color:var(--red2)}
.rd-ins-b{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 6px}
.rd-ins-b .btn.on{border-color:var(--m-radio);color:var(--m-radio)}
.rd-ins small{display:block;font-size:10px;letter-spacing:.12em;color:var(--dim)}

/* RADIO DIAL block at the top of the SIGNALS tab */
.rd-box{border:1px solid var(--line);background:color-mix(in srgb,var(--m-radio) 5%,transparent);padding:10px 10px 8px;margin:0 0 12px;display:flex;flex-direction:column;gap:8px;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.rd-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:10px;letter-spacing:.2em;color:var(--m-radio)}
.rd-h span{font:700 14px var(--hd);letter-spacing:.2em;color:var(--m-hi)}.rd-h b{font-weight:400;font-size:10px;letter-spacing:.1em;color:var(--dim)}
.rd-box input[type=search]{width:100%;box-sizing:border-box;height:30px;padding:0 9px;background:var(--panel2);border:1px solid var(--line);color:var(--m-hi);font:12px var(--mono);letter-spacing:.04em}
.rd-box input[type=search]:focus{outline:none;border-color:var(--m-radio)}
.rd-chips{display:flex;flex-wrap:wrap;gap:4px}
.rd-chips button{font-size:10px;letter-spacing:.1em;padding:3px 7px;border:1px solid var(--line2);background:var(--panel);color:var(--dim);cursor:pointer;line-height:14px}
.rd-chips button i{font-style:normal;opacity:.55;margin-left:4px}
.rd-chips button:hover{border-color:var(--cy);color:var(--m-hi)}
.rd-chips button.on{border-color:var(--m-radio);color:var(--m-hi);background:color-mix(in srgb,var(--m-radio) 20%,transparent)}
.rd-acts{display:flex;gap:6px}
.rd-acts button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:30px;font-size:10px;letter-spacing:.14em;border:1px solid var(--line);background:color-mix(in srgb,var(--cy) 7%,transparent);color:var(--cy2);cursor:pointer}
.rd-acts button:hover{border-color:var(--cy);color:var(--m-hi)}.rd-acts button.on{border-color:var(--m-radio);color:var(--m-hi);background:color-mix(in srgb,var(--m-radio) 22%,transparent)}
.rd-acts svg{width:13px;height:13px}
.rd-np{font-size:9.5px;letter-spacing:.08em;color:var(--dim);line-height:1.5;overflow-wrap:anywhere}
.rd-np b{color:var(--m-hi);font-weight:400}.rd-np em{font-style:normal;color:var(--cy2)}.rd-np i{display:block;font-style:normal;color:var(--m-radio)}
.rd-np .live{color:var(--m-radio);margin-right:6px}.rd-np .error{color:var(--red2);margin-right:6px}
.rd-box button:focus-visible,.rd-box input:focus-visible{outline:2px solid var(--cy2);outline-offset:1px}

@media (max-width:760px), (max-height:500px) and (pointer:coarse){
  /* sits above the RESET / INCIDENTS / NEWS WIRE row (that row tops out at +92px) and under every sheet */
  #rp{left:var(--g);right:var(--g);max-width:none;bottom:calc(var(--botb) + var(--both) + 98px);height:auto;flex-wrap:wrap;gap:6px;padding:6px 6px 6px 8px;z-index:7}
  #rp .rp-viz{width:34px;height:24px}
  #rp .rp-info{flex:1 1 0;min-width:0;max-width:none}
  #rp .rp-btns button,#rp .rp-more button,#rp .rp-x,#rp .rp-tog{height:34px;min-width:34px}
  #rp .rp-tog{display:inline-flex;padding:0}#rp.open .rp-tog svg{transform:rotate(180deg)}
  #rp .rp-more{display:none;order:9;flex:1 0 100%;gap:6px;padding-top:2px}
  #rp.open .rp-more{display:flex}
  #rp .rp-more button{flex:none}#rp .rp-vol{flex:1;width:auto;min-width:60px}#rp .rp-vol input{height:24px}
  #rp .rp-scanbar{height:3px}
  body.l-open #rp,body.r-open #rp,body.nr-open #rp,body:has(#pcams:not([hidden])) #rp,body:has(#lower3:not([hidden])) #rp,body:has(#sky:not([hidden])) #rp{display:none}
  /* SIGNALS tab block: finger-sized targets */
  .rd-chips button{padding:6px 9px;line-height:16px;min-height:34px} /* tabs-c 10/13: 30 -> 34px */
  .rd-acts button{height:38px}
  .rd-box input[type=search]{height:38px;font-size:16px}
  .rd-ins-b .btn{min-height:36px}.rd-ins small,.rd-np{font-size:10px}
}
@media (max-height:500px) and (pointer:coarse){ #rp{right:auto;width:min(60vw,430px);bottom:calc(var(--botb) + var(--both) + 94px)} }
@media (prefers-reduced-motion:reduce){#rp .rp-scanbar{animation:none!important}}
/* UX sweep tab-extras: 44px touch targets on the mini player and the dial */
@media (max-width:760px), (max-height:500px) and (pointer:coarse){
  #rp .rp-btns button,#rp .rp-more button,#rp .rp-x,#rp .rp-tog{height:44px;min-width:44px}
  .rd-chips button{min-height:44px}.rd-acts button{height:44px}.rd-box input[type=search]{height:44px}
  .rd-ins-b .btn{min-height:44px}
}
@media (max-width:420px){ #rp .rp-viz{display:none}#rp .rp-btns,#rp .rp-more{gap:2px}#rp .rp-name{font-size:13px} }
/* CJ 10/13 polish: the radio bar never sits under the forecast bar / radar scrubber (desktop: shrink to the gap left of the centered bar; narrow
   desktop: hop above the bottom row; phones: stack above the bar) */
@media (min-width:1241px){body:has(#wxx-fc:not([hidden])) #rp{max-width:min(300px,calc((100vw - 856px) / 2 - 8px))}body:has(#scrub:not([hidden])) #rp{max-width:min(300px,calc((100vw - 736px) / 2 - 8px))}}
@media (min-width:761px) and (max-width:1240px) and (min-height:501px){body:has(#wxx-fc:not([hidden])) #rp,body:has(#scrub:not([hidden])) #rp{bottom:calc(var(--botb) + var(--both) + 8px)}}
@media (max-width:760px){body:has(#wxx-fc:not([hidden])) #rp,body:has(#scrub:not([hidden])) #rp{bottom:calc(var(--botb) + var(--both) + 166px)}}
@media (max-height:500px) and (pointer:coarse){body:has(#wxx-fc:not([hidden])) #rp,body:has(#scrub:not([hidden])) #rp{bottom:calc(var(--botb) + var(--both) + 148px)}}

/* CJ 10/13 QA: genre chip counts were 2.4:1 */
.rd-chips button i,.rd-box .chip i{opacity:.85}
