:root {
  --color-cs-bg: #020617;
  --color-cs-surface: #0f172a;
  --color-rarity-blue: #3b82f6;
  --color-rarity-pink: #ec4899;
  --color-rarity-red: #ef4444;
  --color-rarity-gold: #facc15;
}

body {
  padding: 0;
  margin: 0;
  font-family: "Inter", "JetBrains Mono", monospace;
}

button,
input[type="button"] {
  border: 1px solid lightblue;
  transition: transform 0.1s ease-in-out;
  border-radius: 15px;
  font-weight: bold;
}

#clicker-btn {
  border-radius: 100px;
}

/* Color utility classes */
.bg-cs-bg {
  background-color: var(--color-cs-bg);
}

.bg-cs-surface {
  background-color: var(--color-cs-surface);
}

.text-cs-bg {
  color: var(--color-cs-bg);
}

.text-rarity-blue {
  color: var(--color-rarity-blue);
}

.text-rarity-pink {
  color: var(--color-rarity-pink);
}

.text-rarity-red {
  color: var(--color-rarity-red);
}

.text-rarity-gold {
  color: var(--color-rarity-gold);
}