vireuikit 0.1.0

package/dist/web/index.cjs

@@ -0,0 +1,967 @@
+'use strict';
+
+var vireglass = require('vireglass');
+var web = require('vireglass/web');
+
+// src/medium/oklab.ts
+var LINEAR_TO_LMS = [
+  [0.4122214708, 0.5363325363, 0.0514459929],
+  [0.2119034982, 0.6806995451, 0.1073969566],
+  [0.0883024619, 0.2817188376, 0.6299787005]
+];
+var LMS_TO_OKLAB = [
+  [0.2104542553, 0.793617785, -0.0040720468],
+  [1.9779984951, -2.428592205, 0.4505937099],
+  [0.0259040371, 0.7827717662, -0.808675766]
+];
+var OKLAB_TO_LMS = [
+  [1, 0.3963377774, 0.2158037573],
+  [1, -0.1055613458, -0.0638541728],
+  [1, -0.0894841775, -1.291485548]
+];
+var LMS_TO_LINEAR = [
+  [4.0767416621, -3.3077115913, 0.2309699292],
+  [-1.2684380046, 2.6097574011, -0.3413193965],
+  [-0.0041960863, -0.7034186147, 1.707614701]
+];
+var glsl = (v) => Number.isInteger(v) ? v.toFixed(1) : String(v);
+var row = (m, i, vars) => m[i].map((k, j) => `${glsl(k)} * ${vars[j]}`).join(" + ");
+var VG_OKLAB_TO_SRGB = `
+float3 vgLinearToSrgb(float3 c) {
+  float3 lo = c * 12.92;
+  float3 hi = 1.055 * pow(max(c, float3(0.0)), float3(1.0 / 2.4)) - 0.055;
+  return mix(lo, hi, step(float3(0.0031308), c));
+}
+
+float3 vgOklabToLinear(float3 lab) {
+  float l_ = ${row(OKLAB_TO_LMS, 0, ["lab.x", "lab.y", "lab.z"])};
+  float m_ = ${row(OKLAB_TO_LMS, 1, ["lab.x", "lab.y", "lab.z"])};
+  float s_ = ${row(OKLAB_TO_LMS, 2, ["lab.x", "lab.y", "lab.z"])};
+  float l = l_ * l_ * l_;
+  float m = m_ * m_ * m_;
+  float s = s_ * s_ * s_;
+  return float3(
+    ${row(LMS_TO_LINEAR, 0, ["l", "m", "s"])},
+    ${row(LMS_TO_LINEAR, 1, ["l", "m", "s"])},
+    ${row(LMS_TO_LINEAR, 2, ["l", "m", "s"])}
+  );
+}
+`;
+var apply = (m, v) => [
+  m[0][0] * v[0] + m[0][1] * v[1] + m[0][2] * v[2],
+  m[1][0] * v[0] + m[1][1] * v[1] + m[1][2] * v[2],
+  m[2][0] * v[0] + m[2][1] * v[1] + m[2][2] * v[2]
+];
+var srgbChannelToLinear = (c) => c <= 0.04045 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+var linearChannelToSrgb = (c) => c <= 31308e-7 ? c * 12.92 : 1.055 * Math.pow(Math.max(c, 0), 1 / 2.4) - 0.055;
+function srgbToOklab(rgb) {
+  const linear = rgb.map(srgbChannelToLinear);
+  const lms = apply(LINEAR_TO_LMS, linear);
+  return apply(LMS_TO_OKLAB, lms.map((v) => Math.cbrt(Math.max(v, 0))));
+}
+function oklabToSrgb(lab) {
+  const lms = apply(OKLAB_TO_LMS, lab).map((v) => v * v * v);
+  return apply(LMS_TO_LINEAR, lms).map(linearChannelToSrgb);
+}
+
+// src/medium/species.ts
+var MEDIUM_SPECIES_LIGHTNESS = 0.44;
+var MEDIUM_SPECIES_HUE_SPREAD = 32;
+var clamp01 = (v) => Math.min(1, Math.max(0, v));
+function characterOf(color) {
+  const [lightness, a, b] = srgbToOklab(color);
+  return {
+    hue: Math.atan2(b, a) * 180 / Math.PI,
+    chroma: Math.hypot(a, b),
+    lightness
+  };
+}
+function speciesFamily(character, spreadDeg = MEDIUM_SPECIES_HUE_SPREAD) {
+  const { hue, chroma, lightness } = character;
+  const tone = (deg) => {
+    const rad = deg * Math.PI / 180;
+    return oklabToSrgb([lightness, chroma * Math.cos(rad), chroma * Math.sin(rad)]).map(
+      clamp01
+    );
+  };
+  return [tone(hue - spreadDeg), tone(hue), tone(hue + spreadDeg)];
+}
+function neutralSpecies(baseColor) {
+  const { hue, chroma } = characterOf(baseColor);
+  return speciesFamily({ hue, chroma, lightness: MEDIUM_SPECIES_LIGHTNESS });
+}
+
+// src/medium/params.ts
+var BASE_COLOR = [0.07, 0.08, 0.1];
+var MEDIUM_DEFAULTS = {
+  decay: 0.06,
+  curlFreq: 0.045,
+  curlSpeed: 0.12,
+  advectSpeed: 26,
+  turbulence: 1,
+  condensationRate: 0.18,
+  condensationFloor: 0.12,
+  evaporationRate: 0.2,
+  condensateSettleSpeed: 8,
+  condensateSpreadRate: 0.08,
+  condensateTint: 0.2,
+  condensateGain: 5,
+  condensateColor: [0.94, 0.95, 0.97],
+  channelColors: neutralSpecies(BASE_COLOR),
+  baseColor: BASE_COLOR,
+  baseWeight: 0.9
+};
+
+// src/medium/noise.ts
+var VG_VALUE_NOISE = `
+float vgHash21(float2 p) {
+  float h = dot(p, float2(127.1, 311.7));
+  return fract(sin(h) * 43758.5453123);
+}
+
+float vgValueNoise(float2 p) {
+  float2 i = floor(p);
+  float2 f = fract(p);
+  float a = vgHash21(i);
+  float b = vgHash21(i + float2(1.0, 0.0));
+  float c = vgHash21(i + float2(0.0, 1.0));
+  float d = vgHash21(i + float2(1.0, 1.0));
+  float2 u = f * f * (3.0 - 2.0 * f);
+  return mix(mix(a, b, u.x), mix(c, d, u.x), u.y) * 2.0 - 1.0;
+}
+`;
+var glslFloat = (v) => Number.isInteger(v) ? v.toFixed(1) : String(v);
+var MEDIUM_TIME_PERIOD = 1e3;
+var MEDIUM_TIME_OCTAVES = [
+  { rate: 0.6, offset: 0, scale: 1 },
+  { rate: 1.7, offset: 11, scale: 2.03 },
+  { rate: 0.9, offset: 37, scale: 4.11 },
+  { rate: 0.15, offset: 5, scale: 0.35 }
+];
+function mediumOctavePeriod(rate) {
+  const period = rate * MEDIUM_TIME_PERIOD;
+  if (!Number.isInteger(period)) {
+    throw new Error(
+      `medium noise: octave rate ${rate} * MEDIUM_TIME_PERIOD ${MEDIUM_TIME_PERIOD} = ${period}, not an integer \u2014 the phase wrap would not be seamless`
+    );
+  }
+  return period;
+}
+var glslOctave = (o) => ({
+  rate: glslFloat(o.rate),
+  offset: glslFloat(o.offset),
+  scale: glslFloat(o.scale),
+  period: glslFloat(mediumOctavePeriod(o.rate))
+});
+var [VG_OCT0, VG_OCT1, VG_OCT2, VG_OCT3] = MEDIUM_TIME_OCTAVES.map(glslOctave);
+var VG_CURL_NOISE = `
+${VG_VALUE_NOISE}
+
+float vgHash31(float3 p) {
+  float h = dot(p, float3(127.1, 311.7, 74.7));
+  return fract(sin(h) * 43758.5453123);
+}
+
+// 3D value-noise: time is a third grid axis, not a coordinate shift. A shift would just SLIDE the
+// pattern (a "traveling" look, when motion is meant to read as random), while trilinear
+// interpolation over t CHANGES the pattern itself between grid nodes \u2014 nearby moments look alike,
+// distant ones don't, and no repeat ever shows up.
+float vgValueNoise3(float3 p) {
+  float3 i = floor(p);
+  float3 f = fract(p);
+  float3 u = f * f * (3.0 - 2.0 * f);
+  float n000 = vgHash31(i);
+  float n100 = vgHash31(i + float3(1.0, 0.0, 0.0));
+  float n010 = vgHash31(i + float3(0.0, 1.0, 0.0));
+  float n110 = vgHash31(i + float3(1.0, 1.0, 0.0));
+  float n001 = vgHash31(i + float3(0.0, 0.0, 1.0));
+  float n101 = vgHash31(i + float3(1.0, 0.0, 1.0));
+  float n011 = vgHash31(i + float3(0.0, 1.0, 1.0));
+  float n111 = vgHash31(i + float3(1.0, 1.0, 1.0));
+  float nx00 = mix(n000, n100, u.x);
+  float nx10 = mix(n010, n110, u.x);
+  float nx01 = mix(n001, n101, u.x);
+  float nx11 = mix(n011, n111, u.x);
+  float nxy0 = mix(nx00, nx10, u.y);
+  float nxy1 = mix(nx01, nx11, u.y);
+  return mix(nxy0, nxy1, u.z) * 2.0 - 1.0;
+}
+
+// Same as vgValueNoise3, but the z axis wraps at \`period\`: BOTH z-lattice neighbors (i.z and
+// i.z + 1.0) are folded into [0, period) before hashing, so this is EXACTLY the same function of
+// z and of z + period \u2014 not just close. vgPotential below calls this once per octave, each with
+// the period matching its own rate (MEDIUM_TIME_OCTAVES), so a phase that wraps at
+// MEDIUM_TIME_PERIOD reproduces the identical field instead of jumping to a new one.
+float vgValueNoise3Periodic(float3 p, float period) {
+  float3 i = floor(p);
+  float3 f = fract(p);
+  float3 u = f * f * (3.0 - 2.0 * f);
+  float z0 = mod(i.z, period);
+  float z1 = mod(i.z + 1.0, period);
+  float n000 = vgHash31(float3(i.xy, z0));
+  float n100 = vgHash31(float3(i.xy + float2(1.0, 0.0), z0));
+  float n010 = vgHash31(float3(i.xy + float2(0.0, 1.0), z0));
+  float n110 = vgHash31(float3(i.xy + float2(1.0, 1.0), z0));
+  float n001 = vgHash31(float3(i.xy, z1));
+  float n101 = vgHash31(float3(i.xy + float2(1.0, 0.0), z1));
+  float n011 = vgHash31(float3(i.xy + float2(0.0, 1.0), z1));
+  float n111 = vgHash31(float3(i.xy + float2(1.0, 1.0), z1));
+  float nx00 = mix(n000, n100, u.x);
+  float nx10 = mix(n010, n110, u.x);
+  float nx01 = mix(n001, n101, u.x);
+  float nx11 = mix(n011, n111, u.x);
+  float nxy0 = mix(nx00, nx10, u.y);
+  float nxy1 = mix(nx01, nx11, u.y);
+  return mix(nxy0, nxy1, u.z) * 2.0 - 1.0;
+}
+
+// The potential is an fbm of three octaves, each evolving over the field's PHASE at its own speed
+// (unrelated to the others, plus a phase offset): no single phase shift can align them all at
+// once, so no traveling pattern remains. Each octave wraps its own z-lattice at the period that
+// matches its rate (see MEDIUM_TIME_OCTAVES/vgValueNoise3Periodic), so
+// vgPotential(p, phase) === vgPotential(p, phase + ${glslFloat(MEDIUM_TIME_PERIOD)}) exactly \u2014 a
+// CPU-side phase accumulator can wrap at that period with no visible jump (see web/medium.ts). The
+// large-scale factor is a slow non-uniformity layered over the sum \u2014 without it, a field that's
+// uniform by statistics still reads as a regular cell pattern.
+float vgPotential(float2 p, float phase) {
+  float v = vgValueNoise3Periodic(float3(p * ${VG_OCT0.scale}, phase * ${VG_OCT0.rate} + ${VG_OCT0.offset}), ${VG_OCT0.period}) * 0.5;
+  v += vgValueNoise3Periodic(float3(p * ${VG_OCT1.scale}, phase * ${VG_OCT1.rate} + ${VG_OCT1.offset}), ${VG_OCT1.period}) * 0.25;
+  v += vgValueNoise3Periodic(float3(p * ${VG_OCT2.scale}, phase * ${VG_OCT2.rate} + ${VG_OCT2.offset}), ${VG_OCT2.period}) * 0.125;
+  float macro = vgValueNoise3Periodic(float3(p * ${VG_OCT3.scale}, phase * ${VG_OCT3.rate} + ${VG_OCT3.offset}), ${VG_OCT3.period});
+  return v * (0.7 + 0.3 * macro);
+}
+
+// Velocity = (dPsi/dy, -dPsi/dx) \u2014 the curl of a scalar field, solenoidal for any Psi. Central
+// differences instead of an analytic derivative: the potential is a sum of three value-noise
+// calls, and there is no cheaper way to differentiate it by hand than four extra samples.
+float2 vgCurlVelocity(float2 p, float phase) {
+  float e = 0.6;
+  float px1 = vgPotential(p + float2(e, 0.0), phase);
+  float px0 = vgPotential(p - float2(e, 0.0), phase);
+  float py1 = vgPotential(p + float2(0.0, e), phase);
+  float py0 = vgPotential(p - float2(0.0, e), phase);
+  return float2(py1 - py0, -(px1 - px0)) / (2.0 * e);
+}
+`;
+
+// src/medium/seed-shader.ts
+var MEDIUM_SEED_SHADER = `
+uniform float2 u_spot0;
+uniform float2 u_spot1;
+uniform float2 u_spot2;
+uniform float  u_spotRadius;
+
+float vgSpot(float2 p, float2 c, float r) {
+  float d = length(p - c) / max(r, 1.0);
+  return exp(-d * d * 2.0);
+}
+
+half4 main(float2 xy) {
+  float3 dye = float3(
+    vgSpot(xy, u_spot0, u_spotRadius),
+    vgSpot(xy, u_spot1, u_spotRadius),
+    vgSpot(xy, u_spot2, u_spotRadius)
+  );
+  return half4(half3(dye), half(1.0));
+}
+`;
+
+// src/medium/resample-shader.ts
+var MEDIUM_RESAMPLE_SHADER = `
+uniform shader u_src;
+
+half4 main(float2 xy) {
+  float2 uv = xy / u_resolution;
+  float2 src = uv * u_srcSize;
+  return u_src.eval(float2(src.x, u_srcSize.y - src.y));
+}
+`;
+
+// src/medium/advect-shader.ts
+var MEDIUM_ADVECT_UNIFORMS = `
+uniform shader u_dye;
+uniform float  u_dt;
+uniform float  u_phase;
+uniform float  u_curlFreq;
+uniform float  u_advectSpeed;
+uniform float  u_turbulence;
+
+${VG_CURL_NOISE}
+`;
+var MEDIUM_ADVECT_VELOCITY = `
+  float2 vel = vgCurlVelocity(xy * u_curlFreq, u_phase) * u_advectSpeed * u_turbulence;
+`;
+var MEDIUM_ADVECT_VELOCITY_SETTLE = `
+${MEDIUM_ADVECT_VELOCITY}
+  vel.y += u_settleSpeed;
+`;
+var MEDIUM_VAPOR_FORWARD_SHADER = `
+${MEDIUM_ADVECT_UNIFORMS}
+
+half4 main(float2 xy) {
+${MEDIUM_ADVECT_VELOCITY}
+  float2 src = xy - vel * u_dt;
+  return u_dye.eval(float2(src.x, u_dyeSize.y - src.y));
+}
+`;
+var MEDIUM_CONDENSATE_FORWARD_SHADER = `
+${MEDIUM_ADVECT_UNIFORMS}
+uniform float u_settleSpeed;
+
+half4 main(float2 xy) {
+${MEDIUM_ADVECT_VELOCITY_SETTLE}
+  float2 src = xy - vel * u_dt;
+  return u_dye.eval(float2(src.x, u_dyeSize.y - src.y));
+}
+`;
+var MEDIUM_MACCORMACK_CORRECT = `
+  float2 srcForward = xy - vel * u_dt;
+  float2 srcReverse = xy + vel * u_dt;
+  half4 forwardSelf = u_forward.eval(float2(xy.x, u_forwardSize.y - xy.y));
+  half4 forwardReverse = u_forward.eval(float2(srcReverse.x, u_forwardSize.y - srcReverse.y));
+  half4 prevSelf = u_dye.eval(float2(xy.x, u_dyeSize.y - xy.y));
+  half4 corrected = forwardSelf + half4(0.5) * (prevSelf - forwardReverse);
+
+  float2 src = float2(srcForward.x, u_dyeSize.y - srcForward.y);
+  float2 base = floor(src - 0.5);
+  half4 c00 = u_dye.eval(base + float2(0.5, 0.5));
+  half4 c10 = u_dye.eval(base + float2(1.5, 0.5));
+  half4 c01 = u_dye.eval(base + float2(0.5, 1.5));
+  half4 c11 = u_dye.eval(base + float2(1.5, 1.5));
+  half4 lo = min(min(c00, c10), min(c01, c11));
+  half4 hi = max(max(c00, c10), max(c01, c11));
+  half4 limited = clamp(corrected, lo, hi);
+`;
+var MEDIUM_VAPOR_CORRECT_SHADER = `
+${MEDIUM_ADVECT_UNIFORMS}
+uniform shader u_forward;
+
+half4 main(float2 xy) {
+${MEDIUM_ADVECT_VELOCITY}
+${MEDIUM_MACCORMACK_CORRECT}
+  return limited;
+}
+`;
+var MEDIUM_CONDENSATE_CORRECT_SHADER = `
+${MEDIUM_ADVECT_UNIFORMS}
+uniform float u_settleSpeed;
+uniform shader u_forward;
+
+half4 main(float2 xy) {
+${MEDIUM_ADVECT_VELOCITY_SETTLE}
+${MEDIUM_MACCORMACK_CORRECT}
+  return limited;
+}
+`;
+var MEDIUM_VAPOR_REACT_SHADER = `
+uniform shader u_transported;
+uniform shader u_condensateTransported;
+uniform float  u_dt;
+uniform float  u_condensationRate;
+uniform float  u_condensationFloor;
+uniform float  u_evaporationRate;
+uniform float  u_totalScale;
+
+half4 main(float2 xy) {
+  float3 prevVapor = float3(u_transported.eval(float2(xy.x, u_transportedSize.y - xy.y)).rgb);
+  float condensateAtXy = float(u_condensateTransported.eval(float2(xy.x, u_condensateTransportedSize.y - xy.y)).r);
+  float vaporTotal = prevVapor.r + prevVapor.g + prevVapor.b;
+
+  // Only the EXCESS of vapor above the background floor condenses, not any nonzero density \u2014
+  // otherwise condensate would exactly retrace the vapor spot's shape (the same outline, or
+  // softer from blur), leaving the two phases nowhere to visually diverge: vapor is already soft,
+  // and condensate needs to read brighter and sharper than it. The floor concentrates condensate
+  // in dense turbulence cores, leaving the sparse vapor around it uncondensed \u2014 that's where the
+  // contrast comes from.
+  float excess = max(0.0, vaporTotal - u_condensationFloor);
+  float condensedAmount = excess * (1.0 - exp(-u_condensationRate * u_dt));
+  float lossFraction = vaporTotal > 1e-6 ? condensedAmount / vaporTotal : 0.0;
+  float3 afterLoss = prevVapor * (1.0 - lossFraction);
+
+  float condKeep = exp(-u_evaporationRate * u_dt);
+  float returned = condensateAtXy * (1.0 - condKeep);
+
+  // Evaporated water is distributed by the CURRENT vapor proportion \u2014 the condensation/
+  // evaporation cycle doesn't shift the hue, water only oscillates between phases (color belongs
+  // to vapor).
+  float sumAfterLoss = afterLoss.r + afterLoss.g + afterLoss.b;
+  float3 hueShare = sumAfterLoss > 1e-6 ? afterLoss / sumAfterLoss : float3(1.0 / 3.0);
+  float3 vapor = (afterLoss + hueShare * returned) * u_totalScale;
+  return half4(half3(vapor), half(1.0));
+}
+`;
+var MEDIUM_CONDENSATE_REACT_SHADER = `
+uniform shader u_transported;
+uniform shader u_vaporTransported;
+uniform shader u_dye;
+uniform float  u_dt;
+uniform float  u_condensationRate;
+uniform float  u_condensationFloor;
+uniform float  u_evaporationRate;
+uniform float  u_spreadRate;
+uniform float  u_totalScale;
+
+half4 main(float2 xy) {
+  float prevCondensate = float(u_transported.eval(float2(xy.x, u_transportedSize.y - xy.y)).r);
+  float3 vaporAtXy = float3(u_vaporTransported.eval(float2(xy.x, u_vaporTransportedSize.y - xy.y)).rgb);
+  float vaporTotal = vaporAtXy.r + vaporAtXy.g + vaporAtXy.b;
+
+  float excess = max(0.0, vaporTotal - u_condensationFloor);
+  float condensed = excess * (1.0 - exp(-u_condensationRate * u_dt));
+  float condKeep = exp(-u_evaporationRate * u_dt);
+  float afterReaction = prevCondensate * condKeep + condensed;
+
+  // Growth is an Euler step separate from transport: the neighbors are sampled at THIS cell's own
+  // xy in the ORIGINAL (pre-transport-this-frame) field u_dye, not the already
+  // transported/corrected value. On a non-uniform flow, warping compresses the domain in some
+  // places and stretches it in others, and blurring at a warped point stacks those distortions \u2014
+  // the error accumulates frame over frame (measured: condensate steadily gained about 5% extra
+  // water alongside its own mass growth). Right on the grid, with no warp, the same blur is an
+  // honest averaging kernel that conserves the sum on a periodic domain.
+  float2 selfSrc = float2(xy.x, u_dyeSize.y - xy.y);
+  float n0 = float(u_dye.eval(float2(selfSrc.x + 1.0, selfSrc.y)).r);
+  float n1 = float(u_dye.eval(float2(selfSrc.x - 1.0, selfSrc.y)).r);
+  float n2 = float(u_dye.eval(float2(selfSrc.x, selfSrc.y - 1.0)).r);
+  float n3 = float(u_dye.eval(float2(selfSrc.x, selfSrc.y + 1.0)).r);
+  float neighborAvg = (n0 + n1 + n2 + n3) * 0.25;
+  float spreadWeight = 1.0 - exp(-u_spreadRate * u_dt);
+  float grown = mix(afterReaction, neighborAvg, spreadWeight) * u_totalScale;
+
+  return half4(half3(grown, 0.0, 0.0), half(1.0));
+}
+`;
+var MEDIUM_TRACK_ADVECT_SHADER = `
+${MEDIUM_ADVECT_UNIFORMS}
+uniform float u_decay;
+
+half4 main(float2 xy) {
+${MEDIUM_ADVECT_VELOCITY}
+  float2 back = xy - vel * u_dt;
+  half4 prev = u_dye.eval(float2(back.x, u_dyeSize.y - back.y));
+  float3 decayed = float3(prev.rgb) * exp(-u_decay * u_dt);
+  return half4(half3(decayed), half(1.0));
+}
+`;
+
+// src/medium/composite-shader.ts
+var MEDIUM_COMPOSITE_SHADER = `
+uniform shader u_vapor;
+uniform shader u_condensate;
+uniform shader u_track;
+uniform float2 u_dyeScale;
+uniform float3 u_lab0;
+uniform float3 u_lab1;
+uniform float3 u_lab2;
+uniform float3 u_labBg;
+uniform float3 u_labCondensate;
+uniform float  u_baseWeight;
+uniform float  u_condensateTint;
+uniform float  u_condensateGain;
+
+${VG_OKLAB_TO_SRGB}
+
+half4 main(float2 xy) {
+  float2 src = xy * u_dyeScale;
+  half4 vapor = u_vapor.eval(src);
+  half4 condensate = u_condensate.eval(src);
+  half4 track = u_track.eval(src);
+  float w0 = float(vapor.r) + float(track.r);
+  float w1 = float(vapor.g) + float(track.g);
+  float w2 = float(vapor.b) + float(track.b);
+  float wBg = u_baseWeight;
+
+  // A faint condensate hint from the LOCAL vapor, not its own color (droplets scatter light
+  // rather than tint it) \u2014 a fraction of the way from white to the vapor tone sampled right here.
+  float vaporLocal = max(w0 + w1 + w2, 1e-4);
+  float3 vaporHue = (u_lab0 * w0 + u_lab1 * w1 + u_lab2 * w2) / vaporLocal;
+  float3 condensateLab = mix(u_labCondensate, vaporHue, u_condensateTint);
+  float wCondensate = float(condensate.r) * u_condensateGain;
+
+  float total = max(w0 + w1 + w2 + wBg + wCondensate, 1e-4);
+  float3 mixLab =
+    (u_labBg * wBg + u_lab0 * w0 + u_lab1 * w1 + u_lab2 * w2 + condensateLab * wCondensate) / total;
+  float3 rgbLinear = clamp(vgOklabToLinear(mixLab), float3(0.0), float3(1.0));
+  float3 srgb = vgLinearToSrgb(rgbLinear);
+  return half4(half3(srgb), half(1.0));
+}
+`;
+
+// src/medium/emit-shader.ts
+var MEDIUM_EMIT_SHADER = `
+uniform float2 u_source;
+uniform float2 u_head;
+uniform float  u_headWidth;
+uniform float  u_tailWidth;
+uniform float  u_raggedAmp;
+uniform float  u_raggedFreq;
+uniform float  u_settle;
+uniform float  u_tailDim;
+uniform float  u_intensity;
+uniform float  u_seed;
+uniform float3 u_channelMask;
+
+${VG_VALUE_NOISE}
+
+half4 main(float2 xy) {
+  float2 dir = u_head - u_source;
+  float len = max(length(dir), 1.0);
+  float2 side = float2(-dir.y, dir.x) / len;
+
+  float best = 0.0;
+  const int STEPS = 12;
+  for (int i = 0; i < STEPS; i++) {
+    float s = float(i) / float(STEPS - 1);
+    float tailness = 1.0 - s;
+    float ragged = u_raggedAmp * tailness * vgValueNoise(float2(s * u_raggedFreq + u_seed, u_seed * 3.7));
+    float2 p = mix(u_source, u_head, s) + side * ragged + float2(0.0, u_settle * tailness * tailness);
+    float w = max(mix(u_tailWidth, u_headWidth, s), 0.5);
+    float amp = mix(u_tailDim, 1.0, s);
+    float d = length(xy - p);
+    float v = amp * exp(-(d * d) / (2.0 * w * w));
+    best = max(best, v);
+  }
+
+  float3 dye = u_channelMask * (best * u_intensity);
+  return half4(half3(dye), half(1.0));
+}
+`;
+function pickDyeFormat(gl) {
+  const hasFloat = gl.getExtension("EXT_color_buffer_float") !== null;
+  return hasFloat ? { internalFormat: gl.RGBA16F, type: gl.HALF_FLOAT } : { internalFormat: gl.RGBA8, type: gl.UNSIGNED_BYTE };
+}
+function createMediumRuntime(gl, vertexSource) {
+  const format = pickDyeFormat(gl);
+  const vaporForwardProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_VAPOR_FORWARD_SHADER));
+  const vaporCorrectProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_VAPOR_CORRECT_SHADER));
+  const vaporReactProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_VAPOR_REACT_SHADER));
+  const condensateForwardProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_CONDENSATE_FORWARD_SHADER));
+  const condensateCorrectProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_CONDENSATE_CORRECT_SHADER));
+  const condensateReactProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_CONDENSATE_REACT_SHADER));
+  const trackAdvectProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_TRACK_ADVECT_SHADER));
+  const compositeProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_COMPOSITE_SHADER));
+  const seedProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_SEED_SHADER));
+  const emitProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_EMIT_SHADER));
+  const resampleProgram = web.createProgram(gl, vertexSource, vireglass.toGLSL(MEDIUM_RESAMPLE_SHADER));
+  const vaporForwardLoc = web.locationCache(gl, vaporForwardProgram);
+  const vaporCorrectLoc = web.locationCache(gl, vaporCorrectProgram);
+  const vaporReactLoc = web.locationCache(gl, vaporReactProgram);
+  const condensateForwardLoc = web.locationCache(gl, condensateForwardProgram);
+  const condensateCorrectLoc = web.locationCache(gl, condensateCorrectProgram);
+  const condensateReactLoc = web.locationCache(gl, condensateReactProgram);
+  const trackAdvectLoc = web.locationCache(gl, trackAdvectProgram);
+  const compositeLoc = web.locationCache(gl, compositeProgram);
+  const seedLoc = web.locationCache(gl, seedProgram);
+  const emitLoc = web.locationCache(gl, emitProgram);
+  const resampleLoc = web.locationCache(gl, resampleProgram);
+  let gridW = 0;
+  let gridH = 0;
+  let vapor = null;
+  let condensate = null;
+  let track = null;
+  let vaporForward = null;
+  let vaporCorrected = null;
+  let condensateForward = null;
+  let condensateCorrected = null;
+  let front = 0;
+  function makeTarget(w, h) {
+    const texture = web.createTexture(gl, {
+      width: w,
+      height: h,
+      internalFormat: format.internalFormat,
+      type: format.type,
+      // REPEAT: a domain with no border — see TextureOptions.wrap. All buffers carry the same
+      // field, so the border needs to behave identically for each of them, or vapor would wrap
+      // while condensate or a track at the same coordinate cuts off. The MacCormack limiter also
+      // reads neighbors across this same border — it needs REPEAT exactly as much as transport does.
+      wrap: gl.REPEAT
+    });
+    const fbo = web.createFramebuffer(gl, texture);
+    return { texture, fbo };
+  }
+  function clearTarget(target, w, h) {
+    gl.bindFramebuffer(gl.FRAMEBUFFER, target.fbo);
+    gl.viewport(0, 0, w, h);
+    gl.clearColor(0, 0, 0, 1);
+    gl.clear(gl.COLOR_BUFFER_BIT);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+  }
+  function destroyPair(pair) {
+    if (!pair) return;
+    for (const t of pair) {
+      gl.deleteTexture(t.texture);
+      gl.deleteFramebuffer(t.fbo);
+    }
+  }
+  function destroyTarget(target) {
+    if (!target) return;
+    gl.deleteTexture(target.texture);
+    gl.deleteFramebuffer(target.fbo);
+  }
+  function destroyTargets() {
+    destroyPair(vapor);
+    destroyPair(condensate);
+    destroyPair(track);
+    destroyTarget(vaporForward);
+    destroyTarget(vaporCorrected);
+    destroyTarget(condensateForward);
+    destroyTarget(condensateCorrected);
+    vapor = null;
+    condensate = null;
+    track = null;
+    vaporForward = null;
+    vaporCorrected = null;
+    condensateForward = null;
+    condensateCorrected = null;
+  }
+  function seed(w, h) {
+    if (!vapor || !condensate || !track) return;
+    gl.bindFramebuffer(gl.FRAMEBUFFER, vapor[front].fbo);
+    gl.viewport(0, 0, w, h);
+    gl.disable(gl.BLEND);
+    gl.useProgram(seedProgram);
+    web.setUniform(gl, seedLoc("u_resolution"), [w, h]);
+    web.setUniform(gl, seedLoc("u_spot0"), [w * 0.28, h * 0.64]);
+    web.setUniform(gl, seedLoc("u_spot1"), [w * 0.7, h * 0.32]);
+    web.setUniform(gl, seedLoc("u_spot2"), [w * 0.48, h * 0.84]);
+    web.setUniform(gl, seedLoc("u_spotRadius"), Math.max(w, h) * 0.18);
+    web.drawFullscreenTriangle(gl);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+    clearTarget(condensate[0], w, h);
+    clearTarget(condensate[1], w, h);
+    clearTarget(track[0], w, h);
+    clearTarget(track[1], w, h);
+  }
+  function resample(src, srcW, srcH, dst, dstW, dstH) {
+    gl.bindFramebuffer(gl.FRAMEBUFFER, dst.fbo);
+    gl.viewport(0, 0, dstW, dstH);
+    gl.disable(gl.BLEND);
+    gl.useProgram(resampleProgram);
+    web.bindTextureAt(gl, 0, src.texture, resampleProgram, "u_src");
+    web.setUniform(gl, resampleLoc("u_srcSize"), [srcW, srcH]);
+    web.setUniform(gl, resampleLoc("u_resolution"), [dstW, dstH]);
+    web.drawFullscreenTriangle(gl);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+  }
+  function resizeGrid(w, h) {
+    if (!vapor || !condensate || !track) return;
+    const oldVapor = vapor;
+    const oldCondensate = condensate;
+    const oldTrack = track;
+    const oldW = gridW;
+    const oldH = gridH;
+    const newVaporFront = makeTarget(w, h);
+    const newCondensateFront = makeTarget(w, h);
+    const newTrackFront = makeTarget(w, h);
+    resample(oldVapor[front], oldW, oldH, newVaporFront, w, h);
+    resample(oldCondensate[front], oldW, oldH, newCondensateFront, w, h);
+    resample(oldTrack[front], oldW, oldH, newTrackFront, w, h);
+    destroyTargets();
+    gridW = w;
+    gridH = h;
+    vapor = [newVaporFront, makeTarget(w, h)];
+    condensate = [newCondensateFront, makeTarget(w, h)];
+    track = [newTrackFront, makeTarget(w, h)];
+    vaporForward = makeTarget(w, h);
+    vaporCorrected = makeTarget(w, h);
+    condensateForward = makeTarget(w, h);
+    condensateCorrected = makeTarget(w, h);
+    front = 0;
+    const areaRatio = w * h / (oldW * oldH);
+    waterTargetTotal *= areaRatio;
+  }
+  function ensureGrid(gridWidth, gridHeight) {
+    const w = Math.max(2, Math.round(gridWidth));
+    const h = Math.max(2, Math.round(gridHeight));
+    if (vapor && condensate && track && w === gridW && h === gridH) return;
+    if (!vapor || !condensate || !track) {
+      gridW = w;
+      gridH = h;
+      vapor = [makeTarget(w, h), makeTarget(w, h)];
+      condensate = [makeTarget(w, h), makeTarget(w, h)];
+      track = [makeTarget(w, h), makeTarget(w, h)];
+      vaporForward = makeTarget(w, h);
+      vaporCorrected = makeTarget(w, h);
+      condensateForward = makeTarget(w, h);
+      condensateCorrected = makeTarget(w, h);
+      front = 0;
+      seed(w, h);
+      waterTargetTotal = readTarget(vapor[front]) + readTarget(condensate[front]);
+      waterScale = 1;
+      timeSinceRenorm = 0;
+      framesSinceRenorm = 0;
+      return;
+    }
+    resizeGrid(w, h);
+  }
+  function bindVelocityUniforms(loc, dt, phase2, p) {
+    web.setUniform(gl, loc("u_dyeSize"), [gridW, gridH]);
+    web.setUniform(gl, loc("u_resolution"), [gridW, gridH]);
+    web.setUniform(gl, loc("u_dt"), dt);
+    web.setUniform(gl, loc("u_phase"), phase2);
+    web.setUniform(gl, loc("u_curlFreq"), p.curlFreq);
+    web.setUniform(gl, loc("u_advectSpeed"), p.advectSpeed);
+    web.setUniform(gl, loc("u_turbulence"), p.turbulence);
+  }
+  let phase = 0;
+  function wrapPhase(value) {
+    const wrapped = value % MEDIUM_TIME_PERIOD;
+    return wrapped < 0 ? wrapped + MEDIUM_TIME_PERIOD : wrapped;
+  }
+  const WATER_RENORM_INTERVAL_S = 1;
+  let waterTargetTotal = 0;
+  let waterScale = 1;
+  let timeSinceRenorm = 0;
+  let framesSinceRenorm = 0;
+  function step(dt, params = {}) {
+    if (!vapor || !condensate || !track || !vaporForward || !vaporCorrected || !condensateForward || !condensateCorrected) {
+      return;
+    }
+    const p = { ...MEDIUM_DEFAULTS, ...params };
+    const clampedDt = Math.min(Math.max(dt, 0), 1 / 15);
+    phase = wrapPhase(phase + clampedDt * p.curlSpeed);
+    const back = front === 0 ? 1 : 0;
+    const gridSize = [gridW, gridH];
+    gl.viewport(0, 0, gridW, gridH);
+    gl.disable(gl.BLEND);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, vaporForward.fbo);
+    gl.useProgram(vaporForwardProgram);
+    web.bindTextureAt(gl, 0, vapor[front].texture, vaporForwardProgram, "u_dye");
+    bindVelocityUniforms(vaporForwardLoc, clampedDt, phase, p);
+    web.drawFullscreenTriangle(gl);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, condensateForward.fbo);
+    gl.useProgram(condensateForwardProgram);
+    web.bindTextureAt(gl, 0, condensate[front].texture, condensateForwardProgram, "u_dye");
+    bindVelocityUniforms(condensateForwardLoc, clampedDt, phase, p);
+    web.setUniform(gl, condensateForwardLoc("u_settleSpeed"), p.condensateSettleSpeed);
+    web.drawFullscreenTriangle(gl);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, vaporCorrected.fbo);
+    gl.useProgram(vaporCorrectProgram);
+    web.bindTextureAt(gl, 0, vapor[front].texture, vaporCorrectProgram, "u_dye");
+    web.bindTextureAt(gl, 1, vaporForward.texture, vaporCorrectProgram, "u_forward");
+    web.setUniform(gl, vaporCorrectLoc("u_forwardSize"), gridSize);
+    bindVelocityUniforms(vaporCorrectLoc, clampedDt, phase, p);
+    web.drawFullscreenTriangle(gl);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, condensateCorrected.fbo);
+    gl.useProgram(condensateCorrectProgram);
+    web.bindTextureAt(gl, 0, condensate[front].texture, condensateCorrectProgram, "u_dye");
+    web.bindTextureAt(gl, 1, condensateForward.texture, condensateCorrectProgram, "u_forward");
+    web.setUniform(gl, condensateCorrectLoc("u_forwardSize"), gridSize);
+    bindVelocityUniforms(condensateCorrectLoc, clampedDt, phase, p);
+    web.setUniform(gl, condensateCorrectLoc("u_settleSpeed"), p.condensateSettleSpeed);
+    web.drawFullscreenTriangle(gl);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, vapor[back].fbo);
+    gl.useProgram(vaporReactProgram);
+    web.bindTextureAt(gl, 0, vaporCorrected.texture, vaporReactProgram, "u_transported");
+    web.bindTextureAt(gl, 1, condensateCorrected.texture, vaporReactProgram, "u_condensateTransported");
+    web.setUniform(gl, vaporReactLoc("u_transportedSize"), gridSize);
+    web.setUniform(gl, vaporReactLoc("u_condensateTransportedSize"), gridSize);
+    web.setUniform(gl, vaporReactLoc("u_resolution"), gridSize);
+    web.setUniform(gl, vaporReactLoc("u_dt"), clampedDt);
+    web.setUniform(gl, vaporReactLoc("u_condensationRate"), p.condensationRate);
+    web.setUniform(gl, vaporReactLoc("u_condensationFloor"), p.condensationFloor);
+    web.setUniform(gl, vaporReactLoc("u_evaporationRate"), p.evaporationRate);
+    web.setUniform(gl, vaporReactLoc("u_totalScale"), waterScale);
+    web.drawFullscreenTriangle(gl);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, condensate[back].fbo);
+    gl.useProgram(condensateReactProgram);
+    web.bindTextureAt(gl, 0, condensateCorrected.texture, condensateReactProgram, "u_transported");
+    web.bindTextureAt(gl, 1, vaporCorrected.texture, condensateReactProgram, "u_vaporTransported");
+    web.bindTextureAt(gl, 2, condensate[front].texture, condensateReactProgram, "u_dye");
+    web.setUniform(gl, condensateReactLoc("u_transportedSize"), gridSize);
+    web.setUniform(gl, condensateReactLoc("u_vaporTransportedSize"), gridSize);
+    web.setUniform(gl, condensateReactLoc("u_dyeSize"), gridSize);
+    web.setUniform(gl, condensateReactLoc("u_resolution"), gridSize);
+    web.setUniform(gl, condensateReactLoc("u_dt"), clampedDt);
+    web.setUniform(gl, condensateReactLoc("u_condensationRate"), p.condensationRate);
+    web.setUniform(gl, condensateReactLoc("u_condensationFloor"), p.condensationFloor);
+    web.setUniform(gl, condensateReactLoc("u_evaporationRate"), p.evaporationRate);
+    web.setUniform(gl, condensateReactLoc("u_spreadRate"), p.condensateSpreadRate);
+    web.setUniform(gl, condensateReactLoc("u_totalScale"), waterScale);
+    web.drawFullscreenTriangle(gl);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, track[back].fbo);
+    gl.useProgram(trackAdvectProgram);
+    web.bindTextureAt(gl, 0, track[front].texture, trackAdvectProgram, "u_dye");
+    bindVelocityUniforms(trackAdvectLoc, clampedDt, phase, p);
+    web.setUniform(gl, trackAdvectLoc("u_decay"), p.decay);
+    web.drawFullscreenTriangle(gl);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+    front = back;
+    framesSinceRenorm += 1;
+    timeSinceRenorm += clampedDt;
+    if (waterTargetTotal > 0 && timeSinceRenorm >= WATER_RENORM_INTERVAL_S && framesSinceRenorm > 0) {
+      const current = readTarget(vapor[front]) + readTarget(condensate[front]);
+      if (current > 1e-6) {
+        const totalRatio = waterTargetTotal / current;
+        const perFrame = Math.pow(totalRatio, 1 / framesSinceRenorm);
+        waterScale = Math.min(1.05, Math.max(0.95, perFrame));
+      }
+      timeSinceRenorm = 0;
+      framesSinceRenorm = 0;
+    }
+  }
+  function emit(emissions) {
+    if (!track || emissions.length === 0) return;
+    const minDim = Math.min(gridW, gridH);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, track[front].fbo);
+    gl.viewport(0, 0, gridW, gridH);
+    gl.enable(gl.BLEND);
+    gl.blendFunc(gl.ONE, gl.ONE);
+    gl.useProgram(emitProgram);
+    web.setUniform(gl, emitLoc("u_resolution"), [gridW, gridH]);
+    for (const e of emissions) {
+      const source = [e.source[0] * gridW, e.source[1] * gridH];
+      const length = e.lengthFrac * minDim;
+      const head = [
+        source[0] + Math.cos(e.angle) * length,
+        source[1] + Math.sin(e.angle) * length
+      ];
+      web.setUniform(gl, emitLoc("u_source"), source);
+      web.setUniform(gl, emitLoc("u_head"), head);
+      web.setUniform(gl, emitLoc("u_headWidth"), e.headWidthFrac * minDim);
+      web.setUniform(gl, emitLoc("u_tailWidth"), e.tailWidthFrac * minDim);
+      web.setUniform(gl, emitLoc("u_raggedAmp"), e.raggedFrac * minDim);
+      web.setUniform(gl, emitLoc("u_raggedFreq"), e.raggedFreq);
+      web.setUniform(gl, emitLoc("u_settle"), e.settleFrac * minDim);
+      web.setUniform(gl, emitLoc("u_tailDim"), e.tailDim);
+      web.setUniform(gl, emitLoc("u_intensity"), e.intensity);
+      web.setUniform(gl, emitLoc("u_seed"), e.seed);
+      web.setUniform(gl, emitLoc("u_channelMask"), e.channel);
+      web.drawFullscreenTriangle(gl);
+    }
+    gl.disable(gl.BLEND);
+    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+  }
+  function composite(contentWidth, contentHeight, params = {}) {
+    if (!vapor || !condensate || !track) return;
+    const p = { ...MEDIUM_DEFAULTS, ...params };
+    gl.viewport(0, 0, contentWidth, contentHeight);
+    gl.disable(gl.BLEND);
+    gl.useProgram(compositeProgram);
+    web.bindTextureAt(gl, 0, vapor[front].texture, compositeProgram, "u_vapor");
+    web.bindTextureAt(gl, 1, condensate[front].texture, compositeProgram, "u_condensate");
+    web.bindTextureAt(gl, 2, track[front].texture, compositeProgram, "u_track");
+    web.setUniform(gl, compositeLoc("u_vaporSize"), [gridW, gridH]);
+    web.setUniform(gl, compositeLoc("u_condensateSize"), [gridW, gridH]);
+    web.setUniform(gl, compositeLoc("u_trackSize"), [gridW, gridH]);
+    web.setUniform(gl, compositeLoc("u_resolution"), [contentWidth, contentHeight]);
+    web.setUniform(gl, compositeLoc("u_dyeScale"), [gridW / contentWidth, gridH / contentHeight]);
+    web.setUniform(gl, compositeLoc("u_lab0"), srgbToOklab(p.channelColors[0]));
+    web.setUniform(gl, compositeLoc("u_lab1"), srgbToOklab(p.channelColors[1]));
+    web.setUniform(gl, compositeLoc("u_lab2"), srgbToOklab(p.channelColors[2]));
+    web.setUniform(gl, compositeLoc("u_labBg"), srgbToOklab(p.baseColor));
+    web.setUniform(gl, compositeLoc("u_labCondensate"), srgbToOklab(p.condensateColor));
+    web.setUniform(gl, compositeLoc("u_baseWeight"), p.baseWeight);
+    web.setUniform(gl, compositeLoc("u_condensateTint"), p.condensateTint);
+    web.setUniform(gl, compositeLoc("u_condensateGain"), p.condensateGain);
+    web.drawFullscreenTriangle(gl);
+  }
+  function readTarget(target) {
+    gl.bindFramebuffer(gl.FRAMEBUFFER, target.fbo);
+    let sum = 0;
+    if (format.type === gl.HALF_FLOAT) {
+      const buf = new Float32Array(gridW * gridH * 4);
+      gl.readPixels(0, 0, gridW, gridH, gl.RGBA, gl.FLOAT, buf);
+      for (let i = 0; i < buf.length; i += 4) sum += buf[i] + buf[i + 1] + buf[i + 2];
+    } else {
+      const buf = new Uint8Array(gridW * gridH * 4);
+      gl.readPixels(0, 0, gridW, gridH, gl.RGBA, gl.UNSIGNED_BYTE, buf);
+      for (let i = 0; i < buf.length; i += 4) sum += (buf[i] + buf[i + 1] + buf[i + 2]) / 255;
+    }
+    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+    return sum;
+  }
+  function readTotals() {
+    if (!vapor || !condensate || !track) return null;
+    return {
+      vapor: readTarget(vapor[front]),
+      condensate: readTarget(condensate[front]),
+      track: readTarget(track[front])
+    };
+  }
+  function readVaporGrid() {
+    if (!vapor) return null;
+    gl.bindFramebuffer(gl.FRAMEBUFFER, vapor[front].fbo);
+    const cells = gridW * gridH;
+    const data = new Array(cells * 3);
+    if (format.type === gl.HALF_FLOAT) {
+      const buf = new Float32Array(cells * 4);
+      gl.readPixels(0, 0, gridW, gridH, gl.RGBA, gl.FLOAT, buf);
+      for (let i = 0; i < cells; i += 1) {
+        data[i * 3] = buf[i * 4];
+        data[i * 3 + 1] = buf[i * 4 + 1];
+        data[i * 3 + 2] = buf[i * 4 + 2];
+      }
+    } else {
+      const buf = new Uint8Array(cells * 4);
+      gl.readPixels(0, 0, gridW, gridH, gl.RGBA, gl.UNSIGNED_BYTE, buf);
+      for (let i = 0; i < cells; i += 1) {
+        data[i * 3] = buf[i * 4] / 255;
+        data[i * 3 + 1] = buf[i * 4 + 1] / 255;
+        data[i * 3 + 2] = buf[i * 4 + 2] / 255;
+      }
+    }
+    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+    return { cols: gridW, rows: gridH, data };
+  }
+  function readCondensateGrid() {
+    if (!condensate) return null;
+    gl.bindFramebuffer(gl.FRAMEBUFFER, condensate[front].fbo);
+    const cells = gridW * gridH;
+    const data = new Array(cells);
+    if (format.type === gl.HALF_FLOAT) {
+      const buf = new Float32Array(cells * 4);
+      gl.readPixels(0, 0, gridW, gridH, gl.RGBA, gl.FLOAT, buf);
+      for (let i = 0; i < cells; i += 1) data[i] = buf[i * 4];
+    } else {
+      const buf = new Uint8Array(cells * 4);
+      gl.readPixels(0, 0, gridW, gridH, gl.RGBA, gl.UNSIGNED_BYTE, buf);
+      for (let i = 0; i < cells; i += 1) data[i] = buf[i * 4] / 255;
+    }
+    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+    return { cols: gridW, rows: gridH, data };
+  }
+  function destroy() {
+    destroyTargets();
+    gl.deleteProgram(vaporForwardProgram);
+    gl.deleteProgram(vaporCorrectProgram);
+    gl.deleteProgram(vaporReactProgram);
+    gl.deleteProgram(condensateForwardProgram);
+    gl.deleteProgram(condensateCorrectProgram);
+    gl.deleteProgram(condensateReactProgram);
+    gl.deleteProgram(trackAdvectProgram);
+    gl.deleteProgram(compositeProgram);
+    gl.deleteProgram(seedProgram);
+    gl.deleteProgram(emitProgram);
+    gl.deleteProgram(resampleProgram);
+  }
+  return { ensureGrid, step, emit, composite, readTotals, readVaporGrid, readCondensateGrid, destroy };
+}
+function createMediumBackdrop() {
+  let runtime = null;
+  let owner = null;
+  return {
+    pass: (frame) => (gl, target) => {
+      if (owner && owner !== gl) throw new Error("vireuikit: the medium is already bound to another WebGL context");
+      owner = gl;
+      runtime ??= createMediumRuntime(gl, web.FULLSCREEN_TRIANGLE_VERTEX_SOURCE);
+      runtime.ensureGrid(frame.gridWidth, frame.gridHeight);
+      runtime.step(frame.dt, frame.params);
+      runtime.emit(frame.emissions ?? []);
+      gl.bindFramebuffer(gl.FRAMEBUFFER, target.framebuffer);
+      runtime.composite(target.width, target.height, frame.params);
+    },
+    readTotals: () => runtime?.readTotals() ?? null,
+    readVaporGrid: () => runtime?.readVaporGrid() ?? null,
+    readCondensateGrid: () => runtime?.readCondensateGrid() ?? null,
+    destroy: () => {
+      runtime?.destroy();
+      runtime = null;
+      owner = null;
+    }
+  };
+}
+
+exports.createMediumBackdrop = createMediumBackdrop;
+exports.createMediumRuntime = createMediumRuntime;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map