/* Reset, document typography, and the global motion preference. */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html:focus-within{scroll-behavior:smooth}
body{margin:0;background:var(--void);color:var(--ink);font-family:var(--sans);
  font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:var(--disp);font-weight:500;letter-spacing:-.04em;line-height:1.04;margin:0}
p{margin:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--live);outline-offset:4px;border-radius:5px}
::selection{background:rgba(255,61,190,.3)}

/* Reduced motion: everything stops. Component-level fallbacks live in their
   own stylesheets, next to the rule they undo. */
@media (prefers-reduced-motion:reduce){
  html:focus-within{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important}
}
