fix(viewer): stop legend gradient leaking through translucent border

[MattNotarangelo]

Background

• The colour legend bar (elevation / distance / gradient / survey-date modes) always showed a tiny sliver of the wrong colour at each end: red above the blue top, blue below the red bottom.
• Cause: the bar's CSS gradient is sized to the padding box but painted out to the border box, so it tiles in the 1px strip under the translucent border — showing the opposite end of the ramp through it.

What Has Changed

• Added background-origin: border-box to .legend-bar so the gradient spans the full border box and has no repeat region under the border.
• Verified with a side-by-side browser repro (old vs new CSS): the artifact reproduces with the old CSS and is gone with the fix. Affects all gradient legend modes since they share this element.

Screenshots/Video

• {Leave for author}

Checklist

• Self-review completed
• Tests added or updated
• Tested locally

🤖 Generated with Claude Code