/* The staging banner only. Everything else comes from the ported theme
   stylesheet -- no CSS of our own is layered over it during the port. */
.staging-flag { background:#f00; color:#fff; text-align:center; padding:.4rem;
  font:700 13px/1.4 Montserrat, Arial, sans-serif; }
.skip-link { position:absolute; left:-9999px; top:0; z-index:100;
  background:#1A2428; color:#fff; padding:1rem 1.6rem; font-weight:700;
  text-decoration:none; }
.skip-link:focus { left:0; }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; }

/* KEYBOARD FOCUS. The theme's style.css carries `*:focus { outline: none }`
   -- live's own rule, and live's own accessibility failure: a keyboard user
   has no idea where they are on the page. WCAG 2.4.7 Focus Visible is a
   Level AA requirement.

   This was fixed once (commit 9f17856) in a stylesheet of ours that the port
   then correctly removed, because layering invented CSS over the ported
   theme is exactly what the port exists to stop. It went with it, silently,
   and the accessibility audit only noticed because it was re-run.

   Restored here instead, in the one small sheet of ours that survives,
   because it is additive and invisible: `:focus-visible` matches only
   keyboard focus, so nothing changes for a mouse user, nothing changes in a
   screenshot, and no visual comparison moves. It is a deliberate deviation
   from live in the same direction as every other accessibility fix. */
:focus-visible {
  outline: 3px solid #1A2428;
  outline-offset: 2px;
  border-radius: 2px;
}
/* Some theme components paint their own background over the outline. */
a:focus-visible, button:focus-visible, [tabindex]:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid #1A2428;
  outline-offset: 2px;
}