/* Radio bar additions (js/core/radio.js, index.html #rbar): tappable now-playing, channel tabs, open-radio link, progress line.
   Base bar rules live in components/player.css. Dark bar in both themes. */
.radio .wrap{position:relative}
.radio .now small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.radio .now{background:none;border:0;padding:0;color:inherit;font:inherit;text-align:left;cursor:pointer;min-height:44px;align-content:center}
.radio .now:hover b{text-decoration:underline;text-underline-offset:3px}
.radio .now:focus-visible,.radio .rch button:focus-visible,.radio .rch-btn:focus-visible,.radio .ropen:focus-visible,.radio .pbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.radio .pbtn:disabled{background:transparent;color:var(--on-dark-soft);border-color:var(--on-dark-soft);cursor:default}
.rch{display:flex;gap:2px;flex:none}
.rch:empty{display:none}
.rch button{min-height:44px;padding:0 10px;background:none;border:0;border-bottom:2px solid transparent;color:var(--on-dark-soft);font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.rch button:hover{color:var(--on-dark)}
.rch button[aria-selected="true"]{color:var(--accent);border-bottom-color:var(--accent)}
.rch-btn{display:none;min-height:44px;min-width:44px;padding:0 10px;background:none;border:1px solid var(--on-dark-soft);color:var(--on-dark);font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;flex:none}
.ropen{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 4px;color:var(--on-dark);font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;flex:none;white-space:nowrap}
.ropen svg{width:14px;height:14px}
.ropen:hover{color:var(--accent)}
.rprog{position:absolute;left:0;right:0;top:-2px;height:2px;pointer-events:none}
.rprog i{display:block;height:100%;background:var(--on-dark);transform-origin:0 50%;transform:scaleX(0)}
/* tablet: channel tabs give way to one cycling button */
@media (max-width:1100px){
  .rch{display:none}
  .rch-btn:not([hidden]){display:inline-flex;align-items:center}
}
/* phone: play, now playing, channel, open */
@media (max-width:600px){
  .radio .wrap{gap:10px}
  .radio .viz{display:none}
  .ropen{min-width:44px;justify-content:center}
  .ropen-t{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){.radio.on .viz i{animation:none;height:60%}}
