:root {
	--background: hsl(180,100%,97%);
	--color: hsl(0,0%,0%);
	--h1-color: hsl(0,0%,100%);
	--h1-bg: hsl(181,70.3%,34.3%);
	--h1-shadow: hsl(0,0%,0%);
	--t-color: hsl(0,0%,100%);
	--t-bg: hsl(181,70.3%,34.3%);
	--t-shadow: hsl(0,0%,0%);
	--pre-bg: hsl(0,0%,100%);
	--pre-color: hsl(0,0%,0%);
	--pre-border-left: hsl(0, 0%, 67%);
	--border-sourceCode: hsl(0,0%,0%);
	--a-color: hsl(0,0%,0%);
	--a-focus-bg: hsl(0,100%,76.7%);
	--numbering: hsl(0,0%,46.7%);
	--mob-color: hsl(0,100%,50%);
	--touch: hsl(0,100%,50%);
}

html[mode=dark]:root {
	--background: hsl(0,100%,3.3%);
	--color: hsl(0,0%,100%);
	--h1-color: hsl(0,0%,100%);
	--h1-bg: hsl(181,70.3%,34.3%);
	--h1-shadow: hsl(0,0%,0%);
	--t-color: hsl(0,0%,100%);
	--t-bg: hsl(181,70.3%,34.3%);
	--t-shadow: hsl(0,0%,1%);
	--pre-bg: hsl(0,0%,0%);
	--pre-color: hsl(0,0%,100%);
	--pre-border-left: hsl(0, 0%, 33%);
	--border-sourceCode: hsl(0,0%,100%);
    --a-color: hsl(0, 0%, 100%);
	--a-focus-bg: hsl(180,100%,23.3%);
	--numbering: hsl(0,0%,53.3%);
	--mob-color: hsl(0,100%,50%);
	--touch: hsl(0,100%,50%);
}