## Why

On mobile, the course selection panel renders below the specializations panel. When the user scrolls up past the course selection section (e.g., to review or reorder specializations), they lose visibility of their current course selection progress — how many of the 12 elective sets have been picked. A floating bottom banner mirrors the existing top specializations banner, giving the user a persistent summary of course selection state and a quick way to scroll back.

## What Changes

- Add a floating banner at the bottom of the viewport on mobile when the user scrolls above the course selection section
- The banner summarizes course selection progress: number of sets selected out of 12 total
- Tapping the banner scrolls down to the course selection section
- Uses the same animation pattern as the existing `MobileStatusBanner` (slide in/out via translateY)
- Only renders on mobile breakpoint (`max-width: 639px`)

## Capabilities

### New Capabilities
- `mobile-course-banner`: A floating bottom UI component that summarizes course selection progress on mobile when the course selection section is scrolled out of view

### Modified Capabilities
<!-- No existing specs to modify -->

## Impact

- **Components**: New `MobileCourseBanner` component; changes to `App.tsx` to mount it with a second IntersectionObserver on the course selection wrapper
- **Styling**: Second `position: fixed` element in the codebase (bottom: 0), using z-index 1000 consistent with the existing top banner
- **Dependencies**: No new libraries required
- **Performance**: Minimal — one additional IntersectionObserver