body {
  margin: 0;
  padding: 0;
  background-color: #000;
  color: #00ff00;
  font-family: 'Courier New', Courier, monospace;
  min-height: 100dvh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1rem;
  box-sizing: border-box;
}

#footer {
  position: fixed;
  width: 100%;
  bottom: 0;
  padding: 0.5rem 1rem;
  font-size: 0.75rem;
  text-align: center;
  color: #007700;
  background: #000;
  font-family: 'Courier New', Courier, monospace;
  border-top: 1px solid #003300;
  box-shadow: 0 -2px 10px rgba(0, 255, 0, 0.1);
}

#container {
  animation: fadeIn 2s ease-out;
  max-width: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

#visitor {
  font-size: clamp(1rem, 2vw, 1.25rem);
  margin-bottom: 1rem;
  color: #00ff00;
  text-shadow: 0 0 4px #00ff00;
}

#logo {
  width: clamp(120px, 25vw, 200px);
  max-width: 90vw;
  margin-bottom: 1rem;
  filter: drop-shadow(0 0 8px #00ff00);
  animation: flicker 3s infinite;
}

#typewriter {
  font-size: clamp(1rem, 2.5vw, 1.5rem);
  max-width: 90vw;
  white-space: normal;
  word-break: break-word;
  border-right: 2px solid #00ff00;
  padding-right: 5px;
  animation: flicker 3s infinite, blinkCursor 0.75s step-end infinite;
}

#footer,
#admin-panel {
  max-width: 100vw;
  overflow: hidden;
}

@keyframes flicker {
  0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% { opacity: 0.99; }
  20%, 24%, 55% { opacity: 0.4; }
}

@keyframes blinkCursor {
  from { border-color: transparent; }
  to { border-color: #00ff00; }
}

@keyframes glitch {
  0% { transform: translate(0); clip: rect(0, 100vw, 0, 0); }
  20% { transform: translate(-2px, -2px); clip: rect(10px, 100vw, 80px, 0); }
  40% { transform: translate(2px, 2px); clip: rect(20px, 100vw, 60px, 0); }
  60% { transform: translate(-2px, 2px); clip: rect(30px, 100vw, 50px, 0); }
  80% { transform: translate(2px, -2px); clip: rect(40px, 100vw, 40px, 0); }
  100% { transform: translate(0); clip: rect(0, 100vw, 0, 0); }
}

.glitch {
  animation: glitch 0.5s infinite;
}

@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}

#admin-panel {
  position: absolute;
  top: 1rem;
  left: 1rem;
  color: #008800;
  font-size: 0.75rem;
  font-family: monospace;
  opacity: 0.3;
  pointer-events: none;
  user-select: none;
}
.label {
  text-transform: uppercase;
  margin: 0;
}

#contact-dark {
  position: fixed;
  color: #000;
  width: 100%;
  bottom: 100px;
  padding: 0.5rem 1rem;
  font-size: 0.75rem;
  text-align: center;
  font-family: 'Courier New', Courier, monospace;
}