.video-popup-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgb(0 0 0 / .9);display:none;align-items:center;justify-content:center;z-index:9999;animation:fadeIn 0.3s ease}.video-popup-modal.active{display:flex}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.video-popup-container{position:relative;width:90%;max-width:900px;max-height:90vh;background:#000;border-radius:8px;overflow:hidden;box-shadow:0 10px 40px rgb(0 0 0 / .5);animation:slideUp 0.3s ease}@keyframes slideUp{from{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.video-popup-close{position:absolute;top:15px;right:15px;width:40px;height:40px;background:rgb(255 255 255 / .2);border:none;color:#fff;font-size:28px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:4px;z-index:10001;transition:all 0.3s ease}.video-popup-close:hover{background:rgb(255 255 255 / .3)}.video-popup-close:active{transform:scale(.9)}.video-popup-content{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:visible}.video-popup-content video,.video-popup-content iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.video-popup-content .video-autoplay-controls{position:absolute;bottom:1.5625rem;right:1.5625rem;z-index:20}.video-popup-controls{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgb(0 0 0 / .8),transparent);padding:30px 15px 15px;display:flex;align-items:center;gap:10px;z-index:100;opacity:0;transition:opacity 0.3s ease}.video-popup-content:hover .video-popup-controls{opacity:1}.video-popup-controls.always-visible{opacity:1}.video-control-button{width:40px;height:40px;background:rgb(255 255 255 / .2);border:none;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all 0.3s ease;flex-shrink:0}.video-control-button:hover{background:rgb(255 255 255 / .3)}.video-control-button:active{transform:scale(.9)}.video-control-button svg{width:20px;height:20px}.video-progress-bar{flex:1;height:4px;background:rgb(255 255 255 / .2);border-radius:2px;cursor:pointer;position:relative;margin:0 5px}.video-progress-bar:hover{height:6px;margin:-1px 5px}.video-progress-fill{height:100%;background:linear-gradient(90deg,#2ecc71 0%,#27ae60 100%);border-radius:2px;width:0%;transition:width 0.1s linear}.video-time-display{color:#fff;font-size:12px;white-space:nowrap;font-family:'Courier New',monospace;min-width:50px;text-align:right}@media (max-width:768px){.video-popup-container{width:95%;max-height:85vh}.video-popup-close{width:36px;height:36px;font-size:24px;top:10px;right:10px}.video-popup-controls{padding:20px 10px 10px;gap:8px}.video-control-button{width:36px;height:36px}.video-control-button svg{width:18px;height:18px}.video-time-display{font-size:11px;min-width:45px}}@media (max-width:480px){.video-popup-container{width:100%;max-height:80vh;border-radius:0}.video-popup-close{width:32px;height:32px;font-size:20px}.video-popup-controls{padding:15px 8px 8px;gap:6px}.video-control-button{width:32px;height:32px}.video-control-button svg{width:16px;height:16px}.video-time-display{font-size:10px;min-width:40px}}