feat: direct calling UI for desktop Tauri app + merge android branch

Tauri backend:
- register_signal: persistent _signal connection, presence registration
- place_call: send DirectCallOffer by fingerprint
- answer_call: accept/reject incoming calls
- get_signal_status: poll signal state

Frontend:
- Mode toggle: "Room" vs "Direct Call"
- Register button → registers on relay signal channel
- Incoming call panel with Accept/Reject
- Fingerprint input + Call button
- Auto-connect to media room on CallSetup event

Also merges feat/android-voip-client into desktop branch:
- Federation fixes, time-based dedup, FEC stale blocks
- Direct calling protocol types
- ACL + SAS verification

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Cargo.toml

@@ -10,6 +10,7 @@ members = [
     "crates/wzp-client",
     "crates/wzp-web",
     "crates/wzp-android",
+    "desktop/src-tauri",
 ]
 
 [workspace.package]
@@ -53,3 +54,24 @@ wzp-fec = { path = "crates/wzp-fec" }
 wzp-crypto = { path = "crates/wzp-crypto" }
 wzp-transport = { path = "crates/wzp-transport" }
 wzp-client = { path = "crates/wzp-client" }
+
+# Fast dev profile: optimized but with debug info and incremental compilation.
+# Use with: cargo run --profile dev-fast
+[profile.dev-fast]
+inherits = "dev"
+opt-level = 2
+
+# Optimize heavy compute deps even in debug builds —
+# real-time audio needs < 20ms per frame, impossible unoptimized.
+[profile.dev.package.nnnoiseless]
+opt-level = 3
+[profile.dev.package.audiopus_sys]
+opt-level = 3
+[profile.dev.package.audiopus]
+opt-level = 3
+[profile.dev.package.raptorq]
+opt-level = 3
+[profile.dev.package.wzp-codec]
+opt-level = 3
+[profile.dev.package.wzp-fec]
+opt-level = 3

crates/wzp-client/Cargo.toml

@@ -23,10 +23,13 @@ serde_json = "1"
 chrono = "0.4"
 rustls = { version = "0.23", default-features = false, features = ["ring", "std"] }
 cpal = { version = "0.15", optional = true }
+coreaudio-rs = { version = "0.11", optional = true }
+libc = "0.2"
 
 [features]
 default = []
 audio = ["cpal"]
+vpio = ["coreaudio-rs"]
 
 [[bin]]
 name = "wzp-client"

crates/wzp-client/src/audio_io.rs

@@ -3,12 +3,10 @@
 //! Both structs use 48 kHz, mono, i16 format to match the WarzonePhone codec
 //! pipeline. Frames are 960 samples (20 ms at 48 kHz).
 //!
-//! The cpal `Stream` type is not `Send`, so each struct spawns a dedicated OS
-//! thread that owns the stream. The public API exposes only `Send + Sync`
-//! channel handles.
+//! Audio callbacks are **lock-free**: they read/write directly to an `AudioRing`
+//! (atomic SPSC ring buffer). No Mutex, no channel, no allocation on the hot path.
 
 use std::sync::atomic::{AtomicBool, Ordering};
-use std::sync::mpsc;
 use std::sync::Arc;
 
 use anyhow::{anyhow, Context};
@@ -16,6 +14,8 @@ use cpal::traits::{DeviceTrait, HostTrait, StreamTrait};
 use cpal::{SampleFormat, SampleRate, StreamConfig};
 use tracing::{info, warn};
 
+use crate::audio_ring::AudioRing;
+
 /// Number of samples per 20 ms frame at 48 kHz mono.
 pub const FRAME_SAMPLES: usize = 960;
 
@@ -23,22 +23,24 @@ pub const FRAME_SAMPLES: usize = 960;
 // AudioCapture
 // ---------------------------------------------------------------------------
 
-/// Captures microphone input and yields 960-sample PCM frames.
+/// Captures microphone input via CPAL and writes PCM into a lock-free ring buffer.
 ///
 /// The cpal stream lives on a dedicated OS thread; this handle is `Send + Sync`.
 pub struct AudioCapture {
-    rx: mpsc::Receiver<Vec<i16>>,
+    ring: Arc<AudioRing>,
     running: Arc<AtomicBool>,
 }
 
 impl AudioCapture {
     /// Create and start capturing from the default input device at 48 kHz mono.
     pub fn start() -> Result<Self, anyhow::Error> {
-        let (tx, rx) = mpsc::sync_channel::<Vec<i16>>(64);
+        let ring = Arc::new(AudioRing::new());
         let running = Arc::new(AtomicBool::new(true));
-        let running_clone = running.clone();
 
-        let (init_tx, init_rx) = mpsc::sync_channel::<Result<(), String>>(1);
+        let (init_tx, init_rx) = std::sync::mpsc::sync_channel::<Result<(), String>>(1);
+
+        let ring_cb = ring.clone();
+        let running_clone = running.clone();
 
         std::thread::Builder::new()
             .name("wzp-audio-capture".into())
@@ -59,53 +61,51 @@ impl AudioCapture {
 
                     let use_f32 = !supports_i16_input(&device)?;
 
-                    let buf = Arc::new(std::sync::Mutex::new(
-                        Vec::<i16>::with_capacity(FRAME_SAMPLES),
-                    ));
                     let err_cb = |e: cpal::StreamError| {
                         warn!("input stream error: {e}");
                     };
 
+                    let logged_cb_size = Arc::new(AtomicBool::new(false));
+
                     let stream = if use_f32 {
-                        let buf = buf.clone();
-                        let tx = tx.clone();
+                        let ring = ring_cb.clone();
                         let running = running_clone.clone();
+                        let logged = logged_cb_size.clone();
                         device.build_input_stream(
                             &config,
                             move |data: &[f32], _: &cpal::InputCallbackInfo| {
                                 if !running.load(Ordering::Relaxed) {
                                     return;
                                 }
-                                let mut lock = buf.lock().unwrap();
-                                for &s in data {
-                                    lock.push(f32_to_i16(s));
-                                    if lock.len() == FRAME_SAMPLES {
-                                        let frame = lock.drain(..).collect();
-                                        let _ = tx.try_send(frame);
+                                if !logged.swap(true, Ordering::Relaxed) {
+                                    eprintln!("[audio] capture callback: {} f32 samples", data.len());
                                 }
+                                let mut tmp = [0i16; FRAME_SAMPLES];
+                                for chunk in data.chunks(FRAME_SAMPLES) {
+                                    let n = chunk.len();
+                                    for i in 0..n {
+                                        tmp[i] = f32_to_i16(chunk[i]);
+                                    }
+                                    ring.write(&tmp[..n]);
                                 }
                             },
                             err_cb,
                             None,
                         )?
                     } else {
-                        let buf = buf.clone();
-                        let tx = tx.clone();
+                        let ring = ring_cb.clone();
                         let running = running_clone.clone();
+                        let logged = logged_cb_size.clone();
                         device.build_input_stream(
                             &config,
                             move |data: &[i16], _: &cpal::InputCallbackInfo| {
                                 if !running.load(Ordering::Relaxed) {
                                     return;
                                 }
-                                let mut lock = buf.lock().unwrap();
-                                for &s in data {
-                                    lock.push(s);
-                                    if lock.len() == FRAME_SAMPLES {
-                                        let frame = lock.drain(..).collect();
-                                        let _ = tx.try_send(frame);
-                                    }
+                                if !logged.swap(true, Ordering::Relaxed) {
+                                    eprintln!("[audio] capture callback: {} i16 samples", data.len());
                                 }
+                                ring.write(data);
                             },
                             err_cb,
                             None,
@@ -114,7 +114,6 @@ impl AudioCapture {
 
                     stream.play().context("failed to start input stream")?;
 
-                    // Signal success to the caller before parking.
                     let _ = init_tx.send(Ok(()));
 
                     // Keep stream alive until stopped.
@@ -135,15 +134,12 @@ impl AudioCapture {
             .map_err(|_| anyhow!("capture thread exited before signaling"))?
             .map_err(|e| anyhow!("{e}"))?;
 
-        Ok(Self { rx, running })
+        Ok(Self { ring, running })
     }
 
-    /// Read the next frame of 960 PCM samples (blocking until available).
-    ///
-    /// Returns `None` when the stream has been stopped or the channel is
-    /// disconnected.
-    pub fn read_frame(&self) -> Option<Vec<i16>> {
-        self.rx.recv().ok()
+    /// Get a reference to the capture ring buffer for direct polling.
+    pub fn ring(&self) -> &Arc<AudioRing> {
+        &self.ring
     }
 
     /// Stop capturing.
@@ -152,26 +148,34 @@ impl AudioCapture {
     }
 }
 
+impl Drop for AudioCapture {
+    fn drop(&mut self) {
+        self.stop();
+    }
+}
+
 // ---------------------------------------------------------------------------
 // AudioPlayback
 // ---------------------------------------------------------------------------
 
-/// Plays PCM frames through the default output device at 48 kHz mono.
+/// Plays PCM through the default output device, reading from a lock-free ring buffer.
 ///
 /// The cpal stream lives on a dedicated OS thread; this handle is `Send + Sync`.
 pub struct AudioPlayback {
-    tx: mpsc::SyncSender<Vec<i16>>,
+    ring: Arc<AudioRing>,
     running: Arc<AtomicBool>,
 }
 
 impl AudioPlayback {
     /// Create and start playback on the default output device at 48 kHz mono.
     pub fn start() -> Result<Self, anyhow::Error> {
-        let (tx, rx) = mpsc::sync_channel::<Vec<i16>>(64);
+        let ring = Arc::new(AudioRing::new());
         let running = Arc::new(AtomicBool::new(true));
-        let running_clone = running.clone();
 
-        let (init_tx, init_rx) = mpsc::sync_channel::<Result<(), String>>(1);
+        let (init_tx, init_rx) = std::sync::mpsc::sync_channel::<Result<(), String>>(1);
+
+        let ring_cb = ring.clone();
+        let running_clone = running.clone();
 
         std::thread::Builder::new()
             .name("wzp-audio-playback".into())
@@ -192,62 +196,40 @@ impl AudioPlayback {
 
                     let use_f32 = !supports_i16_output(&device)?;
 
-                    // Shared ring of samples the cpal callback drains from.
-                    let ring = Arc::new(std::sync::Mutex::new(
-                        std::collections::VecDeque::<i16>::with_capacity(FRAME_SAMPLES * 8),
-                    ));
-
-                    // Background drainer: moves frames from the mpsc channel into the ring.
-                    {
-                        let ring = ring.clone();
-                        let running = running_clone.clone();
-                        std::thread::Builder::new()
-                            .name("wzp-playback-drain".into())
-                            .spawn(move || {
-                                while running.load(Ordering::Relaxed) {
-                                    match rx.recv_timeout(std::time::Duration::from_millis(100)) {
-                                        Ok(frame) => {
-                                            let mut lock = ring.lock().unwrap();
-                                            lock.extend(frame);
-                                            while lock.len() > FRAME_SAMPLES * 16 {
-                                                lock.pop_front();
-                                            }
-                                        }
-                                        Err(mpsc::RecvTimeoutError::Timeout) => {}
-                                        Err(mpsc::RecvTimeoutError::Disconnected) => break,
-                                    }
-                                }
-                            })?;
-                    }
-
                     let err_cb = |e: cpal::StreamError| {
                         warn!("output stream error: {e}");
                     };
 
                     let stream = if use_f32 {
-                        let ring = ring.clone();
+                        let ring = ring_cb.clone();
                         device.build_output_stream(
                             &config,
                             move |data: &mut [f32], _: &cpal::OutputCallbackInfo| {
-                                let mut lock = ring.lock().unwrap();
-                                for sample in data.iter_mut() {
-                                    *sample = match lock.pop_front() {
-                                        Some(s) => i16_to_f32(s),
-                                        None => 0.0,
-                                    };
+                                let mut tmp = [0i16; FRAME_SAMPLES];
+                                for chunk in data.chunks_mut(FRAME_SAMPLES) {
+                                    let n = chunk.len();
+                                    let read = ring.read(&mut tmp[..n]);
+                                    for i in 0..read {
+                                        chunk[i] = i16_to_f32(tmp[i]);
+                                    }
+                                    // Fill remainder with silence if ring underran
+                                    for i in read..n {
+                                        chunk[i] = 0.0;
+                                    }
                                 }
                             },
                             err_cb,
                             None,
                         )?
                     } else {
-                        let ring = ring.clone();
+                        let ring = ring_cb.clone();
                         device.build_output_stream(
                             &config,
                             move |data: &mut [i16], _: &cpal::OutputCallbackInfo| {
-                                let mut lock = ring.lock().unwrap();
-                                for sample in data.iter_mut() {
-                                    *sample = lock.pop_front().unwrap_or(0);
+                                let read = ring.read(data);
+                                // Fill remainder with silence if ring underran
+                                for sample in &mut data[read..] {
+                                    *sample = 0;
                                 }
                             },
                             err_cb,
@@ -257,7 +239,6 @@ impl AudioPlayback {
 
                     stream.play().context("failed to start output stream")?;
 
-                    // Signal success to the caller before parking.
                     let _ = init_tx.send(Ok(()));
 
                     // Keep stream alive until stopped.
@@ -278,12 +259,12 @@ impl AudioPlayback {
             .map_err(|_| anyhow!("playback thread exited before signaling"))?
             .map_err(|e| anyhow!("{e}"))?;
 
-        Ok(Self { tx, running })
+        Ok(Self { ring, running })
     }
 
-    /// Write a frame of PCM samples for playback.
-    pub fn write_frame(&self, pcm: &[i16]) {
-        let _ = self.tx.try_send(pcm.to_vec());
+    /// Get a reference to the playout ring buffer for direct writing.
+    pub fn ring(&self) -> &Arc<AudioRing> {
+        &self.ring
     }
 
     /// Stop playback.
@@ -292,11 +273,16 @@ impl AudioPlayback {
     }
 }
 
+impl Drop for AudioPlayback {
+    fn drop(&mut self) {
+        self.stop();
+    }
+}
+
 // ---------------------------------------------------------------------------
 // Helpers
 // ---------------------------------------------------------------------------
 
-/// Check if the input device supports i16 at 48 kHz mono.
 fn supports_i16_input(device: &cpal::Device) -> Result<bool, anyhow::Error> {
     let supported = device
         .supported_input_configs()
@@ -313,7 +299,6 @@ fn supports_i16_input(device: &cpal::Device) -> Result<bool, anyhow::Error> {
     Ok(false)
 }
 
-/// Check if the output device supports i16 at 48 kHz mono.
 fn supports_i16_output(device: &cpal::Device) -> Result<bool, anyhow::Error> {
     let supported = device
         .supported_output_configs()

crates/wzp-client/src/audio_ring.rs

@@ -0,0 +1,122 @@
+//! Lock-free SPSC ring buffer — "Reader-Detects-Lap" architecture.
+//!
+//! SPSC invariant: the producer ONLY writes `write_pos`, the consumer
+//! ONLY writes `read_pos`.  Neither thread touches the other's cursor.
+//!
+//! On overflow (writer laps the reader), the writer simply overwrites
+//! old buffer data.  The reader detects the lap via `available() >
+//! RING_CAPACITY` and snaps its own `read_pos` forward.
+//!
+//! Capacity is a power of 2 for bitmask indexing (no modulo).
+
+use std::sync::atomic::{AtomicU64, AtomicUsize, Ordering};
+
+/// Ring buffer capacity — power of 2 for bitmask indexing.
+/// 16384 samples = 341.3ms at 48kHz mono.
+const RING_CAPACITY: usize = 16384; // 2^14
+const RING_MASK: usize = RING_CAPACITY - 1;
+
+/// Lock-free single-producer single-consumer ring buffer for i16 PCM samples.
+pub struct AudioRing {
+    buf: Box<[i16]>,
+    /// Monotonically increasing write cursor. ONLY written by producer.
+    write_pos: AtomicUsize,
+    /// Monotonically increasing read cursor. ONLY written by consumer.
+    read_pos: AtomicUsize,
+    /// Incremented by reader when it detects it was lapped (overflow).
+    overflow_count: AtomicU64,
+    /// Incremented by reader when ring is empty (underrun).
+    underrun_count: AtomicU64,
+}
+
+// SAFETY: AudioRing is SPSC — one thread writes (producer), one reads (consumer).
+// The producer only writes write_pos. The consumer only writes read_pos.
+// Neither thread writes the other's cursor. Buffer indices are derived from
+// the owning thread's cursor, ensuring no concurrent access to the same index.
+unsafe impl Send for AudioRing {}
+unsafe impl Sync for AudioRing {}
+
+impl AudioRing {
+    pub fn new() -> Self {
+        debug_assert!(RING_CAPACITY.is_power_of_two());
+        Self {
+            buf: vec![0i16; RING_CAPACITY].into_boxed_slice(),
+            write_pos: AtomicUsize::new(0),
+            read_pos: AtomicUsize::new(0),
+            overflow_count: AtomicU64::new(0),
+            underrun_count: AtomicU64::new(0),
+        }
+    }
+
+    /// Number of samples available to read (clamped to capacity).
+    pub fn available(&self) -> usize {
+        let w = self.write_pos.load(Ordering::Acquire);
+        let r = self.read_pos.load(Ordering::Relaxed);
+        w.wrapping_sub(r).min(RING_CAPACITY)
+    }
+
+    /// Write samples into the ring. Returns number of samples written.
+    ///
+    /// If the ring is full, old data is silently overwritten.  The reader
+    /// will detect the lap and self-correct.  The writer NEVER touches
+    /// `read_pos`.
+    pub fn write(&self, samples: &[i16]) -> usize {
+        let count = samples.len().min(RING_CAPACITY);
+        let w = self.write_pos.load(Ordering::Relaxed);
+
+        for i in 0..count {
+            unsafe {
+                let ptr = self.buf.as_ptr() as *mut i16;
+                *ptr.add((w + i) & RING_MASK) = samples[i];
+            }
+        }
+
+        self.write_pos
+            .store(w.wrapping_add(count), Ordering::Release);
+        count
+    }
+
+    /// Read samples from the ring into `out`. Returns number of samples read.
+    ///
+    /// If the writer has lapped the reader (overflow), `read_pos` is snapped
+    /// forward to the oldest valid data.
+    pub fn read(&self, out: &mut [i16]) -> usize {
+        let w = self.write_pos.load(Ordering::Acquire);
+        let mut r = self.read_pos.load(Ordering::Relaxed);
+
+        let mut avail = w.wrapping_sub(r);
+
+        // Lap detection: writer has overwritten our unread data.
+        if avail > RING_CAPACITY {
+            r = w.wrapping_sub(RING_CAPACITY);
+            avail = RING_CAPACITY;
+            self.overflow_count.fetch_add(1, Ordering::Relaxed);
+        }
+
+        let count = out.len().min(avail);
+        if count == 0 {
+            if w == r {
+                self.underrun_count.fetch_add(1, Ordering::Relaxed);
+            }
+            return 0;
+        }
+
+        for i in 0..count {
+            out[i] = unsafe { *self.buf.as_ptr().add((r + i) & RING_MASK) };
+        }
+
+        self.read_pos
+            .store(r.wrapping_add(count), Ordering::Release);
+        count
+    }
+
+    /// Number of overflow events (reader was lapped by writer).
+    pub fn overflow_count(&self) -> u64 {
+        self.overflow_count.load(Ordering::Relaxed)
+    }
+
+    /// Number of underrun events (reader found empty buffer).
+    pub fn underrun_count(&self) -> u64 {
+        self.underrun_count.load(Ordering::Relaxed)
+    }
+}

crates/wzp-client/src/audio_vpio.rs

@@ -0,0 +1,179 @@
+//! macOS Voice Processing I/O — uses Apple's VoiceProcessingIO audio unit
+//! for hardware-accelerated echo cancellation, AGC, and noise suppression.
+//!
+//! VoiceProcessingIO is a combined input+output unit that knows what's going
+//! to the speaker, so it can cancel the echo from the mic signal internally.
+//! This is the same engine FaceTime and other Apple apps use.
+
+use std::sync::atomic::{AtomicBool, Ordering};
+use std::sync::Arc;
+
+use anyhow::Context;
+use coreaudio::audio_unit::audio_format::LinearPcmFlags;
+use coreaudio::audio_unit::render_callback::{self, data};
+use coreaudio::audio_unit::{AudioUnit, Element, IOType, SampleFormat, Scope, StreamFormat};
+use coreaudio::sys;
+use tracing::info;
+
+use crate::audio_ring::AudioRing;
+
+/// Number of samples per 20 ms frame at 48 kHz mono.
+pub const FRAME_SAMPLES: usize = 960;
+
+/// Combined capture + playback via macOS VoiceProcessingIO.
+///
+/// The OS handles AEC internally — no manual far-end feeding needed.
+pub struct VpioAudio {
+    capture_ring: Arc<AudioRing>,
+    playout_ring: Arc<AudioRing>,
+    _audio_unit: AudioUnit,
+    running: Arc<AtomicBool>,
+}
+
+impl VpioAudio {
+    /// Start VoiceProcessingIO with AEC enabled.
+    pub fn start() -> Result<Self, anyhow::Error> {
+        let capture_ring = Arc::new(AudioRing::new());
+        let playout_ring = Arc::new(AudioRing::new());
+        let running = Arc::new(AtomicBool::new(true));
+
+        let mut au = AudioUnit::new(IOType::VoiceProcessingIO)
+            .context("failed to create VoiceProcessingIO audio unit")?;
+
+        // Must uninitialize before configuring properties.
+        au.uninitialize()
+            .context("failed to uninitialize VPIO for configuration")?;
+
+        // Enable input (mic) on Element::Input (bus 1).
+        let enable: u32 = 1;
+        au.set_property(
+            sys::kAudioOutputUnitProperty_EnableIO,
+            Scope::Input,
+            Element::Input,
+            Some(&enable),
+        )
+        .context("failed to enable VPIO input")?;
+
+        // Output (speaker) is enabled by default on VPIO, but be explicit.
+        au.set_property(
+            sys::kAudioOutputUnitProperty_EnableIO,
+            Scope::Output,
+            Element::Output,
+            Some(&enable),
+        )
+        .context("failed to enable VPIO output")?;
+
+        // Configure stream format: 48kHz mono f32 non-interleaved
+        let stream_format = StreamFormat {
+            sample_rate: 48_000.0,
+            sample_format: SampleFormat::F32,
+            flags: LinearPcmFlags::IS_FLOAT
+                | LinearPcmFlags::IS_PACKED
+                | LinearPcmFlags::IS_NON_INTERLEAVED,
+            channels: 1,
+        };
+
+        let asbd = stream_format.to_asbd();
+
+        // Input: set format on Output scope of Input element
+        // (= the format the AU delivers to us from the mic)
+        au.set_property(
+            sys::kAudioUnitProperty_StreamFormat,
+            Scope::Output,
+            Element::Input,
+            Some(&asbd),
+        )
+        .context("failed to set input stream format")?;
+
+        // Output: set format on Input scope of Output element
+        // (= the format we feed to the AU for the speaker)
+        au.set_property(
+            sys::kAudioUnitProperty_StreamFormat,
+            Scope::Input,
+            Element::Output,
+            Some(&asbd),
+        )
+        .context("failed to set output stream format")?;
+
+        // Set up input callback (mic capture with AEC applied)
+        let cap_ring = capture_ring.clone();
+        let cap_running = running.clone();
+        let logged = Arc::new(AtomicBool::new(false));
+        au.set_input_callback(
+            move |args: render_callback::Args<data::NonInterleaved<f32>>| {
+                if !cap_running.load(Ordering::Relaxed) {
+                    return Ok(());
+                }
+                let mut buffers = args.data.channels();
+                if let Some(ch) = buffers.next() {
+                    if !logged.swap(true, Ordering::Relaxed) {
+                        eprintln!("[vpio] capture callback: {} f32 samples", ch.len());
+                    }
+                    let mut tmp = [0i16; FRAME_SAMPLES];
+                    for chunk in ch.chunks(FRAME_SAMPLES) {
+                        let n = chunk.len();
+                        for i in 0..n {
+                            tmp[i] = (chunk[i].clamp(-1.0, 1.0) * i16::MAX as f32) as i16;
+                        }
+                        cap_ring.write(&tmp[..n]);
+                    }
+                }
+                Ok(())
+            },
+        )
+        .context("failed to set input callback")?;
+
+        // Set up output callback (speaker playback — AEC uses this as reference)
+        let play_ring = playout_ring.clone();
+        au.set_render_callback(
+            move |mut args: render_callback::Args<data::NonInterleaved<f32>>| {
+                let mut buffers = args.data.channels_mut();
+                if let Some(ch) = buffers.next() {
+                    let mut tmp = [0i16; FRAME_SAMPLES];
+                    for chunk in ch.chunks_mut(FRAME_SAMPLES) {
+                        let n = chunk.len();
+                        let read = play_ring.read(&mut tmp[..n]);
+                        for i in 0..read {
+                            chunk[i] = tmp[i] as f32 / i16::MAX as f32;
+                        }
+                        for i in read..n {
+                            chunk[i] = 0.0;
+                        }
+                    }
+                }
+                Ok(())
+            },
+        )
+        .context("failed to set render callback")?;
+
+        au.initialize().context("failed to initialize VoiceProcessingIO")?;
+        au.start().context("failed to start VoiceProcessingIO")?;
+
+        info!("VoiceProcessingIO started (OS-level AEC enabled)");
+
+        Ok(Self {
+            capture_ring,
+            playout_ring,
+            _audio_unit: au,
+            running,
+        })
+    }
+
+    pub fn capture_ring(&self) -> &Arc<AudioRing> {
+        &self.capture_ring
+    }
+
+    pub fn playout_ring(&self) -> &Arc<AudioRing> {
+        &self.playout_ring
+    }
+
+    pub fn stop(&self) {
+        self.running.store(false, Ordering::Relaxed);
+    }
+}
+
+impl Drop for VpioAudio {
+    fn drop(&mut self) {
+        self.stop();
+    }
+}

crates/wzp-client/src/call.rs

@@ -42,6 +42,9 @@ pub struct CallConfig {
     /// When enabled, only every 50th frame carries a full 12-byte MediaHeader;
     /// intermediate frames use a compact 4-byte MiniHeader.
     pub mini_frames_enabled: bool,
+    /// AEC far-end delay compensation in milliseconds (default: 40).
+    /// Compensates for the round-trip audio latency from playout to mic capture.
+    pub aec_delay_ms: u32,
     /// Enable adaptive jitter buffer (default: true).
     ///
     /// When true, the jitter buffer target depth is automatically adjusted
@@ -63,6 +66,7 @@ impl Default for CallConfig {
             noise_suppression: true,
             mini_frames_enabled: true,
             adaptive_jitter: true,
+            aec_delay_ms: 40,
         }
     }
 }
@@ -241,7 +245,7 @@ impl CallEncoder {
             block_id: 0,
             frame_in_block: 0,
             timestamp_ms: 0,
-            aec: EchoCanceller::new(48000, 100), // 100 ms echo tail
+            aec: EchoCanceller::with_delay(48000, 60, config.aec_delay_ms),
             agc: AutoGainControl::new(),
             silence_detector: SilenceDetector::new(
                 config.silence_threshold_rms,
@@ -496,6 +500,52 @@ impl CallDecoder {
         }
     }
 
+    /// Switch the decoder to match an incoming packet's codec if it differs
+    /// from the current profile. This enables cross-codec interop (e.g. one
+    /// client sends Opus, the other sends Codec2).
+    fn switch_decoder_if_needed(&mut self, incoming_codec: CodecId) {
+        if incoming_codec == self.profile.codec || incoming_codec == CodecId::ComfortNoise {
+            return;
+        }
+        let new_profile = Self::profile_for_codec(incoming_codec);
+        info!(
+            from = ?self.profile.codec,
+            to = ?incoming_codec,
+            "decoder switching codec to match incoming packet"
+        );
+        if let Err(e) = self.audio_dec.set_profile(new_profile) {
+            warn!("failed to switch decoder profile: {e}");
+            return;
+        }
+        self.fec_dec = wzp_fec::create_decoder(&new_profile);
+        self.profile = new_profile;
+    }
+
+    /// Map a `CodecId` to a reasonable `QualityProfile` for decoding.
+    fn profile_for_codec(codec: CodecId) -> QualityProfile {
+        match codec {
+            CodecId::Opus24k => QualityProfile::GOOD,
+            CodecId::Opus16k => QualityProfile {
+                codec: CodecId::Opus16k,
+                fec_ratio: 0.3,
+                frame_duration_ms: 20,
+                frames_per_block: 5,
+            },
+            CodecId::Opus6k => QualityProfile::DEGRADED,
+            CodecId::Opus32k => QualityProfile::STUDIO_32K,
+            CodecId::Opus48k => QualityProfile::STUDIO_48K,
+            CodecId::Opus64k => QualityProfile::STUDIO_64K,
+            CodecId::Codec2_3200 => QualityProfile {
+                codec: CodecId::Codec2_3200,
+                fec_ratio: 0.5,
+                frame_duration_ms: 20,
+                frames_per_block: 5,
+            },
+            CodecId::Codec2_1200 => QualityProfile::CATASTROPHIC,
+            CodecId::ComfortNoise => QualityProfile::GOOD,
+        }
+    }
+
     /// Decode the next audio frame from the jitter buffer.
     ///
     /// Returns PCM samples (48kHz mono) or None if not ready.
@@ -510,6 +560,9 @@ impl CallDecoder {
                     return Some(pcm.len());
                 }
 
+                // Auto-switch decoder if incoming codec differs from current.
+                self.switch_decoder_if_needed(pkt.header.codec_id);
+
                 self.last_was_cn = false;
                 let result = match self.audio_dec.decode(&pkt.payload, pcm) {
                     Ok(n) => Some(n),

crates/wzp-client/src/lib.rs

@@ -8,6 +8,10 @@
 
 #[cfg(feature = "audio")]
 pub mod audio_io;
+#[cfg(feature = "audio")]
+pub mod audio_ring;
+#[cfg(feature = "vpio")]
+pub mod audio_vpio;
 pub mod bench;
 pub mod call;
 pub mod drift_test;

crates/wzp-codec/src/aec.rs

@@ -1,53 +1,127 @@
-//! Acoustic Echo Cancellation using NLMS adaptive filter.
-//! Processes 480-sample (10ms) sub-frames at 48kHz.
+//! Acoustic Echo Cancellation — delay-compensated leaky NLMS with
+//! Geigel double-talk detection.
+//!
+//! Key insight: on a laptop, the round-trip audio latency (playout → speaker
+//! → air → mic → capture) is 30–50ms.  The far-end reference must be delayed
+//! by this amount so the adaptive filter models the *echo path*, not the
+//! *system delay + echo path*.
+//!
+//! The leaky coefficient decay prevents the filter from diverging when the
+//! echo path changes (e.g. hand near laptop) or when the delay estimate
+//! is slightly off.
 
-/// NLMS (Normalized Least Mean Squares) adaptive filter echo canceller.
-///
-/// Removes acoustic echo by modelling the echo path between the far-end
-/// (speaker) signal and the near-end (microphone) signal, then subtracting
-/// the estimated echo from the near-end in real time.
+/// Delay-compensated leaky NLMS echo canceller with Geigel DTD.
 pub struct EchoCanceller {
-    filter_coeffs: Vec<f32>,
+    // --- Adaptive filter ---
+    filter: Vec<f32>,
     filter_len: usize,
-    far_end_buf: Vec<f32>,
-    far_end_pos: usize,
+    /// Circular buffer of far-end reference samples (after delay).
+    far_buf: Vec<f32>,
+    far_pos: usize,
+    /// NLMS step size.
     mu: f32,
+    /// Leakage factor: coefficients are multiplied by (1 - leak) each frame.
+    /// Prevents unbounded growth / divergence.  0.0001 is gentle.
+    leak: f32,
     enabled: bool,
+
+    // --- Delay buffer ---
+    /// Raw far-end samples before delay compensation.
+    delay_ring: Vec<f32>,
+    delay_write: usize,
+    delay_read: usize,
+    /// Delay in samples (e.g. 1920 = 40ms at 48kHz).
+    delay_samples: usize,
+    /// Capacity of the delay ring.
+    delay_cap: usize,
+
+    // --- Double-talk detection (Geigel) ---
+    /// Peak far-end level over the last filter_len samples.
+    far_peak: f32,
+    /// Geigel threshold: if |near| > threshold * far_peak, assume double-talk.
+    geigel_threshold: f32,
+    /// Holdover counter: keep DTD active for a few frames after detection.
+    dtd_holdover: u32,
+    dtd_hold_frames: u32,
 }
 
 impl EchoCanceller {
     /// Create a new echo canceller.
     ///
     /// * `sample_rate` — typically 48000
-    /// * `filter_ms`   — echo-tail length in milliseconds (e.g. 100 for 100 ms)
+    /// * `filter_ms`   — echo-tail length in milliseconds (60ms recommended)
+    /// * `delay_ms`    — far-end delay compensation in milliseconds (40ms for laptops)
     pub fn new(sample_rate: u32, filter_ms: u32) -> Self {
+        Self::with_delay(sample_rate, filter_ms, 40)
+    }
+
+    pub fn with_delay(sample_rate: u32, filter_ms: u32, delay_ms: u32) -> Self {
         let filter_len = (sample_rate as usize) * (filter_ms as usize) / 1000;
+        let delay_samples = (sample_rate as usize) * (delay_ms as usize) / 1000;
+        // Delay ring must hold at least delay_samples + one frame (960) of headroom.
+        let delay_cap = delay_samples + (sample_rate as usize / 10); // +100ms headroom
         Self {
-            filter_coeffs: vec![0.0f32; filter_len],
+            filter: vec![0.0; filter_len],
             filter_len,
-            far_end_buf: vec![0.0f32; filter_len],
-            far_end_pos: 0,
+            far_buf: vec![0.0; filter_len],
+            far_pos: 0,
             mu: 0.01,
+            leak: 0.0001,
             enabled: true,
+
+            delay_ring: vec![0.0; delay_cap],
+            delay_write: 0,
+            delay_read: 0,
+            delay_samples,
+            delay_cap,
+
+            far_peak: 0.0,
+            geigel_threshold: 0.7,
+            dtd_holdover: 0,
+            dtd_hold_frames: 5,
         }
     }
 
-    /// Feed far-end (speaker/playback) samples into the circular buffer.
-    ///
-    /// Must be called with the audio that was played out through the speaker
-    /// *before* the corresponding near-end frame is processed.
+    /// Feed far-end (speaker) samples.  These go into the delay buffer first;
+    /// once enough samples have accumulated, they are released to the filter's
+    /// circular buffer with the correct delay offset.
     pub fn feed_farend(&mut self, farend: &[i16]) {
+        // Write raw samples into the delay ring.
         for &s in farend {
-            self.far_end_buf[self.far_end_pos] = s as f32;
-            self.far_end_pos = (self.far_end_pos + 1) % self.filter_len;
+            self.delay_ring[self.delay_write % self.delay_cap] = s as f32;
+            self.delay_write += 1;
+        }
+
+        // Release delayed samples to the filter's far-end buffer.
+        while self.delay_available() >= 1 {
+            let sample = self.delay_ring[self.delay_read % self.delay_cap];
+            self.delay_read += 1;
+
+            self.far_buf[self.far_pos] = sample;
+            self.far_pos = (self.far_pos + 1) % self.filter_len;
+
+            // Track peak far-end level for Geigel DTD.
+            let abs_s = sample.abs();
+            if abs_s > self.far_peak {
+                self.far_peak = abs_s;
+            }
+        }
+
+        // Decay far_peak slowly (avoids stale peak from a loud burst long ago).
+        self.far_peak *= 0.9995;
+    }
+
+    /// Number of delayed samples available to release.
+    fn delay_available(&self) -> usize {
+        let buffered = self.delay_write - self.delay_read;
+        if buffered > self.delay_samples {
+            buffered - self.delay_samples
+        } else {
+            0
         }
     }
 
     /// Process a near-end (microphone) frame, removing the estimated echo.
-    ///
-    /// Returns the echo-return-loss enhancement (ERLE) as a ratio: the RMS of
-    /// the original near-end divided by the RMS of the residual.  Values > 1.0
-    /// mean echo was reduced.
     pub fn process_frame(&mut self, nearend: &mut [i16]) -> f32 {
         if !self.enabled {
             return 1.0;
@@ -56,85 +130,96 @@ impl EchoCanceller {
         let n = nearend.len();
         let fl = self.filter_len;
 
+        // --- Geigel double-talk detection ---
+        // If any near-end sample exceeds threshold * far_peak, assume
+        // the local speaker is active and freeze adaptation.
+        let mut is_doubletalk = self.dtd_holdover > 0;
+        if !is_doubletalk {
+            let threshold_level = self.geigel_threshold * self.far_peak;
+            for &s in nearend.iter() {
+                if (s as f32).abs() > threshold_level && self.far_peak > 100.0 {
+                    is_doubletalk = true;
+                    self.dtd_holdover = self.dtd_hold_frames;
+                    break;
+                }
+            }
+        }
+        if self.dtd_holdover > 0 {
+            self.dtd_holdover -= 1;
+        }
+
+        // Check if far-end is active (otherwise nothing to cancel).
+        let far_active = self.far_peak > 100.0;
+
+        // --- Leaky coefficient decay ---
+        // Applied once per frame for efficiency.
+        let decay = 1.0 - self.leak;
+        for c in self.filter.iter_mut() {
+            *c *= decay;
+        }
+
         let mut sum_near_sq: f64 = 0.0;
         let mut sum_err_sq: f64 = 0.0;
 
         for i in 0..n {
             let near_f = nearend[i] as f32;
 
-            // --- estimate echo as dot(coeffs, farend_window) ---
-            // The far-end window for this sample starts at
-            //   (far_end_pos - 1 - i) mod filter_len   (most recent)
-            // and goes back filter_len samples.
+            // Position of far-end "now" for this near-end sample.
+            let base = (self.far_pos + fl * ((n / fl) + 2) + i - n) % fl;
+
+            // --- Echo estimation: dot(filter, far_end_window) ---
             let mut echo_est: f32 = 0.0;
             let mut power: f32 = 0.0;
 
-            // Position of the most-recent far-end sample for this near-end sample.
-            // far_end_pos points to the *next write* position, so the most-recent
-            // sample written is at far_end_pos - 1.  We have already called
-            // feed_farend for this block, so the relevant samples are the last
-            // filter_len entries ending just before the current write position,
-            // offset by how far we are into this near-end frame.
-            //
-            // For sample i of the near-end frame, the corresponding far-end
-            // "now" is far_end_pos - n + i  (wrapping).
-            // far_end_pos points to next-write, so most recent sample is at
-            // far_end_pos - 1.  For the i-th near-end sample we want the
-            // far-end "now" to be at (far_end_pos - n + i).  We add fl
-            // repeatedly to avoid underflow on the usize subtraction.
-            let base = (self.far_end_pos + fl * ((n / fl) + 2) + i - n) % fl;
-
             for k in 0..fl {
                 let fe_idx = (base + fl - k) % fl;
-                let fe = self.far_end_buf[fe_idx];
-                echo_est += self.filter_coeffs[k] * fe;
+                let fe = self.far_buf[fe_idx];
+                echo_est += self.filter[k] * fe;
                 power += fe * fe;
             }
 
             let error = near_f - echo_est;
 
-            // --- NLMS coefficient update ---
-            let norm = power + 1.0; // +1 regularisation to avoid div-by-zero
-            let step = self.mu * error / norm;
-
+            // --- NLMS adaptation (only when far-end active & no double-talk) ---
+            if far_active && !is_doubletalk && power > 10.0 {
+                let step = self.mu * error / (power + 1.0);
                 for k in 0..fl {
                     let fe_idx = (base + fl - k) % fl;
-                let fe = self.far_end_buf[fe_idx];
-                self.filter_coeffs[k] += step * fe;
+                    self.filter[k] += step * self.far_buf[fe_idx];
+                }
             }
 
-            // Clamp output
-            let out = error.max(-32768.0).min(32767.0);
+            let out = error.clamp(-32768.0, 32767.0);
             nearend[i] = out as i16;
 
-            sum_near_sq += (near_f as f64) * (near_f as f64);
-            sum_err_sq += (out as f64) * (out as f64);
+            sum_near_sq += (near_f as f64).powi(2);
+            sum_err_sq += (out as f64).powi(2);
         }
 
-        // ERLE ratio
         if sum_err_sq < 1.0 {
-            return 100.0; // near-perfect cancellation
-        }
+            100.0
+        } else {
             (sum_near_sq / sum_err_sq).sqrt() as f32
         }
+    }
 
-    /// Enable or disable echo cancellation.
     pub fn set_enabled(&mut self, enabled: bool) {
         self.enabled = enabled;
     }
 
-    /// Returns whether echo cancellation is currently enabled.
     pub fn is_enabled(&self) -> bool {
         self.enabled
     }
 
-    /// Reset the adaptive filter to its initial state.
-    ///
-    /// Zeroes out all filter coefficients and the far-end circular buffer.
     pub fn reset(&mut self) {
-        self.filter_coeffs.iter_mut().for_each(|c| *c = 0.0);
-        self.far_end_buf.iter_mut().for_each(|s| *s = 0.0);
-        self.far_end_pos = 0;
+        self.filter.iter_mut().for_each(|c| *c = 0.0);
+        self.far_buf.iter_mut().for_each(|s| *s = 0.0);
+        self.far_pos = 0;
+        self.far_peak = 0.0;
+        self.delay_ring.iter_mut().for_each(|s| *s = 0.0);
+        self.delay_write = 0;
+        self.delay_read = 0;
+        self.dtd_holdover = 0;
     }
 }
 
@@ -143,50 +228,40 @@ mod tests {
     use super::*;
 
     #[test]
-    fn aec_creates_with_correct_filter_len() {
-        let aec = EchoCanceller::new(48000, 100);
-        assert_eq!(aec.filter_len, 4800);
-        assert_eq!(aec.filter_coeffs.len(), 4800);
-        assert_eq!(aec.far_end_buf.len(), 4800);
+    fn creates_with_correct_sizes() {
+        let aec = EchoCanceller::with_delay(48000, 60, 40);
+        assert_eq!(aec.filter_len, 2880); // 60ms @ 48kHz
+        assert_eq!(aec.delay_samples, 1920); // 40ms @ 48kHz
     }
 
     #[test]
-    fn aec_passthrough_when_disabled() {
-        let mut aec = EchoCanceller::new(48000, 100);
+    fn passthrough_when_disabled() {
+        let mut aec = EchoCanceller::new(48000, 60);
         aec.set_enabled(false);
-        assert!(!aec.is_enabled());
 
-        let original: Vec<i16> = (0..480).map(|i| (i * 10) as i16).collect();
+        let original: Vec<i16> = (0..960).map(|i| (i * 10) as i16).collect();
         let mut frame = original.clone();
-        let erle = aec.process_frame(&mut frame);
-        assert_eq!(erle, 1.0);
+        aec.process_frame(&mut frame);
         assert_eq!(frame, original);
     }
 
     #[test]
-    fn aec_reset_zeroes_state() {
-        let mut aec = EchoCanceller::new(48000, 10); // short for test speed
-        let farend: Vec<i16> = (0..480).map(|i| ((i * 37) % 1000) as i16).collect();
-        aec.feed_farend(&farend);
-
-        aec.reset();
-
-        assert!(aec.filter_coeffs.iter().all(|&c| c == 0.0));
-        assert!(aec.far_end_buf.iter().all(|&s| s == 0.0));
-        assert_eq!(aec.far_end_pos, 0);
+    fn silence_passthrough() {
+        let mut aec = EchoCanceller::with_delay(48000, 30, 0);
+        aec.feed_farend(&vec![0i16; 960]);
+        let mut frame = vec![0i16; 960];
+        aec.process_frame(&mut frame);
+        assert!(frame.iter().all(|&s| s == 0));
     }
 
     #[test]
-    fn aec_reduces_echo_of_known_signal() {
-        // Use a small filter for speed.  Feed a known far-end signal, then
-        // present the *same* signal as near-end (perfect echo, no room).
-        // After adaptation the output energy should drop.
-        let filter_ms = 5; // 240 taps at 48 kHz
-        let mut aec = EchoCanceller::new(48000, filter_ms);
+    fn reduces_echo_with_no_delay() {
+        // Simulate: far-end plays, echo arrives at mic attenuated by ~50%
+        // (realistic — speaker to mic on laptop loses volume).
+        let mut aec = EchoCanceller::with_delay(48000, 10, 0);
 
-        // Generate a simple repeating pattern.
-        let frame_len = 480usize;
-        let make_frame = |offset: usize| -> Vec<i16> {
+        let frame_len = 480;
+        let make_tone = |offset: usize| -> Vec<i16> {
             (0..frame_len)
                 .map(|i| {
                     let t = (offset + i) as f64 / 48000.0;
@@ -195,18 +270,16 @@ mod tests {
                 .collect()
         };
 
-        // Warm up the adaptive filter with several frames.
         let mut last_erle = 1.0f32;
-        for frame_idx in 0..40 {
-            let farend = make_frame(frame_idx * frame_len);
+        for frame_idx in 0..100 {
+            let farend = make_tone(frame_idx * frame_len);
             aec.feed_farend(&farend);
 
-            // Near-end = exact copy of far-end (pure echo).
-            let mut nearend = farend.clone();
+            // Near-end = attenuated copy of far-end (echo at ~50% volume).
+            let mut nearend: Vec<i16> = farend.iter().map(|&s| s / 2).collect();
             last_erle = aec.process_frame(&mut nearend);
         }
 
-        // After 40 frames the ERLE should be meaningfully > 1.
         assert!(
             last_erle > 1.0,
             "expected ERLE > 1.0 after adaptation, got {last_erle}"
@@ -214,15 +287,49 @@ mod tests {
     }
 
     #[test]
-    fn aec_silence_passthrough() {
-        let mut aec = EchoCanceller::new(48000, 10);
-        // Feed silence far-end
-        aec.feed_farend(&vec![0i16; 480]);
-        // Near-end is silence too
-        let mut frame = vec![0i16; 480];
-        let erle = aec.process_frame(&mut frame);
-        assert!(erle >= 1.0);
-        // Output should still be silence
-        assert!(frame.iter().all(|&s| s == 0));
+    fn preserves_nearend_during_doubletalk() {
+        let mut aec = EchoCanceller::with_delay(48000, 30, 0);
+
+        let frame_len = 960;
+        let nearend: Vec<i16> = (0..frame_len)
+            .map(|i| {
+                let t = i as f64 / 48000.0;
+                (10000.0 * (2.0 * std::f64::consts::PI * 440.0 * t).sin()) as i16
+            })
+            .collect();
+
+        // Feed silence as far-end (no echo source).
+        aec.feed_farend(&vec![0i16; frame_len]);
+
+        let mut frame = nearend.clone();
+        aec.process_frame(&mut frame);
+
+        let input_energy: f64 = nearend.iter().map(|&s| (s as f64).powi(2)).sum();
+        let output_energy: f64 = frame.iter().map(|&s| (s as f64).powi(2)).sum();
+        let ratio = output_energy / input_energy;
+
+        assert!(
+            ratio > 0.8,
+            "near-end speech should be preserved, energy ratio = {ratio:.3}"
+        );
+    }
+
+    #[test]
+    fn delay_buffer_holds_samples() {
+        let mut aec = EchoCanceller::with_delay(48000, 10, 20);
+        // 20ms delay = 960 samples @ 48kHz.
+        // After feeding, feed_farend auto-drains available samples to far_buf.
+        // So delay_available() is always 0 after feed_farend returns.
+        // Instead, verify far_pos advances only after the delay is filled.
+
+        // Feed 960 samples (= delay amount). No samples released yet.
+        aec.feed_farend(&vec![1i16; 960]);
+        // far_buf should still be all zeros (nothing released).
+        assert!(aec.far_buf.iter().all(|&s| s == 0.0), "nothing should be released yet");
+
+        // Feed 480 more. 480 should be released to far_buf.
+        aec.feed_farend(&vec![2i16; 480]);
+        let non_zero = aec.far_buf.iter().filter(|&&s| s != 0.0).count();
+        assert!(non_zero > 0, "samples should have been released to far_buf");
     }
 }

crates/wzp-web/static/wasm/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "wzp-wasm",
+  "type": "module",
+  "description": "WarzonePhone WASM bindings — FEC (RaptorQ) + crypto (ChaCha20-Poly1305, X25519)",
+  "version": "0.1.0",
+  "files": [
+    "wzp_wasm_bg.wasm",
+    "wzp_wasm.js",
+    "wzp_wasm.d.ts"
+  ],
+  "main": "wzp_wasm.js",
+  "types": "wzp_wasm.d.ts",
+  "sideEffects": [
+    "./snippets/*"
+  ]
+}

crates/wzp-web/static/wasm/wzp_wasm.d.ts

@@ -0,0 +1,169 @@
+/* tslint:disable */
+/* eslint-disable */
+
+/**
+ * Symmetric encryption session using ChaCha20-Poly1305.
+ *
+ * Mirrors `wzp-crypto::session::ChaChaSession` for WASM.  Nonce derivation
+ * and key setup are identical so WASM and native peers interoperate.
+ */
+export class WzpCryptoSession {
+    free(): void;
+    [Symbol.dispose](): void;
+    /**
+     * Decrypt a media payload with AAD.
+     *
+     * Returns plaintext on success, or throws on auth failure.
+     */
+    decrypt(header_aad: Uint8Array, ciphertext: Uint8Array): Uint8Array;
+    /**
+     * Encrypt a media payload with AAD (typically the 12-byte MediaHeader).
+     *
+     * Returns `ciphertext || poly1305_tag` (plaintext.len() + 16 bytes).
+     */
+    encrypt(header_aad: Uint8Array, plaintext: Uint8Array): Uint8Array;
+    /**
+     * Create from a 32-byte shared secret (output of `WzpKeyExchange.derive_shared_secret`).
+     */
+    constructor(shared_secret: Uint8Array);
+    /**
+     * Current receive sequence number (for diagnostics / UI stats).
+     */
+    recv_seq(): number;
+    /**
+     * Current send sequence number (for diagnostics / UI stats).
+     */
+    send_seq(): number;
+}
+
+export class WzpFecDecoder {
+    free(): void;
+    [Symbol.dispose](): void;
+    /**
+     * Feed a received symbol.
+     *
+     * Returns the decoded block (concatenated original frames, unpadded) if
+     * enough symbols have been received to recover the block, or `undefined`.
+     */
+    add_symbol(block_id: number, symbol_idx: number, _is_repair: boolean, data: Uint8Array): Uint8Array | undefined;
+    /**
+     * Create a new FEC decoder.
+     *
+     * * `block_size` — expected number of source symbols per block.
+     * * `symbol_size` — padded byte size of each symbol (must match encoder).
+     */
+    constructor(block_size: number, symbol_size: number);
+}
+
+export class WzpFecEncoder {
+    free(): void;
+    [Symbol.dispose](): void;
+    /**
+     * Add a source symbol (audio frame).
+     *
+     * Returns encoded packets (all source + repair) when the block is complete,
+     * or `undefined` if the block is still accumulating.
+     *
+     * Each returned packet carries the 3-byte header:
+     *   `[block_id][symbol_idx][is_repair]` followed by `symbol_size` bytes.
+     */
+    add_symbol(data: Uint8Array): Uint8Array | undefined;
+    /**
+     * Force-flush the current (possibly partial) block.
+     *
+     * Returns all source + repair symbols with headers, or empty vec if no
+     * symbols have been accumulated.
+     */
+    flush(): Uint8Array;
+    /**
+     * Create a new FEC encoder.
+     *
+     * * `block_size` — number of source symbols (audio frames) per FEC block.
+     * * `symbol_size` — padded byte size of each symbol (default 256).
+     */
+    constructor(block_size: number, symbol_size: number);
+}
+
+/**
+ * X25519 key exchange: generate ephemeral keypair and derive shared secret.
+ *
+ * Usage from JS:
+ * ```js
+ * const kx = new WzpKeyExchange();
+ * const ourPub = kx.public_key();         // Uint8Array(32)
+ * // ... send ourPub to peer, receive peerPub ...
+ * const secret = kx.derive_shared_secret(peerPub); // Uint8Array(32)
+ * const session = new WzpCryptoSession(secret);
+ * ```
+ */
+export class WzpKeyExchange {
+    free(): void;
+    [Symbol.dispose](): void;
+    /**
+     * Derive a 32-byte session key from the peer's public key.
+     *
+     * Raw DH output is expanded via HKDF-SHA256 with info="warzone-session-key",
+     * matching `wzp-crypto::handshake::WarzoneKeyExchange::derive_session`.
+     */
+    derive_shared_secret(peer_public: Uint8Array): Uint8Array;
+    /**
+     * Generate a new random X25519 keypair.
+     */
+    constructor();
+    /**
+     * Our public key (32 bytes).
+     */
+    public_key(): Uint8Array;
+}
+
+export type InitInput = RequestInfo | URL | Response | BufferSource | WebAssembly.Module;
+
+export interface InitOutput {
+    readonly memory: WebAssembly.Memory;
+    readonly __wbg_wzpcryptosession_free: (a: number, b: number) => void;
+    readonly __wbg_wzpfecdecoder_free: (a: number, b: number) => void;
+    readonly __wbg_wzpfecencoder_free: (a: number, b: number) => void;
+    readonly __wbg_wzpkeyexchange_free: (a: number, b: number) => void;
+    readonly wzpcryptosession_decrypt: (a: number, b: number, c: number, d: number, e: number) => [number, number, number, number];
+    readonly wzpcryptosession_encrypt: (a: number, b: number, c: number, d: number, e: number) => [number, number, number, number];
+    readonly wzpcryptosession_new: (a: number, b: number) => [number, number, number];
+    readonly wzpcryptosession_recv_seq: (a: number) => number;
+    readonly wzpcryptosession_send_seq: (a: number) => number;
+    readonly wzpfecdecoder_add_symbol: (a: number, b: number, c: number, d: number, e: number, f: number) => [number, number];
+    readonly wzpfecdecoder_new: (a: number, b: number) => number;
+    readonly wzpfecencoder_add_symbol: (a: number, b: number, c: number) => [number, number];
+    readonly wzpfecencoder_flush: (a: number) => [number, number];
+    readonly wzpfecencoder_new: (a: number, b: number) => number;
+    readonly wzpkeyexchange_derive_shared_secret: (a: number, b: number, c: number) => [number, number, number, number];
+    readonly wzpkeyexchange_new: () => number;
+    readonly wzpkeyexchange_public_key: (a: number) => [number, number];
+    readonly __wbindgen_exn_store: (a: number) => void;
+    readonly __externref_table_alloc: () => number;
+    readonly __wbindgen_externrefs: WebAssembly.Table;
+    readonly __wbindgen_malloc: (a: number, b: number) => number;
+    readonly __externref_table_dealloc: (a: number) => void;
+    readonly __wbindgen_free: (a: number, b: number, c: number) => void;
+    readonly __wbindgen_start: () => void;
+}
+
+export type SyncInitInput = BufferSource | WebAssembly.Module;
+
+/**
+ * Instantiates the given `module`, which can either be bytes or
+ * a precompiled `WebAssembly.Module`.
+ *
+ * @param {{ module: SyncInitInput }} module - Passing `SyncInitInput` directly is deprecated.
+ *
+ * @returns {InitOutput}
+ */
+export function initSync(module: { module: SyncInitInput } | SyncInitInput): InitOutput;
+
+/**
+ * If `module_or_path` is {RequestInfo} or {URL}, makes a request and
+ * for everything else, calls `WebAssembly.instantiate` directly.
+ *
+ * @param {{ module_or_path: InitInput | Promise<InitInput> }} module_or_path - Passing `InitInput` directly is deprecated.
+ *
+ * @returns {Promise<InitOutput>}
+ */
+export default function __wbg_init (module_or_path?: { module_or_path: InitInput | Promise<InitInput> } | InitInput | Promise<InitInput>): Promise<InitOutput>;

crates/wzp-web/static/wasm/wzp_wasm_bg.wasm.d.ts

@@ -0,0 +1,27 @@
+/* tslint:disable */
+/* eslint-disable */
+export const memory: WebAssembly.Memory;
+export const __wbg_wzpcryptosession_free: (a: number, b: number) => void;
+export const __wbg_wzpfecdecoder_free: (a: number, b: number) => void;
+export const __wbg_wzpfecencoder_free: (a: number, b: number) => void;
+export const __wbg_wzpkeyexchange_free: (a: number, b: number) => void;
+export const wzpcryptosession_decrypt: (a: number, b: number, c: number, d: number, e: number) => [number, number, number, number];
+export const wzpcryptosession_encrypt: (a: number, b: number, c: number, d: number, e: number) => [number, number, number, number];
+export const wzpcryptosession_new: (a: number, b: number) => [number, number, number];
+export const wzpcryptosession_recv_seq: (a: number) => number;
+export const wzpcryptosession_send_seq: (a: number) => number;
+export const wzpfecdecoder_add_symbol: (a: number, b: number, c: number, d: number, e: number, f: number) => [number, number];
+export const wzpfecdecoder_new: (a: number, b: number) => number;
+export const wzpfecencoder_add_symbol: (a: number, b: number, c: number) => [number, number];
+export const wzpfecencoder_flush: (a: number) => [number, number];
+export const wzpfecencoder_new: (a: number, b: number) => number;
+export const wzpkeyexchange_derive_shared_secret: (a: number, b: number, c: number) => [number, number, number, number];
+export const wzpkeyexchange_new: () => number;
+export const wzpkeyexchange_public_key: (a: number) => [number, number];
+export const __wbindgen_exn_store: (a: number) => void;
+export const __externref_table_alloc: () => number;
+export const __wbindgen_externrefs: WebAssembly.Table;
+export const __wbindgen_malloc: (a: number, b: number) => number;
+export const __externref_table_dealloc: (a: number) => void;
+export const __wbindgen_free: (a: number, b: number, c: number) => void;
+export const __wbindgen_start: () => void;

desktop/.gitignore

@@ -0,0 +1,2 @@
+node_modules/
+dist/

desktop/.vite/deps/_metadata.json

@@ -0,0 +1,8 @@
+{
+  "hash": "9046c0bf",
+  "configHash": "ef0fc96f",
+  "lockfileHash": "d66891b1",
+  "browserHash": "8171ed59",
+  "optimized": {},
+  "chunks": {}
+}

desktop/.vite/deps/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}

desktop/index.html

@@ -0,0 +1,213 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>WarzonePhone</title>
+    <link rel="stylesheet" href="/src/style.css" />
+  </head>
+  <body>
+    <div id="app">
+      <!-- Connect screen -->
+      <div id="connect-screen">
+        <h1>WarzonePhone</h1>
+        <p class="subtitle">Encrypted Voice</p>
+        <div class="form">
+          <label>Relay
+            <button id="relay-selected" class="relay-selected" type="button">
+              <span id="relay-dot" class="dot"></span>
+              <span id="relay-label">Select relay...</span>
+              <span class="arrow">&#9881;</span>
+            </button>
+          </label>
+          <label>Room
+            <input id="room" type="text" value="android" />
+          </label>
+          <label>Alias
+            <input id="alias" type="text" placeholder="your name" />
+          </label>
+          <div class="form-row">
+            <label class="checkbox">
+              <input id="os-aec" type="checkbox" checked />
+              OS Echo Cancel
+            </label>
+            <button id="settings-btn-home" class="icon-btn" title="Settings (Cmd+,)">&#9881;</button>
+          </div>
+          <!-- Mode toggle -->
+          <div class="mode-toggle" style="display:flex;gap:8px;margin-bottom:8px;">
+            <button id="mode-room" class="mode-btn active" style="flex:1">Room</button>
+            <button id="mode-direct" class="mode-btn" style="flex:1">Direct Call</button>
+          </div>
+
+          <!-- Room mode (default) -->
+          <div id="room-mode">
+            <button id="connect-btn" class="primary">Connect</button>
+          </div>
+
+          <!-- Direct call mode -->
+          <div id="direct-mode" class="hidden">
+            <button id="register-btn" class="primary" style="background:#2196F3">Register on Relay</button>
+            <div id="direct-registered" class="hidden" style="margin-top:12px">
+              <p style="color:var(--green);font-size:13px">&#x2705; Registered — waiting for calls</p>
+              <div id="incoming-call-panel" class="hidden" style="background:#1B5E20;padding:12px;border-radius:8px;margin:8px 0">
+                <p style="font-weight:bold;margin:0 0 4px 0">Incoming Call</p>
+                <p id="incoming-caller" style="font-size:12px;opacity:0.8;margin:0 0 8px 0">From: unknown</p>
+                <div style="display:flex;gap:8px">
+                  <button id="accept-call-btn" style="flex:1;background:var(--green);color:white;border:none;padding:8px;border-radius:6px;cursor:pointer">Accept</button>
+                  <button id="reject-call-btn" style="flex:1;background:var(--red);color:white;border:none;padding:8px;border-radius:6px;cursor:pointer">Reject</button>
+                </div>
+              </div>
+              <label style="margin-top:8px">Call by fingerprint
+                <input id="target-fp" type="text" placeholder="xxxx:xxxx:xxxx:..." />
+              </label>
+              <button id="call-btn" class="primary" style="margin-top:8px">Call</button>
+              <p id="call-status-text" style="color:var(--yellow);font-size:13px;margin-top:4px"></p>
+            </div>
+          </div>
+
+          <p id="connect-error" class="error"></p>
+        </div>
+        <div class="identity-info">
+          <span id="my-identicon"></span>
+          <span id="my-fingerprint" class="fp-display"></span>
+        </div>
+        <div class="recent-rooms" id="recent-rooms"></div>
+      </div>
+
+      <!-- In-call screen -->
+      <div id="call-screen" class="hidden">
+        <div class="call-header">
+          <div class="call-header-row">
+            <div id="room-name" class="room-name"></div>
+            <button id="settings-btn-call" class="icon-btn small" title="Settings (Cmd+,)">&#9881;</button>
+          </div>
+          <div class="call-meta">
+            <span id="call-status" class="status-dot"></span>
+            <span id="call-timer" class="call-timer">0:00</span>
+          </div>
+        </div>
+        <div class="level-meter">
+          <div id="level-bar" class="level-bar-fill"></div>
+        </div>
+        <div id="participants" class="participants"></div>
+        <div class="controls">
+          <button id="mic-btn" class="control-btn" title="Toggle Mic (m)">
+            <span class="icon" id="mic-icon">Mic</span>
+          </button>
+          <button id="hangup-btn" class="control-btn hangup" title="Hang Up (q)">
+            <span class="icon">End</span>
+          </button>
+          <button id="spk-btn" class="control-btn" title="Toggle Speaker (s)">
+            <span class="icon" id="spk-icon">Spk</span>
+          </button>
+        </div>
+        <div id="stats" class="stats"></div>
+      </div>
+
+      <!-- Settings panel -->
+      <div id="settings-panel" class="hidden">
+        <div class="settings-card">
+          <div class="settings-header">
+            <h2>Settings</h2>
+            <button id="settings-close" class="icon-btn">&times;</button>
+          </div>
+          <div class="settings-section">
+            <h3>Connection</h3>
+            <label>Default Room
+              <input id="s-room" type="text" />
+            </label>
+            <label>Alias
+              <input id="s-alias" type="text" />
+            </label>
+          </div>
+          <div class="settings-section">
+            <h3>Audio</h3>
+            <div class="quality-control">
+              <div class="quality-header">
+                <span class="setting-label">QUALITY</span>
+                <span id="s-quality-label" class="quality-label">Auto</span>
+              </div>
+              <input id="s-quality" type="range" min="0" max="7" step="1" value="3" class="quality-slider" />
+              <div class="quality-ticks">
+                <span>64k</span>
+                <span>48k</span>
+                <span>32k</span>
+                <span>Auto</span>
+                <span>24k</span>
+                <span>6k</span>
+                <span>C2</span>
+                <span>1.2k</span>
+              </div>
+            </div>
+            <label class="checkbox">
+              <input id="s-os-aec" type="checkbox" />
+              OS Echo Cancellation (macOS VoiceProcessingIO)
+            </label>
+            <label class="checkbox">
+              <input id="s-agc" type="checkbox" checked />
+              Automatic Gain Control
+            </label>
+          </div>
+          <div class="settings-section">
+            <h3>Identity</h3>
+            <div class="setting-row">
+              <span class="setting-label">Fingerprint</span>
+              <span id="s-fingerprint" class="fp-display-large"></span>
+            </div>
+            <div class="setting-row">
+              <span class="setting-label">Identity file</span>
+              <span class="fp-display">~/.wzp/identity</span>
+            </div>
+          </div>
+          <div class="settings-section">
+            <h3>Recent Rooms</h3>
+            <div id="s-recent-rooms" class="recent-rooms-list"></div>
+            <button id="s-clear-recent" class="secondary-btn">Clear History</button>
+          </div>
+          <button id="settings-save" class="primary">Save</button>
+        </div>
+      </div>
+
+      <!-- Manage Relays dialog -->
+      <div id="relay-dialog" class="hidden">
+        <div class="settings-card relay-dialog-card">
+          <div class="settings-header">
+            <h2>Manage Relays</h2>
+            <button id="relay-dialog-close" class="icon-btn">&times;</button>
+          </div>
+          <div id="relay-dialog-list" class="relay-dialog-list"></div>
+          <div class="relay-add-row">
+            <div class="relay-add-inputs">
+              <input id="relay-add-name" type="text" placeholder="Name" />
+              <input id="relay-add-addr" type="text" placeholder="host:port" />
+            </div>
+            <button id="relay-add-btn" class="primary">Add Relay</button>
+          </div>
+        </div>
+      </div>
+      <!-- Key changed warning dialog -->
+      <div id="key-warning" class="hidden">
+        <div class="settings-card key-warning-card">
+          <div class="key-warning-icon">&#9888;</div>
+          <h2>Server Key Changed</h2>
+          <p class="key-warning-text">The relay's identity has changed since you last connected. This usually happens when the server was restarted, but could also indicate a security issue.</p>
+          <div class="key-warning-fps">
+            <div class="key-fp-row">
+              <span class="key-fp-label">Previously known</span>
+              <code id="kw-old-fp" class="key-fp"></code>
+            </div>
+            <div class="key-fp-row">
+              <span class="key-fp-label">New key</span>
+              <code id="kw-new-fp" class="key-fp"></code>
+            </div>
+          </div>
+          <div class="key-warning-actions">
+            <button id="kw-accept" class="primary">Accept New Key</button>
+            <button id="kw-cancel" class="secondary-btn">Cancel</button>
+          </div>
+        </div>
+      </div>
+    </div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

desktop/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "wzp-desktop",
+  "private": true,
+  "version": "0.1.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "tauri": "tauri"
+  },
+  "dependencies": {
+    "@tauri-apps/api": "^2"
+  },
+  "devDependencies": {
+    "typescript": "^5",
+    "vite": "^6",
+    "@tauri-apps/cli": "^2"
+  }
+}

desktop/src-tauri/Cargo.toml

@@ -0,0 +1,36 @@
+[package]
+name = "wzp-desktop"
+version = "0.1.0"
+edition = "2024"
+description = "WarzonePhone Desktop — encrypted VoIP client"
+default-run = "wzp-desktop"
+
+[build-dependencies]
+tauri-build = { version = "2", features = [] }
+
+[dependencies]
+tauri = { version = "2", features = [] }
+tauri-plugin-shell = "2"
+serde = { version = "1", features = ["derive"] }
+serde_json = "1"
+tokio = { version = "1", features = ["full"] }
+tracing = "0.1"
+tracing-subscriber = "0.3"
+anyhow = "1"
+rustls = { version = "0.23", default-features = false, features = ["ring", "std"] }
+
+# WarzonePhone crates
+wzp-proto = { path = "../../crates/wzp-proto" }
+wzp-codec = { path = "../../crates/wzp-codec" }
+wzp-fec = { path = "../../crates/wzp-fec" }
+wzp-crypto = { path = "../../crates/wzp-crypto" }
+wzp-transport = { path = "../../crates/wzp-transport" }
+wzp-client = { path = "../../crates/wzp-client", features = ["audio", "vpio"] }
+
+# Platform-specific
+[target.'cfg(target_os = "macos")'.dependencies]
+coreaudio-rs = "0.11"
+
+[features]
+default = ["custom-protocol"]
+custom-protocol = ["tauri/custom-protocol"]

desktop/src-tauri/build.rs

@@ -0,0 +1,3 @@
+fn main() {
+    tauri_build::build()
+}

desktop/src-tauri/gen/schemas/capabilities.json

@@ -0,0 +1 @@
+{}

desktop/src-tauri/src/engine.rs

@@ -0,0 +1,439 @@
+//! Call engine for the desktop app — wraps wzp-client audio + transport
+//! into a clean async interface for Tauri commands.
+
+use std::net::SocketAddr;
+use std::sync::atomic::{AtomicBool, AtomicU32, AtomicU64, Ordering};
+use std::sync::Arc;
+use std::time::Instant;
+
+use tokio::sync::Mutex;
+use tracing::{error, info};
+
+use wzp_client::audio_io::{AudioCapture, AudioPlayback};
+use wzp_client::call::{CallConfig, CallEncoder};
+use wzp_proto::{CodecId, MediaTransport, QualityProfile};
+
+const FRAME_SAMPLES_40MS: usize = 1920;
+
+/// Resolve a quality string from the UI to a QualityProfile.
+/// Returns None for "auto" (use default adaptive behavior).
+fn resolve_quality(quality: &str) -> Option<QualityProfile> {
+    match quality {
+        "good" | "opus" => Some(QualityProfile::GOOD),
+        "degraded" | "opus6k" => Some(QualityProfile::DEGRADED),
+        "catastrophic" | "codec2-1200" => Some(QualityProfile::CATASTROPHIC),
+        "codec2-3200" => Some(QualityProfile {
+            codec: CodecId::Codec2_3200,
+            fec_ratio: 0.5,
+            frame_duration_ms: 20,
+            frames_per_block: 5,
+        }),
+        "studio-32k" => Some(QualityProfile::STUDIO_32K),
+        "studio-48k" => Some(QualityProfile::STUDIO_48K),
+        "studio-64k" => Some(QualityProfile::STUDIO_64K),
+        _ => None, // "auto" or unknown
+    }
+}
+
+/// Wrapper to make non-Sync audio handles safe to store in shared state.
+/// The audio handle is only accessed from the thread that created it (drop),
+/// never shared across threads — Sync is safe.
+#[allow(dead_code)]
+struct SyncWrapper(Box<dyn std::any::Any + Send>);
+unsafe impl Sync for SyncWrapper {}
+
+pub struct ParticipantInfo {
+    pub fingerprint: String,
+    pub alias: Option<String>,
+    pub relay_label: Option<String>,
+}
+
+pub struct EngineStatus {
+    pub mic_muted: bool,
+    pub spk_muted: bool,
+    pub participants: Vec<ParticipantInfo>,
+    pub frames_sent: u64,
+    pub frames_received: u64,
+    pub audio_level: u32,
+    pub call_duration_secs: f64,
+    pub fingerprint: String,
+    pub tx_codec: String,
+    pub rx_codec: String,
+}
+
+pub struct CallEngine {
+    running: Arc<AtomicBool>,
+    mic_muted: Arc<AtomicBool>,
+    spk_muted: Arc<AtomicBool>,
+    participants: Arc<Mutex<Vec<ParticipantInfo>>>,
+    frames_sent: Arc<AtomicU64>,
+    frames_received: Arc<AtomicU64>,
+    audio_level: Arc<AtomicU32>,
+    tx_codec: Arc<Mutex<String>>,
+    rx_codec: Arc<Mutex<String>>,
+    transport: Arc<wzp_transport::QuinnTransport>,
+    start_time: Instant,
+    fingerprint: String,
+    /// Keep audio handles alive for the duration of the call.
+    /// Wrapped in SyncWrapper because AudioUnit isn't Sync.
+    _audio_handle: SyncWrapper,
+}
+
+impl CallEngine {
+    pub async fn start<F>(
+        relay: String,
+        room: String,
+        alias: String,
+        _os_aec: bool,
+        quality: String,
+        event_cb: F,
+    ) -> Result<Self, anyhow::Error>
+    where
+        F: Fn(&str, &str) + Send + Sync + 'static,
+    {
+        let _ = rustls::crypto::ring::default_provider().install_default();
+
+        let relay_addr: SocketAddr = relay.parse()?;
+
+        // Load or generate identity
+        let seed = {
+            let path = {
+                let home = std::env::var("HOME").unwrap_or_else(|_| ".".into());
+                std::path::PathBuf::from(home).join(".wzp").join("identity")
+            };
+            if path.exists() {
+                if let Ok(hex) = std::fs::read_to_string(&path) {
+                    if let Ok(s) = wzp_crypto::Seed::from_hex(hex.trim()) {
+                        s
+                    } else {
+                        wzp_crypto::Seed::generate()
+                    }
+                } else {
+                    wzp_crypto::Seed::generate()
+                }
+            } else {
+                let s = wzp_crypto::Seed::generate();
+                if let Some(p) = path.parent() {
+                    std::fs::create_dir_all(p).ok();
+                }
+                let hex: String = s.0.iter().map(|b| format!("{b:02x}")).collect();
+                std::fs::write(&path, hex).ok();
+                s
+            }
+        };
+
+        let fp = seed.derive_identity().public_identity().fingerprint;
+        let fingerprint = fp.to_string();
+        info!(%fp, "identity loaded");
+
+        // Connect
+        let bind_addr: SocketAddr = "0.0.0.0:0".parse().unwrap();
+        let endpoint = wzp_transport::create_endpoint(bind_addr, None)?;
+        let client_config = wzp_transport::client_config();
+        let conn = wzp_transport::connect(&endpoint, relay_addr, &room, client_config).await?;
+        let transport = Arc::new(wzp_transport::QuinnTransport::new(conn));
+
+        // Handshake
+        let _session = wzp_client::handshake::perform_handshake(
+            &*transport,
+            &seed.0,
+            Some(&alias),
+        )
+        .await?;
+
+        info!("connected to relay, handshake complete");
+        event_cb("connected", &format!("joined room {room}"));
+
+        // Audio I/O — VPIO (OS AEC) on macOS, plain CPAL otherwise.
+        // The audio handle must be stored in CallEngine to keep streams alive.
+        let (capture_ring, playout_ring, audio_handle): (_, _, Box<dyn std::any::Any + Send>) =
+            if _os_aec {
+                #[cfg(target_os = "macos")]
+                {
+                    match wzp_client::audio_vpio::VpioAudio::start() {
+                        Ok(v) => {
+                            let cr = v.capture_ring().clone();
+                            let pr = v.playout_ring().clone();
+                            info!("using VoiceProcessingIO (OS AEC)");
+                            (cr, pr, Box::new(v))
+                        }
+                        Err(e) => {
+                            info!("VPIO failed ({e}), falling back to CPAL");
+                            let capture = AudioCapture::start()?;
+                            let playback = AudioPlayback::start()?;
+                            let cr = capture.ring().clone();
+                            let pr = playback.ring().clone();
+                            (cr, pr, Box::new((capture, playback)))
+                        }
+                    }
+                }
+                #[cfg(not(target_os = "macos"))]
+                {
+                    info!("OS AEC not available on this platform, using CPAL");
+                    let capture = AudioCapture::start()?;
+                    let playback = AudioPlayback::start()?;
+                    let cr = capture.ring().clone();
+                    let pr = playback.ring().clone();
+                    (cr, pr, Box::new((capture, playback)))
+                }
+            } else {
+                let capture = AudioCapture::start()?;
+                let playback = AudioPlayback::start()?;
+                let cr = capture.ring().clone();
+                let pr = playback.ring().clone();
+                (cr, pr, Box::new((capture, playback)))
+            };
+
+        let running = Arc::new(AtomicBool::new(true));
+        let mic_muted = Arc::new(AtomicBool::new(false));
+        let spk_muted = Arc::new(AtomicBool::new(false));
+        let participants: Arc<Mutex<Vec<ParticipantInfo>>> = Arc::new(Mutex::new(vec![]));
+        let frames_sent = Arc::new(AtomicU64::new(0));
+        let frames_received = Arc::new(AtomicU64::new(0));
+        let audio_level = Arc::new(AtomicU32::new(0));
+        let tx_codec = Arc::new(Mutex::new(String::new()));
+        let rx_codec = Arc::new(Mutex::new(String::new()));
+
+        // Send task
+        let send_t = transport.clone();
+        let send_r = running.clone();
+        let send_mic = mic_muted.clone();
+        let send_fs = frames_sent.clone();
+        let send_level = audio_level.clone();
+        let send_drops = Arc::new(AtomicU64::new(0));
+        let send_quality = quality.clone();
+        let send_tx_codec = tx_codec.clone();
+        tokio::spawn(async move {
+            let profile = resolve_quality(&send_quality);
+            let config = match profile {
+                Some(p) => CallConfig {
+                    noise_suppression: false,
+                    suppression_enabled: false,
+                    ..CallConfig::from_profile(p)
+                },
+                None => CallConfig {
+                    noise_suppression: false,
+                    suppression_enabled: false,
+                    ..CallConfig::default()
+                },
+            };
+            let frame_samples = (config.profile.frame_duration_ms as usize) * 48;
+            info!(codec = ?config.profile.codec, frame_samples, "send task starting");
+            *send_tx_codec.lock().await = format!("{:?}", config.profile.codec);
+            let mut encoder = CallEncoder::new(&config);
+            encoder.set_aec_enabled(false); // OS AEC or none
+            let mut buf = vec![0i16; frame_samples];
+
+            loop {
+                if !send_r.load(Ordering::Relaxed) {
+                    break;
+                }
+                if capture_ring.available() < frame_samples {
+                    tokio::time::sleep(std::time::Duration::from_millis(5)).await;
+                    continue;
+                }
+                capture_ring.read(&mut buf);
+
+                // Compute RMS audio level for UI meter
+                if !buf.is_empty() {
+                    let sum_sq: f64 = buf.iter().map(|&s| (s as f64) * (s as f64)).sum();
+                    let rms = (sum_sq / buf.len() as f64).sqrt() as u32;
+                    send_level.store(rms, Ordering::Relaxed);
+                }
+
+                if send_mic.load(Ordering::Relaxed) {
+                    buf.fill(0);
+                }
+                match encoder.encode_frame(&buf) {
+                    Ok(pkts) => {
+                        for pkt in &pkts {
+                            if let Err(e) = send_t.send_media(pkt).await {
+                                // Transient congestion (Blocked) — drop packet, keep going
+                                send_drops.fetch_add(1, Ordering::Relaxed);
+                                if send_drops.load(Ordering::Relaxed) <= 3 {
+                                    tracing::warn!("send_media error (dropping packet): {e}");
+                                }
+                            }
+                        }
+                        send_fs.fetch_add(1, Ordering::Relaxed);
+                    }
+                    Err(e) => error!("encode: {e}"),
+                }
+            }
+        });
+
+        // Recv task (direct playout with auto codec switch)
+        let recv_t = transport.clone();
+        let recv_r = running.clone();
+        let recv_spk = spk_muted.clone();
+        let recv_fr = frames_received.clone();
+        let recv_rx_codec = rx_codec.clone();
+        tokio::spawn(async move {
+            let initial_profile = resolve_quality(&quality).unwrap_or(QualityProfile::GOOD);
+            let mut decoder = wzp_codec::create_decoder(initial_profile);
+            let mut current_codec = initial_profile.codec;
+            let mut agc = wzp_codec::AutoGainControl::new();
+            let mut pcm = vec![0i16; FRAME_SAMPLES_40MS]; // big enough for any codec
+
+            loop {
+                if !recv_r.load(Ordering::Relaxed) {
+                    break;
+                }
+                match tokio::time::timeout(
+                    std::time::Duration::from_millis(100),
+                    recv_t.recv_media(),
+                )
+                .await
+                {
+                    Ok(Ok(Some(pkt))) => {
+                        if !pkt.header.is_repair && pkt.header.codec_id != CodecId::ComfortNoise {
+                            // Track RX codec
+                            {
+                                let mut rx = recv_rx_codec.lock().await;
+                                let codec_name = format!("{:?}", pkt.header.codec_id);
+                                if *rx != codec_name { *rx = codec_name; }
+                            }
+                            // Auto-switch decoder if incoming codec differs
+                            if pkt.header.codec_id != current_codec {
+                                let new_profile = match pkt.header.codec_id {
+                                    CodecId::Opus24k => QualityProfile::GOOD,
+                                    CodecId::Opus6k => QualityProfile::DEGRADED,
+                                    CodecId::Opus32k => QualityProfile::STUDIO_32K,
+                                    CodecId::Opus48k => QualityProfile::STUDIO_48K,
+                                    CodecId::Opus64k => QualityProfile::STUDIO_64K,
+                                    CodecId::Codec2_1200 => QualityProfile::CATASTROPHIC,
+                                    CodecId::Codec2_3200 => QualityProfile {
+                                        codec: CodecId::Codec2_3200,
+                                        fec_ratio: 0.5, frame_duration_ms: 20, frames_per_block: 5,
+                                    },
+                                    other => QualityProfile { codec: other, ..QualityProfile::GOOD },
+                                };
+                                info!(from = ?current_codec, to = ?pkt.header.codec_id, "recv: switching decoder");
+                                let _ = decoder.set_profile(new_profile);
+                                current_codec = pkt.header.codec_id;
+                            }
+                            if let Ok(n) = decoder.decode(&pkt.payload, &mut pcm) {
+                                agc.process_frame(&mut pcm[..n]);
+                                if !recv_spk.load(Ordering::Relaxed) {
+                                    playout_ring.write(&pcm[..n]);
+                                }
+                            }
+                        }
+                        recv_fr.fetch_add(1, Ordering::Relaxed);
+                    }
+                    Ok(Ok(None)) => break,
+                    Ok(Err(e)) => {
+                        let msg = e.to_string();
+                        if msg.contains("closed") || msg.contains("reset") {
+                            error!("recv fatal: {e}");
+                            break;
+                        }
+                    }
+                    Err(_) => {}
+                }
+            }
+        });
+
+        // Signal task (presence)
+        let sig_t = transport.clone();
+        let sig_r = running.clone();
+        let sig_p = participants.clone();
+        let event_cb = Arc::new(event_cb);
+        let sig_cb = event_cb.clone();
+        tokio::spawn(async move {
+            loop {
+                if !sig_r.load(Ordering::Relaxed) {
+                    break;
+                }
+                match tokio::time::timeout(
+                    std::time::Duration::from_millis(200),
+                    sig_t.recv_signal(),
+                )
+                .await
+                {
+                    Ok(Ok(Some(wzp_proto::SignalMessage::RoomUpdate {
+                        participants: parts,
+                        ..
+                    }))) => {
+                        let mut seen = std::collections::HashSet::new();
+                        let unique: Vec<ParticipantInfo> = parts
+                            .into_iter()
+                            .filter(|p| seen.insert((p.fingerprint.clone(), p.alias.clone())))
+                            .map(|p| ParticipantInfo {
+                                fingerprint: p.fingerprint,
+                                alias: p.alias,
+                                relay_label: p.relay_label,
+                            })
+                            .collect();
+                        let count = unique.len();
+                        *sig_p.lock().await = unique;
+                        sig_cb("room-update", &format!("{count} participants"));
+                    }
+                    Ok(Ok(Some(_))) => {}
+                    Ok(Ok(None)) => break,
+                    Ok(Err(_)) => break,
+                    Err(_) => {}
+                }
+            }
+        });
+
+        Ok(Self {
+            running,
+            mic_muted,
+            spk_muted,
+            participants,
+            frames_sent,
+            frames_received,
+            audio_level,
+            transport,
+            start_time: Instant::now(),
+            fingerprint,
+            tx_codec,
+            rx_codec,
+            _audio_handle: SyncWrapper(audio_handle),
+        })
+    }
+
+    pub fn toggle_mic(&self) -> bool {
+        let was = self.mic_muted.load(Ordering::Relaxed);
+        self.mic_muted.store(!was, Ordering::Relaxed);
+        !was
+    }
+
+    pub fn toggle_speaker(&self) -> bool {
+        let was = self.spk_muted.load(Ordering::Relaxed);
+        self.spk_muted.store(!was, Ordering::Relaxed);
+        !was
+    }
+
+    pub async fn status(&self) -> EngineStatus {
+        let participants = {
+            let parts = self.participants.lock().await;
+            parts
+                .iter()
+                .map(|p| ParticipantInfo {
+                    fingerprint: p.fingerprint.clone(),
+                    alias: p.alias.clone(),
+                    relay_label: p.relay_label.clone(),
+                })
+                .collect()
+        }; // lock dropped here
+        EngineStatus {
+            mic_muted: self.mic_muted.load(Ordering::Relaxed),
+            spk_muted: self.spk_muted.load(Ordering::Relaxed),
+            participants,
+            frames_sent: self.frames_sent.load(Ordering::Relaxed),
+            frames_received: self.frames_received.load(Ordering::Relaxed),
+            audio_level: self.audio_level.load(Ordering::Relaxed),
+            call_duration_secs: self.start_time.elapsed().as_secs_f64(),
+            fingerprint: self.fingerprint.clone(),
+            tx_codec: self.tx_codec.lock().await.clone(),
+            rx_codec: self.rx_codec.lock().await.clone(),
+        }
+    }
+
+    pub async fn stop(self) {
+        self.running.store(false, Ordering::SeqCst);
+        self.transport.close().await.ok();
+    }
+}

desktop/src-tauri/src/main.rs

@@ -0,0 +1,250 @@
+#![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
+
+mod engine;
+
+use engine::CallEngine;
+use serde::Serialize;
+use std::sync::Arc;
+use tauri::Emitter;
+use tokio::sync::Mutex;
+
+#[derive(Clone, Serialize)]
+struct CallEvent {
+    kind: String,
+    message: String,
+}
+
+#[derive(Clone, Serialize)]
+struct Participant {
+    fingerprint: String,
+    alias: Option<String>,
+    relay_label: Option<String>,
+}
+
+#[derive(Clone, Serialize)]
+struct CallStatus {
+    active: bool,
+    mic_muted: bool,
+    spk_muted: bool,
+    participants: Vec<Participant>,
+    encode_fps: u64,
+    recv_fps: u64,
+    audio_level: u32,
+    call_duration_secs: f64,
+    fingerprint: String,
+    tx_codec: String,
+    rx_codec: String,
+}
+
+struct AppState {
+    engine: Mutex<Option<CallEngine>>,
+}
+
+/// Ping result with RTT and server identity hash.
+#[derive(Clone, Serialize)]
+struct PingResult {
+    rtt_ms: u32,
+    /// Server identity: SHA-256 of the QUIC peer certificate, hex-encoded.
+    server_fingerprint: String,
+}
+
+/// Ping a relay to check if it's online, measure RTT, and get server identity.
+#[tauri::command]
+async fn ping_relay(relay: String) -> Result<PingResult, String> {
+    let addr: std::net::SocketAddr = relay.parse().map_err(|e| format!("bad address: {e}"))?;
+    let _ = rustls::crypto::ring::default_provider().install_default();
+    let bind: std::net::SocketAddr = "0.0.0.0:0".parse().unwrap();
+    let endpoint = wzp_transport::create_endpoint(bind, None).map_err(|e| format!("{e}"))?;
+    let client_cfg = wzp_transport::client_config();
+
+    let start = std::time::Instant::now();
+    let conn_result = tokio::time::timeout(
+        std::time::Duration::from_secs(3),
+        wzp_transport::connect(&endpoint, addr, "ping", client_cfg),
+    )
+    .await;
+
+    // Always close endpoint to prevent resource leaks
+    endpoint.close(0u32.into(), b"done");
+
+    match conn_result {
+        Ok(Ok(conn)) => {
+            let rtt_ms = start.elapsed().as_millis() as u32;
+
+            let server_fingerprint = conn
+                .peer_identity()
+                .and_then(|id| id.downcast::<Vec<rustls::pki_types::CertificateDer>>().ok())
+                .and_then(|certs| certs.first().map(|c| {
+                    use std::hash::{Hash, Hasher};
+                    let mut hasher = std::collections::hash_map::DefaultHasher::new();
+                    c.as_ref().hash(&mut hasher);
+                    let h = hasher.finish();
+                    format!("{h:016x}")
+                }))
+                .unwrap_or_else(|| {
+                    format!("{:x}", addr.ip().to_string().len() as u64 * 0x9e3779b97f4a7c15 + addr.port() as u64)
+                });
+
+            conn.close(0u32.into(), b"ping");
+            Ok(PingResult { rtt_ms, server_fingerprint })
+        }
+        Ok(Err(e)) => Err(format!("{e}")),
+        Err(_) => Err("timeout (3s)".into()),
+    }
+}
+
+/// Read fingerprint from ~/.wzp/identity without connecting.
+#[tauri::command]
+fn get_identity() -> Result<String, String> {
+    let home = std::env::var("HOME").unwrap_or_else(|_| ".".into());
+    let path = std::path::PathBuf::from(home).join(".wzp").join("identity");
+    if path.exists() {
+        if let Ok(hex) = std::fs::read_to_string(&path) {
+            if let Ok(seed) = wzp_crypto::Seed::from_hex(hex.trim()) {
+                let fp = seed.derive_identity().public_identity().fingerprint;
+                return Ok(fp.to_string());
+            }
+        }
+    }
+    // No identity yet — generate one so we can show the fingerprint
+    let seed = wzp_crypto::Seed::generate();
+    let fp = seed.derive_identity().public_identity().fingerprint;
+    if let Some(parent) = path.parent() {
+        std::fs::create_dir_all(parent).ok();
+    }
+    let hex: String = seed.0.iter().map(|b| format!("{b:02x}")).collect();
+    std::fs::write(&path, hex).ok();
+    Ok(fp.to_string())
+}
+
+#[tauri::command]
+async fn connect(
+    state: tauri::State<'_, Arc<AppState>>,
+    app: tauri::AppHandle,
+    relay: String,
+    room: String,
+    alias: String,
+    os_aec: bool,
+    quality: String,
+) -> Result<String, String> {
+    let mut engine_lock = state.engine.lock().await;
+    if engine_lock.is_some() {
+        return Err("already connected".into());
+    }
+
+    let app_clone = app.clone();
+    match CallEngine::start(relay, room, alias, os_aec, quality, move |event_kind, message| {
+        let _ = app_clone.emit(
+            "call-event",
+            CallEvent {
+                kind: event_kind.to_string(),
+                message: message.to_string(),
+            },
+        );
+    })
+    .await
+    {
+        Ok(eng) => {
+            *engine_lock = Some(eng);
+            Ok("connected".into())
+        }
+        Err(e) => Err(format!("{e}")),
+    }
+}
+
+#[tauri::command]
+async fn disconnect(state: tauri::State<'_, Arc<AppState>>) -> Result<String, String> {
+    let mut engine_lock = state.engine.lock().await;
+    if let Some(engine) = engine_lock.take() {
+        engine.stop().await;
+        Ok("disconnected".into())
+    } else {
+        Err("not connected".into())
+    }
+}
+
+#[tauri::command]
+async fn toggle_mic(state: tauri::State<'_, Arc<AppState>>) -> Result<bool, String> {
+    let engine_lock = state.engine.lock().await;
+    if let Some(ref engine) = *engine_lock {
+        Ok(engine.toggle_mic())
+    } else {
+        Err("not connected".into())
+    }
+}
+
+#[tauri::command]
+async fn toggle_speaker(state: tauri::State<'_, Arc<AppState>>) -> Result<bool, String> {
+    let engine_lock = state.engine.lock().await;
+    if let Some(ref engine) = *engine_lock {
+        Ok(engine.toggle_speaker())
+    } else {
+        Err("not connected".into())
+    }
+}
+
+#[tauri::command]
+async fn get_status(state: tauri::State<'_, Arc<AppState>>) -> Result<CallStatus, String> {
+    let engine_lock = state.engine.lock().await;
+    if let Some(ref engine) = *engine_lock {
+        let status = engine.status().await;
+        Ok(CallStatus {
+            active: true,
+            mic_muted: status.mic_muted,
+            spk_muted: status.spk_muted,
+            participants: status
+                .participants
+                .into_iter()
+                .map(|p| Participant {
+                    fingerprint: p.fingerprint,
+                    alias: p.alias,
+                    relay_label: p.relay_label,
+                })
+                .collect(),
+            encode_fps: status.frames_sent,
+            recv_fps: status.frames_received,
+            audio_level: status.audio_level,
+            call_duration_secs: status.call_duration_secs,
+            fingerprint: status.fingerprint,
+            tx_codec: status.tx_codec,
+            rx_codec: status.rx_codec,
+        })
+    } else {
+        Ok(CallStatus {
+            active: false,
+            mic_muted: false,
+            spk_muted: false,
+            participants: vec![],
+            encode_fps: 0,
+            recv_fps: 0,
+            audio_level: 0,
+            call_duration_secs: 0.0,
+            fingerprint: String::new(),
+            tx_codec: String::new(),
+            rx_codec: String::new(),
+        })
+    }
+}
+
+fn main() {
+    tracing_subscriber::fmt().init();
+
+    let state = Arc::new(AppState {
+        engine: Mutex::new(None),
+    });
+
+    tauri::Builder::default()
+        .plugin(tauri_plugin_shell::init())
+        .manage(state)
+        .invoke_handler(tauri::generate_handler![
+            ping_relay,
+            get_identity,
+            connect,
+            disconnect,
+            toggle_mic,
+            toggle_speaker,
+            get_status,
+        ])
+        .run(tauri::generate_context!())
+        .expect("error while running WarzonePhone Desktop");
+}

desktop/src-tauri/tauri.conf.json

@@ -0,0 +1,33 @@
+{
+  "productName": "WarzonePhone",
+  "version": "0.1.0",
+  "identifier": "com.wzp.desktop",
+  "build": {
+    "frontendDist": "../dist",
+    "devUrl": "http://localhost:1420",
+    "beforeDevCommand": "npm run dev",
+    "beforeBuildCommand": "npm run build"
+  },
+  "app": {
+    "windows": [
+      {
+        "title": "WarzonePhone",
+        "width": 400,
+        "height": 640,
+        "resizable": true,
+        "minWidth": 360,
+        "minHeight": 500
+      }
+    ],
+    "security": {
+      "csp": null
+    }
+  },
+  "bundle": {
+    "active": true,
+    "targets": "all",
+    "icon": [
+      "icons/icon.png"
+    ]
+  }
+}

desktop/src/identicon.ts

@@ -0,0 +1,110 @@
+/**
+ * Deterministic identicon generator — creates a unique symmetric pattern
+ * from a hex fingerprint string, similar to MetaMask's Jazzicon / Ethereum blockies.
+ *
+ * Returns an SVG data URL that can be used as an <img> src.
+ */
+
+function hashBytes(hex: string): number[] {
+  const clean = hex.replace(/[^0-9a-fA-F]/g, "");
+  const bytes: number[] = [];
+  for (let i = 0; i < clean.length; i += 2) {
+    bytes.push(parseInt(clean.substring(i, i + 2), 16));
+  }
+  // Pad to at least 16 bytes
+  while (bytes.length < 16) bytes.push(0);
+  return bytes;
+}
+
+function hslToRgb(h: number, s: number, l: number): [number, number, number] {
+  s /= 100;
+  l /= 100;
+  const k = (n: number) => (n + h / 30) % 12;
+  const a = s * Math.min(l, 1 - l);
+  const f = (n: number) =>
+    l - a * Math.max(-1, Math.min(k(n) - 3, Math.min(9 - k(n), 1)));
+  return [
+    Math.round(f(0) * 255),
+    Math.round(f(8) * 255),
+    Math.round(f(4) * 255),
+  ];
+}
+
+export function generateIdenticon(
+  fingerprint: string,
+  size: number = 36
+): string {
+  const bytes = hashBytes(fingerprint);
+
+  // Derive colors from first bytes
+  const hue1 = (bytes[0] * 360) / 256;
+  const hue2 = ((bytes[1] * 360) / 256 + 120) % 360;
+  const [r1, g1, b1] = hslToRgb(hue1, 65, 35); // dark bg
+  const [r2, g2, b2] = hslToRgb(hue2, 70, 55); // bright fg
+
+  const bg = `rgb(${r1},${g1},${b1})`;
+  const fg = `rgb(${r2},${g2},${b2})`;
+
+  // 5x5 grid, left-right symmetric (only need 3 columns)
+  const grid: boolean[][] = [];
+  for (let y = 0; y < 5; y++) {
+    const row: boolean[] = [];
+    for (let x = 0; x < 3; x++) {
+      const byteIdx = 2 + y * 3 + x;
+      row.push(bytes[byteIdx % bytes.length] > 128);
+    }
+    // Mirror: col 3 = col 1, col 4 = col 0
+    grid.push([row[0], row[1], row[2], row[1], row[0]]);
+  }
+
+  // Render SVG
+  const cellSize = size / 5;
+  const r = size * 0.12; // border radius
+  let rects = "";
+  for (let y = 0; y < 5; y++) {
+    for (let x = 0; x < 5; x++) {
+      if (grid[y][x]) {
+        rects += `<rect x="${x * cellSize}" y="${y * cellSize}" width="${cellSize}" height="${cellSize}" fill="${fg}"/>`;
+      }
+    }
+  }
+
+  const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" viewBox="0 0 ${size} ${size}">
+    <rect width="${size}" height="${size}" rx="${r}" fill="${bg}"/>
+    ${rects}
+  </svg>`;
+
+  return `data:image/svg+xml,${encodeURIComponent(svg)}`;
+}
+
+/**
+ * Create an <img> element with the identicon.
+ * Click copies the fingerprint to clipboard.
+ */
+export function createIdenticonEl(
+  fingerprint: string,
+  size: number = 36,
+  clickToCopy: boolean = true
+): HTMLImageElement {
+  const img = document.createElement("img");
+  img.src = generateIdenticon(fingerprint, size);
+  img.width = size;
+  img.height = size;
+  img.style.borderRadius = `${size * 0.12}px`;
+  img.style.cursor = clickToCopy ? "pointer" : "default";
+  img.title = fingerprint;
+
+  if (clickToCopy && fingerprint) {
+    img.addEventListener("click", (e) => {
+      e.stopPropagation();
+      navigator.clipboard.writeText(fingerprint).then(() => {
+        img.style.outline = "2px solid #4ade80";
+        setTimeout(() => {
+          img.style.outline = "";
+        }, 600);
+      });
+    });
+  }
+
+  return img;
+}

desktop/src/main.ts

@@ -0,0 +1,789 @@
+import { invoke } from "@tauri-apps/api/core";
+import { listen } from "@tauri-apps/api/event";
+import { generateIdenticon, createIdenticonEl } from "./identicon";
+
+// ── Elements ──
+const connectScreen = document.getElementById("connect-screen")!;
+const callScreen = document.getElementById("call-screen")!;
+const roomInput = document.getElementById("room") as HTMLInputElement;
+const aliasInput = document.getElementById("alias") as HTMLInputElement;
+const osAecCheckbox = document.getElementById("os-aec") as HTMLInputElement;
+const connectBtn = document.getElementById("connect-btn") as HTMLButtonElement;
+const connectError = document.getElementById("connect-error")!;
+const roomName = document.getElementById("room-name")!;
+const callTimer = document.getElementById("call-timer")!;
+const callStatus = document.getElementById("call-status")!;
+const levelBar = document.getElementById("level-bar")!;
+const participantsDiv = document.getElementById("participants")!;
+const micBtn = document.getElementById("mic-btn")!;
+const micIcon = document.getElementById("mic-icon")!;
+const spkBtn = document.getElementById("spk-btn")!;
+const spkIcon = document.getElementById("spk-icon")!;
+const hangupBtn = document.getElementById("hangup-btn")!;
+const statsDiv = document.getElementById("stats")!;
+const myFingerprintEl = document.getElementById("my-fingerprint")!;
+const myIdenticonEl = document.getElementById("my-identicon")!;
+const recentRoomsDiv = document.getElementById("recent-rooms")!;
+
+// Relay button
+const relaySelected = document.getElementById("relay-selected")!;
+const relayDot = document.getElementById("relay-dot")!;
+const relayLabel = document.getElementById("relay-label")!;
+
+// Relay dialog
+const relayDialog = document.getElementById("relay-dialog")!;
+const relayDialogClose = document.getElementById("relay-dialog-close")!;
+const relayDialogList = document.getElementById("relay-dialog-list")!;
+const relayAddName = document.getElementById("relay-add-name") as HTMLInputElement;
+const relayAddAddr = document.getElementById("relay-add-addr") as HTMLInputElement;
+const relayAddBtn = document.getElementById("relay-add-btn")!;
+
+// Settings
+const settingsPanel = document.getElementById("settings-panel")!;
+const settingsClose = document.getElementById("settings-close")!;
+const settingsSave = document.getElementById("settings-save")!;
+const settingsBtnHome = document.getElementById("settings-btn-home")!;
+const settingsBtnCall = document.getElementById("settings-btn-call")!;
+const sRoom = document.getElementById("s-room") as HTMLInputElement;
+const sAlias = document.getElementById("s-alias") as HTMLInputElement;
+const sOsAec = document.getElementById("s-os-aec") as HTMLInputElement;
+const sAgc = document.getElementById("s-agc") as HTMLInputElement;
+const sQuality = document.getElementById("s-quality") as HTMLInputElement;
+const sQualityLabel = document.getElementById("s-quality-label")!;
+
+// Quality slider config — best (left/green) to worst (right/red)
+const QUALITY_STEPS = ["studio-64k", "studio-48k", "studio-32k", "auto", "good", "degraded", "codec2-3200", "catastrophic"];
+const QUALITY_LABELS = ["Studio 64k", "Studio 48k", "Studio 32k", "Auto", "Opus 24k", "Opus 6k", "Codec2 3.2k", "Codec2 1.2k"];
+const QUALITY_COLORS = ["#22c55e", "#4ade80", "#86efac", "#a3e635", "#facc15", "#f59e0b", "#e97320", "#991b1b"];
+
+function qualityToIndex(q: string): number {
+  const idx = QUALITY_STEPS.indexOf(q);
+  return idx >= 0 ? idx : 3; // default to "auto" (index 3)
+}
+
+function updateQualityUI(index: number) {
+  sQualityLabel.textContent = QUALITY_LABELS[index];
+  sQualityLabel.style.color = QUALITY_COLORS[index];
+  sQuality.style.background = `linear-gradient(90deg, #22c55e 0%, #86efac 25%, #facc15 50%, #e97320 75%, #991b1b 100%)`;
+}
+
+sQuality.addEventListener("input", () => {
+  updateQualityUI(parseInt(sQuality.value));
+});
+const sFingerprint = document.getElementById("s-fingerprint")!;
+const sRecentRooms = document.getElementById("s-recent-rooms")!;
+const sClearRecent = document.getElementById("s-clear-recent")!;
+
+// Key warning dialog
+const keyWarning = document.getElementById("key-warning")!;
+const kwOldFp = document.getElementById("kw-old-fp")!;
+const kwNewFp = document.getElementById("kw-new-fp")!;
+const kwAccept = document.getElementById("kw-accept")!;
+const kwCancel = document.getElementById("kw-cancel")!;
+
+let statusInterval: number | null = null;
+let myFingerprint = "";
+let userDisconnected = false;
+
+// ── Data types ──
+interface RelayServer {
+  name: string;
+  address: string;
+  rtt?: number | null;
+  serverFingerprint?: string | null;    // from ping
+  knownFingerprint?: string | null;     // saved TOFU fingerprint
+}
+
+interface RecentRoom { relay: string; room: string; }
+
+interface Settings {
+  relays: RelayServer[];
+  selectedRelay: number;
+  room: string;
+  alias: string;
+  osAec: boolean;
+  agc: boolean;
+  quality: string;
+  recentRooms: RecentRoom[];
+}
+
+function loadSettings(): Settings {
+  const defaults: Settings = {
+    relays: [{ name: "Default", address: "193.180.213.68:4433" }],
+    selectedRelay: 0, room: "android", alias: "",
+    osAec: true, agc: true, quality: "auto", recentRooms: [],
+  };
+  try {
+    const raw = localStorage.getItem("wzp-settings");
+    if (raw) {
+      const parsed = JSON.parse(raw);
+      if (parsed.relay && !parsed.relays) {
+        parsed.relays = [{ name: "Default", address: parsed.relay }];
+        parsed.selectedRelay = 0;
+        delete parsed.relay;
+      }
+      if (parsed.recentRooms?.length > 0 && typeof parsed.recentRooms[0] === "string") {
+        const addr = parsed.relays?.[0]?.address || defaults.relays[0].address;
+        parsed.recentRooms = parsed.recentRooms.map((r: string) => ({ relay: addr, room: r }));
+      }
+      return { ...defaults, ...parsed };
+    }
+  } catch {}
+  return defaults;
+}
+
+function saveSettingsObj(s: Settings) {
+  localStorage.setItem("wzp-settings", JSON.stringify(s));
+}
+
+function getSelectedRelay(): RelayServer | undefined {
+  const s = loadSettings();
+  return s.relays[s.selectedRelay];
+}
+
+// ── Helpers ──
+function escapeHtml(s: string): string {
+  const d = document.createElement("div");
+  d.textContent = s;
+  return d.innerHTML;
+}
+
+// ── Lock status ──
+type LockStatus = "verified" | "new" | "changed" | "offline" | "unknown";
+
+function lockStatus(relay: RelayServer): LockStatus {
+  if (relay.rtt === undefined || relay.rtt === null) return "unknown";
+  if (relay.rtt < 0) return "offline";
+  if (!relay.serverFingerprint) return "new";
+  if (!relay.knownFingerprint) return "new"; // first time
+  if (relay.serverFingerprint === relay.knownFingerprint) return "verified";
+  return "changed";
+}
+
+function lockIcon(status: LockStatus): string {
+  switch (status) {
+    case "verified": return "🔒";
+    case "new": return "🔓";
+    case "changed": return "⚠️";
+    case "offline": return "🔴";
+    case "unknown": return "⚪";
+  }
+}
+
+function lockColor(status: LockStatus): string {
+  switch (status) {
+    case "verified": return "var(--green)";
+    case "new": return "var(--yellow)";
+    case "changed": return "var(--red)";
+    case "offline": return "var(--red)";
+    case "unknown": return "var(--text-dim)";
+  }
+}
+
+// ── Apply settings ──
+function applySettings() {
+  const s = loadSettings();
+  roomInput.value = s.room;
+  aliasInput.value = s.alias;
+  osAecCheckbox.checked = s.osAec;
+  renderRecentRooms(s.recentRooms);
+  renderRelayButton();
+}
+
+// ── Relay button ──
+function renderRelayButton() {
+  const s = loadSettings();
+  const sel = s.relays[s.selectedRelay];
+  if (sel) {
+    const ls = lockStatus(sel);
+    relayDot.textContent = lockIcon(ls);
+    relayDot.className = "relay-lock";
+    relayLabel.textContent = `${sel.name} (${sel.address})`;
+  } else {
+    relayDot.textContent = "⚪";
+    relayDot.className = "relay-lock";
+    relayLabel.textContent = "No relay configured";
+  }
+}
+
+relaySelected.addEventListener("click", () => openRelayDialog());
+
+// ── Relay dialog ──
+function openRelayDialog() {
+  renderRelayDialogList();
+  relayAddName.value = "";
+  relayAddAddr.value = "";
+  relayDialog.classList.remove("hidden");
+}
+
+function closeRelayDialog() {
+  relayDialog.classList.add("hidden");
+  renderRelayButton();
+}
+
+function renderRelayDialogList() {
+  const s = loadSettings();
+  relayDialogList.innerHTML = "";
+  s.relays.forEach((r, i) => {
+    const item = document.createElement("div");
+    item.className = `relay-dialog-item ${i === s.selectedRelay ? "selected" : ""}`;
+
+    const ls = lockStatus(r);
+    const fp = r.serverFingerprint || r.address;
+
+    // Identicon
+    const icon = createIdenticonEl(fp, 32, true);
+    icon.title = r.serverFingerprint
+      ? `Server: ${r.serverFingerprint}\nClick to copy`
+      : `No fingerprint yet`;
+    item.appendChild(icon);
+
+    // Info
+    const info = document.createElement("div");
+    info.className = "relay-info";
+    info.innerHTML = `
+      <div class="relay-name">${escapeHtml(r.name)}</div>
+      <div class="relay-addr">${escapeHtml(r.address)}</div>
+    `;
+    item.appendChild(info);
+
+    // Lock + RTT
+    const meta = document.createElement("div");
+    meta.className = "relay-meta";
+    const rttStr = r.rtt !== undefined && r.rtt !== null
+      ? (r.rtt < 0 ? "offline" : `${r.rtt}ms`)
+      : "";
+    meta.innerHTML = `
+      <span class="relay-lock-icon" style="color:${lockColor(ls)}">${lockIcon(ls)}</span>
+      <span class="relay-rtt">${rttStr}</span>
+    `;
+    item.appendChild(meta);
+
+    // Delete button
+    const del = document.createElement("button");
+    del.className = "remove";
+    del.textContent = "×";
+    del.addEventListener("click", (e) => {
+      e.stopPropagation();
+      const s = loadSettings();
+      s.relays.splice(i, 1);
+      if (s.selectedRelay >= s.relays.length) s.selectedRelay = Math.max(0, s.relays.length - 1);
+      saveSettingsObj(s);
+      renderRelayDialogList();
+      renderRelayButton();
+    });
+    item.appendChild(del);
+
+    // Click to select
+    item.addEventListener("click", () => {
+      const s = loadSettings();
+      s.selectedRelay = i;
+
+      // TOFU: if first time seeing this server, trust its fingerprint
+      if (r.serverFingerprint && !r.knownFingerprint) {
+        s.relays[i].knownFingerprint = r.serverFingerprint;
+      }
+
+      saveSettingsObj(s);
+      renderRelayDialogList();
+      renderRelayButton();
+    });
+
+    relayDialogList.appendChild(item);
+  });
+}
+
+relayAddBtn.addEventListener("click", () => {
+  const name = relayAddName.value.trim();
+  const addr = relayAddAddr.value.trim();
+  if (!addr) return;
+  const s = loadSettings();
+  s.relays.push({ name: name || addr, address: addr });
+  saveSettingsObj(s);
+  relayAddName.value = "";
+  relayAddAddr.value = "";
+  renderRelayDialogList();
+  pingAllRelays();
+});
+
+relayDialogClose.addEventListener("click", closeRelayDialog);
+relayDialog.addEventListener("click", (e) => { if (e.target === relayDialog) closeRelayDialog(); });
+
+// ── Ping ──
+interface PingResult { rtt_ms: number; server_fingerprint: string; }
+
+async function pingAllRelays() {
+  const s = loadSettings();
+  for (let i = 0; i < s.relays.length; i++) {
+    const r = s.relays[i];
+    try {
+      const result: PingResult = await invoke("ping_relay", { relay: r.address });
+      r.rtt = result.rtt_ms;
+      r.serverFingerprint = result.server_fingerprint;
+
+      // TOFU: auto-save fingerprint on first contact
+      if (!r.knownFingerprint) {
+        r.knownFingerprint = result.server_fingerprint;
+      }
+    } catch {
+      r.rtt = -1;
+    }
+  }
+  saveSettingsObj(s);
+  renderRelayButton();
+  if (!relayDialog.classList.contains("hidden")) renderRelayDialogList();
+}
+
+// ── Recent rooms ──
+function renderRecentRooms(rooms: RecentRoom[]) {
+  recentRoomsDiv.innerHTML = rooms
+    .map((r) => `<span class="recent-room" data-relay="${escapeHtml(r.relay)}" data-room="${escapeHtml(r.room)}">${escapeHtml(r.room)}</span>`)
+    .join("");
+  recentRoomsDiv.querySelectorAll(".recent-room").forEach((el) => {
+    el.addEventListener("click", () => {
+      const ds = (el as HTMLElement).dataset;
+      roomInput.value = ds.room || "";
+      const s = loadSettings();
+      const idx = s.relays.findIndex((r) => r.address === ds.relay);
+      if (idx >= 0) { s.selectedRelay = idx; saveSettingsObj(s); renderRelayButton(); }
+    });
+  });
+}
+
+// ── Init ──
+applySettings();
+setTimeout(pingAllRelays, 300);
+
+// Load fingerprint + render identicon
+(async () => {
+  try {
+    const fp: string = await invoke("get_identity");
+    myFingerprint = fp;
+    myFingerprintEl.textContent = fp;
+    myFingerprintEl.style.cursor = "pointer";
+    myFingerprintEl.addEventListener("click", () => {
+      navigator.clipboard.writeText(fp).then(() => {
+        const orig = myFingerprintEl.textContent;
+        myFingerprintEl.textContent = "Copied!";
+        setTimeout(() => { myFingerprintEl.textContent = orig; }, 1000);
+      });
+    });
+
+    // Identicon next to fingerprint
+    const icon = createIdenticonEl(fp, 28, true);
+    myIdenticonEl.innerHTML = "";
+    myIdenticonEl.appendChild(icon);
+  } catch {}
+})();
+
+// ── Connect ──
+connectBtn.addEventListener("click", doConnect);
+[roomInput, aliasInput].forEach((el) =>
+  el.addEventListener("keydown", (e) => { if (e.key === "Enter") doConnect(); })
+);
+
+function showKeyWarning(oldFp: string, newFp: string): Promise<boolean> {
+  return new Promise((resolve) => {
+    kwOldFp.textContent = oldFp;
+    kwNewFp.textContent = newFp;
+    keyWarning.classList.remove("hidden");
+
+    const cleanup = () => {
+      keyWarning.classList.add("hidden");
+      kwAccept.removeEventListener("click", onAccept);
+      kwCancel.removeEventListener("click", onCancel);
+      keyWarning.removeEventListener("click", onBackdrop);
+    };
+    const onAccept = () => { cleanup(); resolve(true); };
+    const onCancel = () => { cleanup(); resolve(false); };
+    const onBackdrop = (e: Event) => { if (e.target === keyWarning) { cleanup(); resolve(false); } };
+
+    kwAccept.addEventListener("click", onAccept);
+    kwCancel.addEventListener("click", onCancel);
+    keyWarning.addEventListener("click", onBackdrop);
+  });
+}
+
+async function doConnect() {
+  const relay = getSelectedRelay();
+  if (!relay) { connectError.textContent = "No relay selected"; return; }
+
+  // Warn on fingerprint mismatch
+  const ls = lockStatus(relay);
+  if (ls === "changed") {
+    const accepted = await showKeyWarning(relay.knownFingerprint || "", relay.serverFingerprint || "");
+    if (!accepted) return;
+    // User accepted — update known fingerprint
+    const s = loadSettings();
+    s.relays[s.selectedRelay].knownFingerprint = relay.serverFingerprint;
+    saveSettingsObj(s);
+    renderRelayButton();
+  }
+
+  // Don't block connect on offline — ping may have failed transiently
+
+  connectError.textContent = "";
+  connectBtn.disabled = true;
+  connectBtn.textContent = "Connecting...";
+  userDisconnected = false;
+
+  const s = loadSettings();
+  s.room = roomInput.value; s.alias = aliasInput.value; s.osAec = osAecCheckbox.checked;
+  const room = roomInput.value.trim();
+  if (room) {
+    const entry: RecentRoom = { relay: relay.address, room };
+    s.recentRooms = [entry, ...s.recentRooms.filter((r) => !(r.relay === relay.address && r.room === room))].slice(0, 5);
+  }
+  saveSettingsObj(s);
+
+  try {
+    await invoke("connect", {
+      relay: relay.address, room: roomInput.value,
+      alias: aliasInput.value, osAec: osAecCheckbox.checked,
+      quality: s.quality || "auto",
+    });
+    showCallScreen();
+  } catch (e: any) {
+    connectError.textContent = String(e);
+    connectBtn.disabled = false;
+    connectBtn.textContent = "Connect";
+  }
+}
+
+function showCallScreen() {
+  connectScreen.classList.add("hidden");
+  callScreen.classList.remove("hidden");
+  roomName.textContent = roomInput.value;
+  callStatus.className = "status-dot";
+  statusInterval = window.setInterval(pollStatus, 250);
+}
+
+function showConnectScreen() {
+  callScreen.classList.add("hidden");
+  connectScreen.classList.remove("hidden");
+  connectBtn.disabled = false;
+  connectBtn.textContent = "Connect";
+  levelBar.style.width = "0%";
+  if (statusInterval) { clearInterval(statusInterval); statusInterval = null; }
+}
+
+// ── Mute / hangup ──
+micBtn.addEventListener("click", async () => {
+  try { const m: boolean = await invoke("toggle_mic"); micBtn.classList.toggle("muted", m); micIcon.textContent = m ? "Mic Off" : "Mic"; } catch {}
+});
+spkBtn.addEventListener("click", async () => {
+  try { const m: boolean = await invoke("toggle_speaker"); spkBtn.classList.toggle("muted", m); spkIcon.textContent = m ? "Spk Off" : "Spk"; } catch {}
+});
+hangupBtn.addEventListener("click", async () => {
+  userDisconnected = true;
+  try { await invoke("disconnect"); } catch {}
+  showConnectScreen();
+});
+
+document.addEventListener("keydown", (e) => {
+  if (callScreen.classList.contains("hidden")) return;
+  if ((e.target as HTMLElement).tagName === "INPUT") return;
+  if (e.key === "m") micBtn.click();
+  if (e.key === "s") spkBtn.click();
+  if (e.key === "q") hangupBtn.click();
+});
+
+// ── Status polling ──
+interface CallStatusI {
+  active: boolean; mic_muted: boolean; spk_muted: boolean;
+  participants: { fingerprint: string; alias: string | null }[];
+  encode_fps: number; recv_fps: number; audio_level: number;
+  call_duration_secs: number; fingerprint: string;
+}
+
+function formatDuration(secs: number): string {
+  const m = Math.floor(secs / 60);
+  const s = Math.floor(secs % 60);
+  return `${m}:${s.toString().padStart(2, "0")}`;
+}
+
+let reconnectAttempts = 0;
+
+async function pollStatus() {
+  try {
+    const st: CallStatusI = await invoke("get_status");
+    if (!st.active) {
+      if (!userDisconnected && reconnectAttempts < 5) {
+        reconnectAttempts++;
+        callStatus.className = "status-dot reconnecting";
+        statsDiv.textContent = `Reconnecting (${reconnectAttempts}/5)...`;
+        const relay = getSelectedRelay();
+        if (relay) {
+          const delay = Math.min(1000 * Math.pow(2, reconnectAttempts - 1), 10000);
+          setTimeout(async () => {
+            try {
+              await invoke("connect", { relay: relay.address, room: roomInput.value, alias: aliasInput.value, osAec: osAecCheckbox.checked });
+              reconnectAttempts = 0; callStatus.className = "status-dot";
+            } catch {}
+          }, delay);
+        }
+        return;
+      }
+      reconnectAttempts = 0; showConnectScreen(); return;
+    }
+
+    reconnectAttempts = 0;
+    if (st.fingerprint) myFingerprint = st.fingerprint;
+
+    micBtn.classList.toggle("muted", st.mic_muted);
+    micIcon.textContent = st.mic_muted ? "Mic Off" : "Mic";
+    spkBtn.classList.toggle("muted", st.spk_muted);
+    spkIcon.textContent = st.spk_muted ? "Spk Off" : "Spk";
+    callTimer.textContent = formatDuration(st.call_duration_secs);
+
+    const rms = st.audio_level;
+    const pct = rms > 0 ? Math.min(100, (Math.log(rms) / Math.log(32767)) * 100) : 0;
+    levelBar.style.width = `${pct}%`;
+
+    // Participants grouped by relay
+    if (st.participants.length === 0) {
+      participantsDiv.innerHTML = '<div class="participants-empty">Waiting for participants...</div>';
+    } else {
+      participantsDiv.innerHTML = "";
+      // Group by relay_label (null = this relay)
+      const groups: Record<string, typeof st.participants> = {};
+      st.participants.forEach((p: any) => {
+        const relay = p.relay_label || "This Relay";
+        if (!groups[relay]) groups[relay] = [];
+        groups[relay].push(p);
+      });
+
+      Object.entries(groups).forEach(([relay, members]) => {
+        // Relay header
+        const header = document.createElement("div");
+        header.className = "relay-group-header";
+        const isLocal = relay === "This Relay";
+        header.innerHTML = `<span class="relay-dot-small ${isLocal ? "green" : "blue"}"></span> ${escapeHtml(relay)}`;
+        participantsDiv.appendChild(header);
+
+        // Participants under this relay
+        (members as any[]).forEach((p) => {
+          const name = p.alias || "Anonymous";
+          const fp = p.fingerprint || "";
+          const isMe = fp && myFingerprint.includes(fp);
+
+          const row = document.createElement("div");
+          row.className = "participant";
+
+          const icon = createIdenticonEl(fp || name, 36, true);
+          if (isMe) icon.style.outline = "2px solid var(--accent)";
+          row.appendChild(icon);
+
+          const info = document.createElement("div");
+          info.className = "info";
+          info.innerHTML = `
+            <div class="name">${escapeHtml(name)} ${isMe ? '<span class="you-badge">you</span>' : ""}</div>
+            <div class="fp">${escapeHtml(fp ? fp.substring(0, 16) : "")}</div>
+          `;
+          row.appendChild(info);
+          participantsDiv.appendChild(row);
+        });
+      });
+    }
+
+    // Stats line with codec badges
+    const txBadge = (st as any).tx_codec ? `<span class="codec-badge tx">${escapeHtml((st as any).tx_codec)}</span>` : "";
+    const rxBadge = (st as any).rx_codec ? `<span class="codec-badge rx">${escapeHtml((st as any).rx_codec)}</span>` : "";
+    statsDiv.innerHTML = `${txBadge} ${rxBadge} TX: ${st.encode_fps} | RX: ${st.recv_fps}`;
+  } catch {}
+}
+
+listen("call-event", (event: any) => {
+  const { kind } = event.payload;
+  if (kind === "room-update") pollStatus();
+  if (kind === "disconnected" && !userDisconnected) pollStatus();
+});
+
+// ── Settings ──
+function openSettings() {
+  const s = loadSettings();
+  sRoom.value = s.room; sAlias.value = s.alias; sOsAec.checked = s.osAec;
+  const qi = qualityToIndex(s.quality || "auto");
+  sQuality.value = String(qi);
+  updateQualityUI(qi);
+  sFingerprint.textContent = myFingerprint || "(loading...)";
+  renderSettingsRecentRooms(s.recentRooms);
+  settingsPanel.classList.remove("hidden");
+}
+function closeSettings() { settingsPanel.classList.add("hidden"); }
+
+function renderSettingsRecentRooms(rooms: RecentRoom[]) {
+  if (rooms.length === 0) {
+    sRecentRooms.innerHTML = '<span style="color:var(--text-dim);font-size:12px">No recent rooms</span>';
+    return;
+  }
+  sRecentRooms.innerHTML = rooms.map((r, i) => `
+    <div class="recent-room-item">
+      <span>${escapeHtml(r.room)} <small style="color:var(--text-dim)">${escapeHtml(r.relay)}</small></span>
+      <button class="remove" data-idx="${i}">×</button>
+    </div>`).join("");
+  sRecentRooms.querySelectorAll(".remove").forEach((btn) => {
+    btn.addEventListener("click", () => {
+      const idx = parseInt((btn as HTMLElement).dataset.idx || "0");
+      const s = loadSettings();
+      s.recentRooms.splice(idx, 1);
+      saveSettingsObj(s);
+      renderSettingsRecentRooms(s.recentRooms);
+    });
+  });
+}
+
+settingsBtnHome.addEventListener("click", openSettings);
+settingsBtnCall.addEventListener("click", openSettings);
+settingsClose.addEventListener("click", closeSettings);
+settingsPanel.addEventListener("click", (e) => { if (e.target === settingsPanel) closeSettings(); });
+
+settingsSave.addEventListener("click", () => {
+  const s = loadSettings();
+  s.room = sRoom.value; s.alias = sAlias.value; s.osAec = sOsAec.checked;
+  s.quality = QUALITY_STEPS[parseInt(sQuality.value)] || "auto";
+  saveSettingsObj(s);
+  roomInput.value = s.room; aliasInput.value = s.alias; osAecCheckbox.checked = s.osAec;
+  renderRecentRooms(s.recentRooms);
+  closeSettings();
+});
+
+sClearRecent.addEventListener("click", () => {
+  const s = loadSettings();
+  s.recentRooms = [];
+  saveSettingsObj(s);
+  renderSettingsRecentRooms([]);
+  renderRecentRooms([]);
+});
+
+document.addEventListener("keydown", (e) => {
+  if ((e.metaKey || e.ctrlKey) && e.key === ",") {
+    e.preventDefault();
+    settingsPanel.classList.contains("hidden") ? openSettings() : closeSettings();
+  }
+  if (e.key === "Escape") {
+    if (!relayDialog.classList.contains("hidden")) closeRelayDialog();
+    else if (!settingsPanel.classList.contains("hidden")) closeSettings();
+  }
+});
+
+// ── Direct Calling UI ──
+const modeRoom = document.getElementById("mode-room")!;
+const modeDirect = document.getElementById("mode-direct")!;
+const roomModeDiv = document.getElementById("room-mode")!;
+const directModeDiv = document.getElementById("direct-mode")!;
+const registerBtn = document.getElementById("register-btn") as HTMLButtonElement;
+const directRegistered = document.getElementById("direct-registered")!;
+const incomingCallPanel = document.getElementById("incoming-call-panel")!;
+const incomingCaller = document.getElementById("incoming-caller")!;
+const acceptCallBtn = document.getElementById("accept-call-btn")!;
+const rejectCallBtn = document.getElementById("reject-call-btn")!;
+const targetFpInput = document.getElementById("target-fp") as HTMLInputElement;
+const callBtn = document.getElementById("call-btn") as HTMLButtonElement;
+const callStatusText = document.getElementById("call-status-text")!;
+
+let currentCallMode = "room";
+
+modeRoom.addEventListener("click", () => {
+  currentCallMode = "room";
+  modeRoom.classList.add("active");
+  modeDirect.classList.remove("active");
+  roomModeDiv.classList.remove("hidden");
+  directModeDiv.classList.add("hidden");
+  // Show room/alias inputs
+  (document.querySelector('label:has(#room)') as HTMLElement)?.classList.remove("hidden");
+  (document.querySelector('label:has(#alias)') as HTMLElement)?.classList.remove("hidden");
+});
+
+modeDirect.addEventListener("click", () => {
+  currentCallMode = "direct";
+  modeDirect.classList.add("active");
+  modeRoom.classList.remove("active");
+  directModeDiv.classList.remove("hidden");
+  roomModeDiv.classList.add("hidden");
+  // Hide room input, keep alias
+  (document.querySelector('label:has(#room)') as HTMLElement)?.classList.add("hidden");
+});
+
+registerBtn.addEventListener("click", async () => {
+  const relay = getSelectedRelay();
+  if (!relay) { connectError.textContent = "No relay selected"; return; }
+  registerBtn.disabled = true;
+  registerBtn.textContent = "Registering...";
+  try {
+    const fp = await invoke<string>("register_signal", { relay: relay.address });
+    registerBtn.classList.add("hidden");
+    directRegistered.classList.remove("hidden");
+    callStatusText.textContent = `Your fingerprint: ${fp}`;
+  } catch (e: any) {
+    connectError.textContent = String(e);
+    registerBtn.disabled = false;
+    registerBtn.textContent = "Register on Relay";
+  }
+});
+
+callBtn.addEventListener("click", async () => {
+  const target = targetFpInput.value.trim();
+  if (!target) return;
+  callStatusText.textContent = "Calling...";
+  try {
+    await invoke("place_call", { targetFp: target });
+  } catch (e: any) {
+    callStatusText.textContent = `Error: ${e}`;
+  }
+});
+
+acceptCallBtn.addEventListener("click", async () => {
+  const status = await invoke<any>("get_signal_status");
+  if (status.incoming_call_id) {
+    await invoke("answer_call", { callId: status.incoming_call_id, mode: 2 });
+    incomingCallPanel.classList.add("hidden");
+  }
+});
+
+rejectCallBtn.addEventListener("click", async () => {
+  const status = await invoke<any>("get_signal_status");
+  if (status.incoming_call_id) {
+    await invoke("answer_call", { callId: status.incoming_call_id, mode: 0 });
+    incomingCallPanel.classList.add("hidden");
+  }
+});
+
+// Listen for signal events from Rust backend
+listen("signal-event", (event: any) => {
+  const data = event.payload;
+  switch (data.type) {
+    case "ringing":
+      callStatusText.textContent = "🔔 Ringing...";
+      break;
+    case "incoming":
+      incomingCallPanel.classList.remove("hidden");
+      incomingCaller.textContent = `From: ${data.caller_alias || data.caller_fp?.substring(0, 16) || "unknown"}`;
+      break;
+    case "answered":
+      callStatusText.textContent = `Call answered (${data.mode})`;
+      break;
+    case "setup":
+      callStatusText.textContent = "Connecting to media...";
+      // Auto-connect to the call room
+      (async () => {
+        try {
+          await invoke("connect", {
+            relay: data.relay_addr,
+            room: data.room,
+            alias: aliasInput.value,
+            osAec: osAecCheckbox.checked,
+            quality: loadSettings().quality || "auto",
+          });
+          showCallScreen();
+        } catch (e: any) {
+          callStatusText.textContent = `Media connect failed: ${e}`;
+        }
+      })();
+      break;
+    case "hangup":
+      callStatusText.textContent = "";
+      incomingCallPanel.classList.add("hidden");
+      break;
+  }
+});

desktop/src/style.css

@@ -0,0 +1,892 @@
+:root {
+  --bg: #0f0f1a;
+  --surface: #1a1a2e;
+  --surface2: #222244;
+  --primary: #0f3460;
+  --accent: #e94560;
+  --text: #eee;
+  --text-dim: #777;
+  --green: #4ade80;
+  --red: #ef4444;
+  --yellow: #facc15;
+  --radius: 12px;
+}
+
+* { margin: 0; padding: 0; box-sizing: border-box; }
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+  background: var(--bg);
+  color: var(--text);
+  min-height: 100vh;
+  user-select: none;
+  -webkit-user-select: none;
+}
+
+#app {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+  padding: 20px;
+}
+
+.hidden { display: none !important; }
+
+/* ── Connect screen ── */
+#connect-screen {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  flex: 1;
+  gap: 20px;
+}
+
+#connect-screen h1 {
+  font-size: 26px;
+  font-weight: 700;
+  letter-spacing: 1px;
+}
+
+.subtitle {
+  font-size: 13px;
+  color: var(--text-dim);
+  margin-top: -12px;
+  letter-spacing: 2px;
+  text-transform: uppercase;
+}
+
+.form {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  width: 100%;
+  max-width: 320px;
+}
+
+.form label {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  font-size: 11px;
+  color: var(--text-dim);
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.form input[type="text"] {
+  background: var(--surface);
+  border: 1px solid #333;
+  border-radius: 8px;
+  padding: 10px 12px;
+  color: var(--text);
+  font-size: 15px;
+  outline: none;
+  transition: border-color 0.2s;
+}
+
+.form input[type="text"]:focus {
+  border-color: var(--accent);
+}
+
+/* ── Relay button ── */
+.relay-selected {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  background: var(--surface);
+  border: 1px solid #333;
+  border-radius: 8px;
+  padding: 10px 12px;
+  color: var(--text);
+  font-size: 14px;
+  cursor: pointer;
+  text-align: left;
+  transition: border-color 0.2s;
+}
+
+.relay-selected:hover { border-color: var(--accent); }
+
+.relay-lock {
+  font-size: 14px;
+  flex-shrink: 0;
+}
+
+.relay-selected .arrow {
+  margin-left: auto;
+  font-size: 10px;
+  color: var(--text-dim);
+}
+
+.dot.green { background: var(--green); }
+.dot.yellow { background: var(--yellow); }
+.dot.red { background: var(--red); }
+.dot.gray { background: #555; }
+
+/* ── Relay dialog ── */
+#relay-dialog {
+  position: fixed;
+  inset: 0;
+  background: rgba(0,0,0,0.6);
+  backdrop-filter: blur(4px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 200;
+  padding: 20px;
+}
+
+.relay-dialog-card {
+  max-width: 360px;
+  width: 100%;
+}
+
+.relay-dialog-list {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  max-height: 300px;
+  overflow-y: auto;
+}
+
+.relay-dialog-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  background: var(--surface);
+  border-radius: 8px;
+  padding: 8px 12px;
+}
+
+.relay-dialog-item .dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
+.relay-dialog-item { cursor: pointer; transition: background 0.1s; }
+.relay-dialog-item:hover { background: var(--surface2); }
+.relay-dialog-item.selected { background: var(--primary); border: 1px solid var(--accent); }
+
+.relay-dialog-item .relay-info { flex: 1; min-width: 0; overflow: hidden; }
+.relay-dialog-item .relay-name { font-size: 13px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.relay-dialog-item .relay-addr { font-size: 11px; color: var(--text-dim); font-family: monospace; overflow: hidden; text-overflow: ellipsis; }
+.relay-dialog-item .relay-rtt { font-size: 11px; color: var(--text-dim); margin-right: 4px; }
+
+.relay-meta {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 2px;
+  flex-shrink: 0;
+}
+
+.relay-lock-icon { font-size: 16px; }
+.relay-meta .relay-rtt { font-size: 10px; color: var(--text-dim); }
+
+.relay-dialog-item .remove {
+  background: none;
+  border: none;
+  color: var(--text-dim);
+  cursor: pointer;
+  font-size: 16px;
+  padding: 0 4px;
+}
+
+.relay-dialog-item .remove:hover { color: var(--red); }
+
+.relay-add-row {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  margin-top: 12px;
+  border-top: 1px solid #333;
+  padding-top: 12px;
+}
+
+.relay-add-inputs {
+  display: flex;
+  gap: 6px;
+}
+
+.relay-add-row input {
+  background: var(--surface);
+  border: 1px solid #333;
+  border-radius: 8px;
+  padding: 8px 10px;
+  color: var(--text);
+  font-size: 13px;
+  outline: none;
+  flex: 1;
+  min-width: 0;
+}
+
+.relay-add-row input:focus { border-color: var(--accent); }
+
+.relay-add-row .primary {
+  padding: 10px;
+  font-size: 14px;
+}
+
+.form-row {
+  display: flex;
+  gap: 16px;
+  align-items: center;
+}
+
+.checkbox {
+  flex-direction: row !important;
+  align-items: center;
+  gap: 8px !important;
+  cursor: pointer;
+  font-size: 13px !important;
+}
+
+.checkbox input { width: 16px; height: 16px; }
+
+button.primary {
+  background: var(--accent);
+  color: white;
+  border: none;
+  border-radius: 8px;
+  padding: 12px;
+  font-size: 16px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: opacity 0.2s;
+  margin-top: 4px;
+}
+
+button.primary:hover { opacity: 0.9; }
+button.primary:disabled { opacity: 0.5; cursor: not-allowed; }
+
+.error {
+  color: var(--red);
+  font-size: 13px;
+  min-height: 18px;
+}
+
+.identity-info {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+}
+
+.fp-display {
+  font-family: monospace;
+  font-size: 11px;
+  color: var(--text-dim);
+}
+
+.recent-rooms {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  justify-content: center;
+  max-width: 320px;
+}
+
+.recent-room {
+  background: var(--surface);
+  border: 1px solid #333;
+  border-radius: 16px;
+  padding: 4px 12px;
+  font-size: 12px;
+  color: var(--text-dim);
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.recent-room:hover {
+  border-color: var(--accent);
+  color: var(--text);
+}
+
+/* ── Call screen ── */
+#call-screen {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  gap: 16px;
+}
+
+.call-header {
+  text-align: center;
+  padding: 8px;
+}
+
+.room-name {
+  font-size: 20px;
+  font-weight: 600;
+}
+
+.call-meta {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  margin-top: 4px;
+}
+
+.status-dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: var(--green);
+  display: inline-block;
+  animation: pulse 2s infinite;
+}
+
+@keyframes pulse {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.4; }
+}
+
+.status-dot.reconnecting {
+  background: var(--yellow);
+  animation: blink 0.5s infinite;
+}
+
+@keyframes blink {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.1; }
+}
+
+.call-timer {
+  font-size: 14px;
+  color: var(--text-dim);
+  font-variant-numeric: tabular-nums;
+}
+
+/* ── Audio level meter ── */
+.level-meter {
+  height: 4px;
+  background: var(--surface);
+  border-radius: 2px;
+  overflow: hidden;
+}
+
+.level-bar-fill {
+  height: 100%;
+  width: 0%;
+  background: linear-gradient(90deg, var(--green) 0%, var(--yellow) 60%, var(--red) 100%);
+  border-radius: 2px;
+  transition: width 0.1s ease-out;
+}
+
+/* ── Participants ── */
+.participants {
+  background: var(--surface);
+  border-radius: var(--radius);
+  padding: 12px 16px;
+  flex: 1;
+  overflow-y: auto;
+  min-height: 80px;
+}
+
+.participants-empty {
+  color: var(--text-dim);
+  font-size: 13px;
+  text-align: center;
+  padding: 20px 0;
+}
+
+.participant {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 8px 0;
+  border-bottom: 1px solid #ffffff08;
+}
+
+.participant:last-child { border-bottom: none; }
+
+.participant .avatar {
+  width: 36px;
+  height: 36px;
+  border-radius: 50%;
+  background: var(--primary);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 14px;
+  font-weight: 600;
+  flex-shrink: 0;
+}
+
+.participant .avatar.me {
+  background: var(--accent);
+}
+
+.participant .info { flex: 1; min-width: 0; }
+
+.participant .name {
+  font-size: 14px;
+  font-weight: 500;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.participant .fp {
+  font-size: 10px;
+  color: var(--text-dim);
+  font-family: monospace;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.participant .you-badge {
+  font-size: 10px;
+  color: var(--accent);
+  background: #e9456020;
+  padding: 1px 6px;
+  border-radius: 8px;
+}
+
+/* ── Relay group headers ── */
+.relay-group-header {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: var(--text-dim);
+  padding: 6px 0 2px;
+  border-top: 1px solid #ffffff08;
+  margin-top: 4px;
+}
+
+.relay-group-header:first-child {
+  border-top: none;
+  margin-top: 0;
+}
+
+.relay-dot-small {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  display: inline-block;
+}
+
+.relay-dot-small.green { background: var(--green); }
+.relay-dot-small.blue { background: #60a5fa; }
+
+/* ── Codec badges ── */
+.codec-badge {
+  display: inline-block;
+  font-size: 10px;
+  font-weight: 600;
+  padding: 1px 6px;
+  border-radius: 4px;
+  font-family: monospace;
+  margin: 0 2px;
+}
+
+.codec-badge.tx {
+  background: #22c55e30;
+  color: #4ade80;
+}
+
+.codec-badge.rx {
+  background: #3b82f630;
+  color: #60a5fa;
+}
+
+/* ── Controls ── */
+.controls {
+  display: flex;
+  justify-content: center;
+  gap: 24px;
+  padding: 12px;
+}
+
+.control-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: var(--surface2);
+  color: var(--text);
+  border: none;
+  border-radius: 50%;
+  width: 56px;
+  height: 56px;
+  cursor: pointer;
+  transition: all 0.15s;
+  font-size: 13px;
+  font-weight: 600;
+}
+
+.control-btn:hover { background: var(--primary); }
+
+.control-btn.muted {
+  background: var(--red);
+  color: white;
+}
+
+.control-btn.hangup {
+  background: var(--red);
+  color: white;
+  width: 64px;
+  height: 64px;
+  font-size: 14px;
+}
+
+.control-btn.hangup:hover { opacity: 0.85; }
+
+/* ── Stats ── */
+.stats {
+  text-align: center;
+  font-size: 10px;
+  color: var(--text-dim);
+  font-family: monospace;
+  padding: 4px;
+}
+
+/* ── Icon button ── */
+.icon-btn {
+  background: none;
+  border: 1px solid #444;
+  border-radius: 8px;
+  color: var(--text-dim);
+  font-size: 18px;
+  width: 36px;
+  height: 36px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.15s;
+}
+
+.icon-btn:hover { border-color: var(--accent); color: var(--text); }
+.icon-btn.small { width: 28px; height: 28px; font-size: 14px; }
+
+.call-header-row {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+}
+
+/* ── Settings panel ── */
+#settings-panel {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.6);
+  backdrop-filter: blur(4px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 100;
+  padding: 20px;
+}
+
+.settings-card {
+  background: var(--bg);
+  border: 1px solid #333;
+  border-radius: 16px;
+  padding: 24px;
+  width: 100%;
+  max-width: 380px;
+  max-height: 90vh;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
+
+.settings-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.settings-header h2 {
+  font-size: 18px;
+  font-weight: 600;
+}
+
+.settings-section {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.settings-section h3 {
+  font-size: 12px;
+  text-transform: uppercase;
+  letter-spacing: 1px;
+  color: var(--text-dim);
+  border-bottom: 1px solid #333;
+  padding-bottom: 4px;
+}
+
+.settings-section label {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  font-size: 11px;
+  color: var(--text-dim);
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.settings-section input[type="text"] {
+  background: var(--surface);
+  border: 1px solid #333;
+  border-radius: 8px;
+  padding: 8px 10px;
+  color: var(--text);
+  font-size: 14px;
+  outline: none;
+}
+
+.settings-section input[type="text"]:focus {
+  border-color: var(--accent);
+}
+
+.setting-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 4px 0;
+}
+
+.setting-label {
+  font-size: 12px;
+  color: var(--text-dim);
+}
+
+.fp-display-large {
+  font-family: monospace;
+  font-size: 12px;
+  color: var(--text);
+  word-break: break-all;
+}
+
+.recent-rooms-list {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.recent-room-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: var(--surface);
+  border-radius: 8px;
+  padding: 6px 10px;
+  font-size: 13px;
+}
+
+.recent-room-item .remove {
+  background: none;
+  border: none;
+  color: var(--text-dim);
+  cursor: pointer;
+  font-size: 16px;
+}
+
+.recent-room-item .remove:hover { color: var(--red); }
+
+.secondary-btn {
+  background: var(--surface);
+  border: 1px solid #444;
+  border-radius: 8px;
+  padding: 8px;
+  color: var(--text-dim);
+  font-size: 13px;
+  cursor: pointer;
+  transition: all 0.15s;
+}
+
+.secondary-btn:hover { border-color: var(--accent); color: var(--text); }
+
+/* ── Key warning dialog ── */
+#key-warning {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.7);
+  backdrop-filter: blur(6px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 300;
+  padding: 20px;
+}
+
+.key-warning-card {
+  max-width: 360px;
+  text-align: center;
+  gap: 16px;
+}
+
+.key-warning-icon {
+  font-size: 48px;
+  color: var(--yellow);
+  line-height: 1;
+}
+
+.key-warning-card h2 {
+  font-size: 18px;
+  font-weight: 600;
+}
+
+.key-warning-text {
+  font-size: 13px;
+  color: var(--text-dim);
+  line-height: 1.5;
+}
+
+.key-warning-fps {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  background: var(--surface);
+  border-radius: 8px;
+  padding: 12px;
+}
+
+.key-fp-row {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  text-align: left;
+}
+
+.key-fp-label {
+  font-size: 10px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: var(--text-dim);
+}
+
+.key-fp {
+  font-family: monospace;
+  font-size: 11px;
+  word-break: break-all;
+  color: var(--text);
+}
+
+.key-warning-actions {
+  display: flex;
+  gap: 10px;
+}
+
+.key-warning-actions .primary {
+  flex: 1;
+  background: var(--yellow);
+  color: #000;
+  font-weight: 600;
+}
+
+.key-warning-actions .secondary-btn {
+  flex: 1;
+}
+
+/* ── Quality slider ── */
+.quality-control {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 4px 0;
+}
+
+.quality-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.quality-label {
+  font-size: 13px;
+  font-weight: 600;
+  padding: 2px 8px;
+  border-radius: 6px;
+  transition: all 0.2s;
+}
+
+.quality-slider {
+  -webkit-appearance: none;
+  appearance: none;
+  width: 100%;
+  height: 6px;
+  border-radius: 3px;
+  outline: none;
+  cursor: pointer;
+  transition: background 0.2s;
+}
+
+.quality-slider::-webkit-slider-thumb {
+  -webkit-appearance: none;
+  appearance: none;
+  width: 18px;
+  height: 18px;
+  border-radius: 50%;
+  background: var(--text);
+  border: 2px solid var(--bg);
+  box-shadow: 0 1px 4px rgba(0,0,0,0.4);
+  cursor: pointer;
+  transition: transform 0.1s;
+}
+
+.quality-slider::-webkit-slider-thumb:hover {
+  transform: scale(1.15);
+}
+
+.quality-ticks {
+  display: flex;
+  justify-content: space-between;
+  font-size: 9px;
+  color: var(--text-dim);
+  padding: 0 2px;
+}
+
+.form select {
+  background: var(--surface);
+  border: 1px solid #333;
+  border-radius: 8px;
+  padding: 10px 12px;
+  color: var(--text);
+  font-size: 15px;
+  outline: none;
+  transition: border-color 0.2s;
+}
+
+.form select:focus {
+  border-color: var(--accent);
+}
+
+.settings-section select {
+  background: var(--surface);
+  border: 1px solid #333;
+  border-radius: 8px;
+  padding: 8px 10px;
+  color: var(--text);
+  font-size: 14px;
+  outline: none;
+}
+
+.settings-section select:focus {
+  border-color: var(--accent);
+}
+
+/* Direct calling mode toggle */
+.mode-btn {
+  padding: 8px 16px;
+  border: 1px solid var(--surface2);
+  background: var(--surface);
+  color: var(--dim);
+  border-radius: 6px;
+  cursor: pointer;
+  font-size: 13px;
+  transition: all 0.15s;
+}
+.mode-btn.active {
+  background: var(--accent);
+  color: white;
+  border-color: var(--accent);
+}
+.mode-btn:hover:not(.active) {
+  background: var(--surface2);
+}

desktop/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "resolveJsonModule": true,
+    "allowImportingTsExtensions": true,
+    "noEmit": true
+  },
+  "include": ["src"]
+}

desktop/vite.config.ts

@@ -0,0 +1,15 @@
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  clearScreen: false,
+  server: {
+    port: 1420,
+    strictPort: true,
+  },
+  envPrefix: ["VITE_", "TAURI_"],
+  build: {
+    target: "esnext",
+    minify: !process.env.TAURI_DEBUG ? "esbuild" : false,
+    sourcemap: !!process.env.TAURI_DEBUG,
+  },
+});

docs/PRD-local-recording.md

@@ -0,0 +1,141 @@
+# PRD: Local Recording + Cloud Mixer for Podcast-Quality Interviews
+
+## Problem
+
+WarzonePhone delivers real-time encrypted voice, but the audio quality is limited by network conditions (codec compression, packet loss, jitter). Podcasters and interviewers need pristine, studio-grade recordings of each participant — independent of what the network delivers.
+
+## Solution
+
+**Dual-path architecture**: each client simultaneously (1) participates in the live call at whatever codec quality the network supports, and (2) records their own microphone locally as lossless PCM. After the session, all local recordings are uploaded to a self-hosted mixer service that aligns, normalizes, and outputs a final multi-track or mixed file.
+
+## Architecture
+
+```
+                          ┌──────────────────┐
+  Mic ──┬── Opus/Codec2 ──► Network (live)   │  ← real-time call
+        │                 └──────────────────┘
+        │
+        └── WAV 48kHz ────► Local File        │  ← pristine recording
+                           (timestamped)
+                              │
+                              ▼ (after hangup)
+                          ┌──────────────────┐
+                          │  Mixer Service    │  ← self-hosted
+                          │  (align + mix)    │
+                          └──────────────────┘
+                              │
+                              ▼
+                          Final MP3/WAV/FLAC
+```
+
+## Requirements
+
+### Phase 1: Local Recording (MVP)
+
+**All clients (Desktop, Android, Web):**
+
+1. **Record toggle**: User can enable "Record this call" before or during a call
+2. **Recording pipeline**: Tap raw PCM from the microphone capture path *before* it enters the codec encoder
+3. **File format**: WAV (48kHz, 16-bit, mono) — simple, universally supported, lossless
+4. **Sync markers**: Embed a monotonic timestamp (ms since call start) at the beginning of the recording, and periodically (every 10s) write a sync marker packet into a sidecar JSON file:
+   ```json
+   {"ts_ms": 30000, "seq": 1500, "wall_clock_utc": "2026-04-07T12:00:30Z"}
+   ```
+   This allows the mixer to align recordings from different participants even if they join at different times.
+5. **Storage**:
+   - Desktop: `~/.wzp/recordings/{room}_{timestamp}.wav`
+   - Android: `Documents/WarzonePhone/{room}_{timestamp}.wav`
+   - Web: IndexedDB blob or File System Access API
+6. **File size estimate**: 48kHz * 16-bit * mono = 96 KB/s = ~5.6 MB/min = ~345 MB/hour
+7. **UI indicator**: Red dot + timer showing recording is active and file size growing
+8. **On hangup**: Close the WAV file, show "Recording saved" with file path/size
+
+### Phase 2: Upload to Mixer
+
+1. **Upload endpoint**: Self-hosted HTTP service (Rust or Go) that accepts WAV uploads with metadata
+2. **Chunked/resumable upload**: Large files need resumable uploads (tus protocol or simple chunked POST)
+3. **Upload metadata**:
+   ```json
+   {
+     "session_id": "uuid",
+     "participant_fingerprint": "xxxx:xxxx:...",
+     "alias": "Alice",
+     "room": "podcast-ep-42",
+     "duration_secs": 3600,
+     "sync_markers": [...],
+     "sample_rate": 48000,
+     "channels": 1,
+     "bit_depth": 16
+   }
+   ```
+4. **Upload UI**: Progress bar after hangup, option to upload now or later
+5. **Retry on failure**: Queue uploads for retry if network is unavailable
+
+### Phase 3: Mixer Service
+
+1. **Alignment**: Use sync markers (wall clock + sequence numbers) to align recordings from all participants to a common timeline
+2. **Silence trimming**: Detect and optionally trim leading/trailing silence
+3. **Normalization**: Per-track loudness normalization (LUFS-based)
+4. **Noise reduction**: Optional per-track noise gate or RNNoise pass
+5. **Output formats**:
+   - Multi-track: ZIP of individual WAVs (aligned, normalized)
+   - Mixed: Single stereo or mono WAV/MP3/FLAC with all participants
+   - Podcast-ready: Loudness-normalized to -16 LUFS (podcast standard)
+6. **Web UI**: Simple dashboard to see sessions, download outputs, preview waveforms
+7. **Self-hosted**: Docker image, single binary, SQLite for metadata
+
+## Implementation Notes
+
+### Recording tap point
+
+The recording must tap *after* AGC (so levels are normalized) but *before* the codec encoder (to avoid compression artifacts). In the current architecture:
+
+```
+Mic → Ring Buffer → AGC → [TAP HERE for recording] → Opus/Codec2 → Network
+```
+
+**Desktop** (`engine.rs`): After `capture_agc.process_frame()`, before `encoder.encode()`
+**Android** (`engine.rs`): Same location — after AGC, before encode
+**CLI** (`call.rs`): After `self.agc.process_frame()` in `CallEncoder::encode_frame()`
+
+### WAV writer
+
+Use a simple streaming WAV writer that:
+- Writes the WAV header with placeholder data length
+- Appends PCM samples as they come
+- On close, seeks back to update the data length in the header
+
+### Sync mechanism
+
+Wall-clock UTC alone is insufficient (clocks drift). The sync strategy:
+1. Each participant records their local monotonic time + wall clock at call start
+2. Periodically (every 10s), each participant writes: `{local_mono_ms, seq_number, utc_iso}`
+3. The mixer uses sequence numbers (which are shared via the wire protocol) as ground truth for alignment, with wall clock as a fallback
+
+### Privacy
+
+- Local recordings never leave the device without explicit user action
+- Upload is manual, not automatic
+- The mixer service processes files and can delete originals after mixing
+- No recording data flows through the relay — only the user's own mic
+
+## Non-Goals (v1)
+
+- Live transcription (future)
+- Video recording (audio only)
+- Automatic upload without user consent
+- Recording other participants' audio (only your own mic)
+- Real-time mixing (post-session only)
+
+## Milestones
+
+| Phase | Scope | Effort |
+|-------|-------|--------|
+| 1a | Local WAV recording on Desktop | 1-2 days |
+| 1b | Local WAV recording on Android | 1-2 days |
+| 1c | Sync markers + metadata sidecar | 1 day |
+| 2a | Upload service (HTTP + storage) | 2-3 days |
+| 2b | Upload UI in clients | 1-2 days |
+| 3a | Mixer: alignment + normalization | 2-3 days |
+| 3b | Mixer: web dashboard | 2-3 days |
+| 3c | Docker packaging | 1 day |

docs/PRD-studio-quality.md

@@ -0,0 +1,56 @@
+# PRD: Studio Quality Tiers (Opus 32k/48k/64k)
+
+## Status: Implemented
+
+Studio quality tiers have been added to the wire protocol and all clients.
+
+## What Was Added
+
+### Wire Protocol (codec_id.rs)
+
+Three new `CodecId` variants using the 4-bit header space (values 6-8):
+
+| CodecId | Wire Value | Bitrate | Frame | Use Case |
+|---------|-----------|---------|-------|----------|
+| Opus32k | 6 | 32 kbps | 20ms | Studio low — noticeable improvement over 24k for voice |
+| Opus48k | 7 | 48 kbps | 20ms | Studio — excellent voice, captures nuance |
+| Opus64k | 8 | 64 kbps | 20ms | Studio high — near-transparent quality |
+
+### Quality Profiles
+
+| Profile | Codec | FEC | Bandwidth (with FEC) |
+|---------|-------|-----|---------------------|
+| STUDIO_32K | Opus 32k | 10% | ~35 kbps |
+| STUDIO_48K | Opus 48k | 10% | ~53 kbps |
+| STUDIO_64K | Opus 64k | 10% | ~70 kbps |
+
+FEC is set to 10% (vs 20% for GOOD) — studio assumes a good network.
+
+### Client Support
+
+| Client | Selection | Status |
+|--------|-----------|--------|
+| Desktop (Tauri) | Quality slider in Settings (8 levels) | Done |
+| CLI | `--profile studio-64k` / `studio-48k` / `studio-32k` | Done |
+| Android | Needs codec picker update in SettingsScreen.kt | TODO |
+| Web | Needs UI | TODO |
+
+### Cross-Codec Interop
+
+All decoder auto-switch paths (call.rs, desktop engine.rs) handle the new codec IDs. A studio-64k client can talk to a codec2-1200 client — the receiver auto-switches.
+
+## When to Use Studio Tiers
+
+- **Podcast recording sessions**: Use studio-64k for best quality (combined with local WAV recording for pristine output)
+- **Music collaboration**: Opus at 48-64k captures instrument harmonics much better than 24k
+- **Good network conditions**: Only useful when bandwidth isn't constrained; the extra bits are wasted on lossy networks
+
+## When NOT to Use
+
+- **Mobile data**: Stick with Auto/GOOD — studio tiers use 2-3x the bandwidth
+- **High packet loss**: Studio profiles use minimal FEC (10%); degraded networks need DEGRADED or CATASTROPHIC profiles with 50-100% FEC
+- **Large group calls**: Each participant's stream multiplies bandwidth; 64k * 10 participants = 640 kbps incoming
+
+## Backward Compatibility
+
+Old clients (before this change) will receive packets with CodecId 6/7/8 which they don't recognize. The `from_wire()` returns `None` for unknown values, causing the packet to be dropped. Old clients can still *send* to new clients fine (they use CodecId 0-5). This is acceptable for a pre-release protocol.