.loader .loader-symbol{
  width:min(265px,48vw);
  height:auto;
  object-fit:contain;
  display:block;
  opacity:0;
  transform:translateY(24px) scale(.82);
  filter:blur(7px);
  animation:loaderSymbolIn 1.15s cubic-bezier(.16,1,.3,1) .16s forwards,
            loaderSymbolFloat 2.4s ease-in-out 1.25s infinite alternate;
}

.loader .loader-gif{
  width:min(760px,92vw);
  height:auto;
  max-height:84svh;
  object-fit:contain;
  display:block;
}
.loader--gif{background:#000}
.loader--gif:before{display:none}

.loader:before{
  content:"";
  position:absolute;
  width:min(380px,68vw);
  aspect-ratio:1;
  border:1px solid rgba(184,150,58,.18);
  border-radius:50%;
  transform:scale(.6);
  opacity:0;
  animation:loaderHalo 1.25s ease-out .25s forwards;
}

@keyframes loaderSymbolIn{
  to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
}
@keyframes loaderSymbolFloat{
  to{transform:translateY(-5px) scale(1.012)}
}
@keyframes loaderHalo{
  45%{opacity:.7}
  to{opacity:0;transform:scale(1.15)}
}

@media(max-width:900px){.loader .loader-symbol{width:min(160px,40vw)}.loader .loader-gif{width:100vw;max-height:72svh}}
@media(prefers-reduced-motion:reduce){.loader .loader-symbol{animation:none;opacity:1;transform:none;filter:none}.loader:before{display:none}}