{text}

); }; // Molecule group with rotation return ( {/* Main molecule */} {/* Carbon atoms */} {createLabel("C1", c1Pos.clone().add(new THREE.Vector3(0, -0.5, 0)))} {createLabel("C2", c2Pos.clone().add(new THREE.Vector3(0, 0.5, 0)))} {/* C-C bond */} {/* C=C pi bond forming (double bond visualization) */} {sp3toSp2 > 0.3 && ( )} {/* Hydrogen being abstracted (CYAN) */} {createLabel("H (cyan)", hAbstractedPos.clone().add(new THREE.Vector3(-0.5, 0.3, 0)), cyanHydrogen)} {/* C-H bond being broken */} {bondStretchT < 0.9 && ( )} {/* Other H on C1 */} {/* H on C2 */} {/* Bromine leaving group (PINK) */} {createLabel("Br⁻", brLeavingPos.clone().add(new THREE.Vector3(0.5, 0, 0)), bromineColor)} {/* C-Br bond being broken */} {bondStretchT < 0.9 && ( )} {/* Other Br on C1 */} {createLabel("Br", br1Pos.clone().add(new THREE.Vector3(-0.5, 0, 0)), bromineColor)} {/* Phenyl ring 1 (simplified as hexagon) */} {/* Phenyl carbons */} {[...Array(6)].map((_, i) => { const angle = (i / 6) * Math.PI * 2; return ( ); })} {createLabel("Ph", ph1Pos.clone().add(new THREE.Vector3(0, -0.8, 0)))} {/* Phenyl ring 2 */} {[...Array(6)].map((_, i) => { const angle = (i / 6) * Math.PI * 2; return ( ); })} {createLabel("Ph", ph2Pos.clone().add(new THREE.Vector3(0, 0.8, 0)))} {/* Base particle approaching */} {createLabel("Base:", basePos.clone().add(new THREE.Vector3(0, 0.6, 0)), baseColor)} {/* Lone pair indicators */} {[0, 1, 2].map((i) => { const angle = (i / 3) * Math.PI * 2 + frame * 0.02; return ( ); })} {/* Reaction arrows - showing during mechanism */} {phase === 2 && ( {/* Arrow from base to H (cyan) */} {/* Arrow from C-H to C=C (pink) */} {/* Arrow from C-Br cleavage (pink) */} )} {/* Newman projection inset (bottom right) */} {/* Newman circle */} {/* Newman atoms */} {/* Front carbon (C1) */} {/* Back carbon (C2) */} {/* Atoms on front carbon */} {/* Br - large */} {/* H (cyan) */} {/* Ph */} {/* Atoms on back carbon */} {/* Br */} {/* H */} {/* Ph */}

Newman Projection
H (anti to Br)

{/* Legend */}

E2 Elimination Mechanism

● Cyan H: Abstracted

● Pink Br: Leaving group

● Base: Approaches H

Phase {phase}/3: { phase === 1 ? 'Base approach' : phase === 2 ? 'Bond cleavage' : 'Product formation' }

{phase === 1 && 'H-C-C-Br dihedral: 180° (anti)'} {phase === 2 && 'Concerted: C-H & C-Br break together'} {phase === 3 && 'sp³ → sp² | 109.5° → 120°'}

{/* Product label (when complete) */} {phase === 3 && sp3toSp2 > 0.8 && (

(E)-1-bromo-1,2-diphenylethylene
Planar • Trans phenyls • 120° angles

)} {/* Lighting */} {/* Grid helper for orientation */} );