html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  background: black;
  overflow: hidden;
  font-family: "Times New Roman", serif;
  color: white;
}

/* Stronger VHS */
#vhs {
  position: fixed;
  inset: 0;
  background: url("https://cliply.co/wp-content/uploads/2021/07/402107790_STATIC_NOISE_400.gif");
  opacity: 0.14;
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: 10;
}

/* Rain */
#rain {
  position: fixed;
  inset: 0;
  z-index: 1;
}

/* Star locked center */
#star {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 140px;
  transform: translate(-50%, -50%);
  filter:
    blur(1.5px)
    drop-shadow(0 0 40px rgba(255,255,255,0.9));
  z-index: 3;
  animation: pulse 2.5s ease-in-out infinite;
}

@keyframes pulse {
  0% { transform: translate(-50%, -50%) scale(1); }
  50% { transform: translate(-50%, -50%) scale(1.05); }
  100% { transform: translate(-50%, -50%) scale(1); }
}

/* Message text */
#message {
  position: fixed;
  top: calc(50% + 120px);
  width: 100%;
  text-align: center;
  font-size: 22px;
  letter-spacing: 3px;
  opacity: 0;
  text-shadow:
    2px 0 red,
   -2px 0 cyan;
  z-index: 4;
}

/* Glitch flicker */
.glitch {
  animation: glitch 0.15s infinite;
}

@keyframes glitch {
  0% { opacity: 1; transform: translateX(0); }
  20% { opacity: 0.7; transform: translateX(-2px); }
  40% { opacity: 1; transform: translateX(2px); }
  60% { opacity: 0.85; }
  100% { opacity: 1; transform: translateX(0); }
}