/* Seasonal Effects Overlay (snow/fireworks/bunnies) */
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600;700&display=swap');

#fx-layer{
  position: fixed;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 9000;
}

.fx-particle{
  position: absolute;
  top: -20px;
  will-change: transform, opacity;
  user-select: none;
}

@keyframes fx-fall {
  from { transform: translate3d(var(--x,0px), -30px, 0) rotate(var(--r,0deg)); opacity: 0; }
  10% { opacity: var(--o, .9); }
  to   { transform: translate3d(var(--x,0px), calc(100vh + 40px), 0) rotate(calc(var(--r,0deg) + 360deg)); opacity: 0; }
}

@keyframes fx-bunny-hop {
  0% { transform: translate3d(0,0,0) scale(1); }
  15% { transform: translate3d(0,-18px,0) scale(1.02); }
  30% { transform: translate3d(0,0,0) scale(1); }
  45% { transform: translate3d(0,-12px,0) scale(1.01); }
  60% { transform: translate3d(0,0,0) scale(1); }
  100% { transform: translate3d(0,0,0) scale(1); }
}

.fx-spark{
  width: 6px; height: 6px;
  border-radius: 50%;
  background: hsl(var(--h, 40) 90% 65%);
  box-shadow: 0 0 14px hsla(var(--h, 40), 90%, 65%, .55);
}
.fx-bunny{
  font-size: 28px;
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.18));
  animation: fx-bunny-hop 1.2s ease-in-out infinite;
}

/* Seasonal message */
#fx-message{
  position: fixed;
  left: 50%;
  top: 32%;
  transform: translate(-50%, -50%) rotate(var(--angle, -8deg));
  z-index: 9050;
  pointer-events: none;
  text-align: center;
  padding: 10px 18px;
  border-radius: 999px;
  color: rgba(255,255,255,var(--op, .92));
  font-family: "Dancing Script", "Brush Script MT", cursive;
  font-weight: 700;
  font-size: clamp(28px, 4vw, 64px);
  letter-spacing: .5px;
  text-shadow: 0 10px 30px rgba(0,0,0,.35);
  background: linear-gradient(90deg, rgba(0,0,0,.18), rgba(0,0,0,.06), rgba(0,0,0,.18));
  backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,.18);
}

@media (max-width: 820px){
  #fx-message{ top: 26%; padding: 8px 14px; }
}