.reader-page {
  display: flex;
  flex-direction: column;
}

.reader-page .toolbar {
  flex: 0 0 auto;
}

.reader-page .reader-stage {
  flex: 1;
  min-height: 0;
  height: auto;
}

@media (max-width: 700px) {
  .tools {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }

  .tools::-webkit-scrollbar {
    display: none;
  }

  .tools > * {
    flex: 0 0 auto;
  }

  .tools .home-link {
    white-space: nowrap;
  }

  .reader-stage {
    flex: 1;
    min-height: 0;
    height: auto;
    margin-left: 0;
    padding: 8px;
    overflow: auto;
  }

  .reader-stage canvas,
  .page-preview {
    width: auto !important;
    max-width: 100%;
    height: auto !important;
  }

  .page-turn {
    top: 58%;
    width: 42px;
    height: 66px;
    font-size: 34px;
  }

  .page-turn:disabled {
    visibility: hidden;
  }
}