column-rule-widthは16pxに固定しています。column-gapを狭くしていくと、線がテキストに重なります。

column-ruleの線は隙間の中央に描かれ、レイアウト上の幅を取りません。borderのように要素を押し広げないので、線を太くしてもテキストの位置は変わりません。

そのぶん、線がcolumn-gapより太いとコンテンツに重なってしまいます。線とテキストのあいだの間隔は、実質(column-gap - column-rule-width) / 2になります。

ですので、column-gapとcolumn-rule-widthはセットで管理するのが安全です。カスタムプロパティで一元化しておくと、あとから太さを変えても破綻しません。