/* The on-air bar.
 *
 * Lived in live.css until the banner became site-wide chrome; it is loaded by
 * the (main) layout now, so it must not sit in a stylesheet that only /live
 * pulls in. Nothing about the rules changed in the move.
 *
 * Rides entirely on base.css tokens — no new colours, radii or shadows. The
 * keyframes are duplicated from live.css deliberately: both stylesheets load
 * together on /live, and an identical redefinition is harmless, where a
 * cross-file dependency would break whichever page loaded only one of them.
 */

@keyframes live-throb{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.8)}}

.livebar{display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap;
  background:var(--card);border:1px solid rgba(var(--acc-rgb),.3);border-radius:var(--r);
  padding:var(--s3) var(--s5);margin-bottom:var(--s6);
  transition:border-color .25s,transform .25s var(--ease),box-shadow .25s}
.livebar:hover{border-color:var(--acc);transform:translateY(-2px);box-shadow:0 10px 30px var(--glow)}
.livebar[data-state="live"]{border-color:rgba(var(--warn-rgb),.45)}
.livebar .tag-on{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);
  font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--acc);flex:none}
.livebar[data-state="live"] .tag-on{color:var(--warn)}
.livebar .tag-on i{width:7px;height:7px;border-radius:50%;background:currentColor;
  box-shadow:0 0 10px currentColor}
.livebar[data-state="live"] .tag-on i{animation:live-throb 1.6s var(--ease) infinite}
.livebar .txt{flex:1 1 240px;min-width:0;font-size:14.5px;font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.livebar .in{color:var(--mut);font-family:var(--mono);font-size:13px;flex:none;direction:ltr}
.livebar .go{color:var(--acc);font-size:13.5px;font-weight:700;flex:none}
.livebar .go::after{content:"";display:inline-block;width:12px;height:12px;margin-inline-start:6px;
  background:currentColor;-webkit-mask:var(--ico-chevron) center/contain no-repeat;
  mask:var(--ico-chevron) center/contain no-repeat;vertical-align:-1px}
html[dir="rtl"] .livebar .go::after{transform:scaleX(-1)}

/* Site-wide placement: a normal-flow strip under the fixed nav rather than
   something pinned to a viewport edge — both bottom corners already belong to
   the AI fab and the back-to-top button. */
.livebar-slot{max-width:1180px;margin:0 auto;padding:96px 24px 0}
.livebar-slot .livebar{margin-bottom:0}

@media (max-width:640px){
  .livebar .in{display:none}
  .livebar-slot{padding-top:84px}
}

@media (prefers-reduced-motion:reduce){
  .livebar .tag-on i{animation:none}
  .livebar:hover{transform:none}
}