html {
  scroll-behavior: smooth;
}

body {
  min-width: 320px;
  overflow-x: hidden;
}

#spelling-registration-form > input[name="full_name"] {
  margin-top: 0 !important;
}

.registration-feedback {
  display: none;
  border-radius: 8px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.5;
}

.registration-feedback.is-success {
  display: block;
  border: 1px solid rgba(34, 197, 94, .4);
  background: rgba(34, 197, 94, .12);
  color: #86efac;
}

.registration-feedback.is-error {
  display: block;
  border: 1px solid rgba(239, 68, 68, .45);
  background: rgba(239, 68, 68, .12);
  color: #fca5a5;
}

[data-registration-group].is-active {
  border-color: hsl(var(--arena-blue));
  background: hsl(var(--arena-blue) / .16);
  color: hsl(var(--arena-blue-glow));
  box-shadow: 0 0 20px hsl(var(--arena-blue) / .18);
}

body[data-page="home"]:not(.arena-home-ready) .relative.z-10 > section [style*="opacity: 1"] {
  opacity: 0 !important;
}

.arena-home-reveal {
  opacity: 0 !important;
  transform: var(--arena-home-reveal-transform, translateY(30px)) !important;
  transition:
    opacity .6s cubic-bezier(.22, 1, .36, 1) var(--arena-home-reveal-delay, 0s),
    transform .6s cubic-bezier(.22, 1, .36, 1) var(--arena-home-reveal-delay, 0s) !important;
  will-change: opacity, transform;
}

.arena-home-reveal.is-visible {
  opacity: 1 !important;
  transform: none !important;
}

.arena-reveal {
  opacity: 0 !important;
  transition: opacity .55s ease, transform .55s ease !important;
  will-change: opacity, transform;
}

.arena-reveal--up {
  transform: translateY(20px) !important;
}

.arena-reveal--left {
  transform: translateX(-40px) !important;
}

.arena-reveal.is-visible {
  opacity: 1 !important;
  transform: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .arena-home-reveal,
  .arena-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

.arena-mobile-menu {
  position: fixed;
  inset: 64px 12px auto;
  z-index: 120;
  display: none;
  border: 1px solid hsl(var(--arena-blue) / .35);
  border-radius: 8px;
  background: hsl(var(--card) / .98);
  box-shadow: 0 20px 60px rgba(0, 0, 0, .45);
  padding: 10px;
}

.arena-mobile-menu.is-open {
  display: grid;
}

.arena-mobile-menu button,
.arena-mobile-menu a {
  padding: 12px 14px;
  color: hsl(var(--foreground));
  text-align: left;
  font-family: var(--font-display);
  font-weight: 600;
}

.arena-mobile-menu .register-link {
  margin-top: 6px;
  background: hsl(var(--arena-red));
  color: #fff;
  text-align: center;
}

@media (min-width: 768px) {
  .arena-mobile-menu {
    display: none !important;
  }
}