@import url(/global.css);

#lilraven {
  position: absolute;
  top: 1rem;
}

#lamp-chain {
  position: absolute;
  top: 0;
  right: 1rem;
  margin: 0;
  padding: 0;
  max-width: 1rem;
  text-align: center;
  user-select: none;
  cursor: pointer;
}

#illumination {
  --base-size: 5vh;
  --beam-size: 55vh;
  display: none;

  position: absolute;
  align-items: center;
  justify-content: center;
  height: var(--beam-size);
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
}

#light-beam {
  border-left: var(--beam-size) solid transparent;
  border-right: var(--beam-size) solid transparent;
  border-bottom: var(--beam-size) solid var(--light);
  padding-left: var(--base-size);
  padding-right: var(--base-size);
}

#doorway {
  background: black;
  border: 2px solid var(--dark);
  position: absolute;
  height: 80%;
  bottom: 0;
  margin: 0 auto;
  perspective: 20in;
}

#door {
  height: 100%;
  border: 2px solid var(--dark);
  transition: all 0.5s ease-out;
  transform-origin: left;
}

#door:hover {
  rotate: 0 1 0 -25deg;
}