html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

body {
  position: fixed;
  inset: 0;
  height: 100dvh;
  max-height: 100dvh;
}

#atmosphere {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  z-index: 0;
  pointer-events: none;
  display: block;
}

main {
  position: relative;
  z-index: 1;
  min-width: 0;
  max-width: 100%;
  max-height: 100%;
}

.wordmark {
  transition: filter 180ms linear;
}

.wordmark.warm {
  filter: brightness(1.12) saturate(1.25);
}