@import url('https://fonts.cdnfonts.com/css/perfect-dos-vga-437');
@import url('https://fonts.googleapis.com/css2?family=Inconsolata&display=swap');

:root {
  --light-text-color: black;
  --light-bg-color: white;
  --light-link-color: darkblue;
  --dark-text-color: white;
  --dark-bg-color: rgb(26, 25, 25);
  --dark-subtitle-color: #cdd1d0;
  --dark-link-color: lightblue;
  --light-subtitle-color: #1e1f1f;
  --text-color: var(--light-text-color);
  --bg-color: var(--light-bg-color);
  --subtitle-color: var(--light-subtitle-color);
  --link-color: var(--light-link-color);
  color: var(--text-color);
  --font-family: "Inconsolata";
  font-family: var(--font-family), monospace;

}

@media (prefers-color-scheme: dark) {

  :root {
    --text-color: var(--dark-text-color);
    --bg-color: var(--dark-bg-color);
    --subtitle-color: var(--dark-subtitle-color);
    --link-color: var(--dark-link-color);
  }
}


path[fill="black"] {
  fill: var(--text-color);
}

path[fill="white"] {
  fill: var(--bg-color);
}

.navbar {
  align-self: self-start;
  display: flex;
  flex-direction: row;
  justify-content: end;
  gap: 2rem;
  padding: 1rem;
  padding-top: 1rem;
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
  width: 100%;
  box-sizing: border-box;
}

.navbar * {
  color: inherit;
}

.navbar * {
  font-size: 1rem;
}

*:visited {
  color: var(--text-color);
}

* {
  scrollbar-width: thin;
  scrollbar-color: var(--text-color) var(--bg-color);
}

body {
  background-color: var(--bg-color);
}

a {
  color: inherit;
  text-decoration: none;
}