index2.html: render stars as round dots, not squares

PointsMaterial draws each point as a square quad. Add a soft white
radial-gradient sprite as the material map so the points read as round
dots; depthWrite is disabled so the transparent corners don't clip
neighbouring stars. The sprite is white, so it still takes the
material's colour tint (cruise green / warp white).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

Author: ThomasWaldmann

index2.html

@@ -1261,8 +1261,23 @@ <h2>Trusted by sysadmins, hoarders and the merely paranoid.</h2>
   starPos.set([v.x, v.y, v.z], s * 3);
 }
 starGeo.setAttribute('position', new THREE.BufferAttribute(starPos, 3));
+// soft circular sprite so the points render as round dots instead of squares
+// (white, so it still takes the material's colour tint)
+const starSprite = (() => {
+  const sz = 64, c = document.createElement('canvas');
+  c.width = c.height = sz;
+  const ctx = c.getContext('2d');
+  const g = ctx.createRadialGradient(sz / 2, sz / 2, 0, sz / 2, sz / 2, sz / 2);
+  g.addColorStop(0.0, 'rgba(255,255,255,1)');
+  g.addColorStop(0.5, 'rgba(255,255,255,0.92)');
+  g.addColorStop(1.0, 'rgba(255,255,255,0)');
+  ctx.fillStyle = g;
+  ctx.fillRect(0, 0, sz, sz);
+  return new THREE.CanvasTexture(c);
+})();
 const stars = new THREE.Points(starGeo, new THREE.PointsMaterial({
-  color: 0x7fdb91, size: 0.45, sizeAttenuation: true, transparent: true, opacity: 0.7
+  color: 0x7fdb91, size: 0.45, sizeAttenuation: true, transparent: true, opacity: 0.7,
+  map: starSprite, depthWrite: false
 }));
 scene.add(stars);