Side by side, the other way: the portfolio's playground can show this page

Why

inside.hoortrend.com already shows the portfolio's playground next to it ("Side by side"). This adds the other way round: the playground page of the portfolio can show inside next to its buttons, the same layout (playground on the left, inside on the right).

What changes

• /?embed=1: this page alone. It hides the playground link, the side-by-side button, the language button, the lead paragraph and the footer. The portfolio passes its language (lang=) because a framed page gets its own storage. Links open a new tab.
• Headers: only / (or /index.html) with embed=1 may be framed, and only by https://portfolio.ilyes-litim.fr (frame-ancestors, no X-Frame-Options). Every other response is unchanged: frame-ancestors 'none' and X-Frame-Options: DENY. New test test_embedded_page_only_for_the_portfolio.
• The embedded page never opens its own side-by-side mode, so no page frames itself through the other.
• Machinery wires: they are now hidden exactly when the CSS switches to the narrow layout (container query on the page), instead of by a separate width test in JS. Between the two thresholds the two-column layout had no wires; the portfolio's pane (about 800 px) fell right there.

Checked

• 24 unit tests, JS syntax.
• Browser test under the real host names: local pages with these headers, live data from production.
  • Portfolio → inside: the frame loads and the language follows the portfolio's button.
  • The frame is emptied when the visitor leaves the playground page and comes back when they return.
  • inside → playground still works, and the framed playground offers no side by side.
  • The normal page https://inside.hoortrend.com/ is refused in a frame (frame-ancestors 'none').
• 21 wires drawn in the 800 px pane (0 before).

Goes with the portfolio MR that adds the button; this one must be deployed first.

🤖 Generated with Claude Code