Improve position-try-fallbacks demos

On MDN, we have several places that feature anchor positioning position-try-fallbacks demos:

- https://developer.mozilla.org/en-US/docs/Web/CSS/@position-try
- https://developer.mozilla.org/en-US/docs/Web/CSS/position-try-fallbacks
- https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_anchor_positioning/Try_options_hiding

The issue is that they don't seem to work particularly well. They don't work smoothly in terms of trying all the different fallbacks. They seem buggy.

To improve things, I have written some new demos:

- position-try-fallbacks test with position try keywords: https://codepen.io/Chris-Mills/pen/gbPjWdK
- position-try-fallbacks test with position-area values: https://codepen.io/Chris-Mills/pen/LEGBjRv
- QUESTION: The `bottom left` and `bottom right` fallbacks don't seem to work, and I'm not sure why. Does anyone know?
- position-try-fallbacks test with custom @position-try fallbacks: https://codepen.io/Chris-Mills/pen/xbZJLMv
- QUESTION: The `--custom-bottom-right` and `--custom-top-right` fallbacks don't seem to work, and I'm not sure why. Does anyone know?

The demo can be controlled in the following ways:

- Click the mouse to move the anchor to that position.
- Use the WASD keys to move the anchor top, right, bottom, left.

I'm intending to implement these on the referenced pages, but I'd like some help in figuring out answers to the above questions. Maybe @mfreed7 or @estelle would have some thoughts?