fix(ui): fit the ride on a phone

[CodeDotJS]

Summary

• Treat phones as the primary screen, and record that in the phone rule.
• On a narrow screen, the route strip keeps one colored line and wraps the station names underneath so they no longer collide.
• Choice cards stack, action buttons stay in a two-column grid, and type and padding get tighter. The laptop layout is unchanged.

Test plan

• At 320 and 390 pixels, open Vaishali to Sector 42-43 and confirm the station names do not overlap
• Confirm the page does not scroll sideways
• At a laptop width, confirm the route strip still labels each dot