Update decision log header spacing and archived count

What does this MR do and why?

This MR is a UX follow-up for the decision log panel header. It fixes two items from the UX review of !256580 (merged), and it adds a small utility.

• Wrapping on XS viewports: The header row now uses gl-flex-wrap. The count, the "Show archived" toggle and the "New decision" button wrap on narrow screens and do not overflow.
• Wider gap: The gap between the header elements changes from 8px to 16px. The class is gl-gap-5, because in @gitlab/ui gl-gap-4 is 12px and gl-gap-5 is 16px.
• New getArchivedDecisions utility: utils.js now has a getArchivedDecisions function. The panel uses it to calculate archivedCount, and does not subtract the active count from the total. The activeDecisions comment now also explains why "active" means "not archived".

References

• Resolves #630200 (closed)
• Follow-up from !256580 (merged)
• Related to #629493 (closed)

Screenshots or screen recordings

Viewport size	After
xs (<576px)
sm and up

How to set up and validate locally

1. Open a work item that has at least one decision in its decision log.
2. Open the Decision log panel.
3. At a normal viewport, make sure the header is on one line with a 16px gap between the elements.
4. Archive a decision, and make sure the "Show archived" count is correct.
5. Make the viewport narrower than 576px, and make sure the header elements wrap without overflow.

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.