/* Shared by every page (Phase 13): skip link, screen-reader-only text and a visible keyboard focus. */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: absolute;
  left: 8px;
  top: -64px;
  z-index: 100;
  background: var(--surface);
  color: var(--text);
  border: 2px solid var(--accent);
  border-radius: 8px;
  padding: 8px 12px;
  font: 500 14px var(--ui);
  text-decoration: none;
}
.skip-link:focus { top: 8px; }
/* :where() keeps this at zero specificity, so the page's own, more specific focus rules still win. */
:where(a, button, summary, [tabindex]):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
[tabindex="-1"]:focus { outline: none; }