*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-padding-top: 80px; }

body {
  margin: 0;
  background: var(--desk);
  color: var(--ink);
  font: 400 var(--t-m)/1.6 var(--font);
  font-feature-settings: "tnum" 0;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 { color: var(--ink); text-wrap: balance; }
h1 { font-size: var(--t-3xl); line-height: 1.12; font-weight: 750; letter-spacing: -0.022em; margin: 0; }
h2 { font-size: var(--t-xl); line-height: 1.25; font-weight: 700; letter-spacing: -0.01em; margin: 0 0 14px; }
h3 { font-size: var(--t-l); line-height: 1.3; font-weight: 700; margin: 0 0 8px; }
p { margin: 0 0 12px; text-wrap: pretty; }

a { color: var(--link); text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }

code, pre, kbd, .mono { font-family: var(--mono); font-size: .875em; }
:not(pre) > code {
  background: var(--code-bg);
  border: 1px solid var(--rule);
  padding: .05em .35em;
  border-radius: var(--r-s);
  font-size: .86em;
  overflow-wrap: anywhere;
}

kbd, .kbd {
  font: 500 var(--t-xs)/1 var(--mono);
  padding: 3px 5px;
  border-radius: var(--r-s);
  border: 1px solid currentColor;
  opacity: .62;
  white-space: nowrap;
}

hr { border: 0; border-top: 1px solid var(--rule); margin: 28px 0; }

::selection { background: color-mix(in srgb, var(--mark) 70%, transparent); color: var(--ink); }

:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; border-radius: var(--r-s); }

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

.muted { color: var(--muted); }
.small { font-size: var(--t-s); }
.xsmall { font-size: var(--t-xs); }
.num { font-variant-numeric: tabular-nums; }
.nowrap { white-space: nowrap; }
.prose { max-width: 68ch; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: 0s !important;
    animation-duration: 0s !important;
    scroll-behavior: auto !important;
  }
}