/* THE EVENT BAR (the owner, 3 Oct 2026): "a thin blended bar across all pages under the banners",
   and once it was live, "The bar is supposed to be blended, directly under the banner". The first
   version was a flat dark strip with a red hairline on top, and under the hub's tagline: it read as
   a second panel stacked under the banner. Now there is no strip and no line: the text sits on a
   shadow that is darkest against the banner's bottom edge and fades out downward and at both sides,
   so the timers read as the banner's own last line. The height is reserved here, in the head, so the
   timers arriving a moment later move nothing on the page. Each page places #evBar itself (directly
   under its banner artwork, or at the top where it has none) and fits its margins inline. */
.evbar{position:relative;min-height:32px;display:flex;align-items:center;justify-content:center;
  font-size:13.5px;line-height:1.35;color:#ddd3c1;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.85)}
/* an ellipse, not a strip: darkest at the top centre, under the banner, and gone in every direction,
   so there is no edge anywhere (a strip with faded ends still read as a rectangle on the hub) */
.evbar::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 34% 115% at 50% 0%,rgba(8,7,9,.62),rgba(8,7,9,.3) 55%,rgba(8,7,9,0) 100%)}
.evbar--top{max-width:1120px;margin:0 auto 14px}
.evbar-in{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 34px;padding:5px 14px}
.evb{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px 8px}
.evb-tgrp{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.evb-lab{font:600 11px/1.2 "IBM Plex Mono",Consolas,"Courier New",monospace;letter-spacing:.14em;text-transform:uppercase}
.evb-ht .evb-lab{color:#e5653f}
.evb-wb .evb-lab{color:#c9a961}
.evb-t{font-family:"IBM Plex Mono",Consolas,"Courier New",monospace;font-variant-numeric:tabular-nums;color:#f2e9d8}
.evb-t.is-live{color:#ff6b4a;font-weight:700}
.evb-when,.evb-amp{color:#a59c8c}
.evb-name{color:#e8c47c}
.evb-pair{white-space:nowrap}
.evb-snd{display:inline-flex;align-items:center;justify-content:center;width:26px;height:22px;padding:0;margin:0 0 0 2px;
  border:1px solid rgba(233,226,211,.2);border-radius:3px;background:rgba(255,255,255,.03);color:#8f8778;cursor:pointer;
  font:inherit;line-height:1;vertical-align:middle}
.evb-snd:hover{color:#e8c47c;border-color:rgba(232,196,124,.6);background:rgba(232,196,124,.07)}
.evb-snd[aria-pressed="true"]{color:#e8c47c;border-color:rgba(232,196,124,.6);background:rgba(232,196,124,.1)}
.evb-snd:focus-visible{outline:2px solid #8fb6d2;outline-offset:2px}
.evb-snd svg{display:block;width:17px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
/* the last five minutes before a World Boss: red, pulsing slowly (the owner's ask). The text pulses,
   the speaker beside it does not. */
.evb-wb.is-soon .evb-lab,.evb-wb.is-soon .evb-who,.evb-wb.is-soon .evb-who *,.evb-wb.is-soon .evb-when,.evb-wb.is-soon .evb-t{color:#ff4b4b}
.evb-wb.is-soon .evb-lab,.evb-wb.is-soon .evb-who,.evb-wb.is-soon .evb-when,.evb-wb.is-soon .evb-t{animation:evbPulse 2.4s ease-in-out infinite}
@keyframes evbPulse{0%,100%{opacity:1;text-shadow:0 0 10px rgba(255,60,60,.6),0 1px 2px rgba(0,0,0,.85)}50%{opacity:.45;text-shadow:0 1px 2px rgba(0,0,0,.85)}}
@media (prefers-reduced-motion:reduce){.evb-wb.is-soon .evb-lab,.evb-wb.is-soon .evb-who,.evb-wb.is-soon .evb-when,.evb-wb.is-soon .evb-t{animation:none}}
/* narrower screens: smaller type and tighter gaps. One line down to about 650px; on a phone two
   lines (45px, reserved so nothing below moves when the timers arrive), three in the two slots
   where a second boss spawns (63px, measured at 390 on 3 Oct 2026). */
@media (max-width:900px){
  .evbar{font-size:12.5px;line-height:1.3}
  .evbar::before{background:radial-gradient(ellipse 70% 115% at 50% 0%,rgba(8,7,9,.62),rgba(8,7,9,.3) 55%,rgba(8,7,9,0) 100%)}
  .evbar-in{gap:1px 16px;padding:4px 8px}
  .evb{gap:1px 6px}
  .evb-tgrp{gap:6px}
  .evb-lab{font-size:10px;letter-spacing:.08em}
  .evb-snd{width:24px;height:20px}
}
@media (max-width:600px){.evbar{min-height:45px}}
/* ...and the boss pairs wrap ONE BY ONE beside the label, not as one block under it. Measured 5 Oct
   2026 at 390 in Edge, on the pages whose bar is 350 wide: "Wandering Death, Dry Steppes & Avarice,
   Nahantu" (the rotation re-read that day) dropped below "World Boss" whole, and the countdown went
   under it, four rows and 76px. With the names' box gone from the layout, each pair, the "&" and the
   countdown wrap on their own: three rows, 63px. The pulse moves to the pieces, since a box that is
   not drawn cannot fade. */
@media (max-width:600px){
  .evb-who{display:contents}
  .evb-wb.is-soon .evb-who>*{animation:evbPulse 2.4s ease-in-out infinite}
}
@media (max-width:600px) and (prefers-reduced-motion:reduce){.evb-wb.is-soon .evb-who>*{animation:none}}
