.sti-grain {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
}
.sti-rule {
  background-image: repeating-linear-gradient(90deg, currentColor 0 6px, transparent 6px 12px);
}
.sti-reveal.sti-hidden {
  opacity: 0;
  transform: translateY(32px);
}
@media (prefers-reduced-motion: no-preference) {
  .sti-reveal {
    transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .sti-ring {
    animation: sti-spin 60s linear infinite;
  }
  @keyframes sti-spin {
    to {
      transform: rotate(360deg);
    }
  }
}

