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

body {
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #0d0d1a;
}

#root {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

/* Terminal scrollable area */
.terminal-scrollable {
  overflow-y: auto;
  overflow-x: hidden;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}

/* Make terminal lines selectable */
.terminal-line {
  user-select: text;
  -webkit-user-select: text;
  cursor: text;
}

/* Scrollbar styling */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 255, 245, 0.3);
  border-radius: 4px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 255, 245, 0.5);
  background-clip: padding-box;
}

::-webkit-scrollbar-thumb:active {
  background: rgba(0, 255, 245, 0.7);
  background-clip: padding-box;
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 255, 245, 0.3) rgba(255, 255, 255, 0.05);
}

/* CRT Effect */
.crt-effect::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: repeating-linear-gradient(
    0deg,
    rgba(0, 0, 0, 0.15),
    rgba(0, 0, 0, 0.15) 1px,
    transparent 1px,
    transparent 2px
  );
  pointer-events: none;
  z-index: 100;
}

.crt-effect::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(
    ellipse at center,
    transparent 0%,
    rgba(0, 0, 0, 0.2) 100%
  );
  pointer-events: none;
  z-index: 99;
}

/* Cursor blink animation */
@keyframes blink {
  0%, 50% { opacity: 1; }
  51%, 100% { opacity: 0; }
}

.animate-pulse {
  animation: blink 1s step-end infinite;
}

/* Input styling */
input {
  font-family: 'JetBrains Mono', monospace;
}

input::placeholder {
  color: rgba(255, 255, 255, 0.3);
}

/* Selection styling */
::selection {
  background: rgba(0, 255, 245, 0.3);
  color: #fff;
}

/* Button hover effects */
button {
  cursor: pointer;
  font-family: 'JetBrains Mono', monospace;
  -webkit-tap-highlight-color: transparent;
}

button:hover {
  filter: brightness(1.1);
}

button:active {
  transform: scale(0.98);
}

/* Terminal text glow */
.terminal-text {
  text-shadow: 0 0 5px currentColor;
}

/* Mobile optimizations */
@media (max-width: 640px) {
  input {
    font-size: 16px !important; /* Prevents zoom on iOS */
  }
  
  .terminal-scrollable {
    -webkit-overflow-scrolling: touch;
  }
}

/* Ensure touch targets are large enough */
@media (pointer: coarse) {
  button {
    min-height: 44px;
    min-width: 44px;
  }
  
  ::-webkit-scrollbar {
    width: 12px;
  }
}

/* Flicker animation for boot sequence */
@keyframes flicker {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.8; }
  75% { opacity: 0.9; }
}

.boot-flicker {
  animation: flicker 0.1s ease-in-out;
}

/* Matrix rain fade */
@keyframes matrixFade {
  0% { opacity: 1; }
  100% { opacity: 0; }
}

/* Safe area support for mobile */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  #root {
    padding-bottom: env(safe-area-inset-bottom);
  }
}

/* Scroll indicator pulse */
@keyframes scrollPulse {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(3px); }
}

button[title="Scroll to bottom"] {
  animation: scrollPulse 1.5s ease-in-out infinite;
}