CSS clamp generator

Builds a `clamp()` that moves a size linearly between two viewport widths — a small size at a small screen, a large size at a large one, and a straight line between them. Drag the preview to see the value at any width.

The middle term of a clamp is a line, and the maths is a line through two points: slope is the size difference divided by the width difference, and the intercept is where that line crosses zero width. Written out it becomes `Xrem + Yvw`, which is why every fluid-type clamp looks like an arbitrary pair of numbers — they are the two coefficients of that line. The intercept is written in `rem` rather than `px` deliberately, and this is the part most hand-written clamps get wrong. A viewport unit does not respond to the reader’s browser font-size setting; a `rem` does. A clamp whose fixed part is in pixels ignores a reader who has set larger text, which fails WCAG 1.4.4 — the requirement that text can be resized to 200%. Keeping the intercept in rem means their setting still moves the result. One caution on range: a very steep slope makes text jump noticeably as a window is resized, and a very shallow one makes the whole exercise pointless. A useful heuristic is that the largest size should not be more than about twice the smallest.