Add short fade-in ramp to local movement footsteps

client/src/audio/audioEngine.ts

@@ -369,7 +369,7 @@ export class AudioEngine {
     }
   }
 
-  async playSample(url: string, gain = 1): Promise<void> {
+  async playSample(url: string, gain = 1, fadeInMs = 0): Promise<void> {
     await this.ensureContext();
     const { audioCtx, sfxGainNode } = this;
     if (!audioCtx || !sfxGainNode) return;
@@ -380,7 +380,13 @@ export class AudioEngine {
       const source = audioCtx.createBufferSource();
       source.buffer = buffer;
       const gainNode = audioCtx.createGain();
-      gainNode.gain.value = gain;
+      const safeFadeMs = Number.isFinite(fadeInMs) ? Math.max(0, fadeInMs) : 0;
+      if (safeFadeMs > 0) {
+        gainNode.gain.setValueAtTime(0, audioCtx.currentTime);
+        gainNode.gain.linearRampToValueAtTime(gain, audioCtx.currentTime + safeFadeMs / 1000);
+      } else {
+        gainNode.gain.value = gain;
+      }
       source.connect(gainNode).connect(sfxGainNode);
       source.start();
     } catch {

client/src/main.ts

@@ -1136,7 +1136,7 @@ function handleMovement(): void {
   persistPlayerPosition();
   state.player.lastMoveTime = now;
   void refreshAudioSubscriptions(true);
-  void audio.playSample(randomFootstepUrl(), FOOTSTEP_GAIN);
+  void audio.playSample(randomFootstepUrl(), FOOTSTEP_GAIN, 40);
   signaling.send({ type: 'update_position', x: nextX, y: nextY });
 
   const namesOnTile = getPeerNamesAtPosition(nextX, nextY);