@font-face {
  font-family: "recu";
  src: url("/recultramin.woff2") format("woff2");
  font-weight: 400 750;
  font-style: normal;
  font-display: swap;
  font-variation-settings:
    "CASL" 0.25,
    "MONO" 0;
  font-style: oblique -15deg 0deg;
  unicode-range: U+0020-007E;
}
@font-face {
  font-family: "rmo";
  src: url("/recmono.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
  font-variation-settings:
    "CASL" 0.25,
    "MONO" 1;
  font-style: oblique -15deg 0deg;
  unicode-range: U+0020-007E;
}
@font-face {
  font-family: "rmo";
  src: url("/recmonorest.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
  font-variation-settings:
    "CASL" 0.25,
    "MONO" 1;
  font-style: oblique -15deg 0deg;
  unicode-range:
    U+00C0-00FF, U+00A9, U+2190-2193, U+2018, U+2019, U+201C, U+201D, U+2022,
    U+00A0-00A8, U+00AA-00BF, U+2194-2199, U+0100-017F;
}

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

body {
  font-family: "recu", sans-serif;
  background-color: var(--bg);
  color: var(--fg);
  word-break: break-word;
}

main {
  margin: auto;
  max-width: 80ch;
  padding: 1em;
}

h1 {
  font-size: 2em;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
ul,
ol {
  margin-top: 1em;
  margin-bottom: 1rem;
}

ul,
ol {
  padding-left: 1em;
}

li {
  margin: 0.5em 0;
}

a {
  text-decoration: none;
}
a:where([href]:not(.custom)) {
  color: var(--primary);
  margin: -0.2rem -0.3rem;
  padding: 0.2rem 0.3rem;
  border-radius: 4px;
  &:hover {
    text-decoration: underline;
    font-weight: 600;
    color: var(--primary);
    color: lch(from var(--primary) calc(l) calc(c + 30) h);
  }
  &:active {
    text-decoration: underline;
    font-weight: 600;
    text-decoration: none;
    color: black;
    background-color: var(--primary);
    background-color: lch(from var(--primary) l calc(c + 20) calc(h - 90));
    text-shadow: none;
  }
}

code {
  font-family: "rmo", monospace;
  font-size: inherit;
}