🚀 Auto-deploy: melhoria no snap e medição AR em 25/05/2026 18:53:07

src/pages/MeetingRoom.tsx

@@ -1384,12 +1384,36 @@ export default function MeetingRoom() {
               
               {/* Enquadramento centralizado perfeito (Camera apontando e fov adequado) */}
               <div className="h-40 w-full flex items-center justify-center relative bg-slate-900/60 rounded-lg overflow-hidden border border-border">
-                {isWebGLSupported ? (
+                {currentAvatar?.url.endsWith('.png') ? (
-                  <Canvas camera={{ position: [0, 0.11, 0.28], fov: 42 }}>
+                  /* Renderização nativa 2D rápida e responsiva para avatares PNG, evitando bloqueio de cliques */
+                  <div className="relative w-full h-full flex items-center justify-center bg-gradient-to-b from-slate-950/40 to-slate-950/90 overflow-hidden">
+                    {/* Efeito Glow de Fundo combinando com a cor do avatar */}
+                    <div 
+                      className="absolute w-24 h-24 rounded-full blur-[28px] opacity-40 transition-all duration-500" 
+                      style={{ backgroundColor: currentAvatar.color }}
+                    />
+                    
+                    {/* Imagem do Avatar enquadrada com proporção mantida e sombra estilizada */}
+                    <img 
+                      src={currentAvatar.url} 
+                      alt={currentAvatar.name}
+                      className="h-28 w-28 object-contain z-10 select-none pointer-events-none drop-shadow-[0_6px_12px_rgba(0,0,0,0.4)] animate-in fade-in zoom-in-90 duration-300"
+                      onError={(e) => {
+                        (e.currentTarget as HTMLImageElement).src = `https://ui-avatars.com/api/?name=${encodeURIComponent(name || 'U')}&background=475569&color=fff&size=128&rounded=true`;
+                      }}
+                    />
+                  </div>
+                ) : isWebGLSupported ? (
+                  /* Renderização 3D para modelos GLB */
+                  <Canvas 
+                    camera={{ position: [0, 0.08, 0.32], fov: 45 }} 
+                    style={{ pointerEvents: 'none' }}
+                    className="w-full h-full"
+                  >
                     <ambientLight intensity={0.8} />
                     <directionalLight position={[2, 3, 2]} intensity={1.5} />
                     <pointLight position={[0, 0.15, 0.2]} intensity={1} color={currentAvatar.color} />
-                    <MiiAvatar avatarId={selectedAvatar} username={name || 'Você'} position={[0, -0.04, 0]} isTalking={true} scale={0.36} inLobby={true} />
+                    <MiiAvatar avatarId={selectedAvatar} username={name || 'Você'} position={[0, -0.05, 0]} isTalking={true} scale={0.24} inLobby={true} />
                   </Canvas>
                 ) : (
                   <div className="flex flex-col items-center justify-center h-full w-full bg-slate-950/80 p-4 text-center">
@@ -1416,7 +1440,7 @@ export default function MeetingRoom() {
                   type="button"
                   variant="ghost" 
                   size="icon" 
-                  className="absolute left-2 h-8 w-8 rounded-full border bg-background/50 hover:bg-background z-40" 
+                  className="absolute left-2 h-8 w-8 rounded-full border bg-background/50 hover:bg-background z-50 pointer-events-auto cursor-pointer" 
                   onClick={(e) => {
                     e.preventDefault();
                     e.stopPropagation();
@@ -1429,7 +1453,7 @@ export default function MeetingRoom() {
                   type="button"
                   variant="ghost" 
                   size="icon" 
-                  className="absolute right-2 h-8 w-8 rounded-full border bg-background/50 hover:bg-background z-40" 
+                  className="absolute right-2 h-8 w-8 rounded-full border bg-background/50 hover:bg-background z-50 pointer-events-auto cursor-pointer" 
                   onClick={(e) => {
                     e.preventDefault();
                     e.stopPropagation();