div#reader-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
}

.reader-backdrop {
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgb(0 0 0 / 84%);
}

.reader-body {
  position: absolute;
  width: 95vw;
  height: 95vh;
  background: #d7dbdf;
  top: 50%;
  left: 50%;
  overflow-x: hidden;
  border-radius: 8px;
  transform: translate(-50%, -50%);
  display: block;
}

.reader-head {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  background: #fff;
  height: 56px;
  overflow: hidden;
}

/* .canvas-text-layer {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  opacity: 0.2;
  line-height: 1;
}

.canvas-text-layer > div {
  color: transparent;
  position: absolute;
  white-space: pre;
  cursor: text;
  transform-origin: 0% 0%;
} */
.textLayer {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  color: #000;
  font-family: sans-serif;
  overflow: hidden;
}

.textLayer > div {
  color: transparent;
  position: absolute;
  line-height: 1;
  white-space: pre;
  cursor: text;
}
