*{box-sizing:border-box;padding:0;margin:0}#canvas{width:100vw;height:100vh;overflow:hidden;position:fixed}#canvas canvas{filter:saturate(.8)}.app-container{width:100vw;height:100vh;position:absolute;z-index:1000}.loader-container{width:100vw;height:100vh;position:absolute;background:#000;display:flex;justify-content:center;align-items:center;flex-direction:column;opacity:0;transition:opacity 1s}.loader-container.active{opacity:1}.loader{--size-loader: 50px;--size-orbe: 10px;width:var(--size-loader);height:var(--size-loader);position:relative;transform:rotate(45deg)}.orbe{position:absolute;width:100%;height:100%;--delay: calc(var(--index) * .1s);animation:orbit7456 ease-in-out 1.5s var(--delay) infinite;opacity:calc(1 - calc(.2 * var(--index)))}.orbe:after{position:absolute;content:"";top:0;left:0;width:var(--size-orbe);height:var(--size-orbe);background-color:#3ae374;box-shadow:0 0 20px 2px #3ae374;border-radius:50%}@keyframes orbit7456{80%{transform:rotate(360deg)}to{transform:rotate(360deg)}}