:root {
  --text: #292929;
  --text-muted: #6c6c6c;
  --background: #fffefa;
  --primary: #000000;
  --secondary: #ffffff;
  --accent: #ff2222;

  interpolate-size: allow-keywords;
  scroll-behavior: smooth;
}

html {

  &::-webkit-scrollbar {
    width: 0.25rem;
    height: 0.25rem;
    background-color: var(--background);
  }

  &::-webkit-scrollbar-thumb {
    background-color: var(--text);
    border-radius: 0.5rem;
    border: 0.5rem solid var(--text-muted);
  }

  &::-webkit-scrollbar-track {
    background-color: var(--background);
    border-radius: 0.5rem;
    border: 0.5rem solid var(--background);
  }
}

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

@font-face {
  font-family: "nikyou";
  src: url("./nikyou.ttf");
}

@font-face {
  font-family: "alexandria";
  src: url("./alexandria.ttf");
}

@font-face {
  font-family: "regular";
  src: url("./regular.ttf");
}

body {
  font-family: "nikyou";
  background-color: var(--background);
  color: var(--text);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "nikyou";
}

a,
button {
  color: var(--text);
  text-decoration: none;
  font-family: "nikyou";
}