dialog、details、select、ピッカー付きのinputが開いている間にマッチするCSS疑似クラスです。要素別の属性セレクタを横断して一本化できます。
details・dialog・select・カラーピッカーを開くと枠線が付きます。ピッカー系は:has(:open)で親の背景色も変わります。
対象要素には共通のスタイルだけ当てています。開いている要素にだけ:openが当たって枠線が出ます。selectやinputはピッカーが要素を覆ってしまうので、親セクションに:has(:open)で背景色も付けて開いている状態が見えるようにしています。
開いている間、details:openが当たります。
dialog:openが当たりますselect:openが当たります。input[type="color"]:openが当たります。