@import "fonts";

$monospaceFont: "Fira Mono", "monospace";

$contentWidth:   72rem;
$separatorWidth: 0.25rem;

:root {
	font-family: "Raleway", "sans-serif";
}

* {
	margin:  0;
	padding: 0;

	box-sizing: border-box;
}

body {
	--backgroundColour: oklch( 20% 0.029600 253.71);
	--foregroundColour: oklch( 25% 0.029600 253.71);
	--textColour:       oklch(100% 0          0);

	--padding: 1rem;

	background-color: var(--backgroundColour);
	color:            var(--textColour);
	z-index:          -1;

	@media (pointer: coarse) {
		--padding: 2rem;
	}

	&.light {
		--backgroundColour: oklch(96.875% 0 0);
		--foregroundColour: oklch(93.750% 0 0);
		--textColour:       oklch(25%     0 0);
	}
}

a, a:visited {
	color: var(--textColour);
}

code {
	font-family: $monospaceFont;
}

ul {
	list-style: none;

	li p::before {
		content: "\2022\0020";
	}
}

@import "header.scss";
@import "page.scss";
@import "footer.scss";