ui: Fix dark borders on certain visualizations

[johncowen]

We recently noticed that our CSS compression seems to remove the odd border color when we compile up the UI for embedding in the binary. This results in some borders being a lot darker than they should be, but only once embedded in the binary/production (so not within our Ember development environment).

Before:

I noticed that just separating the border-color off from the shorthand border (which we do a lot anyway) seems to solve the issue without getting into too many ember-cli weeds. So this PR does that in the places I've noticed that are affected (topology and discovery chain visualizations), therefore fixing the issue and giving us time to figure out why this is happening if we want to do that (there's something to be said for just having a lint rule or something to make sure we always split the border-color, off which would make this problem go away).

After:

Notes:

• Our unPRed playwright based testing would catch/prevent this sort of thing.
• I know there was an Ember CSS compression dependency which was very out of date, but the later version was not officially supported in Ember the last time I looked. That may have changed now. If that has changed, an upgrade could help.
• Alternatively we could also go with an unsupported upgrade of the dependency and if that solves the issue, then go with that and ignore the unsupported-ness of it. I think my preferred option would be to stick to supported and if it's still an issue stick to the "always split off the border-color from the border" pattern. I like it being separate anyway (i.e. you can't do font: 12px bold red;)

[hc-github-team-consul-core]

🍒 If backport labels were added before merging, cherry-picking will start automatically.

To retroactively trigger a backport after merging, add backport labels and re-run https://circleci.com/gh/hashicorp/consul/543075.

[hc-github-team-consul-core]

🍒✅ Cherry pick of commit 1f8960d onto release/1.11.x succeeded!