/* clipperol.css
   Constrains #clipperol to match the surrounding content width (~960px)
   and centres it within whatever Bootstrap container wraps it.
   The inner .cnpx-player is self-sizing at 16:9 via aspect-ratio.    */

#clipperol {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
}

/* Poster phase: cover fills the frame without black bars.
   cnpx-preplay is on the player before first play; removed by cnpx-player.js on play start.
   After removal, cnpx-player.css global object-fit: contain takes over for playback.
   Scoped to #clipperol — gallery players unaffected. */
#clipperol .cnpx-player.cnpx-preplay .cnpx-vid {
  object-fit: cover;
}