From e5e1eac73353ed4d006f41773d40699d2ebe451a Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Sun, 24 May 2026 19:28:29 +0000
Subject: [PATCH] Changes

Co-authored-by: Reifonas <211114984+Reifonas@users.noreply.github.com>
---
 src/components/ViewerControls.tsx | 18 ++++++++----------
 src/components/XRHud.tsx          | 11 ++++-------
 src/stores/useModelStore.ts       |  4 ++--
 3 files changed, 14 insertions(+), 19 deletions(-)

diff --git a/src/components/ViewerControls.tsx b/src/components/ViewerControls.tsx
index b08a0ef..cee2c2d 100644
--- a/src/components/ViewerControls.tsx
+++ b/src/components/ViewerControls.tsx
@@ -11,13 +11,14 @@ import * as THREE from 'three';
 import { elementKey, sceneRef } from '@/components/three/ModelViewer';
 
 const WIRE_COLORS = [
-  { label: 'Cinza', value: '#8899aa' },
+  { label: 'Ciano (radiante)', value: '#00f3ff' },
   { label: 'Vermelho', value: '#ef4444' },
   { label: 'Verde', value: '#22c55e' },
   { label: 'Azul', value: '#3b82f6' },
   { label: 'Amarelo', value: '#eab308' },
   { label: 'Laranja', value: '#f97316' },
   { label: 'Branco', value: '#e2e8f0' },
+  { label: 'Cinza', value: '#8899aa' },
 ];
 
 export function ViewerControls() {
@@ -108,22 +109,19 @@ export function ViewerControls() {
       <ScaleSelector />
 
       <Button
-        variant={renderMode !== 'solid' ? 'default' : 'outline'}
+        variant={renderMode === 'edges' ? 'default' : 'outline'}
         size="sm"
         className="gap-2 h-9"
-        onClick={() => {
-          const next = renderMode === 'solid' ? 'wireframe' : renderMode === 'wireframe' ? 'edges' : 'solid';
-          setRenderMode(next);
-        }}
+        onClick={() => setRenderMode(renderMode === 'edges' ? 'solid' : 'edges')}
       >
-        {renderMode === 'edges' ? <Box className="h-3.5 w-3.5" /> : <Grid3X3 className="h-3.5 w-3.5" />}
+        <Box className="h-3.5 w-3.5" />
         <span className="font-mono text-xs">
-          {renderMode === 'solid' ? 'Sólido' : renderMode === 'wireframe' ? 'Wireframe' : 'Bordas'}
+          {renderMode === 'edges' ? 'Bordas' : 'Sólido'}
         </span>
       </Button>
 
-      {/* Wireframe/Edges settings popover */}
-      {renderMode !== 'solid' && (
+      {/* Edges color/thickness/threshold popover */}
+      {renderMode === 'edges' && (
         <Popover>
           <PopoverTrigger asChild>
             <Button variant="outline" size="sm" className="gap-2 h-9">
diff --git a/src/components/XRHud.tsx b/src/components/XRHud.tsx
index 9d2c3fb..1ee75ae 100644
--- a/src/components/XRHud.tsx
+++ b/src/components/XRHud.tsx
@@ -342,15 +342,12 @@ export function XRHud({ freeMove, onToggleFreeMove, placementMode = false, onTog
               </Button>
 
               <Button
-                variant={renderMode !== 'solid' ? 'default' : 'outline'}
+                variant={renderMode === 'edges' ? 'default' : 'outline'}
                 size="sm" className="h-8 gap-1.5 text-[10px] font-mono"
-                onClick={() => {
-                  const next = renderMode === 'solid' ? 'wireframe' : renderMode === 'wireframe' ? 'edges' : 'solid';
-                  setRenderMode(next);
-                }}
+                onClick={() => setRenderMode(renderMode === 'edges' ? 'solid' : 'edges')}
               >
-                {renderMode === 'edges' ? <Box className="h-3.5 w-3.5" /> : <Grid3X3 className="h-3.5 w-3.5" />}
-                {renderMode === 'solid' ? 'Sólido' : renderMode === 'wireframe' ? 'Wire' : 'Bordas'}
+                <Box className="h-3.5 w-3.5" />
+                {renderMode === 'edges' ? 'Bordas' : 'Sólido'}
               </Button>
 
               <Button
diff --git a/src/stores/useModelStore.ts b/src/stores/useModelStore.ts
index a7e1a41..1432d84 100644
--- a/src/stores/useModelStore.ts
+++ b/src/stores/useModelStore.ts
@@ -485,10 +485,10 @@ export const useModelStore = create<ModelStore>((set, get) => ({
   setGridAutoFollow: (gridAutoFollow) => set({ gridAutoFollow }),
   nudgeGridY: (delta) => set((s) => ({ gridY: s.gridY + delta, gridAutoFollow: false })),
 
-  wireframeColor: '#8899aa',
+  wireframeColor: '#00f3ff',
   setWireframeColor: (wireframeColor) => set({ wireframeColor }),
 
-  wireframeThickness: 1,
+  wireframeThickness: 2,
   setWireframeThickness: (wireframeThickness) => set({ wireframeThickness }),
 
   edgeThresholdAngle: 15,