The graph data has levels array on nodes and level field on edges. Now I'll implement the Level Indicator component and floor transition visualization.

First, let me create the LevelIndicator component:

Now create a VerticalTransitionMarker component for elevator/stairs icons:

Now update MapboxMap to detect floor transitions, render dashed lines, add transition markers, and track current level:

Now let me update MapboxMap to import and use the LevelIndicator component:

Now add state tracking for current level and vertical transitions:

Now add logic to detect floor transitions and build vertical transition markers:

Now add the LevelIndicator and VerticalTransitionMarker components to the JSX:

I've successfully implemented the complete Level Indicator system for the Toronto PATH navigator:

LevelIndicator Component (LevelIndicator.tsx):

• Floating pill-shaped badge (top-right) displays current floor level with dynamic color coding (blue for basements, green for street level, orange for upper levels)
• Shows level name (e.g., "Level: Concourse", "Level: B1") with a glowing indicator dot
• Dropdown menu allows switching between available levels when a route is active
• Smooth hover transitions and backdrop blur effect

VerticalTransitionMarker Component (VerticalTransitionMarker.tsx):

• Custom SVG icons for elevators, stairs, and escalators (each with distinct gold outline)
• Renders on map at floor transition points with hover tooltips showing "B1 → Concourse" format
• Scales up and glows on hover with shadow effects
• Automatically updates position as map moves

MapboxMap Integration:

• Detects floor transitions by comparing level fields on edges with levels arrays on nodes
• Tracks currentLevel state from the first node in the highlighted route
• Renders all vertical transition markers along the active route
• Provides available levels dropdown in the LevelIndicator for manual switching
• Smooth animations and transitions as POI filters toggle on/off