Google back to gray by hdyzen

/* ==UserStyle==
@name           Google back to gray
@namespace      github.com/zenstorage
@version        0.0.3
@description    use google grey colors
@author         hdyzen
==/UserStyle== */

@-moz-document domain("www.google.com") {
	:root {
		--primary-color: #c1e6fe;
		--primary-con-color: hsl(218, 20.8%, 28.2%);
		--surf-dim-color: hsl(225, 6%, 13%);
		--surf-bright-color: hsl(213, 6%, 32%);
		--surf-con-color: hsl(210, 5%, 16%);
		--surf-con-low-color: hsl(213, 5%, 39%);
		--surf-con-lowest-color: hsl(0, 0%, 11%);
		--surf-con-lowest-s-color: hsl(0, 0%, 9%);
		--on-primary-color: #b3d7ef;
		--on-surf-dim-color: hsl(225, 5%, 20%);
		--on-surf-bright-color: hsl(213, 5%, 39%);
		--on-surf-con-color: hsl(210, 4%, 23%);
		--on-surf-con-low-color: hsl(213, 4%, 46%);
		--on-surf-con-lowest-color: hsl(0, 0%, 18%);
		--on-surf-con-lowest-s-color: hsl(0, 0%, 16%);
		--outline-surf-con-low-color: hsl(213, 5%, 39%);
	}
	body.srp, body, #searchform > div, [role="list"] > div > g-popup >[role="button"] > div, #search .g, #rso > div > div > div, .appbar, #appbar > div > div > div > [role="navigation"], div:has(> .card-section), div:has(> a[data-ti="overview"][role="link"]), #rso > div > div > div[data-rpos] > div, block-component > .g > div, [data-sbu^="/setprefs"] > div, #center_col + div > div {
		background-color: var(--surf-dim-color);
	}
	.logo + div {
		background-color: var(--surf-bright-color);
		
		&:hover {
			background-color: var(--on-surf-bright-color);
		}
	}
	#bres div[class]:has(> div > div:not([class]) > a) {
		background-color: var(--surf-con-lowest-color);
	}
	div[class*=" "] > .logo + div, div[class*=" "] > .logo + div:hover, [data-bkt="searchbox"] ~ div[class]:has(> div[id] > [role="presentation"]) {
		background-color: var(--on-surf-dim-color);
	}
	.sbhl {
		background-color: var(--surf-bright-color);
	}
	#fbar {
		background-color: var(--surf-con-lowest-s-color);
	}
}