I know your issue is solved, but this is for information only. So if one goes the CSS route, it is possible to change the caption button icons and their backgrounds and also the hover colors, to have slightly more contrast (Firefox already contains the High-Contrast icons, but I have no idea why it doesn't have some option for the user to set them).
Code:
/* Colors of Caption Button Icons (and their Background if wanted- eg see comment under .titlebar-min) */
/*Icons and their background*/
.titlebar-min {
list-style-image: url(chrome://browser/skin/window-controls/minimize-highcontrast.svg) !important;
color: Black !important;
/* background: rgba(222,222,222,1) !important; */
}
.titlebar-max {
list-style-image: url(chrome://browser/skin/window-controls/maximize-highcontrast.svg) !important;
color: Black !important;
}
.titlebar-restore {
list-style-image: url(chrome://browser/skin/window-controls/restore-highcontrast.svg) !important;
color: Black !important;
}
.titlebar-close {
list-style-image: url(chrome://browser/skin/window-controls/close-highcontrast.svg) !important;
color: Black !important;
}
/*Hover colors*/
.titlebar-min:hover{
color: White !important;
list-style-image: url(chrome://browser/skin/window-controls/minimize-highcontrast.svg) !important;
background: rgba(0,155,0,1.00) !important;
}
.titlebar-max:hover{
list-style-image: url(chrome://browser/skin/window-controls/maximize-highcontrast.svg) !important;
color: White !important;
background: rgba(0,155,0,1.00) !important;
}
.titlebar-restore:hover{
color: White !important;
list-style-image: url(chrome://browser/skin/window-controls/restore-highcontrast.svg) !important;
background: rgba(0,155,0,1.00) !important;
}
.titlebar-close:hover{
background: rgba(255,15,15,1.00) !important;
}
nb: this only works when show "Title Bar" is disabled in "Customise Toolbar".