@salt-ds/theme 0.0.0-snapshot-20240726124318 → 0.0.0-snapshot-20240910092109

package/css/theme-next.css

@@ -1,31 +1,1119 @@
-@import url(foundations/alpha-next.css);
-@import url(foundations/color-next.css);
-@import url(foundations/curve-next.css);
-
-@import url(palette/alpha-next.css);
-@import url(palette/accent-next.css);
-@import url(palette/background-next.css);
-@import url(palette/corner-next.css);
-@import url(palette/foreground-next.css);
-@import url(palette/info-next.css);
-@import url(palette/negative-next.css);
-@import url(palette/neutral-next.css);
-@import url(palette/positive-next.css);
-@import url(palette/text-next.css);
-@import url(palette/warning-next.css);
-
-@import url(characteristics/accent-next.css);
-@import url(characteristics/actionable-next.css);
-@import url(characteristics/category-next.css);
-@import url(characteristics/container-next.css);
-@import url(characteristics/content-next.css);
-@import url(characteristics/editable-next.css);
-@import url(characteristics/focused-next.css);
-@import url(characteristics/navigable-next.css);
-@import url(characteristics/overlayable-next.css);
-@import url(characteristics/selectable-next.css);
-@import url(characteristics/separable-next.css);
-@import url(characteristics/status-next.css);
-@import url(characteristics/target-next.css);
-@import url(characteristics/text-next.css);
-@import url(characteristics/track-next.css);
+/* css/foundations/alpha-next.css */
+.salt-theme.salt-theme-next {
+  --salt-color-white-10a: rgba(var(--salt-color-white-rgb), 0.1);
+  --salt-color-white-15a: rgba(var(--salt-color-white-rgb), 0.15);
+  --salt-color-white-20a: rgba(var(--salt-color-white-rgb), 0.2);
+  --salt-color-white-30a: rgba(var(--salt-color-white-rgb), 0.3);
+  --salt-color-white-40a: rgba(var(--salt-color-white-rgb), 0.4);
+  --salt-color-white-45a: rgba(var(--salt-color-white-rgb), 0.45);
+  --salt-color-white-70a: rgba(var(--salt-color-white-rgb), 0.7);
+  --salt-color-black-10a: rgba(var(--salt-color-black-rgb), 0.1);
+  --salt-color-black-15a: rgba(var(--salt-color-black-rgb), 0.15);
+  --salt-color-black-20a: rgba(var(--salt-color-black-rgb), 0.2);
+  --salt-color-black-30a: rgba(var(--salt-color-black-rgb), 0.3);
+  --salt-color-black-40a: rgba(var(--salt-color-black-rgb), 0.4);
+  --salt-color-black-45a: rgba(var(--salt-color-black-rgb), 0.45);
+  --salt-color-black-70a: rgba(var(--salt-color-black-rgb), 0.7);
+  --salt-color-blue-200-40a: rgba(var(--salt-color-blue-200-rgb), 0.4);
+  --salt-color-blue-300-40a: rgba(var(--salt-color-blue-300-rgb), 0.4);
+  --salt-color-blue-400-40a: rgba(var(--salt-color-blue-400-rgb), 0.4);
+  --salt-color-blue-500-40a: rgba(var(--salt-color-blue-500-rgb), 0.4);
+  --salt-color-blue-600-40a: rgba(var(--salt-color-blue-600-rgb), 0.4);
+  --salt-color-blue-700-40a: rgba(var(--salt-color-blue-700-rgb), 0.4);
+  --salt-color-blue-800-40a: rgba(var(--salt-color-blue-800-rgb), 0.4);
+  --salt-color-gray-300-10a: rgba(var(--salt-color-gray-300-rgb), 0.1);
+  --salt-color-gray-300-40a: rgba(var(--salt-color-gray-300-rgb), 0.4);
+  --salt-color-gray-400-40a: rgba(var(--salt-color-gray-400-rgb), 0.4);
+  --salt-color-gray-500-10a: rgba(var(--salt-color-gray-500-rgb), 0.1);
+  --salt-color-gray-500-40a: rgba(var(--salt-color-gray-500-rgb), 0.4);
+  --salt-color-gray-600-40a: rgba(var(--salt-color-gray-600-rgb), 0.4);
+  --salt-color-gray-700-10a: rgba(var(--salt-color-gray-700-rgb), 0.1);
+  --salt-color-gray-700-40a: rgba(var(--salt-color-gray-700-rgb), 0.4);
+  --salt-color-green-500-40a: rgba(var(--salt-color-green-500-rgb), 0.4);
+  --salt-color-orange-500-40a: rgba(var(--salt-color-orange-500-rgb), 0.4);
+  --salt-color-red-500-40a: rgba(var(--salt-color-red-500-rgb), 0.4);
+  --salt-color-teal-200-40a: rgba(var(--salt-color-teal-200-rgb), 0.4);
+  --salt-color-teal-300-40a: rgba(var(--salt-color-teal-300-rgb), 0.4);
+  --salt-color-teal-400-40a: rgba(var(--salt-color-teal-400-rgb), 0.4);
+  --salt-color-teal-500-40a: rgba(var(--salt-color-teal-500-rgb), 0.4);
+  --salt-color-teal-600-40a: rgba(var(--salt-color-teal-600-rgb), 0.4);
+  --salt-color-teal-700-40a: rgba(var(--salt-color-teal-700-rgb), 0.4);
+  --salt-color-teal-800-40a: rgba(var(--salt-color-teal-800-rgb), 0.4);
+  --salt-color-background-snow-40a: rgba(var(--salt-color-background-snow-rgb), 0.4);
+  --salt-color-background-marble-40a: rgba(var(--salt-color-background-marble-rgb), 0.4);
+  --salt-color-background-limestone-40a: rgba(var(--salt-color-background-limestone-rgb), 0.4);
+  --salt-color-background-granite-40a: rgba(var(--salt-color-background-granite-rgb), 0.4);
+  --salt-color-background-jet-40a: rgba(var(--salt-color-background-jet-rgb), 0.4);
+  --salt-color-background-leather-40a: rgba(var(--salt-color-background-leather-rgb), 0.4);
+}
+
+/* css/foundations/color-next.css */
+.salt-theme.salt-theme-next {
+  --salt-color-white-rgb:
+    255,
+    255,
+    255;
+  --salt-color-gray-100-rgb:
+    245,
+    247,
+    248;
+  --salt-color-gray-200-rgb:
+    211,
+    213,
+    216;
+  --salt-color-gray-300-rgb:
+    177,
+    181,
+    185;
+  --salt-color-gray-400-rgb:
+    145,
+    149,
+    154;
+  --salt-color-gray-500-rgb:
+    114,
+    119,
+    125;
+  --salt-color-gray-600-rgb:
+    95,
+    100,
+    106;
+  --salt-color-gray-700-rgb:
+    76,
+    81,
+    87;
+  --salt-color-gray-800-rgb:
+    58,
+    63,
+    68;
+  --salt-color-gray-900-rgb:
+    41,
+    46,
+    51;
+  --salt-color-black-rgb:
+    0,
+    0,
+    0;
+  --salt-color-blue-100-rgb:
+    234,
+    246,
+    255;
+  --salt-color-blue-200-rgb:
+    199,
+    222,
+    255;
+  --salt-color-blue-300-rgb:
+    154,
+    189,
+    245;
+  --salt-color-blue-400-rgb:
+    102,
+    156,
+    232;
+  --salt-color-blue-500-rgb:
+    0,
+    120,
+    207;
+  --salt-color-blue-600-rgb:
+    0,
+    94,
+    166;
+  --salt-color-blue-700-rgb:
+    0,
+    69,
+    126;
+  --salt-color-blue-800-rgb:
+    0,
+    45,
+    89;
+  --salt-color-blue-900-rgb:
+    0,
+    23,
+    54;
+  --salt-color-green-100-rgb:
+    234,
+    245,
+    242;
+  --salt-color-green-200-rgb:
+    184,
+    229,
+    209;
+  --salt-color-green-300-rgb:
+    137,
+    204,
+    173;
+  --salt-color-green-400-rgb:
+    83,
+    176,
+    135;
+  --salt-color-green-500-rgb:
+    0,
+    135,
+    93;
+  --salt-color-green-600-rgb:
+    0,
+    107,
+    72;
+  --salt-color-green-700-rgb:
+    0,
+    86,
+    55;
+  --salt-color-green-800-rgb:
+    0,
+    63,
+    37;
+  --salt-color-green-900-rgb:
+    0,
+    41,
+    21;
+  --salt-color-teal-100-rgb:
+    219,
+    245,
+    247;
+  --salt-color-teal-200-rgb:
+    175,
+    224,
+    237;
+  --salt-color-teal-300-rgb:
+    131,
+    192,
+    214;
+  --salt-color-teal-400-rgb:
+    76,
+    161,
+    194;
+  --salt-color-teal-500-rgb:
+    27,
+    127,
+    158;
+  --salt-color-teal-600-rgb:
+    18,
+    100,
+    126;
+  --salt-color-teal-700-rgb:
+    9,
+    74,
+    96;
+  --salt-color-teal-800-rgb:
+    3,
+    49,
+    66;
+  --salt-color-teal-900-rgb:
+    0,
+    27,
+    41;
+  --salt-color-orange-100-rgb:
+    255,
+    236,
+    217;
+  --salt-color-orange-200-rgb:
+    255,
+    198,
+    161;
+  --salt-color-orange-300-rgb:
+    247,
+    160,
+    106;
+  --salt-color-orange-400-rgb:
+    232,
+    122,
+    56;
+  --salt-color-orange-500-rgb:
+    199,
+    83,
+    0;
+  --salt-color-orange-600-rgb:
+    163,
+    68,
+    0;
+  --salt-color-orange-700-rgb:
+    129,
+    54,
+    0;
+  --salt-color-orange-800-rgb:
+    97,
+    41,
+    0;
+  --salt-color-orange-900-rgb:
+    66,
+    32,
+    0;
+  --salt-color-red-100-rgb:
+    255,
+    236,
+    234;
+  --salt-color-red-200-rgb:
+    255,
+    193,
+    186;
+  --salt-color-red-300-rgb:
+    255,
+    147,
+    138;
+  --salt-color-red-400-rgb:
+    255,
+    93,
+    87;
+  --salt-color-red-500-rgb:
+    229,
+    33,
+    53;
+  --salt-color-red-600-rgb:
+    186,
+    23,
+    41;
+  --salt-color-red-700-rgb:
+    145,
+    13,
+    30;
+  --salt-color-red-800-rgb:
+    105,
+    4,
+    19;
+  --salt-color-red-900-rgb:
+    69,
+    0,
+    2;
+  --salt-color-purple-100-rgb:
+    246,
+    240,
+    250;
+  --salt-color-purple-200-rgb:
+    240,
+    214,
+    245;
+  --salt-color-purple-300-rgb:
+    218,
+    175,
+    224;
+  --salt-color-purple-400-rgb:
+    195,
+    136,
+    204;
+  --salt-color-purple-500-rgb:
+    162,
+    91,
+    173;
+  --salt-color-purple-600-rgb:
+    133,
+    67,
+    143;
+  --salt-color-purple-700-rgb:
+    104,
+    45,
+    113;
+  --salt-color-purple-800-rgb:
+    73,
+    21,
+    82;
+  --salt-color-purple-900-rgb:
+    51,
+    0,
+    59;
+  --salt-color-background-snow-rgb:
+    255,
+    255,
+    255;
+  --salt-color-background-marble-rgb:
+    245,
+    247,
+    248;
+  --salt-color-background-limestone-rgb:
+    250,
+    248,
+    242;
+  --salt-color-background-gradientlight-rgb:
+    226,
+    228,
+    229;
+  --salt-color-background-jet-rgb:
+    16,
+    24,
+    32;
+  --salt-color-background-granite-rgb:
+    26,
+    34,
+    41;
+  --salt-color-background-leather-rgb:
+    38,
+    41,
+    43;
+  --salt-color-logo-brown-rgb:
+    58,
+    34,
+    6;
+  --salt-color-white: rgb(var(--salt-color-white-rgb));
+  --salt-color-gray-100: rgb(var(--salt-color-gray-100-rgb));
+  --salt-color-gray-200: rgb(var(--salt-color-gray-200-rgb));
+  --salt-color-gray-300: rgb(var(--salt-color-gray-300-rgb));
+  --salt-color-gray-400: rgb(var(--salt-color-gray-400-rgb));
+  --salt-color-gray-500: rgb(var(--salt-color-gray-500-rgb));
+  --salt-color-gray-600: rgb(var(--salt-color-gray-600-rgb));
+  --salt-color-gray-700: rgb(var(--salt-color-gray-700-rgb));
+  --salt-color-gray-800: rgb(var(--salt-color-gray-800-rgb));
+  --salt-color-gray-900: rgb(var(--salt-color-gray-900-rgb));
+  --salt-color-black: rgb(var(--salt-color-black-rgb));
+  --salt-color-blue-100: rgb(var(--salt-color-blue-100-rgb));
+  --salt-color-blue-200: rgb(var(--salt-color-blue-200-rgb));
+  --salt-color-blue-300: rgb(var(--salt-color-blue-300-rgb));
+  --salt-color-blue-400: rgb(var(--salt-color-blue-400-rgb));
+  --salt-color-blue-500: rgb(var(--salt-color-blue-500-rgb));
+  --salt-color-blue-600: rgb(var(--salt-color-blue-600-rgb));
+  --salt-color-blue-700: rgb(var(--salt-color-blue-700-rgb));
+  --salt-color-blue-800: rgb(var(--salt-color-blue-800-rgb));
+  --salt-color-blue-900: rgb(var(--salt-color-blue-900-rgb));
+  --salt-color-green-100: rgb(var(--salt-color-green-100-rgb));
+  --salt-color-green-200: rgb(var(--salt-color-green-200-rgb));
+  --salt-color-green-300: rgb(var(--salt-color-green-300-rgb));
+  --salt-color-green-400: rgb(var(--salt-color-green-400-rgb));
+  --salt-color-green-500: rgb(var(--salt-color-green-500-rgb));
+  --salt-color-green-600: rgb(var(--salt-color-green-600-rgb));
+  --salt-color-green-700: rgb(var(--salt-color-green-700-rgb));
+  --salt-color-green-800: rgb(var(--salt-color-green-800-rgb));
+  --salt-color-green-900: rgb(var(--salt-color-green-900-rgb));
+  --salt-color-teal-100: rgb(var(--salt-color-teal-100-rgb));
+  --salt-color-teal-200: rgb(var(--salt-color-teal-200-rgb));
+  --salt-color-teal-300: rgb(var(--salt-color-teal-300-rgb));
+  --salt-color-teal-400: rgb(var(--salt-color-teal-400-rgb));
+  --salt-color-teal-500: rgb(var(--salt-color-teal-500-rgb));
+  --salt-color-teal-600: rgb(var(--salt-color-teal-600-rgb));
+  --salt-color-teal-700: rgb(var(--salt-color-teal-700-rgb));
+  --salt-color-teal-800: rgb(var(--salt-color-teal-800-rgb));
+  --salt-color-teal-900: rgb(var(--salt-color-teal-900-rgb));
+  --salt-color-orange-100: rgb(var(--salt-color-orange-100-rgb));
+  --salt-color-orange-200: rgb(var(--salt-color-orange-200-rgb));
+  --salt-color-orange-300: rgb(var(--salt-color-orange-300-rgb));
+  --salt-color-orange-400: rgb(var(--salt-color-orange-400-rgb));
+  --salt-color-orange-500: rgb(var(--salt-color-orange-500-rgb));
+  --salt-color-orange-600: rgb(var(--salt-color-orange-600-rgb));
+  --salt-color-orange-700: rgb(var(--salt-color-orange-700-rgb));
+  --salt-color-orange-800: rgb(var(--salt-color-orange-800-rgb));
+  --salt-color-orange-900: rgb(var(--salt-color-orange-900-rgb));
+  --salt-color-red-100: rgb(var(--salt-color-red-100-rgb));
+  --salt-color-red-200: rgb(var(--salt-color-red-200-rgb));
+  --salt-color-red-300: rgb(var(--salt-color-red-300-rgb));
+  --salt-color-red-400: rgb(var(--salt-color-red-400-rgb));
+  --salt-color-red-500: rgb(var(--salt-color-red-500-rgb));
+  --salt-color-red-600: rgb(var(--salt-color-red-600-rgb));
+  --salt-color-red-700: rgb(var(--salt-color-red-700-rgb));
+  --salt-color-red-800: rgb(var(--salt-color-red-800-rgb));
+  --salt-color-red-900: rgb(var(--salt-color-red-900-rgb));
+  --salt-color-purple-100: rgb(var(--salt-color-purple-100-rgb));
+  --salt-color-purple-200: rgb(var(--salt-color-purple-200-rgb));
+  --salt-color-purple-300: rgb(var(--salt-color-purple-300-rgb));
+  --salt-color-purple-400: rgb(var(--salt-color-purple-400-rgb));
+  --salt-color-purple-500: rgb(var(--salt-color-purple-500-rgb));
+  --salt-color-purple-600: rgb(var(--salt-color-purple-600-rgb));
+  --salt-color-purple-700: rgb(var(--salt-color-purple-700-rgb));
+  --salt-color-purple-800: rgb(var(--salt-color-purple-800-rgb));
+  --salt-color-purple-900: rgb(var(--salt-color-purple-900-rgb));
+  --salt-color-background-snow: rgb(var(--salt-color-background-snow-rgb));
+  --salt-color-background-marble: rgb(var(--salt-color-background-marble-rgb));
+  --salt-color-background-limestone: rgb(var(--salt-color-background-limestone-rgb));
+  --salt-color-background-gradientlight: rgb(var(--salt-color-background-gradientlight-rgb));
+  --salt-color-background-jet: rgb(var(--salt-color-background-jet-rgb));
+  --salt-color-background-granite: rgb(var(--salt-color-background-granite-rgb));
+  --salt-color-background-leather: rgb(var(--salt-color-background-leather-rgb));
+  --salt-color-logo-brown: rgb(var(--salt-color-logo-brown-rgb));
+}
+
+/* css/foundations/curve-next.css */
+.salt-density-high {
+  --salt-curve-0: 0;
+  --salt-curve-50: 1px;
+  --salt-curve-100: 2px;
+  --salt-curve-150: 3px;
+  --salt-curve-999: 999px;
+}
+.salt-density-medium {
+  --salt-curve-0: 0;
+  --salt-curve-50: 2px;
+  --salt-curve-100: 4px;
+  --salt-curve-150: 6px;
+  --salt-curve-999: 999px;
+}
+.salt-density-low {
+  --salt-curve-0: 0;
+  --salt-curve-50: 3px;
+  --salt-curve-100: 6px;
+  --salt-curve-150: 9px;
+  --salt-curve-999: 999px;
+}
+.salt-density-touch {
+  --salt-curve-0: 0;
+  --salt-curve-50: 4px;
+  --salt-curve-100: 8px;
+  --salt-curve-150: 12px;
+  --salt-curve-999: 999px;
+}
+
+/* css/palette/alpha-next.css */
+.salt-theme.salt-theme-next[data-mode=light] {
+  --salt-palette-alpha: var(--salt-color-black-30a);
+  --salt-palette-alpha-strong: var(--salt-color-black-45a);
+  --salt-palette-alpha-weak: var(--salt-color-black-15a);
+  --salt-palette-alpha-weaker: var(--salt-color-black-10a);
+  --salt-palette-alpha-backdrop: var(--salt-color-white-70a);
+  --salt-palette-alpha-none: transparent;
+}
+.salt-theme.salt-theme-next[data-mode=dark] {
+  --salt-palette-alpha: var(--salt-color-white-30a);
+  --salt-palette-alpha-strong: var(--salt-color-white-45a);
+  --salt-palette-alpha-weak: var(--salt-color-white-15a);
+  --salt-palette-alpha-weaker: var(--salt-color-white-10a);
+  --salt-palette-alpha-backdrop: var(--salt-color-black-70a);
+  --salt-palette-alpha-none: transparent;
+}
+
+/* css/palette/accent-next.css */
+.salt-theme.salt-theme-next[data-mode=light][data-accent=blue] {
+  --salt-palette-accent: var(--salt-color-blue-500);
+  --salt-palette-accent-disabled: var(--salt-color-blue-500-40a);
+  --salt-palette-accent-strong: var(--salt-color-blue-600);
+  --salt-palette-accent-strong-disabled: var(--salt-color-blue-600-40a);
+  --salt-palette-accent-stronger: var(--salt-color-blue-700);
+  --salt-palette-accent-stronger-disabled: var(--salt-color-blue-700-40a);
+  --salt-palette-accent-strongest: var(--salt-color-blue-800);
+  --salt-palette-accent-weak: var(--salt-color-blue-400);
+  --salt-palette-accent-weaker: var(--salt-color-blue-200);
+  --salt-palette-accent-weaker-disabled: var(--salt-color-blue-200-40a);
+  --salt-palette-accent-weakest: var(--salt-color-blue-100);
+  --salt-palette-accent-action-hover: var(--salt-color-blue-600);
+  --salt-palette-accent-action-active: var(--salt-color-blue-800);
+}
+.salt-theme.salt-theme-next[data-mode=dark][data-accent=blue] {
+  --salt-palette-accent: var(--salt-color-blue-500);
+  --salt-palette-accent-disabled: var(--salt-color-blue-500-40a);
+  --salt-palette-accent-strong: var(--salt-color-blue-400);
+  --salt-palette-accent-strong-disabled: var(--salt-color-blue-400-40a);
+  --salt-palette-accent-stronger: var(--salt-color-blue-300);
+  --salt-palette-accent-stronger-disabled: var(--salt-color-blue-300-40a);
+  --salt-palette-accent-strongest: var(--salt-color-blue-200);
+  --salt-palette-accent-weak: var(--salt-color-blue-600);
+  --salt-palette-accent-weaker: var(--salt-color-blue-800);
+  --salt-palette-accent-weaker-disabled: var(--salt-color-blue-800-40a);
+  --salt-palette-accent-weakest: var(--salt-color-blue-900);
+  --salt-palette-accent-action-hover: var(--salt-color-blue-600);
+  --salt-palette-accent-action-active: var(--salt-color-blue-800);
+}
+.salt-theme.salt-theme-next[data-mode=light][data-accent=teal] {
+  --salt-palette-accent: var(--salt-color-teal-500);
+  --salt-palette-accent-disabled: var(--salt-color-teal-500-40a);
+  --salt-palette-accent-strong: var(--salt-color-teal-600);
+  --salt-palette-accent-strong-disabled: var(--salt-color-teal-600-40a);
+  --salt-palette-accent-stronger: var(--salt-color-teal-700);
+  --salt-palette-accent-stronger-disabled: var(--salt-color-teal-700-40a);
+  --salt-palette-accent-strongest: var(--salt-color-teal-800);
+  --salt-palette-accent-weak: var(--salt-color-teal-400);
+  --salt-palette-accent-weaker: var(--salt-color-teal-200);
+  --salt-palette-accent-weaker-disabled: var(--salt-color-teal-200-40a);
+  --salt-palette-accent-weakest: var(--salt-color-teal-100);
+  --salt-palette-accent-action-hover: var(--salt-color-teal-600);
+  --salt-palette-accent-action-active: var(--salt-color-teal-800);
+}
+.salt-theme.salt-theme-next[data-mode=dark][data-accent=teal] {
+  --salt-palette-accent: var(--salt-color-teal-500);
+  --salt-palette-accent-disabled: var(--salt-color-teal-500-40a);
+  --salt-palette-accent-strong: var(--salt-color-teal-400);
+  --salt-palette-accent-strong-disabled: var(--salt-color-teal-400-40a);
+  --salt-palette-accent-stronger: var(--salt-color-teal-300);
+  --salt-palette-accent-stronger-disabled: var(--salt-color-teal-300-40a);
+  --salt-palette-accent-strongest: var(--salt-color-teal-200);
+  --salt-palette-accent-weak: var(--salt-color-teal-600);
+  --salt-palette-accent-weaker: var(--salt-color-teal-800);
+  --salt-palette-accent-weaker-disabled: var(--salt-color-teal-800-40a);
+  --salt-palette-accent-weakest: var(--salt-color-teal-900);
+  --salt-palette-accent-action-hover: var(--salt-color-teal-600);
+  --salt-palette-accent-action-active: var(--salt-color-teal-800);
+}
+
+/* css/palette/background-next.css */
+.salt-theme.salt-theme-next[data-mode=light] {
+  --salt-palette-background-primary: var(--salt-color-background-snow);
+  --salt-palette-background-primary-disabled: var(--salt-color-background-snow-40a);
+  --salt-palette-background-secondary: var(--salt-color-background-marble);
+  --salt-palette-background-secondary-disabled: var(--salt-color-background-marble-40a);
+  --salt-palette-background-tertiary: var(--salt-color-background-limestone);
+  --salt-palette-background-tertiary-disabled: var(--salt-color-background-limestone-40a);
+}
+.salt-theme.salt-theme-next[data-mode=dark] {
+  --salt-palette-background-primary: var(--salt-color-background-jet);
+  --salt-palette-background-primary-disabled: var(--salt-color-background-jet-40a);
+  --salt-palette-background-secondary: var(--salt-color-background-granite);
+  --salt-palette-background-secondary-disabled: var(--salt-color-background-granite-40a);
+  --salt-palette-background-tertiary: var(--salt-color-background-leather);
+  --salt-palette-background-tertiary-disabled: var(--salt-color-background-leather-40a);
+}
+
+/* css/palette/corner-next.css */
+.salt-theme-next[data-corner=rounded] {
+  --salt-palette-corner-weaker: var(--salt-curve-50);
+  --salt-palette-corner-weak: var(--salt-curve-100);
+  --salt-palette-corner: var(--salt-curve-150);
+  --salt-palette-corner-strongest: var(--salt-curve-999);
+}
+.salt-theme-next[data-corner=sharp] {
+  --salt-palette-corner-weaker: var(--salt-curve-0);
+  --salt-palette-corner-weak: var(--salt-curve-0);
+  --salt-palette-corner: var(--salt-curve-0);
+  --salt-palette-corner-strongest: var(--salt-curve-999);
+}
+
+/* css/palette/foreground-next.css */
+.salt-theme.salt-theme-next[data-mode=light] {
+  --salt-palette-foreground-active: var(--salt-color-blue-700);
+  --salt-palette-foreground-hover: var(--salt-color-blue-600);
+  --salt-palette-foreground-primary: var(--salt-color-black);
+  --salt-palette-foreground-primary-disabled: var(--salt-color-black-40a);
+  --salt-palette-foreground-primary-alt: var(--salt-color-white);
+  --salt-palette-foreground-primary-alt-disabled: var(--salt-color-white-40a);
+  --salt-palette-foreground-secondary: var(--salt-color-gray-600);
+  --salt-palette-foreground-secondary-disabled: var(--salt-color-gray-600-40a);
+  --salt-palette-foreground-visited: var(--salt-color-purple-800);
+}
+.salt-theme.salt-theme-next[data-mode=dark] {
+  --salt-palette-foreground-active: var(--salt-color-blue-300);
+  --salt-palette-foreground-hover: var(--salt-color-blue-400);
+  --salt-palette-foreground-primary: var(--salt-color-white);
+  --salt-palette-foreground-primary-disabled: var(--salt-color-white-40a);
+  --salt-palette-foreground-primary-alt: var(--salt-color-white);
+  --salt-palette-foreground-primary-alt-disabled: var(--salt-color-white-40a);
+  --salt-palette-foreground-secondary: var(--salt-color-gray-400);
+  --salt-palette-foreground-secondary-disabled: var(--salt-color-gray-400-40a);
+  --salt-palette-foreground-visited: var(--salt-color-purple-200);
+}
+
+/* css/palette/info-next.css */
+.salt-theme.salt-theme-next[data-mode=light] {
+  --salt-palette-info: var(--salt-color-blue-500);
+  --salt-palette-info-strong: var(--salt-color-blue-600);
+  --salt-palette-info-weak: var(--salt-color-blue-100);
+}
+.salt-theme.salt-theme-next[data-mode=dark] {
+  --salt-palette-info: var(--salt-color-blue-500);
+  --salt-palette-info-strong: var(--salt-color-blue-400);
+  --salt-palette-info-weak: var(--salt-color-blue-900);
+}
+
+/* css/palette/negative-next.css */
+.salt-theme.salt-theme-next[data-mode=light] {
+  --salt-palette-negative: var(--salt-color-red-500);
+  --salt-palette-negative-strong: var(--salt-color-red-600);
+  --salt-palette-negative-weak: var(--salt-color-red-100);
+  --salt-palette-negative-action-hover: var(--salt-color-red-600);
+  --salt-palette-negative-action-active: var(--salt-color-red-800);
+  --salt-palette-negative-disabled: var(--salt-color-red-500-40a);
+}
+.salt-theme.salt-theme-next[data-mode=dark] {
+  --salt-palette-negative: var(--salt-color-red-500);
+  --salt-palette-negative-strong: var(--salt-color-red-400);
+  --salt-palette-negative-weak: var(--salt-color-red-900);
+  --salt-palette-negative-action-hover: var(--salt-color-red-600);
+  --salt-palette-negative-action-active: var(--salt-color-red-800);
+  --salt-palette-negative-disabled: var(--salt-color-red-500-40a);
+}
+
+/* css/palette/neutral-next.css */
+.salt-theme.salt-theme-next[data-mode=light] {
+  --salt-palette-neutral: var(--salt-color-gray-500);
+  --salt-palette-neutral-disabled: var(--salt-color-gray-500-40a);
+  --salt-palette-neutral-readonly: var(--salt-color-gray-500-10a);
+  --salt-palette-neutral-strong: var(--salt-color-gray-600);
+  --salt-palette-neutral-strong-disabled: var(--salt-color-gray-600-40a);
+  --salt-palette-neutral-stronger: var(--salt-color-gray-700);
+  --salt-palette-neutral-strongest: var(--salt-color-gray-800);
+  --salt-palette-neutral-weak: var(--salt-color-gray-400);
+  --salt-palette-neutral-weak-disabled: var(--salt-color-gray-400-40a);
+  --salt-palette-neutral-weaker: var(--salt-color-gray-300);
+  --salt-palette-neutral-weaker-disabled: var(--salt-color-gray-300-40a);
+  --salt-palette-neutral-weaker-readonly: var(--salt-color-gray-300-10a);
+  --salt-palette-neutral-weakest: var(--salt-color-gray-200);
+  --salt-palette-neutral-action-hover: var(--salt-color-gray-600);
+  --salt-palette-neutral-action-active: var(--salt-color-gray-800);
+}
+.salt-theme.salt-theme-next[data-mode=dark] {
+  --salt-palette-neutral: var(--salt-color-gray-500);
+  --salt-palette-neutral-disabled: var(--salt-color-gray-500-40a);
+  --salt-palette-neutral-readonly: var(--salt-color-gray-500-10a);
+  --salt-palette-neutral-strong: var(--salt-color-gray-400);
+  --salt-palette-neutral-strong-disabled: var(--salt-color-gray-400-40a);
+  --salt-palette-neutral-stronger: var(--salt-color-gray-300);
+  --salt-palette-neutral-strongest: var(--salt-color-gray-200);
+  --salt-palette-neutral-weak: var(--salt-color-gray-600);
+  --salt-palette-neutral-weak-disabled: var(--salt-color-gray-600-40a);
+  --salt-palette-neutral-weaker: var(--salt-color-gray-700);
+  --salt-palette-neutral-weaker-disabled: var(--salt-color-gray-700-40a);
+  --salt-palette-neutral-weaker-readonly: var(--salt-color-gray-700-10a);
+  --salt-palette-neutral-weakest: var(--salt-color-gray-800);
+  --salt-palette-neutral-action-hover: var(--salt-color-gray-600);
+  --salt-palette-neutral-action-active: var(--salt-color-gray-800);
+}
+
+/* css/palette/positive-next.css */
+.salt-theme.salt-theme-next[data-mode=light] {
+  --salt-palette-positive: var(--salt-color-green-500);
+  --salt-palette-positive-strong: var(--salt-color-green-600);
+  --salt-palette-positive-weak: var(--salt-color-green-100);
+  --salt-palette-positive-action-hover: var(--salt-color-green-600);
+  --salt-palette-positive-action-active: var(--salt-color-green-800);
+  --salt-palette-positive-disabled: var(--salt-color-green-500-40a);
+}
+.salt-theme.salt-theme-next[data-mode=dark] {
+  --salt-palette-positive: var(--salt-color-green-500);
+  --salt-palette-positive-strong: var(--salt-color-green-400);
+  --salt-palette-positive-weak: var(--salt-color-green-900);
+  --salt-palette-positive-action-hover: var(--salt-color-green-600);
+  --salt-palette-positive-action-active: var(--salt-color-green-800);
+  --salt-palette-positive-disabled: var(--salt-color-green-500-40a);
+}
+
+/* css/palette/text-next.css */
+.salt-theme-next.salt-theme[data-heading-font="Open Sans"] {
+  --salt-palette-text-fontFamily-heading: var(--salt-typography-fontFamily-openSans);
+  --salt-palette-text-display-fontWeight: var(--salt-typography-fontWeight-semiBold);
+  --salt-palette-text-display-fontWeight-small: var(--salt-typography-fontWeight-regular);
+  --salt-palette-text-display-fontWeight-strong: var(--salt-typography-fontWeight-bold);
+  --salt-palette-text-heading-fontWeight: var(--salt-typography-fontWeight-semiBold);
+  --salt-palette-text-heading-fontWeight-small: var(--salt-typography-fontWeight-regular);
+  --salt-palette-text-heading-fontWeight-strong: var(--salt-typography-fontWeight-bold);
+  --salt-palette-text-body-fontWeight: var(--salt-typography-fontWeight-regular);
+  --salt-palette-text-body-fontWeight-small: var(--salt-typography-fontWeight-light);
+  --salt-palette-text-body-fontWeight-strong: var(--salt-typography-fontWeight-semiBold);
+  --salt-palette-text-notation-fontWeight: var(--salt-typography-fontWeight-semiBold);
+  --salt-palette-text-notation-fontWeight-small: var(--salt-typography-fontWeight-regular);
+  --salt-palette-text-notation-fontWeight-strong: var(--salt-typography-fontWeight-bold);
+}
+.salt-theme-next.salt-theme[data-heading-font=Amplitude] {
+  --salt-palette-text-fontFamily-heading: var(--salt-typography-fontFamily-amplitude);
+  --salt-palette-text-display-fontWeight: var(--salt-typography-fontWeight-medium);
+  --salt-palette-text-display-fontWeight-strong: var(--salt-typography-fontWeight-bold);
+  --salt-palette-text-display-fontWeight-small: var(--salt-typography-fontWeight-regular);
+  --salt-palette-text-heading-fontWeight: var(--salt-typography-fontWeight-medium);
+  --salt-palette-text-heading-fontWeight-small: var(--salt-typography-fontWeight-regular);
+  --salt-palette-text-heading-fontWeight-strong: var(--salt-typography-fontWeight-bold);
+  --salt-palette-text-body-fontWeight: var(--salt-typography-fontWeight-regular);
+  --salt-palette-text-body-fontWeight-small: var(--salt-typography-fontWeight-light);
+  --salt-palette-text-body-fontWeight-strong: var(--salt-typography-fontWeight-semiBold);
+  --salt-palette-text-notation-fontWeight: var(--salt-typography-fontWeight-semiBold);
+  --salt-palette-text-notation-fontWeight-small: var(--salt-typography-fontWeight-regular);
+  --salt-palette-text-notation-fontWeight-strong: var(--salt-typography-fontWeight-bold);
+}
+.salt-theme-next.salt-theme[data-action-font="Open Sans"] {
+  --salt-palette-text-fontFamily-action: var(--salt-typography-fontFamily-openSans);
+  --salt-palette-text-action-fontWeight: var(--salt-typography-fontWeight-semiBold);
+}
+.salt-theme-next.salt-theme[data-action-font=Amplitude] {
+  --salt-palette-text-fontFamily-action: var(--salt-typography-fontFamily-amplitude);
+  --salt-palette-text-action-fontWeight: var(--salt-typography-fontWeight-medium);
+}
+
+/* css/palette/warning-next.css */
+.salt-theme.salt-theme-next[data-mode=light] {
+  --salt-palette-warning: var(--salt-color-orange-500);
+  --salt-palette-warning-disabled: var(--salt-color-orange-500-40a);
+  --salt-palette-warning-strong: var(--salt-color-orange-600);
+  --salt-palette-warning-weak: var(--salt-color-orange-100);
+  --salt-palette-warning-action-hover: var(--salt-color-orange-600);
+  --salt-palette-warning-action-active: var(--salt-color-orange-800);
+}
+.salt-theme.salt-theme-next[data-mode=dark] {
+  --salt-palette-warning: var(--salt-color-orange-500);
+  --salt-palette-warning-disabled: var(--salt-color-orange-500-40a);
+  --salt-palette-warning-strong: var(--salt-color-orange-400);
+  --salt-palette-warning-weak: var(--salt-color-orange-900);
+  --salt-palette-warning-action-hover: var(--salt-color-orange-600);
+  --salt-palette-warning-action-active: var(--salt-color-orange-800);
+}
+
+/* css/characteristics/accent-next.css */
+.salt-theme.salt-theme-next {
+  --salt-accent-background: var(--salt-palette-accent);
+  --salt-accent-borderColor: var(--salt-palette-accent);
+  --salt-accent-foreground: var(--salt-palette-foreground-primary-alt);
+}
+
+/* css/characteristics/actionable-next.css */
+.salt-theme.salt-theme-next {
+  --salt-actionable-accented-bold-background-active: var(--salt-palette-accent-action-active);
+  --salt-actionable-accented-bold-background-disabled: var(--salt-palette-accent-disabled);
+  --salt-actionable-accented-bold-background-hover: var(--salt-palette-accent-action-hover);
+  --salt-actionable-accented-bold-background: var(--salt-palette-accent);
+  --salt-actionable-accented-bold-borderColor-active: var(--salt-palette-accent);
+  --salt-actionable-accented-bold-borderColor-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-accented-bold-borderColor-hover: var(--salt-palette-accent);
+  --salt-actionable-accented-bold-borderColor: var(--salt-palette-accent);
+  --salt-actionable-accented-bold-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-accented-bold-foreground-disabled: var(--salt-palette-foreground-primary-alt-disabled);
+  --salt-actionable-accented-bold-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-accented-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-accented-background-active: var(--salt-palette-accent-action-active);
+  --salt-actionable-accented-background-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-accented-background-hover: var(--salt-palette-accent-action-hover);
+  --salt-actionable-accented-background: var(--salt-palette-alpha-none);
+  --salt-actionable-accented-borderColor-active: var(--salt-palette-accent);
+  --salt-actionable-accented-borderColor-disabled: var(--salt-palette-accent-disabled);
+  --salt-actionable-accented-borderColor-hover: var(--salt-palette-accent);
+  --salt-actionable-accented-borderColor: var(--salt-palette-accent);
+  --salt-actionable-accented-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-accented-foreground-disabled: var(--salt-palette-accent-strong-disabled);
+  --salt-actionable-accented-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-accented-foreground: var(--salt-palette-accent-strong);
+  --salt-actionable-accented-subtle-background-active: var(--salt-palette-accent-action-active);
+  --salt-actionable-accented-subtle-background-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-accented-subtle-background-hover: var(--salt-palette-accent-action-hover);
+  --salt-actionable-accented-subtle-background: var(--salt-palette-alpha-none);
+  --salt-actionable-accented-subtle-borderColor-active: var(--salt-palette-accent);
+  --salt-actionable-accented-subtle-borderColor-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-accented-subtle-borderColor-hover: var(--salt-palette-accent);
+  --salt-actionable-accented-subtle-borderColor: var(--salt-palette-alpha-none);
+  --salt-actionable-accented-subtle-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-accented-subtle-foreground-disabled: var(--salt-palette-accent-strong-disabled);
+  --salt-actionable-accented-subtle-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-accented-subtle-foreground: var(--salt-palette-accent-strong);
+  --salt-actionable-bold-background-active: var(--salt-palette-neutral-action-active);
+  --salt-actionable-bold-background-disabled: var(--salt-palette-neutral-disabled);
+  --salt-actionable-bold-background-hover: var(--salt-palette-neutral-action-hover);
+  --salt-actionable-bold-background: var(--salt-palette-neutral);
+  --salt-actionable-bold-borderColor-active: var(--salt-palette-neutral);
+  --salt-actionable-bold-borderColor-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-bold-borderColor-hover: var(--salt-palette-neutral);
+  --salt-actionable-bold-borderColor: var(--salt-palette-neutral);
+  --salt-actionable-bold-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-bold-foreground-disabled: var(--salt-palette-foreground-primary-alt-disabled);
+  --salt-actionable-bold-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-background-active: var(--salt-palette-neutral-action-active);
+  --salt-actionable-background-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-background-hover: var(--salt-palette-neutral-action-hover);
+  --salt-actionable-background: var(--salt-palette-alpha-none);
+  --salt-actionable-borderColor-active: var(--salt-palette-neutral);
+  --salt-actionable-borderColor-disabled: var(--salt-palette-neutral-disabled);
+  --salt-actionable-borderColor-hover: var(--salt-palette-neutral);
+  --salt-actionable-borderColor: var(--salt-palette-neutral);
+  --salt-actionable-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-foreground-disabled: var(--salt-palette-foreground-primary-disabled);
+  --salt-actionable-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-foreground: var(--salt-palette-foreground-primary);
+  --salt-actionable-subtle-background-active: var(--salt-palette-neutral-action-active);
+  --salt-actionable-subtle-background-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-subtle-background-hover: var(--salt-palette-neutral-action-hover);
+  --salt-actionable-subtle-background: var(--salt-palette-alpha-none);
+  --salt-actionable-subtle-borderColor-active: var(--salt-palette-neutral);
+  --salt-actionable-subtle-borderColor-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-subtle-borderColor-hover: var(--salt-palette-neutral);
+  --salt-actionable-subtle-borderColor: var(--salt-palette-alpha-none);
+  --salt-actionable-subtle-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-subtle-foreground-disabled: var(--salt-palette-foreground-primary-disabled);
+  --salt-actionable-subtle-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-subtle-foreground: var(--salt-palette-foreground-primary);
+  --salt-actionable-negative-bold-background-active: var(--salt-palette-negative-action-active);
+  --salt-actionable-negative-bold-background-disabled: var(--salt-palette-negative-disabled);
+  --salt-actionable-negative-bold-background-hover: var(--salt-palette-negative-action-hover);
+  --salt-actionable-negative-bold-background: var(--salt-palette-negative);
+  --salt-actionable-negative-bold-borderColor-active: var(--salt-palette-negative);
+  --salt-actionable-negative-bold-borderColor-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-negative-bold-borderColor-hover: var(--salt-palette-negative);
+  --salt-actionable-negative-bold-borderColor: var(--salt-palette-negative);
+  --salt-actionable-negative-bold-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-negative-bold-foreground-disabled: var(--salt-palette-foreground-primary-alt-disabled);
+  --salt-actionable-negative-bold-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-negative-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-negative-background-active: var(--salt-palette-negative-action-active);
+  --salt-actionable-negative-background-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-negative-background-hover: var(--salt-palette-negative-action-hover);
+  --salt-actionable-negative-background: var(--salt-palette-alpha-none);
+  --salt-actionable-negative-borderColor-active: var(--salt-palette-negative);
+  --salt-actionable-negative-borderColor-disabled: var(--salt-palette-negative-disabled);
+  --salt-actionable-negative-borderColor-hover: var(--salt-palette-negative);
+  --salt-actionable-negative-borderColor: var(--salt-palette-negative);
+  --salt-actionable-negative-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-negative-foreground-disabled: var(--salt-palette-negative-strong disabled);
+  --salt-actionable-negative-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-negative-foreground: var(--salt-palette-negative-strong);
+  --salt-actionable-negative-subtle-background-active: var(--salt-palette-negative-action-active);
+  --salt-actionable-negative-subtle-background-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-negative-subtle-background-hover: var(--salt-palette-negative-action-hover);
+  --salt-actionable-negative-subtle-background: var(--salt-palette-alpha-none);
+  --salt-actionable-negative-subtle-borderColor-active: var(--salt-palette-negative);
+  --salt-actionable-negative-subtle-borderColor-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-negative-subtle-borderColor-hover: var(--salt-palette-negative);
+  --salt-actionable-negative-subtle-borderColor: var(--salt-palette-alpha-none);
+  --salt-actionable-negative-subtle-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-negative-subtle-foreground-disabled: var(--salt-palette-negative-strong disabled);
+  --salt-actionable-negative-subtle-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-negative-subtle-foreground: var(--salt-palette-negative-strong);
+  --salt-actionable-positive-bold-background-active: var(--salt-palette-positive-action-active);
+  --salt-actionable-positive-bold-background-disabled: var(--salt-palette-positive-disabled);
+  --salt-actionable-positive-bold-background-hover: var(--salt-palette-positive-action-hover);
+  --salt-actionable-positive-bold-background: var(--salt-palette-positive);
+  --salt-actionable-positive-bold-borderColor-active: var(--salt-palette-positive);
+  --salt-actionable-positive-bold-borderColor-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-positive-bold-borderColor-hover: var(--salt-palette-positive);
+  --salt-actionable-positive-bold-borderColor: var(--salt-palette-positive);
+  --salt-actionable-positive-bold-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-positive-bold-foreground-disabled: var(--salt-palette-foreground-primary-alt-disabled);
+  --salt-actionable-positive-bold-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-positive-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-positive-background-active: var(--salt-palette-positive-action-active);
+  --salt-actionable-positive-background-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-positive-background-hover: var(--salt-palette-positive-action-hover);
+  --salt-actionable-positive-background: var(--salt-palette-alpha-none);
+  --salt-actionable-positive-borderColor-active: var(--salt-palette-positive);
+  --salt-actionable-positive-borderColor-disabled: var(--salt-palette-positive-disabled);
+  --salt-actionable-positive-borderColor-hover: var(--salt-palette-positive);
+  --salt-actionable-positive-borderColor: var(--salt-palette-positive);
+  --salt-actionable-positive-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-positive-foreground-disabled: var(--salt-palette-positive-strong disabled);
+  --salt-actionable-positive-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-positive-foreground: var(--salt-palette-positive-strong);
+  --salt-actionable-positive-subtle-background-active: var(--salt-palette-positive-action-active);
+  --salt-actionable-positive-subtle-background-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-positive-subtle-background-hover: var(--salt-palette-positive-action-hover);
+  --salt-actionable-positive-subtle-background: var(--salt-palette-alpha-none);
+  --salt-actionable-positive-subtle-borderColor-active: var(--salt-palette-positive);
+  --salt-actionable-positive-subtle-borderColor-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-positive-subtle-borderColor-hover: var(--salt-palette-positive);
+  --salt-actionable-positive-subtle-borderColor: var(--salt-palette-alpha-none);
+  --salt-actionable-positive-subtle-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-positive-subtle-foreground-disabled: var(--salt-palette-positive-strong disabled);
+  --salt-actionable-positive-subtle-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-positive-subtle-foreground: var(--salt-palette-positive-strong);
+  --salt-actionable-caution-bold-background-active: var(--salt-palette-warning-action-active);
+  --salt-actionable-caution-bold-background-disabled: var(--salt-palette-warning-disabled);
+  --salt-actionable-caution-bold-background-hover: var(--salt-palette-warning-action-hover);
+  --salt-actionable-caution-bold-background: var(--salt-palette-warning);
+  --salt-actionable-caution-bold-borderColor-active: var(--salt-palette-warning);
+  --salt-actionable-caution-bold-borderColor-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-caution-bold-borderColor-hover: var(--salt-palette-warning);
+  --salt-actionable-caution-bold-borderColor: var(--salt-palette-warning);
+  --salt-actionable-caution-bold-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-caution-bold-foreground-disabled: var(--salt-palette-foreground-primary-alt-disabled);
+  --salt-actionable-caution-bold-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-caution-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-caution-background-active: var(--salt-palette-warning-action-active);
+  --salt-actionable-caution-background-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-caution-background-hover: var(--salt-palette-warning-action-hover);
+  --salt-actionable-caution-background: var(--salt-palette-alpha-none);
+  --salt-actionable-caution-borderColor-active: var(--salt-palette-warning);
+  --salt-actionable-caution-borderColor-disabled: var(--salt-palette-warning-disabled);
+  --salt-actionable-caution-borderColor-hover: var(--salt-palette-warning);
+  --salt-actionable-caution-borderColor: var(--salt-palette-warning);
+  --salt-actionable-caution-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-caution-foreground-disabled: var(--salt-palette-warning-strong disabled);
+  --salt-actionable-caution-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-caution-foreground: var(--salt-palette-warning-strong);
+  --salt-actionable-caution-subtle-background-active: var(--salt-palette-warning-action-active);
+  --salt-actionable-caution-subtle-background-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-caution-subtle-background-hover: var(--salt-palette-warning-action-hover);
+  --salt-actionable-caution-subtle-background: var(--salt-palette-alpha-none);
+  --salt-actionable-caution-subtle-borderColor-active: var(--salt-palette-warning);
+  --salt-actionable-caution-subtle-borderColor-disabled: var(--salt-palette-alpha-none);
+  --salt-actionable-caution-subtle-borderColor-hover: var(--salt-palette-warning);
+  --salt-actionable-caution-subtle-borderColor: var(--salt-palette-alpha-none);
+  --salt-actionable-caution-subtle-foreground-active: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-caution-subtle-foreground-disabled: var(--salt-palette-warning-strong disabled);
+  --salt-actionable-caution-subtle-foreground-hover: var(--salt-palette-foreground-primary-alt);
+  --salt-actionable-caution-subtle-foreground: var(--salt-palette-warning-strong);
+}
+
+/* css/characteristics/category-next.css */
+.salt-theme.salt-theme-next {
+  --salt-category-1-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-2-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-3-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-4-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-5-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-6-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-7-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-8-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-9-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-10-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-11-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-12-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-13-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-14-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-15-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-16-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-17-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-18-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-19-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-category-20-bold-foreground: var(--salt-palette-foreground-primary-alt);
+}
+
+/* css/characteristics/container-next.css */
+.salt-theme.salt-theme-next {
+  --salt-container-primary-background: var(--salt-palette-background-primary);
+  --salt-container-primary-background-disabled: var(--salt-palette-background-primary-disabled);
+  --salt-container-primary-borderColor: var(--salt-palette-alpha);
+  --salt-container-primary-borderColor-disabled: var(--salt-palette-alpha-weaker);
+  --salt-container-secondary-background: var(--salt-palette-background-secondary);
+  --salt-container-secondary-background-disabled: var(--salt-palette-background-secondary-disabled);
+  --salt-container-secondary-borderColor: var(--salt-palette-alpha);
+  --salt-container-secondary-borderColor-disabled: var(--salt-palette-alpha-weaker);
+  --salt-container-tertiary-background: var(--salt-palette-background-tertiary);
+  --salt-container-tertiary-background-disabled: var(--salt-palette-background-tertiary-disabled);
+  --salt-container-tertiary-borderColor: var(--salt-palette-alpha);
+  --salt-container-tertiary-borderColor-disabled: var(--salt-palette-alpha-weaker);
+}
+
+/* css/characteristics/content-next.css */
+.salt-theme.salt-theme-next {
+  --salt-content-primary-foreground: var(--salt-palette-foreground-primary);
+  --salt-content-primary-foreground-disabled: var(--salt-palette-foreground-primary-disabled);
+  --salt-content-secondary-foreground: var(--salt-palette-foreground-secondary);
+  --salt-content-secondary-foreground-disabled: var(--salt-palette-foreground-secondary-disabled);
+  --salt-content-bold-foreground: var(--salt-palette-foreground-primary-alt);
+  --salt-content-bold-foreground-disabled: var(--salt-palette-foreground-primary-alt-disabled);
+  --salt-content-foreground-hover: var(--salt-palette-foreground-hover);
+  --salt-content-foreground-active: var(--salt-palette-foreground-active);
+  --salt-content-foreground-visited: var(--salt-palette-foreground-visited);
+  --salt-content-foreground-highlight: var(--salt-palette-accent-weaker);
+}
+
+/* css/characteristics/editable-next.css */
+.salt-theme.salt-theme-next {
+  --salt-editable-borderColor: var(--salt-palette-neutral);
+  --salt-editable-borderColor-active: var(--salt-palette-accent-stronger);
+  --salt-editable-borderColor-disabled: var(--salt-palette-neutral-disabled);
+  --salt-editable-borderColor-hover: var(--salt-palette-accent);
+  --salt-editable-borderColor-readonly: var(--salt-palette-neutral-readonly);
+  --salt-editable-primary-background: var(--salt-palette-background-primary);
+  --salt-editable-primary-background-active: var(--salt-palette-background-primary);
+  --salt-editable-primary-background-disabled: var(--salt-palette-background-primary-disabled);
+  --salt-editable-primary-background-hover: var(--salt-palette-background-primary);
+  --salt-editable-primary-background-readonly: var(--salt-palette-alpha-none);
+  --salt-editable-secondary-background: var(--salt-palette-background-secondary);
+  --salt-editable-secondary-background-active: var(--salt-palette-background-secondary);
+  --salt-editable-secondary-background-disabled: var(--salt-palette-background-secondary-disabled);
+  --salt-editable-secondary-background-hover: var(--salt-palette-background-secondary);
+  --salt-editable-secondary-background-readonly: var(--salt-palette-alpha-none);
+}
+
+/* css/characteristics/focused-next.css */
+.salt-theme.salt-theme-next {
+  --salt-focused-outlineColor: var(--salt-palette-accent-stronger);
+}
+
+/* css/characteristics/navigable-next.css */
+.salt-theme.salt-theme-next {
+  --salt-navigable-indicator-hover: var(--salt-palette-neutral);
+  --salt-navigable-indicator-active: var(--salt-palette-accent);
+}
+
+/* css/characteristics/overlayable-next.css */
+.salt-theme.salt-theme-next {
+  --salt-overlayable-background: var(--salt-palette-alpha-backdrop);
+  --salt-overlayable-rangeSelection: var(--salt-palette-alpha-weak);
+}
+
+/* css/characteristics/selectable-next.css */
+.salt-theme.salt-theme-next {
+  --salt-selectable-borderColor: var(--salt-palette-neutral);
+  --salt-selectable-borderColor-hover: var(--salt-palette-accent-weak);
+  --salt-selectable-borderColor-selected: var(--salt-palette-accent);
+  --salt-selectable-borderColor-selectedDisabled: var(--salt-palette-accent-disabled);
+  --salt-selectable-borderColor-disabled: var(--salt-palette-neutral-disabled);
+  --salt-selectable-borderColor-readonly: var(--salt-palette-neutral-readonly);
+  --salt-selectable-foreground: var(--salt-palette-neutral-strong);
+  --salt-selectable-foreground-disabled: var(--salt-palette-neutral-strong-disabled);
+  --salt-selectable-foreground-hover: var(--salt-palette-accent-weak);
+  --salt-selectable-foreground-selected: var(--salt-palette-accent);
+  --salt-selectable-foreground-selectedDisabled: var(--salt-palette-accent-disabled);
+  --salt-selectable-background: var(--salt-palette-alpha-none);
+  --salt-selectable-background-hover: var(--salt-palette-accent-weakest);
+  --salt-selectable-background-selected: var(--salt-palette-accent-weaker);
+  --salt-selectable-background-blurSelected: var(--salt-palette-neutral-weakest);
+  --salt-selectable-background-disabled: var(--salt-palette-alpha-none);
+  --salt-selectable-background-selectedDisabled: var(--salt-palette-accent-weaker-disabled);
+}
+
+/* css/characteristics/separable-next.css */
+.salt-theme.salt-theme-next {
+  --salt-separable-primary-borderColor: var(--salt-palette-alpha-strong);
+  --salt-separable-secondary-borderColor: var(--salt-palette-alpha);
+  --salt-separable-tertiary-borderColor: var(--salt-palette-alpha-weak);
+}
+
+/* css/characteristics/status-next.css */
+.salt-theme.salt-theme-next {
+  --salt-status-static-foreground: var(--salt-palette-foreground-secondary);
+  --salt-status-negative-foreground: var(--salt-palette-negative);
+  --salt-status-positive-foreground: var(--salt-palette-positive);
+  --salt-status-info-foreground-decorative: var(--salt-palette-info);
+  --salt-status-success-foreground-decorative: var(--salt-palette-positive);
+  --salt-status-warning-foreground-decorative: var(--salt-palette-warning);
+  --salt-status-error-foreground-decorative: var(--salt-palette-negative);
+  --salt-status-info-foreground-informative: var(--salt-palette-info-strong);
+  --salt-status-success-foreground-informative: var(--salt-palette-positive-strong);
+  --salt-status-warning-foreground-informative: var(--salt-palette-warning-strong);
+  --salt-status-error-foreground-informative: var(--salt-palette-negative-strong);
+  --salt-status-info-borderColor: var(--salt-palette-info);
+  --salt-status-success-borderColor: var(--salt-palette-positive);
+  --salt-status-warning-borderColor: var(--salt-palette-warning);
+  --salt-status-error-borderColor: var(--salt-palette-negative);
+  --salt-status-info-background: var(--salt-palette-info-weak);
+  --salt-status-success-background: var(--salt-palette-positive-weak);
+  --salt-status-warning-background: var(--salt-palette-warning-weak);
+  --salt-status-error-background: var(--salt-palette-negative-weak);
+  --salt-status-info-bold-background: var(--salt-palette-info);
+  --salt-status-error-bold-background: var(--salt-palette-negative);
+  --salt-status-warning-bold-background: var(--salt-palette-warning);
+  --salt-status-success-bold-background: var(--salt-palette-positive);
+  --salt-status-success-background-selected: var(--salt-palette-positive-weak);
+  --salt-status-warning-background-selected: var(--salt-palette-warning-weak);
+  --salt-status-error-background-selected: var(--salt-palette-negative-weak);
+}
+
+/* css/characteristics/target-next.css */
+.salt-theme.salt-theme-next {
+  --salt-target-background-hover: var(--salt-palette-accent);
+  --salt-target-borderColor-hover: var(--salt-palette-accent-weakest);
+}
+
+/* css/characteristics/text-next.css */
+.salt-theme-next.salt-density-touch {
+  --salt-text-display1-fontSize: 102px;
+  --salt-text-display1-lineHeight: 133px;
+  --salt-text-display2-fontSize: 84px;
+  --salt-text-display2-lineHeight: 109px;
+  --salt-text-display3-fontSize: 68px;
+  --salt-text-display3-lineHeight: 88px;
+  --salt-text-display4-fontSize: 54px;
+  --salt-text-display4-lineHeight: 70px;
+}
+.salt-theme-next.salt-density-low {
+  --salt-text-display1-fontSize: 84px;
+  --salt-text-display1-lineHeight: 109px;
+  --salt-text-display2-fontSize: 68px;
+  --salt-text-display2-lineHeight: 88px;
+  --salt-text-display3-fontSize: 54px;
+  --salt-text-display3-lineHeight: 70px;
+  --salt-text-display4-fontSize: 42px;
+  --salt-text-display4-lineHeight: 55px;
+}
+.salt-theme-next.salt-density-medium {
+  --salt-text-display1-fontSize: 68px;
+  --salt-text-display1-lineHeight: 88px;
+  --salt-text-display2-fontSize: 54px;
+  --salt-text-display2-lineHeight: 70px;
+  --salt-text-display3-fontSize: 42px;
+  --salt-text-display3-lineHeight: 55px;
+  --salt-text-display4-fontSize: 32px;
+  --salt-text-display4-lineHeight: 42px;
+}
+.salt-theme-next.salt-density-high {
+  --salt-text-display1-fontSize: 54px;
+  --salt-text-display1-lineHeight: 70px;
+  --salt-text-display2-fontSize: 42px;
+  --salt-text-display2-lineHeight: 55px;
+  --salt-text-display3-fontSize: 32px;
+  --salt-text-display3-lineHeight: 42px;
+  --salt-text-display4-fontSize: 24px;
+  --salt-text-display4-lineHeight: 32px;
+}
+
+/* css/characteristics/track-next.css */
+.salt-theme.salt-theme-next {
+  --salt-track-borderColor: var(--salt-palette-alpha);
+}
+
+/* css/theme-next.css */