@use "modern-normalize/modern-normalize.css";
@use "reset";
@use "love";

html {
  font-size: 62.5%;
}

body {
  --background-1: var(--db-1);
  --background-2: var(--db-2);
  --foreground-1: var(--df-1);
  --foreground-2: var(--df-2);
  --spacing-04: 04px;
  --spacing-08: 08px;
  --spacing-16: 16px;
  --spacing-32: 32px;
  --spacing-48: 48px;
  --spacing-64: 64px;

  background-color: var(--background-1);
  color: var(--foreground-1);
  font-family: Inter, sans-serif;
  font-size: 1.6rem;
}

a {
  color: var(--foreground-1);
  text-decoration: 0.1rem dotted underline;

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

:focus {
  outline: 2px dotted var(--foreground-1);
}