#scene-wrapper {
   width: 50vw;
   height: 70vh;
   overflow: auto;
}

#overlay.fade-in {
   animation: fade-in 2s forwards;
}

@keyframes fade-in {
   0% {
      opacity: 0;
   }

   100% {
      opacity: 1;
   }
}

.fade-out {
   animation: fade-out 2s forwards;
}

@keyframes fade-out {
   0% {
      opacity: 1;
   }

   100% {
      opacity: 0;
   }
}

/* default twee-context appearance */
.twee-context {
   max-width: 80vw;

   .twee-passage:not(:first-child) {
      border-top: 1px solid;
   }

   .twee-passage {
      animation: fade-in .5s ease-in-out;
   }

   a {
      margin-block: .1rem;
      display: block;
      cursor: pointer;
   }

   p {
      margin-block: .4rem;
   }
}

.story-scene {
   max-height: 80vh;
   font-size: 1.1rem;
   max-width: 60vw;

   .twee-passage {
      padding-block: .5em;
   }

}