@viji-dev/core 0.3.25 → 0.3.27

package/dist/assets/{viji.worker-Zg128woJ.js → viji.worker-jTmB7qoQ.js}

@@ -1185,21 +1185,21 @@ class CVSystem {
         setTimeout(() => reject(new Error("CV processing timeout")), 500);
       });
       const results = await Promise.race([processPromise, timeoutPromise]);
-      if (results.faces && (this.activeFeatures.has("faceDetection") || this.activeFeatures.has("faceMesh") || this.activeFeatures.has("emotionDetection"))) {
+      if ("faces" in results && (this.activeFeatures.has("faceDetection") || this.activeFeatures.has("faceMesh") || this.activeFeatures.has("emotionDetection"))) {
         this.results.faces = results.faces;
         this.debugLog(`📥 Received ${results.faces.length} face results`);
       }
-      if (results.hands && this.activeFeatures.has("handTracking")) {
+      if ("hands" in results && this.activeFeatures.has("handTracking")) {
         this.results.hands = results.hands;
         this.debugLog(`📥 Received ${results.hands.length} hand results`);
       }
-      if (results.pose && this.activeFeatures.has("poseDetection")) {
+      if ("pose" in results && this.activeFeatures.has("poseDetection")) {
         this.results.pose = results.pose;
-        this.debugLog(`📥 Received pose results with ${results.pose.landmarks.length} landmarks`);
+        this.debugLog(`📥 Received pose results: ${results.pose ? results.pose.landmarks.length + " landmarks" : "none"}`);
       }
-      if (results.segmentation && this.activeFeatures.has("bodySegmentation")) {
+      if ("segmentation" in results && this.activeFeatures.has("bodySegmentation")) {
         this.results.segmentation = results.segmentation;
-        this.debugLog(`📥 Received segmentation results ${results.segmentation.width}x${results.segmentation.height}`);
+        this.debugLog(`📥 Received segmentation: ${results.segmentation ? results.segmentation.width + "x" + results.segmentation.height : "none"}`);
       }
       const processingTime = performance.now() - this.processingStartTime;
       this.processingTimes.push(processingTime);
@@ -1792,6 +1792,7 @@ class P5WorkerAdapter {
     this.offscreenCanvas = offscreenCanvas;
     this.setupFn = sceneCode.setup || null;
     this.renderFn = sceneCode.render;
+    this.p5CanvasMode = sceneCode.canvasMode === "webgl" ? "webgl" : "2d";
     this.installMinimalShims();
   }
   p5Instance = null;
@@ -1804,6 +1805,7 @@ class P5WorkerAdapter {
   imageParameterCache = /* @__PURE__ */ new Map();
   // Track if P5.js's main canvas has been created
   mainCanvasCreated = false;
+  p5CanvasMode;
   /**
    * Initialize P5 instance after P5.js library is loaded
    * This must be called after the P5 class is available
@@ -1816,7 +1818,15 @@ class P5WorkerAdapter {
         new this.p5Class((p) => {
           this.p5Instance = p;
           p.setup = () => {
-            p.createCanvas(this.offscreenCanvas.width, this.offscreenCanvas.height);
+            if (this.p5CanvasMode === "webgl") {
+              p.createCanvas(
+                this.offscreenCanvas.width,
+                this.offscreenCanvas.height,
+                p.WEBGL
+              );
+            } else {
+              p.createCanvas(this.offscreenCanvas.width, this.offscreenCanvas.height);
+            }
             p.noLoop();
             this.p5InternalSetupComplete = true;
             resolve();
@@ -2052,8 +2062,8 @@ class P5WorkerAdapter {
         height: bitmap.height
       };
     }
-    if (Array.isArray(vijiAPI.streams)) {
-      for (const stream of vijiAPI.streams) {
+    if (Array.isArray(vijiAPI.videoStreams)) {
+      for (const stream of vijiAPI.videoStreams) {
         if (stream?.currentFrame instanceof OffscreenCanvas) {
           const canvas = stream.currentFrame;
           stream.currentFrame = {
@@ -2379,12 +2389,14 @@ class ShaderWorkerAdapter {
       this.gl = gl;
     }
   }
-  static MAX_STREAMS = 8;
+  static MAX_VIDEO_STREAMS = 8;
   // Maximum number of compositor input streams
   static MAX_EXTERNAL_DEVICES = 8;
   // Maximum number of external devices
   static MAX_DEVICE_VIDEOS = 8;
   // Maximum number of device video streams
+  static MAX_AUDIO_STREAMS = 8;
+  // Maximum number of additional audio streams
   gl;
   program = null;
   uniformLocations = /* @__PURE__ */ new Map();
@@ -2404,7 +2416,7 @@ class ShaderWorkerAdapter {
   segmentationTexture = null;
   keyboardTexture = null;
   // Multi-stream textures
-  streamTextures = [];
+  videoStreamTextures = [];
   // Device video textures
   deviceTextures = new Array(ShaderWorkerAdapter.MAX_DEVICE_VIDEOS).fill(null);
   // Accumulator state (CPU-side phase accumulators for smooth parameter-driven animation)
@@ -2642,11 +2654,11 @@ uniform float u_audioPeak; // Peak amplitude (0-1)
 uniform float u_audioVolumeSmoothed; // Smoothed volume for animation (200ms decay)
 
 // Audio - Frequency Bands (instant)
-uniform float u_audioLow; // Low 20-150 Hz (0-1)
-uniform float u_audioLowMid; // Low-mid 150-400 Hz (0-1)
-uniform float u_audioMid; // Mid 400-2500 Hz (0-1)
-uniform float u_audioHighMid; // High-mid 2500-8000 Hz (0-1)
-uniform float u_audioHigh; // High 8000-20000 Hz (0-1)
+uniform float u_audioLow; // Low 20-120 Hz (0-1)
+uniform float u_audioLowMid; // Low-mid 120-400 Hz (0-1)
+uniform float u_audioMid; // Mid 400-1600 Hz (0-1)
+uniform float u_audioHighMid; // High-mid 1600-6000 Hz (0-1)
+uniform float u_audioHigh; // High 6000-16000 Hz (0-1)
 
 // Audio - Frequency Bands (smoothed, 150ms decay)
 uniform float u_audioLowSmoothed; // Smoothed low band (0-1)
@@ -2683,7 +2695,7 @@ uniform float u_audioBrightness; // Spectral brightness / centroid (0-1)
 uniform float u_audioFlatness; // Spectral flatness / noisiness (0-1)
 
 // Audio - Textures
-uniform sampler2D u_audioFFT; // FFT frequency spectrum (512 bins, 0-255)
+uniform sampler2D u_audioFFT; // FFT frequency spectrum (1024 bins, 0-255)
 uniform sampler2D u_audioWaveform; // Time-domain waveform (fftSize samples, -1 to 1)
 
 // Video
@@ -2692,31 +2704,31 @@ uniform vec2 u_videoResolution; // Video frame width and height in pixels
 uniform float u_videoFrameRate; // Video frame rate in frames per second
 
 // Multi-Stream Compositor Support (using individual uniforms due to WebGL 1.0 limitations)
-uniform int u_streamCount; // Number of available compositor input streams (0-8)
-uniform sampler2D u_stream0; // Stream 0 texture
-uniform sampler2D u_stream1; // Stream 1 texture
-uniform sampler2D u_stream2; // Stream 2 texture
-uniform sampler2D u_stream3; // Stream 3 texture
-uniform sampler2D u_stream4; // Stream 4 texture
-uniform sampler2D u_stream5; // Stream 5 texture
-uniform sampler2D u_stream6; // Stream 6 texture
-uniform sampler2D u_stream7; // Stream 7 texture
-uniform vec2 u_stream0Resolution; // Stream 0 resolution
-uniform vec2 u_stream1Resolution; // Stream 1 resolution
-uniform vec2 u_stream2Resolution; // Stream 2 resolution
-uniform vec2 u_stream3Resolution; // Stream 3 resolution
-uniform vec2 u_stream4Resolution; // Stream 4 resolution
-uniform vec2 u_stream5Resolution; // Stream 5 resolution
-uniform vec2 u_stream6Resolution; // Stream 6 resolution
-uniform vec2 u_stream7Resolution; // Stream 7 resolution
-uniform bool u_stream0Connected; // Stream 0 connection status
-uniform bool u_stream1Connected; // Stream 1 connection status
-uniform bool u_stream2Connected; // Stream 2 connection status
-uniform bool u_stream3Connected; // Stream 3 connection status
-uniform bool u_stream4Connected; // Stream 4 connection status
-uniform bool u_stream5Connected; // Stream 5 connection status
-uniform bool u_stream6Connected; // Stream 6 connection status
-uniform bool u_stream7Connected; // Stream 7 connection status
+uniform int u_videoStreamCount; // Number of available compositor input streams (0-8)
+uniform sampler2D u_videoStream0; // Video stream 0 texture
+uniform sampler2D u_videoStream1; // Video stream 1 texture
+uniform sampler2D u_videoStream2; // Video stream 2 texture
+uniform sampler2D u_videoStream3; // Video stream 3 texture
+uniform sampler2D u_videoStream4; // Video stream 4 texture
+uniform sampler2D u_videoStream5; // Video stream 5 texture
+uniform sampler2D u_videoStream6; // Video stream 6 texture
+uniform sampler2D u_videoStream7; // Video stream 7 texture
+uniform vec2 u_videoStream0Resolution; // Video stream 0 resolution
+uniform vec2 u_videoStream1Resolution; // Video stream 1 resolution
+uniform vec2 u_videoStream2Resolution; // Video stream 2 resolution
+uniform vec2 u_videoStream3Resolution; // Video stream 3 resolution
+uniform vec2 u_videoStream4Resolution; // Video stream 4 resolution
+uniform vec2 u_videoStream5Resolution; // Video stream 5 resolution
+uniform vec2 u_videoStream6Resolution; // Video stream 6 resolution
+uniform vec2 u_videoStream7Resolution; // Video stream 7 resolution
+uniform bool u_videoStream0Connected; // Video stream 0 connection status
+uniform bool u_videoStream1Connected; // Video stream 1 connection status
+uniform bool u_videoStream2Connected; // Video stream 2 connection status
+uniform bool u_videoStream3Connected; // Video stream 3 connection status
+uniform bool u_videoStream4Connected; // Video stream 4 connection status
+uniform bool u_videoStream5Connected; // Video stream 5 connection status
+uniform bool u_videoStream6Connected; // Video stream 6 connection status
+uniform bool u_videoStream7Connected; // Video stream 7 connection status
 
 // Device Video Support (device cameras)
 uniform int u_deviceCount; // Number of device videos (0-8)
@@ -2745,6 +2757,81 @@ uniform bool u_device5Connected; // Device 5 connection status
 uniform bool u_device6Connected; // Device 6 connection status
 uniform bool u_device7Connected; // Device 7 connection status
 
+// Additional Audio Streams (lightweight analysis, no beat/FFT)
+uniform int u_audioStreamCount; // Number of additional audio streams (0-8)
+uniform bool u_audioStream0Connected; // Stream 0 connection status
+uniform float u_audioStream0Volume; // Stream 0 volume (0-1)
+uniform float u_audioStream0Low; // Stream 0 low band (0-1)
+uniform float u_audioStream0LowMid; // Stream 0 low-mid band (0-1)
+uniform float u_audioStream0Mid; // Stream 0 mid band (0-1)
+uniform float u_audioStream0HighMid; // Stream 0 high-mid band (0-1)
+uniform float u_audioStream0High; // Stream 0 high band (0-1)
+uniform float u_audioStream0Brightness; // Stream 0 spectral brightness (0-1)
+uniform float u_audioStream0Flatness; // Stream 0 spectral flatness (0-1)
+uniform bool u_audioStream1Connected;
+uniform float u_audioStream1Volume;
+uniform float u_audioStream1Low;
+uniform float u_audioStream1LowMid;
+uniform float u_audioStream1Mid;
+uniform float u_audioStream1HighMid;
+uniform float u_audioStream1High;
+uniform float u_audioStream1Brightness;
+uniform float u_audioStream1Flatness;
+uniform bool u_audioStream2Connected;
+uniform float u_audioStream2Volume;
+uniform float u_audioStream2Low;
+uniform float u_audioStream2LowMid;
+uniform float u_audioStream2Mid;
+uniform float u_audioStream2HighMid;
+uniform float u_audioStream2High;
+uniform float u_audioStream2Brightness;
+uniform float u_audioStream2Flatness;
+uniform bool u_audioStream3Connected;
+uniform float u_audioStream3Volume;
+uniform float u_audioStream3Low;
+uniform float u_audioStream3LowMid;
+uniform float u_audioStream3Mid;
+uniform float u_audioStream3HighMid;
+uniform float u_audioStream3High;
+uniform float u_audioStream3Brightness;
+uniform float u_audioStream3Flatness;
+uniform bool u_audioStream4Connected;
+uniform float u_audioStream4Volume;
+uniform float u_audioStream4Low;
+uniform float u_audioStream4LowMid;
+uniform float u_audioStream4Mid;
+uniform float u_audioStream4HighMid;
+uniform float u_audioStream4High;
+uniform float u_audioStream4Brightness;
+uniform float u_audioStream4Flatness;
+uniform bool u_audioStream5Connected;
+uniform float u_audioStream5Volume;
+uniform float u_audioStream5Low;
+uniform float u_audioStream5LowMid;
+uniform float u_audioStream5Mid;
+uniform float u_audioStream5HighMid;
+uniform float u_audioStream5High;
+uniform float u_audioStream5Brightness;
+uniform float u_audioStream5Flatness;
+uniform bool u_audioStream6Connected;
+uniform float u_audioStream6Volume;
+uniform float u_audioStream6Low;
+uniform float u_audioStream6LowMid;
+uniform float u_audioStream6Mid;
+uniform float u_audioStream6HighMid;
+uniform float u_audioStream6High;
+uniform float u_audioStream6Brightness;
+uniform float u_audioStream6Flatness;
+uniform bool u_audioStream7Connected;
+uniform float u_audioStream7Volume;
+uniform float u_audioStream7Low;
+uniform float u_audioStream7LowMid;
+uniform float u_audioStream7Mid;
+uniform float u_audioStream7HighMid;
+uniform float u_audioStream7High;
+uniform float u_audioStream7Brightness;
+uniform float u_audioStream7Flatness;
+
 // CV - Face Detection & Expressions
 uniform int u_faceCount; // Number of detected faces (0-1)
 uniform vec4 u_face0Bounds; // First face bounding box (x, y, width, height) normalized 0-1
@@ -2823,18 +2910,41 @@ uniform float u_face0TongueOut;
 uniform int u_handCount; // Number of detected hands (0-2)
 uniform vec3 u_leftHandPalm; // Left hand palm position (x, y, z)
 uniform vec3 u_rightHandPalm; // Right hand palm position (x, y, z)
+uniform float u_leftHandConfidence; // Left hand detection confidence (0-1)
+uniform float u_rightHandConfidence; // Right hand detection confidence (0-1)
+uniform vec4 u_leftHandBounds; // Left hand bounding box (x, y, width, height) normalized 0-1
+uniform vec4 u_rightHandBounds; // Right hand bounding box (x, y, width, height) normalized 0-1
 uniform float u_leftHandFist; // Left hand fist gesture confidence (0-1)
 uniform float u_leftHandOpen; // Left hand open palm gesture confidence (0-1)
+uniform float u_leftHandPeace; // Left hand peace/victory gesture confidence (0-1)
+uniform float u_leftHandThumbsUp; // Left hand thumbs up gesture confidence (0-1)
+uniform float u_leftHandThumbsDown; // Left hand thumbs down gesture confidence (0-1)
+uniform float u_leftHandPointing; // Left hand pointing gesture confidence (0-1)
+uniform float u_leftHandILoveYou; // Left hand I-love-you gesture confidence (0-1)
 uniform float u_rightHandFist; // Right hand fist gesture confidence (0-1)
 uniform float u_rightHandOpen; // Right hand open palm gesture confidence (0-1)
+uniform float u_rightHandPeace; // Right hand peace/victory gesture confidence (0-1)
+uniform float u_rightHandThumbsUp; // Right hand thumbs up gesture confidence (0-1)
+uniform float u_rightHandThumbsDown; // Right hand thumbs down gesture confidence (0-1)
+uniform float u_rightHandPointing; // Right hand pointing gesture confidence (0-1)
+uniform float u_rightHandILoveYou; // Right hand I-love-you gesture confidence (0-1)
 
 // CV - Pose Detection
 uniform bool u_poseDetected; // True if a pose is currently detected
-uniform vec2 u_nosePosition; // Nose landmark position in pixels
-uniform vec2 u_leftWristPosition; // Left wrist landmark position in pixels
-uniform vec2 u_rightWristPosition; // Right wrist landmark position in pixels
-uniform vec2 u_leftAnklePosition; // Left ankle landmark position in pixels
-uniform vec2 u_rightAnklePosition; // Right ankle landmark position in pixels
+uniform float u_poseConfidence; // Pose detection confidence (0-1)
+uniform vec2 u_nosePosition; // Nose landmark position (normalized 0-1)
+uniform vec2 u_leftShoulderPosition; // Left shoulder position (normalized 0-1)
+uniform vec2 u_rightShoulderPosition; // Right shoulder position (normalized 0-1)
+uniform vec2 u_leftElbowPosition; // Left elbow position (normalized 0-1)
+uniform vec2 u_rightElbowPosition; // Right elbow position (normalized 0-1)
+uniform vec2 u_leftWristPosition; // Left wrist position (normalized 0-1)
+uniform vec2 u_rightWristPosition; // Right wrist position (normalized 0-1)
+uniform vec2 u_leftHipPosition; // Left hip position (normalized 0-1)
+uniform vec2 u_rightHipPosition; // Right hip position (normalized 0-1)
+uniform vec2 u_leftKneePosition; // Left knee position (normalized 0-1)
+uniform vec2 u_rightKneePosition; // Right knee position (normalized 0-1)
+uniform vec2 u_leftAnklePosition; // Left ankle position (normalized 0-1)
+uniform vec2 u_rightAnklePosition; // Right ankle position (normalized 0-1)
 
 // CV - Segmentation
 uniform sampler2D u_segmentationMask; // Body segmentation mask texture (0=background, 1=person)
@@ -2950,7 +3060,7 @@ ${error}`);
       if (info) {
         const location = gl.getUniformLocation(this.program, info.name);
         this.uniformLocations.set(info.name, location);
-        if (info.name.includes("stream") || info.name.includes("u_stream")) {
+        if (info.name.includes("Stream") || info.name.includes("stream")) {
           streamUniforms.push(info.name);
         }
       }
@@ -2970,8 +3080,8 @@ ${error}`);
     this.textureUnits.set("u_video", this.nextTextureUnit++);
     this.textureUnits.set("u_segmentationMask", this.nextTextureUnit++);
     this.textureUnits.set("u_keyboard", this.nextTextureUnit++);
-    for (let i = 0; i < ShaderWorkerAdapter.MAX_STREAMS; i++) {
-      this.textureUnits.set(`u_stream${i}`, this.nextTextureUnit++);
+    for (let i = 0; i < ShaderWorkerAdapter.MAX_VIDEO_STREAMS; i++) {
+      this.textureUnits.set(`u_videoStream${i}`, this.nextTextureUnit++);
     }
     if (this.backbufferEnabled) {
       this.textureUnits.set("backbuffer", this.nextTextureUnit++);
@@ -3142,18 +3252,18 @@ ${error}`);
       this.setUniform("u_videoResolution", "vec2", [0, 0]);
       this.setUniform("u_videoFrameRate", "float", 0);
     }
-    const streams = viji.streams || [];
-    const streamCount = Math.min(streams.length, ShaderWorkerAdapter.MAX_STREAMS);
-    this.setUniform("u_streamCount", "int", streamCount);
-    for (let i = 0; i < ShaderWorkerAdapter.MAX_STREAMS; i++) {
-      const connectedUniform = `u_stream${i}Connected`;
-      const resolutionUniform = `u_stream${i}Resolution`;
-      if (i < streamCount && streams[i]?.isConnected && streams[i]?.currentFrame) {
-        this.updateStreamTexture(i, streams[i].currentFrame);
+    const videoStreams = viji.videoStreams || [];
+    const videoStreamCount = Math.min(videoStreams.length, ShaderWorkerAdapter.MAX_VIDEO_STREAMS);
+    this.setUniform("u_videoStreamCount", "int", videoStreamCount);
+    for (let i = 0; i < ShaderWorkerAdapter.MAX_VIDEO_STREAMS; i++) {
+      const connectedUniform = `u_videoStream${i}Connected`;
+      const resolutionUniform = `u_videoStream${i}Resolution`;
+      if (i < videoStreamCount && videoStreams[i]?.isConnected && videoStreams[i]?.currentFrame) {
+        this.updateVideoStreamTexture(i, videoStreams[i].currentFrame);
         this.setUniform(
           resolutionUniform,
           "vec2",
-          [streams[i].frameWidth, streams[i].frameHeight]
+          [videoStreams[i].frameWidth, videoStreams[i].frameHeight]
         );
         this.setUniform(connectedUniform, "bool", true);
       } else {
@@ -3180,6 +3290,34 @@ ${error}`);
         this.setUniform(connectedUniform, "bool", false);
       }
     }
+    const audioStreams = viji.audioStreams || [];
+    const audioStreamCount = Math.min(audioStreams.length, ShaderWorkerAdapter.MAX_AUDIO_STREAMS);
+    this.setUniform("u_audioStreamCount", "int", audioStreamCount);
+    for (let i = 0; i < ShaderWorkerAdapter.MAX_AUDIO_STREAMS; i++) {
+      const prefix = `u_audioStream${i}`;
+      if (i < audioStreamCount && audioStreams[i]?.isConnected) {
+        const s = audioStreams[i];
+        this.setUniform(`${prefix}Connected`, "bool", true);
+        this.setUniform(`${prefix}Volume`, "float", s.volume?.current || 0);
+        this.setUniform(`${prefix}Low`, "float", s.bands?.low || 0);
+        this.setUniform(`${prefix}LowMid`, "float", s.bands?.lowMid || 0);
+        this.setUniform(`${prefix}Mid`, "float", s.bands?.mid || 0);
+        this.setUniform(`${prefix}HighMid`, "float", s.bands?.highMid || 0);
+        this.setUniform(`${prefix}High`, "float", s.bands?.high || 0);
+        this.setUniform(`${prefix}Brightness`, "float", s.spectral?.brightness || 0);
+        this.setUniform(`${prefix}Flatness`, "float", s.spectral?.flatness || 0);
+      } else {
+        this.setUniform(`${prefix}Connected`, "bool", false);
+        this.setUniform(`${prefix}Volume`, "float", 0);
+        this.setUniform(`${prefix}Low`, "float", 0);
+        this.setUniform(`${prefix}LowMid`, "float", 0);
+        this.setUniform(`${prefix}Mid`, "float", 0);
+        this.setUniform(`${prefix}HighMid`, "float", 0);
+        this.setUniform(`${prefix}High`, "float", 0);
+        this.setUniform(`${prefix}Brightness`, "float", 0);
+        this.setUniform(`${prefix}Flatness`, "float", 0);
+      }
+    }
     const faces = video.faces || [];
     this.setUniform("u_faceCount", "int", faces.length);
     if (faces.length > 0) {
@@ -3268,40 +3406,88 @@ ${error}`);
     const leftHand = hands.find((h) => h.handedness === "left");
     const rightHand = hands.find((h) => h.handedness === "right");
     if (leftHand) {
-      this.setUniform("u_leftHandPalm", "vec3", [leftHand.palm.x, leftHand.palm.y, leftHand.palm.z]);
-      this.setUniform("u_leftHandFist", "float", leftHand.gestures?.fist || 0);
-      this.setUniform("u_leftHandOpen", "float", leftHand.gestures?.openPalm || 0);
+      const palm = leftHand.palm || leftHand.landmarks?.[9];
+      const g = leftHand.gestures || {};
+      const b = leftHand.bounds;
+      this.setUniform("u_leftHandPalm", "vec3", [palm?.x || 0, palm?.y || 0, palm?.z || 0]);
+      this.setUniform("u_leftHandConfidence", "float", leftHand.confidence || 0);
+      this.setUniform("u_leftHandBounds", "vec4", [b?.x || 0, b?.y || 0, b?.width || 0, b?.height || 0]);
+      this.setUniform("u_leftHandFist", "float", g.fist || 0);
+      this.setUniform("u_leftHandOpen", "float", g.openPalm || 0);
+      this.setUniform("u_leftHandPeace", "float", g.peace || 0);
+      this.setUniform("u_leftHandThumbsUp", "float", g.thumbsUp || 0);
+      this.setUniform("u_leftHandThumbsDown", "float", g.thumbsDown || 0);
+      this.setUniform("u_leftHandPointing", "float", g.pointing || 0);
+      this.setUniform("u_leftHandILoveYou", "float", g.iLoveYou || 0);
     } else {
       this.setUniform("u_leftHandPalm", "vec3", [0, 0, 0]);
+      this.setUniform("u_leftHandConfidence", "float", 0);
+      this.setUniform("u_leftHandBounds", "vec4", [0, 0, 0, 0]);
       this.setUniform("u_leftHandFist", "float", 0);
       this.setUniform("u_leftHandOpen", "float", 0);
+      this.setUniform("u_leftHandPeace", "float", 0);
+      this.setUniform("u_leftHandThumbsUp", "float", 0);
+      this.setUniform("u_leftHandThumbsDown", "float", 0);
+      this.setUniform("u_leftHandPointing", "float", 0);
+      this.setUniform("u_leftHandILoveYou", "float", 0);
     }
     if (rightHand) {
-      this.setUniform("u_rightHandPalm", "vec3", [rightHand.palm.x, rightHand.palm.y, rightHand.palm.z]);
-      this.setUniform("u_rightHandFist", "float", rightHand.gestures?.fist || 0);
-      this.setUniform("u_rightHandOpen", "float", rightHand.gestures?.openPalm || 0);
+      const palm = rightHand.palm || rightHand.landmarks?.[9];
+      const g = rightHand.gestures || {};
+      const b = rightHand.bounds;
+      this.setUniform("u_rightHandPalm", "vec3", [palm?.x || 0, palm?.y || 0, palm?.z || 0]);
+      this.setUniform("u_rightHandConfidence", "float", rightHand.confidence || 0);
+      this.setUniform("u_rightHandBounds", "vec4", [b?.x || 0, b?.y || 0, b?.width || 0, b?.height || 0]);
+      this.setUniform("u_rightHandFist", "float", g.fist || 0);
+      this.setUniform("u_rightHandOpen", "float", g.openPalm || 0);
+      this.setUniform("u_rightHandPeace", "float", g.peace || 0);
+      this.setUniform("u_rightHandThumbsUp", "float", g.thumbsUp || 0);
+      this.setUniform("u_rightHandThumbsDown", "float", g.thumbsDown || 0);
+      this.setUniform("u_rightHandPointing", "float", g.pointing || 0);
+      this.setUniform("u_rightHandILoveYou", "float", g.iLoveYou || 0);
     } else {
       this.setUniform("u_rightHandPalm", "vec3", [0, 0, 0]);
+      this.setUniform("u_rightHandConfidence", "float", 0);
+      this.setUniform("u_rightHandBounds", "vec4", [0, 0, 0, 0]);
       this.setUniform("u_rightHandFist", "float", 0);
       this.setUniform("u_rightHandOpen", "float", 0);
+      this.setUniform("u_rightHandPeace", "float", 0);
+      this.setUniform("u_rightHandThumbsUp", "float", 0);
+      this.setUniform("u_rightHandThumbsDown", "float", 0);
+      this.setUniform("u_rightHandPointing", "float", 0);
+      this.setUniform("u_rightHandILoveYou", "float", 0);
     }
     const pose = video.pose;
     this.setUniform("u_poseDetected", "bool", pose !== null);
-    if (pose) {
-      const nose = pose.landmarks[0];
-      const leftWrist = pose.landmarks[15];
-      const rightWrist = pose.landmarks[16];
-      const leftAnkle = pose.landmarks[27];
-      const rightAnkle = pose.landmarks[28];
-      this.setUniform("u_nosePosition", "vec2", [nose?.x || 0, nose?.y || 0]);
-      this.setUniform("u_leftWristPosition", "vec2", [leftWrist?.x || 0, leftWrist?.y || 0]);
-      this.setUniform("u_rightWristPosition", "vec2", [rightWrist?.x || 0, rightWrist?.y || 0]);
-      this.setUniform("u_leftAnklePosition", "vec2", [leftAnkle?.x || 0, leftAnkle?.y || 0]);
-      this.setUniform("u_rightAnklePosition", "vec2", [rightAnkle?.x || 0, rightAnkle?.y || 0]);
+    if (pose && pose.landmarks) {
+      const lm = pose.landmarks;
+      this.setUniform("u_poseConfidence", "float", pose.confidence || 0);
+      this.setUniform("u_nosePosition", "vec2", [lm[0]?.x || 0, lm[0]?.y || 0]);
+      this.setUniform("u_leftShoulderPosition", "vec2", [lm[11]?.x || 0, lm[11]?.y || 0]);
+      this.setUniform("u_rightShoulderPosition", "vec2", [lm[12]?.x || 0, lm[12]?.y || 0]);
+      this.setUniform("u_leftElbowPosition", "vec2", [lm[13]?.x || 0, lm[13]?.y || 0]);
+      this.setUniform("u_rightElbowPosition", "vec2", [lm[14]?.x || 0, lm[14]?.y || 0]);
+      this.setUniform("u_leftWristPosition", "vec2", [lm[15]?.x || 0, lm[15]?.y || 0]);
+      this.setUniform("u_rightWristPosition", "vec2", [lm[16]?.x || 0, lm[16]?.y || 0]);
+      this.setUniform("u_leftHipPosition", "vec2", [lm[23]?.x || 0, lm[23]?.y || 0]);
+      this.setUniform("u_rightHipPosition", "vec2", [lm[24]?.x || 0, lm[24]?.y || 0]);
+      this.setUniform("u_leftKneePosition", "vec2", [lm[25]?.x || 0, lm[25]?.y || 0]);
+      this.setUniform("u_rightKneePosition", "vec2", [lm[26]?.x || 0, lm[26]?.y || 0]);
+      this.setUniform("u_leftAnklePosition", "vec2", [lm[27]?.x || 0, lm[27]?.y || 0]);
+      this.setUniform("u_rightAnklePosition", "vec2", [lm[28]?.x || 0, lm[28]?.y || 0]);
     } else {
+      this.setUniform("u_poseConfidence", "float", 0);
       this.setUniform("u_nosePosition", "vec2", [0, 0]);
+      this.setUniform("u_leftShoulderPosition", "vec2", [0, 0]);
+      this.setUniform("u_rightShoulderPosition", "vec2", [0, 0]);
+      this.setUniform("u_leftElbowPosition", "vec2", [0, 0]);
+      this.setUniform("u_rightElbowPosition", "vec2", [0, 0]);
       this.setUniform("u_leftWristPosition", "vec2", [0, 0]);
       this.setUniform("u_rightWristPosition", "vec2", [0, 0]);
+      this.setUniform("u_leftHipPosition", "vec2", [0, 0]);
+      this.setUniform("u_rightHipPosition", "vec2", [0, 0]);
+      this.setUniform("u_leftKneePosition", "vec2", [0, 0]);
+      this.setUniform("u_rightKneePosition", "vec2", [0, 0]);
       this.setUniform("u_leftAnklePosition", "vec2", [0, 0]);
       this.setUniform("u_rightAnklePosition", "vec2", [0, 0]);
     }
@@ -3661,18 +3847,18 @@ ${error}`);
     }
   }
   /**
-   * Update compositor stream texture at specified index
+   * Update compositor video stream texture at specified index
    * Supports both OffscreenCanvas and ImageBitmap for zero-copy pipeline
    */
-  updateStreamTexture(index, streamFrame) {
+  updateVideoStreamTexture(index, streamFrame) {
     const gl = this.gl;
-    const uniformName = `u_stream${index}`;
+    const uniformName = `u_videoStream${index}`;
     const unit = this.textureUnits.get(uniformName);
-    if (!this.streamTextures[index]) {
-      this.streamTextures[index] = gl.createTexture();
+    if (!this.videoStreamTextures[index]) {
+      this.videoStreamTextures[index] = gl.createTexture();
     }
     gl.activeTexture(gl.TEXTURE0 + unit);
-    gl.bindTexture(gl.TEXTURE_2D, this.streamTextures[index]);
+    gl.bindTexture(gl.TEXTURE_2D, this.videoStreamTextures[index]);
     const shouldFlip = streamFrame instanceof OffscreenCanvas;
     if (shouldFlip) {
       gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
@@ -3863,10 +4049,10 @@ ${error}`);
     if (this.audioWaveformTexture) gl.deleteTexture(this.audioWaveformTexture);
     if (this.videoTexture) gl.deleteTexture(this.videoTexture);
     if (this.segmentationTexture) gl.deleteTexture(this.segmentationTexture);
-    for (const texture of this.streamTextures) {
+    for (const texture of this.videoStreamTextures) {
       if (texture) gl.deleteTexture(texture);
     }
-    this.streamTextures = [];
+    this.videoStreamTextures = [];
     for (const texture of this.deviceTextures) {
       if (texture) gl.deleteTexture(texture);
     }
@@ -3943,43 +4129,9 @@ class VijiWorkerRuntime {
   autoCaptureEnabled = false;
   autoCaptureFormat = { flipY: true };
   // Default: flip for WebGL compatibility
-  // Audio state (Phase 5) - receives analysis results from host
-  audioState = {
-    isConnected: false,
-    volume: { current: 0, peak: 0, smoothed: 0 },
-    bands: {
-      low: 0,
-      lowMid: 0,
-      mid: 0,
-      highMid: 0,
-      high: 0,
-      lowSmoothed: 0,
-      lowMidSmoothed: 0,
-      midSmoothed: 0,
-      highMidSmoothed: 0,
-      highSmoothed: 0
-    },
-    beat: {
-      kick: 0,
-      snare: 0,
-      hat: 0,
-      any: 0,
-      kickSmoothed: 0,
-      snareSmoothed: 0,
-      hatSmoothed: 0,
-      anySmoothed: 0,
-      triggers: { any: false, kick: false, snare: false, hat: false },
-      bpm: 120,
-      confidence: 0,
-      isLocked: false
-    },
-    spectral: {
-      brightness: 0,
-      flatness: 0
-    },
-    frequencyData: new Uint8Array(0),
-    waveformData: new Float32Array(0)
-  };
+  // Audio raw data buffers (referenced by closures in viji.audio)
+  audioFrequencyData = new Uint8Array(0);
+  audioWaveformData = new Float32Array(0);
   // Device sensor state (internal device + external devices)
   deviceState = {
     device: {
@@ -3990,6 +4142,11 @@ class VijiWorkerRuntime {
   };
   // Map deviceId → streamIndex for O(1) device video lookup
   deviceVideoMap = /* @__PURE__ */ new Map();
+  // Audio stream state management (mirroring video stream pattern)
+  static AUDIO_ADDITIONAL_BASE = 1;
+  static AUDIO_DEVICE_BASE = 100;
+  audioStreamStates = /* @__PURE__ */ new Map();
+  deviceAudioMap = /* @__PURE__ */ new Map();
   // Video state is now managed by the worker-side VideoSystem
   // Artist API object
   viji = {
@@ -4004,8 +4161,41 @@ class VijiWorkerRuntime {
     deltaTime: 0,
     frameCount: 0,
     fps: 60,
-    // Audio API (Phase 5) - will be set in constructor
-    audio: {},
+    // Audio API (Phase 5) — stable reference, mutated in place
+    audio: {
+      isConnected: false,
+      volume: { current: 0, peak: 0, smoothed: 0 },
+      bands: {
+        low: 0,
+        lowMid: 0,
+        mid: 0,
+        highMid: 0,
+        high: 0,
+        lowSmoothed: 0,
+        lowMidSmoothed: 0,
+        midSmoothed: 0,
+        highMidSmoothed: 0,
+        highSmoothed: 0
+      },
+      beat: {
+        kick: 0,
+        snare: 0,
+        hat: 0,
+        any: 0,
+        kickSmoothed: 0,
+        snareSmoothed: 0,
+        hatSmoothed: 0,
+        anySmoothed: 0,
+        triggers: { any: false, kick: false, snare: false, hat: false },
+        events: [],
+        bpm: 120,
+        confidence: 0,
+        isLocked: false
+      },
+      spectral: { brightness: 0, flatness: 0 },
+      getFrequencyData: () => new Uint8Array(0),
+      getWaveform: () => new Float32Array(0)
+    },
     // Main video stream (index 0, CV enabled)
     video: {
       isConnected: false,
@@ -4054,7 +4244,9 @@ class VijiWorkerRuntime {
       }
     },
     // Additional video streams (index 1+, no CV)
-    streams: [],
+    videoStreams: [],
+    // Additional audio streams (lightweight analysis, no beat detection)
+    audioStreams: [],
     // Interaction APIs will be added during construction
     mouse: {},
     keyboard: {},
@@ -4117,18 +4309,15 @@ class VijiWorkerRuntime {
     });
     this.interactionSystem = new InteractionSystem();
     Object.assign(this.viji, this.interactionSystem.getInteractionAPIs());
-    this.viji.audio = {
-      ...this.audioState,
-      getFrequencyData: () => this.audioState.frequencyData,
-      getWaveform: () => this.audioState.waveformData
-    };
+    this.viji.audio.getFrequencyData = () => this.audioFrequencyData;
+    this.viji.audio.getWaveform = () => this.audioWaveformData;
     this.setupMessageHandling();
   }
   /**
    * Initialize P5.js mode
    * Sets up P5 rendering with P5WorkerAdapter
    */
-  async initP5Mode(setup, render) {
+  async initP5Mode(setup, render, options) {
     try {
       this.rendererType = "p5";
       this.debugLog("🎨 Initializing P5.js mode...");
@@ -4137,7 +4326,8 @@ class VijiWorkerRuntime {
         this.viji,
         {
           setup,
-          render
+          render,
+          canvasMode: options?.canvasMode === "webgl" ? "webgl" : "2d"
         }
       );
       await this.p5Adapter.init();
@@ -4224,65 +4414,52 @@ class VijiWorkerRuntime {
   resetParameterState() {
     this.parameterSystem.resetParameterState();
     this.interactionSystem.resetInteractionState();
-    this.audioState = {
-      isConnected: false,
-      volume: { current: 0, peak: 0, smoothed: 0 },
-      bands: {
-        low: 0,
-        lowMid: 0,
-        mid: 0,
-        highMid: 0,
-        high: 0,
-        lowSmoothed: 0,
-        lowMidSmoothed: 0,
-        midSmoothed: 0,
-        highMidSmoothed: 0,
-        highSmoothed: 0
-      },
-      beat: {
-        kick: 0,
-        snare: 0,
-        hat: 0,
-        any: 0,
-        kickSmoothed: 0,
-        snareSmoothed: 0,
-        hatSmoothed: 0,
-        anySmoothed: 0,
-        triggers: { any: false, kick: false, snare: false, hat: false },
-        bpm: 120,
-        confidence: 0,
-        isLocked: false
-      },
-      spectral: {
-        brightness: 0,
-        flatness: 0
-      },
-      frequencyData: new Uint8Array(0),
-      waveformData: new Float32Array(0)
-    };
-    this.viji.audio = {
-      ...this.audioState,
-      getFrequencyData: () => this.audioState.frequencyData,
-      getWaveform: () => this.audioState.waveformData
-    };
+    this.resetAudioState();
     this.videoSystems.forEach((vs) => vs?.resetVideoState());
     if (this.videoSystems[0]) {
       Object.assign(this.viji.video, this.videoSystems[0].getVideoAPI());
     }
-    this.updateVijiStreams();
+    this.updateVijiVideoStreams();
   }
   /**
-   * Updates viji.streams from videoSystems array.
+   * Updates viji.videoStreams from videoSystems array.
    * Collects 'additional' MediaStreams first, then 'directFrame' injected frames.
    * Excludes 'main' and 'device' streams (those go to viji.video and viji.devices[].video).
    */
-  updateVijiStreams() {
+  updateVijiVideoStreams() {
     const additional = this.videoSystems.filter((vs) => vs && vs.getStreamType() === "additional").map((vs) => vs.getVideoAPI());
     const directFrames = this.videoSystems.filter((vs) => vs && vs.getStreamType() === "directFrame").map((vs) => vs.getVideoAPI());
     const freshStreams = [...additional, ...directFrames];
-    this.viji.streams.length = freshStreams.length;
+    this.viji.videoStreams.length = freshStreams.length;
     for (let i = 0; i < freshStreams.length; i++) {
-      this.viji.streams[i] = freshStreams[i];
+      this.viji.videoStreams[i] = freshStreams[i];
+    }
+  }
+  /**
+   * Rebuilds viji.audioStreams from audioStreamStates.
+   * Collects entries in the additional range (1-99), maps to AudioStreamAPI objects.
+   */
+  updateVijiAudioStreams() {
+    const entries = [];
+    for (const [idx, state2] of this.audioStreamStates) {
+      if (idx >= VijiWorkerRuntime.AUDIO_ADDITIONAL_BASE && idx < VijiWorkerRuntime.AUDIO_DEVICE_BASE) {
+        entries.push({ index: idx, ...state2 });
+      }
+    }
+    entries.sort((a, b) => a.index - b.index);
+    this.viji.audioStreams.length = entries.length;
+    for (let i = 0; i < entries.length; i++) {
+      const s = entries[i];
+      const freqData = s.frequencyData;
+      const waveData = s.waveformData;
+      this.viji.audioStreams[i] = {
+        isConnected: s.isConnected,
+        volume: s.volume,
+        bands: s.bands,
+        spectral: s.spectral,
+        getFrequencyData: () => freqData,
+        getWaveform: () => waveData
+      };
     }
   }
   // Send all parameters (from helper functions) to host
@@ -4326,6 +4503,9 @@ class VijiWorkerRuntime {
         case "audio-analysis-update":
           this.handleAudioAnalysisUpdate(message);
           break;
+        case "audio-stream-setup":
+          this.handleAudioStreamSetup(message);
+          break;
         case "video-canvas-setup":
           this.handleVideoCanvasSetup(message);
           break;
@@ -4494,30 +4674,157 @@ class VijiWorkerRuntime {
     this.debugLog("Stream update:", message.data);
   }
   handleAudioAnalysisUpdate(message) {
-    const events = message.data.beat.events || [];
-    const triggers = {
-      kick: events.some((e) => e.type === "kick"),
-      snare: events.some((e) => e.type === "snare"),
-      hat: events.some((e) => e.type === "hat"),
-      any: events.length > 0
-    };
-    this.audioState = {
-      isConnected: message.data.isConnected,
-      volume: message.data.volume,
-      bands: message.data.bands,
-      beat: {
-        ...message.data.beat,
-        triggers
-      },
-      spectral: message.data.spectral,
-      frequencyData: new Uint8Array(message.data.frequencyData),
-      waveformData: message.data.waveformData ? new Float32Array(message.data.waveformData) : new Float32Array(0)
-    };
-    this.viji.audio = {
-      ...this.audioState,
-      getFrequencyData: () => this.audioState.frequencyData,
-      getWaveform: () => this.audioState.waveformData
-    };
+    const d = message.data;
+    const streamIndex = d.streamIndex ?? 0;
+    if (streamIndex === 0) {
+      this.handleMainAudioUpdate(d);
+    } else {
+      this.handleAdditionalAudioUpdate(streamIndex, d);
+    }
+  }
+  handleMainAudioUpdate(d) {
+    const audio = this.viji.audio;
+    audio.isConnected = d.isConnected;
+    audio.volume.current = d.volume.current;
+    audio.volume.peak = d.volume.peak;
+    audio.volume.smoothed = d.volume.smoothed;
+    audio.bands.low = d.bands.low;
+    audio.bands.lowMid = d.bands.lowMid;
+    audio.bands.mid = d.bands.mid;
+    audio.bands.highMid = d.bands.highMid;
+    audio.bands.high = d.bands.high;
+    audio.bands.lowSmoothed = d.bands.lowSmoothed;
+    audio.bands.lowMidSmoothed = d.bands.lowMidSmoothed;
+    audio.bands.midSmoothed = d.bands.midSmoothed;
+    audio.bands.highMidSmoothed = d.bands.highMidSmoothed;
+    audio.bands.highSmoothed = d.bands.highSmoothed;
+    if (d.beat) {
+      audio.beat.kick = d.beat.kick;
+      audio.beat.snare = d.beat.snare;
+      audio.beat.hat = d.beat.hat;
+      audio.beat.any = d.beat.any;
+      audio.beat.kickSmoothed = d.beat.kickSmoothed;
+      audio.beat.snareSmoothed = d.beat.snareSmoothed;
+      audio.beat.hatSmoothed = d.beat.hatSmoothed;
+      audio.beat.anySmoothed = d.beat.anySmoothed;
+      const events = d.beat.events || [];
+      if (events.length > 0) {
+        audio.beat.triggers.kick = audio.beat.triggers.kick || events.some((e) => e.type === "kick");
+        audio.beat.triggers.snare = audio.beat.triggers.snare || events.some((e) => e.type === "snare");
+        audio.beat.triggers.hat = audio.beat.triggers.hat || events.some((e) => e.type === "hat");
+        audio.beat.triggers.any = true;
+        audio.beat.events.push(...events);
+      }
+      audio.beat.bpm = d.beat.bpm;
+      audio.beat.confidence = d.beat.confidence;
+      audio.beat.isLocked = d.beat.isLocked;
+    }
+    audio.spectral.brightness = d.spectral.brightness;
+    audio.spectral.flatness = d.spectral.flatness;
+    this.audioFrequencyData = new Uint8Array(d.frequencyData);
+    this.audioWaveformData = d.waveformData ? new Float32Array(d.waveformData) : new Float32Array(0);
+  }
+  handleAdditionalAudioUpdate(streamIndex, d) {
+    const frequencyData = new Uint8Array(d.frequencyData);
+    const waveformData = d.waveformData ? new Float32Array(d.waveformData) : new Float32Array(0);
+    this.audioStreamStates.set(streamIndex, {
+      isConnected: d.isConnected,
+      volume: { ...d.volume },
+      bands: { ...d.bands },
+      spectral: { ...d.spectral },
+      frequencyData,
+      waveformData
+    });
+    this.updateVijiAudioStreams();
+  }
+  /**
+   * Handles audio-stream-setup: registers stream type and device mapping.
+   * Mirrors handleVideoCanvasSetup — two-phase protocol where setup establishes
+   * the stream identity, and subsequent audio-analysis-update messages carry data.
+   */
+  handleAudioStreamSetup(message) {
+    const { streamIndex, streamType, deviceId } = message.data;
+    switch (streamType) {
+      case "additional":
+        this.updateVijiAudioStreams();
+        break;
+      case "device":
+        if (deviceId) {
+          this.deviceAudioMap.set(deviceId, streamIndex);
+          const device = this.viji.devices.find((d) => d.id === deviceId);
+          if (device) {
+            const audioState = this.audioStreamStates.get(streamIndex);
+            if (audioState) {
+              device.audio = {
+                isConnected: audioState.isConnected,
+                volume: audioState.volume,
+                bands: audioState.bands,
+                spectral: audioState.spectral,
+                getFrequencyData: () => audioState.frequencyData,
+                getWaveform: () => audioState.waveformData
+              };
+            }
+          }
+        }
+        break;
+    }
+    this.debugLog(`Audio stream setup at index ${streamIndex}, type: ${streamType}${deviceId ? `, deviceId: ${deviceId}` : ""}`);
+  }
+  /**
+   * Reset frame-scoped audio events (triggers + events array).
+   * Called after each render, mirroring interactionSystem.frameStart().
+   */
+  resetAudioFrameEvents() {
+    const t = this.viji.audio.beat.triggers;
+    t.kick = false;
+    t.snare = false;
+    t.hat = false;
+    t.any = false;
+    this.viji.audio.beat.events.length = 0;
+  }
+  /**
+   * Full audio state reset (scene reload / disconnect).
+   * Zeroes everything without replacing the stable viji.audio reference.
+   */
+  resetAudioState() {
+    const audio = this.viji.audio;
+    audio.isConnected = false;
+    audio.volume.current = 0;
+    audio.volume.peak = 0;
+    audio.volume.smoothed = 0;
+    audio.bands.low = 0;
+    audio.bands.lowMid = 0;
+    audio.bands.mid = 0;
+    audio.bands.highMid = 0;
+    audio.bands.high = 0;
+    audio.bands.lowSmoothed = 0;
+    audio.bands.lowMidSmoothed = 0;
+    audio.bands.midSmoothed = 0;
+    audio.bands.highMidSmoothed = 0;
+    audio.bands.highSmoothed = 0;
+    audio.beat.kick = 0;
+    audio.beat.snare = 0;
+    audio.beat.hat = 0;
+    audio.beat.any = 0;
+    audio.beat.kickSmoothed = 0;
+    audio.beat.snareSmoothed = 0;
+    audio.beat.hatSmoothed = 0;
+    audio.beat.anySmoothed = 0;
+    audio.beat.triggers.kick = false;
+    audio.beat.triggers.snare = false;
+    audio.beat.triggers.hat = false;
+    audio.beat.triggers.any = false;
+    audio.beat.events.length = 0;
+    audio.beat.bpm = 120;
+    audio.beat.confidence = 0;
+    audio.beat.isLocked = false;
+    audio.spectral.brightness = 0;
+    audio.spectral.flatness = 0;
+    this.audioFrequencyData = new Uint8Array(0);
+    this.audioWaveformData = new Float32Array(0);
+    this.audioStreamStates.clear();
+    this.deviceAudioMap.clear();
+    this.viji.audioStreams.length = 0;
   }
   handleVideoCanvasSetup(message) {
     const { streamIndex, streamType, deviceId } = message.data;
@@ -4538,7 +4845,7 @@ class VijiWorkerRuntime {
         Object.assign(this.viji.video, videoSystem.getVideoAPI());
         break;
       case "additional":
-        this.updateVijiStreams();
+        this.updateVijiVideoStreams();
         break;
       case "device":
         if (deviceId) {
@@ -4629,7 +4936,7 @@ class VijiWorkerRuntime {
       this.videoSystems[index].setDebugMode(this.debugMode);
       this.videoSystems[index].initializeForDirectFrames(this.rendererType);
     }
-    this.updateVijiStreams();
+    this.updateVijiVideoStreams();
     this.debugLog(`[Compositor] Prepared ${directFrameCount} direct frame slot(s)`);
   }
   handleVideoFrameDirect(message) {
@@ -4757,7 +5064,8 @@ class VijiWorkerRuntime {
   renderFrame() {
     if (!this.isRunning) return;
     const currentTime = performance.now();
-    this.updateVijiStreams();
+    this.updateVijiVideoStreams();
+    this.updateVijiAudioStreams();
     this.viji.fps = this.frameRateMode === "full" ? this.screenRefreshRate : this.screenRefreshRate / 2;
     let shouldRender = true;
     if (this.frameRateMode === "half") {
@@ -4828,6 +5136,7 @@ class VijiWorkerRuntime {
     }
     this.reportPerformanceStats(currentTime);
     this.interactionSystem.frameStart();
+    this.resetAudioFrameEvents();
     requestAnimationFrame(() => this.renderFrame());
   }
   postMessage(type, data) {
@@ -4856,17 +5165,29 @@ class VijiWorkerRuntime {
     this.viji.device = this.deviceState.device;
     const updatedDevices = this.deviceState.devices.map((deviceData) => {
       const existingDevice = this.viji.devices.find((d) => d.id === deviceData.id);
+      const videoStreamIndex = this.deviceVideoMap.get(deviceData.id);
+      const videoSystem = videoStreamIndex !== void 0 ? this.videoSystems[videoStreamIndex] : void 0;
+      const audioStreamIndex = this.deviceAudioMap.get(deviceData.id);
+      const audioState = audioStreamIndex !== void 0 ? this.audioStreamStates.get(audioStreamIndex) : void 0;
+      const audioAPI = audioState ? {
+        isConnected: audioState.isConnected,
+        volume: audioState.volume,
+        bands: audioState.bands,
+        spectral: audioState.spectral,
+        getFrequencyData: () => audioState.frequencyData,
+        getWaveform: () => audioState.waveformData
+      } : null;
       if (existingDevice) {
         existingDevice.name = deviceData.name;
         existingDevice.motion = deviceData.motion;
         existingDevice.orientation = deviceData.orientation;
+        if (audioAPI) existingDevice.audio = audioAPI;
         return existingDevice;
       } else {
-        const streamIndex = this.deviceVideoMap.get(deviceData.id);
-        const videoSystem = streamIndex !== void 0 ? this.videoSystems[streamIndex] : void 0;
         return {
           ...deviceData,
-          video: videoSystem ? videoSystem.getVideoAPI() : null
+          video: videoSystem ? videoSystem.getVideoAPI() : null,
+          audio: audioAPI
         };
       }
     });
@@ -4895,6 +5216,21 @@ class SceneAnalyzer {
     }
     return "native";
   }
+  /**
+   * P5 main-canvas mode from the renderer directive (only meaningful when
+   * {@link detectRendererType} is `'p5'`).
+   *
+   * - `// @renderer p5` → 2D (default)
+   * - `// @renderer p5 webgl` → WEBGL
+   */
+  static detectP5CanvasMode(sceneCode) {
+    if (/\/\/\s*@renderer\s+p5\s+webgl\b|\/\*\s*@renderer\s+p5\s+webgl\s*\*\//i.test(
+      sceneCode
+    )) {
+      return "webgl";
+    }
+    return "2d";
+  }
 }
 var ContextualKeyword;
 (function(ContextualKeyword2) {
@@ -26216,6 +26552,7 @@ async function setSceneCode(sceneCode) {
       await runtime.initShaderMode(sceneCode);
       runtime.sendAllParametersToHost();
     } else if (rendererType === "p5") {
+      const p5CanvasMode = SceneAnalyzer.detectP5CanvasMode(sceneCode);
       const jsCode = prepareSceneCode(sceneCode);
       const functionBody = jsCode + '\nreturn {   setup: typeof setup !== "undefined" ? setup : null,   render: typeof render !== "undefined" ? render : null };';
       const sceneFunction = new Function("viji", "p5", functionBody);
@@ -26223,7 +26560,7 @@ async function setSceneCode(sceneCode) {
       if (!render) {
         throw new Error("P5 mode requires a render(viji, p5) function");
       }
-      await runtime.initP5Mode(setup, render);
+      await runtime.initP5Mode(setup, render, { canvasMode: p5CanvasMode });
       runtime.sendAllParametersToHost();
     } else {
       const jsCode = prepareSceneCode(sceneCode);
@@ -26249,4 +26586,4 @@ async function setSceneCode(sceneCode) {
   }
 }
 self.setSceneCode = setSceneCode;
-//# sourceMappingURL=viji.worker-Zg128woJ.js.map
+//# sourceMappingURL=viji.worker-jTmB7qoQ.js.map