:root {
	/* Rosé Pine Dawn */
	--rp-base: #faf4ed;
	--rp-surface: #fffaf3;
	--rp-overlay: #f2e9e1;
	--rp-muted: #9893a5;
	--rp-subtle: #797593;
	--rp-text: #575279;
	--rp-love: #b4637a;
	--rp-gold: #ea9d34;
	--rp-rose: #d7827e;
	--rp-pine: #286983;
	--rp-foam: #56949f;
	--rp-iris: #907aa9;
	--rp-highlight-low: #f4ede8;
	--rp-highlight-med: #dfdad9;
	--rp-highlight-high: #cecacd;
}

@media (prefers-color-scheme: dark) {
	:root {
		/* Rosé Pine */
		--rp-base: #191724;
		--rp-surface: #1f1d2e;
		--rp-overlay: #26233a;
		--rp-muted: #6e6a86;
		--rp-subtle: #908caa;
		--rp-text: #e0def4;
		--rp-love: #eb6f92;
		--rp-gold: #f6c177;
		--rp-rose: #ebbcba;
		--rp-pine: #31748f;
		--rp-foam: #9ccfd8;
		--rp-iris: #c4a7e7;
		--rp-highlight-low: #21202e;
		--rp-highlight-med: #403d52;
		--rp-highlight-high: #524f67;
	
		/* Rosé Pine Moon */
		/* --rp-base: #232136; */
		/* --rp-surface: #2a273f; */
		/* --rp-overlay: #393552; */
		/* --rp-muted: #6e6a86; */
		/* --rp-subtle: #908caa; */
		/* --rp-text: #e0def4; */
		/* --rp-love: #eb6f92; */
		/* --rp-gold: #f6c177; */
		/* --rp-rose: #ea9a97; */
		/* --rp-pine: #3e8fb0; */
		/* --rp-foam: #9ccfd8; */
		/* --rp-iris: #c4a7e7; */
		/* --rp-highlight-low: #2a283e; */
		/* --rp-highlight-med: #44415a; */
		/* --rp-highlight-high: #56526e; */
	}
}

:root, body {
	padding: 0;
	margin: 0;
}

main {
	padding: 2rem;
}

:root {
	background-color: var(--rp-base);
	color: var(--rp-text);

	font-family: Inter, sans-serif;
	font-feature-settings: 'liga' 1, 'calt' 1; /* fix for Chrome */
}

@supports (font-variation-settings: normal) {
	:root { font-family: InterVariable, sans-serif; }
}

a {
	color: var(--rp-love);
	transition: 0.2s;
}
a:hover {
	color: var(--rp-rose);
}