@use "reset";

html {
  font-size: 62.5%;
}

body {
  --anchor-color: #f0f;
  --anchor-hover: #000;

  background-color: #000;
  color: #000;
  font-family: sans-serif;
  font-size: 2rem;
}

a {
  color: var(--anchor-color);
  font-weight: bold;
  text-decoration: 2px dotted underline;

  &:hover {
    background-color: var(--anchor-color);
    color: var(--anchor-hover);
  }
}

button {
  cursor: pointer;
}

:focus {
  outline: 2px dotted #f0f;
}

.monospace {
  font-family: monospace;
}

.divider {
  border-top: 2px dotted var(--foreground-1);
  margin-bottom: 2rem;
  margin-top: 2rem;
}

@use "components/page-footer";
@use "components/page-header";
@use "components/page-main";
@use "components/listenbrainz";