:root {
  /* Primary */
  --color-cyan: #00D0FF;
  --color-cyan-tint-1: #EDFBFE;
  --color-cyan-tint-2: #DDF6FF;
  --color-cyan-tint-3: #CBF2FF;
  --color-cyan-tint-4: #BBEDFF;
  --color-cyan-tint-5: #A7E9FF;
  --color-cyan-tint-6: #93E4FF;
  --color-cyan-tint-7: #7DDFFF;
  --color-cyan-tint-8: #65DAFF;
  --color-cyan-tint-9: #46D5FF;
  --color-cyan-shade-1: #02B5DE;
  --color-cyan-shade-2: #019ABE;
  --color-cyan-shade-3: #00809E;
  --color-cyan-shade-4: #016780;
  --color-cyan-shade-5: #004F63;
  --color-cyan-shade-6: #013948;
  --color-cyan-shade-7: #00232E;
  --color-cyan-shade-8: #001016;
  --color-cyan-shade-9: #000203;

  /* Neutral */
  --color-gray-1: #FAFAFA;
  --color-gray-2: #F7F7F8;
  --color-gray-3: #F2F2F3;
  --color-gray-4: #E7E7E8;
  --color-gray-5: #CECED1;
  --color-gray-6: #B6B6B9;
  --color-gray-7: #9D9EA2;
  --color-gray-8: #85858B;
  --color-gray-9: #6D6D74;
  --color-gray-10: #54555D;
  --color-gray-11: #3C3D45;
  --color-gray-12: #2E2F39;
  --color-gray-13: #23242E;

  /* Error */
  --color-error: #D3302F;
  --color-error-tint-1: #FFEBEE;
  --color-error-tint-2: #FFCDD3;
  --color-error-tint-3: #EF9A9A;
  --color-error-tint-4: #E67373;
  --color-error-tint-5: #F05351;
  --color-error-shade-1: #C62828;
  --color-error-shade-2: #B71D1C;
  --color-error-shade-3: #8E0000;
  --color-error-shade-4: #670000;

  /* Success */
  --color-success: #388E3C;
  --color-success-tint-1: #E9F5E9;
  --color-success-tint-2: #C8E6C9;
  --color-success-tint-3: #A5D6A7;
  --color-success-tint-4: #81C784;
  --color-success-tint-5: #66BB6B;
  --color-success-shade-1: #2E7E33;
  --color-success-shade-2: #2E7E33;
  --color-success-shade-3: #0A4218;
  --color-success-shade-4: #00300C;

  /* Warning */
  --color-warning: #F1C40F;
  --color-warning-tint-1: #FFF9E3;
  --color-warning-tint-2: #FFF3C2;
  --color-warning-tint-3: #FFE59A;
  --color-warning-tint-4: #FFDA66;
  --color-warning-tint-5: #F5CE40;
  --color-warning-shade-1: #D4AC0E;
  --color-warning-shade-2: #B7960B;
  --color-warning-shade-3: #9B7D0A;
  --color-warning-shade-4: #7E6607;

  /* Info */
  --color-info: #0F8FF2;
  --color-info-tint-1: #E3F2FD;
  --color-info-tint-2: #BBDEFB;
  --color-info-tint-3: #91CBF9;
  --color-info-tint-4: #64B5F7;
  --color-info-tint-5: #42A5F5;
  --color-info-shade-1: #0F73D4;
  --color-info-shade-2: #115396;
  --color-info-shade-3: #073E79;
  --color-info-shade-4: #03284D;

}