#videopapabox{width: min(650px , 100%);margin: 0 auto;}
#videopapabox .time *{color: white;}
#videopapabox .player{max-width:720px;width:90vw;background:#1f1f1f;border-radius:12px;overflow:hidden;box-shadow:0 0 20px #00bcd4aa;display:flex;flex-direction:column}
#videopapabox video{width:100%;display:block;aspect-ratio:16/9;background:#000}
#videopapabox .controls{display:flex;flex-direction:column;padding:12px 16px;background:#222}
#videopapabox .progress-container{position:relative;height:10px;background:#444;border-radius:5px;cursor:pointer}
#videopapabox .progress{background: var(--secondary);height:100%;width:0%;border-radius:5px;transition:width .1s linear}
#videopapabox .buttons{margin-top:12px;display:flex;justify-content:space-between;align-items:center}
#videopapabox button{background:0 0;border:none;color:#eee;cursor:pointer;padding:6px 10px;font-size:18px;border-radius:6px;transition:background .3s ease;width: auto;}
#videopapabox button:focus,button:hover{background: var(--secondary);outline:0}
#videopapabox .volume{display:flex;align-items:center;gap:6px}
#videopapabox input[type=range]{-webkit-appearance:none;width:100px;height:6px;background:#444;border-radius:5px;cursor:pointer}
#videopapabox input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#00bcd4;cursor:pointer;border-radius:50%;border:2px solid #ccc;margin-top:-5px}
#videopapabox input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#00bcd4;cursor:pointer;border-radius:50%;border:2px solid #ccc}
#videopapabox .time{font-size:14px;font-variant-numeric:tabular-nums;user-select:none}