Neon Sign

<!-- Neon Sign — subtly flickering neon text (<= 3 flashes/sec) -->
<div class="nuda-neon-sign">
  <span class="nuda-neon-sign__text">OPEN</span>
</div>

/* ── Neon Sign ───────────────────────────────────────────────
   Glowing text with an occasional, gentle flicker. The flicker
   dips opacity only a few frames per cycle — never strobing.
   Customize:
     --neon-sign-color : neon hue
     --neon-sign-size  : font size
   ──────────────────────────────────────────────────────────── */
.nuda-neon-sign {
  --neon-sign-color: #e4ff54;
  --neon-sign-size: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px 40px;
  background: #09090b;
  border-radius: 12px;
}

.nuda-neon-sign__text {
  font-family: ui-sans-serif, system-ui, sans-serif;
  font-size: var(--neon-sign-size);
  font-weight: 800;
  letter-spacing: 0.12em;
  color: #fbffe0;
  text-shadow:
    0 0 4px #fff,
    0 0 10px var(--neon-sign-color),
    0 0 24px var(--neon-sign-color),
    0 0 48px var(--neon-sign-color);
  animation: nuda-neon-sign-flicker 5s steps(1) infinite;
  will-change: opacity;
}

/* Two short dips per 5s cycle = well under 3 flashes/second. */
@keyframes nuda-neon-sign-flicker {
  0%, 18%, 21%, 55%, 57%, 100% { opacity: 1; }
  19%, 20%, 56%                { opacity: 0.55; }
}

@media (prefers-reduced-motion: reduce) {
  .nuda-neon-sign__text {
    animation: none;
    opacity: 1;
  }
}