/* «Ball of Satan» radio (ui/radio.js): the wheel on Y in the middle of the screen (two rings: the moves inside, the places
   outside; the phone: under the finger), the radio feed under the clock, the phone's radio button over the eye.
   --you: cyan swat (the radio) / magenta possessed (the whisper). Flat plates, 1.5 px lines, no gloss. */
#radioWheel{position:absolute;left:50%;top:50%;width:324px;height:324px;margin:-162px 0 0 -162px;z-index:13;pointer-events:none;--you:var(--cyan);font-family:var(--mono)}
#radioWheel[data-side=possessed]{--you:var(--mag)}
#radioWheel[hidden]{display:none}
#radioWheel svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#radioWheel .rw-w{fill:rgba(7,5,11,.92);stroke:rgba(236,230,242,.18);stroke-width:1.5;transition:fill .08s ease}
#radioWheel .rw-w.on{fill:color-mix(in srgb,var(--you) 34%,rgba(7,5,11,.85));stroke:var(--you)}
#radioWheel .rw-w.r1{fill:rgba(12,9,18,.9)}
#radioWheel .rw-w.r1.on{fill:color-mix(in srgb,var(--you) 34%,rgba(7,5,11,.85))}
#radioWheel .rw-w.off{fill:rgba(7,5,11,.55);stroke-dasharray:4 4}
#radioWheel .rw-l.off{opacity:.35}
#radioWheel .rw-l{position:absolute;transform:translate(-50%,-50%);width:72px;text-align:center;font:600 10px/1.15 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--ink2,#c9c0d6)}
#radioWheel .rw-l.on{color:#fff}
#radioWheel .rw-l.r0{width:60px;font-size:9px;color:var(--ink,#ece6f2)}
#radioWheel .rw-l.long{font-size:8px;letter-spacing:0}
#radioWheel .rw-hub{fill:rgba(7,5,11,.94);stroke:var(--you);stroke-width:1.5}
#radioWheel .rw-mid{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
#radioWheel .rw-mid b{font:600 12px/1 var(--disp);letter-spacing:.24em;padding-left:.24em;color:var(--you)}
#radioWheel .rw-mid small{font:500 8px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--dim,#8a8196)}
#radioWheel.busy .rw-w{fill:rgba(7,5,11,.6)}
#radioWheel.busy .rw-l{opacity:.45}
#radioWheel.busy .rw-mid small{color:var(--amber)}
#radioFeed{position:absolute;left:50%;top:calc(76px + var(--safe-t,0px));transform:translateX(-50%);z-index:5;display:flex;flex-direction:column;align-items:center;gap:3px;pointer-events:none;font:500 12px/1.3 var(--mono);--you:var(--cyan)}
#radioFeed[data-side=possessed]{--you:var(--mag)}
#radioFeed .rf-ln{background:rgba(7,5,11,.74);border-left:2px solid var(--you);padding:3px 10px 3px 8px;color:var(--ink,#ece6f2);white-space:nowrap;transition:opacity .6s ease}
#radioFeed .rf-ln b{color:var(--you);font-weight:600;margin-right:6px}
#radioFeed .rf-ln b::after{content:':'}
#radioFeed .rf-ln.old{opacity:0}
body.touchp #radioFeed{top:calc(80px + var(--safe-t,0px));font-size:11px}   /* under the clock + the score line (screens/efir.css) */
@media (orientation:portrait){body.touchp #radioFeed{top:calc(162px + var(--safe-t,0px))}}   /* portrait: under the minimap / lens row */
body.touchp #radioWheel{transform:scale(.8)}
/* the phone's radio button: the left edge over the eye, z 9 — over the newbie card «Первая смена?» (#nudge, z 8) that sits there in portrait (the sticks and the action buttons stay clear: the move stick is the
   left half's thumb below, АТАКА / ОСОБОЕ / the possessed's ЗАХВАТ / РЫВОК / ВОЙ the right corner) */
#radioBtn{display:none}
body.touchp #radioBtn:not([hidden]){display:grid;place-items:center;position:absolute;z-index:9;left:calc(8px + var(--safe-l,0px));top:calc(40% - 56px);width:44px;height:44px;padding:0;
  background:rgba(7,5,11,.35);border:1px solid color-mix(in srgb,var(--cyan) 55%,transparent);border-radius:50%;color:var(--cyan);pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none}
body.touchp #radioBtn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
@media (prefers-reduced-motion:reduce){#radioWheel .rw-w,#radioFeed .rf-ln{transition:none}}
/* «Дожить до рассвета»: the clock plate grows by the «живых N из M» line (screens/efir.css) — the radio feed steps below it, not over it (PC and phone) */
body:has(#efir[data-dawn="1"]) #radioFeed{top:calc(106px + var(--safe-t,0px))}
body.touchp:has(#efir[data-dawn="1"]) #radioFeed{top:calc(110px + var(--safe-t,0px))}
@media (orientation:portrait){body.touchp:has(#efir[data-dawn="1"]) #radioFeed{top:calc(190px + var(--safe-t,0px))}}

/* «Дожить до рассвета»: the group's mode — «со мной» / «держим участок» (ui/radio.js #dawnBtn), under the radio button */
#dawnBtn{display:none}
body.touchp #dawnBtn:not([hidden]){display:grid;place-items:center;position:absolute;z-index:9;left:calc(8px + var(--safe-l,0px));top:calc(40% + 96px);width:44px;height:44px;padding:0;border-radius:50%;border:1.5px solid rgba(93,224,230,.7);background:rgba(7,5,11,.62);color:#5de0e6;font:700 9px/1 'JetBrains Mono',monospace}
body.touchp #dawnBtn[data-m="1"]{border-color:#ffb547;color:#ffb547}
body.touchp #dawnBtn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
