@font-face {
  font-family: 'PressStart';
  src: url('data:font/woff2;base64,') format('woff2');
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  background: #0a0a0a;
  color: #e0e0e0;
  font-family: 'Courier New', monospace;
  min-height: 100vh;
  overflow-x: hidden;
}

/* Scanline overlay */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0, 0, 0, 0.15) 2px,
    rgba(0, 0, 0, 0.15) 4px
  );
  pointer-events: none;
  z-index: 9999;
}

header {
  text-align: center;
  padding: 3rem 1rem 1rem;
  position: relative;
}

h1 {
  font-size: clamp(1.5rem, 5vw, 3.5rem);
  text-transform: uppercase;
  letter-spacing: 0.3em;
  text-shadow: none;
  position: relative;
}

h1 a {
  text-decoration: none;
  display: inline-block;
  background: linear-gradient(
    180deg,
    #ff00ff 0%,
    #00ffff 25%,
    #ff00ff 50%,
    #ffff00 75%,
    #00ffff 100%
  );
  background-size: 100% 300%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  animation: gradient-scroll 4s linear infinite;
}

@keyframes gradient-scroll {
  0% { background-position: 0% 0%; }
  100% { background-position: 0% 300%; }
}

.subtitle {
  color: #33ff33bb;
  font-size: 0.85rem;
  letter-spacing: 0.5em;
  margin-top: 0.5rem;
  text-transform: uppercase;
}

footer {
  text-align: center;
  padding: 3rem 1rem;
  color: #33ff3366;
  font-size: 0.65rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
}

footer a {
  color: #33ff3388;
  text-decoration: none;
}

footer a:hover {
  color: #33ff33;
}