body {
  background-color: #000;
  color: #0f0;
  font-family: 'Courier New', Courier, monospace;
  margin: 0;
  padding: 40px;
}

.container {
  text-align: center;
  animation: flicker 3s infinite;
}

.glitch {
  font-size: 3em;
  position: relative;
  color: white;
  animation: glitchAnim 2s infinite;
}

.glitch::before,
.glitch::after {
  content: attr(data-text);
  position: absolute;
  left: 0;
  width: 100%;
  overflow: hidden;
}

.glitch::before {
  color: red;
  top: -2px;
  animation: glitchTop 1.5s infinite;
}

.glitch::after {
  color: cyan;
  top: 2px;
  animation: glitchBottom 1.2s infinite;
}

.sub {
  color: #666;
  font-style: italic;
  font-size: 1em;
}

.log {
  margin-top: 40px;
  background: #111;
  padding: 20px;
  border-left: 3px solid red;
  text-align: left;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}

.warning {
  color: red;
  font-weight: bold;
}

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

@keyframes glitchTop {
  0% { clip: rect(0, 9999px, 0, 0); }
  50% { clip: rect(0, 9999px, 30px, 0); }
  100% { clip: rect(0, 9999px, 0, 0); }
}

@keyframes glitchBottom {
  0% { clip: rect(40px, 9999px, 60px, 0); }
  50% { clip: rect(20px, 9999px, 40px, 0); }
  100% { clip: rect(60px, 9999px, 80px, 0); }
}

@keyframes flicker {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
  75% { opacity: 0.8; }
}