fix: VP9 default for both modes, clean up codec pill UI

VP9 empirically outperforms H.264 in gaming (Chrome may not use
NVENC for screen share H.264). Codec pills now match other pill
styles — simple labels, no description text. Mode change no longer
auto-switches codec; user's codec choice is independent.

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

@@ -20,9 +20,9 @@ const MODES: { value: ScreenShareConfig['mode']; label: string }[] = [
   { value: 'text', label: 'Text' },
 ];
 
-const CODECS: { value: ScreenShareConfig['codec']; label: string; desc: string }[] = [
-  { value: 'vp9', label: 'VP9', desc: 'Less bandwidth, more CPU' },
-  { value: 'h264', label: 'H.264', desc: 'Less CPU, more bandwidth' },
+const CODECS: { value: ScreenShareConfig['codec']; label: string }[] = [
+  { value: 'vp9', label: 'VP9' },
+  { value: 'h264', label: 'H.264' },
 ];
 
 function formatBitrate(bps: number): string {
@@ -193,12 +193,9 @@ export function ScreenShareSettingsPopover({ open, onClose, anchorRef }: ScreenS
               <button
                 key={c.value}
                 onClick={() => setConfig({ codec: c.value })}
-                className={`${pillBase} flex-1 flex flex-col items-center gap-0.5 !py-1.5 ${config.codec === c.value ? pillSelected : pillUnselected}`}
+                className={`${pillBase} ${config.codec === c.value ? pillSelected : pillUnselected}`}
               >
-                <span>{c.label}</span>
-                <span className={`text-[9px] font-normal ${config.codec === c.value ? 'text-white/70' : 'text-txt-tertiary'}`}>
-                  {c.desc}
-                </span>
+                {c.label}
               </button>
             ))}
           </div>

packages/web/src/stores/voiceStore.ts

@@ -146,7 +146,7 @@ export const useVoiceStore = create<VoiceState>()(
       inputDeviceId: 'default',
       outputDeviceId: 'default',
       focusedParticipantId: null,
-      screenShareConfig: { height: 720, fps: 60, mode: 'gaming', codec: 'h264', customBitrateKbps: null, shareAudio: !isElectron() },
+      screenShareConfig: { height: 720, fps: 60, mode: 'gaming', codec: 'vp9', customBitrateKbps: null, shareAudio: !isElectron() },
       participantVolumes: new Map(),
       setParticipantVolume: (userId, volume) => {
         set((state) => {
@@ -326,14 +326,9 @@ export const useVoiceStore = create<VoiceState>()(
       toggleScreenShare: () => set((state) => ({ isScreenSharing: !state.isScreenSharing })),
 
       setFocusedParticipant: (id) => set({ focusedParticipantId: id }),
-      setScreenShareConfig: (config) => set((state) => {
-        const merged = { ...state.screenShareConfig, ...config };
-        // When mode changes (without an explicit codec override), auto-set the smart default
-        if (config.mode && !config.codec) {
-          merged.codec = config.mode === 'gaming' ? 'h264' : 'vp9';
-        }
-        return { screenShareConfig: merged };
-      }),
+      setScreenShareConfig: (config) => set((state) => ({
+        screenShareConfig: { ...state.screenShareConfig, ...config },
+      })),
       noiseSuppression: true,
       echoCancellation: true,
       autoGainControl: true,