:root {
  --primary: #00ff75;
  --secondary: #3700ff;
  --background: #171717;
  --card-radius: 22px;
  --text-light: #d3d3d3;
  --button-bg: #252525;
  --button-hover: #000;
}

body {
  background-color: var(--background);
  color: var(--text-light);
}

.card {
  background-image: linear-gradient(163deg, var(--primary) 0%, var(--secondary) 100%);
  border-radius: var(--card-radius);
  transition: all 0.3s ease;
}

.card2 {
  background-color: var(--background);
  border-radius: 0;
  transition: all 0.2s ease;
}

.card:hover {
  box-shadow: 0px 0px 30px 1px rgba(0, 255, 117, 0.3);
}

.card2:hover {
  transform: scale(0.98);
  border-radius: 20px;
}

input, button {
  background-color: var(--button-bg);
  color: var(--text-light);
  border: none;
  outline: none;
}

input:focus, button:hover {
  background-color: var(--button-hover);
}

a {
  color: var(--primary);
}

a:hover {
  text-decoration: underline;
}