Hopf fibration rings, one family per pitch class, coloured by the circle of fifths (WebGL2, no dependencies)

Audio reactive Hopf fibration rings - fibres of S³ over S², stereographically projected so each one becomes a Villarceau circle of a torus, winding once the long way and once the short way. Distinct fibres are disjoint, so the rings link each other exactly once and never cross. Twelve families, one per pitch class, and a note's loudness sets its latitude on the base sphere, which is what fattens and brightens its ring. They're drawn as instanced polyline strokes with no vertex buffer at all — every point is computed analytically in the vertex shader from \`gl\_InstanceID\`. Blending is depth-tested "over" rather than additive, because additive saturates to a white blob the instant a drop lands. The colour is the key the music is in, not a palette. A chromagram picks local spectral peaks over 65–2100 Hz and folds them to pitch classes, and the key comes from correlating that against the Krumhansl-Kessler profiles across all 24 major/minor candidates. The hue is then just \`((7 \*…