The code you pasted is the older version that caused the overlapping lines in your screenshot. Looking closely at the numbers in the snippet you pasted, the vector coordinates are looping back over themselves: Tier 2: points="1440,345 1310,345 ... 1040,320 ... 1115,442 ... 1440,410"Heavy Index: points="1440,400 ... 1040,290 ..."
The $Y$ coordinate for the Heavy Index drops up to $290$, while Tier 2 sits at $320$. Because a higher-tier contour dips above a lower-tier contour, the lines criss-cross each other right below the menu, creating the pinch effect from your screenshot. The replacement code below uses clean, strictly ordered coordinates where every outer line steps outward with dedicated geometric clearance ($14\text{px}$–$24\text{px}$ along the steep east face, $45\text{px}$–$80\text{px}$ along the open west basin) so no two lines ever touch or intersect. HTML