Weird fill for a composite 3d PShape

Processing Coding Questions
1

I am trying to fill in this shape made of bezier curves, and one of the surfaces has an extra plane when I “fill” it. The flat part of the white plane is the one I’m trying to get rid of. (see side4)

I sort of get why its happening (there is not actually a flat part, its just thin), but I’m wondering if there is a solution?

Thanks for any help!

code:

Top top1;
float xRotation = 0;
float yRotation = 0;
int sideLength = 200;
int rotationSpeed = 3;

boolean rotateUp = false;
boolean rotateDown = false;
boolean rotateLeft = false;
boolean rotateRight = false;

void setup(){
  size(500,500, P3D);
  background(0);
  lights();
  top1 = new Top();
}

void draw(){
  background(100);
  top1.update();
  
  if(rotateUp){
    xRotation += radians(rotationSpeed);}
  else if(rotateDown){
    xRotation -= radians(rotationSpeed);}
  else if(rotateLeft){
    yRotation -= radians(rotationSpeed);}
  else if(rotateRight){
    yRotation += radians(rotationSpeed);}
}

class Top {
  PShape top;
  Top(){
    top = createShape(GROUP);
    
    PVector a,b,c,d;
    
    a = new PVector(0,0,0);
    b = new PVector(sideLength,0,0);
    c = new PVector(0,sideLength,0);
    d = new PVector(0,0,sideLength);
    
    PShape side1, side2, side3, side4;
    side1 = createShape();
    side2 = createShape();
    side3 = createShape();
    side4 = createShape();
    
    side1.beginShape();
    side1.vertex(a.x,a.y,a.z);
    side1.vertex(b.x,b.y,b.z);
    side1.bezierVertex(0,0,0,0,0,0,c.x,c.y,c.z);
    side1.vertex(a.x,a.y,a.z);
    side1.endShape();
    side1.setFill(color(255,0,0));
    top.addChild(side1);
     
    side2.beginShape();
    side2.vertex(a.x,a.y,a.z);
    side2.vertex(b.x,b.y,b.z);
    side2. bezierVertex(0,0,0,0,0,0,d.x,d.y,d.z);
    side2.vertex(a.x,a.y,a.z);
    side2.endShape();
    side2.setFill(color(0,255,0));
    top.addChild(side2);
    
    side3.beginShape();
    side3.vertex(a.x,a.y,a.z);
    side3.vertex(c.x,c.y,c.z);
    side3.bezierVertex(0,0,0,0,0,0,d.x,d.y,d.z);
    side3.vertex(a.x,a.y,a.z);
    side3.endShape();
    side3.setFill(color(0,0,255));
    top.addChild(side3);
    
    
    //This is the side that is giving me issues!!
    side4.beginShape();
    side4.vertex(d.x,d.y,d.z);
    side4.bezierVertex(0,0,0,0,0,0,c.x,c.y,c.z);
    side4.bezierVertex(0,0,0,0,0,0,b.x,b.y,b.z);
    side4.bezierVertex(0,0,0,0,0,0,d.x,d.y,d.z);
    side4.endShape(); 
    side4.setStroke(color(255,0,0));
    side4.setFill(color(255,255,0));
    top.addChild(side4);
    
  }
  
  void update(){
    pushMatrix();
    translate(width/2, height/2);
    rotateX(xRotation);
    rotateY(yRotation);
    shape(top);
  /*
    rotateX(PI);
    shape(top);
    rotateZ(PI);
    shape(top);   
    rotateX(PI);
    shape(top);
    */
    popMatrix();
  }
}

void keyPressed(){
  if (keyCode == UP){
    rotateUp = true;
  }
  if (keyCode == DOWN){
    rotateDown = true;
  }
  if (keyCode == LEFT){
    rotateLeft = true;
  }
  if (keyCode == RIGHT){
    rotateRight = true;
  }
}

void keyReleased(){
  if (keyCode == UP){
    rotateUp = false;
  }
  if (keyCode == DOWN){
    rotateDown = false;
  }
  if (keyCode == LEFT){
    rotateLeft = false;
  }
  if (keyCode == RIGHT){
    rotateRight = false;
  }
}