@chatbi-v/xcml 1.0.0

package/dist/index.css

@@ -0,0 +1,2579 @@
+.xcml-scope {
+  /* --- 1. 固定布局与形态 Token (Fixed Layout & Shape) --- */
+  /* 保证组件在宿主应用中物理感官（圆角、间距、字体）的一致性 */
+  font-family: "Inter Variable", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  /* Radius Tokens: 欢乐主题 - 更大的圆角 */
+  --radius: 1rem;
+  /* 16px 圆角，更圆润 */
+  --radius-sm: calc(var(--radius) - 6px);
+  --radius-md: calc(var(--radius) - 3px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 8px);
+  /* Spacing Tokens: 增加呼吸感 */
+  --card-padding: 1.5rem;
+  --card-gap: 1.5rem;
+  --section-gap: 2.5rem;
+  --table-cell-padding-sm: 0.5rem 0.75rem;
+  --table-cell-padding-md: 1rem 1.25rem;
+  --table-cell-padding-lg: 1.25rem 2rem;
+  /* Typography Tokens: 稍微增大字号，提升阅读愉悦感 */
+  --font-size-xs: 0.8125rem;
+  --font-size-sm: 0.9375rem;
+  --font-size-base: 1.0625rem;
+  /* 17px */
+  --font-size-lg: 1.25rem;
+  --font-size-xl: 1.5rem;
+  --font-size-2xl: 1.75rem;
+  --font-size-metric: 2.5rem;
+  --font-size-metric-lg: 3.5rem;
+  /* Shadow Tokens: 欢乐主题 - 彩色弥散阴影 */
+  --shadow: 0 2px 8px -2px rgba(0, 0, 0, 0.05);
+  --shadow-hover: 0 12px 24px -6px rgba(124, 58, 237, 0.12), 0 6px 12px -4px rgba(0, 0, 0, 0.05);
+  --shadow-card: 0 6px 16px -4px rgba(0, 0, 0, 0.06), 0 2px 6px -2px rgba(0, 0, 0, 0.02);
+  --shadow-card-hover: 0 12px 24px -6px rgba(124, 58, 237, 0.12), 0 4px 12px -4px rgba(0, 0, 0, 0.05);
+  /* --- 2. 默认颜色 Token (Default Colors - Joyful Theme) --- */
+  /* 背景保持明亮，稍微带一点暖色 */
+  --background: 260 25% 98%;
+  /* Very light purple/gray tint */
+  --foreground: 255 15% 15%;
+  /* Softer black */
+  --card: 0 0% 100%;
+  --card-foreground: 255 15% 15%;
+  --popover: 0 0% 100%;
+  --popover-foreground: 255 15% 15%;
+  /* Primary: Vibrant Violet/Purple */
+  --primary: 262 83% 62%;
+  /* #8b5cf6 Violet-500 equivalent but tweaked */
+  --primary-foreground: 0 0% 100%;
+  --secondary: 250 92% 95%;
+  /* Light Violet tint */
+  --secondary-foreground: 262 83% 62%;
+  --muted: 240 10% 94%;
+  --muted-foreground: 240 10% 45%;
+  --accent: 35 100% 96%;
+  /* Warm Orange/Yellow tint for accent */
+  --accent-foreground: 35 90% 45%;
+  /* Orange text */
+  --destructive: 345 85% 60%;
+  --destructive-foreground: 0 0% 100%;
+  --success: 150 75% 45%;
+  /* Vibrant Green */
+  --success-foreground: 0 0% 100%;
+  --warning: 40 95% 55%;
+  /* Vibrant Orange */
+  --warning-foreground: 0 0% 100%;
+  --info: 195 90% 50%;
+  /* Vibrant Cyan */
+  --info-foreground: 0 0% 100%;
+  --border: 240 15% 90%;
+  --input: 240 15% 92%;
+  --ring: 262 83% 62%;
+  /* Chart Colors - Joyful Palette */
+  --chart-1: 262 83% 62%;
+  /* Violet */
+  --chart-2: 320 80% 65%;
+  /* Pink */
+  --chart-3: 190 85% 50%;
+  /* Cyan */
+  --chart-4: 40 95% 55%;
+  /* Orange */
+  --chart-5: 150 75% 45%;
+  /* Green */
+  /* Sidebar */
+  --sidebar-background: 210 20% 98%;
+  --sidebar-foreground: 224 71% 4%;
+  --sidebar-primary: 161 94% 30%;
+  --sidebar-primary-foreground: 0 0% 100%;
+  --sidebar-accent: 158 64% 95%;
+  --sidebar-accent-foreground: 161 94% 30%;
+  --sidebar-border: 214 32% 91%;
+  --sidebar-ring: 161 94% 30%;
+}
+
+.xcml-scope.dark {
+  /* Base: Zinc-950 */
+  --background: 240 10% 4%;
+  /* Text: Zinc-50 */
+  --foreground: 0 0% 98%;
+  /* Card: Zinc-900 */
+  --card: 240 10% 6%;
+  --card-foreground: 0 0% 98%;
+  --popover: 240 10% 6%;
+  --popover-foreground: 0 0% 98%;
+  --primary: 161 94% 30%;
+  --primary-foreground: 0 0% 100%;
+  --secondary: 240 4% 16%;
+  --secondary-foreground: 0 0% 98%;
+  --muted: 240 4% 16%;
+  --muted-foreground: 240 5% 65%;
+  --accent: 161 94% 30%;
+  --accent-foreground: 0 0% 100%;
+  --destructive: 346 84% 40%;
+  --destructive-foreground: 0 0% 98%;
+  --success: 142 71% 45%;
+  --success-foreground: 144 80% 10%;
+  --warning: 38 92% 50%;
+  --warning-foreground: 38 92% 10%;
+  --info: 199 89% 48%;
+  --info-foreground: 0 0% 100%;
+  --border: 240 4% 16%;
+  --input: 240 4% 16%;
+  --ring: 161 94% 30%;
+  --chart-1: 161 94% 30%;
+  --chart-2: 160 60% 45%;
+  --chart-3: 30 80% 55%;
+  --chart-4: 280 65% 60%;
+  --chart-5: 340 75% 55%;
+  --sidebar-background: 240 10% 6%;
+  --sidebar-foreground: 0 0% 98%;
+  --sidebar-primary: 161 94% 30%;
+  --sidebar-primary-foreground: 0 0% 100%;
+  --sidebar-accent: 240 4% 16%;
+  --sidebar-accent-foreground: 0 0% 98%;
+  --sidebar-border: 240 4% 16%;
+  --sidebar-ring: 161 94% 30%;
+}
+
+/* --- Preset Themes --- */
+
+/* 0. Dark (Deep Dark) */
+
+.xcml-scope [data-theme="dark"],
+  .xcml-scope[data-theme="dark"] {
+  --card: 240 10% 6%;
+  --card-foreground: 0 0% 98%;
+  --border: 240 4% 16%;
+  --muted: 240 4% 16%;
+  --muted-foreground: 240 5% 65%;
+  --accent: 161 94% 30%;
+  --accent-foreground: 0 0% 100%;
+  --background: 240 10% 4%;
+  --foreground: 0 0% 98%;
+}
+
+/* 1. Ocean (Deep Blue) */
+
+.xcml-scope [data-theme="ocean"],
+  .xcml-scope[data-theme="ocean"] {
+  --primary: 221 83% 53%;
+  /* Blue 600 */
+  --accent: 221 83% 95%;
+  --accent-foreground: 221 83% 53%;
+  --ring: 221 83% 53%;
+  --card: 221 83% 98%;
+  /* Very light blue background */
+  --border: 221 83% 90%;
+  --chart-1: 221 83% 53%;
+  --chart-2: 217 91% 60%;
+  --chart-3: 213 94% 68%;
+  --chart-4: 210 96% 78%;
+  --chart-5: 204 94% 87%;
+}
+
+/* 2. Sunset (Orange/Red) */
+
+.xcml-scope [data-theme="sunset"],
+  .xcml-scope[data-theme="sunset"] {
+  --primary: 15 80% 50%;
+  /* Orange 600 */
+  --accent: 15 80% 95%;
+  --accent-foreground: 15 80% 50%;
+  --ring: 15 80% 50%;
+  --card: 15 80% 98%;
+  /* Very light orange background */
+  --border: 15 80% 90%;
+  --chart-1: 15 80% 50%;
+  --chart-2: 25 85% 55%;
+  --chart-3: 35 90% 60%;
+  --chart-4: 45 95% 70%;
+  --chart-5: 55 95% 80%;
+}
+
+/* 3. Lavender (Purple/Indigo) */
+
+.xcml-scope [data-theme="lavender"],
+  .xcml-scope[data-theme="lavender"] {
+  --primary: 262 83% 58%;
+  /* Violet 600 */
+  --accent: 262 83% 95%;
+  --accent-foreground: 262 83% 58%;
+  --ring: 262 83% 58%;
+  --card: 262 83% 98%;
+  /* Very light purple background */
+  --border: 262 83% 90%;
+  --chart-1: 262 83% 58%;
+  --chart-2: 255 91% 65%;
+  --chart-3: 250 95% 75%;
+  --chart-4: 245 95% 85%;
+  --chart-5: 240 95% 92%;
+}
+
+/* 4. Rose (Pink) */
+
+.xcml-scope [data-theme="rose"],
+  .xcml-scope[data-theme="rose"] {
+  --primary: 346 84% 50%;
+  /* Rose 600 */
+  --accent: 346 84% 95%;
+  --accent-foreground: 346 84% 50%;
+  --ring: 346 84% 50%;
+  --card: 346 84% 98%;
+  /* Very light pink background */
+  --border: 346 84% 90%;
+  --chart-1: 346 84% 50%;
+  --chart-2: 340 85% 60%;
+  --chart-3: 330 90% 70%;
+  --chart-4: 320 95% 80%;
+  --chart-5: 310 95% 90%;
+}
+
+/* 5. Amber (Yellow/Gold) */
+
+.xcml-scope [data-theme="amber"],
+  .xcml-scope[data-theme="amber"] {
+  --primary: 38 92% 50%;
+  /* Amber 500 */
+  --accent: 38 92% 95%;
+  --accent-foreground: 38 92% 50%;
+  --ring: 38 92% 50%;
+  --card: 38 92% 98%;
+  /* Very light amber background */
+  --border: 38 92% 90%;
+  --chart-1: 38 92% 50%;
+  --chart-2: 45 95% 55%;
+  --chart-3: 52 95% 65%;
+  --chart-4: 58 95% 75%;
+  --chart-5: 65 95% 85%;
+}
+
+/* 6. Midnight (Deep Indigo/Dark) */
+
+.xcml-scope [data-theme="midnight"],
+  .xcml-scope[data-theme="midnight"] {
+  --primary: 224 71% 45%;
+  /* Blue 600ish */
+  --accent: 224 71% 25%;
+  --accent-foreground: 0 0% 100%;
+  --ring: 224 71% 45%;
+  --card: 224 71% 10%;
+  /* Deep dark blue background */
+  --card-foreground: 0 0% 98%;
+  --border: 224 71% 20%;
+  --chart-1: 224 71% 45%;
+  --chart-2: 220 60% 55%;
+  --chart-3: 215 50% 65%;
+  --chart-4: 210 40% 75%;
+  --chart-5: 205 30% 85%;
+}
+
+/* 7. Forest (Deep Green) */
+
+.xcml-scope [data-theme="forest"],
+  .xcml-scope[data-theme="forest"] {
+  --primary: 142 76% 45%;
+  /* Green 600ish */
+  --accent: 142 76% 25%;
+  --accent-foreground: 0 0% 100%;
+  --ring: 142 76% 45%;
+  --card: 142 76% 10%;
+  /* Deep dark green background */
+  --card-foreground: 0 0% 98%;
+  --border: 142 76% 20%;
+  --chart-1: 142 76% 45%;
+  --chart-2: 145 60% 55%;
+  --chart-3: 150 50% 65%;
+  --chart-4: 155 40% 75%;
+  --chart-5: 160 30% 85%;
+}
+
+/* 8. Slate (Professional Gray) */
+
+.xcml-scope [data-theme="slate"],
+  .xcml-scope[data-theme="slate"] {
+  --primary: 215 25% 27%;
+  /* Slate 800 */
+  --accent: 215 25% 92%;
+  --accent-foreground: 215 25% 27%;
+  --ring: 215 25% 27%;
+  --card: 215 25% 98%;
+  --border: 215 25% 90%;
+  --chart-1: 215 25% 27%;
+  --chart-2: 215 20% 40%;
+  --chart-3: 215 15% 55%;
+  --chart-4: 215 10% 70%;
+  --chart-5: 215 5% 85%;
+}
+
+/* 9. Crimson (Wine Red) */
+
+.xcml-scope [data-theme="crimson"],
+  .xcml-scope[data-theme="crimson"] {
+  --primary: 347 77% 35%;
+  /* Crimson 900ish */
+  --accent: 347 77% 92%;
+  --accent-foreground: 347 77% 35%;
+  --ring: 347 77% 35%;
+  --card: 347 77% 98%;
+  --border: 347 77% 90%;
+  --chart-1: 347 77% 35%;
+  --chart-2: 350 60% 45%;
+  --chart-3: 355 50% 55%;
+  --chart-4: 0 40% 65%;
+  --chart-5: 5 30% 75%;
+}
+
+/* 10. Cyan (Teal/Cyan) */
+
+.xcml-scope [data-theme="cyan"],
+  .xcml-scope[data-theme="cyan"] {
+  --primary: 188 86% 40%;
+  /* Cyan 600 */
+  --accent: 188 86% 95%;
+  --accent-foreground: 188 86% 40%;
+  --ring: 188 86% 40%;
+  --card: 188 86% 98%;
+  --border: 188 86% 90%;
+  --chart-1: 188 86% 40%;
+  --chart-2: 185 75% 50%;
+  --chart-3: 180 65% 60%;
+  --chart-4: 175 55% 70%;
+  --chart-5: 170 45% 80%;
+}
+
+/* 11. Brand (Primary Background) */
+
+.xcml-scope [data-theme="brand"],
+  .xcml-scope[data-theme="brand"] {
+  --card: 161 94% 30%;
+  /* Emerald 600 */
+  --card-foreground: 0 0% 100%;
+  --primary: 0 0% 100%;
+  --primary-foreground: 161 94% 30%;
+  --border: 161 94% 25%;
+  --muted: 161 94% 25%;
+  --muted-foreground: 161 94% 80%;
+  --accent: 161 94% 40%;
+  --accent-foreground: 0 0% 100%;
+}
+
+/* 12. Deep (Very Dark) */
+
+.xcml-scope [data-theme="deep"],
+  .xcml-scope[data-theme="deep"] {
+  --card: 224 71% 4%;
+  /* Slate 950 */
+  --card-foreground: 210 20% 98%;
+  --primary: 161 94% 30%;
+  --border: 224 71% 12%;
+  --muted: 224 71% 12%;
+  --muted-foreground: 215 20% 65%;
+}
+
+.xcml-scope :is( *) {
+  border-color: hsl(var(--border));
+}
+
+.xcml-scope {
+  background-color: hsl(var(--background));
+  color: hsl(var(--foreground));
+}
+
+*, ::before, ::after {
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-gradient-from-position:  ;
+  --tw-gradient-via-position:  ;
+  --tw-gradient-to-position:  ;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(59 130 246 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+}
+
+::backdrop {
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-gradient-from-position:  ;
+  --tw-gradient-via-position:  ;
+  --tw-gradient-to-position:  ;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(59 130 246 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+}
+
+.container {
+  width: 100%;
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: 2rem;
+  padding-left: 2rem;
+}
+
+@media (min-width: 1400px) {
+  .container {
+    max-width: 1400px;
+  }
+}
+
+.prose {
+  color: var(--tw-prose-body);
+  max-width: 65ch;
+}
+
+.prose :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 1.25em;
+  margin-bottom: 1.25em;
+}
+
+.prose :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-lead);
+  font-size: 1.25em;
+  line-height: 1.6;
+  margin-top: 1.2em;
+  margin-bottom: 1.2em;
+}
+
+.prose :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-links);
+  text-decoration: underline;
+  font-weight: 500;
+}
+
+.prose :where(strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-bold);
+  font-weight: 600;
+}
+
+.prose :where(a strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: inherit;
+}
+
+.prose :where(blockquote strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: inherit;
+}
+
+.prose :where(thead th strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: inherit;
+}
+
+.prose :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: decimal;
+  margin-top: 1.25em;
+  margin-bottom: 1.25em;
+  padding-inline-start: 1.625em;
+}
+
+.prose :where(ol[type="A"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: upper-alpha;
+}
+
+.prose :where(ol[type="a"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: lower-alpha;
+}
+
+.prose :where(ol[type="A" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: upper-alpha;
+}
+
+.prose :where(ol[type="a" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: lower-alpha;
+}
+
+.prose :where(ol[type="I"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: upper-roman;
+}
+
+.prose :where(ol[type="i"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: lower-roman;
+}
+
+.prose :where(ol[type="I" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: upper-roman;
+}
+
+.prose :where(ol[type="i" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: lower-roman;
+}
+
+.prose :where(ol[type="1"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: decimal;
+}
+
+.prose :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  list-style-type: disc;
+  margin-top: 1.25em;
+  margin-bottom: 1.25em;
+  padding-inline-start: 1.625em;
+}
+
+.prose :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
+  font-weight: 400;
+  color: var(--tw-prose-counters);
+}
+
+.prose :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
+  color: var(--tw-prose-bullets);
+}
+
+.prose :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-headings);
+  font-weight: 600;
+  margin-top: 1.25em;
+}
+
+.prose :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  border-color: var(--tw-prose-hr);
+  border-top-width: 1px;
+  margin-top: 3em;
+  margin-bottom: 3em;
+}
+
+.prose :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  font-weight: 500;
+  font-style: italic;
+  color: var(--tw-prose-quotes);
+  border-inline-start-width: 0.25rem;
+  border-inline-start-color: var(--tw-prose-quote-borders);
+  quotes: "\201C""\201D""\2018""\2019";
+  margin-top: 1.6em;
+  margin-bottom: 1.6em;
+  padding-inline-start: 1em;
+}
+
+.prose :where(blockquote p:first-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
+  content: open-quote;
+}
+
+.prose :where(blockquote p:last-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
+  content: close-quote;
+}
+
+.prose :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-headings);
+  font-weight: 800;
+  font-size: 2.25em;
+  margin-top: 0;
+  margin-bottom: 0.8888889em;
+  line-height: 1.1111111;
+}
+
+.prose :where(h1 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  font-weight: 900;
+  color: inherit;
+}
+
+.prose :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-headings);
+  font-weight: 700;
+  font-size: 1.5em;
+  margin-top: 2em;
+  margin-bottom: 1em;
+  line-height: 1.3333333;
+}
+
+.prose :where(h2 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  font-weight: 800;
+  color: inherit;
+}
+
+.prose :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-headings);
+  font-weight: 600;
+  font-size: 1.25em;
+  margin-top: 1.6em;
+  margin-bottom: 0.6em;
+  line-height: 1.6;
+}
+
+.prose :where(h3 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  font-weight: 700;
+  color: inherit;
+}
+
+.prose :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-headings);
+  font-weight: 600;
+  margin-top: 1.5em;
+  margin-bottom: 0.5em;
+  line-height: 1.5;
+}
+
+.prose :where(h4 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  font-weight: 700;
+  color: inherit;
+}
+
+.prose :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 2em;
+  margin-bottom: 2em;
+}
+
+.prose :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  display: block;
+  margin-top: 2em;
+  margin-bottom: 2em;
+}
+
+.prose :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 2em;
+  margin-bottom: 2em;
+}
+
+.prose :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  font-weight: 500;
+  font-family: inherit;
+  color: var(--tw-prose-kbd);
+  box-shadow: 0 0 0 1px var(--tw-prose-kbd-shadows), 0 3px 0 var(--tw-prose-kbd-shadows);
+  font-size: 0.875em;
+  border-radius: 0.3125rem;
+  padding-top: 0.1875em;
+  padding-inline-end: 0.375em;
+  padding-bottom: 0.1875em;
+  padding-inline-start: 0.375em;
+}
+
+.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-code);
+  font-weight: 600;
+  font-size: 0.875em;
+}
+
+.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
+  content: "`";
+}
+
+.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
+  content: "`";
+}
+
+.prose :where(a code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: inherit;
+}
+
+.prose :where(h1 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: inherit;
+}
+
+.prose :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: inherit;
+  font-size: 0.875em;
+}
+
+.prose :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: inherit;
+  font-size: 0.9em;
+}
+
+.prose :where(h4 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: inherit;
+}
+
+.prose :where(blockquote code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: inherit;
+}
+
+.prose :where(thead th code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: inherit;
+}
+
+.prose :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-pre-code);
+  background-color: var(--tw-prose-pre-bg);
+  overflow-x: auto;
+  font-weight: 400;
+  font-size: 0.875em;
+  line-height: 1.7142857;
+  margin-top: 1.7142857em;
+  margin-bottom: 1.7142857em;
+  border-radius: 0.375rem;
+  padding-top: 0.8571429em;
+  padding-inline-end: 1.1428571em;
+  padding-bottom: 0.8571429em;
+  padding-inline-start: 1.1428571em;
+}
+
+.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  background-color: transparent;
+  border-width: 0;
+  border-radius: 0;
+  padding: 0;
+  font-weight: inherit;
+  color: inherit;
+  font-size: inherit;
+  font-family: inherit;
+  line-height: inherit;
+}
+
+.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
+  content: none;
+}
+
+.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
+  content: none;
+}
+
+.prose :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  width: 100%;
+  table-layout: auto;
+  margin-top: 2em;
+  margin-bottom: 2em;
+  font-size: 0.875em;
+  line-height: 1.7142857;
+}
+
+.prose :where(thead):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  border-bottom-width: 1px;
+  border-bottom-color: var(--tw-prose-th-borders);
+}
+
+.prose :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-headings);
+  font-weight: 600;
+  vertical-align: bottom;
+  padding-inline-end: 0.5714286em;
+  padding-bottom: 0.5714286em;
+  padding-inline-start: 0.5714286em;
+}
+
+.prose :where(tbody tr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  border-bottom-width: 1px;
+  border-bottom-color: var(--tw-prose-td-borders);
+}
+
+.prose :where(tbody tr:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  border-bottom-width: 0;
+}
+
+.prose :where(tbody td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  vertical-align: baseline;
+}
+
+.prose :where(tfoot):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  border-top-width: 1px;
+  border-top-color: var(--tw-prose-th-borders);
+}
+
+.prose :where(tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  vertical-align: top;
+}
+
+.prose :where(th, td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  text-align: start;
+}
+
+.prose :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.prose :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  color: var(--tw-prose-captions);
+  font-size: 0.875em;
+  line-height: 1.4285714;
+  margin-top: 0.8571429em;
+}
+
+.prose {
+  --tw-prose-body: #374151;
+  --tw-prose-headings: #111827;
+  --tw-prose-lead: #4b5563;
+  --tw-prose-links: #111827;
+  --tw-prose-bold: #111827;
+  --tw-prose-counters: #6b7280;
+  --tw-prose-bullets: #d1d5db;
+  --tw-prose-hr: #e5e7eb;
+  --tw-prose-quotes: #111827;
+  --tw-prose-quote-borders: #e5e7eb;
+  --tw-prose-captions: #6b7280;
+  --tw-prose-kbd: #111827;
+  --tw-prose-kbd-shadows: rgb(17 24 39 / 10%);
+  --tw-prose-code: #111827;
+  --tw-prose-pre-code: #e5e7eb;
+  --tw-prose-pre-bg: #1f2937;
+  --tw-prose-th-borders: #d1d5db;
+  --tw-prose-td-borders: #e5e7eb;
+  --tw-prose-invert-body: #d1d5db;
+  --tw-prose-invert-headings: #fff;
+  --tw-prose-invert-lead: #9ca3af;
+  --tw-prose-invert-links: #fff;
+  --tw-prose-invert-bold: #fff;
+  --tw-prose-invert-counters: #9ca3af;
+  --tw-prose-invert-bullets: #4b5563;
+  --tw-prose-invert-hr: #374151;
+  --tw-prose-invert-quotes: #f3f4f6;
+  --tw-prose-invert-quote-borders: #374151;
+  --tw-prose-invert-captions: #9ca3af;
+  --tw-prose-invert-kbd: #fff;
+  --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);
+  --tw-prose-invert-code: #fff;
+  --tw-prose-invert-pre-code: #d1d5db;
+  --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
+  --tw-prose-invert-th-borders: #4b5563;
+  --tw-prose-invert-td-borders: #374151;
+  font-size: 1rem;
+  line-height: 1.75;
+}
+
+.prose :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.prose :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+
+.prose :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  padding-inline-start: 0.375em;
+}
+
+.prose :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  padding-inline-start: 0.375em;
+}
+
+.prose :where(.prose > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0.75em;
+  margin-bottom: 0.75em;
+}
+
+.prose :where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 1.25em;
+}
+
+.prose :where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-bottom: 1.25em;
+}
+
+.prose :where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 1.25em;
+}
+
+.prose :where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-bottom: 1.25em;
+}
+
+.prose :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0.75em;
+  margin-bottom: 0.75em;
+}
+
+.prose :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 1.25em;
+  margin-bottom: 1.25em;
+}
+
+.prose :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0.5em;
+  padding-inline-start: 1.625em;
+}
+
+.prose :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0;
+}
+
+.prose :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0;
+}
+
+.prose :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0;
+}
+
+.prose :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0;
+}
+
+.prose :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  padding-inline-start: 0;
+}
+
+.prose :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  padding-inline-end: 0;
+}
+
+.prose :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  padding-top: 0.5714286em;
+  padding-inline-end: 0.5714286em;
+  padding-bottom: 0.5714286em;
+  padding-inline-start: 0.5714286em;
+}
+
+.prose :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  padding-inline-start: 0;
+}
+
+.prose :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  padding-inline-end: 0;
+}
+
+.prose :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 2em;
+  margin-bottom: 2em;
+}
+
+.prose :where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-top: 0;
+}
+
+.prose :where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+  margin-bottom: 0;
+}
+
+.xcml-scope :is(.visible) {
+  visibility: visible;
+}
+
+.xcml-scope :is(.static) {
+  position: static;
+}
+
+.xcml-scope :is(.absolute) {
+  position: absolute;
+}
+
+.xcml-scope :is(.relative) {
+  position: relative;
+}
+
+.xcml-scope :is(.-inset-x-4) {
+  left: -1rem;
+  right: -1rem;
+}
+
+.xcml-scope :is(.-top-3) {
+  top: -0.75rem;
+}
+
+.xcml-scope :is(.bottom-0) {
+  bottom: 0px;
+}
+
+.xcml-scope :is(.bottom-4) {
+  bottom: 1rem;
+}
+
+.xcml-scope :is(.left-0) {
+  left: 0px;
+}
+
+.xcml-scope :is(.left-\[15px\]) {
+  left: 15px;
+}
+
+.xcml-scope :is(.right-0) {
+  right: 0px;
+}
+
+.xcml-scope :is(.right-1) {
+  right: 0.25rem;
+}
+
+.xcml-scope :is(.top-0) {
+  top: 0px;
+}
+
+.xcml-scope :is(.top-1) {
+  top: 0.25rem;
+}
+
+.xcml-scope :is(.top-4) {
+  top: 1rem;
+}
+
+.xcml-scope :is(.z-10) {
+  z-index: 10;
+}
+
+.xcml-scope :is(.m-0) {
+  margin: 0px;
+}
+
+.xcml-scope :is(.mx-0) {
+  margin-left: 0px;
+  margin-right: 0px;
+}
+
+.xcml-scope :is(.mx-0\.5) {
+  margin-left: 0.125rem;
+  margin-right: 0.125rem;
+}
+
+.xcml-scope :is(.mx-1) {
+  margin-left: 0.25rem;
+  margin-right: 0.25rem;
+}
+
+.xcml-scope :is(.mx-auto) {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.xcml-scope :is(.my-2) {
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+}
+
+.xcml-scope :is(.my-4) {
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+}
+
+.xcml-scope :is(.mb-1) {
+  margin-bottom: 0.25rem;
+}
+
+.xcml-scope :is(.mb-2) {
+  margin-bottom: 0.5rem;
+}
+
+.xcml-scope :is(.mb-3) {
+  margin-bottom: 0.75rem;
+}
+
+.xcml-scope :is(.mb-4) {
+  margin-bottom: 1rem;
+}
+
+.xcml-scope :is(.mb-6) {
+  margin-bottom: 1.5rem;
+}
+
+.xcml-scope :is(.mb-8) {
+  margin-bottom: 2rem;
+}
+
+.xcml-scope :is(.ml-1) {
+  margin-left: 0.25rem;
+}
+
+.xcml-scope :is(.ml-1\.5) {
+  margin-left: 0.375rem;
+}
+
+.xcml-scope :is(.ml-2) {
+  margin-left: 0.5rem;
+}
+
+.xcml-scope :is(.mr-0) {
+  margin-right: 0px;
+}
+
+.xcml-scope :is(.mr-0\.5) {
+  margin-right: 0.125rem;
+}
+
+.xcml-scope :is(.mr-1) {
+  margin-right: 0.25rem;
+}
+
+.xcml-scope :is(.mr-4) {
+  margin-right: 1rem;
+}
+
+.xcml-scope :is(.mt-0) {
+  margin-top: 0px;
+}
+
+.xcml-scope :is(.mt-0\.5) {
+  margin-top: 0.125rem;
+}
+
+.xcml-scope :is(.mt-1) {
+  margin-top: 0.25rem;
+}
+
+.xcml-scope :is(.mt-2) {
+  margin-top: 0.5rem;
+}
+
+.xcml-scope :is(.mt-auto) {
+  margin-top: auto;
+}
+
+.xcml-scope :is(.mt-card-gap) {
+  margin-top: var(--card-gap);
+}
+
+.xcml-scope :is(.line-clamp-1) {
+  overflow: hidden;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 1;
+}
+
+.xcml-scope :is(.block) {
+  display: block;
+}
+
+.xcml-scope :is(.inline) {
+  display: inline;
+}
+
+.xcml-scope :is(.flex) {
+  display: flex;
+}
+
+.xcml-scope :is(.inline-flex) {
+  display: inline-flex;
+}
+
+.xcml-scope :is(.table) {
+  display: table;
+}
+
+.xcml-scope :is(.table-row) {
+  display: table-row;
+}
+
+.xcml-scope :is(.grid) {
+  display: grid;
+}
+
+.xcml-scope :is(.h-1) {
+  height: 0.25rem;
+}
+
+.xcml-scope :is(.h-1\.5) {
+  height: 0.375rem;
+}
+
+.xcml-scope :is(.h-10) {
+  height: 2.5rem;
+}
+
+.xcml-scope :is(.h-12) {
+  height: 3rem;
+}
+
+.xcml-scope :is(.h-2) {
+  height: 0.5rem;
+}
+
+.xcml-scope :is(.h-4) {
+  height: 1rem;
+}
+
+.xcml-scope :is(.h-6) {
+  height: 1.5rem;
+}
+
+.xcml-scope :is(.h-7) {
+  height: 1.75rem;
+}
+
+.xcml-scope :is(.h-8) {
+  height: 2rem;
+}
+
+.xcml-scope :is(.h-full) {
+  height: 100%;
+}
+
+.xcml-scope :is(.max-h-\[500px\]) {
+  max-height: 500px;
+}
+
+.xcml-scope :is(.min-h-0) {
+  min-height: 0px;
+}
+
+.xcml-scope :is(.min-h-\[6rem\]) {
+  min-height: 6rem;
+}
+
+.xcml-scope :is(.w-0) {
+  width: 0px;
+}
+
+.xcml-scope :is(.w-0\.5) {
+  width: 0.125rem;
+}
+
+.xcml-scope :is(.w-1) {
+  width: 0.25rem;
+}
+
+.xcml-scope :is(.w-1\.5) {
+  width: 0.375rem;
+}
+
+.xcml-scope :is(.w-12) {
+  width: 3rem;
+}
+
+.xcml-scope :is(.w-2) {
+  width: 0.5rem;
+}
+
+.xcml-scope :is(.w-20) {
+  width: 5rem;
+}
+
+.xcml-scope :is(.w-24) {
+  width: 6rem;
+}
+
+.xcml-scope :is(.w-4) {
+  width: 1rem;
+}
+
+.xcml-scope :is(.w-8) {
+  width: 2rem;
+}
+
+.xcml-scope :is(.w-\[375px\]) {
+  width: 375px;
+}
+
+.xcml-scope :is(.w-\[var\(--percent\)\]) {
+  width: var(--percent);
+}
+
+.xcml-scope :is(.w-full) {
+  width: 100%;
+}
+
+.xcml-scope :is(.w-px) {
+  width: 1px;
+}
+
+.xcml-scope :is(.min-w-0) {
+  min-width: 0px;
+}
+
+.xcml-scope :is(.min-w-\[60px\]) {
+  min-width: 60px;
+}
+
+.xcml-scope :is(.max-w-full) {
+  max-width: 100%;
+}
+
+.xcml-scope :is(.max-w-none) {
+  max-width: none;
+}
+
+.xcml-scope :is(.flex-1) {
+  flex: 1 1 0%;
+}
+
+.xcml-scope :is(.shrink-0) {
+  flex-shrink: 0;
+}
+
+.xcml-scope :is(.table-auto) {
+  table-layout: auto;
+}
+
+.xcml-scope :is(.border-collapse) {
+  border-collapse: collapse;
+}
+
+.xcml-scope :is(.scale-x-95) {
+  --tw-scale-x: .95;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.xcml-scope :is(.transform) {
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+@keyframes pulse {
+  50% {
+    opacity: .5;
+  }
+}
+
+.xcml-scope :is(.animate-pulse) {
+  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+}
+
+.xcml-scope :is(.cursor-default) {
+  cursor: default;
+}
+
+.xcml-scope :is(.cursor-help) {
+  cursor: help;
+}
+
+.xcml-scope :is(.cursor-pointer) {
+  cursor: pointer;
+}
+
+.xcml-scope :is(.resize) {
+  resize: both;
+}
+
+.xcml-scope :is(.scroll-mt-20) {
+  scroll-margin-top: 5rem;
+}
+
+.xcml-scope :is(.list-none) {
+  list-style-type: none;
+}
+
+.xcml-scope :is(.grid-cols-1) {
+  grid-template-columns: repeat(1, minmax(0, 1fr));
+}
+
+.xcml-scope :is(.grid-cols-2) {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+
+.xcml-scope :is(.grid-cols-3) {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+
+.xcml-scope :is(.flex-row) {
+  flex-direction: row;
+}
+
+.xcml-scope :is(.flex-col) {
+  flex-direction: column;
+}
+
+.xcml-scope :is(.flex-wrap) {
+  flex-wrap: wrap;
+}
+
+.xcml-scope :is(.items-start) {
+  align-items: flex-start;
+}
+
+.xcml-scope :is(.items-end) {
+  align-items: flex-end;
+}
+
+.xcml-scope :is(.items-center) {
+  align-items: center;
+}
+
+.xcml-scope :is(.items-baseline) {
+  align-items: baseline;
+}
+
+.xcml-scope :is(.justify-end) {
+  justify-content: flex-end;
+}
+
+.xcml-scope :is(.justify-center) {
+  justify-content: center;
+}
+
+.xcml-scope :is(.justify-between) {
+  justify-content: space-between;
+}
+
+.xcml-scope :is(.gap-1) {
+  gap: 0.25rem;
+}
+
+.xcml-scope :is(.gap-1\.5) {
+  gap: 0.375rem;
+}
+
+.xcml-scope :is(.gap-2) {
+  gap: 0.5rem;
+}
+
+.xcml-scope :is(.gap-3) {
+  gap: 0.75rem;
+}
+
+.xcml-scope :is(.gap-card-gap) {
+  gap: var(--card-gap);
+}
+
+.xcml-scope :is(.space-x-1 > :not([hidden]) ~ :not([hidden])) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(0.25rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
+}
+
+.xcml-scope :is(.space-x-2 > :not([hidden]) ~ :not([hidden])) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
+}
+
+.xcml-scope :is(.space-y-2 > :not([hidden]) ~ :not([hidden])) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
+}
+
+.xcml-scope :is(.space-y-4 > :not([hidden]) ~ :not([hidden])) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
+}
+
+.xcml-scope :is(.space-y-6 > :not([hidden]) ~ :not([hidden])) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
+}
+
+.xcml-scope :is(.space-y-card-gap > :not([hidden]) ~ :not([hidden])) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(var(--card-gap) * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(var(--card-gap) * var(--tw-space-y-reverse));
+}
+
+.xcml-scope :is(.divide-y > :not([hidden]) ~ :not([hidden])) {
+  --tw-divide-y-reverse: 0;
+  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
+  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
+}
+
+.xcml-scope :is(.divide-border\/30 > :not([hidden]) ~ :not([hidden])) {
+  border-color: hsl(var(--border) / 0.3);
+}
+
+.xcml-scope :is(.overflow-auto) {
+  overflow: auto;
+}
+
+.xcml-scope :is(.overflow-hidden) {
+  overflow: hidden;
+}
+
+.xcml-scope :is(.overflow-visible) {
+  overflow: visible;
+}
+
+.xcml-scope :is(.overflow-x-auto) {
+  overflow-x: auto;
+}
+
+.xcml-scope :is(.overflow-x-hidden) {
+  overflow-x: hidden;
+}
+
+.xcml-scope :is(.overflow-y-visible) {
+  overflow-y: visible;
+}
+
+.xcml-scope :is(.whitespace-normal) {
+  white-space: normal;
+}
+
+.xcml-scope :is(.whitespace-nowrap) {
+  white-space: nowrap;
+}
+
+.xcml-scope :is(.whitespace-pre-wrap) {
+  white-space: pre-wrap;
+}
+
+.xcml-scope :is(.break-words) {
+  overflow-wrap: break-word;
+}
+
+.xcml-scope :is(.rounded) {
+  border-radius: 0.25rem;
+}
+
+.xcml-scope :is(.rounded-full) {
+  border-radius: 9999px;
+}
+
+.xcml-scope :is(.rounded-lg) {
+  border-radius: var(--radius-lg);
+}
+
+.xcml-scope :is(.rounded-md) {
+  border-radius: var(--radius-md);
+}
+
+.xcml-scope :is(.rounded-xl) {
+  border-radius: var(--radius-xl);
+}
+
+.xcml-scope :is(.rounded-r-md) {
+  border-top-right-radius: var(--radius-md);
+  border-bottom-right-radius: var(--radius-md);
+}
+
+.xcml-scope :is(.border) {
+  border-width: 1px;
+}
+
+.xcml-scope :is(.border-b) {
+  border-bottom-width: 1px;
+}
+
+.xcml-scope :is(.border-l-2) {
+  border-left-width: 2px;
+}
+
+.xcml-scope :is(.border-t) {
+  border-top-width: 1px;
+}
+
+.xcml-scope :is(.border-t-2) {
+  border-top-width: 2px;
+}
+
+.xcml-scope :is(.border-dashed) {
+  border-style: dashed;
+}
+
+.xcml-scope :is(.border-none) {
+  border-style: none;
+}
+
+.xcml-scope :is(.border-amber-200) {
+  --tw-border-opacity: 1;
+  border-color: rgb(253 230 138 / var(--tw-border-opacity));
+}
+
+.xcml-scope :is(.border-border) {
+  border-color: hsl(var(--border));
+}
+
+.xcml-scope :is(.border-border\/10) {
+  border-color: hsl(var(--border) / 0.1);
+}
+
+.xcml-scope :is(.border-border\/30) {
+  border-color: hsl(var(--border) / 0.3);
+}
+
+.xcml-scope :is(.border-border\/40) {
+  border-color: hsl(var(--border) / 0.4);
+}
+
+.xcml-scope :is(.border-border\/50) {
+  border-color: hsl(var(--border) / 0.5);
+}
+
+.xcml-scope :is(.border-border\/60) {
+  border-color: hsl(var(--border) / 0.6);
+}
+
+.xcml-scope :is(.border-border\/80) {
+  border-color: hsl(var(--border) / 0.8);
+}
+
+.xcml-scope :is(.border-destructive\/20) {
+  border-color: hsl(var(--destructive) / 0.2);
+}
+
+.xcml-scope :is(.border-primary\/20) {
+  border-color: hsl(var(--primary) / 0.2);
+}
+
+.xcml-scope :is(.border-primary\/30) {
+  border-color: hsl(var(--primary) / 0.3);
+}
+
+.xcml-scope :is(.bg-amber-50\/50) {
+  background-color: rgb(255 251 235 / 0.5);
+}
+
+.xcml-scope :is(.bg-black\/5) {
+  background-color: rgb(0 0 0 / 0.05);
+}
+
+.xcml-scope :is(.bg-border\/50) {
+  background-color: hsl(var(--border) / 0.5);
+}
+
+.xcml-scope :is(.bg-card) {
+  background-color: hsl(var(--card));
+}
+
+.xcml-scope :is(.bg-card\/50) {
+  background-color: hsl(var(--card) / 0.5);
+}
+
+.xcml-scope :is(.bg-destructive) {
+  background-color: hsl(var(--destructive));
+}
+
+.xcml-scope :is(.bg-destructive\/10) {
+  background-color: hsl(var(--destructive) / 0.1);
+}
+
+.xcml-scope :is(.bg-destructive\/5) {
+  background-color: hsl(var(--destructive) / 0.05);
+}
+
+.xcml-scope :is(.bg-indigo-100) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(224 231 255 / var(--tw-bg-opacity));
+}
+
+.xcml-scope :is(.bg-muted) {
+  background-color: hsl(var(--muted));
+}
+
+.xcml-scope :is(.bg-muted\/10) {
+  background-color: hsl(var(--muted) / 0.1);
+}
+
+.xcml-scope :is(.bg-muted\/20) {
+  background-color: hsl(var(--muted) / 0.2);
+}
+
+.xcml-scope :is(.bg-muted\/30) {
+  background-color: hsl(var(--muted) / 0.3);
+}
+
+.xcml-scope :is(.bg-muted\/40) {
+  background-color: hsl(var(--muted) / 0.4);
+}
+
+.xcml-scope :is(.bg-muted\/50) {
+  background-color: hsl(var(--muted) / 0.5);
+}
+
+.xcml-scope :is(.bg-muted\/60) {
+  background-color: hsl(var(--muted) / 0.6);
+}
+
+.xcml-scope :is(.bg-primary) {
+  background-color: hsl(var(--primary));
+}
+
+.xcml-scope :is(.bg-primary\/10) {
+  background-color: hsl(var(--primary) / 0.1);
+}
+
+.xcml-scope :is(.bg-primary\/15) {
+  background-color: hsl(var(--primary) / 0.15);
+}
+
+.xcml-scope :is(.bg-primary\/20) {
+  background-color: hsl(var(--primary) / 0.2);
+}
+
+.xcml-scope :is(.bg-primary\/5) {
+  background-color: hsl(var(--primary) / 0.05);
+}
+
+.xcml-scope :is(.bg-primary\/60) {
+  background-color: hsl(var(--primary) / 0.6);
+}
+
+.xcml-scope :is(.bg-secondary\/50) {
+  background-color: hsl(var(--secondary) / 0.5);
+}
+
+.xcml-scope :is(.bg-success) {
+  background-color: hsl(var(--success));
+}
+
+.xcml-scope :is(.bg-success\/10) {
+  background-color: hsl(var(--success) / 0.1);
+}
+
+.xcml-scope :is(.bg-success\/5) {
+  background-color: hsl(var(--success) / 0.05);
+}
+
+.xcml-scope :is(.bg-transparent) {
+  background-color: transparent;
+}
+
+.xcml-scope :is(.bg-white) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+}
+
+.xcml-scope :is(.bg-yellow-200) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(254 240 138 / var(--tw-bg-opacity));
+}
+
+.xcml-scope :is(.bg-gradient-to-b) {
+  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
+}
+
+.xcml-scope :is(.bg-gradient-to-br) {
+  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
+}
+
+.xcml-scope :is(.bg-gradient-to-r) {
+  background-image: linear-gradient(to right, var(--tw-gradient-stops));
+}
+
+.xcml-scope :is(.from-foreground) {
+  --tw-gradient-from: hsl(var(--foreground)) var(--tw-gradient-from-position);
+  --tw-gradient-to: hsl(var(--foreground) / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
+
+.xcml-scope :is(.from-primary) {
+  --tw-gradient-from: hsl(var(--primary)) var(--tw-gradient-from-position);
+  --tw-gradient-to: hsl(var(--primary) / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
+
+.xcml-scope :is(.from-primary\/10) {
+  --tw-gradient-from: hsl(var(--primary) / 0.1) var(--tw-gradient-from-position);
+  --tw-gradient-to: hsl(var(--primary) / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
+
+.xcml-scope :is(.via-foreground) {
+  --tw-gradient-to: hsl(var(--foreground) / 0)  var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), hsl(var(--foreground)) var(--tw-gradient-via-position), var(--tw-gradient-to);
+}
+
+.xcml-scope :is(.via-primary\/30) {
+  --tw-gradient-to: hsl(var(--primary) / 0)  var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), hsl(var(--primary) / 0.3) var(--tw-gradient-via-position), var(--tw-gradient-to);
+}
+
+.xcml-scope :is(.via-primary\/60) {
+  --tw-gradient-to: hsl(var(--primary) / 0)  var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), hsl(var(--primary) / 0.6) var(--tw-gradient-via-position), var(--tw-gradient-to);
+}
+
+.xcml-scope :is(.to-foreground\/70) {
+  --tw-gradient-to: hsl(var(--foreground) / 0.7) var(--tw-gradient-to-position);
+}
+
+.xcml-scope :is(.to-primary\/10) {
+  --tw-gradient-to: hsl(var(--primary) / 0.1) var(--tw-gradient-to-position);
+}
+
+.xcml-scope :is(.to-primary\/20) {
+  --tw-gradient-to: hsl(var(--primary) / 0.2) var(--tw-gradient-to-position);
+}
+
+.xcml-scope :is(.bg-clip-text) {
+  -webkit-background-clip: text;
+          background-clip: text;
+}
+
+.xcml-scope :is(.object-cover) {
+  -o-object-fit: cover;
+     object-fit: cover;
+}
+
+.xcml-scope :is(.p-0) {
+  padding: 0px;
+}
+
+.xcml-scope :is(.p-1) {
+  padding: 0.25rem;
+}
+
+.xcml-scope :is(.p-1\.5) {
+  padding: 0.375rem;
+}
+
+.xcml-scope :is(.p-2) {
+  padding: 0.5rem;
+}
+
+.xcml-scope :is(.p-3) {
+  padding: 0.75rem;
+}
+
+.xcml-scope :is(.p-4) {
+  padding: 1rem;
+}
+
+.xcml-scope :is(.p-8) {
+  padding: 2rem;
+}
+
+.xcml-scope :is(.p-card) {
+  padding: var(--card-padding);
+}
+
+.xcml-scope :is(.p-card-half) {
+  padding: calc(var(--card-padding) / 2);
+}
+
+.xcml-scope :is(.p-table-sm) {
+  padding: var(--table-cell-padding-sm);
+}
+
+.xcml-scope :is(.px-1) {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
+
+.xcml-scope :is(.px-1\.5) {
+  padding-left: 0.375rem;
+  padding-right: 0.375rem;
+}
+
+.xcml-scope :is(.px-2) {
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+}
+
+.xcml-scope :is(.px-3) {
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+}
+
+.xcml-scope :is(.px-4) {
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+
+.xcml-scope :is(.px-5) {
+  padding-left: 1.25rem;
+  padding-right: 1.25rem;
+}
+
+.xcml-scope :is(.px-6) {
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+}
+
+.xcml-scope :is(.py-0) {
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+.xcml-scope :is(.py-0\.5) {
+  padding-top: 0.125rem;
+  padding-bottom: 0.125rem;
+}
+
+.xcml-scope :is(.py-1) {
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
+
+.xcml-scope :is(.py-12) {
+  padding-top: 3rem;
+  padding-bottom: 3rem;
+}
+
+.xcml-scope :is(.py-2) {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+}
+
+.xcml-scope :is(.py-2\.5) {
+  padding-top: 0.625rem;
+  padding-bottom: 0.625rem;
+}
+
+.xcml-scope :is(.py-3) {
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem;
+}
+
+.xcml-scope :is(.py-3\.5) {
+  padding-top: 0.875rem;
+  padding-bottom: 0.875rem;
+}
+
+.xcml-scope :is(.py-5) {
+  padding-top: 1.25rem;
+  padding-bottom: 1.25rem;
+}
+
+.xcml-scope :is(.py-8) {
+  padding-top: 2rem;
+  padding-bottom: 2rem;
+}
+
+.xcml-scope :is(.pb-3) {
+  padding-bottom: 0.75rem;
+}
+
+.xcml-scope :is(.pl-2) {
+  padding-left: 0.5rem;
+}
+
+.xcml-scope :is(.pt-2) {
+  padding-top: 0.5rem;
+}
+
+.xcml-scope :is(.pt-3) {
+  padding-top: 0.75rem;
+}
+
+.xcml-scope :is(.pt-8) {
+  padding-top: 2rem;
+}
+
+.xcml-scope :is(.text-center) {
+  text-align: center;
+}
+
+.xcml-scope :is(.text-right) {
+  text-align: right;
+}
+
+.xcml-scope :is(.align-baseline) {
+  vertical-align: baseline;
+}
+
+.xcml-scope :is(.align-middle) {
+  vertical-align: middle;
+}
+
+.xcml-scope :is(.font-mono) {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+}
+
+.xcml-scope :is(.text-2xl) {
+  font-size: var(--font-size-2xl);
+}
+
+.xcml-scope :is(.text-3xl) {
+  font-size: 1.875rem;
+  line-height: 2.25rem;
+}
+
+.xcml-scope :is(.text-\[10px\]) {
+  font-size: 10px;
+}
+
+.xcml-scope :is(.text-\[11px\]) {
+  font-size: 11px;
+}
+
+.xcml-scope :is(.text-\[13\.5px\]) {
+  font-size: 13.5px;
+}
+
+.xcml-scope :is(.text-base) {
+  font-size: var(--font-size-base);
+}
+
+.xcml-scope :is(.text-lg) {
+  font-size: var(--font-size-lg);
+}
+
+.xcml-scope :is(.text-metric) {
+  font-size: var(--font-size-metric);
+}
+
+.xcml-scope :is(.text-metric-lg) {
+  font-size: var(--font-size-metric-lg);
+}
+
+.xcml-scope :is(.text-sm) {
+  font-size: var(--font-size-sm);
+}
+
+.xcml-scope :is(.text-xl) {
+  font-size: var(--font-size-xl);
+}
+
+.xcml-scope :is(.text-xs) {
+  font-size: var(--font-size-xs);
+}
+
+.xcml-scope :is(.font-black) {
+  font-weight: 900;
+}
+
+.xcml-scope :is(.font-bold) {
+  font-weight: 700;
+}
+
+.xcml-scope :is(.font-medium) {
+  font-weight: 500;
+}
+
+.xcml-scope :is(.font-semibold) {
+  font-weight: 600;
+}
+
+.xcml-scope :is(.uppercase) {
+  text-transform: uppercase;
+}
+
+.xcml-scope :is(.italic) {
+  font-style: italic;
+}
+
+.xcml-scope :is(.leading-normal) {
+  line-height: 1.5;
+}
+
+.xcml-scope :is(.leading-relaxed) {
+  line-height: 1.625;
+}
+
+.xcml-scope :is(.leading-snug) {
+  line-height: 1.375;
+}
+
+.xcml-scope :is(.tracking-tight) {
+  letter-spacing: -0.025em;
+}
+
+.xcml-scope :is(.tracking-tighter) {
+  letter-spacing: -0.05em;
+}
+
+.xcml-scope :is(.tracking-wider) {
+  letter-spacing: 0.05em;
+}
+
+.xcml-scope :is(.text-amber-500) {
+  --tw-text-opacity: 1;
+  color: rgb(245 158 11 / var(--tw-text-opacity));
+}
+
+.xcml-scope :is(.text-amber-600) {
+  --tw-text-opacity: 1;
+  color: rgb(217 119 6 / var(--tw-text-opacity));
+}
+
+.xcml-scope :is(.text-card-foreground) {
+  color: hsl(var(--card-foreground));
+}
+
+.xcml-scope :is(.text-destructive) {
+  color: hsl(var(--destructive));
+}
+
+.xcml-scope :is(.text-foreground) {
+  color: hsl(var(--foreground));
+}
+
+.xcml-scope :is(.text-foreground\/80) {
+  color: hsl(var(--foreground) / 0.8);
+}
+
+.xcml-scope :is(.text-foreground\/90) {
+  color: hsl(var(--foreground) / 0.9);
+}
+
+.xcml-scope :is(.text-green-500) {
+  --tw-text-opacity: 1;
+  color: rgb(34 197 94 / var(--tw-text-opacity));
+}
+
+.xcml-scope :is(.text-green-600) {
+  --tw-text-opacity: 1;
+  color: rgb(22 163 74 / var(--tw-text-opacity));
+}
+
+.xcml-scope :is(.text-indigo-500) {
+  --tw-text-opacity: 1;
+  color: rgb(99 102 241 / var(--tw-text-opacity));
+}
+
+.xcml-scope :is(.text-muted-foreground) {
+  color: hsl(var(--muted-foreground));
+}
+
+.xcml-scope :is(.text-muted-foreground\/30) {
+  color: hsl(var(--muted-foreground) / 0.3);
+}
+
+.xcml-scope :is(.text-muted-foreground\/40) {
+  color: hsl(var(--muted-foreground) / 0.4);
+}
+
+.xcml-scope :is(.text-muted-foreground\/50) {
+  color: hsl(var(--muted-foreground) / 0.5);
+}
+
+.xcml-scope :is(.text-muted-foreground\/60) {
+  color: hsl(var(--muted-foreground) / 0.6);
+}
+
+.xcml-scope :is(.text-primary) {
+  color: hsl(var(--primary));
+}
+
+.xcml-scope :is(.text-primary\/90) {
+  color: hsl(var(--primary) / 0.9);
+}
+
+.xcml-scope :is(.text-red-500) {
+  --tw-text-opacity: 1;
+  color: rgb(239 68 68 / var(--tw-text-opacity));
+}
+
+.xcml-scope :is(.text-red-600) {
+  --tw-text-opacity: 1;
+  color: rgb(220 38 38 / var(--tw-text-opacity));
+}
+
+.xcml-scope :is(.text-success) {
+  color: hsl(var(--success));
+}
+
+.xcml-scope :is(.text-transparent) {
+  color: transparent;
+}
+
+.xcml-scope :is(.no-underline) {
+  text-decoration-line: none;
+}
+
+.xcml-scope :is(.opacity-0) {
+  opacity: 0;
+}
+
+.xcml-scope :is(.opacity-100) {
+  opacity: 1;
+}
+
+.xcml-scope :is(.opacity-20) {
+  opacity: 0.2;
+}
+
+.xcml-scope :is(.opacity-40) {
+  opacity: 0.4;
+}
+
+.xcml-scope :is(.opacity-70) {
+  opacity: 0.7;
+}
+
+.xcml-scope :is(.opacity-80) {
+  opacity: 0.8;
+}
+
+.xcml-scope :is(.opacity-90) {
+  opacity: 0.9;
+}
+
+.xcml-scope :is(.shadow-\[0_0_6px_rgba\(var\(--primary\)\2c 0\.2\)\]) {
+  --tw-shadow: 0 0 6px rgba(var(--primary),0.2);
+  --tw-shadow-colored: 0 0 6px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.xcml-scope :is(.shadow-\[0_0_8px_rgba\(var\(--primary-rgb\)\2c 0\.4\)\]) {
+  --tw-shadow: 0 0 8px rgba(var(--primary-rgb),0.4);
+  --tw-shadow-colored: 0 0 8px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.xcml-scope :is(.shadow-card) {
+  --tw-shadow: var(--shadow-card);
+  --tw-shadow-colored: var(--shadow-card);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.xcml-scope :is(.shadow-inner) {
+  --tw-shadow: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
+  --tw-shadow-colored: inset 0 2px 4px 0 var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.xcml-scope :is(.shadow-md) {
+  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.xcml-scope :is(.shadow-sm) {
+  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.xcml-scope :is(.shadow-card) {
+  --tw-shadow-color: hsl(var(--card));
+  --tw-shadow: var(--tw-shadow-colored);
+}
+
+.xcml-scope :is(.shadow-primary\/20) {
+  --tw-shadow-color: hsl(var(--primary) / 0.2);
+  --tw-shadow: var(--tw-shadow-colored);
+}
+
+.xcml-scope :is(.blur) {
+  --tw-blur: blur(8px);
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
+}
+
+.xcml-scope :is(.filter) {
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
+}
+
+.xcml-scope :is(.backdrop-blur-sm) {
+  --tw-backdrop-blur: blur(4px);
+  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+}
+
+.xcml-scope :is(.transition-all) {
+  transition-property: all;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.xcml-scope :is(.transition-colors) {
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.xcml-scope :is(.transition-opacity) {
+  transition-property: opacity;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.xcml-scope :is(.transition-transform) {
+  transition-property: transform;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.xcml-scope :is(.duration-150) {
+  transition-duration: 150ms;
+}
+
+.xcml-scope :is(.duration-300) {
+  transition-duration: 300ms;
+}
+
+.xcml-scope :is(.duration-500) {
+  transition-duration: 500ms;
+}
+
+.xcml-scope :is(.ease-out) {
+  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+}
+
+@keyframes enter {
+  from {
+    opacity: var(--tw-enter-opacity, 1);
+    transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));
+  }
+}
+
+@keyframes exit {
+  to {
+    opacity: var(--tw-exit-opacity, 1);
+    transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));
+  }
+}
+
+.xcml-scope :is(.duration-150) {
+  animation-duration: 150ms;
+}
+
+.xcml-scope :is(.duration-300) {
+  animation-duration: 300ms;
+}
+
+.xcml-scope :is(.duration-500) {
+  animation-duration: 500ms;
+}
+
+.xcml-scope :is(.ease-out) {
+  animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+}
+
+.xcml-scope :is(.running) {
+  animation-play-state: running;
+}
+
+.xcml-scope :is(.last\:mb-0:last-child) {
+  margin-bottom: 0px;
+}
+
+.xcml-scope :is(.hover\:border-primary:hover) {
+  border-color: hsl(var(--primary));
+}
+
+.xcml-scope :is(.hover\:border-primary\/20:hover) {
+  border-color: hsl(var(--primary) / 0.2);
+}
+
+.xcml-scope :is(.hover\:border-primary\/30:hover) {
+  border-color: hsl(var(--primary) / 0.3);
+}
+
+.xcml-scope :is(.hover\:border-primary\/50:hover) {
+  border-color: hsl(var(--primary) / 0.5);
+}
+
+.xcml-scope :is(.hover\:bg-background:hover) {
+  background-color: hsl(var(--background));
+}
+
+.xcml-scope :is(.hover\:bg-card\/80:hover) {
+  background-color: hsl(var(--card) / 0.8);
+}
+
+.xcml-scope :is(.hover\:bg-muted:hover) {
+  background-color: hsl(var(--muted));
+}
+
+.xcml-scope :is(.hover\:bg-muted\/30:hover) {
+  background-color: hsl(var(--muted) / 0.3);
+}
+
+.xcml-scope :is(.hover\:bg-primary\/5:hover) {
+  background-color: hsl(var(--primary) / 0.05);
+}
+
+.xcml-scope :is(.hover\:text-primary:hover) {
+  color: hsl(var(--primary));
+}
+
+.xcml-scope :is(.hover\:underline:hover) {
+  text-decoration-line: underline;
+}
+
+.xcml-scope :is(.hover\:opacity-100:hover) {
+  opacity: 1;
+}
+
+.xcml-scope :is(.hover\:shadow-card:hover) {
+  --tw-shadow: var(--shadow-card);
+  --tw-shadow-colored: var(--shadow-card);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.xcml-scope :is(.hover\:shadow-card-hover:hover) {
+  --tw-shadow: var(--shadow-card-hover);
+  --tw-shadow-colored: var(--shadow-card-hover);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.xcml-scope :is(.hover\:shadow-md:hover) {
+  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.xcml-scope :is(.hover\:shadow-sm:hover) {
+  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.xcml-scope :is(.hover\:shadow-card:hover) {
+  --tw-shadow-color: hsl(var(--card));
+  --tw-shadow: var(--tw-shadow-colored);
+}
+
+.xcml-scope :is(.hover\:shadow-primary\/40:hover) {
+  --tw-shadow-color: hsl(var(--primary) / 0.4);
+  --tw-shadow: var(--tw-shadow-colored);
+}
+
+.xcml-scope :is(.hover\:ease-in-out:hover) {
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.xcml-scope :is(.group:hover .group-hover\:-translate-y-0) {
+  --tw-translate-y: -0px;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.xcml-scope :is(.group:hover .group-hover\:-translate-y-0\.5) {
+  --tw-translate-y: -0.125rem;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.xcml-scope :is(.group:hover .group-hover\:scale-110) {
+  --tw-scale-x: 1.1;
+  --tw-scale-y: 1.1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.xcml-scope :is(.group:hover .group-hover\:scale-x-100) {
+  --tw-scale-x: 1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.xcml-scope :is(.group:hover .group-hover\:bg-primary\/10) {
+  background-color: hsl(var(--primary) / 0.1);
+}
+
+.xcml-scope :is(.group:hover .group-hover\:bg-primary\/20) {
+  background-color: hsl(var(--primary) / 0.2);
+}
+
+.xcml-scope :is(.group:hover .group-hover\:from-primary) {
+  --tw-gradient-from: hsl(var(--primary)) var(--tw-gradient-from-position);
+  --tw-gradient-to: hsl(var(--primary) / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
+
+.xcml-scope :is(.group:hover .group-hover\:to-pink-500) {
+  --tw-gradient-to: #ec4899 var(--tw-gradient-to-position);
+}
+
+.xcml-scope :is(.group:hover .group-hover\:text-primary) {
+  color: hsl(var(--primary));
+}
+
+.xcml-scope :is(.group:hover .group-hover\:opacity-100) {
+  opacity: 1;
+}
+
+.xcml-scope :is(.prose-headings\:text-foreground :is(:where(h1, h2, h3, h4, h5, h6, th):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  color: hsl(var(--foreground));
+}
+
+.xcml-scope :is(.prose-p\:text-foreground :is(:where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  color: hsl(var(--foreground));
+}
+
+.xcml-scope :is(.prose-a\:text-primary :is(:where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  color: hsl(var(--primary));
+}
+
+.xcml-scope :is(.prose-strong\:text-foreground :is(:where(strong):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  color: hsl(var(--foreground));
+}
+
+.xcml-scope :is(.prose-code\:rounded :is(:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  border-radius: 0.25rem;
+}
+
+.xcml-scope :is(.prose-code\:bg-muted\/50 :is(:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  background-color: hsl(var(--muted) / 0.5);
+}
+
+.xcml-scope :is(.prose-code\:px-1 :is(:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
+
+.xcml-scope :is(.prose-code\:py-0 :is(:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+.xcml-scope :is(.prose-code\:py-0\.5 :is(:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  padding-top: 0.125rem;
+  padding-bottom: 0.125rem;
+}
+
+.xcml-scope :is(.prose-code\:text-foreground :is(:where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  color: hsl(var(--foreground));
+}
+
+.xcml-scope :is(.prose-pre\:bg-muted\/50 :is(:where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  background-color: hsl(var(--muted) / 0.5);
+}
+
+.xcml-scope :is(.prose-pre\:text-foreground :is(:where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  color: hsl(var(--foreground));
+}
+
+.xcml-scope :is(.prose-li\:text-foreground :is(:where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  color: hsl(var(--foreground));
+}
+
+.xcml-scope :is(.prose-th\:text-foreground :is(:where(th):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  color: hsl(var(--foreground));
+}
+
+.xcml-scope :is(.prose-td\:text-foreground :is(:where(td):not(:where([class~="not-prose"],[class~="not-prose"] *)))) {
+  color: hsl(var(--foreground));
+}
+
+@media (min-width: 768px) {
+  .xcml-scope :is(.md\:grid-cols-3) {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+
+  .xcml-scope :is(.md\:grid-cols-4) {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+
+  .xcml-scope :is(.md\:grid-cols-5) {
+    grid-template-columns: repeat(5, minmax(0, 1fr));
+  }
+
+  .xcml-scope :is(.md\:grid-cols-6) {
+    grid-template-columns: repeat(6, minmax(0, 1fr));
+  }
+}
+
+.xcml-scope :is(.\[\&_\.ant-table-container\]\:\!w-full .ant-table-container) {
+  width: 100% !important;
+}
+
+.xcml-scope :is(.\[\&_\.ant-table\]\:\!w-full .ant-table) {
+  width: 100% !important;
+}