a.darkmode {
  position: fixed;
  top: 2em;
  right: 2em;
  color: var(--text);
  background: var(--card-background);
  height: 3em;
  width: 3em;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid var(--border);
  box-shadow: var(--shadow-md);
  transition: 0.2s ease box-shadow, 0.2s ease transform, 0.3s ease background, 0.3s ease color;
  z-index: 1000;
  text-decoration: none;
  font-size: 1.15em;
}

a.darkmode:hover {
  transform: scale(1.1) rotate(15deg);
  box-shadow: var(--shadow-lg);
  color: var(--blue-light);
}

@media only screen and (max-width: 600px) {
  a.darkmode {
    top: unset;
    bottom: 1em;
    right: 1em;
  }
}