🚀 Auto-deploy: BrainWind atualizado em 12/07/2026 17:11:46

app/src/components/three/IsolatedRoof3D.tsx

@@ -28,11 +28,17 @@ export interface IsolatedRoof3DInput {
   forceKN: number;
 }
 
-function pressureColor(cpe: number): THREE.Color {
-  const clamped = Math.max(-2.5, Math.min(1.5, cpe));
-  const t = (clamped + 2.5) / 4.0;
-  const h = 240 - t * 240; // azul -> vermelho
-  return new THREE.Color(`hsl(${h}, 75%, 50%)`);
+function pressureColor(cpe: number, isDark: boolean): THREE.Color {
+  if (Math.abs(cpe) < 0.05) return new THREE.Color(isDark ? '#475569' : '#cbd5e1');
+  if (cpe > 0) {
+    // Sucção (Vermelho)
+    const intensity = Math.min(1, cpe / 2.0);
+    return new THREE.Color(`hsl(0, ${60 + intensity * 30}%, ${50 - intensity * 10}%)`);
+  } else {
+    // Pressão (Azul)
+    const intensity = Math.min(1, Math.abs(cpe) / 2.0);
+    return new THREE.Color(`hsl(210, ${60 + intensity * 30}%, ${50 - intensity * 10}%)`);
+  }
 }
 
 function IsolatedRoofModel({
@@ -56,8 +62,8 @@ function IsolatedRoofModel({
   const halfDepth = depth / 2;
   const halfWidth = width / 2;
 
-  const windwardColor = useMemo(() => pressureColor(cpeWindward), [cpeWindward]);
-  const leewardColor = useMemo(() => pressureColor(cpeLeeward), [cpeLeeward]);
+  const windwardColor = useMemo(() => pressureColor(cpeWindward, isDark), [cpeWindward, isDark]);
+  const leewardColor = useMemo(() => pressureColor(cpeLeeward, isDark), [cpeLeeward, isDark]);
 
   const h_diff = depth * Math.tan(thetaRad);
   const h_half = (depth / 2) * Math.tan(thetaRad);
@@ -214,6 +220,31 @@ function IsolatedRoofModel({
         </Text>
       </group>
 
+      {/* Cota de Largura (b) */}
+      <group position={[0, height / 2, halfDepth + 0.4]}>
+        <mesh position={[0, 0, 0]}>
+          <boxGeometry args={[width, 0.015, 0.015]} />
+          <meshStandardMaterial color={lineMaterialColor} />
+        </mesh>
+        <mesh position={[halfWidth, 0, 0]}>
+          <boxGeometry args={[0.015, 0.1, 0.015]} />
+          <meshStandardMaterial color={lineMaterialColor} />
+        </mesh>
+        <mesh position={[-halfWidth, 0, 0]}>
+          <boxGeometry args={[0.015, 0.1, 0.015]} />
+          <meshStandardMaterial color={lineMaterialColor} />
+        </mesh>
+        <Text
+          position={[0, 0.15, 0]}
+          fontSize={0.25}
+          color={labelColor}
+          anchorX="center"
+          anchorY="bottom"
+        >
+          b = {width}m
+        </Text>
+      </group>
+
       {/* Rótulo Superior */}
       <Text
         position={[0, centerY + 3, 0]}
@@ -248,7 +279,7 @@ export default function IsolatedRoof3DViewer({
   );
 
   return (
-    <SceneCanvas
+    <SceneCanvas moduleId="cobertura_isolada"
       shadows
       gl={{ preserveDrawingBuffer: true, antialias: true }}
       camera={{ position: [cameraDistance, cameraDistance * 0.8, cameraDistance], fov: 40 }}