:root {
  color-scheme: light dark;
}

body {
  background: Canvas;
  color: CanvasText;

  margin: 0;
  padding: 1rem;

  min-height: 94dvh;

  display: grid;
  grid-template-rows:auto 1fr auto;
}
.logo {
  animation: spin 600s linear infinite;
  opacity: .95;
  display: block;
  height: 2.5em;
  width: auto;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .logo {
    animation: none;
  }
}

header {
  display: grid;
  grid-template-columns:auto 1fr; /* Site title and the main menu */
  gap: 1rem;
  align-items: center;
}

header nav {
  margin: auto;
}
header nav li {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  align-items: center;
}


footer {
  text-align: center;
}