@troennes/minium 0.1.1 → 0.3.0

package/dist/themes/blue.css

@@ -0,0 +1,128 @@
+@layer tokens, theme, reset, base, layout, components, project, utilities;
+
+/* Theme: blue (neutral: slate, primary: blue, accent: purple, info: cyan). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
+@layer theme {
+  :root {
+    /* neutral: slate */
+    --neutral-1: light-dark(#fcfcfd, #111113);
+    --neutral-2: light-dark(#f9f9fb, #18191b);
+    --neutral-3: light-dark(#f0f0f3, #212225);
+    --neutral-4: light-dark(#e8e8ec, #272a2d);
+    --neutral-5: light-dark(#e0e1e6, #2e3135);
+    --neutral-8: light-dark(#b9bbc6, #5a6169);
+    --neutral-11: light-dark(#60646c, #b0b4ba);
+    --neutral-12: light-dark(#1c2024, #edeef0);
+    --neutral-a2: light-dark(#00005506, #d8f4f609);
+    --neutral-a3: light-dark(#0000330f, #ddeaf814);
+    --neutral-a4: light-dark(#00002d17, #d3edf81d);
+    --neutral-a5: light-dark(#0009321f, #d9edfe25);
+    --neutral-a6: light-dark(#00002f26, #d6ebfd30);
+    --neutral-a7: light-dark(#00062e32, #d9edff40);
+
+    /* primary: blue */
+    --primary-7: light-dark(#8ec8f6, #205d9e);
+    --primary-9: light-dark(#0090ff, #0090ff);
+    --primary-10: light-dark(#0588f0, #3b9eff);
+    --primary-11: light-dark(#0d74ce, #70b8ff);
+    --primary-a2: light-dark(#008cff0b, #1166fb18);
+    --primary-a3: light-dark(#008ff519, #0077ff3a);
+    --primary-a4: light-dark(#009eff2a, #0075ff57);
+    --primary-a5: light-dark(#0093ff3d, #0081fd6b);
+    --primary-a6: light-dark(#0088f653, #0f89fd7f);
+    --primary-a7: light-dark(#0083eb71, #2a91fe98);
+    --primary-a11: light-dark(#006dcbf2, #70b8ff);
+    --primary-text: var(--primary-11);
+    --primary-inverse: white;
+
+    /* accent: purple */
+    --accent-7: light-dark(#d1afec, #664282);
+    --accent-9: light-dark(#8e4ec6, #8e4ec6);
+    --accent-10: light-dark(#8347b9, #9a5cd0);
+    --accent-11: light-dark(#8145b5, #d19dff);
+    --accent-a2: light-dark(#8000e008, #b744f714);
+    --accent-a3: light-dark(#8e00f112, #c150ff2d);
+    --accent-a4: light-dark(#8d00e51d, #bb53fd42);
+    --accent-a5: light-dark(#8000db2a, #be5cfd51);
+    --accent-a6: light-dark(#7a01d03b, #c16dfd61);
+    --accent-a7: light-dark(#6d00c350, #c378fd7a);
+    --accent-a11: light-dark(#52009aba, #d19dff);
+    --accent-text: var(--accent-11);
+    --accent-inverse: white;
+
+    /* info: cyan */
+    --info-7: light-dark(#7dcedc, #12677e);
+    --info-9: light-dark(#00a2c7, #00a2c7);
+    --info-10: light-dark(#0797b9, #23afd0);
+    --info-11: light-dark(#107d98, #4ccce6);
+    --info-a2: light-dark(#009db10d, #02a7f211);
+    --info-a3: light-dark(#00c2d121, #00befd28);
+    --info-a4: light-dark(#00bcd435, #00baff3b);
+    --info-a5: light-dark(#01b4cc4a, #00befd4d);
+    --info-a6: light-dark(#00a7c162, #00c7fd5e);
+    --info-a7: light-dark(#009fbb82, #14cdff75);
+    --info-a11: light-dark(#007491ef, #52e1fee5);
+    --info-text: var(--info-11);
+    --info-inverse: white;
+  }
+
+  @supports (color: color(display-p3 1 1 1)) {
+    @media (color-gamut: p3) {
+      :root {
+        /* neutral: slate */
+        --neutral-1: light-dark(color(display-p3 0.988 0.988 0.992), color(display-p3 0.067 0.067 0.074));
+        --neutral-2: light-dark(color(display-p3 0.976 0.976 0.984), color(display-p3 0.095 0.098 0.105));
+        --neutral-3: light-dark(color(display-p3 0.94 0.941 0.953), color(display-p3 0.13 0.135 0.145));
+        --neutral-4: light-dark(color(display-p3 0.908 0.909 0.925), color(display-p3 0.156 0.163 0.176));
+        --neutral-5: light-dark(color(display-p3 0.88 0.881 0.901), color(display-p3 0.183 0.191 0.206));
+        --neutral-8: light-dark(color(display-p3 0.727 0.733 0.773), color(display-p3 0.357 0.381 0.409));
+        --neutral-11: light-dark(color(display-p3 0.379 0.392 0.421), color(display-p3 0.692 0.704 0.728));
+        --neutral-12: light-dark(color(display-p3 0.113 0.125 0.14), color(display-p3 0.93 0.933 0.94));
+        --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));
+        --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));
+        --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));
+        --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));
+        --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));
+        --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));
+
+        /* primary: blue */
+        --primary-7: light-dark(color(display-p3 0.606 0.777 0.947), color(display-p3 0.195 0.361 0.6));
+        --primary-9: light-dark(color(display-p3 0.247 0.556 0.969), color(display-p3 0.247 0.556 0.969));
+        --primary-10: light-dark(color(display-p3 0.234 0.523 0.912), color(display-p3 0.344 0.612 0.973));
+        --primary-11: light-dark(color(display-p3 0.15 0.44 0.84), color(display-p3 0.49 0.72 1));
+        --primary-a2: light-dark(color(display-p3 0.024 0.514 0.906 / 0.04), color(display-p3 0.114 0.435 0.988 / 0.085));
+        --primary-a3: light-dark(color(display-p3 0.012 0.506 0.914 / 0.087), color(display-p3 0.122 0.463 1 / 0.219));
+        --primary-a4: light-dark(color(display-p3 0.008 0.545 1 / 0.146), color(display-p3 0 0.467 1 / 0.324));
+        --primary-a5: light-dark(color(display-p3 0.004 0.502 0.984 / 0.212), color(display-p3 0.098 0.51 1 / 0.4));
+        --primary-a6: light-dark(color(display-p3 0.004 0.463 0.922 / 0.291), color(display-p3 0.224 0.557 1 / 0.475));
+        --primary-a7: light-dark(color(display-p3 0.004 0.431 0.863 / 0.393), color(display-p3 0.294 0.584 1 / 0.572));
+        --primary-a11: light-dark(color(display-p3 0.15 0.44 0.84), color(display-p3 0.49 0.72 1));
+
+        /* accent: purple */
+        --accent-7: light-dark(color(display-p3 0.799 0.69 0.91), color(display-p3 0.381 0.266 0.496));
+        --accent-9: light-dark(color(display-p3 0.523 0.318 0.751), color(display-p3 0.523 0.318 0.751));
+        --accent-10: light-dark(color(display-p3 0.483 0.289 0.7), color(display-p3 0.57 0.373 0.791));
+        --accent-11: light-dark(color(display-p3 0.473 0.281 0.687), color(display-p3 0.8 0.62 1));
+        --accent-a2: light-dark(color(display-p3 0.443 0.024 0.722 / 0.028), color(display-p3 0.722 0.286 0.996 / 0.072));
+        --accent-a3: light-dark(color(display-p3 0.506 0.008 0.835 / 0.071), color(display-p3 0.718 0.349 0.996 / 0.169));
+        --accent-a4: light-dark(color(display-p3 0.451 0.004 0.831 / 0.114), color(display-p3 0.702 0.353 1 / 0.248));
+        --accent-a5: light-dark(color(display-p3 0.431 0.004 0.788 / 0.165), color(display-p3 0.718 0.404 1 / 0.303));
+        --accent-a6: light-dark(color(display-p3 0.384 0.004 0.745 / 0.228), color(display-p3 0.733 0.455 1 / 0.366));
+        --accent-a7: light-dark(color(display-p3 0.357 0.004 0.71 / 0.31), color(display-p3 0.753 0.506 1 / 0.458));
+        --accent-a11: light-dark(color(display-p3 0.473 0.281 0.687), color(display-p3 0.8 0.62 1));
+
+        /* info: cyan */
+        --info-7: light-dark(color(display-p3 0.564 0.8 0.854), color(display-p3 0.186 0.398 0.484));
+        --info-9: light-dark(color(display-p3 0.282 0.627 0.765), color(display-p3 0.282 0.627 0.765));
+        --info-10: light-dark(color(display-p3 0.264 0.583 0.71), color(display-p3 0.331 0.675 0.801));
+        --info-11: light-dark(color(display-p3 0.08 0.48 0.63), color(display-p3 0.446 0.79 0.887));
+        --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));
+        --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));
+        --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));
+        --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));
+        --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));
+        --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));
+        --info-a11: light-dark(color(display-p3 0.08 0.48 0.63), color(display-p3 0.446 0.79 0.887));
+      }
+    }
+  }
+}

package/dist/themes/bronze.css

@@ -0,0 +1,100 @@
+@layer tokens, theme, reset, base, layout, components, project, utilities;
+
+/* Theme: bronze (neutral: sand, primary: bronze, accent: teal). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
+@layer theme {
+  :root {
+    /* neutral: sand */
+    --neutral-1: light-dark(#fdfdfc, #111110);
+    --neutral-2: light-dark(#f9f9f8, #191918);
+    --neutral-3: light-dark(#f1f0ef, #222221);
+    --neutral-4: light-dark(#e9e8e6, #2a2a28);
+    --neutral-5: light-dark(#e2e1de, #31312e);
+    --neutral-8: light-dark(#bcbbb5, #62605b);
+    --neutral-11: light-dark(#63635e, #b5b3ad);
+    --neutral-12: light-dark(#21201c, #eeeeec);
+    --neutral-a2: light-dark(#25250007, #f4f4f309);
+    --neutral-a3: light-dark(#20100010, #f6f6f513);
+    --neutral-a4: light-dark(#1f150019, #fefef31b);
+    --neutral-a5: light-dark(#1f180021, #fbfbeb23);
+    --neutral-a6: light-dark(#19130029, #fffaed2d);
+    --neutral-a7: light-dark(#19140035, #fffbed3c);
+
+    /* primary: bronze */
+    --primary-7: light-dark(#d3bcb3, #5a4c47);
+    --primary-9: light-dark(#a18072, #a18072);
+    --primary-10: light-dark(#957468, #ae8c7e);
+    --primary-11: light-dark(#7d5e54, #d4b3a5);
+    --primary-a2: light-dark(#cc33000a, #fbbc910c);
+    --primary-a3: light-dark(#92250015, #faceb817);
+    --primary-a4: light-dark(#80280020, #facdb622);
+    --primary-a5: light-dark(#7423002c, #ffd2c12d);
+    --primary-a6: light-dark(#7324003a, #ffd1c03c);
+    --primary-a7: light-dark(#6c1f004c, #fdd0c04f);
+    --primary-a11: light-dark(#3d0f00ab, #ffd7c6d1);
+    --primary-text: var(--primary-11);
+    --primary-inverse: white;
+
+    /* accent: teal */
+    --accent-7: light-dark(#83cdc1, #1c6961);
+    --accent-9: light-dark(#12a594, #12a594);
+    --accent-10: light-dark(#0d9b8a, #0eb39e);
+    --accent-11: light-dark(#008573, #0bd8b6);
+    --accent-a2: light-dark(#00aa800c, #12fbe60c);
+    --accent-a3: light-dark(#00c69d1f, #00ffe61e);
+    --accent-a4: light-dark(#00c39633, #00ffe92d);
+    --accent-a5: light-dark(#00b49047, #00ffea3b);
+    --accent-a6: light-dark(#00a6855e, #1cffe84b);
+    --accent-a7: light-dark(#0099807c, #2efde85f);
+    --accent-a11: light-dark(#008573, #0afed5d6);
+    --accent-text: var(--accent-11);
+    --accent-inverse: white;
+  }
+
+  @supports (color: color(display-p3 1 1 1)) {
+    @media (color-gamut: p3) {
+      :root {
+        /* neutral: sand */
+        --neutral-1: light-dark(color(display-p3 0.992 0.992 0.989), color(display-p3 0.067 0.067 0.063));
+        --neutral-2: light-dark(color(display-p3 0.977 0.977 0.973), color(display-p3 0.098 0.098 0.094));
+        --neutral-3: light-dark(color(display-p3 0.943 0.942 0.936), color(display-p3 0.135 0.135 0.129));
+        --neutral-4: light-dark(color(display-p3 0.913 0.912 0.903), color(display-p3 0.164 0.163 0.156));
+        --neutral-5: light-dark(color(display-p3 0.885 0.883 0.873), color(display-p3 0.193 0.192 0.183));
+        --neutral-8: light-dark(color(display-p3 0.738 0.734 0.713), color(display-p3 0.384 0.378 0.357));
+        --neutral-11: light-dark(color(display-p3 0.388 0.388 0.37), color(display-p3 0.707 0.703 0.68));
+        --neutral-12: light-dark(color(display-p3 0.129 0.126 0.111), color(display-p3 0.933 0.933 0.926));
+        --neutral-a2: light-dark(color(display-p3 0.161 0.161 0.024 / 0.028), color(display-p3 0.992 0.992 0.988 / 0.034));
+        --neutral-a3: light-dark(color(display-p3 0.067 0.067 0.008 / 0.063), color(display-p3 0.996 0.996 0.992 / 0.072));
+        --neutral-a4: light-dark(color(display-p3 0.129 0.129 0.012 / 0.099), color(display-p3 0.992 0.992 0.953 / 0.106));
+        --neutral-a5: light-dark(color(display-p3 0.098 0.067 0.008 / 0.126), color(display-p3 1 1 0.965 / 0.135));
+        --neutral-a6: light-dark(color(display-p3 0.102 0.075 0.004 / 0.161), color(display-p3 1 0.976 0.929 / 0.177));
+        --neutral-a7: light-dark(color(display-p3 0.098 0.098 0.004 / 0.208), color(display-p3 1 0.984 0.929 / 0.236));
+
+        /* primary: bronze */
+        --primary-7: light-dark(color(display-p3 0.812 0.739 0.706), color(display-p3 0.343 0.302 0.281));
+        --primary-9: light-dark(color(display-p3 0.611 0.507 0.455), color(display-p3 0.611 0.507 0.455));
+        --primary-10: light-dark(color(display-p3 0.563 0.461 0.414), color(display-p3 0.66 0.556 0.504));
+        --primary-11: light-dark(color(display-p3 0.471 0.373 0.336), color(display-p3 0.81 0.707 0.655));
+        --primary-a2: light-dark(color(display-p3 0.71 0.22 0.024 / 0.04), color(display-p3 0.98 0.8 0.706 / 0.043));
+        --primary-a3: light-dark(color(display-p3 0.482 0.2 0.008 / 0.083), color(display-p3 0.988 0.851 0.761 / 0.085));
+        --primary-a4: light-dark(color(display-p3 0.424 0.133 0.004 / 0.122), color(display-p3 0.996 0.839 0.78 / 0.127));
+        --primary-a5: light-dark(color(display-p3 0.4 0.145 0.004 / 0.169), color(display-p3 0.996 0.863 0.773 / 0.173));
+        --primary-a6: light-dark(color(display-p3 0.388 0.125 0.004 / 0.224), color(display-p3 1 0.863 0.796 / 0.227));
+        --primary-a7: light-dark(color(display-p3 0.365 0.11 0.004 / 0.295), color(display-p3 1 0.867 0.8 / 0.295));
+        --primary-a11: light-dark(color(display-p3 0.471 0.373 0.336), color(display-p3 0.81 0.707 0.655));
+
+        /* accent: teal */
+        --accent-7: light-dark(color(display-p3 0.581 0.798 0.756), color(display-p3 0.205 0.406 0.379));
+        --accent-9: light-dark(color(display-p3 0.297 0.637 0.581), color(display-p3 0.297 0.637 0.581));
+        --accent-10: light-dark(color(display-p3 0.275 0.599 0.542), color(display-p3 0.319 0.69 0.62));
+        --accent-11: light-dark(color(display-p3 0.08 0.5 0.43), color(display-p3 0.388 0.835 0.719));
+        --accent-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));
+        --accent-a3: light-dark(color(display-p3 0.004 0.741 0.557 / 0.106), color(display-p3 0.235 1 0.898 / 0.118));
+        --accent-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));
+        --accent-a5: light-dark(color(display-p3 0.004 0.643 0.494 / 0.24), color(display-p3 0.31 1 0.933 / 0.227));
+        --accent-a6: light-dark(color(display-p3 0.004 0.569 0.447 / 0.318), color(display-p3 0.396 1 0.933 / 0.286));
+        --accent-a7: light-dark(color(display-p3 0.004 0.518 0.424 / 0.42), color(display-p3 0.443 1 0.925 / 0.366));
+        --accent-a11: light-dark(color(display-p3 0.08 0.5 0.43), color(display-p3 0.388 0.835 0.719));
+      }
+    }
+  }
+}

package/dist/themes/brown.css

@@ -0,0 +1,128 @@
+@layer tokens, theme, reset, base, layout, components, project, utilities;
+
+/* Theme: brown (neutral: sand, primary: brown, accent: sky, info: indigo). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
+@layer theme {
+  :root {
+    /* neutral: sand */
+    --neutral-1: light-dark(#fdfdfc, #111110);
+    --neutral-2: light-dark(#f9f9f8, #191918);
+    --neutral-3: light-dark(#f1f0ef, #222221);
+    --neutral-4: light-dark(#e9e8e6, #2a2a28);
+    --neutral-5: light-dark(#e2e1de, #31312e);
+    --neutral-8: light-dark(#bcbbb5, #62605b);
+    --neutral-11: light-dark(#63635e, #b5b3ad);
+    --neutral-12: light-dark(#21201c, #eeeeec);
+    --neutral-a2: light-dark(#25250007, #f4f4f309);
+    --neutral-a3: light-dark(#20100010, #f6f6f513);
+    --neutral-a4: light-dark(#1f150019, #fefef31b);
+    --neutral-a5: light-dark(#1f180021, #fbfbeb23);
+    --neutral-a6: light-dark(#19130029, #fffaed2d);
+    --neutral-a7: light-dark(#19140035, #fffbed3c);
+
+    /* primary: brown */
+    --primary-7: light-dark(#dcbc9f, #614a39);
+    --primary-9: light-dark(#ad7f58, #ad7f58);
+    --primary-10: light-dark(#a07553, #b88c67);
+    --primary-11: light-dark(#815e46, #dbb594);
+    --primary-a2: light-dark(#aa550009, #fba67c0c);
+    --primary-a3: light-dark(#a04b0018, #fcb58c19);
+    --primary-a4: light-dark(#9b4a0026, #fbbb8a24);
+    --primary-a5: light-dark(#9f4d0035, #fcb88931);
+    --primary-a6: light-dark(#a04e0048, #fdba8741);
+    --primary-a7: light-dark(#a34e0060, #ffbb8856);
+    --primary-a11: light-dark(#522100b9, #fed1aad9);
+    --primary-text: var(--primary-11);
+    --primary-inverse: white;
+
+    /* accent: sky */
+    --accent-7: light-dark(#8dcae3, #1f6692);
+    --accent-9: light-dark(#7ce2fe, #7ce2fe);
+    --accent-10: light-dark(#74daf8, #a8eeff);
+    --accent-11: light-dark(#00749e, #75c7f0);
+    --accent-a2: light-dark(#00a4db0e, #1171fb18);
+    --accent-a3: light-dark(#00b3ee1e, #1184fc33);
+    --accent-a4: light-dark(#00ace42e, #128fff49);
+    --accent-a5: light-dark(#00a1d841, #1c9dfd5d);
+    --accent-a6: light-dark(#0092ca56, #28a5ff72);
+    --accent-a7: light-dark(#0089c172, #2badfe8b);
+    --accent-a11: light-dark(#00749e, #7cd3ffef);
+    --accent-text: light-dark(var(--neutral-12), var(--accent-11));
+    --accent-inverse: light-dark(var(--neutral-12), var(--neutral-1));
+
+    /* info: indigo */
+    --info-7: light-dark(#abbdf9, #3a4f97);
+    --info-9: light-dark(#3e63dd, #3e63dd);
+    --info-10: light-dark(#3358d4, #5472e4);
+    --info-11: light-dark(#3a5bc7, #9eb1ff);
+    --info-a2: light-dark(#0040ff08, #3354fa17);
+    --info-a3: light-dark(#0047f112, #2f62ff3c);
+    --info-a4: light-dark(#0044ff1e, #3566ff57);
+    --info-a5: light-dark(#0044ff2d, #4171fd6b);
+    --info-a6: light-dark(#003eff3e, #5178fd7c);
+    --info-a7: light-dark(#0037ed54, #5a7fff90);
+    --info-a11: light-dark(#002bb7c5, #9eb1ff);
+    --info-text: var(--info-11);
+    --info-inverse: white;
+  }
+
+  @supports (color: color(display-p3 1 1 1)) {
+    @media (color-gamut: p3) {
+      :root {
+        /* neutral: sand */
+        --neutral-1: light-dark(color(display-p3 0.992 0.992 0.989), color(display-p3 0.067 0.067 0.063));
+        --neutral-2: light-dark(color(display-p3 0.977 0.977 0.973), color(display-p3 0.098 0.098 0.094));
+        --neutral-3: light-dark(color(display-p3 0.943 0.942 0.936), color(display-p3 0.135 0.135 0.129));
+        --neutral-4: light-dark(color(display-p3 0.913 0.912 0.903), color(display-p3 0.164 0.163 0.156));
+        --neutral-5: light-dark(color(display-p3 0.885 0.883 0.873), color(display-p3 0.193 0.192 0.183));
+        --neutral-8: light-dark(color(display-p3 0.738 0.734 0.713), color(display-p3 0.384 0.378 0.357));
+        --neutral-11: light-dark(color(display-p3 0.388 0.388 0.37), color(display-p3 0.707 0.703 0.68));
+        --neutral-12: light-dark(color(display-p3 0.129 0.126 0.111), color(display-p3 0.933 0.933 0.926));
+        --neutral-a2: light-dark(color(display-p3 0.161 0.161 0.024 / 0.028), color(display-p3 0.992 0.992 0.988 / 0.034));
+        --neutral-a3: light-dark(color(display-p3 0.067 0.067 0.008 / 0.063), color(display-p3 0.996 0.996 0.992 / 0.072));
+        --neutral-a4: light-dark(color(display-p3 0.129 0.129 0.012 / 0.099), color(display-p3 0.992 0.992 0.953 / 0.106));
+        --neutral-a5: light-dark(color(display-p3 0.098 0.067 0.008 / 0.126), color(display-p3 1 1 0.965 / 0.135));
+        --neutral-a6: light-dark(color(display-p3 0.102 0.075 0.004 / 0.161), color(display-p3 1 0.976 0.929 / 0.177));
+        --neutral-a7: light-dark(color(display-p3 0.098 0.098 0.004 / 0.208), color(display-p3 1 0.984 0.929 / 0.236));
+
+        /* primary: brown */
+        --primary-7: light-dark(color(display-p3 0.841 0.742 0.639), color(display-p3 0.365 0.295 0.232));
+        --primary-9: light-dark(color(display-p3 0.651 0.505 0.368), color(display-p3 0.651 0.505 0.368));
+        --primary-10: light-dark(color(display-p3 0.601 0.465 0.344), color(display-p3 0.697 0.557 0.423));
+        --primary-11: light-dark(color(display-p3 0.485 0.374 0.288), color(display-p3 0.835 0.715 0.597));
+        --primary-a2: light-dark(color(display-p3 0.675 0.349 0.024 / 0.036), color(display-p3 0.98 0.706 0.525 / 0.043));
+        --primary-a3: light-dark(color(display-p3 0.573 0.314 0.012 / 0.091), color(display-p3 0.996 0.745 0.576 / 0.093));
+        --primary-a4: light-dark(color(display-p3 0.545 0.302 0.008 / 0.146), color(display-p3 1 0.765 0.592 / 0.135));
+        --primary-a5: light-dark(color(display-p3 0.561 0.29 0.004 / 0.204), color(display-p3 1 0.761 0.588 / 0.181));
+        --primary-a6: light-dark(color(display-p3 0.553 0.294 0.004 / 0.271), color(display-p3 1 0.773 0.592 / 0.24));
+        --primary-a7: light-dark(color(display-p3 0.557 0.286 0.004 / 0.361), color(display-p3 0.996 0.776 0.58 / 0.32));
+        --primary-a11: light-dark(color(display-p3 0.485 0.374 0.288), color(display-p3 0.835 0.715 0.597));
+
+        /* accent: sky */
+        --accent-7: light-dark(color(display-p3 0.604 0.785 0.879), color(display-p3 0.205 0.394 0.557));
+        --accent-9: light-dark(color(display-p3 0.585 0.877 0.983), color(display-p3 0.585 0.877 0.983));
+        --accent-10: light-dark(color(display-p3 0.555 0.845 0.959), color(display-p3 0.718 0.925 0.991));
+        --accent-11: light-dark(color(display-p3 0.193 0.448 0.605), color(display-p3 0.536 0.772 0.924));
+        --accent-a2: light-dark(color(display-p3 0.024 0.592 0.757 / 0.048), color(display-p3 0.157 0.467 0.992 / 0.089));
+        --accent-a3: light-dark(color(display-p3 0.004 0.655 0.886 / 0.102), color(display-p3 0.192 0.522 0.996 / 0.19));
+        --accent-a4: light-dark(color(display-p3 0.004 0.604 0.851 / 0.157), color(display-p3 0.212 0.584 1 / 0.274));
+        --accent-a5: light-dark(color(display-p3 0.004 0.565 0.792 / 0.224), color(display-p3 0.259 0.631 1 / 0.349));
+        --accent-a6: light-dark(color(display-p3 0.004 0.502 0.737 / 0.299), color(display-p3 0.302 0.655 1 / 0.433));
+        --accent-a7: light-dark(color(display-p3 0.004 0.459 0.694 / 0.397), color(display-p3 0.329 0.686 1 / 0.526));
+        --accent-a11: light-dark(color(display-p3 0.193 0.448 0.605), color(display-p3 0.536 0.772 0.924));
+
+        /* info: indigo */
+        --info-7: light-dark(color(display-p3 0.685 0.74 0.957), color(display-p3 0.245 0.309 0.575));
+        --info-9: light-dark(color(display-p3 0.276 0.384 0.837), color(display-p3 0.276 0.384 0.837));
+        --info-10: light-dark(color(display-p3 0.234 0.343 0.801), color(display-p3 0.354 0.445 0.866));
+        --info-11: light-dark(color(display-p3 0.256 0.354 0.755), color(display-p3 0.63 0.69 1));
+        --info-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));
+        --info-a3: light-dark(color(display-p3 0.008 0.239 0.886 / 0.067), color(display-p3 0.243 0.404 1 / 0.223));
+        --info-a4: light-dark(color(display-p3 0.004 0.247 1 / 0.114), color(display-p3 0.263 0.42 1 / 0.324));
+        --info-a5: light-dark(color(display-p3 0.004 0.235 1 / 0.169), color(display-p3 0.314 0.451 1 / 0.4));
+        --info-a6: light-dark(color(display-p3 0.004 0.208 0.984 / 0.232), color(display-p3 0.361 0.49 1 / 0.467));
+        --info-a7: light-dark(color(display-p3 0.004 0.176 0.863 / 0.314), color(display-p3 0.388 0.51 1 / 0.547));
+        --info-a11: light-dark(color(display-p3 0.256 0.354 0.755), color(display-p3 0.63 0.69 1));
+      }
+    }
+  }
+}

package/dist/themes/crimson.css

@@ -0,0 +1,159 @@
+@layer tokens, theme, reset, base, layout, components, project, utilities;
+
+/* Theme: crimson (neutral: mauve, primary: crimson, accent: cyan, danger: tomato, info: indigo). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
+@layer theme {
+  :root {
+    /* neutral: mauve */
+    --neutral-1: light-dark(#fdfcfd, #121113);
+    --neutral-2: light-dark(#faf9fb, #1a191b);
+    --neutral-3: light-dark(#f2eff3, #232225);
+    --neutral-4: light-dark(#eae7ec, #2b292d);
+    --neutral-5: light-dark(#e3dfe6, #323035);
+    --neutral-8: light-dark(#bcbac7, #625f69);
+    --neutral-11: light-dark(#65636d, #b5b2bc);
+    --neutral-12: light-dark(#211f26, #eeeef0);
+    --neutral-a2: light-dark(#2b005506, #f5f4f609);
+    --neutral-a3: light-dark(#30004010, #ebeaf814);
+    --neutral-a4: light-dark(#20003618, #eee5f81d);
+    --neutral-a5: light-dark(#20003820, #efe6fe25);
+    --neutral-a6: light-dark(#14003527, #f1e6fd30);
+    --neutral-a7: light-dark(#10003332, #eee9ff40);
+
+    /* primary: crimson */
+    --primary-7: light-dark(#eaacc3, #873356);
+    --primary-9: light-dark(#e93d82, #e93d82);
+    --primary-10: light-dark(#df3478, #ee518a);
+    --primary-11: light-dark(#cb1d63, #ff92ad);
+    --primary-a2: light-dark(#e0004008, #f22f7a11);
+    --primary-a3: light-dark(#ff005216, #fe2a8b2a);
+    --primary-a4: light-dark(#f8005123, #fd158741);
+    --primary-a5: light-dark(#e5004f31, #fd278f51);
+    --primary-a6: light-dark(#d0004b41, #fe459763);
+    --primary-a7: light-dark(#bf004753, #fd559b7f);
+    --primary-a11: light-dark(#c4004fe2, #ff92ad);
+    --primary-text: var(--primary-11);
+    --primary-inverse: white;
+
+    /* accent: cyan */
+    --accent-7: light-dark(#7dcedc, #12677e);
+    --accent-9: light-dark(#00a2c7, #00a2c7);
+    --accent-10: light-dark(#0797b9, #23afd0);
+    --accent-11: light-dark(#107d98, #4ccce6);
+    --accent-a2: light-dark(#009db10d, #02a7f211);
+    --accent-a3: light-dark(#00c2d121, #00befd28);
+    --accent-a4: light-dark(#00bcd435, #00baff3b);
+    --accent-a5: light-dark(#01b4cc4a, #00befd4d);
+    --accent-a6: light-dark(#00a7c162, #00c7fd5e);
+    --accent-a7: light-dark(#009fbb82, #14cdff75);
+    --accent-a11: light-dark(#007491ef, #52e1fee5);
+    --accent-text: var(--accent-11);
+    --accent-inverse: white;
+
+    /* danger: tomato */
+    --danger-7: light-dark(#f5a898, #853a2d);
+    --danger-9: light-dark(#e54d2e, #e54d2e);
+    --danger-10: light-dark(#dd4425, #ec6142);
+    --danger-11: light-dark(#d13415, #ff977d);
+    --danger-a2: light-dark(#ff200008, #ff55330f);
+    --danger-a3: light-dark(#f52b0018, #ff35232b);
+    --danger-a4: light-dark(#ff35002c, #fd201142);
+    --danger-a5: light-dark(#ff2e003d, #fe332153);
+    --danger-a6: light-dark(#f92d0050, #ff4f3864);
+    --danger-a7: light-dark(#e7280067, #fd644a7d);
+    --danger-a11: light-dark(#cd2200ea, #ff977d);
+    --danger-text: var(--danger-11);
+    --danger-inverse: white;
+
+    /* info: indigo */
+    --info-7: light-dark(#abbdf9, #3a4f97);
+    --info-9: light-dark(#3e63dd, #3e63dd);
+    --info-10: light-dark(#3358d4, #5472e4);
+    --info-11: light-dark(#3a5bc7, #9eb1ff);
+    --info-a2: light-dark(#0040ff08, #3354fa17);
+    --info-a3: light-dark(#0047f112, #2f62ff3c);
+    --info-a4: light-dark(#0044ff1e, #3566ff57);
+    --info-a5: light-dark(#0044ff2d, #4171fd6b);
+    --info-a6: light-dark(#003eff3e, #5178fd7c);
+    --info-a7: light-dark(#0037ed54, #5a7fff90);
+    --info-a11: light-dark(#002bb7c5, #9eb1ff);
+    --info-text: var(--info-11);
+    --info-inverse: white;
+
+    /* icons */
+    --icon-invalid: 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='%23e54d2e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' x2='12' y1='8' y2='12'/%3E%3Cline x1='12' x2='12.01' y1='16' y2='16'/%3E%3C/svg%3E");
+  }
+
+  @supports (color: color(display-p3 1 1 1)) {
+    @media (color-gamut: p3) {
+      :root {
+        /* neutral: mauve */
+        --neutral-1: light-dark(color(display-p3 0.991 0.988 0.992), color(display-p3 0.07 0.067 0.074));
+        --neutral-2: light-dark(color(display-p3 0.98 0.976 0.984), color(display-p3 0.101 0.098 0.105));
+        --neutral-3: light-dark(color(display-p3 0.946 0.938 0.952), color(display-p3 0.138 0.134 0.144));
+        --neutral-4: light-dark(color(display-p3 0.915 0.906 0.925), color(display-p3 0.167 0.161 0.175));
+        --neutral-5: light-dark(color(display-p3 0.886 0.876 0.901), color(display-p3 0.196 0.189 0.206));
+        --neutral-8: light-dark(color(display-p3 0.735 0.728 0.777), color(display-p3 0.383 0.373 0.408));
+        --neutral-11: light-dark(color(display-p3 0.395 0.388 0.424), color(display-p3 0.707 0.7 0.735));
+        --neutral-12: light-dark(color(display-p3 0.128 0.122 0.147), color(display-p3 0.933 0.933 0.94));
+        --neutral-a2: light-dark(color(display-p3 0.184 0.024 0.349 / 0.024), color(display-p3 0.996 0.992 1 / 0.034));
+        --neutral-a3: light-dark(color(display-p3 0.129 0.008 0.255 / 0.063), color(display-p3 0.937 0.933 0.992 / 0.077));
+        --neutral-a4: light-dark(color(display-p3 0.094 0.012 0.216 / 0.095), color(display-p3 0.957 0.918 0.996 / 0.111));
+        --neutral-a5: light-dark(color(display-p3 0.098 0.008 0.224 / 0.126), color(display-p3 0.937 0.906 0.996 / 0.145));
+        --neutral-a6: light-dark(color(display-p3 0.055 0.004 0.18 / 0.153), color(display-p3 0.953 0.925 0.996 / 0.183));
+        --neutral-a7: light-dark(color(display-p3 0.067 0.008 0.184 / 0.197), color(display-p3 0.945 0.929 1 / 0.246));
+
+        /* primary: crimson */
+        --primary-7: light-dark(color(display-p3 0.88 0.683 0.761), color(display-p3 0.489 0.222 0.336));
+        --primary-9: light-dark(color(display-p3 0.843 0.298 0.507), color(display-p3 0.843 0.298 0.507));
+        --primary-10: light-dark(color(display-p3 0.807 0.266 0.468), color(display-p3 0.864 0.364 0.539));
+        --primary-11: light-dark(color(display-p3 0.731 0.195 0.388), color(display-p3 1 0.56 0.66));
+        --primary-a2: light-dark(color(display-p3 0.757 0.02 0.267 / 0.032), color(display-p3 0.996 0.282 0.569 / 0.055));
+        --primary-a3: light-dark(color(display-p3 0.859 0.008 0.294 / 0.083), color(display-p3 0.996 0.227 0.573 / 0.148));
+        --primary-a4: light-dark(color(display-p3 0.827 0.008 0.298 / 0.134), color(display-p3 1 0.157 0.569 / 0.227));
+        --primary-a5: light-dark(color(display-p3 0.753 0.008 0.275 / 0.189), color(display-p3 1 0.231 0.604 / 0.286));
+        --primary-a6: light-dark(color(display-p3 0.682 0.004 0.247 / 0.244), color(display-p3 1 0.337 0.643 / 0.349));
+        --primary-a7: light-dark(color(display-p3 0.62 0.004 0.251 / 0.318), color(display-p3 1 0.416 0.663 / 0.454));
+        --primary-a11: light-dark(color(display-p3 0.731 0.195 0.388), color(display-p3 1 0.56 0.66));
+
+        /* accent: cyan */
+        --accent-7: light-dark(color(display-p3 0.564 0.8 0.854), color(display-p3 0.186 0.398 0.484));
+        --accent-9: light-dark(color(display-p3 0.282 0.627 0.765), color(display-p3 0.282 0.627 0.765));
+        --accent-10: light-dark(color(display-p3 0.264 0.583 0.71), color(display-p3 0.331 0.675 0.801));
+        --accent-11: light-dark(color(display-p3 0.08 0.48 0.63), color(display-p3 0.446 0.79 0.887));
+        --accent-a2: light-dark(color(display-p3 0.02 0.557 0.647 / 0.044), color(display-p3 0.133 0.733 1 / 0.059));
+        --accent-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));
+        --accent-a4: light-dark(color(display-p3 0.004 0.678 0.784 / 0.181), color(display-p3 0.051 0.725 1 / 0.227));
+        --accent-a5: light-dark(color(display-p3 0.004 0.624 0.733 / 0.248), color(display-p3 0.149 0.757 1 / 0.29));
+        --accent-a6: light-dark(color(display-p3 0.004 0.584 0.706 / 0.33), color(display-p3 0.267 0.792 1 / 0.358));
+        --accent-a7: light-dark(color(display-p3 0.004 0.541 0.667 / 0.436), color(display-p3 0.333 0.808 1 / 0.446));
+        --accent-a11: light-dark(color(display-p3 0.08 0.48 0.63), color(display-p3 0.446 0.79 0.887));
+
+        /* danger: tomato */
+        --danger-7: light-dark(color(display-p3 0.917 0.673 0.611), color(display-p3 0.487 0.245 0.194));
+        --danger-9: light-dark(color(display-p3 0.831 0.345 0.231), color(display-p3 0.831 0.345 0.231));
+        --danger-10: light-dark(color(display-p3 0.802 0.313 0.2), color(display-p3 0.862 0.415 0.298));
+        --danger-11: light-dark(color(display-p3 0.755 0.259 0.152), color(display-p3 1 0.585 0.455));
+        --danger-a2: light-dark(color(display-p3 0.757 0.145 0.02 / 0.032), color(display-p3 0.992 0.376 0.224 / 0.051));
+        --danger-a3: light-dark(color(display-p3 0.831 0.184 0.012 / 0.091), color(display-p3 0.996 0.282 0.176 / 0.148));
+        --danger-a4: light-dark(color(display-p3 0.976 0.192 0.004 / 0.165), color(display-p3 1 0.204 0.118 / 0.232));
+        --danger-a5: light-dark(color(display-p3 0.918 0.192 0.004 / 0.232), color(display-p3 1 0.286 0.192 / 0.29));
+        --danger-a6: light-dark(color(display-p3 0.847 0.173 0.004 / 0.302), color(display-p3 1 0.392 0.278 / 0.353));
+        --danger-a7: light-dark(color(display-p3 0.788 0.165 0.004 / 0.389), color(display-p3 1 0.459 0.349 / 0.45));
+        --danger-a11: light-dark(color(display-p3 0.755 0.259 0.152), color(display-p3 1 0.585 0.455));
+
+        /* info: indigo */
+        --info-7: light-dark(color(display-p3 0.685 0.74 0.957), color(display-p3 0.245 0.309 0.575));
+        --info-9: light-dark(color(display-p3 0.276 0.384 0.837), color(display-p3 0.276 0.384 0.837));
+        --info-10: light-dark(color(display-p3 0.234 0.343 0.801), color(display-p3 0.354 0.445 0.866));
+        --info-11: light-dark(color(display-p3 0.256 0.354 0.755), color(display-p3 0.63 0.69 1));
+        --info-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));
+        --info-a3: light-dark(color(display-p3 0.008 0.239 0.886 / 0.067), color(display-p3 0.243 0.404 1 / 0.223));
+        --info-a4: light-dark(color(display-p3 0.004 0.247 1 / 0.114), color(display-p3 0.263 0.42 1 / 0.324));
+        --info-a5: light-dark(color(display-p3 0.004 0.235 1 / 0.169), color(display-p3 0.314 0.451 1 / 0.4));
+        --info-a6: light-dark(color(display-p3 0.004 0.208 0.984 / 0.232), color(display-p3 0.361 0.49 1 / 0.467));
+        --info-a7: light-dark(color(display-p3 0.004 0.176 0.863 / 0.314), color(display-p3 0.388 0.51 1 / 0.547));
+        --info-a11: light-dark(color(display-p3 0.256 0.354 0.755), color(display-p3 0.63 0.69 1));
+      }
+    }
+  }
+}

package/dist/themes/cyan.css

@@ -0,0 +1,100 @@
+@layer tokens, theme, reset, base, layout, components, project, utilities;
+
+/* Theme: cyan (neutral: slate, primary: cyan, accent: violet). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
+@layer theme {
+  :root {
+    /* neutral: slate */
+    --neutral-1: light-dark(#fcfcfd, #111113);
+    --neutral-2: light-dark(#f9f9fb, #18191b);
+    --neutral-3: light-dark(#f0f0f3, #212225);
+    --neutral-4: light-dark(#e8e8ec, #272a2d);
+    --neutral-5: light-dark(#e0e1e6, #2e3135);
+    --neutral-8: light-dark(#b9bbc6, #5a6169);
+    --neutral-11: light-dark(#60646c, #b0b4ba);
+    --neutral-12: light-dark(#1c2024, #edeef0);
+    --neutral-a2: light-dark(#00005506, #d8f4f609);
+    --neutral-a3: light-dark(#0000330f, #ddeaf814);
+    --neutral-a4: light-dark(#00002d17, #d3edf81d);
+    --neutral-a5: light-dark(#0009321f, #d9edfe25);
+    --neutral-a6: light-dark(#00002f26, #d6ebfd30);
+    --neutral-a7: light-dark(#00062e32, #d9edff40);
+
+    /* primary: cyan */
+    --primary-7: light-dark(#7dcedc, #12677e);
+    --primary-9: light-dark(#00a2c7, #00a2c7);
+    --primary-10: light-dark(#0797b9, #23afd0);
+    --primary-11: light-dark(#107d98, #4ccce6);
+    --primary-a2: light-dark(#009db10d, #02a7f211);
+    --primary-a3: light-dark(#00c2d121, #00befd28);
+    --primary-a4: light-dark(#00bcd435, #00baff3b);
+    --primary-a5: light-dark(#01b4cc4a, #00befd4d);
+    --primary-a6: light-dark(#00a7c162, #00c7fd5e);
+    --primary-a7: light-dark(#009fbb82, #14cdff75);
+    --primary-a11: light-dark(#007491ef, #52e1fee5);
+    --primary-text: var(--primary-11);
+    --primary-inverse: white;
+
+    /* accent: violet */
+    --accent-7: light-dark(#c2b5f5, #56468b);
+    --accent-9: light-dark(#6e56cf, #6e56cf);
+    --accent-10: light-dark(#654dc4, #7d66d9);
+    --accent-11: light-dark(#6550b9, #baa7ff);
+    --accent-a2: light-dark(#4900ff07, #853ff916);
+    --accent-a3: light-dark(#4400ee0f, #8354fe36);
+    --accent-a4: light-dark(#4300ff1b, #7d51fd50);
+    --accent-a5: light-dark(#3600ff26, #845ffd5f);
+    --accent-a6: light-dark(#3100fb35, #8f6cfd6d);
+    --accent-a7: light-dark(#2d01dd4a, #9879ff83);
+    --accent-a11: light-dark(#1f0099af, #baa7ff);
+    --accent-text: var(--accent-11);
+    --accent-inverse: white;
+  }
+
+  @supports (color: color(display-p3 1 1 1)) {
+    @media (color-gamut: p3) {
+      :root {
+        /* neutral: slate */
+        --neutral-1: light-dark(color(display-p3 0.988 0.988 0.992), color(display-p3 0.067 0.067 0.074));
+        --neutral-2: light-dark(color(display-p3 0.976 0.976 0.984), color(display-p3 0.095 0.098 0.105));
+        --neutral-3: light-dark(color(display-p3 0.94 0.941 0.953), color(display-p3 0.13 0.135 0.145));
+        --neutral-4: light-dark(color(display-p3 0.908 0.909 0.925), color(display-p3 0.156 0.163 0.176));
+        --neutral-5: light-dark(color(display-p3 0.88 0.881 0.901), color(display-p3 0.183 0.191 0.206));
+        --neutral-8: light-dark(color(display-p3 0.727 0.733 0.773), color(display-p3 0.357 0.381 0.409));
+        --neutral-11: light-dark(color(display-p3 0.379 0.392 0.421), color(display-p3 0.692 0.704 0.728));
+        --neutral-12: light-dark(color(display-p3 0.113 0.125 0.14), color(display-p3 0.93 0.933 0.94));
+        --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));
+        --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));
+        --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));
+        --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));
+        --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));
+        --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));
+
+        /* primary: cyan */
+        --primary-7: light-dark(color(display-p3 0.564 0.8 0.854), color(display-p3 0.186 0.398 0.484));
+        --primary-9: light-dark(color(display-p3 0.282 0.627 0.765), color(display-p3 0.282 0.627 0.765));
+        --primary-10: light-dark(color(display-p3 0.264 0.583 0.71), color(display-p3 0.331 0.675 0.801));
+        --primary-11: light-dark(color(display-p3 0.08 0.48 0.63), color(display-p3 0.446 0.79 0.887));
+        --primary-a2: light-dark(color(display-p3 0.02 0.557 0.647 / 0.044), color(display-p3 0.133 0.733 1 / 0.059));
+        --primary-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));
+        --primary-a4: light-dark(color(display-p3 0.004 0.678 0.784 / 0.181), color(display-p3 0.051 0.725 1 / 0.227));
+        --primary-a5: light-dark(color(display-p3 0.004 0.624 0.733 / 0.248), color(display-p3 0.149 0.757 1 / 0.29));
+        --primary-a6: light-dark(color(display-p3 0.004 0.584 0.706 / 0.33), color(display-p3 0.267 0.792 1 / 0.358));
+        --primary-a7: light-dark(color(display-p3 0.004 0.541 0.667 / 0.436), color(display-p3 0.333 0.808 1 / 0.446));
+        --primary-a11: light-dark(color(display-p3 0.08 0.48 0.63), color(display-p3 0.446 0.79 0.887));
+
+        /* accent: violet */
+        --accent-7: light-dark(color(display-p3 0.752 0.712 0.943), color(display-p3 0.326 0.277 0.53));
+        --accent-9: light-dark(color(display-p3 0.417 0.341 0.784), color(display-p3 0.417 0.341 0.784));
+        --accent-10: light-dark(color(display-p3 0.381 0.306 0.741), color(display-p3 0.477 0.402 0.823));
+        --accent-11: light-dark(color(display-p3 0.383 0.317 0.702), color(display-p3 0.72 0.65 1));
+        --accent-a2: light-dark(color(display-p3 0.161 0.024 0.863 / 0.028), color(display-p3 0.51 0.263 1 / 0.08));
+        --accent-a3: light-dark(color(display-p3 0.204 0.004 0.871 / 0.059), color(display-p3 0.494 0.337 0.996 / 0.202));
+        --accent-a4: light-dark(color(display-p3 0.196 0.004 1 / 0.102), color(display-p3 0.49 0.345 1 / 0.299));
+        --accent-a5: light-dark(color(display-p3 0.165 0.008 1 / 0.15), color(display-p3 0.525 0.392 1 / 0.353));
+        --accent-a6: light-dark(color(display-p3 0.153 0.004 0.906 / 0.208), color(display-p3 0.569 0.455 1 / 0.408));
+        --accent-a7: light-dark(color(display-p3 0.141 0.004 0.796 / 0.287), color(display-p3 0.588 0.494 1 / 0.496));
+        --accent-a11: light-dark(color(display-p3 0.383 0.317 0.702), color(display-p3 0.72 0.65 1));
+      }
+    }
+  }
+}