@tscircuit/3d-viewer 0.0.516 → 0.0.518

package/dist/index.js

@@ -14248,7 +14248,7 @@ import { useState as useState36, useCallback as useCallback21, useRef as useRef2
 import * as THREE36 from "three";
 
 // src/CadViewerJscad.tsx
-import { su as su13 } from "@tscircuit/circuit-json-util";
+import { su as su12 } from "@tscircuit/circuit-json-util";
 import { forwardRef as forwardRef3, useMemo as useMemo20 } from "react";
 
 // src/AnyCadComponent.tsx
@@ -28483,7 +28483,7 @@ import * as THREE16 from "three";
 // package.json
 var package_default = {
   name: "@tscircuit/3d-viewer",
-  version: "0.0.515",
+  version: "0.0.517",
   main: "./dist/index.js",
   module: "./dist/index.js",
   type: "module",
@@ -28513,7 +28513,7 @@ var package_default = {
     "@jscad/regl-renderer": "^2.6.12",
     "@jscad/stl-serializer": "^2.1.20",
     "circuit-json": "^0.0.372",
-    "circuit-to-canvas": "^0.0.49",
+    "circuit-to-canvas": "^0.0.80",
     "react-hot-toast": "^2.6.0",
     three: "^0.165.0",
     "three-stdlib": "^2.36.0",
@@ -29687,10 +29687,6 @@ import { su as su3 } from "@tscircuit/circuit-json-util";
 
 // src/geoms/constants.ts
 var M = 0.01;
-var BOARD_SURFACE_OFFSET = {
-  traces: 1e-3,
-  copper: 2e-3
-};
 var colors = {
   copper: [0.9, 0.6, 0.2],
   fr4Tan: [0.6, 0.43, 0.28],
@@ -29703,7 +29699,6 @@ var colors = {
 };
 var MANIFOLD_Z_OFFSET = 1e-3;
 var SMOOTH_CIRCLE_SEGMENTS = 32;
-var DEFAULT_SMT_PAD_THICKNESS = 0.035;
 var TRACE_TEXTURE_RESOLUTION = 150;
 var FAUX_BOARD_OPACITY = 0.6;
 var boardMaterialColors = {
@@ -29932,7 +29927,7 @@ function extractRectBorderRadius(source) {
 }
 
 // src/geoms/plated-hole.ts
-var platedHoleLipHeight = 0.02;
+var PLATED_HOLE_DRILL_OVERREACH = 0.05;
 var RECT_PAD_SEGMENTS = 64;
 var maybeClip = (geom, clipGeom) => clipGeom ? (0, import_booleans2.intersect)(clipGeom, geom) : geom;
 var createRectPadGeom = ({
@@ -29958,13 +29953,21 @@ var createRectPadGeom = ({
 var platedHole = (plated_hole, ctx, options = {}) => {
   const { clipGeom } = options;
   if (!plated_hole.shape) plated_hole.shape = "circle";
-  const throughDrillHeight = ctx.pcbThickness + 2 * platedHoleLipHeight + 4 * M;
-  const topSurfaceZ = ctx.pcbThickness / 2 + BOARD_SURFACE_OFFSET.copper;
-  const bottomSurfaceZ = -ctx.pcbThickness / 2 - BOARD_SURFACE_OFFSET.copper;
-  const copperSpan = topSurfaceZ - bottomSurfaceZ;
+  const padThickness = Math.max(ctx.pcbThickness * 2e-3, M / 5);
+  const surfaceClearance = Math.max(ctx.pcbThickness * 3e-4, M / 20);
+  const fillClearance = Math.max(ctx.pcbThickness * 25e-4, M / 4);
+  const throughDrillHeight = ctx.pcbThickness + 2 * PLATED_HOLE_DRILL_OVERREACH + 4 * M;
+  const topSurfaceZ = ctx.pcbThickness / 2 + surfaceClearance + padThickness / 2;
+  const bottomSurfaceZ = -ctx.pcbThickness / 2 - surfaceClearance - padThickness / 2;
+  const copperSurfaceSpan = ctx.pcbThickness + 2 * surfaceClearance;
+  const copperFillHeight = Math.max(
+    ctx.pcbThickness - 2 * (padThickness + surfaceClearance + fillClearance),
+    M
+  );
+  const barrelHeight = Math.max(copperFillHeight, M);
   if (plated_hole.shape === "circle") {
     const outerDiameter = plated_hole.outer_diameter ?? Math.max(plated_hole.hole_diameter, 0);
-    const copperHeight = copperSpan + 0.01;
+    const copperHeight = copperSurfaceSpan;
     const copperBody = (0, import_primitives4.cylinder)({
       center: [plated_hole.x, plated_hole.y, 0],
       radius: outerDiameter / 2,
@@ -29987,7 +29990,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
       const circle = (0, import_primitives4.cylinder)({
         center: [0, 0, 0],
         radius: 1,
-        height: copperSpan + 0.01,
+        height: copperSurfaceSpan,
         segments: 64
         // High segment count for smooth ellipse
       });
@@ -30023,8 +30026,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
         createRectPadGeom({
           width: padWidth,
           height: padHeight,
-          thickness: platedHoleLipHeight,
-          // Slightly thicker to ensure connection
+          thickness: padThickness,
           center: [plated_hole.x, plated_hole.y, topSurfaceZ],
           borderRadius: rectBorderRadius
         }),
@@ -30032,25 +30034,20 @@ var platedHole = (plated_hole, ctx, options = {}) => {
         createRectPadGeom({
           width: padWidth,
           height: padHeight,
-          thickness: platedHoleLipHeight,
-          // Slightly thicker to ensure connection
+          thickness: padThickness,
           center: [plated_hole.x, plated_hole.y, bottomSurfaceZ],
           borderRadius: rectBorderRadius
         }),
         // Main copper fill between pads with rounded corners
         (() => {
-          const height10 = Math.max(copperSpan - platedHoleLipHeight * 2, M);
-          const topPadBottom = topSurfaceZ;
-          const bottomPadTop = bottomSurfaceZ;
-          const centerZ = (topPadBottom + bottomPadTop) / 2;
           const rect2d = (0, import_primitives4.roundedRectangle)({
             size: [padWidth, padHeight],
             roundRadius: rectBorderRadius || 0,
             segments: RECT_PAD_SEGMENTS
           });
-          const extruded = (0, import_extrusions3.extrudeLinear)({ height: height10 }, rect2d);
+          const extruded = (0, import_extrusions3.extrudeLinear)({ height: copperFillHeight }, rect2d);
           return (0, import_transforms4.translate)(
-            [plated_hole.x, plated_hole.y, centerZ - height10 / 2],
+            [plated_hole.x, plated_hole.y, -copperFillHeight / 2],
             extruded
           );
         })(),
@@ -30062,7 +30059,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
             0
           ],
           radius: plated_hole.hole_diameter / 2,
-          height: copperSpan
+          height: barrelHeight
         })
       ),
       clipGeom
@@ -30076,27 +30073,14 @@ var platedHole = (plated_hole, ctx, options = {}) => {
       radius: Math.max(plated_hole.hole_diameter / 2 - M, 0.01),
       height: throughDrillHeight
     });
-    const barrel = (0, import_primitives4.cylinder)({
-      center: [
-        plated_hole.x + (holeOffsetX || 0),
-        plated_hole.y + (holeOffsetY || 0),
-        0
-      ],
-      radius: plated_hole.hole_diameter / 2,
-      height: copperSpan
-    });
-    let finalCopper = (0, import_booleans2.union)(
-      (0, import_booleans2.subtract)(copperSolid, barrel),
-      // Subtract the barrel from the main shape
-      barrel
-      // Add the barrel back to ensure proper connection
-    );
+    const copperWithDrill = (0, import_booleans2.subtract)(copperSolid, drill);
     if (options.clipGeom) {
-      finalCopper = (0, import_booleans2.subtract)(finalCopper, drill);
-      finalCopper = (0, import_booleans2.intersect)(finalCopper, options.clipGeom);
-      return (0, import_colors2.colorize)(colors.copper, finalCopper);
+      return (0, import_colors2.colorize)(
+        colors.copper,
+        (0, import_booleans2.intersect)(copperWithDrill, options.clipGeom)
+      );
     }
-    return (0, import_colors2.colorize)(colors.copper, (0, import_booleans2.subtract)(finalCopper, drill));
+    return (0, import_colors2.colorize)(colors.copper, copperWithDrill);
   }
   if (plated_hole.shape === "pill") {
     const rotationRadians = (plated_hole.ccw_rotation || 0) * Math.PI / 180;
@@ -30115,7 +30099,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
     const outerRadius = outerPillHeight / 2;
     const rectLength = Math.abs(holeWidth - holeHeight);
     const outerRectLength = Math.abs(outerPillWidth - outerPillHeight);
-    const copperHeight = copperSpan + 0.01;
+    const copperHeight = copperSurfaceSpan;
     const createPillSection = (width10, height10, thickness) => {
       const radius = height10 / 2;
       const length51 = Math.abs(width10 - height10);
@@ -30189,11 +30173,11 @@ var platedHole = (plated_hole, ctx, options = {}) => {
         size: shouldRotate ? [
           holeHeight + 2 * barrelMargin,
           rectLength + 2 * barrelMargin,
-          copperSpan
+          barrelHeight
         ] : [
           rectLength + 2 * barrelMargin,
           holeHeight + 2 * barrelMargin,
-          copperSpan
+          barrelHeight
         ]
       }),
       (0, import_primitives4.cylinder)({
@@ -30207,7 +30191,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
           0
         ],
         radius: holeRadius + barrelMargin,
-        height: copperSpan
+        height: barrelHeight
       }),
       (0, import_primitives4.cylinder)({
         center: shouldRotate ? [
@@ -30220,13 +30204,13 @@ var platedHole = (plated_hole, ctx, options = {}) => {
           0
         ],
         radius: holeRadius + barrelMargin,
-        height: copperSpan
+        height: barrelHeight
       })
     );
     const holeCut = (0, import_booleans2.union)(
       (0, import_primitives4.cuboid)({
         center: [plated_hole.x + holeOffsetX, plated_hole.y + holeOffsetY, 0],
-        size: shouldRotate ? [holeHeight, rectLength, throughDrillHeight * 1.1] : [rectLength, holeHeight, throughDrillHeight * 1.1]
+        size: shouldRotate ? [holeHeight, rectLength, throughDrillHeight] : [rectLength, holeHeight, throughDrillHeight]
       }),
       (0, import_primitives4.cylinder)({
         center: shouldRotate ? [
@@ -30239,7 +30223,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
           0
         ],
         radius: holeRadius,
-        height: throughDrillHeight * 1.1
+        height: throughDrillHeight
       }),
       (0, import_primitives4.cylinder)({
         center: shouldRotate ? [
@@ -30252,36 +30236,32 @@ var platedHole = (plated_hole, ctx, options = {}) => {
           0
         ],
         radius: holeRadius,
-        height: throughDrillHeight * 1.1
+        height: throughDrillHeight
       })
     );
     const copperTopPad = createRectPadGeom({
       width: padWidth,
       height: padHeight,
-      thickness: platedHoleLipHeight,
+      thickness: padThickness,
       center: [plated_hole.x, plated_hole.y, topSurfaceZ],
       borderRadius: rectBorderRadius
     });
     const copperBottomPad = createRectPadGeom({
       width: padWidth,
       height: padHeight,
-      thickness: platedHoleLipHeight,
+      thickness: padThickness,
       center: [plated_hole.x, plated_hole.y, bottomSurfaceZ],
       borderRadius: rectBorderRadius
     });
     const copperFill = (() => {
-      const height10 = Math.max(copperSpan - platedHoleLipHeight * 2, M);
-      const topPadBottom = topSurfaceZ;
-      const bottomPadTop = bottomSurfaceZ;
-      const centerZ = (topPadBottom + bottomPadTop) / 2;
       const rect2d = (0, import_primitives4.roundedRectangle)({
         size: [padWidth, padHeight],
         roundRadius: rectBorderRadius || 0,
         segments: RECT_PAD_SEGMENTS
       });
-      const extruded = (0, import_extrusions3.extrudeLinear)({ height: height10 }, rect2d);
+      const extruded = (0, import_extrusions3.extrudeLinear)({ height: copperFillHeight }, rect2d);
       return (0, import_transforms4.translate)(
-        [plated_hole.x, plated_hole.y, centerZ - height10 / 2],
+        [plated_hole.x, plated_hole.y, -copperFillHeight / 2],
         extruded
       );
     })();
@@ -30291,7 +30271,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
     const barrelHoleCut = (0, import_booleans2.union)(
       (0, import_primitives4.cuboid)({
         center: [plated_hole.x + holeOffsetX, plated_hole.y + holeOffsetY, 0],
-        size: shouldRotate ? [holeHeight - 2 * M, rectLength - 2 * M, throughDrillHeight * 1.1] : [rectLength - 2 * M, holeHeight - 2 * M, throughDrillHeight * 1.1]
+        size: shouldRotate ? [holeHeight - 2 * M, rectLength - 2 * M, throughDrillHeight] : [rectLength - 2 * M, holeHeight - 2 * M, throughDrillHeight]
       }),
       (0, import_primitives4.cylinder)({
         center: shouldRotate ? [
@@ -30304,7 +30284,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
           0
         ],
         radius: holeRadius - M,
-        height: throughDrillHeight * 1.1
+        height: throughDrillHeight
       }),
       (0, import_primitives4.cylinder)({
         center: shouldRotate ? [
@@ -30317,7 +30297,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
           0
         ],
         radius: holeRadius - M,
-        height: throughDrillHeight * 1.1
+        height: throughDrillHeight
       })
     );
     const barrelWithHole = (0, import_booleans2.subtract)(barrel, barrelHoleCut);
@@ -30369,22 +30349,22 @@ var platedHole = (plated_hole, ctx, options = {}) => {
           size: isHorizontal ? [
             rectLength + 2 * barrelMargin,
             shortDim + 2 * barrelMargin,
-            copperSpan
+            barrelHeight
           ] : [
             shortDim + 2 * barrelMargin,
             rectLength + 2 * barrelMargin,
-            copperSpan
+            barrelHeight
           ]
         }),
         (0, import_primitives4.cylinder)({
           center: isHorizontal ? [-rectLength / 2, 0, 0] : [0, -rectLength / 2, 0],
           radius: holeRadius + barrelMargin,
-          height: copperSpan
+          height: barrelHeight
         }),
         (0, import_primitives4.cylinder)({
           center: isHorizontal ? [rectLength / 2, 0, 0] : [0, rectLength / 2, 0],
           radius: holeRadius + barrelMargin,
-          height: copperSpan
+          height: barrelHeight
         })
       )
     );
@@ -30392,17 +30372,17 @@ var platedHole = (plated_hole, ctx, options = {}) => {
       (0, import_booleans2.union)(
         (0, import_primitives4.cuboid)({
           center: [0, 0, 0],
-          size: isHorizontal ? [rectLength, shortDim, throughDrillHeight * 1.1] : [shortDim, rectLength, throughDrillHeight * 1.1]
+          size: isHorizontal ? [rectLength, shortDim, throughDrillHeight] : [shortDim, rectLength, throughDrillHeight]
         }),
         (0, import_primitives4.cylinder)({
           center: isHorizontal ? [-rectLength / 2, 0, 0] : [0, -rectLength / 2, 0],
           radius: holeRadius,
-          height: throughDrillHeight * 1.1
+          height: throughDrillHeight
         }),
         (0, import_primitives4.cylinder)({
           center: isHorizontal ? [rectLength / 2, 0, 0] : [0, rectLength / 2, 0],
           radius: holeRadius,
-          height: throughDrillHeight * 1.1
+          height: throughDrillHeight
         })
       )
     );
@@ -30410,7 +30390,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
       createRectPadGeom({
         width: padWidth,
         height: padHeight,
-        thickness: platedHoleLipHeight,
+        thickness: padThickness,
         center: [plated_hole.x, plated_hole.y, topSurfaceZ],
         borderRadius: rectBorderRadius
       })
@@ -30419,25 +30399,21 @@ var platedHole = (plated_hole, ctx, options = {}) => {
       createRectPadGeom({
         width: padWidth,
         height: padHeight,
-        thickness: platedHoleLipHeight,
+        thickness: padThickness,
         center: [plated_hole.x, plated_hole.y, bottomSurfaceZ],
         borderRadius: rectBorderRadius
       })
     );
     const copperFill = rotateRectPad(
       (() => {
-        const height10 = Math.max(copperSpan - platedHoleLipHeight * 2, M);
-        const topPadBottom = topSurfaceZ;
-        const bottomPadTop = bottomSurfaceZ;
-        const centerZ = (topPadBottom + bottomPadTop) / 2;
         const rect2d = (0, import_primitives4.roundedRectangle)({
           size: [padWidth, padHeight],
           roundRadius: rectBorderRadius || 0,
           segments: RECT_PAD_SEGMENTS
         });
-        const extruded = (0, import_extrusions3.extrudeLinear)({ height: height10 }, rect2d);
+        const extruded = (0, import_extrusions3.extrudeLinear)({ height: copperFillHeight }, rect2d);
         return (0, import_transforms4.translate)(
-          [plated_hole.x, plated_hole.y, centerZ - height10 / 2],
+          [plated_hole.x, plated_hole.y, -copperFillHeight / 2],
           extruded
         );
       })()
@@ -30449,17 +30425,17 @@ var platedHole = (plated_hole, ctx, options = {}) => {
       (0, import_booleans2.union)(
         (0, import_primitives4.cuboid)({
           center: [0, 0, 0],
-          size: isHorizontal ? [rectLength - 2 * M, shortDim - 2 * M, throughDrillHeight * 1.1] : [shortDim - 2 * M, rectLength - 2 * M, throughDrillHeight * 1.1]
+          size: isHorizontal ? [rectLength - 2 * M, shortDim - 2 * M, throughDrillHeight] : [shortDim - 2 * M, rectLength - 2 * M, throughDrillHeight]
         }),
         (0, import_primitives4.cylinder)({
           center: isHorizontal ? [-rectLength / 2, 0, 0] : [0, -rectLength / 2, 0],
           radius: holeRadius - M,
-          height: throughDrillHeight * 1.1
+          height: throughDrillHeight
         }),
         (0, import_primitives4.cylinder)({
           center: isHorizontal ? [rectLength / 2, 0, 0] : [0, rectLength / 2, 0],
           radius: holeRadius - M,
-          height: throughDrillHeight * 1.1
+          height: throughDrillHeight
         })
       )
     );
@@ -30481,7 +30457,7 @@ var platedHole = (plated_hole, ctx, options = {}) => {
       point.y
     ]);
     const polygon2d = (0, import_primitives4.polygon)({ points: polygonPoints });
-    const centerZ = (topSurfaceZ + bottomSurfaceZ) / 2;
+    const centerZ = 0;
     const createPolygonPad = (thickness, zCenter) => {
       const safeThickness = Math.max(thickness, M);
       const extruded = (0, import_extrusions3.extrudeLinear)({ height: safeThickness }, polygon2d);
@@ -30490,14 +30466,11 @@ var platedHole = (plated_hole, ctx, options = {}) => {
         extruded
       );
     };
-    const mainFill = createPolygonPad(
-      Math.max(copperSpan - platedHoleLipHeight * 2, M),
-      centerZ
-    );
-    const topPad = createPolygonPad(platedHoleLipHeight, topSurfaceZ);
-    const bottomPad = createPolygonPad(platedHoleLipHeight, bottomSurfaceZ);
+    const mainFill = createPolygonPad(copperFillHeight, centerZ);
+    const topPad = createPolygonPad(padThickness, topSurfaceZ);
+    const bottomPad = createPolygonPad(padThickness, bottomSurfaceZ);
     const copperSolid = maybeClip((0, import_booleans2.union)(mainFill, topPad, bottomPad), clipGeom);
-    const barrel = createHoleWithPolygonPadHoleGeom(plated_hole, copperSpan);
+    const barrel = createHoleWithPolygonPadHoleGeom(plated_hole, barrelHeight);
     if (!barrel) return (0, import_colors2.colorize)(colors.copper, copperSolid);
     const drill = createHoleWithPolygonPadHoleGeom(plated_hole, throughDrillHeight, {
       sizeDelta: -2 * M
@@ -31367,7 +31340,8 @@ function STLModel({
   stlData,
   mtlUrl,
   color,
-  opacity = 1
+  opacity = 1,
+  layerType
 }) {
   const { rootObject } = useThree();
   const [geom, setGeom] = useState14(null);
@@ -31391,13 +31365,19 @@ function STLModel({
   }, [stlUrl, stlData]);
   const mesh = useMemo18(() => {
     if (!geom) return null;
+    const isBoardLayer = layerType === "board";
     const material = new THREE18.MeshStandardMaterial({
       color: Array.isArray(color) ? new THREE18.Color(color[0], color[1], color[2]) : color,
       transparent: opacity !== 1,
-      opacity
+      opacity,
+      polygonOffset: isBoardLayer,
+      polygonOffsetFactor: isBoardLayer ? 6 : 0,
+      polygonOffsetUnits: isBoardLayer ? 6 : 0
     });
-    return new THREE18.Mesh(geom, material);
-  }, [geom, color, opacity]);
+    const createdMesh = new THREE18.Mesh(geom, material);
+    createdMesh.renderOrder = isBoardLayer ? -1 : 1;
+    return createdMesh;
+  }, [geom, color, opacity, layerType]);
   useEffect22(() => {
     if (!rootObject || !mesh) return;
     rootObject.add(mesh);
@@ -31438,7 +31418,15 @@ function VisibleSTLModel({
   if (!shouldShow) {
     return null;
   }
-  return /* @__PURE__ */ jsx16(STLModel, { stlData, color, opacity });
+  return /* @__PURE__ */ jsx16(
+    STLModel,
+    {
+      stlData,
+      color,
+      opacity,
+      layerType
+    }
+  );
 }
 
 // src/three-components/ThreeErrorBoundary.tsx
@@ -31460,7 +31448,7 @@ var ThreeErrorBoundary = class extends React11.Component {
 };
 
 // src/three-components/JscadBoardTextures.tsx
-import { su as su10 } from "@tscircuit/circuit-json-util";
+import { su as su9 } from "@tscircuit/circuit-json-util";
 import { useEffect as useEffect23, useMemo as useMemo19 } from "react";
 
 // src/textures/create-combined-board-textures.ts
@@ -32058,6 +32046,31 @@ function createPadTextureForLayer({
       ctx.beginPath();
       ctx.arc(canvasX, canvasY, radius, 0, 2 * Math.PI);
       ctx.fill();
+    } else if (pad2.shape === "pill" || pad2.shape === "rotated_pill") {
+      const width10 = pad2.width * traceTextureResolution;
+      const height10 = pad2.height * traceTextureResolution;
+      const borderRadius = Math.min(width10, height10) / 2;
+      const ccwRotation = pad2.ccw_rotation || 0;
+      const rotation = -ccwRotation * (Math.PI / 180);
+      if (rotation) {
+        ctx.save();
+        ctx.translate(canvasX, canvasY);
+        ctx.rotate(rotation);
+        ctx.beginPath();
+        ctx.roundRect(-width10 / 2, -height10 / 2, width10, height10, borderRadius);
+        ctx.fill();
+        ctx.restore();
+      } else {
+        ctx.beginPath();
+        ctx.roundRect(
+          canvasX - width10 / 2,
+          canvasY - height10 / 2,
+          width10,
+          height10,
+          borderRadius
+        );
+        ctx.fill();
+      }
     } else if (pad2.shape === "rotated_rect") {
       const width10 = pad2.width * traceTextureResolution;
       const height10 = pad2.height * traceTextureResolution;
@@ -32611,16 +32624,28 @@ function createSilkscreenTextureForLayer({
   return texture;
 }
 
-// src/utils/soldermask-texture.ts
-import { su as su8 } from "@tscircuit/circuit-json-util";
+// src/utils/trace-texture.ts
 import * as THREE23 from "three";
-function createSoldermaskTextureForLayer({
+import { su as su8 } from "@tscircuit/circuit-json-util";
+function isWireRoutePoint(point) {
+  return point && point.route_type === "wire" && typeof point.layer === "string" && typeof point.width === "number";
+}
+function createTraceTextureForLayer({
   layer,
   circuitJson,
   boardData,
-  soldermaskColor,
+  traceColor,
   traceTextureResolution
 }) {
+  const pcbTraces = su8(circuitJson).pcb_trace.list();
+  const allPcbVias = su8(circuitJson).pcb_via.list();
+  const allPcbPlatedHoles = su8(
+    circuitJson
+  ).pcb_plated_hole.list();
+  const tracesOnLayer = pcbTraces.filter(
+    (t) => t.route.some((p) => isWireRoutePoint(p) && p.layer === layer)
+  );
+  if (tracesOnLayer.length === 0) return null;
   const boardOutlineBounds = calculateOutlineBounds(boardData);
   const canvas = document.createElement("canvas");
   const canvasWidth = Math.floor(
@@ -32637,546 +32662,81 @@ function createSoldermaskTextureForLayer({
     ctx.translate(0, canvasHeight);
     ctx.scale(1, -1);
   }
-  const canvasXFromPcb = (pcbX) => (pcbX - boardOutlineBounds.minX) * traceTextureResolution;
-  const canvasYFromPcb = (pcbY) => (boardOutlineBounds.maxY - pcbY) * traceTextureResolution;
-  ctx.fillStyle = soldermaskColor;
-  if (boardData.outline && boardData.outline.length >= 3) {
+  tracesOnLayer.forEach((trace) => {
+    let firstPoint = true;
     ctx.beginPath();
-    const firstPoint = boardData.outline[0];
-    ctx.moveTo(canvasXFromPcb(firstPoint.x), canvasYFromPcb(firstPoint.y));
-    for (let i = 1; i < boardData.outline.length; i++) {
-      const point = boardData.outline[i];
-      ctx.lineTo(canvasXFromPcb(point.x), canvasYFromPcb(point.y));
-    }
-    ctx.closePath();
-    ctx.fill();
-  } else {
-    ctx.fillRect(0, 0, canvasWidth, canvasHeight);
-  }
-  ctx.globalCompositeOperation = "destination-out";
-  ctx.fillStyle = "black";
-  const pcbSmtPads = su8(circuitJson).pcb_smtpad.list();
-  const smtPadsOnLayer = pcbSmtPads.filter((pad2) => pad2.layer === layer);
-  smtPadsOnLayer.forEach((pad2) => {
-    if (pad2.shape === "polygon" && pad2.points) {
-      ctx.beginPath();
-      pad2.points.forEach((point, index2) => {
-        const px = canvasXFromPcb(point.x);
-        const py = canvasYFromPcb(point.y);
-        if (index2 === 0) {
-          ctx.moveTo(px, py);
-        } else {
-          ctx.lineTo(px, py);
-        }
-      });
-      ctx.closePath();
-      ctx.fill();
-      return;
-    }
-    if (pad2.x === void 0 || pad2.y === void 0) return;
-    if (Number.isNaN(pad2.x) || Number.isNaN(pad2.y)) {
-      console.warn(
-        `[soldermask-texture] Skipping pad ${pad2.pcb_smtpad_id} with NaN coordinates`
-      );
-      return;
-    }
-    const x = pad2.x;
-    const y = pad2.y;
-    const canvasX = canvasXFromPcb(x);
-    const canvasY = canvasYFromPcb(y);
-    if (pad2.shape === "rect") {
-      const width10 = pad2.width * traceTextureResolution;
-      const height10 = pad2.height * traceTextureResolution;
-      const rawRadius = extractRectBorderRadius(pad2);
-      const borderRadius = clampRectBorderRadius(
-        pad2.width,
-        pad2.height,
-        rawRadius
-      ) * traceTextureResolution;
-      if (borderRadius > 0) {
-        ctx.beginPath();
-        ctx.roundRect(
-          canvasX - width10 / 2,
-          canvasY - height10 / 2,
-          width10,
-          height10,
-          borderRadius
-        );
-        ctx.fill();
+    ctx.strokeStyle = traceColor;
+    ctx.lineCap = "round";
+    ctx.lineJoin = "round";
+    let currentLineWidth = 0;
+    for (const point of trace.route) {
+      if (!isWireRoutePoint(point) || point.layer !== layer) {
+        if (!firstPoint) ctx.stroke();
+        firstPoint = true;
+        continue;
+      }
+      const pcbX = point.x;
+      const pcbY = point.y;
+      currentLineWidth = point.width * traceTextureResolution;
+      ctx.lineWidth = currentLineWidth;
+      const canvasX = (pcbX - boardOutlineBounds.minX) * traceTextureResolution;
+      const canvasY = (boardOutlineBounds.maxY - pcbY) * traceTextureResolution;
+      if (firstPoint) {
+        ctx.moveTo(canvasX, canvasY);
+        firstPoint = false;
       } else {
-        ctx.fillRect(canvasX - width10 / 2, canvasY - height10 / 2, width10, height10);
+        ctx.lineTo(canvasX, canvasY);
       }
-    } else if (pad2.shape === "circle") {
-      const radius = (pad2.radius ?? pad2.width / 2) * traceTextureResolution;
-      ctx.beginPath();
-      ctx.arc(canvasX, canvasY, radius, 0, 2 * Math.PI);
-      ctx.fill();
-    } else if (pad2.shape === "pill") {
-      const width10 = pad2.width * traceTextureResolution;
-      const height10 = pad2.height * traceTextureResolution;
-      const rawRadius = extractRectBorderRadius(pad2);
-      const borderRadius = clampRectBorderRadius(
-        pad2.width,
-        pad2.height,
-        rawRadius
-      ) * traceTextureResolution;
-      ctx.beginPath();
-      ctx.roundRect(
-        canvasX - width10 / 2,
-        canvasY - height10 / 2,
-        width10,
-        height10,
-        borderRadius
-      );
-      ctx.fill();
-    } else if (pad2.shape === "rotated_rect") {
-      const width10 = pad2.width * traceTextureResolution;
-      const height10 = pad2.height * traceTextureResolution;
-      const rawRadius = extractRectBorderRadius(pad2);
-      const borderRadius = clampRectBorderRadius(
-        pad2.width,
-        pad2.height,
-        rawRadius
-      ) * traceTextureResolution;
-      const ccwRotation = pad2.ccw_rotation || 0;
-      const rotation = -ccwRotation * (Math.PI / 180);
-      ctx.save();
-      ctx.translate(canvasX, canvasY);
-      ctx.rotate(rotation);
-      ctx.beginPath();
-      ctx.roundRect(-width10 / 2, -height10 / 2, width10, height10, borderRadius);
-      ctx.fill();
-      ctx.restore();
+    }
+    if (!firstPoint) {
+      ctx.stroke();
     }
   });
-  const pcbVias = su8(circuitJson).pcb_via.list();
-  pcbVias.forEach((via) => {
-    const canvasX = canvasXFromPcb(via.x);
-    const canvasY = canvasYFromPcb(via.y);
+  ctx.globalCompositeOperation = "destination-out";
+  ctx.fillStyle = "black";
+  allPcbVias.forEach((via) => {
+    const canvasX = (via.x - boardOutlineBounds.minX) * traceTextureResolution;
+    const canvasY = (boardOutlineBounds.maxY - via.y) * traceTextureResolution;
     const canvasRadius = via.outer_diameter / 2 * traceTextureResolution;
     ctx.beginPath();
-    ctx.arc(canvasX, canvasY, canvasRadius, 0, 2 * Math.PI);
+    ctx.arc(canvasX, canvasY, canvasRadius, 0, 2 * Math.PI, false);
     ctx.fill();
   });
-  const pcbPlatedHoles = su8(circuitJson).pcb_plated_hole.list();
-  pcbPlatedHoles.forEach((hole) => {
-    if (!hole.layers?.includes(layer)) return;
-    const x = hole.x;
-    const y = hole.y;
-    const canvasX = canvasXFromPcb(x);
-    const canvasY = canvasYFromPcb(y);
-    if (hole.shape === "circle") {
-      const outerDiameter = hole.outer_diameter;
-      const canvasRadius = outerDiameter / 2 * traceTextureResolution;
+  allPcbPlatedHoles.forEach((ph) => {
+    if (ph.layers.includes(layer) && ph.shape === "circle") {
+      const canvasX = (ph.x - boardOutlineBounds.minX) * traceTextureResolution;
+      const canvasY = (boardOutlineBounds.maxY - ph.y) * traceTextureResolution;
+      const canvasRadius = ph.outer_diameter / 2 * traceTextureResolution;
       ctx.beginPath();
-      ctx.arc(canvasX, canvasY, canvasRadius, 0, 2 * Math.PI);
+      ctx.arc(canvasX, canvasY, canvasRadius, 0, 2 * Math.PI, false);
       ctx.fill();
-    } else if (hole.shape === "pill") {
-      const width10 = (hole.outer_width ?? hole.outer_diameter ?? hole.hole_width) * traceTextureResolution;
-      const height10 = (hole.outer_height ?? hole.outer_diameter ?? hole.hole_height) * traceTextureResolution;
-      const radius = Math.min(width10, height10) / 2;
-      const ccwRotationDeg = hole.ccw_rotation || 0;
-      const rotation = -ccwRotationDeg;
-      if (rotation) {
-        ctx.save();
-        ctx.translate(canvasX, canvasY);
-        ctx.rotate(rotation * Math.PI / 180);
-        ctx.beginPath();
-        ctx.roundRect(-width10 / 2, -height10 / 2, width10, height10, radius);
-        ctx.fill();
-        ctx.restore();
-      } else {
-        ctx.beginPath();
-        ctx.roundRect(
-          canvasX - width10 / 2,
-          canvasY - height10 / 2,
-          width10,
-          height10,
-          radius
-        );
-        ctx.fill();
-      }
-    } else if (hole.shape === "oval") {
-      const width10 = (hole.outer_width ?? hole.outer_diameter ?? hole.hole_width) * traceTextureResolution;
-      const height10 = (hole.outer_height ?? hole.outer_diameter ?? hole.hole_height) * traceTextureResolution;
-      const radiusX = width10 / 2;
-      const radiusY = height10 / 2;
-      const ccwRotationDeg = hole.ccw_rotation || 0;
-      const rotation = -ccwRotationDeg;
-      if (rotation) {
+    } else if (ph.layers.includes(layer) && ph.shape === "rotated_pill_hole_with_rect_pad") {
+      const canvasX = (ph.x - boardOutlineBounds.minX) * traceTextureResolution;
+      const canvasY = (boardOutlineBounds.maxY - ph.y) * traceTextureResolution;
+      const padWidth = (ph.rect_pad_width ?? ph.hole_width ?? 0) * traceTextureResolution;
+      const padHeight = (ph.rect_pad_height ?? ph.hole_height ?? 0) * traceTextureResolution;
+      const rectCcwRotationDeg = ph.rect_ccw_rotation || 0;
+      const rectRotation = -rectCcwRotationDeg;
+      if (rectRotation) {
         ctx.save();
         ctx.translate(canvasX, canvasY);
-        ctx.rotate(rotation * Math.PI / 180);
+        ctx.rotate(rectRotation * Math.PI / 180);
         ctx.beginPath();
-        ctx.ellipse(0, 0, radiusX, radiusY, 0, 0, 2 * Math.PI);
+        ctx.rect(-padWidth / 2, -padHeight / 2, padWidth, padHeight);
         ctx.fill();
         ctx.restore();
       } else {
         ctx.beginPath();
-        ctx.ellipse(canvasX, canvasY, radiusX, radiusY, 0, 0, 2 * Math.PI);
-        ctx.fill();
-      }
-    } else if (hole.shape === "hole_with_polygon_pad") {
-      const holeShape = hole.hole_shape || "circle";
-      const holeOffsetX = hole.hole_offset_x || 0;
-      const holeOffsetY = hole.hole_offset_y || 0;
-      const adjustedCanvasX = canvasXFromPcb(hole.x + holeOffsetX);
-      const adjustedCanvasY = canvasYFromPcb(hole.y + holeOffsetY);
-      if (holeShape === "pill" || holeShape === "rotated_pill") {
-        const width10 = (hole.outer_width ?? hole.outer_diameter ?? hole.hole_width) * traceTextureResolution;
-        const height10 = (hole.outer_height ?? hole.outer_diameter ?? hole.hole_height) * traceTextureResolution;
-        const radius = Math.min(width10, height10) / 2;
-        const ccwRotationDeg = hole.ccw_rotation || 0;
-        const rotation = -ccwRotationDeg;
-        if (rotation) {
-          ctx.save();
-          ctx.translate(adjustedCanvasX, adjustedCanvasY);
-          ctx.rotate(rotation * Math.PI / 180);
-          ctx.beginPath();
-          ctx.roundRect(-width10 / 2, -height10 / 2, width10, height10, radius);
-          ctx.fill();
-          ctx.restore();
-        } else {
-          ctx.beginPath();
-          ctx.roundRect(
-            adjustedCanvasX - width10 / 2,
-            adjustedCanvasY - height10 / 2,
-            width10,
-            height10,
-            radius
-          );
-          ctx.fill();
-        }
-      } else if (holeShape === "oval") {
-        const width10 = (hole.outer_width ?? hole.outer_diameter ?? hole.hole_width) * traceTextureResolution;
-        const height10 = (hole.outer_height ?? hole.outer_diameter ?? hole.hole_height) * traceTextureResolution;
-        const radiusX = width10 / 2;
-        const radiusY = height10 / 2;
-        const ccwRotationDeg = hole.ccw_rotation || 0;
-        const rotation = -ccwRotationDeg;
-        if (rotation) {
-          ctx.save();
-          ctx.translate(adjustedCanvasX, adjustedCanvasY);
-          ctx.rotate(rotation * Math.PI / 180);
-          ctx.beginPath();
-          ctx.ellipse(0, 0, radiusX, radiusY, 0, 0, 2 * Math.PI);
-          ctx.fill();
-          ctx.restore();
-        } else {
-          ctx.beginPath();
-          ctx.ellipse(
-            adjustedCanvasX,
-            adjustedCanvasY,
-            radiusX,
-            radiusY,
-            0,
-            0,
-            2 * Math.PI
-          );
-          ctx.fill();
-        }
-      } else if (holeShape === "circle") {
-        const outerDiameter = (hole.outer_diameter ?? hole.hole_diameter ?? 0) * traceTextureResolution;
-        const canvasRadius = outerDiameter / 2;
-        ctx.beginPath();
-        ctx.arc(adjustedCanvasX, adjustedCanvasY, canvasRadius, 0, 2 * Math.PI);
-        ctx.fill();
-      }
-      if (hole.pad_outline && hole.pad_outline.length >= 3) {
-        ctx.beginPath();
-        hole.pad_outline.forEach(
-          (point, index2) => {
-            const px = canvasXFromPcb(hole.x + point.x);
-            const py = canvasYFromPcb(hole.y + point.y);
-            if (index2 === 0) {
-              ctx.moveTo(px, py);
-            } else {
-              ctx.lineTo(px, py);
-            }
-          }
-        );
-        ctx.closePath();
-        ctx.fill();
-      }
-    } else if (hole.shape === "circular_hole_with_rect_pad") {
-      const padWidth = (hole.rect_pad_width ?? hole.hole_diameter ?? 0) * traceTextureResolution;
-      const padHeight = (hole.rect_pad_height ?? hole.hole_diameter ?? 0) * traceTextureResolution;
-      const rawRadius = extractRectBorderRadius(hole);
-      const borderRadius = clampRectBorderRadius(
-        hole.rect_pad_width ?? hole.hole_diameter ?? 0,
-        hole.rect_pad_height ?? hole.hole_diameter ?? 0,
-        rawRadius
-      ) * traceTextureResolution;
-      if (borderRadius > 0) {
-        ctx.beginPath();
-        ctx.roundRect(
-          canvasX - padWidth / 2,
-          canvasY - padHeight / 2,
-          padWidth,
-          padHeight,
-          borderRadius
-        );
-        ctx.fill();
-      } else {
-        ctx.fillRect(
+        ctx.rect(
           canvasX - padWidth / 2,
           canvasY - padHeight / 2,
           padWidth,
           padHeight
         );
-      }
-    } else if (hole.shape === "pill_hole_with_rect_pad") {
-      const padWidth = (hole.rect_pad_width ?? hole.hole_width ?? 0) * traceTextureResolution;
-      const padHeight = (hole.rect_pad_height ?? hole.hole_height ?? 0) * traceTextureResolution;
-      const rawRadius = extractRectBorderRadius(hole);
-      const borderRadius = clampRectBorderRadius(
-        hole.rect_pad_width ?? hole.hole_width ?? 0,
-        hole.rect_pad_height ?? hole.hole_height ?? 0,
-        rawRadius
-      ) * traceTextureResolution;
-      const ccwRotationDeg = hole.ccw_rotation || 0;
-      const rotation = -ccwRotationDeg;
-      if (rotation) {
-        ctx.save();
-        ctx.translate(canvasX, canvasY);
-        ctx.rotate(rotation * Math.PI / 180);
-        ctx.beginPath();
-        ctx.roundRect(
-          -padWidth / 2,
-          -padHeight / 2,
-          padWidth,
-          padHeight,
-          borderRadius
-        );
-        ctx.fill();
-        ctx.restore();
-      } else {
-        ctx.beginPath();
-        ctx.roundRect(
-          canvasX - padWidth / 2,
-          canvasY - padHeight / 2,
-          padWidth,
-          padHeight,
-          borderRadius
-        );
-        ctx.fill();
-      }
-    } else if (hole.shape === "rotated_pill_hole_with_rect_pad") {
-      const padWidth = (hole.rect_pad_width ?? hole.hole_width ?? 0) * traceTextureResolution;
-      const padHeight = (hole.rect_pad_height ?? hole.hole_height ?? 0) * traceTextureResolution;
-      const rawRadius = extractRectBorderRadius(hole);
-      const borderRadius = clampRectBorderRadius(
-        hole.rect_pad_width ?? hole.hole_width ?? 0,
-        hole.rect_pad_height ?? hole.hole_height ?? 0,
-        rawRadius
-      ) * traceTextureResolution;
-      const rectCcwRotationDeg = hole.rect_ccw_rotation || 0;
-      const rectRotation = -rectCcwRotationDeg;
-      if (rectRotation) {
-        ctx.save();
-        ctx.translate(canvasX, canvasY);
-        ctx.rotate(rectRotation * Math.PI / 180);
-        ctx.beginPath();
-        ctx.roundRect(
-          -padWidth / 2,
-          -padHeight / 2,
-          padWidth,
-          padHeight,
-          borderRadius
-        );
-        ctx.fill();
-        ctx.restore();
-      } else {
-        ctx.beginPath();
-        ctx.roundRect(
-          canvasX - padWidth / 2,
-          canvasY - padHeight / 2,
-          padWidth,
-          padHeight,
-          borderRadius
-        );
-        ctx.fill();
+        ctx.fill();
       }
     }
   });
-  const pcbHoles = su8(circuitJson).pcb_hole.list();
-  pcbHoles.forEach((hole) => {
-    const x = hole.x;
-    const y = hole.y;
-    const canvasX = canvasXFromPcb(x);
-    const canvasY = canvasYFromPcb(y);
-    const holeShape = hole.hole_shape;
-    if (holeShape === "circle" && typeof hole.hole_diameter === "number") {
-      const canvasRadius = hole.hole_diameter / 2 * traceTextureResolution;
-      ctx.beginPath();
-      ctx.arc(canvasX, canvasY, canvasRadius, 0, 2 * Math.PI);
-      ctx.fill();
-    } else if (holeShape === "pill" && typeof hole.hole_width === "number" && typeof hole.hole_height === "number") {
-      const width10 = hole.hole_width * traceTextureResolution;
-      const height10 = hole.hole_height * traceTextureResolution;
-      const radius = Math.min(width10, height10) / 2;
-      ctx.beginPath();
-      ctx.roundRect(
-        canvasX - width10 / 2,
-        canvasY - height10 / 2,
-        width10,
-        height10,
-        radius
-      );
-      ctx.fill();
-    } else if (holeShape === "rotated_pill" && typeof hole.hole_width === "number" && typeof hole.hole_height === "number") {
-      const width10 = hole.hole_width * traceTextureResolution;
-      const height10 = hole.hole_height * traceTextureResolution;
-      const radius = Math.min(width10, height10) / 2;
-      const ccwRotationDeg = hole.ccw_rotation || 0;
-      const rotation = -ccwRotationDeg * (Math.PI / 180);
-      if (rotation) {
-        ctx.save();
-        ctx.translate(canvasX, canvasY);
-        ctx.rotate(rotation);
-        ctx.beginPath();
-        ctx.roundRect(-width10 / 2, -height10 / 2, width10, height10, radius);
-        ctx.fill();
-        ctx.restore();
-      } else {
-        ctx.beginPath();
-        ctx.roundRect(
-          canvasX - width10 / 2,
-          canvasY - height10 / 2,
-          width10,
-          height10,
-          radius
-        );
-        ctx.fill();
-      }
-    } else if (holeShape === "oval" && typeof hole.hole_width === "number" && typeof hole.hole_height === "number") {
-      const width10 = hole.hole_width * traceTextureResolution;
-      const height10 = hole.hole_height * traceTextureResolution;
-      const radiusX = width10 / 2;
-      const radiusY = height10 / 2;
-      ctx.beginPath();
-      ctx.ellipse(canvasX, canvasY, radiusX, radiusY, 0, 0, 2 * Math.PI);
-      ctx.fill();
-    }
-  });
-  const pcbCopperPours = su8(circuitJson).pcb_copper_pour.list();
-  pcbCopperPours.forEach((pour) => {
-    if (pour.layer !== layer) return;
-    if (pour.covered_with_solder_mask !== false) return;
-    if (pour.shape === "rect") {
-      const centerX = canvasXFromPcb(pour.center.x);
-      const centerY = canvasYFromPcb(pour.center.y);
-      const width10 = pour.width * traceTextureResolution;
-      const height10 = pour.height * traceTextureResolution;
-      ctx.fillRect(centerX - width10 / 2, centerY - height10 / 2, width10, height10);
-    } else if (pour.shape === "polygon" && pour.points) {
-      ctx.beginPath();
-      pour.points.forEach((point, index2) => {
-        const px = canvasXFromPcb(point.x);
-        const py = canvasYFromPcb(point.y);
-        if (index2 === 0) {
-          ctx.moveTo(px, py);
-        } else {
-          ctx.lineTo(px, py);
-        }
-      });
-      ctx.closePath();
-      ctx.fill();
-    }
-  });
-  const pcbCutouts = su8(circuitJson).pcb_cutout.list();
-  pcbCutouts.forEach((cutout) => {
-    switch (cutout.shape) {
-      case "rect": {
-        const canvasX = canvasXFromPcb(cutout.center.x);
-        const canvasY = canvasYFromPcb(cutout.center.y);
-        const width10 = cutout.width * traceTextureResolution;
-        const height10 = cutout.height * traceTextureResolution;
-        const rectCornerRadius = extractRectBorderRadius(cutout);
-        const borderRadius = clampRectBorderRadius(
-          cutout.width,
-          cutout.height,
-          rectCornerRadius
-        );
-        if (cutout.rotation) {
-          ctx.save();
-          ctx.translate(canvasX, canvasY);
-          const rotation = -cutout.rotation * (Math.PI / 180);
-          ctx.rotate(rotation);
-          if (borderRadius > 0) {
-            ctx.beginPath();
-            ctx.roundRect(
-              -width10 / 2,
-              -height10 / 2,
-              width10,
-              height10,
-              borderRadius * traceTextureResolution
-            );
-            ctx.fill();
-          } else {
-            ctx.fillRect(-width10 / 2, -height10 / 2, width10, height10);
-          }
-          ctx.restore();
-        } else {
-          if (borderRadius > 0) {
-            ctx.beginPath();
-            ctx.roundRect(
-              canvasX - width10 / 2,
-              canvasY - height10 / 2,
-              width10,
-              height10,
-              borderRadius * traceTextureResolution
-            );
-            ctx.fill();
-          } else {
-            ctx.fillRect(
-              canvasX - width10 / 2,
-              canvasY - height10 / 2,
-              width10,
-              height10
-            );
-          }
-        }
-        break;
-      }
-      case "circle": {
-        const canvasX = canvasXFromPcb(cutout.center.x);
-        const canvasY = canvasYFromPcb(cutout.center.y);
-        const canvasRadius = cutout.radius * traceTextureResolution;
-        ctx.beginPath();
-        ctx.arc(canvasX, canvasY, canvasRadius, 0, 2 * Math.PI);
-        ctx.fill();
-        break;
-      }
-      case "polygon": {
-        if (!cutout.points || cutout.points.length < 3) {
-          console.warn(
-            `PCB Cutout [${cutout.pcb_cutout_id}] polygon has fewer than 3 points, skipping in soldermask texture.`
-          );
-          break;
-        }
-        ctx.beginPath();
-        cutout.points.forEach(
-          (point, index2) => {
-            const px = canvasXFromPcb(point.x);
-            const py = canvasYFromPcb(point.y);
-            if (index2 === 0) {
-              ctx.moveTo(px, py);
-            } else {
-              ctx.lineTo(px, py);
-            }
-          }
-        );
-        ctx.closePath();
-        ctx.fill();
-        break;
-      }
-      default:
-        console.warn(
-          `Unsupported cutout shape: ${cutout.shape} for cutout ${cutout.pcb_cutout_id} in soldermask texture.`
-        );
-    }
-  });
   ctx.globalCompositeOperation = "source-over";
   const texture = new THREE23.CanvasTexture(canvas);
   texture.generateMipmaps = true;
@@ -33187,131 +32747,8 @@ function createSoldermaskTextureForLayer({
   return texture;
 }
 
-// src/utils/trace-texture.ts
-import * as THREE24 from "three";
-import { su as su9 } from "@tscircuit/circuit-json-util";
-function isWireRoutePoint(point) {
-  return point && point.route_type === "wire" && typeof point.layer === "string" && typeof point.width === "number";
-}
-function createTraceTextureForLayer({
-  layer,
-  circuitJson,
-  boardData,
-  traceColor,
-  traceTextureResolution
-}) {
-  const pcbTraces = su9(circuitJson).pcb_trace.list();
-  const allPcbVias = su9(circuitJson).pcb_via.list();
-  const allPcbPlatedHoles = su9(
-    circuitJson
-  ).pcb_plated_hole.list();
-  const tracesOnLayer = pcbTraces.filter(
-    (t) => t.route.some((p) => isWireRoutePoint(p) && p.layer === layer)
-  );
-  if (tracesOnLayer.length === 0) return null;
-  const boardOutlineBounds = calculateOutlineBounds(boardData);
-  const canvas = document.createElement("canvas");
-  const canvasWidth = Math.floor(
-    boardOutlineBounds.width * traceTextureResolution
-  );
-  const canvasHeight = Math.floor(
-    boardOutlineBounds.height * traceTextureResolution
-  );
-  canvas.width = canvasWidth;
-  canvas.height = canvasHeight;
-  const ctx = canvas.getContext("2d");
-  if (!ctx) return null;
-  if (layer === "bottom") {
-    ctx.translate(0, canvasHeight);
-    ctx.scale(1, -1);
-  }
-  tracesOnLayer.forEach((trace) => {
-    let firstPoint = true;
-    ctx.beginPath();
-    ctx.strokeStyle = traceColor;
-    ctx.lineCap = "round";
-    ctx.lineJoin = "round";
-    let currentLineWidth = 0;
-    for (const point of trace.route) {
-      if (!isWireRoutePoint(point) || point.layer !== layer) {
-        if (!firstPoint) ctx.stroke();
-        firstPoint = true;
-        continue;
-      }
-      const pcbX = point.x;
-      const pcbY = point.y;
-      currentLineWidth = point.width * traceTextureResolution;
-      ctx.lineWidth = currentLineWidth;
-      const canvasX = (pcbX - boardOutlineBounds.minX) * traceTextureResolution;
-      const canvasY = (boardOutlineBounds.maxY - pcbY) * traceTextureResolution;
-      if (firstPoint) {
-        ctx.moveTo(canvasX, canvasY);
-        firstPoint = false;
-      } else {
-        ctx.lineTo(canvasX, canvasY);
-      }
-    }
-    if (!firstPoint) {
-      ctx.stroke();
-    }
-  });
-  ctx.globalCompositeOperation = "destination-out";
-  ctx.fillStyle = "black";
-  allPcbVias.forEach((via) => {
-    const canvasX = (via.x - boardOutlineBounds.minX) * traceTextureResolution;
-    const canvasY = (boardOutlineBounds.maxY - via.y) * traceTextureResolution;
-    const canvasRadius = via.outer_diameter / 2 * traceTextureResolution;
-    ctx.beginPath();
-    ctx.arc(canvasX, canvasY, canvasRadius, 0, 2 * Math.PI, false);
-    ctx.fill();
-  });
-  allPcbPlatedHoles.forEach((ph) => {
-    if (ph.layers.includes(layer) && ph.shape === "circle") {
-      const canvasX = (ph.x - boardOutlineBounds.minX) * traceTextureResolution;
-      const canvasY = (boardOutlineBounds.maxY - ph.y) * traceTextureResolution;
-      const canvasRadius = ph.outer_diameter / 2 * traceTextureResolution;
-      ctx.beginPath();
-      ctx.arc(canvasX, canvasY, canvasRadius, 0, 2 * Math.PI, false);
-      ctx.fill();
-    } else if (ph.layers.includes(layer) && ph.shape === "rotated_pill_hole_with_rect_pad") {
-      const canvasX = (ph.x - boardOutlineBounds.minX) * traceTextureResolution;
-      const canvasY = (boardOutlineBounds.maxY - ph.y) * traceTextureResolution;
-      const padWidth = (ph.rect_pad_width ?? ph.hole_width ?? 0) * traceTextureResolution;
-      const padHeight = (ph.rect_pad_height ?? ph.hole_height ?? 0) * traceTextureResolution;
-      const rectCcwRotationDeg = ph.rect_ccw_rotation || 0;
-      const rectRotation = -rectCcwRotationDeg;
-      if (rectRotation) {
-        ctx.save();
-        ctx.translate(canvasX, canvasY);
-        ctx.rotate(rectRotation * Math.PI / 180);
-        ctx.beginPath();
-        ctx.rect(-padWidth / 2, -padHeight / 2, padWidth, padHeight);
-        ctx.fill();
-        ctx.restore();
-      } else {
-        ctx.beginPath();
-        ctx.rect(
-          canvasX - padWidth / 2,
-          canvasY - padHeight / 2,
-          padWidth,
-          padHeight
-        );
-        ctx.fill();
-      }
-    }
-  });
-  ctx.globalCompositeOperation = "source-over";
-  const texture = new THREE24.CanvasTexture(canvas);
-  texture.generateMipmaps = true;
-  texture.minFilter = THREE24.LinearMipmapLinearFilter;
-  texture.magFilter = THREE24.LinearFilter;
-  texture.anisotropy = 16;
-  texture.needsUpdate = true;
-  return texture;
-}
-
 // src/textures/create-copper-pour-texture-for-layer.ts
-import * as THREE25 from "three";
+import * as THREE24 from "three";
 import { CircuitToCanvasDrawer } from "circuit-to-canvas";
 
 // src/geoms/brep-converter.ts
@@ -33517,6 +32954,190 @@ function createCopperPourTextureForLayer({
     ctx.fillStyle = copperColor;
     drawBrepShape({ ctx, pour, canvasXFromPcb, canvasYFromPcb });
   }
+  const texture = new THREE24.CanvasTexture(canvas);
+  texture.generateMipmaps = true;
+  texture.minFilter = THREE24.LinearMipmapLinearFilter;
+  texture.magFilter = THREE24.LinearFilter;
+  texture.anisotropy = 16;
+  texture.needsUpdate = true;
+  return texture;
+}
+
+// src/textures/create-soldermask-texture-for-layer.ts
+import * as THREE25 from "three";
+
+// src/textures/soldermask/soldermask-drawing.ts
+import { CircuitToCanvasDrawer as CircuitToCanvasDrawer2 } from "circuit-to-canvas";
+var toRgb = (colorArr) => {
+  const [r = 0, g = 0, b = 0] = colorArr;
+  return `rgb(${Math.round(r * 255)}, ${Math.round(g * 255)}, ${Math.round(
+    b * 255
+  )})`;
+};
+var getSoldermaskPalette = (material) => {
+  const soldermask = toRgb(
+    soldermaskColors[material] ?? colors.fr4SolderMaskGreen
+  );
+  const soldermaskOverCopper = material === "fr1" ? toRgb(colors.fr1TracesWithMaskCopper) : toRgb(colors.fr4TracesWithMaskGreen);
+  return {
+    soldermask,
+    soldermaskOverCopper,
+    copper: toRgb(colors.copper),
+    transparent: "rgba(0,0,0,0)"
+  };
+};
+var setDrawerBounds = (drawer, bounds) => {
+  drawer.setCameraBounds({
+    minX: bounds.minX,
+    maxX: bounds.maxX,
+    minY: bounds.minY,
+    maxY: bounds.maxY
+  });
+};
+var drawSoldermaskLayer = ({
+  ctx,
+  layer,
+  bounds,
+  elements,
+  boardMaterial
+}) => {
+  const palette = getSoldermaskPalette(boardMaterial);
+  const copperRenderLayer = layer === "top" ? "top_copper" : "bottom_copper";
+  const drawer = new CircuitToCanvasDrawer2(ctx);
+  drawer.configure({
+    colorOverrides: {
+      copper: {
+        top: palette.transparent,
+        bottom: palette.transparent,
+        inner1: palette.transparent,
+        inner2: palette.transparent,
+        inner3: palette.transparent,
+        inner4: palette.transparent,
+        inner5: palette.transparent,
+        inner6: palette.transparent
+      },
+      drill: palette.transparent,
+      boardOutline: palette.transparent,
+      substrate: palette.transparent,
+      keepout: palette.transparent,
+      fabricationNote: palette.transparent,
+      silkscreen: { top: palette.transparent, bottom: palette.transparent },
+      courtyard: { top: palette.transparent, bottom: palette.transparent },
+      soldermask: { top: palette.soldermask, bottom: palette.soldermask },
+      soldermaskWithCopperUnderneath: {
+        top: palette.soldermaskOverCopper,
+        bottom: palette.soldermaskOverCopper
+      },
+      soldermaskOverCopper: {
+        top: palette.soldermaskOverCopper,
+        bottom: palette.soldermaskOverCopper
+      }
+    }
+  });
+  setDrawerBounds(drawer, bounds);
+  drawer.drawElements(elements, {
+    layers: [copperRenderLayer],
+    drawSoldermask: true,
+    drawSoldermaskTop: layer === "top",
+    drawSoldermaskBottom: layer === "bottom"
+  });
+  const uncoveredPours = elements.filter(
+    (e) => e.type === "pcb_copper_pour" && e.layer === layer && e.covered_with_solder_mask === false
+  );
+  if (uncoveredPours.length > 0) {
+    ctx.save();
+    ctx.globalCompositeOperation = "destination-out";
+    const cutoutDrawer = new CircuitToCanvasDrawer2(ctx);
+    cutoutDrawer.configure({
+      colorOverrides: {
+        copper: {
+          top: palette.copper,
+          bottom: palette.copper,
+          inner1: palette.copper,
+          inner2: palette.copper,
+          inner3: palette.copper,
+          inner4: palette.copper,
+          inner5: palette.copper,
+          inner6: palette.copper
+        }
+      }
+    });
+    setDrawerBounds(cutoutDrawer, bounds);
+    cutoutDrawer.drawElements(uncoveredPours, { layers: [copperRenderLayer] });
+    ctx.restore();
+  }
+};
+
+// src/textures/soldermask/soldermask-bounds.ts
+var boundsFromPanel = (panel) => ({
+  minX: panel.center.x - panel.width / 2,
+  maxX: panel.center.x + panel.width / 2,
+  minY: panel.center.y - panel.height / 2,
+  maxY: panel.center.y + panel.height / 2,
+  width: panel.width,
+  height: panel.height,
+  centerX: panel.center.x,
+  centerY: panel.center.y
+});
+var mergeBounds = (a, b) => {
+  const minX = Math.min(a.minX, b.minX);
+  const maxX = Math.max(a.maxX, b.maxX);
+  const minY = Math.min(a.minY, b.minY);
+  const maxY = Math.max(a.maxY, b.maxY);
+  return {
+    minX,
+    maxX,
+    minY,
+    maxY,
+    width: maxX - minX,
+    height: maxY - minY,
+    centerX: (minX + maxX) / 2,
+    centerY: (minY + maxY) / 2
+  };
+};
+var getSoldermaskRenderBounds = (circuitJson, boardData) => {
+  const panels = circuitJson.filter(
+    (e) => e.type === "pcb_panel"
+  );
+  const boards = circuitJson.filter(
+    (e) => e.type === "pcb_board"
+  );
+  const activePanel = panels.find((panel) => panel.pcb_panel_id === boardData.pcb_board_id) ?? panels[0];
+  if (activePanel && activePanel.width > 0 && activePanel.height > 0) {
+    return boundsFromPanel(activePanel);
+  }
+  const boardsForBounds = boards.length > 1 ? boards : [boardData];
+  return boardsForBounds.map((board) => calculateOutlineBounds(board)).reduce((acc, bounds) => mergeBounds(acc, bounds));
+};
+
+// src/textures/create-soldermask-texture-for-layer.ts
+function createSoldermaskTextureForLayer({
+  layer,
+  circuitJson,
+  boardData,
+  traceTextureResolution = TRACE_TEXTURE_RESOLUTION
+}) {
+  const bounds = getSoldermaskRenderBounds(circuitJson, boardData);
+  const canvasWidth = Math.floor(bounds.width * traceTextureResolution);
+  const canvasHeight = Math.floor(bounds.height * traceTextureResolution);
+  if (canvasWidth <= 0 || canvasHeight <= 0) return null;
+  const canvas = document.createElement("canvas");
+  canvas.width = canvasWidth;
+  canvas.height = canvasHeight;
+  const ctx = canvas.getContext("2d");
+  if (!ctx) return null;
+  if (layer === "bottom") {
+    ctx.translate(0, canvasHeight);
+    ctx.scale(1, -1);
+  }
+  const elements = circuitJson.some((e) => e.type === "pcb_board") ? circuitJson : [boardData, ...circuitJson];
+  drawSoldermaskLayer({
+    ctx,
+    layer,
+    bounds,
+    elements,
+    boardMaterial: boardData.material
+  });
   const texture = new THREE25.CanvasTexture(canvas);
   texture.generateMipmaps = true;
   texture.minFilter = THREE25.LinearMipmapLinearFilter;
@@ -33527,7 +33148,7 @@ function createCopperPourTextureForLayer({
 }
 
 // src/textures/create-combined-board-textures.ts
-var toRgb = (colorArr) => {
+var toRgb2 = (colorArr) => {
   const [r = 0, g = 0, b = 0] = colorArr;
   return `rgb(${Math.round(r * 255)}, ${Math.round(g * 255)}, ${Math.round(
     b * 255
@@ -33550,7 +33171,7 @@ var createCombinedTexture = ({
   if (canvasWidth <= 0 || canvasHeight <= 0) return null;
   const canvas = document.createElement("canvas");
   canvas.width = canvasWidth;
-  canvas.height = canvasHeight;
+  canvas.height = canvasHeight + 1;
   const ctx = canvas.getContext("2d");
   if (!ctx) return null;
   textures.forEach((texture) => {
@@ -33559,9 +33180,10 @@ var createCombinedTexture = ({
     ctx.drawImage(image, 0, 0, canvasWidth, canvasHeight);
   });
   const combinedTexture = new THREE26.CanvasTexture(canvas);
-  combinedTexture.generateMipmaps = true;
-  combinedTexture.minFilter = THREE26.LinearMipmapLinearFilter;
+  combinedTexture.generateMipmaps = false;
+  combinedTexture.minFilter = THREE26.LinearFilter;
   combinedTexture.magFilter = THREE26.LinearFilter;
+  combinedTexture.premultiplyAlpha = true;
   combinedTexture.anisotropy = 16;
   combinedTexture.needsUpdate = true;
   return combinedTexture;
@@ -33572,13 +33194,10 @@ function createCombinedBoardTextures({
   traceTextureResolution,
   visibility
 }) {
-  const soldermaskColor = toRgb(
-    soldermaskColors[boardData.material] ?? colors.fr4SolderMaskGreen
-  );
-  const traceColorWithMask = toRgb(colors.fr4TracesWithMaskGreen);
-  const traceColorWithoutMask = toRgb(colors.fr4TracesWithoutMaskTan);
+  const traceColorWithMask = toRgb2(colors.fr4TracesWithMaskGreen);
+  const traceColorWithoutMask = toRgb2(colors.fr4TracesWithoutMaskTan);
   const silkscreenColor = "rgb(255,255,255)";
-  const copperColor = toRgb(colors.copper);
+  const copperColor = toRgb2(colors.copper);
   const showBoardBody = visibility?.boardBody ?? true;
   const buildForLayer = (layer) => {
     const showMask = (layer === "top" ? visibility?.topMask : visibility?.bottomMask) ?? true;
@@ -33588,7 +33207,6 @@ function createCombinedBoardTextures({
       layer,
       circuitJson,
       boardData,
-      soldermaskColor,
       traceTextureResolution
     }) : null;
     const traceTexture = showCopper ? createTraceTextureForLayer({
@@ -33633,11 +33251,11 @@ function createCombinedBoardTextures({
     }) : null;
     return createCombinedTexture({
       textures: [
-        soldermaskTexture,
         copperPourTexture,
         traceTexture,
         copperTextTexture,
         padTexture,
+        soldermaskTexture,
         silkscreenTexture,
         panelOutlineTexture
       ],
@@ -33672,8 +33290,9 @@ function createTexturePlane(config, boardData) {
   const material = new THREE27.MeshBasicMaterial({
     map: texture,
     transparent: true,
+    alphaTest: 0.08,
     side: THREE27.DoubleSide,
-    depthWrite: false,
+    depthWrite: true,
     polygonOffset: usePolygonOffset,
     polygonOffsetFactor: usePolygonOffset ? -4 : 0,
     // Increased for better z-fighting prevention
@@ -33696,10 +33315,11 @@ function createTexturePlane(config, boardData) {
 function createTextureMeshes(textures, boardData, pcbThickness, isFaux = false) {
   const meshes = [];
   if (!textures || !boardData || pcbThickness === null) return meshes;
+  const SURFACE_OFFSET = 5e-3;
   const topBoardMesh = createTexturePlane(
     {
       texture: textures.topBoard,
-      yOffset: pcbThickness / 2 + 1e-3,
+      yOffset: pcbThickness / 2 + SURFACE_OFFSET,
       isBottomLayer: false,
       usePolygonOffset: true,
       renderOrder: 1,
@@ -33711,7 +33331,7 @@ function createTextureMeshes(textures, boardData, pcbThickness, isFaux = false)
   const bottomBoardMesh = createTexturePlane(
     {
       texture: textures.bottomBoard,
-      yOffset: -pcbThickness / 2 - 1e-3,
+      yOffset: -pcbThickness / 2 - SURFACE_OFFSET,
       isBottomLayer: true,
       usePolygonOffset: true,
       renderOrder: 1,
@@ -33765,7 +33385,7 @@ function JscadBoardTextures({
     const panels = circuitJson.filter(
       (e) => e.type === "pcb_panel"
     );
-    const boards = su10(circuitJson).pcb_board.list();
+    const boards = su9(circuitJson).pcb_board.list();
     if (panels.length > 0) {
       const panel = panels[0];
       const firstBoardInPanel = boards.find(
@@ -33827,7 +33447,7 @@ function JscadBoardTextures({
       }
       material.dispose();
     };
-    const createTexturePlane2 = (texture, zOffset, isBottomLayer, name, usePolygonOffset = false, depthWrite = false, renderOrder = 1) => {
+    const createTexturePlane2 = (texture, zOffset, isBottomLayer, name, usePolygonOffset = false, depthWrite = true, renderOrder = 1) => {
       if (!texture) return null;
       const boardOutlineBounds = calculateOutlineBounds(boardData);
       const planeGeom = new THREE28.PlaneGeometry(
@@ -33837,9 +33457,11 @@ function JscadBoardTextures({
       const material = new THREE28.MeshBasicMaterial({
         map: texture,
         transparent: true,
+        alphaTest: 0.08,
         side: THREE28.DoubleSide,
         depthWrite,
         polygonOffset: usePolygonOffset,
+        polygonOffsetFactor: usePolygonOffset ? -4 : 0,
         polygonOffsetUnits: usePolygonOffset ? -4 : 0,
         opacity: isFaux ? FAUX_BOARD_OPACITY : 1
       });
@@ -33857,7 +33479,7 @@ function JscadBoardTextures({
       mesh.frustumCulled = false;
       return mesh;
     };
-    const SURFACE_OFFSET = 1e-3;
+    const SURFACE_OFFSET = 5e-3;
     const topBoardMesh = createTexturePlane2(
       textures.topBoard,
       pcbThickness / 2 + SURFACE_OFFSET,
@@ -33900,16 +33522,16 @@ function JscadBoardTextures({
 }
 
 // src/utils/preprocess-circuit-json.ts
-import { su as su12 } from "@tscircuit/circuit-json-util";
+import { su as su11 } from "@tscircuit/circuit-json-util";
 
 // src/utils/create-faux-board.ts
-import { su as su11, getBoundsOfPcbElements } from "@tscircuit/circuit-json-util";
+import { su as su10, getBoundsOfPcbElements } from "@tscircuit/circuit-json-util";
 function createFauxBoard(circuitJson) {
-  const cadComponents = su11(circuitJson).cad_component.list();
-  const pads = su11(circuitJson).pcb_smtpad.list();
-  const holes = su11(circuitJson).pcb_hole.list();
-  const platedHoles = su11(circuitJson).pcb_plated_hole.list();
-  const vias = su11(circuitJson).pcb_via.list();
+  const cadComponents = su10(circuitJson).cad_component.list();
+  const pads = su10(circuitJson).pcb_smtpad.list();
+  const holes = su10(circuitJson).pcb_hole.list();
+  const platedHoles = su10(circuitJson).pcb_plated_hole.list();
+  const vias = su10(circuitJson).pcb_via.list();
   if (cadComponents.length === 0 && pads.length === 0 && holes.length === 0 && platedHoles.length === 0 && vias.length === 0) {
     return null;
   }
@@ -33958,7 +33580,7 @@ function createFauxBoard(circuitJson) {
 
 // src/utils/preprocess-circuit-json.ts
 function addFauxBoardIfNeeded(circuitJson) {
-  const boards = su12(circuitJson).pcb_board.list();
+  const boards = su11(circuitJson).pcb_board.list();
   if (boards.length > 0) {
     return circuitJson;
   }
@@ -34009,7 +33631,7 @@ var CadViewerJscad = forwardRef3(
     const initialCameraPosition = useMemo20(() => {
       if (!internalCircuitJson) return [5, -5, 5];
       try {
-        const board = su13(internalCircuitJson).pcb_board.list()[0];
+        const board = su12(internalCircuitJson).pcb_board.list()[0];
         if (!board) return [5, -5, 5];
         const { width: width10, height: height10 } = board;
         if (!width10 && !height10) {
@@ -34035,7 +33657,7 @@ var CadViewerJscad = forwardRef3(
     const isFauxBoard = useMemo20(() => {
       if (!internalCircuitJson) return false;
       try {
-        const board = su13(internalCircuitJson).pcb_board.list()[0];
+        const board = su12(internalCircuitJson).pcb_board.list()[0];
         return !!board && board.pcb_board_id === "faux-board";
       } catch (e) {
         return false;
@@ -34044,7 +33666,7 @@ var CadViewerJscad = forwardRef3(
     const boardDimensions = useMemo20(() => {
       if (!internalCircuitJson) return void 0;
       try {
-        const board = su13(internalCircuitJson).pcb_board.list()[0];
+        const board = su12(internalCircuitJson).pcb_board.list()[0];
         if (!board) return void 0;
         return { width: board.width ?? 0, height: board.height ?? 0 };
       } catch (e) {
@@ -34055,7 +33677,7 @@ var CadViewerJscad = forwardRef3(
     const boardCenter = useMemo20(() => {
       if (!internalCircuitJson) return void 0;
       try {
-        const board = su13(internalCircuitJson).pcb_board.list()[0];
+        const board = su12(internalCircuitJson).pcb_board.list()[0];
         if (!board || !board.center) return void 0;
         return { x: board.center.x, y: board.center.y };
       } catch (e) {
@@ -34065,7 +33687,7 @@ var CadViewerJscad = forwardRef3(
     }, [internalCircuitJson]);
     const pcbThickness = usePcbThickness(internalCircuitJson);
     const { stls: boardStls, loading } = useStlsFromGeom(boardGeom);
-    const cad_components = su13(internalCircuitJson).cad_component.list();
+    const cad_components = su12(internalCircuitJson).cad_component.list();
     return /* @__PURE__ */ jsxs5(
       CadViewerContainer,
       {
@@ -34119,12 +33741,12 @@ var CadViewerJscad = forwardRef3(
 );
 
 // src/CadViewerManifold.tsx
-import { su as su19 } from "@tscircuit/circuit-json-util";
+import { su as su18 } from "@tscircuit/circuit-json-util";
 import { useEffect as useEffect25, useMemo as useMemo22, useState as useState16 } from "react";
 import * as THREE35 from "three";
 
 // src/hooks/useManifoldBoardBuilder.ts
-import { su as su18 } from "@tscircuit/circuit-json-util";
+import { su as su17 } from "@tscircuit/circuit-json-util";
 import { useEffect as useEffect24, useMemo as useMemo21, useRef as useRef9, useState as useState15 } from "react";
 import * as THREE32 from "three";
 
@@ -34187,7 +33809,7 @@ function createManifoldBoard(Manifold, CrossSection, boardData, pcbThickness, ma
 }
 
 // src/utils/manifold/process-cutouts.ts
-import { su as su14 } from "@tscircuit/circuit-json-util";
+import { su as su13 } from "@tscircuit/circuit-json-util";
 
 // src/utils/pad-geoms.ts
 var RECT_PAD_SEGMENTS2 = 64;
@@ -34246,7 +33868,7 @@ var arePointsClockwise3 = (points) => {
 };
 function processCutoutsForManifold(Manifold, CrossSection, circuitJson, pcbThickness, manifoldInstancesForCleanup) {
   const cutoutOps = [];
-  const pcbCutouts = su14(circuitJson).pcb_cutout.list();
+  const pcbCutouts = su13(circuitJson).pcb_cutout.list();
   for (const cutout of pcbCutouts) {
     let cutoutOp;
     const cutoutHeight = pcbThickness * 1.5;
@@ -34341,7 +33963,7 @@ function processCutoutsForManifold(Manifold, CrossSection, circuitJson, pcbThick
 }
 
 // src/utils/manifold/process-non-plated-holes.ts
-import { su as su15 } from "@tscircuit/circuit-json-util";
+import { su as su14 } from "@tscircuit/circuit-json-util";
 
 // src/utils/hole-geoms.ts
 function createCircleHoleDrill({
@@ -34384,7 +34006,7 @@ function createPlatedHoleDrill({
 // src/utils/manifold/process-non-plated-holes.ts
 function processNonPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbThickness, manifoldInstancesForCleanup) {
   const nonPlatedHoleBoardDrills = [];
-  const pcbHoles = su15(circuitJson).pcb_hole.list();
+  const pcbHoles = su14(circuitJson).pcb_hole.list();
   const createPillOp = (width10, height10, depth) => {
     const pillOp = createRoundedRectPrism({
       Manifold,
@@ -34467,7 +34089,7 @@ function processNonPlatedHolesForManifold(Manifold, CrossSection, circuitJson, p
 }
 
 // src/utils/manifold/process-plated-holes.ts
-import { su as su16 } from "@tscircuit/circuit-json-util";
+import { su as su15 } from "@tscircuit/circuit-json-util";
 import * as THREE30 from "three";
 
 // src/utils/manifold-mesh-to-three-geometry.ts
@@ -34514,9 +34136,12 @@ var createEllipsePoints = (width10, height10, segments) => {
 };
 var COPPER_COLOR = new THREE30.Color(...colors.copper);
 var PLATED_HOLE_LIP_HEIGHT = 0.05;
+var PLATED_HOLE_PAD_THICKNESS = 3e-3;
+var PLATED_HOLE_SURFACE_CLEARANCE = 5e-4;
+var PLATED_HOLE_FILL_CLEARANCE = 4e-3;
 function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbThickness, manifoldInstancesForCleanup, boardClipVolume) {
   const platedHoleBoardDrills = [];
-  const pcbPlatedHoles = su16(circuitJson).pcb_plated_hole.list();
+  const pcbPlatedHoles = su15(circuitJson).pcb_plated_hole.list();
   const platedHoleCopperGeoms = [];
   const platedHoleCopperOpsForSubtract = [];
   const createPillOp = (width10, height10, depth) => {
@@ -34733,7 +34358,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
       const padWidth = ph.rect_pad_width;
       const padHeight = ph.rect_pad_height;
       const rectBorderRadius = extractRectBorderRadius(ph);
-      const padThickness = DEFAULT_SMT_PAD_THICKNESS;
+      const padThickness = PLATED_HOLE_PAD_THICKNESS;
       const drillW = holeW + 2 * MANIFOLD_Z_OFFSET;
       const drillH = holeH + 2 * MANIFOLD_Z_OFFSET;
       const drillDepth = pcbThickness * 1.2;
@@ -34753,8 +34378,11 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
         Manifold,
         width: padWidth,
         height: padHeight,
-        thickness: pcbThickness - 2 * padThickness - 2 * BOARD_SURFACE_OFFSET.copper + 0.1,
-        // Fill between pads
+        thickness: Math.max(
+          pcbThickness - 2 * (padThickness + PLATED_HOLE_SURFACE_CLEARANCE + PLATED_HOLE_FILL_CLEARANCE),
+          M
+        ),
+        // Fill between pads (recessed from board surfaces)
         borderRadius: rectBorderRadius
       });
       manifoldInstancesForCleanup.push(mainFill);
@@ -34764,20 +34392,28 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
         height: padHeight,
         thickness: padThickness,
         borderRadius: rectBorderRadius
-      }).translate([0, 0, pcbThickness / 2 / 2 + BOARD_SURFACE_OFFSET.copper]);
+      }).translate([
+        0,
+        0,
+        pcbThickness / 2 + PLATED_HOLE_SURFACE_CLEARANCE + padThickness / 2
+      ]);
       const bottomPad = createRoundedRectPrism({
         Manifold,
         width: padWidth,
         height: padHeight,
         thickness: padThickness,
         borderRadius: rectBorderRadius
-      }).translate([0, 0, -pcbThickness / 2 / 2 - BOARD_SURFACE_OFFSET.copper]);
+      }).translate([
+        0,
+        0,
+        -pcbThickness / 2 - PLATED_HOLE_SURFACE_CLEARANCE - padThickness / 2
+      ]);
       manifoldInstancesForCleanup.push(topPad, bottomPad);
       const barrelPill = createPillOp(
         holeW,
         holeH,
-        pcbThickness * 1.02
-        // Slightly taller than board
+        pcbThickness * 0.8
+        // Slightly shorter than board
       ).translate([holeOffsetX, holeOffsetY, 0]);
       manifoldInstancesForCleanup.push(barrelPill);
       const copperUnion = Manifold.union([
@@ -34825,7 +34461,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
       const padWidth = ph.rect_pad_width;
       const padHeight = ph.rect_pad_height;
       const rectBorderRadius = extractRectBorderRadius(ph);
-      const padThickness = DEFAULT_SMT_PAD_THICKNESS;
+      const padThickness = PLATED_HOLE_PAD_THICKNESS;
       const drillW = holeW + 2 * MANIFOLD_Z_OFFSET;
       const drillH = holeH + 2 * MANIFOLD_Z_OFFSET;
       const drillDepth = pcbThickness * 1.2;
@@ -34852,8 +34488,11 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
         Manifold,
         width: padWidth,
         height: padHeight,
-        thickness: pcbThickness - 2 * padThickness - 2 * BOARD_SURFACE_OFFSET.copper + 0.1,
-        // Fill between pads
+        thickness: Math.max(
+          pcbThickness - 2 * (padThickness + PLATED_HOLE_SURFACE_CLEARANCE + PLATED_HOLE_FILL_CLEARANCE),
+          M
+        ),
+        // Fill between pads (recessed from board surfaces)
         borderRadius: rectBorderRadius
       });
       manifoldInstancesForCleanup.push(mainFill);
@@ -34868,7 +34507,11 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
         height: padHeight,
         thickness: padThickness,
         borderRadius: rectBorderRadius
-      }).translate([0, 0, pcbThickness / 2 / 2 + BOARD_SURFACE_OFFSET.copper]);
+      }).translate([
+        0,
+        0,
+        pcbThickness / 2 + PLATED_HOLE_SURFACE_CLEARANCE + padThickness / 2
+      ]);
       if (ph.rect_ccw_rotation) {
         const rotatedTopPad = topPad.rotate([0, 0, ph.rect_ccw_rotation]);
         manifoldInstancesForCleanup.push(rotatedTopPad);
@@ -34880,7 +34523,11 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
         height: padHeight,
         thickness: padThickness,
         borderRadius: rectBorderRadius
-      }).translate([0, 0, -pcbThickness / 2 / 2 - BOARD_SURFACE_OFFSET.copper]);
+      }).translate([
+        0,
+        0,
+        -pcbThickness / 2 - PLATED_HOLE_SURFACE_CLEARANCE - padThickness / 2
+      ]);
       if (ph.rect_ccw_rotation) {
         const rotatedBottomPad = bottomPad.rotate([0, 0, ph.rect_ccw_rotation]);
         manifoldInstancesForCleanup.push(rotatedBottomPad);
@@ -34890,7 +34537,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
       let barrelPill = createPillOp(
         holeW,
         holeH,
-        pcbThickness * 1.02
+        pcbThickness * 0.8
         // Slightly taller than board
       ).translate([holeOffsetX, holeOffsetY, 0]);
       if (ph.hole_ccw_rotation) {
@@ -34952,9 +34599,9 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
       const translatedBoardHole = boardHoleOp.translate([ph.x, ph.y, 0]);
       manifoldInstancesForCleanup.push(translatedBoardHole);
       platedHoleBoardDrills.push(translatedBoardHole);
-      const padThickness = DEFAULT_SMT_PAD_THICKNESS;
+      const padThickness = PLATED_HOLE_PAD_THICKNESS;
       const fillThickness = Math.max(
-        pcbThickness - 2 * padThickness - 2 * BOARD_SURFACE_OFFSET.copper + 0.1,
+        pcbThickness - 2 * (padThickness + PLATED_HOLE_SURFACE_CLEARANCE + PLATED_HOLE_FILL_CLEARANCE),
         M
       );
       const mainFill = createPolygonPadOp({
@@ -34970,12 +34617,12 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
       const topTranslated = topPad.translate([
         0,
         0,
-        pcbThickness / 2 / 2 + BOARD_SURFACE_OFFSET.copper
+        pcbThickness / 2 + PLATED_HOLE_SURFACE_CLEARANCE + padThickness / 2
       ]);
       const bottomTranslated = bottomPad.translate([
         0,
         0,
-        -pcbThickness / 2 / 2 - BOARD_SURFACE_OFFSET.copper
+        -pcbThickness / 2 - PLATED_HOLE_SURFACE_CLEARANCE - padThickness / 2
       ]);
       manifoldInstancesForCleanup.push(topTranslated, bottomTranslated);
       const barrelOp = createHoleOpForPolygonPad({
@@ -34985,7 +34632,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
       if (!barrelOp) return;
       const holeCutOp = createHoleOpForPolygonPad({
         ph,
-        depth: pcbThickness * 1.2,
+        depth: pcbThickness * 0.8,
         sizeDelta: -2 * M
       }) || barrelOp;
       const copperUnion = Manifold.union([
@@ -35135,14 +34782,17 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
       const padWidth = ph.rect_pad_width ?? ph.hole_diameter;
       const padHeight = ph.rect_pad_height ?? ph.hole_diameter;
       const rectBorderRadius = extractRectBorderRadius(ph);
-      const padThickness = DEFAULT_SMT_PAD_THICKNESS;
+      const padThickness = PLATED_HOLE_PAD_THICKNESS;
       const holeRadius = ph.hole_diameter / 2;
       const mainFill = createRoundedRectPrism({
         Manifold,
         width: padWidth,
         height: padHeight,
-        thickness: pcbThickness - 2 * padThickness - 2 * BOARD_SURFACE_OFFSET.copper + 0.1,
-        // Fill between pads
+        thickness: Math.max(
+          pcbThickness - 2 * (padThickness + PLATED_HOLE_SURFACE_CLEARANCE + PLATED_HOLE_FILL_CLEARANCE),
+          M
+        ),
+        // Fill between pads (recessed from board surfaces)
         borderRadius: rectBorderRadius
       });
       manifoldInstancesForCleanup.push(mainFill);
@@ -35152,17 +34802,25 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
         height: padHeight,
         thickness: padThickness,
         borderRadius: rectBorderRadius
-      }).translate([0, 0, pcbThickness / 2 / 2 + BOARD_SURFACE_OFFSET.copper]);
+      }).translate([
+        0,
+        0,
+        pcbThickness / 2 + PLATED_HOLE_SURFACE_CLEARANCE + padThickness / 2
+      ]);
       const bottomPad = createRoundedRectPrism({
         Manifold,
         width: padWidth,
         height: padHeight,
         thickness: padThickness,
         borderRadius: rectBorderRadius
-      }).translate([0, 0, -pcbThickness / 2 / 2 - BOARD_SURFACE_OFFSET.copper]);
+      }).translate([
+        0,
+        0,
+        -pcbThickness / 2 - PLATED_HOLE_SURFACE_CLEARANCE - padThickness / 2
+      ]);
       manifoldInstancesForCleanup.push(topPad, bottomPad);
       const barrelCylinder = Manifold.cylinder(
-        pcbThickness * 1.02,
+        pcbThickness * 0.8,
         // Slightly taller than board
         holeRadius,
         holeRadius,
@@ -35217,7 +34875,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
 }
 
 // src/utils/manifold/process-vias.ts
-import { su as su17 } from "@tscircuit/circuit-json-util";
+import { su as su16 } from "@tscircuit/circuit-json-util";
 import * as THREE31 from "three";
 
 // src/utils/via-geoms.ts
@@ -35274,7 +34932,7 @@ function createViaCopper2({
 var COPPER_COLOR2 = new THREE31.Color(...colors.copper);
 function processViasForManifold(Manifold, circuitJson, pcbThickness, manifoldInstancesForCleanup, boardClipVolume) {
   const viaBoardDrills = [];
-  const pcbVias = su17(circuitJson).pcb_via.list();
+  const pcbVias = su16(circuitJson).pcb_via.list();
   const viaCopperGeoms = [];
   pcbVias.forEach((via, index2) => {
     if (typeof via.hole_diameter === "number") {
@@ -35333,7 +34991,7 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson, visibility) => {
     const panels = circuitJson.filter(
       (e) => e.type === "pcb_panel"
     );
-    const boards = su18(circuitJson).pcb_board.list();
+    const boards = su17(circuitJson).pcb_board.list();
     if (panels.length > 0) {
       const panel = panels[0];
       const firstBoardInPanel = boards.find(
@@ -35354,7 +35012,7 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson, visibility) => {
     return boardsNotInPanel.length > 0 ? boardsNotInPanel[0] : null;
   }, [circuitJson]);
   const isFauxBoard = useMemo21(() => {
-    const boards = su18(circuitJson).pcb_board.list();
+    const boards = su17(circuitJson).pcb_board.list();
     return boards.length > 0 && boards[0].pcb_board_id === "faux-board";
   }, [circuitJson]);
   const traceTextureResolution = useMemo21(() => {
@@ -35589,7 +35247,10 @@ var createBoardMaterial = ({
       clearcoat: 0,
       transparent: isFaux,
       opacity: isFaux ? FAUX_BOARD_OPACITY : 1,
-      flatShading: true
+      flatShading: true,
+      polygonOffset: true,
+      polygonOffsetFactor: 1,
+      polygonOffsetUnits: 1
     });
   }
   return new THREE33.MeshStandardMaterial({
@@ -35599,7 +35260,10 @@ var createBoardMaterial = ({
     metalness: 0.1,
     roughness: 0.8,
     transparent: true,
-    opacity: isFaux ? FAUX_BOARD_OPACITY : 0.9
+    opacity: isFaux ? FAUX_BOARD_OPACITY : 0.9,
+    polygonOffset: true,
+    polygonOffsetFactor: 1,
+    polygonOffsetUnits: 1
   });
 };
 
@@ -35628,11 +35292,8 @@ function createGeometryMeshes(geoms) {
           new THREE34.MeshStandardMaterial({
             color: comp.color,
             side: THREE34.DoubleSide,
-            flatShading: true,
+            flatShading: true
             // Consistent with board
-            polygonOffset: true,
-            polygonOffsetFactor: -1,
-            polygonOffsetUnits: -1
           })
         );
         mesh.name = comp.key;
@@ -35809,7 +35470,7 @@ try {
     [textures, boardData, pcbThickness, isFauxBoard]
   );
   const cadComponents = useMemo22(
-    () => su19(circuitJson).cad_component.list(),
+    () => su18(circuitJson).cad_component.list(),
     [circuitJson]
   );
   const boardDimensions = useMemo22(() => {
@@ -42823,7 +42484,7 @@ var CadViewer = (props) => {
 
 // src/convert-circuit-json-to-3d-svg.ts
 var import_debug = __toESM(require_browser(), 1);
-import { su as su20 } from "@tscircuit/circuit-json-util";
+import { su as su19 } from "@tscircuit/circuit-json-util";
 import * as THREE40 from "three";
 import { SVGRenderer } from "three/examples/jsm/renderers/SVGRenderer.js";
 
@@ -43052,11 +42713,11 @@ async function convertCircuitJsonTo3dSvg(circuitJson, options = {}) {
   const pointLight = new THREE40.PointLight(16777215, Math.PI / 4);
   pointLight.position.set(-10, -10, 10);
   scene.add(pointLight);
-  const components = su20(circuitJson).cad_component.list();
+  const components = su19(circuitJson).cad_component.list();
   for (const component of components) {
     await renderComponent(component, scene);
   }
-  const boardData = su20(circuitJson).pcb_board.list()[0];
+  const boardData = su19(circuitJson).pcb_board.list()[0];
   const boardGeom = createBoardGeomFromCircuitJson(circuitJson);
   if (boardGeom) {
     const solderMaskColor = colors.fr4SolderMaskGreen;