diff --git a/frontend/src/App.css b/frontend/src/App.css
index 056df2a..588e017 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -279,6 +279,18 @@ input[type="text"]:focus {
   background: var(--bg);
 }
 
+input[type="text"].input-invalid {
+  border-color: var(--error);
+  background: var(--error-bg);
+}
+
+.field-hint {
+  color: var(--error);
+  font-size: 11px;
+  margin-top: 0.35rem;
+  letter-spacing: 0.02em;
+}
+
 button {
   padding: 0.6rem 1.2rem;
   border: 1px solid var(--border);
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index d43e95d..c09fe5c 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -286,13 +286,15 @@ function CreateVouchSection({
             type="text"
             placeholder="handle to vouch for"
             value={handle}
+            className={handle.includes("@") ? "input-invalid" : ""}
             onChange={(e) => setHandle(e.target.value)}
             disabled={submitting}
           />
-          <button type="submit" disabled={submitting || !handle.trim()}>
+          <button type="submit" disabled={submitting || !handle.trim() || handle.includes("@")}>
             {submitting ? "Creating..." : "Vouch"}
           </button>
         </div>
+        {handle.includes("@") && <p className="field-hint">enter a handle, not a domain (e.g. alice.bsky.social)</p>}
       </form>
       {error && <div className="error">{error}</div>}
       {result && <pre className="success">{result}</pre>}
@@ -334,13 +336,15 @@ function CheckVouchSection({ agent }: { agent: OAuthUserAgent }) {
             type="text"
             placeholder="handle to check"
             value={handle}
+            className={handle.includes("@") ? "input-invalid" : ""}
             onChange={(e) => setHandle(e.target.value)}
             disabled={loading}
           />
-          <button type="submit" disabled={loading || !handle.trim()}>
+          <button type="submit" disabled={loading || !handle.trim() || handle.includes("@")}>
             {loading ? "Checking..." : "Check"}
           </button>
         </div>
+        {handle.includes("@") && <p className="field-hint">enter a handle, not a domain (e.g. alice.bsky.social)</p>}
       </form>
       {error && <div className="error">{error}</div>}
       {result && (