:root {
  --motion-press: 90ms;
  --motion-feedback: 120ms;
  --motion-state: 240ms;
  --motion-panel: 320ms;
  --motion-reveal: 640ms;
  --motion-stagger: 40ms;
  --motion-stagger-steps: 5;
  --motion-distance-rise: 8px;
  --motion-entrance: 240ms;
  --motion-title: 320ms;
  --motion-entrance-stagger: 40ms;
  --motion-entrance-stagger-steps: 5;
  --motion-distance-entrance: 8px;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-enter: cubic-bezier(0.05, 0.7, 0.1, 1);
  --ease-entrance: cubic-bezier(0.05, 0.7, 0.1, 1);
}
main {
  overflow-x: clip;
}
.motion-pending {
  opacity: 0;
}
.motion-pending:focus-within {
  opacity: 1;
}
.title-line {
  display: block;
  overflow: clip;
}
.title-line > [data-motion-line] {
  display: block;
}
button,
.button {
  transition:
    background-color var(--motion-feedback) var(--ease-standard),
    color var(--motion-feedback) var(--ease-standard),
    transform var(--motion-press) var(--ease-standard);
}
button:active,
.button:active {
  transform: translateY(1px);
}
.button > span[aria-hidden],
.text-link > span[aria-hidden] {
  display: inline-block;
  transition: transform var(--motion-feedback) var(--ease-standard);
}
@media (hover: hover) and (pointer: fine) {
  .button:hover > span[aria-hidden],
  .text-link:hover > span[aria-hidden] {
    transform: translate(2px, -2px);
  }
}
summary > span {
  transition: transform var(--motion-state) var(--ease-standard);
}
details[open] > :not(summary) {
  animation: detail-settle var(--motion-state) var(--ease-enter);
}
@keyframes detail-settle {
  from {
    opacity: 0.5;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@media (max-width: 900px) {
  .menu-toggle[aria-expanded="true"] + nav {
    animation: menu-arrive var(--motion-panel) var(--ease-enter);
  }
}
@keyframes menu-arrive {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-press: 0ms;
    --motion-feedback: 0ms;
    --motion-state: 0ms;
    --motion-panel: 0ms;
    --motion-reveal: 0ms;
    --motion-stagger: 0ms;
    --motion-distance-rise: 0px;
    --motion-entrance: 0ms;
    --motion-title: 0ms;
    --motion-entrance-stagger: 0ms;
    --motion-distance-entrance: 0px;
  }
  .motion-pending {
    opacity: 1;
  }
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
  .button:active,
  button:active {
    transform: none;
  }
}
@media print {
  .motion-pending,
  [data-motion-item] {
    opacity: 1 !important;
    transform: none !important;
  }
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
}
