Fix sponsor directory contrast and card treatment in dark mode

Outcome

The public /sponsors directory must remain legible in dark mode while preserving sponsor logos in the form supplied by their owners. The current featured cards force a white card but render body copy with theme-muted colors, producing low contrast.

Normative references:

• _docs/design/design-system.md
• _docs/architecture/database-only-content.md
• core/tests/test_sponsor_directory.py

Product decision

Separate the logo presentation from the card body. A neutral/light logo plate may preserve authored logo colors in either theme; the sponsor name, description, and action use theme-native card/body tokens. Do not recolor logos to compensate for the card contrast bug.

Scope

• Recompose featured sponsor cards on /sponsors so logo plate and content surface have explicit, compatible light/dark treatments.
• Define theme-appropriate text, link, border, shadow, past-supporter chip, focus, hover, and active states.
• Preserve graceful handling when a logo asset is absent or cannot resolve.
• Regression-check homepage and events sponsor placements if any shared sponsor or card primitive changes.

Non-goals

• Changing sponsor records, order, placement, descriptions, destinations, or lifecycle.
• Editing, filtering, inverting, regenerating, or replacing logo image files.
• Redesigning the homepage, events hub, Studio sponsor editor, or sponsor ingestion.
• Introducing hardcoded sponsor content or a file/runtime fallback.

Dependencies

• No external dependency. Database-owned Sponsor and placement queries remain authoritative.
• Prefer page-local styles. If a shared primitive is changed, its full consumer set becomes required regression scope.

Acceptance criteria

• Featured card body text and links meet WCAG AA contrast in light and dark themes (4.5:1 for normal text, 3:1 for large text); meaningful boundaries and focus indicators meet 3:1 against adjacent colors.
• Each logo is shown unmodified with object-fit: contain inside a bounded, visually distinct plate that remains legible in both themes; transparent, wide, tall, and missing logos do not collapse or stretch the card.
• Card body surfaces use design-system theme tokens and never pair a forced white background with dark-theme muted text.
• Sponsor links retain their stored destinations and target, rel="sponsored noopener noreferrer", accessible sponsor-name label, and visible keyboard focus.
• Past-supporter chips have readable foreground/background/border contrast in both themes and wrap without clipping.
• Card, link, and chip hover/focus/active states do not rely on color alone and respect reduced-motion preferences.
• The existing database query/order, missing-logo degradation, page metadata, and database-only-content tests remain unchanged/passing.
• At 1440, 768, 390, and 320 CSS px, long names/descriptions, all logo aspect ratios, and past-supporter chips have no overlap or document-level horizontal overflow. Interactive targets are at least 44 CSS px where the design presents a button-like action.
• If shared sponsor/card CSS or markup changes, homepage and /events keep their accepted light/dark layout and links.

Verification scenarios

Repository

1. Run sponsor directory/query, sponsor model/import, design-system shell, shared primitive, and accessibility tests.
2. Render fixtures for transparent wide/tall logos, missing/stale logo keys, long copy, and no past supporters; assert one bad logo never takes down the page.
3. Run the project contrast/accessibility checker against both themes and record measured pairs.

Browser

1. Compare /sponsors in light and dark mode at 1440/768/390/320. Inspect the logo plate separately from the card body.
2. Tab through every sponsor action and confirm focus remains visible without content shifting.
3. Toggle reduced motion and exercise hover/focus states.
4. If a shared primitive changed, open the homepage sponsor band and /events in both themes and verify content/order/destinations and responsive layout.
5. Confirm document.documentElement.scrollWidth === document.documentElement.clientWidth at every width.

Evidence to attach

• Before/after full-page screenshots using .tmp/screenshots/sponsors-current/ as baseline, desktop and mobile in both themes.
• Contrast measurements and focused test results.

Start at the public /sponsors entry point and read _docs/design/design-system.md alongside core/tests/test_sponsor_directory.py. Inspect the existing featured-card and logo behavior, then verify both themes, responsive widths, focus states, and missing-logo handling against the acceptance criteria. Run the named sponsor directory tests and the required accessibility and browser checks; done means the cards remain readable without changing stored sponsor data or logo files.