@lukso/web-components 1.173.0 → 1.173.2

package/dist/styles/fonts-v4.css

@@ -0,0 +1,79 @@
+/* DO NOT MODIFY MANUALLY. This file is auto generated by scripts/generate-styles.js */
+@font-face {
+  font-family: Inter;
+  src: url('/assets/fonts/Inter-Regular.woff2') format('woff2');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: Inter;
+  src: url('/assets/fonts/Inter-ExtraBold.woff2') format('woff2');
+  font-weight: 800;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: Inter;
+  src: url('/assets/fonts/Inter-Bold.woff2') format('woff2');
+  font-weight: bold;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: Inter;
+  src: url('/assets/fonts/Inter-SemiBold.woff2') format('woff2');
+  font-weight: 600;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: Inter;
+  src: url('/assets/fonts/Inter-Medium.woff2') format('woff2');
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: Inter;
+  src: url('/assets/fonts/Inter-Thin.woff2') format('woff2');
+  font-weight: 100;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'PT Mono';
+  src: url('/assets/fonts/PT-Mono-Regular.woff2') format('woff2');
+  font-weight: normal;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'PT Mono';
+  src: url('/assets/fonts/PT-Mono-Bold.woff2') format('woff2');
+  font-weight: bold;
+  font-style: normal;
+}
+
+:root {
+  /* Font families for shadow DOM inheritance */
+  --font-inter: 'Inter', ui-sans-serif, system-ui, sans-serif;
+  --font-mono: 'PT Mono', ui-monospace, monospace;
+
+  /* Font weights for shadow DOM inheritance */
+  --font-weight-100: 100;
+  --font-weight-200: 200;
+  --font-weight-300: 300;
+  --font-weight-400: 400;
+  --font-weight-500: 500;
+  --font-weight-600: 600;
+  --font-weight-700: 700;
+  --font-weight-800: 800;
+  --font-weight-900: 900;
+}

package/dist/styles/main-v4.css

@@ -4,161 +4,12 @@
  * This file contains theme configuration for Tailwind v4 applications.
  * Import this to get the same typography scale and design tokens.
  *
- * For Web Components: This does NOT include component-specific styles.
- * The components have their own encapsulated styles via Shadow DOM.
+ * IMPORTANT: This uses :root CSS variables (--neutral-20) for external usage.
+ * For internal component usage with Tailwind v4 @theme, see generated/main-v4.css.
  */
 
-/**
-  * @file Variables (Tailwind CSS v4)
-  *
-  * This file contains Tailwind v4 theme configuration using @theme directive.
-  */
-@theme {
-  /* Font families */
-  --font-inter: 'Inter', ui-sans-serif, system-ui, sans-serif;
-  --font-mono: 'PT Mono', ui-monospace, monospace;
-  /* Font sizes (text-*) */
-  --text-6: 6px;
-  --text-8: 8px;
-  --text-10: 10px;
-  --text-12: 12px;
-  --text-13: 13px;
-  --text-14: 14px;
-  --text-16: 16px;
-  --text-17: 17px;
-  --text-20: 20px;
-  --text-21: 21px;
-  --text-24: 24px;
-  --text-26: 26px;
-  --text-32: 32px;
-  --text-40: 40px;
-  --text-44: 44px;
-  --text-48: 48px;
-  /* Font weights (font-*) */
-  --font-100: 100;
-  --font-200: 200;
-  --font-300: 300;
-  --font-400: 400;
-  --font-500: 500;
-  --font-600: 600;
-  --font-700: 700;
-  --font-800: 800;
-  --font-900: 900;
-  /* Line heights (leading-*) */
-  --leading-10: 10px;
-  --leading-12: 12px;
-  --leading-14: 14px;
-  --leading-15: 15px;
-  --leading-17: 17px;
-  --leading-19: 19px;
-  --leading-20: 20px;
-  --leading-22: 22px;
-  --leading-24: 24px;
-  --leading-26: 26px;
-  --leading-28: 28px;
-  --leading-31: 31px;
-  --leading-32: 32px;
-  --leading-38: 38px;
-  --leading-40: 40px;
-  --leading-48: 48px;
-  --leading-58: 58px;
-  /* Border radius (rounded-*) */
-  --radius-0: 0;
-  --radius-2: 2px;
-  --radius-4: 4px;
-  --radius-6: 6px;
-  --radius-8: 8px;
-  --radius-10: 10px;
-  --radius-12: 12px;
-  --radius-14: 14px;
-  --radius-16: 16px;
-  --radius-24: 24px;
-  /* Scales */
-  --scale-98: 0.98;
-  /* Heights */
-  --height-78: 78px;
-  /* Spacing */
-  --spacing-17: 4.25rem;
-  --spacing-18: 4.5rem;
-  --spacing-22: 5.5rem;
-  --spacing-30: 7.5rem;
-  /* Box Shadows (shadow-*) */
-  --shadow-neutral-shadow-round:
-    0px 7px 5px 0px rgb(63 93 116 / 0%), 0px 0px 10px 0px rgb(63 93 116 / 2%),
-    0px 3px 10px 0px rgb(63 93 116 / 8%), 0px 4px 4px 0px rgb(63 93 116 / 13%),
-    0px 1px 2px 0px rgb(63 93 116 / 15%), 0px 0px 3px 0px rgb(63 93 116 / 16%);
-  --shadow-neutral-shadow-round-1xl:
-    0px 27px 12px 0px rgb(63 93 116 / 0%), 0px 18px 7px 0px rgb(63 93 116 / 2%),
-    0px 10px 6px 0px rgb(63 93 116 / 8%), 0px 4px 4px 0px rgb(63 93 116 / 13%),
-    0px 1px 2px 0px rgb(63 93 116 / 15%), 0px 0px 14px 0px rgb(63 93 116 / 16%);
-  --shadow-neutral-shadow-round-2xl:
-    0px 85px 24px 0px rgb(63 93 116 / 0%),
-    0px 54px 22px 0px rgb(63 93 116 / 2%),
-    0px 30px 18px 0px rgb(63 93 116 / 8%),
-    0px 14px 14px 0px rgb(63 93 116 / 13%),
-    0px 3px 7px 0px rgb(63 93 116 / 15%), 0px 0px 23px 0px rgb(63 93 116 / 16%);
-  --shadow-neutral-shadow-round-3xl:
-    0px 185px 52px 0px rgb(63 93 116 / 0%),
-    0px 118px 47px 0px rgb(63 93 116 / 2%),
-    0px 67px 40px 0px rgb(63 93 116 / 8%),
-    0px 30px 30px 0px rgb(63 93 116 / 13%),
-    0px 7px 16px 0px rgb(63 93 116 / 15%), 0px 0px 30px 0px rgb(63 93 116 / 16%);
-  /* Animations (animate-*) */
-  --animate-pulse-resize: pulse-resize 1s ease-in-out infinite;
-  --animate-resize-in: resize-in 0.5s ease-in-out;
-  --animate-fade-in: fade-in 0.5s ease-in-out forwards;
-  --animate-bounce2: bounce2 1s ease-in-out infinite alternate;
-  --animate-fade-in-up: fade-in-up 0.5s ease-out forwards;
-  /* Animation Fill Modes (animation-fill-*) */
-  --animation-fill-none: none;
-  --animation-fill-forwards: forwards;
-  --animation-fill-backwards: backwards;
-  --animation-fill-both: both;
-}
-/* Keyframes for animations */
-@keyframes pulse-resize {
-  0%, 100% {
-    transform: scale(1);
-  }
-  50% {
-    transform: scale(0.7);
-  }
-}
-@keyframes resize-in {
-  0% {
-    transform: scale(0.5);
-  }
-  100% {
-    transform: scale(1);
-  }
-}
-@keyframes fade-in {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-@keyframes bounce2 {
-  0% {
-    transform: translateY(-6px);
-  }
-  100% {
-    transform: translateY(10);
-  }
-}
-@keyframes fade-in-up {
-  0% {
-    opacity: 0;
-    transform: translateY(10px);
-  }
-  100% {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-@theme {
+/* DO NOT MODIFY MANUALLY. This file is auto generated by scripts/generate-styles.js */
+:root {
   --neutral-10: #121b21;
   --neutral-15: #1b2832;
   --neutral-20: #243542;
@@ -277,66 +128,87 @@
   --gradient-3-start: #393e56;
   --gradient-3-end: #646ea0;
 }
-/**
-  * @file Fonts (Tailwind CSS v4)
-  *
-  * This file contains all fonts used in designs.
-  * Consumers can override $font-file-path before importing if using Sass.
-  */
+
+/* DO NOT MODIFY MANUALLY. This file is auto generated by scripts/generate-styles.js */
 @font-face {
   font-family: Inter;
-  src: url("/assets/fonts/Inter-Regular.woff2") format("woff2");
+  src: url('/assets/fonts/Inter-Regular.woff2') format('woff2');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
 }
+
 @font-face {
   font-family: Inter;
-  src: url("/assets/fonts/Inter-ExtraBold.woff2") format("woff2");
+  src: url('/assets/fonts/Inter-ExtraBold.woff2') format('woff2');
   font-weight: 800;
   font-style: normal;
   font-display: swap;
 }
+
 @font-face {
   font-family: Inter;
-  src: url("/assets/fonts/Inter-Bold.woff2") format("woff2");
+  src: url('/assets/fonts/Inter-Bold.woff2') format('woff2');
   font-weight: bold;
   font-style: normal;
   font-display: swap;
 }
+
 @font-face {
   font-family: Inter;
-  src: url("/assets/fonts/Inter-SemiBold.woff2") format("woff2");
+  src: url('/assets/fonts/Inter-SemiBold.woff2') format('woff2');
   font-weight: 600;
   font-style: normal;
   font-display: swap;
 }
+
 @font-face {
   font-family: Inter;
-  src: url("/assets/fonts/Inter-Medium.woff2") format("woff2");
+  src: url('/assets/fonts/Inter-Medium.woff2') format('woff2');
   font-weight: 500;
   font-style: normal;
   font-display: swap;
 }
+
 @font-face {
   font-family: Inter;
-  src: url("/assets/fonts/Inter-Thin.woff2") format("woff2");
+  src: url('/assets/fonts/Inter-Thin.woff2') format('woff2');
   font-weight: 100;
   font-style: normal;
   font-display: swap;
 }
+
 @font-face {
-  font-family: "PT Mono";
-  src: url("/assets/fonts/PT-Mono-Regular.woff2") format("woff2");
+  font-family: 'PT Mono';
+  src: url('/assets/fonts/PT-Mono-Regular.woff2') format('woff2');
   font-weight: normal;
   font-style: normal;
 }
+
 @font-face {
-  font-family: "PT Mono";
-  src: url("/assets/fonts/PT-Mono-Bold.woff2") format("woff2");
+  font-family: 'PT Mono';
+  src: url('/assets/fonts/PT-Mono-Bold.woff2') format('woff2');
   font-weight: bold;
   font-style: normal;
 }
 
+:root {
+  /* Font families for shadow DOM inheritance */
+  --font-inter: 'Inter', ui-sans-serif, system-ui, sans-serif;
+  --font-mono: 'PT Mono', ui-monospace, monospace;
+
+  /* Font weights for shadow DOM inheritance */
+  --font-weight-100: 100;
+  --font-weight-200: 200;
+  --font-weight-300: 300;
+  --font-weight-400: 400;
+  --font-weight-500: 500;
+  --font-weight-600: 600;
+  --font-weight-700: 700;
+  --font-weight-800: 800;
+  --font-weight-900: 900;
+}
+
+
 /* Tailwind v4 import - enables all utilities with custom theme */
 @import "tailwindcss";

package/dist/styles/main.css

@@ -3,7 +3,7 @@
   *
   * This file contain general styles that should be applied to host page.
   */
-@theme {
+:root {
   --neutral-10: #121b21;
   --neutral-15: #1b2832;
   --neutral-20: #243542;
@@ -122,6 +122,7 @@
   --gradient-3-start: #393e56;
   --gradient-3-end: #646ea0;
 }
+
 /**
   * @file Fonts
   *

package/dist/styles/prose-overrides-v4.css

@@ -0,0 +1,152 @@
+/**
+ * @file Typography overrides for @tailwindcss/typography in Tailwind v4
+ *
+ * In Tailwind v4, typography plugin customization is done via @utility directives
+ * instead of the theme.extend.typography config object from v3.
+ *
+ * These overrides customize the prose classes to match the project's design system.
+ */
+
+/* Base prose styles - applies to all prose sizes */
+@utility prose {
+  max-width: none;
+  line-height: 1.6;
+
+  p {
+    margin-top: 0.5em;
+    margin-bottom: 0.5em;
+    line-height: 1.5;
+  }
+
+  hr {
+    margin-top: 2em;
+    margin-bottom: 2em;
+  }
+
+  h1 {
+    margin-top: 0.75em;
+    margin-bottom: 0.5em;
+    line-height: 1.2;
+  }
+
+  h2 {
+    margin-top: 0.65em;
+    margin-bottom: 0.45em;
+    line-height: 1.25;
+  }
+
+  h3 {
+    margin-top: 0.6em;
+    margin-bottom: 0.4em;
+    line-height: 1.3;
+  }
+
+  h4 {
+    margin-top: 0.5em;
+    margin-bottom: 0.35em;
+    line-height: 1.35;
+  }
+
+  h5 {
+    margin-top: 0.45em;
+    margin-bottom: 0.3em;
+    line-height: 1.4;
+  }
+
+  h6 {
+    margin-top: 0.4em;
+    margin-bottom: 0.25em;
+    line-height: 1.45;
+  }
+
+  ul {
+    margin-top: 0.5em;
+    margin-bottom: 0.5em;
+    padding-left: 1.25em;
+  }
+
+  ol {
+    margin-top: 0.5em;
+    margin-bottom: 0.5em;
+    padding-left: 1.25em;
+  }
+
+  ul ul,
+  ul ol,
+  ol ul,
+  ol ol {
+    margin-top: 0.25em;
+    margin-bottom: 0.25em;
+  }
+
+  li {
+    margin-top: 0.25em;
+    margin-bottom: 0.25em;
+  }
+
+  blockquote {
+    margin-top: 0.5em;
+    margin-bottom: 0.5em;
+    padding-left: 1em;
+    border-left-width: 0.25rem;
+    font-style: italic;
+    color: inherit;
+  }
+
+  a {
+    color: var(--tw-prose-links);
+    text-decoration: underline;
+    font-weight: 500;
+
+    &:hover {
+      color: var(--tw-prose-links-hover, var(--tw-prose-links));
+      text-decoration: none;
+    }
+  }
+
+  pre {
+    margin-top: 0.5em;
+    margin-bottom: 0.5em;
+    line-height: 1.45;
+    box-sizing: border-box;
+    max-width: 100%;
+    overflow-x: auto;
+    white-space: pre-wrap;
+    overflow-wrap: break-word;
+  }
+}
+
+/* prose-sm variant */
+@utility prose-sm {
+  max-width: none;
+  line-height: 1.6;
+}
+
+/* prose-base variant */
+@utility prose-base {
+  max-width: none;
+  line-height: 1.6;
+}
+
+/* prose-lg variant */
+@utility prose-lg {
+  max-width: none;
+  line-height: 1.6;
+}
+
+/* prose-xl variant */
+@utility prose-xl {
+  max-width: none;
+  line-height: 1.6;
+}
+
+/* prose-inherit - inherits colors from parent */
+@utility prose-inherit {
+  --tw-prose-body: inherit;
+  --tw-prose-headings: inherit;
+  --tw-prose-lead: inherit;
+  --tw-prose-links: inherit;
+  --tw-prose-bold: inherit;
+  --tw-prose-counters: inherit;
+  --tw-prose-bullets: inherit;
+}

package/dist/styles/shadows-v4.css

@@ -0,0 +1,86 @@
+/* DO NOT MODIFY MANUALLY. This file is auto generated by scripts/generate-styles.js */
+/* Box Shadow variables for Tailwind v4 */
+
+/* :root section - for shadow DOM inheritance and external CSS usage */
+:root {
+  --shadow-button-medium-hover-primary: 0px 20px 16px -16px rgba(0, 0, 0, 0.4);
+  --shadow-button-medium-hover-secondary: 0px 20px 16px -16px rgba(0, 0, 0, 0.12);
+  --shadow-button-medium-press-primary: 0px 12px 16px -16px rgba(0, 0, 0, 0.4);
+  --shadow-button-medium-press-secondary: 0px 12px 16px -16px rgba(0, 0, 0, 0.12);
+  --shadow-button-small-hover-primary: 0px 10px 8px -8px rgba(0, 0, 0, 0.4);
+  --shadow-button-small-hover-secondary: 0px 10px 8px -8px rgba(0, 0, 0, 0.12);
+  --shadow-button-small-press-primary: 0px 6px 8px -8px rgba(0, 0, 0, 0.4);
+  --shadow-button-small-press-secondary: 0px 6px 8x -8px rgba(0, 0, 0, 0.12);
+  --shadow-1xl: 0px 0px 16px rgba(189, 206, 219, 0.4);
+  --shadow-2xl: 0px 36px 80px rgba(189, 206, 219, 0.3), 0px 5.01331px 33.4221px rgba(189, 206, 219, 0.0503198), 0px 2.68036px 17.869px rgba(189, 206, 219, 0.0417275), 0px 1.50259px 10.0172px rgba(189, 206, 219, 0.035), 0px 0.798012px 5.32008px rgba(189, 206, 219, 0.0282725), 0px 0.332071px 2.21381px rgba(189, 206, 219, 0.0196802);
+  --shadow-3xl: 0px 12px 80px rgba(189, 206, 219, 0.3), 0px 73.78px 33.4221px rgba(189, 206, 219, 0.0803), 0px 22.3363px 17.869px rgba(189, 206, 219, 0.0417275), 0px 12.5216px 10.0172px rgba(189, 206, 219, 0.035), 0px 6.6501px 5.32008px rgba(189, 206, 219, 0.0282725), 0px 2.76726px 2.21381px rgba(189, 206, 219, 0.0196802);
+  --shadow-neutral-drop-shadow: 0px 9px 4px rgba(63, 93, 116, 0.01), 0px 5px 3px rgba(63, 93, 116, 0.04), 0px 2px 2px rgba(63, 93, 116, 0.07), 0px 1px 1px rgba(63, 93, 116, 0.08), 0px 0px 0px rgba(63, 93, 116, 0.08);
+  --shadow-neutral-drop-shadow-1xl: 0px 18px 7px rgba(63, 93, 116, 0.02), 0px 10px 6px rgba(63, 93, 116, 0.08), 0px 4px 4px rgba(63, 93, 116, 0.13), 0px 1px 2px rgba(63, 93, 116, 0.15), 0px 0px 0px rgba(63, 93, 116, 0.16);
+  --shadow-neutral-drop-shadow-2xl: 0px 54px 22px rgba(63, 93, 116, 0.02), 0px 30px 18px rgba(63, 93, 116, 0.08), 0px 14px 14px rgba(63, 93, 116, 0.13), 0px 3px 7px rgba(63, 93, 116, 0.15), 0px 0px 0px rgba(63, 93, 116, 0.16);
+  --shadow-neutral-drop-shadow-3xl: 0px 118px 47px rgba(63, 93, 116, 0.02), 0px 67px 40px rgba(63, 93, 116, 0.08), 0px 30px 30px rgba(63, 93, 116, 0.13), 0px 7px 16px rgba(63, 93, 116, 0.15), 0px 0px 0px rgba(63, 93, 116, 0.16);
+  --shadow-pink-drop-shadow: 0px 9px 4px rgba(112, 96, 92, 0.01), 0px 5px 3px rgba(112, 96, 92, 0.04), 0px 2px 2px rgba(112, 96, 92, 0.07), 0px 1px 1px rgba(112, 96, 92, 0.08), 0px 0px 0px rgba(112, 96, 92, 0.08);
+  --shadow-pink-drop-shadow-1xl: 0px 17px 7px rgba(112, 96, 92, 0.02), 0px 10px 6px rgba(112, 96, 92, 0.08), 0px 4px 4px rgba(112, 96, 92, 0.13), 0px 1px 2px rgba(112, 96, 92, 0.15), 0px 0px 0px rgba(112, 96, 92, 0.16);
+  --shadow-pink-drop-shadow-2xl: 0px 54px 21px rgba(112, 96, 92, 0.02), 0px 30px 18px rgba(112, 96, 92, 0.08), 0px 13px 13px rgba(112, 96, 92, 0.13), 0px 3px 7px rgba(112, 96, 92, 0.15), 0px 0px 0px rgba(112, 96, 92, 0.16);
+  --shadow-pink-drop-shadow-3xl: 0px 117px 47px rgba(112, 96, 92, 0.02), 0px 66px 40px rgba(112, 96, 92, 0.08), 0px 29px 29px rgba(112, 96, 92, 0.13), 0px 7px 16px rgba(112, 96, 92, 0.15), 0px 0px 0px rgba(112, 96, 92, 0.16);
+  --shadow-neutral-inner-shadow: inset 0px 9px 3px rgba(63, 93, 116, 0.01), inset 0px 5px 3px rgba(63, 93, 116, 0.04), inset 0px 2px 2px rgba(63, 93, 116, 0.07), inset 0px 1px 1px rgba(63, 93, 116, 0.08);
+  --shadow-neutral-inner-shadow-top: inset 0 7px 9px -7px rgb(18 41 74 / 21%);
+  --shadow-neutral-inner-shadow-1xl: inset 0px 19px 8px rgba(63, 93, 116, 0.02), inset 0px 11px 6px rgba(63, 93, 116, 0.08), inset 0px 5px 5px rgba(63, 93, 116, 0.13), inset 0px 1px 3px rgba(63, 93, 116, 0.15);
+  --shadow-neutral-inner-shadow-2xl: inset 0px 60px 24px rgba(63, 93, 116, 0.02), inset 0px 34px 20px rgba(63, 93, 116, 0.08), inset 0px 15px 15px rgba(63, 93, 116, 0.13), inset 0px 4px 8px rgba(63, 93, 116, 0.15);
+  --shadow-neutral-inner-shadow-3xl: inset 0px 130px 52px rgba(63, 93, 116, 0.02), inset 0px 73px 44px rgba(63, 93, 116, 0.08), inset 0px 33px 33px rgba(63, 93, 116, 0.13), inset 0px 8px 18px rgba(63, 93, 116, 0.15);
+  --shadow-neutral-above-shadow: 0px 0px 24px rgba(63, 93, 116, 0.1), 0px 0px 10.4625px rgba(63, 93, 116, 0.0675), 0px 0px 3.9px rgba(63, 93, 116, 0.05), 0px 0px 1.3875px rgba(63, 93, 116, 0.0325);
+  --shadow-neutral-above-shadow-1xl: 0px 0px 32px rgba(63, 93, 116, 0.1), 0px 0px 18.46px rgba(63, 93, 116, 0.0675), 0px 0px 11.9px rgba(63, 93, 116, 0.05), 0px 0px 9.39px rgba(63, 93, 116, 0.0325);
+  --shadow-neutral-above-shadow-2xl: 0px 0px 40px rgba(63, 93, 116, 0.1), 0px 0px 26.46px rgba(63, 93, 116, 0.0675), 0px 0px 19.9px rgba(63, 93, 116, 0.05), 0px 0px 17.39px rgba(63, 93, 116, 0.0325);
+  --shadow-neutral-above-shadow-3xl: 0px 0px 48px rgba(63, 93, 116, 0.1), 0px 0px 34.46px rgba(63, 93, 116, 0.0675), 0px 0px 27.9px rgba(63, 93, 116, 0.05), 0px 0px 25.39px rgba(63, 93, 116, 0.0325);
+  --shadow-pink-above-shadow: 0px 0px 24px rgba(112, 96, 92, 0.1), 0px 0px 10.4625px rgba(112, 96, 92, 0.0675), 0px 0px 3.9px rgba(112, 96, 92, 0.05), 0px 0px 1.3875px rgba(112, 96, 92, 0.0325);
+  --shadow-pink-above-shadow-1xl: 0px 0px 32px rgba(112, 96, 92, 0.1), 0px 0px 18.46px rgba(112, 96, 92, 0.0675), 0px 0px 11.9px rgba(112, 96, 92, 0.05), 0px 0px 9.39px rgba(112, 96, 92, 0.0325);
+  --shadow-pink-above-shadow-2xl: 0px 0px 40px rgba(112, 96, 92, 0.1), 0px 0px 26.46px rgba(112, 96, 92, 0.0675), 0px 0px 19.9px rgba(112, 96, 92, 0.05), 0px 0px 17.39px rgba(112, 96, 92, 0.0325);
+  --shadow-pink-above-shadow-3xl: 0px 0px 48px rgba(112, 96, 92, 0.1), 0px 0px 34.46px rgba(112, 96, 92, 0.0675), 0px 0px 27.9px rgba(112, 96, 92, 0.05), 0px 0px 25.39px rgba(112, 96, 92, 0.0325);
+  --shadow-wizard-step: 1px 1px 8px #FFFFFF, inset 1px 1px 4px rgba(0, 0, 0, 0.16);
+  --shadow-wizard-line: inset 0px 0px 2px rgba(0, 0, 0, 0.14);
+  --shadow-neutral-shadow-round: 0px 7px 5px 0px rgba(63, 93, 116, 0.00), 0px 0px 10px 0px rgba(63, 93, 116, 0.02), 0px 3px 10px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 3px 0px rgba(63, 93, 116, 0.16);
+  --shadow-neutral-shadow-round-1xl: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);
+  --shadow-neutral-shadow-round-2xl: 0px 85px 24px 0px rgba(63, 93, 116, 0.00), 0px 54px 22px 0px rgba(63, 93, 116, 0.02), 0px 30px 18px 0px rgba(63, 93, 116, 0.08), 0px 14px 14px 0px rgba(63, 93, 116, 0.13), 0px 3px 7px 0px rgba(63, 93, 116, 0.15), 0px 0px 23px 0px rgba(63, 93, 116, 0.16);
+  --shadow-neutral-shadow-round-3xl: 0px 185px 52px 0px rgba(63, 93, 116, 0.00), 0px 118px 47px 0px rgba(63, 93, 116, 0.02), 0px 67px 40px 0px rgba(63, 93, 116, 0.08), 0px 30px 30px 0px rgba(63, 93, 116, 0.13), 0px 7px 16px 0px rgba(63, 93, 116, 0.15), 0px 0px 30px 0px rgba(63, 93, 116, 0.16);
+}
+
+/* @theme section - for Tailwind v4 shadow-* utilities */
+@theme {
+  --shadow-button-medium-hover-primary: 0px 20px 16px -16px rgba(0, 0, 0, 0.4);
+  --shadow-button-medium-hover-secondary: 0px 20px 16px -16px rgba(0, 0, 0, 0.12);
+  --shadow-button-medium-press-primary: 0px 12px 16px -16px rgba(0, 0, 0, 0.4);
+  --shadow-button-medium-press-secondary: 0px 12px 16px -16px rgba(0, 0, 0, 0.12);
+  --shadow-button-small-hover-primary: 0px 10px 8px -8px rgba(0, 0, 0, 0.4);
+  --shadow-button-small-hover-secondary: 0px 10px 8px -8px rgba(0, 0, 0, 0.12);
+  --shadow-button-small-press-primary: 0px 6px 8px -8px rgba(0, 0, 0, 0.4);
+  --shadow-button-small-press-secondary: 0px 6px 8x -8px rgba(0, 0, 0, 0.12);
+  --shadow-1xl: 0px 0px 16px rgba(189, 206, 219, 0.4);
+  --shadow-2xl: 0px 36px 80px rgba(189, 206, 219, 0.3), 0px 5.01331px 33.4221px rgba(189, 206, 219, 0.0503198), 0px 2.68036px 17.869px rgba(189, 206, 219, 0.0417275), 0px 1.50259px 10.0172px rgba(189, 206, 219, 0.035), 0px 0.798012px 5.32008px rgba(189, 206, 219, 0.0282725), 0px 0.332071px 2.21381px rgba(189, 206, 219, 0.0196802);
+  --shadow-3xl: 0px 12px 80px rgba(189, 206, 219, 0.3), 0px 73.78px 33.4221px rgba(189, 206, 219, 0.0803), 0px 22.3363px 17.869px rgba(189, 206, 219, 0.0417275), 0px 12.5216px 10.0172px rgba(189, 206, 219, 0.035), 0px 6.6501px 5.32008px rgba(189, 206, 219, 0.0282725), 0px 2.76726px 2.21381px rgba(189, 206, 219, 0.0196802);
+  --shadow-neutral-drop-shadow: 0px 9px 4px rgba(63, 93, 116, 0.01), 0px 5px 3px rgba(63, 93, 116, 0.04), 0px 2px 2px rgba(63, 93, 116, 0.07), 0px 1px 1px rgba(63, 93, 116, 0.08), 0px 0px 0px rgba(63, 93, 116, 0.08);
+  --shadow-neutral-drop-shadow-1xl: 0px 18px 7px rgba(63, 93, 116, 0.02), 0px 10px 6px rgba(63, 93, 116, 0.08), 0px 4px 4px rgba(63, 93, 116, 0.13), 0px 1px 2px rgba(63, 93, 116, 0.15), 0px 0px 0px rgba(63, 93, 116, 0.16);
+  --shadow-neutral-drop-shadow-2xl: 0px 54px 22px rgba(63, 93, 116, 0.02), 0px 30px 18px rgba(63, 93, 116, 0.08), 0px 14px 14px rgba(63, 93, 116, 0.13), 0px 3px 7px rgba(63, 93, 116, 0.15), 0px 0px 0px rgba(63, 93, 116, 0.16);
+  --shadow-neutral-drop-shadow-3xl: 0px 118px 47px rgba(63, 93, 116, 0.02), 0px 67px 40px rgba(63, 93, 116, 0.08), 0px 30px 30px rgba(63, 93, 116, 0.13), 0px 7px 16px rgba(63, 93, 116, 0.15), 0px 0px 0px rgba(63, 93, 116, 0.16);
+  --shadow-pink-drop-shadow: 0px 9px 4px rgba(112, 96, 92, 0.01), 0px 5px 3px rgba(112, 96, 92, 0.04), 0px 2px 2px rgba(112, 96, 92, 0.07), 0px 1px 1px rgba(112, 96, 92, 0.08), 0px 0px 0px rgba(112, 96, 92, 0.08);
+  --shadow-pink-drop-shadow-1xl: 0px 17px 7px rgba(112, 96, 92, 0.02), 0px 10px 6px rgba(112, 96, 92, 0.08), 0px 4px 4px rgba(112, 96, 92, 0.13), 0px 1px 2px rgba(112, 96, 92, 0.15), 0px 0px 0px rgba(112, 96, 92, 0.16);
+  --shadow-pink-drop-shadow-2xl: 0px 54px 21px rgba(112, 96, 92, 0.02), 0px 30px 18px rgba(112, 96, 92, 0.08), 0px 13px 13px rgba(112, 96, 92, 0.13), 0px 3px 7px rgba(112, 96, 92, 0.15), 0px 0px 0px rgba(112, 96, 92, 0.16);
+  --shadow-pink-drop-shadow-3xl: 0px 117px 47px rgba(112, 96, 92, 0.02), 0px 66px 40px rgba(112, 96, 92, 0.08), 0px 29px 29px rgba(112, 96, 92, 0.13), 0px 7px 16px rgba(112, 96, 92, 0.15), 0px 0px 0px rgba(112, 96, 92, 0.16);
+  --shadow-neutral-inner-shadow: inset 0px 9px 3px rgba(63, 93, 116, 0.01), inset 0px 5px 3px rgba(63, 93, 116, 0.04), inset 0px 2px 2px rgba(63, 93, 116, 0.07), inset 0px 1px 1px rgba(63, 93, 116, 0.08);
+  --shadow-neutral-inner-shadow-top: inset 0 7px 9px -7px rgb(18 41 74 / 21%);
+  --shadow-neutral-inner-shadow-1xl: inset 0px 19px 8px rgba(63, 93, 116, 0.02), inset 0px 11px 6px rgba(63, 93, 116, 0.08), inset 0px 5px 5px rgba(63, 93, 116, 0.13), inset 0px 1px 3px rgba(63, 93, 116, 0.15);
+  --shadow-neutral-inner-shadow-2xl: inset 0px 60px 24px rgba(63, 93, 116, 0.02), inset 0px 34px 20px rgba(63, 93, 116, 0.08), inset 0px 15px 15px rgba(63, 93, 116, 0.13), inset 0px 4px 8px rgba(63, 93, 116, 0.15);
+  --shadow-neutral-inner-shadow-3xl: inset 0px 130px 52px rgba(63, 93, 116, 0.02), inset 0px 73px 44px rgba(63, 93, 116, 0.08), inset 0px 33px 33px rgba(63, 93, 116, 0.13), inset 0px 8px 18px rgba(63, 93, 116, 0.15);
+  --shadow-neutral-above-shadow: 0px 0px 24px rgba(63, 93, 116, 0.1), 0px 0px 10.4625px rgba(63, 93, 116, 0.0675), 0px 0px 3.9px rgba(63, 93, 116, 0.05), 0px 0px 1.3875px rgba(63, 93, 116, 0.0325);
+  --shadow-neutral-above-shadow-1xl: 0px 0px 32px rgba(63, 93, 116, 0.1), 0px 0px 18.46px rgba(63, 93, 116, 0.0675), 0px 0px 11.9px rgba(63, 93, 116, 0.05), 0px 0px 9.39px rgba(63, 93, 116, 0.0325);
+  --shadow-neutral-above-shadow-2xl: 0px 0px 40px rgba(63, 93, 116, 0.1), 0px 0px 26.46px rgba(63, 93, 116, 0.0675), 0px 0px 19.9px rgba(63, 93, 116, 0.05), 0px 0px 17.39px rgba(63, 93, 116, 0.0325);
+  --shadow-neutral-above-shadow-3xl: 0px 0px 48px rgba(63, 93, 116, 0.1), 0px 0px 34.46px rgba(63, 93, 116, 0.0675), 0px 0px 27.9px rgba(63, 93, 116, 0.05), 0px 0px 25.39px rgba(63, 93, 116, 0.0325);
+  --shadow-pink-above-shadow: 0px 0px 24px rgba(112, 96, 92, 0.1), 0px 0px 10.4625px rgba(112, 96, 92, 0.0675), 0px 0px 3.9px rgba(112, 96, 92, 0.05), 0px 0px 1.3875px rgba(112, 96, 92, 0.0325);
+  --shadow-pink-above-shadow-1xl: 0px 0px 32px rgba(112, 96, 92, 0.1), 0px 0px 18.46px rgba(112, 96, 92, 0.0675), 0px 0px 11.9px rgba(112, 96, 92, 0.05), 0px 0px 9.39px rgba(112, 96, 92, 0.0325);
+  --shadow-pink-above-shadow-2xl: 0px 0px 40px rgba(112, 96, 92, 0.1), 0px 0px 26.46px rgba(112, 96, 92, 0.0675), 0px 0px 19.9px rgba(112, 96, 92, 0.05), 0px 0px 17.39px rgba(112, 96, 92, 0.0325);
+  --shadow-pink-above-shadow-3xl: 0px 0px 48px rgba(112, 96, 92, 0.1), 0px 0px 34.46px rgba(112, 96, 92, 0.0675), 0px 0px 27.9px rgba(112, 96, 92, 0.05), 0px 0px 25.39px rgba(112, 96, 92, 0.0325);
+  --shadow-wizard-step: 1px 1px 8px #FFFFFF, inset 1px 1px 4px rgba(0, 0, 0, 0.16);
+  --shadow-wizard-line: inset 0px 0px 2px rgba(0, 0, 0, 0.14);
+  --shadow-neutral-shadow-round: 0px 7px 5px 0px rgba(63, 93, 116, 0.00), 0px 0px 10px 0px rgba(63, 93, 116, 0.02), 0px 3px 10px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 3px 0px rgba(63, 93, 116, 0.16);
+  --shadow-neutral-shadow-round-1xl: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);
+  --shadow-neutral-shadow-round-2xl: 0px 85px 24px 0px rgba(63, 93, 116, 0.00), 0px 54px 22px 0px rgba(63, 93, 116, 0.02), 0px 30px 18px 0px rgba(63, 93, 116, 0.08), 0px 14px 14px 0px rgba(63, 93, 116, 0.13), 0px 3px 7px 0px rgba(63, 93, 116, 0.15), 0px 0px 23px 0px rgba(63, 93, 116, 0.16);
+  --shadow-neutral-shadow-round-3xl: 0px 185px 52px 0px rgba(63, 93, 116, 0.00), 0px 118px 47px 0px rgba(63, 93, 116, 0.02), 0px 67px 40px 0px rgba(63, 93, 116, 0.08), 0px 30px 30px 0px rgba(63, 93, 116, 0.13), 0px 7px 16px 0px rgba(63, 93, 116, 0.15), 0px 0px 30px 0px rgba(63, 93, 116, 0.16);
+}