@troennes/minium 0.1.1 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,159 @@
1
+ @layer tokens, theme, reset, base, layout, components, project, utilities;
2
+
3
+ /* Theme: grass (neutral: olive, primary: grass, accent: yellow, success: teal, warning: orange). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
4
+ @layer theme {
5
+ :root {
6
+ /* neutral: olive */
7
+ --neutral-1: light-dark(#fcfdfc, #111210);
8
+ --neutral-2: light-dark(#f8faf8, #181917);
9
+ --neutral-3: light-dark(#eff1ef, #212220);
10
+ --neutral-4: light-dark(#e7e9e7, #282a27);
11
+ --neutral-5: light-dark(#dfe2df, #2f312e);
12
+ --neutral-8: light-dark(#b9bcb8, #5c625b);
13
+ --neutral-11: light-dark(#60655f, #afb5ad);
14
+ --neutral-12: light-dark(#1d211c, #eceeec);
15
+ --neutral-a2: light-dark(#00490007, #f1f2f008);
16
+ --neutral-a3: light-dark(#00200010, #f4f5f312);
17
+ --neutral-a4: light-dark(#00160018, #f3fef21a);
18
+ --neutral-a5: light-dark(#00180020, #f2fbf122);
19
+ --neutral-a6: light-dark(#00140028, #f4faed2c);
20
+ --neutral-a7: light-dark(#000f0033, #f2fced3b);
21
+
22
+ /* primary: grass */
23
+ --primary-7: light-dark(#94ce9a, #366740);
24
+ --primary-9: light-dark(#46a758, #46a758);
25
+ --primary-10: light-dark(#3e9b4f, #53b365);
26
+ --primary-11: light-dark(#2a7e3b, #71d083);
27
+ --primary-a2: light-dark(#0099000a, #5ef7780a);
28
+ --primary-a3: light-dark(#00970016, #70fe8c1b);
29
+ --primary-a4: light-dark(#009f0725, #57ff802c);
30
+ --primary-a5: light-dark(#00930536, #68ff8b3b);
31
+ --primary-a6: light-dark(#008f0a4d, #71ff8f4b);
32
+ --primary-a7: light-dark(#018b0f6b, #77fd925d);
33
+ --primary-a11: light-dark(#006514d5, #89ff9fcd);
34
+ --primary-text: var(--primary-11);
35
+ --primary-inverse: white;
36
+
37
+ /* accent: yellow */
38
+ --accent-7: light-dark(#e4c767, #665417);
39
+ --accent-9: light-dark(#ffe629, #ffe629);
40
+ --accent-10: light-dark(#ffdc00, #ffff57);
41
+ --accent-11: light-dark(#9e6c00, #f5e147);
42
+ --accent-a2: light-dark(#f4dd0016, #f9b4000b);
43
+ --accent-a3: light-dark(#ffee0047, #ffaa001e);
44
+ --accent-a4: light-dark(#ffe3016b, #fdb70028);
45
+ --accent-a5: light-dark(#ffd5008f, #febb0036);
46
+ --accent-a6: light-dark(#ebbc0097, #fec40046);
47
+ --accent-a7: light-dark(#d2a10098, #fdcb225c);
48
+ --accent-a11: light-dark(#9e6c00, #fee949f5);
49
+ --accent-text: light-dark(var(--neutral-12), var(--accent-11));
50
+ --accent-inverse: light-dark(var(--neutral-12), var(--neutral-1));
51
+
52
+ /* success: teal */
53
+ --success-7: light-dark(#83cdc1, #1c6961);
54
+ --success-9: light-dark(#12a594, #12a594);
55
+ --success-10: light-dark(#0d9b8a, #0eb39e);
56
+ --success-11: light-dark(#008573, #0bd8b6);
57
+ --success-a2: light-dark(#00aa800c, #12fbe60c);
58
+ --success-a3: light-dark(#00c69d1f, #00ffe61e);
59
+ --success-a4: light-dark(#00c39633, #00ffe92d);
60
+ --success-a5: light-dark(#00b49047, #00ffea3b);
61
+ --success-a6: light-dark(#00a6855e, #1cffe84b);
62
+ --success-a7: light-dark(#0099807c, #2efde85f);
63
+ --success-a11: light-dark(#008573, #0afed5d6);
64
+ --success-text: var(--success-11);
65
+ --success-inverse: white;
66
+
67
+ /* warning: orange */
68
+ --warning-7: light-dark(#f5ae73, #7e451d);
69
+ --warning-9: light-dark(#f76b15, #f76b15);
70
+ --warning-10: light-dark(#ef5f00, #ff801f);
71
+ --warning-11: light-dark(#cc4e00, #ffa057);
72
+ --warning-a2: light-dark(#ff8e0012, #fe6d000e);
73
+ --warning-a3: light-dark(#ff9c0029, #fb6a0025);
74
+ --warning-a4: light-dark(#ff91014a, #ff590039);
75
+ --warning-a5: light-dark(#ff8b0065, #ff61004a);
76
+ --warning-a6: light-dark(#ff81007d, #fd75045c);
77
+ --warning-a7: light-dark(#ed6c008c, #ff832c75);
78
+ --warning-a11: light-dark(#cc4e00, #ffa057);
79
+ --warning-text: var(--warning-11);
80
+ --warning-inverse: white;
81
+
82
+ /* icons */
83
+ --icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2312a594' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
84
+ }
85
+
86
+ @supports (color: color(display-p3 1 1 1)) {
87
+ @media (color-gamut: p3) {
88
+ :root {
89
+ /* neutral: olive */
90
+ --neutral-1: light-dark(color(display-p3 0.989 0.992 0.989), color(display-p3 0.067 0.07 0.063));
91
+ --neutral-2: light-dark(color(display-p3 0.974 0.98 0.973), color(display-p3 0.095 0.098 0.091));
92
+ --neutral-3: light-dark(color(display-p3 0.939 0.945 0.937), color(display-p3 0.131 0.135 0.126));
93
+ --neutral-4: light-dark(color(display-p3 0.907 0.914 0.905), color(display-p3 0.158 0.163 0.153));
94
+ --neutral-5: light-dark(color(display-p3 0.878 0.885 0.875), color(display-p3 0.186 0.192 0.18));
95
+ --neutral-8: light-dark(color(display-p3 0.727 0.738 0.723), color(display-p3 0.365 0.382 0.359));
96
+ --neutral-11: light-dark(color(display-p3 0.38 0.395 0.374), color(display-p3 0.69 0.709 0.682));
97
+ --neutral-12: light-dark(color(display-p3 0.117 0.129 0.111), color(display-p3 0.927 0.933 0.926));
98
+ --neutral-a2: light-dark(color(display-p3 0.024 0.302 0.024 / 0.028), color(display-p3 0.984 0.988 0.976 / 0.03));
99
+ --neutral-a3: light-dark(color(display-p3 0.008 0.129 0.008 / 0.063), color(display-p3 0.992 0.996 0.988 / 0.068));
100
+ --neutral-a4: light-dark(color(display-p3 0.012 0.094 0.012 / 0.095), color(display-p3 0.953 0.996 0.949 / 0.102));
101
+ --neutral-a5: light-dark(color(display-p3 0.035 0.098 0.008 / 0.126), color(display-p3 0.969 1 0.965 / 0.131));
102
+ --neutral-a6: light-dark(color(display-p3 0.027 0.078 0.004 / 0.157), color(display-p3 0.973 1 0.969 / 0.169));
103
+ --neutral-a7: light-dark(color(display-p3 0.02 0.059 0 / 0.2), color(display-p3 0.98 1 0.961 / 0.228));
104
+
105
+ /* primary: grass */
106
+ --primary-7: light-dark(color(display-p3 0.628 0.803 0.622), color(display-p3 0.258 0.4 0.264));
107
+ --primary-9: light-dark(color(display-p3 0.38 0.647 0.378), color(display-p3 0.38 0.647 0.378));
108
+ --primary-10: light-dark(color(display-p3 0.344 0.598 0.342), color(display-p3 0.426 0.694 0.426));
109
+ --primary-11: light-dark(color(display-p3 0.263 0.488 0.261), color(display-p3 0.535 0.807 0.542));
110
+ --primary-a2: light-dark(color(display-p3 0.024 0.565 0.024 / 0.036), color(display-p3 0.482 0.996 0.584 / 0.038));
111
+ --primary-a3: light-dark(color(display-p3 0.059 0.576 0.008 / 0.083), color(display-p3 0.549 0.992 0.588 / 0.106));
112
+ --primary-a4: light-dark(color(display-p3 0.035 0.565 0.008 / 0.134), color(display-p3 0.51 0.996 0.557 / 0.169));
113
+ --primary-a5: light-dark(color(display-p3 0.047 0.545 0.008 / 0.197), color(display-p3 0.553 1 0.588 / 0.227));
114
+ --primary-a6: light-dark(color(display-p3 0.031 0.502 0.004 / 0.275), color(display-p3 0.584 1 0.608 / 0.29));
115
+ --primary-a7: light-dark(color(display-p3 0.012 0.482 0.004 / 0.377), color(display-p3 0.604 1 0.616 / 0.358));
116
+ --primary-a11: light-dark(color(display-p3 0.263 0.488 0.261), color(display-p3 0.535 0.807 0.542));
117
+
118
+ /* accent: yellow */
119
+ --accent-7: light-dark(color(display-p3 0.876 0.785 0.46), color(display-p3 0.389 0.331 0.135));
120
+ --accent-9: light-dark(color(display-p3 1 0.92 0.22), color(display-p3 1 0.92 0.22));
121
+ --accent-10: light-dark(color(display-p3 0.977 0.868 0.291), color(display-p3 1 1 0.456));
122
+ --accent-11: light-dark(color(display-p3 0.6 0.44 0), color(display-p3 0.948 0.885 0.392));
123
+ --accent-a2: light-dark(color(display-p3 0.953 0.855 0.008 / 0.079), color(display-p3 0.996 0.792 0 / 0.038));
124
+ --accent-a3: light-dark(color(display-p3 0.988 0.925 0.004 / 0.251), color(display-p3 0.996 0.71 0 / 0.11));
125
+ --accent-a4: light-dark(color(display-p3 0.98 0.875 0.004 / 0.373), color(display-p3 0.996 0.741 0 / 0.152));
126
+ --accent-a5: light-dark(color(display-p3 0.969 0.816 0.004 / 0.491), color(display-p3 0.996 0.765 0 / 0.202));
127
+ --accent-a6: light-dark(color(display-p3 0.875 0.71 0 / 0.526), color(display-p3 0.996 0.816 0.082 / 0.261));
128
+ --accent-a7: light-dark(color(display-p3 0.769 0.604 0 / 0.542), color(display-p3 1 0.831 0.263 / 0.345));
129
+ --accent-a11: light-dark(color(display-p3 0.6 0.44 0), color(display-p3 0.948 0.885 0.392));
130
+
131
+ /* success: teal */
132
+ --success-7: light-dark(color(display-p3 0.581 0.798 0.756), color(display-p3 0.205 0.406 0.379));
133
+ --success-9: light-dark(color(display-p3 0.297 0.637 0.581), color(display-p3 0.297 0.637 0.581));
134
+ --success-10: light-dark(color(display-p3 0.275 0.599 0.542), color(display-p3 0.319 0.69 0.62));
135
+ --success-11: light-dark(color(display-p3 0.08 0.5 0.43), color(display-p3 0.388 0.835 0.719));
136
+ --success-a2: light-dark(color(display-p3 0.02 0.647 0.467 / 0.044), color(display-p3 0.235 0.988 0.902 / 0.047));
137
+ --success-a3: light-dark(color(display-p3 0.004 0.741 0.557 / 0.106), color(display-p3 0.235 1 0.898 / 0.118));
138
+ --success-a4: light-dark(color(display-p3 0.004 0.702 0.537 / 0.169), color(display-p3 0.18 0.996 0.929 / 0.173));
139
+ --success-a5: light-dark(color(display-p3 0.004 0.643 0.494 / 0.24), color(display-p3 0.31 1 0.933 / 0.227));
140
+ --success-a6: light-dark(color(display-p3 0.004 0.569 0.447 / 0.318), color(display-p3 0.396 1 0.933 / 0.286));
141
+ --success-a7: light-dark(color(display-p3 0.004 0.518 0.424 / 0.42), color(display-p3 0.443 1 0.925 / 0.366));
142
+ --success-a11: light-dark(color(display-p3 0.08 0.5 0.43), color(display-p3 0.388 0.835 0.719));
143
+
144
+ /* warning: orange */
145
+ --warning-7: light-dark(color(display-p3 0.919 0.693 0.486), color(display-p3 0.465 0.283 0.147));
146
+ --warning-9: light-dark(color(display-p3 0.9 0.45 0.2), color(display-p3 0.9 0.45 0.2));
147
+ --warning-10: light-dark(color(display-p3 0.87 0.409 0.164), color(display-p3 0.98 0.51 0.23));
148
+ --warning-11: light-dark(color(display-p3 0.76 0.34 0), color(display-p3 1 0.63 0.38));
149
+ --warning-a2: light-dark(color(display-p3 0.886 0.533 0.008 / 0.067), color(display-p3 0.992 0.529 0 / 0.051));
150
+ --warning-a3: light-dark(color(display-p3 0.922 0.584 0.008 / 0.15), color(display-p3 0.996 0.486 0 / 0.131));
151
+ --warning-a4: light-dark(color(display-p3 1 0.604 0.004 / 0.314), color(display-p3 0.996 0.384 0 / 0.211));
152
+ --warning-a5: light-dark(color(display-p3 1 0.569 0.004 / 0.416), color(display-p3 1 0.455 0 / 0.265));
153
+ --warning-a6: light-dark(color(display-p3 0.949 0.494 0.004 / 0.455), color(display-p3 1 0.529 0.129 / 0.332));
154
+ --warning-a7: light-dark(color(display-p3 0.839 0.408 0 / 0.514), color(display-p3 1 0.569 0.251 / 0.429));
155
+ --warning-a11: light-dark(color(display-p3 0.76 0.34 0), color(display-p3 1 0.63 0.38));
156
+ }
157
+ }
158
+ }
159
+ }
@@ -0,0 +1,107 @@
1
+ @layer tokens, theme, reset, base, layout, components, project, utilities;
2
+
3
+ /* Theme: gray (neutral: gray, primary: gray, accent: iris). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
4
+ @layer theme {
5
+ :root {
6
+ /* neutral: gray */
7
+ --neutral-1: light-dark(#fcfcfc, #111111);
8
+ --neutral-2: light-dark(#f9f9f9, #191919);
9
+ --neutral-3: light-dark(#f0f0f0, #222222);
10
+ --neutral-4: light-dark(#e8e8e8, #2a2a2a);
11
+ --neutral-5: light-dark(#e0e0e0, #313131);
12
+ --neutral-8: light-dark(#bbbbbb, #606060);
13
+ --neutral-11: light-dark(#646464, #b4b4b4);
14
+ --neutral-12: light-dark(#202020, #eeeeee);
15
+ --neutral-a2: light-dark(#00000006, #ffffff09);
16
+ --neutral-a3: light-dark(#0000000f, #ffffff12);
17
+ --neutral-a4: light-dark(#00000017, #ffffff1b);
18
+ --neutral-a5: light-dark(#0000001f, #ffffff22);
19
+ --neutral-a6: light-dark(#00000026, #ffffff2c);
20
+ --neutral-a7: light-dark(#00000031, #ffffff3b);
21
+
22
+ /* primary: gray */
23
+ --primary-7: light-dark(#cecece, #484848);
24
+ --primary-9: light-dark(#8d8d8d, #6e6e6e);
25
+ --primary-10: light-dark(#838383, #7b7b7b);
26
+ --primary-11: light-dark(#646464, #b4b4b4);
27
+ --primary-a2: light-dark(#00000006, #ffffff09);
28
+ --primary-a3: light-dark(#0000000f, #ffffff12);
29
+ --primary-a4: light-dark(#00000017, #ffffff1b);
30
+ --primary-a5: light-dark(#0000001f, #ffffff22);
31
+ --primary-a6: light-dark(#00000026, #ffffff2c);
32
+ --primary-a7: light-dark(#00000031, #ffffff3b);
33
+ --primary-a11: light-dark(#0000009b, #ffffffaf);
34
+ --primary-text: var(--primary-11);
35
+ --primary-inverse: white;
36
+
37
+ /* accent: iris */
38
+ --accent-7: light-dark(#b8baf8, #4a4a95);
39
+ --accent-9: light-dark(#5b5bd6, #5b5bd6);
40
+ --accent-10: light-dark(#5151cd, #6e6ade);
41
+ --accent-11: light-dark(#5753c6, #b1a9ff);
42
+ --accent-a2: light-dark(#0000ff07, #564bf916);
43
+ --accent-a3: light-dark(#0011ee0f, #525bff3b);
44
+ --accent-a4: light-dark(#000bff19, #4d58ff5a);
45
+ --accent-a5: light-dark(#000eff25, #5b62fd6b);
46
+ --accent-a6: light-dark(#000aff34, #6d6ffd7a);
47
+ --accent-a7: light-dark(#0008e647, #7777fe8e);
48
+ --accent-a11: light-dark(#0600abac, #b1a9ff);
49
+ --accent-text: var(--accent-11);
50
+ --accent-inverse: white;
51
+
52
+ /* gray primary */
53
+ --color-primary: var(--neutral-12);
54
+ --color-primary-inverse: var(--neutral-1);
55
+ --color-primary-hover: color-mix(in oklab, var(--neutral-12) 85%, var(--neutral-1));
56
+ --color-primary-text: var(--neutral-12);
57
+ --mark-color: light-dark(var(--accent-a5), var(--accent-a11));
58
+ }
59
+
60
+ @supports (color: color(display-p3 1 1 1)) {
61
+ @media (color-gamut: p3) {
62
+ :root {
63
+ /* neutral: gray */
64
+ --neutral-1: light-dark(color(display-p3 0.988 0.988 0.988), color(display-p3 0.067 0.067 0.067));
65
+ --neutral-2: light-dark(color(display-p3 0.975 0.975 0.975), color(display-p3 0.098 0.098 0.098));
66
+ --neutral-3: light-dark(color(display-p3 0.939 0.939 0.939), color(display-p3 0.135 0.135 0.135));
67
+ --neutral-4: light-dark(color(display-p3 0.908 0.908 0.908), color(display-p3 0.163 0.163 0.163));
68
+ --neutral-5: light-dark(color(display-p3 0.88 0.88 0.88), color(display-p3 0.192 0.192 0.192));
69
+ --neutral-8: light-dark(color(display-p3 0.732 0.732 0.732), color(display-p3 0.375 0.375 0.375));
70
+ --neutral-11: light-dark(color(display-p3 0.392 0.392 0.392), color(display-p3 0.706 0.706 0.706));
71
+ --neutral-12: light-dark(color(display-p3 0.125 0.125 0.125), color(display-p3 0.933 0.933 0.933));
72
+ --neutral-a2: light-dark(color(display-p3 0 0 0 / 0.024), color(display-p3 1 1 1 / 0.034));
73
+ --neutral-a3: light-dark(color(display-p3 0 0 0 / 0.063), color(display-p3 1 1 1 / 0.071));
74
+ --neutral-a4: light-dark(color(display-p3 0 0 0 / 0.09), color(display-p3 1 1 1 / 0.105));
75
+ --neutral-a5: light-dark(color(display-p3 0 0 0 / 0.122), color(display-p3 1 1 1 / 0.134));
76
+ --neutral-a6: light-dark(color(display-p3 0 0 0 / 0.153), color(display-p3 1 1 1 / 0.172));
77
+ --neutral-a7: light-dark(color(display-p3 0 0 0 / 0.192), color(display-p3 1 1 1 / 0.231));
78
+
79
+ /* primary: gray */
80
+ --primary-7: light-dark(color(display-p3 0.807 0.807 0.807), color(display-p3 0.283 0.283 0.283));
81
+ --primary-9: light-dark(color(display-p3 0.553 0.553 0.553), color(display-p3 0.431 0.431 0.431));
82
+ --primary-10: light-dark(color(display-p3 0.512 0.512 0.512), color(display-p3 0.484 0.484 0.484));
83
+ --primary-11: light-dark(color(display-p3 0.392 0.392 0.392), color(display-p3 0.706 0.706 0.706));
84
+ --primary-a2: light-dark(color(display-p3 0 0 0 / 0.024), color(display-p3 1 1 1 / 0.034));
85
+ --primary-a3: light-dark(color(display-p3 0 0 0 / 0.063), color(display-p3 1 1 1 / 0.071));
86
+ --primary-a4: light-dark(color(display-p3 0 0 0 / 0.09), color(display-p3 1 1 1 / 0.105));
87
+ --primary-a5: light-dark(color(display-p3 0 0 0 / 0.122), color(display-p3 1 1 1 / 0.134));
88
+ --primary-a6: light-dark(color(display-p3 0 0 0 / 0.153), color(display-p3 1 1 1 / 0.172));
89
+ --primary-a7: light-dark(color(display-p3 0 0 0 / 0.192), color(display-p3 1 1 1 / 0.231));
90
+ --primary-a11: light-dark(color(display-p3 0 0 0 / 0.608), color(display-p3 1 1 1 / 0.685));
91
+
92
+ /* accent: iris */
93
+ --accent-7: light-dark(color(display-p3 0.721 0.727 0.955), color(display-p3 0.291 0.289 0.565));
94
+ --accent-9: light-dark(color(display-p3 0.357 0.357 0.81), color(display-p3 0.357 0.357 0.81));
95
+ --accent-10: light-dark(color(display-p3 0.318 0.318 0.774), color(display-p3 0.428 0.416 0.843));
96
+ --accent-11: light-dark(color(display-p3 0.337 0.326 0.748), color(display-p3 0.685 0.662 1));
97
+ --accent-a2: light-dark(color(display-p3 0.024 0.024 0.863 / 0.028), color(display-p3 0.361 0.314 1 / 0.08));
98
+ --accent-a3: light-dark(color(display-p3 0.004 0.071 0.871 / 0.059), color(display-p3 0.357 0.373 1 / 0.219));
99
+ --accent-a4: light-dark(color(display-p3 0.012 0.051 1 / 0.099), color(display-p3 0.325 0.361 1 / 0.337));
100
+ --accent-a5: light-dark(color(display-p3 0.008 0.035 1 / 0.142), color(display-p3 0.38 0.4 1 / 0.4));
101
+ --accent-a6: light-dark(color(display-p3 0 0.02 0.941 / 0.2), color(display-p3 0.447 0.447 1 / 0.454));
102
+ --accent-a7: light-dark(color(display-p3 0.004 0.02 0.847 / 0.279), color(display-p3 0.486 0.486 1 / 0.534));
103
+ --accent-a11: light-dark(color(display-p3 0.337 0.326 0.748), color(display-p3 0.685 0.662 1));
104
+ }
105
+ }
106
+ }
107
+ }
@@ -0,0 +1,131 @@
1
+ @layer tokens, theme, reset, base, layout, components, project, utilities;
2
+
3
+ /* Theme: green (neutral: sage, primary: green, accent: gold, success: teal). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
4
+ @layer theme {
5
+ :root {
6
+ /* neutral: sage */
7
+ --neutral-1: light-dark(#fbfdfc, #101211);
8
+ --neutral-2: light-dark(#f7f9f8, #171918);
9
+ --neutral-3: light-dark(#eef1f0, #202221);
10
+ --neutral-4: light-dark(#e6e9e8, #272a29);
11
+ --neutral-5: light-dark(#dfe2e0, #2e3130);
12
+ --neutral-8: light-dark(#b8bcba, #5b625f);
13
+ --neutral-11: light-dark(#5f6563, #adb5b2);
14
+ --neutral-12: light-dark(#1a211e, #eceeed);
15
+ --neutral-a2: light-dark(#00402008, #f0f2f108);
16
+ --neutral-a3: light-dark(#002d1e11, #f3f5f412);
17
+ --neutral-a4: light-dark(#001f1519, #f2fefd1a);
18
+ --neutral-a5: light-dark(#00180820, #f1fbfa22);
19
+ --neutral-a6: light-dark(#00140d28, #edfbf42d);
20
+ --neutral-a7: light-dark(#00140a34, #edfcf73c);
21
+
22
+ /* primary: green */
23
+ --primary-7: light-dark(#8eceaa, #28684a);
24
+ --primary-9: light-dark(#30a46c, #30a46c);
25
+ --primary-10: light-dark(#2b9a66, #33b074);
26
+ --primary-11: light-dark(#218358, #3dd68c);
27
+ --primary-a2: light-dark(#00a32f0b, #29f99d0b);
28
+ --primary-a3: light-dark(#00a43319, #22ff991e);
29
+ --primary-a4: light-dark(#00a83829, #11ff992d);
30
+ --primary-a5: light-dark(#019c393b, #2bffa23c);
31
+ --primary-a6: light-dark(#00963c52, #44ffaa4b);
32
+ --primary-a7: light-dark(#00914071, #50fdac5e);
33
+ --primary-a11: light-dark(#00713fde, #46fea5d4);
34
+ --primary-text: var(--primary-11);
35
+ --primary-inverse: white;
36
+
37
+ /* accent: gold */
38
+ --accent-7: light-dark(#cbc0aa, #544f46);
39
+ --accent-9: light-dark(#978365, #978365);
40
+ --accent-10: light-dark(#8c7a5e, #a39073);
41
+ --accent-11: light-dark(#71624b, #cbb99f);
42
+ --accent-a2: light-dark(#9d8a000d, #f9e29d0b);
43
+ --accent-a3: light-dark(#75600018, #f8ecbb15);
44
+ --accent-a4: light-dark(#6b4e0024, #ffeec41e);
45
+ --accent-a5: light-dark(#60460030, #feecc22a);
46
+ --accent-a6: light-dark(#64440040, #feebcb37);
47
+ --accent-a7: light-dark(#63420055, #ffedcd48);
48
+ --accent-a11: light-dark(#362100b4, #fee7c6c8);
49
+ --accent-text: var(--accent-11);
50
+ --accent-inverse: white;
51
+
52
+ /* success: teal */
53
+ --success-7: light-dark(#83cdc1, #1c6961);
54
+ --success-9: light-dark(#12a594, #12a594);
55
+ --success-10: light-dark(#0d9b8a, #0eb39e);
56
+ --success-11: light-dark(#008573, #0bd8b6);
57
+ --success-a2: light-dark(#00aa800c, #12fbe60c);
58
+ --success-a3: light-dark(#00c69d1f, #00ffe61e);
59
+ --success-a4: light-dark(#00c39633, #00ffe92d);
60
+ --success-a5: light-dark(#00b49047, #00ffea3b);
61
+ --success-a6: light-dark(#00a6855e, #1cffe84b);
62
+ --success-a7: light-dark(#0099807c, #2efde85f);
63
+ --success-a11: light-dark(#008573, #0afed5d6);
64
+ --success-text: var(--success-11);
65
+ --success-inverse: white;
66
+
67
+ /* icons */
68
+ --icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2312a594' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
69
+ }
70
+
71
+ @supports (color: color(display-p3 1 1 1)) {
72
+ @media (color-gamut: p3) {
73
+ :root {
74
+ /* neutral: sage */
75
+ --neutral-1: light-dark(color(display-p3 0.986 0.992 0.988), color(display-p3 0.064 0.07 0.067));
76
+ --neutral-2: light-dark(color(display-p3 0.97 0.977 0.974), color(display-p3 0.092 0.098 0.094));
77
+ --neutral-3: light-dark(color(display-p3 0.935 0.944 0.94), color(display-p3 0.128 0.135 0.131));
78
+ --neutral-4: light-dark(color(display-p3 0.904 0.913 0.909), color(display-p3 0.155 0.164 0.159));
79
+ --neutral-5: light-dark(color(display-p3 0.875 0.885 0.88), color(display-p3 0.183 0.193 0.188));
80
+ --neutral-8: light-dark(color(display-p3 0.725 0.738 0.732), color(display-p3 0.362 0.382 0.373));
81
+ --neutral-11: light-dark(color(display-p3 0.377 0.395 0.389), color(display-p3 0.685 0.709 0.697));
82
+ --neutral-12: light-dark(color(display-p3 0.107 0.129 0.118), color(display-p3 0.927 0.933 0.93));
83
+ --neutral-a2: light-dark(color(display-p3 0.02 0.267 0.145 / 0.032), color(display-p3 0.976 0.988 0.984 / 0.03));
84
+ --neutral-a3: light-dark(color(display-p3 0.008 0.184 0.125 / 0.067), color(display-p3 0.992 0.945 0.941 / 0.072));
85
+ --neutral-a4: light-dark(color(display-p3 0.012 0.094 0.051 / 0.095), color(display-p3 0.988 0.996 0.992 / 0.102));
86
+ --neutral-a5: light-dark(color(display-p3 0.008 0.098 0.035 / 0.126), color(display-p3 0.992 1 0.996 / 0.131));
87
+ --neutral-a6: light-dark(color(display-p3 0.004 0.078 0.027 / 0.157), color(display-p3 0.973 1 0.976 / 0.173));
88
+ --neutral-a7: light-dark(color(display-p3 0 0.059 0.039 / 0.2), color(display-p3 0.957 1 0.976 / 0.233));
89
+
90
+ /* primary: green */
91
+ --primary-7: light-dark(color(display-p3 0.61 0.801 0.675), color(display-p3 0.227 0.403 0.298));
92
+ --primary-9: light-dark(color(display-p3 0.332 0.634 0.442), color(display-p3 0.332 0.634 0.442));
93
+ --primary-10: light-dark(color(display-p3 0.308 0.595 0.417), color(display-p3 0.357 0.682 0.474));
94
+ --primary-11: light-dark(color(display-p3 0.19 0.5 0.32), color(display-p3 0.434 0.828 0.573));
95
+ --primary-a2: light-dark(color(display-p3 0.024 0.565 0.129 / 0.036), color(display-p3 0.341 0.98 0.616 / 0.043));
96
+ --primary-a3: light-dark(color(display-p3 0.012 0.596 0.145 / 0.087), color(display-p3 0.376 0.996 0.655 / 0.114));
97
+ --primary-a4: light-dark(color(display-p3 0.008 0.588 0.145 / 0.142), color(display-p3 0.341 0.996 0.635 / 0.173));
98
+ --primary-a5: light-dark(color(display-p3 0.004 0.541 0.157 / 0.204), color(display-p3 0.408 1 0.678 / 0.232));
99
+ --primary-a6: light-dark(color(display-p3 0.004 0.518 0.157 / 0.283), color(display-p3 0.475 1 0.706 / 0.29));
100
+ --primary-a7: light-dark(color(display-p3 0.004 0.486 0.165 / 0.389), color(display-p3 0.514 1 0.706 / 0.362));
101
+ --primary-a11: light-dark(color(display-p3 0.19 0.5 0.32), color(display-p3 0.434 0.828 0.573));
102
+
103
+ /* accent: gold */
104
+ --accent-7: light-dark(color(display-p3 0.788 0.753 0.677), color(display-p3 0.327 0.31 0.277));
105
+ --accent-9: light-dark(color(display-p3 0.579 0.517 0.41), color(display-p3 0.579 0.517 0.41));
106
+ --accent-10: light-dark(color(display-p3 0.538 0.479 0.38), color(display-p3 0.628 0.566 0.463));
107
+ --accent-11: light-dark(color(display-p3 0.433 0.386 0.305), color(display-p3 0.784 0.728 0.635));
108
+ --accent-a2: light-dark(color(display-p3 0.592 0.514 0.024 / 0.048), color(display-p3 0.98 0.89 0.616 / 0.043));
109
+ --accent-a3: light-dark(color(display-p3 0.4 0.357 0.012 / 0.091), color(display-p3 1 0.949 0.753 / 0.08));
110
+ --accent-a4: light-dark(color(display-p3 0.357 0.298 0.008 / 0.134), color(display-p3 1 0.933 0.8 / 0.118));
111
+ --accent-a5: light-dark(color(display-p3 0.345 0.282 0.004 / 0.185), color(display-p3 1 0.949 0.804 / 0.16));
112
+ --accent-a6: light-dark(color(display-p3 0.341 0.263 0.004 / 0.244), color(display-p3 1 0.925 0.8 / 0.215));
113
+ --accent-a7: light-dark(color(display-p3 0.345 0.235 0.004 / 0.322), color(display-p3 1 0.945 0.831 / 0.278));
114
+ --accent-a11: light-dark(color(display-p3 0.433 0.386 0.305), color(display-p3 0.784 0.728 0.635));
115
+
116
+ /* success: teal */
117
+ --success-7: light-dark(color(display-p3 0.581 0.798 0.756), color(display-p3 0.205 0.406 0.379));
118
+ --success-9: light-dark(color(display-p3 0.297 0.637 0.581), color(display-p3 0.297 0.637 0.581));
119
+ --success-10: light-dark(color(display-p3 0.275 0.599 0.542), color(display-p3 0.319 0.69 0.62));
120
+ --success-11: light-dark(color(display-p3 0.08 0.5 0.43), color(display-p3 0.388 0.835 0.719));
121
+ --success-a2: light-dark(color(display-p3 0.02 0.647 0.467 / 0.044), color(display-p3 0.235 0.988 0.902 / 0.047));
122
+ --success-a3: light-dark(color(display-p3 0.004 0.741 0.557 / 0.106), color(display-p3 0.235 1 0.898 / 0.118));
123
+ --success-a4: light-dark(color(display-p3 0.004 0.702 0.537 / 0.169), color(display-p3 0.18 0.996 0.929 / 0.173));
124
+ --success-a5: light-dark(color(display-p3 0.004 0.643 0.494 / 0.24), color(display-p3 0.31 1 0.933 / 0.227));
125
+ --success-a6: light-dark(color(display-p3 0.004 0.569 0.447 / 0.318), color(display-p3 0.396 1 0.933 / 0.286));
126
+ --success-a7: light-dark(color(display-p3 0.004 0.518 0.424 / 0.42), color(display-p3 0.443 1 0.925 / 0.366));
127
+ --success-a11: light-dark(color(display-p3 0.08 0.5 0.43), color(display-p3 0.388 0.835 0.719));
128
+ }
129
+ }
130
+ }
131
+ }
@@ -0,0 +1,156 @@
1
+ @layer tokens, theme, reset, base, layout, components, project, utilities;
2
+
3
+ /* Theme: indigo (neutral: slate, primary: indigo, accent: orange, warning: yellow, info: cyan). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
4
+ @layer theme {
5
+ :root {
6
+ /* neutral: slate */
7
+ --neutral-1: light-dark(#fcfcfd, #111113);
8
+ --neutral-2: light-dark(#f9f9fb, #18191b);
9
+ --neutral-3: light-dark(#f0f0f3, #212225);
10
+ --neutral-4: light-dark(#e8e8ec, #272a2d);
11
+ --neutral-5: light-dark(#e0e1e6, #2e3135);
12
+ --neutral-8: light-dark(#b9bbc6, #5a6169);
13
+ --neutral-11: light-dark(#60646c, #b0b4ba);
14
+ --neutral-12: light-dark(#1c2024, #edeef0);
15
+ --neutral-a2: light-dark(#00005506, #d8f4f609);
16
+ --neutral-a3: light-dark(#0000330f, #ddeaf814);
17
+ --neutral-a4: light-dark(#00002d17, #d3edf81d);
18
+ --neutral-a5: light-dark(#0009321f, #d9edfe25);
19
+ --neutral-a6: light-dark(#00002f26, #d6ebfd30);
20
+ --neutral-a7: light-dark(#00062e32, #d9edff40);
21
+
22
+ /* primary: indigo */
23
+ --primary-7: light-dark(#abbdf9, #3a4f97);
24
+ --primary-9: light-dark(#3e63dd, #3e63dd);
25
+ --primary-10: light-dark(#3358d4, #5472e4);
26
+ --primary-11: light-dark(#3a5bc7, #9eb1ff);
27
+ --primary-a2: light-dark(#0040ff08, #3354fa17);
28
+ --primary-a3: light-dark(#0047f112, #2f62ff3c);
29
+ --primary-a4: light-dark(#0044ff1e, #3566ff57);
30
+ --primary-a5: light-dark(#0044ff2d, #4171fd6b);
31
+ --primary-a6: light-dark(#003eff3e, #5178fd7c);
32
+ --primary-a7: light-dark(#0037ed54, #5a7fff90);
33
+ --primary-a11: light-dark(#002bb7c5, #9eb1ff);
34
+ --primary-text: var(--primary-11);
35
+ --primary-inverse: white;
36
+
37
+ /* accent: orange */
38
+ --accent-7: light-dark(#f5ae73, #7e451d);
39
+ --accent-9: light-dark(#f76b15, #f76b15);
40
+ --accent-10: light-dark(#ef5f00, #ff801f);
41
+ --accent-11: light-dark(#cc4e00, #ffa057);
42
+ --accent-a2: light-dark(#ff8e0012, #fe6d000e);
43
+ --accent-a3: light-dark(#ff9c0029, #fb6a0025);
44
+ --accent-a4: light-dark(#ff91014a, #ff590039);
45
+ --accent-a5: light-dark(#ff8b0065, #ff61004a);
46
+ --accent-a6: light-dark(#ff81007d, #fd75045c);
47
+ --accent-a7: light-dark(#ed6c008c, #ff832c75);
48
+ --accent-a11: light-dark(#cc4e00, #ffa057);
49
+ --accent-text: var(--accent-11);
50
+ --accent-inverse: white;
51
+
52
+ /* warning: yellow */
53
+ --warning-7: light-dark(#e4c767, #665417);
54
+ --warning-9: light-dark(#ffe629, #ffe629);
55
+ --warning-10: light-dark(#ffdc00, #ffff57);
56
+ --warning-11: light-dark(#9e6c00, #f5e147);
57
+ --warning-a2: light-dark(#f4dd0016, #f9b4000b);
58
+ --warning-a3: light-dark(#ffee0047, #ffaa001e);
59
+ --warning-a4: light-dark(#ffe3016b, #fdb70028);
60
+ --warning-a5: light-dark(#ffd5008f, #febb0036);
61
+ --warning-a6: light-dark(#ebbc0097, #fec40046);
62
+ --warning-a7: light-dark(#d2a10098, #fdcb225c);
63
+ --warning-a11: light-dark(#9e6c00, #fee949f5);
64
+ --warning-text: light-dark(var(--neutral-12), var(--warning-11));
65
+ --warning-inverse: light-dark(var(--neutral-12), var(--neutral-1));
66
+
67
+ /* info: cyan */
68
+ --info-7: light-dark(#7dcedc, #12677e);
69
+ --info-9: light-dark(#00a2c7, #00a2c7);
70
+ --info-10: light-dark(#0797b9, #23afd0);
71
+ --info-11: light-dark(#107d98, #4ccce6);
72
+ --info-a2: light-dark(#009db10d, #02a7f211);
73
+ --info-a3: light-dark(#00c2d121, #00befd28);
74
+ --info-a4: light-dark(#00bcd435, #00baff3b);
75
+ --info-a5: light-dark(#01b4cc4a, #00befd4d);
76
+ --info-a6: light-dark(#00a7c162, #00c7fd5e);
77
+ --info-a7: light-dark(#009fbb82, #14cdff75);
78
+ --info-a11: light-dark(#007491ef, #52e1fee5);
79
+ --info-text: var(--info-11);
80
+ --info-inverse: white;
81
+ }
82
+
83
+ @supports (color: color(display-p3 1 1 1)) {
84
+ @media (color-gamut: p3) {
85
+ :root {
86
+ /* neutral: slate */
87
+ --neutral-1: light-dark(color(display-p3 0.988 0.988 0.992), color(display-p3 0.067 0.067 0.074));
88
+ --neutral-2: light-dark(color(display-p3 0.976 0.976 0.984), color(display-p3 0.095 0.098 0.105));
89
+ --neutral-3: light-dark(color(display-p3 0.94 0.941 0.953), color(display-p3 0.13 0.135 0.145));
90
+ --neutral-4: light-dark(color(display-p3 0.908 0.909 0.925), color(display-p3 0.156 0.163 0.176));
91
+ --neutral-5: light-dark(color(display-p3 0.88 0.881 0.901), color(display-p3 0.183 0.191 0.206));
92
+ --neutral-8: light-dark(color(display-p3 0.727 0.733 0.773), color(display-p3 0.357 0.381 0.409));
93
+ --neutral-11: light-dark(color(display-p3 0.379 0.392 0.421), color(display-p3 0.692 0.704 0.728));
94
+ --neutral-12: light-dark(color(display-p3 0.113 0.125 0.14), color(display-p3 0.93 0.933 0.94));
95
+ --neutral-a2: light-dark(color(display-p3 0.024 0.024 0.349 / 0.024), color(display-p3 0.875 0.992 1 / 0.034));
96
+ --neutral-a3: light-dark(color(display-p3 0.004 0.004 0.204 / 0.059), color(display-p3 0.882 0.933 0.992 / 0.077));
97
+ --neutral-a4: light-dark(color(display-p3 0.012 0.012 0.184 / 0.091), color(display-p3 0.882 0.953 0.996 / 0.111));
98
+ --neutral-a5: light-dark(color(display-p3 0.004 0.039 0.2 / 0.122), color(display-p3 0.878 0.929 0.996 / 0.145));
99
+ --neutral-a6: light-dark(color(display-p3 0.008 0.008 0.165 / 0.15), color(display-p3 0.882 0.949 0.996 / 0.183));
100
+ --neutral-a7: light-dark(color(display-p3 0.008 0.027 0.184 / 0.197), color(display-p3 0.882 0.929 1 / 0.246));
101
+
102
+ /* primary: indigo */
103
+ --primary-7: light-dark(color(display-p3 0.685 0.74 0.957), color(display-p3 0.245 0.309 0.575));
104
+ --primary-9: light-dark(color(display-p3 0.276 0.384 0.837), color(display-p3 0.276 0.384 0.837));
105
+ --primary-10: light-dark(color(display-p3 0.234 0.343 0.801), color(display-p3 0.354 0.445 0.866));
106
+ --primary-11: light-dark(color(display-p3 0.256 0.354 0.755), color(display-p3 0.63 0.69 1));
107
+ --primary-a2: light-dark(color(display-p3 0.024 0.161 0.863 / 0.028), color(display-p3 0.251 0.345 0.988 / 0.085));
108
+ --primary-a3: light-dark(color(display-p3 0.008 0.239 0.886 / 0.067), color(display-p3 0.243 0.404 1 / 0.223));
109
+ --primary-a4: light-dark(color(display-p3 0.004 0.247 1 / 0.114), color(display-p3 0.263 0.42 1 / 0.324));
110
+ --primary-a5: light-dark(color(display-p3 0.004 0.235 1 / 0.169), color(display-p3 0.314 0.451 1 / 0.4));
111
+ --primary-a6: light-dark(color(display-p3 0.004 0.208 0.984 / 0.232), color(display-p3 0.361 0.49 1 / 0.467));
112
+ --primary-a7: light-dark(color(display-p3 0.004 0.176 0.863 / 0.314), color(display-p3 0.388 0.51 1 / 0.547));
113
+ --primary-a11: light-dark(color(display-p3 0.256 0.354 0.755), color(display-p3 0.63 0.69 1));
114
+
115
+ /* accent: orange */
116
+ --accent-7: light-dark(color(display-p3 0.919 0.693 0.486), color(display-p3 0.465 0.283 0.147));
117
+ --accent-9: light-dark(color(display-p3 0.9 0.45 0.2), color(display-p3 0.9 0.45 0.2));
118
+ --accent-10: light-dark(color(display-p3 0.87 0.409 0.164), color(display-p3 0.98 0.51 0.23));
119
+ --accent-11: light-dark(color(display-p3 0.76 0.34 0), color(display-p3 1 0.63 0.38));
120
+ --accent-a2: light-dark(color(display-p3 0.886 0.533 0.008 / 0.067), color(display-p3 0.992 0.529 0 / 0.051));
121
+ --accent-a3: light-dark(color(display-p3 0.922 0.584 0.008 / 0.15), color(display-p3 0.996 0.486 0 / 0.131));
122
+ --accent-a4: light-dark(color(display-p3 1 0.604 0.004 / 0.314), color(display-p3 0.996 0.384 0 / 0.211));
123
+ --accent-a5: light-dark(color(display-p3 1 0.569 0.004 / 0.416), color(display-p3 1 0.455 0 / 0.265));
124
+ --accent-a6: light-dark(color(display-p3 0.949 0.494 0.004 / 0.455), color(display-p3 1 0.529 0.129 / 0.332));
125
+ --accent-a7: light-dark(color(display-p3 0.839 0.408 0 / 0.514), color(display-p3 1 0.569 0.251 / 0.429));
126
+ --accent-a11: light-dark(color(display-p3 0.76 0.34 0), color(display-p3 1 0.63 0.38));
127
+
128
+ /* warning: yellow */
129
+ --warning-7: light-dark(color(display-p3 0.876 0.785 0.46), color(display-p3 0.389 0.331 0.135));
130
+ --warning-9: light-dark(color(display-p3 1 0.92 0.22), color(display-p3 1 0.92 0.22));
131
+ --warning-10: light-dark(color(display-p3 0.977 0.868 0.291), color(display-p3 1 1 0.456));
132
+ --warning-11: light-dark(color(display-p3 0.6 0.44 0), color(display-p3 0.948 0.885 0.392));
133
+ --warning-a2: light-dark(color(display-p3 0.953 0.855 0.008 / 0.079), color(display-p3 0.996 0.792 0 / 0.038));
134
+ --warning-a3: light-dark(color(display-p3 0.988 0.925 0.004 / 0.251), color(display-p3 0.996 0.71 0 / 0.11));
135
+ --warning-a4: light-dark(color(display-p3 0.98 0.875 0.004 / 0.373), color(display-p3 0.996 0.741 0 / 0.152));
136
+ --warning-a5: light-dark(color(display-p3 0.969 0.816 0.004 / 0.491), color(display-p3 0.996 0.765 0 / 0.202));
137
+ --warning-a6: light-dark(color(display-p3 0.875 0.71 0 / 0.526), color(display-p3 0.996 0.816 0.082 / 0.261));
138
+ --warning-a7: light-dark(color(display-p3 0.769 0.604 0 / 0.542), color(display-p3 1 0.831 0.263 / 0.345));
139
+ --warning-a11: light-dark(color(display-p3 0.6 0.44 0), color(display-p3 0.948 0.885 0.392));
140
+
141
+ /* info: cyan */
142
+ --info-7: light-dark(color(display-p3 0.564 0.8 0.854), color(display-p3 0.186 0.398 0.484));
143
+ --info-9: light-dark(color(display-p3 0.282 0.627 0.765), color(display-p3 0.282 0.627 0.765));
144
+ --info-10: light-dark(color(display-p3 0.264 0.583 0.71), color(display-p3 0.331 0.675 0.801));
145
+ --info-11: light-dark(color(display-p3 0.08 0.48 0.63), color(display-p3 0.446 0.79 0.887));
146
+ --info-a2: light-dark(color(display-p3 0.02 0.557 0.647 / 0.044), color(display-p3 0.133 0.733 1 / 0.059));
147
+ --info-a3: light-dark(color(display-p3 0.004 0.694 0.796 / 0.114), color(display-p3 0.122 0.741 0.996 / 0.152));
148
+ --info-a4: light-dark(color(display-p3 0.004 0.678 0.784 / 0.181), color(display-p3 0.051 0.725 1 / 0.227));
149
+ --info-a5: light-dark(color(display-p3 0.004 0.624 0.733 / 0.248), color(display-p3 0.149 0.757 1 / 0.29));
150
+ --info-a6: light-dark(color(display-p3 0.004 0.584 0.706 / 0.33), color(display-p3 0.267 0.792 1 / 0.358));
151
+ --info-a7: light-dark(color(display-p3 0.004 0.541 0.667 / 0.436), color(display-p3 0.333 0.808 1 / 0.446));
152
+ --info-a11: light-dark(color(display-p3 0.08 0.48 0.63), color(display-p3 0.446 0.79 0.887));
153
+ }
154
+ }
155
+ }
156
+ }