fix: external module color precision error

src/components/ArmorMesh/components/Armor/shaders/fragment.glsl

@@ -56,7 +56,7 @@ void main() {
 
     if (isUnderExternalModule) {
       // external modules don't care about angle, they'll reduce penetration by their thickness
-      float externalModuleThickness = externalModuleMaskColor.r * maxThickness;
+      float externalModuleThickness = externalModuleMaskColor.g * maxThickness;
       remainingPenetration -= externalModuleThickness;
     }
 

src/components/ArmorMesh/components/ExternalModuleMask.tsx

@@ -1,5 +1,5 @@
 import { MeshProps } from '@react-three/fiber';
-import { WebGLRenderTarget } from 'three';
+import { Color, WebGLRenderTarget } from 'three';
 
 export const externalModuleMaskRenderTarget = new WebGLRenderTarget();
 
@@ -29,9 +29,7 @@ export function ArmorMeshExternalModuleMask(
       {!props.exclude && (
         <mesh {...props} renderOrder={1}>
           <meshBasicMaterial
-            color={`rgb(255, ${
-              (props.thickness / props.maxThickness) * 255
-            }, 0)`}
+            color={new Color(1, props.thickness / props.maxThickness, 0)}
             depthWrite={false}
           />
         </mesh>