[#171] Replace native selects with custom dark-themed dropdown

[realproject7]

Summary

• New Select.tsx component: custom dropdown with dark theme, keyboard navigation (arrow keys, enter, escape), click-outside-to-close, hover/active states
• Replaced all 3 native <select> elements: chain page storyline selector, register-agent genre + model selectors
• Removed select option CSS from globals.css (no longer needed)

Fixes #171

Test plan

• tsc --noEmit — zero errors
• next build — clean
• vitest run — 22/22 tests pass
• Open dropdown on chain page — dark themed options, accent highlight on selected
• Keyboard: arrow keys navigate, enter selects, escape closes
• Click outside dropdown to close
• Test at 375px width

🤖 Generated with Claude Code

[project7-interns]

T2b APPROVE

Well-built custom Select component:

1. Select.tsx — Full keyboard navigation (arrows, enter, escape, space to open), click-outside-to-close via mousedown listener, scroll-into-view for focused items. Proper ARIA attributes (haspopup, expanded, listbox, option, selected). Clean controlled API.

2. Integration — All 3 native selects replaced. Chain page correctly handles number↔string conversion. Register-agent page is straightforward.

3. Cleanup — select option CSS removed from globals.css. Base select appearance styles remain (harmless if no native selects left).

No issues found.

[project7-interns]

Verdict: REQUEST CHANGES

Summary

The custom dropdown implementation is close, but it regresses existing behavior by removing the ability to clear a selection back to the placeholder/empty state. The replaced native selects all exposed an empty option ("Select ..."), and the new component no longer provides any way to re-select that blank value once a user has picked something.

Findings

• [medium] Select does not preserve the empty placeholder option, so the chain storyline selector and both register-agent selectors can no longer be cleared after a value has been chosen.
  • File: src/components/Select.tsx:32
  • Suggestion: Treat the placeholder as a real first option (for example value: "") or otherwise add an explicit clear/reset path so existing blank-state behavior is preserved.

Decision

Requesting changes because the custom component removes an existing user flow that the native selects supported: returning to the empty placeholder state. Once that is restored, the rest of the dropdown replacement looks appropriately scoped to #171.

[project7-interns]

Verdict: APPROVE

Summary

The follow-up commit restores the blank-state behavior by making the placeholder a selectable empty-value option in the custom dropdown. That closes the functional regression from the first review, and the custom select replacement now looks appropriately scoped to #171.

Findings

• [info] No remaining blocking findings after 4c1da55.
  • File: src/components/Select.tsx:32
  • Suggestion: None.

Decision

Approving because the prior clear-to-empty regression is resolved, the custom dropdown still satisfies the styling/accessibility goals of #171, and lint-and-typecheck plus local typecheck, test, and build validation pass.