:root{
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.2,.8,.2,1);
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --sans: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  --serif: ui-serif, Georgia, "Times New Roman", Times, serif;
}

*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;-webkit-font-smoothing:antialiased;overflow-x:hidden}

a{color:inherit}
.mono{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;font-size:.72rem}

.srOnly{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* Reveal (shared) */
.reveal{
  opacity:0;
  transform:translateY(14px);
  transition:opacity 900ms var(--ease-out), transform 900ms var(--ease-out);
  transition-delay:calc(var(--reveal-i, 0) * 70ms);
}
.reveal.isIn{
  opacity:1;
  transform:translateY(0);
}

@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none}
}