/*
 * P0 functional recovery only: reclaim a usable mobile seek row.
 * The separate owner-requested art-direction pass is intentionally not defined here.
 */
@media (max-width: 640px) {
  body.kb-watch-page .kb-watch-experience .plyr--video .kb-player-timecode {
    display: none !important;
  }

  /*
   * Premium timecode normally hides Plyr's native nodes after mount. Keep those
   * updates available to assistive technology without reserving visual transport
   * width: the seek range remains the visible timing affordance on phones.
   */
  body.kb-watch-page .kb-watch-experience .plyr--video.kb-player-timecode-ready .plyr__time--current,
  body.kb-watch-page .kb-watch-experience .plyr--video.kb-player-timecode-ready .plyr__time--duration {
    display: block !important;
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    min-width: 1px !important;
    min-height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  body.kb-watch-page .kb-watch-experience .plyr--video .plyr__controls {
    flex-wrap: wrap;
    gap: 2px 4px;
    padding: 8px 10px !important;
  }

  body.kb-watch-page .kb-watch-experience .plyr--video .plyr__controls > .plyr__controls__item {
    margin-left: 0;
  }

  body.kb-watch-page .kb-watch-experience .plyr--video .plyr__controls > .plyr__controls__item:first-child {
    margin-right: 0;
  }

  body.kb-watch-page .kb-watch-experience .plyr--video .plyr__controls > .plyr__progress__container {
    order: 10;
    flex: 1 0 100%;
    min-width: 0;
  }
}

@media (max-width: 359px) {
  /*
   * With the reclaimed progress row, the trailing Settings trigger can wrap
   * onto a short final row. Its legacy absolute menu then anchors a 280px
   * panel to that trigger's narrow left edge and crops the first proxy.
   * Keep the existing menu and actions, but make only this narrow-screen panel
   * a viewport-bounded sheet.
   */
  body.kb-watch-page .kb-watch-experience .plyr--video .plyr__menu__container {
    position: fixed;
    top: auto;
    right: calc(8px + env(safe-area-inset-right, 0px));
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    left: calc(8px + env(safe-area-inset-left, 0px));
    width: auto;
    max-width: none;
  }
}