.linha-costura {
  fill: none;
  stroke: #a6c0df;
  stroke-width: 1.3;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 8 6;
}
.linha-mascara {
  fill: none;
  stroke: white;
  stroke-width: 6;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: var(--path-length);
  stroke-dashoffset: var(--path-length);
  animation:
    costurar 3s ease-in-out infinite,
    sumir 3s ease-in-out infinite;
}
.mascara-barra {
  animation:
    costurar 3s ease-in-out infinite,
    sumir 3s ease-in-out infinite;
}
@keyframes costurar {
  0% {
    stroke-dasharray: 0 var(--path-length);
  }

  50% {
    stroke-dasharray: var(--path-length) 0;
  }

  100% {
    stroke-dasharray: var(--path-length) 0;
  }
}
@keyframes sumir {
  50% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@media (pointer: coarse), (orientation: portrait) {
  #loadingContainer {
    width: 40%;
  }
}
