.media-desk.compact.document-open .media-desk-tools {
  position: sticky;
  top: 0;
  z-index: 3;
  flex: none;
  background: var(--mp-panel, #141b22);
}

.media-desk.compact.document-open .media-desk-layout {
  flex: none;
  height: var(--document-height, 70dvh);
}

.media-desk.compact .desk-mobile-player {
  min-width: 0;
}

.media-desk.compact.document-open .desk-mobile-player {
  position: absolute;
  inset: 0;
  isolation: isolate;
  overflow: hidden;
}

.media-desk.compact .desk-document-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  background: var(--mp-panel, #17202a);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  container-type: size;
}

.media-desk.compact .desk-document-overlay[hidden] {
  display: none;
}

.media-desk.compact .desk-document-overlay :is(.transcript-workspace,.script-panel) {
  flex: 1 0 0;
  min-height: 0;
  height: auto;
}

.desk-document-overlay :is(.script-paper-scroll,.transcript-scroll) {
  overscroll-behavior-y: contain;
}

@media (orientation: landscape) and (pointer: coarse) {
  .media-desk.compact:has(.player-viewport-fullscreen):not(.document-open) .media-desk-tools {
    position: fixed;
    inset: 0 0 auto;
    z-index: 1001;
    background: var(--mp-panel, #141b22);
  }

  .media-desk.compact.document-open {
    position: fixed;
    inset: 0;
    z-index: 1002;
    height: auto;
  }
}

/* With a keyboard or in landscape the tools can fill the available space.
   Let the whole document scroll then, including its editing controls. */
@container (max-height: 380px) {
  .media-desk.compact .desk-document-overlay :is(.script-panel,.transcript-workspace,.transcript-panel) {
    height: auto;
    flex: none;
    overflow: visible;
  }
  .desk-document-overlay :is(.script-paper-scroll,.transcript-scroll,.transcript-bottom) {
    flex: none;
    max-height: none;
    overflow: visible;
  }
}