Duh. I finally figured a way around my minor frustration with CSS - lack of “variables”.

In the past, I have usually structured css files like this exaggerated example:

body{color:#CCCCCC; font-family:"Arial";....}
h1{color:#00cc77; font-family:"Helvetica"; ....}
h2{color:#00cc77; font-family:"Helvetica";....}
h3{color:#00cc77; font-family:"Helvetica";....}
h4{color:#882200; font-family:"Helvetica";....}
p{color:#882200; .....}
table{color:#882200;....}
table.th {color:#00cc77; font-family:"Helvetica"; ....}

I have always be frustrated when I want to experiment with changing a value that appeared in multiple places. I just realized my own stupidity last night. What if I move most same values together - like this:

body{color:#CCCCCC;}
h1, h2, h3, table.th {color:#00cc77;}
h4, p, table {color:#882200;}

body {font-family:"Arial";}
h1, h2, h3, h4,table.th { font-family:"Helvetica"; }

body{ ;....}
h1{ ....}
h2{ ....}
h3{ ....}
h4{ ....}
table.th { ....}

Experimentation becomes much easier.