:root{--size:18;--color-one:#ea4335;--color-two:#4285f4;--color-three:#34a853;--color-four:#fbbc05}@property --nose{syntax:"<percentage>";initial-value:0;inherits:false}@property --tail{syntax:"<percentage>";initial-value:0;inherits:false}.loader{height:18px;width:18px;border-radius:50%;mask:conic-gradient(from 45deg,transparent 0 var(--tail),#000 0 var(--nose),transparent 0 var(--nose));border-top:4px solid var(--color-one);border-right:4px solid var(--color-two);border-bottom:4px solid var(--color-three);border-left:4px solid var(--color-four);animation:load 2.5s ease-in-out infinite both,spin 3.25s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}@keyframes load{0%{--tail:0%;--nose:0%}40%,60%{--nose:100%;--tail:0%}to{--nose:100%;--tail:100%}}