/* Color palette variables — light/dark via OS preference */
:root {
	color-scheme: light dark;

	--tone0: light-dark(#d3d6e1, #15171F);
	--tone1: light-dark(#c5c8d6, #1a1c26);
	--tone2: light-dark(#b6bbcb, #1e212d);
	--tone3: light-dark(#a8adc1, #232634);
	--tone4: light-dark(#9aa0b6, #282c3b);
	--tone5: light-dark(#8d93ab, #2d3142);
	--tone6: light-dark(#7f86a1, #32374a);
	--tone7: light-dark(#727a97, #373c51);
	--tone8: light-dark(#666d8c, #3d4259);

	/* --spot0: light-dark(#869ae8, #ffdd53);
	--spot1: light-dark(#6c85de, #ffd947);
	--spot2: light-dark(#5370d3, #ffd539);
	--spot3: light-dark(#3b5ac8, #ffd026);
	--spot4: light-dark(#2443bd, #FFCC00); */

	/* --base0: light-dark(#FFFFFF, #0F1013);
	--base1: light-dark(#f4f4f4, #141519);
	--base2: light-dark(#e9e9e9, #191b1f);
	--base3: light-dark(#dfdfdf, #1e2025);
	--base4: light-dark(#d4d4d4, #24262c);
	--base5: light-dark(#cacaca, #292b32);
	--base6: light-dark(#c0c0c0, #2f3139);
	--base7: light-dark(#b5b5b5, #343740);
	--base8: light-dark(#ababab, #3a3d47);
	--base9: light-dark(#a1a1a1, #40444e);
	--base10: light-dark(#979797, #464a56);
	--base11: light-dark(#8d8d8d, #4c505d);
	--base12: light-dark(#848484, #525764);
	--base13: light-dark(#7a7a7a, #585d6c);
	--base14: light-dark(#717171, #5f6473);
	--base15: light-dark(#686868, #656a7b);
	--base16: light-dark(#5e5e5e, #6b7183);
	--base17: light-dark(#555555, #72788b);
	--base18: light-dark(#4d4d4d, #787f93); */

	--font0: light-dark(#000000, #FFFFFF);
	--font1: light-dark(#020202, #f0f1f3);
	--font2: light-dark(#101010, #e1e3e7);
	--font3: light-dark(#232323, #d2d5db);
	--font4: light-dark(#383838, #c4c8cf);
	--font5: light-dark(#4f4f4f, #b6bac3);
	--font6: light-dark(#676767, #a8adb7);
	--font7: light-dark(#7f7f7f, #9aa0ab);
	--font8: light-dark(#999999, #8C93A0);
	--font9: light-dark(#FFFFFF, #000000);
}

@font-face {
    font-family: 'Inter';
    src: url('./InterVariable.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
}
/* @import url('https://fonts.googleapis.com/css2?family=Overpass:ital,wght@0,100..900;1,100..900&display=swap'); */
body {
	font-family: 'Inter', sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
}

*,
*::before,
*::after {
	margin: 0;
	padding: 0;
}
*:focus {
	outline: none;
}
img,
picture,
video,
canvas,
svg {
	display: block;
	max-width: 100%;
}
input,
button,
textarea,
select {
	font: inherit;
}
p,
h1,
h2,
h3,
h4,
h5,
h6 {
	overflow-wrap: break-word;
}
p {
	text-wrap: pretty;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	text-wrap: balance;
}
