/*==conf */
:root{
	--accent: #8e3;
	--head: #3c3;
	--bg: #020;
	--fg: #afa;
	--outside: #080c08;
	@media (prefers-color-scheme: light){
		--accent: #5a5;
		--head: #383;
		--bg: #fbfdfb;
		--fg: #030;
		--outside: #4e784e;
	}
}

/*==base */
:root{
	accent-color: var(--accent);
	background: var(--outside);
	color-scheme: dark light;
	font-family: meslo, "Meslo LG S", menlo, "Menlo Regular", "Apple Color Emoji", cousine, Consolas, "Courier New", courier, monospace;
}
body{
	background: var(--bg);
	color: var(--fg);
	padding: 1em 2em;
	margin: auto;
	max-width: 60em;
	&:after{
		color: var(--accent);
		content: '<toby/>';
	}
}
a{
	color: var(--accent);
	&:focus,
	&:hover,
	&:visited{
		color: var(--head);
	}
}
b, h1, h2, h3, strong{
	color: var(--head);
}
h1{
	border-bottom: 1px solid;
}

/*==links boxes */
.linkBox{
	flex: 1 1 10em;
}
.links{
	display: flex;
	flex-wrap: wrap;
	gap: 0 3em;
	justify-content: space-between;
	ul{
		padding-left: 1em;
	}
}