From 719ddef3ba3bc6acbcf0c95b69281d78f2f533cf Mon Sep 17 00:00:00 2001
From: Tom Boullay <tom@famille-boullay.fr>
Date: Wed, 29 Apr 2026 11:56:46 +0200
Subject: [PATCH] fix: position perf panel beside debug gui

---
 src/components/debug/DebugPerf.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/components/debug/DebugPerf.tsx b/src/components/debug/DebugPerf.tsx
index 34617ec..31bdfed 100644
--- a/src/components/debug/DebugPerf.tsx
+++ b/src/components/debug/DebugPerf.tsx
@@ -3,6 +3,9 @@ import { Debug } from "@/utils/debug/Debug";
 
 const Perf = lazy(() => import("r3f-perf").then((m) => ({ default: m.Perf })));
 
+const DEBUG_GUI_WIDTH = 245;
+const DEBUG_PANEL_GAP = 20;
+
 export function DebugPerf(): React.JSX.Element | null {
   const debug = Debug.getInstance();
 
@@ -12,7 +15,10 @@ export function DebugPerf(): React.JSX.Element | null {
 
   return (
     <Suspense fallback={null}>
-      <Perf position="top-right" />
+      <Perf
+        position="top-right"
+        style={{ right: DEBUG_GUI_WIDTH + DEBUG_PANEL_GAP }}
+      />
     </Suspense>
   );
 }