.hls-video{--padding:20px;--size:20px;--playerFg:#FFFFFF;--playerBg:#000000;--progressBg:#DDDDDD;--bufferBg:#888888;--playerFontFamily:inherit;--playerFontSize:14px;--segments2Width:3.7rem;--segments3Width:4.9rem;position:relative;display:flex;align-items:center;justify-content:center;width:100%;overflow:hidden;color:var(--playerFg);background-color:var(--playerBg);font-family:var(--playerFontFamily);font-size:var(--playerFontSize);line-height:1;-webkit-user-select:none;user-select:none}.hls-video .video-inner{width:100%;height:100%}.hls-video .video-inner video{display:block;width:100%;height:100%;object-fit:contain}.hls-video .video-controls{position:absolute;left:0;bottom:0;width:100%;display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:var(--padding);background-color:color-mix(in srgb,var(--playerBg),transparent 50%);transition:opacity .5s ease,transform .5s ease,visibility .5s ease}.hls-video.hide-controls .video-controls{opacity:0;visibility:hidden;transform:translateY(100%);pointer-events:none}.hls-video .btn-playpause{--btnSize:calc(0.8 * var(--size));-webkit-appearance:none;appearance:none;position:relative;display:block;width:var(--btnSize);height:var(--btnSize);flex-shrink:0;padding:0;border:0;background-color:transparent;cursor:pointer}.hls-video .btn-playpause:before{content:'';position:absolute;top:50%;left:calc(.1 * var(--btnSize));transform:translateY(-50%);display:block;width:0;height:calc(.5 * var(--btnSize));border-left:calc(.4 * var(--btnSize)) solid var(--playerFg);border-top:calc(.25 * var(--btnSize)) solid transparent;border-bottom:calc(.25 * var(--btnSize)) solid transparent;transition:border-left-width .2s ease,border-top-width .2s ease,border-bottom-width .2s ease,height .2s ease}.hls-video.is-playing .btn-playpause:before{height:var(--btnSize);border-left-width:calc(.333 * var(--btnSize));border-top-width:0;border-bottom-width:0}.hls-video .btn-playpause:after{content:'';position:absolute;top:50%;left:calc(.5 * var(--btnSize) - 1px);transform:translateY(-50%);display:block;width:0;height:0;border-left:calc(.4 * var(--btnSize)) solid var(--playerFg);border-top:calc(.25 * var(--btnSize)) solid transparent;border-bottom:calc(.25 * var(--btnSize)) solid transparent;transition:border-left-width .2s ease,border-top-width .2s ease,border-bottom-width .2s ease,height .2s ease,left .2s ease}.hls-video.is-playing .btn-playpause:after{left:calc(.5666 * var(--btnSize));height:var(--btnSize);border-left-width:calc(.333 * var(--btnSize));border-top-width:0;border-bottom-width:0}.hls-video .video-time-controls{display:flex;align-items:center;justify-content:space-between;gap:2rem;width:100%}.hls-video .current-time,.hls-video .total-time{flex-shrink:0;font-variant-numeric:tabular-nums}.hls-video .time-segments-2 .current-time,.hls-video .time-segments-2 .total-time{min-width:var(--segments2Width)}.hls-video .time-segments-3 .current-time,.hls-video .time-segments-3 .total-time{min-width:var(--segments3Width)}.hls-video .video-progress-container{position:relative;width:100%;height:var(--size);cursor:pointer}.hls-video .video-progress-buffer{position:absolute;top:50%;left:0;width:100%;height:calc(.3 * var(--size));transform:translateY(-50%);border-radius:.2rem;pointer-events:none}.hls-video .video-progress{position:absolute;top:50%;left:0;width:calc(100% * var(--progress));height:calc(.3 * var(--size));overflow:hidden;transform:translateY(-50%);transform-origin:left center;border-radius:.2rem;background-color:var(--progressBg);pointer-events:none}.hls-video .video-progress-hint{--position:0.5;position:absolute;top:calc(-1 * var(--size) - var(--padding) - 1rem);left:0;transform:translateX(calc(var(--position) - 50%));padding:.3rem .5rem;border-radius:.2rem;background-color:color-mix(in srgb,var(--playerBg),transparent 50%);opacity:0;transition:opacity .25s ease;pointer-events:none}.hls-video .video-progress-container.show-hint .video-progress-hint{opacity:1}.hls-video .video-right-controls{display:flex;align-items:center;justify-content:space-between;gap:2rem;width:100%}.hls-video .volume-control-container{position:relative;width:calc(2.5 * var(--size));height:calc(.3 * var(--size));flex-shrink:0;border-radius:.2rem;overflow:hidden;background-color:var(--bufferBg);cursor:pointer}.hls-video .volume-control{position:absolute;top:0;left:0;width:100%;height:100%;transform:scaleX(var(--volume));background-color:var(--progressBg);transform-origin:left center}.hls-video .btn-mute{--btnSize:calc(0.8 * var(--size));-webkit-appearance:none;appearance:none;position:relative;width:var(--btnSize);height:var(--btnSize);flex-shrink:0;padding:0;margin-left:-1rem;border:none;border-radius:0;background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='%23FFFFFF' viewBox='0 0 256 256'%3E%3Cpath d='M155.51,24.81a8,8,0,0,0-8.42.88L77.25,80H32A16,16,0,0,0,16,96v64a16,16,0,0,0,16,16H77.25l69.84,54.31A8,8,0,0,0,160,224V32A8,8,0,0,0,155.51,24.81ZM32,96H72v64H32ZM144,207.64,88,164.09V91.91l56-43.55Zm54-106.08a40,40,0,0,1,0,52.88,8,8,0,0,1-12-10.58,24,24,0,0,0,0-31.72,8,8,0,0,1,12-10.58ZM248,128a79.9,79.9,0,0,1-20.37,53.34,8,8,0,0,1-11.92-10.67,64,64,0,0,0,0-85.33,8,8,0,1,1,11.92-10.67A79.83,79.83,0,0,1,248,128Z'%3E%3C/path%3E%3C/svg%3E");background-size:cover;background-position:center;background-repeat:no-repeat;cursor:pointer}.hls-video.is-half-volume .btn-mute{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='%23FFFFFF' viewBox='0 0 256 256'%3E%3Cpath d='M155.51,24.81a8,8,0,0,0-8.42.88L77.25,80H32A16,16,0,0,0,16,96v64a16,16,0,0,0,16,16H77.25l69.84,54.31A8,8,0,0,0,160,224V32A8,8,0,0,0,155.51,24.81ZM32,96H72v64H32ZM144,207.64,88,164.09V91.91l56-43.55ZM208,128a39.93,39.93,0,0,1-10,26.46,8,8,0,0,1-12-10.58,24,24,0,0,0,0-31.72,8,8,0,1,1,12-10.58A40,40,0,0,1,208,128Z'%3E%3C/path%3E%3C/svg%3E")}.hls-video.is-muted .btn-mute{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='%23FFFFFF' viewBox='0 0 256 256'%3E%3Cpath d='M155.51,24.81a8,8,0,0,0-8.42.88L77.25,80H32A16,16,0,0,0,16,96v64a16,16,0,0,0,16,16H77.25l69.84,54.31A8,8,0,0,0,160,224V32A8,8,0,0,0,155.51,24.81ZM32,96H72v64H32ZM144,207.64,88,164.09V91.91l56-43.55Z'%3E%3C/path%3E%3C/svg%3E")}.hls-video .no-audio .btn-mute,.hls-video .no-audio .volume-control-container{display:none}.hls-video .quality-control,.hls-video .subtitles-control{--btnSize:calc(0.8 * var(--size));position:relative;text-align:right}.hls-video .video-controls:not(.has-subtitles) .subtitles-control{display:none}.hls-video .quality-current,.hls-video .subtitles-title{-webkit-appearance:none;appearance:none;position:relative;display:flex;gap:.4rem;padding:0;border:0;border-radius:0;color:var(--playerFg);background-color:transparent;cursor:pointer}.hls-video .quality-current:before,.hls-video .subtitles-title:before{content:'';display:block;width:var(--btnSize);height:var(--btnSize);background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='%23FFFFFF' viewBox='0 0 256 256'%3E%3Cpath d='M40,88H73a32,32,0,0,0,62,0h81a8,8,0,0,0,0-16H135a32,32,0,0,0-62,0H40a8,8,0,0,0,0,16Zm64-24A16,16,0,1,1,88,80,16,16,0,0,1,104,64ZM216,168H199a32,32,0,0,0-62,0H40a8,8,0,0,0,0,16h97a32,32,0,0,0,62,0h17a8,8,0,0,0,0-16Zm-48,24a16,16,0,1,1,16-16A16,16,0,0,1,168,192Z'%3E%3C/path%3E%3C/svg%3E");background-size:var(--btnSize);background-position:left center;background-repeat:no-repeat}.hls-video .subtitles-title:before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='%23FFFFFF' viewBox='0 0 256 256'%3E%3Cpath d='M224,48H32A16,16,0,0,0,16,64V192a16,16,0,0,0,16,16H224a16,16,0,0,0,16-16V64A16,16,0,0,0,224,48Zm0,144H32V64H224V192ZM48,136a8,8,0,0,1,8-8H72a8,8,0,0,1,0,16H56A8,8,0,0,1,48,136Zm160,0a8,8,0,0,1-8,8H104a8,8,0,0,1,0-16h96A8,8,0,0,1,208,136Zm-48,32a8,8,0,0,1-8,8H56a8,8,0,0,1,0-16h96A8,8,0,0,1,160,168Zm48,0a8,8,0,0,1-8,8H184a8,8,0,0,1,0-16h16A8,8,0,0,1,208,168Z'%3E%3C/path%3E%3C/svg%3E")}.hls-video .quality-control.show .quality-current:before{transform:scaleX(-1)}.hls-video .quality-options,.hls-video .subtitles-options{--listPadding:0.7rem;--listGap:0.8rem;position:absolute;right:calc(-1 * var(--listPadding));bottom:calc(var(--btnSize) + var(--padding) + 2px);min-width:calc(100% + 2 * var(--listPadding));display:flex;flex-direction:column;gap:0;padding:var(--listPadding) 0;background-color:color-mix(in srgb,var(--playerBg),transparent 50%);transition:opacity .25s ease;opacity:0;pointer-events:none}.hls-video .quality-control.show .quality-options,.hls-video .subtitles-control.show .subtitles-options{opacity:1;pointer-events:all}.hls-video .quality-options li,.hls-video .subtitles-options li{padding:calc(.5 * var(--listGap)) var(--listPadding);white-space:pre;cursor:pointer}.hls-video .quality-options li.current,.hls-video .subtitles-options li.current{background-color:color-mix(in srgb,var(--playerBg),transparent 50%)}.hls-video .btn-fullscreen{--btnSize:calc(0.8 * var(--size));-webkit-appearance:none;appearance:none;position:relative;width:calc(1.25 * var(--btnSize));height:calc(.6875 * var(--btnSize));flex-shrink:0;padding:0;border:.1rem solid var(--playerFg);border-radius:.2rem;background-color:var(--playerFg);cursor:pointer;transition:background-color .2s ease}.hls-video.is-fullscreen .btn-fullscreen{background-color:transparent}.hls-video .loading-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:calc(3 * var(--size));padding:calc(.33 * var(--size));aspect-ratio:1;border-radius:50%;background:var(--playerFg);-webkit-mask:conic-gradient(#0000 25%,#000),linear-gradient(#000 0 0) content-box;mask:conic-gradient(#0000 25%,#000),linear-gradient(#000 0 0) content-box;-webkit-mask-composite:source-out;mask-composite:subtract;opacity:0;pointer-events:none}.hls-video.is-stalling .loading-indicator{opacity:1;animation:rotate 3s infinite linear}@keyframes rotate{to{transform:translate(-50%,-50%) rotate(1turn)}}