feat: increase perceived audio loudness — +3dB master boost, configurable SFX volume

Three changes to bring output volume closer to native apps:
- Insert masterBoost GainNode (+3dB) before the compressor/limiter
- Raise default system sound volume from 0.5 to 0.8
- Add configurable Sound Effects Volume slider (0–200%) in Voice settings

packages/web/src/audio/AudioManager.ts

@@ -12,6 +12,7 @@ export class AudioManager {
   private silentGain: GainNode | null = null;
   private analyser: AnalyserNode | null = null;
   private masterCompressor: DynamicsCompressorNode | null = null;
+  private masterBoost: GainNode | null = null;
   
   private currentInputDeviceId: string = 'default';
   private desiredOutputDeviceId: string = 'default';
@@ -61,6 +62,11 @@ export class AudioManager {
     this.masterCompressor.ratio.value = 4;         // gentle limiting, no ducking
     this.masterCompressor.attack.value = 0.0005;   // 0.5ms — catch transient peaks
     this.masterCompressor.release.value = 0.01;    // 10ms — recover quickly
+    // +3dB boost before the limiter — drives a hotter signal into the
+    // compressor, raising perceived loudness while peaks are still caught.
+    this.masterBoost = this.ctx.createGain();
+    this.masterBoost.gain.value = 1.41; // +3dB
+    this.masterBoost.connect(this.masterCompressor);
     this.masterCompressor.connect(this.ctx.destination);
 
     this.inputGain.connect(this.inputDestination);
@@ -168,10 +174,10 @@ export class AudioManager {
     source.loop = options.loop || false;
 
     const gainNode = this.ctx.createGain();
-    gainNode.gain.value = options.volume ?? 0.5;
+    gainNode.gain.value = options.volume ?? 0.8;
 
     source.connect(gainNode);
-    gainNode.connect(this.masterCompressor!);
+    gainNode.connect(this.masterBoost!);
 
     source.start(0);
     return source;
@@ -373,14 +379,14 @@ export class AudioManager {
   }
 
   /**
-   * Returns the master output bus (DynamicsCompressorNode → ctx.destination).
+   * Returns the master output bus (masterBoost → masterCompressor → ctx.destination).
    * All audio (remote voice, streams, effects) routes through this node.
-   * The compressor prevents clipping when multiple sources sum together.
+   * The +3dB boost raises perceived loudness; the compressor catches peaks.
    * Output device is controlled via setSinkId on the underlying AudioContext.
    */
   getMasterOutput(): AudioNode {
     if (!this.ctx) this.initContext();
-    return this.masterCompressor!;
+    return this.masterBoost!;
   }
 
   getContext(): AudioContext | null {

packages/web/src/components/modals/settingsPanels/VoicePanel.tsx

@@ -8,9 +8,36 @@ export function VoicePanel() {
   const setEchoCancellation = useVoiceStore((s) => s.setEchoCancellation);
   const setAutoGainControl = useVoiceStore((s) => s.setAutoGainControl);
   const setRnnoiseEnabled = useVoiceStore((s) => s.setRnnoiseEnabled);
+  const soundEffectVolume = useVoiceStore((s) => s.soundEffectVolume);
+  const setSoundEffectVolume = useVoiceStore((s) => s.setSoundEffectVolume);
 
   return (
     <div className="space-y-5">
+      <div>
+        <div className="text-[11px] font-semibold text-txt-tertiary uppercase tracking-wider mb-1.5">
+          Volume
+        </div>
+        <div className="rounded-lg bg-white/[0.03] border border-white/[0.04] p-3.5">
+          <div className="py-1">
+            <div className="flex items-center justify-between mb-2">
+              <div className="text-sm text-txt-primary">Sound Effects Volume</div>
+              <div className="text-xs text-txt-tertiary tabular-nums">{soundEffectVolume}%</div>
+            </div>
+            <input
+              type="range"
+              min={0}
+              max={200}
+              value={soundEffectVolume}
+              onChange={(e) => setSoundEffectVolume(Number(e.target.value))}
+              className="w-full h-1.5 rounded-full appearance-none cursor-pointer bg-surface-base [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:w-3 [&::-webkit-slider-thumb]:h-3 [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-white [&::-webkit-slider-thumb]:shadow-md"
+              style={{
+                background: `linear-gradient(to right, rgb(var(--accent-primary)) 0%, rgb(var(--accent-primary)) ${soundEffectVolume / 2}%, rgb(var(--interactive-muted)) ${soundEffectVolume / 2}%, rgb(var(--interactive-muted)) 100%)`,
+              }}
+            />
+          </div>
+        </div>
+      </div>
+
       <div>
         <div className="text-[11px] font-semibold text-txt-tertiary uppercase tracking-wider mb-1.5">
           Voice Processing

packages/web/src/components/voice/SoundController.tsx

@@ -4,6 +4,11 @@ import { useChatStore } from '../../stores/chatStore';
 import { useAuthStore } from '../../stores/authStore';
 import { AudioManager } from '../../audio/AudioManager';
 
+/** Compute the effective sound effect gain: base volume (0.8) scaled by the user's SFX slider (0–200). */
+function getSfxVolume(): number {
+  return 0.8 * (useVoiceStore.getState().soundEffectVolume / 100);
+}
+
 export function SoundController() {
   const audioManager = AudioManager.getInstance();
   const currentUser = useAuthStore((s) => s.user);
@@ -31,37 +36,39 @@ export function SoundController() {
     const unsubscribeVoice = useVoiceStore.subscribe((state) => {
       if (isInitialMount.current) return;
 
+      const sfxOpts = { volume: getSfxVolume() };
+
       // Mute/Unmute
       if (state.isMuted !== prevIsMuted.current) {
-        audioManager.playSound(state.isMuted ? 'mute' : 'unmute');
+        audioManager.playSound(state.isMuted ? 'mute' : 'unmute', sfxOpts);
         prevIsMuted.current = state.isMuted;
       }
 
       // Deafen/Undeafen
       if (state.isDeafened !== prevIsDeafened.current) {
-        audioManager.playSound(state.isDeafened ? 'deafen' : 'undeafen');
+        audioManager.playSound(state.isDeafened ? 'deafen' : 'undeafen', sfxOpts);
         prevIsDeafened.current = state.isDeafened;
       }
 
       // Camera Toggle
       if (state.isCameraOn !== prevIsCameraOn.current) {
-        audioManager.playSound(state.isCameraOn ? 'camera_on' : 'camera_off');
+        audioManager.playSound(state.isCameraOn ? 'camera_on' : 'camera_off', sfxOpts);
         prevIsCameraOn.current = state.isCameraOn;
       }
 
       // Screen Share Toggle (Self)
       if (state.isScreenSharing !== prevIsScreenSharing.current) {
-        audioManager.playSound(state.isScreenSharing ? 'stream_started' : 'stream_ended');
+        audioManager.playSound(state.isScreenSharing ? 'stream_started' : 'stream_ended', sfxOpts);
         prevIsScreenSharing.current = state.isScreenSharing;
       }
 
       // Disconnect (Self)
       if (prevIsConnected.current && !state.isLiveKitConnected) {
-        audioManager.playSound('disconnect');
+        audioManager.playSound('disconnect', sfxOpts);
       }
       // Connect (Self)
       if (!prevIsConnected.current && state.isLiveKitConnected) {
-        audioManager.playSound('user_join');
+        audioManager.playSound('user_join', sfxOpts);
       }
       prevIsConnected.current = state.isLiveKitConnected;
 
@@ -73,28 +80,28 @@ export function SoundController() {
         // Someone joined voice (Others only)
         state.participants.forEach(p => {
           if (!prevParticipantIds.current.has(p.userId) && p.userId !== currentUser?.id) {
-            audioManager.playSound('user_join');
+            audioManager.playSound('user_join', sfxOpts);
           }
         });
 
         // Someone left voice (Others only)
         prevParticipantIds.current.forEach(userId => {
           if (!currentParticipantIds.has(userId) && userId !== currentUser?.id) {
-            audioManager.playSound('user_leave');
+            audioManager.playSound('user_leave', sfxOpts);
           }
         });
 
         // Someone started screen sharing (Others only)
         state.participants.forEach(p => {
           if (p.isScreenSharing && !prevScreenShareUserIds.current.has(p.userId) && p.userId !== currentUser?.id) {
-            audioManager.playSound('stream_user_joined');
+            audioManager.playSound('stream_user_joined', sfxOpts);
           }
         });
 
         // Someone stopped screen sharing (Others only)
         prevScreenShareUserIds.current.forEach(userId => {
           if (!currentScreenShareUserIds.has(userId) && userId !== currentUser?.id) {
-            audioManager.playSound('stream_user_left');
+            audioManager.playSound('stream_user_left', sfxOpts);
           }
         });
       }
@@ -104,7 +111,7 @@ export function SoundController() {
 
       // Incoming Call (Ringing)
       if (state.incomingCall && !incomingCallLoop.current) {
-        audioManager.playSound('call_ringing', { loop: true }).then(source => {
+        audioManager.playSound('call_ringing', { loop: true, volume: getSfxVolume() }).then(source => {
           incomingCallLoop.current = source;
         });
       } else if (!state.incomingCall && incomingCallLoop.current) {
@@ -114,7 +121,7 @@ export function SoundController() {
 
       // Outgoing Call (Calling)
       if (state.outgoingCall && !outgoingCallLoop.current) {
-        audioManager.playSound('call_calling', { loop: true }).then(source => {
+        audioManager.playSound('call_calling', { loop: true, volume: getSfxVolume() }).then(source => {
           outgoingCallLoop.current = source;
         });
       } else if (!state.outgoingCall && outgoingCallLoop.current) {
@@ -132,7 +139,7 @@ export function SoundController() {
         const newEvents = state.realtimeMessageEvents.slice(prevState.realtimeMessageEvents.length);
         for (const { message } of newEvents) {
           if (message.userId !== currentUser?.id) {
-            audioManager.playSound('message');
+            audioManager.playSound('message', { volume: getSfxVolume() });
             break; // one sound per batch
           }
         }

packages/web/src/stores/voiceStore.ts

@@ -43,6 +43,8 @@ interface VoiceState {
   streamMutes: Map<string, boolean>;        // userId → muted?
   watchingStreams: Set<string>;             // userIds we're watching
   unwatchedCameras: Set<string>;           // userIds whose cameras we've opted out of
+  soundEffectVolume: number;                 // 0-200 (100 = default)
+  setSoundEffectVolume: (volume: number) => void;
   streamAttenuationEnabled: boolean;        // global toggle, default true
   streamAttenuationStrength: number;        // 0-100, default 50
   setStreamVolume: (userId: string, volume: number) => void;
@@ -150,6 +152,9 @@ export const useVoiceStore = create<VoiceState>()(
         });
       },
 
+      soundEffectVolume: 100,
+      setSoundEffectVolume: (volume) => set({ soundEffectVolume: volume }),
+
       // Stream widget state
       streamVolumes: new Map(),
       streamMutes: new Map(),
@@ -509,7 +514,7 @@ export const useVoiceStore = create<VoiceState>()(
     }),
     {
       name: 'backspace-voice-settings',
-      version: 7,
+      version: 8,
       migrate: (persistedState: any, version: number) => {
         if (version === 0) {
           persistedState.streamAttenuationEnabled = false;
@@ -542,6 +547,9 @@ export const useVoiceStore = create<VoiceState>()(
         if (version < 7) {
           // No data migration needed — Sets will be populated from server on next connect
         }
+        if (version < 8) {
+          persistedState.soundEffectVolume = 100;
+        }
         return persistedState;
       },
       storage: createJSONStorage(() => localStorage),
@@ -560,6 +568,7 @@ export const useVoiceStore = create<VoiceState>()(
         echoCancellation: state.echoCancellation,
         autoGainControl: state.autoGainControl,
         rnnoiseEnabled: state.rnnoiseEnabled,
+        soundEffectVolume: state.soundEffectVolume,
         streamAttenuationEnabled: state.streamAttenuationEnabled,
         streamAttenuationStrength: state.streamAttenuationStrength,
       }),