:root {
  --background: 0 0% 0%;
  --foreground: 0 0% 100%;
  --primary: 142 30% 25%;
  --secondary: 0 0% 20%;
  --border: 0 0% 20%;
  --radius-lg: 2rem;
}

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

body {
  font-family: 'Inter', sans-serif;
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
}

@keyframes loading-bar {
  0% { transform: scaleX(0); }
  100% { transform: scaleX(1); }
}

.animate-loading-bar {
  animation: loading-bar 2.5s ease-in-out forwards;
}

canvas {
  display: block;
  outline: none;
}

::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-track {
  background: #000;
}

::-webkit-scrollbar-thumb {
  background: #333;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: #444;
}

.font-syncopate {
  font-family: 'Syncopate', sans-serif;
}

/* Custom Utilities */
.text-stroke {
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.2);
  color: transparent;
}