:root {
  --white: #ffffff;
  --black: hsl(0, 0%, 0%);
  --vampire-black: #07090a;
  --gray-0: #141414;
  --gray-10: #181818;
  --gray-15: #282828;
  --gray-20: #333333;
  --gray-25: #404040;
  --gray-40: #616161;
  --gray-45: #757575;
  --gray-60: #9e9e9e;
  --gray-75: #bdbdbd;
  --gray-85: #d9d9d9;
  --gray-90: #eeeeee;
  --gray-95: #f8f8f8;

  --blue-10: #7477ff;
  --blue-20: #595cff;
  --blue-30: #383aa3;
  --green-10: #96ffa5;
  --green-20: #3fc753;
  --green-30: #267d33;
  --orange-10: #ffd27d;
  --orange-20: #e6a223;
  --orange-30: #986b17;
  --red-10: #ff7474;
  --red-20: #e04242;
  --red-30: #923c3c;
  --yellow-10: #ffff8f;
  --yellow-20: #fafa49;
  --yellow-30: #b1b135;
  --purple-10: #d883ff;
  --purple-20: #b43aed;
  --purple-30: #6e1b94;
  --kaspa-10: #a2fff1;
  --kaspa-20: #6fc7ba;
  --kaspa-30: #32635c;

  --primary: var(--kaspa-20);
  --secondary: var(--purple-20);
  --tertiary: var(--blue-20);
  --universal-tertiary-color: rgba(255, 255, 255, 0.1);
  --universal-tertiary-2: rgba(255, 255, 255, 0.2);

  --primary-text: white;

  --background: var(--vampire-black);
  --background-secondary: #0d1316;

  --border-secondary: #1c2e2f;

  --gradient-1: linear-gradient(
    90deg,
    #b43aed 0%,
    #ffd27d 44.23%,
    #a2fff1 85.58%
  ); // pruple-20, orange-10, kaspa-10
  --gradient-2: linear-gradient(
    90deg,
    #7477ff 0%,
    #595cff 30%,
    #b43aed 70%,
    #d883ff 100%
  ); // blue-10, blue-20, purple-20, purple-10

  // Text color utilities
  .text-white {
    color: var(--white) !important;
  }
  .text-black {
    color: var(--black) !important;
  }
  .text-vampire-black {
    color: var(--vampire-black) !important;
  }
  .text-primary {
    color: var(--primary) !important;
  }
  .text-secondary {
    color: var(--secondary) !important;
  }
  .text-tertiary {
    color: var(--tertiary) !important;
  }
  .text-universal-tertiary-color {
    color: var(--universal-tertiary-color) !important;
  }
  .text-universal-tertiary-2 {
    color: var(--universal-tertiary-2) !important;
  }
  .text-primary-text {
    color: var(--primary-text) !important;
  }
  .text-background {
    color: var(--background) !important;
  }
  .text-background-secondary {
    color: var(--background-secondary) !important;
  }
  .text-border-secondary {
    color: var(--border-secondary) !important;
  }

  // Gray text utilities
  .text-gray-0 {
    color: var(--gray-0) !important;
  }
  .text-gray-10 {
    color: var(--gray-10) !important;
  }
  .text-gray-15 {
    color: var(--gray-15) !important;
  }
  .text-gray-20 {
    color: var(--gray-20) !important;
  }
  .text-gray-25 {
    color: var(--gray-25) !important;
  }
  .text-gray-40 {
    color: var(--gray-40) !important;
  }
  .text-gray-45 {
    color: var(--gray-45) !important;
  }
  .text-gray-60 {
    color: var(--gray-60) !important;
  }
  .text-gray-75 {
    color: var(--gray-75) !important;
  }
  .text-gray-85 {
    color: var(--gray-85) !important;
  }
  .text-gray-90 {
    color: var(--gray-90) !important;
  }
  .text-gray-95 {
    color: var(--gray-95) !important;
  }

  // Brand color text utilities
  .text-blue-10 {
    color: var(--blue-10) !important;
  }
  .text-blue-20 {
    color: var(--blue-20) !important;
  }
  .text-blue-30 {
    color: var(--blue-30) !important;
  }
  .text-green-10 {
    color: var(--green-10) !important;
  }
  .text-green-20 {
    color: var(--green-20) !important;
  }
  .text-green-30 {
    color: var(--green-30) !important;
  }
  .text-orange-10 {
    color: var(--orange-10) !important;
  }
  .text-orange-20 {
    color: var(--orange-20) !important;
  }
  .text-orange-30 {
    color: var(--orange-30) !important;
  }
  .text-red-10 {
    color: var(--red-10) !important;
  }
  .text-red-20 {
    color: var(--red-20) !important;
  }
  .text-red-30 {
    color: var(--red-30) !important;
  }
  .text-yellow-10 {
    color: var(--yellow-10) !important;
  }
  .text-yellow-20 {
    color: var(--yellow-20) !important;
  }
  .text-yellow-30 {
    color: var(--yellow-30) !important;
  }
  .text-purple-10 {
    color: var(--purple-10) !important;
  }
  .text-purple-20 {
    color: var(--purple-20) !important;
  }
  .text-purple-30 {
    color: var(--purple-30) !important;
  }
  .text-kaspa-10 {
    color: var(--kaspa-10) !important;
  }
  .text-kaspa-20 {
    color: var(--kaspa-20) !important;
  }
  .text-kaspa-30 {
    color: var(--kaspa-30) !important;
  }

  // Background color utilities
  .bg-white {
    background-color: var(--white) !important;
  }
  .bg-black {
    background-color: var(--black) !important;
  }
  .bg-vampire-black {
    background-color: var(--vampire-black) !important;
  }
  .bg-primary {
    background-color: var(--primary) !important;
  }
  .bg-secondary {
    background-color: var(--secondary) !important;
  }
  .bg-tertiary {
    background-color: var(--tertiary) !important;
  }
  .bg-universal-tertiary-color {
    background-color: var(--universal-tertiary-color) !important;
  }
  .bg-universal-tertiary-2 {
    background-color: var(--universal-tertiary-2) !important;
  }
  .bg-primary-text {
    background-color: var(--primary-text) !important;
  }
  .bg-background {
    background-color: var(--background) !important;
  }
  .bg-background-secondary {
    background-color: var(--background-secondary) !important;
  }
  .bg-border-secondary {
    background-color: var(--border-secondary) !important;
  }

  // Gray background utilities
  .bg-gray-0 {
    background-color: var(--gray-0) !important;
  }
  .bg-gray-10 {
    background-color: var(--gray-10) !important;
  }
  .bg-gray-15 {
    background-color: var(--gray-15) !important;
  }
  .bg-gray-20 {
    background-color: var(--gray-20) !important;
  }
  .bg-gray-25 {
    background-color: var(--gray-25) !important;
  }
  .bg-gray-40 {
    background-color: var(--gray-40) !important;
  }
  .bg-gray-45 {
    background-color: var(--gray-45) !important;
  }
  .bg-gray-60 {
    background-color: var(--gray-60) !important;
  }
  .bg-gray-75 {
    background-color: var(--gray-75) !important;
  }
  .bg-gray-85 {
    background-color: var(--gray-85) !important;
  }
  .bg-gray-90 {
    background-color: var(--gray-90) !important;
  }
  .bg-gray-95 {
    background-color: var(--gray-95) !important;
  }

  // Brand color background utilities
  .bg-blue-10 {
    background-color: var(--blue-10) !important;
  }
  .bg-blue-20 {
    background-color: var(--blue-20) !important;
  }
  .bg-blue-30 {
    background-color: var(--blue-30) !important;
  }
  .bg-green-10 {
    background-color: var(--green-10) !important;
  }
  .bg-green-20 {
    background-color: var(--green-20) !important;
  }
  .bg-green-30 {
    background-color: var(--green-30) !important;
  }
  .bg-orange-10 {
    background-color: var(--orange-10) !important;
  }
  .bg-orange-20 {
    background-color: var(--orange-20) !important;
  }
  .bg-orange-30 {
    background-color: var(--orange-30) !important;
  }
  .bg-red-10 {
    background-color: var(--red-10) !important;
  }
  .bg-red-20 {
    background-color: var(--red-20) !important;
  }
  .bg-red-30 {
    background-color: var(--red-30) !important;
  }
  .bg-yellow-10 {
    background-color: var(--yellow-10) !important;
  }
  .bg-yellow-20 {
    background-color: var(--yellow-20) !important;
  }
  .bg-yellow-30 {
    background-color: var(--yellow-30) !important;
  }
  .bg-purple-10 {
    background-color: var(--purple-10) !important;
  }
  .bg-purple-20 {
    background-color: var(--purple-20) !important;
  }
  .bg-purple-30 {
    background-color: var(--purple-30) !important;
  }
  .bg-kaspa-10 {
    background-color: var(--kaspa-10) !important;
  }
  .bg-kaspa-20 {
    background-color: var(--kaspa-20) !important;
  }
  .bg-kaspa-30 {
    background-color: var(--kaspa-30) !important;
  }

  // Border color utilities
  .border-white {
    border-color: var(--white) !important;
  }
  .border-black {
    border-color: var(--black) !important;
  }
  .border-vampire-black {
    border-color: var(--vampire-black) !important;
  }
  .border-primary {
    border-color: var(--primary) !important;
  }
  .border-secondary {
    border-color: var(--secondary) !important;
  }
  .border-tertiary {
    border-color: var(--tertiary) !important;
  }
  .border-universal-tertiary-color {
    border-color: var(--universal-tertiary-color) !important;
  }
  .border-universal-tertiary-2 {
    border-color: var(--universal-tertiary-2) !important;
  }
  .border-primary-text {
    border-color: var(--primary-text) !important;
  }
  .border-background {
    border-color: var(--background) !important;
  }
  .border-background-secondary {
    border-color: var(--background-secondary) !important;
  }
  .border-border-secondary {
    border-color: var(--border-secondary) !important;
  }

  // Gray border utilities
  .border-gray-0 {
    border-color: var(--gray-0) !important;
  }
  .border-gray-10 {
    border-color: var(--gray-10) !important;
  }
  .border-gray-15 {
    border-color: var(--gray-15) !important;
  }
  .border-gray-20 {
    border-color: var(--gray-20) !important;
  }
  .border-gray-25 {
    border-color: var(--gray-25) !important;
  }
  .border-gray-40 {
    border-color: var(--gray-40) !important;
  }
  .border-gray-45 {
    border-color: var(--gray-45) !important;
  }
  .border-gray-60 {
    border-color: var(--gray-60) !important;
  }
  .border-gray-75 {
    border-color: var(--gray-75) !important;
  }
  .border-gray-85 {
    border-color: var(--gray-85) !important;
  }
  .border-gray-90 {
    border-color: var(--gray-90) !important;
  }
  .border-gray-95 {
    border-color: var(--gray-95) !important;
  }

  // Brand color border utilities
  .border-blue-10 {
    border-color: var(--blue-10) !important;
  }
  .border-blue-20 {
    border-color: var(--blue-20) !important;
  }
  .border-blue-30 {
    border-color: var(--blue-30) !important;
  }
  .border-green-10 {
    border-color: var(--green-10) !important;
  }
  .border-green-20 {
    border-color: var(--green-20) !important;
  }
  .border-green-30 {
    border-color: var(--green-30) !important;
  }
  .border-orange-10 {
    border-color: var(--orange-10) !important;
  }
  .border-orange-20 {
    border-color: var(--orange-20) !important;
  }
  .border-orange-30 {
    border-color: var(--orange-30) !important;
  }
  .border-red-10 {
    border-color: var(--red-10) !important;
  }
  .border-red-20 {
    border-color: var(--red-20) !important;
  }
  .border-red-30 {
    border-color: var(--red-30) !important;
  }
  .border-yellow-10 {
    border-color: var(--yellow-10) !important;
  }
  .border-yellow-20 {
    border-color: var(--yellow-20) !important;
  }
  .border-yellow-30 {
    border-color: var(--yellow-30) !important;
  }
  .border-purple-10 {
    border-color: var(--purple-10) !important;
  }
  .border-purple-20 {
    border-color: var(--purple-20) !important;
  }
  .border-purple-30 {
    border-color: var(--purple-30) !important;
  }
  .border-kaspa-10 {
    border-color: var(--kaspa-10) !important;
  }
  .border-kaspa-20 {
    border-color: var(--kaspa-20) !important;
  }
  .border-kaspa-30 {
    border-color: var(--kaspa-30) !important;
  }

  // Gradient utilities
  .gradient-1 {
    background: var(--gradient-1) !important;
  }
  .gradient-2 {
    background: var(--gradient-2) !important;
  }
}