@font-face {
  font-family: 'text-security';
  src: url('text-security-compat.eot');
  /*
   Hack to prevent Firefox from loading the compatibility fonts.
   Without this, ff will download both compatibility and optimized fonts
   even though only the optimized version is needed. Bug in ff?
  */
  font-style: oblique;
  src: url('text-security-compat.eot?#iefix') format('embedded-opentype'),
      url('text-security-compat.woff2') format('woff2'),
      url('text-security-compat.ttf') format('truetype');
}

/*
  Browser detection hack to enable the optimized font in recent versions of Chromium and FF,
  which implement their own font rendering and do support cmap format 13.

  content-visibility is currently only supported in Chrome & Edge version 85+ & Chrome for Android
  -moz-is-html only lets Firefox through
  -webkit-hyphens explicitly excludes Safari in case they later add support for content-visibility
*/
@supports ((content-visibility: visible) or selector(:-moz-is-html)) and (not (-webkit-hyphens:none)) {
  @font-face {
    font-family: 'text-security';
    src: url('text-security.woff2') format('woff2'), url('text-security-compat.ttf') format('truetype');
  }
}

@font-face {
  font-family: 'text-security';
  src: url('text-security-compat.eot');
  src: url('text-security-compat.eot?#iefix') format('embedded-opentype'),
      url('text-security-compat.woff2') format('woff2'),
      url('text-security-compat.ttf') format('truetype');
}

/*
  Browser detection hack to enable the optimized font in recent versions of Chromium and FF,
  which implement their own font rendering and do support cmap format 13.

  content-visibility is currently only supported in Chrome & Edge version 85+ & Chrome for Android
  -moz-is-html only lets Firefox through
  -webkit-hyphens explicitly excludes Safari in case they later add support for content-visibility
*/
@supports ((content-visibility: visible) or selector(:-moz-is-html)) and (not (-webkit-hyphens: none)) {
  @font-face {
    font-family: 'text-security';
    src: url('text-security.woff2') format('woff2'),
      url('text-security-compat.ttf') format('truetype');
  }
}

Remove ff double loading prevention hack
Remove ff double loading prevention hack

Turns out Firefox loads both fonts only under very specific condition:
the text must contain an emoji already before the font is loaded. If it
doesn't, ff correctly only loads the optimized font. Explicitly setting
unicode-range didn't help.

Inserting an emoji to the input field _after_ the optimized font has
been loaded does not trigger the compatibily font to be loaded, which is
good because that would've been a security concern.

The font-style: opaque hack did work, but I don't care to keep it if it
doesn't help anyone in practice. Who knows what other problems it might
cause in some other browsers.
