fix(differentials): restore visible Safety Snapshot alert tint

[BigSimmo]

Summary

• Fixes a visible-as-white "safety snapshot" alert banner on the differential diagnosis Overview tab (e.g. /differentials/diagnoses/delirium) — the box meant to flag EMERGENT diagnoses with a red/pink tint rendered as a plain white strip.
• Root cause: bg-[color:var(--danger-soft)]/50 compiles (Tailwind v4) to color-mix(in oklab, var(--danger-soft) 50%, transparent). --danger-soft is already near-white in light mode (#fef3f2), so mixing it 50% toward transparent over the white page background is visually indistinguishable from no color at all. Traced to a flattening regression in 6520dbf7 ("restyle: apply Clinical White / Aegean Graphite theme"); every other use of --danger-soft in this file uses full opacity.
• Fix: drop the /50 opacity modifier so the banner uses the design token at full strength, consistent with the rest of differential-detail-page.tsx.

Verification

• npm run verify:cheap — check:runtime, check:github-actions, sitemap:check, lint, and typecheck all passed clean. The test (vitest) step is flaky on this local machine independent of this change: 3 separate full runs each failed a different small set of tests (2–5 files), always via Error: Test timed out in 15000ms in unrelated RAG/Supabase suites (e.g. rag-classifier-memo.test.ts, which explicitly documents a real-time memoization TTL window in its own source comment). This machine had 140+ concurrent Node processes from other sessions during the run. None of the flaky tests import or reference the changed file or component. Deferring to CI's isolated runner as the authoritative signal for test.
• npx prettier --check src/components/differentials/differential-detail-page.tsx — passes (full-repo format:check flags two pre-existing, unrelated files — .claude/settings.json and CLAUDE.md — untouched by this diff and unchanged vs. origin/main).
• npm run ensure + npm run verify:ui (Chromium) — 115/124 passed. The 9 failures are all navigation/URL-timeout style failures spread across unrelated areas (services home, forms home, tablet rail, document search, differentials presentations comparison) — none touch the diagnosis Overview page or the changed component. Consistent with the same local resource-contention pattern seen in the vitest runs, not a functional regression from a single background-color class change.
• Manually verified the fix in the local dev server: confirmed the compiled CSS chunk serves background-color: var(--danger-soft) (no color-mix) for the Safety Snapshot section, replacing the previous near-invisible color-mix(in oklab, var(--danger-soft) 50%, transparent) rule.
• npm run verify:release — not run; out of scope for a single-line CSS fix.
• npm run eval:retrieval:quality — not run; no retrieval/ranking/selection/chunking/scoring behavior changed.
• npm run check:production-readiness — not run; no ingestion/answer-generation/privacy/env/Supabase behavior changed.

Clinical Governance Preflight

Not applicable — this change is a pure CSS/Tailwind class edit to a client-side presentational component. It does not touch ingestion, answer generation, search/ranking, source rendering, document access, privacy, or production env behavior.

Notes

• This worktree's branch was originally based on another session's unmerged WIP commit (648abfa3f, a docs-only change from claude/differentials-search-ux-polish-f2ff06). Per user instruction, the branch was rebased onto origin/main before pushing so this PR contains only the one CSS fix commit.

[supabase]

This pull request has been ignored for the connected project sjrfecxgysukkwxsowpy because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: f76b9cf6-435a-47ef-925d-24d46bae393d

📥 Commits

Reviewing files that changed from the base of the PR and between 405b09e and 4af5065.

📒 Files selected for processing (1)

• src/components/differentials/differential-detail-page.tsx

---

📝 Walkthrough

Summary by CodeRabbit

• Style
  • Updated the Safety Snapshot display with a more prominent danger background for improved visibility.

Walkthrough

The SafetySnapshot container now uses the base danger-soft background color instead of the 50% opacity variant.

Changes

Safety Snapshot Styling

Layer / File(s)	Summary
Update SafetySnapshot background class src/components/differentials/differential-detail-page.tsx	The outer SafetySnapshot section removes the /50 opacity modifier from its danger-soft background class.

Estimated code review effort: 1 (Trivial) | ~2 minutes

🚥 Pre-merge checks | ✅ 11

✅ Passed checks (11 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly matches the change: fixing the Safety Snapshot alert tint in the differentials UI.
Description check	✅ Passed	The description includes the required Summary, Verification, and Notes sections and is specific to the change.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Generated And Sensitive Files	✅ Passed	Only a single TSX source file changed; the diff is a CSS class tweak with no secrets, credentials, logs, caches, or generated artifacts.
Verification Claims	✅ Passed	PASS: The PR lists explicit commands and outcomes (npm run verify:cheap, npx prettier --check, npm run ensure, npm run verify:ui) and marks unrun checks clearly.
Risky Git Or Deployment Actions	✅ Passed	PR only changes one CSS class in a presentation component; no force-push, reset, destructive cleanup, or deployment instructions were added.
Supabase Project And Schema Safety	✅ Passed	Only a CSS class changed in differential-detail-page.tsx; no Supabase project, env, migration, policy, or schema files were modified.
Runtime And Package Manager Integrity	✅ Passed	Diff only changes a Tailwind class; no package.json, lockfile, .npmrc, or engine/runtime files were modified, so Node 24/npm 11 workflow is preserved.
Api Route Failure Handling	✅ Passed	Diff is one CSS class change in a client UI component; no API route, server action, RAG, search, ingestion, or provider logic changed.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/debug-white-strip-bug-bdd5a5

✨ Simplify code

• Create PR with simplified code
• Commit simplified code in branch claude/debug-white-strip-bug-bdd5a5

---

_{Comment @coderabbitai help to get the list of available commands.}