1/* Complementary Palette */
 2:root {
 3  /* Primary Colors */
 4  --primary-0: #052861;
 5  --primary-100: #0950c3;
 6  --primary-200: #3c83f6;
 7  --primary-300: #9ec1fa;
 8  --primary-400: #cee0fd;
 9  
10  /* Secondary Colors */
11  --secondary-0: #613e05;
12  --secondary-100: #c37c09;
13  --secondary-200: #f6af3c;
14  --secondary-300: #fad79e;
15  --secondary-400: #fdebce;
16  
17  /* Accent Colors */
18  --accent-0: #3b0f57;
19  --accent-100: #771fad;
20  --accent-200: #aa52e0;
21  --accent-300: #d4a8f0;
22  --accent-400: #ead4f7;
23  
24  /* Neutral Colors */
25  --neutral-0: #17191c;
26  --neutral-100: #3c4048;
27  --neutral-200: #6b7280;
28  --neutral-300: #a0a6b0;
29  --neutral-400: #d8dadf;
30}
31
32@media (prefers-color-scheme: light) {
33  body {
34    background: var(--neutral-400);
35    color: var(--neutral-100);
36  }
37
38  a {
39    color: var(--accent-100)
40  }
41}
42
43@media (prefers-color-scheme: dark) {
44  body {
45    background: var(--neutral-0);
46    color: var(--neutral-400);
47  }
48
49  a {
50    color: var(--accent-300)
51  }
52}
53
54td {
55  padding: 0.5em 1em;
56}