asciify-engine 4.18.0 → 4.19.0

package/README.md

@@ -646,6 +646,15 @@ const field = mountGlyphField(canvas, {
 
 It needs WebGL2 on a GPU: `isGlyphFieldSupported()` is false without it or on software WebGL, and slow devices step down to 1× pixels and then still ambient motion. Keep a poster or the `/studio` renderer as the fallback. A still field stops drawing once its wake settles. Measured in Playwright Chromium on an Apple M4 Pro at 1440 × 900 and device pixel ratio 2, a full-viewport field held 120 fps (9 ms 95th-percentile frame) under continuous pointer movement; measure your own targets. See the [field guide](skills/asciify-engine/references/glyph-field.md) and [brand field example](examples/glyph-field.ts). It is a separate entry: the root, `/core`, `/hover` and `/studio` never load it.
 
+## 4.19: a curated set of premium backgrounds
+
+- New presets `halo`, `ripple`, `mesh`, `interference`, `constellation` and `cascade`; `caustics`, `contour` and `aurora` are rebuilt on the GPU. All follow `setGlobalLook`, keep a quiet zone behind content and hold a still frame under reduced motion.
+- `cursor: false` turns pointer interaction off for every preset. `mark: 'glyph' | 'dot'` draws any preset in characters or dots; `swell` keeps dots by default.
+- Dated presets (`dna`, `circuit`, `fire`, `grid`, `morph`, `noise`, `pulse`, `rain`, `silk`, `stars`, `terrain`, `veil`, `void`, `wave`, `weave`, `dune`, `etch`, `facet`, `moire`, `halftone`) stay exported but are deprecated; the kit reference names the closest current preset for each.
+- Switching presets no longer leaves the previous preset's poster covering the new one.
+- `pageDissolve` draws its settled blocks in one masked pass and snapshots at 1x on touch devices, so the wave stays light on phones.
+- The skill's `looks.md` now covers 47 artwork looks, every render style, plus composed (blur, transparent, gradient) and finished (vignette, grain, bloom, scanlines) looks.
+
 ## 4.18: 24 render styles in every live field, artwork looks, smoother components
 
 - Glyph fields draw the Studio's tile and print styles: `mark` accepts `pixel`, `mosaic`, `lego`, `voxel`, `disco`, `dither`, `hex`, `led`, `cmyk`, `stipple`, `engraving`, `crosshatch`, `woodblock`, `risograph` and `pointillism` (see `FIELD_MARKS`), one shader branch each.

package/dist/field.cjs

@@ -1 +1 @@
-"use strict";var e=e=>e?"\nconst float VSCALE=6.;\nvec4 decodeFluid(vec4 t){return vec4((t.xy*2.-1.)*VSCALE,t.z,t.w);}\nvec4 encodeFluid(vec4 v){return vec4(clamp(v.xy/VSCALE*.5+.5,0.,1.),clamp(v.z,0.,1.),1.);}":"\nvec4 decodeFluid(vec4 t){return t;}\nvec4 encodeFluid(vec4 v){return vec4(v.xyz,1.);}",t="#version 300 es\nprecision highp float;\nprecision highp sampler2D;\nuniform vec2 uTexel;\nout vec4 outColor;\nvec2 here(){return gl_FragCoord.xy*uTexel;}\n",n=t+"\nuniform sampler2D uVelocity;\nuniform vec2 uFrom, uTo, uForce;\nuniform float uAspect, uRadius;\nfloat segment(vec2 p,vec2 a,vec2 b){vec2 pa=p-a,ba=b-a;float h=clamp(dot(pa,ba)/max(dot(ba,ba),1e-8),0.,1.);return length(pa-ba*h);}\nvoid main(){\n  vec2 uv=here(),scale=vec2(uAspect,1.);\n  float d=segment(uv*scale,uFrom*scale,uTo*scale);\n  outColor=vec4(texture(uVelocity,uv).xy+uForce*exp(-d*d/(uRadius*uRadius)),0.,1.);\n}",r=t+"\nuniform sampler2D uVelocity;\nvoid main(){\n  vec2 uv=here();\n  float l=texture(uVelocity,uv-vec2(uTexel.x,0.)).y,r=texture(uVelocity,uv+vec2(uTexel.x,0.)).y;\n  float t=texture(uVelocity,uv+vec2(0.,uTexel.y)).x,b=texture(uVelocity,uv-vec2(0.,uTexel.y)).x;\n  outColor=vec4(.5*(r-l-t+b),0.,0.,1.);\n}",i=t+"\nuniform sampler2D uVelocity, uCurl;\nuniform float uStrength, uDt;\nvoid main(){\n  vec2 uv=here();\n  float l=texture(uCurl,uv-vec2(uTexel.x,0.)).x,r=texture(uCurl,uv+vec2(uTexel.x,0.)).x;\n  float t=texture(uCurl,uv+vec2(0.,uTexel.y)).x,b=texture(uCurl,uv-vec2(0.,uTexel.y)).x,c=texture(uCurl,uv).x;\n  vec2 force=.5*vec2(abs(t)-abs(b),abs(r)-abs(l));\n  force=force/(length(force)+1e-4)*uStrength*c;\n  force.y=-force.y;\n  outColor=vec4(clamp(texture(uVelocity,uv).xy+force*uDt,-1000.,1000.),0.,1.);\n}",o=t+"\nuniform sampler2D uVelocity;\nvoid main(){\n  vec2 uv=here(),c=texture(uVelocity,uv).xy;\n  float l=texture(uVelocity,uv-vec2(uTexel.x,0.)).x,r=texture(uVelocity,uv+vec2(uTexel.x,0.)).x;\n  float t=texture(uVelocity,uv+vec2(0.,uTexel.y)).y,b=texture(uVelocity,uv-vec2(0.,uTexel.y)).y;\n  if(uv.x-uTexel.x<0.)l=-c.x;\n  if(uv.x+uTexel.x>1.)r=-c.x;\n  if(uv.y+uTexel.y>1.)t=-c.y;\n  if(uv.y-uTexel.y<0.)b=-c.y;\n  outColor=vec4(.5*(r-l+t-b),0.,0.,1.);\n}",a=t+"\nuniform sampler2D uSource;\nuniform float uAmount;\nvoid main(){outColor=vec4(texture(uSource,here()).x*uAmount,0.,0.,1.);}",l=t+"\nuniform sampler2D uPressure, uDivergence;\nvoid main(){\n  vec2 uv=here();\n  float l=texture(uPressure,uv-vec2(uTexel.x,0.)).x,r=texture(uPressure,uv+vec2(uTexel.x,0.)).x;\n  float t=texture(uPressure,uv+vec2(0.,uTexel.y)).x,b=texture(uPressure,uv-vec2(0.,uTexel.y)).x;\n  outColor=vec4((l+r+b+t-texture(uDivergence,uv).x)*.25,0.,0.,1.);\n}",u=t+"\nuniform sampler2D uPressure, uVelocity;\nvoid main(){\n  vec2 uv=here();\n  float l=texture(uPressure,uv-vec2(uTexel.x,0.)).x,r=texture(uPressure,uv+vec2(uTexel.x,0.)).x;\n  float t=texture(uPressure,uv+vec2(0.,uTexel.y)).x,b=texture(uPressure,uv-vec2(0.,uTexel.y)).x;\n  outColor=vec4(texture(uVelocity,uv).xy-vec2(r-l,t-b),0.,1.);\n}",s=t+"\nuniform sampler2D uVelocity;\nuniform float uDt, uDissipation;\nvoid main(){\n  vec2 uv=here();\n  vec2 back=uv-uDt*texture(uVelocity,uv).xy*uTexel;\n  outColor=vec4(texture(uVelocity,back).xy/(1.+uDissipation*uDt),0.,1.);\n}";var c=class{constructor(e,t){this.previous=null,this.peak=0,this.width=e,this.height=t;const n=e*t;this.pixels=new Uint8Array(4*n),this.signal=new Float32Array(n),this.offsetX=new Float32Array(n),this.offsetY=new Float32Array(n),this.driftX=new Float32Array(n),this.driftY=new Float32Array(n),this.u=new Float32Array(n),this.v=new Float32Array(n),this.ink=new Float32Array(n),this.a=new Float32Array(n),this.b=new Float32Array(n),this.c=new Float32Array(n),this.pressure=new Float32Array(n),this.pressureNext=new Float32Array(n),this.divergence=new Float32Array(n),this.curl=new Float32Array(n)}get active(){return this.peak>2e-4}clear(){for(const e of[this.u,this.v,this.ink,this.a,this.b,this.c,this.pressure,this.pressureNext,this.divergence,this.curl,this.signal,this.pixels,this.offsetX,this.offsetY,this.driftX,this.driftY])e.fill(0);this.previous=null,this.peak=0}leave(){this.previous=null}move(e,t,n,r=performance.now()){if(!Number.isFinite(e+t+n+r))return;e=Math.max(0,Math.min(1,e)),t=Math.max(0,Math.min(1,t)),n=Math.max(.1,Math.min(1,n));const i=this.previous;if(this.previous={x:e,y:t,time:r},!i)return;const o=(e-i.x)*(this.width-1),a=(t-i.y)*(this.height-1),l=Math.hypot(o,a);if(l<.001)return;const u=Math.min(this.width,this.height),s=r>i.time?Math.max(1/240,(r-i.time)/1e3):1/60,c=Math.min(12,l/u/s),h=1-Math.exp(-c/2.2),f=u*(.022+.075*n)*(.65+.95*h),d=Math.min(128,Math.max(1,Math.ceil(l/(.4*f)))),m=l/f*(.32+.22*h)/d,v=o/l,g=a/l,p=-g,x=v,E=l*(2+18*h)/d;for(let n=0;n<d;n++){const r=(n+.5)/d,o=(i.x+(e-i.x)*r)*(this.width-1),a=(i.y+(t-i.y)*r)*(this.height-1),l=Math.max(1,Math.floor(o-3*f)),u=Math.min(this.width-2,Math.ceil(o+3*f)),s=Math.max(1,Math.floor(a-3*f)),c=Math.min(this.height-2,Math.ceil(a+3*f));for(let e=s;e<=c;e++)for(let t=l;t<=u;t++){const n=((t-o)*v+(e-a)*g)/f,r=((t-o)*p+(e-a)*x)/f,i=Math.exp(-n*n*.65-r*r*1.7),l=e*this.width+t;this.ink[l]=1-(1-this.ink[l])*Math.exp(-i*m);const u=1-r*r*.55,s=n*r*.7;this.u[l]=Math.max(-80,Math.min(80,this.u[l]+(v*u+p*s)*i*E)),this.v[l]=Math.max(-80,Math.min(80,this.v[l]+(g*u+x*s)*i*E))}}this.peak=1}read(e,t,n){const r=0|(t=Math.max(.5,Math.min(this.width-1.5,t))),i=0|(n=Math.max(.5,Math.min(this.height-1.5,n))),o=t-r,a=n-i,l=i*this.width+r;return(e[l]*(1-o)+e[l+1]*o)*(1-a)+(e[l+this.width]*(1-o)+e[l+this.width+1]*o)*a}sample(e,t){return this.read(this.signal,e*(this.width-1),t*(this.height-1))}displacement(e,t,n){n[0]=this.read(this.offsetX,e*(this.width-1),t*(this.height-1)),n[1]=this.read(this.offsetY,e*(this.width-1),t*(this.height-1))}step(e){if(!this.active||!Number.isFinite(e))return;let t=Math.max(0,Math.min(.05,e));const n=this.width,r=this.height;for(;t>1e-7;){const e=Math.min(1/60,t);t-=e;const i=Math.exp(-1.9*e),o=Math.exp(-3.2*e);for(let t=1;t<r-1;t++)for(let a=1;a<n-1;a++){const l=t*n+a,u=Math.max(.5,Math.min(n-1.5,a-this.u[l]*e)),s=Math.max(.5,Math.min(r-1.5,t-this.v[l]*e)),c=0|u,h=0|s,f=u-c,d=s-h,m=h*n+c,v=(1-f)*(1-d),g=f*(1-d),p=(1-f)*d,x=f*d;this.a[l]=(this.u[m]*v+this.u[m+1]*g+this.u[m+n]*p+this.u[m+n+1]*x)*i,this.b[l]=(this.v[m]*v+this.v[m+1]*g+this.v[m+n]*p+this.v[m+n+1]*x)*i,this.c[l]=(this.ink[m]*v+this.ink[m+1]*g+this.ink[m+n]*p+this.ink[m+n+1]*x)*o}[this.u,this.a]=[this.a,this.u],[this.v,this.b]=[this.b,this.v],[this.ink,this.c]=[this.c,this.ink];for(let e=1;e<r-1;e++)for(let t=1;t<n-1;t++){const r=e*n+t;this.curl[r]=.5*(this.v[r+1]-this.v[r-1]-this.u[r+n]+this.u[r-n])}for(let t=1;t<r-1;t++)for(let r=1;r<n-1;r++){const i=t*n+r,o=Math.abs(this.curl[i+1])-Math.abs(this.curl[i-1]),a=Math.abs(this.curl[i+n])-Math.abs(this.curl[i-n]),l=Math.hypot(o,a)+1e-4,u=this.curl[i]*e*10,s=Math.hypot(this.u[i],this.v[i]);this.u[i]+=a/l*u,this.v[i]-=o/l*u;const c=Math.min(1,s/(Math.hypot(this.u[i],this.v[i])+1e-6));this.u[i]*=c,this.v[i]*=c,this.divergence[i]=-.5*(this.u[i+1]-this.u[i-1]+this.v[i+n]-this.v[i-n])}this.pressure.fill(0);for(let e=0;e<4;e++){for(let e=1;e<r-1;e++)for(let t=1;t<n-1;t++){const r=e*n+t;this.pressureNext[r]=.25*(this.divergence[r]+this.pressure[r-1]+this.pressure[r+1]+this.pressure[r-n]+this.pressure[r+n])}[this.pressure,this.pressureNext]=[this.pressureNext,this.pressure]}let a=0;for(let t=1;t<r-1;t++)for(let r=1;r<n-1;r++){const i=t*n+r;this.u[i]=Math.max(-80,Math.min(80,this.u[i]-.5*(this.pressure[i+1]-this.pressure[i-1]))),this.v[i]=Math.max(-80,Math.min(80,this.v[i]-.5*(this.pressure[i+n]-this.pressure[i-n]))),this.driftX[i]+=(3.6*this.u[i]-58*this.offsetX[i]-12*this.driftX[i])*e,this.driftY[i]+=(3.6*this.v[i]-58*this.offsetY[i]-12*this.driftY[i])*e,this.offsetX[i]=Math.max(-2,Math.min(2,this.offsetX[i]+this.driftX[i]*e)),this.offsetY[i]=Math.max(-2,Math.min(2,this.offsetY[i]+this.driftY[i]*e)),this.signal[i]=1-Math.exp(.06*-Math.hypot(this.u[i],this.v[i])-.16*this.ink[i]),a=Math.max(a,this.signal[i])}this.peak=a}if(this.active)for(let e=0;e<this.ink.length;e++){const t=Math.round(65535*Math.min(1,this.signal[e]));this.pixels[4*e]=t>>>8,this.pixels[4*e+1]=255&t,this.pixels[4*e+2]=Math.round(128+63.5*this.offsetX[e]),this.pixels[4*e+3]=Math.round(128+63.5*this.offsetY[e])}else this.clear()}},h=["glyph","dot","pixel","mosaic","lego","voxel","disco","dither","hex","led","cmyk","stipple","engraving","crosshatch","woodblock","risograph","pointillism"],f={radius:.13,strength:.5,trail:.45,follow:12},d={strength:.55,radius:.45},m={radius:.075,force:1,dissipation:1.6,refraction:.03,glow:.55,resolution:128,curl:24},v={charset:" .,:-=+*#%@",cellSize:12,cellAspect:1,cellFit:"pixel",font:'ui-monospace, "SF Mono", Menlo, Consolas, monospace',fontWeight:500,glyphScale:.8,mark:"glyph",dotScale:.9,color:"ink",ink:"#f3ba32",highlight:"auto",background:"transparent",brightness:0,contrast:1,gamma:1,invert:!1,levels:"auto",blend:"auto",saturation:1.1,shade:.5,backdrop:0,fit:"cover",focus:{x:.5,y:.5},vignette:0,drift:0,scene:"flow",scale:1,clear:!1,speed:1,hover:"fluid",fluid:m,lantern:f,trail:d,maxPixelRatio:2,respectReducedMotion:!0},g=(e,t,n,r)=>"number"==typeof e&&Number.isFinite(e)?Math.min(n,Math.max(t,e)):r,p=(e,t)=>"string"==typeof e&&/^#([\da-f]{3}|[\da-f]{6})$/i.test(e.trim())?e.trim().toLowerCase():t;function x(e){const t=Intl.Segmenter;return(t?Array.from(new t(void 0,{granularity:"grapheme"}).segment(e),e=>e.segment):Array.from(e)).filter(e=>"\n"!==e&&"\r"!==e&&"\t"!==e).slice(0,256)}function E(e={},t=v){const n="string"==typeof e.charset&&x(e.charset).length>=2?e.charset:t.charset,r=t.fluid||m,i=void 0===e.fluid?t.fluid:e.fluid,o=!1!==i&&(()=>{const e=!0!==i&&i?{...r,...i}:r;return{radius:g(e.radius,.005,.5,m.radius),force:g(e.force,0,8,m.force),dissipation:g(e.dissipation,.05,20,m.dissipation),refraction:g(e.refraction,0,.5,m.refraction),glow:g(e.glow,0,2,m.glow),resolution:Math.round(g(e.resolution,16,512,m.resolution)),curl:g(e.curl,0,80,m.curl)}})(),a="none"===e.scene||"flow"===e.scene||"orb"===e.scene||"drift"===e.scene||"swell"===e.scene?e.scene:t.scene,l=!!e.clear&&"object"==typeof e.clear&&("element"in e.clear||"nodeType"in e.clear),u=void 0===e.clear||l?t.clear:e.clear,s=!!u&&{x:g(u.x,-.5,1.5,.25),y:g(u.y,-.5,1.5,.3),width:g(u.width,0,2,.5),height:g(u.height,0,2,.4),feather:g(u.feather,.005,1,.12),shape:"rect"===u.shape?"rect":"ellipse"};return{charset:n,cellSize:g(e.cellSize,3,96,t.cellSize),cellAspect:g(e.cellAspect,.3,2,t.cellAspect),cellFit:"fill"===e.cellFit||"pixel"===e.cellFit?e.cellFit:t.cellFit,font:"string"==typeof e.font&&e.font.trim()?e.font:t.font,fontWeight:Math.round(g(e.fontWeight,100,900,t.fontWeight)),glyphScale:g(e.glyphScale,.3,1.6,t.glyphScale),mark:h.includes(e.mark)?e.mark:t.mark,dotScale:g(e.dotScale,.1,1.4,t.dotScale),color:"source"===e.color||"ink"===e.color?e.color:t.color,ink:p(e.ink,t.ink),highlight:"auto"===e.highlight?"auto":p(e.highlight,t.highlight),background:"transparent"===e.background?"transparent":p(e.background,t.background),brightness:g(e.brightness,-1,1,t.brightness),contrast:g(e.contrast,0,4,t.contrast),gamma:g(e.gamma,.2,5,t.gamma),invert:"boolean"==typeof e.invert?e.invert:t.invert,levels:"none"===e.levels||"auto"===e.levels?e.levels:t.levels,blend:"auto"===e.blend||"coarse"===e.blend||"on"===e.blend||"off"===e.blend?e.blend:t.blend,saturation:g(e.saturation,0,3,t.saturation),shade:g(e.shade,0,1,t.shade),backdrop:g(e.backdrop,0,1,t.backdrop),fit:"contain"===e.fit||"cover"===e.fit?e.fit:t.fit,focus:{x:g(e.focus?.x,0,1,t.focus.x),y:g(e.focus?.y,0,1,t.focus.y)},vignette:g(e.vignette,0,1,t.vignette),drift:g(e.drift,0,2,t.drift),scene:a,scale:g(e.scale,.2,6,t.scale),clear:s,speed:g(e.speed,0,5,t.speed),hover:"fluid"===e.hover||"lantern"===e.hover||"trail"===e.hover||"none"===e.hover?e.hover:t.hover,fluid:o,lantern:{radius:g(e.lantern?.radius,.02,.6,t.lantern.radius),strength:g(e.lantern?.strength,0,1.5,t.lantern.strength),trail:g(e.lantern?.trail,0,3,t.lantern.trail),follow:g(e.lantern?.follow,1,60,t.lantern.follow)},trail:{strength:g(e.trail?.strength,0,1,t.trail.strength),radius:g(e.trail?.radius,.1,1,t.trail.radius)},maxPixelRatio:g(e.maxPixelRatio,.5,4,t.maxPixelRatio),respectReducedMotion:"boolean"==typeof e.respectReducedMotion?e.respectReducedMotion:t.respectReducedMotion}}function y(e,t,n,r,i,o={x:.5,y:.5}){if(!(e>0&&t>0&&n>0&&r>0))return{scale:[1,1],offset:[0,0]};const a=e/t,l=n/r,u=l>a,s="cover"===i?u?[a/l,1]:[1,l/a]:u?[1,l/a]:[a/l,1];return{scale:s,offset:"cover"===i?[(1-s[0])*o.x,(1-s[1])*o.y]:[.5*(1-s[0]),.5*(1-s[1])]}}function b(e,t,n,r){const i=Math.max(2,Math.round(e*n)),o=Math.max(2,Math.round(i*t)),a=Math.min(16,Math.max(1,r)),l=Math.ceil(r/a);return{width:o,height:i,columns:a,rows:l,atlasWidth:a*o,atlasHeight:l*i}}function T(e){const t=e.replace("#",""),n=3===t.length?t.split("").map(e=>e+e).join(""):t,r=Number.parseInt(n,16);return Number.isFinite(r)&&6===n.length?[(r>>16&255)/255,(r>>8&255)/255,(255&r)/255]:[0,0,0]}function w(e){const t=new Uint32Array(256);let n=0;for(let r=0;r+3<e.length;r+=4)e[r+3]<8||(t[Math.round(.2126*e[r]+.7152*e[r+1]+.0722*e[r+2])]++,n++);if(!n)return[0,1];const r=e=>{let r=0;for(let i=0;i<256;i++)if(r+=t[i],r>=n*e)return i/255;return 1},i=r(.02),o=r(.98);return o-i<.08?[0,1]:[i,o]}var M=e=>"fluid"!==e.hover||e.fluid?e.hover:"none";function R(e,t,n=24,r=.12,i="ellipse"){return e.width>0&&e.height>0&&{x:(t.left-n-e.left)/e.width,y:(t.top-n-e.top)/e.height,width:(t.width+2*n)/e.width,height:(t.height+2*n)/e.height,feather:r,shape:i}}var F,A=/\.(mp4|webm|mov|m4v|ogv)(\?|#|$)/i,k=/swiftshader|llvmpipe|softpipe|software|basic render/i;function L(){if(F)return F;if("undefined"==typeof document||void 0===globalThis.WebGL2RenderingContext)return F="none";try{const e=document.createElement("canvas").getContext("webgl2");if(!e)return F="none";const t=e.getExtension("WEBGL_debug_renderer_info"),n=String(e.getParameter(t?t.UNMASKED_RENDERER_WEBGL:e.RENDERER)??"");return e.getExtension("WEBGL_lose_context")?.loseContext(),F=k.test(n)?"software":"gpu"}catch{return F="none"}}exports.DEFAULT_FIELD_FLUID=m,exports.DEFAULT_FIELD_LANTERN=f,exports.DEFAULT_FIELD_SETTINGS=v,exports.DEFAULT_FIELD_TRAIL=d,exports.FIELD_HOVERS=[{value:"fluid",label:"Fluid",description:"An ink-in-water wake that bends the image and swirls the characters."},{value:"lantern",label:"Lantern",description:"A soft light follows the pointer and lifts the characters it passes, without distortion."},{value:"trail",label:"Trail",description:"The Asciify Trail: in the wake, sparse characters fill in and dense ones open up, then settle. No distortion."},{value:"none",label:"Off",description:"The field stays still under the pointer."}],exports.FIELD_MARKS=h,exports.activeFieldHover=M,exports.fieldCellLayout=b,exports.fieldClearFromRects=R,exports.fieldGlyphs=x,exports.fieldLevels=w,exports.fieldSourceRect=y,exports.glyphFieldTier=L,exports.isGlyphFieldSupported=function(e={}){const t=L();return"gpu"===t||"software"===t&&!!e.allowSoftware},exports.mountGlyphField=function(t,f={}){const d=e=>"undefined"!=typeof HTMLElement&&e instanceof HTMLElement,m=e=>{const t=e.clear;return d(t)?{element:{element:t},rest:{...e,clear:void 0}}:t&&"object"==typeof t&&d(t.element)?{element:t,rest:{...e,clear:void 0}}:{element:null,rest:e}};let v=m(f).element,g=E(m(f).rest);const p=f.onError,F=t.getContext("webgl2",{alpha:!0,antialias:!1,depth:!1,stencil:!1,premultipliedAlpha:!0,powerPreference:"high-performance"});if(!F)throw new Error("WebGL2 is not available for the glyph field.");const k=F;t.setAttribute("role","img"),t.setAttribute("aria-label",f.label??"ASCII artwork"),t.dataset.renderer="glyph-field";let L=!1;const D=k.getExtension("KHR_parallel_shader_compile");let S,_,C=null,P=null,U=null,I=null,B=[],X=[],N=null,G=!1,H=null,V=null;const O=[];let z=0,q=0,W=1,Y=0,j=b(g.cellSize,g.cellAspect,1,2),K=2,$=0,J=0,Q=0,Z=null,ee=!1,te=null,ne=0,re=0,ie=0,oe=null,ae=0,le=!0,ue=0,se=[0,1],ce=-1/0,he=0,fe=0,de=0,me=!0,ve=!1,ge=!1,pe=!1,xe=!1,Ee=!0,ye=null,be=null,Te=1/60,we=0,Me=0,Re=[];const Fe=new Float32Array(16),Ae=()=>{if(!v)return;const{element:e,padding:n=32,feather:r=.16,shape:i="rect"}=v,o=R(t.getBoundingClientRect(),e.getBoundingClientRect(),n,r,i),a=g.clear;JSON.stringify(a)!==JSON.stringify(o)&&(g={...g,clear:o},me=!0)},ke={target:null,at:null,strength:0,trail:[]},Le=new Float32Array(36);let De=null,Se=null,_e=!1;const Ce=()=>{if(!z||!q)return null;const e=z/q,t=Math.round(e>=1?128:128*e),n=Math.round(e>=1?128/e:128);return De&&De.width===t&&De.height===n||(De=new c(t,n),Se||(Se=qe(k.LINEAR)),k.bindTexture(k.TEXTURE_2D,Se),k.texImage2D(k.TEXTURE_2D,0,k.RGBA8,t,n,0,k.RGBA,k.UNSIGNED_BYTE,De.pixels),_e=!0),De};let Pe=0;const Ue="function"==typeof matchMedia?matchMedia("(prefers-reduced-motion: reduce)"):null,Ie=()=>g.respectReducedMotion&&!!Ue?.matches;let Be;const Xe=new Promise(e=>{Be=e});let Ne=!0;const Ge=e=>p?.(e instanceof Error?e:new Error(String(e))),He=(e,t)=>{const n=k.createShader(e);return O.push(n),k.shaderSource(n,t),k.compileShader(n),n},Ve=e=>{V??(V=He(k.VERTEX_SHADER,"#version 300 es\nvoid main(){vec2 p=vec2((gl_VertexID<<1)&2,gl_VertexID&2);gl_Position=vec4(p*2.-1.,0.,1.);}"));const t=k.createProgram(),n=He(k.FRAGMENT_SHADER,e);return k.attachShader(t,V),k.attachShader(t,n),k.linkProgram(t),{program:t,locations:null,fragment:n}},Oe=(e,t=!1)=>{if(e.locations)return!0;const{program:n,fragment:r}=e;if(!t&&D&&!k.getProgramParameter(n,D.COMPLETION_STATUS_KHR))return!1;if(!k.getProgramParameter(n,k.LINK_STATUS)){if(k.isContextLost())return!1;throw new Error(k.getShaderInfoLog(r)||k.getProgramInfoLog(n)||"Glyph field program failed to link.")}const i={};for(let e=k.getProgramParameter(n,k.ACTIVE_UNIFORMS)-1;e>=0;e--){const t=k.getActiveUniform(n,e).name.replace(/\[0\]$/,"");i[t]=k.getUniformLocation(n,t)}return e.locations=i,!0},ze=(e=!1)=>!!C&&!!P&&Oe(C,e)&&Oe(P,e),qe=e=>{const t=k.createTexture();return k.bindTexture(k.TEXTURE_2D,t),k.texParameteri(k.TEXTURE_2D,k.TEXTURE_MIN_FILTER,e),k.texParameteri(k.TEXTURE_2D,k.TEXTURE_MAG_FILTER,e===k.LINEAR_MIPMAP_LINEAR?k.LINEAR:e),k.texParameteri(k.TEXTURE_2D,k.TEXTURE_WRAP_S,k.CLAMP_TO_EDGE),k.texParameteri(k.TEXTURE_2D,k.TEXTURE_WRAP_T,k.CLAMP_TO_EDGE),t},We=()=>{I&&(k.deleteTexture(I.ink),k.deleteTexture(I.under),k.deleteFramebuffer(I.buffer),I=null)},Ye=()=>function(e,t,n,r,i,o,a){if("fill"!==e||!(i>0&&o>0))return[a.width,a.height];const l=t*r,u=l*n;return[i/Math.max(1,Math.floor(i/u+1e-6)),o/Math.max(1,Math.floor(o/l+1e-6))]}(g.cellFit,g.cellSize,g.cellAspect,W,z,q,j),je=()=>!!g.fluid&&"fluid"===M(g),Ke=()=>{N?.release(),G=!1,B.forEach(e=>k.deleteTexture(e)),X.forEach(e=>k.deleteFramebuffer(e)),B=[],X=[]};function $e(){U&&k.deleteProgram(U.program),U=Ve((t=>`#version 300 es\nprecision highp float;\nprecision highp sampler2D;\nuniform sampler2D uPrevious;\nuniform vec2 uSize;\nuniform float uAspect, uDt, uDecay, uEnergyDecay, uRadius, uSplat;\nuniform vec2 uFrom, uTo, uForce;\nout vec4 outColor;\n${e(t)}\nfloat segment(vec2 p,vec2 a,vec2 b){vec2 pa=p-a,ba=b-a;float h=clamp(dot(pa,ba)/max(dot(ba,ba),1e-8),0.,1.);return length(pa-ba*h);}\nvoid main(){\n  vec2 uv=gl_FragCoord.xy/uSize;\n  vec4 here=decodeFluid(texture(uPrevious,uv));\n  vec4 state=decodeFluid(texture(uPrevious,uv-uDt*here.xy*vec2(1./uAspect,1.)));\n  state.xy*=exp(-uDt*uDecay);\n  state.z*=exp(-uDt*uEnergyDecay);\n  if(uSplat>.5){\n    vec2 scale=vec2(uAspect,1.);\n    float d=segment(uv*scale,uFrom*scale,uTo*scale);\n    float g=exp(-d*d/(uRadius*uRadius));\n    state.xy+=uForce*g;\n    state.z=min(1.,state.z+g*min(1.,length(uForce)*.5+.08));\n  }\n  float speed=length(state.xy);\n  if(speed>5.)state.xy*=5./speed;\n  outColor=encodeFluid(state);\n}`)(L)),N?.dispose(),N=L?null:function(e,t,c){const h={splat:t(n),curl:t(r),vorticity:t(i),divergence:t(o),fade:t(a),pressure:t(l),gradient:t(u),advect:t(s)},f=Object.values(h);let d=0,m=0,v=[],g=[],p=null,x=null;const E=t=>{const n=e.createTexture();e.bindTexture(e.TEXTURE_2D,n),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,t),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,t),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.texImage2D(e.TEXTURE_2D,0,e.RGBA16F,d,m,0,e.RGBA,e.HALF_FLOAT,null);const r=e.createFramebuffer();return e.bindFramebuffer(e.FRAMEBUFFER,r),e.framebufferTexture2D(e.FRAMEBUFFER,e.COLOR_ATTACHMENT0,e.TEXTURE_2D,n,0),e.checkFramebufferStatus(e.FRAMEBUFFER)!==e.FRAMEBUFFER_COMPLETE?(e.deleteFramebuffer(r),e.deleteTexture(n),null):(e.viewport(0,0,d,m),e.clearColor(0,0,0,1),e.clear(e.COLOR_BUFFER_BIT),{texture:n,buffer:r})},y=t=>{t&&(e.deleteTexture(t.texture),e.deleteFramebuffer(t.buffer))},b=()=>{[...v,...g,p,x].forEach(y),v=[],g=[],p=x=null},T=(t,n)=>{const r=t.locations;return e.useProgram(t.program),e.bindFramebuffer(e.FRAMEBUFFER,n.buffer),e.uniform2f(r.uTexel,1/d,1/m),r},w=(t,n,r,i)=>{e.activeTexture(e.TEXTURE0+r),e.bindTexture(e.TEXTURE_2D,i),e.uniform1i(t[n],r)},M=()=>e.drawArrays(e.TRIANGLES,0,3),R=e=>{const t=e[0];e[0]=e[1],e[1]=t};return{resize(t,n){b(),d=t,m=n;const r=[E(e.LINEAR),E(e.LINEAR),E(e.NEAREST),E(e.NEAREST),E(e.NEAREST),E(e.NEAREST)];return e.bindFramebuffer(e.FRAMEBUFFER,null),r.some(e=>!e)?(r.forEach(y),!1):(v=[r[0],r[1]],g=[r[2],r[3]],p=r[4],x=r[5],!0)},ready:()=>f.every(c),step(t,n){if(!v.length||!p||!x)return;let r;e.viewport(0,0,d,m),t&&(r=T(h.splat,v[1]),w(r,"uVelocity",0,v[0].texture),e.uniform2f(r.uFrom,t.from[0],t.from[1]),e.uniform2f(r.uTo,t.to[0],t.to[1]),e.uniform2f(r.uForce,t.force[0],t.force[1]),e.uniform1f(r.uAspect,n.aspect),e.uniform1f(r.uRadius,n.radius),M(),R(v)),n.curl>0&&(r=T(h.curl,x),w(r,"uVelocity",0,v[0].texture),M(),r=T(h.vorticity,v[1]),w(r,"uVelocity",0,v[0].texture),w(r,"uCurl",1,x.texture),e.uniform1f(r.uStrength,n.curl),e.uniform1f(r.uDt,n.dt),M(),R(v)),r=T(h.divergence,p),w(r,"uVelocity",0,v[0].texture),M(),r=T(h.fade,g[1]),w(r,"uSource",0,g[0].texture),e.uniform1f(r.uAmount,.8),M(),R(g);for(let e=0;e<20;e++)r=T(h.pressure,g[1]),w(r,"uPressure",0,g[0].texture),w(r,"uDivergence",1,p.texture),M(),R(g);r=T(h.gradient,v[1]),w(r,"uPressure",0,g[0].texture),w(r,"uVelocity",1,v[0].texture),M(),R(v),r=T(h.advect,v[1]),w(r,"uVelocity",0,v[0].texture),e.uniform1f(r.uDt,n.dt),e.uniform1f(r.uDissipation,n.dissipation),M(),R(v),e.bindFramebuffer(e.FRAMEBUFFER,null)},get velocity(){return v[0]?.texture??null},get size(){return[d,m]},release:b,dispose(){b(),f.forEach(({program:t})=>e.deleteProgram(t))}}}(k,Ve,e=>Oe(e))}const Je=()=>{Ke();const e=g.fluid;if(!(e&&je()&&z&&q))return;U||$e();const t=e.resolution,n=z/q;if($=n>=1?t:Math.max(8,Math.round(t*n)),J=n>=1?Math.max(8,Math.round(t/n)):t,G=!!N&&N.resize($,J),G)return void(Q=0);const r=()=>{Ke();for(let e=0;e<2;e++){const e=qe(k.LINEAR);k.texImage2D(k.TEXTURE_2D,0,L?k.RGBA8:k.RGBA16F,$,J,0,k.RGBA,L?k.UNSIGNED_BYTE:k.HALF_FLOAT,null);const t=k.createFramebuffer();k.bindFramebuffer(k.FRAMEBUFFER,t),k.framebufferTexture2D(k.FRAMEBUFFER,k.COLOR_ATTACHMENT0,k.TEXTURE_2D,e,0),B.push(e),X.push(t)}return k.checkFramebufferStatus(k.FRAMEBUFFER)===k.FRAMEBUFFER_COMPLETE};if(!r()){if(L)throw new Error("The glyph field could not allocate its fluid buffers.");L=!0,Qe(),$e(),r()}for(const e of X)k.bindFramebuffer(k.FRAMEBUFFER,e),k.viewport(0,0,$,J),k.clearColor(L?.5:0,L?.5:0,0,1),k.clear(k.COLOR_BUFFER_BIT);k.bindFramebuffer(k.FRAMEBUFFER,null),Q=0};function Qe(){C&&k.deleteProgram(C.program),P&&k.deleteProgram(P.program),We(),C=Ve((t=>`#version 300 es\nprecision highp float;\nprecision highp sampler2D;\nuniform sampler2D uSource, uFluid;\nuniform vec2 uResolution, uCell;\nuniform float uCount, uBlend;\nconst float BAYER[16]=float[16](0.,8.,2.,10.,12.,4.,14.,6.,3.,11.,1.,9.,15.,7.,13.,5.);\nuniform vec4 uSourceMap;\nuniform int uScene;\nuniform vec3 uInk, uHighlight;\nuniform vec4 uBackground;\nuniform float uBrightness, uContrast, uGamma, uInvert, uVignette, uSourceColor;\nuniform float uRefraction, uGlow, uTime, uDrift, uFluidOn, uLod, uSaturation, uBackdrop, uShade, uHighlightAuto, uFluidMode;\nuniform vec2 uFluidTexel;\nuniform int uHoverMode;\nuniform vec3 uLight;\nuniform vec3 uTrail[12];\nuniform float uLightRadius, uLightGain, uClock, uFlicker, uTrailAmount;\nuniform sampler2D uTrailMap;\nuniform vec2 uLevels;\nuniform int uMark;\nuniform float uScale, uClearFeather, uClearShape;\nuniform vec4 uClear;\nuniform vec4 uPulse[4];\nlayout(location=0) out vec4 outInk;\nlayout(location=1) out vec4 outUnder;\n${e(t)}\nfloat hash(vec2 p){p=fract(p*vec2(123.34,456.21));p+=dot(p,p+45.32);return fract(p.x*p.y);}\nfloat noise(vec2 p){vec2 i=floor(p),f=fract(p),u=f*f*(3.-2.*f);\n  return mix(mix(hash(i),hash(i+vec2(1,0)),u.x),mix(hash(i+vec2(0,1)),hash(i+vec2(1,1)),u.x),u.y);}\nfloat fbm(vec2 p){float v=0.,a=.5;for(int i=0;i<5;i++){v+=a*noise(p);p=p*2.03+vec2(1.7,9.2);a*=.5;}return v;}\nvec3 generated(vec2 uv,float aspect){\n  vec2 p=(uv-.5)*vec2(aspect,1.)*uScale;\n  if(uScene==1){\n    float t=uTime*.08;\n    vec2 q=vec2(fbm(p*1.6+t),fbm(p*1.6-t+3.1));\n    return vec3(smoothstep(.28,.86,fbm(p*1.8+q*1.6+vec2(t*.6,-t*.4))));\n  }\n  if(uScene==2){\n    float r=.36,d=length(p),a=uTime*.25;\n    vec3 l=normalize(vec3(cos(a)*.8,.55,sin(a)*.6+.6));\n    if(d<r){\n      vec3 n=normalize(vec3(p.x,-p.y,sqrt(r*r-d*d)));\n      float diffuse=max(dot(n,l),0.),rim=pow(1.-n.z,2.5);\n      float lon=atan(n.x,n.z)+uTime*.35,lat=asin(clamp(n.y,-1.,1.));\n      float bands=.5+.25*sin(lat*14.)+.25*sin(lon*6.);\n      return vec3(clamp(diffuse*.85+rim*.5+bands*.12,0.,1.));\n    }\n    return vec3(exp(-pow((d-r)*9.,2.))*.35);\n  }\n  if(uScene==4){\n    // Drift: a few broad lobes that wander slowly. Built for halftone, where large soft shapes read best.\n    float t=uTime*.045;\n    vec2 q=p*1.15;\n    vec2 w=vec2(fbm(q*.7+vec2(t,-t*.7)),fbm(q*.7+vec2(4.3-t*.8,t+1.7)));\n    float n=fbm(q+w*1.3+vec2(t*.4,t*.25));\n    return vec3(smoothstep(.36,.74,n));\n  }\n  if(uScene==5){\n    // Swell: three crossing swells, the second bent by the first, so crests roll diagonally instead of pooling.\n    float t=uTime;\n    float s=sin((dot(p,vec2(.94,.33))/.95-t/9.)*6.2831853);\n    float c=sin((dot(p,vec2(.6,-.8))/.58-t/13.)*6.2831853+s*.9);\n    float k=sin((dot(p,vec2(-.29,.96))/.36+t/17.)*6.2831853);\n    return vec3(smoothstep(.3,.9,.5+.5*(s*.5+c*.35+k*.15)));\n  }\n  return vec3(0.);\n}\nvoid main(){\n  vec2 cell=floor(gl_FragCoord.xy);\n  vec2 uv=(cell+.5)*uCell/uResolution;\n  float aspect=uResolution.x/uResolution.y;\n  vec4 fluid=vec4(0.);\n  // lift: signed tone change. The solver's flow brightens one side of each eddy and opens the other into gaps.\n  float lift=0.,wake=0.,bend=1.,swirl=0.,speed=0.;\n  if(uFluidOn>.5){\n    vec4 raw=texture(uFluid,vec2(uv.x,1.-uv.y));\n    if(uFluidMode>.5){\n      vec2 v=raw.xy*uFluidTexel*vec2(aspect,1.);\n      fluid=vec4(v,0.,1.);\n      swirl=clamp(dot(v,vec2(.4,.65))*uGlow*.32,-.65,.65);\n      speed=clamp(length(v)*uGlow*.055,0.,.38);\n      bend=.4;\n    } else {\n      fluid=decodeFluid(raw);\n      wake=clamp(fluid.z*uGlow,0.,1.);\n      lift=wake*.55;\n    }\n  }\n  vec2 drift=uDrift*.006*vec2(sin(uv.y*5.3+uTime*.6),cos(uv.x*4.1-uTime*.5));\n  vec2 sampleAt=uv-vec2(fluid.x/aspect,-fluid.y)*uRefraction*bend+drift;\n  vec3 rgb,glow=vec3(0.);\n  if(uScene==0){\n    vec2 s=sampleAt*uSourceMap.xy+uSourceMap.zw;\n    bool inside=!(s.x<0.||s.y<0.||s.x>1.||s.y>1.);\n    rgb=inside?textureLod(uSource,s,uLod).rgb:vec3(0.);\n    if(uBackdrop>0.){\n      vec2 b=(uv-vec2(fluid.x/aspect,-fluid.y)*uRefraction*bend*.5)*uSourceMap.xy+uSourceMap.zw;\n      glow=(b.x<0.||b.y<0.||b.x>1.||b.y>1.)?vec3(0.):textureLod(uSource,b,uLod+3.).rgb*uBackdrop;\n    }\n  } else rgb=generated(sampleAt,aspect);\n  float tone=dot(rgb,vec3(.2126,.7152,.0722));\n  tone=clamp((tone-uLevels.x)/max(uLevels.y-uLevels.x,.01),0.,1.);\n  tone=clamp((tone-.5)*uContrast+.5+uBrightness,0.,1.);\n  tone=pow(tone,1./uGamma);\n  if(uInvert>.5)tone=1.-tone;\n  float flick=0.,trailFold=0.;\n  if(uHoverMode==2){\n    // Lantern: a soft light and its fading tail lift the characters they pass. Nothing moves the image.\n    vec2 ap=vec2(aspect,1.),d=(uv-uLight.xy)*ap;\n    float r2=uLightRadius*uLightRadius,glowL=uLight.z*exp(-dot(d,d)/r2);\n    for(int i=0;i<12;i++){vec2 e=(uv-uTrail[i].xy)*ap;glowL+=uTrail[i].z*exp(-dot(e,e)/(r2*.55));}\n    glowL=min(glowL,1.);\n    float grain=fract(sin(dot(cell,vec2(12.9898,78.233)))*43758.5453);\n    lift=glowL*uLightGain*(.7+.6*grain);\n    wake=glowL*.4;\n    // A few letters at the light's rim step up the ramp and back, as if being retyped.\n    flick=uFlicker*step(.9,fract(grain*13.7+floor(uClock*7.+grain*5.)*.37))*glowL*(1.-glowL)*4.;\n  }\n  if(uHoverMode==3){\n    // Trail: the studio's ink field, as a 16-bit density. Sparse marks fill in, dense marks open up.\n    vec4 ink=texture(uTrailMap,uv);\n    float density=(ink.r*65280.+ink.g*255.)/65535.*uTrailAmount;\n    float t=clamp(density/.38,0.,1.);\n    trailFold=t*t*(3.-2.*t);\n  }\n  if(uFluidMode>.5&&uHoverMode==1){\n    // Dark ground: any motion lights the characters. Lit ground: the flow lights one side of each eddy and opens the other.\n    // A little cell-to-cell grain keeps the lit area a shimmer of letters rather than a solid block.\n    float grain=fract(sin(dot(cell,vec2(12.9898,78.233)))*43758.5453);\n    lift=mix(abs(swirl)*.5+speed,swirl+speed*.35,smoothstep(.12,.55,tone))*(.65+.7*grain);\n    wake=clamp(lift*1.6,0.,1.);\n  }\n  tone=clamp(tone+lift,0.,1.);\n  tone+=(1.-2.*tone)*trailFold;\n  // Pulses: rings sent by the interface (field.pulse()), e.g. on a save or a notification.\n  for(int i=0;i<4;i++){\n    if(uPulse[i].w<=0.)continue;\n    float dist=length((uv-uPulse[i].xy)*vec2(aspect,1.)),front=uPulse[i].z*.95;\n    float ring=exp(-pow((dist-front)/.1,2.))*uPulse[i].w*exp(-uPulse[i].z*.85);\n    tone=clamp(tone+ring*.85,0.,1.);\n  }\n  tone*=1.-uVignette*smoothstep(.35,1.05,length((uv-.5)*vec2(min(aspect,1.8),1.)*2.));\n  if(uClear.z>0.){\n    // Clear zone: the field fades out around content so text above it stays readable.\n    vec2 half_=uClear.zw*.5*vec2(aspect,1.),q=(uv-uClear.xy-uClear.zw*.5)*vec2(aspect,1.);\n    float dz;\n    if(uClearShape>.5){vec2 e=abs(q)-half_;dz=length(max(e,0.))+min(max(e.x,e.y),0.);}\n    else dz=(length(q/max(half_,vec2(1e-4)))-1.)*min(half_.x,half_.y);\n    tone*=smoothstep(0.,uClearFeather,dz);\n  }\n  // Blend: a shade between two characters takes the upper one in the share of cells a 4x4 Bayer pattern gives it.\n  float level=tone*(uCount-1.),upper=fract(level)>=.5?1.:0.;\n  if(uBlend>.5&&tone>.02&&tone<.98){\n    ivec2 q=ivec2(mod(gl_FragCoord.xy,4.));\n    upper=fract(level)>(BAYER[q.y*4+q.x]+.5)/16.?1.:0.;\n  }\n  float index=min(uCount-1.,floor(level)+upper+(flick>.5&&tone>.02?1.:0.));\n  vec3 hue=rgb/max(max(rgb.r,rgb.g),max(rgb.b,.03));\n  hue=mix(vec3(dot(hue,vec3(.2126,.7152,.0722))),hue,uSaturation);\n  vec3 ink=mix(uInk*mix(1.,.3+.7*tone,uShade),clamp(hue*(.38+.62*tone),0.,1.),uSourceColor);\n  vec3 lifted=uHighlightAuto>.5?ink/max(max(ink.r,ink.g),max(ink.b,.06)):uHighlight;\n  ink=mix(ink,lifted,wake*.7);\n  float underAlpha=max(uBackground.a,min(1.,max(glow.r,max(glow.g,glow.b))));\n  vec3 under=min(uBackground.rgb*uBackground.a+glow,vec3(underAlpha));\n  // Glyphs keep their atlas index, exact in 8 bits; the other marks keep the tone, and empty where the charset is blank.\n  outInk=vec4(ink,uMark==0?index/255.:uMark==1?(tone>.003?tone:0.):index>0.?max(tone,1./255.):0.);\n  outUnder=vec4(under,underAlpha);\n}`)(L)),P=Ve("#version 300 es\nprecision highp float;\nprecision highp sampler2D;\nuniform sampler2D uAtlas, uCells, uUnder;\nuniform vec2 uResolution, uCell, uPitch;\nuniform float uColumns, uDotScale, uSourceColor;\nuniform int uMark;\nout vec4 outColor;\nconst float BAYER[16]=float[16](0.,8.,2.,10.,12.,4.,14.,6.,3.,11.,1.,9.,15.,7.,13.,5.);\n// The Studio's print defaults: screen angle -35deg, roughness .35, seed 7, registration .2 and its coral second ink.\nconst vec2 DIR=vec2(.81915,-.57358);\nconst float ROUGH=.35,SEED=7.;\nconst vec3 SECOND=vec3(.925,.404,.322);\nfloat hash(vec2 p){p=fract(p*vec2(123.34,456.21));p+=dot(p,p+45.32);return fract(p.x*p.y);}\n// Coverage of a signed distance given in device pixels.\nfloat cover(float d){return clamp(.5-d,0.,1.);}\nfloat box(vec2 p,vec2 lo,vec2 hi){vec2 a=clamp(p-lo,0.,1.)*clamp(hi-p,0.,1.);return a.x*a.y;}\nfloat disc(vec2 p,vec2 c,float r){return r>.05?cover(length(p-c)-r):0.;}\nfloat ellipse(vec2 p,vec2 c,vec2 r,float a){vec2 d=p-c;d=vec2(cos(a)*d.x+sin(a)*d.y,-sin(a)*d.x+cos(a)*d.y);float k=length(d/r);return cover((k-1.)*min(r.x,r.y));}\n// World-anchored parallel cuts across direction d: period and width in cell heights, so lines run on from cell to cell.\nfloat cuts(vec2 w,vec2 d,float period,float width,float px){\n  if(width<=0.)return 0.;\n  float proj=dot(vec2(-d.y,d.x),w);\n  return cover((abs(fract(proj/period+.5)-.5)*period-width*.5)*px);\n}\n// Lays an ink over what is already down, multiplying where they overlap, as transparent inks do on paper.\nvoid lay(inout vec3 rgb,inout float a,vec3 c,float k){\n  float next=a+k*(1.-a);\n  rgb=next>0.?(rgb*a*(1.-k)+mix(c,rgb*c,a)*k)/next:c;\n  a=next;\n}\nvoid main(){\n  vec2 frag=vec2(gl_FragCoord.x,uResolution.y-gl_FragCoord.y);\n  // The pitch is the atlas cell, or a fractional one under cellFit 'fill', where each glyph sits centred in its stretched cell.\n  vec2 cell=floor(frag/uPitch);\n  vec4 ink=texelFetch(uCells,ivec2(cell),0),under=texelFetch(uUnder,ivec2(cell),0);\n  vec2 local=frag-cell*uPitch;\n  float coverage;\n  vec3 rgb=ink.rgb;\n  if(uMark==0){\n    float index=floor(ink.a*255.+.5);\n    ivec2 tile=ivec2(int(mod(index,uColumns)),int(floor(index/uColumns)));\n    vec2 texel=floor(local-floor((uPitch-uCell)*.5));\n    coverage=all(greaterThanEqual(texel,vec2(0.)))&&all(lessThan(texel,uCell))?texelFetch(uAtlas,tile*ivec2(uCell)+ivec2(texel),0).a:0.;\n  } else if(uMark==1){\n    // Halftone: dot area follows tone, so midtones read true; edges are antialiased to one device pixel.\n    float r=sqrt(ink.a)*min(uPitch.x,uPitch.y)*.5*uDotScale;\n    coverage=ink.a>.003?clamp(r-length(local-uPitch*.5)+.5,0.,1.):0.;\n  } else if(ink.a<=0.){\n    coverage=0.;\n  } else {\n    float tone=ink.a,side=min(uPitch.x,uPitch.y);\n    vec2 q=local/uPitch,c=uPitch*.5,p=local+.5;\n    // Tiles fade with the tone in one ink, as the Studio's do; in source colour the colour already carries it.\n    float fade=uSourceColor>.5?1.:tone,gap=max(.5,uPitch.x*.06),grain=hash(cell+SEED);\n    vec2 w=(cell+q)*uPitch/uPitch.y;\n    if(uMark==2)coverage=fade;\n    else if(uMark==3)coverage=box(p,vec2(0.),uPitch-gap)*fade;\n    else if(uMark==4){\n      // Lego: a gapped brick, lit from above, with a raised stud ringed by its shadow.\n      coverage=box(p,vec2(0.),uPitch-gap)*fade;\n      rgb*=1.06-.14*q.y;\n      float r=side*.28,d=length(local-c)-r,lit=clamp(dot(c-local,vec2(.6,.8))/r,-1.,1.);\n      rgb=mix(rgb,mix(rgb,vec3(1.),.2+.12*lit),cover(d));\n      rgb=mix(rgb,rgb*.72,cover(abs(d)-max(.5,side*.04)));\n    } else if(uMark==5){\n      // Voxel: an isometric cube; top, left and right faces at full, .72 and .42 strength.\n      float h=.5*abs(q.x-.5);\n      coverage=cover(-min(q.y-h,1.-h-q.y)*uPitch.y)*cover(-min(q.x,1.-q.x)*uPitch.x);\n      coverage*=mix(q.x<.5?.72:.42,1.,cover((q.y-(.5-h))*uPitch.y))*fade;\n    } else if(uMark==6){\n      // Disco: a gapped mirror tile, its upper facet catching light and its lower in shade.\n      coverage=box(p,vec2(0.),uPitch-gap)*fade;\n      rgb=q.y<.35?mix(rgb,vec3(1.),.1+grain*.25):q.y>.65?rgb*.75:rgb;\n    } else if(uMark==7){\n      // Dither: an ordered 4x4 Bayer screen at about five dots a cell, lit where the cell's tone passes the threshold.\n      ivec2 b=ivec2(mod(floor(frag/max(1.,floor(side/5.))),4.));\n      coverage=tone>(BAYER[b.y*4+b.x]+.5)/16.?1.:0.;\n    } else if(uMark==8){\n      // Hex: a flat-topped hexagon filling the cell.\n      vec2 h=abs((local-c)/(uPitch*.49));\n      coverage=cover(max(h.y-.866,h.x*.866+h.y*.5-.866)*side*.49)*fade;\n    } else if(uMark==9){\n      // LED: a round lamp with a soft halo and a specular glint, separated by an unlit matrix.\n      float r=side*.39,d=length(local-c);\n      coverage=max(cover(d-r),.3*exp(-pow(max(0.,d-r)/(side*.12),2.)))*fade;\n      rgb=mix(rgb,vec3(1.),.35*disc(local,uPitch*vec2(.43,.4),side*.11));\n    } else if(uMark==10){\n      // CMYK: the cell's hue separated into offset cyan, magenta and yellow dots, each sized by its share of the tone. The\n      // key screen carries the neutral share in the ink's own lightness, since a light ink on a dark page has no black.\n      float top=max(rgb.r,max(rgb.g,rgb.b)),low=min(rgb.r,min(rgb.g,rgb.b));\n      vec3 cmy=(top-rgb)/max(top,.001);\n      float a=0.;vec3 col=vec3(1.);\n      lay(col,a,vec3(top),disc(local,c,side*.48*sqrt(tone*low/max(top,.001))));\n      lay(col,a,vec3(0.,1.,1.),disc(local,uPitch*vec2(.36,.36),side*.48*sqrt(tone*cmy.x)));\n      lay(col,a,vec3(1.,0.,1.),disc(local,uPitch*vec2(.64,.36),side*.48*sqrt(tone*cmy.y)));\n      lay(col,a,vec3(1.,1.,0.),disc(local,uPitch*vec2(.5,.66),side*.48*sqrt(tone*cmy.z)));\n      rgb=col;coverage=a;\n    } else if(uMark==11||uMark==16){\n      // Stipple and pointillism: four jittered marks a cell, their size following the tone.\n      coverage=0.;vec3 col=rgb;\n      for(int m=0;m<4;m++){\n        vec2 o=vec2(float(m%2),float(m/2));\n        float j=hash(cell*2.+o+SEED),jy=hash(cell+o*11.+SEED+1.);\n        vec2 at=((o+.5)/2.+(vec2(j,jy)-.5)*ROUGH*.28)*uPitch;\n        float r=min(min(min(at.x,uPitch.x-at.x),min(at.y,uPitch.y-at.y)),side*min(.245,.21*sqrt(tone)*(1.-ROUGH*j*.35)));\n        float k=uMark==11?disc(local,at,r):ellipse(local,at,vec2(r,r*.64),j*3.14159);\n        if(uMark==16&&k>coverage)col=uSourceColor>.5?clamp(rgb+(j-.5)*ROUGH*.25*vec3(1.,-.4,-1.),0.,1.):rgb*(1.+(j-.5)*ROUGH*.5);\n        coverage=max(coverage,k);\n      }\n      rgb=col;\n    } else if(uMark==12||uMark==13){\n      // Engraving and crosshatch: parallel cuts whose weight follows the tone; crossings join only in the darker tones.\n      float cv=tone*(1.-ROUGH*grain*.3),px=uPitch.y;\n      coverage=cuts(w,DIR,.5,min(.47,.36*cv),px);\n      if(uMark==13){\n        coverage=max(coverage,cuts(w,vec2(-DIR.y,DIR.x),.5,min(.47,.36*max(0.,cv*1.5-.3)),px)*step(.2,cv));\n        coverage=max(coverage,cuts(w,normalize(DIR+vec2(-DIR.y,DIR.x)),.5,min(.47,.36*max(0.,cv*2.-1.2)),px)*step(.6,cv));\n      }\n    } else if(uMark==14){\n      // Woodblock: broad carved bands in five stepped weights, their edges wavering along the grain.\n      float cv=ceil(tone*(1.-ROUGH*grain*.3)*5.)/5.,width=min(.94,.72*cv);\n      float proj=dot(vec2(-DIR.y,DIR.x),w),line=floor(proj+.5),along=dot(DIR,w);\n      float cut=sin(along*5.3+line*1.9+SEED)*.5+sin(along*13.1+line)*.25;\n      coverage=cover((abs(proj-line)-width*.5*(1.+ROUGH*cut*.5))*uPitch.y);\n    } else if(uMark==15){\n      // Risograph: two offset screens, the main ink and the coral second ink, misregistered along the screen angle.\n      float split=uSourceColor>.5?clamp(.5+(rgb.r-rgb.b)*.5,0.,1.):.5,r=side*min(.48,.44*sqrt(tone));\n      float a=0.;vec3 col=rgb;\n      lay(col,a,rgb,disc(local,c,r*sqrt(.35+(1.-split)*.65)));\n      lay(col,a,SECOND,disc(local,c+DIR*.2*.38*side,r*sqrt(.3+split*.7)*(1.-ROUGH*hash(cell+SEED+13.)*.3)));\n      rgb=col;coverage=a;\n    } else coverage=0.;\n  }\n  outColor=vec4(rgb*coverage+under.rgb*(1.-coverage),coverage+under.a*(1.-coverage));\n}"),D||ze(!0)}const Ze=()=>`${g.fontWeight} ${Math.max(1,j.height*g.glyphScale)}px ${g.font}`,et=()=>{const e=x(g.charset);K=e.length,j=b(g.cellSize,g.cellAspect,W,K),Y=W;const t=document.createElement("canvas");t.width=j.atlasWidth,t.height=j.atlasHeight;const n=t.getContext("2d");n.fillStyle="#fff",n.textAlign="center",n.textBaseline="alphabetic",n.font=Ze();const r=n.measureText("M"),i=r.actualBoundingBoxAscent||j.height*g.glyphScale*.7,o=r.actualBoundingBoxDescent||0,a=(j.height+i-o)/2;e.forEach((e,t)=>{const r=t%j.columns*j.width+j.width/2,i=Math.floor(t/j.columns)*j.height+a,o=n.measureText(e).width;n.save(),n.beginPath(),n.rect(r-j.width/2,i-a,j.width,j.height),n.clip(),n.translate(r,i),o>.96*j.width&&n.scale(.96*j.width/o,1),n.fillText(e,0,0),n.restore()}),k.bindTexture(k.TEXTURE_2D,S),k.pixelStorei(k.UNPACK_PREMULTIPLY_ALPHA_WEBGL,!1),k.texImage2D(k.TEXTURE_2D,0,k.RGBA8,k.RGBA,k.UNSIGNED_BYTE,t),t.width=t.height=1,me=!0},tt="undefined"==typeof document?void 0:document.fonts,nt=()=>{if(!tt?.load)return;const e=Ze();tt.load(e,x(g.charset).join("")).then(()=>{ve||ge||Ze()!==e||(et(),Tt())},()=>{})},rt=e=>e.trim().replace(/^["']|["']$/g,"").toLowerCase(),it=e=>{const t=e.fontfaces??[],n=g.font.split(",").map(rt);t.some(e=>n.includes(rt(e.family)))&&nt()},ot=()=>{if(se=[0,1],Z&&"none"!==g.levels)try{const e=document.createElement("canvas");e.width=e.height=64;const t=e.getContext("2d",{willReadFrequently:!0});Z===oe&&(t.imageSmoothingQuality="medium"),t.drawImage(Z,0,0,64,64),se=w(t.getImageData(0,0,64,64).data)}catch{se=[0,1]}},at=()=>{if(!Z)return;const e=performance.now();Z instanceof HTMLVideoElement&&!(e-ce>1500)||(ot(),ce=e),k.bindTexture(k.TEXTURE_2D,_),k.pixelStorei(k.UNPACK_FLIP_Y_WEBGL,!1),k.pixelStorei(k.UNPACK_PREMULTIPLY_ALPHA_WEBGL,!1);try{k.texImage2D(k.TEXTURE_2D,0,k.RGBA8,k.RGBA,k.UNSIGNED_BYTE,Z),k.generateMipmap(k.TEXTURE_2D)}catch(e){Ge(e)}},lt=()=>{L=!k.getExtension("EXT_color_buffer_float")&&!k.getExtension("EXT_color_buffer_half_float"),Qe(),H=k.createVertexArray(),S=qe(k.NEAREST),_=qe(k.LINEAR_MIPMAP_LINEAR),k.bindTexture(k.TEXTURE_2D,_),k.texImage2D(k.TEXTURE_2D,0,k.RGBA8,1,1,0,k.RGBA,k.UNSIGNED_BYTE,new Uint8Array([0,0,0,255])),k.generateMipmap(k.TEXTURE_2D),z=q=0,Y=0,ut(),nt(),Z&&at()};function ut(){const e=t.clientWidth||t.clientHeight?{width:t.clientWidth,height:t.clientHeight}:t.getBoundingClientRect(),n=Math.min(globalThis.devicePixelRatio||1,g.maxPixelRatio),r=Math.max(1,Math.round(e.width*n)),i=Math.max(1,Math.round(e.height*n));if(r===z&&i===q&&n===W)return!1;const o=!z||Math.abs(r/i-z/q)>.01;return W=n,z=r,q=i,t.width=z,t.height=q,Y!==W&&et(),(o||je()&&!B.length&&!G)&&Je(),me=!0,!0}let st=null,ct=[0,0,0],ht=[1,1,1],ft=[0,0,0,0],dt=y(1,1,1,1,"cover"),mt=null,vt=0,gt=0,pt=0,xt=0;const Et=()=>{st!==g&&(st=g,ct=T(g.ink),ht=T("auto"===g.highlight?"#ffffff":g.highlight),ft="transparent"===g.background?[0,0,0,0]:[...T(g.background),1]),mt===g&&vt===z&&gt===q&&pt===ne&&xt===re||(mt=g,vt=z,gt=q,pt=ne,xt=re,dt=y(z,q,ne||1,re||1,g.fit,g.focus));const e=g.fluid,t=Z&&ae?j.height/q*ae*dt.scale[1]:1,n=(()=>{const[e,t]=Ye(),n=Math.ceil(z/e-1e-4),r=Math.ceil(q/t-1e-4);if(I&&I.columns===n&&I.rows===r)return I;We();const i=()=>{const e=qe(k.NEAREST);return k.texStorage2D(k.TEXTURE_2D,1,L?k.RGBA8:k.RGBA16F,n,r),e},o=i(),a=i(),l=k.createFramebuffer();return k.bindFramebuffer(k.FRAMEBUFFER,l),k.framebufferTexture2D(k.FRAMEBUFFER,k.COLOR_ATTACHMENT0,k.TEXTURE_2D,o,0),k.framebufferTexture2D(k.FRAMEBUFFER,k.COLOR_ATTACHMENT1,k.TEXTURE_2D,a,0),k.drawBuffers([k.COLOR_ATTACHMENT0,k.COLOR_ATTACHMENT1]),I={ink:o,under:a,buffer:l,columns:n,rows:r}})(),r=C.locations,i=P.locations,o=M(g),a=!Ie();k.bindFramebuffer(k.FRAMEBUFFER,n.buffer),k.viewport(0,0,n.columns,n.rows),k.useProgram(C.program),k.activeTexture(k.TEXTURE0),k.bindTexture(k.TEXTURE_2D,_),k.uniform1i(r.uSource,0),k.activeTexture(k.TEXTURE2),k.bindTexture(k.TEXTURE_2D,(G?N?.velocity:B[Q])??_),k.uniform1i(r.uFluid,2),k.activeTexture(k.TEXTURE3),k.bindTexture(k.TEXTURE_2D,Se??_),k.uniform1i(r.uTrailMap,3),k.uniform1f(r.uFluidMode,G?1:0),k.uniform1i(r.uHoverMode,"fluid"===o?1:"lantern"===o?2:"trail"===o&&_e?3:0),k.uniform1f(r.uTrailAmount,g.trail.strength),k.uniform3f(r.uLight,ke.at?.[0]??-1,ke.at?.[1]??-1,"lantern"===o?ke.strength:0),k.uniform3fv(r.uTrail,Le),k.uniform1f(r.uLightRadius,g.lantern.radius),k.uniform1f(r.uLightGain,g.lantern.strength),k.uniform1f(r.uClock,performance.now()/1e3),k.uniform1f(r.uFlicker,a?1:0),k.uniform2f(r.uFluidTexel,1/Math.max(1,$),1/Math.max(1,J)),k.uniform2f(r.uResolution,z,q);const[l,u]=Ye();k.uniform2f(r.uCell,l,u),k.uniform1f(r.uCount,K),k.uniform1f(r.uBlend,"on"===g.blend||K<=9&&("coarse"===g.blend||"auto"===g.blend&&ee)?1:0),k.uniform4f(r.uSourceMap,dt.scale[0],dt.scale[1],dt.offset[0],dt.offset[1]),k.uniform1i(r.uScene,Z?0:"flow"===g.scene?1:"orb"===g.scene?2:"drift"===g.scene?4:"swell"===g.scene?5:3),k.uniform1i(r.uMark,h.indexOf(g.mark)),k.uniform1f(r.uScale,g.scale);const s=g.clear;k.uniform4f(r.uClear,s?s.x:0,s?s.y:0,s?s.width:0,s?s.height:0),k.uniform1f(r.uClearFeather,s?s.feather:.1),k.uniform1f(r.uClearShape,s&&"rect"===s.shape?1:0);const c=performance.now();Fe.fill(0);for(let e=0;e<Re.length;e++){const t=Re[e],n=4*e;Fe[n]=t.x,Fe[n+1]=t.y,Fe[n+2]=(c-t.born)/1e3,Fe[n+3]=t.strength}k.uniform4fv(r.uPulse,Fe),k.uniform3fv(r.uInk,ct),k.uniform3fv(r.uHighlight,ht),k.uniform1f(r.uHighlightAuto,"auto"===g.highlight?1:0),k.uniform4fv(r.uBackground,ft),k.uniform1f(r.uBrightness,g.brightness),k.uniform1f(r.uContrast,g.contrast),k.uniform1f(r.uGamma,g.gamma),k.uniform1f(r.uInvert,g.invert?1:0),k.uniform1f(r.uVignette,g.vignette),k.uniform1f(r.uSourceColor,"source"===g.color?1:0),k.uniform1f(r.uRefraction,e?e.refraction*(a?1:.25):0),k.uniform1f(r.uGlow,e?e.glow:0),k.uniform1f(r.uTime,de),k.uniform1f(r.uDrift,a?g.drift:0),k.uniform1f(r.uFluidOn,e&&"fluid"===o&&(B.length||G)?1:0),k.uniform1f(r.uLod,Math.max(0,Math.log2(Math.max(1,t))-.5)),k.uniform1f(r.uSaturation,g.saturation),k.uniform1f(r.uShade,g.shade),k.uniform1f(r.uBackdrop,Z?g.backdrop:0),k.uniform2f(r.uLevels,Z&&"auto"===g.levels?se[0]:0,Z&&"auto"===g.levels?se[1]:1),k.bindVertexArray(H),k.drawArrays(k.TRIANGLES,0,3),k.bindFramebuffer(k.FRAMEBUFFER,null),k.viewport(0,0,z,q),k.useProgram(P.program),k.activeTexture(k.TEXTURE1),k.bindTexture(k.TEXTURE_2D,S),k.uniform1i(i.uAtlas,1),k.activeTexture(k.TEXTURE4),k.bindTexture(k.TEXTURE_2D,n.ink),k.uniform1i(i.uCells,4),k.activeTexture(k.TEXTURE5),k.bindTexture(k.TEXTURE_2D,n.under),k.uniform1i(i.uUnder,5),k.uniform2f(i.uResolution,z,q),k.uniform2f(i.uCell,j.width,j.height),k.uniform2f(i.uPitch,l,u),k.uniform1f(i.uColumns,j.columns),k.uniform1f(i.uDotScale,g.dotScale),k.uniform1i(i.uMark,h.indexOf(g.mark)),k.uniform1f(i.uSourceColor,"source"===g.color?1:0),k.drawArrays(k.TRIANGLES,0,3)},yt=()=>!ve&&!ge&&!pe&&(Ee||Ne)&&!("undefined"!=typeof document&&document.hidden),bt=e=>{if(he=0,!yt())return;const t=(e-fe)/1e3,n=Math.min(1/30,Math.max(1/480,t));fe=e,Te=.9*Te+.1*Math.min(t,.25),we=Te>1/24?we+1:0;try{we>45&&Me<2&&(we=0,Me++,1===Me&&W>1?(g={...g,maxPixelRatio:1},ut()):Me=2);const t=ze(),r=!(xe||Me>=2&&!(Z instanceof HTMLVideoElement)||(!(Z instanceof HTMLVideoElement)||Z.paused||Z.ended)&&(Ie()||!(!Z&&"none"!==g.scene||g.drift>0)));r&&(de+=n*g.speed),Z instanceof HTMLVideoElement&&Z.readyState>=2&&le&&(le=!("requestVideoFrameCallback"in Z),at(),me=!0);const i=M(g);let o="fluid"===i&&(null!==be||e<Pe);if(o?((e,t)=>{const n=g.fluid;if(!n||!X.length&&!G)return;if(G?!N?.ready():!U||!Oe(U))return;const r=z/q,i=be;if(be=null,G&&N){const o=5200*n.force*(Ie()?.35:1);return i&&(Pe=t+1e3*Math.min(9,6/Math.max(.3,n.dissipation))),void N.step(i?{from:i.from,to:i.to,force:[(i.to[0]-i.from[0])*o,(i.to[1]-i.from[1])*o]}:null,{dt:Math.min(e,1/60),radius:1.1*n.radius,curl:n.curl,dissipation:n.dissipation,aspect:r})}let o=0,a=0;if(i){const e=(Ie()?1:3)*n.force;o=(i.to[0]-i.from[0])*r*e*4,a=(i.to[1]-i.from[1])*e*4,Pe=t+7/Math.min(n.dissipation,1.1*n.dissipation)*1e3}const l=U.locations;k.bindFramebuffer(k.FRAMEBUFFER,X[1-Q]),k.viewport(0,0,$,J),k.useProgram(U.program),k.activeTexture(k.TEXTURE0),k.bindTexture(k.TEXTURE_2D,B[Q]),k.uniform1i(l.uPrevious,0),k.uniform2f(l.uSize,$,J),k.uniform1f(l.uAspect,r),k.uniform1f(l.uDt,e),k.uniform1f(l.uDecay,n.dissipation),k.uniform1f(l.uEnergyDecay,1.1*n.dissipation),k.uniform1f(l.uRadius,n.radius),k.uniform1f(l.uSplat,i?1:0),k.uniform2f(l.uFrom,i?.from[0]??0,i?.from[1]??0),k.uniform2f(l.uTo,i?.to[0]??0,i?.to[1]??0),k.uniform2f(l.uForce,o,a),k.drawArrays(k.TRIANGLES,0,3),Q=1-Q})(n,e):be=null,"lantern"===i&&(o=((e,t)=>{const n=g.lantern,r=ke.target;if(r){const i=ke.at;if(i)if(Ie())i[0]=r[0],i[1]=r[1];else{const t=1-Math.exp(-n.follow*e);i[0]+=(r[0]-i[0])*t,i[1]+=(r[1]-i[1])*t}else ke.at=[r[0],r[1]];const o=ke.at,a=ke.trail[ke.trail.length-1];n.trail>0&&(!a||t-a.born>28&&Math.hypot(o[0]-a.x,o[1]-a.y)>.004)&&(ke.trail.push({x:o[0],y:o[1],born:t}),ke.trail.length>12&&ke.trail.shift())}ke.strength+=((r?1:0)-ke.strength)*(1-Math.exp(-e*(r?9:5)));const i=ke.trail;for(let e=i.length-1;e>=0;e--)n.trail>0&&t-i[e].born<4e3*n.trail||i.splice(e,1);Le.fill(0);for(let e=0;e<i.length;e++){const r=i[e];Le[3*e]=r.x,Le[3*e+1]=r.y,Le[3*e+2]=.55*Math.exp(-(t-r.born)/1e3/Math.max(.01,n.trail))}return ke.strength>.003||i.length>0})(n,e)||o),"trail"===i){const e=!!De?.active;o=(e=>{const t=Ce();return!(!t||!t.active||(t.step(e),k.bindTexture(k.TEXTURE_2D,Se),k.texSubImage2D(k.TEXTURE_2D,0,0,0,t.width,t.height,k.RGBA,k.UNSIGNED_BYTE,t.pixels),_e=!0,0))})(n)||o,e&&!De?.active&&(me=!0)}if(Re.length){for(let t=Re.length-1;t>=0;t--)e-Re[t].born>=2400&&Re.splice(t,1);o=!0,Re.length||(me=!0)}t&&(r||o||me)&&(Et(),me=!1,!Ne||ie&&!Z||(Ne=!1,Be())),(r||o||be||!t)&&(he=requestAnimationFrame(bt))}catch(e){pe=!0,Ge(e)}};function Tt(){!he&&yt()&&(fe=performance.now(),he=requestAnimationFrame(bt))}const wt=(e,n)=>{const r=t.getBoundingClientRect();if(!r.width||!r.height)return null;const i=(e-r.left)/r.width,o=(n-r.top)/r.height;return i<-.05||i>1.05||o<-.05||o>1.05?null:[i,1-o]},Mt=e=>{const t=M(g);if("none"===t||xe)return ye=null,void(ke.target=null);if("lantern"===t)return ke.target=e?[e[0],1-e[1]]:null,ye=null,void Tt();if("trail"===t){const t=Ce();if(!t)return;return e?t.move(e[0],1-e[1],g.trail.radius,performance.now()):t.leave(),ye=null,void Tt()}e?(ye&&(be=be?{from:be.from,to:e}:{from:ye,to:e}),ye=e,Tt()):ye=null},Rt=e=>Mt(wt(e.clientX,e.clientY)),Ft=()=>{ye=null,De?.leave(),ke.target&&(ke.target=null,Tt())},At=f.interactionTarget??window;At.addEventListener("pointermove",Rt,{passive:!0}),At.addEventListener("pointerdown",Rt,{passive:!0}),document.addEventListener("pointerleave",Ft),At!==window&&At.addEventListener("pointerleave",Ft);const kt="function"==typeof ResizeObserver?new ResizeObserver(()=>{const e=ut();Ae(),(e||me)&&Tt()}):null;kt?.observe(t),v&&kt?.observe(v.element);const Lt="function"==typeof IntersectionObserver?new IntersectionObserver(([e])=>{Ee=e.isIntersecting,Ee&&(me=!0,Tt())},{rootMargin:"120px"}):null;Lt?.observe(t);const Dt=()=>{document.hidden||(me=!0,Tt())};document.addEventListener("visibilitychange",Dt);const St=()=>{me=!0,Tt()};Ue?.addEventListener?.("change",St),tt?.addEventListener?.("loadingdone",it);const _t=e=>{e.preventDefault(),ge=!0,he&&cancelAnimationFrame(he),he=0},Ct=()=>{ge=!1,O.length=0,V=null,C=P=U=null,I=null,B=[],X=[],N=null,G=!1,Se=null,De=null,_e=!1;try{lt(),me=!0,Tt()}catch(e){Ge(e)}};t.addEventListener("webglcontextlost",_t),t.addEventListener("webglcontextrestored",Ct);const Pt=()=>{te&&(te.pause(),te.removeAttribute("src"),te.load(),te=null),ue&&Z instanceof HTMLVideoElement&&"cancelVideoFrameCallback"in Z&&Z.cancelVideoFrameCallback(ue),ue=0},Ut=()=>{oe?.close(),oe=null},It=async e=>{const t=await createImageBitmap(e,{premultiplyAlpha:"none"}),n=[t.width,t.height],r=function(e,t,n,r,i,o,a=8){if(!(n>=16&&r>=16&&e>0&&t>0&&i>0))return 1;const l=a/i/("cover"===o?Math.min(e/n,t/r):Math.max(e/n,t/r));return l>.5?1:2**-Math.floor(Math.log2(1/l))}(t.width,t.height,z,q,j.height,g.fit);if(1===r)return{element:t,owned:!0,natural:n};try{return{element:await createImageBitmap(t,{resizeWidth:Math.max(1,Math.round(t.width*r)),resizeHeight:Math.max(1,Math.round(t.height*r)),resizeQuality:"medium",premultiplyAlpha:"none"}),owned:!0,natural:n}}finally{t.close()}},Bt=e=>new Promise((t,n)=>{const r=new Image;r.crossOrigin="anonymous",r.decoding="async",r.onload=()=>t({element:r,owned:!1}),r.onerror=()=>n(new Error("The glyph field could not load this image.")),r.src=e}),Xt=async e=>{const t=++ie;if(!e)return Pt(),Ut(),Z=null,ne=re=ae=0,ee=!1,me=!0,void Tt();try{const n=await(async e=>{if("string"!=typeof e)return e instanceof HTMLImageElement&&!e.complete?e.decode().then(()=>({element:e,owned:!1})):e instanceof HTMLVideoElement&&e.readyState<2?new Promise((t,n)=>{e.addEventListener("loadeddata",()=>t({element:e,owned:!1}),{once:!0}),e.addEventListener("error",()=>n(new Error("The glyph field could not load this video.")),{once:!0})}):{element:e,owned:!1};if(A.test(e))return new Promise((t,n)=>{const r=document.createElement("video");r.crossOrigin="anonymous",r.muted=!0,r.loop=!0,r.playsInline=!0,r.preload="auto",r.addEventListener("loadeddata",()=>{r.play().catch(()=>{}),t({element:r,owned:!0})},{once:!0}),r.addEventListener("error",()=>n(new Error("The glyph field could not load this video.")),{once:!0}),r.src=e});if("function"!=typeof createImageBitmap||"function"!=typeof fetch)return Bt(e);let t;try{t=await(await fetch(e).then(e=>{if(!e.ok)throw new Error("The glyph field could not load this image.");return e})).blob()}catch(t){if(t instanceof Error&&t.message.startsWith("The glyph field"))throw t;return Bt(e)}if(!/svg/i.test(t.type))try{return await It(t)}catch{}const n=URL.createObjectURL(t);try{return await Bt(n)}finally{URL.revokeObjectURL(n)}})(e),{element:r,owned:i}=n;if(ve||t!==ie)return void(i&&r instanceof HTMLVideoElement?(r.pause(),r.removeAttribute("src"),r.load()):i&&r.close());Pt(),Ut(),te=i&&r instanceof HTMLVideoElement?r:null,!i||r instanceof HTMLVideoElement||(oe=r),Z=r,ee="string"==typeof e||e instanceof HTMLImageElement||e instanceof HTMLVideoElement,ae=r instanceof HTMLVideoElement?r.videoHeight:r instanceof HTMLImageElement?r.naturalHeight:r.height,ne=n.natural?.[0]??(r instanceof HTMLVideoElement?r.videoWidth:r instanceof HTMLImageElement?r.naturalWidth:r.width),re=n.natural?.[1]??ae,le=!0,r instanceof HTMLVideoElement&&(e=>{const t=e;if(!t.requestVideoFrameCallback)return;const n=()=>{ve||Z!==e||(le=!0,Tt(),ue=t.requestVideoFrameCallback(n))};ue=t.requestVideoFrameCallback(n)})(r),ge||at(),me=!0,Tt()}catch(e){Ne&&t===ie&&(Ne=!1,Be()),Ge(e)}};lt(),Ae();const Nt=f.source??null;return Nt?(ie=1,Xt(Nt)):Tt(),{canvas:t,ready:Xe,get settings(){return g},update(e){const n=g,{element:r,rest:i}=m(e);"clear"in e&&(v&&v.element!==r?.element&&kt?.unobserve(v.element),v=r,r&&kt?.observe(r.element)),g=E(r?{...i,clear:g.clear}:i,g),Ae(),e.label&&t.setAttribute("aria-label",e.label),g.maxPixelRatio!==n.maxPixelRatio&&ut(),g.charset===n.charset&&g.cellSize===n.cellSize&&g.cellAspect===n.cellAspect&&g.font===n.font&&g.fontWeight===n.fontWeight&&g.glyphScale===n.glyphScale||(et(),nt()),g.levels!==n.levels&&ot();((!!n.fluid&&"fluid"===M(n))!==je()||g.fluid&&n.fluid&&g.fluid.resolution!==n.fluid.resolution)&&Je(),"source"in e&&Xt(e.source??null),me=!0,Tt()},setSource:Xt,pointer(e,n=0){if(null===e)return void Mt(null);const r=t.getBoundingClientRect();Mt(wt(r.left+e,r.top+n))},redraw(){if(!(ve||ge||pe)&&z)try{ze(!0)&&Et()}catch(e){pe=!0,Ge(e)}},pulse(e={}){if(ve||Ie())return;const n=t.getBoundingClientRect();if(!n.width||!n.height)return;let r=e.x??n.width/2,i=e.y??n.height/2;if(e.element){const t=e.element.getBoundingClientRect();r=t.left+t.width/2-n.left,i=t.top+t.height/2-n.top}const o=Math.max(0,Math.min(2,e.strength??1));Re=[...Re,{x:r/n.width,y:i/n.height,born:performance.now(),strength:o}].slice(-4),Tt()},play(){xe=!1,Z instanceof HTMLVideoElement&&Z.play().catch(()=>{}),me=!0,Tt()},pause(){xe=!0,Z instanceof HTMLVideoElement&&Z.pause()},resize(){ut()&&Tt()},destroy(){if(!ve&&(ve=!0,he&&cancelAnimationFrame(he),At.removeEventListener("pointermove",Rt),At.removeEventListener("pointerdown",Rt),document.removeEventListener("pointerleave",Ft),At.removeEventListener("pointerleave",Ft),document.removeEventListener("visibilitychange",Dt),Ue?.removeEventListener?.("change",St),tt?.removeEventListener?.("loadingdone",it),t.removeEventListener("webglcontextlost",_t),t.removeEventListener("webglcontextrestored",Ct),kt?.disconnect(),Lt?.disconnect(),Pt(),Ut(),Z=null,!ge)){Ke(),We(),k.deleteTexture(S),k.deleteTexture(_);for(const e of[C,P,U])e&&k.deleteProgram(e.program);N?.dispose(),Se&&k.deleteTexture(Se),O.forEach(e=>k.deleteShader(e)),H&&k.deleteVertexArray(H)}}}},exports.normalizeFieldSettings=E;//# sourceMappingURL=field.cjs.map
+"use strict";var e={none:3,flow:1,orb:2,drift:4,swell:5,caustics:6,contour:7,aurora:8,ripple:9,halo:10,interference:11,mesh:12,cascade:13,constellation:14},t=e=>e?"\nconst float VSCALE=6.;\nvec4 decodeFluid(vec4 t){return vec4((t.xy*2.-1.)*VSCALE,t.z,t.w);}\nvec4 encodeFluid(vec4 v){return vec4(clamp(v.xy/VSCALE*.5+.5,0.,1.),clamp(v.z,0.,1.),1.);}":"\nvec4 decodeFluid(vec4 t){return t;}\nvec4 encodeFluid(vec4 v){return vec4(v.xyz,1.);}",n="#version 300 es\nprecision highp float;\nprecision highp sampler2D;\nuniform vec2 uTexel;\nout vec4 outColor;\nvec2 here(){return gl_FragCoord.xy*uTexel;}\n",r=n+"\nuniform sampler2D uVelocity;\nuniform vec2 uFrom, uTo, uForce;\nuniform float uAspect, uRadius;\nfloat segment(vec2 p,vec2 a,vec2 b){vec2 pa=p-a,ba=b-a;float h=clamp(dot(pa,ba)/max(dot(ba,ba),1e-8),0.,1.);return length(pa-ba*h);}\nvoid main(){\n  vec2 uv=here(),scale=vec2(uAspect,1.);\n  float d=segment(uv*scale,uFrom*scale,uTo*scale);\n  outColor=vec4(texture(uVelocity,uv).xy+uForce*exp(-d*d/(uRadius*uRadius)),0.,1.);\n}",i=n+"\nuniform sampler2D uVelocity;\nvoid main(){\n  vec2 uv=here();\n  float l=texture(uVelocity,uv-vec2(uTexel.x,0.)).y,r=texture(uVelocity,uv+vec2(uTexel.x,0.)).y;\n  float t=texture(uVelocity,uv+vec2(0.,uTexel.y)).x,b=texture(uVelocity,uv-vec2(0.,uTexel.y)).x;\n  outColor=vec4(.5*(r-l-t+b),0.,0.,1.);\n}",o=n+"\nuniform sampler2D uVelocity, uCurl;\nuniform float uStrength, uDt;\nvoid main(){\n  vec2 uv=here();\n  float l=texture(uCurl,uv-vec2(uTexel.x,0.)).x,r=texture(uCurl,uv+vec2(uTexel.x,0.)).x;\n  float t=texture(uCurl,uv+vec2(0.,uTexel.y)).x,b=texture(uCurl,uv-vec2(0.,uTexel.y)).x,c=texture(uCurl,uv).x;\n  vec2 force=.5*vec2(abs(t)-abs(b),abs(r)-abs(l));\n  force=force/(length(force)+1e-4)*uStrength*c;\n  force.y=-force.y;\n  outColor=vec4(clamp(texture(uVelocity,uv).xy+force*uDt,-1000.,1000.),0.,1.);\n}",a=n+"\nuniform sampler2D uVelocity;\nvoid main(){\n  vec2 uv=here(),c=texture(uVelocity,uv).xy;\n  float l=texture(uVelocity,uv-vec2(uTexel.x,0.)).x,r=texture(uVelocity,uv+vec2(uTexel.x,0.)).x;\n  float t=texture(uVelocity,uv+vec2(0.,uTexel.y)).y,b=texture(uVelocity,uv-vec2(0.,uTexel.y)).y;\n  if(uv.x-uTexel.x<0.)l=-c.x;\n  if(uv.x+uTexel.x>1.)r=-c.x;\n  if(uv.y+uTexel.y>1.)t=-c.y;\n  if(uv.y-uTexel.y<0.)b=-c.y;\n  outColor=vec4(.5*(r-l+t-b),0.,0.,1.);\n}",l=n+"\nuniform sampler2D uSource;\nuniform float uAmount;\nvoid main(){outColor=vec4(texture(uSource,here()).x*uAmount,0.,0.,1.);}",s=n+"\nuniform sampler2D uPressure, uDivergence;\nvoid main(){\n  vec2 uv=here();\n  float l=texture(uPressure,uv-vec2(uTexel.x,0.)).x,r=texture(uPressure,uv+vec2(uTexel.x,0.)).x;\n  float t=texture(uPressure,uv+vec2(0.,uTexel.y)).x,b=texture(uPressure,uv-vec2(0.,uTexel.y)).x;\n  outColor=vec4((l+r+b+t-texture(uDivergence,uv).x)*.25,0.,0.,1.);\n}",u=n+"\nuniform sampler2D uPressure, uVelocity;\nvoid main(){\n  vec2 uv=here();\n  float l=texture(uPressure,uv-vec2(uTexel.x,0.)).x,r=texture(uPressure,uv+vec2(uTexel.x,0.)).x;\n  float t=texture(uPressure,uv+vec2(0.,uTexel.y)).x,b=texture(uPressure,uv-vec2(0.,uTexel.y)).x;\n  outColor=vec4(texture(uVelocity,uv).xy-vec2(r-l,t-b),0.,1.);\n}",c=n+"\nuniform sampler2D uVelocity;\nuniform float uDt, uDissipation;\nvoid main(){\n  vec2 uv=here();\n  vec2 back=uv-uDt*texture(uVelocity,uv).xy*uTexel;\n  outColor=vec4(texture(uVelocity,back).xy/(1.+uDissipation*uDt),0.,1.);\n}";var f=class{constructor(e,t){this.previous=null,this.peak=0,this.width=e,this.height=t;const n=e*t;this.pixels=new Uint8Array(4*n),this.signal=new Float32Array(n),this.offsetX=new Float32Array(n),this.offsetY=new Float32Array(n),this.driftX=new Float32Array(n),this.driftY=new Float32Array(n),this.u=new Float32Array(n),this.v=new Float32Array(n),this.ink=new Float32Array(n),this.a=new Float32Array(n),this.b=new Float32Array(n),this.c=new Float32Array(n),this.pressure=new Float32Array(n),this.pressureNext=new Float32Array(n),this.divergence=new Float32Array(n),this.curl=new Float32Array(n)}get active(){return this.peak>2e-4}clear(){for(const e of[this.u,this.v,this.ink,this.a,this.b,this.c,this.pressure,this.pressureNext,this.divergence,this.curl,this.signal,this.pixels,this.offsetX,this.offsetY,this.driftX,this.driftY])e.fill(0);this.previous=null,this.peak=0}leave(){this.previous=null}move(e,t,n,r=performance.now()){if(!Number.isFinite(e+t+n+r))return;e=Math.max(0,Math.min(1,e)),t=Math.max(0,Math.min(1,t)),n=Math.max(.1,Math.min(1,n));const i=this.previous;if(this.previous={x:e,y:t,time:r},!i)return;const o=(e-i.x)*(this.width-1),a=(t-i.y)*(this.height-1),l=Math.hypot(o,a);if(l<.001)return;const s=Math.min(this.width,this.height),u=r>i.time?Math.max(1/240,(r-i.time)/1e3):1/60,c=Math.min(12,l/s/u),f=1-Math.exp(-c/2.2),h=s*(.022+.075*n)*(.65+.95*f),d=Math.min(128,Math.max(1,Math.ceil(l/(.4*h)))),m=l/h*(.32+.22*f)/d,v=o/l,p=a/l,g=-p,x=v,y=l*(2+18*f)/d;for(let n=0;n<d;n++){const r=(n+.5)/d,o=(i.x+(e-i.x)*r)*(this.width-1),a=(i.y+(t-i.y)*r)*(this.height-1),l=Math.max(1,Math.floor(o-3*h)),s=Math.min(this.width-2,Math.ceil(o+3*h)),u=Math.max(1,Math.floor(a-3*h)),c=Math.min(this.height-2,Math.ceil(a+3*h));for(let e=u;e<=c;e++)for(let t=l;t<=s;t++){const n=((t-o)*v+(e-a)*p)/h,r=((t-o)*g+(e-a)*x)/h,i=Math.exp(-n*n*.65-r*r*1.7),l=e*this.width+t;this.ink[l]=1-(1-this.ink[l])*Math.exp(-i*m);const s=1-r*r*.55,u=n*r*.7;this.u[l]=Math.max(-80,Math.min(80,this.u[l]+(v*s+g*u)*i*y)),this.v[l]=Math.max(-80,Math.min(80,this.v[l]+(p*s+x*u)*i*y))}}this.peak=1}read(e,t,n){const r=0|(t=Math.max(.5,Math.min(this.width-1.5,t))),i=0|(n=Math.max(.5,Math.min(this.height-1.5,n))),o=t-r,a=n-i,l=i*this.width+r;return(e[l]*(1-o)+e[l+1]*o)*(1-a)+(e[l+this.width]*(1-o)+e[l+this.width+1]*o)*a}sample(e,t){return this.read(this.signal,e*(this.width-1),t*(this.height-1))}displacement(e,t,n){n[0]=this.read(this.offsetX,e*(this.width-1),t*(this.height-1)),n[1]=this.read(this.offsetY,e*(this.width-1),t*(this.height-1))}step(e){if(!this.active||!Number.isFinite(e))return;let t=Math.max(0,Math.min(.05,e));const n=this.width,r=this.height;for(;t>1e-7;){const e=Math.min(1/60,t);t-=e;const i=Math.exp(-1.9*e),o=Math.exp(-3.2*e);for(let t=1;t<r-1;t++)for(let a=1;a<n-1;a++){const l=t*n+a,s=Math.max(.5,Math.min(n-1.5,a-this.u[l]*e)),u=Math.max(.5,Math.min(r-1.5,t-this.v[l]*e)),c=0|s,f=0|u,h=s-c,d=u-f,m=f*n+c,v=(1-h)*(1-d),p=h*(1-d),g=(1-h)*d,x=h*d;this.a[l]=(this.u[m]*v+this.u[m+1]*p+this.u[m+n]*g+this.u[m+n+1]*x)*i,this.b[l]=(this.v[m]*v+this.v[m+1]*p+this.v[m+n]*g+this.v[m+n+1]*x)*i,this.c[l]=(this.ink[m]*v+this.ink[m+1]*p+this.ink[m+n]*g+this.ink[m+n+1]*x)*o}[this.u,this.a]=[this.a,this.u],[this.v,this.b]=[this.b,this.v],[this.ink,this.c]=[this.c,this.ink];for(let e=1;e<r-1;e++)for(let t=1;t<n-1;t++){const r=e*n+t;this.curl[r]=.5*(this.v[r+1]-this.v[r-1]-this.u[r+n]+this.u[r-n])}for(let t=1;t<r-1;t++)for(let r=1;r<n-1;r++){const i=t*n+r,o=Math.abs(this.curl[i+1])-Math.abs(this.curl[i-1]),a=Math.abs(this.curl[i+n])-Math.abs(this.curl[i-n]),l=Math.hypot(o,a)+1e-4,s=this.curl[i]*e*10,u=Math.hypot(this.u[i],this.v[i]);this.u[i]+=a/l*s,this.v[i]-=o/l*s;const c=Math.min(1,u/(Math.hypot(this.u[i],this.v[i])+1e-6));this.u[i]*=c,this.v[i]*=c,this.divergence[i]=-.5*(this.u[i+1]-this.u[i-1]+this.v[i+n]-this.v[i-n])}this.pressure.fill(0);for(let e=0;e<4;e++){for(let e=1;e<r-1;e++)for(let t=1;t<n-1;t++){const r=e*n+t;this.pressureNext[r]=.25*(this.divergence[r]+this.pressure[r-1]+this.pressure[r+1]+this.pressure[r-n]+this.pressure[r+n])}[this.pressure,this.pressureNext]=[this.pressureNext,this.pressure]}let a=0;for(let t=1;t<r-1;t++)for(let r=1;r<n-1;r++){const i=t*n+r;this.u[i]=Math.max(-80,Math.min(80,this.u[i]-.5*(this.pressure[i+1]-this.pressure[i-1]))),this.v[i]=Math.max(-80,Math.min(80,this.v[i]-.5*(this.pressure[i+n]-this.pressure[i-n]))),this.driftX[i]+=(3.6*this.u[i]-58*this.offsetX[i]-12*this.driftX[i])*e,this.driftY[i]+=(3.6*this.v[i]-58*this.offsetY[i]-12*this.driftY[i])*e,this.offsetX[i]=Math.max(-2,Math.min(2,this.offsetX[i]+this.driftX[i]*e)),this.offsetY[i]=Math.max(-2,Math.min(2,this.offsetY[i]+this.driftY[i]*e)),this.signal[i]=1-Math.exp(.06*-Math.hypot(this.u[i],this.v[i])-.16*this.ink[i]),a=Math.max(a,this.signal[i])}this.peak=a}if(this.active)for(let e=0;e<this.ink.length;e++){const t=Math.round(65535*Math.min(1,this.signal[e]));this.pixels[4*e]=t>>>8,this.pixels[4*e+1]=255&t,this.pixels[4*e+2]=Math.round(128+63.5*this.offsetX[e]),this.pixels[4*e+3]=Math.round(128+63.5*this.offsetY[e])}else this.clear()}},h=["none","flow","orb","drift","swell","caustics","contour","aurora","ripple","halo","interference","mesh","cascade","constellation"],d=["glyph","dot","pixel","mosaic","lego","voxel","disco","dither","hex","led","cmyk","stipple","engraving","crosshatch","woodblock","risograph","pointillism"],m={radius:.13,strength:.5,trail:.45,follow:12},v={strength:.55,radius:.45},p={radius:.075,force:1,dissipation:1.6,refraction:.03,glow:.55,resolution:128,curl:24},g={charset:" .,:-=+*#%@",cellSize:12,cellAspect:1,cellFit:"pixel",font:'ui-monospace, "SF Mono", Menlo, Consolas, monospace',fontWeight:500,glyphScale:.8,mark:"glyph",dotScale:.9,color:"ink",ink:"#f3ba32",highlight:"auto",background:"transparent",brightness:0,contrast:1,gamma:1,invert:!1,levels:"auto",blend:"auto",saturation:1.1,shade:.5,backdrop:0,fit:"cover",focus:{x:.5,y:.5},vignette:0,drift:0,scene:"flow",scale:1,clear:!1,speed:1,hover:"fluid",fluid:p,lantern:m,trail:v,maxPixelRatio:2,respectReducedMotion:!0},x=(e,t,n,r)=>"number"==typeof e&&Number.isFinite(e)?Math.min(n,Math.max(t,e)):r,y=(e,t)=>"string"==typeof e&&/^#([\da-f]{3}|[\da-f]{6})$/i.test(e.trim())?e.trim().toLowerCase():t;function b(e){const t=Intl.Segmenter;return(t?Array.from(new t(void 0,{granularity:"grapheme"}).segment(e),e=>e.segment):Array.from(e)).filter(e=>"\n"!==e&&"\r"!==e&&"\t"!==e).slice(0,256)}function E(e={},t=g){const n="string"==typeof e.charset&&b(e.charset).length>=2?e.charset:t.charset,r=t.fluid||p,i=void 0===e.fluid?t.fluid:e.fluid,o=!1!==i&&(()=>{const e=!0!==i&&i?{...r,...i}:r;return{radius:x(e.radius,.005,.5,p.radius),force:x(e.force,0,8,p.force),dissipation:x(e.dissipation,.05,20,p.dissipation),refraction:x(e.refraction,0,.5,p.refraction),glow:x(e.glow,0,2,p.glow),resolution:Math.round(x(e.resolution,16,512,p.resolution)),curl:x(e.curl,0,80,p.curl)}})(),a=h.includes(e.scene)?e.scene:t.scene,l=!!e.clear&&"object"==typeof e.clear&&("element"in e.clear||"nodeType"in e.clear),s=void 0===e.clear||l?t.clear:e.clear,u=!!s&&{x:x(s.x,-.5,1.5,.25),y:x(s.y,-.5,1.5,.3),width:x(s.width,0,2,.5),height:x(s.height,0,2,.4),feather:x(s.feather,.005,1,.12),shape:"rect"===s.shape?"rect":"ellipse"};return{charset:n,cellSize:x(e.cellSize,3,96,t.cellSize),cellAspect:x(e.cellAspect,.3,2,t.cellAspect),cellFit:"fill"===e.cellFit||"pixel"===e.cellFit?e.cellFit:t.cellFit,font:"string"==typeof e.font&&e.font.trim()?e.font:t.font,fontWeight:Math.round(x(e.fontWeight,100,900,t.fontWeight)),glyphScale:x(e.glyphScale,.3,1.6,t.glyphScale),mark:d.includes(e.mark)?e.mark:t.mark,dotScale:x(e.dotScale,.1,1.4,t.dotScale),color:"source"===e.color||"ink"===e.color?e.color:t.color,ink:y(e.ink,t.ink),highlight:"auto"===e.highlight?"auto":y(e.highlight,t.highlight),background:"transparent"===e.background?"transparent":y(e.background,t.background),brightness:x(e.brightness,-1,1,t.brightness),contrast:x(e.contrast,0,4,t.contrast),gamma:x(e.gamma,.2,5,t.gamma),invert:"boolean"==typeof e.invert?e.invert:t.invert,levels:"none"===e.levels||"auto"===e.levels?e.levels:t.levels,blend:"auto"===e.blend||"coarse"===e.blend||"on"===e.blend||"off"===e.blend?e.blend:t.blend,saturation:x(e.saturation,0,3,t.saturation),shade:x(e.shade,0,1,t.shade),backdrop:x(e.backdrop,0,1,t.backdrop),fit:"contain"===e.fit||"cover"===e.fit?e.fit:t.fit,focus:{x:x(e.focus?.x,0,1,t.focus.x),y:x(e.focus?.y,0,1,t.focus.y)},vignette:x(e.vignette,0,1,t.vignette),drift:x(e.drift,0,2,t.drift),scene:a,scale:x(e.scale,.2,6,t.scale),clear:u,speed:x(e.speed,0,5,t.speed),hover:"fluid"===e.hover||"lantern"===e.hover||"trail"===e.hover||"none"===e.hover?e.hover:t.hover,fluid:o,lantern:{radius:x(e.lantern?.radius,.02,.6,t.lantern.radius),strength:x(e.lantern?.strength,0,1.5,t.lantern.strength),trail:x(e.lantern?.trail,0,3,t.lantern.trail),follow:x(e.lantern?.follow,1,60,t.lantern.follow)},trail:{strength:x(e.trail?.strength,0,1,t.trail.strength),radius:x(e.trail?.radius,.1,1,t.trail.radius)},maxPixelRatio:x(e.maxPixelRatio,.5,4,t.maxPixelRatio),respectReducedMotion:"boolean"==typeof e.respectReducedMotion?e.respectReducedMotion:t.respectReducedMotion}}function w(e,t,n,r,i,o={x:.5,y:.5}){if(!(e>0&&t>0&&n>0&&r>0))return{scale:[1,1],offset:[0,0]};const a=e/t,l=n/r,s=l>a,u="cover"===i?s?[a/l,1]:[1,l/a]:s?[1,l/a]:[a/l,1];return{scale:u,offset:"cover"===i?[(1-u[0])*o.x,(1-u[1])*o.y]:[.5*(1-u[0]),.5*(1-u[1])]}}function T(e,t,n,r){const i=Math.max(2,Math.round(e*n)),o=Math.max(2,Math.round(i*t)),a=Math.min(16,Math.max(1,r)),l=Math.ceil(r/a);return{width:o,height:i,columns:a,rows:l,atlasWidth:a*o,atlasHeight:l*i}}function M(e){const t=e.replace("#",""),n=3===t.length?t.split("").map(e=>e+e).join(""):t,r=Number.parseInt(n,16);return Number.isFinite(r)&&6===n.length?[(r>>16&255)/255,(r>>8&255)/255,(255&r)/255]:[0,0,0]}function R(e){const t=new Uint32Array(256);let n=0;for(let r=0;r+3<e.length;r+=4)e[r+3]<8||(t[Math.round(.2126*e[r]+.7152*e[r+1]+.0722*e[r+2])]++,n++);if(!n)return[0,1];const r=e=>{let r=0;for(let i=0;i<256;i++)if(r+=t[i],r>=n*e)return i/255;return 1},i=r(.02),o=r(.98);return o-i<.08?[0,1]:[i,o]}var F=e=>"fluid"!==e.hover||e.fluid?e.hover:"none";function A(e,t,n=24,r=.12,i="ellipse"){return e.width>0&&e.height>0&&{x:(t.left-n-e.left)/e.width,y:(t.top-n-e.top)/e.height,width:(t.width+2*n)/e.width,height:(t.height+2*n)/e.height,feather:r,shape:i}}var k,S=/\.(mp4|webm|mov|m4v|ogv)(\?|#|$)/i,L=/swiftshader|llvmpipe|softpipe|software|basic render/i;function D(){if(k)return k;if("undefined"==typeof document||void 0===globalThis.WebGL2RenderingContext)return k="none";try{const e=document.createElement("canvas").getContext("webgl2");if(!e)return k="none";const t=e.getExtension("WEBGL_debug_renderer_info"),n=String(e.getParameter(t?t.UNMASKED_RENDERER_WEBGL:e.RENDERER)??"");return e.getExtension("WEBGL_lose_context")?.loseContext(),k=L.test(n)?"software":"gpu"}catch{return k="none"}}exports.DEFAULT_FIELD_FLUID=p,exports.DEFAULT_FIELD_LANTERN=m,exports.DEFAULT_FIELD_SETTINGS=g,exports.DEFAULT_FIELD_TRAIL=v,exports.FIELD_HOVERS=[{value:"fluid",label:"Fluid",description:"An ink-in-water wake that bends the image and swirls the characters."},{value:"lantern",label:"Lantern",description:"A soft light follows the pointer and lifts the characters it passes, without distortion."},{value:"trail",label:"Trail",description:"The Asciify Trail: in the wake, sparse characters fill in and dense ones open up, then settle. No distortion."},{value:"none",label:"Off",description:"The field stays still under the pointer."}],exports.FIELD_MARKS=d,exports.FIELD_SCENES=h,exports.activeFieldHover=F,exports.fieldCellLayout=T,exports.fieldClearFromRects=A,exports.fieldGlyphs=b,exports.fieldLevels=R,exports.fieldSourceRect=w,exports.glyphFieldTier=D,exports.isGlyphFieldSupported=function(e={}){const t=D();return"gpu"===t||"software"===t&&!!e.allowSoftware},exports.mountGlyphField=function(n,h={}){const m=e=>"undefined"!=typeof HTMLElement&&e instanceof HTMLElement,v=e=>{const t=e.clear;return m(t)?{element:{element:t},rest:{...e,clear:void 0}}:t&&"object"==typeof t&&m(t.element)?{element:t,rest:{...e,clear:void 0}}:{element:null,rest:e}};let p=v(h).element,g=E(v(h).rest);const x=h.onError,y=n.getContext("webgl2",{alpha:!0,antialias:!1,depth:!1,stencil:!1,premultipliedAlpha:!0,powerPreference:"high-performance"});if(!y)throw new Error("WebGL2 is not available for the glyph field.");const k=y;n.setAttribute("role","img"),n.setAttribute("aria-label",h.label??"ASCII artwork"),n.dataset.renderer="glyph-field";let L=!1;const D=k.getExtension("KHR_parallel_shader_compile");let _,C,P=null,U=null,I=null,B=null,N=[],X=[],G=null,H=!1,q=null,V=null;const O=[];let z=0,j=0,W=1,Y=0,K=T(g.cellSize,g.cellAspect,1,2),$=2,J=0,Q=0,Z=0,ee=null,te=!1,ne=null,re=0,ie=0,oe=0,ae=null,le=0,se=!0,ue=0,ce=[0,1],fe=-1/0,he=0,de=0,me=0,ve=!0,pe=!1,ge=!1,xe=!1,ye=!1,be=!0,Ee=null,we=null,Te=1/60,Me=0,Re=0,Fe=[];const Ae=new Float32Array(16),ke=()=>{if(!p)return;const{element:e,padding:t=32,feather:r=.16,shape:i="rect"}=p,o=A(n.getBoundingClientRect(),e.getBoundingClientRect(),t,r,i),a=g.clear;JSON.stringify(a)!==JSON.stringify(o)&&(g={...g,clear:o},ve=!0)},Se={target:null,at:null,strength:0,trail:[]},Le=new Float32Array(36);let De=null,_e=null,Ce=!1;const Pe=()=>{if(!z||!j)return null;const e=z/j,t=Math.round(e>=1?128:128*e),n=Math.round(e>=1?128/e:128);return De&&De.width===t&&De.height===n||(De=new f(t,n),_e||(_e=je(k.LINEAR)),k.bindTexture(k.TEXTURE_2D,_e),k.texImage2D(k.TEXTURE_2D,0,k.RGBA8,t,n,0,k.RGBA,k.UNSIGNED_BYTE,De.pixels),Ce=!0),De};let Ue=0;const Ie="function"==typeof matchMedia?matchMedia("(prefers-reduced-motion: reduce)"):null,Be=()=>g.respectReducedMotion&&!!Ie?.matches;let Ne;const Xe=new Promise(e=>{Ne=e});let Ge=!0;const He=e=>x?.(e instanceof Error?e:new Error(String(e))),qe=(e,t)=>{const n=k.createShader(e);return O.push(n),k.shaderSource(n,t),k.compileShader(n),n},Ve=e=>{V??(V=qe(k.VERTEX_SHADER,"#version 300 es\nvoid main(){vec2 p=vec2((gl_VertexID<<1)&2,gl_VertexID&2);gl_Position=vec4(p*2.-1.,0.,1.);}"));const t=k.createProgram(),n=qe(k.FRAGMENT_SHADER,e);return k.attachShader(t,V),k.attachShader(t,n),k.linkProgram(t),{program:t,locations:null,fragment:n}},Oe=(e,t=!1)=>{if(e.locations)return!0;const{program:n,fragment:r}=e;if(!t&&D&&!k.getProgramParameter(n,D.COMPLETION_STATUS_KHR))return!1;if(!k.getProgramParameter(n,k.LINK_STATUS)){if(k.isContextLost())return!1;throw new Error(k.getShaderInfoLog(r)||k.getProgramInfoLog(n)||"Glyph field program failed to link.")}const i={};for(let e=k.getProgramParameter(n,k.ACTIVE_UNIFORMS)-1;e>=0;e--){const t=k.getActiveUniform(n,e).name.replace(/\[0\]$/,"");i[t]=k.getUniformLocation(n,t)}return e.locations=i,!0},ze=(e=!1)=>!!P&&!!U&&Oe(P,e)&&Oe(U,e),je=e=>{const t=k.createTexture();return k.bindTexture(k.TEXTURE_2D,t),k.texParameteri(k.TEXTURE_2D,k.TEXTURE_MIN_FILTER,e),k.texParameteri(k.TEXTURE_2D,k.TEXTURE_MAG_FILTER,e===k.LINEAR_MIPMAP_LINEAR?k.LINEAR:e),k.texParameteri(k.TEXTURE_2D,k.TEXTURE_WRAP_S,k.CLAMP_TO_EDGE),k.texParameteri(k.TEXTURE_2D,k.TEXTURE_WRAP_T,k.CLAMP_TO_EDGE),t},We=()=>{B&&(k.deleteTexture(B.ink),k.deleteTexture(B.under),k.deleteFramebuffer(B.buffer),B=null)},Ye=()=>function(e,t,n,r,i,o,a){if("fill"!==e||!(i>0&&o>0))return[a.width,a.height];const l=t*r,s=l*n;return[i/Math.max(1,Math.floor(i/s+1e-6)),o/Math.max(1,Math.floor(o/l+1e-6))]}(g.cellFit,g.cellSize,g.cellAspect,W,z,j,K),Ke=()=>!!g.fluid&&"fluid"===F(g),$e=()=>{G?.release(),H=!1,N.forEach(e=>k.deleteTexture(e)),X.forEach(e=>k.deleteFramebuffer(e)),N=[],X=[]};function Je(){I&&k.deleteProgram(I.program),I=Ve((e=>`#version 300 es\nprecision highp float;\nprecision highp sampler2D;\nuniform sampler2D uPrevious;\nuniform vec2 uSize;\nuniform float uAspect, uDt, uDecay, uEnergyDecay, uRadius, uSplat;\nuniform vec2 uFrom, uTo, uForce;\nout vec4 outColor;\n${t(e)}\nfloat segment(vec2 p,vec2 a,vec2 b){vec2 pa=p-a,ba=b-a;float h=clamp(dot(pa,ba)/max(dot(ba,ba),1e-8),0.,1.);return length(pa-ba*h);}\nvoid main(){\n  vec2 uv=gl_FragCoord.xy/uSize;\n  vec4 here=decodeFluid(texture(uPrevious,uv));\n  vec4 state=decodeFluid(texture(uPrevious,uv-uDt*here.xy*vec2(1./uAspect,1.)));\n  state.xy*=exp(-uDt*uDecay);\n  state.z*=exp(-uDt*uEnergyDecay);\n  if(uSplat>.5){\n    vec2 scale=vec2(uAspect,1.);\n    float d=segment(uv*scale,uFrom*scale,uTo*scale);\n    float g=exp(-d*d/(uRadius*uRadius));\n    state.xy+=uForce*g;\n    state.z=min(1.,state.z+g*min(1.,length(uForce)*.5+.08));\n  }\n  float speed=length(state.xy);\n  if(speed>5.)state.xy*=5./speed;\n  outColor=encodeFluid(state);\n}`)(L)),G?.dispose(),G=L?null:function(e,t,n){const f={splat:t(r),curl:t(i),vorticity:t(o),divergence:t(a),fade:t(l),pressure:t(s),gradient:t(u),advect:t(c)},h=Object.values(f);let d=0,m=0,v=[],p=[],g=null,x=null;const y=t=>{const n=e.createTexture();e.bindTexture(e.TEXTURE_2D,n),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,t),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,t),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.texImage2D(e.TEXTURE_2D,0,e.RGBA16F,d,m,0,e.RGBA,e.HALF_FLOAT,null);const r=e.createFramebuffer();return e.bindFramebuffer(e.FRAMEBUFFER,r),e.framebufferTexture2D(e.FRAMEBUFFER,e.COLOR_ATTACHMENT0,e.TEXTURE_2D,n,0),e.checkFramebufferStatus(e.FRAMEBUFFER)!==e.FRAMEBUFFER_COMPLETE?(e.deleteFramebuffer(r),e.deleteTexture(n),null):(e.viewport(0,0,d,m),e.clearColor(0,0,0,1),e.clear(e.COLOR_BUFFER_BIT),{texture:n,buffer:r})},b=t=>{t&&(e.deleteTexture(t.texture),e.deleteFramebuffer(t.buffer))},E=()=>{[...v,...p,g,x].forEach(b),v=[],p=[],g=x=null},w=(t,n)=>{const r=t.locations;return e.useProgram(t.program),e.bindFramebuffer(e.FRAMEBUFFER,n.buffer),e.uniform2f(r.uTexel,1/d,1/m),r},T=(t,n,r,i)=>{e.activeTexture(e.TEXTURE0+r),e.bindTexture(e.TEXTURE_2D,i),e.uniform1i(t[n],r)},M=()=>e.drawArrays(e.TRIANGLES,0,3),R=e=>{const t=e[0];e[0]=e[1],e[1]=t};return{resize(t,n){E(),d=t,m=n;const r=[y(e.LINEAR),y(e.LINEAR),y(e.NEAREST),y(e.NEAREST),y(e.NEAREST),y(e.NEAREST)];return e.bindFramebuffer(e.FRAMEBUFFER,null),r.some(e=>!e)?(r.forEach(b),!1):(v=[r[0],r[1]],p=[r[2],r[3]],g=r[4],x=r[5],!0)},ready:()=>h.every(n),step(t,n){if(!v.length||!g||!x)return;let r;e.viewport(0,0,d,m),t&&(r=w(f.splat,v[1]),T(r,"uVelocity",0,v[0].texture),e.uniform2f(r.uFrom,t.from[0],t.from[1]),e.uniform2f(r.uTo,t.to[0],t.to[1]),e.uniform2f(r.uForce,t.force[0],t.force[1]),e.uniform1f(r.uAspect,n.aspect),e.uniform1f(r.uRadius,n.radius),M(),R(v)),n.curl>0&&(r=w(f.curl,x),T(r,"uVelocity",0,v[0].texture),M(),r=w(f.vorticity,v[1]),T(r,"uVelocity",0,v[0].texture),T(r,"uCurl",1,x.texture),e.uniform1f(r.uStrength,n.curl),e.uniform1f(r.uDt,n.dt),M(),R(v)),r=w(f.divergence,g),T(r,"uVelocity",0,v[0].texture),M(),r=w(f.fade,p[1]),T(r,"uSource",0,p[0].texture),e.uniform1f(r.uAmount,.8),M(),R(p);for(let e=0;e<20;e++)r=w(f.pressure,p[1]),T(r,"uPressure",0,p[0].texture),T(r,"uDivergence",1,g.texture),M(),R(p);r=w(f.gradient,v[1]),T(r,"uPressure",0,p[0].texture),T(r,"uVelocity",1,v[0].texture),M(),R(v),r=w(f.advect,v[1]),T(r,"uVelocity",0,v[0].texture),e.uniform1f(r.uDt,n.dt),e.uniform1f(r.uDissipation,n.dissipation),M(),R(v),e.bindFramebuffer(e.FRAMEBUFFER,null)},get velocity(){return v[0]?.texture??null},get size(){return[d,m]},release:E,dispose(){E(),h.forEach(({program:t})=>e.deleteProgram(t))}}}(k,Ve,e=>Oe(e))}const Qe=()=>{$e();const e=g.fluid;if(!(e&&Ke()&&z&&j))return;I||Je();const t=e.resolution,n=z/j;if(J=n>=1?t:Math.max(8,Math.round(t*n)),Q=n>=1?Math.max(8,Math.round(t/n)):t,H=!!G&&G.resize(J,Q),H)return void(Z=0);const r=()=>{$e();for(let e=0;e<2;e++){const e=je(k.LINEAR);k.texImage2D(k.TEXTURE_2D,0,L?k.RGBA8:k.RGBA16F,J,Q,0,k.RGBA,L?k.UNSIGNED_BYTE:k.HALF_FLOAT,null);const t=k.createFramebuffer();k.bindFramebuffer(k.FRAMEBUFFER,t),k.framebufferTexture2D(k.FRAMEBUFFER,k.COLOR_ATTACHMENT0,k.TEXTURE_2D,e,0),N.push(e),X.push(t)}return k.checkFramebufferStatus(k.FRAMEBUFFER)===k.FRAMEBUFFER_COMPLETE};if(!r()){if(L)throw new Error("The glyph field could not allocate its fluid buffers.");L=!0,Ze(),Je(),r()}for(const e of X)k.bindFramebuffer(k.FRAMEBUFFER,e),k.viewport(0,0,J,Q),k.clearColor(L?.5:0,L?.5:0,0,1),k.clear(k.COLOR_BUFFER_BIT);k.bindFramebuffer(k.FRAMEBUFFER,null),Z=0};function Ze(){P&&k.deleteProgram(P.program),U&&k.deleteProgram(U.program),We(),P=Ve((e=>`#version 300 es\nprecision highp float;\nprecision highp sampler2D;\nuniform sampler2D uSource, uFluid;\nuniform vec2 uResolution, uCell;\nuniform float uCount, uBlend;\nconst float BAYER[16]=float[16](0.,8.,2.,10.,12.,4.,14.,6.,3.,11.,1.,9.,15.,7.,13.,5.);\nuniform vec4 uSourceMap;\nuniform int uScene;\nuniform vec3 uInk, uHighlight;\nuniform vec4 uBackground;\nuniform float uBrightness, uContrast, uGamma, uInvert, uVignette, uSourceColor;\nuniform float uRefraction, uGlow, uTime, uDrift, uFluidOn, uLod, uSaturation, uBackdrop, uShade, uHighlightAuto, uFluidMode;\nuniform vec2 uFluidTexel;\nuniform int uHoverMode;\nuniform vec3 uLight;\nuniform vec3 uTrail[12];\nuniform float uLightRadius, uLightGain, uClock, uFlicker, uTrailAmount;\nuniform sampler2D uTrailMap;\nuniform vec2 uLevels;\nuniform int uMark;\nuniform float uScale, uClearFeather, uClearShape;\nuniform vec4 uClear;\nuniform vec4 uPulse[4];\nlayout(location=0) out vec4 outInk;\nlayout(location=1) out vec4 outUnder;\n${t(e)}\nfloat hash(vec2 p){p=fract(p*vec2(123.34,456.21));p+=dot(p,p+45.32);return fract(p.x*p.y);}\nfloat noise(vec2 p){vec2 i=floor(p),f=fract(p),u=f*f*(3.-2.*f);\n  return mix(mix(hash(i),hash(i+vec2(1,0)),u.x),mix(hash(i+vec2(0,1)),hash(i+vec2(1,1)),u.x),u.y);}\nfloat fbm(vec2 p){float v=0.,a=.5;for(int i=0;i<5;i++){v+=a*noise(p);p=p*2.03+vec2(1.7,9.2);a*=.5;}return v;}\nvec3 generated(vec2 uv,float aspect){\n  vec2 p=(uv-.5)*vec2(aspect,1.)*uScale;\n  if(uScene==1){\n    float t=uTime*.08;\n    vec2 q=vec2(fbm(p*1.6+t),fbm(p*1.6-t+3.1));\n    return vec3(smoothstep(.28,.86,fbm(p*1.8+q*1.6+vec2(t*.6,-t*.4))));\n  }\n  if(uScene==2){\n    float r=.36,d=length(p),a=uTime*.25;\n    vec3 l=normalize(vec3(cos(a)*.8,.55,sin(a)*.6+.6));\n    if(d<r){\n      vec3 n=normalize(vec3(p.x,-p.y,sqrt(r*r-d*d)));\n      float diffuse=max(dot(n,l),0.),rim=pow(1.-n.z,2.5);\n      float lon=atan(n.x,n.z)+uTime*.35,lat=asin(clamp(n.y,-1.,1.));\n      float bands=.5+.25*sin(lat*14.)+.25*sin(lon*6.);\n      return vec3(clamp(diffuse*.85+rim*.5+bands*.12,0.,1.));\n    }\n    return vec3(exp(-pow((d-r)*9.,2.))*.35);\n  }\n  if(uScene==4){\n    // Drift: a few broad lobes that wander slowly. Built for halftone, where large soft shapes read best.\n    float t=uTime*.045;\n    vec2 q=p*1.15;\n    vec2 w=vec2(fbm(q*.7+vec2(t,-t*.7)),fbm(q*.7+vec2(4.3-t*.8,t+1.7)));\n    float n=fbm(q+w*1.3+vec2(t*.4,t*.25));\n    return vec3(smoothstep(.36,.74,n));\n  }\n  if(uScene==5){\n    // Swell: three crossing swells, the second bent by the first, so crests roll diagonally instead of pooling.\n    float t=uTime;\n    float s=sin((dot(p,vec2(.94,.33))/.95-t/9.)*6.2831853);\n    float c=sin((dot(p,vec2(.6,-.8))/.58-t/13.)*6.2831853+s*.9);\n    float k=sin((dot(p,vec2(-.29,.96))/.36+t/17.)*6.2831853);\n    return vec3(smoothstep(.3,.9,.5+.5*(s*.5+c*.35+k*.15)));\n  }\n  // The kit's background scenes. Each starts a little way in, so a reduced-motion still is already composed.\n  float t=uTime+40.,px=uCell.y/uResolution.y*uScale;\n  if(uScene==6){\n    // Caustics: light focused by a moving water surface. Two layers of warped sine waves drift against each other; each draws\n    // smooth filaments along its zero line, about a character wide, and where filaments of the two layers cross the light pools.\n    float tt=t*.12,light=0.;\n    for(int l=0;l<2;l++){\n      float f=float(l),sc=5.4+f*2.4;\n      vec2 q=(l==0?p:mat2(.8,-.6,.6,.8)*p)*sc;\n      q+=vec2(sin(q.y*.45+tt*(1.+f*.3)),cos(q.x*.4-tt*(.8+f*.4)))*1.3;\n      float v=sin(q.x+1.4*sin(q.y*.7+tt))+sin(q.y*1.1+1.2*sin(q.x*.8-tt*1.3))*.9;\n      float wv=max(fwidth(v),1e-4);\n      light+=(1.-smoothstep(.2,1.5,abs(v)/wv))*(l==0?.62:.5)+exp(-abs(v)/(wv*5.))*.18;\n    }\n    float pulse=.82+.18*sin(tt*3.+p.x*1.7-p.y*1.1);\n    return vec3(clamp(light*light*pulse,0.,1.));\n  }\n  if(uScene==7){\n    // Contour: a slow terrain read as survey lines about a character wide at any size; every fifth is an index line.\n    float tt=t*.02;\n    vec2 q=p*1.15+vec2(tt,-tt*.6);\n    float h=noise(q)*.62+noise(q*2.07+3.1)*.27+noise(q*4.3-tt+7.)*.11;\n    h+=.08*sin(tt*2.+p.x*.8);\n    float k=h*13.,w=max(fwidth(k),1e-4),d=abs(fract(k+.5)-.5)/w;\n    float major=mod(floor(k+.5),5.)<.5?1.:0.;\n    return vec3((1.-smoothstep(.35,1.25-major*.25,d))*mix(.55,1.,major));\n  }\n  if(uScene==8){\n    // Aurora: two curtains hang from the top in tall vertical folds that ripple slowly sideways. Each is brightest along its\n    // lower hem and fades upward; below the hem the page stays clear.\n    float tt=t*.045,a=0.;\n    for(int n=0;n<2;n++){\n      float f=float(n);\n      float x=p.x+.05*sin(p.y*5.+tt*2.3+f*2.)+.03*sin(p.y*11.-tt*3.1);\n      float hem=-.12+f*.09+.07*sin(x*(1.9+f*.6)+tt*(1.+f*.4)+f*2.4)+.03*sin(x*4.7-tt*1.4);\n      float d=hem-p.y;\n      float body=d>0.?exp(-d/(.26+.06*f))*(.5+.5*exp(-d/.035)):exp(-d*d/.0006);\n      float folds=smoothstep(.3,.8,noise(vec2(x*(3.2+f*1.6)+tt*1.2+f*9.,f*5.+tt*.25)))*.8+.2*smoothstep(.2,.9,noise(vec2(x*11.+tt*2.,f)));\n      float rays=.45+.55*smoothstep(.3,.75,noise(vec2(x*26.+f*17.,tt*.4+f)));\n      a+=body*folds*rays*(1.-f*.3)*2.6;\n    }\n    return vec3(smoothstep(.04,.9,a));\n  }\n  if(uScene==9){\n    // Ripple: still water. Drops land here and there, each a few rings that widen and fade; the pointer drops its own.\n    float tone=0.,g=.72;\n    vec2 q=p/g,id=floor(q);\n    for(int j=-1;j<=1;j++)for(int i=-1;i<=1;i++){\n      vec2 c=id+vec2(i,j),h=vec2(hash(c),hash(c+7.3));\n      float period=5.+h.x*5.,age=fract(t*.3/period*4.+h.y);\n      vec2 at=(c+.2+.6*h)*g;\n      float d=length(p-at),r=age*.62;\n      float rings=max(0.,cos((d-r)*34.))*exp(-pow((d-r)/.11,2.));\n      tone+=rings*pow(1.-age,1.8)*smoothstep(0.,.06,age)*(.7+.3*h.x);\n    }\n    return vec3(clamp(tone*1.25,0.,1.));\n  }\n  if(uScene==10){\n    // Halo: a slow breathing corona round the centre, its rays turning; the middle stays empty for a headline.\n    vec2 e=p*vec2(.74,1.);\n    float d=length(e),a=atan(e.y,e.x),tt=t*.07;\n    float r=.34+.014*sin(tt*3.1);\n    float rays=.5+.5*noise(vec2(a*3.2+tt,tt*.5))*(.6+.4*noise(vec2(a*7.-tt*1.2,3.+tt*.4)));\n    float rim=exp(-pow((d-r)/.03,2.));\n    float corona=exp(-max(0.,d-r)/(.1+.08*rays))*smoothstep(r-.04,r+.015,d)*rays*smoothstep(r+.36,r+.12,d);\n    return vec3(clamp(rim*(.55+.45*rays)+corona*.85,0.,1.));\n  }\n  if(uScene==11){\n    // Interference: two ring grids from slowly orbiting centres. Where they cross, broad moire bands open and close.\n    float tt=t*.05;\n    vec2 a=vec2(-.3+.12*sin(tt),.07*cos(tt*1.3)),b=vec2(.3+.1*cos(tt*.8),-.06*sin(tt*1.1));\n    float f=6.2831853/max(px*4.6,.004);\n    float m=cos(length(p-a)*f)+cos(length(p-b)*f);\n    return vec3(smoothstep(.7,2.,m));\n  }\n  if(uScene==12){\n    // Mesh: four soft lights on slow Lissajous paths, a gradient mesh written in characters.\n    float tt=t*.07,m=0.;\n    for(int n=0;n<4;n++){\n      float f=float(n)*1.7;\n      vec2 c=vec2(.66*sin(tt*(.7+f*.13)+f),.34*cos(tt*(.9-f*.07)+f*1.3));\n      float s=.3+.07*sin(tt+f);\n      m+=exp(-dot(p-c,p-c)/(s*s))*(.8-float(n)*.1);\n    }\n    return vec3(smoothstep(.06,1.1,m));\n  }\n  if(uScene==13){\n    // Cascade: streaks fall in three depths. Far ones are frequent, faint, short and slow; near ones rare, long, bright and\n    // quick. Each has a bright head and a tail that fades behind it, and a column can carry two streaks at once.\n    float tone=0.,cw=uCell.x/uResolution.x,ch=uCell.y/uResolution.y;\n    float col=floor(uv.x/cw+.5);\n    for(int n=0;n<3;n++){\n      float f=float(n);\n      for(int k=0;k<2;k++){\n        float seed=f*13.1+float(k)*41.7,h=hash(vec2(col,seed));\n        if(h<1.-(.5-f*.15))continue;\n        float speed=(.045+f*.07)*(.75+.5*hash(vec2(col,seed+2.)));\n        float tail=.12+f*.16,y=fract(t*speed+hash(vec2(col,seed+5.)))*(1.+tail*2.)-tail;\n        float d=y-uv.y;\n        if(d<0.||d>tail)continue;\n        float head=d<ch*1.2?1.:0.;\n        tone=max(tone,max(head*(.55+f*.22),pow(1.-d/tail,1.7)*(.28+f*.3)));\n      }\n    }\n    return vec3(clamp(tone,0.,1.));\n  }\n  if(uScene==14){\n    // Constellation: points wander in their own cells; neighbours close enough are linked by fine lines. Each point is a\n    // bright core in a soft halo, so it reads at card size as well as full width.\n    float g=.23,tt=t*.18;\n    vec2 q=p/g,id=floor(q);\n    vec2 pts[9];\n    for(int j=-1;j<=1;j++)for(int i=-1;i<=1;i++){\n      vec2 c=id+vec2(i,j);\n      float h=hash(c),k=hash(c+3.7);\n      pts[(j+1)*3+i+1]=c+.5+.36*vec2(sin(tt*(.6+h)+h*6.28),cos(tt*(.5+k)+k*6.28));\n    }\n    float line=0.,star=0.,lw=max(px/g,.02);\n    for(int n=0;n<9;n++){\n      vec2 e=q-pts[n];\n      float d2=dot(e,e),tw=.8+.2*sin(tt*3.+float(n)*1.7);\n      star=max(star,max(exp(-d2/(lw*lw*1.6)),.38*exp(-d2/(lw*lw*7.)))*tw);\n      for(int m=n+1;m<9;m++){\n        vec2 a=pts[n],ba=pts[m]-a;\n        float len=length(ba);\n        if(len>1.35)continue;\n        float hh=clamp(dot(q-a,ba)/dot(ba,ba),0.,1.);\n        float d=length(q-a-ba*hh);\n        line=max(line,(1.-smoothstep(lw*.3,lw*.75,d))*smoothstep(1.35,.6,len)*.72);\n      }\n    }\n    return vec3(clamp(max(line,star),0.,1.));\n  }\n  return vec3(0.);\n}\nvoid main(){\n  vec2 cell=floor(gl_FragCoord.xy);\n  vec2 uv=(cell+.5)*uCell/uResolution;\n  float aspect=uResolution.x/uResolution.y;\n  vec4 fluid=vec4(0.);\n  // lift: signed tone change. The solver's flow brightens one side of each eddy and opens the other into gaps.\n  float lift=0.,wake=0.,bend=1.,swirl=0.,speed=0.;\n  if(uFluidOn>.5){\n    vec4 raw=texture(uFluid,vec2(uv.x,1.-uv.y));\n    if(uFluidMode>.5){\n      vec2 v=raw.xy*uFluidTexel*vec2(aspect,1.);\n      fluid=vec4(v,0.,1.);\n      swirl=clamp(dot(v,vec2(.4,.65))*uGlow*.32,-.65,.65);\n      speed=clamp(length(v)*uGlow*.055,0.,.38);\n      bend=.4;\n    } else {\n      fluid=decodeFluid(raw);\n      wake=clamp(fluid.z*uGlow,0.,1.);\n      lift=wake*.55;\n    }\n  }\n  vec2 drift=uDrift*.006*vec2(sin(uv.y*5.3+uTime*.6),cos(uv.x*4.1-uTime*.5));\n  vec2 sampleAt=uv-vec2(fluid.x/aspect,-fluid.y)*uRefraction*bend+drift;\n  vec3 rgb,glow=vec3(0.);\n  if(uScene==0){\n    vec2 s=sampleAt*uSourceMap.xy+uSourceMap.zw;\n    bool inside=!(s.x<0.||s.y<0.||s.x>1.||s.y>1.);\n    rgb=inside?textureLod(uSource,s,uLod).rgb:vec3(0.);\n    if(uBackdrop>0.){\n      vec2 b=(uv-vec2(fluid.x/aspect,-fluid.y)*uRefraction*bend*.5)*uSourceMap.xy+uSourceMap.zw;\n      glow=(b.x<0.||b.y<0.||b.x>1.||b.y>1.)?vec3(0.):textureLod(uSource,b,uLod+3.).rgb*uBackdrop;\n    }\n  } else rgb=generated(sampleAt,aspect);\n  float tone=dot(rgb,vec3(.2126,.7152,.0722));\n  tone=clamp((tone-uLevels.x)/max(uLevels.y-uLevels.x,.01),0.,1.);\n  tone=clamp((tone-.5)*uContrast+.5+uBrightness,0.,1.);\n  tone=pow(tone,1./uGamma);\n  if(uInvert>.5)tone=1.-tone;\n  float flick=0.,trailFold=0.;\n  if(uHoverMode==2){\n    // Lantern: a soft light and its fading tail lift the characters they pass. Nothing moves the image.\n    vec2 ap=vec2(aspect,1.),d=(uv-uLight.xy)*ap;\n    float r2=uLightRadius*uLightRadius,glowL=uLight.z*exp(-dot(d,d)/r2);\n    for(int i=0;i<12;i++){vec2 e=(uv-uTrail[i].xy)*ap;glowL+=uTrail[i].z*exp(-dot(e,e)/(r2*.55));}\n    glowL=min(glowL,1.);\n    float grain=fract(sin(dot(cell,vec2(12.9898,78.233)))*43758.5453);\n    lift=glowL*uLightGain*(.7+.6*grain);\n    wake=glowL*.4;\n    // A few letters at the light's rim step up the ramp and back, as if being retyped.\n    flick=uFlicker*step(.9,fract(grain*13.7+floor(uClock*7.+grain*5.)*.37))*glowL*(1.-glowL)*4.;\n  }\n  if(uHoverMode==3){\n    // Trail: the studio's ink field, as a 16-bit density. Sparse marks fill in, dense marks open up.\n    vec4 ink=texture(uTrailMap,uv);\n    float density=(ink.r*65280.+ink.g*255.)/65535.*uTrailAmount;\n    float t=clamp(density/.38,0.,1.);\n    trailFold=t*t*(3.-2.*t);\n  }\n  if(uFluidMode>.5&&uHoverMode==1){\n    // Dark ground: any motion lights the characters. Lit ground: the flow lights one side of each eddy and opens the other.\n    // A little cell-to-cell grain keeps the lit area a shimmer of letters rather than a solid block.\n    float grain=fract(sin(dot(cell,vec2(12.9898,78.233)))*43758.5453);\n    lift=mix(abs(swirl)*.5+speed,swirl+speed*.35,smoothstep(.12,.55,tone))*(.65+.7*grain);\n    wake=clamp(lift*1.6,0.,1.);\n  }\n  tone=clamp(tone+lift,0.,1.);\n  tone+=(1.-2.*tone)*trailFold;\n  // Pulses: rings sent by the interface (field.pulse()), e.g. on a save or a notification.\n  for(int i=0;i<4;i++){\n    if(uPulse[i].w<=0.)continue;\n    float dist=length((uv-uPulse[i].xy)*vec2(aspect,1.)),front=uPulse[i].z*.95;\n    float ring=exp(-pow((dist-front)/.1,2.))*uPulse[i].w*exp(-uPulse[i].z*.85);\n    tone=clamp(tone+ring*.85,0.,1.);\n  }\n  tone*=1.-uVignette*smoothstep(.35,1.05,length((uv-.5)*vec2(min(aspect,1.8),1.)*2.));\n  if(uClear.z>0.){\n    // Clear zone: the field fades out around content so text above it stays readable.\n    vec2 half_=uClear.zw*.5*vec2(aspect,1.),q=(uv-uClear.xy-uClear.zw*.5)*vec2(aspect,1.);\n    float dz;\n    if(uClearShape>.5){vec2 e=abs(q)-half_;dz=length(max(e,0.))+min(max(e.x,e.y),0.);}\n    else dz=(length(q/max(half_,vec2(1e-4)))-1.)*min(half_.x,half_.y);\n    tone*=smoothstep(0.,uClearFeather,dz);\n  }\n  // Blend: a shade between two characters takes the upper one in the share of cells a 4x4 Bayer pattern gives it.\n  float level=tone*(uCount-1.),upper=fract(level)>=.5?1.:0.;\n  if(uBlend>.5&&tone>.02&&tone<.98){\n    ivec2 q=ivec2(mod(gl_FragCoord.xy,4.));\n    upper=fract(level)>(BAYER[q.y*4+q.x]+.5)/16.?1.:0.;\n  }\n  float index=min(uCount-1.,floor(level)+upper+(flick>.5&&tone>.02?1.:0.));\n  vec3 hue=rgb/max(max(rgb.r,rgb.g),max(rgb.b,.03));\n  hue=mix(vec3(dot(hue,vec3(.2126,.7152,.0722))),hue,uSaturation);\n  vec3 ink=mix(uInk*mix(1.,.3+.7*tone,uShade),clamp(hue*(.38+.62*tone),0.,1.),uSourceColor);\n  vec3 lifted=uHighlightAuto>.5?ink/max(max(ink.r,ink.g),max(ink.b,.06)):uHighlight;\n  ink=mix(ink,lifted,wake*.7);\n  float underAlpha=max(uBackground.a,min(1.,max(glow.r,max(glow.g,glow.b))));\n  vec3 under=min(uBackground.rgb*uBackground.a+glow,vec3(underAlpha));\n  // Glyphs keep their atlas index, exact in 8 bits; the other marks keep the tone, and empty where the charset is blank.\n  outInk=vec4(ink,uMark==0?index/255.:uMark==1?(tone>.003?tone:0.):index>0.?max(tone,1./255.):0.);\n  outUnder=vec4(under,underAlpha);\n}`)(L)),U=Ve("#version 300 es\nprecision highp float;\nprecision highp sampler2D;\nuniform sampler2D uAtlas, uCells, uUnder;\nuniform vec2 uResolution, uCell, uPitch;\nuniform float uColumns, uDotScale, uSourceColor;\nuniform int uMark;\nout vec4 outColor;\nconst float BAYER[16]=float[16](0.,8.,2.,10.,12.,4.,14.,6.,3.,11.,1.,9.,15.,7.,13.,5.);\n// The Studio's print defaults: screen angle -35deg, roughness .35, seed 7, registration .2 and its coral second ink.\nconst vec2 DIR=vec2(.81915,-.57358);\nconst float ROUGH=.35,SEED=7.;\nconst vec3 SECOND=vec3(.925,.404,.322);\nfloat hash(vec2 p){p=fract(p*vec2(123.34,456.21));p+=dot(p,p+45.32);return fract(p.x*p.y);}\n// Coverage of a signed distance given in device pixels.\nfloat cover(float d){return clamp(.5-d,0.,1.);}\nfloat box(vec2 p,vec2 lo,vec2 hi){vec2 a=clamp(p-lo,0.,1.)*clamp(hi-p,0.,1.);return a.x*a.y;}\nfloat disc(vec2 p,vec2 c,float r){return r>.05?cover(length(p-c)-r):0.;}\nfloat ellipse(vec2 p,vec2 c,vec2 r,float a){vec2 d=p-c;d=vec2(cos(a)*d.x+sin(a)*d.y,-sin(a)*d.x+cos(a)*d.y);float k=length(d/r);return cover((k-1.)*min(r.x,r.y));}\n// World-anchored parallel cuts across direction d: period and width in cell heights, so lines run on from cell to cell.\nfloat cuts(vec2 w,vec2 d,float period,float width,float px){\n  if(width<=0.)return 0.;\n  float proj=dot(vec2(-d.y,d.x),w);\n  return cover((abs(fract(proj/period+.5)-.5)*period-width*.5)*px);\n}\n// Lays an ink over what is already down, multiplying where they overlap, as transparent inks do on paper.\nvoid lay(inout vec3 rgb,inout float a,vec3 c,float k){\n  float next=a+k*(1.-a);\n  rgb=next>0.?(rgb*a*(1.-k)+mix(c,rgb*c,a)*k)/next:c;\n  a=next;\n}\nvoid main(){\n  vec2 frag=vec2(gl_FragCoord.x,uResolution.y-gl_FragCoord.y);\n  // The pitch is the atlas cell, or a fractional one under cellFit 'fill', where each glyph sits centred in its stretched cell.\n  vec2 cell=floor(frag/uPitch);\n  vec4 ink=texelFetch(uCells,ivec2(cell),0),under=texelFetch(uUnder,ivec2(cell),0);\n  vec2 local=frag-cell*uPitch;\n  float coverage;\n  vec3 rgb=ink.rgb;\n  if(uMark==0){\n    float index=floor(ink.a*255.+.5);\n    ivec2 tile=ivec2(int(mod(index,uColumns)),int(floor(index/uColumns)));\n    vec2 texel=floor(local-floor((uPitch-uCell)*.5));\n    coverage=all(greaterThanEqual(texel,vec2(0.)))&&all(lessThan(texel,uCell))?texelFetch(uAtlas,tile*ivec2(uCell)+ivec2(texel),0).a:0.;\n  } else if(uMark==1){\n    // Halftone: dot area follows tone, so midtones read true; edges are antialiased to one device pixel.\n    float r=sqrt(ink.a)*min(uPitch.x,uPitch.y)*.5*uDotScale;\n    coverage=ink.a>.003?clamp(r-length(local-uPitch*.5)+.5,0.,1.):0.;\n  } else if(ink.a<=0.){\n    coverage=0.;\n  } else {\n    float tone=ink.a,side=min(uPitch.x,uPitch.y);\n    vec2 q=local/uPitch,c=uPitch*.5,p=local+.5;\n    // Tiles fade with the tone in one ink, as the Studio's do; in source colour the colour already carries it.\n    float fade=uSourceColor>.5?1.:tone,gap=max(.5,uPitch.x*.06),grain=hash(cell+SEED);\n    vec2 w=(cell+q)*uPitch/uPitch.y;\n    if(uMark==2)coverage=fade;\n    else if(uMark==3)coverage=box(p,vec2(0.),uPitch-gap)*fade;\n    else if(uMark==4){\n      // Lego: a gapped brick, lit from above, with a raised stud ringed by its shadow.\n      coverage=box(p,vec2(0.),uPitch-gap)*fade;\n      rgb*=1.06-.14*q.y;\n      float r=side*.28,d=length(local-c)-r,lit=clamp(dot(c-local,vec2(.6,.8))/r,-1.,1.);\n      rgb=mix(rgb,mix(rgb,vec3(1.),.2+.12*lit),cover(d));\n      rgb=mix(rgb,rgb*.72,cover(abs(d)-max(.5,side*.04)));\n    } else if(uMark==5){\n      // Voxel: an isometric cube; top, left and right faces at full, .72 and .42 strength.\n      float h=.5*abs(q.x-.5);\n      coverage=cover(-min(q.y-h,1.-h-q.y)*uPitch.y)*cover(-min(q.x,1.-q.x)*uPitch.x);\n      coverage*=mix(q.x<.5?.72:.42,1.,cover((q.y-(.5-h))*uPitch.y))*fade;\n    } else if(uMark==6){\n      // Disco: a gapped mirror tile, its upper facet catching light and its lower in shade.\n      coverage=box(p,vec2(0.),uPitch-gap)*fade;\n      rgb=q.y<.35?mix(rgb,vec3(1.),.1+grain*.25):q.y>.65?rgb*.75:rgb;\n    } else if(uMark==7){\n      // Dither: an ordered 4x4 Bayer screen at about five dots a cell, lit where the cell's tone passes the threshold.\n      ivec2 b=ivec2(mod(floor(frag/max(1.,floor(side/5.))),4.));\n      coverage=tone>(BAYER[b.y*4+b.x]+.5)/16.?1.:0.;\n    } else if(uMark==8){\n      // Hex: a flat-topped hexagon filling the cell.\n      vec2 h=abs((local-c)/(uPitch*.49));\n      coverage=cover(max(h.y-.866,h.x*.866+h.y*.5-.866)*side*.49)*fade;\n    } else if(uMark==9){\n      // LED: a round lamp with a soft halo and a specular glint, separated by an unlit matrix.\n      float r=side*.39,d=length(local-c);\n      coverage=max(cover(d-r),.3*exp(-pow(max(0.,d-r)/(side*.12),2.)))*fade;\n      rgb=mix(rgb,vec3(1.),.35*disc(local,uPitch*vec2(.43,.4),side*.11));\n    } else if(uMark==10){\n      // CMYK: the cell's hue separated into offset cyan, magenta and yellow dots, each sized by its share of the tone. The\n      // key screen carries the neutral share in the ink's own lightness, since a light ink on a dark page has no black.\n      float top=max(rgb.r,max(rgb.g,rgb.b)),low=min(rgb.r,min(rgb.g,rgb.b));\n      vec3 cmy=(top-rgb)/max(top,.001);\n      float a=0.;vec3 col=vec3(1.);\n      lay(col,a,vec3(top),disc(local,c,side*.48*sqrt(tone*low/max(top,.001))));\n      lay(col,a,vec3(0.,1.,1.),disc(local,uPitch*vec2(.36,.36),side*.48*sqrt(tone*cmy.x)));\n      lay(col,a,vec3(1.,0.,1.),disc(local,uPitch*vec2(.64,.36),side*.48*sqrt(tone*cmy.y)));\n      lay(col,a,vec3(1.,1.,0.),disc(local,uPitch*vec2(.5,.66),side*.48*sqrt(tone*cmy.z)));\n      rgb=col;coverage=a;\n    } else if(uMark==11||uMark==16){\n      // Stipple and pointillism: four jittered marks a cell, their size following the tone.\n      coverage=0.;vec3 col=rgb;\n      for(int m=0;m<4;m++){\n        vec2 o=vec2(float(m%2),float(m/2));\n        float j=hash(cell*2.+o+SEED),jy=hash(cell+o*11.+SEED+1.);\n        vec2 at=((o+.5)/2.+(vec2(j,jy)-.5)*ROUGH*.28)*uPitch;\n        float r=min(min(min(at.x,uPitch.x-at.x),min(at.y,uPitch.y-at.y)),side*min(.245,.21*sqrt(tone)*(1.-ROUGH*j*.35)));\n        float k=uMark==11?disc(local,at,r):ellipse(local,at,vec2(r,r*.64),j*3.14159);\n        if(uMark==16&&k>coverage)col=uSourceColor>.5?clamp(rgb+(j-.5)*ROUGH*.25*vec3(1.,-.4,-1.),0.,1.):rgb*(1.+(j-.5)*ROUGH*.5);\n        coverage=max(coverage,k);\n      }\n      rgb=col;\n    } else if(uMark==12||uMark==13){\n      // Engraving and crosshatch: parallel cuts whose weight follows the tone; crossings join only in the darker tones.\n      float cv=tone*(1.-ROUGH*grain*.3),px=uPitch.y;\n      coverage=cuts(w,DIR,.5,min(.47,.36*cv),px);\n      if(uMark==13){\n        coverage=max(coverage,cuts(w,vec2(-DIR.y,DIR.x),.5,min(.47,.36*max(0.,cv*1.5-.3)),px)*step(.2,cv));\n        coverage=max(coverage,cuts(w,normalize(DIR+vec2(-DIR.y,DIR.x)),.5,min(.47,.36*max(0.,cv*2.-1.2)),px)*step(.6,cv));\n      }\n    } else if(uMark==14){\n      // Woodblock: broad carved bands in five stepped weights, their edges wavering along the grain.\n      float cv=ceil(tone*(1.-ROUGH*grain*.3)*5.)/5.,width=min(.94,.72*cv);\n      float proj=dot(vec2(-DIR.y,DIR.x),w),line=floor(proj+.5),along=dot(DIR,w);\n      float cut=sin(along*5.3+line*1.9+SEED)*.5+sin(along*13.1+line)*.25;\n      coverage=cover((abs(proj-line)-width*.5*(1.+ROUGH*cut*.5))*uPitch.y);\n    } else if(uMark==15){\n      // Risograph: two offset screens, the main ink and the coral second ink, misregistered along the screen angle.\n      float split=uSourceColor>.5?clamp(.5+(rgb.r-rgb.b)*.5,0.,1.):.5,r=side*min(.48,.44*sqrt(tone));\n      float a=0.;vec3 col=rgb;\n      lay(col,a,rgb,disc(local,c,r*sqrt(.35+(1.-split)*.65)));\n      lay(col,a,SECOND,disc(local,c+DIR*.2*.38*side,r*sqrt(.3+split*.7)*(1.-ROUGH*hash(cell+SEED+13.)*.3)));\n      rgb=col;coverage=a;\n    } else coverage=0.;\n  }\n  outColor=vec4(rgb*coverage+under.rgb*(1.-coverage),coverage+under.a*(1.-coverage));\n}"),D||ze(!0)}const et=()=>`${g.fontWeight} ${Math.max(1,K.height*g.glyphScale)}px ${g.font}`,tt=()=>{const e=b(g.charset);$=e.length,K=T(g.cellSize,g.cellAspect,W,$),Y=W;const t=document.createElement("canvas");t.width=K.atlasWidth,t.height=K.atlasHeight;const n=t.getContext("2d");n.fillStyle="#fff",n.textAlign="center",n.textBaseline="alphabetic",n.font=et();const r=n.measureText("M"),i=r.actualBoundingBoxAscent||K.height*g.glyphScale*.7,o=r.actualBoundingBoxDescent||0,a=(K.height+i-o)/2;e.forEach((e,t)=>{const r=t%K.columns*K.width+K.width/2,i=Math.floor(t/K.columns)*K.height+a,o=n.measureText(e).width;n.save(),n.beginPath(),n.rect(r-K.width/2,i-a,K.width,K.height),n.clip(),n.translate(r,i),o>.96*K.width&&n.scale(.96*K.width/o,1),n.fillText(e,0,0),n.restore()}),k.bindTexture(k.TEXTURE_2D,_),k.pixelStorei(k.UNPACK_PREMULTIPLY_ALPHA_WEBGL,!1),k.texImage2D(k.TEXTURE_2D,0,k.RGBA8,k.RGBA,k.UNSIGNED_BYTE,t),t.width=t.height=1,ve=!0},nt="undefined"==typeof document?void 0:document.fonts,rt=()=>{if(!nt?.load)return;const e=et();nt.load(e,b(g.charset).join("")).then(()=>{pe||ge||et()!==e||(tt(),Tt())},()=>{})},it=e=>e.trim().replace(/^["']|["']$/g,"").toLowerCase(),ot=e=>{const t=e.fontfaces??[],n=g.font.split(",").map(it);t.some(e=>n.includes(it(e.family)))&&rt()},at=()=>{if(ce=[0,1],ee&&"none"!==g.levels)try{const e=document.createElement("canvas");e.width=e.height=64;const t=e.getContext("2d",{willReadFrequently:!0});ee===ae&&(t.imageSmoothingQuality="medium"),t.drawImage(ee,0,0,64,64),ce=R(t.getImageData(0,0,64,64).data)}catch{ce=[0,1]}},lt=()=>{if(!ee)return;const e=performance.now();ee instanceof HTMLVideoElement&&!(e-fe>1500)||(at(),fe=e),k.bindTexture(k.TEXTURE_2D,C),k.pixelStorei(k.UNPACK_FLIP_Y_WEBGL,!1),k.pixelStorei(k.UNPACK_PREMULTIPLY_ALPHA_WEBGL,!1);try{k.texImage2D(k.TEXTURE_2D,0,k.RGBA8,k.RGBA,k.UNSIGNED_BYTE,ee),k.generateMipmap(k.TEXTURE_2D)}catch(e){He(e)}},st=()=>{L=!k.getExtension("EXT_color_buffer_float")&&!k.getExtension("EXT_color_buffer_half_float"),Ze(),q=k.createVertexArray(),_=je(k.NEAREST),C=je(k.LINEAR_MIPMAP_LINEAR),k.bindTexture(k.TEXTURE_2D,C),k.texImage2D(k.TEXTURE_2D,0,k.RGBA8,1,1,0,k.RGBA,k.UNSIGNED_BYTE,new Uint8Array([0,0,0,255])),k.generateMipmap(k.TEXTURE_2D),z=j=0,Y=0,ut(),rt(),ee&&lt()};function ut(){const e=n.clientWidth||n.clientHeight?{width:n.clientWidth,height:n.clientHeight}:n.getBoundingClientRect(),t=Math.min(globalThis.devicePixelRatio||1,g.maxPixelRatio),r=Math.max(1,Math.round(e.width*t)),i=Math.max(1,Math.round(e.height*t));if(r===z&&i===j&&t===W)return!1;const o=!z||Math.abs(r/i-z/j)>.01;return W=t,z=r,j=i,n.width=z,n.height=j,Y!==W&&tt(),(o||Ke()&&!N.length&&!H)&&Qe(),ve=!0,!0}let ct=null,ft=[0,0,0],ht=[1,1,1],dt=[0,0,0,0],mt=w(1,1,1,1,"cover"),vt=null,pt=0,gt=0,xt=0,yt=0;const bt=()=>{ct!==g&&(ct=g,ft=M(g.ink),ht=M("auto"===g.highlight?"#ffffff":g.highlight),dt="transparent"===g.background?[0,0,0,0]:[...M(g.background),1]),vt===g&&pt===z&&gt===j&&xt===re&&yt===ie||(vt=g,pt=z,gt=j,xt=re,yt=ie,mt=w(z,j,re||1,ie||1,g.fit,g.focus));const t=g.fluid,n=ee&&le?K.height/j*le*mt.scale[1]:1,r=(()=>{const[e,t]=Ye(),n=Math.ceil(z/e-1e-4),r=Math.ceil(j/t-1e-4);if(B&&B.columns===n&&B.rows===r)return B;We();const i=()=>{const e=je(k.NEAREST);return k.texStorage2D(k.TEXTURE_2D,1,L?k.RGBA8:k.RGBA16F,n,r),e},o=i(),a=i(),l=k.createFramebuffer();return k.bindFramebuffer(k.FRAMEBUFFER,l),k.framebufferTexture2D(k.FRAMEBUFFER,k.COLOR_ATTACHMENT0,k.TEXTURE_2D,o,0),k.framebufferTexture2D(k.FRAMEBUFFER,k.COLOR_ATTACHMENT1,k.TEXTURE_2D,a,0),k.drawBuffers([k.COLOR_ATTACHMENT0,k.COLOR_ATTACHMENT1]),B={ink:o,under:a,buffer:l,columns:n,rows:r}})(),i=P.locations,o=U.locations,a=F(g),l=!Be();k.bindFramebuffer(k.FRAMEBUFFER,r.buffer),k.viewport(0,0,r.columns,r.rows),k.useProgram(P.program),k.activeTexture(k.TEXTURE0),k.bindTexture(k.TEXTURE_2D,C),k.uniform1i(i.uSource,0),k.activeTexture(k.TEXTURE2),k.bindTexture(k.TEXTURE_2D,(H?G?.velocity:N[Z])??C),k.uniform1i(i.uFluid,2),k.activeTexture(k.TEXTURE3),k.bindTexture(k.TEXTURE_2D,_e??C),k.uniform1i(i.uTrailMap,3),k.uniform1f(i.uFluidMode,H?1:0),k.uniform1i(i.uHoverMode,"fluid"===a?1:"lantern"===a?2:"trail"===a&&Ce?3:0),k.uniform1f(i.uTrailAmount,g.trail.strength),k.uniform3f(i.uLight,Se.at?.[0]??-1,Se.at?.[1]??-1,"lantern"===a?Se.strength:0),k.uniform3fv(i.uTrail,Le),k.uniform1f(i.uLightRadius,g.lantern.radius),k.uniform1f(i.uLightGain,g.lantern.strength),k.uniform1f(i.uClock,performance.now()/1e3),k.uniform1f(i.uFlicker,l?1:0),k.uniform2f(i.uFluidTexel,1/Math.max(1,J),1/Math.max(1,Q)),k.uniform2f(i.uResolution,z,j);const[s,u]=Ye();var c;k.uniform2f(i.uCell,s,u),k.uniform1f(i.uCount,$),k.uniform1f(i.uBlend,"on"===g.blend||$<=9&&("coarse"===g.blend||"auto"===g.blend&&te)?1:0),k.uniform4f(i.uSourceMap,mt.scale[0],mt.scale[1],mt.offset[0],mt.offset[1]),k.uniform1i(i.uScene,ee?0:(c=g.scene,e[c]??3)),k.uniform1i(i.uMark,d.indexOf(g.mark)),k.uniform1f(i.uScale,g.scale);const f=g.clear;k.uniform4f(i.uClear,f?f.x:0,f?f.y:0,f?f.width:0,f?f.height:0),k.uniform1f(i.uClearFeather,f?f.feather:.1),k.uniform1f(i.uClearShape,f&&"rect"===f.shape?1:0);const h=performance.now();Ae.fill(0);for(let e=0;e<Fe.length;e++){const t=Fe[e],n=4*e;Ae[n]=t.x,Ae[n+1]=t.y,Ae[n+2]=(h-t.born)/1e3,Ae[n+3]=t.strength}k.uniform4fv(i.uPulse,Ae),k.uniform3fv(i.uInk,ft),k.uniform3fv(i.uHighlight,ht),k.uniform1f(i.uHighlightAuto,"auto"===g.highlight?1:0),k.uniform4fv(i.uBackground,dt),k.uniform1f(i.uBrightness,g.brightness),k.uniform1f(i.uContrast,g.contrast),k.uniform1f(i.uGamma,g.gamma),k.uniform1f(i.uInvert,g.invert?1:0),k.uniform1f(i.uVignette,g.vignette),k.uniform1f(i.uSourceColor,"source"===g.color?1:0),k.uniform1f(i.uRefraction,t?t.refraction*(l?1:.25):0),k.uniform1f(i.uGlow,t?t.glow:0),k.uniform1f(i.uTime,me),k.uniform1f(i.uDrift,l?g.drift:0),k.uniform1f(i.uFluidOn,t&&"fluid"===a&&(N.length||H)?1:0),k.uniform1f(i.uLod,Math.max(0,Math.log2(Math.max(1,n))-.5)),k.uniform1f(i.uSaturation,g.saturation),k.uniform1f(i.uShade,g.shade),k.uniform1f(i.uBackdrop,ee?g.backdrop:0),k.uniform2f(i.uLevels,ee&&"auto"===g.levels?ce[0]:0,ee&&"auto"===g.levels?ce[1]:1),k.bindVertexArray(q),k.drawArrays(k.TRIANGLES,0,3),k.bindFramebuffer(k.FRAMEBUFFER,null),k.viewport(0,0,z,j),k.useProgram(U.program),k.activeTexture(k.TEXTURE1),k.bindTexture(k.TEXTURE_2D,_),k.uniform1i(o.uAtlas,1),k.activeTexture(k.TEXTURE4),k.bindTexture(k.TEXTURE_2D,r.ink),k.uniform1i(o.uCells,4),k.activeTexture(k.TEXTURE5),k.bindTexture(k.TEXTURE_2D,r.under),k.uniform1i(o.uUnder,5),k.uniform2f(o.uResolution,z,j),k.uniform2f(o.uCell,K.width,K.height),k.uniform2f(o.uPitch,s,u),k.uniform1f(o.uColumns,K.columns),k.uniform1f(o.uDotScale,g.dotScale),k.uniform1i(o.uMark,d.indexOf(g.mark)),k.uniform1f(o.uSourceColor,"source"===g.color?1:0),k.drawArrays(k.TRIANGLES,0,3)},Et=()=>!pe&&!ge&&!xe&&(be||Ge)&&!("undefined"!=typeof document&&document.hidden),wt=e=>{if(he=0,!Et())return;const t=(e-de)/1e3,n=Math.min(1/30,Math.max(1/480,t));de=e,Te=.9*Te+.1*Math.min(t,.25),Me=Te>1/24?Me+1:0;try{Me>45&&Re<2&&(Me=0,Re++,1===Re&&W>1?(g={...g,maxPixelRatio:1},ut()):Re=2);const t=ze(),r=!(ye||Re>=2&&!(ee instanceof HTMLVideoElement)||(!(ee instanceof HTMLVideoElement)||ee.paused||ee.ended)&&(Be()||!(!ee&&"none"!==g.scene||g.drift>0)));r&&(me+=n*g.speed),ee instanceof HTMLVideoElement&&ee.readyState>=2&&se&&(se=!("requestVideoFrameCallback"in ee),lt(),ve=!0);const i=F(g);let o="fluid"===i&&(null!==we||e<Ue);if(o?((e,t)=>{const n=g.fluid;if(!n||!X.length&&!H)return;if(H?!G?.ready():!I||!Oe(I))return;const r=z/j,i=we;if(we=null,H&&G){const o=5200*n.force*(Be()?.35:1);return i&&(Ue=t+1e3*Math.min(9,6/Math.max(.3,n.dissipation))),void G.step(i?{from:i.from,to:i.to,force:[(i.to[0]-i.from[0])*o,(i.to[1]-i.from[1])*o]}:null,{dt:Math.min(e,1/60),radius:1.1*n.radius,curl:n.curl,dissipation:n.dissipation,aspect:r})}let o=0,a=0;if(i){const e=(Be()?1:3)*n.force;o=(i.to[0]-i.from[0])*r*e*4,a=(i.to[1]-i.from[1])*e*4,Ue=t+7/Math.min(n.dissipation,1.1*n.dissipation)*1e3}const l=I.locations;k.bindFramebuffer(k.FRAMEBUFFER,X[1-Z]),k.viewport(0,0,J,Q),k.useProgram(I.program),k.activeTexture(k.TEXTURE0),k.bindTexture(k.TEXTURE_2D,N[Z]),k.uniform1i(l.uPrevious,0),k.uniform2f(l.uSize,J,Q),k.uniform1f(l.uAspect,r),k.uniform1f(l.uDt,e),k.uniform1f(l.uDecay,n.dissipation),k.uniform1f(l.uEnergyDecay,1.1*n.dissipation),k.uniform1f(l.uRadius,n.radius),k.uniform1f(l.uSplat,i?1:0),k.uniform2f(l.uFrom,i?.from[0]??0,i?.from[1]??0),k.uniform2f(l.uTo,i?.to[0]??0,i?.to[1]??0),k.uniform2f(l.uForce,o,a),k.drawArrays(k.TRIANGLES,0,3),Z=1-Z})(n,e):we=null,"lantern"===i&&(o=((e,t)=>{const n=g.lantern,r=Se.target;if(r){const i=Se.at;if(i)if(Be())i[0]=r[0],i[1]=r[1];else{const t=1-Math.exp(-n.follow*e);i[0]+=(r[0]-i[0])*t,i[1]+=(r[1]-i[1])*t}else Se.at=[r[0],r[1]];const o=Se.at,a=Se.trail[Se.trail.length-1];n.trail>0&&(!a||t-a.born>28&&Math.hypot(o[0]-a.x,o[1]-a.y)>.004)&&(Se.trail.push({x:o[0],y:o[1],born:t}),Se.trail.length>12&&Se.trail.shift())}Se.strength+=((r?1:0)-Se.strength)*(1-Math.exp(-e*(r?9:5)));const i=Se.trail;for(let e=i.length-1;e>=0;e--)n.trail>0&&t-i[e].born<4e3*n.trail||i.splice(e,1);Le.fill(0);for(let e=0;e<i.length;e++){const r=i[e];Le[3*e]=r.x,Le[3*e+1]=r.y,Le[3*e+2]=.55*Math.exp(-(t-r.born)/1e3/Math.max(.01,n.trail))}return Se.strength>.003||i.length>0})(n,e)||o),"trail"===i){const e=!!De?.active;o=(e=>{const t=Pe();return!(!t||!t.active||(t.step(e),k.bindTexture(k.TEXTURE_2D,_e),k.texSubImage2D(k.TEXTURE_2D,0,0,0,t.width,t.height,k.RGBA,k.UNSIGNED_BYTE,t.pixels),Ce=!0,0))})(n)||o,e&&!De?.active&&(ve=!0)}if(Fe.length){for(let t=Fe.length-1;t>=0;t--)e-Fe[t].born>=2400&&Fe.splice(t,1);o=!0,Fe.length||(ve=!0)}t&&(r||o||ve)&&(bt(),ve=!1,!Ge||oe&&!ee||(Ge=!1,Ne())),(r||o||we||!t)&&(he=requestAnimationFrame(wt))}catch(e){xe=!0,He(e)}};function Tt(){!he&&Et()&&(de=performance.now(),he=requestAnimationFrame(wt))}const Mt=(e,t)=>{const r=n.getBoundingClientRect();if(!r.width||!r.height)return null;const i=(e-r.left)/r.width,o=(t-r.top)/r.height;return i<-.05||i>1.05||o<-.05||o>1.05?null:[i,1-o]},Rt=e=>{const t=F(g);if("none"===t||ye)return Ee=null,void(Se.target=null);if("lantern"===t)return Se.target=e?[e[0],1-e[1]]:null,Ee=null,void Tt();if("trail"===t){const t=Pe();if(!t)return;return e?t.move(e[0],1-e[1],g.trail.radius,performance.now()):t.leave(),Ee=null,void Tt()}e?(Ee&&(we=we?{from:we.from,to:e}:{from:Ee,to:e}),Ee=e,Tt()):Ee=null},Ft=e=>Rt(Mt(e.clientX,e.clientY)),At=()=>{Ee=null,De?.leave(),Se.target&&(Se.target=null,Tt())},kt=h.interactionTarget??window;kt.addEventListener("pointermove",Ft,{passive:!0}),kt.addEventListener("pointerdown",Ft,{passive:!0}),document.addEventListener("pointerleave",At),kt!==window&&kt.addEventListener("pointerleave",At);const St="function"==typeof ResizeObserver?new ResizeObserver(()=>{const e=ut();ke(),(e||ve)&&Tt()}):null;St?.observe(n),p&&St?.observe(p.element);const Lt="function"==typeof IntersectionObserver?new IntersectionObserver(([e])=>{be=e.isIntersecting,be&&(ve=!0,Tt())},{rootMargin:"120px"}):null;Lt?.observe(n);const Dt=()=>{document.hidden||(ve=!0,Tt())};document.addEventListener("visibilitychange",Dt);const _t=()=>{ve=!0,Tt()};Ie?.addEventListener?.("change",_t),nt?.addEventListener?.("loadingdone",ot);const Ct=e=>{e.preventDefault(),ge=!0,he&&cancelAnimationFrame(he),he=0},Pt=()=>{ge=!1,O.length=0,V=null,P=U=I=null,B=null,N=[],X=[],G=null,H=!1,_e=null,De=null,Ce=!1;try{st(),ve=!0,Tt()}catch(e){He(e)}};n.addEventListener("webglcontextlost",Ct),n.addEventListener("webglcontextrestored",Pt);const Ut=()=>{ne&&(ne.pause(),ne.removeAttribute("src"),ne.load(),ne=null),ue&&ee instanceof HTMLVideoElement&&"cancelVideoFrameCallback"in ee&&ee.cancelVideoFrameCallback(ue),ue=0},It=()=>{ae?.close(),ae=null},Bt=async e=>{const t=await createImageBitmap(e,{premultiplyAlpha:"none"}),n=[t.width,t.height],r=function(e,t,n,r,i,o,a=8){if(!(n>=16&&r>=16&&e>0&&t>0&&i>0))return 1;const l=a/i/("cover"===o?Math.min(e/n,t/r):Math.max(e/n,t/r));return l>.5?1:2**-Math.floor(Math.log2(1/l))}(t.width,t.height,z,j,K.height,g.fit);if(1===r)return{element:t,owned:!0,natural:n};try{return{element:await createImageBitmap(t,{resizeWidth:Math.max(1,Math.round(t.width*r)),resizeHeight:Math.max(1,Math.round(t.height*r)),resizeQuality:"medium",premultiplyAlpha:"none"}),owned:!0,natural:n}}finally{t.close()}},Nt=e=>new Promise((t,n)=>{const r=new Image;r.crossOrigin="anonymous",r.decoding="async",r.onload=()=>t({element:r,owned:!1}),r.onerror=()=>n(new Error("The glyph field could not load this image.")),r.src=e}),Xt=async e=>{const t=++oe;if(!e)return Ut(),It(),ee=null,re=ie=le=0,te=!1,ve=!0,void Tt();try{const n=await(async e=>{if("string"!=typeof e)return e instanceof HTMLImageElement&&!e.complete?e.decode().then(()=>({element:e,owned:!1})):e instanceof HTMLVideoElement&&e.readyState<2?new Promise((t,n)=>{e.addEventListener("loadeddata",()=>t({element:e,owned:!1}),{once:!0}),e.addEventListener("error",()=>n(new Error("The glyph field could not load this video.")),{once:!0})}):{element:e,owned:!1};if(S.test(e))return new Promise((t,n)=>{const r=document.createElement("video");r.crossOrigin="anonymous",r.muted=!0,r.loop=!0,r.playsInline=!0,r.preload="auto",r.addEventListener("loadeddata",()=>{r.play().catch(()=>{}),t({element:r,owned:!0})},{once:!0}),r.addEventListener("error",()=>n(new Error("The glyph field could not load this video.")),{once:!0}),r.src=e});if("function"!=typeof createImageBitmap||"function"!=typeof fetch)return Nt(e);let t;try{t=await(await fetch(e).then(e=>{if(!e.ok)throw new Error("The glyph field could not load this image.");return e})).blob()}catch(t){if(t instanceof Error&&t.message.startsWith("The glyph field"))throw t;return Nt(e)}if(!/svg/i.test(t.type))try{return await Bt(t)}catch{}const n=URL.createObjectURL(t);try{return await Nt(n)}finally{URL.revokeObjectURL(n)}})(e),{element:r,owned:i}=n;if(pe||t!==oe)return void(i&&r instanceof HTMLVideoElement?(r.pause(),r.removeAttribute("src"),r.load()):i&&r.close());Ut(),It(),ne=i&&r instanceof HTMLVideoElement?r:null,!i||r instanceof HTMLVideoElement||(ae=r),ee=r,te="string"==typeof e||e instanceof HTMLImageElement||e instanceof HTMLVideoElement,le=r instanceof HTMLVideoElement?r.videoHeight:r instanceof HTMLImageElement?r.naturalHeight:r.height,re=n.natural?.[0]??(r instanceof HTMLVideoElement?r.videoWidth:r instanceof HTMLImageElement?r.naturalWidth:r.width),ie=n.natural?.[1]??le,se=!0,r instanceof HTMLVideoElement&&(e=>{const t=e;if(!t.requestVideoFrameCallback)return;const n=()=>{pe||ee!==e||(se=!0,Tt(),ue=t.requestVideoFrameCallback(n))};ue=t.requestVideoFrameCallback(n)})(r),ge||lt(),ve=!0,Tt()}catch(e){Ge&&t===oe&&(Ge=!1,Ne()),He(e)}};st(),ke();const Gt=h.source??null;return Gt?(oe=1,Xt(Gt)):Tt(),{canvas:n,ready:Xe,get settings(){return g},update(e){const t=g,{element:r,rest:i}=v(e);"clear"in e&&(p&&p.element!==r?.element&&St?.unobserve(p.element),p=r,r&&St?.observe(r.element)),g=E(r?{...i,clear:g.clear}:i,g),ke(),e.label&&n.setAttribute("aria-label",e.label),g.maxPixelRatio!==t.maxPixelRatio&&ut(),g.charset===t.charset&&g.cellSize===t.cellSize&&g.cellAspect===t.cellAspect&&g.font===t.font&&g.fontWeight===t.fontWeight&&g.glyphScale===t.glyphScale||(tt(),rt()),g.levels!==t.levels&&at();((!!t.fluid&&"fluid"===F(t))!==Ke()||g.fluid&&t.fluid&&g.fluid.resolution!==t.fluid.resolution)&&Qe(),"source"in e&&Xt(e.source??null),ve=!0,Tt()},setSource:Xt,pointer(e,t=0){if(null===e)return void Rt(null);const r=n.getBoundingClientRect();Rt(Mt(r.left+e,r.top+t))},redraw(){if(!(pe||ge||xe)&&z)try{ze(!0)&&bt()}catch(e){xe=!0,He(e)}},pulse(e={}){if(pe||Be())return;const t=n.getBoundingClientRect();if(!t.width||!t.height)return;let r=e.x??t.width/2,i=e.y??t.height/2;if(e.element){const n=e.element.getBoundingClientRect();r=n.left+n.width/2-t.left,i=n.top+n.height/2-t.top}const o=Math.max(0,Math.min(2,e.strength??1));Fe=[...Fe,{x:r/t.width,y:i/t.height,born:performance.now(),strength:o}].slice(-4),Tt()},play(){ye=!1,ee instanceof HTMLVideoElement&&ee.play().catch(()=>{}),ve=!0,Tt()},pause(){ye=!0,ee instanceof HTMLVideoElement&&ee.pause()},resize(){ut()&&Tt()},destroy(){if(!pe&&(pe=!0,he&&cancelAnimationFrame(he),kt.removeEventListener("pointermove",Ft),kt.removeEventListener("pointerdown",Ft),document.removeEventListener("pointerleave",At),kt.removeEventListener("pointerleave",At),document.removeEventListener("visibilitychange",Dt),Ie?.removeEventListener?.("change",_t),nt?.removeEventListener?.("loadingdone",ot),n.removeEventListener("webglcontextlost",Ct),n.removeEventListener("webglcontextrestored",Pt),St?.disconnect(),Lt?.disconnect(),Ut(),It(),ee=null,!ge)){$e(),We(),k.deleteTexture(_),k.deleteTexture(C);for(const e of[P,U,I])e&&k.deleteProgram(e.program);G?.dispose(),_e&&k.deleteTexture(_e),O.forEach(e=>k.deleteShader(e)),q&&k.deleteVertexArray(q)}}}},exports.normalizeFieldSettings=E;//# sourceMappingURL=field.cjs.map

package/dist/field.d.cts

@@ -1,8 +1,12 @@
 /** Pure option handling for the GPU glyph field, kept free of DOM and WebGL so it can be tested in Node. */
 type FieldColor = 'ink' | 'source';
 type FieldFit = 'cover' | 'contain';
-/** Generated motion used when there is no media source. */
-type FieldScene = 'none' | 'flow' | 'orb' | 'drift' | 'swell';
+/**
+ * Generated motion used when there is no media source. The later ones are the kit's background scenes: caustic light, drifting contour lines, aurora ribbons, water rings, a halo,
+ * two interfering ring grids, a gradient mesh, falling streaks in three depths, and linked points.
+ */
+declare const FIELD_SCENES: readonly ["none", "flow", "orb", "drift", "swell", "caustics", "contour", "aurora", "ripple", "halo", "interference", "mesh", "cascade", "constellation"];
+type FieldScene = typeof FIELD_SCENES[number];
 /**
  * What each cell draws. `glyph` draws characters from the atlas; `dot` draws a halftone: one circle per cell, its area
  * following the tone. The rest are the Studio's tile and print styles, drawn per cell from the cell's tone and colour:
@@ -265,4 +269,4 @@ declare function isGlyphFieldSupported(options?: {
  */
 declare function mountGlyphField(canvas: HTMLCanvasElement, options?: GlyphFieldOptions): GlyphField;
 
-export { DEFAULT_FIELD_FLUID, DEFAULT_FIELD_LANTERN, DEFAULT_FIELD_SETTINGS, DEFAULT_FIELD_TRAIL, FIELD_HOVERS, FIELD_MARKS, type FieldClearElement, type FieldClearZone, type FieldColor, type FieldFit, type FieldFluidOptions, type FieldHover, type FieldLanternOptions, type FieldMark, type FieldScene, type FieldSource, type FieldTrailOptions, type GlyphField, type GlyphFieldInput, type GlyphFieldOptions, type GlyphFieldSettings, activeFieldHover, fieldCellLayout, fieldClearFromRects, fieldGlyphs, fieldLevels, fieldSourceRect, glyphFieldTier, isGlyphFieldSupported, mountGlyphField, normalizeFieldSettings };
+export { DEFAULT_FIELD_FLUID, DEFAULT_FIELD_LANTERN, DEFAULT_FIELD_SETTINGS, DEFAULT_FIELD_TRAIL, FIELD_HOVERS, FIELD_MARKS, FIELD_SCENES, type FieldClearElement, type FieldClearZone, type FieldColor, type FieldFit, type FieldFluidOptions, type FieldHover, type FieldLanternOptions, type FieldMark, type FieldScene, type FieldSource, type FieldTrailOptions, type GlyphField, type GlyphFieldInput, type GlyphFieldOptions, type GlyphFieldSettings, activeFieldHover, fieldCellLayout, fieldClearFromRects, fieldGlyphs, fieldLevels, fieldSourceRect, glyphFieldTier, isGlyphFieldSupported, mountGlyphField, normalizeFieldSettings };

package/dist/field.d.ts

@@ -1,8 +1,12 @@
 /** Pure option handling for the GPU glyph field, kept free of DOM and WebGL so it can be tested in Node. */
 type FieldColor = 'ink' | 'source';
 type FieldFit = 'cover' | 'contain';
-/** Generated motion used when there is no media source. */
-type FieldScene = 'none' | 'flow' | 'orb' | 'drift' | 'swell';
+/**
+ * Generated motion used when there is no media source. The later ones are the kit's background scenes: caustic light, drifting contour lines, aurora ribbons, water rings, a halo,
+ * two interfering ring grids, a gradient mesh, falling streaks in three depths, and linked points.
+ */
+declare const FIELD_SCENES: readonly ["none", "flow", "orb", "drift", "swell", "caustics", "contour", "aurora", "ripple", "halo", "interference", "mesh", "cascade", "constellation"];
+type FieldScene = typeof FIELD_SCENES[number];
 /**
  * What each cell draws. `glyph` draws characters from the atlas; `dot` draws a halftone: one circle per cell, its area
  * following the tone. The rest are the Studio's tile and print styles, drawn per cell from the cell's tone and colour:
@@ -265,4 +269,4 @@ declare function isGlyphFieldSupported(options?: {
  */
 declare function mountGlyphField(canvas: HTMLCanvasElement, options?: GlyphFieldOptions): GlyphField;
 
-export { DEFAULT_FIELD_FLUID, DEFAULT_FIELD_LANTERN, DEFAULT_FIELD_SETTINGS, DEFAULT_FIELD_TRAIL, FIELD_HOVERS, FIELD_MARKS, type FieldClearElement, type FieldClearZone, type FieldColor, type FieldFit, type FieldFluidOptions, type FieldHover, type FieldLanternOptions, type FieldMark, type FieldScene, type FieldSource, type FieldTrailOptions, type GlyphField, type GlyphFieldInput, type GlyphFieldOptions, type GlyphFieldSettings, activeFieldHover, fieldCellLayout, fieldClearFromRects, fieldGlyphs, fieldLevels, fieldSourceRect, glyphFieldTier, isGlyphFieldSupported, mountGlyphField, normalizeFieldSettings };
+export { DEFAULT_FIELD_FLUID, DEFAULT_FIELD_LANTERN, DEFAULT_FIELD_SETTINGS, DEFAULT_FIELD_TRAIL, FIELD_HOVERS, FIELD_MARKS, FIELD_SCENES, type FieldClearElement, type FieldClearZone, type FieldColor, type FieldFit, type FieldFluidOptions, type FieldHover, type FieldLanternOptions, type FieldMark, type FieldScene, type FieldSource, type FieldTrailOptions, type GlyphField, type GlyphFieldInput, type GlyphFieldOptions, type GlyphFieldSettings, activeFieldHover, fieldCellLayout, fieldClearFromRects, fieldGlyphs, fieldLevels, fieldSourceRect, glyphFieldTier, isGlyphFieldSupported, mountGlyphField, normalizeFieldSettings };