# Check-in Overlay Refinement

## Objective
Adjust only the check-in page background overlay so the left side has a deeper, thicker ink-green/navy color behind the welcome copy and live clock, then fades smoothly toward the right. Preserve the visible church photograph and keep the form area lighter.

## Scope
- Edit only `assets/portal/css/user-portal.css`.
- Scope selectors to `.checkin-page`; visitor/member pages must not change.
- Do not change HTML, PHP, JS, layout, clock, GPS, forms, alerts, routes, or mobile navigation.

## Direction
- Desktop: start around rgba(8,26,23,.90-.94) at 0%; remain substantial behind the left text through roughly 28-35%; fade to about .42 around 58-65%; finish near .16-.24 at the far right.
- Avoid a sharp band; use 4-5 stops or a subtle combination of linear/radial gradients.
- The photo must remain visibly recognizable, especially toward the right.
- Left white/brass typography must have excellent contrast.
- Mobile: use a top-to-bottom or carefully adapted overlay that protects header/clock legibility without making the entire photo header muddy. Do not blindly apply desktop horizontal stops to the narrow crop.
- Preserve the existing decorative overlay only if it improves the result; prevent it from flattening the directional fade.

## Validation
- Evaluate at 1440, 768, and 375 widths.
- Confirm left copy/clock has strong contrast, right image remains visible, and form/card composition is unchanged.

