.custom-video-player{position:relative;width:100vw;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;background:#000;-moz-user-select:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none;overflow:hidden}.custom-video-player.scroller-mode{width:100%;height:calc(100vh - 120px);display:flex;align-items:center;justify-content:center}.custom-video-player video{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;border:var(--md-sys-color-outline-variant) 2px solid}.scroller-mode video{max-height:calc(100vh - 120px);width:100%;height:auto;border:none}.custom-video-player-close-button{position:absolute;top:16px;left:16px;font-size:24px;padding-bottom:6px;color:var(--md-sys-color-on-surface);background:var(--md-sys-color-surface-container);border:none;border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s ease;z-index:10000;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.custom-video-player-close-button:hover{background:var(--md-sys-color-on-surface-variant)}.play-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;opacity:.8;transition:opacity .2s}.play-overlay:hover{opacity:1}.video-controls{position:absolute;bottom:0;bottom:env(safe-area-inset-bottom);left:0;right:0;padding:20px;padding-bottom:max(20px,env(safe-area-inset-bottom));background:linear-gradient(transparent,#0006);opacity:0;transition:opacity .3s}.video-controls.visible{opacity:1}.progress-bar-container{width:100%;height:3px;background:#fff3;cursor:pointer;border-radius:1.5px;position:relative;transition:height .2s ease;-moz-user-select:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none}.progress-bar-hitbox{position:absolute;top:-10px;left:0;right:0;height:30px;cursor:pointer;z-index:5000}.progress-controls-area{position:absolute;left:0;right:0;height:120px;padding:0 20px;transform:translateY(0);transition:transform .3s ease}.progress-controls-area:hover{transform:translateY(-3.5em)}.progress-bar{height:100%;background:var(--md-sys-color-secondary);border-radius:1.5px;position:relative}.progress-bar:after{content:"";position:absolute;right:-6px;top:50%;transform:translateY(-50%);width:24px;height:24px;background:var(--md-sys-color-primary);border-radius:50%;opacity:0;transition:opacity .2s ease}.progress-bar-container:hover .progress-bar:after{opacity:1}.controls-panel{margin-top:1em;display:flex;align-items:center;gap:2em;opacity:0;transition:opacity .3s ease;margin-bottom:1em}.progress-controls-area:hover .controls-panel{opacity:1}.controls-button{background:var(--md-sys-color-surface-container);border-radius:50%;padding:.5em;color:var(--md-sys-color-on-surface-container);outline:none}.controls-button:hover{background:var(--md-sys-color-surface-container-highest);color:var(--md-sys-color-on-surface-container-highest);transform:translateY(-1px);transition:all .2s ease}.volume-container{display:flex;align-items:center;gap:.5em}.fullscreen-button{margin-left:auto}.volume-slider-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;max-width:200px;width:100%;border-radius:10px;border:none;height:1em;padding:1.25em .5em;background:var(--md-sys-color-surface-container);margin-top:.3em;outline:none}.volume-slider-input::-webkit-slider-thumb{-webkit-appearance:none;background:var(--md-sys-color-secondary);width:1em;height:1em;border-radius:50%;margin-top:-.35em;cursor:pointer}.volume-slider-input::-webkit-slider-thumb:hover{transform:scale(1.2);-webkit-transition:all .2s ease;transition:all .2s ease}.volume-slider-input::-webkit-slider-runnable-track{height:3px;border-radius:1.5px;background:var(--md-sys-color-on-surface)}.volume-slider-input::-moz-range-thumb{background:var(--md-sys-color-on-surface);width:1em;height:1em;border:none;border-radius:50%;cursor:pointer}.volume-slider-input::-moz-range-track{height:3px;border-radius:1.5px;background:var(--md-sys-color-on-surface)}.time-display{color:#fff}@media (max-width: 768px){.controls-panel{display:none}.progress-controls-area:hover{transform:translateY(0)}.progress-bar:after{display:none}}