
#steno-festival-banner {
  position: fixed;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  width: min(560px, calc(100vw - 32px));
  box-sizing: border-box;
  padding: 16px 42px 16px 20px;
  border: 1px solid var(--festival-color);
  border-radius: 18px;
  background: #172033;
  color: #fff;
  box-shadow: 0 8px 30px #0004;
  z-index: 9999;
  text-align: center;
}
#steno-festival-banner strong {
  display: block;
  color: var(--festival-color);
  font-size: clamp(18px, 4vw, 24px);
}
#steno-festival-banner > span {
  display: block;
  margin-top: 5px;
  font-size: 13px;
}
#steno-festival-banner button {
  position: absolute;
  right: 8px;
  top: 8px;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: #ffffff18;
  color: white;
  font-size: 24px;
  cursor: pointer;
}
#steno-festival-particles {
  position: fixed;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 9998;
}
#steno-festival-particles span {
  position: absolute;
  top: -50px;
  animation: steno-festival-fall 7s linear both;
}
@keyframes steno-festival-fall {
  from { transform: translateY(0) rotate(0); opacity: 0; }
  10% { opacity: 1; }
  85% { opacity: 1; }
  to { transform: translateY(110vh) rotate(220deg); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  #steno-festival-particles { display: none; }
}
