/* Go Live as a broadcast (broadcast.js). While hosting or watching, the panel takes the chat's place on the Live stage. */
body.broadcasting #liveScreen #messages,body.broadcasting #liveScreen .composer,body.broadcasting #liveScreen .live-mic-status,body.broadcasting #liveScreen .chat-attachments,
body.broadcasting #liveScreen .story-actions{display:none}
.broadcast-panel{margin-top:auto;display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line);border-radius:var(--r-compact);background:var(--story-glass);-webkit-backdrop-filter:var(--story-glass-filter);backdrop-filter:var(--story-glass-filter)}
.broadcast-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.broadcast-head b{flex:1 1 auto;min-width:0;font-size:14px;line-height:1.3}
.broadcast-head small{font-size:12px;color:var(--text-2)}
/* A darker red than --live, so the white LIVE reads at 4.5:1 or better. */
.broadcast-pill{padding:2px 8px;border-radius:var(--r-pill);background:var(--live-fill);color:var(--on-live);font-size:11px;font-weight:700;letter-spacing:.06em}
.broadcast-caption{margin:0;font-size:15px;line-height:1.45}
.broadcast-caption:empty{display:none}
.broadcast-comments{max-height:22dvh;overflow-y:auto;display:flex;flex-direction:column;gap:4px}
.broadcast-comment{margin:0;font-size:13px;line-height:1.4}
.broadcast-comment b{margin-right:4px}
.broadcast-comment.agent b{color:var(--b)}
.broadcast-agent{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-2)}
.broadcast-bar{display:flex;gap:8px}
.broadcast-bar .field{min-height:44px}
.broadcast-bar .btn{flex:none}
#broadcastStatus{margin:0}
#broadcastStatus:empty{display:none}
/* End live, Leave and Like sit on the right, as the Go live modal's buttons do. */
.broadcast-bar:last-child{justify-content:flex-end}
#broadcastLike.liked{color:var(--pink)}
.broadcast-modal{position:fixed;inset:0;z-index:65;display:grid;place-items:center;padding:16px;background:var(--scrim)}
.broadcast-modal-box{width:100%;max-width:420px;padding:18px;border:1px solid var(--line);border-radius:var(--r-panel);background:var(--glass-solid)}
/* The Go live modal fades in over its scrim, the box scaling up from .96 in the centre; it leaves the same way,
   faster. Visuals only: the mic hold/release and focus run exactly when they did. Reduced motion: fades only. */
.broadcast-modal{transition:opacity 200ms var(--ease-out)}
.broadcast-modal-box{transition:opacity 200ms var(--ease-out),transform 200ms var(--ease-out)}
@starting-style{.broadcast-modal{opacity:0}.broadcast-modal-box{opacity:0;transform:scale(.96)}}
.broadcast-modal.hidden.leaving{display:grid!important;opacity:0;pointer-events:none;transition-duration:150ms}
.broadcast-modal.leaving .broadcast-modal-box{opacity:0;transform:scale(.96);transition-duration:150ms}
@media (prefers-reduced-motion:reduce){.broadcast-modal-box{transition-property:opacity}}
.broadcast-modal-box h3{display:flex;align-items:center;gap:8px;margin:0 0 6px}
.broadcast-dot{width:9px;height:9px;border-radius:50%;background:var(--live)}
.broadcast-topic-wrap{display:flex;gap:8px;align-items:flex-start}
.broadcast-topic-wrap textarea{min-height:90px;padding-top:12px}
#broadcastDictate.listening{color:var(--green)}
.broadcast-modal-box .toolbar{display:flex;justify-content:flex-end;gap:8px}
/* The sheet's instructions are a paragraph, so Geist, not the one-line machine voice. */
#broadcastModal h3+.note{font-family:var(--font);font-size:14px;font-weight:400;line-height:1.5;color:var(--text-2)}