/* Accessibility helpers used on every page */

/* Appears only when reached with the keyboard */
.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 10000;
  padding: 0.6rem 1rem;
  background: #fff;
  color: #333;
  border: 2px solid #333;
  border-radius: 6px;
  font-weight: 600;
  transform: translateY(-200%);
}

.skip-link:focus {
  transform: none;
}

main:focus {
  outline: none;
}

/* Shown by js/reveal.js only on pages with endless animations */
.motion-toggle {
  position: fixed;
  left: 12px;
  bottom: 12px;
  z-index: 1030;
  padding: 0.4rem 0.8rem;
  background: #333;
  color: #fff;
  border: 1px solid #fff;
  border-radius: 6px;
  font-size: 0.8rem;
}

.motion-toggle:hover {
  background: #000;
}

html.motion-paused *,
html.motion-paused *::before,
html.motion-paused *::after {
  animation-play-state: paused !important;
}

/* Visitors who asked for reduced motion get the finished state straight away */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}