1  :root {
 2  	--hue: 260;
 3  	--mainaccent: hsl(var(--hue) 100 60);
 4  
 5  	--darker: hsl(var(--hue) 10 4);
 6  	--background: hsl(var(--hue) 10 6);
 7  
 8  	--sl-font: Inter, -apple-system, BlinkMacSystemFont, sans-serif;
 9  }
10  
11  /* Dark mode colors. */
12  :root {
13  	--sl-color-accent-low: hsl(var(--hue) 100 30);
14  	--sl-color-accent: var(--mainaccent);
15  	--sl-color-accent-high: hsl(var(--hue) 100 75);
16  	--sl-color-white: hsl(var(--hue) 5 96);
17  	--sl-color-gray-1: hsl(var(--hue) 5 92);
18  	--sl-color-gray-2: hsl(var(--hue) 10 77);
19  	--sl-color-gray-3: hsl(var(--hue) 10 56);
20  	--sl-color-gray-4: hsl(var(--hue) 10 35);
21  	--sl-color-gray-5: hsl(var(--hue) 10 23);
22  	--sl-color-gray-6: hsl(var(--hue) 10 12);
23  	--sl-color-gray-7: var(--darker);
24  	--sl-color-black: var(--background);
25  }
26  /* Light mode colors. */
27  :root[data-theme="light"] {
28  	--sl-color-accent-low: hsl(var(--hue) 100 75);
29  	--sl-color-accent: var(--mainaccent);
30  	--sl-color-accent-high: hsl(var(--hue) 100 30);
31  	--sl-color-white: var(--darker);
32  	--sl-color-gray-1: hsl(var(--hue) 10 12);
33  	--sl-color-gray-2: hsl(var(--hue) 10 23);
34  	--sl-color-gray-3: hsl(var(--hue) 10 35);
35  	--sl-color-gray-4: hsl(var(--hue) 10 56);
36  	--sl-color-gray-5: hsl(var(--hue) 10 77);
37  	--sl-color-gray-6: hsl(var(--hue) 5 88);
38  	--sl-color-gray-7: hsl(var(--hue) 5 92);
39  	--sl-color-black: hsl(var(--hue) 5 96);
40  }
41  
42  * {
43  	font-feature-settings: "cv03", "cv04", "cv08", "cv09";
44  }
45  
46  main img {
47  	border-radius: 0.5rem;
48  }
49  
50  button,
51  a {
52  	cursor: pointer;
53  }