Prevent era list containers from receiving tab focus

Add tabIndex={-1} to the event list divs so they are referenceable
by aria-controls but excluded from the keyboard tab order.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: enricobattocchi

src/components/Browse/BrowseClient.tsx

@@ -157,7 +157,7 @@ export default function BrowseClient({ eras: serverEras }: BrowseClientProps) {
                 </span>
               </button>
               {isOpen && (
-                <div id={`era-${era.id}`} className={styles.eventList} role="list">
+                <div id={`era-${era.id}`} className={styles.eventList} role="list" tabIndex={-1}>
                   {era.events.map((event) => (
                     <Link
                       key={event.id}

src/components/BrowseModal.tsx

@@ -150,7 +150,7 @@ export default function BrowseModal({ events, selectedIds, onSelect, onClose }:
                   </span>
                 </button>
                 {isOpen && (
-                  <div id={`browse-era-${era.id}`} className={browseStyles.eventList} role="list">
+                  <div id={`browse-era-${era.id}`} className={browseStyles.eventList} role="list" tabIndex={-1}>
                     {era.events.map((event) => {
                       const alreadySelected = selectedIds.includes(event.id);
                       return (