Improve the way `SkulptRunner.jsx` hides elements

[maxelkins]

(Tech Debt) SkulptRunner Visual Output Hiding

The visual output panel in SkulptRunner.jsx currently uses display: none; to hide elements. This resolved a Cypress test failure.

However, a better approach would be to conditionally render these elements, similar to PyodideRunner.jsx (ref), for improved performance and cleaner React practice. This refactoring was deferred to keep a recent PR small.

Some reason why this might be the preferred approach:

• Performance: Prevents rendering unnecessary DOM elements, reducing browser workload.
• Resource Management: Components only initialise effects, timers, etc., when actually mounted.
• Clarity: JSX directly reflects what's in the DOM, making code easier to understand.
• Robustness: Avoids subtle CSS conflicts and ensures elements are truly absent (e.g., for tests and accessibility).

Suggestions

• Change SkulptRunner.jsx to conditionally render the elements
• Change the cypress test to check for existence rather than Visibility since this is more robust.