diff --git a/public/app.js b/public/app.js
index 478f4de..c24b904 100644
--- a/public/app.js
+++ b/public/app.js
@@ -303,7 +303,7 @@ async function renderCameraCards() {
                 <label>RTSP Main <input type="text" value="${escAttr(c.rtsp_main)}" data-field="rtsp_main"></label>
                 <label>RTSP Sub <input type="text" value="${escAttr(c.rtsp_sub)}" data-field="rtsp_sub"></label>
                 <label>Username <input type="text" value="${escAttr(c.username)}" data-field="username"></label>
-                <label>Password <input type="password" value="${escAttr(c.password)}" data-field="password"></label>
+                <label>Password <input type="password" placeholder="${c.password && c.password !== '********' ? '••••••••' : 'set password'}" data-field="password" data-password="${escAttr(c.password === '********' ? '' : c.password)}"></label>
             </div>
         </div>
     `).join('');
@@ -401,6 +401,7 @@ document.getElementById('btn-save').addEventListener('click', async () => {
         card.querySelectorAll('[data-field]').forEach(el => {
             const field = el.dataset.field;
             if (el.type === 'checkbox') c[field] = el.checked;
+            else if (field === 'password') c[field] = el.dataset.password || el.value;
             else c[field] = el.value;
         });
         // Ensure checkboxes default to true even if unchecked (hidden inputs override).