@mantine/core 7.7.2 → 7.8.1

package/styles/Kbd.css

@@ -1,16 +1,16 @@
 .m_dc6f14e2 {
-  --kbd-fz-xs: calc(0.625rem * var(--mantine-scale));
-  --kbd-fz-sm: calc(0.75rem * var(--mantine-scale));
-  --kbd-fz-md: calc(0.875rem * var(--mantine-scale));
-  --kbd-fz-lg: calc(1rem * var(--mantine-scale));
-  --kbd-fz-xl: calc(1.25rem * var(--mantine-scale));
+  --kbd-fz-xs: 10px;
+  --kbd-fz-sm: 12px;
+  --kbd-fz-md: 14px;
+  --kbd-fz-lg: 16px;
+  --kbd-fz-xl: 20px;
   --kbd-fz: var(--kbd-fz-sm);
 
-  --kbd-padding-xs: calc(0.125rem * var(--mantine-scale)) calc(0.25rem * var(--mantine-scale));
-  --kbd-padding-sm: calc(0.1875rem * var(--mantine-scale)) calc(0.3125rem * var(--mantine-scale));
-  --kbd-padding-md: calc(0.25rem * var(--mantine-scale)) calc(0.4375rem * var(--mantine-scale));
-  --kbd-padding-lg: calc(0.3125rem * var(--mantine-scale)) calc(0.5625rem * var(--mantine-scale));
-  --kbd-padding-xl: calc(0.5rem * var(--mantine-scale)) calc(0.875rem * var(--mantine-scale));
+  --kbd-padding-xs: 2px 4px;
+  --kbd-padding-sm: 3px 5px;
+  --kbd-padding-md: 4px 7px;
+  --kbd-padding-lg: 5px 9px;
+  --kbd-padding-xl: 8px 14px;
   --kbd-padding: var(--kbd-padding-sm);
 
   font-family: var(--mantine-font-family-monospace);
@@ -19,8 +19,8 @@
   padding: var(--kbd-padding);
   font-size: var(--kbd-fz);
   border-radius: var(--mantine-radius-sm);
-  border: calc(0.0625rem * var(--mantine-scale)) solid;
-  border-bottom-width: calc(0.1875rem * var(--mantine-scale));
+  border: 1px solid;
+  border-bottom-width: 3px;
   unicode-bidi: embed;
 }
 

package/styles/Kbd.layer.css

@@ -1,16 +1,16 @@
 @layer mantine {.m_dc6f14e2 {
-  --kbd-fz-xs: calc(0.625rem * var(--mantine-scale));
-  --kbd-fz-sm: calc(0.75rem * var(--mantine-scale));
-  --kbd-fz-md: calc(0.875rem * var(--mantine-scale));
-  --kbd-fz-lg: calc(1rem * var(--mantine-scale));
-  --kbd-fz-xl: calc(1.25rem * var(--mantine-scale));
+  --kbd-fz-xs: 10px;
+  --kbd-fz-sm: 12px;
+  --kbd-fz-md: 14px;
+  --kbd-fz-lg: 16px;
+  --kbd-fz-xl: 20px;
   --kbd-fz: var(--kbd-fz-sm);
 
-  --kbd-padding-xs: calc(0.125rem * var(--mantine-scale)) calc(0.25rem * var(--mantine-scale));
-  --kbd-padding-sm: calc(0.1875rem * var(--mantine-scale)) calc(0.3125rem * var(--mantine-scale));
-  --kbd-padding-md: calc(0.25rem * var(--mantine-scale)) calc(0.4375rem * var(--mantine-scale));
-  --kbd-padding-lg: calc(0.3125rem * var(--mantine-scale)) calc(0.5625rem * var(--mantine-scale));
-  --kbd-padding-xl: calc(0.5rem * var(--mantine-scale)) calc(0.875rem * var(--mantine-scale));
+  --kbd-padding-xs: 2px 4px;
+  --kbd-padding-sm: 3px 5px;
+  --kbd-padding-md: 4px 7px;
+  --kbd-padding-lg: 5px 9px;
+  --kbd-padding-xl: 8px 14px;
   --kbd-padding: var(--kbd-padding-sm);
 
   font-family: var(--mantine-font-family-monospace);
@@ -19,8 +19,8 @@
   padding: var(--kbd-padding);
   font-size: var(--kbd-fz);
   border-radius: var(--mantine-radius-sm);
-  border: calc(0.0625rem * var(--mantine-scale)) solid;
-  border-bottom-width: calc(0.1875rem * var(--mantine-scale));
+  border: 1px solid;
+  border-bottom-width: 3px;
   unicode-bidi: embed;
 }
 

package/styles/Loader.css

@@ -1,9 +1,9 @@
 .m_5ae2e3c {
-  --loader-size-xs: calc(1.125rem * var(--mantine-scale));
-  --loader-size-sm: calc(1.375rem * var(--mantine-scale));
-  --loader-size-md: calc(2.25rem * var(--mantine-scale));
-  --loader-size-lg: calc(2.75rem * var(--mantine-scale));
-  --loader-size-xl: calc(3.625rem * var(--mantine-scale));
+  --loader-size-xs: 18px;
+  --loader-size-sm: 22px;
+  --loader-size-md: 36px;
+  --loader-size-lg: 44px;
+  --loader-size-xl: 58px;
   --loader-size: var(--loader-size-md);
   --loader-color: var(--mantine-primary-color-filled);
 }
@@ -33,7 +33,7 @@
   flex: 1;
   background: var(--loader-color);
   animation: m_5d2b3b9d 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
-  border-radius: calc(0.125rem * var(--mantine-scale));
+  border-radius: 2px;
 }
 
 .m_870bb79:nth-of-type(1) {
@@ -106,7 +106,7 @@
     display: block;
     width: var(--loader-size);
     height: var(--loader-size);
-    border-radius: calc(625rem * var(--mantine-scale));
+    border-radius: 10000px;
     border-width: calc(var(--loader-size) / 8);
     border-style: solid;
     border-color: var(--loader-color) var(--loader-color) var(--loader-color) transparent;

package/styles/Loader.layer.css

@@ -1,9 +1,9 @@
 @layer mantine {.m_5ae2e3c {
-  --loader-size-xs: calc(1.125rem * var(--mantine-scale));
-  --loader-size-sm: calc(1.375rem * var(--mantine-scale));
-  --loader-size-md: calc(2.25rem * var(--mantine-scale));
-  --loader-size-lg: calc(2.75rem * var(--mantine-scale));
-  --loader-size-xl: calc(3.625rem * var(--mantine-scale));
+  --loader-size-xs: 18px;
+  --loader-size-sm: 22px;
+  --loader-size-md: 36px;
+  --loader-size-lg: 44px;
+  --loader-size-xl: 58px;
   --loader-size: var(--loader-size-md);
   --loader-color: var(--mantine-primary-color-filled);
 }
@@ -33,7 +33,7 @@
   flex: 1;
   background: var(--loader-color);
   animation: m_5d2b3b9d 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
-  border-radius: calc(0.125rem * var(--mantine-scale));
+  border-radius: 2px;
 }
 
 .m_870bb79:nth-of-type(1) {
@@ -106,7 +106,7 @@
     display: block;
     width: var(--loader-size);
     height: var(--loader-size);
-    border-radius: calc(625rem * var(--mantine-scale));
+    border-radius: 10000px;
     border-width: calc(var(--loader-size) / 8);
     border-style: solid;
     border-color: var(--loader-color) var(--loader-color) var(--loader-color) transparent;

package/styles/Menu.css

@@ -1,5 +1,5 @@
 .m_dc9b7c9f {
-  padding: calc(0.25rem * var(--mantine-scale));
+  padding: 4px;
 }
 
 .m_9bfac126 {
@@ -11,9 +11,9 @@
 }
 
 .m_efdf90cb {
-  margin-top: calc(0.25rem * var(--mantine-scale));
-  margin-bottom: calc(0.25rem * var(--mantine-scale));
-  border-top: calc(0.0625rem * var(--mantine-scale)) solid;
+  margin-top: 4px;
+  margin-bottom: 4px;
+  border-top: 1px solid;
 }
 
 :where([data-mantine-color-scheme='light']) .m_efdf90cb {

package/styles/Menu.layer.css

@@ -1,5 +1,5 @@
 @layer mantine {.m_dc9b7c9f {
-  padding: calc(0.25rem * var(--mantine-scale));
+  padding: 4px;
 }
 
 .m_9bfac126 {
@@ -11,9 +11,9 @@
 }
 
 .m_efdf90cb {
-  margin-top: calc(0.25rem * var(--mantine-scale));
-  margin-bottom: calc(0.25rem * var(--mantine-scale));
-  border-top: calc(0.0625rem * var(--mantine-scale)) solid;
+  margin-top: 4px;
+  margin-bottom: 4px;
+  border-top: 1px solid;
 }
 
 :where([data-mantine-color-scheme='light']) .m_efdf90cb {

package/styles/Modal.css

@@ -1,9 +1,9 @@
 .m_9df02822 {
-  --modal-size-xs: calc(20rem * var(--mantine-scale));
-  --modal-size-sm: calc(23.75rem * var(--mantine-scale));
-  --modal-size-md: calc(27.5rem * var(--mantine-scale));
-  --modal-size-lg: calc(38.75rem * var(--mantine-scale));
-  --modal-size-xl: calc(48.75rem * var(--mantine-scale));
+  --modal-size-xs: 320px;
+  --modal-size-sm: 380px;
+  --modal-size-md: 440px;
+  --modal-size-lg: 620px;
+  --modal-size-xl: 780px;
   --modal-size: var(--modal-size-md);
 
   --modal-y-offset: 5dvh;

package/styles/Modal.layer.css

@@ -1,9 +1,9 @@
 @layer mantine {.m_9df02822 {
-  --modal-size-xs: calc(20rem * var(--mantine-scale));
-  --modal-size-sm: calc(23.75rem * var(--mantine-scale));
-  --modal-size-md: calc(27.5rem * var(--mantine-scale));
-  --modal-size-lg: calc(38.75rem * var(--mantine-scale));
-  --modal-size-xl: calc(48.75rem * var(--mantine-scale));
+  --modal-size-xs: 320px;
+  --modal-size-sm: 380px;
+  --modal-size-md: 440px;
+  --modal-size-lg: 620px;
+  --modal-size-xl: 780px;
   --modal-size: var(--modal-size-md);
 
   --modal-y-offset: 5dvh;

package/styles/ModalBase.css

@@ -16,7 +16,7 @@
   top: 0;
   background-color: var(--mantine-color-body);
   z-index: 1000;
-  min-height: calc(3.75rem * var(--mantine-scale));
+  min-height: 60px;
 }
 
 .m_60c222c7 {

package/styles/ModalBase.layer.css

@@ -16,7 +16,7 @@
   top: 0;
   background-color: var(--mantine-color-body);
   z-index: 1000;
-  min-height: calc(3.75rem * var(--mantine-scale));
+  min-height: 60px;
 }
 
 .m_60c222c7 {

package/styles/NavLink.css

@@ -6,7 +6,7 @@
   display: flex;
   align-items: center;
   width: 100%;
-  padding: calc(0.5rem * var(--mantine-scale)) var(--mantine-spacing-sm);
+  padding: 8px var(--mantine-spacing-sm);
   user-select: none;
 }
 

package/styles/NavLink.layer.css

@@ -6,7 +6,7 @@
   display: flex;
   align-items: center;
   width: 100%;
-  padding: calc(0.5rem * var(--mantine-scale)) var(--mantine-spacing-sm);
+  padding: 8px var(--mantine-spacing-sm);
   user-select: none;
 }
 

package/styles/Notification.css

@@ -7,7 +7,7 @@
   position: relative;
   display: flex;
   align-items: center;
-  padding-inline-start: calc(1.375rem * var(--mantine-scale));
+  padding-inline-start: 22px;
   padding-inline-end: var(--mantine-spacing-xs);
   padding-top: var(--mantine-spacing-xs);
   padding-bottom: var(--mantine-spacing-xs);
@@ -19,10 +19,10 @@
     content: '';
     display: block;
     position: absolute;
-    width: calc(0.375rem * var(--mantine-scale));
+    width: 6px;
     top: var(--notification-radius);
     bottom: var(--notification-radius);
-    inset-inline-start: calc(0.25rem * var(--mantine-scale));
+    inset-inline-start: 4px;
     border-radius: var(--notification-radius);
     background-color: var(--notification-color);
   }
@@ -44,19 +44,19 @@
     }
 
   :where([data-mantine-color-scheme='light']) .m_a513464:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
+      border: 1px solid var(--mantine-color-gray-3);
 }
 
   :where([data-mantine-color-scheme='dark']) .m_a513464:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
+      border: 1px solid var(--mantine-color-dark-4);
 }
 
 .m_a4ceffb {
   box-sizing: border-box;
   margin-inline-end: var(--mantine-spacing-md);
-  width: calc(1.75rem * var(--mantine-scale));
-  height: calc(1.75rem * var(--mantine-scale));
-  border-radius: calc(1.75rem * var(--mantine-scale));
+  width: 28px;
+  height: 28px;
+  border-radius: 28px;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -75,7 +75,7 @@
 }
 
 .m_3feedf16 {
-  margin-bottom: calc(0.125rem * var(--mantine-scale));
+  margin-bottom: 2px;
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: var(--mantine-font-size-sm);

package/styles/Notification.layer.css

@@ -7,7 +7,7 @@
   position: relative;
   display: flex;
   align-items: center;
-  padding-inline-start: calc(1.375rem * var(--mantine-scale));
+  padding-inline-start: 22px;
   padding-inline-end: var(--mantine-spacing-xs);
   padding-top: var(--mantine-spacing-xs);
   padding-bottom: var(--mantine-spacing-xs);
@@ -19,10 +19,10 @@
     content: '';
     display: block;
     position: absolute;
-    width: calc(0.375rem * var(--mantine-scale));
+    width: 6px;
     top: var(--notification-radius);
     bottom: var(--notification-radius);
-    inset-inline-start: calc(0.25rem * var(--mantine-scale));
+    inset-inline-start: 4px;
     border-radius: var(--notification-radius);
     background-color: var(--notification-color);
   }
@@ -44,19 +44,19 @@
     }
 
   :where([data-mantine-color-scheme='light']) .m_a513464:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
+      border: 1px solid var(--mantine-color-gray-3);
 }
 
   :where([data-mantine-color-scheme='dark']) .m_a513464:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
+      border: 1px solid var(--mantine-color-dark-4);
 }
 
 .m_a4ceffb {
   box-sizing: border-box;
   margin-inline-end: var(--mantine-spacing-md);
-  width: calc(1.75rem * var(--mantine-scale));
-  height: calc(1.75rem * var(--mantine-scale));
-  border-radius: calc(1.75rem * var(--mantine-scale));
+  width: 28px;
+  height: 28px;
+  border-radius: 28px;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -75,7 +75,7 @@
 }
 
 .m_3feedf16 {
-  margin-bottom: calc(0.125rem * var(--mantine-scale));
+  margin-bottom: 2px;
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: var(--mantine-font-size-sm);

package/styles/NumberInput.css

@@ -1,17 +1,17 @@
 .m_e2f5cd4e {
-  --ni-right-section-width-xs: calc(1.0625rem * var(--mantine-scale));
-  --ni-right-section-width-sm: calc(1.5rem * var(--mantine-scale));
-  --ni-right-section-width-md: calc(1.6875rem * var(--mantine-scale));
-  --ni-right-section-width-lg: calc(1.9375rem * var(--mantine-scale));
-  --ni-right-section-width-xl: calc(2.125rem * var(--mantine-scale));
+  --ni-right-section-width-xs: 17px;
+  --ni-right-section-width-sm: 24px;
+  --ni-right-section-width-md: 27px;
+  --ni-right-section-width-lg: 31px;
+  --ni-right-section-width-xl: 34px;
 }
 
 .m_95e17d22 {
-  --ni-chevron-size-xs: calc(0.625rem * var(--mantine-scale));
-  --ni-chevron-size-sm: calc(0.875rem * var(--mantine-scale));
-  --ni-chevron-size-md: calc(1rem * var(--mantine-scale));
-  --ni-chevron-size-lg: calc(1.125rem * var(--mantine-scale));
-  --ni-chevron-size-xl: calc(1.25rem * var(--mantine-scale));
+  --ni-chevron-size-xs: 10px;
+  --ni-chevron-size-sm: 14px;
+  --ni-chevron-size-md: 16px;
+  --ni-chevron-size-lg: 18px;
+  --ni-chevron-size-xl: 20px;
   --ni-chevron-size: var(--ni-chevron-size-sm);
 
   display: flex;
@@ -23,7 +23,7 @@
 }
 
 .m_80b4b171 {
-  --control-border: calc(0.0625rem * var(--mantine-scale)) solid var(--input-bd);
+  --control-border: 1px solid var(--input-bd);
   --control-radius: calc(var(--input-radius) - calc(0.0625rem * var(--mantine-scale)));
 
   flex: 0 0 50%;
@@ -83,7 +83,7 @@
   }
 
 .m_80b4b171:last-of-type {
-    border-top: calc(0.0625rem * var(--mantine-scale)) solid var(--input-bd);
+    border-top: 1 solid var(--input-bd);
     border-radius: 0;
     border-end-end-radius: var(--control-radius);
   }

package/styles/NumberInput.layer.css

@@ -1,17 +1,17 @@
 @layer mantine {.m_e2f5cd4e {
-  --ni-right-section-width-xs: calc(1.0625rem * var(--mantine-scale));
-  --ni-right-section-width-sm: calc(1.5rem * var(--mantine-scale));
-  --ni-right-section-width-md: calc(1.6875rem * var(--mantine-scale));
-  --ni-right-section-width-lg: calc(1.9375rem * var(--mantine-scale));
-  --ni-right-section-width-xl: calc(2.125rem * var(--mantine-scale));
+  --ni-right-section-width-xs: 17px;
+  --ni-right-section-width-sm: 24px;
+  --ni-right-section-width-md: 27px;
+  --ni-right-section-width-lg: 31px;
+  --ni-right-section-width-xl: 34px;
 }
 
 .m_95e17d22 {
-  --ni-chevron-size-xs: calc(0.625rem * var(--mantine-scale));
-  --ni-chevron-size-sm: calc(0.875rem * var(--mantine-scale));
-  --ni-chevron-size-md: calc(1rem * var(--mantine-scale));
-  --ni-chevron-size-lg: calc(1.125rem * var(--mantine-scale));
-  --ni-chevron-size-xl: calc(1.25rem * var(--mantine-scale));
+  --ni-chevron-size-xs: 10px;
+  --ni-chevron-size-sm: 14px;
+  --ni-chevron-size-md: 16px;
+  --ni-chevron-size-lg: 18px;
+  --ni-chevron-size-xl: 20px;
   --ni-chevron-size: var(--ni-chevron-size-sm);
 
   display: flex;
@@ -23,7 +23,7 @@
 }
 
 .m_80b4b171 {
-  --control-border: calc(0.0625rem * var(--mantine-scale)) solid var(--input-bd);
+  --control-border: 1px solid var(--input-bd);
   --control-radius: calc(var(--input-radius) - calc(0.0625rem * var(--mantine-scale)));
 
   flex: 0 0 50%;
@@ -83,7 +83,7 @@
   }
 
 .m_80b4b171:last-of-type {
-    border-top: calc(0.0625rem * var(--mantine-scale)) solid var(--input-bd);
+    border-top: 1 solid var(--input-bd);
     border-radius: 0;
     border-end-end-radius: var(--control-radius);
   }

package/styles/Pagination.css

@@ -1,9 +1,9 @@
 .m_4addd315 {
-  --pagination-control-size-xs: calc(1.375rem * var(--mantine-scale));
-  --pagination-control-size-sm: calc(1.625rem * var(--mantine-scale));
-  --pagination-control-size-md: calc(2rem * var(--mantine-scale));
-  --pagination-control-size-lg: calc(2.375rem * var(--mantine-scale));
-  --pagination-control-size-xl: calc(2.75rem * var(--mantine-scale));
+  --pagination-control-size-xs: 22px;
+  --pagination-control-size-sm: 26px;
+  --pagination-control-size-md: 32px;
+  --pagination-control-size-lg: 38px;
+  --pagination-control-size-xl: 44px;
   --pagination-control-size: var(--pagination-control-size-md);
   --pagination-control-fz: var(--mantine-font-size-md);
   --pagination-active-bg: var(--mantine-primary-color-filled);
@@ -13,7 +13,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  border: calc(0.0625rem * var(--mantine-scale)) solid;
+  border: 1px solid;
   cursor: pointer;
   color: var(--mantine-color-text);
   height: var(--pagination-control-size);

package/styles/Pagination.layer.css

@@ -1,9 +1,9 @@
 @layer mantine {.m_4addd315 {
-  --pagination-control-size-xs: calc(1.375rem * var(--mantine-scale));
-  --pagination-control-size-sm: calc(1.625rem * var(--mantine-scale));
-  --pagination-control-size-md: calc(2rem * var(--mantine-scale));
-  --pagination-control-size-lg: calc(2.375rem * var(--mantine-scale));
-  --pagination-control-size-xl: calc(2.75rem * var(--mantine-scale));
+  --pagination-control-size-xs: 22px;
+  --pagination-control-size-sm: 26px;
+  --pagination-control-size-md: 32px;
+  --pagination-control-size-lg: 38px;
+  --pagination-control-size-xl: 44px;
   --pagination-control-size: var(--pagination-control-size-md);
   --pagination-control-fz: var(--mantine-font-size-md);
   --pagination-active-bg: var(--mantine-primary-color-filled);
@@ -13,7 +13,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  border: calc(0.0625rem * var(--mantine-scale)) solid;
+  border: 1px solid;
   cursor: pointer;
   color: var(--mantine-color-text);
   height: var(--pagination-control-size);

package/styles/Paper.css

@@ -12,9 +12,9 @@
 }
 
   :where([data-mantine-color-scheme='light']) .m_1b7284a3:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
+      border: 1px solid var(--mantine-color-gray-3);
 }
 
   :where([data-mantine-color-scheme='dark']) .m_1b7284a3:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
+      border: 1px solid var(--mantine-color-dark-4);
 }

package/styles/Paper.layer.css

@@ -12,10 +12,10 @@
 }
 
   :where([data-mantine-color-scheme='light']) .m_1b7284a3:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
+      border: 1px solid var(--mantine-color-gray-3);
 }
 
   :where([data-mantine-color-scheme='dark']) .m_1b7284a3:where([data-with-border]) {
-      border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
+      border: 1px solid var(--mantine-color-dark-4);
 }
 }

package/styles/PasswordInput.css

@@ -1,15 +1,15 @@
 .m_f61ca620 {
-  --psi-button-size-xs: calc(1.375rem * var(--mantine-scale));
-  --psi-button-size-sm: calc(1.625rem * var(--mantine-scale));
-  --psi-button-size-md: calc(1.75rem * var(--mantine-scale));
-  --psi-button-size-lg: calc(2rem * var(--mantine-scale));
-  --psi-button-size-xl: calc(2.5rem * var(--mantine-scale));
-
-  --psi-icon-size-xs: calc(0.75rem * var(--mantine-scale));
-  --psi-icon-size-sm: calc(0.9375rem * var(--mantine-scale));
-  --psi-icon-size-md: calc(1.0625rem * var(--mantine-scale));
-  --psi-icon-size-lg: calc(1.1875rem * var(--mantine-scale));
-  --psi-icon-size-xl: calc(1.3125rem * var(--mantine-scale));
+  --psi-button-size-xs: 22px;
+  --psi-button-size-sm: 26px;
+  --psi-button-size-md: 28px;
+  --psi-button-size-lg: 32px;
+  --psi-button-size-xl: 40px;
+
+  --psi-icon-size-xs: 12px;
+  --psi-icon-size-sm: 15px;
+  --psi-icon-size-md: 17px;
+  --psi-icon-size-lg: 19px;
+  --psi-icon-size-xl: 21px;
 
   --psi-button-size: var(--psi-button-size-sm);
   --psi-icon-size: var(--psi-icon-size-sm);

package/styles/PasswordInput.layer.css

@@ -1,15 +1,15 @@
 @layer mantine {.m_f61ca620 {
-  --psi-button-size-xs: calc(1.375rem * var(--mantine-scale));
-  --psi-button-size-sm: calc(1.625rem * var(--mantine-scale));
-  --psi-button-size-md: calc(1.75rem * var(--mantine-scale));
-  --psi-button-size-lg: calc(2rem * var(--mantine-scale));
-  --psi-button-size-xl: calc(2.5rem * var(--mantine-scale));
-
-  --psi-icon-size-xs: calc(0.75rem * var(--mantine-scale));
-  --psi-icon-size-sm: calc(0.9375rem * var(--mantine-scale));
-  --psi-icon-size-md: calc(1.0625rem * var(--mantine-scale));
-  --psi-icon-size-lg: calc(1.1875rem * var(--mantine-scale));
-  --psi-icon-size-xl: calc(1.3125rem * var(--mantine-scale));
+  --psi-button-size-xs: 22px;
+  --psi-button-size-sm: 26px;
+  --psi-button-size-md: 28px;
+  --psi-button-size-lg: 32px;
+  --psi-button-size-xl: 40px;
+
+  --psi-icon-size-xs: 12px;
+  --psi-icon-size-sm: 15px;
+  --psi-icon-size-md: 17px;
+  --psi-icon-size-lg: 19px;
+  --psi-icon-size-xl: 21px;
 
   --psi-button-size: var(--psi-button-size-sm);
   --psi-icon-size: var(--psi-icon-size-sm);

package/styles/Pill.css

@@ -1,15 +1,15 @@
 .m_7cda1cd6 {
-  --pill-fz-xs: calc(0.625rem * var(--mantine-scale));
-  --pill-fz-sm: calc(0.75rem * var(--mantine-scale));
-  --pill-fz-md: calc(0.875rem * var(--mantine-scale));
-  --pill-fz-lg: calc(1rem * var(--mantine-scale));
-  --pill-fz-xl: calc(1.125rem * var(--mantine-scale));
-
-  --pill-height-xs: calc(1.125rem * var(--mantine-scale));
-  --pill-height-sm: calc(1.375rem * var(--mantine-scale));
-  --pill-height-md: calc(1.5625rem * var(--mantine-scale));
-  --pill-height-lg: calc(1.75rem * var(--mantine-scale));
-  --pill-height-xl: calc(2rem * var(--mantine-scale));
+  --pill-fz-xs: 10px;
+  --pill-fz-sm: 12px;
+  --pill-fz-md: 14px;
+  --pill-fz-lg: 16px;
+  --pill-fz-xl: 18px;
+
+  --pill-height-xs: 18px;
+  --pill-height-sm: 22px;
+  --pill-height-md: 25px;
+  --pill-height-lg: 28px;
+  --pill-height-xl: 32px;
 
   --pill-fz: var(--pill-fz-sm);
   --pill-height: var(--pill-height-sm);
@@ -20,7 +20,7 @@
   padding-inline: 0.8em;
   display: inline-flex;
   align-items: center;
-  border-radius: var(--pill-radius, calc(62.5rem * var(--mantine-scale)));
+  border-radius: var(--pill-radius, 1000rem);
   line-height: 1;
   white-space: nowrap;
   user-select: none;
@@ -101,11 +101,11 @@
   }
 
 .m_1dcfd90b {
-  --pg-gap-xs: calc(0.375rem * var(--mantine-scale));
-  --pg-gap-sm: calc(0.5rem * var(--mantine-scale));
-  --pg-gap-md: calc(0.625rem * var(--mantine-scale));
-  --pg-gap-lg: calc(0.75rem * var(--mantine-scale));
-  --pg-gap-xl: calc(0.75rem * var(--mantine-scale));
+  --pg-gap-xs: 6px;
+  --pg-gap-sm: 8px;
+  --pg-gap-md: 10px;
+  --pg-gap-lg: 12px;
+  --pg-gap-xl: 12px;
   --pg-gap: var(--pg-gap-sm);
 
   display: flex;