feat(demo): enable native player controls on hover

Flip the asciinema-player from controls:false to controls:"auto" so
visitors can pause/seek the hero scan demo via the native control bar.
The bar reveals on hover and auto-hides otherwise, keeping the hero
clean; autoPlay/loop are unchanged. The bar is transparent with icons
inheriting --term-color-foreground, so it adapts to both cast themes
with no extra CSS.

Author: misonijnik

src/components/DemoSection.tsx

@@ -53,7 +53,7 @@ export function DemoSection() {
           autoPlay: true,
           loop: true,
           preload: true,
-          controls: false,
+          controls: "auto",
           poster: "npt:0:0.1",
           theme: demoTheme,
           terminalFontFamily: "'JetBrains Mono', monospace",

src/components/__tests__/DemoSection.test.tsx

@@ -68,6 +68,12 @@ describe("DemoSection", () => {
     expect(lastCreateOptions().theme).toBe("opentaint-dark");
   });
 
+  it("enables the native control bar in hover-reveal mode", async () => {
+    render(<DemoSection />);
+    await flushAsync();
+    expect(lastCreateOptions().controls).toBe("auto");
+  });
+
   it("uses the light cast theme on a dark page", async () => {
     document.documentElement.classList.add("dark");
     render(<DemoSection />);