/* A classe js tem salvaguarda no head: um recurso ausente deixa tudo visível. */
.js .revelar {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .4s var(--curva), transform .4s var(--curva);
  transition-delay: var(--atraso, 0s);
}
.js .revelar.visivel { opacity: 1; transform: none; }

.js [data-resultado-preco] { animation: resultado-entrada .3s var(--curva) both; }
@keyframes resultado-entrada {
  from { transform: translateY(8px); }
  to { transform: translateY(0); }
}

/* O marcador acende; números e linhas da memória nunca são escondidos. */
.js [data-linha-resultado] td:first-child { position: relative; }
.js [data-linha-resultado] td:first-child::before {
  content: "";
  position: absolute;
  left: 3px;
  top: calc(50% - 2px);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--ouro);
  opacity: .25;
  transition: opacity .3s var(--curva);
}
.js [data-linha-resultado].acesa td:first-child::before { opacity: 1; }

.envio-status {
  position: fixed;
  z-index: 500;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  display: grid;
  gap: 12px;
  width: min(440px, calc(100vw - 32px));
  padding: 16px 20px;
  color: var(--tinta);
  background: var(--branco);
  border: 1px solid var(--fio-forte);
  border-radius: var(--raio-sm);
  font: 500 14px/1.5 var(--sans);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .15);
}
.envio-status[hidden], .envio-status-progresso[hidden] { display: none !important; }
.envio-status-progresso {
  display: block;
  height: 3px;
  overflow: hidden;
  border-radius: 3px;
  background: var(--fio);
}
.envio-status-barra {
  display: block;
  width: 40%;
  height: 100%;
  background: var(--ouro);
  animation: envio-em-andamento 1.4s var(--curva) infinite;
}
@keyframes envio-em-andamento {
  from { transform: translateX(-110%); }
  to { transform: translateX(360%); }
}

@media (prefers-reduced-motion: reduce) {
  .js .revelar, .js [data-resultado-preco] {
    opacity: 1;
    transform: none;
    animation: none;
    transition: none;
  }
  .js [data-linha-resultado] td:first-child::before { opacity: 1; transition: none; }
  .envio-status-progresso { display: none; }
  .envio-status-barra { animation: none; }
}

@media print {
  .js .revelar, .js [data-resultado-preco] { opacity: 1; transform: none; animation: none; }
  .envio-status { display: none !important; }
}