Add colored pencil/write, umbrella/twirl, car/drive, boat/sail, kite/fly, coin/spin, potion/bubble, popper/pop, fireworks/burst, gem/shine

Completes the 50 colored ones, 100 in the gallery.

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

gen/color/potion/bubble.js

@@ -0,0 +1,21 @@
+// round potion flask bubbling away, purple liquid sloshing, little puffs of vapor drifting out the top
+const{sin,cos,PI}=Math,T=2*PI
+export const frames=24,delay=70
+const LQ='#b197fc',LD='#9775fa',GL='#e7f5ff',VP='#e5dbff',LB='#fff9db'
+const flask=c=>{c.beginPath();c.moveTo(108,58);c.lineTo(108,104);c.arc(128,164,64,-PI/2-.32,-PI/2+.32,true);c.lineTo(148,104);c.lineTo(148,58);c.closePath()}
+export default(c,t)=>{
+  for(let k=0;k<3;k++){const p=(t+k/3)%1;c.fillStyle=VP;c.lineWidth=5;c.beginPath();c.arc(128+14*sin(p*T+k*2)+(k-1)*8,46-p*44,8+10*p,0,T);c.fill();c.stroke()}
+  c.lineWidth=7
+  flask(c);c.fillStyle=GL;c.fill()
+  c.save();flask(c);c.clip()
+  const lv=x=>132+5*sin(x/18-t*T*2)
+  c.fillStyle=LQ;c.beginPath();c.moveTo(40,250);for(let x=40;x<=216;x+=4)c.lineTo(x,lv(x));c.lineTo(216,250);c.fill();c.lineWidth=5;c.stroke()
+  c.fillStyle=LD;c.beginPath();c.ellipse(150,200,40,22,-.3,0,T);c.fill()
+  c.fillStyle='#fff';c.lineWidth=4
+  for(const[x0,o,r]of[[104,0,7],[140,.3,5],[124,.6,9],[160,.8,6],[92,.45,4]]){const p=(t*1.5+o)%1,y=212-p*(212-lv(x0)),s=r*(p<.9?1:(1-p)*10);if(s>.5)c.beginPath(),c.arc(x0+4*sin(p*T*2+o*9),y,s,0,T),c.fill(),c.stroke()}
+  c.restore();c.lineWidth=7;flask(c);c.stroke()
+  c.fillStyle=LB;c.beginPath();c.roundRect(102,144,52,40,6);c.fill();c.lineWidth=5;c.stroke()
+  c.fillStyle='#ff6b6b';c.beginPath();c.moveTo(128,176);c.bezierCurveTo(112,166,116,152,128,160);c.bezierCurveTo(140,152,144,166,128,176);c.fill();c.lineWidth=4;c.stroke()
+  c.lineWidth=7;c.fillStyle=GL;c.beginPath();c.roundRect(100,52,56,12,6);c.fill();c.stroke()
+  c.strokeStyle='#fff';c.lineWidth=6;c.beginPath();c.arc(128,164,48,PI*1.12,PI*1.38);c.stroke()
+}