body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at top, #1a2e22, #0b0f0c);
  font-family: "Courier New", monospace;
  color: #d6e2d9;
}

.error-page {
  text-align: center;
}

.error-page h1 {
  position: relative;
  font-size: 6rem;
  color: #8b1e1e;
  margin-bottom: 10px;
}

.error-page h1::before,
.error-page h1::after {
  content: "404";
  position: absolute;
  left: 0;
  width: 100%;
}

.error-page h1::before {
  color: #00ffcc;
  animation: glitch 0.3s infinite;
}

.error-page h1::after {
  color: #ff0033;
  animation: glitch 0.3s infinite reverse;
}

.error-page p {
  font-size: 1.2rem;
  margin: 8px 0;
}

.error-page a {
  display: inline-block;
  margin-top: 20px;
  color: #8aa89a;
  text-decoration: none;
}

.error-page a:hover {
  color: #ffffff;
}

@keyframes glitch {
  0% { transform: translate(0); }
  20% { transform: translate(-2px, 2px); }
  40% { transform: translate(-2px, -2px); }
  60% { transform: translate(2px, 2px); }
  80% { transform: translate(2px, -2px); }
  100% { transform: translate(0); }
}