@kushagradhawan/kookie-ui 0.1.56 → 0.1.57

package/styles.css

@@ -1,12 +1,13 @@
 @import url('https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,100..900;1,100..900&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
 :root{
   --font-inter: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
   --font-jetbrains-mono: 'JetBrains Mono', 'Fira Code', 'Consolas', 'Liberation Mono', 'Courier New', monospace;
-  --font-general-sans: var(--font-inter);
-  --font-inter-mono: var(--font-jetbrains-mono);
+  --font-playfair-display: 'Playfair Display', 'Times New Roman', 'Times', 'Georgia', 'Cambria', serif;
   --font-sans: var(--font-inter);
   --font-mono: var(--font-jetbrains-mono);
+  --font-serif: var(--font-playfair-display);
   font-synthesis: none;
   --gray-contrast: white;
   --mauve-contrast: white;
@@ -66,7 +67,7 @@
 }
 .radix-themes{
   font-synthesis: none;
-  font-family: var(--font-inter);
+  font-family: var(--default-font-family);
   --cursor-button: default;
   --cursor-checkbox: default;
   --cursor-disabled: not-allowed;
@@ -189,9 +190,10 @@
   --letter-spacing-7: -0.0075em;
   --letter-spacing-8: -0.01em;
   --letter-spacing-9: -0.025em;
-  --default-font-family: var(--font-inter, 'Inter'), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
-  --default-font-family-sans: var(--font-inter, 'Inter'), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
+  --default-font-family: var(--font-sans, var(--font-inter, 'Inter')), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
+  --default-font-family-sans: var(--font-sans, var(--font-inter, 'Inter')), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
   --default-font-family-mono: var(--font-mono);
+  --default-font-family-serif: var(--font-serif);
   --default-font-size: var(--font-size-3);
   --default-font-style: normal;
   --default-font-weight: var(--font-weight-regular);
@@ -215,7 +217,7 @@
   --heading-line-height-7: calc(36px * var(--scaling));
   --heading-line-height-8: calc(40px * var(--scaling));
   --heading-line-height-9: calc(60px * var(--scaling));
-  --code-font-family: var(--font-inter-mono, 'JetBrains Mono'), 'Menlo', 'Consolas (Custom)', 'Bitstream Vera Sans Mono', monospace, 'Apple Color Emoji', 'Segoe UI Emoji';
+  --code-font-family: var(--font-mono, var(--font-jetbrains-mono, 'JetBrains Mono')), 'Menlo', 'Consolas (Custom)', 'Bitstream Vera Sans Mono', monospace, 'Apple Color Emoji', 'Segoe UI Emoji';
   --code-font-size-adjust: 0.95;
   --code-font-style: normal;
   --code-font-weight: inherit;
@@ -5002,6 +5004,14 @@
   --heading-font-family: var(--default-font-family-mono);
   --strong-font-family: var(--default-font-family-mono);
 }
+[data-font-family='serif']{
+  --default-font-family: var(--font-serif);
+  --heading-font-family: var(--font-serif);
+  --strong-font-family: var(--font-serif);
+}
+.radix-themes[data-font-family='serif']{
+  font-family: var(--font-serif) !important;
+}
 [data-blur='none']{
   --blur-factor: 0;
 }
@@ -19348,7 +19358,7 @@
 }
 .rt-Separator{
   display: block;
-  background-color: var(--accent-a6);
+  background-color: var(--accent-a5);
 }
 .rt-Separator:where(.rt-r-orientation-horizontal){
   width: var(--separator-size);
@@ -19689,16 +19699,23 @@
   padding-inline-start: var(--space-3);
   padding-top: calc(var(--space-1) * 0.75);
   padding-bottom: calc(var(--space-1) * 0.75);
-  min-height: var(--space-5);
+  min-height: var(--space-6);
   font-size: var(--font-size-1);
 }
 :where(.rt-SidebarContent.rt-r-size-2) :where(.rt-SidebarMenuSubList) .rt-SidebarMenuButton{
   padding-inline-start: var(--space-3);
   padding-top: var(--space-1);
   padding-bottom: var(--space-1);
-  min-height: var(--space-6);
+  min-height: var(--space-7);
   font-size: var(--font-size-2);
 }
+:where(.rt-SidebarContent.rt-r-size-3) :where(.rt-SidebarMenuSubList) .rt-SidebarMenuButton{
+  padding-inline-start: var(--space-3);
+  padding-top: var(--space-2);
+  padding-bottom: var(--space-2);
+  min-height: var(--space-8);
+  font-size: var(--font-size-3);
+}
 .rt-SidebarGroupLabel{
   display: flex;
   align-items: center;
@@ -19737,8 +19754,12 @@
   padding-inline-start: var(--space-2);
 }
 .rt-SidebarContent :where(.rt-BaseMenuItem){
-  margin-top: calc(var(--space-1) / 2);
-  margin-bottom: calc(var(--space-1) / 2);
+  margin-top: 1px;
+  margin-bottom: 1px;
+}
+.rt-SidebarContent :where(.rt-SidebarMenuSubList) .rt-SidebarMenuButton{
+  margin-top: 1px;
+  margin-bottom: 1px;
 }
 :where(.rt-SidebarContainer[data-presentation='thin'] .rt-SidebarContent){
   padding: var(--space-2);
@@ -20112,17 +20133,22 @@
 }
 .rt-SidebarContainer:where(.rt-r-size-1){
   --sidebar-base-padding: var(--space-3);
-  --sidebar-item-height: var(--space-5);
+  --sidebar-item-height: var(--space-6);
 }
 .rt-SidebarContainer:where(.rt-r-size-2){
   --sidebar-base-padding: var(--space-4);
-  --sidebar-item-height: var(--space-6);
+  --sidebar-item-height: var(--space-7);
+}
+.rt-SidebarContainer:where(.rt-r-size-3){
+  --sidebar-base-padding: var(--space-4);
+  --sidebar-item-height: var(--space-8);
 }
 .rt-SidebarContent:where(.rt-r-size-1){
   --sidebar-content-padding: var(--base-menu-content-padding);
   --sidebar-item-padding-left: var(--base-menu-item-padding-left);
   --sidebar-item-padding-right: var(--base-menu-item-padding-right);
   --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+  --base-menu-item-height: var(--space-6);
   --sidebar-item-height: var(--base-menu-item-height);
 }
 .rt-SidebarContent:where(.rt-r-size-2){
@@ -20130,6 +20156,15 @@
   --sidebar-item-padding-left: var(--base-menu-item-padding-left);
   --sidebar-item-padding-right: var(--base-menu-item-padding-right);
   --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+  --base-menu-item-height: var(--space-7);
+  --sidebar-item-height: var(--base-menu-item-height);
+}
+.rt-SidebarContent:where(.rt-r-size-3){
+  --sidebar-content-padding: var(--base-menu-content-padding);
+  --sidebar-item-padding-left: var(--base-menu-item-padding-left);
+  --sidebar-item-padding-right: var(--base-menu-item-padding-right);
+  --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+  --base-menu-item-height: var(--space-8);
   --sidebar-item-height: var(--base-menu-item-height);
 }
 .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarMenuButton){
@@ -20141,8 +20176,8 @@
   font-weight: var(--font-weight-regular);
 }
 .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg){
-  width: var(--content-icon-size-1);
-  height: var(--content-icon-size-1);
+  width: var(--content-icon-size-2);
+  height: var(--content-icon-size-2);
   flex-shrink: 0;
 }
 .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20160,8 +20195,13 @@
   font-weight: var(--font-weight-regular);
 }
 .rt-SidebarContent:where(.rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg){
-  width: var(--content-icon-size-2);
-  height: var(--content-icon-size-2);
+  width: var(--content-icon-size-3);
+  height: var(--content-icon-size-3);
+  flex-shrink: 0;
+}
+.rt-SidebarContent:where(.rt-r-size-2) .rt-SidebarContent:where(.rt-r-size-3) :where(.rt-SidebarMenuButton) :where(svg){
+  width: var(--content-icon-size-3);
+  height: var(--content-icon-size-3);
   flex-shrink: 0;
 }
 .rt-SidebarContent:where(.rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20173,17 +20213,22 @@
 @media (min-width: 520px){
   .rt-SidebarContainer:where(.xs\:rt-r-size-1){
     --sidebar-base-padding: var(--space-3);
-    --sidebar-item-height: var(--space-5);
+    --sidebar-item-height: var(--space-6);
   }
   .rt-SidebarContainer:where(.xs\:rt-r-size-2){
     --sidebar-base-padding: var(--space-4);
-    --sidebar-item-height: var(--space-6);
+    --sidebar-item-height: var(--space-7);
+  }
+  .rt-SidebarContainer:where(.xs\:rt-r-size-3){
+    --sidebar-base-padding: var(--space-4);
+    --sidebar-item-height: var(--space-8);
   }
   .rt-SidebarContent:where(.xs\:rt-r-size-1){
     --sidebar-content-padding: var(--base-menu-content-padding);
     --sidebar-item-padding-left: var(--base-menu-item-padding-left);
     --sidebar-item-padding-right: var(--base-menu-item-padding-right);
     --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-6);
     --sidebar-item-height: var(--base-menu-item-height);
   }
   .rt-SidebarContent:where(.xs\:rt-r-size-2){
@@ -20191,6 +20236,15 @@
     --sidebar-item-padding-left: var(--base-menu-item-padding-left);
     --sidebar-item-padding-right: var(--base-menu-item-padding-right);
     --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-7);
+    --sidebar-item-height: var(--base-menu-item-height);
+  }
+  .rt-SidebarContent:where(.xs\:rt-r-size-3){
+    --sidebar-content-padding: var(--base-menu-content-padding);
+    --sidebar-item-padding-left: var(--base-menu-item-padding-left);
+    --sidebar-item-padding-right: var(--base-menu-item-padding-right);
+    --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-8);
     --sidebar-item-height: var(--base-menu-item-height);
   }
   .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarMenuButton){
@@ -20202,8 +20256,8 @@
     font-weight: var(--font-weight-regular);
   }
   .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg){
-    width: var(--content-icon-size-1);
-    height: var(--content-icon-size-1);
+    width: var(--content-icon-size-2);
+    height: var(--content-icon-size-2);
     flex-shrink: 0;
   }
   .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20221,8 +20275,13 @@
     font-weight: var(--font-weight-regular);
   }
   .rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg){
-    width: var(--content-icon-size-2);
-    height: var(--content-icon-size-2);
+    width: var(--content-icon-size-3);
+    height: var(--content-icon-size-3);
+    flex-shrink: 0;
+  }
+  .rt-SidebarContent:where(.xs\:rt-r-size-2) .rt-SidebarContent:where(.xs\:rt-r-size-3) :where(.rt-SidebarMenuButton) :where(svg){
+    width: var(--content-icon-size-3);
+    height: var(--content-icon-size-3);
     flex-shrink: 0;
   }
   .rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20235,17 +20294,22 @@
 @media (min-width: 768px){
   .rt-SidebarContainer:where(.sm\:rt-r-size-1){
     --sidebar-base-padding: var(--space-3);
-    --sidebar-item-height: var(--space-5);
+    --sidebar-item-height: var(--space-6);
   }
   .rt-SidebarContainer:where(.sm\:rt-r-size-2){
     --sidebar-base-padding: var(--space-4);
-    --sidebar-item-height: var(--space-6);
+    --sidebar-item-height: var(--space-7);
+  }
+  .rt-SidebarContainer:where(.sm\:rt-r-size-3){
+    --sidebar-base-padding: var(--space-4);
+    --sidebar-item-height: var(--space-8);
   }
   .rt-SidebarContent:where(.sm\:rt-r-size-1){
     --sidebar-content-padding: var(--base-menu-content-padding);
     --sidebar-item-padding-left: var(--base-menu-item-padding-left);
     --sidebar-item-padding-right: var(--base-menu-item-padding-right);
     --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-6);
     --sidebar-item-height: var(--base-menu-item-height);
   }
   .rt-SidebarContent:where(.sm\:rt-r-size-2){
@@ -20253,6 +20317,15 @@
     --sidebar-item-padding-left: var(--base-menu-item-padding-left);
     --sidebar-item-padding-right: var(--base-menu-item-padding-right);
     --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-7);
+    --sidebar-item-height: var(--base-menu-item-height);
+  }
+  .rt-SidebarContent:where(.sm\:rt-r-size-3){
+    --sidebar-content-padding: var(--base-menu-content-padding);
+    --sidebar-item-padding-left: var(--base-menu-item-padding-left);
+    --sidebar-item-padding-right: var(--base-menu-item-padding-right);
+    --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-8);
     --sidebar-item-height: var(--base-menu-item-height);
   }
   .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarMenuButton){
@@ -20264,8 +20337,8 @@
     font-weight: var(--font-weight-regular);
   }
   .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg){
-    width: var(--content-icon-size-1);
-    height: var(--content-icon-size-1);
+    width: var(--content-icon-size-2);
+    height: var(--content-icon-size-2);
     flex-shrink: 0;
   }
   .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20283,8 +20356,13 @@
     font-weight: var(--font-weight-regular);
   }
   .rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg){
-    width: var(--content-icon-size-2);
-    height: var(--content-icon-size-2);
+    width: var(--content-icon-size-3);
+    height: var(--content-icon-size-3);
+    flex-shrink: 0;
+  }
+  .rt-SidebarContent:where(.sm\:rt-r-size-2) .rt-SidebarContent:where(.sm\:rt-r-size-3) :where(.rt-SidebarMenuButton) :where(svg){
+    width: var(--content-icon-size-3);
+    height: var(--content-icon-size-3);
     flex-shrink: 0;
   }
   .rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20297,17 +20375,22 @@
 @media (min-width: 1024px){
   .rt-SidebarContainer:where(.md\:rt-r-size-1){
     --sidebar-base-padding: var(--space-3);
-    --sidebar-item-height: var(--space-5);
+    --sidebar-item-height: var(--space-6);
   }
   .rt-SidebarContainer:where(.md\:rt-r-size-2){
     --sidebar-base-padding: var(--space-4);
-    --sidebar-item-height: var(--space-6);
+    --sidebar-item-height: var(--space-7);
+  }
+  .rt-SidebarContainer:where(.md\:rt-r-size-3){
+    --sidebar-base-padding: var(--space-4);
+    --sidebar-item-height: var(--space-8);
   }
   .rt-SidebarContent:where(.md\:rt-r-size-1){
     --sidebar-content-padding: var(--base-menu-content-padding);
     --sidebar-item-padding-left: var(--base-menu-item-padding-left);
     --sidebar-item-padding-right: var(--base-menu-item-padding-right);
     --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-6);
     --sidebar-item-height: var(--base-menu-item-height);
   }
   .rt-SidebarContent:where(.md\:rt-r-size-2){
@@ -20315,6 +20398,15 @@
     --sidebar-item-padding-left: var(--base-menu-item-padding-left);
     --sidebar-item-padding-right: var(--base-menu-item-padding-right);
     --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-7);
+    --sidebar-item-height: var(--base-menu-item-height);
+  }
+  .rt-SidebarContent:where(.md\:rt-r-size-3){
+    --sidebar-content-padding: var(--base-menu-content-padding);
+    --sidebar-item-padding-left: var(--base-menu-item-padding-left);
+    --sidebar-item-padding-right: var(--base-menu-item-padding-right);
+    --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-8);
     --sidebar-item-height: var(--base-menu-item-height);
   }
   .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarMenuButton){
@@ -20326,8 +20418,8 @@
     font-weight: var(--font-weight-regular);
   }
   .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg){
-    width: var(--content-icon-size-1);
-    height: var(--content-icon-size-1);
+    width: var(--content-icon-size-2);
+    height: var(--content-icon-size-2);
     flex-shrink: 0;
   }
   .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20345,8 +20437,13 @@
     font-weight: var(--font-weight-regular);
   }
   .rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg){
-    width: var(--content-icon-size-2);
-    height: var(--content-icon-size-2);
+    width: var(--content-icon-size-3);
+    height: var(--content-icon-size-3);
+    flex-shrink: 0;
+  }
+  .rt-SidebarContent:where(.md\:rt-r-size-2) .rt-SidebarContent:where(.md\:rt-r-size-3) :where(.rt-SidebarMenuButton) :where(svg){
+    width: var(--content-icon-size-3);
+    height: var(--content-icon-size-3);
     flex-shrink: 0;
   }
   .rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20359,17 +20456,22 @@
 @media (min-width: 1280px){
   .rt-SidebarContainer:where(.lg\:rt-r-size-1){
     --sidebar-base-padding: var(--space-3);
-    --sidebar-item-height: var(--space-5);
+    --sidebar-item-height: var(--space-6);
   }
   .rt-SidebarContainer:where(.lg\:rt-r-size-2){
     --sidebar-base-padding: var(--space-4);
-    --sidebar-item-height: var(--space-6);
+    --sidebar-item-height: var(--space-7);
+  }
+  .rt-SidebarContainer:where(.lg\:rt-r-size-3){
+    --sidebar-base-padding: var(--space-4);
+    --sidebar-item-height: var(--space-8);
   }
   .rt-SidebarContent:where(.lg\:rt-r-size-1){
     --sidebar-content-padding: var(--base-menu-content-padding);
     --sidebar-item-padding-left: var(--base-menu-item-padding-left);
     --sidebar-item-padding-right: var(--base-menu-item-padding-right);
     --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-6);
     --sidebar-item-height: var(--base-menu-item-height);
   }
   .rt-SidebarContent:where(.lg\:rt-r-size-2){
@@ -20377,6 +20479,15 @@
     --sidebar-item-padding-left: var(--base-menu-item-padding-left);
     --sidebar-item-padding-right: var(--base-menu-item-padding-right);
     --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-7);
+    --sidebar-item-height: var(--base-menu-item-height);
+  }
+  .rt-SidebarContent:where(.lg\:rt-r-size-3){
+    --sidebar-content-padding: var(--base-menu-content-padding);
+    --sidebar-item-padding-left: var(--base-menu-item-padding-left);
+    --sidebar-item-padding-right: var(--base-menu-item-padding-right);
+    --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-8);
     --sidebar-item-height: var(--base-menu-item-height);
   }
   .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarMenuButton){
@@ -20388,8 +20499,8 @@
     font-weight: var(--font-weight-regular);
   }
   .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg){
-    width: var(--content-icon-size-1);
-    height: var(--content-icon-size-1);
+    width: var(--content-icon-size-2);
+    height: var(--content-icon-size-2);
     flex-shrink: 0;
   }
   .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20407,8 +20518,13 @@
     font-weight: var(--font-weight-regular);
   }
   .rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg){
-    width: var(--content-icon-size-2);
-    height: var(--content-icon-size-2);
+    width: var(--content-icon-size-3);
+    height: var(--content-icon-size-3);
+    flex-shrink: 0;
+  }
+  .rt-SidebarContent:where(.lg\:rt-r-size-2) .rt-SidebarContent:where(.lg\:rt-r-size-3) :where(.rt-SidebarMenuButton) :where(svg){
+    width: var(--content-icon-size-3);
+    height: var(--content-icon-size-3);
     flex-shrink: 0;
   }
   .rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20421,17 +20537,22 @@
 @media (min-width: 1640px){
   .rt-SidebarContainer:where(.xl\:rt-r-size-1){
     --sidebar-base-padding: var(--space-3);
-    --sidebar-item-height: var(--space-5);
+    --sidebar-item-height: var(--space-6);
   }
   .rt-SidebarContainer:where(.xl\:rt-r-size-2){
     --sidebar-base-padding: var(--space-4);
-    --sidebar-item-height: var(--space-6);
+    --sidebar-item-height: var(--space-7);
+  }
+  .rt-SidebarContainer:where(.xl\:rt-r-size-3){
+    --sidebar-base-padding: var(--space-4);
+    --sidebar-item-height: var(--space-8);
   }
   .rt-SidebarContent:where(.xl\:rt-r-size-1){
     --sidebar-content-padding: var(--base-menu-content-padding);
     --sidebar-item-padding-left: var(--base-menu-item-padding-left);
     --sidebar-item-padding-right: var(--base-menu-item-padding-right);
     --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-6);
     --sidebar-item-height: var(--base-menu-item-height);
   }
   .rt-SidebarContent:where(.xl\:rt-r-size-2){
@@ -20439,6 +20560,15 @@
     --sidebar-item-padding-left: var(--base-menu-item-padding-left);
     --sidebar-item-padding-right: var(--base-menu-item-padding-right);
     --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-7);
+    --sidebar-item-height: var(--base-menu-item-height);
+  }
+  .rt-SidebarContent:where(.xl\:rt-r-size-3){
+    --sidebar-content-padding: var(--base-menu-content-padding);
+    --sidebar-item-padding-left: var(--base-menu-item-padding-left);
+    --sidebar-item-padding-right: var(--base-menu-item-padding-right);
+    --sidebar-item-padding-y: var(--base-menu-item-padding-y);
+    --base-menu-item-height: var(--space-8);
     --sidebar-item-height: var(--base-menu-item-height);
   }
   .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarMenuButton){
@@ -20450,8 +20580,8 @@
     font-weight: var(--font-weight-regular);
   }
   .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg){
-    width: var(--content-icon-size-1);
-    height: var(--content-icon-size-1);
+    width: var(--content-icon-size-2);
+    height: var(--content-icon-size-2);
     flex-shrink: 0;
   }
   .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon){
@@ -20469,8 +20599,13 @@
     font-weight: var(--font-weight-regular);
   }
   .rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg){
-    width: var(--content-icon-size-2);
-    height: var(--content-icon-size-2);
+    width: var(--content-icon-size-3);
+    height: var(--content-icon-size-3);
+    flex-shrink: 0;
+  }
+  .rt-SidebarContent:where(.xl\:rt-r-size-2) .rt-SidebarContent:where(.xl\:rt-r-size-3) :where(.rt-SidebarMenuButton) :where(svg){
+    width: var(--content-icon-size-3);
+    height: var(--content-icon-size-3);
     flex-shrink: 0;
   }
   .rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon){

package/tokens/base.css

@@ -1231,9 +1231,10 @@
   --letter-spacing-7: -0.0075em;
   --letter-spacing-8: -0.01em;
   --letter-spacing-9: -0.025em;
-  --default-font-family: var(--font-inter, 'Inter'), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
-  --default-font-family-sans: var(--font-inter, 'Inter'), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
+  --default-font-family: var(--font-sans, var(--font-inter, 'Inter')), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
+  --default-font-family-sans: var(--font-sans, var(--font-inter, 'Inter')), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
   --default-font-family-mono: var(--font-mono);
+  --default-font-family-serif: var(--font-serif);
   --default-font-size: var(--font-size-3);
   --default-font-style: normal;
   --default-font-weight: var(--font-weight-regular);
@@ -1257,7 +1258,7 @@
   --heading-line-height-7: calc(36px * var(--scaling));
   --heading-line-height-8: calc(40px * var(--scaling));
   --heading-line-height-9: calc(60px * var(--scaling));
-  --code-font-family: var(--font-inter-mono, 'JetBrains Mono'), 'Menlo', 'Consolas (Custom)', 'Bitstream Vera Sans Mono', monospace, 'Apple Color Emoji', 'Segoe UI Emoji';
+  --code-font-family: var(--font-mono, var(--font-jetbrains-mono, 'JetBrains Mono')), 'Menlo', 'Consolas (Custom)', 'Bitstream Vera Sans Mono', monospace, 'Apple Color Emoji', 'Segoe UI Emoji';
   --code-font-size-adjust: 0.95;
   --code-font-style: normal;
   --code-font-weight: inherit;
@@ -1570,6 +1571,14 @@
   --heading-font-family: var(--default-font-family-mono);
   --strong-font-family: var(--default-font-family-mono);
 }
+[data-font-family='serif'] {
+  --default-font-family: var(--font-serif);
+  --heading-font-family: var(--font-serif);
+  --strong-font-family: var(--font-serif);
+}
+.radix-themes[data-font-family='serif'] {
+  font-family: var(--font-serif) !important;
+}
 [data-blur='none'] {
   --blur-factor: 0;
 }

package/tokens.css

@@ -4613,9 +4613,10 @@
   --letter-spacing-7: -0.0075em;
   --letter-spacing-8: -0.01em;
   --letter-spacing-9: -0.025em;
-  --default-font-family: var(--font-inter, 'Inter'), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
-  --default-font-family-sans: var(--font-inter, 'Inter'), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
+  --default-font-family: var(--font-sans, var(--font-inter, 'Inter')), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
+  --default-font-family-sans: var(--font-sans, var(--font-inter, 'Inter')), -apple-system, BlinkMacSystemFont, 'Segoe UI (Custom)', Roboto, 'Helvetica Neue', 'Open Sans (Custom)', system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
   --default-font-family-mono: var(--font-mono);
+  --default-font-family-serif: var(--font-serif);
   --default-font-size: var(--font-size-3);
   --default-font-style: normal;
   --default-font-weight: var(--font-weight-regular);
@@ -4639,7 +4640,7 @@
   --heading-line-height-7: calc(36px * var(--scaling));
   --heading-line-height-8: calc(40px * var(--scaling));
   --heading-line-height-9: calc(60px * var(--scaling));
-  --code-font-family: var(--font-inter-mono, 'JetBrains Mono'), 'Menlo', 'Consolas (Custom)', 'Bitstream Vera Sans Mono', monospace, 'Apple Color Emoji', 'Segoe UI Emoji';
+  --code-font-family: var(--font-mono, var(--font-jetbrains-mono, 'JetBrains Mono')), 'Menlo', 'Consolas (Custom)', 'Bitstream Vera Sans Mono', monospace, 'Apple Color Emoji', 'Segoe UI Emoji';
   --code-font-size-adjust: 0.95;
   --code-font-style: normal;
   --code-font-weight: inherit;
@@ -4952,6 +4953,14 @@
   --heading-font-family: var(--default-font-family-mono);
   --strong-font-family: var(--default-font-family-mono);
 }
+[data-font-family='serif'] {
+  --default-font-family: var(--font-serif);
+  --heading-font-family: var(--font-serif);
+  --strong-font-family: var(--font-serif);
+}
+.radix-themes[data-font-family='serif'] {
+  font-family: var(--font-serif) !important;
+}
 [data-blur='none'] {
   --blur-factor: 0;
 }