a11y: search and newsletter inputs have no accessible label

[royalpinto007]

Two text inputs in the app are announced by screen readers with only their placeholder text, or with nothing at all.

1. Search input

components/post/SearchResults.tsx (around line 120) renders:

<input
  type="text"
  value={query}
  onChange={(e) => setQuery(e.target.value)}
  placeholder="deleted production database, hallucination, Claude…"
  autoFocus
  ...
/>

There is an <h1>Search Cases</h1> above it but no <label> and no aria-label, so the field has no accessible name. Placeholders are not a substitute: they disappear on input and are not reliably announced.

2. Newsletter input

components/newsletter/NewsletterSignup.tsx (around line 42) has a <label> with the text "Get the weekly digest by email", but it is not associated with the input. There is no htmlFor on the label and no matching id on the <input type="email">, so clicking the label does not focus the field and assistive tech does not pair them.

What to do

• Search input: add aria-label="Search cases" (or add a visually hidden <label htmlFor> if you prefer a real label element, using the existing sr-only Tailwind class).
• Newsletter input: give the input an id (for example newsletter-email) and add the matching htmlFor to the existing label.
• While you are in SearchResults.tsx, check the severity level buttons (around line 202) too. They render numbers only, so an aria-label like Severity 3 would help; add one if it is missing.

Keep the visual design unchanged. No new components needed.

Verify

npm run lint
npx tsc --noEmit
npm run format

Then run npm run dev and check the fields in Chrome DevTools under Elements > Accessibility, confirming each input now has a computed name.