*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  margin:0;
  min-height:100vh;
  min-height:100dvh;
  background:var(--bg);
  color:var(--text);
  font-family:var(--f-body);
  font-size:var(--fs-md);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  padding:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0);
}
img,svg{display:block;max-width:100%}
p,figure,ul,ol,dl,dd{margin:0}
ul[role="list"],ol[role="list"]{list-style:none;padding:0}
a{color:inherit;text-underline-offset:.2em}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
[hidden]{display:none !important}

h1,h2,h3{font-family:var(--f-display);font-weight:600;margin:0;letter-spacing:-.025em;line-height:1.1;text-wrap:balance}
h1{font-size:var(--fs-2xl)}
h2{font-size:var(--fs-xl)}
h3{font-size:var(--fs-lg);letter-spacing:-.01em}

:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
[tabindex="-1"]:focus{outline:none}

::selection{background:var(--accent);color:var(--on-accent)}

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

.skip-link{
  position:absolute;left:var(--gutter);top:-80px;z-index:100;
  background:var(--accent);color:var(--on-accent);
  padding:var(--sp-3) var(--sp-4);border-radius:var(--radius-sm);
  font-weight:600;text-decoration:none;
}
.skip-link:focus{top:calc(env(safe-area-inset-top,0px) + var(--sp-3))}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}

.dot{color:var(--accent)}
.muted{color:var(--muted)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}