Update app.py

app.py

@@ -513,6 +513,8 @@ border:2px solid #0f172a;border-radius:50%;z-index:3;}
 .role{font-size:.8rem;color:#94a3b8;margin:0 0 12px;}
 .status{font-size:.8rem;color:#34d399;background:rgba(16,185,129,.12);padding:6px 14px;
 border-radius:999px;display:inline-block;}
+.tap{display:none;margin-top:12px;background:#10b981;color:#fff;border:none;border-radius:999px;
+padding:9px 18px;font-size:.85rem;font-weight:600;cursor:pointer;}
 </style></head><body>
 <audio id="a" style="display:none;"></audio>
 <div class="card"><div class="wrap"><div class="ring" id="ring"></div>
@@ -520,17 +522,20 @@ border-radius:999px;display:inline-block;}
 <div class="waves"><div class="bar"></div><div class="bar"></div><div class="bar"></div>
 <div class="bar"></div><div class="bar"></div></div></div></div>
 <p class="name">__NAME__</p><p class="role">AI Interviewer · مُحاوِرة ذكاء اصطناعي</p>
-<div class="status" id="status">Ready</div></div>
+<div class="status" id="status">Ready</div><br>
+<button class="tap" id="tap">🔊 Tap to hear · اضغط للاستماع</button></div>
 <script>__SCRIPT__</script></body></html>"""
 
 AUDIO_JS = """(function(){
 var a=document.getElementById('a'),c=document.getElementById('av'),
-r=document.getElementById('ring'),s=document.getElementById('status');
+r=document.getElementById('ring'),s=document.getElementById('status'),
+t=document.getElementById('tap');
 a.src='data:audio/mp3;base64,__AUDIO__';
-a.addEventListener('play',function(){c.classList.add('speaking');r.classList.add('active');s.textContent='Speaking...';});
+a.addEventListener('play',function(){t.style.display='none';c.classList.add('speaking');r.classList.add('active');s.textContent='Speaking...';});
 function stop(){c.classList.remove('speaking');r.classList.remove('active');s.textContent='Listening';}
 a.addEventListener('ended',stop);a.addEventListener('pause',stop);
-function p(){a.play().catch(function(){});}
+function p(){var x=a.play();if(x&&x.catch)x.catch(function(){t.style.display='inline-block';s.textContent='Tap to hear';});}
+t.addEventListener('click',function(){a.play().catch(function(){});});
 if(document.readyState==='complete')p();else window.addEventListener('load',p);})();"""