@ttoss/theme 1.8.5 → 2.0.1

package/dist/esm/themes/Bruttal/Bruttal.js

@@ -1,5 +1,5 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
-import { __commonJS, __toESM } from "../../chunk-ICKGF6JN.js";
+import { __commonJS, __toESM, defaultTheme } from "../../chunk-ZYSSWTLH.js";
 
 // ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/add-filled.js
 var require_add_filled = __commonJS({
@@ -106,75 +106,75 @@ var require_caret_up = __commonJS({
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkmark.js
-var require_checkmark = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkmark.js"(exports) {
+// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox.js
+var require_checkbox = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox.js"(exports) {
     "use strict";
 
     var data = {
       "width": 32,
       "height": 32,
-      "body": '<path fill="currentColor" d="m13 24l-9-9l1.414-1.414L13 21.171L26.586 7.586L28 9L13 24z"/>'
+      "body": '<path fill="currentColor" d="M26 4H6a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2ZM6 26V6h20v20Z"/>'
     };
     exports.__esModule = true;
     exports.default = data;
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkmark-outline.js
-var require_checkmark_outline = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkmark-outline.js"(exports) {
+// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox-checked-filled.js
+var require_checkbox_checked_filled = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox-checked-filled.js"(exports) {
     "use strict";
 
     var data = {
       "width": 32,
       "height": 32,
-      "body": '<path fill="currentColor" d="m14 21.414l-5-5.001L10.413 15L14 18.586L21.585 11L23 12.415l-9 8.999z"/><path fill="currentColor" d="M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2Zm0 26a12 12 0 1 1 12-12a12 12 0 0 1-12 12Z"/>'
+      "body": '<path fill="currentColor" d="M26 4H6a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2ZM14 21.5l-5-4.957L10.59 15L14 18.346L21.409 11L23 12.577Z"/><path fill="none" d="m14 21.5l-5-4.957L10.59 15L14 18.346L21.409 11L23 12.577Z"/>'
     };
     exports.__esModule = true;
     exports.default = data;
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox-checked-filled.js
-var require_checkbox_checked_filled = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox-checked-filled.js"(exports) {
+// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox-indeterminate-filled.js
+var require_checkbox_indeterminate_filled = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox-indeterminate-filled.js"(exports) {
     "use strict";
 
     var data = {
       "width": 32,
       "height": 32,
-      "body": '<path fill="currentColor" d="M26 4H6a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2ZM14 21.5l-5-4.957L10.59 15L14 18.346L21.409 11L23 12.577Z"/><path fill="none" d="m14 21.5l-5-4.957L10.59 15L14 18.346L21.409 11L23 12.577Z"/>'
+      "body": '<path fill="currentColor" d="M26 4H6a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2Zm-4 14H10v-4h12Z"/><path fill="none" d="M22 18H10v-4h12Z"/>'
     };
     exports.__esModule = true;
     exports.default = data;
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox.js
-var require_checkbox = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox.js"(exports) {
+// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkmark.js
+var require_checkmark = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkmark.js"(exports) {
     "use strict";
 
     var data = {
       "width": 32,
       "height": 32,
-      "body": '<path fill="currentColor" d="M26 4H6a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2ZM6 26V6h20v20Z"/>'
+      "body": '<path fill="currentColor" d="m13 24l-9-9l1.414-1.414L13 21.171L26.586 7.586L28 9L13 24z"/>'
     };
     exports.__esModule = true;
     exports.default = data;
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox-indeterminate-filled.js
-var require_checkbox_indeterminate_filled = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkbox-indeterminate-filled.js"(exports) {
+// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkmark-outline.js
+var require_checkmark_outline = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/checkmark-outline.js"(exports) {
     "use strict";
 
     var data = {
       "width": 32,
       "height": 32,
-      "body": '<path fill="currentColor" d="M26 4H6a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2Zm-4 14H10v-4h12Z"/><path fill="none" d="M22 18H10v-4h12Z"/>'
+      "body": '<path fill="currentColor" d="m14 21.414l-5-5.001L10.413 15L14 18.586L21.585 11L23 12.415l-9 8.999z"/><path fill="currentColor" d="M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2Zm0 26a12 12 0 1 1 12-12a12 12 0 0 1-12 12Z"/>'
     };
     exports.__esModule = true;
     exports.default = data;
@@ -241,30 +241,30 @@ var require_chevron_up = __commonJS({
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/close-filled.js
-var require_close_filled = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/close-filled.js"(exports) {
+// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/close.js
+var require_close = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/close.js"(exports) {
     "use strict";
 
     var data = {
       "width": 32,
       "height": 32,
-      "body": '<path fill="currentColor" d="M16 2C8.2 2 2 8.2 2 16s6.2 14 14 14s14-6.2 14-14S23.8 2 16 2zm5.4 21L16 17.6L10.6 23L9 21.4l5.4-5.4L9 10.6L10.6 9l5.4 5.4L21.4 9l1.6 1.6l-5.4 5.4l5.4 5.4l-1.6 1.6z"/>'
+      "body": '<path fill="currentColor" d="M17.414 16L24 9.414L22.586 8L16 14.586L9.414 8L8 9.414L14.586 16L8 22.586L9.414 24L16 17.414L22.586 24L24 22.586L17.414 16z"/>'
     };
     exports.__esModule = true;
     exports.default = data;
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/close.js
-var require_close = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/close.js"(exports) {
+// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/close-filled.js
+var require_close_filled = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/close-filled.js"(exports) {
     "use strict";
 
     var data = {
       "width": 32,
       "height": 32,
-      "body": '<path fill="currentColor" d="M17.414 16L24 9.414L22.586 8L16 14.586L9.414 8L8 9.414L14.586 16L8 22.586L9.414 24L16 17.414L22.586 24L24 22.586L17.414 16z"/>'
+      "body": '<path fill="currentColor" d="M16 2C8.2 2 2 8.2 2 16s6.2 14 14 14s14-6.2 14-14S23.8 2 16 2zm5.4 21L16 17.6L10.6 23L9 21.4l5.4-5.4L9 10.6L10.6 9l5.4 5.4L21.4 9l1.6 1.6l-5.4 5.4l5.4 5.4l-1.6 1.6z"/>'
     };
     exports.__esModule = true;
     exports.default = data;
@@ -376,21 +376,6 @@ var require_language = __commonJS({
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/loading.js
-var require_loading = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/loading.js"(exports) {
-    "use strict";
-
-    var data = {
-      "width": 24,
-      "height": 24,
-      "body": '<path fill="currentColor" d="M12 2A10 10 0 1 0 22 12A10 10 0 0 0 12 2Zm0 18a8 8 0 1 1 8-8A8 8 0 0 1 12 20Z" opacity=".5"/><path fill="currentColor" d="M20 12h2A10 10 0 0 0 12 2V4A8 8 0 0 1 20 12Z"><animateTransform attributeName="transform" dur="1s" from="0 12 12" repeatCount="indefinite" to="360 12 12" type="rotate"/></path>'
-    };
-    exports.__esModule = true;
-    exports.default = data;
-  }
-});
-
 // ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/menu.js
 var require_menu = __commonJS({
   "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/menu.js"(exports) {
@@ -421,30 +406,30 @@ var require_paste = __commonJS({
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/radio-button-checked.js
-var require_radio_button_checked = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/radio-button-checked.js"(exports) {
+// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/radio-button.js
+var require_radio_button = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/radio-button.js"(exports) {
     "use strict";
 
     var data = {
       "width": 32,
       "height": 32,
-      "body": '<path fill="currentColor" d="M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2Zm0 26a12 12 0 1 1 12-12a12 12 0 0 1-12 12Z"/><path fill="currentColor" d="M16 10a6 6 0 1 0 6 6a6 6 0 0 0-6-6Z"/>'
+      "body": '<path fill="currentColor" d="M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2Zm0 26a12 12 0 1 1 12-12a12 12 0 0 1-12 12Z"/>'
     };
     exports.__esModule = true;
     exports.default = data;
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/radio-button.js
-var require_radio_button = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/radio-button.js"(exports) {
+// ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/radio-button-checked.js
+var require_radio_button_checked = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/radio-button-checked.js"(exports) {
     "use strict";
 
     var data = {
       "width": 32,
       "height": 32,
-      "body": '<path fill="currentColor" d="M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2Zm0 26a12 12 0 1 1 12-12a12 12 0 0 1-12 12Z"/>'
+      "body": '<path fill="currentColor" d="M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2Zm0 26a12 12 0 1 1 12-12a12 12 0 0 1-12 12Z"/><path fill="currentColor" d="M16 10a6 6 0 1 0 6 6a6 6 0 0 0-6-6Z"/>'
     };
     exports.__esModule = true;
     exports.default = data;
@@ -496,36 +481,6 @@ var require_share = __commonJS({
   }
 });
 
-// ../../node_modules/.pnpm/@iconify+icons-mdi@1.2.48/node_modules/@iconify/icons-mdi/success-circle.js
-var require_success_circle = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-mdi@1.2.48/node_modules/@iconify/icons-mdi/success-circle.js"(exports) {
-    "use strict";
-
-    var data = {
-      "width": 24,
-      "height": 24,
-      "body": '<path fill="currentColor" d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10s10-4.5 10-10S17.5 2 12 2m-2 15l-5-5l1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9Z"/>'
-    };
-    exports.__esModule = true;
-    exports.default = data;
-  }
-});
-
-// ../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/three-dots-loading.js
-var require_three_dots_loading = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/three-dots-loading.js"(exports) {
-    "use strict";
-
-    var data = {
-      "width": 24,
-      "height": 24,
-      "body": '<circle cx="18" cy="12" r="0" fill="currentColor"><animate attributeName="r" begin=".67" calcMode="spline" dur="1.5s" keySplines="0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8" repeatCount="indefinite" values="0;2;0;0"/></circle><circle cx="12" cy="12" r="0" fill="currentColor"><animate attributeName="r" begin=".33" calcMode="spline" dur="1.5s" keySplines="0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8" repeatCount="indefinite" values="0;2;0;0"/></circle><circle cx="6" cy="12" r="0" fill="currentColor"><animate attributeName="r" begin="0" calcMode="spline" dur="1.5s" keySplines="0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8" repeatCount="indefinite" values="0;2;0;0"/></circle>'
-    };
-    exports.__esModule = true;
-    exports.default = data;
-  }
-});
-
 // ../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/time.js
 var require_time = __commonJS({
   "../../node_modules/.pnpm/@iconify+icons-carbon@1.2.20/node_modules/@iconify/icons-carbon/time.js"(exports) {
@@ -646,6 +601,51 @@ var require_warning_filled = __commonJS({
   }
 });
 
+// ../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/loading.js
+var require_loading = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/loading.js"(exports) {
+    "use strict";
+
+    var data = {
+      "width": 24,
+      "height": 24,
+      "body": '<path fill="currentColor" d="M12 2A10 10 0 1 0 22 12A10 10 0 0 0 12 2Zm0 18a8 8 0 1 1 8-8A8 8 0 0 1 12 20Z" opacity=".5"/><path fill="currentColor" d="M20 12h2A10 10 0 0 0 12 2V4A8 8 0 0 1 20 12Z"><animateTransform attributeName="transform" dur="1s" from="0 12 12" repeatCount="indefinite" to="360 12 12" type="rotate"/></path>'
+    };
+    exports.__esModule = true;
+    exports.default = data;
+  }
+});
+
+// ../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/three-dots-loading.js
+var require_three_dots_loading = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/three-dots-loading.js"(exports) {
+    "use strict";
+
+    var data = {
+      "width": 24,
+      "height": 24,
+      "body": '<circle cx="18" cy="12" r="0" fill="currentColor"><animate attributeName="r" begin=".67" calcMode="spline" dur="1.5s" keySplines="0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8" repeatCount="indefinite" values="0;2;0;0"/></circle><circle cx="12" cy="12" r="0" fill="currentColor"><animate attributeName="r" begin=".33" calcMode="spline" dur="1.5s" keySplines="0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8" repeatCount="indefinite" values="0;2;0;0"/></circle><circle cx="6" cy="12" r="0" fill="currentColor"><animate attributeName="r" begin="0" calcMode="spline" dur="1.5s" keySplines="0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8" repeatCount="indefinite" values="0;2;0;0"/></circle>'
+    };
+    exports.__esModule = true;
+    exports.default = data;
+  }
+});
+
+// ../../node_modules/.pnpm/@iconify+icons-mdi@1.2.48/node_modules/@iconify/icons-mdi/success-circle.js
+var require_success_circle = __commonJS({
+  "../../node_modules/.pnpm/@iconify+icons-mdi@1.2.48/node_modules/@iconify/icons-mdi/success-circle.js"(exports) {
+    "use strict";
+
+    var data = {
+      "width": 24,
+      "height": 24,
+      "body": '<path fill="currentColor" d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10s10-4.5 10-10S17.5 2 12 2m-2 15l-5-5l1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9Z"/>'
+    };
+    exports.__esModule = true;
+    exports.default = data;
+  }
+});
+
 // src/themes/Bruttal/BruttalIcons.ts
 var import_add_filled = __toESM(require_add_filled(), 1);
 var import_arrow_right = __toESM(require_arrow_right(), 1);
@@ -654,17 +654,17 @@ var import_attachment = __toESM(require_attachment(), 1);
 var import_calendar = __toESM(require_calendar(), 1);
 var import_caret_down = __toESM(require_caret_down(), 1);
 var import_caret_up = __toESM(require_caret_up(), 1);
-var import_checkmark = __toESM(require_checkmark(), 1);
-var import_checkmark_outline = __toESM(require_checkmark_outline(), 1);
-var import_checkbox_checked_filled = __toESM(require_checkbox_checked_filled(), 1);
 var import_checkbox = __toESM(require_checkbox(), 1);
+var import_checkbox_checked_filled = __toESM(require_checkbox_checked_filled(), 1);
 var import_checkbox_indeterminate_filled = __toESM(require_checkbox_indeterminate_filled(), 1);
+var import_checkmark = __toESM(require_checkmark(), 1);
+var import_checkmark_outline = __toESM(require_checkmark_outline(), 1);
 var import_chevron_down = __toESM(require_chevron_down(), 1);
 var import_chevron_left = __toESM(require_chevron_left(), 1);
 var import_chevron_right = __toESM(require_chevron_right(), 1);
 var import_chevron_up = __toESM(require_chevron_up(), 1);
-var import_close_filled = __toESM(require_close_filled(), 1);
 var import_close = __toESM(require_close(), 1);
+var import_close_filled = __toESM(require_close_filled(), 1);
 var import_copy = __toESM(require_copy(), 1);
 var import_download = __toESM(require_download(), 1);
 var import_edit = __toESM(require_edit(), 1);
@@ -672,16 +672,13 @@ var import_email = __toESM(require_email(), 1);
 var import_error_filled = __toESM(require_error_filled(), 1);
 var import_information_filled = __toESM(require_information_filled(), 1);
 var import_language = __toESM(require_language(), 1);
-var import_loading = __toESM(require_loading(), 1);
 var import_menu = __toESM(require_menu(), 1);
 var import_paste = __toESM(require_paste(), 1);
-var import_radio_button_checked = __toESM(require_radio_button_checked(), 1);
 var import_radio_button = __toESM(require_radio_button(), 1);
+var import_radio_button_checked = __toESM(require_radio_button_checked(), 1);
 var import_renew = __toESM(require_renew(), 1);
 var import_search = __toESM(require_search(), 1);
 var import_share = __toESM(require_share(), 1);
-var import_success_circle = __toESM(require_success_circle(), 1);
-var import_three_dots_loading = __toESM(require_three_dots_loading(), 1);
 var import_time = __toESM(require_time(), 1);
 var import_trash_can = __toESM(require_trash_can(), 1);
 var import_upload = __toESM(require_upload(), 1);
@@ -690,6 +687,9 @@ var import_view_filled = __toESM(require_view_filled(), 1);
 var import_view_off_filled = __toESM(require_view_off_filled(), 1);
 var import_warning_alt = __toESM(require_warning_alt(), 1);
 var import_warning_filled = __toESM(require_warning_filled(), 1);
+var import_loading = __toESM(require_loading(), 1);
+var import_three_dots_loading = __toESM(require_three_dots_loading(), 1);
+var import_success_circle = __toESM(require_success_circle(), 1);
 import { addIcon } from "@ttoss/react-icons";
 var replicateIcon = {
   body: `<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -765,190 +765,11 @@ Object.entries(BrutalIcons).forEach(([key, icon]) => {
 // src/themes/Bruttal/BruttalFonts.ts
 var BruttalFonts = ["https://fonts.googleapis.com/css?family=Inconsolata:wght@100;200;300;400;500;700;800;900", "https://fonts.googleapis.com/css?family=Work+Sans:wght@0,400;0,700;1,400;1,700&display=swap", "https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&display=swap"];
 
-// src/themes/Bruttal/helpers/geometricCalc.ts
-var SIZE_TYPE = "rem";
-var calcMultiplyingValues = (initialValue, base, ratio, sizeType = SIZE_TYPE) => {
-  const result = initialValue * Math.pow(base, ratio);
-  return `${result.toFixed(2)}${sizeType}`;
-};
-var calcDividingValues = (initialValue, base, ratio, sizeType = SIZE_TYPE) => {
-  const result = initialValue / Math.pow(base, ratio);
-  return `${result.toFixed(2)}${sizeType}`;
-};
-
-// src/themes/Bruttal/tokens/fontSizes.ts
-var SIZE_TYPE2 = "rem";
-var BASE = 1;
-var MULTIPLIER_FACTOR = 1.333;
-var fontSizes = {
-  "2xs": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, -3),
-  xs: calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, -2),
-  sm: calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, -1),
-  base: `${BASE}${SIZE_TYPE2}`,
-  lg: calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 1),
-  xl: calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 2),
-  "2xl": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 3),
-  "3xl": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 4),
-  "4xl": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 5),
-  "5xl": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 6),
-  "6xl": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 7)
-};
-
-// src/themes/Bruttal/tokens/fontWeights.ts
-var fontWeights = {
-  thin: 100,
-  extralight: 200,
-  light: 300,
-  normal: 400,
-  medium: 500,
-  semibold: 600,
-  bold: 700,
-  extrabold: 800
-};
-
-// src/themes/Bruttal/tokens/letterSpacings.ts
-var letterSpacings = {
-  tighter: "-0.05em",
-  tight: "-0.025em",
-  regular: "0em",
-  wide: "0.05em",
-  wider: "0.1em",
-  widest: "0.5em"
-};
-
-// src/themes/Bruttal/tokens/lineHeights.ts
-var BASE2 = 100;
-var MULTIPLIER_FACTOR2 = 1.333;
-var SIZE_TYPE3 = "%";
-var lineHeights = {
-  "2xs": calcMultiplyingValues(BASE2, MULTIPLIER_FACTOR2, -3, SIZE_TYPE3),
-  xs: calcMultiplyingValues(BASE2, MULTIPLIER_FACTOR2, -2, SIZE_TYPE3),
-  sm: calcDividingValues(BASE2, MULTIPLIER_FACTOR2, 1, SIZE_TYPE3),
-  base: "normal",
-  lg: calcMultiplyingValues(BASE2, MULTIPLIER_FACTOR2, 1, SIZE_TYPE3),
-  xl: calcMultiplyingValues(BASE2, MULTIPLIER_FACTOR2, 2, SIZE_TYPE3),
-  "2xl": calcMultiplyingValues(BASE2, MULTIPLIER_FACTOR2, 3, SIZE_TYPE3),
-  flat: "100%"
-};
-
-// src/themes/Bruttal/tokens/space.ts
-var SIZE_TYPE4 = "rem";
-var MD = 0.5;
-var MULTIPLIER_FACTOR3 = 1.618;
-var space = {
-  none: 0,
-  "2xs": calcDividingValues(MD, MULTIPLIER_FACTOR3, 3),
-  xs: calcDividingValues(MD, MULTIPLIER_FACTOR3, 2),
-  sm: calcDividingValues(MD, MULTIPLIER_FACTOR3, 1),
-  md: `${MD}${SIZE_TYPE4}`,
-  lg: calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 1),
-  xl: calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 2),
-  "2xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 3),
-  "3xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 4),
-  "4xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 5),
-  "5xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 6),
-  "6xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 7),
-  "7xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 8)
-};
-
-// src/themes/Bruttal/tokens/zIndices.ts
-var zIndices = {
-  deep: -9999,
-  behind: -1,
-  auto: "auto",
-  base: 0,
-  docked: 10,
-  /**
-   * Sticky is a CSS property that can be applied to an element to make it
-   * "stick" or remain fixed in a specific position relative to the viewport
-   * as the user scrolls the page. When an element is set as sticky, it will
-   * initially behave like a normal element but once the user scrolls past a
-   * certain threshold, it will stick to the designated position.
-   */
-  sticky: 100,
-  /**
-   * An overlay is a graphical element used in user interfaces to cover or
-   * partially obscure the underlying content. It is typically a
-   * semi-transparent or opaque layer that is positioned above other elements
-   * on the screen. Overlays are commonly employed to provide visual effects,
-   * create modal or pop-up dialogs, highlight or focus user attention, or
-   * serve as a background for elements such as tooltips, modals, or dropdown
-   * menus. They are often used to add depth, dimension, and visual hierarchy
-   * to the interface by visually separating or layering content.
-   */
-  overlay: 1e3,
-  /**
-   * A modal is a user interface component that appears as a dialog or window
-   * overlay on top of the main content, temporarily interrupting the user's
-   * interaction flow. It is commonly used to display additional information,
-   * request user input, or confirm an action. Modals typically have a higher
-   * z-index value than other elements on the page to ensure they are visually
-   * prominent and receive the user's full attention. They often feature a
-   * close button or an overlay click outside the modal to dismiss them and
-   * return to the underlying content. Modals help to focus user attention and
-   * provide a context-specific interaction within a larger interface.
-   */
-  modal: 2e3,
-  /**
-   * A dropdown is a user interface component that presents a list of
-   * selectable options when triggered by a user action, such as clicking on a
-   * dropdown button or input field. When activated, a dropdown expands
-   * vertically to reveal a list of choices, allowing the user to select a
-   * single option. The selected option is then displayed in the closed state
-   * of the dropdown. Dropdowns are commonly used to conserve space on a page
-   * or provide a convenient way to choose from a predefined set of options.
-   * They can be found in various contexts, such as navigation menus, form
-   * inputs, or filter controls. Dropdowns enhance user interaction by
-   * providing a compact and organized selection mechanism within the interface.
-   */
-  dropdown: 3e3,
-  /**
-   * A popover is a user interface component that provides contextual
-   * information or options when triggered by a user action, such as hovering
-   * over an element or clicking a button. It typically appears as a small
-   * overlay near the triggering element, offering additional details, actions,
-   * or related content. Popovers are designed to be non-intrusive and provide
-   * concise information or quick actions without requiring the user to
-   * navigate to a different page or screen. They are often used to enhance the
-   * user's understanding or provide supplementary functionality within a
-   * specific context. Popovers are commonly positioned above other elements in
-   * the interface to ensure visibility and accessibility.
-   */
-  popover: 4e3,
-  /**
-   * A tooltip is a small, informative message or hint that appears when a user
-   * hovers over or interacts with an element, such as a button, link, or icon.
-   * It is typically displayed as a brief, contextual text or label that
-   * provides additional information or clarifies the purpose of the element.
-   * Tooltips are used to improve the user's understanding of interface
-   * elements and enhance usability. They are generally positioned near the
-   * associated element, often appearing as a small box or bubble that pops up
-   * temporarily and disappears when the user moves the cursor away from the
-   * element. Tooltips are designed to be unobtrusive and provide helpful
-   * guidance or supplementary details without requiring the user to take any
-   * additional actions.
-   */
-  tooltip: 5e3,
-  /**
-   * A toast is a brief, temporary notification or message that appears on the
-   *  screen to provide important information or alerts to the user. It
-   * typically appears as a small box or banner positioned in a non-intrusive
-   * area of the interface, such as the top or bottom of the screen. Toasts are
-   * used to communicate updates, notifications, or status messages that may
-   * require the user's attention but do not require immediate action. They are
-   *  designed to be unobtrusive and automatically disappear after a short
-   * period, often with a fade-out animation. Toasts are commonly used in web
-   * and mobile applications to provide timely feedback or inform the user
-   * about completed actions, errors, or system updates.
-   */
-  toast: 6e3
-};
-
 // src/themes/Bruttal/BruttalTheme.ts
 var coreFonts = {
-  main: '"Atkinson Hyperlegible", sans-serif',
-  contrast: '"Work Sans", sans-serif',
-  monospace: '"Inconsolata", sans-serif'
+  body: '"Atkinson Hyperlegible", sans-serif',
+  heading: '"Work Sans", sans-serif',
+  mono: '"Inconsolata", sans-serif'
 };
 var brandColors = {
   complimentary: "#f4f3f3",
@@ -980,81 +801,212 @@ var coreColors = {
   amber600: "#d97706",
   teal600: "#0d9488"
 };
-var coreBorders = {
-  none: "0px solid",
-  thin: "1px solid",
-  medium: "2px solid",
-  thick: "4px solid"
-};
-var coreRadii = {
-  sharp: "0px",
-  xs: "2px",
-  sm: "4px",
-  md: "6px",
-  lg: "8px",
-  xl: "12px",
-  "2xl": "16px",
-  "3xl": "24px",
-  circle: "9999px"
-};
 var BruttalTheme = {
   /**
    * Tokens
    */
-  fontSizes,
-  fontWeights,
-  letterSpacings,
-  space,
-  lineHeights,
-  zIndices,
+  borders: defaultTheme.borders,
+  fontSizes: defaultTheme.fontSizes,
+  fontWeights: defaultTheme.fontWeights,
+  letterSpacings: defaultTheme.letterSpacings,
+  space: defaultTheme.space,
+  lineHeights: defaultTheme.lineHeights,
+  zIndices: defaultTheme.zIndices,
   colors: {
-    background: coreColors.complimentary,
-    text: coreColors.black,
-    muted: coreColors.gray200,
-    onMuted: coreColors.gray600,
-    mutedOutline: coreColors.gray300,
-    danger: coreColors.red700,
-    onDanger: coreColors.white,
-    notice: coreColors.amber600,
-    onNotice: coreColors.white,
-    positive: coreColors.teal600,
-    onPositive: coreColors.white,
-    surface: coreColors.white,
-    contentHeader: coreColors.gray200,
-    onContentHeader: coreColors.black,
-    outline: coreColors.gray500,
-    primary: coreColors.main,
-    onPrimary: coreColors.white,
-    secondary: coreColors.gray100,
-    onSecondary: coreColors.black,
-    highlight: coreColors.darkNeutral,
-    onHighlight: coreColors.complimentary,
-    accent: coreColors.accent,
-    onAccent: coreColors.white,
-    neutral: coreColors.darkNeutral,
-    onNeutral: coreColors.lightNeutral,
-    underemphasize: coreColors.gray300
-  },
-  fonts: {
-    main: coreColors.main,
-    contrast: coreFonts.contrast,
-    body: coreFonts.main,
-    highlight: coreFonts.main,
-    caption: coreFonts.main
-  },
-  borders: {
-    default: coreBorders.thin,
-    secondary: coreBorders.medium,
-    muted: coreBorders.thin,
-    interaction: coreBorders.medium,
-    danger: coreBorders.medium,
-    highlight: coreBorders.medium
-  },
-  radii: {
-    informative: coreRadii.xs,
-    default: coreRadii.sm,
-    action: coreRadii.sm
+    navigation: {
+      backgound: {
+        primary: {
+          default: coreColors.complimentary
+        }
+      },
+      text: {
+        primary: {
+          default: coreColors.black
+        },
+        accent: {
+          default: coreColors.darkNeutral
+        },
+        muted: {
+          default: coreColors.gray600
+        },
+        negative: {
+          default: coreColors.red700
+        }
+      }
+    },
+    action: {
+      text: {
+        primary: {
+          default: coreColors.black
+        },
+        secondary: {
+          default: coreColors.white,
+          active: coreColors.complimentary
+        },
+        accent: {
+          default: coreColors.white
+        },
+        negative: {
+          default: coreColors.white
+        },
+        caution: {
+          default: coreColors.white
+        },
+        muted: {
+          default: coreColors.gray600
+        }
+      },
+      background: {
+        primary: {
+          default: coreColors.main,
+          active: coreColors.complimentary
+        },
+        secondary: {
+          default: coreColors.gray100,
+          active: coreColors.darkNeutral
+        },
+        negative: {
+          default: coreColors.red700
+        },
+        accent: {
+          default: coreColors.accent,
+          active: coreColors.teal600
+        },
+        caution: {
+          default: coreColors.amber600
+        },
+        muted: {
+          default: coreColors.gray200
+        }
+      },
+      border: {
+        primary: {
+          default: coreColors.black
+        },
+        secondary: {
+          default: coreColors.gray500,
+          active: coreColors.darkNeutral
+        },
+        muted: {
+          default: coreColors.gray600
+        },
+        accent: {
+          default: coreColors.accent
+        }
+      }
+    },
+    input: {
+      text: {
+        primary: {
+          default: coreColors.white
+        },
+        secondary: {
+          default: coreColors.black
+        },
+        muted: {
+          default: coreColors.gray200,
+          active: coreColors.gray600
+        },
+        accent: {
+          default: coreColors.accent
+        },
+        negative: {
+          default: coreColors.red700
+        }
+      },
+      background: {
+        primary: {
+          default: coreColors.main,
+          active: coreColors.complimentary
+        },
+        secondary: {
+          default: coreColors.gray200,
+          active: coreColors.white
+        },
+        muted: {
+          default: coreColors.gray600,
+          active: coreColors.gray200,
+          disabled: coreColors.gray200
+        },
+        accent: {
+          default: coreColors.accent
+        },
+        negative: {
+          default: coreColors.red700
+        }
+      },
+      border: {
+        primary: {
+          default: coreColors.main
+        },
+        secondary: {
+          default: coreColors.black,
+          active: coreColors.darkNeutral
+        },
+        muted: {
+          default: coreColors.gray600
+        },
+        accent: {
+          default: coreColors.accent
+        },
+        caution: {
+          default: coreColors.gray500
+        },
+        negative: {
+          default: coreColors.red700
+        }
+      }
+    },
+    display: {
+      background: {
+        primary: {
+          default: coreColors.main
+        },
+        secondary: {
+          default: coreColors.white
+        },
+        muted: {
+          default: coreColors.gray200
+        }
+      },
+      text: {
+        primary: {
+          default: coreColors.black
+        },
+        secondary: {
+          default: coreColors.darkNeutral
+        },
+        muted: {
+          default: coreColors.gray600,
+          active: coreColors.gray200
+        },
+        accent: coreColors.accent,
+        negative: {
+          default: coreColors.red700
+        }
+      },
+      border: {
+        primary: {
+          default: coreColors.main
+        },
+        secondary: {
+          default: coreColors.black
+        },
+        muted: {
+          default: coreColors.gray600,
+          active: coreColors.darkNeutral
+        },
+        accent: {
+          default: coreColors.accent
+        },
+        negative: {
+          default: coreColors.red700
+        }
+      }
+    }
   },
+  fonts: coreFonts,
+  radii: defaultTheme.radii,
   /**
    * Global styles
    */
@@ -1062,11 +1014,15 @@ var BruttalTheme = {
     root: {
       fontFamily: "body",
       fontWeight: "normal",
-      fontSize: "base",
+      fontSize: "md",
       zIndex: "base",
       margin: 0,
       padding: 0,
-      backgroundColor: "background",
+      backgroundColor: "navigation.background.primary.default",
+      ".react-select__control": {
+        border: "md",
+        borderRadius: "sm"
+      },
       /**
        * HTML elements
        */
@@ -1074,27 +1030,27 @@ var BruttalTheme = {
         borderCollapse: "collapse"
       },
       th: {
-        paddingX: "md",
-        paddingY: "md"
+        paddingX: "4",
+        paddingY: "4"
       },
       tr: {
         borderBottom: "default"
       },
       td: {
-        paddingX: "xl",
-        paddingY: "md"
+        paddingX: "6",
+        paddingY: "4"
       }
     },
     a: {
-      color: "text",
+      color: "navigation.text.primary.default",
       fontFamily: "body",
       textDecorationLine: "underline",
-      lineHeight: "base",
+      lineHeight: "normal",
       "&.quiet:not(:hover)": {
         textDecorationLine: "none"
       },
       ":visited": {
-        color: "highlight"
+        color: "navigation.text.accent.default"
       }
     }
   },
@@ -1103,133 +1059,130 @@ var BruttalTheme = {
    */
   badges: {
     positive: {
-      color: "onPositive",
-      bg: "positive"
+      color: "action.text.accent.default",
+      bg: "action.background.accent.active"
     },
     negative: {
-      color: "onDanger",
-      bg: "danger"
+      color: "action.text.negative.default",
+      bg: "action.background.negative.default"
     },
     neutral: {
-      color: "onSecondary",
-      bg: "secondary",
-      border: "muted",
-      borderColor: "onMuted"
+      color: "action.text.primary.default",
+      bg: "action.background.secondary.default",
+      border: "sm",
+      borderColor: "action.border.muted.default"
     },
     informative: {
-      color: "onNotice",
-      bg: "notice"
+      color: "action.text.caution.default",
+      bg: "action.background.caution.default"
     },
     muted: {
-      color: "onMuted",
-      bg: "muted"
+      color: "action.text.muted.default",
+      bg: "action.background.muted.default"
     }
   },
   buttons: {
     accent: {
-      backgroundColor: "accent",
-      color: "onAccent",
-      borderRadius: "action",
-      borderColor: "accent",
+      backgroundColor: "action.background.accent.default",
+      color: "action.text.accent.default",
+      borderRadius: "sm",
       ":hover:not(:active,[disabled])": {
         filter: "brightness(90%)"
       },
       ":disabled": {
         cursor: "default",
-        backgroundColor: "muted",
-        borderColor: "muted",
-        color: "onMuted"
+        backgroundColor: "action.background.muted.default",
+        borderColor: "action.border.muted.default",
+        color: "action.text.muted.default"
       }
     },
     primary: {
-      backgroundColor: "primary",
-      color: "onPrimary",
-      borderRadius: "action",
-      borderColor: "primary",
+      backgroundColor: "action.background.primary.default",
+      color: "action.text.secondary.default",
+      borderRadius: "sm",
       ":hover:not(:active,[disabled])": {
         filter: "brightness(90%)"
       },
       ":active": {
-        backgroundColor: "primary",
-        color: "onPrimary",
-        borderColor: "outline"
+        backgroundColor: "action.background.primary.default",
+        color: "action.text.secondary.default"
       },
       ":disabled": {
         cursor: "default",
-        backgroundColor: "muted",
-        borderColor: "muted",
-        color: "onMuted"
+        backgroundColor: "action.background.muted.default",
+        borderColor: "action.border.muted.default",
+        color: "action.text.muted.default"
       }
     },
     secondary: {
-      backgroundColor: "secondary",
-      color: "onSecondary",
-      borderRadius: "action",
-      border: "secondary",
-      borderColor: "onSecondary",
+      backgroundColor: "action.background.secondary.default",
+      color: "action.text.primary.default",
+      borderRadius: "sm",
+      border: "md",
+      borderColor: "action.border.primary.default",
       ":hover:not(:active,[disabled])": {
         filter: "brightness(90%)"
       },
       ":disabled": {
         cursor: "default",
-        backgroundColor: "muted",
-        borderColor: "muted",
-        color: "onMuted"
+        backgroundColor: "action.background.muted.default",
+        borderColor: "action.border.muted.default",
+        color: "action.text.muted.default"
       }
     },
     destructive: {
-      color: "onDanger",
-      backgroundColor: "danger",
+      color: "action.text.negative.default",
+      backgroundColor: "action.background.negative.default",
       ":hover:not(:active,[disabled])": {
         filter: "brightness(90%)"
       },
       ":disabled": {
         cursor: "default",
-        backgroundColor: "muted",
-        borderColor: "muted",
-        color: "onMuted"
+        backgroundColor: "action.background.muted.default",
+        borderColor: "action.border.muted.default",
+        color: "action.text.muted.default"
       }
     },
     closeButton: {
-      backgroundColor: "background",
-      color: "primary",
-      border: "default",
-      borderColor: "primary",
-      borderRadius: "action",
+      backgroundColor: "action.background.primary.active",
+      color: "action.text.primary.default",
+      border: "sm",
+      borderColor: "action.border.primary.default",
+      borderRadius: "sm",
       ":disabled": {
-        border: "muted",
-        borderColor: "onMuted",
-        backgroundColor: "muted",
-        color: "onMuted",
+        border: "sm",
+        backgroundColor: "action.background.muted.default",
+        borderColor: "action.border.muted.default",
+        color: "action.text.muted.default",
         cursor: "not-allowed"
       },
       ":is(:focus-within, :hover):not(:disabled)": {
-        color: "onHighlight",
-        backgroundColor: "highlight",
-        borderColor: "highlight"
+        color: "action.text.secondary.active",
+        backgroundColor: "action.background.secondary.active",
+        borderColor: "action.border.secondary.active"
       }
     },
     actionButton: {
       default: {
-        backgroundColor: "secondary",
-        color: "onSecondary",
-        border: "default",
-        borderColor: "onSecondary",
+        backgroundColor: "action.background.secondary.default",
+        color: "action.text.primary.default",
+        border: "sm",
+        borderColor: "action.background.primary.default",
         transition: "all 0.2s",
         ":is(:focus-within, :hover)": {
-          backgroundColor: "highlight",
-          borderColor: "highlight",
-          color: "onHighlight"
+          backgroundColor: "action.background.secondary.active",
+          borderColor: "action.border.secondary.active",
+          color: "action.text.secondary.active"
         }
       },
       accent: {
-        backgroundColor: "accent",
-        color: "onAccent",
+        backgroundColor: "action.background.accent.default",
+        color: "action.text.accent.default",
         border: "none"
       },
       quiet: {
-        backgroundColor: "transparent",
-        color: "text",
+        backgroundColor: "action.background.muted.default",
+        color: "action.text.accent.default",
         border: "none",
         borderColor: "transparent"
       }
@@ -1237,8 +1190,8 @@ var BruttalTheme = {
   },
   cards: {
     primary: {
-      backgroundColor: "primary",
-      border: "1px solid black",
+      backgroundColor: "display.background.secondary.default",
+      border: "sm",
       padding: [4, 5],
       display: "flex",
       flexDirection: "column",
@@ -1248,47 +1201,50 @@ var BruttalTheme = {
   },
   forms: {
     label: {
-      color: "text",
+      color: "display.text.primary.default",
       '&:is([aria-disabled="true"])': {
-        color: "onMuted"
+        color: "display.text.muted.default"
       },
       '& > span[aria-label="tooltip"]': {
         fontSize: "sm",
-        marginLeft: "2xs"
+        marginLeft: "2"
       },
       '&:has(input[type="checkbox"])': {
-        fontSize: "base",
-        gap: "md"
+        fontSize: "md",
+        gap: "2"
       },
       '& > div:has(input[type="checkbox"]) > svg': {
         marginRight: 0
       },
       '&:has(input[type="checkbox"]:disabled)': {
-        color: "onMuted"
+        color: "display.text.muted.default"
       },
       '&:has(div > input[type="radio"])': {
         alignItems: "center"
       },
       '&:has(div > input[type="radio"]:disabled)': {
-        color: "muted"
+        color: "display.text.muted.active"
       }
     },
     radio: {
-      color: "text",
+      color: "input.text.secondary.default",
       fontFamily: "body",
       fontSize: "lg",
       "input:disabled ~ &": {
-        color: "muted"
+        color: "input.text.muted.default"
+      },
+      "input:checked ~ &": {
+        color: "input.text.accent.default"
       },
       'input[aria-invalid="true"] ~ &': {
-        color: "danger"
+        color: "input.text.negative.default"
       },
       "input:focus ~ &": {
         bg: "transparent"
       },
       "&:is(svg, svg + svg)": {
-        width: fontSizes.base,
-        height: fontSizes.base
+        width: "min",
+        height: "min"
       }
     },
     checkbox: {
@@ -1296,207 +1252,210 @@ var BruttalTheme = {
         bg: "transparent"
       },
       "input:not(:checked) ~ &": {
-        color: "primary"
+        color: "input.text.secondary.default"
+      },
+      "input:checked ~ &": {
+        color: "input.text.accent.default"
       },
       "input:disabled ~ &": {
-        color: "muted"
+        color: "input.text.muted.default"
       },
       "input:disabled ~ & path": {
-        backgroundColor: "onMuted"
+        backgroundColor: "input.background.muted.default"
       },
       'input[aria-invalid="true"] ~ &': {
-        color: "danger"
+        color: "display.text.negative.default"
       },
       "&:is(svg, svg + svg)": {
-        width: fontSizes.base,
-        height: fontSizes.base
+        width: "min",
+        height: "min"
       }
     },
     input: {
-      color: "text",
-      border: "interaction",
-      borderColor: "onMuted",
-      borderRadius: "action",
-      backgroundColor: "surface",
-      fontSize: "base",
-      lineHeight: "base",
+      color: "display.text.primary.default",
+      border: "md",
+      borderColor: "display.border.muted.default",
+      borderRadius: "sm",
+      backgroundColor: "display.background.secondary.default",
+      fontSize: "md",
+      lineHeight: "normal",
       "::placeholder": {
-        color: "onMuted"
+        color: "display.text.muted.default"
       },
       ":focus-within": {
-        outlineColor: "neutral"
+        outlineColor: "display.border.muted.active"
       },
       ":disabled": {
-        backgroundColor: "muted",
-        color: "onMuted",
-        border: "muted",
-        borderColor: "onMuted"
+        backgroundColor: "display.background.muted.default",
+        color: "display.text.muted.default",
+        border: "sm",
+        borderColor: "display.border.muted.default"
       },
       '&[aria-invalid="true"]': {
-        borderColor: "danger"
+        borderColor: "display.border.negative.default"
       },
       '&[aria-invalid="true"] ~ span:has(iconify-icon)': {
-        color: "danger"
+        color: "display.text.negative.default"
       }
     },
     inputNumber: {
-      color: "text",
-      border: "interaction",
-      borderColor: "onMuted",
-      borderRadius: "action",
+      color: "display.text.primary.default",
+      border: "md",
+      borderColor: "display.border.muted.default",
+      borderRadius: "sm",
       ":disabled": {
-        border: "muted",
-        borderColor: "onMuted",
-        color: "muted"
+        border: "sm",
+        borderColor: "display.border.muted.default",
+        color: "display.text.muted.active"
       },
       ":disabled ~ span > iconify-icon": {
-        color: "muted",
+        color: "display.text.muted.active",
         cursor: "default"
       },
       ":focus-within": {
-        outlineColor: "highlight"
+        outlineColor: "display.border.muted.active"
       },
       ':not(:disabled, [aria-invalid="true"]):hover': {
-        borderColor: "highlight"
+        borderColor: "display.border.muted.active"
       },
       ':not(:disabled, [aria-invalid="true"]) ~ span:has(iconify-icon):hover': {
-        color: "highlight"
+        color: "display.text.accent.default"
       },
       "& ~ span:has(iconify-icon)": {
-        fontSize: "base"
+        fontSize: "md"
       },
       '&[aria-invalid="true"]': {
-        border: "danger",
-        borderColor: "danger",
-        color: "danger",
-        outlineColor: "danger"
+        border: "md",
+        borderColor: "display.border.negative.default",
+        color: "display.text.negative.default",
+        outlineColor: "display.border.negative.default"
       },
       '&[aria-invalid="true"] ~ span>iconify-icon': {
-        color: "danger"
+        color: "display.text.negative.default"
       }
     },
     select: {
-      color: "text",
-      backgroundColor: "surface",
-      border: "interaction",
-      borderColor: "onMuted",
-      borderRadius: "action",
+      color: "display.text.primary.default",
+      backgroundColor: "display.background.secondary.default",
+      border: "md",
+      borderColor: "display.border.muted.default",
+      borderRadius: "sm",
       ":disabled": {
-        border: "muted",
-        borderColor: "onMuted",
-        backgroundColor: "muted",
-        color: "onMuted"
+        border: "sm",
+        borderColor: "display.border.muted.default",
+        backgroundColor: "display.background.muted.default",
+        color: "display.text.muted.default"
       },
       ":disabled ~ * > span:has(iconify-icon)": {
-        color: "onMuted"
+        color: "display.text.muted.default"
       },
       '&[aria-invalid="true"]': {
-        border: "danger",
-        borderColor: "danger",
-        outlineColor: "danger"
+        border: "md",
+        borderColor: "display.border.negative.default",
+        outlineColor: "display.border.negative.default"
       },
       '&[aria-invalid="true"] ~ * > span.error-icon': {
-        color: "danger"
+        color: "display.text.negative.default"
       }
     },
     textarea: {
-      color: "text",
-      border: "interaction",
-      borderColor: "onMuted",
-      backgroundColor: "surface",
-      borderRadius: "action",
+      color: "display.text.primary.default",
+      border: "md",
+      borderColor: "input.border.muted.default",
+      backgroundColor: "display.background.secondary.default",
+      borderRadius: "sm",
       ":focus-within": {
-        outlineColor: "primary"
+        outlineColor: "input.border.primary.default"
       },
       ":disabled::placeholder": {
-        color: "onMuted"
+        color: "input.text.muted.active"
       },
       ":disabled": {
-        borderColor: "onMuted",
-        backgroundColor: "muted",
-        border: "muted",
-        color: "onMuted"
+        borderColor: "input.border.muted.default",
+        backgroundColor: "input.background.muted.active",
+        border: "sm",
+        color: "input.text.muted.active"
       },
       '&[aria-invalid="true"]': {
-        borderColor: "danger",
-        outlineColor: "danger"
+        borderColor: "input.border.negative.default",
+        outlineColor: "input.border.negative.default"
       },
       '&[aria-invalid="true"]+span>iconify-icon': {
-        color: "danger",
-        fontSize: "base"
+        color: "input.text.negative.default",
+        fontSize: "lg"
       }
     }
   },
   text: {
     default: {
-      color: "text",
+      color: "navigation.text.primary.default",
       fontFamily: "body"
     },
     title: {
       fontFamily: "heading",
-      fontSize: 4,
+      fontSize: "5xl",
       lineSpace: "3.5"
     },
     help: {
-      color: "text",
+      color: "navigation.text.primary.default",
       '&[aria-disabled="true"]': {
-        color: "onMuted"
+        color: "navigation.text.muted.default"
       },
       negative: {
-        color: "danger",
+        color: "navigation.text.negative.default",
         '&[aria-disabled="true"]': {
-          color: "onMuted"
+          color: "navigation.text.muted.default"
         }
       }
     },
     headline: {
-      fontFamily: "contrast",
+      fontFamily: "heading",
       fontWeight: "bold",
-      lineHeight: "flat",
+      lineHeight: "moderate",
       fontSize: "5xl",
-      letterSpacing: "regular"
+      letterSpacing: "wide"
     },
     subheadline: {
-      fontFamily: "main",
+      fontFamily: "body",
       fontWeight: "bold",
-      lineHeight: "base",
+      lineHeight: "normal",
       fontSize: "xl",
-      letterSpacing: "regular"
+      letterSpacing: "wide"
     },
     h1: {
-      fontFamily: "contrast",
+      fontFamily: "heading",
       fontWeight: "extrabold",
-      lineHeight: "base",
+      lineHeight: "normal",
       fontSize: "3xl",
-      letterSpacing: "regular"
+      letterSpacing: "wide"
     },
     h2: {
-      fontFamily: "contrast",
+      fontFamily: "heading",
       fontWeight: "bold",
-      lineHeight: "base",
+      lineHeight: "normal",
       fontSize: "2xl",
-      letterSpacing: "regular"
+      letterSpacing: "wide"
     },
     h3: {
-      fontFamily: "contrast",
+      fontFamily: "heading",
       fontWeight: "bold",
-      lineHeight: "base",
+      lineHeight: "normal",
       fontSize: "xl",
-      letterSpacing: "regular"
+      letterSpacing: "wide"
     },
     h4: {
-      fontFamily: "contrast",
+      fontFamily: "heading",
       fontWeight: "semibold",
-      lineHeight: "base",
+      lineHeight: "normal",
       fontSize: "lg",
-      letterSpacing: "regular"
+      letterSpacing: "wide"
     },
     h5: {
-      fontFamily: "contrast",
+      fontFamily: "heading",
       fontWeight: "semibold",
-      lineHeight: "base",
-      fontSize: "base",
-      letterSpacing: "regular"
+      lineHeight: "normal",
+      fontSize: "md",
+      letterSpacing: "wide"
     }
   }
 };