/* Shared link feedback and native navigation across all public pages. */
a[href] {
  transition: color 180ms ease, background-color 180ms ease,
    border-color 180ms ease, opacity 180ms ease,
    text-decoration-color 180ms ease, text-underline-offset 180ms ease;
}

.masthead nav a,
.charter-index a {
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: transparent;
  text-underline-offset: 8px;
}

.masthead nav a:is(:hover, :focus-visible),
.charter-index a:is(:hover, :focus-visible),
.masthead nav a[aria-current="page"] {
  text-decoration-color: currentColor;
  text-underline-offset: 5px;
}

.charter-index a:focus-visible { color: var(--ink); }
.wordmark:is(:hover, :focus-visible) { opacity: .72; }
.text-link:focus-visible { color: #807044; }
.closing-invitation .text-link:focus-visible { color: var(--marble); }
.button.primary:focus-visible { background: #405140; border-color: #405140; }
.realm-link:focus-visible { background: var(--green-dim); }
.site-footer a:is(:hover, :focus-visible) { color: var(--green); text-underline-offset: 6px; }
a[href]:active { opacity: .78; }

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }

  /* Same-origin page changes retain native link, history, and focus behavior. */
  @view-transition { navigation: auto; }

  ::view-transition-group(root) { animation-duration: 240ms; }
  ::view-transition-old(root) { animation: 180ms ease-out both navigation-out; }
  ::view-transition-new(root) { animation: 240ms ease-in-out both navigation-in; }

  @keyframes navigation-out { to { opacity: 0; } }
  @keyframes navigation-in { from { opacity: 0; } }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  a[href] { transition: none; }
  @view-transition { navigation: none; }
}
