Add fallback font for masked-input (#12152)

* add fallback font for higher unicode coverage

* remove extra mixin and fix color issue that was not working on binary

ui/app/styles/app.scss

@@ -10,3 +10,6 @@
 }
 
 @include font-face('obscure');
+// Font comes from npm package: https://www.npmjs.com/package/text-security
+// We took the font we wanted and moved it into the ui/fonts folder
+@include font-face('text-security-square');

ui/app/styles/core/forms.scss

@@ -12,10 +12,9 @@ label {
 }
 
 .masked-font {
-  font-family: obscure;
+  font-family: obscure, text-security-square;
   font-size: $size-medium;
   letter-spacing: 2px;
-  color: $ui-gray-300;
 }
 
 .label {