.spinner{width:48px;height:48px;border-radius:50%;position:relative;animation:rotate 1s linear infinite}.spinner:before{content:"";box-sizing:border-box;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:5px solid #FFF;animation:prixClipFix 2s linear infinite}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes prixClipFix{0%{clip-path:polygon(50% 50%,0 0,0 0,0 0,0 0,0 0)}25%{clip-path:polygon(50% 50%,0 0,100% 0,100% 0,100% 0,100% 0)}50%{clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,100% 100%,100% 100%)}75%{clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 100%)}to{clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 0)}}media-controller{--media-control-background: transparent;--media-button-padding: 0 2px;--media-button-background: rgb(20 20 30 / .7)}media-controller media-control-bar{padding:0 32px;background-color:var(--media-button-background)}media-controller[mediapaused]:not(:hover) media-control-bar{opacity:0}media-controller:not([mediahasplayed]) media-control-bar{opacity:0}media-controller media-time-display{padding:0 6px}media-controller .main-play-button{position:absolute;left:50%;top:50%;translate:-50% -50%;width:48px;height:48px;padding:8px;border:3px solid white;border-radius:100%;background-color:var(--media-button-background)}media-controller .main-muted-indicator{position:absolute;top:0;right:0;width:72px;height:72px;opacity:1;scale:1.5}media-controller .main-muted-indicator:hover{background-color:transparent}media-controller[mediahasplayed]:hover .main-play-button{display:none}media-controller:is([mediapaused],media-controller:not([mediavolumelevel=off])) .main-muted-indicator{display:none}media-controller[mediaisfullscreen] video{width:100vw;height:100vh;max-width:initial;max-height:initial;object-fit:contain;object-position:center}
