diff --git a/.jules/palette.md b/.jules/palette.md
new file mode 100644
index 0000000..e9d203f
--- /dev/null
+++ b/.jules/palette.md
@@ -0,0 +1,3 @@
+## 2024-10-24 - Search Input Interaction and Accessibility
+**Learning:** Reliance on `on:keyup` for search inputs fails to capture events like pasting or drag-and-drop, leading to missed user intent. `on:input` is the comprehensive solution. Additionally, visual loading spinners (like `CircularProgress`) are invisible to screen readers without an explicit `aria-label`.
+**Action:** Always prefer `on:input` for text fields and ensure every loading state has a corresponding `aria-label` or `aria-live` region.
diff --git a/src/routes/DomainSearch.svelte b/src/routes/DomainSearch.svelte
index 2cde1b3..63f340c 100644
--- a/src/routes/DomainSearch.svelte
+++ b/src/routes/DomainSearch.svelte
@@ -15,7 +15,7 @@
 	let domainName: string = '';
 	let nameSearched: string = '';
 	let isLoading: boolean = false;
-	let debounceTimer: NodeJS.Timeout;
+	let debounceTimer: ReturnType<typeof setTimeout>;
 
 	$: errors = invalid ? validator.getErrors() : [];
 	$: invalid = domainName !== '' && !validator.validate(domainName, { raiseError: false });
@@ -55,7 +55,7 @@
 			class="domain-input"
 			variant="outlined"
 			bind:value={domainName}
-			on:keyup={() => debounce()}
+			on:input={() => debounce()}
 			bind:invalid
 			label="Domain name"
 			withTrailingIcon
@@ -63,7 +63,7 @@
 		>
 			<svelte:fragment slot="trailingIcon">
 				<div class="submit">
-					<IconButton aria-label="search">
+					<IconButton aria-label="search" type="submit">
 						<Icon icon="search" />
 					</IconButton>
 				</div>
@@ -81,7 +81,11 @@
 				<div class="card-content">
 					<span>{nameSearchedLabel}</span>
 
-					<CircularProgress style="height: 32px; width: 32px;" indeterminate />
+					<CircularProgress
+						style="height: 32px; width: 32px;"
+						indeterminate
+						aria-label="Loading domain search results"
+					/>
 				</div>
 			</CardContent>
 		</Card>