#main-content {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: #333 #000;
  scroll-behavior: smooth;
  background-color: #000;
  color: #fff;
  clip-path: circle(0px at 50% 50%);
  transition: clip-path 0.8s cubic-bezier(0.65, 0, 0.35, 1);
  z-index: 999;
  pointer-events: none;
}

/* focused (without a ring) after a keyboard reveal so arrow keys scroll it */
#main-content:focus {
  outline: none;
}

@media (prefers-reduced-motion: reduce) {
  #main-content {
    transition: none;
    scroll-behavior: auto;
  }
}