fix: model menu highlight matches quiz rows — filled accent tint, no clipped ring

The walked row's ring-1 is a box-shadow painted OUTSIDE the border box;
the list's overflow-y-auto makes overflow-x clip at the padding box too
(CSS: a non-visible axis forces the other to auto), so the 1px halo was
shaved on both sides. Replaced with the quiz rows' bg-accent/40 filled
tint and added px-1 to the list so the highlight never touches the
edges (owner round 5).

components/model-picker.tsx

@@ -312,7 +312,7 @@ export function ModelControl({
 					{catalog && results.length === 0 && (
 						<div className="px-2 py-3 text-center text-muted-foreground">No models match.</div>
 					)}
-					<ul ref={listRef} data-testid="model-list" className="flex max-h-72 flex-col overflow-y-auto">
+					<ul ref={listRef} data-testid="model-list" className="flex max-h-72 flex-col overflow-y-auto px-1">
 						{results.map((m, i) => (
 							<li key={`${m.provider}/${m.id}`}>
 								<button
@@ -321,7 +321,7 @@ export function ModelControl({
 									data-idx={i}
 									onClick={() => pickModel(m)}
 									className={`flex w-full flex-col gap-0.5 rounded-lg px-2 py-1.5 text-left outline-none transition-colors hover:bg-muted ${
-										i === menuIdx ? "bg-muted ring-1 ring-border" : ""
+										i === menuIdx ? "bg-accent/40" : ""
 									}${m.id === effectiveId && i !== menuIdx ? " bg-muted/60" : ""}`}
 								>
 									<span className="flex items-center justify-between gap-2">