Yes, it's absolutely safe to use CSS Flexbox, provided you use appropriate fallback. With the Hashnode web app, we are using CSS Flexbox in most of the components. If your audience uses IE11 and above, you should definitely take advantage of CSS Flexbox.

As you have rightly pointed out, most of the browsers have implemented most of the Flexbox functionalities.

Talking about the fallbacks, here are a few which we are using:

For the display property:

display: -webkit-box;
display: -ms-flexbox;
display: flex;

For the order property:

-webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;

For the flex-direction property:

-webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;

Similarly, there's a fallback for all the Flexbox keywords. Use this tool (Pleeease Play) for generating, and confirming the fallback rules.

TIP: A Complete Guide to Flexbox should be your CSS Flexbox bible.

I would definitely recommend to use Flexbox, it's a great tool, saves a lot of time. You can solve complex UI problems with just a few CSS properties ! It's worth the small 4% that won't have the support for it ! Plus, I do really think that Flexbox is gonna be the new standard if it's no already.

Use it. :) As long as you use all the prefixes, you are fine. Edge works fine too. Just don't go to exotic ;)

But there're some bugs, see https://github.com/philipwalton/flexbugs

Depends. What users do you care about? What browsers do they use? If your target audience is 85 y/o house women, it's quite likely they use a very old version of IE which does not support flexbox.

Always research your target audience first, then build the app based on what you learned. Alternatively, use MVP and the Skateboard Principle to find out more about your audience.