The Goldilocks customizable select height

A deep dive into CSS sizing patterns for the upcoming customizable `<select>` picker element. The post walks through how to set a 'Goldilocks' height — not too small, not too large — using CSS anchor positioning, `calc-size()`, `stretch`, and `flip-block` fallbacks. It covers cross-browser quirks in Chrome, Firefox, and Safari, providing progressive enhancement strategies using `@supports` and fallback hacks for browsers that don't yet support `calc-size()`. The final copy-pasteable CSS snippet handles viewport margins, minimum height (using `calc-size(fit-content, min(size, ...))`) and maximum height simultaneously.