From aa22ba1c27b8744d491e0dbe018954659222a0d6 Mon Sep 17 00:00:00 2001
From: Padreug <padreug@aiolabs.dev>
Date: Tue, 22 Sep 2026 14:54:57 +0200
Subject: [PATCH] fix(machine): keep the mouse pointer visible on the web demo
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

index.html's inline <style> hid the cursor on any viewport >= 1024px:

    @media (min-width: 1024px) { html, body { overflow: hidden; cursor: none; } }

which is every desktop browser opening the public demo. Descendants inherit
it, so the pointer vanished everywhere except over buttons — those carry
Tailwind's .cursor-pointer, which overrode the inherited value and made the
bug look stranger than it was.

This is the rule the earlier .kiosk scoping missed: src/style.css got gated,
this one did not, so the two disagreed.

Delete it rather than gate it. src/style.css's `.kiosk, .kiosk *` rule already
covers <html> and every descendant with !important, and main.ts applies that
class unless VITE_DEMO_TAG is set — so real machines are unaffected and cursor
hiding now has exactly one owner, the one that knows whether this is a kiosk.
The block here cannot make that call: it is static HTML, and the page CSP
(script-src 'self') forbids an inline script that could read the env.

overflow: hidden stays as it was — untouched on both.

Verified by building both ways: without the tag the built HTML has no cursor
rule, the JS still adds .kiosk and the CSS still carries the !important
hide; with the tag the .kiosk branch is dead-code-eliminated and no
cursor: none survives anywhere.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_013A6683cCHnQxFUosx1krY4
---
 apps/machine/index.html | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/apps/machine/index.html b/apps/machine/index.html
index 7b3a983..81f3e36 100644
--- a/apps/machine/index.html
+++ b/apps/machine/index.html
@@ -33,12 +33,17 @@
         padding: 0;
         background: #000;
       }
-      /* Kiosk-only: lock overflow and hide cursor */
+      /* Kiosk-only: lock overflow. The cursor is NOT hidden here — that is
+         src/style.css's `.kiosk` rule, which main.ts applies at runtime unless
+         VITE_DEMO_TAG is set. This block can't make that distinction (static
+         HTML, and the CSP forbids an inline script to read the env), so a
+         `cursor: none` here would also blank the pointer on the public web
+         demo, where people drive the kiosk with a mouse. One owner for cursor
+         hiding, and it is the one that knows whether this is a real machine. */
       @media (min-width: 1024px) {
         html,
         body {
           overflow: hidden;
-          cursor: none;
         }
       }
     </style>
-- 
2.55.0