diff --git a/services/web-ui/public/capture.html b/services/web-ui/public/capture.html
index ae8cf6e..8ccec4c 100644
--- a/services/web-ui/public/capture.html
+++ b/services/web-ui/public/capture.html
@@ -280,10 +280,10 @@
                             </div>
 
                             <div class="control-buttons">
-                                <button class="btn btn-record btn-start" id="startBtn" onclick="startRecording()">
+                                <button class="btn btn-record btn-start" id="startBtn" onclick="handleStartRecording()">
                                     ⏺ START
                                 </button>
-                                <button class="btn btn-record btn-stop" id="stopBtn" onclick="stopRecording()" disabled>
+                                <button class="btn btn-record btn-stop" id="stopBtn" onclick="handleStopRecording()" disabled>
                                     ⏹ STOP
                                 </button>
                             </div>
@@ -333,6 +333,7 @@
             recentCaptures: [],
             recordingTime: 0,
             recordingInterval: null,
+            sessionId: null,
         };
 
         // ============================================================
@@ -499,10 +500,10 @@
                 const item = document.createElement('div');
                 item.className = 'capture-item';
                 item.innerHTML = `
-                    <div class="capture-item-name">${capture.clip_name || 'Untitled'}</div>
+                    <div class="capture-item-name">${capture.clip_name || capture.name || 'Untitled'}</div>
                     <div class="capture-item-meta">
                         <span>${formatDuration(capture.duration || 0)}</span>
-                        <span>${new Date(capture.captured_at).toLocaleDateString()}</span>
+                        <span>${new Date(capture.created_at || capture.captured_at).toLocaleDateString()}</span>
                     </div>
                 `;
                 container.appendChild(item);
@@ -511,11 +512,13 @@
 
         // ============================================================
         // RECORDING CONTROL
+        // Named handleStartRecording / handleStopRecording to avoid
+        // shadowing the api.js startRecording / stopRecording functions.
         // ============================================================
 
-        async function startRecording() {
-            if (!captureState.currentProject || !captureState.currentBin || !captureState.currentDevice) {
-                alert('Please select project, bin, and device');
+        async function handleStartRecording() {
+            if (!captureState.currentProject || !captureState.currentDevice) {
+                alert('Please select project and device');
                 return;
             }
 
@@ -527,15 +530,16 @@
             try {
                 updateStatusBar('Starting recording...');
                 const result = await startRecording(
-                    captureState.currentDevice,
+                    parseInt(captureState.currentDevice, 10),
                     captureState.currentProject,
-                    captureState.currentBin,
+                    captureState.currentBin || null,
                     captureState.currentClipName
                 );
 
                 if (result.success) {
                     captureState.isRecording = true;
                     captureState.recordingTime = 0;
+                    captureState.sessionId = result.data.session_id || null;
                     startTimecodeUpdate();
                     updateRecordingUI();
                     updateStatusBar();
@@ -548,13 +552,14 @@
             }
         }
 
-        async function stopRecording() {
+        async function handleStopRecording() {
             try {
                 updateStatusBar('Stopping recording...');
-                const result = await stopRecording();
+                const result = await stopRecording(captureState.sessionId);
 
                 if (result.success) {
                     captureState.isRecording = false;
+                    captureState.sessionId = null;
                     clearInterval(captureState.recordingInterval);
                     updateRecordingUI();
                     loadCaptureData();