@font-face {
  font-family: "Space Grotesk";
  src: url("../fonts/Space Grotesk/SpaceGrotesk-VariableFont_wght.ttf");
}

:root {
  --text: hsl(0, 10%, 10%);
  --border: hsl(0, 10%, 5%);
  --gradient-from: white;
  --gradient-to: var(--text);
}

body {
  max-width: 45rem;
  margin-inline: auto;
  padding-inline: 1rem;

  color: var(--text);
  font-size: 1.125rem;
  font-family: "Space Grotesk", sans-serif;

  background:
    linear-gradient(var(--gradient-from), var(--gradient-to)),
    var(--gradient-to);
  background-repeat: no-repeat;
  background-size: 100% 1000rem;
  background-attachment: scroll;
}
h1 {
  margin-bottom: 0px;
}
hr {
  border: none;
  background-color: var(--text);
  height: 1px;
}
a,
a:visited {
  color: var(--text);
}
#graveyard > div {
  padding: 1rem;
  border: 1px solid var(--border);

  &:has(> .light-up) {
    background-color: var(--gradient-from);
  }
}
blockquote > cite {
  display: block;
  width: fit-content;
  margin-inline-start: auto;
}
.date-display {
  width: fit-content;
  margin-left: auto;
  color: var(--border);
}