/* A single violet-white charge passes through the completed domain. */
.dapp-home-domain #heroDomainText {
  position: relative;
}
.dapp-home-domain #heroDomainText::after {
  content: attr(data-energy-label);
  position: absolute;
  inset: 0;
  pointer-events: none;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  white-space: nowrap;
  color: transparent;
  background: linear-gradient(105deg,
    transparent 41%, #a78aff70 46%, #ceb5ff 48.8%,
    #fff 50%, #e5f1ff 51.2%, #a78aff60 54%, transparent 59%);
  background-size: 320% 100%;
  background-repeat: no-repeat;
  background-position: 110% 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0 3px #c2a5ff90) drop-shadow(0 0 9px #8f60ed65);
  opacity: 0;
}
.dapp-home-domain[data-typing-state="holding"] #heroDomainText::after {
  animation: dapp-domain-charge 2.8s cubic-bezier(.3, 0, .2, 1) both;
  animation-play-state: paused;
}
.dapp-home-domain[data-typing-state="holding"].is-typing-visible #heroDomainText::after {
  animation-play-state: running;
}
@keyframes dapp-domain-charge {
  0% { background-position: 110% 0; opacity: 0; }
  12% { opacity: .85; }
  82% { opacity: .85; }
  100% { background-position: -10% 0; opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .dapp-home-domain #heroDomainText::after { display: none; animation: none; }
}