Refactor code structure for improved readability and maintainability. Changed the plane to a SU-30 fighter jet

src/Aircraft.js

@@ -38,202 +38,521 @@ export class Aircraft {
   }
 
   createAircraftMesh() {
-    // Ultra-premium stealth sci-fi materials
-    const hullMat = new THREE.MeshStandardMaterial({
-      color: 0x11141a,
-      roughness: 0.35,
-      metalness: 0.85,
+    // Su-30 Fighter Jet Materials - Russian Air Force blue-gray camouflage
+    const mainBodyMat = new THREE.MeshStandardMaterial({
+      color: 0x4a5868,  // Blue-gray base (Russian camouflage)
+      roughness: 0.5,
+      metalness: 0.45,
       flatShading: true
     });
-    const panelMat = new THREE.MeshStandardMaterial({
-      color: 0x0a0c10,
-      roughness: 0.4,
-      metalness: 0.9,
+    const darkPanelMat = new THREE.MeshStandardMaterial({
+      color: 0x2a3540,  // Darker blue-gray panels
+      roughness: 0.55,
+      metalness: 0.5,
+      flatShading: true
+    });
+    const lightPanelMat = new THREE.MeshStandardMaterial({
+      color: 0x6a7585,  // Lighter blue-gray panels
+      roughness: 0.45,
+      metalness: 0.4,
+      flatShading: true
+    });
+    const noseConeMat = new THREE.MeshStandardMaterial({
+      color: 0x1a1a1a,  // Dark radar nose cone
+      roughness: 0.3,
+      metalness: 0.2,
       flatShading: true
     });
-    const glassMat = new THREE.MeshStandardMaterial({
-      color: 0x000000,
-      emissive: 0x0088ff,
-      emissiveIntensity: 0.15,
-      roughness: 0.1,
-      metalness: 0.9,
+    const canopyGlassMat = new THREE.MeshStandardMaterial({
+      color: 0x0a1520,
+      emissive: 0x1a3040,
+      emissiveIntensity: 0.12,
+      roughness: 0.05,
+      metalness: 0.95,
       transparent: true,
-      opacity: 0.85,
+      opacity: 0.75
+    });
+    const canopyFrameMat = new THREE.MeshStandardMaterial({
+      color: 0x1a1a1a,
+      roughness: 0.4,
+      metalness: 0.6,
       flatShading: true
     });
-    const accentMat = new THREE.MeshStandardMaterial({
-      color: 0x00e5ff,
-      emissive: 0x00e5ff,
-      emissiveIntensity: 1.2,
-      toneMapped: false
+    const exhaustNozzleMat = new THREE.MeshStandardMaterial({
+      color: 0x2a2825,
+      roughness: 0.7,
+      metalness: 0.3,
+      flatShading: true
+    });
+    // Camouflage secondary color for upper surfaces
+    const camoDarkMat = new THREE.MeshStandardMaterial({
+      color: 0x354555,  // Darker camo patches
+      roughness: 0.5,
+      metalness: 0.45,
+      flatShading: true
     });
 
     this.mesh = new THREE.Group();
 
-    // 1. Fuselage
-    const fwdFuselage = new THREE.Mesh(new THREE.CylinderGeometry(0.05, 0.7, 4.5, 6), hullMat);
-    fwdFuselage.rotation.x = Math.PI / 2;
-    fwdFuselage.position.set(0, 0.2, 2.25);
-    fwdFuselage.scale.set(1.1, 0.6, 1);
-    this.mesh.add(fwdFuselage);
+    // Helper function to create symmetrical parts
+    const addPair = (factory) => {
+      this.mesh.add(factory(1));
+      this.mesh.add(factory(-1));
+    };
 
-    const aftFuselage = new THREE.Mesh(new THREE.CylinderGeometry(0.7, 0.4, 4.5, 6), hullMat);
+    // ==================== FUSELAGE ====================
+    // Nose cone (radome) - pointed conical shape
+    const noseCone = new THREE.Mesh(new THREE.ConeGeometry(0.45, 2.2, 8), noseConeMat);
+    noseCone.rotation.x = Math.PI / 2;
+    noseCone.position.set(0, 0.05, 5.1);
+    this.mesh.add(noseCone);
+
+    // Forward fuselage - contains tandem cockpit
+    const forwardFuselage = new THREE.Mesh(
+      new THREE.CylinderGeometry(0.55, 0.72, 3.8, 8),
+      mainBodyMat
+    );
+    forwardFuselage.rotation.x = Math.PI / 2;
+    forwardFuselage.position.set(0, 0.08, 3.0);
+    forwardFuselage.scale.set(1.0, 0.75, 1.0);
+    this.mesh.add(forwardFuselage);
+
+    // Center fuselage - wider, contains intakes
+    const centerFuselage = new THREE.Mesh(
+      new THREE.CylinderGeometry(0.85, 0.78, 3.0, 8),
+      mainBodyMat
+    );
+    centerFuselage.rotation.x = Math.PI / 2;
+    centerFuselage.position.set(0, 0.0, 0.3);
+    centerFuselage.scale.set(1.0, 0.7, 1.0);
+    this.mesh.add(centerFuselage);
+
+    // Aft fuselage - narrowing toward engines
+    const aftFuselage = new THREE.Mesh(
+      new THREE.CylinderGeometry(0.78, 0.55, 3.0, 8),
+      mainBodyMat
+    );
     aftFuselage.rotation.x = Math.PI / 2;
-    aftFuselage.position.set(0, 0.2, -2.25);
-    aftFuselage.scale.set(1.1, 0.5, 1);
+    aftFuselage.position.set(0, 0.0, -2.0);
+    aftFuselage.scale.set(1.0, 0.65, 1.0);
     this.mesh.add(aftFuselage);
 
-    // Smooth belly
-    const belly = new THREE.Mesh(new THREE.BoxGeometry(1.2, 0.2, 7.5), panelMat);
-    belly.position.set(0, -0.15, -0.2);
-    this.mesh.add(belly);
+    // Engine nacelle area (between engines)
+    const tailBoom = new THREE.Mesh(
+      new THREE.BoxGeometry(0.6, 0.45, 2.5),
+      darkPanelMat
+    );
+    tailBoom.position.set(0, 0.1, -3.8);
+    this.mesh.add(tailBoom);
+
+    // Belly spine
+    const bellySpine = new THREE.Mesh(
+      new THREE.BoxGeometry(0.5, 0.25, 6.0),
+      darkPanelMat
+    );
+    bellySpine.position.set(0, -0.38, 0.3);
+    this.mesh.add(bellySpine);
+
+    // ==================== CANOPY (Tandem Two-Seat) ====================
+    // Front canopy (pilot)
+    const frontCanopy = new THREE.Mesh(
+      new THREE.SphereGeometry(0.48, 12, 10),
+      canopyGlassMat
+    );
+    frontCanopy.scale.set(1.0, 0.55, 1.2);
+    frontCanopy.position.set(0, 0.42, 3.4);
+    this.mesh.add(frontCanopy);
+
+    // Rear canopy (WSO - Weapons Systems Officer)
+    const rearCanopy = new THREE.Mesh(
+      new THREE.SphereGeometry(0.48, 12, 10),
+      canopyGlassMat
+    );
+    rearCanopy.scale.set(1.0, 0.5, 1.1);
+    rearCanopy.position.set(0, 0.42, 2.3);
+    this.mesh.add(rearCanopy);
+
+    // Canopy frames
+    const frontFrame = new THREE.Mesh(
+      new THREE.BoxGeometry(0.06, 0.06, 0.9),
+      canopyFrameMat
+    );
+    frontFrame.position.set(0, 0.52, 3.4);
+    this.mesh.add(frontFrame);
+
+    const rearFrame = new THREE.Mesh(
+      new THREE.BoxGeometry(0.06, 0.06, 0.85),
+      canopyFrameMat
+    );
+    rearFrame.position.set(0, 0.50, 2.3);
+    this.mesh.add(rearFrame);
 
-    // 2. Canopy
-    const canopy = new THREE.Mesh(new THREE.CylinderGeometry(0.02, 0.4, 3.2, 6), glassMat);
-    canopy.rotation.x = Math.PI / 2 - 0.06; // tilted back slightly
-    canopy.position.set(0, 0.65, 1.4);
-    canopy.scale.set(1, 0.7, 1);
-    this.mesh.add(canopy);
+    // Divider frame between front and rear canopies
+    const dividerFrame = new THREE.Mesh(
+      new THREE.BoxGeometry(0.7, 0.04, 0.06),
+      canopyFrameMat
+    );
+    dividerFrame.position.set(0, 0.46, 2.85);
+    this.mesh.add(dividerFrame);
 
-    // 3. Main Delta Wings
-    const makeWing = (dir) => {
-      const shape = new THREE.Shape();
-      if (dir === 1) { // Right wing
-        shape.moveTo(0, 2.0);        // root front
-        shape.lineTo(5.8, -1.0);     // tip front
-        shape.lineTo(5.8, -2.0);     // tip back
-        shape.lineTo(0, -3.5);       // root back
-      } else { // Left wing (reverse winding to avoid internal normals)
-        shape.moveTo(0, 2.0);
-        shape.lineTo(0, -3.5);
-        shape.lineTo(-5.8, -2.0);
-        shape.lineTo(-5.8, -1.0);
-      }
-      const geo = new THREE.ExtrudeGeometry(shape, { depth: 0.1, bevelEnabled: true, bevelThickness: 0.02, bevelSize: 0.02, bevelSegments: 1 });
-      const mesh = new THREE.Mesh(geo, panelMat);
-      mesh.rotation.x = Math.PI / 2; // Flat on XZ plane
-      mesh.position.set(0, 0.05, -0.5); // Shift back 
-      return mesh;
-    };
-    this.mesh.add(makeWing(1), makeWing(-1));
+    // Dorsal spine hump behind cockpit (houses avionics for two-seat config)
+    const dorsalHump = new THREE.Mesh(
+      new THREE.BoxGeometry(0.55, 0.18, 1.2),
+      mainBodyMat
+    );
+    dorsalHump.position.set(0, 0.32, 1.5);
+    this.mesh.add(dorsalHump);
 
-    // 4. Canards (Front wings)
-    const makeCanard = (dir) => {
+    // Dorsal airbrake (behind the hump)
+    const dorsalAirbrake = new THREE.Mesh(
+      new THREE.BoxGeometry(0.45, 0.4, 0.08),
+      darkPanelMat
+    );
+    dorsalAirbrake.position.set(0, 0.45, 0.8);
+    dorsalAirbrake.rotation.x = -0.15;
+    this.mesh.add(dorsalAirbrake);
+
+    // Canopy rear bulkhead
+    const canopyRearFrame = new THREE.Mesh(
+      new THREE.BoxGeometry(0.65, 0.05, 0.06),
+      canopyFrameMat
+    );
+    canopyRearFrame.position.set(0, 0.44, 1.8);
+    this.mesh.add(canopyRearFrame);
+
+    // ==================== IRST (Infra-Red Search and Track) ====================
+    // Distinctive ball in front of the windshield - Su-30 feature
+    const irstBall = new THREE.Mesh(
+      new THREE.SphereGeometry(0.12, 12, 12),
+      new THREE.MeshStandardMaterial({
+        color: 0x1a1a1a,
+        roughness: 0.2,
+        metalness: 0.1
+      })
+    );
+    irstBall.position.set(0, 0.35, 4.2);
+    this.mesh.add(irstBall);
+
+    // IRST housing
+    const irstHousing = new THREE.Mesh(
+      new THREE.CylinderGeometry(0.08, 0.12, 0.15, 8),
+      mainBodyMat
+    );
+    irstHousing.rotation.x = Math.PI / 2;
+    irstHousing.position.set(0, 0.28, 4.15);
+    this.mesh.add(irstHousing);
+
+    // ==================== LERX (Leading Edge Root Extensions) ====================
+    addPair((dir) => {
+      const lerx = new THREE.Mesh(
+        new THREE.BoxGeometry(2.2, 0.08, 1.8),
+        mainBodyMat
+      );
+      lerx.position.set(dir * 1.1, 0.0, 1.8);
+      lerx.rotation.y = dir * 0.35;
+      return lerx;
+    });
+
+    // ==================== MAIN DELTA WINGS ====================
+    const createWing = (dir) => {
       const shape = new THREE.Shape();
+      // Delta wing planform - typical Su-27/J-16 shape
       if (dir === 1) {
-        shape.moveTo(0, 0.5);
-        shape.lineTo(1.8, -0.2);
-        shape.lineTo(1.8, -0.6);
-        shape.lineTo(0, -0.8);
+        shape.moveTo(0.6, 2.2);       // root leading edge
+        shape.lineTo(6.5, -0.5);      // wing tip leading edge
+        shape.lineTo(6.5, -1.3);      // wing tip trailing edge
+        shape.lineTo(1.2, -3.2);      // wing root trailing edge (flaperon)
+        shape.lineTo(0.6, 2.2);       // back to start
       } else {
-        shape.moveTo(0, 0.5);
-        shape.lineTo(0, -0.8);
-        shape.lineTo(-1.8, -0.6);
-        shape.lineTo(-1.8, -0.2);
+        shape.moveTo(-0.6, 2.2);
+        shape.lineTo(-1.2, -3.2);
+        shape.lineTo(-6.5, -1.3);
+        shape.lineTo(-6.5, -0.5);
+        shape.lineTo(-0.6, 2.2);
       }
-      const geo = new THREE.ExtrudeGeometry(shape, { depth: 0.06, bevelEnabled: true, bevelThickness: 0.01, bevelSize: 0.01, bevelSegments: 1 });
-      const mesh = new THREE.Mesh(geo, hullMat);
+      const geo = new THREE.ExtrudeGeometry(shape, {
+        depth: 0.12,
+        bevelEnabled: true,
+        bevelThickness: 0.02,
+        bevelSize: 0.02,
+        bevelSegments: 1
+      });
+      const mesh = new THREE.Mesh(geo, mainBodyMat);
       mesh.rotation.x = Math.PI / 2;
-      mesh.position.set(0, 0.15, 3.2); // Near front nose
+      mesh.position.set(0, 0.02, 0.3);
       return mesh;
     };
-    this.mesh.add(makeCanard(1), makeCanard(-1));
+    this.mesh.add(createWing(1));
+    this.mesh.add(createWing(-1));
+
+    // Upper wing camouflage patches
+    addPair((dir) => {
+      const camoPatch = new THREE.Mesh(
+        new THREE.BoxGeometry(2.5, 0.02, 1.5),
+        camoDarkMat
+      );
+      camoPatch.position.set(dir * 3.0, 0.14, -0.8);
+      camoPatch.rotation.y = dir * 0.15;
+      return camoPatch;
+    });
 
-    // 5. V-Tail Stabilizers
-    const makeTail = (dir) => {
-      const shape = new THREE.Shape();
-      shape.moveTo(0.8, 0);       // front base
-      shape.lineTo(-1.2, 1.8);    // front tip (swept back)
-      shape.lineTo(-2.0, 1.8);    // back tip
-      shape.lineTo(-0.8, 0);      // back base
+    addPair((dir) => {
+      const camoPatch2 = new THREE.Mesh(
+        new THREE.BoxGeometry(1.8, 0.02, 1.2),
+        camoDarkMat
+      );
+      camoPatch2.position.set(dir * 4.5, 0.14, -0.3);
+      camoPatch2.rotation.y = dir * 0.1;
+      return camoPatch2;
+    });
 
-      const geo = new THREE.ExtrudeGeometry(shape, { depth: 0.08, bevelEnabled: true, bevelThickness: 0.02, bevelSize: 0.02, bevelSegments: 1 });
-      const mesh = new THREE.Mesh(geo, panelMat);
+    // Wing fuel tanks / pods
+    addPair((dir) => {
+      const tank = new THREE.Mesh(
+        new THREE.CapsuleGeometry(0.18, 2.0, 6, 8),
+        lightPanelMat
+      );
+      tank.rotation.x = Math.PI / 2;
+      tank.rotation.z = dir * 0.1;
+      tank.position.set(dir * 4.5, -0.15, -0.8);
+      return tank;
+    });
 
-      mesh.rotation.y = -Math.PI / 2; // Extrude along X, place on YZ plane
-      mesh.rotation.x = dir * 0.35;   // Cant outward (V shape)
-      mesh.position.set(dir * 0.6, 0.4, -2.5); // Over the rear engines
-      return mesh;
-    };
-    this.mesh.add(makeTail(1), makeTail(-1));
+    // ==================== CANARDS (Front control surfaces) ====================
+    addPair((dir) => {
+      const canardShape = new THREE.Shape();
+      if (dir === 1) {
+        canardShape.moveTo(0, 0.6);
+        canardShape.lineTo(1.6, 0.1);
+        canardShape.lineTo(1.5, -0.3);
+        canardShape.lineTo(0, -0.5);
+      } else {
+        canardShape.moveTo(0, 0.6);
+        canardShape.lineTo(0, -0.5);
+        canardShape.lineTo(-1.5, -0.3);
+        canardShape.lineTo(-1.6, 0.1);
+      }
+      const canardGeo = new THREE.ExtrudeGeometry(canardShape, {
+        depth: 0.06,
+        bevelEnabled: true,
+        bevelThickness: 0.01,
+        bevelSize: 0.01,
+        bevelSegments: 1
+      });
+      const canard = new THREE.Mesh(canardGeo, mainBodyMat);
+      canard.rotation.x = Math.PI / 2;
+      canard.position.set(0, 0.15, 4.2);
+      return canard;
+    });
 
-    // 6. Engines & Glow
-    const createEngine = (dir) => {
-      // Nacelle container
-      const engine = new THREE.Mesh(new THREE.CylinderGeometry(0.25, 0.35, 1.5, 6), panelMat);
-      engine.rotation.x = Math.PI / 2;
-      engine.position.set(dir * 0.5, 0.05, -4.2);
-      this.mesh.add(engine);
+    // ==================== AIR INTAKES ====================
+    addPair((dir) => {
+      // Main intake structure
+      const intake = new THREE.Mesh(
+        new THREE.BoxGeometry(0.65, 0.55, 2.8),
+        darkPanelMat
+      );
+      intake.position.set(dir * 1.05, -0.15, 1.2);
+      this.mesh.add(intake);
+
+      // Intake lip
+      const intakeLip = new THREE.Mesh(
+        new THREE.BoxGeometry(0.72, 0.62, 0.15),
+        lightPanelMat
+      );
+      intakeLip.position.set(dir * 1.05, -0.15, 2.5);
+      this.mesh.add(intakeLip);
+
+      // Intake splitter plate
+      const splitter = new THREE.Mesh(
+        new THREE.BoxGeometry(0.08, 0.48, 2.0),
+        mainBodyMat
+      );
+      splitter.position.set(dir * 0.72, -0.12, 1.8);
+      return splitter;
+    });
+
+    // ==================== TWIN VERTICAL STABILIZERS ====================
+    addPair((dir) => {
+      // Vertical stabilizer (tail fin)
+      const tailShape = new THREE.Shape();
+      tailShape.moveTo(0, 0);          // leading edge bottom
+      tailShape.lineTo(-0.8, 1.9);     // leading edge top (swept)
+      tailShape.lineTo(-1.6, 1.85);    // trailing edge top
+      tailShape.lineTo(-1.2, 0);       // trailing edge bottom
+      
+      const tailGeo = new THREE.ExtrudeGeometry(tailShape, {
+        depth: 0.08,
+        bevelEnabled: true,
+        bevelThickness: 0.015,
+        bevelSize: 0.015,
+        bevelSegments: 1
+      });
+      const tail = new THREE.Mesh(tailGeo, mainBodyMat);
+      tail.rotation.y = Math.PI / 2;
+      tail.rotation.x = dir * 0.12;  // Slight outward cant
+      tail.position.set(dir * 0.95, 0.2, -4.2);
+      this.mesh.add(tail);
+
+      // Rudder
+      const rudder = new THREE.Mesh(
+        new THREE.BoxGeometry(0.05, 1.4, 0.4),
+        darkPanelMat
+      );
+      rudder.position.set(dir * 1.45, 1.0, -4.8);
+      rudder.rotation.x = dir * 0.12;
+      return rudder;
+    });
+
+    // ==================== HORIZONTAL STABILIZERS ====================
+    addPair((dir) => {
+      const stabShape = new THREE.Shape();
+      if (dir === 1) {
+        stabShape.moveTo(0, 0.5);
+        stabShape.lineTo(2.2, 0.15);
+        stabShape.lineTo(2.0, -0.25);
+        stabShape.lineTo(0, -0.6);
+      } else {
+        stabShape.moveTo(0, 0.5);
+        stabShape.lineTo(0, -0.6);
+        stabShape.lineTo(-2.0, -0.25);
+        stabShape.lineTo(-2.2, 0.15);
+      }
+      const stabGeo = new THREE.ExtrudeGeometry(stabShape, {
+        depth: 0.06,
+        bevelEnabled: true,
+        bevelThickness: 0.01,
+        bevelSize: 0.01,
+        bevelSegments: 1
+      });
+      const stabilizer = new THREE.Mesh(stabGeo, mainBodyMat);
+      stabilizer.rotation.x = Math.PI / 2;
+      stabilizer.position.set(0, 0.15, -4.5);
+      return stabilizer;
+    });
 
-      // Core inner glow
+    // ==================== TWIN ENGINES ====================
+    addPair((dir) => {
+      // Engine nacelle
+      const nacelle = new THREE.Mesh(
+        new THREE.CylinderGeometry(0.38, 0.42, 2.2, 10),
+        mainBodyMat
+      );
+      nacelle.rotation.x = Math.PI / 2;
+      nacelle.position.set(dir * 0.65, -0.08, -4.0);
+      this.mesh.add(nacelle);
+
+      // Exhaust nozzle
+      const nozzle = new THREE.Mesh(
+        new THREE.CylinderGeometry(0.32, 0.28, 0.5, 12),
+        exhaustNozzleMat
+      );
+      nozzle.rotation.x = Math.PI / 2;
+      nozzle.position.set(dir * 0.65, -0.08, -5.15);
+      this.mesh.add(nozzle);
+
+      // Engine glow
       const glowMat = new THREE.MeshStandardMaterial({
-        color: 0x00ffff, emissive: 0x00e5ff, emissiveIntensity: 1.5,
-        transparent: true, opacity: 0.8, toneMapped: false
+        color: 0xff6633,
+        emissive: 0xff4411,
+        emissiveIntensity: 1.0,
+        transparent: true,
+        opacity: 0.85,
+        toneMapped: false
       });
-      this.engineGlowMaterials.push(glowMat); // Captured for thrust animation
+      this.engineGlowMaterials.push(glowMat);
 
-      const glow = new THREE.Mesh(new THREE.CylinderGeometry(0.2, 0.2, 0.2, 6), glowMat);
+      const glow = new THREE.Mesh(
+        new THREE.CylinderGeometry(0.24, 0.26, 0.15, 12),
+        glowMat
+      );
       glow.rotation.x = Math.PI / 2;
-      glow.position.set(dir * 0.5, 0.05, -4.96);
+      glow.position.set(dir * 0.65, -0.08, -5.38);
       this.mesh.add(glow);
 
-      // Exhaust Thruster cone
-      const trailMat = new THREE.MeshBasicMaterial({
-        color: 0x00e5ff, transparent: true, opacity: 0.4, blending: THREE.AdditiveBlending, depthWrite: false
+      // Afterburner flame
+      const flameMat = new THREE.MeshBasicMaterial({
+        color: 0xff8844,
+        transparent: true,
+        opacity: 0.45,
+        blending: THREE.AdditiveBlending,
+        depthWrite: false
       });
-      const trail = new THREE.Mesh(new THREE.ConeGeometry(0.2, 3.0, 6, 1, true), trailMat);
-      // Map +Y to -Z so tip points fully backwards and wide base is at engine
-      trail.rotation.x = Math.PI / 2;
-      trail.position.set(dir * 0.5, 0.05, -6.4); // Centered down the trail length
-      this.exhaustTrails.push(trail);
-      this.mesh.add(trail);
-    };
-    createEngine(1);
-    createEngine(-1);
-
-    // 7. Neon Accents
-    const spineGeo = new THREE.BoxGeometry(0.04, 0.02, 4.0);
-    const spineAccent = new THREE.Mesh(spineGeo, accentMat);
-    spineAccent.position.set(0, 0.48, -1.0);
-    this.mesh.add(spineAccent);
-
-    const wingAccentGeo = new THREE.BoxGeometry(4.0, 0.02, 0.05);
-    const wL = new THREE.Mesh(wingAccentGeo, accentMat);
-    wL.position.set(-2.5, 0.12, -2.0);
-    wL.rotation.y = Math.PI / 8;
-    const wR = new THREE.Mesh(wingAccentGeo, accentMat);
-    wR.position.set(2.5, 0.12, -2.0);
-    wR.rotation.y = -Math.PI / 8;
-    this.mesh.add(wL, wR);
-
-    // 8. Navigation Lights
+      const flame = new THREE.Mesh(
+        new THREE.ConeGeometry(0.22, 2.5, 10, 1, true),
+        flameMat
+      );
+      flame.rotation.x = Math.PI / 2;
+      flame.position.set(dir * 0.65, -0.08, -6.6);
+      this.exhaustTrails.push(flame);
+      this.mesh.add(flame);
+      return flame; // Return to satisfy addPair expectation
+    });
+
+    // ==================== DETAILS & ANTENNAS ====================
+    // IFR (In-flight refueling) probe
+    const ifrProbe = new THREE.Mesh(
+      new THREE.CylinderGeometry(0.02, 0.025, 0.8, 6),
+      darkPanelMat
+    );
+    ifrProbe.rotation.x = Math.PI / 2;
+    ifrProbe.position.set(0, 0.35, 4.8);
+    this.mesh.add(ifrProbe);
+
+    // Dorsal antenna
+    const dorsalAntenna = new THREE.Mesh(
+      new THREE.BoxGeometry(0.08, 0.15, 0.8),
+      darkPanelMat
+    );
+    dorsalAntenna.position.set(0, 0.52, -0.5);
+    this.mesh.add(dorsalAntenna);
+
+    // ==================== NAVIGATION LIGHTS ====================
     const redLightMat = new THREE.MeshStandardMaterial({
-      color: 0xff3b3b, emissive: 0xff3b3b, emissiveIntensity: 1.5, roughness: 0.2
+      color: 0xff2222,
+      emissive: 0xff0000,
+      emissiveIntensity: 1.5,
+      roughness: 0.2
     });
     const greenLightMat = new THREE.MeshStandardMaterial({
-      color: 0x3bff68, emissive: 0x3bff68, emissiveIntensity: 1.5, roughness: 0.2
+      color: 0x22ff44,
+      emissive: 0x00ff22,
+      emissiveIntensity: 1.5,
+      roughness: 0.2
     });
-    const strobeLightMat = new THREE.MeshStandardMaterial({
-      color: 0xffffff, emissive: 0xffffff, emissiveIntensity: 0.5, roughness: 0.2
+    const whiteLightMat = new THREE.MeshStandardMaterial({
+      color: 0xffffff,
+      emissive: 0xffffff,
+      emissiveIntensity: 0.8,
+      roughness: 0.2
     });
 
-    const leftWingLight = new THREE.Mesh(new THREE.SphereGeometry(0.08, 8, 8), redLightMat);
-    leftWingLight.position.set(-5.9, 0.1, -1.6);
+    // Port (red) and Starboard (green) lights on wing tips
+    const leftWingLight = new THREE.Mesh(new THREE.SphereGeometry(0.06, 8, 8), redLightMat);
+    leftWingLight.position.set(-6.4, 0.08, -0.9);
     this.mesh.add(leftWingLight);
 
-    const rightWingLight = new THREE.Mesh(new THREE.SphereGeometry(0.08, 8, 8), greenLightMat);
-    rightWingLight.position.set(5.9, 0.1, -1.6);
+    const rightWingLight = new THREE.Mesh(new THREE.SphereGeometry(0.06, 8, 8), greenLightMat);
+    rightWingLight.position.set(6.4, 0.08, -0.9);
     this.mesh.add(rightWingLight);
 
-    const tailStrobe = new THREE.Mesh(new THREE.SphereGeometry(0.08, 8, 8), strobeLightMat);
-    tailStrobe.position.set(0, -0.2, -4.0);
-    this.mesh.add(tailStrobe);
+    // Tail lights (white)
+    addPair((dir) => {
+      const tailLight = new THREE.Mesh(new THREE.SphereGeometry(0.05, 8, 8), whiteLightMat);
+      tailLight.position.set(dir * 1.0, 1.9, -4.8);
+      return tailLight;
+    });
+
+    // Belly strobe
+    const bellyStrobe = new THREE.Mesh(new THREE.SphereGeometry(0.04, 8, 8), whiteLightMat);
+    bellyStrobe.position.set(0, -0.42, -1.0);
+    this.mesh.add(bellyStrobe);
 
     this.navLights.push({ material: redLightMat, mode: 'steady', base: 1.2 });
     this.navLights.push({ material: greenLightMat, mode: 'steady', base: 1.2 });
-    this.navLights.push({ material: strobeLightMat, mode: 'strobe', base: 0.2 });
+    this.navLights.push({ material: whiteLightMat, mode: 'strobe', base: 0.3 });
 
-    // Enable shadows for solid pieces
+    // ==================== SHADOWS ====================
     this.mesh.traverse((child) => {
       if (child.isMesh && (!child.material || !child.material.transparent)) {
         child.castShadow = true;
@@ -247,28 +566,6 @@ export class Aircraft {
   setupControls() {
     document.addEventListener('keydown', (event) => this.handleKeyDown(event));
     document.addEventListener('keyup', (event) => this.handleKeyUp(event));
-
-    // Set up mouse flight controls
-    document.addEventListener('mousemove', (event) => this.handleMouseMove(event));
-
-    // Request pointer lock on click to capture mouse movement infinitely
-    document.addEventListener('click', () => {
-      if (document.pointerLockElement !== document.body) {
-        document.body.requestPointerLock();
-      }
-    });
-  }
-
-  handleMouseMove(event) {
-    // Only apply mouse controls if pointer is locked
-    if (document.pointerLockElement === document.body) {
-      // Accumulate mouse delta into target inputs (very low sensitivity)
-      this._pitchInput += -event.movementY * 0.002;
-      this._rollInput += event.movementX * 0.002;
-      // Clamp so you can't overload the buffer
-      this._pitchInput = THREE.MathUtils.clamp(this._pitchInput, -1, 1);
-      this._rollInput = THREE.MathUtils.clamp(this._rollInput, -1, 1);
-    }
   }
 
   handleKeyDown(event) {
@@ -285,8 +582,12 @@ export class Aircraft {
       return;
     }
     switch (event.key.toLowerCase()) {
-      case 'a': this.yaw = 1; break;     // Yaw left (turn left)
-      case 'd': this.yaw = -1; break;    // Yaw right (turn right)
+      case 'w': this.pitch = -1; break;   // Pitch up (nose rises)
+      case 's': this.pitch = 1; break;    // Pitch down (nose drops)
+      case 'a': this.roll = -1; break;    // Roll left (left wing down)
+      case 'd': this.roll = 1; break;     // Roll right (right wing down)
+      case 'q': this.yaw = 1; break;      // Yaw left (turn left)
+      case 'e': this.yaw = -1; break;     // Yaw right (turn right)
     }
   }
 
@@ -304,7 +605,9 @@ export class Aircraft {
       return;
     }
     switch (event.key.toLowerCase()) {
-      case 'a': case 'd': this.yaw = 0; break;
+      case 'w': case 's': this.pitch = 0; break;
+      case 'a': case 'd': this.roll = 0; break;
+      case 'q': case 'e': this.yaw = 0; break;
     }
   }
 
@@ -317,20 +620,9 @@ export class Aircraft {
       this.cruiseThrust = THREE.MathUtils.clamp(this.cruiseThrust - 0.4 * deltaTime, 0, 1);
     }
 
-    // Initialize smoothed input buffers
-    if (this._pitchInput === undefined) { this._pitchInput = 0; this._rollInput = 0; }
-
     const speed = Math.max(this.velocity.length(), 0.01);
     const speedRatio = THREE.MathUtils.clamp(speed / 80, 0.35, 1.6);
 
-    // ── Smooth input: lerp actual control values toward buffered inputs ──
-    this.pitch = THREE.MathUtils.lerp(this.pitch, this._pitchInput, deltaTime * 6);
-    this.roll = THREE.MathUtils.lerp(this.roll, this._rollInput, deltaTime * 6);
-
-    // Decay the input buffer back toward zero (spring-return joystick feel)
-    this._pitchInput = THREE.MathUtils.lerp(this._pitchInput, 0, deltaTime * 3);
-    this._rollInput = THREE.MathUtils.lerp(this._rollInput, 0, deltaTime * 3);
-
     // ── Apply rotation rates using YXZ Euler order ──
     this.rotation.order = 'YXZ';
     this.rotation.x += this.pitch * this.pitchRate * deltaTime;
@@ -344,11 +636,11 @@ export class Aircraft {
     this.rotation.x = THREE.MathUtils.clamp(this.rotation.x, -1.05, 1.05);
     this.rotation.z = THREE.MathUtils.clamp(this.rotation.z, -1.2, 1.2);
 
-    // Auto-leveling: gently stabilise when input is near zero
-    if (Math.abs(this.pitch) < 0.03 && Math.abs(this._pitchInput) < 0.03) {
+    // Auto-leveling: gently stabilise when no input
+    if (this.pitch === 0) {
       this.rotation.x = THREE.MathUtils.lerp(this.rotation.x, 0, deltaTime * 0.4);
     }
-    if (Math.abs(this.roll) < 0.03 && Math.abs(this._rollInput) < 0.03) {
+    if (this.roll === 0) {
       this.rotation.z = THREE.MathUtils.lerp(this.rotation.z, 0, deltaTime * 1.0);
     }