img[data-nn-img="carregando"] {
  color: transparent;
  min-height: 1.25rem;
  background-color: #e4e4e7;
  background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 34%, rgba(255, 255, 255, 0.65) 50%, rgba(255, 255, 255, 0) 66%);
  background-size: 220% 100%;
  background-repeat: no-repeat;
  animation: nn-img-brilho 1.4s ease-in-out infinite;
}

img[data-nn-img="falhou"] {
  color: transparent;
  object-fit: contain;
  background-color: #f4f4f5;
}

@keyframes nn-img-brilho {
  from { background-position: 180% 0; }
  to   { background-position: -80% 0; }
}

html[data-theme="dark"] img[data-nn-img="carregando"] {
  background-color: #3f3f46;
  background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 34%, rgba(255, 255, 255, 0.14) 50%, rgba(255, 255, 255, 0) 66%);
}

html[data-theme="dark"] img[data-nn-img="falhou"] {
  background-color: #27272a;
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) img[data-nn-img="carregando"] {
    background-color: #3f3f46;
    background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 34%, rgba(255, 255, 255, 0.14) 50%, rgba(255, 255, 255, 0) 66%);
  }
  html:not([data-theme="light"]) img[data-nn-img="falhou"] {
    background-color: #27272a;
  }
}

@media (prefers-reduced-motion: reduce) {
  img[data-nn-img="carregando"] {
    animation: none;
    background-image: none;
    opacity: 0.6;
  }
}