@mantine/core 7.7.1 → 7.8.0

package/styles/Accordion.css

@@ -117,11 +117,11 @@
 }
 
 .m_fe19b709 {
-  border-bottom: calc(0.0625rem * var(--mantine-scale)) solid var(--item-border-color);
+  border-bottom: 1px solid var(--item-border-color);
 }
 
 .m_1f921b3b {
-  border: calc(0.0625rem * var(--mantine-scale)) solid var(--item-border-color);
+  border: 1px solid var(--item-border-color);
   transition: background-color 150ms ease;
 }
 
@@ -164,7 +164,7 @@
 .m_9f59b069 {
   background-color: var(--item-filled-color);
   border-radius: var(--accordion-radius);
-  border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+  border: 1px solid transparent;
   transition: background-color 150ms ease;
 }
 

package/styles/Accordion.layer.css

@@ -117,11 +117,11 @@
 }
 
 .m_fe19b709 {
-  border-bottom: calc(0.0625rem * var(--mantine-scale)) solid var(--item-border-color);
+  border-bottom: 1px solid var(--item-border-color);
 }
 
 .m_1f921b3b {
-  border: calc(0.0625rem * var(--mantine-scale)) solid var(--item-border-color);
+  border: 1px solid var(--item-border-color);
   transition: background-color 150ms ease;
 }
 
@@ -164,7 +164,7 @@
 .m_9f59b069 {
   background-color: var(--item-filled-color);
   border-radius: var(--accordion-radius);
-  border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+  border: 1px solid transparent;
   transition: background-color 150ms ease;
 }
 

package/styles/ActionIcon.css

@@ -1,15 +1,15 @@
 .m_8d3f4000 {
-  --ai-size-xs: calc(1.125rem * var(--mantine-scale));
-  --ai-size-sm: calc(1.375rem * var(--mantine-scale));
-  --ai-size-md: calc(1.75rem * var(--mantine-scale));
-  --ai-size-lg: calc(2.125rem * var(--mantine-scale));
-  --ai-size-xl: calc(2.75rem * var(--mantine-scale));
-
-  --ai-size-input-xs: calc(1.875rem * var(--mantine-scale));
-  --ai-size-input-sm: calc(2.25rem * var(--mantine-scale));
-  --ai-size-input-md: calc(2.625rem * var(--mantine-scale));
-  --ai-size-input-lg: calc(3.125rem * var(--mantine-scale));
-  --ai-size-input-xl: calc(3.75rem * var(--mantine-scale));
+  --ai-size-xs: 18px;
+  --ai-size-sm: 22px;
+  --ai-size-md: 28px;
+  --ai-size-lg: 34px;
+  --ai-size-xl: 44px;
+
+  --ai-size-input-xs: 30px;
+  --ai-size-input-sm: 36px;
+  --ai-size-input-md: 42px;
+  --ai-size-input-lg: 50px;
+  --ai-size-input-xl: 60px;
 
   --ai-size: var(--ai-size-md);
   --ai-color: var(--mantine-color-white);
@@ -58,7 +58,7 @@
 
   .m_8d3f4000:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
     cursor: not-allowed;
-    border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+    border: 1px solid transparent;
   }
 
   :where([data-mantine-color-scheme='light']) .m_8d3f4000:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
@@ -76,7 +76,7 @@
     }
 
 .m_302b9fb1 {
-  inset: calc(-0.0625rem * var(--mantine-scale));
+  inset: -1px;
   position: absolute;
   border-radius: var(--ai-radius, var(--mantine-radius-default));
   display: flex;
@@ -93,7 +93,7 @@
 }
 
 .m_1a0f1b21 {
-  --ai-border-width: calc(0.0625rem * var(--mantine-scale));
+  --ai-border-width: 1px;
   display: flex;
 }
 

package/styles/ActionIcon.layer.css

@@ -1,15 +1,15 @@
 @layer mantine {.m_8d3f4000 {
-  --ai-size-xs: calc(1.125rem * var(--mantine-scale));
-  --ai-size-sm: calc(1.375rem * var(--mantine-scale));
-  --ai-size-md: calc(1.75rem * var(--mantine-scale));
-  --ai-size-lg: calc(2.125rem * var(--mantine-scale));
-  --ai-size-xl: calc(2.75rem * var(--mantine-scale));
-
-  --ai-size-input-xs: calc(1.875rem * var(--mantine-scale));
-  --ai-size-input-sm: calc(2.25rem * var(--mantine-scale));
-  --ai-size-input-md: calc(2.625rem * var(--mantine-scale));
-  --ai-size-input-lg: calc(3.125rem * var(--mantine-scale));
-  --ai-size-input-xl: calc(3.75rem * var(--mantine-scale));
+  --ai-size-xs: 18px;
+  --ai-size-sm: 22px;
+  --ai-size-md: 28px;
+  --ai-size-lg: 34px;
+  --ai-size-xl: 44px;
+
+  --ai-size-input-xs: 30px;
+  --ai-size-input-sm: 36px;
+  --ai-size-input-md: 42px;
+  --ai-size-input-lg: 50px;
+  --ai-size-input-xl: 60px;
 
   --ai-size: var(--ai-size-md);
   --ai-color: var(--mantine-color-white);
@@ -58,7 +58,7 @@
 
   .m_8d3f4000:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
     cursor: not-allowed;
-    border: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+    border: 1px solid transparent;
   }
 
   :where([data-mantine-color-scheme='light']) .m_8d3f4000:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
@@ -76,7 +76,7 @@
     }
 
 .m_302b9fb1 {
-  inset: calc(-0.0625rem * var(--mantine-scale));
+  inset: -1px;
   position: absolute;
   border-radius: var(--ai-radius, var(--mantine-radius-default));
   display: flex;
@@ -93,7 +93,7 @@
 }
 
 .m_1a0f1b21 {
-  --ai-border-width: calc(0.0625rem * var(--mantine-scale));
+  --ai-border-width: 1px;
   display: flex;
 }
 

package/styles/Alert.css

@@ -1,7 +1,7 @@
 .m_66836ed3 {
   --alert-radius: var(--mantine-radius-default);
   --alert-bg: var(--mantine-primary-color-light);
-  --alert-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+  --alert-bd: 1px solid transparent;
   --alert-color: var(--mantine-primary-color-light-color);
 
   padding: var(--mantine-spacing-md) var(--mantine-spacing-md);
@@ -44,13 +44,13 @@
 
 .m_667f2a6a {
   line-height: 1;
-  width: calc(1.25rem * var(--mantine-scale));
-  height: calc(1.25rem * var(--mantine-scale));
+  width: 20px;
+  height: 20px;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   margin-inline-end: var(--mantine-spacing-md);
-  margin-top: calc(0.0625rem * var(--mantine-scale));
+  margin-top: 1px;
 }
 
 .m_7fa78076 {
@@ -76,7 +76,7 @@
   }
 
 .m_87f54839 {
-  width: calc(1.25rem * var(--mantine-scale));
-  height: calc(1.25rem * var(--mantine-scale));
+  width: 20px;
+  height: 20px;
   color: var(--alert-color);
 }

package/styles/Alert.layer.css

@@ -1,7 +1,7 @@
 @layer mantine {.m_66836ed3 {
   --alert-radius: var(--mantine-radius-default);
   --alert-bg: var(--mantine-primary-color-light);
-  --alert-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+  --alert-bd: 1px solid transparent;
   --alert-color: var(--mantine-primary-color-light-color);
 
   padding: var(--mantine-spacing-md) var(--mantine-spacing-md);
@@ -44,13 +44,13 @@
 
 .m_667f2a6a {
   line-height: 1;
-  width: calc(1.25rem * var(--mantine-scale));
-  height: calc(1.25rem * var(--mantine-scale));
+  width: 20px;
+  height: 20px;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   margin-inline-end: var(--mantine-spacing-md);
-  margin-top: calc(0.0625rem * var(--mantine-scale));
+  margin-top: 1px;
 }
 
 .m_7fa78076 {
@@ -76,8 +76,8 @@
   }
 
 .m_87f54839 {
-  width: calc(1.25rem * var(--mantine-scale));
-  height: calc(1.25rem * var(--mantine-scale));
+  width: 20px;
+  height: 20px;
   color: var(--alert-color);
 }
 }

package/styles/AppShell.css

@@ -2,8 +2,8 @@
     --app-shell-transition-duration: 0ms !important;
   }
   .m_89ab340[data-disabled] {
-    --app-shell-header-offset: 0px !important;
-    --app-shell-navbar-offset: 0px !important;
+    --app-shell-header-offset: 0rem !important;
+    --app-shell-navbar-offset: 0rem !important;
   }
   [data-mantine-color-scheme='light'] .m_89ab340 {
     --app-shell-border-color: var(--mantine-color-gray-3);
@@ -26,14 +26,16 @@
   position: fixed;
   display: flex;
   flex-direction: column;
-  top: var(--app-shell-header-offset, 0px);
-  height: calc(100dvh - var(--app-shell-header-offset, 0px) - var(--app-shell-footer-offset, 0px));
+  top: var(--app-shell-header-offset, 0rem);
+  height: calc(
+    100dvh - var(--app-shell-header-offset, 0rem) - var(--app-shell-footer-offset, 0rem)
+  );
   background-color: var(--mantine-color-body);
   transition-property: transform, top, height;
 }
 
 :where([data-layout='alt']) .m_45252eee, :where([data-layout='alt']) .m_9cdde9a {
-    top: 0px;
+    top: 0rem;
     height: 100dvh;
   }
 
@@ -50,7 +52,7 @@
 }
 
 .m_45252eee:where([data-with-border]) {
-    border-inline-end: calc(0.0625rem * var(--mantine-scale)) solid var(--app-shell-border-color);
+    border-inline-end: 1px solid var(--app-shell-border-color);
   }
 
 .m_9cdde9a {
@@ -65,14 +67,14 @@
 }
 
 .m_9cdde9a:where([data-with-border]) {
-    border-inline-start: calc(0.0625rem * var(--mantine-scale)) solid var(--app-shell-border-color);
+    border-inline-start: 1px solid var(--app-shell-border-color);
   }
 
 .m_8983817 {
-  padding-inline-start: calc(var(--app-shell-navbar-offset, 0px) + var(--app-shell-padding));
-  padding-inline-end: calc(var(--app-shell-aside-offset, 0px) + var(--app-shell-padding));
-  padding-top: calc(var(--app-shell-header-offset, 0px) + var(--app-shell-padding));
-  padding-bottom: calc(var(--app-shell-footer-offset, 0px) + var(--app-shell-padding));
+  padding-inline-start: calc(var(--app-shell-navbar-offset, 0rem) + var(--app-shell-padding));
+  padding-inline-end: calc(var(--app-shell-aside-offset, 0rem) + var(--app-shell-padding));
+  padding-top: calc(var(--app-shell-header-offset, 0rem) + var(--app-shell-padding));
+  padding-bottom: calc(var(--app-shell-footer-offset, 0rem) + var(--app-shell-padding));
   min-height: 100dvh;
   transition-property: padding;
 }
@@ -86,8 +88,8 @@
 }
 
 :where([data-layout='alt']) .m_3b16f56b, :where([data-layout='alt']) .m_3840c879 {
-    inset-inline-start: var(--app-shell-navbar-offset, 0px);
-    inset-inline-end: var(--app-shell-aside-offset, 0px);
+    inset-inline-start: var(--app-shell-navbar-offset, 0rem);
+    inset-inline-end: var(--app-shell-aside-offset, 0rem);
   }
 
 .m_3b16f56b {
@@ -99,18 +101,19 @@
 }
 
 .m_3b16f56b:where([data-with-border]) {
-    border-bottom: calc(0.0625rem * var(--mantine-scale)) solid var(--app-shell-border-color);
+    border-bottom: 1px solid var(--app-shell-border-color);
   }
 
 .m_3840c879 {
-  bottom: env(safe-area-inset-bottom);
-  height: var(--app-shell-footer-height);
+  bottom: 0;
+  height: calc(var(--app-shell-footer-height) + env(safe-area-inset-bottom));
+  padding-bottom: env(safe-area-inset-bottom);
   transform: var(--app-shell-footer-transform);
   z-index: var(--app-shell-footer-z-index);
 }
 
 .m_3840c879:where([data-with-border]) {
-    border-top: calc(0.0625rem * var(--mantine-scale)) solid var(--app-shell-border-color);
+    border-top: 1px solid var(--app-shell-border-color);
   }
 
 .m_6dcfc7c7 {

package/styles/AppShell.layer.css

@@ -2,8 +2,8 @@
     --app-shell-transition-duration: 0ms !important;
   }
   .m_89ab340[data-disabled] {
-    --app-shell-header-offset: 0px !important;
-    --app-shell-navbar-offset: 0px !important;
+    --app-shell-header-offset: 0rem !important;
+    --app-shell-navbar-offset: 0rem !important;
   }
   [data-mantine-color-scheme='light'] .m_89ab340 {
     --app-shell-border-color: var(--mantine-color-gray-3);
@@ -26,14 +26,16 @@
   position: fixed;
   display: flex;
   flex-direction: column;
-  top: var(--app-shell-header-offset, 0px);
-  height: calc(100dvh - var(--app-shell-header-offset, 0px) - var(--app-shell-footer-offset, 0px));
+  top: var(--app-shell-header-offset, 0rem);
+  height: calc(
+    100dvh - var(--app-shell-header-offset, 0rem) - var(--app-shell-footer-offset, 0rem)
+  );
   background-color: var(--mantine-color-body);
   transition-property: transform, top, height;
 }
 
 :where([data-layout='alt']) .m_45252eee, :where([data-layout='alt']) .m_9cdde9a {
-    top: 0px;
+    top: 0rem;
     height: 100dvh;
   }
 
@@ -50,7 +52,7 @@
 }
 
 .m_45252eee:where([data-with-border]) {
-    border-inline-end: calc(0.0625rem * var(--mantine-scale)) solid var(--app-shell-border-color);
+    border-inline-end: 1px solid var(--app-shell-border-color);
   }
 
 .m_9cdde9a {
@@ -65,14 +67,14 @@
 }
 
 .m_9cdde9a:where([data-with-border]) {
-    border-inline-start: calc(0.0625rem * var(--mantine-scale)) solid var(--app-shell-border-color);
+    border-inline-start: 1px solid var(--app-shell-border-color);
   }
 
 .m_8983817 {
-  padding-inline-start: calc(var(--app-shell-navbar-offset, 0px) + var(--app-shell-padding));
-  padding-inline-end: calc(var(--app-shell-aside-offset, 0px) + var(--app-shell-padding));
-  padding-top: calc(var(--app-shell-header-offset, 0px) + var(--app-shell-padding));
-  padding-bottom: calc(var(--app-shell-footer-offset, 0px) + var(--app-shell-padding));
+  padding-inline-start: calc(var(--app-shell-navbar-offset, 0rem) + var(--app-shell-padding));
+  padding-inline-end: calc(var(--app-shell-aside-offset, 0rem) + var(--app-shell-padding));
+  padding-top: calc(var(--app-shell-header-offset, 0rem) + var(--app-shell-padding));
+  padding-bottom: calc(var(--app-shell-footer-offset, 0rem) + var(--app-shell-padding));
   min-height: 100dvh;
   transition-property: padding;
 }
@@ -86,8 +88,8 @@
 }
 
 :where([data-layout='alt']) .m_3b16f56b, :where([data-layout='alt']) .m_3840c879 {
-    inset-inline-start: var(--app-shell-navbar-offset, 0px);
-    inset-inline-end: var(--app-shell-aside-offset, 0px);
+    inset-inline-start: var(--app-shell-navbar-offset, 0rem);
+    inset-inline-end: var(--app-shell-aside-offset, 0rem);
   }
 
 .m_3b16f56b {
@@ -99,18 +101,19 @@
 }
 
 .m_3b16f56b:where([data-with-border]) {
-    border-bottom: calc(0.0625rem * var(--mantine-scale)) solid var(--app-shell-border-color);
+    border-bottom: 1px solid var(--app-shell-border-color);
   }
 
 .m_3840c879 {
-  bottom: env(safe-area-inset-bottom);
-  height: var(--app-shell-footer-height);
+  bottom: 0;
+  height: calc(var(--app-shell-footer-height) + env(safe-area-inset-bottom));
+  padding-bottom: env(safe-area-inset-bottom);
   transform: var(--app-shell-footer-transform);
   z-index: var(--app-shell-footer-z-index);
 }
 
 .m_3840c879:where([data-with-border]) {
-    border-top: calc(0.0625rem * var(--mantine-scale)) solid var(--app-shell-border-color);
+    border-top: 1px solid var(--app-shell-border-color);
   }
 
 .m_6dcfc7c7 {

package/styles/Avatar.css

@@ -9,16 +9,16 @@
 
 /* Avatar root element */
 .m_f85678b6 {
-  --avatar-size-xs: calc(1rem * var(--mantine-scale));
-  --avatar-size-sm: calc(1.625rem * var(--mantine-scale));
-  --avatar-size-md: calc(2.375rem * var(--mantine-scale));
-  --avatar-size-lg: calc(3.5rem * var(--mantine-scale));
-  --avatar-size-xl: calc(5.25rem * var(--mantine-scale));
+  --avatar-size-xs: 16px;
+  --avatar-size-sm: 26px;
+  --avatar-size-md: 38px;
+  --avatar-size-lg: 56px;
+  --avatar-size-xl: 84px;
 
   --avatar-size: var(--avatar-size-md);
-  --avatar-radius: calc(62.5rem * var(--mantine-scale));
+  --avatar-radius: 1000px;
   --avatar-bg: var(--mantine-color-gray-light);
-  --avatar-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+  --avatar-bd: 1px solid transparent;
   --avatar-color: var(--mantine-color-gray-light-color);
   --avatar-placeholder-fz: calc(var(--avatar-size) / 2.5);
 
@@ -36,7 +36,7 @@
 }
 .m_f85678b6:where([data-within-group]) {
     margin-inline-start: var(--ag-offset);
-    border: calc(0.125rem * var(--mantine-scale)) solid var(--mantine-color-body);
+    border: 2px solid var(--mantine-color-body);
     background: var(--mantine-color-body);
   }
 

package/styles/Avatar.layer.css

@@ -9,16 +9,16 @@
 
 /* Avatar root element */
 .m_f85678b6 {
-  --avatar-size-xs: calc(1rem * var(--mantine-scale));
-  --avatar-size-sm: calc(1.625rem * var(--mantine-scale));
-  --avatar-size-md: calc(2.375rem * var(--mantine-scale));
-  --avatar-size-lg: calc(3.5rem * var(--mantine-scale));
-  --avatar-size-xl: calc(5.25rem * var(--mantine-scale));
+  --avatar-size-xs: 16px;
+  --avatar-size-sm: 26px;
+  --avatar-size-md: 38px;
+  --avatar-size-lg: 56px;
+  --avatar-size-xl: 84px;
 
   --avatar-size: var(--avatar-size-md);
-  --avatar-radius: calc(62.5rem * var(--mantine-scale));
+  --avatar-radius: 1000px;
   --avatar-bg: var(--mantine-color-gray-light);
-  --avatar-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+  --avatar-bd: 1px solid transparent;
   --avatar-color: var(--mantine-color-gray-light-color);
   --avatar-placeholder-fz: calc(var(--avatar-size) / 2.5);
 
@@ -36,7 +36,7 @@
 }
 .m_f85678b6:where([data-within-group]) {
     margin-inline-start: var(--ag-offset);
-    border: calc(0.125rem * var(--mantine-scale)) solid var(--mantine-color-body);
+    border: 2px solid var(--mantine-color-body);
     background: var(--mantine-color-body);
   }
 

package/styles/Badge.css

@@ -1,30 +1,30 @@
 .m_347db0ec {
-  --badge-height-xs: calc(1rem * var(--mantine-scale));
-  --badge-height-sm: calc(1.125rem * var(--mantine-scale));
-  --badge-height-md: calc(1.25rem * var(--mantine-scale));
-  --badge-height-lg: calc(1.625rem * var(--mantine-scale));
-  --badge-height-xl: calc(2rem * var(--mantine-scale));
+  --badge-height-xs: 16px;
+  --badge-height-sm: 18px;
+  --badge-height-md: 20px;
+  --badge-height-lg: 26px;
+  --badge-height-xl: 32px;
 
-  --badge-fz-xs: calc(0.5625rem * var(--mantine-scale));
-  --badge-fz-sm: calc(0.625rem * var(--mantine-scale));
-  --badge-fz-md: calc(0.6875rem * var(--mantine-scale));
-  --badge-fz-lg: calc(0.8125rem * var(--mantine-scale));
-  --badge-fz-xl: calc(1rem * var(--mantine-scale));
+  --badge-fz-xs: 9px;
+  --badge-fz-sm: 10px;
+  --badge-fz-md: 11px;
+  --badge-fz-lg: 13px;
+  --badge-fz-xl: 16px;
 
-  --badge-padding-x-xs: calc(0.375rem * var(--mantine-scale));
-  --badge-padding-x-sm: calc(0.5rem * var(--mantine-scale));
-  --badge-padding-x-md: calc(0.625rem * var(--mantine-scale));
-  --badge-padding-x-lg: calc(0.75rem * var(--mantine-scale));
-  --badge-padding-x-xl: calc(1rem * var(--mantine-scale));
+  --badge-padding-x-xs: 6px;
+  --badge-padding-x-sm: 8px;
+  --badge-padding-x-md: 10px;
+  --badge-padding-x-lg: 12px;
+  --badge-padding-x-xl: 16px;
 
   --badge-height: var(--badge-height-md);
   --badge-fz: var(--badge-fz-md);
   --badge-padding-x: var(--badge-padding-x-md);
-  --badge-radius: calc(62.5rem * var(--mantine-scale));
+  --badge-radius: 1000px;
   --badge-lh: calc(var(--badge-height) - calc(0.125rem * var(--mantine-scale)));
   --badge-color: var(--mantine-color-white);
   --badge-bg: var(--mantine-primary-color-filled);
-  --badge-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+  --badge-bd: 1px solid transparent;
 
   -webkit-tap-highlight-color: transparent;
   font-size: var(--badge-fz);
@@ -39,7 +39,7 @@
   width: fit-content;
   text-transform: uppercase;
   font-weight: 700;
-  letter-spacing: calc(0.015625rem * var(--mantine-scale));
+  letter-spacing: 0.25px;
   cursor: inherit;
   text-overflow: ellipsis;
   overflow: hidden;
@@ -54,7 +54,7 @@
   }
 
   .m_347db0ec:where([data-circle]) {
-    padding-inline: calc(0.125rem * var(--mantine-scale));
+    padding-inline: 2px;
     width: var(--badge-height);
   }
 

package/styles/Badge.layer.css

@@ -1,30 +1,30 @@
 @layer mantine {.m_347db0ec {
-  --badge-height-xs: calc(1rem * var(--mantine-scale));
-  --badge-height-sm: calc(1.125rem * var(--mantine-scale));
-  --badge-height-md: calc(1.25rem * var(--mantine-scale));
-  --badge-height-lg: calc(1.625rem * var(--mantine-scale));
-  --badge-height-xl: calc(2rem * var(--mantine-scale));
+  --badge-height-xs: 16px;
+  --badge-height-sm: 18px;
+  --badge-height-md: 20px;
+  --badge-height-lg: 26px;
+  --badge-height-xl: 32px;
 
-  --badge-fz-xs: calc(0.5625rem * var(--mantine-scale));
-  --badge-fz-sm: calc(0.625rem * var(--mantine-scale));
-  --badge-fz-md: calc(0.6875rem * var(--mantine-scale));
-  --badge-fz-lg: calc(0.8125rem * var(--mantine-scale));
-  --badge-fz-xl: calc(1rem * var(--mantine-scale));
+  --badge-fz-xs: 9px;
+  --badge-fz-sm: 10px;
+  --badge-fz-md: 11px;
+  --badge-fz-lg: 13px;
+  --badge-fz-xl: 16px;
 
-  --badge-padding-x-xs: calc(0.375rem * var(--mantine-scale));
-  --badge-padding-x-sm: calc(0.5rem * var(--mantine-scale));
-  --badge-padding-x-md: calc(0.625rem * var(--mantine-scale));
-  --badge-padding-x-lg: calc(0.75rem * var(--mantine-scale));
-  --badge-padding-x-xl: calc(1rem * var(--mantine-scale));
+  --badge-padding-x-xs: 6px;
+  --badge-padding-x-sm: 8px;
+  --badge-padding-x-md: 10px;
+  --badge-padding-x-lg: 12px;
+  --badge-padding-x-xl: 16px;
 
   --badge-height: var(--badge-height-md);
   --badge-fz: var(--badge-fz-md);
   --badge-padding-x: var(--badge-padding-x-md);
-  --badge-radius: calc(62.5rem * var(--mantine-scale));
+  --badge-radius: 1000px;
   --badge-lh: calc(var(--badge-height) - calc(0.125rem * var(--mantine-scale)));
   --badge-color: var(--mantine-color-white);
   --badge-bg: var(--mantine-primary-color-filled);
-  --badge-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+  --badge-bd: 1px solid transparent;
 
   -webkit-tap-highlight-color: transparent;
   font-size: var(--badge-fz);
@@ -39,7 +39,7 @@
   width: fit-content;
   text-transform: uppercase;
   font-weight: 700;
-  letter-spacing: calc(0.015625rem * var(--mantine-scale));
+  letter-spacing: 0.25px;
   cursor: inherit;
   text-overflow: ellipsis;
   overflow: hidden;
@@ -54,7 +54,7 @@
   }
 
   .m_347db0ec:where([data-circle]) {
-    padding-inline: calc(0.125rem * var(--mantine-scale));
+    padding-inline: 2px;
     width: var(--badge-height);
   }
 

package/styles/Blockquote.css

@@ -1,5 +1,5 @@
 .m_ddec01c0 {
-  --blockquote-border: calc(0.1875rem * var(--mantine-scale)) solid var(--bq-bd);
+  --blockquote-border: 3px solid var(--bq-bd);
 
   position: relative;
   margin: 0;

package/styles/Blockquote.layer.css

@@ -1,5 +1,5 @@
 @layer mantine {.m_ddec01c0 {
-  --blockquote-border: calc(0.1875rem * var(--mantine-scale)) solid var(--bq-bd);
+  --blockquote-border: 3px solid var(--bq-bd);
 
   position: relative;
   margin: 0;

package/styles/Burger.css

@@ -1,9 +1,9 @@
 .m_fea6bf1a {
-  --burger-size-xs: calc(0.75rem * var(--mantine-scale));
-  --burger-size-sm: calc(1.125rem * var(--mantine-scale));
-  --burger-size-md: calc(1.5rem * var(--mantine-scale));
-  --burger-size-lg: calc(2.125rem * var(--mantine-scale));
-  --burger-size-xl: calc(2.625rem * var(--mantine-scale));
+  --burger-size-xs: 12px;
+  --burger-size-sm: 18px;
+  --burger-size-md: 24px;
+  --burger-size-lg: 34px;
+  --burger-size-xl: 42px;
 
   --burger-size: var(--burger-size-md);
 
@@ -33,7 +33,7 @@
     width: var(--burger-size);
     height: calc(var(--burger-size) / 12);
     background-color: var(--burger-color);
-    outline: calc(0.0625rem * var(--mantine-scale)) solid transparent;
+    outline: 1px solid transparent;
     transition-property: background-color, transform;
     transition-duration: var(--burger-transition-duration, 300ms);
     transition-timing-function: var(--burger-transition-timing-function, ease);