Turn a UI screenshot into a scoped Copilot Vision task instead of a vague match this request

I am attaching a screenshot. Before proposing any code change, describe back what you actually
see in the image, specifically with respect to The two toggle switches should be visually identical in size — only their label text should differ. — do not skip straight to a
diff based on a general impression of the image.

WHAT THE SCREENSHOT SHOWS
A screenshot of the /pricing page showing the annual-plan toggle switch rendered noticeably smaller than the monthly-plan toggle next to it.

COMPONENT OR FILE THIS SHOULD MAP TO
components/pricing/PlanToggle.tsx

WHAT TO COMPARE SPECIFICALLY
The two toggle switches should be visually identical in size — only their label text should differ.

VIEWPORT OR DEVICE CONTEXT FOR THE SCREENSHOT
Captured at 1440px desktop width in Chrome, not a mobile viewport.

Work in this order:
1. Describe the specific visual detail in the image relevant to The two toggle switches should be visually identical in size — only their label text should differ. — an exact
   spacing, color, alignment, missing element, or wrapped text — in concrete terms a reviewer
   could check against the image themselves, not an impression like 'the spacing looks off.'
2. Read components/pricing/PlanToggle.tsx and state what the current code actually produces for the
   same detail, so the comparison is between two concrete things rather than between the image and
   a memory of what the code probably does.
3. State the specific difference between steps 1 and 2 — the actual delta this change needs to
   close, not a rewrite of the whole component because a full rewrite happened to be easier to
   generate than a scoped fix.
4. Propose the smallest change that closes that specific delta, scoped only to
   The two toggle switches should be visually identical in size — only their label text should differ. — if closing it plausibly requires touching something outside
   components/pricing/PlanToggle.tsx, say so explicitly and why, rather than silently expanding scope
   to make the fix easier.

This is acceptable once both toggles measure the same width and height in the rendered DOM, not just visually similar in a screenshot.

CONSTRAINTS
- If the screenshot is ambiguous about an exact value — a color that could be one of two nearby
  shades, a spacing that could be 8px or 12px depending on how the image was captured or scaled —
  say so and check the actual design tokens or existing CSS values already in
  components/pricing/PlanToggle.tsx or its stylesheet before guessing a number that merely looks
  approximately right in the image.
- Do not infer functionality from the screenshot that a static image cannot actually show, such as
  a hover state, an animation, or a loading state, unless A screenshot of the /pricing page showing the annual-plan toggle switch rendered noticeably smaller than the monthly-plan toggle next to it. states which
  state the image was captured in — a still image of a button says nothing certain about what its
  hover or disabled state looks like, and inventing one is a guess dressed as an observation.