/* Keep the existing navigation and page geometry; only add the official X slot. */
.nav-social {
  position: absolute;
  top: 50%;
  right: calc(var(--pad) + 126px);
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  transform: translateY(-50%);
  color: var(--dim);
  transition: color .2s;
}
.nav-social svg { width: 17px; height: 17px; fill: currentColor; }
.nav-social[aria-disabled="true"] { opacity: .5; cursor: default; }
.nav-social[href]:hover, .nav-social[href]:focus-visible { color: var(--lime); }
.nav-social:focus-visible { outline: 1px solid var(--lime); outline-offset: 3px; }
.is-pending .live-round, .is-pending .t-round,
.is-pending .live-clock, .is-pending .t-clock { font-family: var(--f-pixel-cn); }
#live.is-pending .live-grid { opacity: 1; }
.is-pending .live-mode { color: var(--lime); background: none; border: 1px solid var(--line); box-shadow: none; }
.is-pending .live-ring-fg, .is-pending .t-bar i { opacity: 0; }
.prelaunch-empty { grid-column: 1 / -1; margin: 0; padding: 20px 0; color: var(--dim); font: 400 14px/1.6 var(--f-pixel-cn); }
@media (max-width: 360px) {
  .nav-social { right: var(--pad); top: 70px; }
}