diff --git a/web/app.js b/web/app.js
index 5133ca0..dd5531d 100644
--- a/web/app.js
+++ b/web/app.js
@@ -168,7 +168,7 @@ document.getElementById('leases-body').addEventListener('click', function (e) {
     // Show inline form, hide the Pin button
     var row = btn.closest('td');
     row.querySelector('.pin-btn').style.display = 'none';
-    row.querySelector('.pin-form').style.display = 'inline';
+    row.querySelector('.pin-form').style.display = 'inline-flex';
     row.querySelector('.pin-hostname').focus();
   }
 });
diff --git a/web/style.css b/web/style.css
index 738785d..d97e686 100644
--- a/web/style.css
+++ b/web/style.css
@@ -83,12 +83,26 @@ h1 {
   cursor: not-allowed;
 }
 
+.pin-form {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+}
 .pin-form input[type="text"] {
   padding: 4px 8px;
-  border: 1px solid #dcdde1;
+  border: 1px solid #0984e3;
   border-radius: 3px;
   font-size: 13px;
-  vertical-align: middle;
+  width: 130px;
+  outline: none;
+}
+.pin-form input[type="text"]:focus {
+  border-color: #0773c5;
+  box-shadow: 0 0 0 2px rgba(9,132,227,0.2);
+}
+.pin-form .btn {
+  padding: 3px 8px;
+  font-size: 12px;
 }
 
 table {