diff --git a/webapp/templates/imaging.html b/webapp/templates/imaging.html
index a639951..4c15007 100644
--- a/webapp/templates/imaging.html
+++ b/webapp/templates/imaging.html
@@ -45,9 +45,9 @@
           {% if s.pctype %}<span class="badge bg-info text-dark ms-2">{{ s.pctype }}</span>{% endif %}
           {% if s.machinenumber %}<span class="badge bg-secondary ms-1">#{{ s.machinenumber }}</span>{% endif %}
           {% if s.intune_device_id %}<div class="small text-muted mt-1">Intune: <code>{{ s.intune_device_id }}</code>
-            <button type="button" class="btn btn-sm btn-outline-secondary py-0 px-1 ms-1"
-                    style="font-size:0.7rem; line-height:1;"
-                    onclick="navigator.clipboard.writeText('{{ s.intune_device_id }}').then(()=>{this.textContent='copied';setTimeout(()=>{this.textContent='copy'},1500)});">copy</button>
+            <button type="button" class="btn btn-sm btn-outline-secondary py-0 px-1 ms-1 copy-btn"
+                    style="font-size:0.7rem; line-height:1; transition: all 0.2s;"
+                    data-copy-text="{{ s.intune_device_id }}">copy</button>
           </div>{% endif %}
         </div>
       </div>
@@ -135,3 +135,37 @@ Content-Type: application/json
 </div>
 
 {% endblock %}
+
+{% block extra_scripts %}
+<script>
+document.addEventListener('click', function(e) {
+    var btn = e.target.closest('.copy-btn');
+    if (!btn) return;
+    var text = btn.getAttribute('data-copy-text');
+    if (!text) return;
+    navigator.clipboard.writeText(text).then(function() {
+        var origText = btn.dataset.origText || btn.textContent;
+        btn.dataset.origText = origText;
+        btn.textContent = 'copied!';
+        btn.classList.remove('btn-outline-secondary');
+        btn.classList.add('btn-success');
+        btn.style.transform = 'scale(1.15)';
+        setTimeout(function() {
+            btn.textContent = origText;
+            btn.classList.remove('btn-success');
+            btn.classList.add('btn-outline-secondary');
+            btn.style.transform = 'scale(1)';
+        }, 1200);
+    }).catch(function(err) {
+        btn.textContent = 'failed';
+        btn.classList.remove('btn-outline-secondary');
+        btn.classList.add('btn-danger');
+        setTimeout(function() {
+            btn.textContent = btn.dataset.origText || 'copy';
+            btn.classList.remove('btn-danger');
+            btn.classList.add('btn-outline-secondary');
+        }, 1500);
+    });
+});
+</script>
+{% endblock %}