From f4bc29299109333e3ae610c03bad843804472191 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Thu, 14 May 2026 18:27:36 +0000
Subject: [PATCH] Changes

Co-authored-by: Reifonas <211114984+Reifonas@users.noreply.github.com>
---
 src/components/three/XRHudInWorld.tsx | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/components/three/XRHudInWorld.tsx b/src/components/three/XRHudInWorld.tsx
index 95a26a2..ce1921b 100644
--- a/src/components/three/XRHudInWorld.tsx
+++ b/src/components/three/XRHudInWorld.tsx
@@ -135,7 +135,15 @@ export function XRHudInWorld(props: XRHudInWorldProps) {
   );
 }
 
-function FloatingPanel({ tab, setTab, ...p }: { tab: Tab; setTab: (t: Tab) => void } & XRHudInWorldProps) {
+function FloatingPanel({
+  tab, setTab, pinned, onTogglePin, onRecenter, ...p
+}: {
+  tab: Tab;
+  setTab: (t: Tab) => void;
+  pinned: boolean;
+  onTogglePin: () => void;
+  onRecenter: () => void;
+} & XRHudInWorldProps) {
   const tabs: { id: Tab; label: string; icon: string }[] = [
     { id: 'scene', label: 'Cena', icon: '🧩' },
     { id: 'tools', label: 'Ferram.', icon: '🛠' },
@@ -150,10 +158,14 @@ function FloatingPanel({ tab, setTab, ...p }: { tab: Tab; setTab: (t: Tab) => vo
             anchorX="left" anchorY="middle">
         TrackSteelXR · HUD AR
       </Text>
-      <Text position={[W / 2 - 0.012, H / 2 - 0.018, 0.002]} fontSize={0.008} color="#94a3b8"
-            anchorX="right" anchorY="middle">
-        Botão A (esq) abre/fecha
-      </Text>
+      {/* Pin / Recenter controls (replace the previous static "A button" hint) */}
+      <group position={[W / 2 - 0.012, H / 2 - 0.018, 0.002]}>
+        <XR3DButton position={[-0.045, 0, 0]} size={[0.05, 0.022]}
+          label={pinned ? '📌 Fixo' : '↻ Solto'}
+          active={pinned} onClick={onTogglePin} fontSize={0.007} />
+        <XR3DButton position={[0.012, 0, 0]} size={[0.058, 0.022]}
+          label="⎚ Trazer" onClick={onRecenter} fontSize={0.007} />
+      </group>
 
       <group position={[0, H / 2 - 0.045, 0.001]}>
         {tabs.map((t, i) => (