/* Custom Synthwave & Vector CRT Aesthetics */
:root {
  --neon-cyan: #00f3ff;
  --neon-pink: #ff0055;
  --neon-green: #39ff14;
  --neon-yellow: #ffff00;
}

body {
  margin: 0;
  padding: 0;
  background-color: #05050a;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

.vector-glow {
  text-shadow: 0 0 10px rgba(0, 243, 255, 0.6), 0 0 25px rgba(0, 243, 255, 0.3);
}

/* CRT Scanlines Overlay */
.crt-screen {
  background: linear-gradient(
    rgba(18, 16, 16, 0) 50%, 
    rgba(0, 0, 0, 0.45) 50%
  ), linear-gradient(
    90deg,
    rgba(255, 0, 0, 0.03),
    rgba(0, 255, 0, 0.01),
    rgba(0, 0, 255, 0.03)
  );
  background-size: 100% 3px, 4px 100%;
}

.crt-off .crt-screen {
  display: none !important;
}

/* Screen Edge Vignette */
.vignette {
  background: radial-gradient(circle at center, transparent 60%, rgba(5, 5, 10, 0.85) 100%);
}

/* Touch Control buttons styling */
.touch-action-btn {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.touch-action-btn:active {
  box-shadow: 0 0 30px currentColor;
}

/* Prevent unwanted browser gestures */
canvas {
  touch-action: none;
}